refactor(google-drive): integrate m3 lib

styles/google-drive/catppuccin.user.less

@@ -493,6 +493,61 @@
       color: var(--dt-on-primary-container);
     }
 
+    /* Video player */
+    .I8dAwe {
+      @ae-media-theme: @catppuccin[@mocha];
+      --ae-media-overlay-controls-seeking-slider-active-track-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-seeking-slider-focus-handle-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-seeking-slider-pressed-handle-color: @ae-media-theme[@subtext0];
+      --ae-media-overlay-controls-seeking-slider-handle-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-seeking-slider-inactive-track-color: fade(@ae-media-theme[@text], 60%);
+
+      --ae-media-overlay-controls-iconbutton-selected-icon-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-iconbutton-selected-hover-icon-color: @ae-media-theme[@subtext1];
+      --ae-media-overlay-controls-iconbutton-selected-focus-icon-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-iconbutton-selected-pressed-icon-color: @ae-media-theme[@subtext0];
+      --ae-media-overlay-controls-iconbutton-unselected-icon-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-iconbutton-unselected-hover-icon-color: @ae-media-theme[@subtext1];
+      --ae-media-overlay-controls-iconbutton-unselected-focus-icon-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-iconbutton-unselected-pressed-icon-color: @ae-media-theme[@subtext0];
+
+      --ae-media-overlay-controls-timestamp-color: @ae-media-theme[@text];
+      --ae-media-overlay-controls-container-background: linear-gradient(180deg, transparent 0, fade(@ae-media-theme[@crust], 30%) 100%);
+
+      /* Play button */
+      .QZj8kf {
+        --gm3-icon-button-filled-container-color: fade(@ae-media-theme[@surface0], 30%);
+        --gm3-icon-button-filled-unselected-container-color: @ae-media-theme[@text];
+        --gm3-icon-button-filled-selected-container-color: fade(@ae-media-theme[@surface0], 30%);
+        --gm3-icon-button-filled-toggle-unselected-icon-color: @ae-media-theme[@base];
+        --gm3-icon-button-filled-toggle-selected-icon-color: @ae-media-theme[@text];
+        --gm3-icon-button-filled-toggle-selected-hover-icon-color: @ae-media-theme[@text];
+        --gm3-icon-button-filled-toggle-unselected-hover-icon-color: @ae-media-theme[@base];
+        --gm3-icon-button-filled-toggle-selected-focus-icon-color: @ae-media-theme[@text];
+        --gm3-icon-button-filled-toggle-unselected-focus-icon-color: @ae-media-theme[@base];
+        --gm3-icon-button-filled-toggle-selected-pressed-icon-color: @ae-media-theme[@text];
+        --gm3-icon-button-filled-toggle-unselected-pressed-icon-color: @ae-media-theme[@base];
+      }
+      /* Settings menu */
+      .ws5S4e {
+        --gm3-list-list-item-selected-container-color: fade(@ae-media-theme[@surface1], 30%);
+        --gm3-menu-container-color: fade(@ae-media-theme[@surface1], 30%);
+      }
+      /* Timestamp container */
+      .grhbAe {
+        background-color: fade(@ae-media-theme[@base], 30%);
+      }
+      /* Options container */
+      .Z3tdfe::before {
+        background-color: fade(@ae-media-theme[@base], 30%);
+      }
+      /* Slider value indicator */
+      .E6snnb, .dJ5x8c {
+        --gm3-slider-value-indicator-label-label-text-color: @text;
+        --gm3-slider-value-indicator-container-color: fade(@ae-media-theme[@surface0], 60%);
+      }
+    }
+
     /* File preview (in Drive) scrim */
     .vhoiae[role="dialog"] {
       background: fade(@base, 96%);