diff --git a/README.md b/README.md
index 96d0295..5baa83b 100644
--- a/README.md
+++ b/README.md
@@ -123,7 +123,7 @@ And many other useful utilities. The full list can be found in the system config
5. Enable `flake` support (more [here](https://nixos.wiki/wiki/Flakes#Enable_flakes_temporarily)) on your current system. Don't forget to run `sudo nixos-rebuild switch` after enabling `flake` in your `/etc/configuration.nix`.
6. Copy or move all files (with replacements) from the `home` directory to your `$HOME` directory in Linux.
7. Copy or move all files (with replacements and **sudo** permissions) from the `nixos` directory to `/etc/nixos/`. 🚨 Ensure that `system.stateVersion = "your_version";` is correctly set to the release version of the initial installation of your system in the `configuration.nix` file. 🚨 Also, for security reasons, ensure all files in the `/etc/nixos` directory are owned by **root**. If not, change ownership using the command: `sudo chown -R root:root /etc/nixos`.
-8. Run the command `sudo nixos-rebuild switch --flake /etc/nixos#your-hostname` or `nswitchu`. If you chose first command, replace `your-hostname` with your hostname before running the command; by default, hostname is set to `isitreal-laptop`.
+8. Run the command `sudo nixos-rebuild switch --flake /etc/nixos#your-hostname --update-input nixpkgs --update-input rust-overlay --commit-lock-file --upgrade` or `nswitchu`. If you chose first command, replace `your-hostname` with your hostname before running the command; by default, hostname is set to `isitreal-laptop`.
9. Post-installation configuration:
- Import GNOME settings along with the theme by executing the following command: `dconf load / < home/.config/gnome_settings_backup.dconf`. Additionally, you can use tools like **gnome-tweaks** or **themechanger** to fine-tune specific theme preferences to your liking.
@@ -141,7 +141,7 @@ And many other useful utilities. The full list can be found in the system config
- Launch Cool-Retro-Term.
- Right-click on the window and select "Settings".
- In the General panel, click "Import" and select the file `home/.config/cool-retro-term-style.json`.
- - Select the imported profile named "new-catppuccin-theme".
+ - Select the imported profile named "catppuccin-theme".
- Click "Load" and exit from "Settings".
- Login to your accounts.
diff --git a/home/.config/cool-retro-term-style.json b/home/.config/cool-retro-term-style.json
index a8c0944..2413a58 100644
--- a/home/.config/cool-retro-term-style.json
+++ b/home/.config/cool-retro-term-style.json
@@ -22,6 +22,6 @@
"margin": 0.1028,
"blinkingCursor": true,
"frameMargin": 0,
- "name": "new-catppuccin-theme",
- "version": 2
+ "version": 2,
+ "name": "catppuccin-theme"
}
\ No newline at end of file
diff --git a/home/.config/gnome_settings_backup.dconf b/home/.config/gnome_settings_backup.dconf
index 2375da2..26db090 100644
--- a/home/.config/gnome_settings_backup.dconf
+++ b/home/.config/gnome_settings_backup.dconf
@@ -1,6 +1,39 @@
[org/blueman/plugins/powermanager]
auto-power-on=@mb false
+[org/gnome/Extensions]
+window-maximized=true
+
+[org/gnome/Geary]
+migrated-config=true
+
+[org/gnome/calendar]
+active-view='month'
+window-maximized=true
+
+[org/gnome/desktop/app-folders]
+folder-children=['Utilities', 'YaST', 'Pardus']
+
+[org/gnome/desktop/app-folders/folders/Pardus]
+categories=['X-Pardus-Apps']
+name='X-Pardus-Apps.directory'
+translate=true
+
+[org/gnome/desktop/app-folders/folders/Utilities]
+apps=['gnome-abrt.desktop', 'gnome-system-log.desktop', 'nm-connection-editor.desktop', 'org.gnome.baobab.desktop', 'org.gnome.Connections.desktop', 'org.gnome.DejaDup.desktop', 'org.gnome.Dictionary.desktop', 'org.gnome.DiskUtility.desktop', 'org.gnome.Evince.desktop', 'org.gnome.FileRoller.desktop', 'org.gnome.fonts.desktop', 'org.gnome.Loupe.desktop', 'org.gnome.seahorse.Application.desktop', 'org.gnome.tweaks.desktop', 'org.gnome.Usage.desktop', 'vinagre.desktop']
+categories=['X-GNOME-Utilities']
+name='X-GNOME-Utilities.directory'
+translate=true
+
+[org/gnome/desktop/app-folders/folders/YaST]
+categories=['X-SuSE-YaST']
+name='suse-yast.directory'
+translate=true
+
+[org/gnome/desktop/input-sources]
+sources=[('xkb', 'us'), ('xkb', 'ua'), ('xkb', 'ru')]
+xkb-options=['grp:alt_shift_toggle']
+
[org/gnome/desktop/interface]
color-scheme='prefer-dark'
cursor-theme='Catppuccin-Macchiato-Teal-Cursors'
@@ -20,6 +53,25 @@ two-finger-scrolling-enabled=true
focus-mode='sloppy'
titlebar-font='JetBrains Mono Bold 11'
+[org/gnome/evolution-data-server]
+migrated=true
+
+[org/gnome/nautilus/preferences]
+migrated-gtk-settings=true
+
+[org/gnome/shell]
+enabled-extensions=['true', 'user-theme@gnome-shell-extensions.gcampax.github.com']
+welcome-dialog-last-shown-version='46.2'
+
+[org/gnome/shell/extensions/user-theme]
+name='catppuccin-macchiato-teal-standard+default'
+
+[org/gnome/shell/world-clocks]
+locations=@av []
+
+[org/gnome/tweaks]
+show-extensions-notice=false
+
[org/gtk/gtk4/settings/file-chooser]
show-hidden=true
@@ -33,3 +85,4 @@ sort-column='name'
sort-directories-first=false
sort-order='ascending'
type-format='category'
+window-position=(0, 0)
diff --git a/home/.config/hypr/hyprland.conf b/home/.config/hypr/hyprland.conf
index e1d6543..f353141 100644
--- a/home/.config/hypr/hyprland.conf
+++ b/home/.config/hypr/hyprland.conf
@@ -106,7 +106,7 @@ dwindle {
master {
# See https://wiki.hyprland.org/Configuring/Master-Layout/ for more
- new_is_master = true
+ new_status = master
}
gestures {
diff --git a/home/.config/stylus-catppuccin.json b/home/.config/stylus-catppuccin.json
index a31c4e4..cf3f0c3 100644
--- a/home/.config/stylus-catppuccin.json
+++ b/home/.config/stylus-catppuccin.json
@@ -467,12 +467,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name ChatGPT Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/chatgpt\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt\n@version 0.2.11\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt\n@description Soothing pastel theme for ChatGPT\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain(\"chatgpt.com\") {\n @import url(\"https://unpkg.com/@catppuccin/highlightjs@0.1.2/css/catppuccin.variables.css\");\n\n :root.light {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n :root.dark {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --ctp-rosewater: #rgbify(@rosewater) [];\n --ctp-flamingo: #rgbify(@flamingo) [];\n --ctp-pink: #rgbify(@pink) [];\n --ctp-mauve: #rgbify(@mauve) [];\n --ctp-red: #rgbify(@red) [];\n --ctp-maroon: #rgbify(@maroon) [];\n --ctp-peach: #rgbify(@peach) [];\n --ctp-yellow: #rgbify(@yellow) [];\n --ctp-green: #rgbify(@green) [];\n --ctp-teal: #rgbify(@teal) [];\n --ctp-sky: #rgbify(@sky) [];\n --ctp-sapphire: #rgbify(@sapphire) [];\n --ctp-blue: #rgbify(@blue) [];\n --ctp-lavender: #rgbify(@lavender) [];\n --ctp-text: #rgbify(@text) [];\n --ctp-subtext1: #rgbify(@subtext1) [];\n --ctp-subtext0: #rgbify(@subtext0) [];\n --ctp-overlay2: #rgbify(@overlay2) [];\n --ctp-overlay1: #rgbify(@overlay1) [];\n --ctp-overlay0: #rgbify(@overlay0) [];\n --ctp-surface2: #rgbify(@surface2) [];\n --ctp-surface1: #rgbify(@surface1) [];\n --ctp-surface0: #rgbify(@surface0) [];\n --ctp-base: #rgbify(@base) [];\n --ctp-mantle: #rgbify(@mantle) [];\n --ctp-crust: #rgbify(@crust) [];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n code.hljs {\n background: none;\n }\n pre {\n .bg-token-main-surface-secondary {\n background-color: @surface0;\n }\n .bg-gray-950 {\n background-color: @crust;\n }\n .text-token-text-secondary {\n color: @subtext0;\n }\n }\n\n color: @text;\n\n @white: lighten(if(@lookup=latte, @base, @text), 5%);\n @black: darken(if(@lookup=latte, @text, @base), 5%);\n --white: @white;\n --black: @black;\n\n & when not (@lookup = latte) {\n --gray-50: lighten(mix(@text, @subtext0), 5%);\n --gray-100: @text;\n --gray-200: @subtext1;\n --gray-300: @overlay2;\n --gray-400: @overlay0;\n --gray-500: @surface2;\n --gray-600: @surface1;\n --gray-700: @surface0;\n --gray-800: @base;\n --gray-900: @mantle;\n --gray-950: @crust;\n --brand-purple: @accent-color;\n --text-primary: var(--gray-100);\n --text-secondary: var(--gray-300);\n --text-tertiary: var(--gray-400);\n --text-quaternary: var(--gray-700);\n --main-surface-primary: var(--gray-800);\n --main-surface-secondary: var(--gray-700);\n --main-surface-tertiary: var(--gray-600);\n --sidebar-surface-primary: var(--gray-900);\n --sidebar-surface-secondary: var(--gray-800);\n --sidebar-surface-tertiary: var(--gray-700);\n .popover,\n .dark .popover,\n .dark.popover,\n .popover .dark {\n --main-surface-primary: var(--gray-700) !important;\n --main-surface-secondary: var(--gray-600) !important;\n --main-surface-tertiary: var(--gray-500) !important;\n --text-primary: var(--white) !important;\n --text-secondary: var(--gray-200) !important;\n --text-tertiary: var(--gray-300) !important;\n }\n }\n & when (@lookup = latte) {\n --gray-50: @crust;\n --gray-100: @mantle;\n --gray-200: @base;\n --gray-300: @surface0;\n --gray-400: @surface1;\n --gray-500: @surface2;\n --gray-600: @overlay0;\n --gray-700: @overlay1;\n --gray-800: @subtext0;\n --gray-900: @subtext1;\n --gray-950: @text;\n --brand-purple: @accent-color;\n --text-primary: var(--gray-950);\n --text-secondary: var(--gray-600);\n --text-tertiary: var(--gray-400);\n --text-quaternary: var(--gray-300);\n --main-surface-primary: var(--gray-200);\n --main-surface-secondary: var(--gray-100);\n --main-surface-tertiary: var(--gray-50);\n --sidebar-surface-primary: var(--gray-100);\n --sidebar-surface-secondary: var(--gray-200);\n --sidebar-surface-tertiary: var(--gray-300);\n .popover,\n .dark .popover,\n .dark.popover,\n .popover .dark {\n --main-surface-primary: var(--gray-200) !important;\n --main-surface-secondary: var(--gray-100) !important;\n --main-surface-tertiary: var(--gray-50) !important;\n --text-primary: var(--gray-950) !important;\n --text-secondary: var(--gray-600) !important;\n --text-tertiary: var(--gray-500) !important;\n }\n }\n\n --border-light: fade(@text, 10%);\n --border-medium: fade(@text, 15%);\n --border-heavy: fade(@text, 20%);\n --border-xheavy: fade(@text, 25%);\n --link: @accent-color;\n --link-hover: if(\n @lookup = latte,\n lighten(@accent-color, 10%),\n darken(@accent-color, 10%)\n );\n\n *:focus {\n --tw-ring-offset-color: @base;\n --tw-ring-color: @accent-color;\n }\n\n /* ChatGPT logo */\n [style*=\"background-color: rgb(25, 195, 125);\"] {\n background-color: @green !important;\n color: @base !important;\n }\n\n /* Input */\n\n select {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;@{svg}\");\n }\n\n [multiple],\n [type=\"date\"],\n [type=\"datetime-local\"],\n [type=\"email\"],\n [type=\"month\"],\n [type=\"number\"],\n [type=\"password\"],\n [type=\"search\"],\n [type=\"tel\"],\n [type=\"text\"],\n [type=\"time\"],\n [type=\"url\"],\n [type=\"week\"],\n select,\n textarea {\n background-color: @base;\n border-color: @overlay2;\n }\n\n [type=\"checkbox\"],\n [type=\"radio\"] {\n background-color: @base;\n border-color: @overlay2;\n color: @accent-color;\n }\n\n .form-input,\n .form-multiselect,\n .form-select,\n .form-textarea {\n background-color: @base;\n border-color: @overlay2;\n }\n\n .form-input:focus,\n .form-multiselect:focus,\n .form-select:focus,\n .form-textarea:focus {\n border-color: @accent-color;\n }\n\n .form-input::placeholder,\n .form-textarea::placeholder {\n color: @overlay2;\n }\n\n /* Buttons */\n\n .btn-primary {\n background-color: @green;\n color: @base;\n }\n\n .btn-primary:hover {\n background-color: darken(@green, 10%);\n }\n\n .btn-primary.focus-visible {\n --tw-ring-color: lighten(@green, 10%) !important;\n }\n\n .btn-primary:focus-visible {\n --tw-ring-color: lighten(@green, 10%) !important;\n }\n\n .btn-danger {\n background-color: @red;\n color: @base;\n }\n\n .btn-danger:hover {\n background-color: darken(@red, 10%);\n }\n\n .btn-danger.focus-visible {\n --tw-ring-color: lighten(@red, 10%) !important;\n }\n\n .btn-danger:focus-visible {\n --tw-ring-color: lighten(@red, 10%) !important;\n }\n\n .btn-danger:disabled:hover {\n background-color: @red;\n }\n\n .btn-danger-outline {\n border-color: @red;\n color: @red;\n }\n\n .btn-danger-outline.focus-visible {\n --tw-ring-color: lighten(@red, 10%) !important;\n }\n\n .btn-danger-outline:focus-visible {\n --tw-ring-color: lighten(@red, 10%) !important;\n }\n\n .btn-neutral.focus-visible {\n --tw-ring-color: @overlay0 !important;\n }\n\n .btn-neutral:focus-visible {\n --tw-ring-color: @overlay0 !important;\n }\n\n .btn-dark {\n background-color: @surface0;\n border-color: @overlay0;\n color: @text;\n }\n\n .btn-dark:hover {\n background-color: @surface1;\n }\n\n .btn-light {\n background-color: @text;\n color: @black;\n }\n\n .btn-light:hover {\n background-color: @base;\n }\n\n .btn-disabled,\n .btn-disabled:hover {\n background-color: @text;\n }\n\n /* Borders */\n\n .border-black,\n .border-black\\/10,\n .border-black\\/20,\n .border-black\\/30,\n .border-black\\/5 {\n border-color: var(--border-light);\n }\n\n .border-gray-100 {\n border-color: var(--gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--gray-500);\n }\n\n .border-gray-700 {\n border-color: var(--gray-700);\n }\n\n .border-gray-950 {\n border-color: var(--gray-950);\n }\n\n .border-green-500 {\n border-color: lighten(@green, 10%);\n }\n\n .border-green-600 {\n border-color: @green;\n }\n\n .border-orange-400 {\n border-color: lighten(mix(@red, @yellow), 10%);\n }\n\n .border-orange-500 {\n border-color: mix(@red, @yellow);\n }\n\n .border-red-500 {\n border-color: darken(@red, 10%);\n }\n\n .border-white {\n border-color: @white;\n }\n\n .border-white\\/20 {\n border-color: fade(@white, 20%);\n }\n\n .border-t-[\\#0077FF] {\n border-top-color: @blue;\n }\n\n /* Backgrounds */\n .bg-token-main-surface-primary {\n background-color: var(--main-surface-primary);\n }\n\n .\\!bg-brand-purple {\n background-color: @accent-color !important;\n }\n\n .\\!bg-gray-200 {\n background-color: var(--gray-200) !important;\n }\n\n .bg-[\\#0077FF],\n .bg-\\[\\#3C46FF\\] {\n background-color: @blue;\n }\n\n .hover\\:bg-\\[\\#0000FF\\]:hover {\n background-color: darken(@blue, 10%);\n }\n\n .bg-[\\#10A37F] {\n background-color: @green;\n }\n\n .bg-[\\#3C46FF] {\n background-color: @blue;\n }\n\n .bg-[\\#4046EC] {\n background-color: @blue;\n }\n\n .bg-[\\#B161FD] {\n background-color: @accent-color;\n }\n\n .bg-[\\#F8CA27] {\n background-color: @yellow;\n }\n\n .bg-[\\#FF5588] {\n background-color: mix(@red, @pink);\n }\n\n .bg-[\\#FF6E3C] {\n background-color: saturate(mix(@red, @yellow), 10%);\n }\n .dark\\:radix-highlighted\\:bg-\\[\\#2E2F33\\][data-highlighted] {\n background-color: @surface0;\n }\n\n .bg-black {\n background-color: @black;\n }\n\n .bg-black\\/20 {\n background-color: fade(@black, 20%);\n }\n\n .bg-black\\/5 {\n background-color: fade(@black, 5%);\n }\n\n .bg-black\\/50 {\n background-color: fade(@black, 50%);\n }\n\n .bg-black\\/90 {\n background-color: fade(@black, 90%);\n }\n\n .bg-black\\/\\[\\.04\\] {\n background-color: fade(@black, 4%);\n }\n\n .bg-black\\/\\[\\.08\\] {\n background-color: fade(@black, 8%);\n }\n\n .bg-black\\/\\[\\.12\\] {\n background-color: fade(@black, 12%);\n }\n\n .bg-blue-100 {\n background-color: lighten(@blue, 30%);\n }\n\n .bg-blue-200 {\n background-color: lighten(@blue, 20%);\n }\n\n .bg-blue-300 {\n background-color: lighten(@blue, 10%);\n }\n\n .bg-blue-400 {\n background-color: @blue;\n }\n\n .bg-blue-500 {\n background-color: darken(@blue, 5%);\n }\n\n .bg-blue-700 {\n background-color: darken(@blue, 10%);\n }\n\n .bg-brand-blue-800 {\n background-color: darken(@blue, 20%);\n }\n\n .bg-blue-950 {\n background-color: darken(@blue, 30%);\n }\n\n .checked\\:bg-blue-600:checked {\n background-color: @accent-color;\n }\n\n .bg-brand-green {\n background-color: lighten(@green, 10%);\n }\n\n .bg-brand-green\\/20 {\n background-color: fade(lighten(@green, 10%), 20%);\n }\n\n .bg-brand-green\\/40 {\n background-color: fade(lighten(@green, 10%), 40%);\n }\n\n .bg-brand-purple {\n background-color: @accent-color;\n }\n\n .bg-gray-100 {\n background-color: var(--gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--gray-300);\n }\n\n .bg-gray-400 {\n background-color: var(--gray-400);\n }\n\n .bg-gray-50 {\n background-color: var(--gray-50);\n }\n\n .bg-gray-500 {\n background-color: var(--gray-500);\n }\n\n .bg-gray-600 {\n background-color: var(--gray-600);\n }\n\n .bg-gray-700 {\n background-color: var(--gray-700);\n }\n\n .bg-gray-900 {\n background-color: var(--gray-900);\n }\n\n .bg-gray-950 {\n background-color: var(--gray-950);\n }\n\n .bg-green-100 {\n background-color: lighten(@green, 30%);\n }\n\n .bg-green-200 {\n background-color: lighten(@green, 20%);\n }\n\n .bg-green-500 {\n background-color: lighten(@green, 10%);\n }\n\n .bg-green-500\\/10 {\n background-color: fade(lighten(@green, 10%), 10%);\n }\n\n .bg-green-600 {\n background-color: @green;\n }\n\n .bg-orange-500 {\n background-color: mix(@yellow, @red);\n }\n\n .bg-orange-500\\/10 {\n background-color: fade(mix(@yellow, @red), 10%);\n }\n\n .bg-red-100 {\n background-color: fade(lighten(@red, 10%), 30%);\n }\n\n .bg-red-200 {\n background-color: lighten(@red, 20%);\n }\n\n .bg-red-500 {\n background-color: @red;\n }\n\n .bg-red-500\\/10 {\n background-color: fade(@red, 10%);\n }\n\n .bg-red-600 {\n background-color: lighten(@red, 10%);\n }\n\n .bg-white {\n background-color: @white;\n }\n\n .bg-white\\/20 {\n background-color: fade(@white, 20%);\n }\n\n .bg-white\\/25 {\n background-color: fade(@white, 25%);\n }\n\n .bg-yellow-100 {\n background-color: lighten(@yellow, 20%);\n }\n\n .bg-yellow-200 {\n background-color: lighten(@yellow, 10%);\n }\n\n .bg-yellow-400 {\n background-color: @yellow;\n }\n\n .bg-yellow-500 {\n background-color: darken(@yellow, 10%);\n }\n\n .radix-state-checked\\:\\!bg-green-600[data-state=\"checked\"] {\n background-color: @accent-color !important;\n }\n\n .dark\\:radix-state-checked\\:border-green-600[data-state=\"checked\"]:is(\n .dark *\n ) {\n border-color: @accent-color;\n }\n\n .hover\\:bg-blue-700:hover {\n background-color: darken(@blue, 25%);\n }\n\n [class*=\"bg-transparent\"] {\n background-color: transparent;\n }\n\n /* Gradients */\n\n .from-white {\n --tw-gradient-from: @white var(--tw-gradient-from-position);\n }\n\n /* Fill/stroke */\n\n .fill-yellow-500 {\n fill: @yellow;\n }\n\n .stroke-black {\n stroke: @black;\n }\n\n .stroke-brand-purple\\/25 {\n stroke: fade(@accent-color, 25%);\n }\n\n .stroke-gray-400 {\n stroke: @subtext0;\n }\n\n /* Text */\n\n .\\!text-black {\n color: @black !important;\n }\n\n .text-\\[\\#FE7600\\] {\n color: mix(@yellow, @red);\n }\n\n .text-\\[\\#fff\\] {\n color: @base;\n }\n\n .text-black {\n color: @black;\n }\n\n .text-black\\/60 {\n color: fade(@black, 60%);\n }\n\n .text-black\\/70 {\n color: fade(@black, 70%);\n }\n\n .text-blue-500 {\n color: lighten(@blue, 10%);\n }\n\n .text-blue-600 {\n color: @blue;\n }\n\n .text-brand-blue-800 {\n color: @blue;\n }\n\n .text-brand-purple {\n color: @accent-color;\n }\n\n .text-gray-100 {\n color: var(--gray-100);\n }\n\n .text-gray-300 {\n color: var(--gray-300);\n }\n\n .text-gray-400 {\n color: var(--gray-400);\n }\n\n .text-gray-500 {\n color: var(--gray-500);\n }\n\n .text-gray-600 {\n color: var(--gray-600);\n }\n\n .text-gray-700 {\n color: var(--gray-700);\n }\n\n .text-gray-800 {\n color: var(--gray-800);\n }\n\n .text-gray-900 {\n color: var(--gray-900);\n }\n\n .text-green-500 {\n color: lighten(@green, 10%);\n }\n\n .text-green-600 {\n color: @green;\n }\n\n .text-green-700 {\n color: darken(@green, 10%);\n }\n\n .text-green-800 {\n color: darken(@green, 20%);\n }\n\n .text-green-900 {\n color: darken(@green, 30%);\n }\n\n .text-orange-300 {\n color: lighten(mix(@yellow, @red), 15%);\n }\n\n .text-orange-400 {\n color: lighten(mix(@yellow, @red), 10%);\n }\n\n .text-orange-500 {\n color: mix(@yellow, @red);\n }\n\n .text-red-500 {\n color: @red;\n }\n\n .text-red-600 {\n color: lighten(@red, 10%);\n }\n\n .text-red-700 {\n color: @red;\n }\n\n .text-red-800 {\n color: darken(@red, 10%);\n }\n\n .text-white {\n color: @white;\n }\n\n .text-white\\/25 {\n color: fade(@white, 25%);\n }\n\n .text-white\\/50 {\n color: fade(@white, 50%);\n }\n\n .text-white\\/80 {\n color: fade(@white, 80%);\n }\n\n .text-yellow-500 {\n color: @yellow;\n }\n\n .text-yellow-700 {\n color: darken(@yellow, 10%);\n }\n\n .text-yellow-800 {\n color: darken(@yellow, 20%);\n }\n\n .text-yellow-900 {\n color: darken(@yellow, 30%);\n }\n\n /* Dark mode overrides */\n /* stylelint-disable-next-line no-duplicate-selectors */\n & when not (@lookup = latte) {\n .dark\\:bg-black {\n background-color: @black;\n }\n\n .dark\\:bg-white {\n background-color: @white;\n }\n\n .dark\\:bg-gray-700 {\n background-color: var(--gray-700);\n }\n\n /* \"Was this response better or worse\" dialog button hover */\n .dark\\:hover\\:bg-gray-800:hover {\n background-color: transparent;\n }\n\n .dark\\:text-white {\n color: @white;\n }\n\n .dark\\:text-black {\n color: @black;\n }\n\n .dark\\:text-\\[\\#D292FF\\] {\n color: @mauve;\n }\n\n .dark\\:focus\\:border-white:focus {\n border-color: @text;\n }\n\n .dark\\:border-gray-700 {\n border-color: var(--gray-700);\n }\n }\n\n /* Other */\n\n .ring-black {\n --tw-ring-color: @black;\n }\n\n .ring-black\\/10 {\n --tw-ring-color: fade(@black, 10%);\n }\n\n .ring-white {\n --tw-ring-color: @base;\n }\n\n .ring-offset-black {\n --tw-ring-offset-color: @base;\n }\n\n /* Circle around OpenAI logo in center of chat */\n .gizmo-shadow-stroke::after {\n --tw-shadow: inset 0 0 0 1px @surface0;\n }\n\n .katex-error {\n color: @red !important;\n }\n\n [style=\"background-color: rgb(0, 0, 46);\"],\n [style=\"background-color: rgb(255, 255, 219);\"] {\n background-color: @crust !important;\n }\n }\n}\n\n@-moz-document domain(\"auth.openai.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n caret-color: @text;\n\n a {\n color: @accent-color;\n }\n\n body,\n .oai-header,\n .login-container {\n background-color: @base;\n }\n\n img[alt=\"OpenAI's Logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n background-color: transparent;\n }\n\n .title {\n color: @text;\n }\n\n .email-input {\n background-color: @base;\n border-color: @surface0;\n color: @text;\n\n &:focus,\n &:valid {\n border-color: @accent-color;\n\n + .email-label {\n color: @accent-color;\n background-color: @base;\n }\n }\n }\n .email-label {\n background-color: @base;\n color: @subtext0;\n }\n\n .continue-btn {\n background-color: @accent-color;\n color: @base;\n }\n\n .divider-wrapper {\n &::before,\n &::after {\n border-bottom-color: @surface2;\n }\n }\n\n .social-btn {\n background-color: @mantle;\n border-color: @surface0;\n color: @text;\n }\n\n @orange: mix(@red, @yellow);\n\n img[alt=\"Google logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n img[alt=\"Microsoft logo\"] {\n @svg: escape(\n ''\n );\n\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n img[alt=\"Apple logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n@-moz-document domain(\"auth0.openai.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --primary-color: @accent-color;\n --primary-color-no-override: @accent-color;\n --action-primary-color: @accent-color;\n --link-color: @accent-color;\n --page-background-color: @base;\n --info-color: @blue;\n --success-color: @green;\n --error-color: @red;\n --error-text-color: @text;\n --warning-color: @yellow;\n --button-font-color: @text;\n --widget-background-color: @base;\n --presentational-content-color: @overlay2;\n --gray-lightest: @base;\n --gray-light: @crust;\n --gray-mid: @surface0;\n --gray-mid-dark: @surface1;\n --gray-dark: @overlay2;\n --gray-darkest: @text;\n --gray-social-border: @surface0;\n\n ._button-login-password {\n background-color: @accent-color;\n color: @base;\n }\n\n .password-icon-tooltip {\n background-color: @text;\n\n &::before {\n border-top-color: @text;\n }\n }\n\n .oai-header svg {\n fill: @text;\n }\n\n @orange: mix(@red, @yellow);\n\n button > span {\n &[data-provider^=\"google\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n &[data-provider^=\"windowslive\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n &[data-provider^=\"apple\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n }\n }\n}\n\n#rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name ChatGPT Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/chatgpt\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt\n@version 0.3.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt\n@description Soothing pastel theme for ChatGPT\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain(\"chatgpt.com\") {\n @import url(\"https://unpkg.com/@catppuccin/highlightjs@0.1.2/css/catppuccin.variables.css\");\n\n :root.light {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n :root.dark {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --ctp-rosewater: #rgbify(@rosewater) [];\n --ctp-flamingo: #rgbify(@flamingo) [];\n --ctp-pink: #rgbify(@pink) [];\n --ctp-mauve: #rgbify(@mauve) [];\n --ctp-red: #rgbify(@red) [];\n --ctp-maroon: #rgbify(@maroon) [];\n --ctp-peach: #rgbify(@peach) [];\n --ctp-yellow: #rgbify(@yellow) [];\n --ctp-green: #rgbify(@green) [];\n --ctp-teal: #rgbify(@teal) [];\n --ctp-sky: #rgbify(@sky) [];\n --ctp-sapphire: #rgbify(@sapphire) [];\n --ctp-blue: #rgbify(@blue) [];\n --ctp-lavender: #rgbify(@lavender) [];\n --ctp-text: #rgbify(@text) [];\n --ctp-subtext1: #rgbify(@subtext1) [];\n --ctp-subtext0: #rgbify(@subtext0) [];\n --ctp-overlay2: #rgbify(@overlay2) [];\n --ctp-overlay1: #rgbify(@overlay1) [];\n --ctp-overlay0: #rgbify(@overlay0) [];\n --ctp-surface2: #rgbify(@surface2) [];\n --ctp-surface1: #rgbify(@surface1) [];\n --ctp-surface0: #rgbify(@surface0) [];\n --ctp-base: #rgbify(@base) [];\n --ctp-mantle: #rgbify(@mantle) [];\n --ctp-crust: #rgbify(@crust) [];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n code.hljs {\n background: none;\n }\n pre {\n .bg-token-main-surface-secondary {\n background-color: @surface0;\n }\n .bg-gray-950 {\n background-color: @crust;\n }\n .text-token-text-secondary {\n color: @subtext0;\n }\n }\n\n color: @text;\n\n @white: if(@lookup=latte, @crust, @text);\n @black: if(@lookup=latte, @text, @crust);\n --white: @white;\n --black: @black;\n\n & when not (@lookup = latte) {\n --gray-50: lighten(mix(@text, @subtext0), 5%);\n --gray-100: @text;\n --gray-200: @subtext1;\n --gray-300: @overlay2;\n --gray-400: @overlay0;\n --gray-500: @surface2;\n --gray-600: @surface1;\n --gray-700: @surface0;\n --gray-800: @base;\n --gray-900: @mantle;\n --gray-950: @crust;\n --brand-purple: @accent-color;\n --text-primary: var(--gray-100) !important;\n --text-secondary: var(--gray-200) !important;\n --text-tertiary: var(--gray-300) !important;\n --text-quaternary: var(--gray-500) !important;\n --main-surface-primary: var(--gray-800) !important;\n --main-surface-secondary: var(--gray-700) !important;\n --main-surface-tertiary: var(--gray-600) !important;\n --sidebar-surface-primary: var(--gray-900);\n --sidebar-surface-secondary: var(--gray-800);\n --sidebar-surface-tertiary: var(--gray-700);\n .popover,\n .dark .popover,\n .dark.popover,\n .popover .dark {\n --main-surface-primary: var(--gray-700) !important;\n --main-surface-secondary: var(--gray-600) !important;\n --main-surface-tertiary: var(--gray-500) !important;\n --text-primary: var(--white) !important;\n --text-secondary: var(--gray-200) !important;\n --text-tertiary: var(--gray-300) !important;\n }\n }\n & when (@lookup = latte) {\n --gray-50: @crust;\n --gray-100: @mantle;\n --gray-200: @base;\n --gray-300: @surface0;\n --gray-400: @surface1;\n --gray-500: @surface2;\n --gray-600: @overlay0;\n --gray-700: @overlay1;\n --gray-800: @subtext0;\n --gray-900: @subtext1;\n --gray-950: @text;\n --brand-purple: @accent-color;\n --text-primary: var(--gray-950);\n --text-secondary: var(--gray-600);\n --text-tertiary: var(--gray-400);\n --text-quaternary: var(--gray-300);\n --main-surface-primary: var(--gray-200);\n --main-surface-secondary: var(--gray-100);\n --main-surface-tertiary: var(--gray-50);\n --sidebar-surface-primary: var(--gray-100);\n --sidebar-surface-secondary: var(--gray-200);\n --sidebar-surface-tertiary: var(--gray-300);\n .popover,\n .dark .popover,\n .dark.popover,\n .popover .dark {\n --main-surface-primary: var(--gray-200) !important;\n --main-surface-secondary: var(--gray-100) !important;\n --main-surface-tertiary: var(--gray-50) !important;\n --text-primary: var(--gray-950) !important;\n --text-secondary: var(--gray-600) !important;\n --text-tertiary: var(--gray-500) !important;\n }\n }\n\n --border-light: fade(@text, 10%);\n --border-medium: fade(@text, 15%);\n --border-heavy: fade(@text, 20%);\n --border-xheavy: fade(@text, 25%);\n --link: @accent-color;\n --link-hover: if(\n @lookup = latte,\n lighten(@accent-color, 10%),\n darken(@accent-color, 10%)\n );\n\n *:focus {\n --tw-ring-offset-color: @base;\n --tw-ring-color: @accent-color;\n }\n\n /* ChatGPT logo */\n [style*=\"background-color: rgb(25, 195, 125);\"] {\n background-color: @green !important;\n color: @base !important;\n }\n\n /* Input */\n\n select {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;@{svg}\");\n }\n\n [multiple],\n [type=\"date\"],\n [type=\"datetime-local\"],\n [type=\"email\"],\n [type=\"month\"],\n [type=\"number\"],\n [type=\"password\"],\n [type=\"search\"],\n [type=\"tel\"],\n [type=\"text\"],\n [type=\"time\"],\n [type=\"url\"],\n [type=\"week\"],\n select,\n textarea {\n background-color: @base;\n border-color: @overlay2;\n }\n\n [type=\"checkbox\"],\n [type=\"radio\"] {\n background-color: @base;\n border-color: @overlay2;\n color: @accent-color;\n }\n\n .form-input,\n .form-multiselect,\n .form-select,\n .form-textarea {\n background-color: @base;\n border-color: @overlay2;\n }\n\n .form-input:focus,\n .form-multiselect:focus,\n .form-select:focus,\n .form-textarea:focus {\n border-color: @accent-color;\n }\n\n .form-input::placeholder,\n .form-textarea::placeholder {\n color: @overlay2;\n }\n\n /* Buttons */\n\n .btn-primary,\n .btn-green {\n background-color: @accent-color;\n color: @base;\n\n &:hover {\n background-color: darken(@accent-color, 10%);\n }\n\n &:focus-visible {\n --tw-ring-color: darken(@accent-color, 10%) !important;\n }\n }\n\n .btn-danger {\n background-color: @red;\n color: @base;\n\n &:hover:not(:disabled) {\n background-color: darken(@red, 10%);\n }\n\n &.focus-visible,\n &:focus-visible {\n --tw-ring-color: darken(@red, 10%) !important;\n }\n }\n\n .btn-danger-outline {\n border-color: @red;\n color: @red;\n\n &.focus-visible,\n &:focus-visible {\n --tw-ring-color: lighten(@red, 10%) !important;\n }\n }\n\n .btn-neutral {\n &.focus-visible,\n &:focus-visible {\n --tw-ring-color: @overlay0 !important;\n }\n }\n\n .btn-dark {\n background-color: @surface0;\n border-color: @overlay0;\n color: @text;\n\n &:hover {\n background-color: @surface1;\n }\n }\n\n .btn-light {\n background-color: @overlay1;\n color: @black;\n\n &:hover {\n background-color: @overlay0;\n }\n }\n\n .btn-disabled,\n .btn-disabled:hover {\n background-color: @text;\n }\n\n /* Borders */\n\n .border-black,\n .border-black\\/10,\n .border-black\\/20,\n .border-black\\/30,\n .border-black\\/5 {\n border-color: var(--border-light);\n }\n\n .border-gray-100 {\n border-color: var(--gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--gray-500);\n }\n\n .border-gray-700 {\n border-color: var(--gray-700);\n }\n\n .border-gray-950 {\n border-color: var(--gray-950);\n }\n\n .border-green-500 {\n border-color: lighten(@green, 10%);\n }\n\n .border-green-600 {\n border-color: @green;\n }\n\n .border-orange-400 {\n border-color: lighten(mix(@red, @yellow), 10%);\n }\n\n .border-orange-500 {\n border-color: mix(@red, @yellow);\n }\n\n .border-red-500 {\n border-color: darken(@red, 10%);\n }\n\n .border-white {\n border-color: @white;\n }\n\n .border-white\\/20 {\n border-color: fade(@white, 20%);\n }\n\n .border-t-[\\#0077FF] {\n border-top-color: @blue;\n }\n\n /* Backgrounds */\n .bg-token-main-surface-primary {\n background-color: var(--main-surface-primary);\n }\n\n .\\!bg-brand-purple {\n background-color: @accent-color !important;\n }\n\n .\\!bg-gray-200 {\n background-color: var(--gray-200) !important;\n }\n\n .bg-[\\#0077FF],\n .bg-\\[\\#3C46FF\\] {\n background-color: @blue;\n }\n\n .hover\\:bg-\\[\\#0000FF\\]:hover {\n background-color: darken(@blue, 10%);\n }\n\n .bg-[\\#10A37F] {\n background-color: @green;\n }\n\n .bg-[\\#3C46FF] {\n background-color: @blue;\n }\n\n .bg-[\\#4046EC] {\n background-color: @blue;\n }\n\n .bg-[\\#B161FD] {\n background-color: @accent-color;\n }\n\n .bg-[\\#F8CA27] {\n background-color: @yellow;\n }\n\n .bg-[\\#FF5588] {\n background-color: mix(@red, @pink);\n }\n\n .bg-[\\#FF6E3C] {\n background-color: saturate(mix(@red, @yellow), 10%);\n }\n .dark\\:radix-highlighted\\:bg-\\[\\#2E2F33\\][data-highlighted] {\n background-color: @surface0;\n }\n\n .bg-black {\n background-color: @black;\n }\n\n .bg-black\\/20 {\n background-color: fade(@black, 20%);\n }\n\n .bg-black\\/5 {\n background-color: fade(@black, 5%);\n }\n\n .bg-black\\/50 {\n background-color: fade(@black, 50%);\n }\n\n .bg-black\\/90 {\n background-color: fade(@black, 90%);\n }\n\n .bg-black\\/\\[\\.04\\] {\n background-color: fade(@black, 4%);\n }\n\n .bg-black\\/\\[\\.08\\] {\n background-color: fade(@black, 8%);\n }\n\n .bg-black\\/\\[\\.12\\] {\n background-color: fade(@black, 12%);\n }\n\n .bg-blue-100 {\n background-color: lighten(@blue, 30%);\n }\n\n .bg-blue-200 {\n background-color: lighten(@blue, 20%);\n }\n\n .bg-blue-300 {\n background-color: lighten(@blue, 10%);\n }\n\n .bg-blue-400 {\n background-color: @blue;\n }\n\n .bg-blue-500 {\n background-color: darken(@blue, 5%);\n }\n\n .bg-blue-700 {\n background-color: darken(@blue, 10%);\n }\n\n .hover\\:bg-blue-700:hover {\n background-color: darken(@blue, 15%);\n }\n\n .bg-brand-blue-800 {\n background-color: darken(@blue, 10%);\n }\n\n .bg-blue-950 {\n background-color: darken(@blue, 30%);\n }\n\n .checked\\:bg-blue-600:checked {\n background-color: @accent-color;\n }\n\n .bg-brand-green {\n background-color: lighten(@green, 10%);\n }\n\n .bg-brand-green\\/20 {\n background-color: fade(lighten(@green, 10%), 20%);\n }\n\n .bg-brand-green\\/40 {\n background-color: fade(lighten(@green, 10%), 40%);\n }\n\n .bg-brand-purple {\n background-color: @accent-color;\n }\n\n .bg-gray-100 {\n background-color: var(--gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--gray-300);\n }\n\n .bg-gray-400 {\n background-color: var(--gray-400);\n }\n\n .bg-gray-50 {\n background-color: var(--gray-50);\n }\n\n .bg-gray-500 {\n background-color: var(--gray-500);\n }\n\n .bg-gray-600 {\n background-color: var(--gray-600);\n }\n\n .bg-gray-700 {\n background-color: var(--gray-700);\n }\n\n .bg-gray-900 {\n background-color: var(--gray-900);\n }\n\n .bg-gray-950 {\n background-color: var(--gray-950);\n }\n\n .bg-green-100 {\n background-color: lighten(@green, 30%);\n }\n\n .bg-green-200 {\n background-color: lighten(@green, 20%);\n }\n\n .bg-green-500 {\n background-color: lighten(@green, 10%);\n }\n\n .bg-green-500\\/10 {\n background-color: fade(lighten(@green, 10%), 10%);\n }\n\n .bg-green-600 {\n background-color: @green;\n }\n\n .bg-orange-500 {\n background-color: mix(@yellow, @red);\n }\n\n .bg-orange-500\\/10 {\n background-color: fade(mix(@yellow, @red), 10%);\n }\n\n .bg-red-100 {\n background-color: fade(lighten(@red, 10%), 30%);\n }\n\n .bg-red-200 {\n background-color: lighten(@red, 20%);\n }\n\n .bg-red-500 {\n background-color: @red;\n }\n\n .bg-red-500\\/10 {\n background-color: fade(@red, 10%);\n }\n\n .bg-red-600 {\n background-color: lighten(@red, 10%);\n }\n\n .bg-white {\n background-color: @white;\n }\n\n .bg-white\\/20 {\n background-color: fade(@white, 20%);\n }\n\n .bg-white\\/25 {\n background-color: fade(@white, 25%);\n }\n\n .bg-yellow-100 {\n background-color: lighten(@yellow, 20%);\n }\n\n .bg-yellow-200 {\n background-color: lighten(@yellow, 10%);\n }\n\n .bg-yellow-400 {\n background-color: @yellow;\n }\n\n .bg-yellow-500 {\n background-color: darken(@yellow, 10%);\n }\n\n .radix-state-checked\\:\\!bg-green-600[data-state=\"checked\"] {\n background-color: @accent-color !important;\n }\n\n .dark\\:radix-state-checked\\:border-green-600[data-state=\"checked\"]:is(\n .dark *\n ) {\n border-color: @accent-color;\n }\n\n [class*=\"bg-transparent\"] {\n background-color: transparent;\n }\n\n /* Gradients */\n\n .from-white {\n --tw-gradient-from: @base var(--tw-gradient-from-position);\n }\n\n /* Fill/stroke */\n\n .fill-yellow-500 {\n fill: @yellow;\n }\n\n .stroke-black {\n stroke: @black;\n }\n\n .stroke-brand-purple\\/25 {\n stroke: fade(@accent-color, 25%);\n }\n\n .stroke-gray-400 {\n stroke: @subtext0;\n }\n\n /* Text */\n\n .\\!text-black {\n color: @black !important;\n }\n\n .text-\\[\\#FE7600\\] {\n color: mix(@yellow, @red);\n }\n\n .text-\\[\\#fff\\] {\n color: @base;\n }\n\n .text-black {\n color: @black;\n }\n\n .text-black\\/60 {\n color: fade(@black, 60%);\n }\n\n .text-black\\/70 {\n color: fade(@black, 70%);\n }\n\n .text-blue-500 {\n color: lighten(@blue, 10%);\n }\n\n .text-blue-600 {\n color: @blue;\n }\n\n .text-brand-blue-800 {\n color: @blue;\n }\n\n .text-brand-purple {\n color: @accent-color;\n }\n\n .text-gray-100 {\n color: var(--gray-100);\n }\n\n .text-gray-300 {\n color: var(--gray-300);\n }\n\n .text-gray-400 {\n color: var(--gray-400);\n }\n\n .text-gray-500 {\n color: var(--gray-500);\n }\n\n .text-gray-600 {\n color: var(--gray-600);\n }\n\n .text-gray-700 {\n color: var(--gray-700);\n }\n\n .text-gray-800 {\n color: var(--gray-800);\n }\n\n .text-gray-900 {\n color: var(--gray-900);\n }\n\n .text-green-500 {\n color: lighten(@green, 10%);\n }\n\n .text-green-600 {\n color: @green;\n }\n\n .text-green-700 {\n color: darken(@green, 10%);\n }\n\n .text-green-800 {\n color: darken(@green, 20%);\n }\n\n .text-green-900 {\n color: darken(@green, 30%);\n }\n\n .text-orange-300 {\n color: lighten(mix(@yellow, @red), 15%);\n }\n\n .text-orange-400 {\n color: lighten(mix(@yellow, @red), 10%);\n }\n\n .text-orange-500 {\n color: mix(@yellow, @red);\n }\n\n .text-red-500 {\n color: @red;\n }\n\n .text-red-600 {\n color: lighten(@red, 10%);\n }\n\n .text-red-700 {\n color: @red;\n }\n\n .text-red-800 {\n color: darken(@red, 10%);\n }\n\n .text-token-text-error {\n --text-error: @red;\n }\n\n .text-white {\n color: @white;\n }\n\n .text-white\\/25 {\n color: fade(@white, 25%);\n }\n\n .text-white\\/50 {\n color: fade(@white, 50%);\n }\n\n .text-white\\/80 {\n color: fade(@white, 80%);\n }\n\n .text-yellow-500 {\n color: @yellow;\n }\n\n .text-yellow-700 {\n color: darken(@yellow, 10%);\n }\n\n .text-yellow-800 {\n color: darken(@yellow, 20%);\n }\n\n .text-yellow-900 {\n color: darken(@yellow, 30%);\n }\n\n /* Dark mode overrides */\n /* stylelint-disable-next-line no-duplicate-selectors */\n & when not (@lookup = latte) {\n .dark\\:bg-black {\n background-color: @black;\n }\n\n .dark\\:bg-white {\n background-color: @white;\n }\n\n .dark\\:bg-gray-700 {\n background-color: var(--gray-700);\n }\n\n /* \"Was this response better or worse\" dialog button hover */\n .dark\\:hover\\:bg-gray-800:hover {\n background-color: transparent;\n }\n\n .dark\\:text-white {\n color: @white;\n }\n\n .dark\\:text-black {\n color: @black;\n }\n\n /* Chat suggestions on new chat page */\n .dark\\:text-gray-500 {\n color: var(--gray-300);\n }\n\n .dark\\:text-\\[\\#D292FF\\] {\n color: @mauve;\n }\n\n .dark\\:focus\\:border-white:focus {\n border-color: @text;\n }\n\n .dark\\:border-gray-700 {\n border-color: var(--gray-700);\n }\n\n /* Up arrow send message button */\n .disabled\\:dark\\:bg-token-text-quaternary:is(.dark *):disabled {\n background-color: var(--text-quaternary);\n }\n .dark\\:disabled\\:text-token-main-surface-secondary:disabled:is(.dark *) {\n color: var(--main-surface-secondary);\n }\n }\n\n /* Other */\n\n .ring-black {\n --tw-ring-color: @black;\n }\n\n .ring-black\\/10 {\n --tw-ring-color: fade(@black, 10%);\n }\n\n .ring-white {\n --tw-ring-color: @base;\n }\n\n .ring-offset-black {\n --tw-ring-offset-color: @base;\n }\n\n /* Invalid LaTeX expressions */\n [style*=\"color: rgb(204, 0, 0)\"] {\n color: @red;\n }\n\n /* Circle around OpenAI logo in center of chat */\n .gizmo-shadow-stroke::after {\n --tw-shadow: inset 0 0 0 1px @surface0;\n }\n\n .katex-error {\n color: @red !important;\n }\n\n [style=\"background-color: rgb(0, 0, 46);\"],\n [style=\"background-color: rgb(255, 255, 219);\"] {\n background-color: @crust !important;\n }\n\n /* Icon colors for chat suggestion icons on new chat page */\n svg[style=\"color: rgb(203, 139, 208);\"] {\n color: @pink !important;\n }\n svg[style=\"color: rgb(226, 197, 65);\"] {\n color: @yellow !important;\n }\n svg[style=\"color: rgb(118, 208, 235);\"] {\n color: @teal !important;\n }\n svg[style=\"color: rgb(237, 98, 98);\"] {\n color: @red !important;\n }\n }\n}\n\n@-moz-document domain(\"auth.openai.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n caret-color: @text;\n\n a {\n color: @accent-color;\n }\n\n body,\n .oai-header,\n .login-container {\n background-color: @base;\n }\n\n img[alt=\"OpenAI's Logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n background-color: transparent;\n }\n\n .title {\n color: @text;\n }\n\n .email-input {\n background-color: @base;\n border-color: @surface0;\n color: @text;\n\n &:focus,\n &:valid {\n border-color: @accent-color;\n\n + .email-label {\n color: @accent-color;\n background-color: @base;\n }\n }\n }\n .email-label {\n background-color: @base;\n color: @subtext0;\n }\n\n .continue-btn {\n background-color: @accent-color;\n color: @base;\n }\n\n .divider-wrapper {\n &::before,\n &::after {\n border-bottom-color: @surface2;\n }\n }\n\n .social-btn {\n background-color: @mantle;\n border-color: @surface0;\n color: @text;\n }\n\n @orange: mix(@red, @yellow);\n\n img[alt=\"Google logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n img[alt=\"Microsoft logo\"] {\n @svg: escape(\n ''\n );\n\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n img[alt=\"Apple logo\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n@-moz-document domain(\"auth0.openai.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --primary-color: @accent-color;\n --primary-color-no-override: @accent-color;\n --action-primary-color: @accent-color;\n --link-color: @accent-color;\n --page-background-color: @base;\n --info-color: @blue;\n --success-color: @green;\n --error-color: @red;\n --error-text-color: @text;\n --warning-color: @yellow;\n --button-font-color: @text;\n --widget-background-color: @base;\n --presentational-content-color: @overlay2;\n --gray-lightest: @base;\n --gray-light: @crust;\n --gray-mid: @surface0;\n --gray-mid-dark: @surface1;\n --gray-dark: @overlay2;\n --gray-darkest: @text;\n --gray-social-border: @surface0;\n\n ._button-login-password,\n ._button-login-id {\n background-color: @accent-color;\n color: @base;\n }\n\n .password-icon-tooltip {\n background-color: @text;\n\n &::before {\n border-top-color: @text;\n }\n }\n\n .oai-header svg {\n fill: @text;\n }\n\n @orange: mix(@red, @yellow);\n\n button > span {\n &[data-provider^=\"google\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n &[data-provider^=\"windowslive\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n &[data-provider^=\"apple\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n }\n }\n}\n\n#rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "ChatGPT Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/chatgpt",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt",
- "version": "0.2.11",
+ "version": "0.3.1",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt",
"description": "Soothing pastel theme for ChatGPT",
@@ -627,12 +627,12 @@
"author": "Catppuccin",
"description": "Soothing pastel theme for ChatGPT",
"name": "ChatGPT Catppuccin",
- "updateDate": 1715527450700,
+ "updateDate": 1716275985653,
"_id": "b053cab5-a06a-4e0b-92a6-85a53326e988",
- "_rev": 1715537424823,
+ "_rev": 1716275985776,
"id": 3,
- "originalDigest": "c262c23c425d132efea49ccb4b2c7e74049da9c6",
- "etag": "W/\"05a1f4e6668bf63e3892f041c8380fab27d6f44558a07fb50b882cb8920f9519\""
+ "originalDigest": "94af19ad204cb2a94d520bb87ad24b6634ed4658",
+ "etag": "W/\"ce2b327c883e3f2ca9500a1d7b9fa94827a5896ff87d009ef8fa5666502e0a2a\""
},
{
"enabled": true,
@@ -829,12 +829,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name GitHub Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/github\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/github\n@version 1.6.8\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub\n@description Soothing pastel theme for GitHub\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document regexp(\"https:\\/\\/(gist\\.)*github\\.com(?!((\\/.+?\\/.+?\\/commit\\/[A-Fa-f0-9]+\\.(patch|diff)$)|\\/home$|\\/features($|\\/.*)|\\/marketplace($|\\?.*|\\/.*)|\\/organizations\\/plan)).*$\") {\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n html:not([data-light-theme=\"light\"], [data-light-theme=\"dark\"])\n body:not(.logged-out)::after,\n html:not([data-dark-theme=\"dark\"], [data-dark-theme=\"light\"])\n body:not(.logged-out)::after {\n position: fixed;\n top: 0;\n left: 0;\n padding: 1rem;\n margin: 1rem;\n border-radius: 0.5rem;\n max-width: 40ch;\n background-color: var(--color-danger-fg);\n color: var(--color-header-bg);\n content: \"Unsupported GitHub theme detected! Please switch to the default light/dark theme via the GitHub Appearance settings to get the best experience for the Catppuccin GitHub userstyle.\";\n z-index: 9999;\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n .cm-placeholder {\n color: @subtext0;\n }\n\n accent-color: @accent-color;\n color: @text;\n\n --color-social-reaction-bg-reacted-hover: fade(@accent-color, 30%);\n --color-notifications-button-hover-bg: fade(@accent-color, 60%);\n --color-workflow-card-header-shadow: rgba(27, 31, 35, 0.04);\n --color-icon-directory: var(--fgColor-muted, var(--color-fg-muted));\n --color-calendar-halloween-graph-day-L1-bg: fadeout(\n @accent-color,\n 60%\n ) !important;\n --color-calendar-halloween-graph-day-L2-bg: fadeout(\n @accent-color,\n 40%\n ) !important;\n --color-calendar-halloween-graph-day-L3-bg: fadeout(\n @accent-color,\n 20%\n ) !important;\n --color-calendar-halloween-graph-day-L4-bg: @accent-color !important;\n --color-calendar-winter-graph-day-L1-bg: fadeout(\n @accent-color,\n 60%\n ) !important;\n --color-calendar-winter-graph-day-L2-bg: fadeout(\n @accent-color,\n 40%\n ) !important;\n --color-calendar-winter-graph-day-L3-bg: fadeout(\n @accent-color,\n 20%\n ) !important;\n --color-calendar-winter-graph-day-L4-bg: @accent-color !important;\n --color-calendar-graph-day-bg: @surface0 !important;\n --color-calendar-graph-day-border: transparent !important;\n --color-calendar-graph-day-L1-bg: fadeout(@accent-color, 60%) !important;\n --color-calendar-graph-day-L2-bg: fadeout(@accent-color, 40%) !important;\n --color-calendar-graph-day-L3-bg: fadeout(@accent-color, 20%) !important;\n --color-calendar-graph-day-L4-bg: @accent-color !important;\n --color-calendar-graph-day-L2-border: transparent !important;\n --color-calendar-graph-day-L3-border: transparent !important;\n --color-calendar-graph-day-L4-border: transparent !important;\n --color-user-mention-fg: @accent-color;\n --color-user-mention-bg: fade(@accent-color, 30%);\n --color-dashboard-feed-bg: var(--color-scale-gray-9);\n --color-mktg-btn-shadow-outline: rgba(255, 255, 255, 0.25) 0 0 0 1px inset;\n --color-marketing-icon-secondary: var(--color-scale-blue-5);\n --color-project-header-bg: var(--color-scale-gray-9);\n --color-project-sidebar-bg: var(--color-scale-gray-8);\n --color-project-gradient-in: var(--color-scale-gray-8);\n --color-project-gradient-out: rgba(22, 27, 34, 0);\n --color-diff-blob-selected-line-highlight-mix-blend-mode: screen;\n --topicTag-borderColor: #0000;\n --highlight-neutral-bgColor: fade(@yellow, 30%);\n --page-header-bgColor: @crust;\n --diffBlob-addition-fgColor-text: @text;\n --diffBlob-addition-fgColor-num: @text;\n --diffBlob-addition-bgColor-num: fadeout(@green, 70%);\n --diffBlob-addition-bgColor-line: fadeout(@green, 85%);\n --diffBlob-addition-bgColor-word: fadeout(@green, 70%);\n --diffBlob-deletion-fgColor-text: @text;\n --diffBlob-deletion-fgColor-num: @text;\n --diffBlob-deletion-bgColor-num: fadeout(@red, 70%);\n --diffBlob-deletion-bgColor-line: fadeout(@red, 85%);\n --diffBlob-deletion-bgColor-word: fadeout(@red, 70%);\n --diffBlob-hunk-bgColor-num: fadeout(@accent-color, 60%);\n --diffBlob-expander-iconColor: #848d97;\n --codeMirror-fgColor: @text;\n --codeMirror-bgColor: @base;\n --codeMirror-gutters-bgColor: @base;\n --codeMirror-gutterMarker-fgColor-default: @base;\n --codeMirror-gutterMarker-fgColor-muted: @overlay0;\n --codeMirror-lineNumber-fgColor: @subtext1;\n --codeMirror-cursor-fgColor: @text;\n --codeMirror-selection-bgColor: #388bfd66;\n --codeMirror-activeline-bgColor: #6e768166;\n --codeMirror-matchingBracket-fgColor: @text;\n --codeMirror-lines-bgColor: @base;\n --codeMirror-syntax-fgColor-comment: @overlay0;\n --codeMirror-syntax-fgColor-constant: @blue;\n --codeMirror-syntax-fgColor-entity: @blue;\n --codeMirror-syntax-fgColor-keyword: @pink;\n --codeMirror-syntax-fgColor-storage: @peach;\n --codeMirror-syntax-fgColor-string: @green;\n --codeMirror-syntax-fgColor-support: #79c0ff;\n --codeMirror-syntax-fgColor-variable: @peach;\n --header-fgColor-default: @text;\n --header-fgColor-logo: @text;\n --header-bgColor: @crust;\n --header-borderColor-divider: #8b949e;\n --headerSearch-bgColor: @mantle;\n --headerSearch-borderColor: @surface0;\n --avatar-bgColor: fade(@text, 26%);\n --avatar-borderColor: @surface0;\n --avatar-shadow: 0px 0px 0px 2px #0d1117;\n --avatarStack-fade-bgColor-default: @surface1;\n --avatarStack-fade-bgColor-muted: #21262d;\n --control-bgColor-rest: @red;\n --control-bgColor-hover: #292e36;\n --control-bgColor-active: @surface1;\n --control-bgColor-disabled: fade(@mantle, 60%);\n --control-bgColor-selected: #161b22;\n --control-fgColor-rest: @text;\n --control-fgColor-placeholder: #484f58;\n --control-fgColor-disabled: fade(@subtext0, 70%);\n --control-borderColor-rest: @surface1;\n --control-borderColor-emphasis: #666e79;\n --control-borderColor-disabled: fade(@surface1, 75%);\n --control-borderColor-selected: #f0f6fc;\n --control-borderColor-success: #238636;\n --control-borderColor-danger: #da3633;\n --control-borderColor-warning: #9e6a03;\n --control-iconColor-rest: #848d97;\n --control-transparent-bgColor-rest: #0000;\n --control-transparent-bgColor-hover: fade(@surface2, 20%);\n --control-transparent-bgColor-active: fade(@overlay0, 50%);\n --control-transparent-bgColor-disabled: #21262db3;\n --control-transparent-bgColor-selected: #b1bac414;\n --control-transparent-borderColor-rest: #0000;\n --control-transparent-borderColor-hover: #0000;\n --control-transparent-borderColor-active: #0000;\n --control-danger-fgColor-rest: @red;\n --control-danger-fgColor-hover: @crust;\n --control-danger-bgColor-hover: fade(@red, 80%);\n --control-danger-bgColor-active: @red;\n --control-checked-bgColor-rest: @accent-color;\n --control-checked-bgColor-hover: lighten(@accent-color, 5%);\n --control-checked-bgColor-active: lighten(@accent-color, 5%);\n --control-checked-bgColor-disabled: #6e7681;\n --control-checked-fgColor-rest: @crust;\n --control-checked-fgColor-disabled: #010409;\n --control-checked-borderColor-rest: @accent-color;\n --control-checked-borderColor-hover: @accent-color;\n --control-checked-borderColor-active: @accent-color;\n --control-checked-borderColor-disabled: @surface0;\n --controlTrack-bgColor-rest: @surface0;\n --controlTrack-bgColor-hover: @surface1;\n --controlTrack-bgColor-active: @surface2;\n --controlTrack-bgColor-disabled: #6e7681;\n --controlTrack-fgColor-rest: #848d97;\n --controlTrack-fgColor-disabled: @text;\n --controlTrack-borderColor-rest: #0000;\n --controlTrack-borderColor-disabled: #6e7681;\n --controlKnob-bgColor-rest: @base;\n --controlKnob-bgColor-disabled: #21262db3;\n --controlKnob-bgColor-checked: @text;\n --controlKnob-borderColor-rest: @surface2;\n --controlKnob-borderColor-disabled: #21262db3;\n --controlKnob-borderColor-checked: @blue;\n --button-default-fgColor-rest: @text;\n --button-default-bgColor-rest: @surface0;\n --button-default-bgColor-hover: @surface1;\n --button-default-bgColor-active: @surface2;\n --button-default-bgColor-selected: @surface2;\n --button-default-bgColor-disabled: fade(@surface0, 70%);\n --button-default-borderColor-rest: @surface1;\n --button-default-borderColor-hover: @surface1;\n --button-default-borderColor-active: @surface1;\n --button-default-borderColor-disabled: fade(@surface0, 70%);\n --button-default-shadow-resting: 0px 0px 0px 0px #000;\n --button-primary-fgColor-rest: @base;\n --button-primary-fgColor-disabled: fade(@base, 60%);\n --button-primary-iconColor-rest: @base;\n --button-primary-bgColor-rest: @green;\n --button-primary-bgColor-hover: lighten(@green, 5%);\n --button-primary-bgColor-active: saturate(@green, 5%);\n --button-primary-bgColor-disabled: fade(@green, 70%);\n --button-primary-borderColor-rest: @green;\n --button-primary-borderColor-hover: @green;\n --button-primary-borderColor-active: @green;\n --button-primary-borderColor-disabled: fade(@green, 70%);\n --button-primary-shadow-selected: 0px 0px 0px 0px #000;\n --button-invisible-fgColor-rest: @accent-color;\n --button-invisible-fgColor-hover: lighten(@accent-color, 10%);\n --button-invisible-fgColor-disabled: #6e7681;\n --button-invisible-iconColor-rest: @overlay2;\n --button-invisible-iconColor-hover: #e6edf3;\n --button-invisible-iconColor-disabled: #6e7681;\n --button-invisible-bgColor-rest: #0000;\n --button-invisible-bgColor-hover: #b1bac41f;\n --button-invisible-bgColor-active: #b1bac433;\n --button-invisible-bgColor-disabled: fade(@surface1, 70%);\n --button-invisible-borderColor-rest: #0000;\n --button-invisible-borderColor-hover: #0000;\n --button-invisible-borderColor-disabled: fade(@surface1, 70%);\n --button-outline-fgColor-rest: #388bfd;\n --button-outline-fgColor-hover: #58a6ff;\n --button-outline-fgColor-active: @text;\n --button-outline-fgColor-disabled: #4493f880;\n --button-outline-bgColor-rest: #f0f6fc;\n --button-outline-bgColor-hover: @surface1;\n --button-outline-bgColor-active: #0d419d;\n --button-outline-bgColor-disabled: #0d1117;\n --button-outline-borderColor-hover: #f0f6fc1a;\n --button-outline-borderColor-selected: #f0f6fc1a;\n --button-outline-shadow-selected: 0px 0px 0px 0px #000;\n --button-danger-fgColor-rest: @red;\n --button-danger-fgColor-hover: @base;\n --button-danger-fgColor-active: @base;\n --button-danger-fgColor-disabled: fade(@red, 50%);\n --button-danger-iconColor-rest: @red;\n --button-danger-iconColor-hover: @crust;\n --button-danger-bgColor-rest: @surface0;\n --button-danger-bgColor-hover: @red;\n --button-danger-bgColor-active: darken(@red, 5%);\n --button-danger-bgColor-disabled: @base;\n --button-danger-borderColor-rest: @surface1;\n --button-danger-borderColor-hover: @red;\n --button-danger-borderColor-active: darken(@red, 5%);\n --button-danger-shadow-selected: 0px 0px 0px 0px #000;\n --button-inactive-fgColor: #8b949e;\n --button-inactive-bgColor: #21262d;\n --button-star-iconColor: @yellow;\n --buttonCounter-default-bgColor-rest: @surface1;\n --buttonCounter-invisible-bgColor-rest: @surface1;\n --buttonCounter-primary-bgColor-rest: #04260f33;\n --buttonCounter-outline-bgColor-rest: #051d4d33;\n --buttonCounter-outline-bgColor-hover: #051d4d33;\n --buttonCounter-outline-bgColor-disabled: #1f6feb0d;\n --buttonCounter-outline-fgColor-rest: #388bfd;\n --buttonCounter-outline-fgColor-hover: #58a6ff;\n --buttonCounter-outline-fgColor-disabled: #4493f880;\n --buttonCounter-danger-bgColor-hover: fade(@text, 20%);\n --buttonCounter-danger-bgColor-disabled: #da36330d;\n --buttonCounter-danger-bgColor-rest: #49020233;\n --buttonCounter-danger-fgColor-rest: @red;\n --buttonCounter-danger-fgColor-hover: @text;\n --buttonCounter-danger-fgColor-disabled: fade(@red, 50%);\n --focus-outlineColor: @accent-color;\n --menu-bgColor-active: @mantle;\n --overlay-bgColor: @base;\n --overlay-borderColor: @surface0;\n --overlay-backdrop-bgColor: #161b2266;\n --selectMenu-borderColor: #484f58;\n --selectMenu-bgColor-active: #0c2d6b;\n --sideNav-bgColor-selected: #21262d;\n --skeletonLoader-bgColor: #161b22;\n --timelineBadge-bgColor: @mantle;\n --treeViewItem-leadingVisual-iconColor-rest: #848d97;\n --underlineNav-borderColor-active: @accent-color;\n --underlineNav-borderColor-hover: #6e768166;\n --underlineNav-iconColor-rest: #848d97;\n --selection-bgColor: fade(@accent-color, 30%);\n --reactionButton-selected-bgColor-rest: fade(@accent-color, 20%);\n --reactionButton-selected-bgColor-hover: fade(@accent-color, 35%);\n --reactionButton-selected-fgColor-rest: @accent-color;\n --reactionButton-selected-fgColor-hover: @accent-color;\n --fgColor-default: @text;\n --fgColor-muted: @subtext1;\n --fgColor-onEmphasis: @base;\n --fgColor-white: if(@lookup = latte, @crust, @text);\n --fgColor-disabled: @surface2;\n --fgColor-link: @accent-color;\n --fgColor-neutral: #6e7681;\n --fgColor-accent: @accent-color;\n --fgColor-success: @green;\n --fgColor-attention: @yellow;\n --fgColor-severe: @peach;\n --fgColor-danger: @red;\n --fgColor-open: @green;\n --fgColor-closed: @red;\n --fgColor-done: @mauve;\n --fgColor-sponsors: @pink;\n --bgColor-default: @base;\n --bgColor-muted: @mantle;\n --bgColor-inset: @crust;\n --bgColor-emphasis: @overlay2;\n --bgColor-inverse: @text;\n --bgColor-disabled: #21262db3;\n --bgColor-transparent: #0000;\n --bgColor-neutral-muted: @surface0;\n --bgColor-neutral-emphasis: @subtext0;\n --bgColor-accent-muted: fade(@accent-color, 20%);\n --bgColor-accent-emphasis: @accent-color;\n --bgColor-success-muted: #2ea04326;\n --bgColor-success-emphasis: @green;\n --bgColor-attention-muted: fade(@yellow, 15%);\n --bgColor-attention-emphasis: @yellow;\n --bgColor-severe-muted: fade(@peach, 26%);\n --bgColor-severe-emphasis: @peach;\n --bgColor-danger-muted: fade(@red, 26%);\n --bgColor-danger-emphasis: @red;\n --bgColor-open-muted: #2ea0431a;\n --bgColor-open-emphasis: @green;\n --bgColor-closed-muted: fade(@red, 15%);\n --bgColor-closed-emphasis: @red;\n --bgColor-done-muted: #a371f726;\n --bgColor-done-emphasis: @mauve;\n --bgColor-sponsors-muted: #db61a21a;\n --bgColor-sponsors-emphasis: @pink;\n --borderColor-default: @surface1;\n --borderColor-muted: @surface0;\n --borderColor-emphasis: #484f58;\n --borderColor-disabled: #21262db3;\n --borderColor-transparent: #0000;\n --borderColor-neutral-muted: #6e768166;\n --borderColor-neutral-emphasis: #6e7681;\n --borderColor-accent-muted: fade(@accent-color, 50%);\n --borderColor-accent-emphasis: @accent-color;\n --borderColor-success-muted: darken(@green, 5%);\n --borderColor-success-emphasis: @green;\n --borderColor-attention-muted: fade(@flamingo, 30%);\n --borderColor-attention-emphasis: @flamingo;\n --borderColor-severe-muted: @peach;\n --borderColor-severe-emphasis: #bd561d;\n --borderColor-danger-muted: @red;\n --borderColor-danger-emphasis: @red;\n --borderColor-open-muted: darken(@green, 5%);\n --borderColor-open-emphasis: @green;\n --borderColor-closed-muted: @red;\n --borderColor-closed-emphasis: @red;\n --borderColor-done-muted: @lavender;\n --borderColor-done-emphasis: @mauve;\n --borderColor-sponsors-muted: #db61a266;\n --borderColor-sponsors-emphasis: @pink;\n & when (@lookup =latte) {\n --color-ansi-black: @subtext1;\n --color-ansi-black-bright: @subtext0;\n --color-ansi-gray: @subtext0;\n --color-ansi-white: @surface2;\n --color-ansi-white-bright: @surface1;\n }\n & when not (@lookup =latte) {\n --color-ansi-black: @surface1;\n --color-ansi-black-bright: @surface2;\n --color-ansi-gray: @surface2;\n --color-ansi-white: @subtext1;\n --color-ansi-white-bright: @subtext0;\n }\n --color-ansi-red: @red;\n --color-ansi-red-bright: @red;\n --color-ansi-green: @green;\n --color-ansi-green-bright: @green;\n --color-ansi-yellow: @yellow;\n --color-ansi-yellow-bright: @yellow;\n --color-ansi-blue: @blue;\n --color-ansi-blue-bright: @blue;\n --color-ansi-magenta: @pink;\n --color-ansi-magenta-bright: @pink;\n --color-ansi-cyan: @teal;\n --color-ansi-cyan-bright: @teal;\n --color-prettylights-syntax-comment: @overlay1;\n --color-prettylights-syntax-constant: @blue;\n --color-prettylights-syntax-entity: @blue;\n --color-prettylights-syntax-storage-modifier-import: @peach;\n --color-prettylights-syntax-entity-tag: @teal;\n --color-prettylights-syntax-keyword: @pink;\n --color-prettylights-syntax-string: @green;\n --color-prettylights-syntax-variable: @peach;\n --color-prettylights-syntax-invalid-illegal-text: @red;\n --color-prettylights-syntax-invalid-illegal-bg: fadeout(@red, 85%);\n --color-prettylights-syntax-markup-heading: @teal;\n --color-prettylights-syntax-markup-italic: @yellow;\n --color-prettylights-syntax-markup-bold: @yellow;\n --color-prettylights-syntax-markup-deleted-text: @text;\n --color-prettylights-syntax-markup-deleted-bg: fadeout(@red, 60%);\n --color-prettylights-syntax-markup-inserted-text: @text;\n --color-prettylights-syntax-markup-inserted-bg: fadeout(@green, 60%);\n --color-prettylights-syntax-markup-changed-text: @text;\n --color-prettylights-syntax-markup-changed-bg: fadeout(@yellow, 60%);\n --color-prettylights-syntax-markup-ignored-text: @text;\n --bgColor-white: @base;\n --color-scale-white: @base;\n --color-scale-gray-3: @overlay2;\n --color-scale-gray-5: @overlay0;\n --color-scale-gray-6: @surface1;\n --color-scale-gray-7: @surface1;\n --color-scale-blue-2: @sky;\n --color-scale-blue-5: @blue;\n --color-scale-green-3: @green;\n --color-scale-green-4: @green;\n --color-scale-yellow-3: @peach;\n --color-scale-orange-4: @peach;\n --color-scale-red-4: @red;\n --shadow-inset: inset 0px 1px 0px 0px @crust;\n --shadow-resting-xsmall: 0px 1px 0px 0px @crust;\n --shadow-resting-small: 0px 1px 0px 0px @crust, 0px 1px 3px 0px @crust;\n --shadow-resting-medium: 0px 3px 6px 0px @crust;\n --shadow-floating-small: 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust,\n 0px 6px 18px 0px @crust;\n --shadow-floating-medium: 0px 0px 0px 1px @surface0,\n 0px 8px 16px -4px @crust, 0px 4px 32px -4px @crust,\n 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust;\n --shadow-floating-large: 0px 0px 0px 1px @surface0,\n 0px 24px 48px 0px #010409;\n --shadow-floating-xlarge: 0px 0px 0px 1px @surface0,\n 0px 32px 64px 0px #010409;\n --shadow-floating-legacy: 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust;\n --outline-focus: @blue solid 2px;\n\n .turbo-progress-bar {\n background-color: @accent-color;\n }\n\n .form-select {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n img[src=\"https://github.githubassets.com/assets/mona-loading-default-c3c7aad1282f.gif\"]\n {\n content: url(\"https://giscus.catppuccin.com/assets/loading_48x48.gif\");\n }\n\n /* Header when logged out */\n .HeaderMenu-link {\n color: var(--fgColor-default);\n\n &:hover {\n color: var(--fgColor-default);\n }\n }\n .header-search-button.placeholder {\n color: @subtext0;\n }\n .HeaderMenu-toggle-bar {\n background-color: @text;\n }\n .notification-indicator .mail-status {\n background-image: linear-gradient(\n @accent-color,\n darken(@accent-color, 5%)\n );\n }\n\n .CheckStep {\n .ansifg-r {\n color: var(--color-ansi-red);\n }\n .ansifg-y {\n color: var(--color-ansi-yellow);\n }\n .ansifg-g {\n color: var(--color-ansi-green);\n }\n .ansifg-b {\n color: var(--color-ansi-blue);\n }\n .ansifg-c {\n color: var(--color-ansi-cyan);\n }\n .ansifg-m {\n color: var(--color-ansi-magenta);\n }\n .ansifg-gr {\n color: var(--color-ansi-gray);\n }\n }\n\n .js-activity-overview-graph .js-highlight-blob {\n fill: @accent-color;\n stroke: @accent-color;\n }\n }\n}\n\n@-moz-document url-prefix(\"https://viewscreen.githubusercontent.com/markdown/mermaid\")\n{\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n background-color: @base;\n\n --color-btn-text: @text;\n --color-btn-bg: @surface0;\n --color-btn-border: @surface1;\n --color-btn-hover-bg: @surface1;\n --color-btn-hover-border: @surface2;\n --color-btn-active-bg: @surface2;\n --color-btn-selected-bg: @surface2;\n --color-btn-counter-bg: @surface2;\n --color-btn-outline-text: @accent-color;\n --color-fg-muted: @subtext1;\n\n #diagram {\n .node rect,\n .node circle,\n .node ellipse,\n .node polygon,\n .node path {\n fill: fade(@accent-color, 10%);\n stroke: @accent-color;\n }\n\n .label text,\n span,\n p {\n fill: @text;\n color: @text;\n }\n\n .flowchart-link,\n .marker {\n stroke: @subtext0;\n fill: @subtext0;\n }\n\n .edgeLabel {\n background-color: @crust;\n }\n }\n\n .octicon {\n fill: var(--color-fg-muted) !important;\n }\n }\n}\n\n@-moz-document regexp(\"https:\\/\\/notebooks\\.githubusercontent\\.com\\/view\\/ipynb.*\") {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --jp-border-color0: var(--color-scale-gray-7);\n --jp-border-color1: var(--color-scale-gray-7);\n --jp-border-color2: var(--color-scale-gray-8);\n --jp-border-color3: var(--color-scale-gray-9);\n --jp-ui-font-color0: @text;\n --jp-ui-font-color1: fadeout(@text, 13%);\n --jp-ui-font-color2: fadeout(@text, 46%);\n --jp-ui-font-color3: fadeout(@text, 72%);\n --jp-ui-inverse-font-color0: @crust;\n --jp-ui-inverse-font-color1: fadeout(@crust, 20%);\n --jp-ui-inverse-font-color2: fadeout(@crust, 50%);\n --jp-ui-inverse-font-color3: fadeout(@crust, 70%);\n --jp-content-font-color0: @text;\n --jp-content-font-color1: @text;\n --jp-content-font-color2: fadeout(@text, 30%);\n --jp-content-font-color3: fadeout(@text, 50%);\n --jp-content-link-color: @sapphire;\n --jp-layout-color0: @base !important;\n --jp-layout-color1: var(--color-scale-gray-9);\n --jp-layout-color2: var(--color-scale-gray-8);\n --jp-layout-color3: var(--color-scale-gray-7);\n --jp-layout-color4: var(--color-scale-gray-6);\n --jp-inverse-layout-color0: var(--color-scale-white);\n --jp-inverse-layout-color1: var(--color-scale-white);\n --jp-inverse-layout-color2: var(--color-scale-gray-2);\n --jp-inverse-layout-color3: var(--color-scale-gray-4);\n --jp-inverse-layout-color4: var(--color-scale-gray-6);\n --jp-brand-color0: var(--color-scale-blue-7);\n --jp-brand-color1: var(--color-scale-blue-5);\n --jp-brand-color2: var(--color-scale-blue-3);\n --jp-brand-color3: var(--color-scale-blue-1);\n --jp-brand-color4: var(--color-scale-blue-0);\n --jp-accent-color0: var(--color-scale-green-7);\n --jp-accent-color1: var(--color-scale-green-5);\n --jp-accent-color2: var(--color-scale-green-3);\n --jp-accent-color3: var(--color-scale-green-1);\n --jp-warn-color0: var(--color-scale-orange-7);\n --jp-warn-color1: var(--color-scale-orange-5);\n --jp-warn-color2: var(--color-scale-orange-3);\n --jp-warn-color3: var(--color-scale-orange-1);\n --jp-error-color0: var(--color-scale-red-7);\n --jp-error-color1: var(--color-scale-red-5);\n --jp-error-color2: var(--color-scale-red-3);\n --jp-error-color3: var(--color-scale-red-1);\n --jp-success-color0: var(--color-scale-green-7);\n --jp-success-color1: var(--color-scale-green-5);\n --jp-success-color2: var(--color-scale-green-3);\n --jp-success-color3: var(--color-scale-green-1);\n --jp-info-color0: var(--color-scale-blue-7);\n --jp-info-color1: var(--color-scale-blue-5);\n --jp-info-color2: var(--color-scale-blue-3);\n --jp-info-color3: var(--color-scale-blue-1);\n --jp-cell-editor-border-color: var(--color-scale-gray-7);\n --jp-cell-editor-box-shadow: inset 0 0 2px var(--color-scale-blue-3);\n --jp-cell-prompt-not-active-font-color: fadeout(@text, 50%);\n --jp-cell-inprompt-font-color: var(--color-scale-blue-6);\n --jp-cell-outprompt-font-color: var(--color-scale-coral-6);\n --jp-notebook-multiselected-color: fadeout(@overlay2, 86%);\n --jp-rendermime-error-background: fadeout(@red, 82%);\n --jp-rendermime-table-row-background: var(--color-scale-gray-9);\n --jp-rendermime-table-row-hover-background: fadeout(@surface2, 86%);\n --jp-dialog-background: fadeout(@crust, 40%);\n --jp-toolbar-box-shadow: 0px 0px 2px 0px fadeout(@crust, 20%);\n --jp-input-box-shadow: inset 0 0 2px var(--color-scale-blue-3);\n --jp-input-background: var(--color-scale-gray-8);\n --jp-input-active-box-shadow-color: fadeout(@blue, 70%);\n --jp-editor-selected-focused-background: fadeout(@blue, 86%);\n --jp-mirror-editor-keyword-color: var(--color-scale-green-5);\n --jp-mirror-editor-atom-color: var(--color-scale-blue-3);\n --jp-mirror-editor-number-color: var(--color-scale-green-4);\n --jp-mirror-editor-def-color: var(--color-scale-blue-6);\n --jp-mirror-editor-variable-color: var(--color-scale-gray-3);\n --jp-mirror-editor-variable-2-color: var(--color-scale-blue-4);\n --jp-mirror-editor-variable-3-color: var(--color-scale-green-6);\n --jp-mirror-editor-punctuation-color: var(--color-scale-blue-4);\n --jp-mirror-editor-property-color: var(--color-scale-blue-4);\n --jp-mirror-editor-operator-color: @mauve;\n --jp-mirror-editor-comment-color: @subtext0;\n --jp-mirror-editor-string-color: @peach;\n --jp-mirror-editor-string-2-color: var(--color-scale-purple-3);\n --jp-mirror-editor-meta-color: @mauve;\n --jp-mirror-editor-qualifier-color: var(--color-scale-gray-5);\n --jp-mirror-editor-builtin-color: var(--color-scale-green-6);\n --jp-mirror-editor-bracket-color: var(--color-scale-gray-2);\n --jp-mirror-editor-tag-color: var(--color-scale-blue-7);\n --jp-mirror-editor-attribute-color: var(--color-scale-blue-7);\n --jp-mirror-editor-header-color: var(--color-scale-blue-5);\n --jp-mirror-editor-quote-color: var(--color-scale-green-3);\n --jp-mirror-editor-link-color: var(--color-scale-blue-7);\n --jp-mirror-editor-error-color: @red;\n --jp-mirror-editor-hr-color: var(--color-scale-gray-8);\n --jp-vega-background: var(--color-scale-gray-4);\n --jp-search-selected-match-background-color: @yellow;\n --jp-search-selected-match-color: @crust;\n --jp-icon-contrast-color0: var(--color-scale-purple-6);\n --jp-icon-contrast-color1: var(--color-scale-green-6);\n --jp-icon-contrast-color2: var(--color-scale-pink-6);\n --jp-icon-contrast-color3: var(--color-scale-blue-6);\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name GitHub Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/github\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/github\n@version 1.6.10\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub\n@description Soothing pastel theme for GitHub\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document regexp(\"https:\\/\\/(gist\\.)*github\\.com(?!((\\/.+?\\/.+?\\/commit\\/[A-Fa-f0-9]+\\.(patch|diff)$)|\\/home$|\\/features($|\\/.*)|\\/marketplace($|\\?.*|\\/.*)|\\/organizations\\/plan)).*$\") {\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n html:not([data-light-theme=\"light\"], [data-light-theme=\"dark\"])\n body:not(.logged-out)::after,\n html:not([data-dark-theme=\"dark\"], [data-dark-theme=\"light\"])\n body:not(.logged-out)::after {\n position: fixed;\n top: 0;\n left: 0;\n padding: 1rem;\n margin: 1rem;\n border-radius: 0.5rem;\n max-width: 40ch;\n background-color: var(--color-danger-fg);\n color: var(--color-header-bg);\n content: \"Unsupported GitHub theme detected! Please switch to the default light/dark theme via the GitHub Appearance settings to get the best experience for the Catppuccin GitHub userstyle.\";\n z-index: 9999;\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n .cm-placeholder {\n color: @subtext0;\n }\n\n accent-color: @accent-color;\n color: @text;\n\n --color-social-reaction-bg-reacted-hover: fade(@accent-color, 30%);\n --color-notifications-button-hover-bg: fade(@accent-color, 60%);\n --color-workflow-card-header-shadow: rgba(27, 31, 35, 0.04);\n --color-icon-directory: var(--fgColor-muted, var(--color-fg-muted));\n --color-calendar-halloween-graph-day-L1-bg: fadeout(\n @accent-color,\n 60%\n ) !important;\n --color-calendar-halloween-graph-day-L2-bg: fadeout(\n @accent-color,\n 40%\n ) !important;\n --color-calendar-halloween-graph-day-L3-bg: fadeout(\n @accent-color,\n 20%\n ) !important;\n --color-calendar-halloween-graph-day-L4-bg: @accent-color !important;\n --color-calendar-winter-graph-day-L1-bg: fadeout(\n @accent-color,\n 60%\n ) !important;\n --color-calendar-winter-graph-day-L2-bg: fadeout(\n @accent-color,\n 40%\n ) !important;\n --color-calendar-winter-graph-day-L3-bg: fadeout(\n @accent-color,\n 20%\n ) !important;\n --color-calendar-winter-graph-day-L4-bg: @accent-color !important;\n --color-calendar-graph-day-bg: @surface0 !important;\n --color-calendar-graph-day-border: transparent !important;\n --color-calendar-graph-day-L1-bg: fadeout(@accent-color, 60%) !important;\n --color-calendar-graph-day-L2-bg: fadeout(@accent-color, 40%) !important;\n --color-calendar-graph-day-L3-bg: fadeout(@accent-color, 20%) !important;\n --color-calendar-graph-day-L4-bg: @accent-color !important;\n --color-calendar-graph-day-L2-border: transparent !important;\n --color-calendar-graph-day-L3-border: transparent !important;\n --color-calendar-graph-day-L4-border: transparent !important;\n --color-user-mention-fg: @accent-color;\n --color-user-mention-bg: fade(@accent-color, 30%);\n --color-dashboard-feed-bg: var(--color-scale-gray-9);\n --color-mktg-btn-shadow-outline: rgba(255, 255, 255, 0.25) 0 0 0 1px inset;\n --color-marketing-icon-secondary: var(--color-scale-blue-5);\n --color-project-header-bg: var(--color-scale-gray-9);\n --color-project-sidebar-bg: var(--color-scale-gray-8);\n --color-project-gradient-in: var(--color-scale-gray-8);\n --color-project-gradient-out: rgba(22, 27, 34, 0);\n --color-diff-blob-selected-line-highlight-mix-blend-mode: screen;\n --topicTag-borderColor: #0000;\n --highlight-neutral-bgColor: fade(@yellow, 30%);\n --page-header-bgColor: @crust;\n --diffBlob-addition-fgColor-text: @text;\n --diffBlob-addition-fgColor-num: @text;\n --diffBlob-addition-bgColor-num: fadeout(@green, 70%);\n --diffBlob-addition-bgColor-line: fadeout(@green, 85%);\n --diffBlob-addition-bgColor-word: fadeout(@green, 70%);\n --diffBlob-deletion-fgColor-text: @text;\n --diffBlob-deletion-fgColor-num: @text;\n --diffBlob-deletion-bgColor-num: fadeout(@red, 70%);\n --diffBlob-deletion-bgColor-line: fadeout(@red, 85%);\n --diffBlob-deletion-bgColor-word: fadeout(@red, 70%);\n --diffBlob-hunk-bgColor-num: fadeout(@accent-color, 60%);\n --diffBlob-expander-iconColor: #848d97;\n --codeMirror-fgColor: @text;\n --codeMirror-bgColor: @base;\n --codeMirror-gutters-bgColor: @base;\n --codeMirror-gutterMarker-fgColor-default: @base;\n --codeMirror-gutterMarker-fgColor-muted: @overlay0;\n --codeMirror-lineNumber-fgColor: @subtext1;\n --codeMirror-cursor-fgColor: @text;\n --codeMirror-selection-bgColor: #388bfd66;\n --codeMirror-activeline-bgColor: #6e768166;\n --codeMirror-matchingBracket-fgColor: @text;\n --codeMirror-lines-bgColor: @base;\n --codeMirror-syntax-fgColor-comment: @overlay0;\n --codeMirror-syntax-fgColor-constant: @blue;\n --codeMirror-syntax-fgColor-entity: @blue;\n --codeMirror-syntax-fgColor-keyword: @pink;\n --codeMirror-syntax-fgColor-storage: @peach;\n --codeMirror-syntax-fgColor-string: @green;\n --codeMirror-syntax-fgColor-support: #79c0ff;\n --codeMirror-syntax-fgColor-variable: @peach;\n --header-fgColor-default: @text;\n --header-fgColor-logo: @text;\n --header-bgColor: @crust;\n --header-borderColor-divider: #8b949e;\n --headerSearch-bgColor: @mantle;\n --headerSearch-borderColor: @surface0;\n --avatar-bgColor: fade(@text, 26%);\n --avatar-borderColor: @surface0;\n --avatar-shadow: 0px 0px 0px 2px #0d1117;\n --avatarStack-fade-bgColor-default: @surface1;\n --avatarStack-fade-bgColor-muted: #21262d;\n --control-bgColor-rest: @red;\n --control-bgColor-hover: #292e36;\n --control-bgColor-active: @surface1;\n --control-bgColor-disabled: fade(@mantle, 60%);\n --control-bgColor-selected: #161b22;\n --control-fgColor-rest: @text;\n --control-fgColor-placeholder: #484f58;\n --control-fgColor-disabled: fade(@subtext0, 70%);\n --control-borderColor-rest: @surface1;\n --control-borderColor-emphasis: #666e79;\n --control-borderColor-disabled: fade(@surface1, 75%);\n --control-borderColor-selected: #f0f6fc;\n --control-borderColor-success: @green;\n --control-borderColor-danger: @red;\n --control-borderColor-warning: @yellow;\n --control-iconColor-rest: #848d97;\n --control-transparent-bgColor-rest: #0000;\n --control-transparent-bgColor-hover: fade(@surface2, 20%);\n --control-transparent-bgColor-active: fade(@overlay0, 50%);\n --control-transparent-bgColor-disabled: #21262db3;\n --control-transparent-bgColor-selected: #b1bac414;\n --control-transparent-borderColor-rest: #0000;\n --control-transparent-borderColor-hover: #0000;\n --control-transparent-borderColor-active: #0000;\n --control-danger-fgColor-rest: @red;\n --control-danger-fgColor-hover: @crust;\n --control-danger-bgColor-hover: fade(@red, 80%);\n --control-danger-bgColor-active: @red;\n --control-checked-bgColor-rest: @accent-color;\n --control-checked-bgColor-hover: lighten(@accent-color, 5%);\n --control-checked-bgColor-active: lighten(@accent-color, 5%);\n --control-checked-bgColor-disabled: #6e7681;\n --control-checked-fgColor-rest: @crust;\n --control-checked-fgColor-disabled: #010409;\n --control-checked-borderColor-rest: @accent-color;\n --control-checked-borderColor-hover: @accent-color;\n --control-checked-borderColor-active: @accent-color;\n --control-checked-borderColor-disabled: @surface0;\n --controlTrack-bgColor-rest: @surface0;\n --controlTrack-bgColor-hover: @surface1;\n --controlTrack-bgColor-active: @surface2;\n --controlTrack-bgColor-disabled: #6e7681;\n --controlTrack-fgColor-rest: #848d97;\n --controlTrack-fgColor-disabled: @text;\n --controlTrack-borderColor-rest: #0000;\n --controlTrack-borderColor-disabled: #6e7681;\n --controlKnob-bgColor-rest: @base;\n --controlKnob-bgColor-disabled: #21262db3;\n --controlKnob-bgColor-checked: @text;\n --controlKnob-borderColor-rest: @surface2;\n --controlKnob-borderColor-disabled: #21262db3;\n --controlKnob-borderColor-checked: @blue;\n --button-default-fgColor-rest: @text;\n --button-default-bgColor-rest: @surface0;\n --button-default-bgColor-hover: @surface1;\n --button-default-bgColor-active: @surface2;\n --button-default-bgColor-selected: @surface2;\n --button-default-bgColor-disabled: fade(@surface0, 70%);\n --button-default-borderColor-rest: @surface1;\n --button-default-borderColor-hover: @surface1;\n --button-default-borderColor-active: @surface1;\n --button-default-borderColor-disabled: fade(@surface0, 70%);\n --button-default-shadow-resting: 0px 0px 0px 0px #000;\n --button-primary-fgColor-rest: @base;\n --button-primary-fgColor-disabled: fade(@base, 60%);\n --button-primary-iconColor-rest: @base;\n --button-primary-bgColor-rest: @green;\n --button-primary-bgColor-hover: lighten(@green, 5%);\n --button-primary-bgColor-active: saturate(@green, 5%);\n --button-primary-bgColor-disabled: fade(@green, 70%);\n --button-primary-borderColor-rest: @green;\n --button-primary-borderColor-hover: @green;\n --button-primary-borderColor-active: @green;\n --button-primary-borderColor-disabled: fade(@green, 70%);\n --button-primary-shadow-selected: 0px 0px 0px 0px #000;\n --button-invisible-fgColor-rest: @accent-color;\n --button-invisible-fgColor-hover: lighten(@accent-color, 10%);\n --button-invisible-fgColor-disabled: #6e7681;\n --button-invisible-iconColor-rest: @overlay2;\n --button-invisible-iconColor-hover: #e6edf3;\n --button-invisible-iconColor-disabled: #6e7681;\n --button-invisible-bgColor-rest: #0000;\n --button-invisible-bgColor-hover: #b1bac41f;\n --button-invisible-bgColor-active: #b1bac433;\n --button-invisible-bgColor-disabled: fade(@surface1, 70%);\n --button-invisible-borderColor-rest: #0000;\n --button-invisible-borderColor-hover: #0000;\n --button-invisible-borderColor-disabled: fade(@surface1, 70%);\n --button-outline-fgColor-rest: #388bfd;\n --button-outline-fgColor-hover: #58a6ff;\n --button-outline-fgColor-active: @text;\n --button-outline-fgColor-disabled: #4493f880;\n --button-outline-bgColor-rest: #f0f6fc;\n --button-outline-bgColor-hover: @surface1;\n --button-outline-bgColor-active: #0d419d;\n --button-outline-bgColor-disabled: #0d1117;\n --button-outline-borderColor-hover: #f0f6fc1a;\n --button-outline-borderColor-selected: #f0f6fc1a;\n --button-outline-shadow-selected: 0px 0px 0px 0px #000;\n --button-danger-fgColor-rest: @red;\n --button-danger-fgColor-hover: @base;\n --button-danger-fgColor-active: @base;\n --button-danger-fgColor-disabled: fade(@red, 50%);\n --button-danger-iconColor-rest: @red;\n --button-danger-iconColor-hover: @crust;\n --button-danger-bgColor-rest: @surface0;\n --button-danger-bgColor-hover: @red;\n --button-danger-bgColor-active: darken(@red, 5%);\n --button-danger-bgColor-disabled: @base;\n --button-danger-borderColor-rest: @surface1;\n --button-danger-borderColor-hover: @red;\n --button-danger-borderColor-active: darken(@red, 5%);\n --button-danger-shadow-selected: 0px 0px 0px 0px #000;\n --button-inactive-fgColor: #8b949e;\n --button-inactive-bgColor: #21262d;\n --button-star-iconColor: @yellow;\n --buttonCounter-default-bgColor-rest: @surface1;\n --buttonCounter-invisible-bgColor-rest: @surface1;\n --buttonCounter-primary-bgColor-rest: #04260f33;\n --buttonCounter-outline-bgColor-rest: #051d4d33;\n --buttonCounter-outline-bgColor-hover: #051d4d33;\n --buttonCounter-outline-bgColor-disabled: #1f6feb0d;\n --buttonCounter-outline-fgColor-rest: #388bfd;\n --buttonCounter-outline-fgColor-hover: #58a6ff;\n --buttonCounter-outline-fgColor-disabled: #4493f880;\n --buttonCounter-danger-bgColor-hover: fade(@text, 20%);\n --buttonCounter-danger-bgColor-disabled: #da36330d;\n --buttonCounter-danger-bgColor-rest: #49020233;\n --buttonCounter-danger-fgColor-rest: @red;\n --buttonCounter-danger-fgColor-hover: @text;\n --buttonCounter-danger-fgColor-disabled: fade(@red, 50%);\n --focus-outlineColor: @accent-color;\n --menu-bgColor-active: @mantle;\n --overlay-bgColor: @base;\n --overlay-borderColor: @surface0;\n --overlay-backdrop-bgColor: #161b2266;\n --selectMenu-borderColor: #484f58;\n --selectMenu-bgColor-active: #0c2d6b;\n --sideNav-bgColor-selected: #21262d;\n --skeletonLoader-bgColor: #161b22;\n --timelineBadge-bgColor: @mantle;\n --treeViewItem-leadingVisual-iconColor-rest: #848d97;\n --underlineNav-borderColor-active: @accent-color;\n --underlineNav-borderColor-hover: #6e768166;\n --underlineNav-iconColor-rest: #848d97;\n --selection-bgColor: fade(@accent-color, 30%);\n --reactionButton-selected-bgColor-rest: fade(@accent-color, 20%);\n --reactionButton-selected-bgColor-hover: fade(@accent-color, 35%);\n --reactionButton-selected-fgColor-rest: @accent-color;\n --reactionButton-selected-fgColor-hover: @accent-color;\n --fgColor-default: @text;\n --fgColor-muted: @subtext1;\n --fgColor-onEmphasis: @base;\n --fgColor-white: if(@lookup = latte, @crust, @text);\n --fgColor-disabled: @surface2;\n --fgColor-link: @accent-color;\n --fgColor-neutral: #6e7681;\n --fgColor-accent: @accent-color;\n --fgColor-success: @green;\n --fgColor-attention: @yellow;\n --fgColor-severe: @peach;\n --fgColor-danger: @red;\n --fgColor-open: @green;\n --fgColor-closed: @red;\n --fgColor-done: @mauve;\n --fgColor-sponsors: @pink;\n --bgColor-default: @base;\n --bgColor-muted: @mantle;\n --bgColor-inset: @crust;\n --bgColor-emphasis: @overlay2;\n --bgColor-inverse: @text;\n --bgColor-disabled: #21262db3;\n --bgColor-transparent: #0000;\n --bgColor-neutral-muted: fade(@surface0, 40%);\n --bgColor-neutral-emphasis: @subtext0;\n --bgColor-accent-muted: fade(@accent-color, 20%);\n --bgColor-accent-emphasis: @accent-color;\n --bgColor-success-muted: #2ea04326;\n --bgColor-success-emphasis: @green;\n --bgColor-attention-muted: fade(@yellow, 15%);\n --bgColor-attention-emphasis: @yellow;\n --bgColor-severe-muted: fade(@peach, 26%);\n --bgColor-severe-emphasis: @peach;\n --bgColor-danger-muted: fade(@red, 26%);\n --bgColor-danger-emphasis: @red;\n --bgColor-open-muted: #2ea0431a;\n --bgColor-open-emphasis: @green;\n --bgColor-closed-muted: fade(@red, 15%);\n --bgColor-closed-emphasis: @red;\n --bgColor-done-muted: #a371f726;\n --bgColor-done-emphasis: @mauve;\n --bgColor-sponsors-muted: #db61a21a;\n --bgColor-sponsors-emphasis: @pink;\n --borderColor-default: @surface1;\n --borderColor-muted: @surface0;\n --borderColor-emphasis: #484f58;\n --borderColor-disabled: #21262db3;\n --borderColor-transparent: #0000;\n --borderColor-neutral-muted: #6e768166;\n --borderColor-neutral-emphasis: #6e7681;\n --borderColor-accent-muted: fade(@accent-color, 50%);\n --borderColor-accent-emphasis: @accent-color;\n --borderColor-success-muted: darken(@green, 5%);\n --borderColor-success-emphasis: @green;\n --borderColor-attention-muted: fade(@flamingo, 30%);\n --borderColor-attention-emphasis: @flamingo;\n --borderColor-severe-muted: @peach;\n --borderColor-severe-emphasis: #bd561d;\n --borderColor-danger-muted: @red;\n --borderColor-danger-emphasis: @red;\n --borderColor-open-muted: darken(@green, 5%);\n --borderColor-open-emphasis: @green;\n --borderColor-closed-muted: @red;\n --borderColor-closed-emphasis: @red;\n --borderColor-done-muted: @lavender;\n --borderColor-done-emphasis: @mauve;\n --borderColor-sponsors-muted: #db61a266;\n --borderColor-sponsors-emphasis: @pink;\n & when (@lookup =latte) {\n --color-ansi-black: @subtext1;\n --color-ansi-black-bright: @subtext0;\n --color-ansi-gray: @subtext0;\n --color-ansi-white: @surface2;\n --color-ansi-white-bright: @surface1;\n }\n & when not (@lookup =latte) {\n --color-ansi-black: @surface1;\n --color-ansi-black-bright: @surface2;\n --color-ansi-gray: @surface2;\n --color-ansi-white: @subtext1;\n --color-ansi-white-bright: @subtext0;\n }\n --color-ansi-red: @red;\n --color-ansi-red-bright: @red;\n --color-ansi-green: @green;\n --color-ansi-green-bright: @green;\n --color-ansi-yellow: @yellow;\n --color-ansi-yellow-bright: @yellow;\n --color-ansi-blue: @blue;\n --color-ansi-blue-bright: @blue;\n --color-ansi-magenta: @pink;\n --color-ansi-magenta-bright: @pink;\n --color-ansi-cyan: @teal;\n --color-ansi-cyan-bright: @teal;\n --color-prettylights-syntax-comment: @overlay1;\n --color-prettylights-syntax-constant: @blue;\n --color-prettylights-syntax-entity: @blue;\n --color-prettylights-syntax-storage-modifier-import: @peach;\n --color-prettylights-syntax-entity-tag: @teal;\n --color-prettylights-syntax-keyword: @pink;\n --color-prettylights-syntax-string: @green;\n --color-prettylights-syntax-variable: @peach;\n --color-prettylights-syntax-invalid-illegal-text: @red;\n --color-prettylights-syntax-invalid-illegal-bg: fadeout(@red, 85%);\n --color-prettylights-syntax-markup-heading: @teal;\n --color-prettylights-syntax-markup-italic: @yellow;\n --color-prettylights-syntax-markup-bold: @yellow;\n --color-prettylights-syntax-markup-deleted-text: @text;\n --color-prettylights-syntax-markup-deleted-bg: fadeout(@red, 60%);\n --color-prettylights-syntax-markup-inserted-text: @text;\n --color-prettylights-syntax-markup-inserted-bg: fadeout(@green, 60%);\n --color-prettylights-syntax-markup-changed-text: @text;\n --color-prettylights-syntax-markup-changed-bg: fadeout(@yellow, 60%);\n --color-prettylights-syntax-markup-ignored-text: @text;\n --bgColor-white: @base;\n --color-scale-white: @base;\n --color-scale-gray-3: @overlay2;\n --color-scale-gray-5: @overlay0;\n --color-scale-gray-6: @surface1;\n --color-scale-gray-7: @surface1;\n --color-scale-blue-2: @sky;\n --color-scale-blue-5: @blue;\n --color-scale-green-3: @green;\n --color-scale-green-4: @green;\n --color-scale-yellow-3: @peach;\n --color-scale-orange-4: @peach;\n --color-scale-red-4: @red;\n --shadow-inset: inset 0px 1px 0px 0px @crust;\n --shadow-resting-xsmall: 0px 1px 0px 0px @crust;\n --shadow-resting-small: 0px 1px 0px 0px @crust, 0px 1px 3px 0px @crust;\n --shadow-resting-medium: 0px 3px 6px 0px @crust;\n --shadow-floating-small: 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust,\n 0px 6px 18px 0px @crust;\n --shadow-floating-medium: 0px 0px 0px 1px @surface0,\n 0px 8px 16px -4px @crust, 0px 4px 32px -4px @crust,\n 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust;\n --shadow-floating-large: 0px 0px 0px 1px @surface0,\n 0px 24px 48px 0px #010409;\n --shadow-floating-xlarge: 0px 0px 0px 1px @surface0,\n 0px 32px 64px 0px #010409;\n --shadow-floating-legacy: 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust;\n --outline-focus: @blue solid 2px;\n\n .turbo-progress-bar {\n background-color: @accent-color;\n }\n\n .form-select {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n img[src=\"https://github.githubassets.com/assets/mona-loading-default-c3c7aad1282f.gif\"]\n {\n content: url(\"https://giscus.catppuccin.com/assets/loading_48x48.gif\");\n }\n\n /* Header when logged out */\n .HeaderMenu-link {\n color: var(--fgColor-default);\n\n &:hover {\n color: var(--fgColor-default);\n }\n }\n .header-search-button.placeholder {\n color: @subtext0;\n }\n .HeaderMenu-toggle-bar {\n background-color: @text;\n }\n .notification-indicator .mail-status {\n background-image: linear-gradient(\n @accent-color,\n darken(@accent-color, 5%)\n );\n }\n\n .CheckStep {\n .ansifg-r {\n color: var(--color-ansi-red);\n }\n .ansifg-y {\n color: var(--color-ansi-yellow);\n }\n .ansifg-g {\n color: var(--color-ansi-green);\n }\n .ansifg-b {\n color: var(--color-ansi-blue);\n }\n .ansifg-c {\n color: var(--color-ansi-cyan);\n }\n .ansifg-m {\n color: var(--color-ansi-magenta);\n }\n .ansifg-gr {\n color: var(--color-ansi-gray);\n }\n }\n\n .js-activity-overview-graph .js-highlight-blob {\n fill: @accent-color;\n stroke: @accent-color;\n }\n }\n}\n\n@-moz-document url-prefix(\"https://viewscreen.githubusercontent.com/markdown/mermaid\")\n{\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n background-color: @base;\n\n --color-btn-text: @text;\n --color-btn-bg: @surface0;\n --color-btn-border: @surface1;\n --color-btn-hover-bg: @surface1;\n --color-btn-hover-border: @surface2;\n --color-btn-active-bg: @surface2;\n --color-btn-selected-bg: @surface2;\n --color-btn-counter-bg: @surface2;\n --color-btn-outline-text: @accent-color;\n --color-fg-muted: @subtext1;\n\n #diagram {\n .node rect,\n .node circle,\n .node ellipse,\n .node polygon,\n .node path {\n fill: fade(@accent-color, 10%);\n stroke: @accent-color;\n }\n\n .label text,\n span,\n p {\n fill: @text;\n color: @text;\n }\n\n .flowchart-link,\n .marker {\n stroke: @subtext0;\n fill: @subtext0;\n }\n\n .edgeLabel {\n background-color: @crust;\n }\n }\n\n .octicon {\n fill: var(--color-fg-muted) !important;\n }\n }\n}\n\n@-moz-document regexp(\"https:\\/\\/notebooks\\.githubusercontent\\.com\\/view\\/ipynb.*\") {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --jp-border-color0: var(--color-scale-gray-7);\n --jp-border-color1: var(--color-scale-gray-7);\n --jp-border-color2: var(--color-scale-gray-8);\n --jp-border-color3: var(--color-scale-gray-9);\n --jp-ui-font-color0: @text;\n --jp-ui-font-color1: fadeout(@text, 13%);\n --jp-ui-font-color2: fadeout(@text, 46%);\n --jp-ui-font-color3: fadeout(@text, 72%);\n --jp-ui-inverse-font-color0: @crust;\n --jp-ui-inverse-font-color1: fadeout(@crust, 20%);\n --jp-ui-inverse-font-color2: fadeout(@crust, 50%);\n --jp-ui-inverse-font-color3: fadeout(@crust, 70%);\n --jp-content-font-color0: @text;\n --jp-content-font-color1: @text;\n --jp-content-font-color2: fadeout(@text, 30%);\n --jp-content-font-color3: fadeout(@text, 50%);\n --jp-content-link-color: @sapphire;\n --jp-layout-color0: @base !important;\n --jp-layout-color1: var(--color-scale-gray-9);\n --jp-layout-color2: var(--color-scale-gray-8);\n --jp-layout-color3: var(--color-scale-gray-7);\n --jp-layout-color4: var(--color-scale-gray-6);\n --jp-inverse-layout-color0: var(--color-scale-white);\n --jp-inverse-layout-color1: var(--color-scale-white);\n --jp-inverse-layout-color2: var(--color-scale-gray-2);\n --jp-inverse-layout-color3: var(--color-scale-gray-4);\n --jp-inverse-layout-color4: var(--color-scale-gray-6);\n --jp-brand-color0: var(--color-scale-blue-7);\n --jp-brand-color1: var(--color-scale-blue-5);\n --jp-brand-color2: var(--color-scale-blue-3);\n --jp-brand-color3: var(--color-scale-blue-1);\n --jp-brand-color4: var(--color-scale-blue-0);\n --jp-accent-color0: var(--color-scale-green-7);\n --jp-accent-color1: var(--color-scale-green-5);\n --jp-accent-color2: var(--color-scale-green-3);\n --jp-accent-color3: var(--color-scale-green-1);\n --jp-warn-color0: var(--color-scale-orange-7);\n --jp-warn-color1: var(--color-scale-orange-5);\n --jp-warn-color2: var(--color-scale-orange-3);\n --jp-warn-color3: var(--color-scale-orange-1);\n --jp-error-color0: var(--color-scale-red-7);\n --jp-error-color1: var(--color-scale-red-5);\n --jp-error-color2: var(--color-scale-red-3);\n --jp-error-color3: var(--color-scale-red-1);\n --jp-success-color0: var(--color-scale-green-7);\n --jp-success-color1: var(--color-scale-green-5);\n --jp-success-color2: var(--color-scale-green-3);\n --jp-success-color3: var(--color-scale-green-1);\n --jp-info-color0: var(--color-scale-blue-7);\n --jp-info-color1: var(--color-scale-blue-5);\n --jp-info-color2: var(--color-scale-blue-3);\n --jp-info-color3: var(--color-scale-blue-1);\n --jp-cell-editor-border-color: var(--color-scale-gray-7);\n --jp-cell-editor-box-shadow: inset 0 0 2px var(--color-scale-blue-3);\n --jp-cell-prompt-not-active-font-color: fadeout(@text, 50%);\n --jp-cell-inprompt-font-color: var(--color-scale-blue-6);\n --jp-cell-outprompt-font-color: var(--color-scale-coral-6);\n --jp-notebook-multiselected-color: fadeout(@overlay2, 86%);\n --jp-rendermime-error-background: fadeout(@red, 82%);\n --jp-rendermime-table-row-background: var(--color-scale-gray-9);\n --jp-rendermime-table-row-hover-background: fadeout(@surface2, 86%);\n --jp-dialog-background: fadeout(@crust, 40%);\n --jp-toolbar-box-shadow: 0px 0px 2px 0px fadeout(@crust, 20%);\n --jp-input-box-shadow: inset 0 0 2px var(--color-scale-blue-3);\n --jp-input-background: var(--color-scale-gray-8);\n --jp-input-active-box-shadow-color: fadeout(@blue, 70%);\n --jp-editor-selected-focused-background: fadeout(@blue, 86%);\n --jp-mirror-editor-keyword-color: var(--color-scale-green-5);\n --jp-mirror-editor-atom-color: var(--color-scale-blue-3);\n --jp-mirror-editor-number-color: var(--color-scale-green-4);\n --jp-mirror-editor-def-color: var(--color-scale-blue-6);\n --jp-mirror-editor-variable-color: var(--color-scale-gray-3);\n --jp-mirror-editor-variable-2-color: var(--color-scale-blue-4);\n --jp-mirror-editor-variable-3-color: var(--color-scale-green-6);\n --jp-mirror-editor-punctuation-color: var(--color-scale-blue-4);\n --jp-mirror-editor-property-color: var(--color-scale-blue-4);\n --jp-mirror-editor-operator-color: @mauve;\n --jp-mirror-editor-comment-color: @subtext0;\n --jp-mirror-editor-string-color: @peach;\n --jp-mirror-editor-string-2-color: var(--color-scale-purple-3);\n --jp-mirror-editor-meta-color: @mauve;\n --jp-mirror-editor-qualifier-color: var(--color-scale-gray-5);\n --jp-mirror-editor-builtin-color: var(--color-scale-green-6);\n --jp-mirror-editor-bracket-color: var(--color-scale-gray-2);\n --jp-mirror-editor-tag-color: var(--color-scale-blue-7);\n --jp-mirror-editor-attribute-color: var(--color-scale-blue-7);\n --jp-mirror-editor-header-color: var(--color-scale-blue-5);\n --jp-mirror-editor-quote-color: var(--color-scale-green-3);\n --jp-mirror-editor-link-color: var(--color-scale-blue-7);\n --jp-mirror-editor-error-color: @red;\n --jp-mirror-editor-hr-color: var(--color-scale-gray-8);\n --jp-vega-background: var(--color-scale-gray-4);\n --jp-search-selected-match-background-color: @yellow;\n --jp-search-selected-match-color: @crust;\n --jp-icon-contrast-color0: var(--color-scale-purple-6);\n --jp-icon-contrast-color1: var(--color-scale-green-6);\n --jp-icon-contrast-color2: var(--color-scale-pink-6);\n --jp-icon-contrast-color3: var(--color-scale-blue-6);\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "GitHub Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/github",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/github",
- "version": "1.6.8",
+ "version": "1.6.10",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub",
"description": "Soothing pastel theme for GitHub",
@@ -989,12 +989,12 @@
"author": "Catppuccin",
"description": "Soothing pastel theme for GitHub",
"name": "GitHub Catppuccin",
- "updateDate": 1715527468599,
+ "updateDate": 1716187649353,
"_id": "942b2272-4772-41b7-b97c-848a6b3b1d85",
- "_rev": 1715537662076,
+ "_rev": 1716187649507,
"id": 5,
- "originalDigest": "433e7e489a39360bfebc230464e8a9062bf6d03f",
- "etag": "W/\"b217b1e5c1899bad405b7cb04026ef4e694fa819a8b5ea14c1053f10b580c72c\""
+ "originalDigest": "2b8e8258ef6310232bcc0ce5e858e6cb14a67519",
+ "etag": "W/\"692402ec3bf2366c92a89b2494332ca7e354899cd92b89e8bcd59075d4e61b62\""
},
{
"enabled": true,
@@ -1006,12 +1006,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name Proton Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/proton\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/proton\n@version 0.1.6\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aproton\n@description Soothing pastel theme for Proton\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document regexp(\"https://(account|mail|drive|calendar).proton.me/.*$\")\n{\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n svg.logo {\n @accentH: hue(@accent-color);\n @protonH: hue(#6d4aff);\n\n .replaceColor(@org, @property) {\n &[@{property}=\"@{org}\"] {\n @hDiff: @protonH - hue(@org);\n @{property}: hsl(\n @accentH - @hDiff,\n saturation(@org) - 30%,\n lightness(@org)\n );\n }\n }\n\n /* prettier-ignore */\n > path {\n .replaceColor(#B8D7FF, fill);\n .replaceColor(#8F69FF, fill);\n }\n\n /* prettier-ignore */\n > defs stop {\n .replaceColor(#E3D9FF, stop-color);\n .replaceColor(#7341FF, stop-color);\n .replaceColor(#6D4AFF, stop-color);\n .replaceColor(#AA8EFF, stop-color);\n .replaceColor(#06B8FF, stop-color);\n .replaceColor(#BFE8FF, stop-color);\n .replaceColor(#BFABFF, stop-color);\n .replaceColor(#FF50C3, stop-color);\n .replaceColor(#B487FF, stop-color);\n .replaceColor(#FFC8FF, stop-color);\n .replaceColor(#8EFFEE, stop-color);\n .replaceColor(#C9C7FF, stop-color);\n .replaceColor(#00F0C3, stop-color);\n .replaceColor(#FFD580, stop-color);\n .replaceColor(#F6C592, stop-color);\n .replaceColor(#EBB6A2, stop-color);\n .replaceColor(#DFA5AF, stop-color);\n .replaceColor(#D397BE, stop-color);\n .replaceColor(#C486CB, stop-color);\n .replaceColor(#B578D9, stop-color);\n .replaceColor(#A166E5, stop-color);\n .replaceColor(#8B57F2, stop-color);\n .replaceColor(#704CFF, stop-color);\n .replaceColor(#B39FFB, stop-color);\n .replaceColor(#FFE8DB, stop-color);\n }\n }\n\n &,\n .ui-prominent,\n .ui-standard {\n #lightenOrDarken(@color, @value) {\n @result: if(\n @lookup=latte,\n lighten(@color, @value),\n darken(@color, @value)\n );\n }\n\n --primary: @accent-color;\n --primary-contrast: @mantle;\n --signal-danger-minor-2: #lightenOrDarken(@maroon, 40%) [ @result];\n --signal-danger-minor-1: #lightenOrDarken(@maroon, 30%) [ @result];\n --signal-danger: @maroon;\n --signal-danger-major-1: saturate(@maroon, 40%);\n --signal-danger-major-2: saturate(@maroon, 30%);\n --signal-danger-major-3: saturate(@maroon, 20%);\n --signal-danger-contrast: @mantle;\n --signal-warning-minor-2: #lightenOrDarken(@peach, 40%) [ @result];\n --signal-warning-minor-1: #lightenOrDarken(@peach, 30%) [ @result];\n --signal-warning: @peach;\n --signal-warning-major-1: saturate(@peach, 40%);\n --signal-warning-major-2: saturate(@peach, 30%);\n --signal-warning-major-3: saturate(@peach, 20%);\n --signal-warning-contrast: @mantle;\n --signal-success-minor-2: #lightenOrDarken(@green, 40%) [ @result];\n --signal-success-minor-1: #lightenOrDarken(@green, 30%) [ @result];\n --signal-success: @green;\n --signal-success-major-1: saturate(@green, 40%);\n --signal-success-major-2: saturate(@green, 30%);\n --signal-success-major-3: saturate(@green, 20%);\n --signal-success-contrast: @mantle;\n --signal-info-minor-2: #lightenOrDarken(@blue, 40%) [ @result];\n --signal-info-minor-1: #lightenOrDarken(@blue, 30%) [ @result];\n --signal-info: @blue;\n --signal-info-major-1: saturate(@blue, 40%);\n --signal-info-major-2: saturate(@blue, 30%);\n --signal-info-major-3: saturate(@blue, 20%);\n --signal-info-contrast: @mantle;\n --interaction-norm-minor-2: #lightenOrDarken(@accent-color, 40%) [\n @result];\n --interaction-norm-minor-1: #lightenOrDarken(@accent-color, 30%) [\n @result];\n --interaction-norm: @accent-color;\n --interaction-norm-major-1: saturate(@accent-color, 30%);\n --interaction-norm-major-2: saturate(@accent-color, 20%);\n --interaction-norm-major-3: saturate(@accent-color, 10%);\n --interaction-norm-contrast: @mantle;\n --interaction-weak-minor-2: darken(@surface0, 50%);\n --interaction-weak-minor-1: darken(@surface0, 30%);\n --interaction-weak: @surface0;\n --interaction-weak-major-1: lighten(@surface0, 10%);\n --interaction-weak-major-2: lighten(@surface0, 20%);\n --interaction-weak-major-3: lighten(@surface0, 30%);\n --interaction-weak-contrast: @text;\n --text-norm: @text;\n --text-weak: @subtext0;\n --text-hint: @subtext1;\n --text-disabled: @overlay1;\n --text-invert: @crust;\n --field-norm: @overlay2;\n --field-hover: @overlay1;\n --field-disabled: @overlay0;\n --field-focus: @accent-color;\n --field-highlight: fadeout(@accent-color, 30%);\n --focus-outline: @accent-color;\n --focus-ring: fadeout(@accent-color, 60%);\n --border-norm: @overlay0;\n --border-weak: @overlay1;\n --background-norm: @base;\n --background-weak: @mantle;\n --background-strong: @crust;\n --background-invert: @text;\n --interaction-default: transparent;\n --interaction-default-hover: fadeout(@overlay1, 80%);\n --interaction-default-active: fadeout(@overlay1, 60%);\n --shadow-norm-opacity: 0.5;\n --shadow-lifted-opacity: 0.75;\n --backdrop-norm: fadeout(@crust, 50%);\n --optional-scrollbar-thumb-color: @surface0;\n --optional-scrollbar-thumb-hover-color: @surface2;\n --optional-link-norm: var(--interaction-norm-major-1);\n --optional-link-hover: var(--interaction-norm-major-2);\n --optional-link-active: var(--interaction-norm-major-3);\n --optional-background-elevated: @surface0;\n --optional-background-lowered: var(--background-norm);\n --optional-email-item-unread-background-color: var(--background-weak);\n --optional-email-item-read-background-color: var(--background-norm);\n --optional-email-item-read-text-color: var(--text-weak);\n --optional-mini-calendar-today-color: @text;\n --optional-logo-text-proton-color: @text;\n --optional-logo-text-product-color: @text;\n --favorite-icon-color: @peach;\n }\n\n .ui-prominent {\n --background-norm: @mantle;\n --background-weak: @base;\n --background-strong: @crust;\n }\n\n .button-promotion {\n --upgrade-color-stop-1: @red;\n --upgrade-color-stop-2: @blue;\n }\n\n .item-container-row:not(.item-is-selected):hover,\n .item-container:not(.item-is-selected):hover {\n box-shadow: none;\n background-color: var(--navigation-current-item-background-color);\n color: var(--email-item-unread-text-color);\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name Proton Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/proton\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/proton\n@version 0.1.7\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aproton\n@description Soothing pastel theme for Proton\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document regexp(\"https://(account|mail|drive|calendar).proton.me/.*$\")\n{\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n svg.logo {\n @accentH: hue(@accent-color);\n @protonH: hue(#6d4aff);\n\n .replaceColor(@org, @property) {\n &[@{property}=\"@{org}\"] {\n @hDiff: @protonH - hue(@org);\n @{property}: hsl(\n @accentH - @hDiff,\n saturation(@org) - 30%,\n lightness(@org)\n );\n }\n }\n\n /* prettier-ignore */\n > path {\n .replaceColor(#B8D7FF, fill);\n .replaceColor(#8F69FF, fill);\n }\n\n /* prettier-ignore */\n > defs stop {\n .replaceColor(#E3D9FF, stop-color);\n .replaceColor(#7341FF, stop-color);\n .replaceColor(#6D4AFF, stop-color);\n .replaceColor(#AA8EFF, stop-color);\n .replaceColor(#06B8FF, stop-color);\n .replaceColor(#BFE8FF, stop-color);\n .replaceColor(#BFABFF, stop-color);\n .replaceColor(#FF50C3, stop-color);\n .replaceColor(#B487FF, stop-color);\n .replaceColor(#FFC8FF, stop-color);\n .replaceColor(#8EFFEE, stop-color);\n .replaceColor(#C9C7FF, stop-color);\n .replaceColor(#00F0C3, stop-color);\n .replaceColor(#FFD580, stop-color);\n .replaceColor(#F6C592, stop-color);\n .replaceColor(#EBB6A2, stop-color);\n .replaceColor(#DFA5AF, stop-color);\n .replaceColor(#D397BE, stop-color);\n .replaceColor(#C486CB, stop-color);\n .replaceColor(#B578D9, stop-color);\n .replaceColor(#A166E5, stop-color);\n .replaceColor(#8B57F2, stop-color);\n .replaceColor(#704CFF, stop-color);\n .replaceColor(#B39FFB, stop-color);\n .replaceColor(#FFE8DB, stop-color);\n }\n }\n\n &,\n .ui-prominent,\n .ui-standard {\n #lightenOrDarken(@color, @value) {\n @result: if(\n @lookup=latte,\n lighten(@color, @value),\n darken(@color, @value)\n );\n }\n\n --primary: @accent-color;\n --primary-contrast: @mantle;\n --signal-danger-minor-2: #lightenOrDarken(@maroon, 40%) [ @result];\n --signal-danger-minor-1: #lightenOrDarken(@maroon, 30%) [ @result];\n --signal-danger: @maroon;\n --signal-danger-major-1: saturate(@maroon, 40%);\n --signal-danger-major-2: saturate(@maroon, 30%);\n --signal-danger-major-3: saturate(@maroon, 20%);\n --signal-danger-contrast: @mantle;\n --signal-warning-minor-2: #lightenOrDarken(@peach, 40%) [ @result];\n --signal-warning-minor-1: #lightenOrDarken(@peach, 30%) [ @result];\n --signal-warning: @peach;\n --signal-warning-major-1: saturate(@peach, 40%);\n --signal-warning-major-2: saturate(@peach, 30%);\n --signal-warning-major-3: saturate(@peach, 20%);\n --signal-warning-contrast: @mantle;\n --signal-success-minor-2: #lightenOrDarken(@green, 40%) [ @result];\n --signal-success-minor-1: #lightenOrDarken(@green, 30%) [ @result];\n --signal-success: @green;\n --signal-success-major-1: saturate(@green, 40%);\n --signal-success-major-2: saturate(@green, 30%);\n --signal-success-major-3: saturate(@green, 20%);\n --signal-success-contrast: @mantle;\n --signal-info-minor-2: #lightenOrDarken(@blue, 40%) [ @result];\n --signal-info-minor-1: #lightenOrDarken(@blue, 30%) [ @result];\n --signal-info: @blue;\n --signal-info-major-1: saturate(@blue, 40%);\n --signal-info-major-2: saturate(@blue, 30%);\n --signal-info-major-3: saturate(@blue, 20%);\n --signal-info-contrast: @mantle;\n --interaction-norm-minor-2: #lightenOrDarken(@accent-color, 40%) [\n @result];\n --interaction-norm-minor-1: #lightenOrDarken(@accent-color, 30%) [\n @result];\n --interaction-norm: @accent-color;\n --interaction-norm-major-1: saturate(@accent-color, 30%);\n --interaction-norm-major-2: saturate(@accent-color, 20%);\n --interaction-norm-major-3: saturate(@accent-color, 10%);\n --interaction-norm-contrast: @mantle;\n --interaction-weak-minor-2: darken(@surface0, 50%);\n --interaction-weak-minor-1: darken(@surface0, 30%);\n --interaction-weak: @surface0;\n --interaction-weak-major-1: lighten(@surface0, 10%);\n --interaction-weak-major-2: lighten(@surface0, 20%);\n --interaction-weak-major-3: lighten(@surface0, 30%);\n --interaction-weak-contrast: @text;\n --text-norm: @text;\n --text-weak: @subtext0;\n --text-hint: @subtext1;\n --text-disabled: @overlay1;\n --text-invert: @crust;\n --field-norm: @overlay2;\n --field-hover: @overlay1;\n --field-disabled: @overlay0;\n --field-focus: @accent-color;\n --field-highlight: fadeout(@accent-color, 30%);\n --focus-outline: @accent-color;\n --focus-ring: fadeout(@accent-color, 60%);\n --border-norm: @overlay0;\n --border-weak: @overlay1;\n --background-norm: @base;\n --background-weak: @mantle;\n --background-strong: @crust;\n --background-invert: @text;\n --interaction-default: transparent;\n --interaction-default-hover: fadeout(@overlay1, 80%);\n --interaction-default-active: fadeout(@overlay1, 60%);\n --shadow-norm-opacity: 0.5;\n --shadow-lifted-opacity: 0.75;\n --backdrop-norm: fadeout(@crust, 50%);\n --optional-scrollbar-thumb-color: @surface0;\n --optional-scrollbar-thumb-hover-color: @surface2;\n --optional-link-norm: var(--interaction-norm-major-1);\n --optional-link-hover: var(--interaction-norm-major-2);\n --optional-link-active: var(--interaction-norm-major-3);\n --optional-background-elevated: @surface0;\n --optional-background-lowered: var(--background-norm);\n --optional-email-item-unread-background-color: var(--background-weak);\n --optional-email-item-read-background-color: var(--background-norm);\n --optional-email-item-read-text-color: var(--text-weak);\n --optional-mini-calendar-today-color: @text;\n --optional-logo-text-proton-color: @text;\n --optional-logo-text-product-color: @text;\n --favorite-icon-color: @peach;\n }\n\n .ui-prominent {\n --background-norm: @mantle;\n --background-weak: @base;\n --background-strong: @crust;\n }\n\n .button-promotion {\n --upgrade-color-stop-1: @red;\n --upgrade-color-stop-2: @blue;\n }\n\n .item-container-row:not(.item-is-selected):hover,\n .item-container:not(.item-is-selected):hover {\n box-shadow: none;\n background-color: var(--navigation-current-item-background-color);\n color: var(--email-item-unread-text-color);\n }\n\n .message-content:not(.plain) .message-iframe iframe {\n color-scheme: light;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Proton Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/proton",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/proton",
- "version": "0.1.6",
+ "version": "0.1.7",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aproton",
"description": "Soothing pastel theme for Proton",
@@ -1166,12 +1166,12 @@
"author": "Catppuccin",
"description": "Soothing pastel theme for Proton",
"name": "Proton Catppuccin",
- "updateDate": 1715527465791,
+ "updateDate": 1717397465980,
"_id": "25aa2163-58b2-45e3-92f2-43e0627cd34c",
- "_rev": 1715537840397,
+ "_rev": 1717397466049,
"id": 6,
- "originalDigest": "c8ed34242820ea996b90fe8bf733c27a156162f0",
- "etag": "W/\"2f7fec34b7ab286610aa54e13665826974188369231c051ebe79db064823538d\""
+ "originalDigest": "67c7bc40b06a84cf6cb4bef3bf85bc944fba9240",
+ "etag": "W/\"5d1d76de3485f14d03ad81ded4a536548228d70a1c6eecfbe23f7c264e5a8a92\""
},
{
"enabled": true,
@@ -1360,12 +1360,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name YouTube Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/youtube\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube\n@version 4.0.14\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube\n@description Soothing pastel theme for YouTube\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n\n@var checkbox logo \"Enable YouTube logo\" 1\n@var checkbox oled \"Enable black bars\" 0\n==/UserStyle== */\n\n@-moz-document domain('youtube.com') {\n :root[dark] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n :root:not([dark]) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n @white: if(@lookup = latte, @base, @text);\n @black: if(@lookup = latte, @text, @base);\n\n color: @text;\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &,\n [dark],\n [system-icons],\n [darker-dark-theme],\n &[dark],\n &[system-icons],\n &[darker-dark-theme] {\n --yt-spec-white-1: @text !important;\n --yt-spec-white-2: @subtext0 !important;\n --yt-spec-white-3: @subtext1 !important;\n --yt-spec-white-4: darken(@subtext1, 5%) !important;\n --yt-spec-black-1: @overlay1 !important;\n --yt-spec-black-2: @overlay0 !important;\n --yt-spec-black-3: @surface2 !important;\n --yt-spec-black-4: @surface1 !important;\n --yt-spec-black-pure: @surface0 !important;\n --yt-spec-grey-1: @text !important;\n --yt-spec-grey-2: @subtext0 !important;\n --yt-spec-grey-3: @subtext1 !important;\n --yt-spec-grey-4: @overlay2 !important;\n --yt-spec-grey-5: @overlay1 !important;\n --yt-brand-youtube-red: @accent-color !important;\n --yt-brand-medium-red: @accent-color !important;\n --yt-brand-light-red: @accent-color !important;\n --yt-spec-red-30: @peach !important;\n --yt-spec-red-70: @red !important;\n --yt-spec-pale-blue: @sky !important;\n --yt-spec-light-blue: @sky !important;\n --yt-spec-dark-blue: @sapphire !important;\n --yt-spec-navy-blue: @teal !important;\n --yt-spec-light-green: @green !important;\n --yt-spec-dark-green: @green !important;\n --yt-spec-yellow: @peach !important;\n --yt-spec-black-pure-alpha-5: fadeout(@crust, 0.05) !important;\n --yt-spec-black-pure-alpha-10: fadeout(@crust, 0.1) !important;\n --yt-spec-black-pure-alpha-15: fadeout(@crust, 0.15) !important;\n --yt-spec-black-pure-alpha-30: fadeout(@crust, 0.3) !important;\n --yt-spec-black-pure-alpha-60: fadeout(@crust, 0.6) !important;\n --yt-spec-black-pure-alpha-80: fadeout(@crust, 0.8) !important;\n --yt-spec-black-1-alpha-98: fadeout(@crust, 0.98) !important;\n --yt-spec-black-1-alpha-95: fadeout(@crust, 0.95) !important;\n --yt-spec-white-1-alpha-10: fadeout(@text, 0.1) !important;\n --yt-spec-white-1-alpha-20: fadeout(@text, 0.2) !important;\n --yt-spec-white-1-alpha-25: fadeout(@text, 0.25) !important;\n --yt-spec-white-1-alpha-30: fadeout(@text, 0.3) !important;\n --yt-spec-white-1-alpha-70: fadeout(@text, 0.7) !important;\n --yt-spec-white-1-alpha-95: fadeout(@text, 0.95) !important;\n --yt-spec-white-1-alpha-98: fadeout(@text, 0.98) !important;\n --yt-brand-medium-red-alpha-90: fadeout(@accent-color, 0.9) !important;\n --yt-brand-medium-red-alpha-30: fadeout(@accent-color, 0.3) !important;\n --yt-brand-light-red-alpha-30: fadeout(@accent-color, 0.3) !important;\n --yt-spec-light-blue-alpha-30: fadeout(@sapphire, 0.3) !important;\n --yt-spec-dark-blue-alpha-30: fadeout(@sapphire, 0.3) !important;\n\n --yt-spec-base-background: @base !important;\n --yt-spec-raised-background: @base !important;\n --yt-spec-menu-background: @mantle !important;\n --yt-spec-inverted-background: @text !important;\n --yt-spec-additive-background: fadeout(@surface0, 0.1) !important;\n --yt-spec-outline: @surface0 !important;\n --yt-spec-shadow: fadeout(@crust, 0.25) !important;\n --yt-spec-text-primary: @text !important;\n --yt-spec-text-secondary: @subtext0 !important;\n --yt-spec-text-disabled: @subtext1 !important;\n --yt-spec-text-primary-inverse: @crust !important;\n --yt-spec-call-to-action: @accent-color !important;\n --yt-spec-call-to-action-inverse: @accent-color !important;\n --yt-spec-suggested-action: fadeout(@accent-color, 80%) !important;\n --yt-spec-suggested-action-inverse: @text !important;\n --yt-spec-icon-active-other: @text !important;\n --yt-spec-button-chip-background-hover: @surface1 !important;\n --yt-spec-touch-response: @surface0 !important;\n\n --yt-spec-touch-response-inverse: @accent-color !important;\n --yt-spec-brand-icon-active: @accent-color !important;\n --yt-spec-brand-button-background: @accent-color !important;\n --yt-spec-brand-link-text: @sapphire !important;\n --yt-spec-wordmark-text: @text !important;\n --yt-spec-error-indicator: @red !important;\n --yt-spec-themed-blue: @accent-color !important;\n --yt-spec-themed-green: @green !important;\n --yt-spec-ad-indicator: @teal !important;\n --yt-spec-themed-overlay-background: fadeout(@crust, 0.8) !important;\n --yt-spec-commerce-badge-background: @green !important;\n --yt-spec-static-brand-red: @accent-color !important;\n --yt-spec-static-brand-white: @text !important;\n --yt-spec-static-brand-black: @base !important;\n --yt-spec-static-clear-color: fadeout(@crust, 0) !important;\n --yt-spec-static-clear-black: fadeout(@crust, 0) !important;\n --yt-spec-static-ad-yellow: @peach !important;\n --yt-spec-static-grey: @subtext0 !important;\n --yt-spec-static-overlay-background-solid: @crust !important;\n --yt-spec-static-overlay-background-heavy: @surface0;\n --yt-spec-static-overlay-background-medium: fade(@crust, 50%) !important;\n --yt-spec-static-overlay-background-medium-light: fadeout(\n @crust,\n 0.3\n ) !important;\n --yt-spec-static-overlay-background-light: fadeout(\n @crust,\n 0.1\n ) !important;\n --yt-spec-static-overlay-text-primary: @text !important;\n --yt-spec-static-overlay-text-secondary: fadeout(\n @subtext0,\n 0.7\n ) !important;\n --yt-spec-static-overlay-text-disabled: fadeout(\n @subtext0,\n 0.3\n ) !important;\n --yt-spec-static-overlay-call-to-action: @accent-color !important;\n --yt-spec-static-overlay-icon-active-other: @text !important;\n --yt-spec-static-overlay-icon-inactive: @surface1 !important;\n --yt-spec-static-overlay-icon-disabled: @surface2 !important;\n --yt-spec-static-overlay-button-primary: @accent-color !important;\n --yt-spec-static-overlay-button-secondary: @surface0 !important;\n --yt-spec-static-overlay-touch-response: @overlay1 !important;\n --yt-spec-static-overlay-touch-response-inverse: @surface1 !important;\n --yt-spec-static-overlay-background-brand: @accent-color !important;\n --yt-spec-assistive-feed-themed-gradient-1: @subtext0 !important;\n --yt-spec-assistive-feed-themed-gradient-2: @lavender !important;\n --yt-spec-assistive-feed-themed-gradient-3: @red !important;\n --yt-spec-brand-background-solid: @base !important;\n --yt-spec-brand-background-primary: @base !important;\n --yt-spec-brand-background-secondary: @mantle !important;\n --yt-spec-general-background-a: @base !important;\n --yt-spec-general-background-b: @base !important;\n --yt-spec-general-background-c: @crust !important;\n --yt-spec-error-background: @base !important;\n --yt-spec-10-percent-layer: @surface0 !important;\n --yt-spec-snackbar-background: @mantle !important;\n --yt-spec-snackbar-background-updated: @mantle !important;\n --yt-spec-badge-chip-background: if(\n @lookup =latte,\n @crust,\n @surface1\n ) !important;\n --yt-spec-verified-badge-background: @overlay0 !important;\n --yt-spec-call-to-action-fadeoutd: fadeout(@sapphire, 0.3) !important;\n --yt-spec-call-to-action-hover: @accent-color !important;\n --yt-spec-brand-button-background-hover: @accent-color !important;\n --yt-spec-brand-link-text-fadeoutd: fadeout(\n @accent-color,\n 0.3\n ) !important;\n --yt-spec-filled-button-focus-outline: @surface0 !important;\n --yt-spec-static-overlay-button-hover: @surface1 !important;\n --yt-spec-mono-filled-hover: @surface1 !important;\n --yt-spec-commerce-filled-hover: @accent-color !important;\n --yt-spec-mono-tonal-hover: @surface1 !important;\n --yt-spec-commerce-tonal-hover: @surface2 !important;\n --yt-spec-static-overlay-filled-hover: @overlay1 !important;\n --yt-spec-static-overlay-tonal-hover: @surface1 !important;\n --yt-spec-paper-tab-ink: fadeout(@text, 0.3);\n --yt-spec-filled-button-text: @text !important;\n --yt-spec-selected-nav-text: @text !important;\n --iron-icon-fill-color: @text !important;\n\n /* Search bar */\n --ytd-searchbox-border-color: @surface0 !important;\n --ytd-searchbox-legacy-border-color: @surface0 !important;\n --ytd-searchbox-legacy-border-shadow-color: fadeout(@crust, 0) !important;\n --ytd-searchbox-legacy-button-color: @mantle !important;\n --ytd-searchbox-legacy-button-border-color: @surface0 !important;\n --ytd-searchbox-legacy-button-focus-color: @accent-color !important;\n --ytd-searchbox-legacy-button-hover-color: @mantle !important;\n --ytd-searchbox-legacy-button-hover-border-color: @surface0 !important;\n --ytd-searchbox-legacy-button-icon-color: @accent-color !important;\n --ytd-searchbox-background: @base !important;\n --ytd-searchbox-text-color: @text !important;\n\n /* System icons */\n --yt-spec-icon-inactive: @text !important;\n --yt-spec-icon-disabled: @overlay1 !important;\n --yt-spec-brand-icon-inactive: @overlay2 !important;\n\n /* Yt video Page */\n --yt-live-chat-background-color: @base !important;\n --yt-live-chat-action-panel-background-color: @base !important;\n --yt-live-chat-secondary-background-color: @surface1;\n --yt-live-chat-toast-background-color: @surface2 !important;\n --yt-live-chat-mode-change-background-color: @base !important;\n --yt-live-chat-secondary-text-color: @subtext0 !important;\n --yt-live-chat-tertiary-text-color: fadeout(@text, 0.54) !important;\n --yt-live-chat-text-input-field-inactive-underline-color: @subtext0 !important;\n --yt-live-chat-text-input-field-placeholder-color: @subtext0 !important;\n --yt-live-chat-enabled-send-button-color: @text !important;\n --yt-live-chat-disabled-icon-button-color: @subtext1 !important;\n --yt-live-chat-picker-button-hover-color: @accent-color !important;\n --yt-live-chat-mention-background-color: @accent-color !important;\n --yt-live-chat-mention-text-color: @text !important;\n --yt-live-chat-deleted-message-color: @subtext0;\n --yt-live-chat-deleted-message-bar-color: @subtext1 !important;\n --yt-live-chat-reconnect-message-color: @text !important;\n --yt-live-chat-disabled-button-background-color: @overlay0 !important;\n --yt-live-chat-sub-panel-background-color: @base !important;\n --yt-live-chat-sub-panel-background-color-transparent: @mantle !important;\n --yt-live-chat-moderator-color: @lavender !important;\n --yt-live-chat-owner-color: @peach !important;\n --yt-live-chat-message-highlight-background-color: @base !important;\n --yt-live-chat-sponsor-color: @green !important;\n --yt-live-chat-overlay-color: fadeout(@mantle, 0.5);\n --yt-live-chat-dialog-background-color: @base !important;\n --yt-emoji-picker-variant-selector-bg-color: @base !important;\n --yt-live-chat-moderation-mode-hover-background-color: fadeout(\n @mantle,\n 0.3\n ) !important;\n --yt-grey: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1 !important;\n --yt-emoji-picker-search-background-color: @surface0 !important;\n --yt-emoji-picker-search-color: @text !important;\n --yt-emoji-picker-search-placeholder-color: @accent-color !important;\n --yt-live-chat-slider-active-color: @accent-color !important;\n --yt-live-chat-slider-container-color: @surface0 !important;\n --yt-live-chat-slider-markers-color: @text !important;\n --yt-live-chat-banner-gradient-scrim: linear-gradient(\n @mantle,\n transparent\n ) !important;\n --yt-live-chat-action-panel-gradient-scrim: linear-gradient(\n to top,\n @mantle,\n transparent\n ) !important;\n --yt-live-chat-automod-button-background-color-hover: fadeout(\n @crust,\n 0.5\n ) !important;\n --yt-live-chat-automod-button-explanation-color: fadeout(\n @accent-color,\n 0.7\n ) !important;\n --yt-live-chat-shimmer-background-color: fadeout(@crust, 0.4) !important;\n --yt-live-chat-shimmer-linear-gradient: linear-gradient(\n 0deg,\n fadeout(@text, 0.1) 40%,\n fadeout(@base, 0.3) 50%,\n fadeout(@text, 0.1) 60%\n ) !important;\n --yt-live-chat-vem-background-color: @mantle !important;\n --yt-live-chat-product-picker-icon-color: fadeout(@text, 0.5) !important;\n --yt-live-chat-product-picker-hover-color: @overlay0 !important;\n --yt-live-chat-product-picker-disabled-icon-color: fadeout(\n @text,\n 0.3\n ) !important;\n --yt-live-chat-action-panel-background-color-transparent: (\n null\n ) !important;\n\n --paper-tooltip-background: @overlay0 !important;\n --paper-tooltip-text-color: @text !important;\n\n /* Links */\n --yt-endpoint-color: @accent-color !important;\n --yt-endpoint-visited-color: @accent-color !important;\n --yt-endpoint-hover-color: @accent-color !important;\n\n --sb-dark-red-outline: @accent-color !important;\n --sb-main-bg-color: @base !important;\n --sb-main-fg-color: @text !important;\n --sb-grey-bg-color: @base !important;\n --sb-grey-fg-color: @subtext0 !important;\n --sb-red-bg-color: @accent-color !important;\n }\n\n &:not(.style-scope) {\n --primary-text-color: @text !important;\n --primary-background-color: @base !important;\n --secondary-text-color: @subtext0 !important;\n --disabled-text-color: @subtext1 !important;\n --divider-color: @overlay0 !important;\n --error-color: @red !important;\n --primary-color: @accent-color !important;\n --light-primary-color: @accent-color !important;\n --dark-primary-color: @blue !important;\n --accent-color: @accent-color !important;\n --light-accent-color: @accent-color !important;\n --dark-accent-color: @accent-color !important;\n --light-theme-background-color: @base !important;\n --light-theme-base-color: @text !important;\n --light-theme-text-color: @text !important;\n --light-theme-secondary-color: @subtext0 !important;\n --light-theme-disabled-color: @subtext1 !important;\n --light-theme-divider-color: @overlay0 !important;\n --dark-theme-background-color: @base !important;\n --dark-theme-base-color: @text !important;\n --dark-theme-text-color: @text !important;\n --dark-theme-secondary-color: @subtext0 !important;\n --dark-theme-disabled-color: @subtext1 !important;\n --dark-theme-divider-color: @overlay0 !important;\n }\n\n /* Misc */\n\n & when (@logo = 0) {\n ytd-topbar-logo-renderer,\n svg.ytd-consent-bump-v2-lightbox {\n display: none;\n }\n }\n\n #channel-name.ytd-video-meta-block {\n --yt-endpoint-color: @accent-color !important;\n --yt-endpoint-visited-color: @accent-color !important;\n color: @accent-color !important;\n }\n\n /* Selected chapter */\n ytd-macro-markers-list-item-renderer {\n --ytd-macro-markers-list-item-background-color: @surface0 !important;\n --ytd-macro-markers-list-item-title-color: @text !important;\n --ytd-macro-markers-list-item-secondary-color: @subtext1 !important;\n --ytd-macro-markers-list-item-timestamp-background-color: @surface1 !important;\n }\n\n ytd-playlist-panel-video-renderer {\n --yt-lightsource-section2-color: @surface1 !important;\n --yt-lightsource-section4-color: @surface2 !important;\n --yt-lightsource-primary-title-color: @text !important;\n --yt-lightsource-secondary-title-color: @text !important;\n --yt-active-playlist-panel-background-color: @surface0 !important;\n }\n\n ytd-playlist-panel-renderer[collapsible][collapsed][use-color-palette]\n .header.ytd-playlist-panel-renderer {\n --iron-icon-fill-color: @text !important;\n background-color: @base !important;\n }\n\n #container.ytd-masthead {\n --iron-icon-fill-color: @text !important;\n }\n\n ytd-feed-filter-chip-bar-renderer[expand-instead-of-scroll]\n #chips-wrapper.ytd-feed-filter-chip-bar-renderer {\n --iron-icon-fill-color: @text !important;\n background-color: @base !important;\n }\n\n #ytd-player #container when (@oled =0) {\n background: @crust !important;\n }\n\n .ytp-progress-list when not(@lookup = latte) {\n background: fade(@surface0, 80%);\n }\n .ytp-load-progress when not(@lookup = latte) {\n background: fade(@overlay0, 100%);\n }\n\n ytd-expandable-metadata-renderer {\n --yt-lightsource-section1-color: @base !important;\n --yt-lightsource-section2-color: @surface0 !important;\n --yt-lightsource-section3-color: @surface1 !important;\n --yt-lightsource-section4-color: @surface2 !important;\n --yt-lightsource-primary-title-color: @text !important;\n --yt-lightsource-secondary-title-color: @subtext0 !important;\n }\n\n yt-live-chat-renderer {\n --yt-button-default-text-color: @text !important;\n --yt-button-default-background-color: @base !important;\n --yt-button-dark-text-color: @base !important;\n --yt-button-dark-background-color: @accent-color !important;\n --yt-button-payment-background-color: @accent-color !important;\n }\n\n ytd-author-comment-badge-renderer:not(\n [style*=\"--ytd-author-comment-badge-icon-background-color: transparent;\"]\n ) {\n --yt-basic-background-color: @surface0 !important;\n --yt-basic-foreground-title-color: @surface0 !important;\n --ytd-author-comment-badge-background-color: @surface0 !important;\n --ytd-author-comment-badge-name-color: @text !important;\n --ytd-author-comment-badge-icon-color: @text !important;\n }\n\n /* Skeleton */\n #guide-skeleton,\n #home-container-skeleton,\n #home-chips {\n background-color: @base;\n z-index: -1;\n }\n\n #guide-skeleton .guide-ghost-icon,\n #guide-skeleton .guide-ghost-text,\n .masthead-skeleton-icon,\n #home-page-skeleton .skeleton-bg-color {\n background-color: @surface1;\n }\n\n /* Ambient mode */\n #cinematics {\n mix-blend-mode: lighten;\n }\n\n .ytp-settings-button.ytp-hd-quality-badge::after,\n .ytp-settings-button.ytp-hdr-quality-badge::after,\n .ytp-settings-button.ytp-4k-quality-badge::after,\n .ytp-settings-button.ytp-5k-quality-badge::after,\n .ytp-settings-button.ytp-8k-quality-badge::after,\n .ytp-settings-button.ytp-3d-badge-grey::after,\n .ytp-settings-button.ytp-3d-badge::after {\n background-color: @accent-color;\n }\n\n /* Icons */\n\n [fill=\"red\"],\n [fill=\"#F00\"],\n [fill=\"#FF0000\"] {\n fill: @accent-color !important;\n }\n\n [fill=\"white\"] {\n fill: if(@lookup = latte, @base, @text) !important;\n }\n\n yt-icon.ytd-logo [fill=\"white\"] {\n fill: @crust !important;\n }\n\n .yt-spec-icon-shape {\n [fill=\"#FAFAFA\"],\n [fill=\"#000\"],\n [fill=\"#fff\"],\n [fill=\"#FFF\"],\n [fill=\"#FFFFFF\"] {\n fill: @crust !important;\n }\n }\n\n .yt-spec-icon-badge-shape--style-overlay .yt-spec-icon-badge-shape__icon,\n .yt-spec-icon-badge-shape {\n color: @text;\n }\n\n .yt-spec-icon-badge-shape--type-notification\n .yt-spec-icon-badge-shape__badge {\n background-color: @accent-color !important;\n color: @surface0 !important;\n }\n\n /* Buttons */\n\n .yt-spec-button-shape-next--mono {\n &.yt-spec-button-shape-next--tonal {\n color: @text;\n background-color: @surface0;\n\n [fill=\"rgb(3,3,3)\"],\n [fill=\"rgb(0,0,0)\"],\n [fill=\"rgb(255,255,255)\"] {\n fill: @text !important;\n }\n\n [stroke=\"rgb(0,0,0)\"],\n [stroke=\"rgb(255,255,255)\"] {\n stroke: @text !important;\n }\n\n /* Accent for filled-in thumbs up (like button) */\n [animated-icon-type=\"LIKE\"] {\n g path[fill] {\n fill: @accent-color !important;\n\n + [stroke] {\n stroke: @accent-color !important;\n }\n }\n }\n\n &:hover {\n background-color: @surface1;\n }\n }\n\n &.yt-spec-button-shape-next--outline {\n color: @text;\n border-color: @surface2;\n\n &:hover {\n background-color: @surface2;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @text;\n\n /* Accent for filled-in thumbs up (like button) */\n path[d=\"M3,11h3v10H3V11z M18.77,11h-4.23l1.52-4.94C16.38,5.03,15.54,4,14.38,4c-0.58,0-1.14,0.24-1.52,0.65L7,11v10h10.43 c1.06,0,1.98-0.67,2.19-1.61l1.34-6C21.23,12.15,20.18,11,18.77,11z\"] {\n fill: @accent-color;\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n\n &:hover {\n background-color: darken(@accent-color, 5%);\n }\n }\n }\n\n .yt-spec-button-shape-next--overlay {\n &.yt-spec-button-shape-next--tonal,\n &.yt-spec-button-shape-next--text {\n color: @text;\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n }\n }\n\n .yt-spec-button-shape-next--call-to-action {\n &.yt-spec-button-shape-next--outline {\n color: @accent-color;\n border-color: @surface2;\n\n &:hover {\n background-color: @accent-color;\n color: @crust;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @accent-color;\n\n &:hover {\n background-color: fade(@accent-color, 30%);\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n }\n }\n\n .yt-spec-button-shape-next--disabled.yt-spec-button-shape-next--filled {\n color: @subtext0;\n background-color: fade(@surface1, 70%);\n }\n\n /* Search box */\n\n ytd-searchbox[has-focus] #container.ytd-searchbox {\n border-color: @accent-color;\n }\n\n .sbsb_a {\n background: var(--yt-spec-raised-background);\n }\n .sbdd_b {\n border-color: var(--yt-spec-raised-background);\n background-color: var(--yt-spec-raised-background);\n }\n .sbpqs_a,\n .gsfs {\n color: var(--yt-spec-text-primary);\n }\n .sbsb_i {\n color: var(--yt-spec-call-to-action);\n }\n .sbsb_d {\n background-color: var(--yt-spec-additive-background);\n }\n .sbdd_c {\n visibility: hidden;\n }\n\n /* \"Suggestion removed\" */\n .sbpqs_c {\n color: @overlay1;\n }\n\n .sbpqs_a::before,\n .sbqs_c::before {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n background: none;\n }\n\n /* Video description */\n\n #description {\n [style*=\"color: rgb(255, 255, 255);\"],\n [style*=\"color: rgb(19, 19, 19);\"] {\n color: @text !important;\n }\n }\n\n .yt-core-attributed-string__link--call-to-action-color {\n color: @accent-color;\n }\n\n .YtwCourseProgressViewModelHostProgressTitle,\n .YtwCourseProgressViewModelHostProgressSubtitle {\n color: @text;\n }\n\n .YtwCourseProgressViewModelHostProgressBar {\n background-color: fade(@white, 20%);\n\n .YtwCourseProgressViewModelHostProgressBarFill {\n background-color: @text;\n }\n }\n\n /* Thumbnails */\n\n #time-status:has([aria-label=\"LIVE\"]),\n .badge[aria-label=\"LIVE\"] {\n --yt-spec-static-overlay-text-primary: @crust;\n --yt-spec-static-overlay-icon-active-other: @crust;\n }\n #thumbnail [style=\"background-color: rgba(51, 51, 51, 0.8);\"],\n .YtInlinePlayerControlsTopRightControlsCircleButton,\n .badge-shape-wiz--default.badge-shape-wiz--overlay,\n .branding-context-container-inner {\n background-color: @surface0 !important;\n color: @text;\n }\n .ytp-sb-unsubscribe {\n background-color: @surface2;\n color: @text;\n }\n .ytp-sb-subscribe {\n background-color: @accent-color;\n color: @crust;\n }\n ytd-thumbnail-overlay-resume-playback-renderer {\n background-color: @surface1;\n }\n\n /* Panels, popups, tooltips */\n\n .ytp-tooltip-text {\n background: @surface0 !important;\n color: @text;\n text-shadow: none !important;\n }\n\n .ytp-popup {\n background: @surface0 !important;\n text-shadow: none;\n }\n\n .ytp-panel-menu,\n .ytp-panel-header,\n .ytp-panel-footer,\n .ytp-menuitem-label,\n .ytp-premium-label,\n .ytp-menuitem-content,\n .ytp-menuitem-label-count,\n .ytp-menu-label-secondary,\n .ytd-menu-title-renderer {\n color: @text;\n }\n\n .ytp-panel-header {\n border-bottom-color: @surface2;\n }\n\n .ytp-panel-footer-content-link {\n color: @accent-color;\n }\n\n .ytp-panel-back-button {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .ytp-menuitem-toggle-checkbox {\n background-color: @surface2;\n\n &::after {\n background-color: @subtext0;\n }\n }\n\n .ytp-menuitem {\n &:not([aria-disabled=\"true\"]):hover {\n background-color: @surface1;\n }\n\n svg > path:not([fill=\"none\"]) {\n fill: @text !important;\n }\n\n &[aria-haspopup=\"true\"] .ytp-menuitem-content {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n &[role=\"menuitemradio\"][aria-checked=\"true\"] .ytp-menuitem-label {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n\n /* Video player */\n\n .ytp-cards-button {\n .ytp-cards-button-icon {\n use {\n fill: @black;\n }\n path {\n fill: @white;\n }\n }\n }\n .ytp-cards-teaser {\n .ytp-cards-teaser-box {\n background-color: @surface2;\n border-bottom-color: @surface2;\n }\n .ytp-cards-teaser-text {\n color: @text;\n }\n }\n\n .html5-video-player {\n color: @white;\n\n .ytp-swatch-background-color {\n background-color: @accent-color !important;\n }\n\n .ytp-svg-fill,\n [fill=\"#fff\"] {\n fill: @white !important;\n }\n\n .ytp-volume-slider-handle {\n &,\n &::before {\n background-color: @white;\n }\n &::after {\n background-color: fade(@white, 20%);\n }\n }\n\n .ytp-time-current,\n .ytp-time-separator,\n .ytp-time-duration {\n color: @white;\n }\n\n .ytp-button,\n .ytp-subtitles-button {\n &[aria-pressed]::after {\n background-color: @accent-color;\n }\n }\n\n .ytp-autonav-toggle-button {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n\n &::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n\n &[aria-checked=\"true\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n\n &::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n }\n }\n }\n\n #shorts-container {\n --yt-spec-static-overlay-text-primary: @white;\n .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--tonal {\n color: @white;\n }\n\n ytd-reel-video-renderer:not([is-watch-while-mode]) {\n .yt-spec-button-shape-with-label__label {\n color: @subtext1;\n }\n }\n ytd-reel-video-renderer[is-watch-while-mode]\n .yt-spec-button-shape-with-label__label {\n color: @white;\n }\n\n .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--tonal,\n .YtdDesktopShortsVolumeControlsBackgroundScrim {\n background-color: fade(@black, 60%);\n color: @white;\n }\n\n .YtdDesktopShortsVolumeControlsMuteIcon {\n color: @white !important;\n }\n\n /* Buy super thanks button */\n .YtdShortsSuggestedActionStaticHostContainer {\n background-color: fade(@black, 60%);\n\n .YtdShortsSuggestedActionStaticHostLeadingIcon,\n .YtdShortsSuggestedActionStaticHostPrimaryText {\n color: @text;\n }\n }\n }\n\n /* Channel pages */\n .yt-tab-shape-wiz__tab {\n color: @subtext1;\n }\n .yt-tab-shape-wiz__tab--tab-selected {\n color: @text;\n }\n .yt-tab-group-shape-wiz__slider {\n background-color: @text;\n }\n .yt-tab-shape-wiz:hover .yt-tab-shape-wiz__tab-bar {\n background-color: @subtext1;\n }\n .truncated-text-wiz,\n .page-header-view-model-wiz__page-header-content-metadata {\n color: @subtext1;\n }\n .page-header-view-model-wiz__page-header-title,\n [style=\"color: rgb(255, 255, 255);\"]:has(svg),\n .truncated-text-wiz__absolute-button {\n color: @text !important;\n }\n .yt-contextual-sheet-layout-wiz {\n background-color: @mantle;\n\n .yt-list-item-view-model-wiz__container--tappable:hover {\n background-color: @surface0;\n }\n\n .yt-list-item-view-model-wiz__title,\n .yt-list-item-view-model-wiz__accessory,\n .radio-shape-wiz__label-container {\n color: @text;\n }\n }\n }\n}\n\n@-moz-document url-prefix('https://studio.youtube.com')\n{\n :root[dark] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n [src=\"https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg\"]\n {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &,\n html,\n html[dark],\n html[dark][dark],\n &[dark],\n &[light],\n [light],\n html[light],\n html[light][light] {\n --yt-spec-black-pure-alpha-80: (null) !important;\n --yt-spec-black-pure-alpha-60: (null) !important;\n --yt-spec-black-1-alpha-98: (null) !important;\n --yt-spec-black-1-alpha-95: (null) !important;\n --iron-icon-fill-color: unset !important;\n\n --yt-spec-text-primary: @text !important;\n --ytcp-text-primary: @text !important;\n --ytcp-text-primary-inverse: @base !important;\n --ytcp-static-overlay-text-primary-inverse: @base !important;\n --ytcp-wordmark-text: @text !important;\n --ytcp-text-secondary: @subtext0 !important;\n --ytcp-text-disabled: @subtext1 !important;\n --ytcp-overlay-text-primary: @overlay2 !important;\n\n --ytcp-general-background-a: @base !important;\n --yt-spec-base-background: @base !important;\n --yt-spec-black-3: @base !important;\n\n --yt-spec-brand-background-solid: @mantle !important;\n --ytcp-brand-background-solid: @mantle !important;\n --yt-spec-raised-background: @mantle !important;\n --ytcp-general-background-b: @mantle !important;\n --ytcp-analytics-reach-background: @mantle !important;\n --yt-spec-black-2: @mantle !important;\n\n --ytcp-general-background-c: @crust !important;\n --ytcp-menu-background: @surface0 !important;\n\n --ytcp-container-border-color: @surface0 !important;\n --ytcp-container-hovered-border-color: @surface0 !important;\n --ytcp-line-divider-solid: @surface0 !important;\n --ytcp-container-border-color-inverse: @subtext0 !important;\n --ytcp-line-divider-solid-inverse: @subtext0 !important;\n\n --ytcp-call-to-action: @accent-color !important;\n --ytcp-call-to-action-inverse: @mantle !important;\n --ytcp-call-to-action-raised-background: @accent-color !important;\n --yt-spec-brand-button-background: @accent-color !important;\n --ytcp-call-to-action-raised-disabled: @surface2 !important;\n --ytcp-call-to-action-raised-disabled-background: @overlay2 !important;\n --ytcp-call-to-action-raised-background-inverse: @base !important;\n --ytcp-call-to-action-raised-disabled-inverse: @surface2 !important;\n --ytcp-call-to-action-raised-disabled-background-inverse: @overlay2 !important;\n\n --yt-spec-brand-background-primary: @surface0 !important;\n\n --yt-compact-link-icon-color: @overlay2 !important;\n --ytcp-icon-active: @accent-color !important;\n --ytcp-icon-inactive: @overlay2 !important;\n --ytcp-icon-disabled: @overlay0 !important;\n --ytcp-icon-active-inverse: @overlay1 !important;\n --ytcp-icon-disabled-inverse: @subtext1 !important;\n\n --ytcp-error-red: @red !important;\n --ytcp-badge-red: @red !important;\n --ytcp-error-red-inverse: @red !important;\n --ytcp-themed-red-inverse: @red !important;\n --ytcp-themed-red: @accent-color !important;\n --ytcp-themed-blue: @accent-color !important;\n --ytcp-badge-blue: fade(@accent-color, 30%);\n --ytcp-badge-blue-solid: @blue !important;\n --ytcp-themed-blue-inverse: @blue !important;\n --ytcp-themed-green: @green !important;\n --ytmus-genre-primary-melon: @green !important;\n --ytcp-themed-green-inverse: @green !important;\n --ytcp-analytics-pine: @green !important;\n --ytcp-analytics-pine-inverse: @green !important;\n --ytcp-analytics-parrot: @green !important;\n --ytcp-themed-yellow: @peach !important;\n --ytmus-genre-primary-gold: @peach !important;\n --ytcp-yellow-inverse: @peach !important;\n --ytcp-badge-yellow: @peach !important;\n --ytcp-analytics-yellow: @peach !important;\n --ytcp-analytics-apricot: @peach !important;\n --ytcp-suggested-action: @teal !important;\n --ytcp-analytics-overview: @teal !important;\n --ytcp-analytics-revenue: @teal !important;\n --ytcp-analytics-default-secondary: @teal !important;\n --ytcp-analytics-royal-blue: @lavender !important;\n --ytcp-analytics-reach: @lavender !important;\n --ytcp-analytics-audience: @lavender !important;\n --ytcp-analytics-engagement: @pink !important;\n --ytcp-analytics-revenue-secondary: @pink !important;\n --ytcp-analytics-bubblegum: @flamingo !important;\n --ytmus-genre-primary-ruby: @flamingo !important;\n --ytmus-genre-primary-salmon: @mauve !important;\n --ytmus-genre-primary-orange: @maroon !important;\n --ytmus-genre-primary-sky: @sky !important;\n --ytmus-genre-primary-sky-inverse: @sky !important;\n\n --yt-spec-badge-chip-background: @surface1 !important;\n --ytcp-focus-inverse: @accent-color !important;\n --ytcp-focus: @accent-color !important;\n --ytcp-selected-item: @accent-color !important;\n --ytcp-hover-item: @overlay2 !important;\n --ytcp-chip-active-focus: @accent-color !important;\n --ytcp-playhead: @overlay2 !important;\n --ytcp-playhead-inverse: @overlay2 !important;\n }\n\n ytcp-button.destructive.ytls-error-dialog {\n color: @base !important;\n }\n\n yt-formatted-string.ytls-error-dialog,\n tp-yt-iron-icon.ytls-error-dialog {\n color: @text !important;\n }\n }\n}\n\n@-moz-document domain('m.youtube.com') {\n html[darker-dark-theme] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n html {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n background-color: @base !important;\n color: @text !important;\n\n /* Ambient mode */\n #cinematics {\n mix-blend-mode: lighten;\n }\n\n .mobile-topbar-header[data-mode=\"watch\"],\n ytm-mobile-topbar-renderer:not([ambient-topbar]) {\n background: @base;\n }\n\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-logo,\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-title,\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-header-content {\n color: @text;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-renderer-container,\n .modern-styling {\n background: @surface0;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-layout-header-wrapper {\n border-bottom-color: @surface0;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-content {\n color: @text;\n }\n\n /* Comment box */\n .engagement-panel-container {\n background: @mantle;\n }\n\n /* Bottom bar */\n ytm-pivot-bar-renderer {\n background: @mantle;\n color: @text;\n border-top-color: @surface0;\n }\n\n /* Chips */\n .chip-bar {\n background-color: @base;\n }\n\n [chip-style*=\"STYLE_\"] {\n .chip-container {\n color: @text;\n background-color: @surface0;\n }\n\n &.selected .chip-container {\n color: @crust;\n background-color: @accent-color;\n }\n }\n\n /* Buttons */\n\n .yt-spec-touch-feedback-shape--touch-response {\n .yt-spec-touch-feedback-shape__fill {\n background-color: @text;\n }\n\n .yt-spec-touch-feedback-shape__stroke {\n border-color: @surface1;\n }\n }\n\n .yt-spec-touch-feedback-shape--overlay-touch-response-inverse\n .yt-spec-touch-feedback-shape__fill {\n background-color: @accent-color;\n }\n .yt-spec-touch-feedback-shape--overlay-touch-response\n .yt-spec-touch-feedback-shape__fill {\n background-color: @text;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name YouTube Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/youtube\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube\n@version 4.1.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube\n@description Soothing pastel theme for YouTube\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n\n@var checkbox logo \"Enable YouTube logo\" 1\n@var checkbox oled \"Enable black bars\" 0\n==/UserStyle== */\n\n@-moz-document domain('youtube.com') {\n :root[dark] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n :root:not([dark]) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n @white: if(@lookup = latte, @base, @text);\n @black: if(@lookup = latte, @text, @base);\n\n color: @text;\n background: @base !important;\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &,\n [dark],\n [system-icons],\n [darker-dark-theme],\n &[dark],\n &[system-icons],\n &[darker-dark-theme] {\n --yt-spec-white-1: @text !important;\n --yt-spec-white-2: @subtext0 !important;\n --yt-spec-white-3: @subtext1 !important;\n --yt-spec-white-4: darken(@subtext1, 5%) !important;\n --yt-spec-black-1: @overlay1 !important;\n --yt-spec-black-2: @overlay0 !important;\n --yt-spec-black-3: @surface2 !important;\n --yt-spec-black-4: @surface1 !important;\n --yt-spec-black-pure: @surface0 !important;\n --yt-spec-grey-1: @text !important;\n --yt-spec-grey-2: @subtext0 !important;\n --yt-spec-grey-3: @subtext1 !important;\n --yt-spec-grey-4: @overlay2 !important;\n --yt-spec-grey-5: @overlay1 !important;\n --yt-brand-youtube-red: @accent-color !important;\n --yt-brand-medium-red: @accent-color !important;\n --yt-brand-light-red: @accent-color !important;\n --yt-spec-red-30: @peach !important;\n --yt-spec-red-70: @red !important;\n --yt-spec-pale-blue: @sky !important;\n --yt-spec-light-blue: @sky !important;\n --yt-spec-dark-blue: @sapphire !important;\n --yt-spec-navy-blue: @teal !important;\n --yt-spec-light-green: @green !important;\n --yt-spec-dark-green: @green !important;\n --yt-spec-yellow: @peach !important;\n --yt-spec-black-pure-alpha-5: fadeout(@crust, 0.05) !important;\n --yt-spec-black-pure-alpha-10: fadeout(@crust, 0.1) !important;\n --yt-spec-black-pure-alpha-15: fadeout(@crust, 0.15) !important;\n --yt-spec-black-pure-alpha-30: fadeout(@crust, 0.3) !important;\n --yt-spec-black-pure-alpha-60: fadeout(@crust, 0.6) !important;\n --yt-spec-black-pure-alpha-80: fadeout(@crust, 0.8) !important;\n --yt-spec-black-1-alpha-98: fadeout(@crust, 0.98) !important;\n --yt-spec-black-1-alpha-95: fadeout(@crust, 0.95) !important;\n --yt-spec-white-1-alpha-10: fadeout(@text, 0.1) !important;\n --yt-spec-white-1-alpha-20: fadeout(@text, 0.2) !important;\n --yt-spec-white-1-alpha-25: fadeout(@text, 0.25) !important;\n --yt-spec-white-1-alpha-30: fadeout(@text, 0.3) !important;\n --yt-spec-white-1-alpha-70: fadeout(@text, 0.7) !important;\n --yt-spec-white-1-alpha-95: fadeout(@text, 0.95) !important;\n --yt-spec-white-1-alpha-98: fadeout(@text, 0.98) !important;\n --yt-brand-medium-red-alpha-90: fadeout(@accent-color, 0.9) !important;\n --yt-brand-medium-red-alpha-30: fadeout(@accent-color, 0.3) !important;\n --yt-brand-light-red-alpha-30: fadeout(@accent-color, 0.3) !important;\n --yt-spec-light-blue-alpha-30: fadeout(@sapphire, 0.3) !important;\n --yt-spec-dark-blue-alpha-30: fadeout(@sapphire, 0.3) !important;\n\n --yt-spec-base-background: @base !important;\n --yt-spec-raised-background: @base !important;\n --yt-spec-menu-background: @mantle !important;\n --yt-spec-inverted-background: @text !important;\n --yt-spec-additive-background: fadeout(@surface0, 0.1) !important;\n --yt-spec-outline: @surface0 !important;\n --yt-spec-shadow: fadeout(@crust, 0.25) !important;\n --yt-spec-text-primary: @text !important;\n --yt-spec-text-secondary: @subtext0 !important;\n --yt-spec-text-disabled: @subtext1 !important;\n --yt-spec-text-primary-inverse: @crust !important;\n --yt-spec-call-to-action: @accent-color !important;\n --yt-spec-call-to-action-inverse: @accent-color !important;\n --yt-spec-suggested-action: fadeout(@accent-color, 80%) !important;\n --yt-spec-suggested-action-inverse: @text !important;\n --yt-spec-icon-active-other: @text !important;\n --yt-spec-button-chip-background-hover: @surface1 !important;\n --yt-spec-touch-response: @surface0 !important;\n\n --yt-spec-touch-response-inverse: @accent-color !important;\n --yt-spec-brand-icon-active: @accent-color !important;\n --yt-spec-brand-button-background: @accent-color !important;\n --yt-spec-brand-link-text: @sapphire !important;\n --yt-spec-wordmark-text: @text !important;\n --yt-spec-error-indicator: @red !important;\n --yt-spec-themed-blue: @accent-color !important;\n --yt-spec-themed-green: @green !important;\n --yt-spec-ad-indicator: @teal !important;\n --yt-spec-themed-overlay-background: fadeout(@crust, 0.8) !important;\n --yt-spec-commerce-badge-background: @green !important;\n --yt-spec-static-brand-red: @accent-color !important;\n --yt-spec-static-brand-white: @text !important;\n --yt-spec-static-brand-black: @base !important;\n --yt-spec-static-clear-color: fadeout(@crust, 0) !important;\n --yt-spec-static-clear-black: fadeout(@crust, 0) !important;\n --yt-spec-static-ad-yellow: @peach !important;\n --yt-spec-static-grey: @subtext0 !important;\n --yt-spec-static-overlay-background-solid: @crust !important;\n --yt-spec-static-overlay-background-heavy: @surface0;\n --yt-spec-static-overlay-background-medium: fade(@crust, 50%) !important;\n --yt-spec-static-overlay-background-medium-light: fadeout(\n @crust,\n 0.3\n ) !important;\n --yt-spec-static-overlay-background-light: fadeout(\n @crust,\n 0.1\n ) !important;\n --yt-spec-static-overlay-text-primary: @text !important;\n --yt-spec-static-overlay-text-secondary: fadeout(\n @subtext0,\n 0.7\n ) !important;\n --yt-spec-static-overlay-text-disabled: fadeout(\n @subtext0,\n 0.3\n ) !important;\n --yt-spec-static-overlay-call-to-action: @accent-color !important;\n --yt-spec-static-overlay-icon-active-other: @text !important;\n --yt-spec-static-overlay-icon-inactive: @surface1 !important;\n --yt-spec-static-overlay-icon-disabled: @surface2 !important;\n --yt-spec-static-overlay-button-primary: @accent-color !important;\n --yt-spec-static-overlay-button-secondary: @surface0 !important;\n --yt-spec-static-overlay-touch-response: @overlay1 !important;\n --yt-spec-static-overlay-touch-response-inverse: @surface1 !important;\n --yt-spec-static-overlay-background-brand: @accent-color !important;\n --yt-spec-assistive-feed-themed-gradient-1: @subtext0 !important;\n --yt-spec-assistive-feed-themed-gradient-2: @lavender !important;\n --yt-spec-assistive-feed-themed-gradient-3: @red !important;\n --yt-spec-brand-background-solid: @base !important;\n --yt-spec-brand-background-primary: @base !important;\n --yt-spec-brand-background-secondary: @mantle !important;\n --yt-spec-general-background-a: @base !important;\n --yt-spec-general-background-b: @base !important;\n --yt-spec-general-background-c: @crust !important;\n --yt-spec-error-background: @base !important;\n --yt-spec-10-percent-layer: @surface0 !important;\n --yt-spec-snackbar-background: @mantle !important;\n --yt-spec-snackbar-background-updated: @mantle !important;\n --yt-spec-badge-chip-background: if(\n @lookup =latte,\n @crust,\n @surface1\n ) !important;\n --yt-spec-verified-badge-background: @overlay0 !important;\n --yt-spec-call-to-action-fadeoutd: fadeout(@sapphire, 0.3) !important;\n --yt-spec-call-to-action-hover: @accent-color !important;\n --yt-spec-brand-button-background-hover: @accent-color !important;\n --yt-spec-brand-link-text-fadeoutd: fadeout(\n @accent-color,\n 0.3\n ) !important;\n --yt-spec-filled-button-focus-outline: @surface0 !important;\n --yt-spec-static-overlay-button-hover: @surface1 !important;\n --yt-spec-mono-filled-hover: @surface1 !important;\n --yt-spec-commerce-filled-hover: @accent-color !important;\n --yt-spec-mono-tonal-hover: @surface1 !important;\n --yt-spec-commerce-tonal-hover: @surface2 !important;\n --yt-spec-static-overlay-filled-hover: @overlay1 !important;\n --yt-spec-static-overlay-tonal-hover: @surface1 !important;\n --yt-spec-paper-tab-ink: fadeout(@text, 0.3);\n --yt-spec-filled-button-text: @text !important;\n --yt-spec-selected-nav-text: @text !important;\n --iron-icon-fill-color: @text !important;\n\n /* Search bar */\n --ytd-searchbox-border-color: @surface0 !important;\n --ytd-searchbox-legacy-border-color: @surface0 !important;\n --ytd-searchbox-legacy-border-shadow-color: fadeout(@crust, 0) !important;\n --ytd-searchbox-legacy-button-color: @mantle !important;\n --ytd-searchbox-legacy-button-border-color: @surface0 !important;\n --ytd-searchbox-legacy-button-focus-color: @accent-color !important;\n --ytd-searchbox-legacy-button-hover-color: @mantle !important;\n --ytd-searchbox-legacy-button-hover-border-color: @surface0 !important;\n --ytd-searchbox-legacy-button-icon-color: @accent-color !important;\n --ytd-searchbox-background: @base !important;\n --ytd-searchbox-text-color: @text !important;\n\n /* System icons */\n --yt-spec-icon-inactive: @text !important;\n --yt-spec-icon-disabled: @overlay1 !important;\n --yt-spec-brand-icon-inactive: @overlay2 !important;\n\n /* Yt video Page */\n --yt-live-chat-background-color: @base !important;\n --yt-live-chat-action-panel-background-color: @base !important;\n --yt-live-chat-secondary-background-color: @surface1;\n --yt-live-chat-toast-background-color: @surface2 !important;\n --yt-live-chat-mode-change-background-color: @base !important;\n --yt-live-chat-secondary-text-color: @subtext0 !important;\n --yt-live-chat-tertiary-text-color: fadeout(@text, 0.54) !important;\n --yt-live-chat-text-input-field-inactive-underline-color: @subtext0 !important;\n --yt-live-chat-text-input-field-placeholder-color: @subtext0 !important;\n --yt-live-chat-enabled-send-button-color: @text !important;\n --yt-live-chat-disabled-icon-button-color: @subtext1 !important;\n --yt-live-chat-picker-button-hover-color: @accent-color !important;\n --yt-live-chat-mention-background-color: @accent-color !important;\n --yt-live-chat-mention-text-color: @text !important;\n --yt-live-chat-deleted-message-color: @subtext0;\n --yt-live-chat-deleted-message-bar-color: @subtext1 !important;\n --yt-live-chat-reconnect-message-color: @text !important;\n --yt-live-chat-disabled-button-background-color: @overlay0 !important;\n --yt-live-chat-sub-panel-background-color: @base !important;\n --yt-live-chat-sub-panel-background-color-transparent: @mantle !important;\n --yt-live-chat-moderator-color: @lavender !important;\n --yt-live-chat-owner-color: @peach !important;\n --yt-live-chat-message-highlight-background-color: @base !important;\n --yt-live-chat-sponsor-color: @green !important;\n --yt-live-chat-overlay-color: fadeout(@mantle, 0.5);\n --yt-live-chat-dialog-background-color: @base !important;\n --yt-emoji-picker-variant-selector-bg-color: @base !important;\n --yt-live-chat-moderation-mode-hover-background-color: fadeout(\n @mantle,\n 0.3\n ) !important;\n --yt-grey: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1 !important;\n --yt-emoji-picker-search-background-color: @surface0 !important;\n --yt-emoji-picker-search-color: @text !important;\n --yt-emoji-picker-search-placeholder-color: @accent-color !important;\n --yt-live-chat-slider-active-color: @accent-color !important;\n --yt-live-chat-slider-container-color: @surface0 !important;\n --yt-live-chat-slider-markers-color: @text !important;\n --yt-live-chat-banner-gradient-scrim: linear-gradient(\n @mantle,\n transparent\n ) !important;\n --yt-live-chat-action-panel-gradient-scrim: linear-gradient(\n to top,\n @mantle,\n transparent\n ) !important;\n --yt-live-chat-automod-button-background-color-hover: fadeout(\n @crust,\n 0.5\n ) !important;\n --yt-live-chat-automod-button-explanation-color: fadeout(\n @accent-color,\n 0.7\n ) !important;\n --yt-live-chat-shimmer-background-color: fadeout(@crust, 0.4) !important;\n --yt-live-chat-shimmer-linear-gradient: linear-gradient(\n 0deg,\n fadeout(@text, 0.1) 40%,\n fadeout(@base, 0.3) 50%,\n fadeout(@text, 0.1) 60%\n ) !important;\n --yt-live-chat-vem-background-color: @mantle !important;\n --yt-live-chat-product-picker-icon-color: fadeout(@text, 0.5) !important;\n --yt-live-chat-product-picker-hover-color: @overlay0 !important;\n --yt-live-chat-product-picker-disabled-icon-color: fadeout(\n @text,\n 0.3\n ) !important;\n --yt-live-chat-action-panel-background-color-transparent: (\n null\n ) !important;\n\n --paper-tooltip-background: @overlay0 !important;\n --paper-tooltip-text-color: @text !important;\n\n /* Links */\n --yt-endpoint-color: @accent-color !important;\n --yt-endpoint-visited-color: @accent-color !important;\n --yt-endpoint-hover-color: @accent-color !important;\n\n --sb-dark-red-outline: @accent-color !important;\n --sb-main-bg-color: @base !important;\n --sb-main-fg-color: @text !important;\n --sb-grey-bg-color: @base !important;\n --sb-grey-fg-color: @subtext0 !important;\n --sb-red-bg-color: @accent-color !important;\n }\n\n &:not(.style-scope) {\n --primary-text-color: @text !important;\n --primary-background-color: @base !important;\n --secondary-text-color: @subtext0 !important;\n --disabled-text-color: @subtext1 !important;\n --divider-color: @overlay0 !important;\n --error-color: @red !important;\n --primary-color: @accent-color !important;\n --light-primary-color: @accent-color !important;\n --dark-primary-color: @blue !important;\n --accent-color: @accent-color !important;\n --light-accent-color: @accent-color !important;\n --dark-accent-color: @accent-color !important;\n --light-theme-background-color: @base !important;\n --light-theme-base-color: @text !important;\n --light-theme-text-color: @text !important;\n --light-theme-secondary-color: @subtext0 !important;\n --light-theme-disabled-color: @subtext1 !important;\n --light-theme-divider-color: @overlay0 !important;\n --dark-theme-background-color: @base !important;\n --dark-theme-base-color: @text !important;\n --dark-theme-text-color: @text !important;\n --dark-theme-secondary-color: @subtext0 !important;\n --dark-theme-disabled-color: @subtext1 !important;\n --dark-theme-divider-color: @overlay0 !important;\n }\n\n /* Misc */\n\n & when (@logo = 0) {\n ytd-topbar-logo-renderer,\n svg.ytd-consent-bump-v2-lightbox {\n display: none;\n }\n }\n\n #channel-name.ytd-video-meta-block {\n --yt-endpoint-color: @accent-color !important;\n --yt-endpoint-visited-color: @accent-color !important;\n color: @accent-color !important;\n }\n\n /* Selected chapter */\n ytd-macro-markers-list-item-renderer {\n --ytd-macro-markers-list-item-background-color: @surface0 !important;\n --ytd-macro-markers-list-item-title-color: @text !important;\n --ytd-macro-markers-list-item-secondary-color: @subtext1 !important;\n --ytd-macro-markers-list-item-timestamp-background-color: @surface1 !important;\n }\n\n ytd-playlist-panel-video-renderer {\n --yt-lightsource-section2-color: @surface1 !important;\n --yt-lightsource-section4-color: @surface2 !important;\n --yt-lightsource-primary-title-color: @text !important;\n --yt-lightsource-secondary-title-color: @text !important;\n --yt-active-playlist-panel-background-color: @surface0 !important;\n }\n\n ytd-playlist-panel-renderer[collapsible][collapsed][use-color-palette]\n .header.ytd-playlist-panel-renderer {\n --iron-icon-fill-color: @text !important;\n background-color: @base !important;\n }\n\n #container.ytd-masthead {\n --iron-icon-fill-color: @text !important;\n }\n\n ytd-feed-filter-chip-bar-renderer[expand-instead-of-scroll]\n #chips-wrapper.ytd-feed-filter-chip-bar-renderer {\n --iron-icon-fill-color: @text !important;\n background-color: @base !important;\n }\n\n #ytd-player #container when (@oled =0) {\n background: @crust !important;\n }\n\n .ytp-progress-list when not(@lookup = latte) {\n background: fade(@surface0, 80%);\n }\n .ytp-load-progress when not(@lookup = latte) {\n background: fade(@overlay0, 100%);\n }\n\n ytd-expandable-metadata-renderer {\n --yt-lightsource-section1-color: @base !important;\n --yt-lightsource-section2-color: @surface0 !important;\n --yt-lightsource-section3-color: @surface1 !important;\n --yt-lightsource-section4-color: @surface2 !important;\n --yt-lightsource-primary-title-color: @text !important;\n --yt-lightsource-secondary-title-color: @subtext0 !important;\n }\n\n yt-live-chat-renderer {\n --yt-button-default-text-color: @text !important;\n --yt-button-default-background-color: @base !important;\n --yt-button-dark-text-color: @base !important;\n --yt-button-dark-background-color: @accent-color !important;\n --yt-button-payment-background-color: @accent-color !important;\n }\n\n ytd-author-comment-badge-renderer:not(\n [style*=\"--ytd-author-comment-badge-icon-background-color: transparent;\"]\n ) {\n --yt-basic-background-color: @surface0 !important;\n --yt-basic-foreground-title-color: @surface0 !important;\n --ytd-author-comment-badge-background-color: @surface0 !important;\n --ytd-author-comment-badge-name-color: @text !important;\n --ytd-author-comment-badge-icon-color: @text !important;\n }\n\n /* Skeleton */\n #guide-skeleton,\n #home-container-skeleton,\n #home-chips {\n background-color: @base;\n z-index: -1;\n }\n\n #guide-skeleton .guide-ghost-icon,\n #guide-skeleton .guide-ghost-text,\n .masthead-skeleton-icon,\n #home-page-skeleton .skeleton-bg-color {\n background-color: @surface1;\n }\n\n /* Ambient mode */\n #cinematics {\n mix-blend-mode: lighten;\n }\n\n .ytp-settings-button.ytp-hd-quality-badge::after,\n .ytp-settings-button.ytp-hdr-quality-badge::after,\n .ytp-settings-button.ytp-4k-quality-badge::after,\n .ytp-settings-button.ytp-5k-quality-badge::after,\n .ytp-settings-button.ytp-8k-quality-badge::after,\n .ytp-settings-button.ytp-3d-badge-grey::after,\n .ytp-settings-button.ytp-3d-badge::after {\n background-color: @accent-color;\n }\n\n /* Icons */\n\n [fill=\"red\"],\n [fill=\"#F00\"],\n [fill=\"#FF0000\"] {\n fill: @accent-color !important;\n }\n\n [fill=\"white\"] {\n fill: if(@lookup = latte, @base, @text) !important;\n }\n\n yt-icon.ytd-logo [fill=\"white\"] {\n fill: @crust !important;\n }\n\n .yt-spec-icon-shape {\n [fill=\"#FAFAFA\"],\n [fill=\"#000\"],\n [fill=\"#fff\"],\n [fill=\"#FFF\"],\n [fill=\"#FFFFFF\"] {\n fill: @crust !important;\n }\n }\n\n .yt-spec-icon-badge-shape--style-overlay .yt-spec-icon-badge-shape__icon,\n .yt-spec-icon-badge-shape {\n color: @text;\n }\n\n .yt-spec-icon-badge-shape--type-notification\n .yt-spec-icon-badge-shape__badge {\n background-color: @accent-color !important;\n color: @surface0 !important;\n }\n\n /* Buttons */\n\n .yt-spec-button-shape-next--mono {\n &.yt-spec-button-shape-next--tonal {\n color: @text;\n background-color: @surface0;\n\n [fill=\"rgb(3,3,3)\"],\n [fill=\"rgb(0,0,0)\"],\n [fill=\"rgb(255,255,255)\"] {\n fill: @text !important;\n }\n\n [stroke=\"rgb(0,0,0)\"],\n [stroke=\"rgb(255,255,255)\"] {\n stroke: @text !important;\n }\n\n /* Accent for filled-in thumbs up (like button) */\n [animated-icon-type=\"LIKE\"] {\n g path[fill] {\n fill: @accent-color !important;\n\n + [stroke] {\n stroke: @accent-color !important;\n }\n }\n }\n\n &:hover {\n background-color: @surface1;\n }\n }\n\n &.yt-spec-button-shape-next--outline {\n color: @text;\n border-color: @surface2;\n\n &:hover {\n background-color: @surface2;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @text;\n\n /* Accent for filled-in thumbs up (like button) */\n path[d=\"M3,11h3v10H3V11z M18.77,11h-4.23l1.52-4.94C16.38,5.03,15.54,4,14.38,4c-0.58,0-1.14,0.24-1.52,0.65L7,11v10h10.43 c1.06,0,1.98-0.67,2.19-1.61l1.34-6C21.23,12.15,20.18,11,18.77,11z\"] {\n fill: @accent-color;\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n\n &:hover {\n background-color: darken(@accent-color, 5%);\n }\n }\n }\n\n .yt-spec-button-shape-next--overlay {\n &.yt-spec-button-shape-next--tonal,\n &.yt-spec-button-shape-next--text {\n color: @text;\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n }\n }\n\n .yt-spec-button-shape-next--call-to-action {\n &.yt-spec-button-shape-next--outline {\n color: @accent-color;\n border-color: @surface2;\n\n &:hover {\n background-color: fade(@accent-color, 30%);\n color: @accent-color;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @accent-color;\n\n &:hover {\n background-color: fade(@accent-color, 30%);\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent-color;\n\n &:hover {\n background-color: lighten(@accent-color, 5%);\n }\n }\n }\n\n .yt-spec-button-shape-next--disabled.yt-spec-button-shape-next--filled {\n color: @subtext0;\n background-color: fade(@surface1, 70%);\n }\n\n /* Search box */\n\n ytd-searchbox[has-focus] #container.ytd-searchbox {\n border-color: @accent-color;\n }\n\n .sbsb_a {\n background: var(--yt-spec-raised-background);\n }\n .sbdd_b {\n border-color: var(--yt-spec-raised-background);\n background-color: var(--yt-spec-raised-background);\n }\n .sbpqs_a,\n .gsfs {\n color: var(--yt-spec-text-primary);\n }\n .sbsb_i {\n color: var(--yt-spec-call-to-action);\n }\n .sbsb_d {\n background-color: var(--yt-spec-additive-background);\n }\n .sbdd_c {\n visibility: hidden;\n }\n\n /* \"Suggestion removed\" */\n .sbpqs_c {\n color: @overlay1;\n }\n\n .sbpqs_a::before,\n .sbqs_c::before {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n background: none;\n }\n\n /* Video description */\n\n #description {\n [style*=\"color: rgb(255, 255, 255);\"],\n [style*=\"color: rgb(19, 19, 19);\"] {\n color: @text !important;\n }\n }\n\n .yt-core-attributed-string__link--call-to-action-color {\n color: @accent-color;\n }\n\n .YtwCourseProgressViewModelHostProgressTitle,\n .YtwCourseProgressViewModelHostProgressSubtitle {\n color: @text;\n }\n\n .YtwCourseProgressViewModelHostProgressBar {\n background-color: fade(@white, 20%);\n\n .YtwCourseProgressViewModelHostProgressBarFill {\n background-color: @text;\n }\n }\n\n /* Thumbnails */\n\n #time-status:has([aria-label=\"LIVE\"]),\n .badge[aria-label=\"LIVE\"],\n .badge[aria-label=\"PREMIERE\"],\n .badge-shape-wiz--live.badge-shape-wiz--overlay {\n --yt-spec-static-overlay-text-primary: @crust;\n --yt-spec-static-overlay-icon-active-other: @crust;\n }\n .badge-shape-wiz--live.badge-shape-wiz--overlay {\n background: var(--yt-spec-static-overlay-background-brand);\n color: var(--yt-spec-static-overlay-text-primary);\n }\n #thumbnail [style=\"background-color: rgba(51, 51, 51, 0.8);\"],\n .YtInlinePlayerControlsTopRightControlsCircleButton,\n .badge-shape-wiz--default.badge-shape-wiz--overlay,\n .branding-context-container-inner {\n background-color: @surface0 !important;\n color: @text;\n }\n .ytp-sb-unsubscribe {\n background-color: @surface2;\n color: @text;\n }\n .ytp-sb-subscribe {\n background-color: @accent-color;\n color: @crust;\n }\n ytd-thumbnail-overlay-resume-playback-renderer {\n background-color: @surface1;\n }\n\n /* Panels, popups, tooltips */\n\n .ytp-tooltip-text {\n background: @surface0 !important;\n color: @text;\n text-shadow: none !important;\n }\n\n .ytp-popup {\n background: @surface0 !important;\n text-shadow: none;\n }\n\n .ytp-panel-menu,\n .ytp-panel-header,\n .ytp-panel-footer,\n .ytp-menuitem-label,\n .ytp-premium-label,\n .ytp-menuitem-content,\n .ytp-menuitem-label-count,\n .ytp-menu-label-secondary,\n .ytd-menu-title-renderer {\n color: @text;\n }\n\n .ytp-panel-header {\n border-bottom-color: @surface2;\n }\n\n .ytp-panel-footer-content-link {\n color: @accent-color;\n }\n\n .ytp-panel-back-button {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .ytp-menuitem-toggle-checkbox {\n background-color: @surface2;\n\n &::after {\n background-color: @subtext0;\n }\n }\n\n .ytp-menuitem {\n &:not([aria-disabled=\"true\"]):hover {\n background-color: @surface1;\n }\n\n svg > path:not([fill=\"none\"]) {\n fill: @text !important;\n }\n\n &[aria-haspopup=\"true\"] .ytp-menuitem-content {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n &[role=\"menuitemradio\"][aria-checked=\"true\"] .ytp-menuitem-label {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n\n /* Video player */\n\n .ytp-cards-button {\n .ytp-cards-button-icon {\n use {\n fill: @black;\n }\n path {\n fill: @white;\n }\n }\n }\n .ytp-cards-teaser {\n .ytp-cards-teaser-box {\n background-color: @surface2;\n border-bottom-color: @surface2;\n }\n .ytp-cards-teaser-text {\n color: @text;\n }\n }\n\n .html5-video-player {\n color: @white;\n\n .ytp-swatch-background-color {\n background-color: @accent-color !important;\n }\n\n .ytp-svg-fill,\n [fill=\"#fff\"] {\n fill: @white !important;\n }\n\n .ytp-volume-slider-handle {\n &,\n &::before {\n background-color: @white;\n }\n &::after {\n background-color: fade(@white, 20%);\n }\n }\n\n .ytp-time-current,\n .ytp-time-separator,\n .ytp-time-duration {\n color: @white;\n }\n\n .ytp-button,\n .ytp-subtitles-button {\n &[aria-pressed]::after {\n background-color: @accent-color;\n }\n }\n\n /* stats for nerds */\n .ytp-sfn {\n background: fade(@base, 80%);\n color: @text;\n }\n\n .ytp-autonav-toggle-button {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n\n &::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n\n &[aria-checked=\"true\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n\n &::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml;charset=utf-8,@{svg}\");\n }\n }\n }\n }\n\n #shorts-container {\n --yt-spec-static-overlay-text-primary: @white;\n .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--tonal {\n color: @white;\n }\n\n ytd-reel-video-renderer:not([is-watch-while-mode]) {\n .yt-spec-button-shape-with-label__label {\n color: @subtext1;\n }\n }\n ytd-reel-video-renderer[is-watch-while-mode]\n .yt-spec-button-shape-with-label__label {\n color: @white;\n }\n\n .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--tonal,\n .YtdDesktopShortsVolumeControlsBackgroundScrim {\n background-color: fade(@black, 60%);\n color: @white;\n }\n\n .YtdDesktopShortsVolumeControlsMuteIcon {\n color: @white !important;\n }\n\n /* Buy super thanks button */\n .YtdShortsSuggestedActionStaticHostContainer {\n background-color: fade(@black, 60%);\n\n .YtdShortsSuggestedActionStaticHostLeadingIcon,\n .YtdShortsSuggestedActionStaticHostPrimaryText {\n color: @text;\n }\n }\n }\n\n /* Channel pages */\n .yt-tab-shape-wiz__tab {\n color: @subtext1;\n }\n .yt-tab-shape-wiz__tab--tab-selected {\n color: @text;\n }\n .yt-tab-group-shape-wiz__slider {\n background-color: @text;\n }\n .yt-tab-shape-wiz:hover .yt-tab-shape-wiz__tab-bar {\n background-color: @subtext1;\n }\n .truncated-text-wiz,\n .page-header-view-model-wiz__page-header-content-metadata {\n color: @subtext1;\n }\n .page-header-view-model-wiz__page-header-title,\n [style=\"color: rgb(255, 255, 255);\"]:has(svg),\n .truncated-text-wiz__absolute-button {\n color: @text !important;\n }\n .yt-contextual-sheet-layout-wiz {\n background-color: @mantle;\n\n .yt-list-item-view-model-wiz__container--tappable:hover {\n background-color: @surface0;\n }\n\n .yt-list-item-view-model-wiz__title,\n .yt-list-item-view-model-wiz__accessory,\n .radio-shape-wiz__label-container {\n color: @text;\n }\n }\n }\n}\n\n@-moz-document url-prefix('https://studio.youtube.com')\n{\n :root[dark] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n [src=\"https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg\"]\n {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &,\n html,\n html[dark],\n html[dark][dark],\n &[dark],\n &[light],\n [light],\n html[light],\n html[light][light] {\n --yt-spec-black-pure-alpha-80: (null) !important;\n --yt-spec-black-pure-alpha-60: (null) !important;\n --yt-spec-black-1-alpha-98: (null) !important;\n --yt-spec-black-1-alpha-95: (null) !important;\n --iron-icon-fill-color: unset !important;\n\n --yt-spec-text-primary: @text !important;\n --ytcp-text-primary: @text !important;\n --ytcp-text-primary-inverse: @base !important;\n --ytcp-static-overlay-text-primary-inverse: @base !important;\n --ytcp-wordmark-text: @text !important;\n --ytcp-text-secondary: @subtext0 !important;\n --ytcp-text-disabled: @subtext1 !important;\n --ytcp-overlay-text-primary: @overlay2 !important;\n\n --ytcp-general-background-a: @base !important;\n --yt-spec-base-background: @base !important;\n --yt-spec-black-3: @base !important;\n\n --yt-spec-brand-background-solid: @mantle !important;\n --ytcp-brand-background-solid: @mantle !important;\n --yt-spec-raised-background: @mantle !important;\n --ytcp-general-background-b: @mantle !important;\n --ytcp-analytics-reach-background: @mantle !important;\n --yt-spec-black-2: @mantle !important;\n\n --ytcp-general-background-c: @crust !important;\n --ytcp-menu-background: @surface0 !important;\n\n --ytcp-container-border-color: @surface0 !important;\n --ytcp-container-hovered-border-color: @surface0 !important;\n --ytcp-line-divider-solid: @surface0 !important;\n --ytcp-container-border-color-inverse: @subtext0 !important;\n --ytcp-line-divider-solid-inverse: @subtext0 !important;\n\n --ytcp-call-to-action: @accent-color !important;\n --ytcp-call-to-action-inverse: @mantle !important;\n --ytcp-call-to-action-raised-background: @accent-color !important;\n --yt-spec-brand-button-background: @accent-color !important;\n --ytcp-call-to-action-raised-disabled: @surface2 !important;\n --ytcp-call-to-action-raised-disabled-background: @overlay2 !important;\n --ytcp-call-to-action-raised-background-inverse: @base !important;\n --ytcp-call-to-action-raised-disabled-inverse: @surface2 !important;\n --ytcp-call-to-action-raised-disabled-background-inverse: @overlay2 !important;\n\n --yt-spec-brand-background-primary: @surface0 !important;\n\n --yt-compact-link-icon-color: @overlay2 !important;\n --ytcp-icon-active: @accent-color !important;\n --ytcp-icon-inactive: @overlay2 !important;\n --ytcp-icon-disabled: @overlay0 !important;\n --ytcp-icon-active-inverse: @overlay1 !important;\n --ytcp-icon-disabled-inverse: @subtext1 !important;\n\n --ytcp-error-red: @red !important;\n --ytcp-badge-red: @red !important;\n --ytcp-error-red-inverse: @red !important;\n --ytcp-themed-red-inverse: @red !important;\n --ytcp-themed-red: @accent-color !important;\n --ytcp-themed-blue: @accent-color !important;\n --ytcp-badge-blue: fade(@accent-color, 30%);\n --ytcp-badge-blue-solid: @blue !important;\n --ytcp-themed-blue-inverse: @blue !important;\n --ytcp-themed-green: @green !important;\n --ytmus-genre-primary-melon: @green !important;\n --ytcp-themed-green-inverse: @green !important;\n --ytcp-analytics-pine: @green !important;\n --ytcp-analytics-pine-inverse: @green !important;\n --ytcp-analytics-parrot: @green !important;\n --ytcp-themed-yellow: @peach !important;\n --ytmus-genre-primary-gold: @peach !important;\n --ytcp-yellow-inverse: @peach !important;\n --ytcp-badge-yellow: @peach !important;\n --ytcp-analytics-yellow: @peach !important;\n --ytcp-analytics-apricot: @peach !important;\n --ytcp-suggested-action: @teal !important;\n --ytcp-analytics-overview: @teal !important;\n --ytcp-analytics-revenue: @teal !important;\n --ytcp-analytics-default-secondary: @teal !important;\n --ytcp-analytics-royal-blue: @lavender !important;\n --ytcp-analytics-reach: @lavender !important;\n --ytcp-analytics-audience: @lavender !important;\n --ytcp-analytics-engagement: @pink !important;\n --ytcp-analytics-revenue-secondary: @pink !important;\n --ytcp-analytics-bubblegum: @flamingo !important;\n --ytmus-genre-primary-ruby: @flamingo !important;\n --ytmus-genre-primary-salmon: @mauve !important;\n --ytmus-genre-primary-orange: @maroon !important;\n --ytmus-genre-primary-sky: @sky !important;\n --ytmus-genre-primary-sky-inverse: @sky !important;\n\n --yt-spec-badge-chip-background: @surface1 !important;\n --ytcp-focus-inverse: @accent-color !important;\n --ytcp-focus: @accent-color !important;\n --ytcp-selected-item: @accent-color !important;\n --ytcp-hover-item: @overlay2 !important;\n --ytcp-chip-active-focus: @accent-color !important;\n --ytcp-playhead: @overlay2 !important;\n --ytcp-playhead-inverse: @overlay2 !important;\n }\n\n ytcp-button.destructive.ytls-error-dialog {\n color: @base !important;\n }\n\n yt-formatted-string.ytls-error-dialog,\n tp-yt-iron-icon.ytls-error-dialog {\n color: @text !important;\n }\n }\n}\n\n@-moz-document domain('m.youtube.com') {\n html[darker-dark-theme] {\n #catppuccin(@darkFlavor, @accentColor);\n }\n html {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n background-color: @base !important;\n color: @text !important;\n\n /* Ambient mode */\n #cinematics {\n mix-blend-mode: lighten;\n }\n\n .mobile-topbar-header[data-mode=\"watch\"],\n ytm-mobile-topbar-renderer:not([ambient-topbar]) {\n background: @base;\n }\n\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-logo,\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-title,\n .mobile-topbar-header[data-mode=\"watch\"] .mobile-topbar-header-content {\n color: @text;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-renderer-container,\n .modern-styling {\n background: @surface0;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-layout-header-wrapper {\n border-bottom-color: @surface0;\n }\n\n .yt-spec-bottom-sheet-layout__bottom-sheet-content {\n color: @text;\n }\n\n /* Comment box */\n .engagement-panel-container {\n background: @mantle;\n }\n\n /* Bottom bar */\n ytm-pivot-bar-renderer {\n background: @mantle;\n color: @text;\n border-top-color: @surface0;\n }\n\n /* Chips */\n .chip-bar {\n background-color: @base;\n }\n\n [chip-style*=\"STYLE_\"] {\n .chip-container {\n color: @text;\n background-color: @surface0;\n }\n\n &.selected .chip-container {\n color: @crust;\n background-color: @accent-color;\n }\n }\n\n /* Buttons */\n\n .yt-spec-touch-feedback-shape--touch-response {\n .yt-spec-touch-feedback-shape__fill {\n background-color: @text;\n }\n\n .yt-spec-touch-feedback-shape__stroke {\n border-color: @surface1;\n }\n }\n\n .yt-spec-touch-feedback-shape--overlay-touch-response-inverse\n .yt-spec-touch-feedback-shape__fill {\n background-color: @accent-color;\n }\n .yt-spec-touch-feedback-shape--overlay-touch-response\n .yt-spec-touch-feedback-shape__fill {\n background-color: @text;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "YouTube Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/youtube",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/youtube",
- "version": "4.0.14",
+ "version": "4.1.1",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube",
"description": "Soothing pastel theme for YouTube",
@@ -1536,12 +1536,12 @@
"author": "Catppuccin",
"description": "Soothing pastel theme for YouTube",
"name": "YouTube Catppuccin",
- "updateDate": 1715527462665,
+ "updateDate": 1719253920191,
"_id": "394d935b-9e6c-4e0e-8adf-6ee7777aed72",
- "_rev": 1715536087821,
+ "_rev": 1719253920358,
"id": 8,
- "originalDigest": "8bd69f09afa30d40a90acd9a478612f0ee2bd049",
- "etag": "W/\"5b3fdda3a7ca6b87534b4503630222d218bebabd51dd9d5bc9a4b953cb90b171\""
+ "originalDigest": "f9cb7e3466a264526527b6e9e6314cdd14aba29d",
+ "etag": "W/\"ee9597c0be99e1054646ba2b96601a896d665e78c4e2e22258eaca3c1a356d6c\""
},
{
"enabled": false,
@@ -1758,12 +1758,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name DuckDuckGo Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/duckduckgo\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/duckduckgo\n@version 0.1.8\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aduckduckgo\n@description Soothing pastel theme for DuckDuckGo\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain(duckduckgo.com) {\n :root:not(.dark-bg) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n :root.dark-bg {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --sds-color-text-02: @text !important;\n --theme-col-txt-page-separator: @text!important;\n --theme-col-page-separator: @text !important;\n --theme-col-txt-url: @text !important;\n --theme-col-txt-title-visited: @mauve !important;\n --theme-col-txt-snippet: @text !important;\n --theme-col-txt-card-title: @text;\n --theme-col-txt-url-domain: @subtext1 !important;\n --theme-col-txt-title: @blue !important;\n --theme-col-bg-card: @surface0 !important;\n --theme-col-about-link: @blue;\n --theme-col-border-ui: @surface1 !important;\n --theme-col-bg-expandcollapse: @surface0 !important;\n --sds-color-palette-gray-60: @accent-color !important;\n --theme-col-txt-url-path: @subtext0 !important;\n --theme-col-border-expandcollapse: @surface1;\n --col-blue-50: @sapphire !important;\n --col-blue-60: @blue !important;\n --theme-col-bg-page: @base !important;\n --sds-color-text-01: @text !important;\n --sds-color-text-on-color: @base !important;\n --theme-spp-high-contrast-text-secondary: @accent-color !important;\n --theme-spp-high-contrast-card-indicator-color: @surface0 !important;\n --theme-spp-high-contrast-title-span-text: @text !important;\n --theme-spp-high-contrast-bg: @surface0 !important;\n --sds-color-palette-yellow-50: @yellow !important;\n --sds-color-text-04: @subtext1 !important;\n --theme-col-txt-card-body: @text !important;\n --theme-col-txt-qna-details: @subtext0 !important;\n --theme-col-txt-card: @text !important;\n --sds-color-text-03: @subtext0 !important;\n --col-slate-light: @subtext0;\n --col-silver-dark: @overlay1;\n --theme-col-txt-button-secondary: @accent-color !important;\n --theme-bg-legacy-home: @base !important;\n --theme-bg-cta-cards: @surface0 !important;\n --theme-button-primary-bg: @blue !important;\n --theme-button-primary-bg--hover: @blue !important;\n --theme-button-primary-bg--active: @blue !important;\n --theme-button-primary-text: @crust !important;\n --theme-badge-fg--green: @crust !important;\n --theme-browser-comparison-table-check-bg: @green !important;\n --theme-browser-comparison-table-cross-bg: @red !important;\n --theme-searchbox-bg: @surface0 !important;\n --theme-searchbox-bg--hover: @surface0 !important;\n --theme-searchbox-bg--active: @surface0 !important;\n --theme-searchbox-bg--focused: @surface0 !important;\n --theme-border-color-legacy-home-searchbox: @surface2 !important;\n --theme-button-link-text: @blue !important;\n --theme-browser-comparison-table-badge-text: @text !important;\n --theme-badge-bg--green: @green !important;\n --theme-badge-bg--yellow: @yellow !important;\n --theme-atb-button-bg: @blue;\n --theme-atb-button-bg--hover: @blue;\n --theme-atb-button-bg--active: @blue;\n --col-silver-light: @surface1 !important;\n --theme-col-card-inner-border: @surface2 !important;\n --sds-color-text-link-02: @text !important;\n --sds-color-text-link-02--hover: @subtext1 !important;\n --theme-text-legacy-home: @text !important;\n --theme-browser-comparison-table-row-bg: @surface0 !important;\n --theme-browser-comparison-table-row-alt-bg: @surface1 !important;\n --theme-bg-home-bottom: @base !important;\n --theme-atb-card-back-bg: @surface0 !important;\n --theme-atb-card-front-bg: @surface1 !important;\n --theme-text-bg: @text !important;\n .featureCards_root__brAX3 {\n --feature-card-background-color: @surface0 !important;\n }\n --theme-accordion-background--expanded: @surface0 !important;\n --theme-accordion-background: @surface1 !important;\n --theme-footer-link-text: @blue !important;\n --theme-sidemenu-bg: @surface0 !important;\n --theme-col-txt-button-tertiary: @text !important;\n --theme-bg-legacy-home-searchbox: @surface0 !important;\n --theme-bg-info-snippet: @surface2 !important;\n --theme-button-tertiary-txt: @text !important;\n --theme-browser-comparison-table-icon-bg: @mantle !important;\n --theme-col-bg-ui: @mantle !important;\n --theme-col-bg-header-modal: @surface0 !important;\n --theme-col-bg-button-primary: @blue !important;\n\n .footer,\n .footer--mobile,\n .modal--dropdown--settings,\n .settings-dropdown--section,\n .frm__field,\n .frm__switch,\n .tileview .metabar--fixed,\n body,\n .zci,\n html,\n .body--home,\n html.displayable-atb-banner .body--home,\n .site-wrapper,\n .region__body,\n .badge-link,\n .module--carousel__image-wrapper,\n .result__image,\n .vertical--map__sidebar,\n .vertical--map__sidebar__header,\n .page-chrome_newtab,\n .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded,\n .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded\n .metabar:not(.is-stuck) {\n background-color: @base !important;\n }\n\n /* privacy reminders */\n .privacy-reminder__text {\n color: @green !important;\n }\n .privacy-reminder__icon-circle {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .privacy-reminder__icon-shield {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .privacy-reminder__icon-check {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .privacy-reminder__modal-hide,\n .privacy-reminder__modal-link {\n color: @text !important;\n }\n\n /* lyrics box */\n .js-lyrics-module {\n color: @subtext1 !important;\n }\n .module--lyrics__subtitle-box {\n border-color: @surface2;\n }\n .module__inner-toggle--chevron {\n color: @accent-color !important;\n background-color: @surface1 !important;\n border-color: @surface2;\n }\n .module__inner-toggle::before,\n .module__inner-toggle::after {\n background-color: @surface2 !important;\n }\n\n // translation boxes\n .module--translations .dropdown--translation-select,\n .module--translations-translatedtext {\n background: @surface0 !important;\n border-color: @surface0;\n }\n .module--translations .module--translations-translatedtext.is-placeholder {\n color: @subtext0;\n }\n .module--translations-swap-svg {\n fill: @text !important;\n }\n .module--translations-original textarea,\n .module--translations-translatedtext,\n .module--translations-footer a {\n color: @text;\n }\n .module--translations-clear,\n .module--translations-copy {\n color: @subtext0 !important;\n }\n .modal__list__filter input {\n background: @mantle;\n }\n\n //coding info box\n .module:not(\n .module--carousel,\n .module--placeholder,\n .module--images,\n .module--translations,\n .module__chromeless\n ) {\n background: @surface0 !important;\n border-color: @surface1 !important;\n }\n .module__toggle,\n .tile__expand {\n background-color: @surface0 !important;\n border-color: @surface1 !important;\n }\n\n .module__title__link,\n .module__text,\n .pln,\n .pun,\n code,\n .module__more-at-bottom {\n color: @text !important;\n }\n code {\n background-color: @base !important;\n }\n .lit {\n color: @peach !important;\n }\n .com {\n color: @subtext1 !important;\n }\n .str {\n color: @green !important;\n }\n .atv {\n color: @teal !important;\n }\n .module__title__sub {\n color: @subtext0;\n }\n .prettyprint {\n background-color: @mantle;\n }\n .is-link-style-exp .btn--primary:not(.is-disabled) {\n background-color: @blue !important;\n border-color: @blue !important;\n }\n\n .featureCards_dark__5Xbsn {\n background: linear-gradient(180deg, @yellow, @blue);\n }\n\n .modal__box.modal__box--feedback.modal__box--headed .modal__box__header {\n background-color: @surface0 !important;\n }\n\n // defentions info box\n .module--definitions__pronunciation {\n color: @subtext0 !important;\n }\n\n .module--definitions__group ol li::before {\n color: @accent-color !important;\n }\n\n .module--definitions__usage {\n color: @subtext0 !important;\n }\n .module__title,\n .module--definitions__definition {\n color: @text !important;\n }\n\n .play-btn__icn_hollow {\n fill: @accent-color !important;\n }\n .module__toggle {\n color: @accent-color !important;\n }\n\n // weather info box\n .forecast-wrapper .module__weather-warning--red,\n .module__weather-warning--red:hover,\n .module__weather-warning--red:focus,\n .module__weather-warning--red:visited {\n color: @red !important;\n }\n .module__weather-warning {\n color: @yellow !important;\n }\n .text--primary,\n .tx-clr--dk,\n .tx-clr--slate,\n .module__temperature-unit:not(.module__temperature-unit--on) {\n color: @subtext1 !important;\n }\n .module__temperature-unit,\n .module__temperature-unit:hover {\n color: @accent-color !important;\n }\n\n .module__detail__precip-label,\n .module__items-precip-label,\n .ia-module--module--definitions__reference,\n .js-definitions-internal {\n color: @blue !important;\n }\n\n .module__detail__hour-label {\n color: @text !important;\n }\n .module__items-item {\n background: @surface0 !important;\n border-color: @surface2 !important;\n }\n\n .module__weatherkit-logo {\n fill: @accent-color;\n }\n\n .module__warnings,\n .module__temperature-unit--on {\n border-color: @surface2 !important;\n }\n //raindrop icon\n .module__detail__precip-label__icon,\n .module__items-precip-label__icon {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n //calculator\n .tile__ctrl__btn,\n .tile__history,\n .tile__past-calc {\n background-color: @surface0 !important;\n border-color: @surface2 !important;\n color: @text !important;\n }\n\n .tile__tab__sci .tile__ctrl__btn,\n .tile__ctrl__toggle {\n background-color: @surface2 !important;\n color: @text !important;\n border-color: @overlay0 !important;\n }\n\n .tile__display__main,\n .tile__past-result {\n color: @text !important;\n }\n\n .tile__display {\n box-shadow:\n inset -1px -1px 0 @overlay0,\n inset 1px 1px 0 @overlay0 !important;\n background-color: @base !important;\n border-color: @surface2 !important;\n color: @text !important;\n }\n .tile__display.selected {\n box-shadow:\n inset -1px -1px 0 @blue,\n inset 1px 1px 0 @blue !important;\n }\n\n .tile__ctrl--important {\n background-color: @yellow !important;\n color: @mantle !important;\n }\n .tile__display__aside,\n .tile__past-formula {\n color: @subtext0 !important;\n }\n\n .bg-delayed-color {\n background-color: @red;\n }\n\n #error_homepage {\n background-color: @rosewater !important;\n color: @red !important;\n }\n\n .search--adv {\n background-color: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .open-in-app__deep-link {\n color: @mantle;\n }\n\n .modal__header__clear,\n .sep--before,\n .js-region-filter-clear,\n .result__a,\n .module--carousel__body__title,\n .js-carousel-module-more,\n .js-no-results-web,\n .bing .tile__title--pr a,\n .sidebar-filter__show-more,\n .module__footer,\n .js-settings-dropdown-reset-appearance,\n .modal--dropdown--settings .settings-dropdown--button,\n .settings-page-wrapper a:not(.btn, .set-tab),\n .module__link--blue,\n .place-list-item__cta-item__text {\n color: @blue !important;\n }\n\n .tile__title a:visited {\n color: @mauve;\n }\n\n .place-detail__status--off {\n color: @red;\n }\n\n .place-detail__status--on {\n color: @green;\n }\n\n .result__a:visited {\n color: @mauve !important;\n }\n .bg-clr--green {\n background-color: @green;\n }\n .tile__status,\n .osGBsMSM4O7_HVv5OcxQ,\n .C68Y1fiPXCZijXmzVAbe {\n color: @mantle !important;\n }\n\n .modal__header,\n .modal__footer,\n .modal__box,\n .tile,\n .js-carousel-module-more,\n .related-searches__item,\n .bg-clr--white,\n .tile__media__free-shipping-label,\n .sidebar-filter__options,\n .sidebar-filter__option.is-size,\n .module__footer,\n .frm__select,\n .set-bookmarklet,\n .set-reset,\n .search__autocomplete,\n .frm__input,\n .frm__color__swatch {\n border-color: @surface0 !important;\n background-color: @crust !important;\n }\n\n .sep--before::before,\n .sep {\n border-left-color: @surface2;\n }\n\n .header-wrap {\n box-shadow: none !important;\n }\n\n .module--carousel__left,\n .module--carousel__right,\n .detail,\n .btn {\n background-color: @mantle;\n }\n\n .set-header--fixed .tileview--grid .metabar--fixed,\n .tileview--grid .metabar--fixed.is-stuck {\n background-color: @surface0;\n border-top-color: @surface0;\n }\n\n .modal--dropdown--region.modal--popout .frm__input,\n .js-region-filter-list,\n .tile__body,\n .bg-clr--white,\n .acp-wrap,\n .tile__media__free-shipping-label,\n .tile__media--pr,\n .modal__box,\n .nav-menu__list,\n .set-tab.is-active,\n .frm__select select,\n .cloudsave,\n .feedback-btn__send,\n .set-bookmarklet__input,\n .howItWorksSection_downloadsCard__U3Ph9,\n .metabar__grid-btn,\n .feedback-btn__icon-wrap .set-bookmarklet__input .btn,\n .btn.btn--secondary,\n .btn.is-disabled,\n input,\n textarea,\n .frm__input,\n .frm__text,\n .detail--xd .c-detail__btn,\n .set-bookmarklet,\n .set-reset,\n .zci--json_validator textarea,\n .colorpicker,\n .feedback-modal__submit.is-disabled,\n .feedback-modal__submit.is-disabled:active,\n .feedback-modal__submit.is-disabled:focus,\n .module__section,\n .module--carousel__item,\n .is-related-search-exp.dark-bg,\n .related-searches__item,\n .detail--xd .tile-nav--sm,\n .set-bookmarklet__detail,\n .set-reset__detail,\n .module__footer,\n .js-definitions-internal {\n background-color: @surface0 !important;\n }\n .module--carousel__item {\n border-color: @surface1 !important;\n }\n\n .btn.is-disabled:hover,\n .frm__switch__label:hover,\n .feedback-modal__submit.is-disabled:hover,\n .btn.btn--skeleton:hover,\n .module__footer-carousel__label:hover {\n background-color: @surface2 !important;\n border-color: @surface2 !important;\n }\n .is-checked .frm__switch__label.btn {\n background-color: @accent-color !important;\n color: @mantle !important;\n }\n .js-set-exit {\n background-color: @accent-color !important;\n border-color: @accent-color !important;\n color: @base !important;\n }\n .js-set-exit:hover {\n background-color: fade(@accent-color, 80%) !important;\n border-color: fade(@accent-color, 80%) !important;\n color: @base !important;\n }\n .set-bookmarklet__data {\n background-color: @surface2;\n color: @text;\n }\n\n .modal__list__link.is-highlighted,\n .modal__list li:hover {\n background-color: @overlay1;\n }\n\n .metabar__dropdowns-wrap::before,\n .metabar__dropdowns-wrap::after {\n background-image: linear-gradient(\n 90deg,\n @surface0,\n rgba(255, 255, 255, 0)\n );\n }\n\n .nav-menu__item__badge {\n background-color: @yellow;\n color: @mantle;\n }\n\n .settings-dropdown--section,\n .set-head,\n .frm__hr {\n border-bottom-color: @surface2;\n }\n\n .zcm--right-fade::before {\n background: linear-gradient(90deg, rgba(255, 255, 255, 0), @mantle);\n }\n .search-filters-wrap::before {\n background: linear-gradient(90deg, @base, rgba(255, 255, 255, 0));\n }\n\n .search-filters-wrap::after {\n background: linear-gradient(90deg, rgba(255, 255, 255, 0), @base);\n }\n\n .footer,\n .footer--mobile {\n border-top-color: @surface0;\n }\n\n .is-vertical-tabs-exp,\n #duckbar,\n .zcm__link:not(.dropdown__button).is-active,\n .set-main-footer {\n border-color: @accent-color !important;\n }\n\n #more-results {\n background-color: @surface0 !important;\n }\n\n input,\n select,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n ul,\n ol,\n blockquote,\n p,\n body,\n .module--carousel__footer,\n .set-tab.is-active,\n .zcm__link,\n .feedback-prompt__link,\n .feedback-btn__send,\n .tile--img__sub,\n .result__snippet,\n .result__snippet b,\n .modal__list__link,\n .acp,\n .header_headerButton__cLYU3,\n .is-vertical-tabs-exp,\n .module.module--images,\n .module__header.module__header--link,\n .text--title,\n .text--airline-flight,\n .timing,\n .flight-details__values,\n .airlines-footer,\n .tx-clr--slate,\n .nav-menu__heading,\n .zci,\n .metabar__grid-btn,\n .module--carousel__left,\n .module--carousel__right,\n .c-detail__title__sub,\n .c-detail__desc,\n .c-detail__filemeta,\n .c-detail__more,\n .frm__label,\n .js-cloudsave-new-suggestion {\n color: @text !important;\n }\n\n .zci--airlines .text--title svg path {\n fill: @text;\n }\n\n .star {\n color: @overlay2;\n }\n\n .set-tab,\n .set-tab:visited,\n .tile-nav.can-scroll {\n background-color: @mantle;\n color: @overlay1;\n }\n\n .js-cloudsave-save-btn,\n .js-cloudsave-load-btn {\n background-color: @surface2;\n border-color: @overlay0;\n color: @text;\n }\n\n .video-source,\n .tile__count,\n .result__url,\n .tile__time,\n .feedback-prompt,\n .footer__text,\n .vertical--news .result__url,\n .result__timestamp,\n .js-metabar-secondary,\n .sidebar-filters,\n .tile--pr__original-price,\n .nav-menu__item a,\n .nav-menu__close,\n .frm__desc,\n .dropdown__button,\n .tx-clr--slate-light,\n .flight-details__labels,\n .scheduled-time,\n .source-link,\n .tile__source,\n .zci__more-at,\n .cloudsave__close,\n .module--definitions__attribution-text,\n .module__attribution,\n .module__attribution-link {\n color: @subtext0 !important;\n }\n\n .dropdown--region.has-inactive-region .dropdown__button::after,\n .modal--dropdown--region.modal--popout .modal__header::before,\n .js-carousel-module-title,\n .tile--pr__brand,\n .frm__select,\n .star::after,\n .feedback-btn__icon,\n .detail--xd .tile-nav--sm,\n .detail__close,\n .module--definitions__collapsed-group ol li::before {\n color: @accent-color !important;\n }\n\n .search__button:hover,\n .search--header.has-text.search--hover .search__button {\n background-color: @accent-color !important;\n color: @base !important;\n }\n\n .settings-page-wrapper.is-checked {\n border-color: @blue;\n background-color: @sapphire !important;\n color: @mantle !important;\n }\n .modal--dropdown--settings\n .settings-dropdown--section\n .settings-dropdown--header {\n .settings-dropdown--header--link,\n .settings-dropdown--header--label {\n color: @text !important;\n }\n }\n .ddgsi-check::before {\n color: @mantle !important;\n }\n .set-bookmarklet__title,\n .set-reset__title {\n color: @text !important;\n }\n .frm__select::after {\n color: @accent-color !important;\n }\n\n .switch,\n .frm__switch__label {\n background-color: @crust !important;\n }\n\n .frm__switch__label::after {\n background: @overlay2 !important;\n }\n\n .is-checked .frm__switch__label::after {\n background: @base !important;\n }\n\n .switch__knob {\n background: @overlay2 !important;\n }\n\n .is-on .switch__knob {\n background: @base !important;\n }\n\n .switch.is-on {\n background-color: @accent-color !important;\n }\n\n .dropdown__switch.is-on::before {\n color: @base !important;\n }\n\n .search--header {\n background-color: @surface0;\n border-color: @surface0;\n }\n\n .acp--highlight,\n .bg-clr--platinum-light {\n background-color: @overlay0;\n }\n\n .review__rating-stars,\n .place-list-item__rating__image {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n } //ddg icon\n .header__logo,\n .js-logo-ddg {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .yhccgqM_FdvJ79N6Jm6c {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n //duckduckgo search too long icon\n .logo_homepage {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n // search glass icon\n .related-searches__item-text::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n // ddg header logo\n .header_logoImg__PFezv {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name DuckDuckGo Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/duckduckgo\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/duckduckgo\n@version 0.2.4\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aduckduckgo\n@description Soothing pastel theme for DuckDuckGo\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain(duckduckgo.com) {\n :root:not(.dark-bg) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n :root.dark-bg {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --sds-color-text-02: @text !important;\n --theme-col-txt-page-separator: @text!important;\n --theme-col-page-separator: @text !important;\n --theme-col-txt-url: @text !important;\n --theme-col-txt-title-visited: @mauve !important;\n --theme-col-txt-snippet: @text !important;\n --theme-col-txt-card-title: @text;\n --theme-col-txt-url-domain: @subtext1 !important;\n --theme-col-txt-title: @blue !important;\n --theme-col-bg-card: @surface0 !important;\n --theme-col-about-link: @blue;\n --theme-col-border-ui: @surface1 !important;\n --theme-col-bg-expandcollapse: @surface0 !important;\n --sds-color-palette-gray-60: @accent-color !important;\n --theme-col-txt-msg: @text !important;\n --theme-col-txt-url-path: @subtext0 !important;\n --theme-col-border-expandcollapse: @surface1;\n --col-blue-50: @sapphire !important;\n --col-blue-60: @blue !important;\n --theme-col-bg-page: @base !important;\n --sds-color-text-01: @text !important;\n --sds-color-text-on-color: @base !important;\n --theme-spp-high-contrast-text-secondary: @accent-color !important;\n --theme-spp-high-contrast-card-indicator-color: @surface0 !important;\n --theme-spp-high-contrast-title-span-text: @text !important;\n --theme-spp-high-contrast-bg: @surface0 !important;\n --sds-color-palette-yellow-50: @yellow !important;\n --sds-color-text-04: @subtext1 !important;\n --theme-col-txt-card-body: @text !important;\n --theme-col-txt-qna-details: @subtext0 !important;\n --theme-col-txt-card: @text !important;\n --sds-color-text-03: @subtext0 !important;\n --col-slate-light: @subtext0;\n --col-silver-dark: @overlay1;\n --theme-col-txt-button-secondary: @accent-color !important;\n --theme-bg-legacy-home: @base !important;\n --theme-bg-cta-cards: @surface0 !important;\n --theme-button-primary-bg: @blue !important;\n --theme-button-primary-bg--hover: @blue !important;\n --theme-button-primary-bg--active: @blue !important;\n --theme-button-primary-text: @crust !important;\n --theme-badge-fg--green: @crust !important;\n --theme-browser-comparison-table-check-bg: @green !important;\n --theme-browser-comparison-table-cross-bg: @red !important;\n --theme-searchbox-bg: @surface0 !important;\n --theme-searchbox-bg--hover: @surface0 !important;\n --theme-searchbox-bg--active: @surface0 !important;\n --theme-searchbox-bg--focused: @surface0 !important;\n --theme-border-color-legacy-home-searchbox: @surface2 !important;\n --theme-button-link-text: @blue !important;\n --theme-browser-comparison-table-badge-text: @text !important;\n --theme-badge-bg--green: @green !important;\n --theme-badge-bg--yellow: @yellow !important;\n --theme-atb-button-bg: @blue;\n --theme-atb-button-bg--hover: @blue;\n --theme-atb-button-bg--active: @blue;\n --col-silver-light: @surface1 !important;\n --theme-col-card-inner-border: @surface2 !important;\n --sds-color-text-link-02: @text !important;\n --sds-color-text-link-02--hover: @subtext1 !important;\n --theme-text-legacy-home: @text !important;\n --theme-browser-comparison-table-row-bg: @surface0 !important;\n --theme-browser-comparison-table-row-alt-bg: @surface1 !important;\n --theme-bg-home-bottom: @base !important;\n --theme-atb-card-back-bg: @surface0 !important;\n --theme-atb-card-front-bg: @surface1 !important;\n --theme-text-bg: @text !important;\n .featureCards_root__brAX3 {\n --feature-card-background-color: @surface0 !important;\n }\n --theme-accordion-background--expanded: @surface0 !important;\n --theme-accordion-background: @surface1 !important;\n --theme-footer-link-text: @blue !important;\n --theme-sidemenu-bg: @surface0 !important;\n --theme-col-txt-button-tertiary: @text !important;\n --theme-bg-legacy-home-searchbox: @surface0 !important;\n --theme-bg-info-snippet: @surface2 !important;\n --theme-button-tertiary-txt: @text !important;\n --theme-browser-comparison-table-icon-bg: @mantle !important;\n --theme-col-bg-ui: @mantle !important;\n --theme-col-bg-header-modal: @surface0 !important;\n --theme-col-bg-button-primary: @blue !important;\n /* ai chat */\n --theme-dc-color-background-dark: @base !important;\n --theme-dc-color-gpt-main: @mauve !important;\n --theme-dc-color-gpt-bg: @mauve !important;\n --theme-dc-color-claude-main: @green !important;\n --theme-dc-color-claude-bg: @green !important;\n --sds-color-background-destructive: @red !important;\n --sds-color-text-on-dark-01: @text !important;\n --theme-dc-color-fire-button: fade(@red, 40%) !important;\n --sds-color-background-destructive-state-01: @red !important;\n --sds-color-background-destructive-state-02: @red !important;\n --sds-color-text-destructive: @red !important;\n --sds-color-text-success: @green !important;\n --sds-color-text-link-01: @blue !important;\n --sds-color-background-container-01: @surface0 !important;\n --sds-color-border-accent-01: @accent-color !important;\n --theme-dc-color-container-message: @surface0 !important;\n --sds-color-palette-gray-85: @surface1 !important;\n --sds-color-palette-white: @crust !important;\n --sds-color-background-accent-01: @accent-color !important;\n --theme-col-txt-card-body-light: @text !important;\n --theme-col-bg-page-alt-2: @surface0 !important;\n --theme-dc-color-llama-main: @pink !important;\n --theme-dc-color-mixtral-main: @peach !important;\n --theme-dc-color-anchor-sleep: @subtext0 !important;\n\n .footer,\n .footer--mobile,\n .modal--dropdown--settings,\n .settings-dropdown--section,\n .frm__field,\n .frm__switch,\n .tileview .metabar--fixed,\n body,\n .zci,\n html,\n .body--home,\n html.displayable-atb-banner .body--home,\n .site-wrapper,\n .region__body,\n .badge-link,\n .module--carousel__image-wrapper,\n .result__image,\n .vertical--map__sidebar,\n .vertical--map__sidebar__header,\n .page-chrome_newtab,\n .js-carousel-module-more,\n .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded,\n .zci--type--tiles:not(.is-fallback).is-full-page.is-expanded\n .metabar:not(.is-stuck) {\n background-color: @base !important;\n }\n\n /* privacy reminders */\n .wXKLp5dS9jGvo097pfaG {\n color: @green !important;\n }\n .IuA6a2PUTR9Lck6m0WlP {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .XxDCpwElzOhQaLmCxJ8z {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .privacy-reminder__icon-check {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .privacy-reminder__modal-hide,\n .privacy-reminder__modal-link {\n color: @text !important;\n }\n\n /* stopwatch */\n .zci--stopwatch .time {\n color: @text !important;\n }\n .label {\n color: @text;\n background-color: @crust;\n }\n .stopwatch__btn.start {\n border-color: @green !important;\n background-color: @green;\n color: @mantle !important;\n }\n .stopwatch__btn[disabled] {\n color: @text !important;\n background-color: @surface0 !important;\n border-color: @surface0;\n }\n .stopwatch__btn.stop {\n color: @mantle;\n background-color: @red !important;\n border-color: @red !important;\n }\n .stopwatch__btn {\n background-color: @surface2;\n border-color: @surface2;\n color: @text;\n }\n .zci--stopwatch td {\n color: @text;\n }\n\n /* html chars */\n .record__body,\n .chomp--link__mr,\n .tx-clr--lt2 {\n color: @text;\n }\n .c-list__item {\n border-color: @mantle;\n }\n .chomp--link__icn::before {\n color: @text;\n }\n\n /* cal */\n .calendar .t_right,\n .calendar .t_left {\n background-color: @surface2;\n }\n .calendar__header {\n color: @text;\n }\n table.calendar tr {\n color: @text;\n }\n .calendar__today {\n color: @mantle;\n background-color: @accent-color;\n }\n\n .zci.is-active {\n border-color: @surface0;\n }\n\n .module__toggle--more::after {\n background: linear-gradient(rgba(40, 40, 40, 0), @surface0);\n }\n\n /* button on hover */\n .btn:hover:not(.is-disabled) {\n background-color: @mantle;\n color: @blue;\n border-color: @mantle;\n }\n\n /* stocks infobox */\n .stocks-module__currentPrice,\n .stocks-module__exchange,\n .stocks-module__currency,\n .stocks-module__stats {\n color: @text;\n }\n .stocks-module__timePeriod {\n background-color: @surface2;\n color: @text;\n }\n .stocks-module__latestUpdate,\n .ia-module--stocks a.stocks-module__attribution,\n .stocks-module__footer {\n color: @subtext1;\n }\n .stocks-module__timePeriod.selected {\n color: @mantle;\n background-color: @accent-color;\n }\n .ia-module--stocks.increase .color-coded {\n color: @green !important;\n }\n .stocks-module__hover-label {\n &[style*=\"color: rgb(222, 88, 51);\"] {\n color: @red !important;\n }\n &[style*=\"color: rgb(91, 158, 77);\"] {\n color: @green !important;\n }\n }\n .ia-module--stocks.increase .color-coded path {\n stroke: @green;\n fill: @green;\n }\n .ia-module--stocks\n .stocks-module__chart-area-row\n .stocks-module__chart\n svg {\n [stroke=\"#de5833\"] {\n stroke: @red !important;\n }\n [fill=\"#de5833\"] {\n fill: @red !important;\n }\n [stroke=\"#5b9e4d\"] {\n stroke: @green !important;\n [fill=\"#5b9e4d\"] {\n fill: @green !important;\n }\n }\n }\n .ia-module--stocks.decrease .color-coded {\n color: @red;\n }\n .ia-module--stocks.decrease .color-coded path {\n stroke: @red;\n fill: @red;\n }\n .ia-module--stocks\n .stocks-module__stats-wrapper\n .stocks-module__stats\n .stocks-module__stat-col\n .stocks-module__stat {\n border-bottom-color: @overlay0;\n }\n .stocks-module__chart .horizontal-line,\n .stocks-module__chart .vertical-line,\n .stocks-module__chart .prev-close-line {\n stroke: @surface2;\n }\n\n /* color box */\n .tx-clr--lt {\n color: @text;\n }\n .tx-clr--dk2 {\n color: @subtext0;\n }\n\n /* ai chat >:( */\n .feedback-external__link {\n color: @blue;\n }\n .feedback-duckchat-modal__disclaimer {\n color: @text;\n }\n .feedback-modal__radio {\n color: @text;\n }\n .modal__close {\n color: @text;\n }\n /* lyrics box */\n .js-lyrics-module {\n color: @subtext1 !important;\n }\n .module--lyrics__subtitle-box {\n border-color: @surface2;\n }\n .module__inner-toggle--chevron {\n color: @accent-color !important;\n background-color: @surface1 !important;\n border-color: @surface2;\n }\n .module__inner-toggle::before,\n .module__inner-toggle::after {\n background-color: @surface2 !important;\n }\n\n // translation boxes\n .module--translations .dropdown--translation-select,\n .module--translations-translatedtext {\n background: @surface0 !important;\n border-color: @surface0;\n }\n .module--translations .module--translations-translatedtext.is-placeholder {\n color: @subtext0;\n }\n .module--translations-swap-svg {\n fill: @text !important;\n }\n .module--translations-original textarea,\n .module--translations-translatedtext,\n .module--translations-footer a {\n color: @text;\n }\n .module--translations-clear,\n .module--translations-copy {\n color: @subtext0 !important;\n }\n .modal__list__filter input {\n background: @mantle;\n }\n\n //coding info box\n .module:not(\n .module--carousel,\n .module--placeholder,\n .module--images,\n .module--translations,\n .module__chromeless\n ) {\n background: @surface0 !important;\n border-color: @surface1 !important;\n }\n .module__toggle,\n .tile__expand {\n background-color: @surface0 !important;\n border-color: @surface1 !important;\n }\n\n .module__title__link,\n .module__text,\n .pln,\n .pun,\n code,\n .module__more-at-bottom {\n color: @text !important;\n }\n code {\n background-color: @base !important;\n }\n .lit {\n color: @peach !important;\n }\n .com {\n color: @subtext1 !important;\n }\n .str {\n color: @green !important;\n }\n .atv {\n color: @teal !important;\n }\n .module__title__sub {\n color: @subtext0;\n }\n .prettyprint {\n background-color: @mantle;\n }\n .is-link-style-exp .btn--primary:not(.is-disabled) {\n background-color: @blue !important;\n border-color: @blue !important;\n color: @mantle !important;\n }\n\n .featureCards_dark__5Xbsn {\n background: linear-gradient(180deg, @yellow, @blue);\n }\n\n .modal__box.modal__box--feedback.modal__box--headed .modal__box__header {\n background-color: @surface0 !important;\n }\n\n // defentions info box\n .module--definitions__pronunciation {\n color: @subtext0 !important;\n }\n\n .module--definitions__group ol li::before {\n color: @accent-color !important;\n }\n\n .module--definitions__usage {\n color: @subtext0 !important;\n }\n .module__title,\n .module--definitions__definition {\n color: @text !important;\n }\n\n .play-btn__icn_hollow {\n fill: @accent-color !important;\n }\n .module__toggle {\n color: @accent-color !important;\n }\n\n // weather info box\n .forecast-wrapper .module__weather-warning--red,\n .module__weather-warning--red:hover,\n .module__weather-warning--red:focus,\n .module__weather-warning--red:visited {\n color: @red !important;\n }\n .module__weather-warning {\n color: @yellow !important;\n }\n .text--primary,\n .tx-clr--dk,\n .tx-clr--slate,\n .module__temperature-unit:not(.module__temperature-unit--on) {\n color: @subtext1 !important;\n }\n .module__temperature-unit,\n .module__temperature-unit:hover {\n color: @accent-color !important;\n }\n\n .module__detail__precip-label,\n .module__items-precip-label,\n .ia-module--module--definitions__reference,\n .js-definitions-internal {\n color: @blue !important;\n }\n\n .module__detail__hour-label {\n color: @text !important;\n }\n .module__items-item {\n background: @surface0 !important;\n border-color: @surface2 !important;\n }\n\n .module__weatherkit-logo {\n fill: @accent-color;\n }\n\n .module__warnings,\n .module__temperature-unit--on {\n border-color: @surface2 !important;\n }\n //raindrop icon\n .module__detail__precip-label__icon,\n .module__items-precip-label__icon {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n //calculator\n .tile__ctrl__btn,\n .tile__history,\n .tile__past-calc {\n background-color: @surface0 !important;\n border-color: @surface2 !important;\n color: @text !important;\n }\n .tile__tab__sci .tile__ctrl__btn,\n .tile__ctrl__toggle {\n background-color: @surface2 !important;\n color: @text !important;\n border-color: @overlay0 !important;\n }\n .tile__display__main,\n .tile__past-result {\n color: @text !important;\n }\n .tile__display {\n box-shadow:\n inset -1px -1px 0 @overlay0,\n inset 1px 1px 0 @overlay0 !important;\n background-color: @base !important;\n border-color: @surface2 !important;\n color: @text !important;\n }\n .tile__display.selected {\n box-shadow:\n inset -1px -1px 0 @blue,\n inset 1px 1px 0 @blue !important;\n }\n\n .tile__ctrl--important {\n background-color: @yellow !important;\n color: @mantle !important;\n }\n .tile__display__aside,\n .tile__past-formula {\n color: @subtext0 !important;\n }\n\n .bg-delayed-color {\n background-color: @red;\n }\n\n #error_homepage {\n background-color: @rosewater !important;\n color: @red !important;\n }\n\n .search--adv {\n background-color: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .open-in-app__deep-link {\n color: @mantle;\n }\n\n .modal__header__clear,\n .sep--before,\n .js-region-filter-clear,\n .result__a,\n .module--carousel__body__title,\n .js-carousel-module-more,\n .js-no-results-web,\n .bing .tile__title--pr a,\n .sidebar-filter__show-more,\n .module__footer,\n .js-settings-dropdown-reset-appearance,\n .modal--dropdown--settings .settings-dropdown--button,\n .settings-page-wrapper a:not(.btn, .set-tab),\n .module__link--blue,\n .place-list-item__cta-item__text {\n color: @blue !important;\n }\n\n .tile__title a:visited {\n color: @mauve;\n }\n\n .place-detail__status--off {\n color: @red;\n }\n\n .place-detail__status--on {\n color: @green;\n }\n\n .result__a:visited {\n color: @mauve !important;\n }\n .bg-clr--green {\n background-color: @green;\n }\n .tile__status,\n .osGBsMSM4O7_HVv5OcxQ,\n .C68Y1fiPXCZijXmzVAbe {\n color: @mantle !important;\n }\n\n .modal__header,\n .modal__footer,\n .modal__box,\n .tile,\n .related-searches__item,\n .bg-clr--white,\n .tile__media__free-shipping-label,\n .sidebar-filter__options,\n .sidebar-filter__option.is-size,\n .module__footer,\n .frm__select,\n .set-bookmarklet,\n .set-reset,\n .search__autocomplete,\n .frm__input,\n .frm__color__swatch {\n border-color: @surface0 !important;\n background-color: @crust !important;\n }\n\n .sep--before::before,\n .sep {\n border-left-color: @surface2;\n }\n\n .header-wrap {\n box-shadow: none !important;\n }\n\n .header-wrap,\n .module--carousel__left,\n .module--carousel__right,\n .detail,\n .btn {\n background-color: @mantle;\n }\n\n .set-header--fixed .tileview--grid .metabar--fixed,\n .tileview--grid .metabar--fixed.is-stuck {\n background-color: @surface0;\n border-top-color: @surface0;\n }\n\n .modal--dropdown--region.modal--popout .frm__input,\n .js-region-filter-list,\n .tile__body,\n .bg-clr--white,\n .acp-wrap,\n .tile__media__free-shipping-label,\n .tile__media--pr,\n .modal__box,\n .nav-menu__list,\n .set-tab.is-active,\n .frm__select select,\n .cloudsave,\n .feedback-btn__send,\n .set-bookmarklet__input,\n .howItWorksSection_downloadsCard__U3Ph9,\n .metabar__grid-btn,\n .feedback-btn__icon-wrap .set-bookmarklet__input .btn,\n .btn.btn--secondary,\n .btn.is-disabled,\n input,\n textarea,\n .frm__input,\n .frm__text,\n .detail--xd .c-detail__btn,\n .set-bookmarklet,\n .set-reset,\n .zci--json_validator textarea,\n .colorpicker,\n .feedback-modal__submit.is-disabled,\n .feedback-modal__submit.is-disabled:active,\n .feedback-modal__submit.is-disabled:focus,\n .module__section,\n .module--carousel__item,\n .is-related-search-exp.dark-bg,\n .related-searches__item,\n .detail--xd .tile-nav--sm,\n .set-bookmarklet__detail,\n .set-reset__detail,\n .module__footer,\n .js-definitions-internal {\n background-color: @surface0 !important;\n }\n .module--carousel__item {\n border-color: @surface1 !important;\n }\n\n .btn.is-disabled:hover,\n .frm__switch__label:hover,\n .feedback-modal__submit.is-disabled:hover,\n .btn.btn--skeleton:hover,\n .module__footer-carousel__label:hover {\n background-color: @surface2 !important;\n border-color: @surface2 !important;\n }\n .is-checked .frm__switch__label.btn {\n background-color: @accent-color !important;\n color: @mantle !important;\n }\n .js-set-exit {\n background-color: @accent-color !important;\n border-color: @accent-color !important;\n color: @base !important;\n }\n .js-set-exit:hover {\n background-color: fade(@accent-color, 80%) !important;\n border-color: fade(@accent-color, 80%) !important;\n color: @base !important;\n }\n .set-bookmarklet__data {\n background-color: @surface2;\n color: @text;\n }\n\n .modal__list__link.is-highlighted,\n .modal__list li:hover {\n background-color: @overlay1;\n }\n\n .metabar__dropdowns-wrap::before {\n background-image: linear-gradient(90deg, @base, rgba(255, 255, 255, 0));\n }\n\n .metabar__dropdowns-wrap::after {\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), @base);\n }\n\n .nav-menu__item__badge {\n background-color: @yellow;\n color: @mantle;\n }\n\n .settings-dropdown--section,\n .set-head,\n .frm__hr {\n border-bottom-color: @surface2;\n }\n\n .zcm--right-fade::before {\n background: linear-gradient(90deg, rgba(255, 255, 255, 0), @mantle);\n }\n .search-filters-wrap::before {\n background: linear-gradient(90deg, @base, rgba(255, 255, 255, 0));\n }\n\n .search-filters-wrap::after {\n background: linear-gradient(90deg, rgba(255, 255, 255, 0), @base);\n }\n\n .footer,\n .footer--mobile {\n border-top-color: @surface0;\n }\n\n .is-vertical-tabs-exp,\n #duckbar,\n .zcm__link:not(.dropdown__button).is-active,\n .set-main-footer {\n border-color: @accent-color !important;\n }\n\n #more-results {\n background-color: @surface0 !important;\n }\n\n input,\n select,\n h1,\n h2,\n h4,\n h5,\n h6,\n ul,\n ol,\n blockquote,\n p,\n body,\n .module--carousel__footer,\n .set-tab.is-active,\n .zcm__link,\n .feedback-prompt__link,\n .feedback-btn__send,\n .tile--img__sub,\n .result__snippet,\n .result__snippet b,\n .modal__list__link,\n .acp,\n .header_headerButton__cLYU3,\n .is-vertical-tabs-exp,\n .module.module--images,\n .module__header.module__header--link,\n .text--title,\n .text--airline-flight,\n .timing,\n .flight-details__values,\n .airlines-footer,\n .tx-clr--slate,\n .nav-menu__heading,\n .zci,\n .metabar__grid-btn,\n .module--carousel__left,\n .module--carousel__right,\n .c-detail__title__sub,\n .c-detail__desc,\n .c-detail__filemeta,\n .c-detail__more,\n .frm__label,\n .js-cloudsave-new-suggestion,\n .zci__body,\n .zci__body a {\n color: @text !important;\n }\n\n .zci--airlines .text--title svg path {\n fill: @text;\n }\n\n .star {\n color: @overlay2;\n }\n\n .set-tab,\n .set-tab:visited,\n .tile-nav.can-scroll {\n background-color: @mantle;\n color: @overlay1;\n }\n\n .js-cloudsave-save-btn,\n .js-cloudsave-load-btn {\n background-color: @surface2;\n border-color: @overlay0;\n color: @text;\n }\n\n .video-source,\n .tile__count,\n .result__url,\n .tile__time,\n .feedback-prompt,\n .footer__text,\n .vertical--news .result__url,\n .result__timestamp,\n .js-metabar-secondary,\n .sidebar-filters,\n .tile--pr__original-price,\n .nav-menu__item a,\n .nav-menu__close,\n .frm__desc,\n .dropdown__button,\n .tx-clr--slate-light,\n .flight-details__labels,\n .scheduled-time,\n .source-link,\n .tile__source,\n .zci__more-at,\n .cloudsave__close,\n .module--definitions__attribution-text,\n .module__attribution,\n .module__attribution-link {\n color: @subtext0 !important;\n }\n\n .dropdown--region.has-inactive-region .dropdown__button::after,\n .modal--dropdown--region.modal--popout .modal__header::before,\n .js-carousel-module-title,\n .tile--pr__brand,\n .frm__select,\n .star::after,\n .feedback-btn__icon,\n .detail--xd .tile-nav--sm,\n .detail__close,\n .module--definitions__collapsed-group ol li::before {\n color: @accent-color !important;\n }\n\n .search__button:hover,\n .search--header.has-text.search--hover .search__button {\n background-color: @accent-color !important;\n color: @base !important;\n }\n\n .settings-page-wrapper.is-checked {\n border-color: @blue;\n background-color: @sapphire !important;\n color: @mantle !important;\n }\n .modal--dropdown--settings\n .settings-dropdown--section\n .settings-dropdown--header {\n .settings-dropdown--header--link,\n .settings-dropdown--header--label {\n color: @text !important;\n }\n }\n .ddgsi-check::before {\n color: @mantle !important;\n }\n .set-bookmarklet__title,\n .set-reset__title {\n color: @text !important;\n }\n .frm__select::after {\n color: @accent-color !important;\n }\n\n .switch,\n .frm__switch__label {\n background-color: @crust !important;\n }\n\n .frm__switch__label::after {\n background: @overlay2 !important;\n }\n\n .is-checked .frm__switch__label::after {\n background: @base !important;\n }\n\n .switch__knob {\n background: @overlay2 !important;\n }\n\n .is-on .switch__knob {\n background: @base !important;\n }\n\n .switch.is-on {\n background-color: @accent-color !important;\n }\n\n .dropdown__switch.is-on::before {\n color: @base !important;\n }\n\n .search--header {\n background-color: @surface0;\n border-color: @surface0;\n }\n\n .acp--highlight,\n .bg-clr--platinum-light {\n background-color: @overlay0;\n }\n\n .review__rating-stars,\n .place-list-item__rating__image {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n } //ddg icon\n .header__logo,\n .js-logo-ddg {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .yhccgqM_FdvJ79N6Jm6c {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n //duckduckgo search too long icon\n .logo_homepage {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n // search glass icon\n .related-searches__item-text::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n // ddg header logo\n .header_logoImg__PFezv {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "DuckDuckGo Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/duckduckgo",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/duckduckgo",
- "version": "0.1.8",
+ "version": "0.2.4",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aduckduckgo",
"description": "Soothing pastel theme for DuckDuckGo",
@@ -1920,11 +1920,12 @@
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/duckduckgo",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.css",
"name": "DuckDuckGo Catppuccin",
- "originalDigest": "160b1f788028813c2ebe318320e96a11d8649c0b",
+ "originalDigest": "7e8fd30bcfa1582a7a912c7099504616b1d3f8d2",
"_id": "0dc8d202-eec3-4899-967c-76c944413214",
- "_rev": 1715535511624,
+ "_rev": 1718609785699,
"id": 11,
- "etag": "W/\"7798d5ff95e08f18f894567be507a5b822624282ab63a955da73c9d6cde6b2ef\""
+ "etag": "W/\"48926b21a0940ef71b3c08eeae39efc0e118d0e9d5f4d03efe30ffe38854e17b\"",
+ "updateDate": 1718609785672
},
{
"enabled": true,
@@ -2462,12 +2463,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name Wikipedia Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/wikipedia\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia\n@version 0.0.17\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia\n@description Soothing pastel theme for Wikipedia\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n@var checkbox highlight-redirect \"Highlight redirect links\" 0\n==/UserStyle== */\n\n@-moz-document domain('wikipedia.org') {\n @import url(\"https://python.catppuccin.com/pygments/catppuccin-variables.important.css\");\n\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --ctp-rosewater: @rosewater;\n --ctp-flamingo: @flamingo;\n --ctp-pink: @pink;\n --ctp-mauve: @mauve;\n --ctp-red: @red;\n --ctp-maroon: @maroon;\n --ctp-peach: @peach;\n --ctp-yellow: @yellow;\n --ctp-green: @green;\n --ctp-teal: @teal;\n --ctp-sky: @sky;\n --ctp-sapphire: @sapphire;\n --ctp-blue: @blue;\n --ctp-lavender: @lavender;\n --ctp-text: @text;\n --ctp-subtext1: @subtext1;\n --ctp-subtext0: @subtext0;\n --ctp-overlay2: @overlay2;\n --ctp-overlay1: @overlay1;\n --ctp-overlay0: @overlay0;\n --ctp-surface2: @surface2;\n --ctp-surface1: @surface1;\n --ctp-surface0: @surface0;\n --ctp-base: @base;\n --ctp-mantle: @mantle;\n --ctp-crust: @crust;\n\n --background-color-base: @base;\n\n body,\n .vector-feature-zebra-design-enabled .vector-header-container .mw-header,\n .vector-feature-zebra-design-enabled .mw-page-container,\n .vector-feature-zebra-design-enabled .vector-pinned-container,\n .vector-feature-zebra-design-enabled\n .vector-dropdown\n .vector-dropdown-content,\n .uls-lcd,\n .uls-search,\n .uls-filtersuggestion,\n #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages,\n .app-badges .footer-sidebar-content,\n .pure-form input[type=\"search\"],\n .suggestions-dropdown,\n .cdx-menu,\n .vector-header-container .mw-header,\n .mw-page-container,\n .vector-pinned-container,\n .vector-header-container .vector-sticky-header,\n .mw-mmv-image,\n .mw-body,\n .frb-form-wrapper {\n background-color: @base;\n }\n\n body,\n .mw-heading,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n .vector-feature-zebra-design-enabled body,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-list-item-active\n > .vector-toc-link,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-expanded)\n > .vector-toc-link,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-list-item-active.vector-toc-level-1-active\n > .vector-toc-link,\n .vector-menu-tabs .mw-list-item.selected a,\n .vector-menu-tabs .mw-list-item.selected a:visited,\n .cdx-button:enabled,\n .cdx-button.cdx-button--fake-button--enabled,\n .mw-footer li,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-active)\n > .vector-toc-link,\n .central-featured-lang small,\n .footer-sidebar-text,\n .other-project-tagline,\n .site-license,\n .search-container .js-langpicker-label,\n .langlist > ul > li,\n .suggestion-title,\n .cdx-menu-item--enabled .cdx-menu-item__content,\n .mwe-popups .mwe-popups-extract,\n .mw-body-content .mw-number-text h3,\n .vector-pinnable-element .vector-menu-heading,\n .vector-toc .vector-toc-list-item-active > .vector-toc-link,\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-expanded)\n > .vector-toc-link,\n .vector-toc\n .vector-toc-list-item-active.vector-toc-level-1-active\n > .vector-toc-link,\n .uls-empty-state .uls-empty-state__header,\n .uls-empty-state .uls-empty-state__desc,\n .uls-no-results-found-title,\n .mw-mmv-post-image,\n .mw-mmv-credit,\n .frb-form-wrapper,\n #contentSub:not(:empty) {\n color: @text;\n }\n\n .mw-parser-output .fmbox {\n border-color: @surface2 !important;\n background-color: @base !important;\n }\n\n .cdx-thumbnail__image {\n border-color: @text;\n }\n\n /* maths */\n .equation-box,\n .equation-box * {\n background: none !important;\n }\n img.mwe-math-fallback-image-display,\n img.mwe-math-fallback-image-inline {\n & when (@lookup = latte) {\n filter: brightness(0) saturate(100%) invert(31%) sepia(9%)\n saturate(1499%) hue-rotate(196deg) brightness(90%) contrast(85%);\n }\n\n & when (@lookup = frappe) {\n filter: brightness(0) saturate(100%) invert(92%) sepia(6%)\n saturate(3753%) hue-rotate(184deg) brightness(93%) contrast(106%);\n }\n\n & when (@lookup = macchiato) {\n filter: brightness(0) saturate(100%) invert(82%) sepia(7%)\n saturate(1042%) hue-rotate(193deg) brightness(103%) contrast(92%);\n }\n\n & when (@lookup = mocha) {\n filter: brightness(0) saturate(100%) invert(83%) sepia(28%)\n saturate(223%) hue-rotate(190deg) brightness(99%) contrast(93%);\n }\n }\n\n .mwe-popups .mwe-popups-extract[dir=\"ltr\"]::after {\n background-image: linear-gradient(\n to right,\n rgba(255, 255, 255, 0),\n @surface0 50%\n );\n }\n table {\n background: @surface2 !important;\n }\n\n tr {\n background-color: @surface0 !important;\n }\n\n th {\n background: @overlay0 !important;\n color: @mantle !important;\n }\n\n .quotebox,\n div.thumbinner {\n background-color: @surface0 !important;\n border-color: @surface2 !important;\n }\n\n .navbox-group,\n .infobox-label {\n color: @text !important;\n }\n\n .cdx-button:enabled,\n .cdx-text-input__input:enabled {\n color: @text;\n background-color: @base;\n border-color: @surface2;\n &:hover {\n background-color: @mantle;\n border-color: @text;\n color: @text;\n }\n }\n\n .vector-dropdown .vector-dropdown-content,\n .header-container.header-chrome {\n background-color: @mantle;\n }\n\n .skin-vector .uls-search {\n border-bottom-color: @surface2;\n }\n\n .oo-ui-textInputWidget,\n .oo-ui-inputWidget-input {\n color: @text !important;\n background-color: @surface1 !important;\n border-color: @surface2 !important;\n }\n .oo-ui-tagItemWidget.oo-ui-widget-disabled {\n color: @text;\n background-color: @overlay0;\n text-shadow: 0 0 0 @text;\n border-color: @surface0;\n }\n\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled\n > .oo-ui-buttonElement-button,\n .mw-mmv-credit,\n .mw-mmv-options-dialog-header,\n .mw-mmv-options-text-header {\n color: @text;\n }\n\n .mw-mmv-options-text-body {\n color: @subtext0;\n }\n\n .mw-ui-input:not(:disabled) {\n background-color: @surface0;\n color: @text;\n border-color: @surface2;\n }\n\n .mw-ui-button {\n color: @mantle;\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n .imbox-delete {\n border-color: @red !important;\n background-color: @surface0 !important;\n }\n\n .imbox {\n background-color: @overlay0 !important;\n border-color: @peach !important;\n }\n\n .talkheader-help {\n background-color: @surface1 !important;\n border-color: @green !important;\n }\n\n .assess,\n .assess-NA,\n .navbox-subgroup {\n background: @surface0 !important;\n border-color: @surface1 !important;\n }\n\n .documentation,\n .documentation-container,\n .documentation-metadata {\n background-color: fade(@green, 15%) !important;\n }\n\n .ambox,\n .portalborder {\n background-color: @surface1 !important;\n border-color: @surface2 !important;\n }\n\n .navbox-title {\n color: @text !important;\n }\n\n .mw-highlight pre {\n background: @surface0 !important;\n border-width: 0;\n color: @text;\n }\n\n .mw-content-ltr.mw-highlight-lines pre,\n .mw-content-ltr.content .mw-highlight-lines pre {\n box-shadow: inset 2.75em 0 0 @surface1;\n }\n\n .mw-redirect when (@highlight-redirect = 1) {\n color: @green !important;\n }\n\n .mbox-text {\n color: @text !important;\n }\n\n .sidebar-above,\n .p,\n .o {\n color: @text !important;\n }\n .ni,\n .mw-templatedata-doc-muted {\n color: @subtext1 !important;\n }\n .nv,\n .nn {\n color: @blue !important;\n }\n\n .sidebar-above a span {\n color: @text !important;\n }\n\n .sidebar-title-with-pretitle span {\n color: @text !important;\n }\n\n .nt {\n color: @green !important;\n }\n\n .nl {\n color: @teal !important;\n }\n\n .ambox-style {\n border-left-color: @yellow !important;\n }\n\n .mw-parser-output .mainpage-frame {\n background: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .mw-parser-output .mainpage-heading-title {\n background: linear-gradient(\n to right,\n rgba(saturate(lighten(@accent-color, 4%), -3%), 0.4),\n @surface0\n ) !important;\n }\n\n .hidden-title {\n background-color: @green !important;\n color: @mantle !important;\n }\n\n .mw-mmv-post-image,\n .mw-mmv-options-dialog {\n background-color: @base;\n color: @text;\n }\n .mw-mmv-image-metadata {\n background-color: @base;\n border-color: @base;\n }\n\n .mw-mmv-dialog-down-arrow {\n background-color: @base !important;\n }\n\n .oo-ui-tagItemWidget.oo-ui-widget-enabled {\n color: @text;\n background-color: @overlay0 !important;\n border-color: @surface0;\n }\n\n ol.references li:target {\n background-color: @surface2;\n }\n\n .mw-body-content .error {\n color: @red;\n }\n\n .divbox-gray,\n .infobox-above {\n background-color: @surface2 !important;\n border-color: @overlay0 !important;\n }\n\n .biota > * > tr > th {\n background-color: @yellow !important;\n color: @mantle !important;\n }\n\n .cmbox {\n background-color: @blue !important;\n }\n\n .wikitable {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n }\n\n .wikitable > * > tr > th {\n background-color: @surface1 !important;\n }\n\n .wikitable > * > tr > td,\n .wikitable > * > tr > th {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2;\n }\n\n .mw-searchresults-has-iw .iw-result__header a {\n color: @text;\n }\n\n .mw-search-result-data {\n color: @subtext0;\n }\n\n .navbox-abovebelow {\n background-color: @overlay2 !important;\n border-color: @overlay2 !important;\n }\n\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .vector-menu-heading {\n color: @text;\n border-bottom-color: @surface0;\n }\n\n .mwe-popups .mwe-popups-container {\n background-color: @surface0;\n }\n\n .vector-pinnable-header-toggle-button {\n background-color: @surface0;\n color: @text;\n &:hover {\n background-color: @base;\n }\n }\n\n .mw-parser-output .navbox-list {\n border-color: @surface0;\n }\n\n .pure-button-primary-progressive,\n .pure-button-primary-progressive:hover {\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n .suggestion-link {\n border-bottom-color: @surface0;\n }\n\n .cdx-menu,\n .skin-vector .uls-menu,\n .suggestiodns-dropdown,\n .cdx-search-input--has-end-button,\n .vector-sticky-header,\n .vector-sticky-header-context-bar,\n .mw-heading2 {\n border-color: @surface2;\n }\n\n .suggestion-link.active {\n background-color: fade(@accent-color, 20%);\n .suggestion-title {\n color: @accent-color;\n }\n }\n\n .cdx-menu-item--enabled.cdx-menu-item--highlighted {\n background-color: fade(@accent-color, 20%);\n }\n\n .mw-mmv-post-image,\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive\n .cdx-button__icon {\n background-color: @crust;\n }\n\n .cdx-text-input__input:enabled::placeholder,\n .cdx-text-input__input:enabled ~ .cdx-text-input__icon-vue,\n .skin-vector .uls-languagefilter,\n .skin-vector .uls-lcd-region-title,\n .suggestion-description,\n .cdx-menu-item--enabled .cdx-menu-item__text__description,\n .mw-number-text,\n .boilerplate > div:nth-child(3) > span:nth-child(1),\n .boilerplate > div:nth-child(4) > span:nth-child(2) {\n color: @subtext0 !important;\n }\n\n input:hover + .cdx-button.cdx-button--action-progressive {\n background-color: fade(@accent-color, 12.5%);\n }\n\n #pt-notifications-alert .mw-echo-unseen-notifications::after {\n background-color: @red !important;\n }\n\n #pt-notifications-notice .mw-echo-unseen-notifications::after {\n background-color: @blue !important;\n }\n\n a,\n .mw-parser-output a.external:visited {\n color: @accent-color;\n &:visited {\n color: @mauve;\n }\n }\n\n a.new,\n .mw-parser-output .cs1-visible-error,\n .vector-menu-tabs .mw-list-item.new a,\n .mw-plusminus-neg {\n color: @red;\n }\n\n #searchInput {\n color: @text;\n &:hover {\n border-color: @surface2;\n }\n &:focus {\n border-color: @accent-color;\n }\n }\n\n .pure-form input[type=\"search\"] {\n border-color: @surface2;\n box-shadow: inset 0 0 0 1px @surface2;\n }\n\n #pt-notifications-alert .mw-echo-notifications-badge::after,\n #pt-notifications-notice .mw-echo-notifications-badge::after,\n .mw-echo-notification-badge-nojs::after {\n border-color: @crust;\n background-color: @accent-color;\n color: @base;\n }\n\n h2 {\n border-bottom-color: @surface2;\n }\n\n .mw-footer {\n border-top-color: @surface2;\n }\n\n .bookshelf {\n border-top-color: @surface0;\n box-shadow: 0 -1px 0 @surface0;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox,\n .mw-parser-output .tmbox,\n #talkheader {\n border-color: fade(@yellow, 20%) !important;\n background-color: fade(@yellow, 10%) !important;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox-daily th {\n border-color: fade(@yellow, 80%) !important;\n background-color: fade(@yellow, 20%) !important;\n }\n\n .fn.org {\n color: @accent-color;\n }\n\n .mw-parser-output .mp-toolbox-daily th,\n .mw-parser-output td.mp-toolbox-tfl-not {\n background: fade(@yellow, 20%) !important;\n border-color: fade(@yellow, 20%) !important;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox-daily {\n border-color: fade(@yellow, 20%) !important;\n background: none !important;\n }\n\n .mw-parser-output tr + tr > .navbox-list,\n .mw-parser-output tr + tr > .navbox-group {\n border-top-color: @surface0;\n }\n\n .ext-phonos-PhonosButton.oo-ui-buttonElement-frameless.oo-ui-buttonWidget\n > .oo-ui-buttonElement-button:hover {\n background-color: fade(@accent-color, 20%);\n }\n\n .styled-select:hover {\n background-color: @surface0;\n }\n\n .lang-list-button,\n .lang-list-button:hover {\n background-color: @base;\n border-color: @surface1;\n outline-color: @base;\n }\n\n .cdx-typeahead-search__search-footer__icon.cdx-icon {\n color: @subtext0;\n }\n\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-active)\n > .vector-toc-link {\n color: @text;\n }\n\n .lang-list-active .lang-list-button {\n background-color: @base;\n border-color: @surface1;\n outline-color: @base;\n }\n\n .lang-list-button:focus {\n box-shadow: inset 0 0 0 1px @accent-color;\n }\n\n .lang-list-border {\n background-color: @surface1;\n }\n\n .infobox-header {\n background-color: @surface1 !important;\n color: @text !important;\n }\n\n td[style*=\"background-color\"],\n td[style*=\"background-color\"] * {\n color: @crust !important;\n }\n\n #toc-Services > a:nth-child(1) > div:nth-child(1) {\n color: @text !important;\n }\n\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive,\n .vector-menu-tabs .mw-list-item a,\n .vector-feature-zebra-design-enabled .vector-toc .vector-toc-link,\n .mw-parser-output a.extiw,\n .mw-parser-output a.external,\n .mw-collapsible-toggle-default .mw-collapsible-text,\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .mw-list-item\n a,\n .vector-feature-zebra-design-enabled\n .vector-dropdown-content\n .mw-list-item\n a,\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .mw-list-item\n a:not(.mw-selflink):visited,\n .vector-feature-zebra-design-enabled\n .vector-dropdown-content\n .mw-list-item\n a:not(.mw-selflink):visited,\n .uls-language-block a,\n .lang-list-button,\n .fancycaptcha-reload,\n #pt-userpage-2 a:not(.mw-selflink),\n .vector-pinnable-element .mw-list-item a,\n .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited,\n .vector-toc .vector-toc-link,\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive\n > .oo-ui-buttonElement-button,\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive\n > .oo-ui-buttonElement-button:hover,\n .vector-dropdown-content .mw-list-item a,\n .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited {\n color: @accent-color;\n }\n\n .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive,\n .mw-ui-button.mw-ui-progressive:not(:disabled),\n .mw-ui-button.mw-ui-progressive:not(:disabled):hover {\n background-color: @accent-color;\n border-color: @accent-color;\n color: @base;\n }\n\n .mw-message-box-warning,\n .boilerplate {\n border-color: @accent-color !important;\n background-color: fade(@accent-color, 25%) !important;\n color: @text;\n }\n\n .vector-feature-zebra-design-enabled .vector-sticky-pinned-container::after,\n .vector-sticky-pinned-container::after {\n background: none;\n }\n\n .vector-feature-zebra-design-enabled .vector-pinnable-header-toggle-button {\n background-color: @surface0;\n color: @text;\n &:hover {\n background-color: @base;\n }\n }\n\n .vector-feature-zebra-design-enabled .vector-pinnable-header,\n .vector-pinnable-header,\n .vector-pinnable-element .vector-menu-heading {\n border-bottom-color: @surface0;\n }\n\n hr {\n border-bottom-color: @surface2;\n }\n\n .central-featured-lang strong:hover,\n .link-box:hover,\n .central-featured-lang :hover,\n .other-project-link:hover,\n .lang-list-container {\n background-color: @surface0;\n }\n\n .vector-page-toolbar-container {\n box-shadow: 0 1px @surface1;\n }\n\n .mw-parser-output .navbox-even {\n background-color: @surface1;\n }\n\n .vector-feature-zebra-design-enabled .vector-page-titlebar::after,\n .mw-parser-output .wikipedia-languages-prettybars,\n .vector-page-titlebar::after {\n background-color: @surface2 !important;\n }\n\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(2) {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type,\n .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type),\n .mw-collapsible-toggle-default::before,\n .mw-collapsible-toggle-default::after {\n color: @subtext1;\n }\n\n .infobox,\n .mw-parser-output .navbox,\n .catlinks,\n .mw-parser-output #mp-topbanner,\n .mw-parser-output .sidebar,\n .fancycaptcha-captcha-container,\n .fancycaptcha-captcha-and-reload,\n .cdx-checkbox__icon,\n .mw-message-box,\n .uls-menu .uls-no-results-view .uls-no-found-more,\n .client-js\n .vector-below-page-title\n .vector-page-titlebar-toc\n > label:nth-child(2),\n .mw-parser-output .ombox,\n code,\n .oo-ui-buttonElement-framed.oo-ui-widget-enabled\n > .oo-ui-buttonElement-button,\n .mw-mmv-label,\n #page-secondary-actions > a,\n .mw-parser-output .ambox,\n td[class=\"sidebar-navbar\"],\n textarea,\n .mw-parser-output .side-box {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n }\n\n #pagehistory li.selected {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n outline-color: @surface2 !important;\n }\n\n .cdx-checkbox__icon {\n border-color: @accent-color !important;\n }\n\n .fancycaptcha-captcha-container .mw-ui-inputو .mw-ui-input:not(:disabled) {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface1;\n }\n\n .mw-ui-input:not(:disabled),\n .mw-ui-button:not(:disabled) {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface1 !important;\n }\n\n .mw-parser-output .module-shortcutboxplain {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface2;\n }\n\n .sidebar-pretitle,\n .sidebar-title-with-pretitle,\n .sidebar-list-title {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .mw-parser-output #mp-bottom,\n .mw-parser-output .sidebar-collapse .sidebar-below {\n border-color: @surface2;\n }\n\n .lang-list-content,\n .bookshelf .text {\n background-color: @surface0;\n }\n\n .mw-parser-output #mp-bottom .mp-h2,\n .uls-language-block > ul > li:hover {\n background: @surface0;\n border-color: @surface2;\n }\n\n figure[typeof~=\"mw:File/Thumb\"] {\n background-color: @mantle !important;\n color: @text !important;\n border-top-color: @surface2;\n border-left-color: @surface2;\n border-right-color: @surface2;\n > figcaption {\n background-color: @mantle !important;\n color: @text !important;\n border-bottom-color: @surface2;\n border-left-color: @surface2;\n border-right-color: @surface2;\n }\n > :not(figcaption) .mw-file-element {\n color: @surface2 !important;\n border-color: @surface2;\n }\n }\n\n .mw-parser-output #mp-left,\n .mw-parser-output #mp-left .mp-h2,\n th[class=\"sidebar-title\"] {\n background-color: fade(@green, 10%) !important;\n border-color: fade(@green, 20%) !important;\n }\n\n .mw-plusminus-pos {\n color: @green !important;\n }\n\n .mw-parser-output #mp-right,\n .mw-parser-output #mp-right .mp-h2 {\n background-color: fade(@blue, 10%) !important;\n border-color: fade(@blue, 20%) !important;\n }\n\n .mw-parser-output #mp-lower,\n .mw-parser-output #mp-lower .mp-h2 {\n background-color: fade(@mauve, 10%) !important;\n border-color: fade(@mauve, 20%) !important;\n }\n\n .mw-collapsible-toggle-default:active .mw-collapsible-text {\n color: @peach;\n }\n\n .mw-parser-output #mp-middle,\n .mw-parser-output #mp-middle .mp-h2 {\n background-color: fade(@pink, 10%) !important;\n border-color: fade(@pink, 20%) !important;\n }\n\n .mw-parser-output .navbox-title,\n .summary,\n .infobox > tbody:nth-child(1) > tr:nth-child(4) > th:nth-child(1),\n .infobox > tbody:nth-child(1) > tr:nth-child(6) > th:nth-child(1) {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .infobox > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(1) {\n background-color: @surface1 !important;\n }\n\n .mw-parser-output .navbox-group,\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(3),\n table.expanded:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(4)\n > td:nth-child(2)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(3)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(4)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(5)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n .navbox-abovebelow {\n background-color: @surface1 !important;\n }\n\n .mw-content-ltr\n > table:nth-child(20)\n > tbody:nth-child(1)\n > tr:nth-child(2)\n > td:nth-child(2) {\n border-color: @surface2 !important;\n background-color: @surface0 !important;\n }\n\n [style=\"color:#02a64f;line-height:initial\"] {\n color: @green !important;\n }\n\n [style=\"color:#f78e1e;line-height:initial\"] {\n color: @peach !important;\n }\n\n [style=\"color:#77278b;line-height:initial\"] {\n color: @mauve !important;\n }\n\n [style=\"color:#87746a;line-height:initial\"] {\n color: @maroon !important;\n }\n\n [style=\"color:#009aC8;line-height:initial\"] {\n color: @sky !important;\n }\n\n [style=\"color:#ffd520;line-height:initial\"] {\n color: @yellow !important;\n }\n\n [style=\"color:#0060a9;line-height:initial\"] {\n color: @blue !important;\n }\n\n table.nowraplinks:nth-child(4) > tbody:nth-child(1) > tr:nth-child(1),\n .navbox-list-with-group.navbox-list.navbox-odd {\n background-color: @surface0 !important;\n }\n\n .mw-parser-output tr + tr > .navbox-abovebelow {\n border-color: @base;\n }\n\n .catlinks li {\n border-left-color: @surface2;\n }\n\n /* Fundraising banner */\n .frb-btn,\n .frb-label {\n color: @text;\n background-color: @base;\n border-color: @overlay0;\n }\n\n input[type=\"radio\"]:checked + .frb-btn,\n input[type=\"radio\"]:checked + .frb-label,\n .frb-btn:hover,\n .frb-label:hover {\n color: @base;\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n #frb-main {\n --wmui-base100: @base;\n --wmui-base0: @text;\n --frb-body: @text;\n --frb-muted: @subtext0;\n --frb-link: @subtext0;\n --frb-link-hover: @text;\n --frb-error: @red;\n --frb-submit: @accent-color;\n --frb-submit-hover: darken(@accent-color, 10%);\n\n svg.frb-message-icon > g {\n circle {\n fill: @yellow;\n }\n path {\n fill: @base;\n }\n }\n\n .frb-message {\n background-color: @green;\n border-color: @green;\n }\n\n .frb-message::after {\n border-left-color: @green;\n }\n }\n\n #frb-inline {\n --wmui-base100: @base;\n --frb-primary: @red;\n --frb-link: @accent-color;\n --frb-muted: @subtext0;\n --frb-muted-hover: @text;\n --frb-body: @text;\n --frb-error: @red;\n --wmui-red-dark: @red;\n --wmui-red-light: @red;\n --wmui-green-dark: @green;\n --wmui-green-light: @green;\n --frb-submit: @accent-color;\n --frb-submit-hover: darken(@accent-color, 10%);\n\n .frb-inline-topbar {\n color: @text;\n\n svg circle {\n fill: @yellow;\n }\n\n svg path {\n fill: @base;\n }\n }\n\n .frb-btn-cta {\n background-color: @accent-color !important;\n border-color: @accent-color !important;\n color: @base !important;\n }\n\n .frb-btn-simple {\n color: @accent-color !important;\n }\n\n .frb-monthly-pitch {\n color: @blue;\n }\n\n .frb-optin-no-prompt {\n color: @base;\n }\n\n .frb-cta-hiddenmessage {\n background-color: @red;\n color: @base;\n }\n }\n\n #frb-nag {\n --frb-primary-light: @base;\n --frb-body: @text;\n --wmui-accent-dark: @subtext0;\n --frb-link-hover: @text;\n\n span.frb-donate-button {\n color: @base;\n background-color: @red;\n\n &:hover {\n color: @base;\n background-color: darken(@red, 10%);\n }\n }\n\n svg.frb-icon-close > g {\n stroke: @subtext0;\n\n &:hover {\n stroke: @text;\n }\n }\n }\n\n .frb-nag:not(#frb-nag) {\n --frb-message-background: @base;\n --frb-message-border: @red;\n --frb-message: @text;\n border-color: @surface0;\n background: @base;\n box-shadow: none;\n\n #nag-rml-btn {\n background-color: transparent;\n border-color: transparent;\n color: @subtext0;\n }\n\n #nag-yes-btn {\n background-color: @accent-color;\n border-color: @accent-color;\n color: @base;\n }\n }\n\n .frb-btn-cta-label::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .frb-back {\n @svg-raw: '';\n @svg: escape(@svg-raw);\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .frb-close {\n @svg-raw: '';\n @svg: escape(@svg-raw);\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .sprite {\n @svg: escape(\n ''\n );\n background-image: linear-gradient(transparent, transparent),\n url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-logo-wordmark {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-logo-tagline {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-menu {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-ellipsis {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-feature-zebra-design-enabled\n .vector-dropdown\n .vector-dropdown-label:not(.cdx-button--icon-only)::after,\n .vector-icon.mw-ui-icon-wikimedia-expand {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .cdx-checkbox__input:checked:not(:indeterminate)\n + .cdx-checkbox__icon::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-page-titlebar\n .mw-portlet-lang\n .vector-dropdown-label.cdx-button--action-progressive.cdx-button--weight-quiet::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-dropdown .vector-dropdown-label:not(.cdx-button--icon-only)::after {\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-language-progressive {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-language {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .mw-parser-output a.external[class=\"external text\"][rel=\"nofollow\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n #mw-indicator-mw-helplink a {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n [alt=\"Edit this at Wikidata\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-listBullet {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n ul {\n @svg: escape(\n ''\n );\n list-style-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-volumeUp,\n .mw-ui-icon-volumeUp::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-fullScreen {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .fancycaptcha-reload {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .popups-icon--settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userAvatar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-watchlist {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-tray {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-bell {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-user-menu-logged-in .vector-dropdown-label::after {\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-star {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userTalk {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-sandbox {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-image-progressive.oo-ui-icon-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-labFlask {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-ui-icon-vector-gadget-pt-darkmode {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .client-dark-mode .mw-ui-icon-vector-gadget-pt-darkmode {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userContributions {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-logOut {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .uls-search-label,\n .vector-icon.mw-ui-icon-wikimedia-search {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-ui-icon-vector-gadget-pt-darkmode-sticky-header {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .cdx-message .cdx-message__icon {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-edit {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-history {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-speechBubbles {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-editLock {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .branding-box > a:nth-child(1) > span:nth-child(1) > img:nth-child(1) {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name Wikipedia Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/wikipedia\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia\n@version 0.0.20\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia\n@description Soothing pastel theme for Wikipedia\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n@var checkbox highlight-redirect \"Highlight redirect links\" 0\n==/UserStyle== */\n\n@-moz-document domain('wikipedia.org') {\n @import url(\"https://python.catppuccin.com/pygments/catppuccin-variables.important.css\");\n\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n --ctp-rosewater: @rosewater;\n --ctp-flamingo: @flamingo;\n --ctp-pink: @pink;\n --ctp-mauve: @mauve;\n --ctp-red: @red;\n --ctp-maroon: @maroon;\n --ctp-peach: @peach;\n --ctp-yellow: @yellow;\n --ctp-green: @green;\n --ctp-teal: @teal;\n --ctp-sky: @sky;\n --ctp-sapphire: @sapphire;\n --ctp-blue: @blue;\n --ctp-lavender: @lavender;\n --ctp-text: @text;\n --ctp-subtext1: @subtext1;\n --ctp-subtext0: @subtext0;\n --ctp-overlay2: @overlay2;\n --ctp-overlay1: @overlay1;\n --ctp-overlay0: @overlay0;\n --ctp-surface2: @surface2;\n --ctp-surface1: @surface1;\n --ctp-surface0: @surface0;\n --ctp-base: @base;\n --ctp-mantle: @mantle;\n --ctp-crust: @crust;\n\n --background-color-base: @base;\n\n body,\n .vector-feature-zebra-design-enabled .vector-header-container .mw-header,\n .vector-feature-zebra-design-enabled .mw-page-container,\n .vector-feature-zebra-design-enabled .vector-pinned-container,\n .vector-feature-zebra-design-enabled\n .vector-dropdown\n .vector-dropdown-content,\n .uls-lcd,\n .uls-search,\n .uls-filtersuggestion,\n #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages,\n .app-badges .footer-sidebar-content,\n .pure-form input[type=\"search\"],\n .suggestions-dropdown,\n .cdx-menu,\n .vector-header-container .mw-header,\n .mw-page-container,\n .vector-pinned-container,\n .vector-header-container .vector-sticky-header,\n .mw-mmv-image,\n .mw-body,\n .frb-form-wrapper {\n background-color: @base;\n }\n\n body,\n .mw-heading,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n .vector-feature-zebra-design-enabled body,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-list-item-active\n > .vector-toc-link,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-expanded)\n > .vector-toc-link,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-list-item-active.vector-toc-level-1-active\n > .vector-toc-link,\n .vector-menu-tabs .mw-list-item.selected a,\n .vector-menu-tabs .mw-list-item.selected a:visited,\n .cdx-button:enabled,\n .cdx-button.cdx-button--fake-button--enabled,\n .mw-footer li,\n .vector-feature-zebra-design-enabled\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-active)\n > .vector-toc-link,\n .central-featured-lang small,\n .footer-sidebar-text,\n .other-project-tagline,\n .site-license,\n .search-container .js-langpicker-label,\n .langlist > ul > li,\n .suggestion-title,\n .cdx-menu-item--enabled .cdx-menu-item__content,\n .mwe-popups .mwe-popups-extract,\n .mw-body-content .mw-number-text h3,\n .vector-pinnable-element .vector-menu-heading,\n .vector-toc .vector-toc-list-item-active > .vector-toc-link,\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-expanded)\n > .vector-toc-link,\n .vector-toc\n .vector-toc-list-item-active.vector-toc-level-1-active\n > .vector-toc-link,\n .uls-empty-state .uls-empty-state__header,\n .uls-empty-state .uls-empty-state__desc,\n .uls-no-results-found-title,\n .mw-mmv-post-image,\n .mw-mmv-credit,\n .frb-form-wrapper,\n #contentSub:not(:empty) {\n color: @text;\n }\n\n .mw-parser-output .fmbox {\n border-color: @surface2 !important;\n background-color: @base !important;\n }\n\n .cdx-thumbnail__image {\n border-color: @text;\n }\n\n /* maths */\n .equation-box,\n .equation-box * {\n background: none !important;\n }\n img.mwe-math-fallback-image-display,\n img.mwe-math-fallback-image-inline {\n & when (@lookup = latte) {\n filter: brightness(0) saturate(100%) invert(31%) sepia(9%)\n saturate(1499%) hue-rotate(196deg) brightness(90%) contrast(85%);\n }\n\n & when (@lookup = frappe) {\n filter: brightness(0) saturate(100%) invert(92%) sepia(6%)\n saturate(3753%) hue-rotate(184deg) brightness(93%) contrast(106%);\n }\n\n & when (@lookup = macchiato) {\n filter: brightness(0) saturate(100%) invert(82%) sepia(7%)\n saturate(1042%) hue-rotate(193deg) brightness(103%) contrast(92%);\n }\n\n & when (@lookup = mocha) {\n filter: brightness(0) saturate(100%) invert(83%) sepia(28%)\n saturate(223%) hue-rotate(190deg) brightness(99%) contrast(93%);\n }\n }\n\n .mwe-popups .mwe-popups-extract[dir=\"ltr\"]::after {\n background-image: linear-gradient(\n to right,\n rgba(255, 255, 255, 0),\n @surface0 50%\n );\n }\n table {\n background: @surface2 !important;\n }\n\n tr {\n background-color: @surface0 !important;\n }\n\n th {\n background: @overlay0 !important;\n color: @mantle !important;\n }\n\n .quotebox,\n div.thumbinner {\n background-color: @surface0 !important;\n border-color: @surface2 !important;\n }\n\n .navbox-group,\n .infobox-label {\n color: @text !important;\n }\n\n .cdx-button:enabled,\n .cdx-text-input__input:enabled {\n color: @text;\n background-color: @base;\n border-color: @surface2;\n &:hover {\n background-color: @mantle;\n border-color: @text;\n color: @text;\n }\n }\n\n .vector-dropdown .vector-dropdown-content,\n .header-container.header-chrome {\n background-color: @mantle;\n }\n\n .skin-vector .uls-search {\n border-bottom-color: @surface2;\n }\n\n .oo-ui-textInputWidget,\n .oo-ui-inputWidget-input {\n color: @text !important;\n background-color: @surface1 !important;\n border-color: @surface2 !important;\n }\n .oo-ui-tagItemWidget.oo-ui-widget-disabled {\n color: @text;\n background-color: @overlay0;\n text-shadow: 0 0 0 @text;\n border-color: @surface0;\n }\n\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled\n > .oo-ui-buttonElement-button,\n .mw-mmv-credit,\n .mw-mmv-options-dialog-header,\n .mw-mmv-options-text-header {\n color: @text;\n }\n\n .mw-mmv-options-text-body {\n color: @subtext0;\n }\n\n .mw-ui-input:not(:disabled) {\n background-color: @surface0;\n color: @text;\n border-color: @surface2;\n }\n\n .mw-ui-button {\n color: @mantle;\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n .imbox-delete {\n border-color: @red !important;\n background-color: @surface0 !important;\n }\n\n .imbox {\n background-color: @overlay0 !important;\n border-color: @peach !important;\n }\n\n .talkheader-help {\n background-color: @surface1 !important;\n border-color: @green !important;\n }\n\n .assess,\n .assess-NA,\n .navbox-subgroup {\n background: @surface0 !important;\n border-color: @surface1 !important;\n }\n\n .documentation,\n .documentation-container,\n .documentation-metadata {\n background-color: fade(@green, 15%) !important;\n }\n\n .ambox,\n .portalborder {\n background-color: @surface1 !important;\n border-color: @surface2 !important;\n }\n\n .navbox-title {\n color: @text !important;\n }\n\n .mw-highlight pre {\n background: @surface0 !important;\n border-width: 0;\n color: @text;\n }\n\n .mw-content-ltr.mw-highlight-lines pre,\n .mw-content-ltr.content .mw-highlight-lines pre {\n box-shadow: inset 2.75em 0 0 @surface1;\n }\n\n .mw-redirect when (@highlight-redirect = 1) {\n color: @green !important;\n }\n\n .mbox-text {\n color: @text !important;\n }\n\n .sidebar-above,\n .p,\n .o {\n color: @text !important;\n }\n .ni,\n .mw-templatedata-doc-muted {\n color: @subtext1 !important;\n }\n .nv,\n .nn {\n color: @blue !important;\n }\n\n .sidebar-above a span {\n color: @text !important;\n }\n\n .sidebar-title-with-pretitle span {\n color: @text !important;\n }\n\n .nt {\n color: @green !important;\n }\n\n .nl {\n color: @teal !important;\n }\n\n .ambox-style {\n border-left-color: @yellow !important;\n }\n\n .mw-parser-output .mainpage-frame {\n background: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .mw-parser-output .mainpage-heading-title {\n background: linear-gradient(\n to right,\n rgba(saturate(lighten(@accent-color, 4%), -3%), 0.4),\n @surface0\n ) !important;\n }\n\n .hidden-title {\n background-color: @green !important;\n color: @mantle !important;\n }\n\n .mw-mmv-post-image,\n .mw-mmv-options-dialog {\n background-color: @base;\n color: @text;\n }\n .mw-mmv-image-metadata {\n background-color: @base;\n border-color: @base;\n }\n\n .mw-mmv-dialog-down-arrow {\n background-color: @base !important;\n }\n\n .oo-ui-tagItemWidget.oo-ui-widget-enabled {\n color: @text;\n background-color: @overlay0 !important;\n border-color: @surface0;\n }\n\n ol.references li:target {\n background-color: @surface2;\n }\n\n .mw-body-content .error {\n color: @red;\n }\n\n .divbox-gray,\n .infobox-above {\n background-color: @surface2 !important;\n border-color: @overlay0 !important;\n }\n\n .biota > * > tr > th {\n background-color: @yellow !important;\n color: @mantle !important;\n }\n\n .cmbox {\n background-color: @blue !important;\n }\n\n .wikitable {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n }\n\n .wikitable > * > tr > th {\n background-color: @surface1 !important;\n }\n\n .wikitable > * > tr > td,\n .wikitable > * > tr > th {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2;\n }\n\n .mw-searchresults-has-iw .iw-result__header a {\n color: @text;\n }\n\n .mw-search-result-data {\n color: @subtext0;\n }\n\n .navbox-abovebelow {\n background-color: @overlay2 !important;\n border-color: @overlay2 !important;\n }\n\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .vector-menu-heading {\n color: @text;\n border-bottom-color: @surface0;\n }\n\n .mwe-popups .mwe-popups-container {\n background-color: @surface0;\n }\n\n .vector-pinnable-header-toggle-button {\n background-color: @surface0;\n color: @text;\n &:hover {\n background-color: @base;\n }\n }\n\n .mw-parser-output .navbox-list {\n border-color: @surface0;\n }\n\n .pure-button-primary-progressive,\n .pure-button-primary-progressive:hover {\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n .suggestion-link {\n border-bottom-color: @surface0;\n }\n\n .cdx-menu,\n .skin-vector .uls-menu,\n .suggestiodns-dropdown,\n .cdx-search-input--has-end-button,\n .vector-sticky-header,\n .vector-sticky-header-context-bar,\n .mw-heading2 {\n border-color: @surface2;\n }\n\n .suggestion-link.active {\n background-color: fade(@accent-color, 20%);\n .suggestion-title {\n color: @accent-color;\n }\n }\n\n .cdx-menu-item--enabled.cdx-menu-item--highlighted {\n background-color: fade(@accent-color, 20%);\n }\n\n .mw-mmv-post-image,\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive\n .cdx-button__icon {\n background-color: @crust;\n }\n\n .cdx-text-input__input:enabled::placeholder,\n .cdx-text-input__input:enabled ~ .cdx-text-input__icon-vue,\n .skin-vector .uls-languagefilter,\n .skin-vector .uls-lcd-region-title,\n .suggestion-description,\n .cdx-menu-item--enabled .cdx-menu-item__text__description,\n .mw-number-text,\n .boilerplate > div:nth-child(3) > span:nth-child(1),\n .boilerplate > div:nth-child(4) > span:nth-child(2) {\n color: @subtext0 !important;\n }\n\n input:hover + .cdx-button.cdx-button--action-progressive {\n background-color: fade(@accent-color, 12.5%);\n }\n\n #pt-notifications-alert .mw-echo-unseen-notifications::after {\n background-color: @red !important;\n }\n\n #pt-notifications-notice .mw-echo-unseen-notifications::after {\n background-color: @blue !important;\n }\n\n a,\n .mw-parser-output a.external:visited {\n color: @accent-color;\n &:visited {\n color: @mauve;\n }\n }\n\n a.new,\n .mw-parser-output .cs1-visible-error,\n .vector-menu-tabs .mw-list-item.new a,\n .mw-plusminus-neg {\n color: @red;\n }\n\n a.mw-selflink {\n color: @text;\n }\n\n #searchInput {\n color: @text;\n &:hover {\n border-color: @surface2;\n }\n &:focus {\n border-color: @accent-color;\n }\n }\n\n .pure-form input[type=\"search\"] {\n border-color: @surface2;\n box-shadow: inset 0 0 0 1px @surface2;\n }\n\n #pt-notifications-alert .mw-echo-notifications-badge::after,\n #pt-notifications-notice .mw-echo-notifications-badge::after,\n .mw-echo-notification-badge-nojs::after {\n border-color: @crust;\n background-color: @accent-color;\n color: @base;\n }\n\n h2 {\n border-bottom-color: @surface2;\n }\n\n .mw-footer {\n border-top-color: @surface2;\n }\n\n .bookshelf {\n border-top-color: @surface0;\n box-shadow: 0 -1px 0 @surface0;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox,\n .mw-parser-output .tmbox,\n #talkheader {\n border-color: fade(@yellow, 20%) !important;\n background-color: fade(@yellow, 10%) !important;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox-daily th {\n border-color: fade(@yellow, 80%) !important;\n background-color: fade(@yellow, 20%) !important;\n }\n\n .fn.org {\n color: @accent-color;\n }\n\n .mw-parser-output .mp-toolbox-daily th,\n .mw-parser-output td.mp-toolbox-tfl-not {\n background: fade(@yellow, 20%) !important;\n border-color: fade(@yellow, 20%) !important;\n }\n\n body.ns-talk .mw-parser-output .mp-toolbox-daily {\n border-color: fade(@yellow, 20%) !important;\n background: none !important;\n }\n\n .mw-parser-output tr + tr > .navbox-list,\n .mw-parser-output tr + tr > .navbox-group {\n border-top-color: @surface0;\n }\n\n .ext-phonos-PhonosButton.oo-ui-buttonElement-frameless.oo-ui-buttonWidget\n > .oo-ui-buttonElement-button:hover {\n background-color: fade(@accent-color, 20%);\n }\n\n .styled-select:hover {\n background-color: @surface0;\n }\n\n .lang-list-button,\n .lang-list-button:hover {\n background-color: @base;\n border-color: @surface1;\n outline-color: @base;\n }\n\n .cdx-typeahead-search__search-footer__icon.cdx-icon {\n color: @subtext0;\n }\n\n .vector-toc\n .vector-toc-level-1-active:not(.vector-toc-list-item-active)\n > .vector-toc-link {\n color: @text;\n }\n\n .lang-list-active .lang-list-button {\n background-color: @base;\n border-color: @surface1;\n outline-color: @base;\n }\n\n .lang-list-button:focus {\n box-shadow: inset 0 0 0 1px @accent-color;\n }\n\n .lang-list-border {\n background-color: @surface1;\n }\n\n .infobox-header {\n background-color: @surface1 !important;\n color: @text !important;\n }\n\n td[style*=\"background-color\"],\n td[style*=\"background-color\"] * {\n color: @crust !important;\n }\n\n #toc-Services > a:nth-child(1) > div:nth-child(1) {\n color: @text !important;\n }\n\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive,\n .vector-menu-tabs .mw-list-item a,\n .vector-feature-zebra-design-enabled .vector-toc .vector-toc-link,\n .mw-parser-output a.extiw,\n .mw-parser-output a.external,\n .mw-collapsible-toggle-default .mw-collapsible-text,\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .mw-list-item\n a,\n .vector-feature-zebra-design-enabled\n .vector-dropdown-content\n .mw-list-item\n a,\n .vector-feature-zebra-design-enabled\n .vector-pinnable-element\n .mw-list-item\n a:not(.mw-selflink):visited,\n .vector-feature-zebra-design-enabled\n .vector-dropdown-content\n .mw-list-item\n a:not(.mw-selflink):visited,\n .uls-language-block a,\n .lang-list-button,\n .fancycaptcha-reload,\n #pt-userpage-2 a:not(.mw-selflink),\n .vector-pinnable-element .mw-list-item a,\n .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited,\n .vector-toc .vector-toc-link,\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive\n > .oo-ui-buttonElement-button,\n .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive\n > .oo-ui-buttonElement-button:hover,\n .vector-dropdown-content .mw-list-item a,\n .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited {\n color: @accent-color;\n }\n\n .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive,\n .mw-ui-button.mw-ui-progressive:not(:disabled),\n .mw-ui-button.mw-ui-progressive:not(:disabled):hover {\n background-color: @accent-color;\n border-color: @accent-color;\n color: @base;\n }\n\n .mw-message-box-warning,\n .boilerplate {\n border-color: @accent-color !important;\n background-color: fade(@accent-color, 25%) !important;\n color: @text;\n }\n\n .vector-feature-zebra-design-enabled .vector-sticky-pinned-container::after,\n .vector-sticky-pinned-container::after {\n background: none;\n }\n\n .vector-feature-zebra-design-enabled .vector-pinnable-header-toggle-button {\n background-color: @surface0;\n color: @text;\n &:hover {\n background-color: @base;\n }\n }\n\n .vector-feature-zebra-design-enabled .vector-pinnable-header,\n .vector-pinnable-header,\n .vector-pinnable-element .vector-menu-heading {\n border-bottom-color: @surface0;\n }\n\n hr {\n border-bottom-color: @surface2;\n }\n\n .central-featured-lang strong:hover,\n .link-box:hover,\n .central-featured-lang :hover,\n .other-project-link:hover,\n .lang-list-container {\n background-color: @surface0;\n }\n\n .vector-page-toolbar-container {\n box-shadow: 0 1px @surface1;\n }\n\n .mw-parser-output .navbox-even {\n background-color: @surface1;\n }\n\n .vector-feature-zebra-design-enabled .vector-page-titlebar::after,\n .mw-parser-output .wikipedia-languages-prettybars,\n .vector-page-titlebar::after {\n background-color: @surface2 !important;\n }\n\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(2) {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type,\n .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type),\n .mw-collapsible-toggle-default::before,\n .mw-collapsible-toggle-default::after {\n color: @subtext1;\n }\n\n .infobox,\n .mw-parser-output .navbox,\n .catlinks,\n .mw-parser-output #mp-topbanner,\n .mw-parser-output .sidebar,\n .fancycaptcha-captcha-container,\n .fancycaptcha-captcha-and-reload,\n .cdx-checkbox__icon,\n .mw-message-box,\n .uls-menu .uls-no-results-view .uls-no-found-more,\n .client-js\n .vector-below-page-title\n .vector-page-titlebar-toc\n > label:nth-child(2),\n .mw-parser-output .ombox,\n code,\n .oo-ui-buttonElement-framed.oo-ui-widget-enabled\n > .oo-ui-buttonElement-button,\n .mw-mmv-label,\n #page-secondary-actions > a,\n .mw-parser-output .ambox,\n td[class=\"sidebar-navbar\"],\n textarea,\n .mw-parser-output .side-box {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n }\n\n #pagehistory li.selected {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n outline-color: @surface2 !important;\n }\n\n .cdx-checkbox__icon {\n border-color: @accent-color !important;\n }\n\n .fancycaptcha-captcha-container .mw-ui-inputو .mw-ui-input:not(:disabled) {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface1;\n }\n\n .mw-ui-input:not(:disabled),\n .mw-ui-button:not(:disabled) {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface1 !important;\n }\n\n .mw-parser-output .module-shortcutboxplain {\n background-color: @base !important;\n color: @text !important;\n border-color: @surface2;\n }\n\n .sidebar-pretitle,\n .sidebar-title-with-pretitle,\n .sidebar-list-title {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .mw-parser-output #mp-bottom,\n .mw-parser-output .sidebar-collapse .sidebar-below {\n border-color: @surface2;\n }\n\n .lang-list-content,\n .bookshelf .text {\n background-color: @surface0;\n }\n\n .mw-parser-output #mp-bottom .mp-h2,\n .uls-language-block > ul > li:hover {\n background: @surface0;\n border-color: @surface2;\n }\n\n figure[typeof~=\"mw:File/Thumb\"] {\n background-color: @mantle !important;\n color: @text !important;\n border-top-color: @surface2;\n border-left-color: @surface2;\n border-right-color: @surface2;\n > figcaption {\n background-color: @mantle !important;\n color: @text !important;\n border-bottom-color: @surface2;\n border-left-color: @surface2;\n border-right-color: @surface2;\n }\n > :not(figcaption) .mw-file-element {\n color: @surface2 !important;\n border-color: @surface2;\n }\n }\n\n .mw-parser-output #mp-left,\n .mw-parser-output #mp-left .mp-h2,\n th[class=\"sidebar-title\"] {\n background-color: fade(@green, 10%) !important;\n border-color: fade(@green, 20%) !important;\n }\n\n .mw-plusminus-pos {\n color: @green !important;\n }\n\n .mw-parser-output #mp-right,\n .mw-parser-output #mp-right .mp-h2 {\n background-color: fade(@blue, 10%) !important;\n border-color: fade(@blue, 20%) !important;\n }\n\n .mw-parser-output #mp-lower,\n .mw-parser-output #mp-lower .mp-h2 {\n background-color: fade(@mauve, 10%) !important;\n border-color: fade(@mauve, 20%) !important;\n }\n\n .mw-collapsible-toggle-default:active .mw-collapsible-text {\n color: @peach;\n }\n\n .mw-parser-output #mp-middle,\n .mw-parser-output #mp-middle .mp-h2 {\n background-color: fade(@pink, 10%) !important;\n border-color: fade(@pink, 20%) !important;\n }\n\n .mw-parser-output .navbox-title,\n .summary,\n .infobox > tbody:nth-child(1) > tr:nth-child(4) > th:nth-child(1),\n .infobox > tbody:nth-child(1) > tr:nth-child(6) > th:nth-child(1) {\n background-color: fade(@accent-color, 20%) !important;\n }\n\n .infobox > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(1) {\n background-color: @surface1 !important;\n }\n\n .mw-parser-output .navbox-group,\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(3),\n table.expanded:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(4)\n > td:nth-child(2)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(3)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(4)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n table.nowraplinks:nth-child(1)\n > tbody:nth-child(1)\n > tr:nth-child(5)\n > td:nth-child(1)\n > table:nth-child(2)\n > tbody:nth-child(1)\n > tr:nth-child(1),\n .navbox-abovebelow {\n background-color: @surface1 !important;\n }\n\n .mw-parser-output .tracklist > tbody {\n color: inherit;\n\n > .tracklist-total-length * {\n background-color: @overlay1;\n color: @base;\n }\n }\n\n .mw-content-ltr\n > table:nth-child(20)\n > tbody:nth-child(1)\n > tr:nth-child(2)\n > td:nth-child(2) {\n border-color: @surface2 !important;\n background-color: @surface0 !important;\n }\n\n .noarticletext,\n #noarticletext {\n background-color: @base !important;\n }\n\n #sisterproject {\n background-color: @mantle !important;\n }\n\n [style=\"color:#02a64f;line-height:initial\"] {\n color: @green !important;\n }\n\n [style=\"color:#f78e1e;line-height:initial\"] {\n color: @peach !important;\n }\n\n [style=\"color:#77278b;line-height:initial\"] {\n color: @mauve !important;\n }\n\n [style=\"color:#87746a;line-height:initial\"] {\n color: @maroon !important;\n }\n\n [style=\"color:#009aC8;line-height:initial\"] {\n color: @sky !important;\n }\n\n [style=\"color:#ffd520;line-height:initial\"] {\n color: @yellow !important;\n }\n\n [style=\"color:#0060a9;line-height:initial\"] {\n color: @blue !important;\n }\n\n table.nowraplinks:nth-child(4) > tbody:nth-child(1) > tr:nth-child(1),\n .navbox-list-with-group.navbox-list.navbox-odd {\n background-color: @surface0 !important;\n }\n\n .mw-parser-output tr + tr > .navbox-abovebelow {\n border-color: @base;\n }\n\n .catlinks li {\n border-left-color: @surface2;\n }\n\n /* Fundraising banner */\n .frb-btn,\n .frb-label {\n color: @text;\n background-color: @base;\n border-color: @overlay0;\n }\n\n input[type=\"radio\"]:checked + .frb-btn,\n input[type=\"radio\"]:checked + .frb-label,\n .frb-btn:hover,\n .frb-label:hover {\n color: @base;\n background-color: @accent-color;\n border-color: @accent-color;\n }\n\n #frb-main {\n --wmui-base100: @base;\n --wmui-base0: @text;\n --frb-body: @text;\n --frb-muted: @subtext0;\n --frb-link: @subtext0;\n --frb-link-hover: @text;\n --frb-error: @red;\n --frb-submit: @accent-color;\n --frb-submit-hover: darken(@accent-color, 10%);\n\n svg.frb-message-icon > g {\n circle {\n fill: @yellow;\n }\n path {\n fill: @base;\n }\n }\n\n .frb-message {\n background-color: @green;\n border-color: @green;\n }\n\n .frb-message::after {\n border-left-color: @green;\n }\n }\n\n #frb-inline {\n --wmui-base100: @base;\n --frb-primary: @red;\n --frb-link: @accent-color;\n --frb-muted: @subtext0;\n --frb-muted-hover: @text;\n --frb-body: @text;\n --frb-error: @red;\n --wmui-red-dark: @red;\n --wmui-red-light: @red;\n --wmui-green-dark: @green;\n --wmui-green-light: @green;\n --frb-submit: @accent-color;\n --frb-submit-hover: darken(@accent-color, 10%);\n\n .frb-inline-topbar {\n color: @text;\n\n svg circle {\n fill: @yellow;\n }\n\n svg path {\n fill: @base;\n }\n }\n\n .frb-btn-cta {\n background-color: @accent-color !important;\n border-color: @accent-color !important;\n color: @base !important;\n }\n\n .frb-btn-simple {\n color: @accent-color !important;\n }\n\n .frb-monthly-pitch {\n color: @blue;\n }\n\n .frb-optin-no-prompt {\n color: @base;\n }\n\n .frb-cta-hiddenmessage {\n background-color: @red;\n color: @base;\n }\n }\n\n #frb-nag {\n --frb-primary-light: @base;\n --frb-body: @text;\n --wmui-accent-dark: @subtext0;\n --frb-link-hover: @text;\n\n span.frb-donate-button {\n color: @base;\n background-color: @red;\n\n &:hover {\n color: @base;\n background-color: darken(@red, 10%);\n }\n }\n\n svg.frb-icon-close > g {\n stroke: @subtext0;\n\n &:hover {\n stroke: @text;\n }\n }\n }\n\n .frb-nag:not(#frb-nag) {\n --frb-message-background: @base;\n --frb-message-border: @red;\n --frb-message: @text;\n border-color: @surface0;\n background: @base;\n box-shadow: none;\n\n #nag-rml-btn {\n background-color: transparent;\n border-color: transparent;\n color: @subtext0;\n }\n\n #nag-yes-btn {\n background-color: @accent-color;\n border-color: @accent-color;\n color: @base;\n }\n }\n\n .frb-btn-cta-label::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .frb-back {\n @svg-raw: '';\n @svg: escape(@svg-raw);\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .frb-close {\n @svg-raw: '';\n @svg: escape(@svg-raw);\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .sprite {\n @svg: escape(\n ''\n );\n background-image: linear-gradient(transparent, transparent),\n url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-logo-wordmark {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-logo-tagline {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-menu {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-ellipsis {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-feature-zebra-design-enabled\n .vector-dropdown\n .vector-dropdown-label:not(.cdx-button--icon-only)::after,\n .vector-icon.mw-ui-icon-wikimedia-expand {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .cdx-checkbox__input:checked:not(:indeterminate)\n + .cdx-checkbox__icon::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-page-titlebar\n .mw-portlet-lang\n .vector-dropdown-label.cdx-button--action-progressive.cdx-button--weight-quiet::after {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-dropdown .vector-dropdown-label:not(.cdx-button--icon-only)::after {\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-language-progressive {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-language {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .mw-parser-output a.external {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .plainlinks a.external {\n background: none !important;\n }\n\n #mw-indicator-mw-helplink a {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n [alt=\"Edit this at Wikidata\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n .vector-icon.mw-ui-icon-wikimedia-listBullet {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n ul {\n @svg: escape(\n ''\n );\n list-style-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-volumeUp,\n .mw-ui-icon-volumeUp::before {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-fullScreen {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .fancycaptcha-reload {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .popups-icon--settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userAvatar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-watchlist {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-tray {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-bell {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-user-menu-logged-in .vector-dropdown-label::after {\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-star {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userTalk {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-sandbox {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-image-progressive.oo-ui-icon-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-labFlask {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-ui-icon-vector-gadget-pt-darkmode {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .client-dark-mode .mw-ui-icon-vector-gadget-pt-darkmode {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-userContributions {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-logOut {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .uls-search-label,\n .vector-icon.mw-ui-icon-wikimedia-search {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .mw-ui-icon-vector-gadget-pt-darkmode-sticky-header {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .cdx-message .cdx-message__icon {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-edit {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-history {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-speechBubbles {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .vector-icon.mw-ui-icon-wikimedia-editLock {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .branding-box > a:nth-child(1) > span:nth-child(1) > img:nth-child(1) {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Wikipedia Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/wikipedia",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia",
- "version": "0.0.17",
+ "version": "0.0.20",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia",
"description": "Soothing pastel theme for Wikipedia",
@@ -2632,11 +2633,12 @@
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.css",
"name": "Wikipedia Catppuccin",
- "originalDigest": "4a5b473ae284d89497cc02f746cca1e05db448c2",
+ "originalDigest": "bc5a09434c77175256e37633bc7fd01f9365e2a5",
"_id": "1041e719-a6f4-4e67-8ae9-ccc268aad05c",
- "_rev": 1715536222185,
+ "_rev": 1718609785672,
"id": 15,
- "etag": "W/\"2bd52bc5ce77e787de219bc34ab81d5bb2b7f9cbca94c70986241a6e5a891d4d\""
+ "etag": "W/\"3ad84477408de9f40c3e1eb627790fc6b3cae05bcfeb20e96d5a658a553ba06f\"",
+ "updateDate": 1718609785610
},
{
"enabled": true,
@@ -2646,12 +2648,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name Google Drive Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/google-drive\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google-drive\n@version 0.0.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-drive\n@description Soothing pastel theme for Google Drive\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain('drive.google.com') {\n :root:has(.KkxPLb) {\n .vhoiae.vhoiae.vhoiae,\n & {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n :root:has(.LgGVmb) {\n .vhoiae.vhoiae.vhoiae,\n & {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --dt-on-background: @text;\n --dt-on-background-secondary: @subtext0;\n --dt-background: @base;\n --dt-on-surface: @text;\n --dt-inverse-surface: @text;\n --dt-on-surface-secondary: @subtext0;\n --dt-on-surface-variant: @text;\n --dt-surface-variant: @surface0;\n --dt-inverse-on-surface: @surface0;\n --dt-surface: @base;\n --dt-surface-tint: @accent-color;\n --dt-shadow-elevation-1: 0px 3px 1px -2px fade(@base, 20%),\n 0px 2px 2px 0px fade(@base, 14%), 0px 1px 5px 0px fade(@base, 12%);\n --dt-shadow-elevation-2: 0px 2px 4px -1px fade(@base, 20%),\n 0px 4px 5px 0px fade(@base, 14%), 0px 1px 10px 0px fade(@base, 12%);\n --dt-shadow-elevation-3: 0px 5px 5px -3px fade(@base, 20%),\n 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%);\n --dt-shadow-elevation-4: 0px 5px 5px -3px fade(@base, 20%),\n 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%);\n --dt-shadow-elevation-5: 0px 8px 10px -6px fade(@base, 20%),\n 0px 16px 24px 2px fade(@base, 14%), 0px 6px 30px 5px fade(@base, 12%);\n --dt-surface-container-lowest: @crust;\n --dt-surface-container-low: @mantle;\n --dt-surface-container: @surface0;\n --dt-surface-container-high: @surface1;\n --dt-surface-container-highest: @surface2;\n --dt-surface-dim: @crust;\n --dt-surface-bright: @base;\n --dt-on-primary-container: @text;\n --dt-primary-container-icon: @text;\n --dt-primary-container-link: @text;\n --dt-primary: @accent-color;\n --dt-primary-action: @accent-color;\n --dt-primary-action-stateful: @accent-color;\n --dt-primary-outline: @accent-color;\n --dt-primary-action-state-layer: @accent-color;\n --dt-primary-container: @surface0;\n --dt-on-primary: @base;\n --dt-primary-icon: @base;\n --dt-primary-link: @base;\n --dt-on-secondary-container: @text;\n --dt-secondary-container-icon: @text;\n --dt-secondary-container-link: @text;\n --dt-secondary: @accent-color;\n --dt-secondary-action: @accent-color;\n --dt-secondary-action-stateful: @accent-color;\n --dt-secondary-outline: @accent-color;\n --dt-secondary-action-state-layer: @accent-color;\n --dt-secondary-container: @surface0;\n --dt-on-secondary: @base;\n --dt-secondary-icon: @base;\n --dt-secondary-link: @base;\n --dt-on-tertiary-container: @text;\n --dt-tertiary-container-icon: @text;\n --dt-tertiary-container-link: @text;\n --dt-tertiary: @accent-color;\n --dt-tertiary-action: @accent-color;\n --dt-tertiary-action-stateful: @accent-color;\n --dt-tertiary-outline: @accent-color;\n --dt-tertiary-action-state-layer: @accent-color;\n --dt-tertiary-container: @surface0;\n --dt-on-tertiary: @base;\n --dt-tertiary-icon: @base;\n --dt-tertiary-link: @base;\n --dt-on-neutral-container: @text;\n --dt-neutral-container-icon: @text;\n --dt-neutral-container-link: @text;\n --dt-neutral: @surface0;\n --dt-neutral-action: @surface0;\n --dt-neutral-action-stateful: @surface0;\n --dt-neutral-outline: @surface0;\n --dt-neutral-action-state-layer: @surface0;\n --dt-neutral-container: @surface0;\n --dt-on-neutral: @text;\n --dt-neutral-icon: @surface0;\n --dt-neutral-link: @surface0;\n --dt-on-warning-container: @yellow;\n --dt-warning-container-icon: @yellow;\n --dt-warning-container-link: @yellow;\n --dt-warning: @yellow;\n --dt-warning-action: @yellow;\n --dt-warning-action-stateful: @yellow;\n --dt-warning-outline: @yellow;\n --dt-warning-action-state-layer: @yellow;\n --dt-warning-container: @surface0;\n --dt-on-warning: @base;\n --dt-warning-icon: @yellow;\n --dt-warning-link: @yellow;\n --dt-on-error-container: @red;\n --dt-error-container-icon: @red;\n --dt-error-container-link: @red;\n --dt-error: @red;\n --dt-error-action: @red;\n --dt-error-action-stateful: @red;\n --dt-error-outline: @red;\n --dt-error-action-state-layer: @surface1;\n --dt-error-container: @surface1;\n --dt-on-error: @base;\n --dt-error-icon: @base;\n --dt-error-link: @base;\n --dt-mime-type-blue: @blue;\n --dt-mime-type-dark-blue: @blue;\n --dt-mime-type-green: @green;\n --dt-mime-type-grey: @overlay0;\n --dt-mime-type-purple: @mauve;\n --dt-mime-type-deep-purple: @mauve;\n --dt-mime-type-red: @red;\n --dt-mime-type-yellow: @yellow;\n --dt-disabled: @overlay0;\n --dt-on-disabled: @text;\n --dt-outline: @overlay0;\n --dt-outline-variant: @surface2;\n --dt-light-info-banner-button: @text;\n --dt-light-neutral-banner-button: @text;\n --dt-light-success-banner-button: @green;\n --dt-light-warning-banner-button: @yellow;\n --dt-light-error-banner-button: @red;\n\n --gm3-sys-color-background: @base;\n --gm3-sys-color-background-rgb: #rgbify(@base) [];\n --gm3-sys-color-error: @red;\n --gm3-sys-color-error-rgb: #rgbify(@red) [];\n --gm3-sys-color-error-container: @surface2;\n --gm3-sys-color-error-container-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-inverse-on-surface: @surface0;\n --gm3-sys-color-inverse-on-surface-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-inverse-primary: red;\n --gm3-sys-color-inverse-primary-rgb: 255, 0, 0;\n --gm3-sys-color-inverse-surface: @text;\n --gm3-sys-color-inverse-surface-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-background: @text;\n --gm3-sys-color-on-background-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-error: @base;\n --gm3-sys-color-on-error-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-error-container: @red;\n --gm3-sys-color-on-error-container-rgb: #rgbify(@red) [];\n --gm3-sys-color-on-primary: @base;\n --gm3-sys-color-on-primary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-primary-container: @text;\n --gm3-sys-color-on-primary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-primary-fixed: @base;\n --gm3-sys-color-on-primary-fixed-rgb: #rgbify(@base);\n --gm3-sys-color-on-primary-fixed-variant: @base;\n --gm3-sys-color-on-primary-fixed-variant-rgb: #rgbify(@base);\n --gm3-sys-color-on-secondary: @base;\n --gm3-sys-color-on-secondary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-secondary-container: @text;\n --gm3-sys-color-on-secondary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-secondary-fixed: @base;\n --gm3-sys-color-on-secondary-fixed-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-secondary-fixed-variant: @base;\n --gm3-sys-color-on-secondary-fixed-variant-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-surface: @text;\n --gm3-sys-color-on-surface-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-surface-variant: @text;\n --gm3-sys-color-on-surface-variant-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-tertiary: @base;\n --gm3-sys-color-on-tertiary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-tertiary-container: @text;\n --gm3-sys-color-on-tertiary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-tertiary-fixed: @base;\n --gm3-sys-color-on-tertiary-fixed-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-tertiary-fixed-variant: @base;\n --gm3-sys-color-on-tertiary-fixed-variant-rgb: #rgbify(@base) [];\n --gm3-sys-color-outline: @overlay0;\n --gm3-sys-color-outline-rgb: #rgbify(@overlay0) [];\n --gm3-sys-color-outline-variant: @surface2;\n --gm3-sys-color-outline-variant-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-primary: @accent-color;\n --gm3-sys-color-primary-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-primary-container: @surface0;\n --gm3-sys-color-primary-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-primary-fixed: @accent-color;\n --gm3-sys-color-primary-fixed-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-primary-fixed-dim: @accent-color;\n --gm3-sys-color-primary-fixed-dim-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-secondary: @accent-color;\n --gm3-sys-color-secondary-rgb: #rgbify(@accent-color);\n --gm3-sys-color-secondary-container: @surface0;\n --gm3-sys-color-secondary-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-secondary-fixed: #c2e7ff;\n --gm3-sys-color-secondary-fixed-rgb: 194, 231, 255;\n --gm3-sys-color-secondary-fixed-dim: #7fcfff;\n --gm3-sys-color-secondary-fixed-dim-rgb: 127, 207, 255;\n --gm3-sys-color-surface: @base;\n --gm3-sys-color-surface-rgb: #rgbify(@base) [];\n --gm3-sys-color-surface-bright: @base;\n --gm3-sys-color-surface-bright-rgb: #rgbify(@base) [];\n --gm3-sys-color-surface-container: @surface0;\n --gm3-sys-color-surface-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-surface-container-high: @surface1;\n --gm3-sys-color-surface-container-high-rgb: #rgbify(@surface1) [];\n --gm3-sys-color-surface-container-highest: @surface2;\n --gm3-sys-color-surface-container-highest-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-surface-container-low: @mantle;\n --gm3-sys-color-surface-container-low-rgb: #rgbify(@mantle) [];\n --gm3-sys-color-surface-container-lowest: @crust;\n --gm3-sys-color-surface-container-lowest-rgb: #rgbify(@crust) [];\n --gm3-sys-color-surface-dim: @crust;\n --gm3-sys-color-surface-dim-rgb: #rgbify(@crust) [];\n --gm3-sys-color-surface-tint: @accent-color;\n --gm3-sys-color-surface-tint-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-surface-variant: @surface0;\n --gm3-sys-color-surface-variant-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-tertiary: @accent-color;\n --gm3-sys-color-tertiary-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-tertiary-container: @surface0;\n --gm3-sys-color-tertiary-container-rgb: #rgbify(@surface0);\n --gm3-sys-color-tertiary-fixed: @accent-color;\n --gm3-sys-color-tertiary-fixed-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-tertiary-fixed-dim: @accent-color;\n --gm3-sys-color-tertiary-fixed-dim-rgb: #rgbify(@accent-color) [];\n\n & when (@lookup = latte) {\n --dt-scrim: fade(@text, 50%);\n --dt-scrim-2x: fade(@text, 50%);\n --gm3-sys-color-scrim: @text;\n --gm3-sys-color-scrim-rgb: #rgbify(@text) [];\n --gm3-sys-color-shadow: @text;\n --gm3-sys-color-shadow-rgb: #rgbify(@text) [];\n }\n\n & when not (@lookup = latte) {\n --dt-scrim: fade(@base, 50%);\n --dt-scrim-2x: fade(@base, 50%);\n --gm3-sys-color-scrim: @base;\n --gm3-sys-color-scrim-rgb: #rgbify(@base) [];\n --gm3-sys-color-shadow: @base;\n --gm3-sys-color-shadow-rgb: #rgbify(@base) [];\n }\n\n /* Settings menu title & back button */\n .gb_Pc svg,\n .gb_Uc.gb_Zc svg,\n .gb_Pc .gb_gd .gb_od,\n .gb_Pc .gb_gd .gb_Oc,\n .gb_Pc .gb_gd .gb_id,\n .gb_Uc.gb_Zc .gb_od {\n color: @text !important;\n }\n\n /* Settings menu Storage total used icon */\n .VBJTHe svg path {\n fill: @text;\n }\n\n /* Drive sync checkbox disabled */\n .MlG5Jc gm-checkbox[disabled] ~ .VfPpkd-ga,\n .MlG5Jc gm-radio[disabled] ~ .VfPpkd-ga,\n .MlG5Jc .VfPpkd-Qa-Qu-db ~ .VfPpkd-ga,\n .MlG5Jc .VfPpkd-Eg-Qu-db ~ .VfPpkd-ga {\n color: @subtext0 !important;\n }\n\n /* Quota hover box-shadow */\n .KnDsIf:hover,\n .KnDsIf:focus,\n .al9hA {\n box-shadow: 0 2px 6px @overlay0;\n }\n\n /* Quota Google Drive */\n .kJzqSb {\n color: @blue;\n }\n\n /* Quota Google Photos */\n .L1pqQb {\n color: @yellow;\n }\n\n /* Quota Gmail */\n .au0LDe {\n color: @red;\n }\n\n /* Google Account outline */\n .gb_Ea.gb_i {\n border-color: @overlay0;\n }\n .gb_Ea.gb_i:focus,\n .gb_Ea.gb_i:hover {\n border-color: @subtext0;\n }\n\n /* File preview (separate tab) background */\n &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb .ndfHFb-c4YZDc-bnBfGc {\n background-color: @base;\n }\n .a-b-uoC0bf.a-b-L .a-b-jl /* File preview (in Drive) background */ {\n background-color: fade(@base, 85%);\n }\n\n /* File preview (separate tab) top bar */\n &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb .ndfHFb-c4YZDc-Wrql6b.ndfHFb-c4YZDc-Wrql6b-Hyc8Sd,\n .a-b-uoC0bf.a-b-L .a-b-K.a-b-K-Hyc8Sd /* File preview (in Drive) top bar */ {\n background-color: fade(@base, 85%);\n }\n\n /* File preview (separate tab) bottom bar */\n .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-DARUcf-NnAfwf-i5oIFb, .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-nJjxad-nK2kYb-i5oIFb,\n .a-b-vo .a-b-La-yc-L, .a-b-vo .a-b-Kb-ac-L /* File preview (in Drive) bottom bar */ {\n background-color: fade(@base, 85%);\n color: @text !important;\n /* File preview (separate tab) page input */\n .ndfHFb-c4YZDc-DARUcf-NGme3c-YPqjbf,\n .a-b-La-su-vb /* File preview (in Drive) page input */ {\n background-color: fade(@base, 50%);\n color: @text;\n }\n }\n\n /* File preview (separate tab) share button */\n &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-uoC0bf .tk3N6e-LgbsSe, &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-mAKE4e-LQLjdd-xl07Ob-LgbsSe.VIpgJd-Kb3HCc-xl07Ob-LgbsSe,\n .a-b-uoC0bf .ae-uoC0bf .g-d, .a-b-uoC0bf .ae-mAKE4e-Hc-w-d.h-R-w-d /* File preview (in Drive) share button */ {\n background-color: @accent-color;\n color: @base;\n /* File preview (separate tab) share icon */\n .IyROMc-euCgFf-LJSvSb,\n .ae-c /* File preview (in Drive) share icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(97%) sepia(4%) saturate(152%)\n hue-rotate(183deg) brightness(94%) contrast(106%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(15%) sepia(8%) saturate(2252%)\n hue-rotate(192deg) brightness(98%) contrast(85%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(13%) sepia(26%) saturate(823%)\n hue-rotate(195deg) brightness(90%) contrast(92%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(10%) sepia(36%) saturate(650%)\n hue-rotate(201deg) brightness(90%) contrast(93%);\n }\n }\n /* File preview (separate tab) share triangle */\n .VIpgJd-Kb3HCc-xl07Ob-LgbsSe-j4gsHd,\n .h-R-w-d-Re /* File preview (in Drive) share triangle */ {\n border-color: @base transparent !important;\n }\n }\n /* File preview (separate tab) share Quick options */\n .zAYgkb-NhlrFc-xl07Ob-BvBYQ,\n .h-w.ae-NhlrFc-w /* File preview (in Drive) share Quick options */ {\n background-color: @base;\n * {\n color: @text !important;\n }\n /* File preview (in Drive) share Quick options current share level container */\n .h-v-x {\n opacity: 100%;\n }\n /* File preview (separate tab) share Quick options divider */\n .zAYgkb-NhlrFc-gqMrKb,\n .ae-NhlrFc-Yo /* File preview (in Drive) share Quick options divider */ {\n border-color: @overlay0;\n }\n /* File preview (separate tab) share Quick options row hover */\n .VIpgJd-j7LFlb-sn54Q,\n .h-v-pc /* File preview (in Drive) share Quick options row hover */ {\n background-color: @surface0;\n }\n /* File preview (separate tab) share Quick options row icon */\n .IyROMc-euCgFf-LJSvSb,\n .ba-ea-i /* File preview (in Drive) share Quick options row icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n }\n /* File preview (separate tab) Print, Download, 3 dots */\n .ndfHFb-c4YZDc-Bz112c:not([style]),\n .ndfHFb-c4YZDc-Bz112c[style*=\"googlematerialicons\"],\n .ndfHFb-c4YZDc-Bz112c[style=\"user-select: none;\"],\n .ndfHFb-c4YZDc-Wrql6b-htvI8d-wcotoc-wHEfpf-ndfHFb-Bz112c /* File preview (separate tab) Save to drive */,\n .ndfHFb-c4YZDc-Wrql6b-w37qKe-Bz112c /* File preview (separate tab) Save to drive (clicked) */,\n /* File preview (in Drive) Print, Download, 3 dots */\n .a-b-c:not([style]),\n .a-b-c[style*=\"googlematerialicons\"],\n .a-b-c[style=\"user-select: none;\"],\n .a-b-K-zc-Eb-bg-a-c /* File preview (in Drive) Save to drive */,\n .a-b-K-X-c /* File preview (in Drive) Save to drive (clicked) */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n /* File preview (separate tab) File title */\n .ndfHFb-c4YZDc-Wrql6b-V1ur5d,\n .a-b-cg-Zf /* File preview (in Drive) File title */ {\n color: @text;\n }\n /* File preview (separate tab) 3 dots menu item hover */\n .ndfHFb-c4YZDc-j7LFlb:hover,\n .a-b-v:hover /* File preview (in Drive) 3 dots menu item hover */ {\n background-color: @surface0;\n }\n /* File preview (separate tab) No preview available */\n .ndfHFb-c4YZDc-EglORb-haAclf,\n .a-b-Tb-j /* File preview (in Drive) No preview available */ {\n background-color: @surface0;\n color: @text;\n /* File preview (separate tab) No preview available Download */\n .ndfHFb-c4YZDc-bN97Pc-nupQLb-LgbsSe,\n .a-b-x-rb-d /* File preview (in Drive) No preview available Download */ {\n background-color: @surface1;\n color: @text;\n text-shadow: none;\n border-color: transparent;\n &:hover {\n background-color: @surface2;\n background-image: none;\n }\n }\n /* File preview (separate tab) No preview available Download icon */\n .ndfHFb-c4YZDc-bN97Pc-nupQLb-LgbsSe-Bz112c,\n .a-b-x-rb-d-c /* File preview (in Drive) No preview available Download icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n }\n\n /* Drive sharing window material icon */\n .SbpzSe .VfPpkd-StrnGf-rymPhb-f7MjDc {\n color: @accent-color;\n }\n\n /* Drive sharing window access hover */\n .lfDNBb:hover, .lfDNBb:focus-within,\n .ZelW3e:hover .FYhd9e, .ZelW3e:focus-within .FYhd9e /* Drive sharing window person row hover */ {\n background-color: @surface0;\n }\n\n /* Drive sharing iframe */\n .lb-k-x {\n color-scheme: unset;\n }\n [role=\"tooltip\"],\n .Kk7lMc-Ca /* Drive applications sidebar tooltip */ {\n background-color: @surface2;\n *,\n & {\n color: @text !important;\n }\n border-color: transparent;\n /* File preview (separate tab) tooltip arrow */\n .tk3N6e-suEOdc-jQ8oHc,\n .tk3N6e-suEOdc-ez0xG {\n border-color: @surface2 transparent !important;\n }\n }\n\n /* Drive applications sidebar close button */\n .Kk7lMc-QWPxkf-d-j .Yb-Il-d .Yb-Il-d-c-j {\n background-color: @surface0;\n path:nth-child(1) {\n stroke: @text;\n }\n }\n /* Drive applications sidebar get addons */\n .Yb-Il-d#qJTzr .Yb-Il-d-c-j {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n /* Drive applications sidebar close button white background */\n .Yb-Il-d-c-Nd {\n background-color: transparent;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name Google Drive Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/google-drive\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google-drive\n@version 0.0.2\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-drive\n@description Soothing pastel theme for Google Drive\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain('drive.google.com') {\n :root:has(.KkxPLb) {\n .vhoiae.vhoiae.vhoiae,\n & {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n :root:has(.LgGVmb) {\n .vhoiae.vhoiae.vhoiae,\n & {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --dt-on-background: @text;\n --dt-on-background-secondary: @subtext0;\n --dt-background: @base;\n --dt-on-surface: @text;\n --dt-inverse-surface: @text;\n --dt-on-surface-secondary: @subtext0;\n --dt-on-surface-variant: @text;\n --dt-surface-variant: @surface0;\n --dt-inverse-on-surface: @surface0;\n --dt-surface: @base;\n --dt-surface-tint: @accent-color;\n --dt-shadow-elevation-1: 0px 3px 1px -2px fade(@base, 20%),\n 0px 2px 2px 0px fade(@base, 14%), 0px 1px 5px 0px fade(@base, 12%);\n --dt-shadow-elevation-2: 0px 2px 4px -1px fade(@base, 20%),\n 0px 4px 5px 0px fade(@base, 14%), 0px 1px 10px 0px fade(@base, 12%);\n --dt-shadow-elevation-3: 0px 5px 5px -3px fade(@base, 20%),\n 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%);\n --dt-shadow-elevation-4: 0px 5px 5px -3px fade(@base, 20%),\n 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%);\n --dt-shadow-elevation-5: 0px 8px 10px -6px fade(@base, 20%),\n 0px 16px 24px 2px fade(@base, 14%), 0px 6px 30px 5px fade(@base, 12%);\n --dt-surface-container-lowest: @crust;\n --dt-surface-container-low: @mantle;\n --dt-surface-container: @surface0;\n --dt-surface-container-high: @surface1;\n --dt-surface-container-highest: @surface2;\n --dt-surface-dim: @crust;\n --dt-surface-bright: @base;\n --dt-on-primary-container: @text;\n --dt-primary-container-icon: @text;\n --dt-primary-container-link: @text;\n --dt-primary: @accent-color;\n --dt-primary-action: @accent-color;\n --dt-primary-action-stateful: @accent-color;\n --dt-primary-outline: @accent-color;\n --dt-primary-action-state-layer: @accent-color;\n --dt-primary-container: @surface0;\n --dt-on-primary: @base;\n --dt-primary-icon: @base;\n --dt-primary-link: @base;\n --dt-on-secondary-container: @text;\n --dt-secondary-container-icon: @text;\n --dt-secondary-container-link: @text;\n --dt-secondary: @accent-color;\n --dt-secondary-action: @accent-color;\n --dt-secondary-action-stateful: @accent-color;\n --dt-secondary-outline: @accent-color;\n --dt-secondary-action-state-layer: @accent-color;\n --dt-secondary-container: @surface0;\n --dt-on-secondary: @base;\n --dt-secondary-icon: @base;\n --dt-secondary-link: @base;\n --dt-on-tertiary-container: @text;\n --dt-tertiary-container-icon: @text;\n --dt-tertiary-container-link: @text;\n --dt-tertiary: @accent-color;\n --dt-tertiary-action: @accent-color;\n --dt-tertiary-action-stateful: @accent-color;\n --dt-tertiary-outline: @accent-color;\n --dt-tertiary-action-state-layer: @accent-color;\n --dt-tertiary-container: @surface0;\n --dt-on-tertiary: @base;\n --dt-tertiary-icon: @base;\n --dt-tertiary-link: @base;\n --dt-on-neutral-container: @text;\n --dt-neutral-container-icon: @text;\n --dt-neutral-container-link: @text;\n --dt-neutral: @surface0;\n --dt-neutral-action: @text;\n --dt-neutral-action-stateful: @text;\n --dt-neutral-outline: @surface0;\n --dt-neutral-action-state-layer: @surface0;\n --dt-neutral-container: @surface0;\n --dt-on-neutral: @text;\n --dt-neutral-icon: @surface0;\n --dt-neutral-link: @surface0;\n --dt-on-warning-container: @yellow;\n --dt-warning-container-icon: @yellow;\n --dt-warning-container-link: @yellow;\n --dt-warning: @yellow;\n --dt-warning-action: @yellow;\n --dt-warning-action-stateful: @yellow;\n --dt-warning-outline: @yellow;\n --dt-warning-action-state-layer: @yellow;\n --dt-warning-container: @surface0;\n --dt-on-warning: @base;\n --dt-warning-icon: @yellow;\n --dt-warning-link: @yellow;\n --dt-on-error-container: @red;\n --dt-error-container-icon: @red;\n --dt-error-container-link: @red;\n --dt-error: @red;\n --dt-error-action: @red;\n --dt-error-action-stateful: @red;\n --dt-error-outline: @red;\n --dt-error-action-state-layer: @surface1;\n --dt-error-container: @surface1;\n --dt-on-error: @base;\n --dt-error-icon: @base;\n --dt-error-link: @base;\n --dt-mime-type-blue: @blue;\n --dt-mime-type-dark-blue: @blue;\n --dt-mime-type-green: @green;\n --dt-mime-type-grey: @overlay0;\n --dt-mime-type-purple: @mauve;\n --dt-mime-type-deep-purple: @mauve;\n --dt-mime-type-red: @red;\n --dt-mime-type-yellow: @yellow;\n --dt-disabled: @overlay0;\n --dt-on-disabled: @text;\n --dt-outline: @overlay0;\n --dt-outline-variant: @surface2;\n --dt-light-info-banner-button: @text;\n --dt-light-neutral-banner-button: @text;\n --dt-light-success-banner-button: @green;\n --dt-light-warning-banner-button: @yellow;\n --dt-light-error-banner-button: @red;\n\n --gm3-sys-color-background: @base;\n --gm3-sys-color-background-rgb: #rgbify(@base) [];\n --gm3-sys-color-error: @red;\n --gm3-sys-color-error-rgb: #rgbify(@red) [];\n --gm3-sys-color-error-container: @surface2;\n --gm3-sys-color-error-container-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-inverse-on-surface: @surface0;\n --gm3-sys-color-inverse-on-surface-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-inverse-primary: red;\n --gm3-sys-color-inverse-primary-rgb: 255, 0, 0;\n --gm3-sys-color-inverse-surface: @text;\n --gm3-sys-color-inverse-surface-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-background: @text;\n --gm3-sys-color-on-background-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-error: @base;\n --gm3-sys-color-on-error-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-error-container: @red;\n --gm3-sys-color-on-error-container-rgb: #rgbify(@red) [];\n --gm3-sys-color-on-primary: @base;\n --gm3-sys-color-on-primary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-primary-container: @text;\n --gm3-sys-color-on-primary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-primary-fixed: @base;\n --gm3-sys-color-on-primary-fixed-rgb: #rgbify(@base);\n --gm3-sys-color-on-primary-fixed-variant: @base;\n --gm3-sys-color-on-primary-fixed-variant-rgb: #rgbify(@base);\n --gm3-sys-color-on-secondary: @base;\n --gm3-sys-color-on-secondary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-secondary-container: @text;\n --gm3-sys-color-on-secondary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-secondary-fixed: @base;\n --gm3-sys-color-on-secondary-fixed-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-secondary-fixed-variant: @base;\n --gm3-sys-color-on-secondary-fixed-variant-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-surface: @text;\n --gm3-sys-color-on-surface-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-surface-variant: @text;\n --gm3-sys-color-on-surface-variant-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-tertiary: @base;\n --gm3-sys-color-on-tertiary-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-tertiary-container: @text;\n --gm3-sys-color-on-tertiary-container-rgb: #rgbify(@text) [];\n --gm3-sys-color-on-tertiary-fixed: @base;\n --gm3-sys-color-on-tertiary-fixed-rgb: #rgbify(@base) [];\n --gm3-sys-color-on-tertiary-fixed-variant: @base;\n --gm3-sys-color-on-tertiary-fixed-variant-rgb: #rgbify(@base) [];\n --gm3-sys-color-outline: @overlay0;\n --gm3-sys-color-outline-rgb: #rgbify(@overlay0) [];\n --gm3-sys-color-outline-variant: @surface2;\n --gm3-sys-color-outline-variant-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-primary: @accent-color;\n --gm3-sys-color-primary-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-primary-container: @surface0;\n --gm3-sys-color-primary-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-primary-fixed: @accent-color;\n --gm3-sys-color-primary-fixed-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-primary-fixed-dim: @accent-color;\n --gm3-sys-color-primary-fixed-dim-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-secondary: @accent-color;\n --gm3-sys-color-secondary-rgb: #rgbify(@accent-color);\n --gm3-sys-color-secondary-container: @surface0;\n --gm3-sys-color-secondary-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-secondary-fixed: #c2e7ff;\n --gm3-sys-color-secondary-fixed-rgb: 194, 231, 255;\n --gm3-sys-color-secondary-fixed-dim: #7fcfff;\n --gm3-sys-color-secondary-fixed-dim-rgb: 127, 207, 255;\n --gm3-sys-color-surface: @base;\n --gm3-sys-color-surface-rgb: #rgbify(@base) [];\n --gm3-sys-color-surface-bright: @base;\n --gm3-sys-color-surface-bright-rgb: #rgbify(@base) [];\n --gm3-sys-color-surface-container: @surface0;\n --gm3-sys-color-surface-container-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-surface-container-high: @surface1;\n --gm3-sys-color-surface-container-high-rgb: #rgbify(@surface1) [];\n --gm3-sys-color-surface-container-highest: @surface2;\n --gm3-sys-color-surface-container-highest-rgb: #rgbify(@surface2) [];\n --gm3-sys-color-surface-container-low: @mantle;\n --gm3-sys-color-surface-container-low-rgb: #rgbify(@mantle) [];\n --gm3-sys-color-surface-container-lowest: @crust;\n --gm3-sys-color-surface-container-lowest-rgb: #rgbify(@crust) [];\n --gm3-sys-color-surface-dim: @crust;\n --gm3-sys-color-surface-dim-rgb: #rgbify(@crust) [];\n --gm3-sys-color-surface-tint: @accent-color;\n --gm3-sys-color-surface-tint-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-surface-variant: @surface0;\n --gm3-sys-color-surface-variant-rgb: #rgbify(@surface0) [];\n --gm3-sys-color-tertiary: @accent-color;\n --gm3-sys-color-tertiary-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-tertiary-container: @surface0;\n --gm3-sys-color-tertiary-container-rgb: #rgbify(@surface0);\n --gm3-sys-color-tertiary-fixed: @accent-color;\n --gm3-sys-color-tertiary-fixed-rgb: #rgbify(@accent-color) [];\n --gm3-sys-color-tertiary-fixed-dim: @accent-color;\n --gm3-sys-color-tertiary-fixed-dim-rgb: #rgbify(@accent-color) [];\n\n & when (@lookup = latte) {\n --dt-scrim: fade(@text, 50%);\n --dt-scrim-2x: fade(@text, 50%);\n --gm3-sys-color-scrim: @text;\n --gm3-sys-color-scrim-rgb: #rgbify(@text) [];\n --gm3-sys-color-shadow: @text;\n --gm3-sys-color-shadow-rgb: #rgbify(@text) [];\n }\n\n & when not (@lookup = latte) {\n --dt-scrim: fade(@base, 50%);\n --dt-scrim-2x: fade(@base, 50%);\n --gm3-sys-color-scrim: @base;\n --gm3-sys-color-scrim-rgb: #rgbify(@base) [];\n --gm3-sys-color-shadow: @base;\n --gm3-sys-color-shadow-rgb: #rgbify(@base) [];\n }\n\n /* Settings menu title & back button */\n .gb_Pc svg,\n .gb_Uc.gb_Zc svg,\n .gb_Pc .gb_gd .gb_od,\n .gb_Pc .gb_gd .gb_Oc,\n .gb_Pc .gb_gd .gb_id,\n .gb_Uc.gb_Zc .gb_od {\n color: @text !important;\n }\n\n /* Settings menu Storage total used icon */\n .VBJTHe svg path {\n fill: @text;\n }\n\n /* Drive sync checkbox disabled */\n .MlG5Jc gm-checkbox[disabled] ~ .VfPpkd-ga,\n .MlG5Jc gm-radio[disabled] ~ .VfPpkd-ga,\n .MlG5Jc .VfPpkd-Qa-Qu-db ~ .VfPpkd-ga,\n .MlG5Jc .VfPpkd-Eg-Qu-db ~ .VfPpkd-ga {\n color: @subtext0 !important;\n }\n\n /* Quota hover box-shadow */\n .KnDsIf:hover,\n .KnDsIf:focus,\n .al9hA {\n box-shadow: 0 2px 6px @overlay0;\n }\n\n /* Quota Google Drive */\n .kJzqSb {\n color: @blue;\n }\n\n /* Quota Google Photos */\n .L1pqQb {\n color: @yellow;\n }\n\n /* Quota Gmail */\n .au0LDe {\n color: @red;\n }\n\n /* Google Account outline */\n .gb_Ea.gb_i {\n border-color: @overlay0;\n background-color: @surface0;\n }\n .gb_Ea.gb_i:focus,\n .gb_Ea.gb_i:hover {\n border-color: @subtext0;\n }\n\n /* File preview (separate tab) background */\n &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb .ndfHFb-c4YZDc-bnBfGc {\n background-color: @base;\n }\n .a-b-uoC0bf.a-b-L .a-b-jl /* File preview (in Drive) background */ {\n background-color: fade(@base, 85%);\n }\n\n /* File preview (separate tab) top bar */\n &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb .ndfHFb-c4YZDc-Wrql6b.ndfHFb-c4YZDc-Wrql6b-Hyc8Sd,\n .a-b-uoC0bf.a-b-L .a-b-K.a-b-K-Hyc8Sd /* File preview (in Drive) top bar */ {\n background-color: fade(@base, 85%);\n }\n\n /* File preview (separate tab) bottom bar */\n .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-DARUcf-NnAfwf-i5oIFb, .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-nJjxad-nK2kYb-i5oIFb,\n .a-b-vo .a-b-La-yc-L, .a-b-vo .a-b-Kb-ac-L /* File preview (in Drive) bottom bar */ {\n background-color: fade(@base, 85%);\n color: @text !important;\n /* File preview (separate tab) page input */\n .ndfHFb-c4YZDc-DARUcf-NGme3c-YPqjbf,\n .a-b-La-su-vb /* File preview (in Drive) page input */ {\n background-color: fade(@base, 50%);\n color: @text;\n }\n }\n\n /* File preview (separate tab) share button */\n &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-uoC0bf .tk3N6e-LgbsSe, &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-mAKE4e-LQLjdd-xl07Ob-LgbsSe.VIpgJd-Kb3HCc-xl07Ob-LgbsSe,\n .a-b-uoC0bf .ae-uoC0bf .g-d, .a-b-uoC0bf .ae-mAKE4e-Hc-w-d.h-R-w-d /* File preview (in Drive) share button */ {\n background-color: @accent-color;\n color: @base;\n /* File preview (separate tab) share icon */\n .IyROMc-euCgFf-LJSvSb,\n .ae-c /* File preview (in Drive) share icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(97%) sepia(4%) saturate(152%)\n hue-rotate(183deg) brightness(94%) contrast(106%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(15%) sepia(8%) saturate(2252%)\n hue-rotate(192deg) brightness(98%) contrast(85%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(13%) sepia(26%) saturate(823%)\n hue-rotate(195deg) brightness(90%) contrast(92%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(10%) sepia(36%) saturate(650%)\n hue-rotate(201deg) brightness(90%) contrast(93%);\n }\n }\n /* File preview (separate tab) share triangle */\n .VIpgJd-Kb3HCc-xl07Ob-LgbsSe-j4gsHd,\n .h-R-w-d-Re /* File preview (in Drive) share triangle */ {\n border-color: @base transparent !important;\n }\n }\n /* File preview (separate tab) share Quick options */\n .zAYgkb-NhlrFc-xl07Ob-BvBYQ,\n .h-w.ae-NhlrFc-w /* File preview (in Drive) share Quick options */ {\n background-color: @base;\n * {\n color: @text !important;\n }\n /* File preview (in Drive) share Quick options current share level container */\n .h-v-x {\n opacity: 100%;\n }\n /* File preview (separate tab) share Quick options divider */\n .zAYgkb-NhlrFc-gqMrKb,\n .ae-NhlrFc-Yo /* File preview (in Drive) share Quick options divider */ {\n border-color: @overlay0;\n }\n /* File preview (separate tab) share Quick options row hover */\n .VIpgJd-j7LFlb-sn54Q,\n .h-v-pc /* File preview (in Drive) share Quick options row hover */ {\n background-color: @surface0;\n }\n /* File preview (separate tab) share Quick options row icon */\n .IyROMc-euCgFf-LJSvSb,\n .ba-ea-i /* File preview (in Drive) share Quick options row icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n }\n /* File preview (separate tab) Print, Download, 3 dots */\n .ndfHFb-c4YZDc-Bz112c:not([style]),\n .ndfHFb-c4YZDc-Bz112c[style*=\"googlematerialicons\"],\n .ndfHFb-c4YZDc-Bz112c[style=\"user-select: none;\"],\n .ndfHFb-c4YZDc-Wrql6b-htvI8d-wcotoc-wHEfpf-ndfHFb-Bz112c /* File preview (separate tab) Save to drive */,\n .ndfHFb-c4YZDc-Wrql6b-w37qKe-Bz112c /* File preview (separate tab) Save to drive (clicked) */,\n /* File preview (in Drive) Print, Download, 3 dots */\n .a-b-c:not([style]),\n .a-b-c[style*=\"googlematerialicons\"],\n .a-b-c[style=\"user-select: none;\"],\n .a-b-K-zc-Eb-bg-a-c /* File preview (in Drive) Save to drive */,\n .a-b-K-X-c /* File preview (in Drive) Save to drive (clicked) */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n /* File preview (separate tab) File title */\n .ndfHFb-c4YZDc-Wrql6b-V1ur5d,\n .a-b-cg-Zf /* File preview (in Drive) File title */ {\n color: @text;\n }\n /* File preview (separate tab) 3 dots menu item hover */\n .ndfHFb-c4YZDc-j7LFlb:hover,\n .a-b-v:hover /* File preview (in Drive) 3 dots menu item hover */ {\n background-color: @surface0;\n }\n /* File preview (separate tab) No preview available */\n .ndfHFb-c4YZDc-EglORb-haAclf,\n .a-b-Tb-j /* File preview (in Drive) No preview available */ {\n background-color: @surface0;\n color: @text;\n /* File preview (separate tab) No preview available Download */\n .ndfHFb-c4YZDc-bN97Pc-nupQLb-LgbsSe,\n .a-b-x-rb-d /* File preview (in Drive) No preview available Download */ {\n background-color: @surface1;\n color: @text;\n text-shadow: none;\n border-color: transparent;\n &:hover {\n background-color: @surface2;\n background-image: none;\n }\n }\n /* File preview (separate tab) No preview available Download icon */\n .ndfHFb-c4YZDc-bN97Pc-nupQLb-LgbsSe-Bz112c,\n .a-b-x-rb-d-c /* File preview (in Drive) No preview available Download icon */ {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n }\n /* File preview (in Drive) text document */\n .a-b-r-x,\n .ndfHFb-c4YZDc-fmcmS-bN97Pc /* File preview (separate tab) text document */ {\n &,\n pre {\n background-color: @surface0 !important;\n color: @text !important;\n }\n }\n /* File preview (in Drive) comment on image */\n .Yk-efwuC {\n background-color: @surface0 !important;\n /* File preview (in Drive) comment on image person */\n .Yk-Vq7Udc {\n background-color: @surface0 !important;\n [data-name] {\n color: @text !important;\n }\n /* Comment text */\n .Yk-eKrold-Sg.Yk-eKrold-Sg {\n color: @text !important;\n }\n /* Comment date */\n .Yk-eKrold-bi {\n color: @subtext0 !important;\n }\n }\n /* File preview (in Drive) comments */\n .Yk-efwuC-vb-Gd {\n background-color: @surface0;\n &,\n * {\n color: @text !important;\n }\n [role=\"textbox\"] {\n background-color: @surface1;\n border-color: @overlay0;\n &::before {\n color: @subtext0 !important;\n }\n }\n [role=\"button\"] {\n background-color: @surface1 !important;\n /* needed to override border-color */\n &[role=\"button\"] {\n border-color: @overlay0 !important;\n }\n &[aria-disabled=\"true\"] {\n background-color: @surface1 !important;\n color: @subtext0 !important;\n }\n }\n }\n }\n\n /* Drive sharing window material icon */\n .SbpzSe .VfPpkd-StrnGf-rymPhb-f7MjDc {\n color: @accent-color;\n }\n\n /* Drive sharing window access hover */\n .lfDNBb:hover, .lfDNBb:focus-within,\n .ZelW3e:hover .FYhd9e, .ZelW3e:focus-within .FYhd9e /* Drive sharing window person row hover */ {\n background-color: @surface0;\n }\n\n /* Drive sharing iframe (in Drive) */\n .lb-k-x {\n color-scheme: unset;\n }\n /* Drive sharing iframe (file preview separate tab) */\n .XKSfm-Sx9Kwc-bN97Pc {\n color-scheme: auto; /* unset doesn't work? */\n }\n [role=\"tooltip\"],\n .Kk7lMc-Ca /* Drive applications sidebar tooltip */,\n .gb_2e /* Drive google account tooltip */ {\n background-color: @surface2;\n *,\n & {\n color: @text !important;\n }\n border-color: transparent;\n /* File preview (separate tab) tooltip arrow */\n .tk3N6e-suEOdc-jQ8oHc,\n .tk3N6e-suEOdc-ez0xG {\n border-color: @surface2 transparent !important;\n }\n }\n\n /* Drive applications sidebar close button */\n .Kk7lMc-QWPxkf-d-j .Yb-Il-d .Yb-Il-d-c-j {\n background-color: @surface0;\n path:nth-child(1) {\n stroke: @text;\n }\n }\n /* Drive applications sidebar get addons */\n .Yb-Il-d#qJTzr .Yb-Il-d-c-j {\n & when (@lookup = latte) {\n filter: brightness(0) invert(31%) sepia(10%) saturate(1268%)\n hue-rotate(196deg) brightness(90%) contrast(86%);\n }\n & when (@lookup = frappe) {\n filter: brightness(0) invert(80%) sepia(7%) saturate(1070%)\n hue-rotate(192deg) brightness(104%) contrast(92%);\n }\n & when (@lookup = macchiato) {\n filter: brightness(0) invert(84%) sepia(13%) saturate(579%)\n hue-rotate(193deg) brightness(99%) contrast(94%);\n }\n & when (@lookup = mocha) {\n filter: brightness(0) invert(84%) sepia(19%) saturate(370%)\n hue-rotate(192deg) brightness(98%) contrast(95%);\n }\n }\n /* Drive applications sidebar close button white background */\n .Yb-Il-d-c-Nd {\n background-color: transparent;\n }\n\n /* Drive icon */\n .gb_Nc.gb_Nd {\n @darkBlue: mix(@blue, @base, 80%);\n @darkGreen: mix(@green, @base, 80%);\n\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n /* Drive upload checkmark */\n .z-Ea-Fj-c svg path {\n fill: @green;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Google Drive Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/google-drive",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/google-drive",
- "version": "0.0.1",
+ "version": "0.0.2",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-drive",
"description": "Soothing pastel theme for Google Drive",
@@ -2808,11 +2810,12 @@
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/google-drive",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.css",
"name": "Google Drive Catppuccin",
- "originalDigest": "f670d7a840dd72938efd1dff0e3121c190cc13f8",
+ "originalDigest": "583c9358b3daef81857016d6753c0a6feb40168c",
"_id": "8cd5d5b6-853b-45bd-8fd9-052f0eb9851e",
- "_rev": 1715536465127,
+ "_rev": 1717935617324,
"id": 16,
- "etag": "W/\"5620522719e4d63ecac31242c78520769cb3402d10444d41bdef127d875923fa\""
+ "etag": "W/\"007bfd130514b7453a00f52b4ac9851825b0bb2d14d6abff797b22b7439d923a\"",
+ "updateDate": 1717935617160
},
{
"enabled": false,
@@ -2998,12 +3001,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name Instagram Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/instagram\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/instagram\n@version 0.2.4\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainstagram\n@description Soothing pastel theme for Instagram\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain('instagram.com') {\n ._aa4d {\n #catppuccin(@darkFlavor, @accentColor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n @text-filter: @catppuccin[@@lookup][@text-filter];\n @dark-color: if(@lookup = latte, @text, @crust);\n @light-color: if(@lookup = latte, @crust, @text);\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &,\n .x1qjc9v5,\n .x9f619,\n .x78zum5,\n .xdt5ytf,\n .x1iyjqo2,\n .xl56j7k {\n --web-always-black: #rgbify(@dark-color) [];\n --ig-primary-icon: #rgbify(@text) [];\n --web-always-white: #rgbify(@light-color) [];\n --always-white: #rgbify(@light-color) [];\n --overlay-alpha-80: fadeout(@dark-color, 50);\n --always-dark-overlay: fadeout(@surface0, 50);\n --grey-9: #rgbify(@crust) [];\n --ig-primary-background: #rgbify(@base) [];\n --ig-secondary-background: #rgbify(@surface0) [];\n --ig-banner-background: #rgbify(@crust) [];\n --ig-highlight-background: #rgbify(@surface0) [];\n --ig-elevated-background: #rgbify(@crust) [];\n --ig-elevated-highlight-background: #rgbify(@surface0) [];\n --ig-hover-overlay: #rgbify(@text) [], 0.1;\n --hover-overlay: fadeout(@surface0, 80);\n --ig-text-on-color: #rgbify(@crust) [];\n --ig-badge: #rgbify(@accent-color) [];\n --ig-primary-button: #rgbify(@accent-color) [];\n --ig-primary-button-hover: fadeout(@accent-color, 20);\n --ig-secondary-button-background: #rgbify(@surface0) [];\n --ig-secondary-button-hover: #rgbify(@surface1) [];\n --ig-secondary-button: #rgbify(@text) [];\n --ig-primary-text: #rgbify(@text) [];\n --ig-secondary-text: #rgbify(@subtext0) [];\n --ig-tertiary-text: #rgbify(@subtext0) [];\n --wbloks-primary-text: @text;\n --ig-text-on-media: #rgbify(@text) [];\n --ig-separator: #rgbify(@surface0) [];\n --chat-admin-text-color: #rgbify (@subtext0) [];\n --ig-elevated-separator: #rgbify(@surface0) [];\n --post-separator: #rgbify(@overlay0) [];\n --ig-stroke: #rgbify(@overlay0) [];\n --grey-2: #rgbify(@overlay0) [];\n --ig-link: #rgbify(@accent-color) [];\n --ig-error-or-destructive: #rgbify(@maroon) [];\n --ig-success: #rgbify(@green) [];\n --blue-2: #rgbify(@blue) [];\n --ig-close-friends-refreshed: #rgbify(@green) [];\n --ig-text-input-border-hover-prism: #rgbify(@surface1) [];\n --ig-toggle-outline-prism: #rgbify(@text) [];\n --ig-toggle-background-on-prism: #rgbify(@text) [];\n --ig-stroke-prism: #rgbify(@crust) [];\n --barcelona-logo: #rgbify (@text) [];\n scrollbar-color: @accent-color @crust;\n }\n #splash-screen {\n background-color: @base !important;\n }\n\n /* Sidebar */\n .x1xgvd2v {\n background-color: @crust !important;\n &[style=\"transform: translateX(0px);\"] {\n background-color: @mantle !important;\n }\n }\n .x1zvrr1 {\n background-color: @mantle;\n }\n svg[aria-label=\"Loading...\"] {\n stroke: @text;\n }\n\n /* Story background */\n .x5qyhuo {\n background-color: @base;\n }\n\n /* Story progress bar */\n ._ac3p {\n background-color: @accent-color !important;\n }\n\n /* Story seen / not seen ring */\n button:has(canvas + span > img[alt$=\"'s profile picture\"]) {\n canvas {\n display: none;\n }\n\n span {\n outline-style: solid;\n outline-offset: 0.15rem;\n }\n\n &[aria-label^=\"Story by\"][aria-label$=\"not seen\"] span {\n outline-color: @accent-color;\n outline-width: 0.2rem;\n }\n &[aria-label^=\"Story by\"]:not([aria-label$=\"not seen\"]) span {\n outline-color: @surface2;\n outline-width: 0.075rem;\n }\n }\n\n /* Posts */\n ._aggc {\n background-color: @mantle;\n border-color: @overlay0 !important;\n border-radius: var(--modal-border-radius);\n box-shadow: 0 3px 5px -1px fadeout(@dark-color, 20);\n box-sizing: border-box;\n }\n ._aatc ._aasi,\n ._ae1i,\n ._aggc textarea.xvbhtw8 {\n background-color: @mantle;\n }\n\n /* Icons */\n svg[aria-label=\"Unlike\"] {\n fill: @accent-color;\n }\n svg[aria-label=\"Close\"] {\n color: @text;\n }\n svg[aria-label=\"Verified\"] {\n fill: @accent-color;\n }\n\n /* Share box */\n .xzloghq {\n background-color: @surface0;\n color: @text !important;\n &:hover {\n color: @mantle !important;\n background-color: @accent-color !important;\n }\n }\n .xk5f4mz {\n background-color: @mantle;\n &:hover {\n background-color: @accent-color;\n }\n }\n .x3nfvp2 {\n color: @text !important;\n &:hover {\n color: @crust;\n }\n }\n\n /* Toggle sliders */\n .x1r7x56h {\n background-color: @accent-color;\n }\n .x100vrsf {\n background-color: @surface0;\n }\n .xw4jnvo {\n background-color: @overlay1;\n }\n .x1psfjxj {\n background-color: @mantle;\n }\n span[data-bloks-name=\"bk.components.TextSpan\"] {\n color: @accent-color !important;\n }\n .xs7f9wi {\n background-color: @mantle !important;\n }\n .x1d72o {\n background-color: @surface0;\n }\n /* Log In With Facebook text */\n ._ab37 {\n color: @blue;\n }\n /* Excluded: - _9ys7, _9_1f, _9ys8 (verified icon) */\n [style*='background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\")'],\n ._9zkj,\n ._a3ds,\n ._a3dt,\n ._a3du,\n ._a3dv,\n ._a3dw,\n ._9-b3,\n ._9znl,\n ._9z-6,\n ._a3dx,\n ._a3dy,\n ._a3dz,\n ._a3d-,\n ._a3d_,\n ._a3e0,\n ._9zm4,\n ._a3e1,\n ._a3e2,\n ._a3e3,\n ._a3e4,\n ._a3e5,\n ._a3e6,\n ._a3e7,\n ._a3e8,\n ._a3e9,\n ._a3ea,\n ._9_57,\n ._9_n5,\n ._9-y3,\n ._a3eb,\n ._a3ec,\n ._a3ed,\n ._a3ee,\n ._9zlu,\n ._9-yp,\n ._a3ef,\n ._a3eg,\n ._9_wm,\n ._a3eh,\n ._a3ei,\n ._9-j_,\n ._a3ej,\n ._a3ek,\n ._9_ij,\n ._9_d_,\n ._9_e1,\n ._9-mm,\n ._9_cx,\n ._9zm0,\n ._9zfi,\n ._9-ub,\n ._a3el,\n ._9-7-,\n ._9-1a,\n ._a3em,\n ._9zrp,\n ._a3en,\n ._9zz9,\n ._a3eo,\n ._9zmr,\n ._9-8d,\n ._9zhi,\n ._a3ep,\n ._9zs0,\n ._9-j-,\n ._a3eq,\n ._9zli,\n ._9_4y,\n ._9zm2,\n ._9zfj,\n ._9zlg,\n ._a3er,\n ._9-lv,\n ._9_ug,\n ._9_sh,\n ._9_sj,\n ._9-k0,\n ._9z-c,\n ._9_35,\n ._9_hh,\n ._a3es,\n ._a3et,\n ._a3eu,\n ._9-v-,\n ._9_4d,\n ._9zlh,\n ._a3ev,\n ._a3ew,\n ._a3ex,\n ._a3ey,\n ._9_7m,\n ._9_fv,\n ._a3ez,\n ._9-zf,\n ._9-zg,\n ._9-ze,\n ._a9fa,\n ._9-zh,\n ._9-zi,\n ._9-zj,\n ._9-zk,\n ._9-zl,\n ._9-zm,\n ._9-zn,\n ._9-zo,\n ._9-zp,\n ._9-zq,\n ._9-zr,\n ._9-zs,\n ._9-zt,\n ._a3op,\n ._a3oq,\n ._9-zu,\n ._9-zv,\n ._9-zw,\n ._9-zx,\n ._9-zy,\n ._9-zz,\n ._9-z-,\n ._a3or,\n ._a3ot,\n ._a3os,\n ._9zs1,\n ._9zs2,\n ._9-z_,\n ._9--0,\n ._9--1,\n ._9--2,\n ._9--3,\n ._9--4,\n ._9--5,\n ._9--6,\n ._9--7,\n ._9--f,\n ._9--8,\n ._9--9,\n ._9--a,\n ._9--b,\n ._9--c,\n ._9--d,\n ._9--e,\n ._a3ou,\n ._9--g,\n ._9--h,\n ._9--i,\n ._9--j,\n ._9--l,\n ._9--k,\n ._9--m,\n ._9--n,\n ._9--o,\n ._9--p,\n ._9--q,\n ._a3ov,\n ._9--s,\n ._9--r,\n ._9--t,\n ._9--u,\n ._9--v,\n ._9--x,\n ._9--y,\n ._9--w,\n ._9--z,\n ._9--_,\n ._9-_0,\n ._9-_1,\n ._9-_2,\n ._9-_3,\n ._9---,\n ._9-_4,\n ._9-_5,\n ._9-_6,\n ._9-_7,\n ._a3wy,\n ._9-_8,\n ._9-_9,\n ._a3ow,\n ._9-_a,\n ._9-_b,\n ._9-_c,\n ._9-_d,\n ._9-_e,\n ._9-_f,\n ._9-_g,\n ._9-_h,\n ._9-_i,\n ._9-_j,\n ._9-_k,\n ._9-_l,\n ._9-_m,\n ._9-_n,\n ._9-_o,\n ._a3ox,\n ._9-_p,\n ._9-_q,\n ._a9fb,\n ._9-_t,\n ._9-_r,\n ._9-_s,\n ._a93g,\n ._9-_u,\n ._9-_v,\n ._a9fc,\n ._9-_w,\n ._9-_x,\n ._9-_y,\n ._9-_z,\n ._9-_-,\n ._9-__,\n ._9_00,\n ._a3oy,\n ._9_01,\n ._9_02,\n ._9_03,\n ._9_04,\n ._9_05,\n ._9_08,\n ._9_09,\n ._9_07,\n ._9_06,\n ._9_0a,\n ._9_0b,\n ._9_0c,\n ._9_0d,\n ._9_0e,\n ._9_0f,\n ._9_0g,\n ._a93h,\n ._9_0h,\n ._9_0i,\n ._9_0j,\n ._9_0k,\n ._aepo,\n ._9_0l,\n ._9_0m,\n ._9_0n,\n ._9_0o,\n ._9_0p,\n ._a3oz,\n ._a93l,\n ._9_0r,\n ._9_0s,\n ._a7tk,\n ._9_0q,\n ._a3o-,\n ._9_0t,\n ._9_0v,\n ._9_0u,\n ._a9ej,\n ._9_0w,\n ._9_0x,\n ._9_0y,\n ._9_0z,\n ._9_0_,\n ._9_0-,\n ._9_10,\n ._9_11,\n ._9_12,\n ._9_13,\n ._9_14,\n ._9_15,\n ._a3o_,\n ._9_18,\n ._9_19,\n ._9_1a,\n ._9_1e,\n ._9_1b,\n ._9_1c,\n ._9_1d,\n ._9_16,\n ._9_17,\n ._a3p0,\n ._9_1g,\n ._9_1i,\n ._9_1h,\n ._9_1j,\n ._9_1k,\n ._9_1l,\n ._9_1m,\n ._a9pw {\n filter: @text-filter;\n }\n\n /* Custom icons */\n @instagram_gradient: radial-gradient(\n circle at 30% 107%,\n @yellow 0%,\n @yellow 5%,\n @peach 45%,\n @mauve 60%,\n @blue 90%\n );\n /* Instagram text logo */\n [style*=\"background-image: url(\\\"https://static.cdninstagram.com/rsrc.php/v3/yU/r/H5Bq7ru-y9E.png\\\");\"]\n {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n background-position: -3px -7px !important;\n background-size: unset !important;\n }\n /* 2fa lock icon */\n [aria-label=\"Two factor authentication lock icon\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n /* \"All caught up\" icon */\n img[src=\"/images/instagram/xig/web/illo-confirm-refresh-light.png\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n [style*='background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\")']\n {\n /* No photo icon */\n &[style*=\"background-position: 0px -97px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: 0 -97px;\n }\n\n /* Private page icon */\n &[style*=\"background-position: -49px -97px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: -49px -97px;\n }\n\n &[style*=\"background-position: -49px 0px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: -49px 0;\n }\n }\n\n /* Post swipe icons */\n ._aaqh {\n background-color: @surface0;\n }\n\n /* Inside primary buttons */\n .xzloghq,\n ._acas:not(._acao) {\n &,\n svg {\n color: @crust;\n fill: @mantle;\n }\n }\n ._acas:not(._acao):hover {\n background-color: @surface0 !important;\n color: @accent-color !important;\n }\n\n /* Secondary buttons */\n .x1gjpkn9,\n ._acat,\n ._acap {\n &,\n a& {\n &,\n &:visited {\n color: @text;\n }\n }\n }\n\n /* Profile banner */\n div:has(> .x1mu97ne) {\n background-color: @crust;\n border-color: @overlay0;\n box-shadow: 0 10px 35px 2px fadeout(@dark-color, 0.7);\n }\n\n /* Dialog overlay */\n .x7r02ix[role=\"dialog\"] {\n box-shadow: 0 5px 10px 0 fadeout(@dark-color, 0.5);\n }\n\n /* Settings */\n ._ab81 {\n background-color: @mantle;\n }\n ._ab85,\n ._ab6i,\n ._ab85 .xvbhtw8,\n ._aav4 {\n background-color: @crust;\n }\n /* Settings saved toast */\n ._abmp {\n color: @text;\n }\n\n /* Bloks */\n .wbloks_1[data-bloks-name=\"bk.components.Collection\"] {\n background-color: @base !important;\n }\n div[data-bloks-name=\"bk.components.Flexbox\"],\n .wbloks_1[data-bloks-name=\"bk.components.Flexbox\"] {\n /* Radios have left padding */\n padding-left: 0 !important;\n\n /* The heading */\n &[style*=\"background: rgb(0\\, 0\\, 0)\"],\n &[style*=\"background: rgb(255\\, 255\\, 255)\"] {\n background-color: @base !important;\n }\n\n /* Radios */\n &[style*=\"border-radius: 10.5px\"],\n &[style*=\"border-radius: 12px\"],\n &[style*=\"border-radius: 4px\"] {\n /* Selected radio */\n &[style*=\"background: rgb(0\\, 149\\, 246)\"] {\n background-color: @accent-color !important;\n }\n\n /* Not selected radio */\n &[style*=\"background: rgb(219\\, 219\\, 219)\"],\n &[style*=\"background: rgb(38\\, 38\\, 38)\"],\n &[style*=\"background: rgb(54\\, 54\\, 54)\"],\n &[style*=\"background: rgb(255\\, 255\\, 255)\"] {\n background-color: @surface0 !important;\n }\n }\n\n /* That \"border\" */\n &[style*=\"background: rgb(38\\, 38\\, 38)\"] {\n display: none;\n }\n }\n\n span[data-bloks-name=\"bk.components.TextSpan\"],\n span[data-bloks-name=\"bk.components.Text\"] {\n &[style*=\"color: rgb(250\\, 250\\, 250)\"],\n &[style*=\"color: rgb(224\\, 241\\, 255)\"],\n &[style*=\"color: rgb(0\\, 55\\, 107)\"],\n &[style*=\"color: rgb(38\\, 38\\, 38)\"] {\n color: @text !important;\n }\n\n &[style*=\"color: rgb(142\\, 142\\, 142)\"] {\n color: @subtext0 !important;\n }\n }\n\n /* Map pop-ups */\n .leaflet-popup-content-wrapper,\n .leaflet-popup-tip {\n background-color: @mantle;\n box-shadow: 0 5px 15px fadeout(@dark-color, 0.4);\n\n * {\n color: @text !important;\n }\n }\n\n /* Scrollbar */\n ::-webkit-scrollbar {\n background-color: @crust;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: @accent-color;\n border-radius: 10px;\n }\n }\n}\n\n@-moz-document regexp('^.*instagram.com/direct.*') {\n ._aa4d {\n #catppuccin(@darkFlavor, @accentColor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor, @accentColor);\n }\n #catppuccin(@lookup,\n @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n /* Chat background */\n .xnz67gz {\n background-color: @base;\n }\n [style*=\"background-color: rgb(55, 151, 240);\"] {\n background-color: @blue !important;\n color: @mantle !important;\n }\n .xvbhtw8 {\n background-color: @mantle;\n }\n .x186z157,\n .xk50ysn,\n .xi81zsa {\n color: @subtext0 !important;\n }\n ._aa5c,\n ._aa4j,\n ._abyk {\n background-color: @crust;\n }\n\n /* New Chat Button */\n .xk5f4mz {\n background-color: @surface0;\n }\n\n /* Chat button */\n .x1i10hfl:hover {\n background-color: @surface0;\n color: @text;\n }\n }\n}\n\n#rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: {\n @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8;\n @text-filter: brightness(0) saturate(100%) invert(28%) sepia(17%) saturate(835%) hue-rotate(196deg) brightness(97%) contrast(85%);\n };\n @frappe: {\n @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634;\n @text-filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1519%) hue-rotate(192deg) brightness(100%) contrast(93%);\n };\n @macchiato: {\n @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926;\n @text-filter: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(377%) hue-rotate(192deg) brightness(103%) contrast(92%);\n };\n @mocha: {\n @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b;\n @text-filter: brightness(0) saturate(100%) invert(85%) sepia(6%) saturate(1356%) hue-rotate(194deg) brightness(103%) contrast(91%);\n };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name Instagram Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/instagram\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/instagram\n@version 0.2.5\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainstagram\n@description Soothing pastel theme for Instagram\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain('instagram.com') {\n ._aa4d {\n #catppuccin(@darkFlavor, @accentColor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n @text-filter: @catppuccin[@@lookup][@text-filter];\n @dark-color: if(@lookup = latte, @text, @crust);\n @light-color: if(@lookup = latte, @crust, @text);\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &,\n .x1qjc9v5,\n .x9f619,\n .x78zum5,\n .xdt5ytf,\n .x1iyjqo2,\n .xl56j7k {\n --web-always-black: #rgbify(@dark-color) [];\n --ig-primary-icon: #rgbify(@text) [];\n --web-always-white: #rgbify(@light-color) [];\n --always-white: #rgbify(@light-color) [];\n --overlay-alpha-80: fadeout(@dark-color, 50);\n --always-dark-overlay: fadeout(@surface0, 50);\n --grey-9: #rgbify(@crust) [];\n --ig-primary-background: #rgbify(@base) [];\n --ig-secondary-background: #rgbify(@surface0) [];\n --ig-banner-background: #rgbify(@crust) [];\n --ig-highlight-background: #rgbify(@surface0) [];\n --ig-elevated-background: #rgbify(@crust) [];\n --ig-elevated-highlight-background: #rgbify(@surface0) [];\n --ig-hover-overlay: #rgbify(@text) [], 0.1;\n --hover-overlay: fadeout(@surface0, 80);\n --ig-text-on-color: #rgbify(@crust) [];\n --ig-badge: #rgbify(@accent-color) [];\n --ig-primary-button: #rgbify(@accent-color) [];\n --ig-primary-button-hover: fadeout(@accent-color, 20);\n --ig-secondary-button-background: #rgbify(@surface0) [];\n --ig-secondary-button-hover: #rgbify(@surface1) [];\n --ig-secondary-button: #rgbify(@text) [];\n --ig-primary-text: #rgbify(@text) [];\n --ig-secondary-text: #rgbify(@subtext0) [];\n --ig-tertiary-text: #rgbify(@subtext0) [];\n --wbloks-primary-text: @text;\n --ig-text-on-media: #rgbify(@text) [];\n --ig-separator: #rgbify(@surface0) [];\n --chat-admin-text-color: #rgbify (@subtext0) [];\n --ig-elevated-separator: #rgbify(@surface0) [];\n --post-separator: #rgbify(@overlay0) [];\n --ig-stroke: #rgbify(@overlay0) [];\n --grey-2: #rgbify(@overlay0) [];\n --ig-link: #rgbify(@accent-color) [];\n --ig-error-or-destructive: #rgbify(@maroon) [];\n --ig-success: #rgbify(@green) [];\n --blue-2: #rgbify(@blue) [];\n --ig-close-friends-refreshed: #rgbify(@green) [];\n --ig-text-input-border-hover-prism: #rgbify(@surface1) [];\n --ig-toggle-outline-prism: #rgbify(@text) [];\n --ig-toggle-background-on-prism: #rgbify(@text) [];\n --ig-stroke-prism: #rgbify(@crust) [];\n --barcelona-logo: #rgbify (@text) [];\n scrollbar-color: @accent-color @crust;\n }\n #splash-screen {\n background-color: @base !important;\n }\n\n /* Sidebar */\n .x1xgvd2v {\n background-color: @crust !important;\n &[style=\"transform: translateX(0px);\"] {\n background-color: @mantle !important;\n }\n }\n .x1zvrr1 {\n background-color: @mantle;\n }\n svg[aria-label=\"Loading...\"] {\n stroke: @text;\n }\n\n /* Story background */\n .x5qyhuo {\n background-color: @base;\n }\n\n /* Story progress bar */\n ._ac3p {\n background-color: @accent-color !important;\n }\n\n /* Story seen / not seen ring */\n button:has(canvas + span > img[alt$=\"'s profile picture\"]) {\n canvas {\n display: none;\n }\n\n span {\n outline-style: solid;\n outline-offset: 0.15rem;\n }\n\n &[aria-label^=\"Story by\"][aria-label$=\"not seen\"] span {\n outline-color: @accent-color;\n outline-width: 0.2rem;\n }\n &[aria-label^=\"Story by\"]:not([aria-label$=\"not seen\"]) span {\n outline-color: @surface2;\n outline-width: 0.075rem;\n }\n }\n\n /* Posts */\n ._aggc {\n background-color: @mantle;\n border-color: @overlay0 !important;\n border-radius: var(--modal-border-radius);\n box-shadow: 0 3px 5px -1px fadeout(@dark-color, 20);\n box-sizing: border-box;\n }\n ._aatc ._aasi,\n ._ae1i,\n ._aggc textarea.xvbhtw8 {\n background-color: @mantle;\n }\n\n /* Icons */\n svg[aria-label=\"Unlike\"] {\n fill: @accent-color;\n }\n svg[aria-label=\"Close\"] {\n color: @text;\n }\n svg[aria-label=\"Verified\"] {\n fill: @accent-color;\n }\n\n /* Share box */\n .xzloghq {\n background-color: @surface0;\n color: @text !important;\n &:hover {\n color: @mantle !important;\n background-color: @accent-color !important;\n }\n }\n .xk5f4mz {\n background-color: @mantle;\n &:hover {\n background-color: @accent-color;\n }\n }\n .x3nfvp2 {\n color: @text !important;\n &:hover {\n color: @crust;\n }\n }\n\n /* Toggle sliders */\n .x1r7x56h {\n background-color: @accent-color;\n }\n .x100vrsf {\n background-color: @surface0;\n }\n .xw4jnvo {\n background-color: @overlay1;\n }\n .x1psfjxj {\n background-color: @mantle;\n }\n span[data-bloks-name=\"bk.components.TextSpan\"] {\n color: @accent-color !important;\n }\n .xs7f9wi {\n background-color: @mantle !important;\n }\n .x1d72o {\n background-color: @surface0;\n }\n /* Log In With Facebook text */\n ._ab37 {\n color: @blue;\n }\n /* Excluded: - _9ys7, _9_1f, _9ys8 (verified icon) */\n [style*='background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\")'],\n ._9zkj,\n ._a3ds,\n ._a3dt,\n ._a3du,\n ._a3dv,\n ._a3dw,\n ._9-b3,\n ._9znl,\n ._9z-6,\n ._a3dx,\n ._a3dy,\n ._a3dz,\n ._a3d-,\n ._a3d_,\n ._a3e0,\n ._9zm4,\n ._a3e1,\n ._a3e2,\n ._a3e3,\n ._a3e4,\n ._a3e5,\n ._a3e6,\n ._a3e7,\n ._a3e8,\n ._a3e9,\n ._a3ea,\n ._9_57,\n ._9_n5,\n ._9-y3,\n ._a3eb,\n ._a3ec,\n ._a3ed,\n ._a3ee,\n ._9zlu,\n ._9-yp,\n ._a3ef,\n ._a3eg,\n ._9_wm,\n ._a3eh,\n ._a3ei,\n ._9-j_,\n ._a3ej,\n ._a3ek,\n ._9_ij,\n ._9_d_,\n ._9_e1,\n ._9-mm,\n ._9_cx,\n ._9zm0,\n ._9zfi,\n ._9-ub,\n ._a3el,\n ._9-7-,\n ._9-1a,\n ._a3em,\n ._9zrp,\n ._a3en,\n ._9zz9,\n ._a3eo,\n ._9zmr,\n ._9-8d,\n ._9zhi,\n ._a3ep,\n ._9zs0,\n ._9-j-,\n ._a3eq,\n ._9zli,\n ._9_4y,\n ._9zm2,\n ._9zfj,\n ._9zlg,\n ._a3er,\n ._9-lv,\n ._9_ug,\n ._9_sh,\n ._9_sj,\n ._9-k0,\n ._9z-c,\n ._9_35,\n ._9_hh,\n ._a3es,\n ._a3et,\n ._a3eu,\n ._9-v-,\n ._9_4d,\n ._9zlh,\n ._a3ev,\n ._a3ew,\n ._a3ex,\n ._a3ey,\n ._9_7m,\n ._9_fv,\n ._a3ez,\n ._9-zf,\n ._9-zg,\n ._9-ze,\n ._a9fa,\n ._9-zh,\n ._9-zi,\n ._9-zj,\n ._9-zk,\n ._9-zl,\n ._9-zm,\n ._9-zn,\n ._9-zo,\n ._9-zp,\n ._9-zq,\n ._9-zr,\n ._9-zs,\n ._9-zt,\n ._a3op,\n ._a3oq,\n ._9-zu,\n ._9-zv,\n ._9-zw,\n ._9-zx,\n ._9-zy,\n ._9-zz,\n ._9-z-,\n ._a3or,\n ._a3ot,\n ._a3os,\n ._9zs1,\n ._9zs2,\n ._9-z_,\n ._9--0,\n ._9--1,\n ._9--2,\n ._9--3,\n ._9--4,\n ._9--5,\n ._9--6,\n ._9--7,\n ._9--f,\n ._9--8,\n ._9--9,\n ._9--a,\n ._9--b,\n ._9--c,\n ._9--d,\n ._9--e,\n ._a3ou,\n ._9--g,\n ._9--h,\n ._9--i,\n ._9--j,\n ._9--l,\n ._9--k,\n ._9--m,\n ._9--n,\n ._9--o,\n ._9--p,\n ._9--q,\n ._a3ov,\n ._9--s,\n ._9--r,\n ._9--t,\n ._9--u,\n ._9--v,\n ._9--x,\n ._9--y,\n ._9--w,\n ._9--z,\n ._9--_,\n ._9-_0,\n ._9-_1,\n ._9-_2,\n ._9-_3,\n ._9---,\n ._9-_4,\n ._9-_5,\n ._9-_6,\n ._9-_7,\n ._a3wy,\n ._9-_8,\n ._9-_9,\n ._a3ow,\n ._9-_a,\n ._9-_b,\n ._9-_c,\n ._9-_d,\n ._9-_e,\n ._9-_f,\n ._9-_g,\n ._9-_h,\n ._9-_i,\n ._9-_j,\n ._9-_k,\n ._9-_l,\n ._9-_m,\n ._9-_n,\n ._9-_o,\n ._a3ox,\n ._9-_p,\n ._9-_q,\n ._a9fb,\n ._9-_t,\n ._9-_r,\n ._9-_s,\n ._a93g,\n ._9-_u,\n ._9-_v,\n ._a9fc,\n ._9-_w,\n ._9-_x,\n ._9-_y,\n ._9-_z,\n ._9-_-,\n ._9-__,\n ._9_00,\n ._a3oy,\n ._9_01,\n ._9_02,\n ._9_03,\n ._9_04,\n ._9_05,\n ._9_08,\n ._9_09,\n ._9_07,\n ._9_06,\n ._9_0a,\n ._9_0b,\n ._9_0c,\n ._9_0d,\n ._9_0e,\n ._9_0f,\n ._9_0g,\n ._a93h,\n ._9_0h,\n ._9_0i,\n ._9_0j,\n ._9_0k,\n ._aepo,\n ._9_0l,\n ._9_0m,\n ._9_0n,\n ._9_0o,\n ._9_0p,\n ._a3oz,\n ._a93l,\n ._9_0r,\n ._9_0s,\n ._a7tk,\n ._9_0q,\n ._a3o-,\n ._9_0t,\n ._9_0v,\n ._9_0u,\n ._a9ej,\n ._9_0w,\n ._9_0x,\n ._9_0y,\n ._9_0z,\n ._9_0_,\n ._9_0-,\n ._9_10,\n ._9_11,\n ._9_12,\n ._9_13,\n ._9_14,\n ._9_15,\n ._a3o_,\n ._9_18,\n ._9_19,\n ._9_1a,\n ._9_1e,\n ._9_1b,\n ._9_1c,\n ._9_1d,\n ._9_16,\n ._9_17,\n ._a3p0,\n ._9_1g,\n ._9_1i,\n ._9_1h,\n ._9_1j,\n ._9_1k,\n ._9_1l,\n ._9_1m,\n ._a9pw {\n filter: @text-filter;\n }\n\n /* Custom icons */\n @instagram_gradient: radial-gradient(\n circle at 30% 107%,\n @yellow 0%,\n @yellow 5%,\n @peach 45%,\n @mauve 60%,\n @blue 90%\n );\n /* Instagram text logo */\n [style*=\"background-image: url(\\\"https://static.cdninstagram.com/rsrc.php/v3/yU/r/H5Bq7ru-y9E.png\\\");\"]\n {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n background-position: -3px -7px !important;\n background-size: unset !important;\n }\n /* 2fa lock icon */\n [aria-label=\"Two factor authentication lock icon\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n /* \"All caught up\" icon */\n img[src=\"/images/instagram/xig/web/illo-confirm-refresh-light.png\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n [style*='background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\")']\n {\n /* No photo icon */\n &[style*=\"background-position: 0px -97px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: 0 -97px;\n }\n\n /* Private page icon */\n &[style*=\"background-position: -49px -97px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: -49px -97px;\n }\n\n &[style*=\"background-position: -49px 0px\"] {\n filter: none;\n background: @mauve !important;\n background: @instagram_gradient !important;\n mask-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png\");\n mask-position: -49px 0;\n }\n }\n\n /* Post swipe icons */\n ._aaqh {\n background-color: @surface0;\n }\n\n /* Inside primary buttons */\n .xzloghq,\n ._acas:not(._acao) {\n &,\n svg {\n color: @crust;\n fill: @mantle;\n }\n }\n ._acas:not(._acao):hover {\n background-color: @surface0 !important;\n color: @accent-color !important;\n }\n\n /* Secondary buttons */\n .x1gjpkn9,\n ._acat,\n ._acap {\n &,\n a& {\n &,\n &:visited {\n color: @text;\n }\n }\n }\n\n /* Profile banner */\n div:has(> .x1mu97ne) {\n background-color: @crust;\n border-color: @overlay0;\n box-shadow: 0 10px 35px 2px fadeout(@dark-color, 0.7);\n }\n\n /* Dialog overlay */\n .x7r02ix[role=\"dialog\"] {\n box-shadow: 0 5px 10px 0 fadeout(@dark-color, 0.5);\n }\n\n /* Settings */\n ._ab81 {\n background-color: @mantle;\n }\n ._ab85,\n ._ab6i,\n ._ab85 .xvbhtw8,\n ._aav4 {\n background-color: @crust;\n }\n /* Settings saved toast */\n ._abmp {\n color: @text;\n }\n\n /* Bloks */\n .wbloks_1[data-bloks-name=\"bk.components.Collection\"] {\n background-color: @base !important;\n }\n div[data-bloks-name=\"bk.components.Flexbox\"],\n .wbloks_1[data-bloks-name=\"bk.components.Flexbox\"] {\n /* Radios have left padding */\n padding-left: 0 !important;\n\n /* The heading */\n &[style*=\"background: rgb(0\\, 0\\, 0)\"],\n &[style*=\"background: rgb(255\\, 255\\, 255)\"] {\n background-color: @base !important;\n }\n\n /* Radios */\n &[style*=\"border-radius: 10.5px\"],\n &[style*=\"border-radius: 12px\"],\n &[style*=\"border-radius: 4px\"] {\n /* Selected radio */\n &[style*=\"background: rgb(0\\, 149\\, 246)\"] {\n background-color: @accent-color !important;\n }\n\n /* Not selected radio */\n &[style*=\"background: rgb(219\\, 219\\, 219)\"],\n &[style*=\"background: rgb(38\\, 38\\, 38)\"],\n &[style*=\"background: rgb(54\\, 54\\, 54)\"],\n &[style*=\"background: rgb(255\\, 255\\, 255)\"] {\n background-color: @surface0 !important;\n }\n }\n\n /* That \"border\" */\n &[style*=\"background: rgb(38\\, 38\\, 38)\"] {\n display: none;\n }\n }\n\n span[data-bloks-name=\"bk.components.TextSpan\"],\n span[data-bloks-name=\"bk.components.Text\"] {\n &[style*=\"color: rgb(250\\, 250\\, 250)\"],\n &[style*=\"color: rgb(224\\, 241\\, 255)\"],\n &[style*=\"color: rgb(0\\, 55\\, 107)\"],\n &[style*=\"color: rgb(38\\, 38\\, 38)\"] {\n color: @text !important;\n }\n\n &[style*=\"color: rgb(142\\, 142\\, 142)\"] {\n color: @subtext0 !important;\n }\n }\n\n /* Map pop-ups */\n .leaflet-popup-content-wrapper,\n .leaflet-popup-tip {\n background-color: @mantle;\n box-shadow: 0 5px 15px fadeout(@dark-color, 0.4);\n\n * {\n color: @text !important;\n }\n }\n\n /* Scrollbar */\n ::-webkit-scrollbar {\n background-color: @crust;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: @accent-color;\n border-radius: 10px;\n }\n }\n}\n\n@-moz-document regexp('^.*instagram.com/direct.*') {\n ._aa4d {\n #catppuccin(@darkFlavor, @accentColor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor, @accentColor);\n }\n #catppuccin(@lookup,\n @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n .x11jlvup {\n --chat-outgoing-message-bubble-background-color: @blue;\n }\n .x1n2onr6 {\n --chat-incoming-message-bubble-background-color: @surface0;\n }\n\n /* Chat background */\n .xnz67gz {\n background-color: @base;\n }\n /* messages you've sent */\n .xyk4ms5 {\n color: @crust !important;\n }\n /* sidebar */\n .xvbhtw8 {\n background-color: @mantle;\n }\n .x186z157,\n .xk50ysn,\n .xi81zsa {\n color: @subtext0 !important;\n }\n\n /* New Chat Button */\n .xk5f4mz {\n background-color: @surface0;\n }\n\n /* Chat button */\n .x1i10hfl:hover {\n background-color: @surface0;\n color: @text;\n }\n\n /* notes */\n .xsnw5ke,\n .x3zg9eu::after {\n background-color: @surface0;\n }\n .x103n6ev,\n .xzxgvzf {\n background-image: linear-gradient(\n -90deg,\n fade(@surface0, 30%),\n fade(@surface0, 100%)\n );\n }\n\n /* explicit music icon in notes */\n .x1cp0k07 {\n color: @text;\n }\n }\n}\n\n#rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: {\n @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8;\n @text-filter: brightness(0) saturate(100%) invert(28%) sepia(17%) saturate(835%) hue-rotate(196deg) brightness(97%) contrast(85%);\n };\n @frappe: {\n @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634;\n @text-filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1519%) hue-rotate(192deg) brightness(100%) contrast(93%);\n };\n @macchiato: {\n @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926;\n @text-filter: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(377%) hue-rotate(192deg) brightness(103%) contrast(92%);\n };\n @mocha: {\n @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b;\n @text-filter: brightness(0) saturate(100%) invert(85%) sepia(6%) saturate(1356%) hue-rotate(194deg) brightness(103%) contrast(91%);\n };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Instagram Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/instagram",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/instagram",
- "version": "0.2.4",
+ "version": "0.2.5",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainstagram",
"description": "Soothing pastel theme for Instagram",
@@ -3160,11 +3163,12 @@
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/instagram",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.css",
"name": "Instagram Catppuccin",
- "originalDigest": "29ba131cda674c01cb31e167f91ba65c266b0ccc",
+ "originalDigest": "fab29862a4b8cb7b7fb8bf32e57c3348c429c45a",
"_id": "64b66cea-b486-484e-be5e-6892494d1667",
- "_rev": 1715536630889,
+ "_rev": 1718609785721,
"id": 18,
- "etag": "W/\"f135dc347b0388bd3296c5e6c7a9ea40e38664eb06aebfbb1febec3f120b9cb6\""
+ "etag": "W/\"79c8469062b7023a89a476c14d6e0db48798adb183ab1af006212829d299037b\"",
+ "updateDate": 1718609785672
},
{
"enabled": true,
@@ -3350,12 +3354,12 @@
"code": ""
}
],
- "sourceCode": "/* ==UserStyle==\n@name Twitter Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/twitter\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitter\n@version 1.0.5\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitter\n@description Soothing pastel theme for Twitter\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n\n@var checkbox colorizeLogo \"Colorize Logo\" 0\n@var checkbox darkenShadows \"Darken Shadows on Dark Themes\" 1\n==/UserStyle== */\n\n@-moz-document domain(\"twitter.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n body.LightsOut {\n --border-color: @surface0;\n --color: @overlay1;\n --color-emphasis: @text;\n --hover-bg-color: @surface0;\n\n // shadows\n .r-qo02w8,\n .r-15ce4ve {\n @default-shadow:\n fade(@text, 20%) 0 0 15px,\n fade(@text, 15%) 0 0 3px 1px;\n @black-shadow:\n rgba(0, 0, 0, 0.4) 0 0 15px,\n rgba(0, 0, 0, 0.35) 0 0 3px 1px;\n\n box-shadow: @default-shadow;\n\n & when (@darkenShadows = 1) {\n box-shadow: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n\n .r-1tbvlxk {\n @default-shadow: drop-shadow(fade(@text, 25%) 1px -1px 1px);\n @black-shadow: drop-shadow(rgba(0, 0, 0, 0.5) 1px -1px 1px);\n\n filter: @default-shadow;\n\n & when (@darkenShadows = 1) {\n filter: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n\n .r-1uusn97 {\n @default-shadow:\n fade(@text, 20%) 0 0 5px,\n fade(@text, 15%) 0 1px 4px 1px;\n @black-shadow:\n rgba(0, 0, 0, 0.4) 0 0 5px,\n rgba(0, 0, 0, 0.35) 0 1px 4px 1px;\n\n box-shadow: @default-shadow;\n\n & when (@darkenShadows = 1) {\n box-shadow: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n }\n\n body,\n .PageContainer,\n #placeholder {\n background-color: @base !important;\n color: @text;\n }\n\n #ScriptLoadFailure span {\n color: @text;\n }\n\n [style*=\"scrollbar-color: rgb(62, 65, 68) rgb(22, 24, 28)\"] {\n scrollbar-color: @accent-color transparent !important;\n scrollbar-width: thin;\n }\n\n // bg color\n [data-testid=\"primaryColumn\"],\n .r-kemksi {\n background-color: @base;\n }\n\n // arrow on account switcher\n .r-cqee49 {\n color: @base;\n }\n\n // top nav bg color\n .r-5zmot {\n background-color: fade(@base, 75%);\n }\n\n // element hover (when on base)\n .r-1hdo0pc,\n .r-pjtv4k {\n background-color: fade(@text, 10%);\n }\n\n // element active (when on base)\n .r-11gmi9o {\n background-color: fade(@text, 20%);\n }\n\n .r-1cuuowz {\n background-color: fade(@text, 3%);\n }\n\n // text\n .r-1nao33i {\n color: @text;\n }\n\n // white text, seems to appear on accent colors\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n\n // cw svg\n &:has(\n path[d=\"M3.693 21.707l-1.414-1.414 2.429-2.429c-2.479-2.421-3.606-5.376-3.658-5.513l-.131-.352.131-.352c.133-.353 3.331-8.648 10.937-8.648 2.062 0 3.989.621 5.737 1.85l2.556-2.557 1.414 1.414L3.693 21.707zm-.622-9.706c.356.797 1.354 2.794 3.051 4.449l2.417-2.418c-.361-.609-.553-1.306-.553-2.032 0-2.206 1.794-4 4-4 .727 0 1.424.192 2.033.554l2.263-2.264C14.953 5.434 13.512 5 11.986 5c-5.416 0-8.258 5.535-8.915 7.001zM11.986 10c-1.103 0-2 .897-2 2 0 .178.023.352.067.519l2.451-2.451c-.167-.044-.341-.067-.519-.067zm10.951 1.647l.131.352-.131.352c-.133.353-3.331 8.648-10.937 8.648-.709 0-1.367-.092-2-.223v-2.047c.624.169 1.288.27 2 .27 5.415 0 8.257-5.533 8.915-7-.252-.562-.829-1.724-1.746-2.941l1.438-1.438c1.53 1.971 2.268 3.862 2.33 4.027z\"]\n ) {\n color: @text;\n }\n }\n\n // borders\n .r-1kqtdi0,\n .r-1roi411 {\n border-color: @surface0;\n }\n\n .r-1igl3o0 {\n border-bottom-color: @surface0;\n }\n\n .r-2sztyj {\n border-top-color: @surface0;\n }\n\n .r-1aihyag {\n border-right-color: @surface0;\n }\n\n .r-1wyyjkm {\n border-left-color: @subtext0; // border when replying to a dm\n }\n\n // is this post relevant to you?\n .r-1ccsd61,\n .r-xzxzvz {\n border-color: @surface2;\n }\n\n .r-gu4em3,\n .r-1bnu78o,\n .r-z32n2g, // search bar\n .r-1m3jxhj {\n background-color: @surface0;\n }\n\n // base color border\n .r-1xc7w19 {\n border-color: @base;\n }\n\n // active border for dms\n .r-1pbtemp {\n border-right-color: @accent-color;\n }\n\n // accent color borders\n .r-vhj8yc {\n border-color: @accent-color;\n }\n\n // magnifying glass in search bar\n .r-1bwzh9t {\n color: @overlay1;\n }\n\n // right side content\n .r-g2wdr4 {\n background-color: @mantle;\n }\n\n .r-14wv3jr {\n border-color: @mantle;\n }\n\n // bg color accent\n .r-l5o3uw {\n background-color: @accent-color;\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n // accent element when hovered\n .r-1vtznih {\n background-color: darken(@accent-color, 10%);\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n .r-1peqgm7 {\n background-color: fade(@accent-color, 10%);\n }\n\n // accent element when active\n .r-yuvema {\n background-color: darken(@accent-color, 15%);\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n .r-r18ze4 {\n background-color: fade(@accent-color, 20%);\n }\n\n // white elements when hovered\n .r-jc7xae {\n background-color: darken(@text, 4%);\n }\n\n // white elements when active\n .r-6wtuen {\n background-color: darken(@text, 8%);\n }\n\n // tooltips\n .r-1pr99xn {\n background-color: @surface1;\n }\n\n // new notifications\n .r-1eltapf {\n background-color: fade(@sapphire, 10%);\n }\n\n // polls\n .r-eok2q2 {\n background-color: fade(@accent-color, 60%);\n }\n\n // box shadow around active poll input box\n .r-9cip40 {\n box-shadow: @accent-color 0 0 0 1px;\n }\n\n // spaces\n .r-1blqq69 {\n border-color: @mauve;\n }\n\n // reactions on dms\n .r-qazpri {\n color: @overlay1;\n }\n\n @keyframes r-1wvy3k1 {\n 0% {\n box-shadow: fade(@mauve, 40%) 0;\n }\n\n 100% {\n box-shadow: fade(@mauve, 0%) 0;\n }\n }\n\n [style=\"background-image: linear-gradient(61.63deg, rgb(45, 66, 255) -15.05%, rgb(156, 99, 250) 104.96%);\"] {\n background-image: linear-gradient(\n 61.63deg,\n @blue -15.05%,\n @mauve 104.96%\n ) !important;\n }\n\n // tweet textbox placeholder\n .draftjs-styles_0 .public-DraftEditorPlaceholder-root {\n color: @overlay0;\n }\n\n // who can reply? bg\n .r-rgqbpe {\n background-color: fade(@blue, 10%);\n }\n\n // circles\n .r-s224ru {\n background-color: @green;\n }\n\n .r-h7o7i8 {\n background-color: fade(@green, 10%);\n }\n\n // live indicator\n .r-4nw3r4,\n .r-1dgebii {\n background-color: @red;\n }\n\n // live border\n .r-b5kvu3 {\n border-color: @red;\n }\n\n // red transparent bg (appears with \"unfollow\" hover)\n .r-qqmkd0 {\n background-color: fade(@red, 10%);\n }\n\n // red bg on hover\n .r-12d83nn {\n background-color: darken(@red, 10%);\n }\n\n // red bg when active\n .r-oybae9 {\n background-color: darken(@red, 15%);\n }\n\n .r-11mg6pl {\n border-color: if(@lookup=latte, #fff, @crust); // white border\n }\n\n // mask over layer\n .r-11z020y {\n background-color: fade(desaturate(darken(@accent-color, 10%), 50%), 12%);\n }\n\n // likes\n [fill=\"rgb(249,22,127)\"],\n [fill=\"rgb(222,45,108)\"],\n g[clip-path=\"url(#__lottie_element_562)\"] path,\n [style=\"color: rgb(249, 24, 128);\"] [viewBox=\"0 0 24 24\"] path {\n fill: @red !important;\n }\n\n // likes when hover\n .r-1krxqcr {\n background-color: fade(@red, 10%);\n }\n\n // likes when active\n .r-uuique {\n background-color: fade(@red, 20%);\n }\n\n // heart svg on notifications page\n .r-vkub15,\n .r-9l7dzd {\n color: @red;\n }\n\n // bell svg on notifications page\n .r-1cvl2hr {\n color: @accent-color;\n }\n\n // retweet svg on notifications page\n .r-o6sn0f {\n color: @green;\n }\n\n // rt when hover\n .r-15azkrj {\n background-color: fade(@green, 10%);\n }\n\n // rt when active\n .r-1x669os {\n background-color: fade(@green, 20%);\n }\n\n // image won't load svg\n [data-testid=\"card.wrapper\"]\n [d=\"M21.04 1.54L17.5 5.09c-.04-.02-.08-.03-.13-.04L14.3 3H9.7l-3 2H5C3.62 5 2.5 6.12 2.5 7.5v11c0 .46.12.88.34 1.25l-1.3 1.29 1.42 1.42 19.5-19.5-1.42-1.42zM13.7 5l2.33 1.56-2 1.99C13.44 8.2 12.74 8 12 8c-2.21 0-4 1.79-4 4 0 .74.2 1.44.55 2.03L4.5 18.09V7.5c0-.28.22-.5.5-.5h2.3l3-2h3.4zM12 10c.18 0 .35.02.52.07l-2.45 2.45c-.05-.17-.07-.34-.07-.52 0-1.1.9-2 2-2zm7 11H7.24l2-2H19c.28 0 .5-.22.5-.5V9h2v9.5c0 1.38-1.12 2.5-2.5 2.5z\"] {\n color: @overlay0;\n }\n\n // cw button\n .r-n94g0g {\n background-color: fade(@text, 30%); // when hovered\n }\n\n .r-z9i421 {\n background-color: fade(@text, 27%); // when active\n }\n\n .r-19130f6 {\n background-color: @crust; // when hovered\n }\n\n .r-l8tqsx {\n background-color: fade(@text, 10%); // when active\n }\n\n // lock svg when you try to write a commu note but can't\n .r-3gvs5h {\n background-color: @overlay1;\n }\n\n // sunglasses commu note\n .r-1fkb3t2 {\n background-color: @surface1;\n }\n\n // media player text\n .r-jwli3a {\n color: @text;\n }\n\n .r-1kwlb9n {\n background-color: fade(@red, 12%);\n }\n\n // hard-coded shit\n // ugly-ass twitter blue/premium bg. why.\n [style*=\"https://abs.twimg.com/responsive-web/client-web/background-premiumplus-web\"]\n {\n background-image: none !important;\n background-color: @surface0;\n }\n\n [stroke=\"#2F3336\" i] {\n stroke: @surface2 !important;\n }\n\n [stroke=\"#1D9BF0\" i],\n [style*=\"stroke: rgb(29, 155, 240)\"] {\n stroke: @accent-color !important;\n }\n\n [stroke=\"#FFD400\" i] {\n stroke: @yellow !important;\n }\n\n [fill=\"#829AAB\" i] {\n fill: @overlay2 !important;\n }\n\n // \"we received your report\" svg\n [fill=\"#1DA1F2\" i] {\n fill: if(@lookup=latte, darken(@sky, 15%), darken(@sky, 30%)) !important;\n }\n\n [fill=\"#78C6EE\" i] {\n fill: @sky !important;\n }\n\n // yellow verified badge\n [stop-color=\"#f4e72a\" i],\n [stop-color=\"#cd8105\" i],\n [stop-color=\"#cb7b00\" i],\n [stop-color=\"#f4ec26\" i],\n [stop-color=\"#f9e87f\" i],\n [stop-color=\"#e2b719\" i] {\n stop-color: @yellow !important;\n }\n\n [fill=\"#d18800\" i] {\n fill: @yellow !important;\n }\n\n // [fill=\"#333333\" i] {\n // fill: @crust !important;\n //\n // ~ [fill=\"white\"] {\n // fill: @text !important;\n // }\n // }\n\n [style*=\"border-color: rgb(83, 100, 113)\"] {\n border-color: @surface1 !important;\n }\n\n [style*=\"border-color: rgb(51, 54, 57)\"] {\n border-color: @surface0 !important;\n }\n\n [style*=\"border-color: rgb(103, 7, 15)\"] {\n border-color: fadeout(@red, 50%) !important;\n }\n\n [style*=\"border-color: rgb(29, 155, 240)\"] {\n border-color: @accent-color !important;\n }\n\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n [style*=\"color: rgb(239, 243, 244)\"]:not(\n [style*=\"background-color: rgb(239, 243, 244)\"]\n ),\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ) {\n color: @text !important;\n }\n\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n )\n input::placeholder {\n color: @subtext1 !important;\n }\n\n // faded text\n [style*=\"color: rgb(113, 118, 123)\"]:not(\n [style*=\"background-color: rgb(113, 118, 123)\"]\n ),\n [style*=\"color: rgb(182, 185, 188)\"]:not(\n [style*=\"background-color: rgb(182, 185, 188)\"]\n ) {\n color: @overlay1 !important;\n }\n\n // retweets color\n [style*=\"color: rgb(0, 186, 124)\"]:not(\n [style*=\"background-color: rgb(0, 186, 124)\"]\n ) {\n color: @green !important;\n }\n\n // likes/unfollow color\n [style*=\"color: rgb(249, 24, 128)\"]:not(\n [style*=\"background-color: rgb(249, 24, 128)\"]\n ),\n [style*=\"color: rgb(244, 33, 46)\"]:not(\n [style*=\"background-color: rgb(244, 33, 46)\"]\n ) {\n color: @red !important;\n }\n\n [style*=\"color: rgb(250, 68, 152)\"]:not(\n [style*=\"background-color: rgb(250, 68, 152)\"]\n ) {\n color: @pink !important;\n }\n\n [style*=\"color: rgb(255, 212, 0)\"]:not(\n [style*=\"background-color: rgb(255, 212, 0)\"]\n ) {\n color: @yellow !important;\n }\n\n [style*=\"color: rgb(120, 86, 255)\"]:not(\n [style*=\"background-color: rgb(120, 86, 255)\"]\n ) {\n color: @mauve !important;\n }\n\n [style*=\"color: rgb(255, 122, 0)\"]:not(\n [style*=\"background-color: rgb(255, 122, 0)\"]\n ) {\n color: @peach !important;\n }\n\n // accent color (blue)\n [style*=\"color: rgb(29, 155, 240)\"]:not(\n [style*=\"background-color: rgb(29, 155, 240)\"]\n ) {\n color: @accent-color !important;\n }\n\n // background colors\n [style*=\"background-color: rgb(142, 205, 248)\"] {\n background-color: lighten(@accent-color, 10%) !important;\n }\n\n [style*=\"background-color: rgb(2, 17, 61)\"] {\n background-color: fade(@accent-color, 15%) !important;\n }\n\n [style*=\"background-color: rgba(255, 255, 255, 0.25)\"] {\n background-color: fade(@text, 25%) !important;\n }\n\n [style*=\"background-color: rgb(147, 147, 147)\"] {\n background-color: @overlay0 !important;\n\n // for toggle circle\n + [style*=\"background-color: rgb(250, 250, 250)\"]\n when\n not\n (@lookup = latte) {\n background-color: @text !important;\n }\n }\n\n [style*=\"background-color: rgb(29, 155, 240)\"] {\n background-color: @accent-color !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(239, 243, 244)\"] {\n background-color: @text !important;\n\n [style*=\"color: rgb(15, 20, 25)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(244, 33, 46)\"] {\n background-color: @red !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(0, 0, 0)\"],\n [style*=\"background-color: #000\"] {\n background-color: @base !important;\n }\n\n [style*=\"background-color: rgba(15, 20, 25, 0.75)\"] {\n background-color: fade(@crust, 75%) !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] svg {\n color: @text !important;\n }\n }\n\n // whatever\n .r-l5o3uw,\n .r-1vtznih,\n .r-4nw3r4,\n .r-12d83nn,\n .r-oybae9,\n .r-yuvema,\n .r-3gvs5h,\n [style=\"background-image: linear-gradient(61.63deg, rgb(45, 66, 255) -15.05%, rgb(156, 99, 250) 104.96%);\"] {\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n &[style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n &[style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n [color=\"white\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [data-testid=\"videoComponent\"]:not(.r-4nw3r4),\n .r-loe9s5,\n .r-drfeu3:has(\n [style=\"background-color: rgba(255, 255, 255, 0.25); border-color: rgba(0, 0, 0, 0); backdrop-filter: blur(4px);\"]\n ) {\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n &[style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n .r-jwli3a {\n color: #fff !important;\n }\n }\n\n // dms have to be here bc of the above\n .r-eff69c {\n background-color: darken(@accent-color, 5%);\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: @crust !important;\n }\n }\n\n // follow button\n [data-testid$=\"-follow\"] {\n [style*=\"color: rgb(15, 20, 25)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n // sports stuff on explore page\n // a[href^=\"/i/events\"] > div > div > div[style^=\"background-color\"] > div[style*=\"color: rgb(255, 255, 255)\"] span {\n // color: #fff !important;\n // }\n\n // options\n & when (@colorizeLogo = 1) {\n path[d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"] {\n fill: @accent-color !important;\n }\n }\n\n a[aria-label^=\"Translated from\"][aria-label$=\"by Google\"] svg path {\n fill: @text !important;\n }\n }\n}\n\n@-moz-document domain(\"api.twitter.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n html {\n background: @mantle;\n }\n\n #header {\n color: @subtext0;\n background: @base;\n border-bottom-color: @surface1;\n\n .logo a {\n border-bottom-color: transparent;\n }\n\n #session {\n a {\n background: transparent;\n color: @subtext0;\n }\n\n h2 img {\n border-color: @surface1;\n }\n }\n }\n\n .footer {\n background: @mantle;\n border-top-color: @surface1;\n }\n\n .auth h2 {\n color: @subtext1;\n }\n\n .oauth #bd {\n border-color: @surface1;\n }\n\n .app-info h3 img {\n border-color: @base;\n }\n\n .permissions.allow strong {\n color: @green;\n }\n\n .button {\n background: @overlay0;\n color: @text;\n border-color: @surface1;\n\n &:hover {\n color: @text;\n border-color: @surface1;\n background: darken(@surface2, 10%);\n }\n }\n\n .button.selected,\n .follow-button .unfollow .button {\n background-color: @accent-color;\n color: if(@lookup=latte, #fff, @crust);\n border-color: darken(@accent-color, 10%);\n\n &:hover {\n background-color: darken(@accent-color, 10%);\n }\n\n .app-info,\n #bd h3 {\n color: @subtext0;\n }\n\n #ft {\n color: @overlay0;\n }\n }\n }\n}\n\n@-moz-document domain(\"twitter.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n #session a,\n #session input,\n #session button {\n background: @surface0;\n color: @subtext0;\n }\n\n #session .user-menu {\n a:focus,\n a:hover,\n button:focus,\n button:hover,\n input:focus,\n input:hover {\n color: if(@lookup=latte, #fff, @crust);\n background-color: @accent-color;\n }\n }\n\n .notice,\n .notice p,\n h2 {\n color: @subtext1;\n }\n\n .notice.error {\n background: fade(@red, 20%);\n border-color: fade(@red, 25%);\n }\n\n // report page? why isn't this themed\n .ResponsiveLayout--Night .PageContainer {\n background-color: @base;\n }\n\n .list-explanation {\n color: @subtext0;\n }\n\n .ResponsiveLayout--Night .list-btn {\n &:first-of-type {\n border-top-color: @mantle;\n }\n\n &:hover {\n background-color: @mantle;\n }\n }\n\n .submit-btn {\n background-color: @accent-color;\n color: if(@lookup=latte, #fff, @crust);\n border-color: darken(@accent-color, 10%);\n }\n\n .submit-btn:hover,\n .redirect-btn:hover {\n background-color: darken(@accent-color, 10%);\n }\n\n .block-btn {\n color: @maroon;\n border-color: @maroon;\n }\n\n .mute-btn,\n .unfollow-btn,\n .email-report-btn {\n color: @accent-color;\n border-color: @accent-color;\n }\n\n .list-btn {\n border-color: @surface1;\n\n &:first-of-type {\n border-top-color: @surface1;\n }\n\n &:hover {\n background-color: @surface0;\n }\n }\n\n // authorize page\n .js #session .user-menu {\n background-color: @surface0;\n }\n\n .dropdown-caret .caret-outer,\n .dropdown-caret .caret-inner {\n border-bottom-color: @surface0;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "sourceCode": "/* ==UserStyle==\n@name Twitter Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/twitter\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitter\n@version 1.0.7\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitter\n@description Soothing pastel theme for Twitter\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n\n@var checkbox colorizeLogo \"Colorize Logo\" 0\n@var checkbox darkenShadows \"Darken Shadows on Dark Themes\" 1\n==/UserStyle== */\n\n@-moz-document domain(\"twitter.com\"),\ndomain(\"x.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n body.LightsOut {\n --border-color: @surface0;\n --color: @overlay1;\n --color-emphasis: @text;\n --hover-bg-color: @surface0;\n\n // shadows\n .r-qo02w8,\n .r-15ce4ve {\n @default-shadow:\n fade(@text, 20%) 0 0 15px,\n fade(@text, 15%) 0 0 3px 1px;\n @black-shadow:\n rgba(0, 0, 0, 0.4) 0 0 15px,\n rgba(0, 0, 0, 0.35) 0 0 3px 1px;\n\n box-shadow: @default-shadow;\n\n & when (@darkenShadows = 1) {\n box-shadow: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n\n .r-1tbvlxk {\n @default-shadow: drop-shadow(fade(@text, 25%) 1px -1px 1px);\n @black-shadow: drop-shadow(rgba(0, 0, 0, 0.5) 1px -1px 1px);\n\n filter: @default-shadow;\n\n & when (@darkenShadows = 1) {\n filter: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n\n .r-1uusn97 {\n @default-shadow:\n fade(@text, 20%) 0 0 5px,\n fade(@text, 15%) 0 1px 4px 1px;\n @black-shadow:\n rgba(0, 0, 0, 0.4) 0 0 5px,\n rgba(0, 0, 0, 0.35) 0 1px 4px 1px;\n\n box-shadow: @default-shadow;\n\n & when (@darkenShadows = 1) {\n box-shadow: if(@lookup=latte, @default-shadow, @black-shadow);\n }\n }\n }\n\n body,\n .PageContainer,\n #placeholder {\n background-color: @base !important;\n color: @text;\n }\n\n #ScriptLoadFailure span {\n color: @text;\n }\n\n [style*=\"scrollbar-color: rgb(62, 65, 68) rgb(22, 24, 28)\"] {\n scrollbar-color: @accent-color transparent !important;\n scrollbar-width: thin;\n }\n\n // bg color\n [data-testid=\"primaryColumn\"],\n .r-kemksi {\n background-color: @base;\n }\n\n // arrow on account switcher\n .r-cqee49 {\n color: @base;\n }\n\n // top nav bg color\n .r-5zmot {\n background-color: fade(@base, 75%);\n }\n\n // element hover (when on base)\n .r-1hdo0pc,\n .r-pjtv4k {\n background-color: fade(@text, 10%);\n }\n\n // element active (when on base)\n .r-11gmi9o {\n background-color: fade(@text, 20%);\n }\n\n .r-1cuuowz {\n background-color: fade(@text, 3%);\n }\n\n // text\n .r-1nao33i {\n color: @text;\n }\n\n // white text, seems to appear on accent colors\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n\n // cw svg\n &:has(\n path[d=\"M3.693 21.707l-1.414-1.414 2.429-2.429c-2.479-2.421-3.606-5.376-3.658-5.513l-.131-.352.131-.352c.133-.353 3.331-8.648 10.937-8.648 2.062 0 3.989.621 5.737 1.85l2.556-2.557 1.414 1.414L3.693 21.707zm-.622-9.706c.356.797 1.354 2.794 3.051 4.449l2.417-2.418c-.361-.609-.553-1.306-.553-2.032 0-2.206 1.794-4 4-4 .727 0 1.424.192 2.033.554l2.263-2.264C14.953 5.434 13.512 5 11.986 5c-5.416 0-8.258 5.535-8.915 7.001zM11.986 10c-1.103 0-2 .897-2 2 0 .178.023.352.067.519l2.451-2.451c-.167-.044-.341-.067-.519-.067zm10.951 1.647l.131.352-.131.352c-.133.353-3.331 8.648-10.937 8.648-.709 0-1.367-.092-2-.223v-2.047c.624.169 1.288.27 2 .27 5.415 0 8.257-5.533 8.915-7-.252-.562-.829-1.724-1.746-2.941l1.438-1.438c1.53 1.971 2.268 3.862 2.33 4.027z\"]\n ) {\n color: @text;\n }\n }\n\n // borders\n .r-1kqtdi0,\n .r-1roi411 {\n border-color: @surface0;\n }\n\n .r-1igl3o0 {\n border-bottom-color: @surface0;\n }\n\n .r-2sztyj {\n border-top-color: @surface0;\n }\n\n .r-1aihyag {\n border-right-color: @surface0;\n }\n\n .r-1wyyjkm {\n border-left-color: @subtext0; // border when replying to a dm\n }\n\n // is this post relevant to you?\n .r-1ccsd61,\n .r-xzxzvz {\n border-color: @surface2;\n }\n\n .r-gu4em3,\n .r-1bnu78o,\n .r-z32n2g, // search bar\n .r-1m3jxhj {\n background-color: @surface0;\n }\n\n // base color border\n .r-1xc7w19 {\n border-color: @base;\n }\n\n // active border for dms\n .r-1pbtemp {\n border-right-color: @accent-color;\n }\n\n // accent color borders\n .r-vhj8yc {\n border-color: @accent-color;\n }\n\n // magnifying glass in search bar\n .r-1bwzh9t {\n color: @overlay1;\n }\n\n // right side content\n .r-g2wdr4 {\n background-color: @mantle;\n }\n\n .r-14wv3jr {\n border-color: @mantle;\n }\n\n // bg color accent\n .r-l5o3uw {\n background-color: @accent-color;\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n // accent element when hovered\n .r-1vtznih {\n background-color: darken(@accent-color, 10%);\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n .r-1peqgm7 {\n background-color: fade(@accent-color, 10%);\n }\n\n // accent element when active\n .r-yuvema {\n background-color: darken(@accent-color, 15%);\n\n .r-jwli3a {\n color: if(@lookup=latte, #fff, @crust);\n }\n }\n\n .r-r18ze4 {\n background-color: fade(@accent-color, 20%);\n }\n\n // white elements when hovered\n .r-jc7xae {\n background-color: darken(@text, 4%);\n }\n\n // white elements when active\n .r-6wtuen {\n background-color: darken(@text, 8%);\n }\n\n // tooltips\n .r-1pr99xn {\n background-color: @surface1;\n }\n\n // new notifications\n .r-1eltapf {\n background-color: fade(@sapphire, 10%);\n }\n\n // polls\n .r-eok2q2 {\n background-color: fade(@accent-color, 60%);\n }\n\n // box shadow around active poll input box\n .r-9cip40 {\n box-shadow: @accent-color 0 0 0 1px;\n }\n\n // spaces\n .r-1blqq69 {\n border-color: @mauve;\n }\n\n // reactions on dms\n .r-qazpri {\n color: @overlay1;\n }\n\n @keyframes r-1wvy3k1 {\n 0% {\n box-shadow: fade(@mauve, 40%) 0;\n }\n\n 100% {\n box-shadow: fade(@mauve, 0%) 0;\n }\n }\n\n [style=\"background-image: linear-gradient(61.63deg, rgb(45, 66, 255) -15.05%, rgb(156, 99, 250) 104.96%);\"] {\n background-image: linear-gradient(\n 61.63deg,\n @blue -15.05%,\n @mauve 104.96%\n ) !important;\n }\n\n // tweet textbox placeholder\n .draftjs-styles_0 .public-DraftEditorPlaceholder-root {\n color: @overlay0;\n }\n\n // who can reply? bg\n .r-rgqbpe {\n background-color: fade(@blue, 10%);\n }\n\n // circles\n .r-s224ru {\n background-color: @green;\n }\n\n .r-h7o7i8 {\n background-color: fade(@green, 10%);\n }\n\n // live indicator\n .r-4nw3r4,\n .r-1dgebii {\n background-color: @red;\n }\n\n // live border\n .r-b5kvu3 {\n border-color: @red;\n }\n\n // red transparent bg (appears with \"unfollow\" hover)\n .r-qqmkd0 {\n background-color: fade(@red, 10%);\n }\n\n // red bg on hover\n .r-12d83nn {\n background-color: darken(@red, 10%);\n }\n\n // red bg when active\n .r-oybae9 {\n background-color: darken(@red, 15%);\n }\n\n .r-11mg6pl {\n border-color: if(@lookup=latte, #fff, @crust); // white border\n }\n\n // mask over layer\n .r-11z020y {\n background-color: fade(desaturate(darken(@accent-color, 10%), 50%), 12%);\n }\n\n // likes\n [fill=\"rgb(249,22,127)\"],\n [fill=\"rgb(222,45,108)\"],\n g[clip-path=\"url(#__lottie_element_562)\"] path,\n [style=\"color: rgb(249, 24, 128);\"] [viewBox=\"0 0 24 24\"] path {\n fill: @red !important;\n }\n\n // likes when hover\n .r-1krxqcr {\n background-color: fade(@red, 10%);\n }\n\n // likes when active\n .r-uuique {\n background-color: fade(@red, 20%);\n }\n\n // heart svg on notifications page\n .r-vkub15,\n .r-9l7dzd {\n color: @red;\n }\n\n // bell svg on notifications page\n .r-1cvl2hr {\n color: @accent-color;\n }\n\n // retweet svg on notifications page\n .r-o6sn0f {\n color: @green;\n }\n\n // rt when hover\n .r-15azkrj {\n background-color: fade(@green, 10%);\n }\n\n // rt when active\n .r-1x669os {\n background-color: fade(@green, 20%);\n }\n\n // image won't load svg\n [data-testid=\"card.wrapper\"]\n [d=\"M21.04 1.54L17.5 5.09c-.04-.02-.08-.03-.13-.04L14.3 3H9.7l-3 2H5C3.62 5 2.5 6.12 2.5 7.5v11c0 .46.12.88.34 1.25l-1.3 1.29 1.42 1.42 19.5-19.5-1.42-1.42zM13.7 5l2.33 1.56-2 1.99C13.44 8.2 12.74 8 12 8c-2.21 0-4 1.79-4 4 0 .74.2 1.44.55 2.03L4.5 18.09V7.5c0-.28.22-.5.5-.5h2.3l3-2h3.4zM12 10c.18 0 .35.02.52.07l-2.45 2.45c-.05-.17-.07-.34-.07-.52 0-1.1.9-2 2-2zm7 11H7.24l2-2H19c.28 0 .5-.22.5-.5V9h2v9.5c0 1.38-1.12 2.5-2.5 2.5z\"] {\n color: @overlay0;\n }\n\n // cw button\n .r-n94g0g {\n background-color: fade(@text, 30%); // when hovered\n }\n\n .r-z9i421 {\n background-color: fade(@text, 27%); // when active\n }\n\n .r-19130f6 {\n background-color: @crust; // when hovered\n }\n\n .r-l8tqsx {\n background-color: fade(@text, 10%); // when active\n }\n\n // lock svg when you try to write a commu note but can't\n .r-3gvs5h {\n background-color: @overlay1;\n }\n\n // sunglasses commu note\n .r-1fkb3t2 {\n background-color: @surface1;\n }\n\n // media player text\n .r-jwli3a {\n color: @text;\n }\n\n .r-1kwlb9n {\n background-color: fade(@red, 12%);\n }\n\n // hard-coded shit\n // ugly-ass twitter blue/premium bg. why.\n [style*=\"https://abs.twimg.com/responsive-web/client-web/background-premiumplus-web\"]\n {\n background-image: none !important;\n background-color: @surface0;\n }\n\n [stroke=\"#2F3336\" i] {\n stroke: @surface2 !important;\n }\n\n [stroke=\"#1D9BF0\" i],\n [style*=\"stroke: rgb(29, 155, 240)\"] {\n stroke: @accent-color !important;\n }\n\n [stroke=\"#FFD400\" i] {\n stroke: @yellow !important;\n }\n\n [fill=\"#829AAB\" i] {\n fill: @overlay2 !important;\n }\n\n // \"we received your report\" svg\n [fill=\"#1DA1F2\" i] {\n fill: if(@lookup=latte, darken(@sky, 15%), darken(@sky, 30%)) !important;\n }\n\n [fill=\"#78C6EE\" i] {\n fill: @sky !important;\n }\n\n // yellow verified badge\n [stop-color=\"#f4e72a\" i],\n [stop-color=\"#cd8105\" i],\n [stop-color=\"#cb7b00\" i],\n [stop-color=\"#f4ec26\" i],\n [stop-color=\"#f9e87f\" i],\n [stop-color=\"#e2b719\" i] {\n stop-color: @yellow !important;\n }\n\n [fill=\"#d18800\" i] {\n fill: @yellow !important;\n }\n\n // [fill=\"#333333\" i] {\n // fill: @crust !important;\n //\n // ~ [fill=\"white\"] {\n // fill: @text !important;\n // }\n // }\n\n [style*=\"border-color: rgb(83, 100, 113)\"] {\n border-color: @surface1 !important;\n }\n\n [style*=\"border-color: rgb(51, 54, 57)\"] {\n border-color: @surface0 !important;\n }\n\n [style*=\"border-color: rgb(103, 7, 15)\"] {\n border-color: fadeout(@red, 50%) !important;\n }\n\n [style*=\"border-color: rgb(29, 155, 240)\"] {\n border-color: @accent-color !important;\n }\n\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n [style*=\"color: rgb(239, 243, 244)\"]:not(\n [style*=\"background-color: rgb(239, 243, 244)\"]\n ),\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ) {\n color: @text !important;\n }\n\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n )\n input::placeholder {\n color: @subtext1 !important;\n }\n\n // faded text\n [style*=\"color: rgb(113, 118, 123)\"]:not(\n [style*=\"background-color: rgb(113, 118, 123)\"]\n ),\n [style*=\"color: rgb(182, 185, 188)\"]:not(\n [style*=\"background-color: rgb(182, 185, 188)\"]\n ) {\n color: @overlay1 !important;\n }\n\n // retweets color\n [style*=\"color: rgb(0, 186, 124)\"]:not(\n [style*=\"background-color: rgb(0, 186, 124)\"]\n ) {\n color: @green !important;\n }\n\n // likes/unfollow color\n [style*=\"color: rgb(249, 24, 128)\"]:not(\n [style*=\"background-color: rgb(249, 24, 128)\"]\n ),\n [style*=\"color: rgb(244, 33, 46)\"]:not(\n [style*=\"background-color: rgb(244, 33, 46)\"]\n ) {\n color: @red !important;\n }\n\n [style*=\"color: rgb(250, 68, 152)\"]:not(\n [style*=\"background-color: rgb(250, 68, 152)\"]\n ) {\n color: @pink !important;\n }\n\n [style*=\"color: rgb(255, 212, 0)\"]:not(\n [style*=\"background-color: rgb(255, 212, 0)\"]\n ) {\n color: @yellow !important;\n }\n\n [style*=\"color: rgb(120, 86, 255)\"]:not(\n [style*=\"background-color: rgb(120, 86, 255)\"]\n ) {\n color: @mauve !important;\n }\n\n [style*=\"color: rgb(255, 122, 0)\"]:not(\n [style*=\"background-color: rgb(255, 122, 0)\"]\n ) {\n color: @peach !important;\n }\n\n // accent color (blue)\n [style*=\"color: rgb(29, 155, 240)\"]:not(\n [style*=\"background-color: rgb(29, 155, 240)\"]\n ) {\n color: @accent-color !important;\n }\n\n // background colors\n [style*=\"background-color: rgb(142, 205, 248)\"] {\n background-color: lighten(@accent-color, 10%) !important;\n }\n\n [style*=\"background-color: rgb(2, 17, 61)\"] {\n background-color: fade(@accent-color, 15%) !important;\n }\n\n [style*=\"background-color: rgba(255, 255, 255, 0.25)\"] {\n background-color: fade(@text, 25%) !important;\n }\n\n [style*=\"background-color: rgb(147, 147, 147)\"] {\n background-color: @overlay0 !important;\n\n // for toggle circle\n + [style*=\"background-color: rgb(250, 250, 250)\"]\n when\n not\n (@lookup = latte) {\n background-color: @text !important;\n }\n }\n\n [style*=\"background-color: rgb(29, 155, 240)\"] {\n background-color: @accent-color !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(239, 243, 244)\"] {\n background-color: @text !important;\n\n [style*=\"color: rgb(15, 20, 25)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(244, 33, 46)\"] {\n background-color: @red !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [style*=\"background-color: rgb(0, 0, 0)\"],\n [style*=\"background-color: #000\"] {\n background-color: @base !important;\n }\n\n [style*=\"background-color: rgba(15, 20, 25, 0.75)\"] {\n background-color: fade(@crust, 75%) !important;\n\n [style*=\"color: rgb(255, 255, 255)\"] svg {\n color: @text !important;\n }\n }\n\n // whatever\n .r-l5o3uw,\n .r-1vtznih,\n .r-4nw3r4,\n .r-12d83nn,\n .r-oybae9,\n .r-yuvema,\n .r-3gvs5h,\n [style=\"background-image: linear-gradient(61.63deg, rgb(45, 66, 255) -15.05%, rgb(156, 99, 250) 104.96%);\"] {\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n &[style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n [style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n &[style*=\"color: rgb(231, 233, 234)\"]:not(\n [style*=\"background-color: rgb(231, 233, 234)\"]\n ),\n [color=\"white\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n [data-testid=\"videoComponent\"]:not(.r-4nw3r4),\n .r-loe9s5,\n .r-drfeu3:has(\n [style=\"background-color: rgba(255, 255, 255, 0.25); border-color: rgba(0, 0, 0, 0); backdrop-filter: blur(4px);\"]\n ) {\n [style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n &[style*=\"color: rgb(255, 255, 255)\"]:not(\n [style*=\"background-color: rgb(255, 255, 255)\"]\n ),\n .r-jwli3a {\n color: #fff !important;\n }\n }\n\n // dms have to be here bc of the above\n .r-eff69c {\n background-color: darken(@accent-color, 5%);\n\n [style*=\"color: rgb(255, 255, 255)\"] {\n color: @crust !important;\n }\n }\n\n // follow button\n [data-testid$=\"-follow\"] {\n [style*=\"color: rgb(15, 20, 25)\"] {\n color: if(@lookup=latte, #fff, @crust) !important;\n }\n }\n\n // sports stuff on explore page\n // a[href^=\"/i/events\"] > div > div > div[style^=\"background-color\"] > div[style*=\"color: rgb(255, 255, 255)\"] span {\n // color: #fff !important;\n // }\n\n // options\n & when (@colorizeLogo = 1) {\n path[d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"] {\n fill: @accent-color !important;\n }\n }\n\n a[aria-label^=\"Translated from\"][aria-label$=\"by Google\"] svg path {\n fill: @text !important;\n }\n }\n}\n\n@-moz-document domain(\"api.twitter.com\"),\ndomain(\"api.x.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n html {\n background: @mantle;\n }\n\n #header {\n color: @subtext0;\n background: @base;\n border-bottom-color: @surface1;\n\n .logo a {\n border-bottom-color: transparent;\n }\n\n #session {\n a {\n background: transparent;\n color: @subtext0;\n }\n\n h2 img {\n border-color: @surface1;\n }\n }\n }\n\n .footer {\n background: @mantle;\n border-top-color: @surface1;\n }\n\n .auth h2 {\n color: @subtext1;\n }\n\n .oauth #bd {\n border-color: @surface1;\n }\n\n .app-info h3 img {\n border-color: @base;\n }\n\n .permissions.allow strong {\n color: @green;\n }\n\n .button {\n background: @overlay0;\n color: @text;\n border-color: @surface1;\n\n &:hover {\n color: @text;\n border-color: @surface1;\n background: darken(@surface2, 10%);\n }\n }\n\n .button.selected,\n .follow-button .unfollow .button {\n background-color: @accent-color;\n color: if(@lookup=latte, #fff, @crust);\n border-color: darken(@accent-color, 10%);\n\n &:hover {\n background-color: darken(@accent-color, 10%);\n }\n\n .app-info,\n #bd h3 {\n color: @subtext0;\n }\n\n #ft {\n color: @overlay0;\n }\n }\n }\n}\n\n@-moz-document domain(\"twitter.com\"),\ndomain(\"x.com\") {\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n #session a,\n #session input,\n #session button {\n background: @surface0;\n color: @subtext0;\n }\n\n #session .user-menu {\n a:focus,\n a:hover,\n button:focus,\n button:hover,\n input:focus,\n input:hover {\n color: if(@lookup=latte, #fff, @crust);\n background-color: @accent-color;\n }\n }\n\n .notice,\n .notice p,\n h2 {\n color: @subtext1;\n }\n\n .notice.error {\n background: fade(@red, 20%);\n border-color: fade(@red, 25%);\n }\n\n // report page? why isn't this themed\n .ResponsiveLayout--Night .PageContainer {\n background-color: @base;\n }\n\n .list-explanation {\n color: @subtext0;\n }\n\n .ResponsiveLayout--Night .list-btn {\n &:first-of-type {\n border-top-color: @mantle;\n }\n\n &:hover {\n background-color: @mantle;\n }\n }\n\n .submit-btn {\n background-color: @accent-color;\n color: if(@lookup=latte, #fff, @crust);\n border-color: darken(@accent-color, 10%);\n }\n\n .submit-btn:hover,\n .redirect-btn:hover {\n background-color: darken(@accent-color, 10%);\n }\n\n .block-btn {\n color: @maroon;\n border-color: @maroon;\n }\n\n .mute-btn,\n .unfollow-btn,\n .email-report-btn {\n color: @accent-color;\n border-color: @accent-color;\n }\n\n .list-btn {\n border-color: @surface1;\n\n &:first-of-type {\n border-top-color: @surface1;\n }\n\n &:hover {\n background-color: @surface0;\n }\n }\n\n // authorize page\n .js #session .user-menu {\n background-color: @surface0;\n }\n\n .dropdown-caret .caret-outer,\n .dropdown-caret .caret-inner {\n border-bottom-color: @surface0;\n }\n }\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Twitter Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/twitter",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/twitter",
- "version": "1.0.5",
+ "version": "1.0.7",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitter",
"description": "Soothing pastel theme for Twitter",
@@ -3528,10 +3532,188 @@
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/twitter",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.css",
"name": "Twitter Catppuccin",
- "originalDigest": "5ee678dd6cea29707f1c87d897f70e7d00c33f12",
+ "originalDigest": "c7afc1090d28a49801a4b6c3793f63e61e42e4d1",
"_id": "1e139126-7c8a-4c1b-9d13-6a2e55fa4423",
- "_rev": 1715537605021,
+ "_rev": 1716187649552,
"id": 20,
- "etag": "W/\"1c1adad679bd32592d3a2b42bb57f477140f0a08a51b3a34b65b87969e9057ad\""
+ "etag": "W/\"61dc75e551c9590087fced743a12f98688f7b25880ea4820aef58abb2e035a85\"",
+ "updateDate": 1716187649507
+ },
+ {
+ "enabled": true,
+ "installDate": 1716842151906,
+ "sections": [
+ {
+ "code": ""
+ }
+ ],
+ "sourceCode": "/* ==UserStyle==\n@name Stack Overflow Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/stack-overflow\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/stack-overflow\n@version 0.1.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astack-overflow\n@description Soothing pastel theme for Stack Overflow\n@author Catppuccin\n@license MIT\n\n@preprocessor less\n@var select lightFlavor \"Light Flavor\" [\"latte:Latte*\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha\"]\n@var select darkFlavor \"Dark Flavor\" [\"latte:Latte\", \"frappe:Frappé\", \"macchiato:Macchiato\", \"mocha:Mocha*\"]\n@var select accentColor \"Accent\" [\"rosewater:Rosewater\", \"flamingo:Flamingo\", \"pink:Pink\", \"mauve:Mauve*\", \"red:Red\", \"maroon:Maroon\", \"peach:Peach\", \"yellow:Yellow\", \"green:Green\", \"teal:Teal\", \"blue:Blue\", \"sapphire:Sapphire\", \"sky:Sky\", \"lavender:Lavender\", \"subtext0:Gray\"]\n==/UserStyle== */\n\n@-moz-document domain('stackoverflow.com'), domain('stackexchange.com'), domain('serverfault.com'),\ndomain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), domain('stackapps.com') {\n @import url(\"https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css\");\n code.hljs {\n background: none !important;\n }\n\n body:not(.theme-highcontrast, .theme-dark).unified-theme {\n &,\n .themed {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n body:not(.theme-highcontrast).unified-theme.theme-dark {\n &,\n .themed {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n @media (prefers-color-scheme: light) {\n body:not(.theme-highcontrast).unified-theme.theme-system {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n body:not(.theme-highcontrast).unified-theme.theme-system {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n\n #catppuccin(@lookup, @accent) {\n @rosewater: @catppuccin[@@lookup][@rosewater];\n @flamingo: @catppuccin[@@lookup][@flamingo];\n @pink: @catppuccin[@@lookup][@pink];\n @mauve: @catppuccin[@@lookup][@mauve];\n @red: @catppuccin[@@lookup][@red];\n @maroon: @catppuccin[@@lookup][@maroon];\n @peach: @catppuccin[@@lookup][@peach];\n @yellow: @catppuccin[@@lookup][@yellow];\n @green: @catppuccin[@@lookup][@green];\n @teal: @catppuccin[@@lookup][@teal];\n @sky: @catppuccin[@@lookup][@sky];\n @sapphire: @catppuccin[@@lookup][@sapphire];\n @blue: @catppuccin[@@lookup][@blue];\n @lavender: @catppuccin[@@lookup][@lavender];\n @text: @catppuccin[@@lookup][@text];\n @subtext1: @catppuccin[@@lookup][@subtext1];\n @subtext0: @catppuccin[@@lookup][@subtext0];\n @overlay2: @catppuccin[@@lookup][@overlay2];\n @overlay1: @catppuccin[@@lookup][@overlay1];\n @overlay0: @catppuccin[@@lookup][@overlay0];\n @surface2: @catppuccin[@@lookup][@surface2];\n @surface1: @catppuccin[@@lookup][@surface1];\n @surface0: @catppuccin[@@lookup][@surface0];\n @base: @catppuccin[@@lookup][@base];\n @mantle: @catppuccin[@@lookup][@mantle];\n @crust: @catppuccin[@@lookup][@crust];\n @accent-color: @catppuccin[@@lookup][@@accent];\n\n background-image: none;\n\n --ctp-rosewater: #rgbify(@rosewater) [];\n --ctp-flamingo: #rgbify(@flamingo) [];\n --ctp-pink: #rgbify(@pink) [];\n --ctp-mauve: #rgbify(@mauve) [];\n --ctp-red: #rgbify(@red) [];\n --ctp-maroon: #rgbify(@maroon) [];\n --ctp-peach: #rgbify(@peach) [];\n --ctp-yellow: #rgbify(@yellow) [];\n --ctp-green: #rgbify(@green) [];\n --ctp-teal: #rgbify(@teal) [];\n --ctp-sky: #rgbify(@sky) [];\n --ctp-sapphire: #rgbify(@sapphire) [];\n --ctp-blue: #rgbify(@blue) [];\n --ctp-lavender: #rgbify(@lavender) [];\n --ctp-text: #rgbify(@text) [];\n --ctp-subtext1: #rgbify(@subtext1) [];\n --ctp-subtext0: #rgbify(@subtext0) [];\n --ctp-overlay2: #rgbify(@overlay2) [];\n --ctp-overlay1: #rgbify(@overlay1) [];\n --ctp-overlay0: #rgbify(@overlay0) [];\n --ctp-surface2: #rgbify(@surface2) [];\n --ctp-surface1: #rgbify(@surface1) [];\n --ctp-surface0: #rgbify(@surface0) [];\n --ctp-base: #rgbify(@base) [];\n --ctp-mantle: #rgbify(@mantle) [];\n --ctp-crust: #rgbify(@crust) [];\n\n color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &,\n * {\n --theme-background-color: @mantle;\n --theme-content-background-color: @base;\n --theme-content-border-color: @surface0;\n --theme-topbar-background-color: @mantle;\n --theme-topbar-search-background: @mantle;\n --theme-topbar-search-border: @surface2;\n --theme-topbar-search-placeholder: @subtext0;\n --theme-topbar-item-color: @text;\n --theme-topbar-item-color-hover: @text;\n --theme-topbar-item-background-hover: @surface0;\n --theme-button-primary-background-color: @accent-color;\n --theme-button-primary-hover-background-color: darken(@accent-color, 5%);\n --theme-button-primary-active-background-color: @text;\n --theme-link-color: @accent-color;\n --theme-link-color-hover: darken(@accent-color, 5%);\n --theme-footer-title-color: @text;\n --theme-footer-text-color: @subtext0;\n --theme-footer-link-color: @subtext0;\n --theme-footer-link-color-hover: @subtext1;\n --theme-footer-background-color: @mantle;\n --theme-header-background-color: @mantle;\n --theme-tag-background-color: @accent-color;\n --theme-tag-border-color: @accent-color;\n --theme-tag-color: @mantle;\n --theme-tag-hover-background-color: darken(@accent-color, 5%);\n --theme-tag-hover-border-color: darken(@accent-color, 5%);\n --theme-tag-hover-color: @mantle;\n --theme-post-title-color: @accent-color;\n --theme-post-title-color-hover: darken(@accent-color, 5%);\n\n --highlight-bg: @mantle;\n\n --theme-primary: @accent-color;\n --theme-primary-100: fade(@accent-color, 20%);\n --theme-primary-200: fade(@accent-color, 30%);\n --theme-primary-500: fade(@accent-color, 90%);\n --theme-primary-600: @accent-color;\n\n --translucent-secondary: fade(@accent-color, 10%);\n --theme-secondary-100: fade(@accent-color, 20%);\n --theme-secondary-200: fade(@accent-color, 30%);\n --theme-secondary-300: fade(@accent-color, 40%);\n --theme-secondary-400: fade(@accent-color, 50%);\n --theme-secondary-500: fade(@accent-color, 60%);\n --theme-secondary-600: fade(@accent-color, 70%);\n\n --white: @mantle;\n --black: @text;\n --black-100: @base;\n --black-150: @surface0;\n --black-200: @surface1;\n --black-225: @surface1;\n --black-250: @surface2;\n --black-300: @overlay0;\n --black-350: @overlay2;\n --black-400: @subtext0;\n --black-500: @subtext1;\n --black-600: @text;\n\n --purple-100: fade(@mauve, 30%);\n --purple-200: fade(@mauve, 40%);\n --purple-400: fade(@mauve, 60%);\n\n --green-100: @green;\n --green-400: @green;\n --green-500: @green;\n\n --blue-200: fade(@blue, 30%);\n --blue-300: fade(@blue, 40%);\n --blue-400: @sky;\n --blue-500: @blue;\n\n --orange-400: fade(@peach, 80%);\n --orange-500: fade(@peach, 90%);\n --orange-600: @peach;\n\n --bronze-100: fade(@rosewater, 20%);\n --bronze-200: fade(@rosewater, 30%);\n --bronze-300: fade(@rosewater, 40%);\n --bronze-400: fade(@rosewater, 50%);\n\n --yellow-100: fade(@yellow, 20%);\n --yellow-200: fade(@yellow, 30%);\n --yellow-400: fade(@yellow, 70%);\n --yellow-500: fade(@yellow, 90%);\n\n --red-200: fade(@red, 40%);\n --red-400: fade(@red, 70%);\n --red-500: fade(@red, 80%);\n\n --scrollbar: @surface1;\n }\n\n .wmd-button > span {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .s-topbar .s-topbar--logo .-img,\n .envelope-on,\n .envelope-off,\n .vote-up-off,\n .vote-up-on,\n .vote-down-off,\n .vote-down-on,\n .feed-icon,\n .vote-accepted-off,\n .vote-accepted-on,\n .vote-accepted-bounty,\n .badge-earned-check,\n .delete-tag,\n .grippie,\n .expander-arrow-hide,\n .expander-arrow-show,\n .expander-arrow-small-hide,\n .expander-arrow-small-show,\n .anonymous-gravatar,\n .badge1,\n .badge2,\n .badge3 {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .s-avatar {\n &.subcommunity-topic-mobile-dev.s-avatar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.subcommunity-topic-r-language {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n\n [fill=\"#BCBBBB\"] {\n fill: @overlay2 !important;\n }\n [fill=\"#F48024\"] {\n fill: @peach !important;\n }\n\n .s-topbar .s-topbar--logo .-img {\n filter: none;\n }\n\n .s-sidebarwidget {\n background-color: @base;\n border-color: @surface0;\n\n .s-sidebarwidget--header {\n background-color: @surface0;\n border-color: @surface1;\n }\n &::after,\n .s-sidebarwidget--content,\n .s-sidebarwidget--header {\n border-color: @surface1;\n }\n }\n\n .s-prose kbd {\n border-top-color: transparent;\n box-shadow:\n 0 1px 1px @crust,\n inset 0 1px 0 0 @overlay2;\n }\n\n .s-pagination .s-pagination--item {\n border-color: @surface2;\n }\n\n .s-badge {\n color: @crust;\n background-color: @mauve;\n }\n\n .s-notice {\n &,\n .s-notice--btn {\n color: @mantle !important;\n }\n }\n\n .badge,\n .badge-tag {\n background-color: @surface0;\n color: @text;\n }\n\n #onetrust-consent-sdk {\n #onetrust-banner-sdk {\n background-color: @mantle;\n\n &:focus {\n outline-color: @surface1;\n }\n\n #onetrust-accept-btn-handler,\n #onetrust-reject-all-handler {\n background-color: @accent-color;\n color: @crust;\n }\n\n #onetrust-button-group button#onetrust-pc-btn-handler {\n background-color: @crust !important;\n border-color: @accent-color !important;\n color: @accent-color !important;\n }\n\n #onetrust-policy-title,\n #onetrust-policy-text,\n .ot-b-addl-desc,\n .ot-dpd-desc,\n .ot-dpd-title,\n #onetrust-policy-text :not(.onetrust-vendors-list-handler),\n .ot-dpd-desc :not(.onetrust-vendors-list-handler),\n #banner-options *,\n .ot-cat-header,\n .ot-optout-signal,\n a {\n color: @text !important;\n }\n }\n\n /* Manage cookies popup */\n #onetrust-pc-sdk {\n background-color: @base;\n\n h3,\n h4,\n h5,\n h6,\n p,\n #ot-ven-lst .ot-ven-opts p,\n #ot-pc-desc,\n #ot-pc-title,\n .ot-li-title,\n .ot-sel-all-hdr span,\n #ot-host-lst .ot-host-info,\n #ot-fltr-modal #modal-header,\n .ot-checkbox label span,\n #ot-pc-lst #ot-sel-blk p,\n #ot-pc-lst #ot-lst-title h3,\n #ot-pc-lst .back-btn-handler p,\n #ot-pc-lst .ot-ven-name,\n #ot-pc-lst #ot-ven-lst .consent-category,\n .ot-leg-btn-container .ot-inactive-leg-btn,\n .ot-label-status,\n .ot-chkbox label span,\n #clear-filters-handler,\n .ot-optout-signal {\n color: @text;\n }\n\n .ot-pc-header {\n background-color: @mantle !important;\n border-bottom-color: @surface1;\n }\n\n .ot-accordion-layout.ot-cat-item {\n border-color: @surface1;\n }\n\n .ot-pc-footer {\n border-top-color: @surface2 !important;\n }\n\n button:not(\n #clear-filters-handler,\n .ot-close-icon,\n #filter-btn-handler,\n .ot-remove-objection-handler,\n .ot-obj-leg-btn-handler,\n [aria-expanded],\n .ot-link-btn\n ),\n .ot-leg-btn-container .ot-active-leg-btn {\n background-color: @accent-color !important;\n border-color: @accent-color;\n color: @mantle;\n }\n }\n }\n\n .disabled-link {\n color: @overlay2;\n }\n\n /* Stack Exchange logo */\n [fill=\"#FEFEFE\"] {\n fill: @text !important;\n }\n [fill=\"#2F96E8\"],\n [fill=\"#2D6DB5\"] {\n fill: @blue !important;\n }\n [fill=\"#8FD8F7\"] {\n fill: lighten(@sky, 10%);\n }\n [fill=\"#46A2D9\"] {\n fill: lighten(@blue, 5%);\n }\n [fill=\"#155397\"] {\n fill: darken(@blue, 10%) !important;\n }\n\n /* Other Stack Exchange site logos */\n [alt=\"Server Fault\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n [alt=\"Super User\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n [alt=\"MathOverflow\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n [alt=\"Ask Ubuntu\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n [alt=\"Stack Apps\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n}\n\n#rgbify(@color) {\n @rgb-raw: red(@color), green(@color), blue(@color);\n}\n\n/* prettier-ignore */\n@catppuccin: {\n @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };\n}\n\n// vim:ft=less\n",
+ "usercssData": {
+ "name": "Stack Overflow Catppuccin",
+ "namespace": "github.com/catppuccin/userstyles/styles/stack-overflow",
+ "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/stack-overflow",
+ "version": "0.1.1",
+ "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.css",
+ "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astack-overflow",
+ "description": "Soothing pastel theme for Stack Overflow",
+ "author": "Catppuccin",
+ "license": "MIT",
+ "preprocessor": "less",
+ "vars": {
+ "lightFlavor": {
+ "type": "select",
+ "label": "Light Flavor",
+ "name": "lightFlavor",
+ "value": null,
+ "default": "latte",
+ "options": [
+ {
+ "name": "latte",
+ "label": "Latte",
+ "value": "latte"
+ },
+ {
+ "name": "frappe",
+ "label": "Frappé",
+ "value": "frappe"
+ },
+ {
+ "name": "macchiato",
+ "label": "Macchiato",
+ "value": "macchiato"
+ },
+ {
+ "name": "mocha",
+ "label": "Mocha",
+ "value": "mocha"
+ }
+ ]
+ },
+ "darkFlavor": {
+ "type": "select",
+ "label": "Dark Flavor",
+ "name": "darkFlavor",
+ "value": "macchiato",
+ "default": "mocha",
+ "options": [
+ {
+ "name": "latte",
+ "label": "Latte",
+ "value": "latte"
+ },
+ {
+ "name": "frappe",
+ "label": "Frappé",
+ "value": "frappe"
+ },
+ {
+ "name": "macchiato",
+ "label": "Macchiato",
+ "value": "macchiato"
+ },
+ {
+ "name": "mocha",
+ "label": "Mocha",
+ "value": "mocha"
+ }
+ ]
+ },
+ "accentColor": {
+ "type": "select",
+ "label": "Accent",
+ "name": "accentColor",
+ "value": "teal",
+ "default": "mauve",
+ "options": [
+ {
+ "name": "rosewater",
+ "label": "Rosewater",
+ "value": "rosewater"
+ },
+ {
+ "name": "flamingo",
+ "label": "Flamingo",
+ "value": "flamingo"
+ },
+ {
+ "name": "pink",
+ "label": "Pink",
+ "value": "pink"
+ },
+ {
+ "name": "mauve",
+ "label": "Mauve",
+ "value": "mauve"
+ },
+ {
+ "name": "red",
+ "label": "Red",
+ "value": "red"
+ },
+ {
+ "name": "maroon",
+ "label": "Maroon",
+ "value": "maroon"
+ },
+ {
+ "name": "peach",
+ "label": "Peach",
+ "value": "peach"
+ },
+ {
+ "name": "yellow",
+ "label": "Yellow",
+ "value": "yellow"
+ },
+ {
+ "name": "green",
+ "label": "Green",
+ "value": "green"
+ },
+ {
+ "name": "teal",
+ "label": "Teal",
+ "value": "teal"
+ },
+ {
+ "name": "blue",
+ "label": "Blue",
+ "value": "blue"
+ },
+ {
+ "name": "sapphire",
+ "label": "Sapphire",
+ "value": "sapphire"
+ },
+ {
+ "name": "sky",
+ "label": "Sky",
+ "value": "sky"
+ },
+ {
+ "name": "lavender",
+ "label": "Lavender",
+ "value": "lavender"
+ },
+ {
+ "name": "subtext0",
+ "label": "Gray",
+ "value": "subtext0"
+ }
+ ]
+ }
+ }
+ },
+ "author": "Catppuccin",
+ "description": "Soothing pastel theme for Stack Overflow",
+ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/stack-overflow",
+ "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.css",
+ "name": "Stack Overflow Catppuccin",
+ "originalDigest": "b5bcc09ebbb7cadd8567a50e77a757dd6f2e304d",
+ "_id": "1962007f-3241-4a9e-89e0-dd1644e6bfaf",
+ "_rev": 1717935617278,
+ "id": 21,
+ "etag": "W/\"b4090d7fa816030e140e536303d84c75fd67d837d694cac428651bf507befc1c\"",
+ "updateDate": 1717935617159
}
]
\ No newline at end of file
diff --git a/nixos/info-fetchers.nix b/nixos/info-fetchers.nix
index bb1f2ad..b38e8df 100644
--- a/nixos/info-fetchers.nix
+++ b/nixos/info-fetchers.nix
@@ -21,6 +21,7 @@
# vdpauinfo
# libva-utils
# nvtop
+ gpu-viewer
dig
speedtest-rs
];
diff --git a/nixos/opengl.nix b/nixos/opengl.nix
index 69130a3..1e6c01d 100644
--- a/nixos/opengl.nix
+++ b/nixos/opengl.nix
@@ -7,10 +7,9 @@
};
# Enable OpenGL
- hardware.opengl = {
+ hardware.graphics = {
enable = true;
- driSupport = true;
- driSupport32Bit = true;
+ enable32Bit = true;
extraPackages = with pkgs; [
intel-compute-runtime
intel-media-driver # LIBVA_DRIVER_NAME=iHD
diff --git a/nixos/programming-languages.nix b/nixos/programming-languages.nix
index 9191cb3..4726752 100644
--- a/nixos/programming-languages.nix
+++ b/nixos/programming-languages.nix
@@ -5,6 +5,7 @@
go
(python312Full.withPackages(ps: with ps; [ pygobject3 gobject-introspection pyqt6-sip]))
nodePackages_latest.nodejs
+ nodePackages_latest.pnpm
bun
lua
zig
diff --git a/nixos/services.nix b/nixos/services.nix
index fb57ac8..2685b44 100644
--- a/nixos/services.nix
+++ b/nixos/services.nix
@@ -23,6 +23,7 @@
services.tumbler.enable = true;
services.fwupd.enable = true;
services.auto-cpufreq.enable = true;
+ # services.gnome.core-shell.enable = true;
# services.udev.packages = with pkgs; [ gnome.gnome-settings-daemon ];
environment.systemPackages = with pkgs; [
diff --git a/nixos/theme.nix b/nixos/theme.nix
index 475c782..338aea6 100644
--- a/nixos/theme.nix
+++ b/nixos/theme.nix
@@ -2,7 +2,7 @@
{
# Enable Theme
- environment.variables.GTK_THEME = "Catppuccin-Macchiato-Standard-Teal-Dark";
+ environment.variables.GTK_THEME = "catppuccin-macchiato-teal-standard+default";
environment.variables.XCURSOR_THEME = "Catppuccin-Macchiato-Teal";
environment.variables.XCURSOR_SIZE = "24";
environment.variables.HYPRCURSOR_THEME = "Catppuccin-Macchiato-Teal";