[
{
"settings": {
"openEditInWindow": false,
"openEditInWindow.popup": false,
"windowPosition": {},
"show-badge": true,
"disableAll": false,
"exposeIframes": false,
"exposeStyleName": false,
"newStyleAsUsercss": true,
"styleViaASS": false,
"styleViaXhr": false,
"patchCsp": true,
"urlInstaller": true,
"config.autosave": true,
"schemeSwitcher.enabled": "system",
"schemeSwitcher.nightStart": "18:00",
"schemeSwitcher.nightEnd": "06:00",
"popup.enabledFirst": true,
"popup.stylesFirst": true,
"popup.autoResort": false,
"popup.borders": false,
"popup.findSort": "u",
"manage.onlyEnabled": false,
"manage.onlyLocal": false,
"manage.onlyUsercss": false,
"manage.onlyEnabled.invert": false,
"manage.onlyLocal.invert": false,
"manage.onlyUsercss.invert": false,
"manage.actions.expanded": true,
"manage.backup.expanded": true,
"manage.filters.expanded": true,
"manage.minColumnWidth": 750,
"manage.newUI": true,
"manage.newUI.favicons": false,
"manage.newUI.faviconsGray": true,
"manage.newUI.targets": 3,
"manage.newUI.sort": "title,asc",
"manage.searchMode": "meta",
"editor.options": {},
"editor.toc.expanded": true,
"editor.options.expanded": true,
"editor.lint.expanded": true,
"editor.publish.expanded": true,
"editor.lineWrapping": true,
"editor.smartIndent": true,
"editor.indentWithTabs": false,
"editor.tabSize": 4,
"editor.keyMap": "default",
"editor.theme": "default",
"editor.beautify": {
"selector_separator_newline": true,
"newline_before_open_brace": false,
"newline_after_open_brace": true,
"newline_between_properties": true,
"newline_before_close_brace": true,
"newline_between_rules": false,
"preserve_newlines": true,
"end_with_newline": false,
"indent_conditional": true,
"indent_mozdoc": true,
"space_around_combinator": true,
"space_around_cmp": false
},
"editor.beautify.hotkey": "",
"editor.lintDelay": 300,
"editor.linter": "csslint",
"editor.lintReportDelay": 500,
"editor.matchHighlight": "token",
"editor.autoCloseBrackets": true,
"editor.autocompleteOnTyping": false,
"editor.contextDelete": false,
"editor.selectByTokens": true,
"editor.arrowKeysTraverse": true,
"editor.appliesToLineWidget": true,
"editor.autosaveDraft": 10,
"editor.livePreview": true,
"editor.livePreview.delay": 0.2,
"editor.targetsFirst": true,
"editor.colorpicker": true,
"editor.colorpicker.hexUppercase": false,
"editor.colorpicker.hotkey": "",
"editor.colorpicker.color": "",
"editor.colorpicker.maxHeight": 300,
"hotkey._execute_browser_action": "",
"hotkey.openManage": "",
"hotkey.styleDisableAll": "",
"sync.enabled": "none",
"iconset": -1,
"badgeDisabled": "#8B0000",
"badgeNormal": "#006666",
"headerWidth.edit": 280,
"headerWidth.install": 280,
"headerWidth.manage": 280,
"popup.search.globals": false,
"popupWidth": 246,
"popupWidthMax": 280,
"updateInterval": 24,
"updateOnlyEnabled": false
},
"order": {
"main": [],
"prio": []
}
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/nixos-search/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/nixos-search",
"installDate": 1698242787277,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name NixOS Search Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/nixos-search\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos-search\n@version 0.4.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos-search/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos-search\n@description Soothing pastel theme for NixOS Search\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(\"search.nixos.org\") {\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 --background-color: @base;\n --badge-background: @accent-color;\n --button-active-background: @surface1;\n --button-active-hover-background: @surface2;\n --button-background: @surface0;\n --button-hover-background: @surface2;\n --color-active-hover-tab: @surface1;\n --color-active-tab: @surface0;\n --color-hover-tab: @surface1;\n --headerbar-background-color: @mantle;\n --hover-background: @surface0;\n --link-color: @accent-color;\n --info-label-background: @accent-color;\n --dark-blue: @accent-color;\n --light-blue: @accent-color; // used by focus outline\n --line-color: @surface0;\n --search-result-short-details-color: @subtext1;\n --search-result-divider-line-color: @surface0;\n --search-result-title-color: @accent-color;\n --search-sidebar-link-color: @text;\n --search-sidebar-selected-link-background: @accent-color;\n --search-sidebar-selected-link-color: @crust;\n --terminal-background: @surface0;\n --terminal-color: @red;\n --text-color: @text;\n --text-color-light: @text;\n --text-color-warning: @yellow;\n\n // hardcoded to #fff\n .label,\n .badge {\n color: @crust;\n }\n\n // hardcoded to #005580\n a:hover,\n a:focus {\n 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": "NixOS Search Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/nixos-search",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/nixos-search",
"version": "0.4.1",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/nixos-search/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos-search",
"description": "Soothing pastel theme for NixOS Search",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 NixOS Search",
"name": "NixOS Search Catppuccin",
"updateDate": 1715527454630,
"_id": "c79c1637-d3ba-4bdb-b460-bb9367f36c9c",
"_rev": 1715535527290,
"id": 1,
"originalDigest": "0ffb84c79403190c93980bc4f7f6f25d05cbc6cb",
"etag": "W/\"e18e03824d3d5087eb1882da81c7b240b77a1cef6e13916fb47e749b2f1ac30e\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/brave-search",
"installDate": 1698242913743,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Brave Search Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/brave-search\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/brave-search\n@version 2.0.2\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abrave-search\n@description Soothing pastel theme for Brave Search\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(\"search.brave.com\") {\n :root.light {\n #catppuccin(@lightFlavor, @accentColor);\n }\n :root.dark {\n #catppuccin(@darkFlavor, @accentColor);\n }\n :root:not(.light, .dark) {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n @media (prefers-color-scheme: dark) {\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-page-background: @base;\n --color-container-background: @crust;\n --color-container-highlight: @mantle;\n --color-serp-header-background: @crust;\n --color-text-interactive: @accent-color;\n --color-divider-subtle: @surface0;\n --color-divider-interactive: @accent-color;\n --color-text-primary: @text;\n --color-serp-bar-bg: @mantle;\n --color-serp-divider-subtle-container: @surface0;\n --color-gray-30: @subtext0;\n --color-gray-40: @overlay2;\n --color-text-secondary: @subtext1;\n --color-text-tertiary: @subtext0;\n --color-icon-default: @overlay2;\n --color-serp-snippet-background: @base;\n --color-link-default: @blue;\n --color-link-visited: @mauve;\n --color-tabs-search-text-default: @accent-color;\n --color-primary-50: @accent-color;\n --color-primitive-primary-60: @accent-color;\n --color-primitive-primary-70: darken(@accent-color, 5%);\n --color-container-interactive: transparent;\n --color-button-background: @accent-color;\n --color-button-disabled: fade(@surface2, 30%);\n --color-serp-settings-background: @mantle;\n\n dialog {\n color: @text;\n\n &::backdrop {\n background-color: fade(@crust, 30%);\n }\n }\n\n #searchform::after {\n outline-color: @surface0;\n }\n #searchform-actions::before {\n background: none !important;\n }\n #submit-button {\n &:hover:not(:disabled) {\n background: linear-gradient(\n 314deg,\n @peach 8.49%,\n @pink 43.72%,\n @mauve 99.51%\n );\n }\n\n svg {\n fill: @overlay2;\n }\n }\n #searchbox::placeholder {\n color: @subtext0;\n }\n\n .button.type--filled.theme--default {\n color: @base;\n\n &:disabled {\n color: fade(@text, 50%);\n }\n }\n .button.type--outlined.theme--default:hover {\n background-color: @accent-color;\n border-color: @accent-color !important;\n color: @base !important;\n }\n .tab-item.active .icon {\n fill: @accent-color !important;\n }\n .tab-item.active ::after {\n background: @accent-color !important;\n }\n\n .logo-img {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .nav-logo .logo-large {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .nav-logo .logo-small {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .waves-bottom {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .waves-top {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n input[type=\"radio\"]:checked::after {\n background-color: @accent-color;\n }\n\n .feedback-footer {\n #logo {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n height: 48px;\n }\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": "Brave Search Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/brave-search",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/brave-search",
"version": "2.0.2",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abrave-search",
"description": "Soothing pastel theme for Brave Search",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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": "peach",
"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 Brave Search",
"name": "Brave Search Catppuccin",
"updateDate": 1723831099315,
"_id": "32352688-6557-43a8-ac09-6f44295035d0",
"_rev": 1723831099385,
"id": 2,
"originalDigest": "12ea3272c3975adca1ae7c4565f3a4da542dedd4",
"etag": "W/\"4df16f5f1176d8c6c2c47e2e028af393d4d609d4d564e132982efe2c503ae82c\"",
"preferScheme": "none"
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt",
"installDate": 1698242984808,
"sections": [
{
"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.3.4\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@1.0.0/css/catppuccin-variables.important.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: @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 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 !important;\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 .dark\\:bg-gray-950:is(.dark *) {\n background-color: @mantle;\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-750: @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 .btn-blue {\n background-color: @blue;\n color: @crust;\n\n &:hover {\n background-color: darken(@blue, 5%);\n }\n }\n\n .bg-[\\#0077FF],\n .bg-\\[\\#3C46FF\\],\n .bg-[\\#3C46FF],\n .bg-[\\#4046EC] {\n background-color: @blue;\n }\n\n .hover\\:bg-\\[\\#0000FF\\]:hover {\n background-color: darken(@blue, 5%);\n }\n\n .bg-[\\#10A37F] {\n background-color: @green;\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 .oai-header img {\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.3.4",
"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",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 ChatGPT",
"name": "ChatGPT Catppuccin",
"updateDate": 1729150024401,
"_id": "b053cab5-a06a-4e0b-92a6-85a53326e988",
"_rev": 1729150024507,
"id": 3,
"originalDigest": "997643883f699fc5728a4d835f342b583c25c209",
"etag": "W/\"c854a445242d7f3a4d7dc519ffe65f146295ca8e05b03383a5ee7ab0eef062c2\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/deepl/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/deepl",
"installDate": 1698243065084,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name DeepL Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/deepl\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/deepl\n@version 1.0.3\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/deepl/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adeepl\n@description Soothing pastel theme for DeepL\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:\\\\/\\\\/www.deepl.com\\\\/?(.*\\\\/)translator.*$\") {\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 @text-filter: @catppuccin[@@lookup][@text_filter];\n @blue-filter: @catppuccin[@@lookup][@blue_filter];\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 /* header */\n .BasePageHeader-module--container--d81cb {\n background-color: @mantle !important;\n }\n\n /* background */\n body {\n background-color: @base !important;\n color: @text !important;\n }\n\n .bg-neutral-next-50,\n .bg-white,\n .contextual-menu-dragging-area,\n input {\n background-color: @base !important;\n }\n\n .pageFooterV2-module--footerOuterContainer--0b055 {\n background-color: @mantle !important;\n }\n\n .scrollablePopiverListRoot-module--root--588fe {\n background-color: @base !important;\n }\n\n /* text color */\n h1,\n h2,\n h3,\n h4,\n p,\n a,\n button,\n span,\n input,\n ul,\n li,\n .mb-3,\n .mb-4,\n .GlossaryModalWithIllustration-module--content--2bf03,\n .lmt__glossary_editor_glossaryName {\n color: @text !important;\n }\n\n .text-neutral-next-600 {\n color: @subtext0 !important;\n }\n\n /* privacy notice */\n .cookieBanner-module--container--9baef {\n background-color: @surface0 !important;\n color: @text !important;\n }\n\n .button-module--button--4f58d.button-module--color_primaryAlt3--cd3cf {\n border-color: @text !important;\n }\n\n /* side menu */\n .classicSidemenu-module--menuContainer--35157 {\n background-color: @base !important;\n }\n\n /* borders */\n .border-black {\n border-color: @surface2 !important;\n }\n\n .border-neutral-next-100,\n .StartFreeTrialButton-module--startFreeTrialButton--bd671 {\n border-color: @surface0 !important;\n }\n\n .divide-y > :not([hidden]) ~ :not([hidden]) {\n border-color: @base;\n }\n\n .TranslatorTab-module--active--0b6ea\n .TranslatorTab-module--innerLower--8a080 {\n background-color: @accent-color !important;\n }\n\n .ring-neutral-next-900 {\n --tw-ring-color: @surface2;\n }\n\n .border-neutral-next-900 {\n border-color: @surface2 !important;\n }\n\n input {\n border-color: @surface0 !important;\n }\n\n /* hover */\n button:hover,\n .bg-blue-next-500:hover {\n background-color: @surface1 !important;\n }\n\n a:hover {\n background-color: @mantle !important;\n }\n\n .FlyoutMenuButton-module--flyoutMenuButton--97ae6:hover {\n background-color: @mantle !important;\n }\n\n [class*=\"SourceTranslatorArea-module--focusBorder--\"]:has(\n div[contenteditable=\"true\"]:focus\n ) {\n border-color: @accent-color;\n }\n\n [class*=\"PageHeaderLink-module--pageHeaderLink--\"]:not(\n [class*=\"PageHeaderLink-module--nohover--\"]\n ):hover {\n color: @accent-color;\n border-color: @accent-color;\n }\n\n .hover\\:bg-\\[\\#B4DAE8\\]:hover {\n background-color: @surface2 !important;\n }\n\n /* highlight */\n .bg-\\[\\#E1F0F5\\] {\n background-color: @surface1 !important;\n }\n\n /* buttons */\n .TranslatorTab-module--cardButton--4b203,\n .bg-\\[\\#EDF8FC\\] {\n background-color: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .StartFreeTrialButton-module--startFreeTrialButton--bd671,\n .bg-blue-next-50 {\n background-color: @surface0 !important;\n }\n\n .bg-blue-next-500 {\n background-color: @surface0;\n border-color: @surface0;\n }\n\n .LanguageSelector-module--wrapper--f9f17 {\n --button-background: @surface0 !important;\n --button-border-color: @surface0 !important;\n color: @base !important;\n }\n\n .CareerBanner-module--container--2ac20 {\n background-color: @surface0 !important;\n }\n\n /* glossary button */\n .lmt__glossaryButton,\n .lmt__glossaryButton__desktop:hover,\n .ModalDialogContent-module--content--5751e {\n background-color: @surface0 !important;\n }\n\n .lmt__glossary_acceptButton,\n .lmt__glossary_editor,\n .lmt__glossary_editor_subBar_top,\n .lmt__glossary_editor_subBar_bottom,\n .lmt__glossary_editor_mainBar,\n .Select-module--wrapper--53ec7 .Select-module--flyout--c91f3,\n .lmt_firstEntry-content,\n .lmt__glossary_newEntry_langButton,\n .Select-module--wrapper--53ec7,\n .Select-module--button--f032e {\n background-color: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .desktop-glossary-overwrites .lmt__language_select__menu {\n background-color: @surface0 !important;\n color: @text !important;\n }\n\n .lmt__glossary_newEntry_langDropdown.lmt__language_select__menu\n button\n .langName {\n color: @text !important;\n }\n\n /* pro banner */\n .ProBanner2021-module--wrapper--c7e3d,\n .p-8 {\n background: @base !important;\n }\n\n /* some button colors */\n .badge-module--badge--c9ebe.badge-module--proDark--a4d4e {\n background-color: @green;\n color: @base !important;\n }\n\n .button-module--button--a854e.button-module--color_secondary--f171e {\n background-color: @peach;\n border-color: @peach !important;\n color: @base !important;\n }\n\n .button-module--button--a854e.button-module--variant_outline--b937c {\n background-color: @surface0 !important;\n border-color: @surface0 !important;\n }\n\n .button-module--button--a854e.button-module--color_primary--bfa59 {\n background-color: @blue !important;\n border-color: @blue !important;\n color: @base !important;\n }\n\n /* dropdowns */\n .ProductUpdatesContainer-module--updateContainer--16394,\n .ProductUpdateFooter-module--updateFooter--b46f0,\n .LanguageSelector-module--flyout--6bfe6 {\n background-color: @base !important;\n border-color: @surface0 !important;\n }\n\n /* allow mic/get extension prompt */\n .bg-neutral-next-900,\n .bg-blue-next-800 {\n background-color: @surface0 !important;\n color: @text !important;\n }\n\n /* icons, svgs and images */\n svg {\n color: @text !important;\n }\n\n .lmt__glossary_ad_checkmark,\n .lmt__glossary_arrowDown {\n border-color: @text !important;\n }\n\n path,\n .DeeplLogoText-module--logoText--34a4f,\n .ProBanner2021-module--lockitem--febe3,\n .FlyoutMenuButton-module--flyoutMenuButton--97ae6::after,\n #top-navi-sidemenu-opener,\n .pageFooterV2-module--socialMediaLinks--71305,\n .ProBanner2021-module--checkitem--2d8e7,\n [src*=\"https://static.deepl.com/img/app_desktop.svg\"]\n {\n filter: @text-filter;\n }\n\n .Logo-module--logoImg--1ee7e,\n .LogoLink-module--logoText--33735,\n .deeplLogo-module--logo--ffd7a {\n filter: @blue-filter;\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; @blue_filter: brightness(0) saturate(100%) invert(26%) sepia(100%) saturate(1906%) hue-rotate(213deg) brightness(97%) contrast(97%); @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @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; @blue_filter: brightness(0) saturate(100%) invert(68%) sepia(9%) saturate(1948%) hue-rotate(186deg) brightness(98%) contrast(90%); @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @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; @blue_filter: brightness(0) saturate(100%) invert(65%) sepia(13%) saturate(1397%) hue-rotate(184deg) brightness(103%) contrast(91%); @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @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; @blue_filter: brightness(0) saturate(100%) invert(65%) sepia(51%) saturate(534%) hue-rotate(188deg) brightness(98%) contrast(101%); @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @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": "DeepL Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/deepl",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/deepl",
"version": "1.0.3",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/deepl/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adeepl",
"description": "Soothing pastel theme for DeepL",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 DeepL",
"name": "DeepL Catppuccin",
"updateDate": 1729150024401,
"_id": "e083a452-5ef6-4812-8b76-5970f5c98476",
"_rev": 1729150024529,
"id": 4,
"originalDigest": "cdae48d6def246b94c5537934a37c878ed09deb6",
"etag": "W/\"f0c597a59bda669895c9939dbf80da4f2710a81ed43e4c67bedf9c6784130b63\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/github",
"installDate": 1698243112279,
"sections": [
{
"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.7.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: @overlay1;\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: @overlay2;\n --codeMirror-syntax-fgColor-constant: @blue;\n --codeMirror-syntax-fgColor-entity: @blue;\n --codeMirror-syntax-fgColor-keyword: @mauve;\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: @text;\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: @overlay2;\n --color-prettylights-syntax-constant: @blue;\n --color-prettylights-syntax-constant-other-reference-link: @blue;\n --color-prettylights-syntax-entity: @blue;\n --color-prettylights-syntax-storage-modifier-import: @peach;\n --color-prettylights-syntax-entity-tag: @blue;\n --color-prettylights-syntax-keyword: @mauve;\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: @red;\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 /* Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */\n --data-blue-color-emphasis: @accent-color;\n --data-red-color-emphasis: @red;\n --data-green-color-emphasis: @green;\n\n --tooltip-fgColor: @text;\n --tooltip-bgColor: @crust;\n\n /* Refined GitHub */\n --rgh-heat-color: @peach;\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: @text;\n\n &:hover {\n color: @text;\n }\n }\n .header-search-button {\n .placeholder {\n color: @subtext0;\n }\n\n svg {\n fill: @text !important;\n }\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 .subnav-link.selected {\n border-bottom-color: @accent-color;\n }\n\n /* Pull request check in progress indicator */\n [stroke=\"#DBAB0A\"] {\n stroke: fade(@yellow, 70%) !important;\n }\n [fill=\"#DBAB0A\"] {\n fill: @yellow !important;\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-background: @mantle;\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.7.8",
"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",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 GitHub",
"name": "GitHub Catppuccin",
"updateDate": 1729754333175,
"_id": "942b2272-4772-41b7-b97c-848a6b3b1d85",
"_rev": 1729754333319,
"id": 5,
"originalDigest": "66dca57461ae85932570ec56cb1fa81807ef3e57",
"etag": "W/\"6bf64e64d2f50771feb96718320f59cec3790ffcf3fca4a8cbe6cff42196a835\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/proton",
"installDate": 1698243214442,
"sections": [
{
"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.9\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 .replaceColor(#6D4AFF, fill);\n .replaceColor(#FFBB93, 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 .replaceColor(#957AFD, stop-color);\n .replaceColor(#FFC6C6, stop-color);\n .replaceColor(#FA528E, stop-color);\n .replaceColor(#FF8065, stop-color);\n .replaceColor(#FFA51F, 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 #darkenOrLighten(@color, @value) {\n @result: if(\n @lookup=latte,\n darken(@color, @value),\n lighten(@color, @value)\n );\n }\n\n --primary-minor-2: #lightenOrDarken(@accent-color, 60%) [ @result];\n --primary-minor-1: #lightenOrDarken(@accent-color, 50%) [ @result];\n --primary: @accent-color;\n --primary-major-1: #darkenOrLighten(@accent-color, 4%) [ @result];\n --primary-major-2: #darkenOrLighten(@accent-color, 8%) [ @result];\n --primary-major-3: #darkenOrLighten(@accent-color, 12%) [ @result];\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: #darkenOrLighten(@maroon, 4%) [ @result];\n --signal-danger-major-2: #darkenOrLighten(@maroon, 8%) [ @result];\n --signal-danger-major-3: #darkenOrLighten(@maroon, 12%) [ @result];\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: #darkenOrLighten(@peach, 4%) [ @result];\n --signal-warning-major-2: #darkenOrLighten(@peach, 8%) [ @result];\n --signal-warning-major-3: #darkenOrLighten(@peach, 12%) [ @result];\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: #darkenOrLighten(@green, 4%) [ @result];\n --signal-success-major-2: #darkenOrLighten(@green, 8%) [ @result];\n --signal-success-major-3: #darkenOrLighten(@green, 12%) [ @result];\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: #darkenOrLighten(@blue, 4%) [ @result];\n --signal-info-major-2: #darkenOrLighten(@blue, 8%) [ @result];\n --signal-info-major-3: #darkenOrLighten(@blue, 12%) [ @result];\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: #darkenOrLighten(@accent-color, 4%) [ @result];\n --interaction-norm-major-2: #darkenOrLighten(@accent-color, 8%) [ @result];\n --interaction-norm-major-3: #darkenOrLighten(@accent-color, 12%) [\n @result];\n --interaction-norm-contrast: @mantle;\n --interaction-weak-minor-2: #lightenOrDarken(@surface0, 20%) [ @result];\n --interaction-weak-minor-1: #lightenOrDarken(@surface0, 10%) [ @result];\n --interaction-weak: @surface0;\n --interaction-weak-major-1: #darkenOrLighten(@surface0, 4%) [ @result];\n --interaction-weak-major-2: #darkenOrLighten(@surface0, 8%) [ @result];\n --interaction-weak-major-3: #darkenOrLighten(@surface0, 12%) [ @result];\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-primary-color: red(@accent-color) green(@accent-color)\n blue(@accent-color);\n --shadow-norm-opacity: 0.5;\n --shadow-raised-opacity: 1;\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 @media (min-width: 28.135em) {\n .sign-layout-bg {\n background: linear-gradient(\n 68.66deg,\n desaturate(@mantle, 5%) 1.3%,\n desaturate(@base, 5%) 50%\n );\n }\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.9",
"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",
"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": "mauve",
"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 Proton",
"name": "Proton Catppuccin",
"updateDate": 1724051493350,
"_id": "25aa2163-58b2-45e3-92f2-43e0627cd34c",
"_rev": 1726586768018,
"id": 6,
"originalDigest": "2fb18a6484ee36e84c70f57116503ec579b17c33",
"etag": "W/\"8b4605e41f7e9dc990061d61f86dc41d40faa0ae0db38029b5029ecad868fdf8\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/stylus/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/stylus",
"installDate": 1698243263899,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Stylus Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/stylus\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/stylus\n@version 1.2.6\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stylus/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astylus\n@description Soothing pastel theme for Stylus\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 url-prefix(\"moz-extension://\"), url-prefix(chrome-extension://)\n{\n :root {\n &[data-ui-theme=\"light\"] {\n #catppuccin(@lightFlavor, @accentColor);\n }\n &[data-ui-theme=\"dark\"] {\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 --bg: @base;\n --fg: @text;\n --c30: @subtext1;\n --c40: @overlay0;\n --c45: @surface2;\n --c50: @subtext0;\n --c60: @subtext0;\n --c65: @surface2;\n --c75: @overlay1;\n --c80: @surface1;\n --c85: @surface0;\n --c90: @base;\n --c95: @mantle;\n --c97: @mantle;\n --c98: @base;\n --c99: @base;\n --c100: @base;\n --red1: @red;\n --accent-1: @accent-color;\n --accent-2: @accent-color;\n --accent-3: fade(@accent-color, 25%);\n\n .slider {\n --color-on: fade(@accent-color, 25%);\n --color-off: @surface2;\n }\n\n :focus {\n --focus-color1: @accent-color !important;\n --focus-color2: fade(@accent-color, 25%) !important;\n }\n\n .active #filters-stats,\n .dirty #save-button,\n .dirty #save-button + button {\n background-color: @accent-color;\n border-color: @accent-color;\n color: @base;\n }\n #header-resizer {\n color: @surface1;\n }\n #message-box-title::before {\n @fade_color: fade(@accent-color, 67%);\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n [src=\"moz-extension://8fc71d5e-96b2-44a4-8d6f-ead6ff4d3c56/images/icon/16.png\"], img[src=\"/images/icon/128.png\"]\n {\n @fade_color: fade(@accent-color, 67%);\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n #message-box.danger {\n #message-box-title {\n background-color: @red;\n color: @base;\n\n &::before {\n @fade_color: fade(@red, 67%);\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n }\n\n #message-box-close-icon i {\n color: var(--c40);\n &:hover {\n color: var(--bg);\n }\n }\n }\n\n #filters label:hover,\n #filters .filter-selection:hover {\n background-color: @surface0;\n }\n .oldUI .disabled h2::after,\n .entry.usercss .style-name-link::after {\n background-color: fade(@accent-color, 25%);\n }\n\n /* Syntax highlighting */\n .CodeMirror-activeline-background {\n background: @mantle;\n }\n .CodeMirror-linenumber {\n color: @subtext0;\n }\n div.CodeMirror span.CodeMirror-matchingbracket {\n color: @green;\n }\n .cm-s-default {\n .cm-string {\n color: @green;\n }\n .cm-qualifier {\n color: @yellow;\n }\n .cm-variable-2 {\n color: @mauve;\n }\n .cm-keyword {\n color: @mauve;\n }\n .cm-atom {\n color: @red;\n }\n .cm-number {\n color: @peach;\n }\n .cm-def {\n color: @mauve;\n }\n .cm-tag {\n color: @blue;\n }\n .cm-builtin {\n color: @red;\n }\n .cm-variable-3 {\n color: @teal;\n }\n .cm-comment {\n color: @overlay2;\n }\n .cm-operator {\n color: @yellow;\n }\n .cm-variable {\n color: @blue;\n }\n .cm-property {\n color: @blue;\n }\n }\n button:disabled,\n select:disabled,\n option:disabled,\n select[disabled] > option {\n color: @subtext0;\n }\n .applies-to input,\n .applies-to select {\n background: @base;\n border-color: @surface0;\n color: @subtext0;\n }\n button {\n color: @text !important;\n background: @mantle !important;\n border-color: @surface0;\n &:hover {\n border-color: @text;\n }\n }\n #save-button[disabled] {\n background: @surface0 !important;\n }\n #message-box-title {\n color: @text;\n }\n .svg-icon {\n fill: @overlay0;\n\n &:hover {\n fill: @overlay1;\n }\n }\n .onoffswitch input:checked + span {\n background-color: fade(@accent-color, 25%);\n\n &::before {\n background-color: @accent-color;\n }\n }\n #options-title {\n color: @base;\n }\n h2 {\n color: @accent-color !important;\n }\n .installed .configure-usercss {\n i {\n color: @accent-color;\n }\n\n svg,\n &:hover svg {\n fill: @accent-color !important;\n }\n }\n #live-reload-install-hint {\n color: @teal;\n }\n #menu.delete {\n header {\n background: fade(@red, 25%);\n }\n\n > div,\n [data-cmd=\"delete\"] {\n border-color: @red;\n }\n }\n .entry.odd {\n background-color: fade(@surface0, 25%);\n }\n .updater-icons > :not(.check-update)::after {\n border-color: @yellow;\n background: @base;\n }\n .split-btn-menu {\n border-color: @accent-color;\n\n > :hover {\n background: fade(@accent-color, 25%);\n }\n }\n #help-popup .title {\n background: @mantle;\n }\n #toc li:hover {\n background: fade(@accent-color, 20%);\n }\n input:invalid {\n background: fade(@red, 10%);\n color: @red;\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": "Stylus Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/stylus",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/stylus",
"version": "1.2.6",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/stylus/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astylus",
"description": "Soothing pastel theme for Stylus",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 Stylus",
"name": "Stylus Catppuccin",
"updateDate": 1726235737983,
"_id": "6b26ec88-4cef-48be-bdbf-8a4dcb334a9e",
"_rev": 1726235737999,
"id": 7,
"originalDigest": "0f3f4149e870372be9c438a0adc52c42ce27387d",
"etag": "W/\"ea1c4a39ab5ddf6adb3e8919b1d7445d27f0c3a2c1fe9f4373de405ebc037c55\""
},
{
"enabled": true,
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.css",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/youtube",
"installDate": 1698243289587,
"sections": [
{
"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.2.13\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 @text-filter: @catppuccin[@@lookup][@text_filter];\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: @subtext0 !important;\n --yt-spec-black-pure-alpha-10: @overlay2 !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(@surface1, 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: @crust;\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: @crust !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: @surface1 !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 @surface0\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 .yt-page-navigation-progress {\n background: @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 #background.ytd-masthead {\n --yt-frosted-glass-desktop: @base !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 yt-icon-button.yt-live-chat-item-list-renderer {\n background-color: @accent-color;\n color: @crust;\n\n &:hover {\n background-color: darken(@accent-color, 5%);\n }\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 .watch-skeleton .skeleton-bg-color {\n background-color: @surface1;\n }\n\n /* Ambient mode */\n #cinematics,\n #cinematic-container {\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=\"#f03\"],\n [fill=\"#FF0033\"] {\n fill: @accent-color !important;\n }\n\n [fill=\"white\"] {\n fill: if(@lookup = latte, @base, @text) !important;\n }\n\n /* verification badge */\n [src*=\"https://www.gstatic.com/images/icons/material/system/1x/check_circle_grey600_36dp.png\"]\n {\n filter: @text-filter;\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 &:hover {\n background-color: @surface1;\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--disabled {\n background-color: fade(@overlay0, 50%);\n color: @subtext0;\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 &.yt-spec-button-shape-next--outline {\n color: @text;\n border-color: @surface1;\n &:hover {\n background: @surface0;\n }\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: @surface0;\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 .badge-shape-wiz--thumbnail-live {\n background: @accent-color;\n color: @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 .badge-shape-wiz--thumbnail-default {\n color: @text;\n background: fade(@crust, 80%);\n }\n\n /* Panels, popups, tooltips */\n\n .ytp-tooltip-text {\n background: fade(@surface0, 90%) !important;\n color: @text;\n text-shadow: none !important;\n }\n\n .ytp-popup {\n background: fade(@surface0, 90%) !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 .ytp-menuitem[aria-checked=\"true\"] .ytp-menuitem-toggle-checkbox {\n background: @accent-color;\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 .ytp-play-progress {\n background: @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-live-badge {\n &[disabled]::before {\n background: @accent-color;\n }\n &::before {\n background: @overlay0;\n }\n }\n\n /* youtube live ring */\n .yt-spec-avatar-shape__badge-text {\n color: @crust;\n }\n .yt-spec-avatar-shape--live-ring {\n border-color: @accent-color;\n }\n .yt-spec-avatar-shape__live-badge {\n background-color: @accent-color;\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 /* Video highlight */\n ytd-rich-item-renderer.ytd-rich-item-renderer-highlight {\n background-color: fade(@accent-color, 10%) !important;\n box-shadow: fade(@accent-color, 10%) 0 0 0 10px !important;\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 .YtwFactoidRendererLabel {\n color: @subtext0;\n }\n .YtwFactoidRendererValue {\n color: @text;\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 .YtProgressBarLineProgressBarPlayed,\n .YtProgressBarPlayheadProgressBarPlayheadDot {\n background-color: @accent-color !important;\n }\n\n .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--filled {\n background-color: @accent-color;\n color: @crust;\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 /* Shorts titles and views on homepage */\n .ShortsLockupViewModelHostOutsideMetadataEndpoint {\n color: @text;\n }\n .ShortsLockupViewModelHostOutsideMetadataSubhead {\n color: @subtext1;\n }\n\n /* Buy super thanks bar */\n #progressContainer.tp-yt-paper-progress {\n background-color: @mantle !important;\n }\n\n #comment-chip-container.yt-pdg-comment-chip-renderer,\n .slider-knob-inner.tp-yt-paper-slider {\n background: @accent-color !important;\n }\n\n #primaryProgress.tp-yt-paper-progress {\n background: linear-gradient(139deg, @peach, @maroon, @red, @pink);\n }\n\n #container.ytd-pdg-comment-preview-renderer {\n background-color: @mantle !important;\n }\n\n #comment-chip-price.yt-pdg-comment-chip-renderer,\n yt-icon.yt-pdg-comment-chip-renderer {\n color: @crust;\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 /* channel details */\n .profile-badge-view-model-wiz__badge-description {\n color: @text !important;\n }\n\n .profile-badge-view-model-wiz__badge-subtitle {\n color: @subtext0 !important;\n }\n\n .yt-profile-identity-info-view-model-wiz__divider {\n border-color: @surface0 !important;\n }\n\n /* Profiles */\n .yt-profile-card-view-model-wiz {\n background-color: @mantle;\n }\n .yt-profile-identity-info-view-model-wiz__channel-name,\n .yt-profile-info-view-model-wiz__section-title,\n .yt-comment-interaction-view-model-wiz__video-title,\n .yt-shared-subscription-view-model-wiz__channel-name {\n color: @text;\n }\n .yt-profile-identity-info-view-model-wiz__badge,\n .yt-profile-identity-info-view-model-wiz__metadata-handle,\n .yt-profile-identity-info-view-model-wiz__metadata-content,\n .yt-profile-info-view-model-wiz__section-subtitle,\n .yt-comment-interaction-view-model-wiz__comment-content {\n color: @subtext0;\n }\n\n /* Horizontal list arrows */\n .arrow.yt-horizontal-list-renderer {\n background: @surface0;\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; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @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; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @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; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @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; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @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.2.13",
"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",
"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": "red",
"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"
}
]
},
"logo": {
"type": "checkbox",
"label": "Enable YouTube logo",
"name": "logo",
"value": "1",
"default": "1",
"options": null
},
"oled": {
"type": "checkbox",
"label": "Enable black bars",
"name": "oled",
"value": "1",
"default": "0",
"options": null
}
}
},
"author": "Catppuccin",
"description": "Soothing pastel theme for YouTube",
"name": "YouTube Catppuccin",
"updateDate": 1728663639318,
"_id": "394d935b-9e6c-4e0e-8adf-6ee7777aed72",
"_rev": 1728663639444,
"id": 8,
"originalDigest": "61e478960034a97d22a125dc9a9625cc373d8e22",
"etag": "W/\"879bfac6c53cb021d0dd5ac5b899a904d80e1ce8ca7925cde4237f4fe4f81113\""
},
{
"enabled": false,
"updateUrl": "https://cdn.jsdelivr.net/gh/33kk/uso-archive@flomaster/data/usercss/163453.user.css",
"url": "https://uso.kkx.one/style/163453",
"installDate": 1698245439316,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Dark NixOS\n@namespace USO Archive\n@author x75tiger75x\n@description Darkened NixOS Website\n@version 20180819.01.46\n@license NONE\n@preprocessor uso\n==/UserStyle== */\n@-moz-document domain(\"nixos.org\") {\nbody {\n color: #d5d5d5;\n background-color: #1a1a1a;\n}\n.navbar-inner {\n background-image: linear-gradient(to bottom, #2f2f2f, #212121);\n background-repeat: repeat-x;\n border: 1px solid #1d1d1d;\n}\n.navbar .brand {\n color: #b7b7b7;\n text-shadow: 0 1px 0 #141414;\n}\n.navbar .brand > a:hover {\n color: #e1e1e1;\n}\n.navbar .nav > li > a {\n color: #b7b7b7;\n text-shadow: 0 1px 0 #141414;\n}\n.navbar .nav > li > a:hover {\n color: #e1e1e1;\n text-shadow: 0 1px 0 #141414;\n}\ntextarea,\ninput[type=\"text\"],\ninput[type=\"password\"],\ninput[type=\"datetime\"],\ninput[type=\"datetime-local\"],\ninput[type=\"date\"],\ninput[type=\"month\"],\ninput[type=\"time\"],\ninput[type=\"week\"],\ninput[type=\"number\"],\ninput[type=\"email\"],\ninput[type=\"url\"],\ninput[type=\"search\"],\ninput[type=\"tel\"],\ninput[type=\"color\"],\n.uneditable-input {\n background-color: #212121;\n border: 1px solid #333;\n color: white;\n}\nul.nixos-blogs > li:nth-child(2n+1) {\n background-color: rgb(39, 39, 39);\n}\nul.nixos-blogs > li {\n border-top: 1px solid rgb(66, 66, 66);\n}\nul.nixos-commits > li:nth-child(2n+1) {\n background-color: rgb(39, 39, 39);\n}\nul.nixos-commits > li {\n border-top: 1px solid rgb(66, 66, 66);\n}\npre {\n background-color: #111;\n box-shadow: 0.1em 0.1em 0.5em #0c0c0c;\n}\ncode,\npre {\n color: #999;\n}\ntable#search-results tr.odd > td {\n background-color: #292929;\n}\ntable#search-results tr.even:hover > td {\n background-color: #292929;\n}\n.table th,\n.table td {\n border-top: 1px solid #3c3c3c;\n}\n.pager li > a,\n.pager li > span {\n background-color: #2d2d2d;\n border: 1px solid #3c3c3c;\n}\n.pager:hover li > a:hover,\n.pager li > span {\n background-color: #5f5f5f;\n border: 1px solid #3c3c3c;\n}\n.pager .disabled > a,\n.pager .disabled > a:hover,\n.pager .disabled > a:focus,\n.pager .disabled > span {\n background-color: #2d2d2d;\n}\n.alert {\n text-shadow: 0 1px 0 rgba(66, 66, 66, 0.5);\n background-color: #3b382d;\n border: 1px solid #44403b;\n}\n.hljs {\n color: #0051bd;\n}\n.alert-info {\n color: #3a87ad;\n background-color: #1b2930 !important;\n border-color: #273336 !important;\n}\n.table-striped tbody > tr:nth-child(2n+1) > td,\n.table-striped tbody > tr:nth-child(2n+1) > th {\n background-color: #232323;\n}\n.dropdown-menu {\n background-color: #272727;\n}\n.dropdown-menu > li > a {\n color: #909090;\n}\n.dropdown-menu .divider {\n *width: 100%;\n height: 1px;\n margin: 9px 1px;\n *margin: -5px 0 5px;\n overflow: hidden;\n background-color: #606060;\n border-bottom: 1px solid #606060;\n}\n.news-short {\n color: #fcfcfc;\n}\nhr {\n border-top: 1px solid #656565;\n border-bottom: 1px solid #656565;\n}\n\n.hljs {\n\tbackground: #0e0e0e;\n}\n}",
"usercssData": {
"name": "Dark NixOS",
"namespace": "USO Archive",
"author": "x75tiger75x",
"description": "Darkened NixOS Website",
"version": "20180819.01.46",
"license": "NONE",
"preprocessor": "uso"
},
"author": "x75tiger75x",
"description": "Darkened NixOS Website",
"name": "Dark NixOS",
"originalDigest": "320c15d7c6497b600a750f87d10774e7f42304ff",
"_id": "1129d226-3ef7-41d3-938e-9757e3408b54",
"_rev": 1715538122420,
"installationUrl": "https://uso.kkx.one/style/163453",
"id": 9,
"etag": "W/\"c17-+Vy7znL1V6VKjdpQQv+y1Esk5BQ\""
},
{
"enabled": true,
"installDate": 1715534755792,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Home Manager Options Search Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/home-manager-options-search\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/home-manager-options-search\n@version 0.0.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/home-manager-options-search/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahome-manager-options-search\n@description Soothing pastel theme for Home Manager Options Search\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('home-manager-options.extranix.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 {\n background-color: @base;\n color: @text;\n }\n\n header {\n background-color: @mantle;\n\n nav.shortcuts li a {\n color: @text;\n\n &:hover {\n background-color: @surface0;\n color: @text;\n }\n }\n }\n\n #lastUpdateElement {\n color: @text;\n }\n\n a,\n a:visited {\n color: @accent-color;\n }\n\n input,\n textarea,\n select {\n background-color: @mantle;\n color: @text;\n caret-color: @text;\n border-color: @surface0;\n }\n\n .progress-bar-striped {\n background-image: linear-gradient(\n 45deg,\n fade(@text, 40%) 25%,\n transparent 25%,\n transparent 50%,\n fade(@text, 40%) 50%,\n fade(@text, 40%) 75%,\n transparent 75%,\n transparent\n );\n background-color: @accent-color;\n color: @crust;\n }\n\n .form-control:focus {\n border-color: @accent-color;\n box-shadow:\n inset 0 1px 1px rgba(0, 0, 0, 0.075),\n 0 0 8px @accent-color;\n }\n\n .table-striped > tbody > tr:nth-of-type(2n + 1) {\n background-color: @surface0;\n }\n\n table#indexedOptionsTable tr td,\n .table > thead > tr > th {\n border-color: @surface2 !important;\n }\n\n table tr.optrow:focus-visible,\n table tr.optrow:hover {\n background-color: @surface1 !important;\n }\n\n .modal-content {\n background-color: @base;\n\n .modal-header,\n .modal-footer {\n border-color: @surface0 !important;\n }\n\n .close {\n color: @text;\n text-shadow: 0 1px 0 @text;\n }\n\n pre {\n color: @text;\n background-color: @mantle;\n border-color: @surface0;\n }\n }\n\n .btn-default {\n background: @surface0;\n color: @text;\n text-shadow: none;\n box-shadow: none;\n border-color: @surface0;\n\n &:hover,\n &:focus,\n &:active,\n .focus,\n .active {\n background-color: @surface1;\n color: @text;\n border-color: @surface0;\n }\n }\n\n footer {\n background-color: @mantle;\n color: @text;\n border-color: @surface2;\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": "Home Manager Options Search Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/home-manager-options-search",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/home-manager-options-search",
"version": "0.0.1",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/home-manager-options-search/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahome-manager-options-search",
"description": "Soothing pastel theme for Home Manager Options Search",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 Home Manager Options Search",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/home-manager-options-search",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/home-manager-options-search/catppuccin.user.css",
"name": "Home Manager Options Search Catppuccin",
"preferScheme": "none",
"originalDigest": "6e1d2884ce30a772e517a32a020c47dae033d81b",
"_id": "56054689-3988-4fbd-b9eb-15d3cbd763ae",
"_rev": 1715535683370,
"id": 10,
"etag": "W/\"426f82dbf8bd93a10f04b9da048140bcbd876b1d4373e2812be89a36ce3d59b7\""
},
{
"enabled": true,
"installDate": 1715535080959,
"sections": [
{
"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.3.0\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 {\n &:not(.dark-bg, .no-theme) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n &.dark-bg {\n #catppuccin(@darkFlavor, @accentColor);\n }\n\n &.no-theme {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor, @accentColor);\n }\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 --sds-color-text-02: @text !important;\n --sds-color-text-disabled: @overlay0 !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: @mantle !important;\n --theme-col-bg-header-modal: @surface0 !important;\n --theme-col-bg-button-primary: @blue !important;\n /* ai chat */\n --sds-color-text-link-02-hover: @text !important;\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 /* maps */\n --sds-color-background-01: @base !important;\n --sds-color-background-02: @mantle !important;\n --sds-color-palette-red-40: @red !important;\n --sds-color-border-01: @surface0 !important;\n --col-blue-30: @blue !important;\n --sds-color-palette-green-60: @green !important;\n --sds-color-background-utility: @surface0 !important;\n\n .address-detail {\n background-color: @mantle;\n color: @text;\n border-color: @surface0;\n }\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 /* .dropdown--settings--icon .dropdown__button:after needs visibility: hidden, otherwise we get a case of clashing icons */\n .dropdown__button::after {\n visibility: hidden;\n }\n\n /* privacy reminders */\n .wXKLp5dS9jGvo097pfaG,\n .privacy-reminder__text {\n color: @green !important;\n }\n .IuA6a2PUTR9Lck6m0WlP,\n .privacy-reminder__icon-circle {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n .XxDCpwElzOhQaLmCxJ8z,\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 /* 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 .module__items-day {\n color: @subtext0 !important;\n }\n .module__temperature-unit,\n .module__temperature-unit:hover {\n color: @accent-color !important;\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 .module__detail__hour-label,\n .module__current,\n .module__detail__temp-label,\n .module__items-unit--on {\n color: @text !important;\n }\n .module__items-item {\n background: @surface0 !important;\n border-color: @surface2 !important;\n }\n .module__weatherkit-logo {\n fill: @accent-color;\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 //rain icon\n .module__items-icon-precip {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n width: 32px;\n height: 32px;\n margin-top: 5px;\n margin-bottom: -5px;\n max-width: 100%;\n }\n\n //calculator\n .tile__ctrl__btn,\n .tile__history,\n .tile__past-calc {\n background: @surface0 !important;\n border-color: @surface2 !important;\n color: @text !important;\n }\n .attribution--link__icon {\n color: @text;\n }\n .tile__ctrl__toggle-slider {\n background: @surface1 !important;\n }\n .tile__ctrl__toggle-slider::before {\n background-color: @mantle !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__main {\n background-color: @base !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 .tile__ctrl--important {\n background-color: @yellow !important;\n color: @mantle !important;\n }\n .tile__display__aside,\n .tile__past-formula,\n .tile__option {\n color: @subtext0 !important;\n }\n .tile__option--active {\n color: @accent-color !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 .c-base__title {\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@-moz-document domain(start.duckduckgo.com) {\n :root:not(.theme-dark) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n\n :root.theme-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 color-scheme: if(@lookup = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent-color, 30%);\n }\n\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n input {\n background-color: @surface0 !important;\n color: @text !important;\n }\n li:hover {\n background-color: @surface2 !important;\n }\n ul {\n background-color: @surface0 !important;\n }\n body {\n background-color: @base !important;\n }\n h1,\n h2,\n h3,\n p,\n a,\n span {\n color: @text !important;\n }\n\n --color-yellow60: @yellow !important;\n --theme-button-primary-bg: @blue !important;\n --theme-searchbox-caret-bg: @accent-color !important;\n\n .home_root__naJUp {\n --theme-bg-home: @base !important;\n --theme-button-secondary-text: @text !important;\n --theme-text-bg: @text !important;\n --theme-bg-home-searchbox: @surface0 !important;\n --theme-border-color-home-searchbox: @surface0 !important;\n }\n .searchbox_suggestions__umkQH {\n --theme-searchbox-bg: @surface0 !important\n ;\n }\n .minimal-homepage_minimalHeroLogo__QSVlf {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n .header_headerButton__cLYU3 {\n color: @text !important;\n }\n .sideMenu_sideMenuContent__OE7n9,\n .searchbox_iconWrapper__suWUe {\n background-color: @surface0 !important;\n }\n .button_primary__e2_Sy {\n color: @mantle !important;\n }\n .searchbox_hasQuery__j8_VE:hover\n .searchbox_searchButton__F5Bwq:not(:disabled),\n .searchbox_hasQuery__j8_VE:focus-within {\n color: @mantle !important;\n background-color: @accent-color !important;\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.3.0",
"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",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 DuckDuckGo",
"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": "fb80276e2c4ecb948c791160e1464ae2f221f790",
"_id": "0dc8d202-eec3-4899-967c-76c944413214",
"_rev": 1728404439029,
"id": 11,
"etag": "W/\"7d1c77c82fdf9a73589f8898c3011ba62ec62b6662945a7376d13f61514c0628\"",
"updateDate": 1728404438978
},
{
"enabled": true,
"installDate": 1715535130675,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Google Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/google\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google\n@version 0.3.2\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle\n@description Soothing pastel theme for Google\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?://(www\\\\.|images\\\\.)?google\\\\..*\")\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 @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 iframe {\n color-scheme: none !important;\n }\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 body {\n background: @base !important;\n --uv-styles-color-surface: @crust;\n --uv-styles-color-tertiary: @surface0;\n --uv-styles-color-secondary: fade(@blue, 25%);\n --uv-styles-color-primary: @base;\n --uv-styles-color-on-primary: @blue;\n --uv-styles-color-text-primary: @blue;\n --uv-styles-color-icon-default: @text;\n --uv-styles-color-text-emphasis: @text;\n --uv-styles-color-icon-on-secondary: @subtext0;\n --uv-styles-color-on-tertiary: @text;\n --uv-styles-color-icon-on-tertiary: @text;\n --uv-styles-color-scrim: fade(@crust, 75%);\n --uv-styles-color-on-scrim: @text;\n --uv-styles-color-icon-on-scrim: @text;\n --xhUGwc: @base;\n --bbQxAb: @text;\n --IXoxUe: @subtext0;\n --COEmY: @text;\n --YLNNHc: @text;\n --JKqx2: @blue;\n --gS5jXb: @surface0;\n --mXZkqc: @surface0;\n --EpFNW: @mantle;\n --XKMDxc: @mantle;\n --TSWZIb: @mantle;\n --tefdc5886c2f04483: @text;\n --te8f1ea4d4928be48: @text !important;\n --ta884a309a24f44f4: @subtext0 !important;\n --tdee01b39543f1cac: @base !important;\n --tcc8c9ef487836e2b: @surface0 !important;\n --ta83cba65577ef850: @blue !important;\n --t7d1a3050c2c1c0a5: @text !important;\n --t6a0469853a1a02c1: @text !important;\n --t5feec22832a0fdd6: @surface0 !important;\n --t342c96645d13ae13: @accent-color !important;\n --t6c7325fca9d536d4: @text !important;\n --tf7148cf5018d5074: @text !important;\n --t9ab8d922307d428d: @text;\n --t62e84c71989f1975: @red !important;\n --tc9db399ed82142e1: @green !important;\n --uv-styles-color-text-default: @subtext0 !important;\n --uv-styles-color-review-stars: @yellow !important;\n --gm3-sys-color-primary: @surface0;\n --gm3-sys-color-on-primary: @blue;\n --Nsm0ce: @blue;\n }\n\n /* header background */\n .CvDJxb {\n background-color: @base !important;\n }\n\n /* safe search toggle dropdown */\n .z4R3Z.yb2zA {\n color: @blue !important;\n }\n .z4R3Z {\n color: @text !important;\n }\n\n /* selected image background */\n .PNCib.fT6ABc::after {\n background-color: @surface1 !important;\n border-color: @blue !important;\n }\n\n /* travel */\n .Usd1Ac {\n background-color: @surface0 !important;\n border-color: @surface2 !important;\n }\n .P77izf {\n background-color: @base !important;\n color: @text !important;\n }\n .VfPpkd-StrnGf-rymPhb-f7MjDc,\n .VfPpkd-qPzbhe-JNdkSc-Bz112c {\n color: @accent-color !important;\n }\n .EL3pcf {\n color: @accent-color !important;\n }\n .bVfPpkd-StrnGf-rymPhb,\n .DMZ54e {\n color: @text !important;\n }\n .VfPpkd-pafCAf,\n .VfPpkd-pafCAf-OWXEXe-Xhs9z {\n fill: @mantle !important;\n }\n .VfPpkd-l6JLsf::after {\n background-color: @blue !important;\n }\n .VfPpkd-l6JLsf::before {\n background-color: @surface2 !important;\n }\n .VfPpkd-uMhiad::after {\n background: @overlay0;\n }\n .dmaMHc {\n background-color: @surface0 !important;\n }\n .AJxgH {\n background-color: @mantle !important;\n }\n .VfPpkd-cTi5dd {\n color: @accent-color !important;\n }\n /* news column thingymaboober idk what it's actually called, but it's like these columns of news headlines so yeah */\n .nEklgc {\n background-color: @surface0;\n }\n .JJZKK.Wui1sd {\n border-color: @surface0;\n }\n .rbYSKb,\n .FuOudf,\n .GI74Re {\n color: @subtext0;\n }\n /* widgets */\n /* timer */\n .pMz3A,\n .qhXOwb,\n .yrvNxb .pv60Cd,\n .LPl7kb .pv60Cd,\n .Q7q8pf .pv60Cd {\n background-color: @mantle !important;\n }\n\n /* color picker */\n .P2c8Dd {\n background-color: @base;\n }\n\n .R9RxHd {\n border-color: @surface0;\n }\n\n /* unit converter */\n .LNn04b {\n background-color: @mantle;\n color: @text !important;\n border-color: @surface0;\n }\n\n .vXQmIe,\n .vk_c {\n color: @text !important;\n border-color: @surface0 !important;\n }\n\n .NIzGle {\n background-color: @yellow;\n color: @crust;\n }\n\n /* periodic table */\n .DJ3Gm {\n background-color: @peach;\n color: @crust;\n }\n\n .nA1S9d {\n background-color: @mauve;\n color: @crust;\n }\n\n .qY66Od {\n background-color: @blue;\n color: @crust;\n }\n\n .IJR6Te {\n background-color: @sky;\n color: @crust;\n }\n\n .asrVsb {\n background-color: @surface0;\n }\n\n .VCIyZb {\n background-color: @red;\n color: @crust;\n }\n\n .QRbwTb {\n background-color: @teal;\n color: @crust;\n }\n\n .tASb2d {\n background-color: darken(@red, 5%);\n color: @crust;\n }\n\n .Fm9Me {\n background-color: @yellow;\n color: @crust;\n }\n\n .wo1y7c {\n background-color: @green;\n color: @crust;\n }\n\n /* search bar right beneath websites */\n .YbqTTb,\n g-flat-button.BwMo1 {\n background-color: @base;\n border-color: @surface0;\n }\n\n .YbqTTb:focus {\n border-color: @accent-color;\n }\n\n /* some play buttons on games */\n .fxvhbc,\n .pGGGle {\n background-color: @accent-color;\n color: @crust;\n }\n\n /* calculator senpai~ */\n .zRQJhd {\n background-color: @base !important;\n }\n .XH1CIc {\n color: @subtext0;\n }\n .pno7A.hU1rMc .Tqvz7b,\n .pno7A.rfUaPd .SwDSDf {\n color: @subtext1;\n }\n .pno7A.rfUaPd .Tqvz7b {\n color: @text;\n }\n .tR3EBc {\n background-color: @mantle;\n }\n .AOvabd,\n .dxp44d {\n background: @surface0 !important;\n color: @text !important;\n border-color: @surface0 !important;\n &:hover {\n background-color: @surface1;\n border-color: @surface1;\n }\n }\n .zbvg1c {\n color: @text;\n }\n .UUhRt {\n background-color: @blue;\n color: @mantle;\n border-color: @blue;\n &:hover {\n background-color: @sky;\n border-color: @sky;\n }\n }\n .tw-lliw.item-selected .language_list_item {\n color: @blue;\n }\n .qv3Wpe {\n color: @text;\n }\n .TIGsTb {\n border-color: @surface0;\n }\n .TIGsTb:hover {\n background-color: @surface0;\n border-color: @surface0;\n }\n .MEdqYd,\n .feqqG {\n background: @surface2;\n color: @text;\n border-color: @surface2;\n &:hover {\n background-color: @overlay0;\n border-color: @overlay0;\n }\n }\n /* more button */\n .CybWFf {\n background-color: @surface0;\n }\n .Lu57id {\n color: @subtext0;\n }\n /* live sports */\n .Wrsj9b,\n .ofy7ae,\n .PPjCfd,\n .lr-imso-fix {\n background-color: @accent-color !important;\n color: @crust !important;\n }\n\n .liveresults-sports-immersive__match-grid-bottom-border,\n .liveresults-sports-immersive__match-grid-right-border,\n .YENodc {\n border-color: @surface0;\n }\n\n .liveresults-sports-immersive__match-tile:hover,\n .KAIX8d:hover,\n .kwbMAe {\n background-color: @surface0;\n }\n\n .imspo_mt__dt-t,\n .imspo_mt__pm-infc,\n .GOsQPe {\n color: @text !important;\n }\n /* knowoledge panel uwu */\n .H73aad {\n &,\n &hover {\n background-color: @mantle !important;\n border-color: @surface0 !important;\n }\n }\n\n .AQtWSd,\n .ulmfef,\n .xCBykf,\n .m2E3md {\n color: @blue;\n }\n\n .joHe2d {\n background-color: @base !important;\n box-shadow: 0 1px 0 @base !important;\n }\n .xt8Uw,\n .ipwqjc,\n .Bk8Hxd:link,\n .ucRBdc,\n .PDzHbe,\n .pt3Hdf,\n .Cv2Brc,\n .IFGUre,\n .review-dialog {\n color: @text;\n }\n\n .GK1a5e {\n background-color: @text;\n }\n\n .RC9d6e {\n border-top-color: @text;\n }\n\n .IFmkIb.IFmkIb {\n background-color: @surface0;\n border-color: @surface2;\n }\n .ab_button {\n background-image: linear-gradient(to top, @surface0, @base);\n background-color: @surface0;\n border-color: @surface1;\n }\n\n .PGbOqf {\n background-color: @accent-color;\n }\n\n .yAbdSd {\n color: @red;\n }\n\n .ycghLd {\n background-color: @red;\n border-color: @red;\n }\n\n .IRH78d,\n .CFjcj,\n .HkuhB {\n color: @subtext0;\n }\n .l2gNXd {\n background-color: @yellow;\n }\n .uVGhGc,\n .hIqKNb {\n background-color: @surface0;\n }\n .tcuWYc {\n background-image: linear-gradient(\n @overlay0 1px,\n rgba(255, 255, 255, 0) 0\n );\n }\n .qk7LXc.Fb1AKc,\n .fAt9Jd,\n .SME0md,\n .ipwqjc {\n background-color: @base !important;\n }\n\n .ttBXeb,\n .NDTw3e.K7R36c,\n .knowledge-finance-wholepage-chart__fw-uch .uch-svg {\n color: @subtext0;\n }\n\n .sQ6RSc {\n fill: @text;\n }\n\n .egcvbb {\n border-color: @surface2;\n &:hover {\n border-color: @text;\n }\n }\n\n .knowledge-finance-wholepage-chart__hover-card {\n background-color: @base;\n }\n .knowledge-finance-wholepage-chart__hover-card-time {\n color: @subtext0;\n }\n\n .fw-ch-sel .KWk7r.qUjgX {\n background-color: @surface0;\n color: @blue;\n }\n\n .gb_Ka.gb_f,\n .gb_Na.gb_f,\n #gb {\n background-color: @base !important;\n svg,\n .gb_Rc svg,\n .gb_dd .gb_ld,\n .gb_3c .gb_ld {\n color: @text;\n }\n }\n .gb_Nc a.gb_F,\n .gb_Nc span.gb_F {\n color: @text;\n }\n .uU7dJb {\n border-bottom-color: @surface0;\n background-color: @mantle;\n color: @subtext1;\n }\n .gb_Nc .gb_d:hover {\n background-color: @surface0;\n }\n .KxwPGc {\n background-color: @mantle;\n }\n .HJSKzf {\n color: @text;\n }\n\n .gbqfba,\n .lJ9FBc input[type=\"submit\"] {\n color: @text;\n background-color: @surface0;\n border-color: @surface1;\n &:hover {\n color: @text;\n background-color: @surface0;\n border-color: @surface2;\n }\n }\n\n /* AI search */\n\n .UxeQfc,\n .s7d4ef,\n .yXu61c,\n .X6JNf,\n .BERAof,\n .oxbMzd,\n .A5s9h,\n .V9Wb7c,\n .GVUPk,\n .GyAeWb,\n .A0hi5,\n .Tme6jf {\n background-color: @base !important;\n }\n\n .d3o3Ad,\n .sZKvbe {\n fill: @green !important;\n }\n\n .Fzsovc,\n .cwYVJe,\n .RJPOee,\n .vM0jzc,\n .clOx1e,\n .vDF3Oc.vDF3Oc .R8BTeb,\n .vDF3Oc.vDF3Oc .ouxCkc,\n .Yt787,\n .mulB1,\n .xUc8Ie,\n .sfgTZc,\n .I6Kpxd,\n .cQEt3 {\n color: @text !important;\n }\n\n .yQLaje,\n .tVoQIb,\n .f9nOyf,\n .kHtcsd,\n .DopHqc,\n .p7bv,\n .ar9V1,\n .DfMusf,\n .y6CIle,\n .JukT7c,\n .xUc8Ie.BXdrne,\n .sEqX7e,\n .ZFiwCf {\n background-color: @surface0 !important;\n }\n\n .xUc8Ie.BXdrne,\n .YUg0se,\n .WGbsof {\n border-color: @surface2 !important;\n }\n\n .NOo3C {\n color: @subtext1;\n }\n\n .WGbsof[selected] {\n background-color: @blue;\n border-color: @blue !important;\n }\n\n /* End of AI search */\n\n /* \"People also search for..\" / \"People also ask\" section */\n .vIifob,\n .p8Jhnd {\n background-color: @surface0 !important;\n }\n\n .vBnbff,\n .RSWv0c.NaC7Cf,\n .RSWv0c.NaC7Cf .q8U8x > div:nth-child(1) {\n background-color: @surface0 !important;\n color: @text !important;\n }\n\n .DxHbyd {\n background-color: @surface2 !important;\n }\n\n .dg6jd {\n color: @text !important;\n }\n\n /* mobile ui */\n /* header background & search bar */\n .v6U7rf {\n background-color: @base;\n }\n\n .zGVn2e,\n .u4frDf {\n background: @surface0 !important;\n }\n\n /* search suggestions */\n .K4VNlb,\n .Sl6fgd.A7Yvie,\n .Sl6fgd .zGVn2e,\n .UUbT9 {\n background-color: @surface0;\n border-color: @surface0 !important;\n }\n .sb43 {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n /* text */\n .SAuUUd-z5C9Gb-fmcmS,\n .tJaMb,\n .TElO2c,\n .cQp1Ab {\n color: @text !important;\n }\n\n .s49v2 {\n b,\n span {\n color: @text !important;\n }\n }\n\n .ob9lvb {\n color: @subtext0;\n }\n\n /* borders */\n .Dgr5Hb,\n .GqbEwc {\n border-color: @surface0 !important;\n }\n\n #gsr {\n background-color: @mantle;\n }\n\n .Ww4FFb {\n box-shadow: 0 0 0 1px @base;\n }\n\n .Faw6Fe,\n .GpOXq {\n border-color: @surface0 !important;\n }\n\n .zGVn2e,\n .jh86Nb {\n border-color: @surface1 !important;\n }\n\n /* Featured snippets */\n @media (prefers-reduced-motion: no-preference) {\n .c2xzTb .ILfuVd b {\n background: linear-gradient(\n 90deg,\n fade(@accent-color, 30%) 50%,\n #0000 50%\n )\n no-repeat 75% 0;\n background-size: 200% 100%;\n }\n }\n\n .pHiOh,\n a.pHiOh {\n color: @subtext1 !important;\n }\n a {\n color: @blue;\n }\n .RNNXgb {\n background: @surface0;\n border-color: @surface1;\n }\n .RNNXgb:hover,\n .sbfc .RNNXgb {\n background: @surface0 !important;\n border-color: @surface0;\n box-shadow: 0 1px 6px 0 @crust;\n }\n .minidiv .RNNXgb {\n background: @surface0;\n border-color: @surface1;\n &:hover {\n box-shadow: 0 4px 12px @crust;\n }\n }\n .HSryR .KsRP6 {\n border-color: @surface2;\n }\n .emcav .RNNXgb {\n box-shadow: 0 1px 6px 0 @crust;\n background: @surface0;\n border-color: @surface0;\n }\n .aajZCb {\n background: @surface0;\n box-shadow: 0 4px 6px 0 @crust;\n }\n .xtSCL {\n border-top-color: @surface2;\n }\n .sbct:hover {\n background-color: @surface1;\n }\n .WggQGd {\n color: @mauve !important;\n }\n .JCHpcb {\n color: @subtext0;\n }\n .JCHpcb:hover {\n color: @blue;\n }\n .wM6W7d,\n .ABAbCc {\n color: @text;\n }\n .uDetx {\n fill: @text;\n }\n .ExCKkf,\n .BjWz4c {\n color: @subtext0;\n }\n .ACRAdd {\n border-left-color: @overlay0;\n }\n .Pvpvv {\n background-color: @crust;\n border-color: @surface1;\n color: @text;\n }\n .w9dUj {\n color: @text !important;\n }\n .Pvpvv .zE5Aq,\n .adnFRd,\n .XfJHbe {\n color: @blue;\n }\n .CS4h3e {\n background-color: @subtext0;\n }\n .Pvpvv .xyGai {\n color: @text;\n }\n #SIvCob {\n color: @text;\n }\n .gb_Jc a.gb_B,\n .gb_Jc span.gb_B {\n color: @text;\n }\n .gb_Jc svg,\n .gb_Oc.gb_Sc svg,\n .gb_Jc .gb_ad .gb_id,\n .gb_Jc .gb_ad .gb_Ic,\n .gb_Jc .gb_ad .gb_cd,\n .gb_Oc.gb_Sc .gb_id {\n color: @text;\n }\n .gb_Ka svg,\n .gb_Oc svg,\n .gb_ad .gb_id,\n .gb_0c .gb_id {\n color: @text;\n }\n .gLFyf {\n color: @text;\n }\n .QCzoEc {\n color: @overlay2;\n }\n .szppmdbYutt__middle-slot-promo {\n color: @text;\n }\n .gb_Jc .gb_Ud button:hover svg,\n .gb_Jc .gb_d:hover {\n background-color: @surface0;\n }\n .gb_Jc .gb_Ud.gb_qe button:hover svg,\n .gb_Ud button:hover svg,\n .gb_d:hover {\n background-color: @surface0;\n }\n .gb_We {\n background: @mantle;\n color: @text;\n }\n a.gb_B,\n span.gb_B {\n color: @text;\n }\n .gb_zc div:first-child {\n color: @text;\n }\n .gb_zc > * {\n color: @subtext0;\n }\n .ClJ9Yb {\n color: @subtext0;\n }\n .sfbg {\n background-color: @base;\n }\n .jfN4p,\n .lnXdpd:not([src^=\"/logos/doodles/\"]) {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n .aXBZVd {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n .zgAlFc {\n color: @blue;\n }\n .fLciMb {\n color: @text;\n }\n .d2IKib {\n color: @red;\n }\n .fLciMb:hover {\n background-color: @surface0;\n }\n .kno-ftr.rpBMYb {\n color: @subtext0;\n }\n .aTI8gc {\n color: @text;\n }\n .wwUB2c {\n color: @subtext0;\n }\n .dhERQc {\n color: @base !important;\n background-color: @blue !important;\n }\n .z1asCe,\n .ikb4Bb {\n color: @subtext1 !important;\n }\n .rsGxI.Ww4FFb,\n .Ww4FFb {\n background-color: @base;\n }\n .RES9jf {\n color: @text;\n }\n .CSkcDe,\n .related-question-pair div.iDjcJe {\n color: @text;\n }\n .cUnQKe .ILfuVd b,\n .cUnQKe .QBI8hf b {\n background-color: fade(@blue, 25%);\n color: @text;\n }\n .cUnQKe .ILfuVd,\n .cUnQKe .UiGGAb.ILfuVd {\n color: @subtext1;\n }\n .ZYHQ7e {\n color: @subtext0;\n }\n .VuuXrf {\n color: @text;\n }\n .hb8SAc,\n .gb_Oc a.gb_H,\n .gb_Oc span.gb_H {\n color: @text;\n }\n .TQc1id .I6TXqe {\n border-color: @surface2;\n }\n .I6TXqe,\n .zaokob {\n background: @base;\n }\n .tw-lliw:hover,\n .tw-lliw:focus {\n background-color: @surface0;\n }\n .language_list_languages.tw-ll-top::after {\n background: linear-gradient(\n to bottom,\n rgba(red(@base), green(@base), blue(@base), 0),\n rgba(red(@base), green(@base), blue(@base), 1)\n );\n }\n .HsZQAe {\n border-bottom-color: @surface2;\n }\n .KLEmSd {\n border-bottom-color: @surface1;\n }\n .NtaMpb .niO4u,\n .nZWEZc .ttwCMe,\n .xNzW0d,\n .lWzCpb {\n background-color: @base;\n }\n .aURkK {\n border-left-color: @surface1;\n }\n .iRPzcb {\n border-bottom-color: @surface1;\n }\n .related-question-pair .d0fCJc {\n color: @text;\n }\n cite,\n cite a:link,\n cite a:visited {\n color: @subtext0;\n }\n .WZ8Tjf,\n .EZAeBe,\n .F0gfrd {\n color: @subtext0;\n }\n .yDYNvb.lyLwlc {\n color: @text;\n }\n .H9lube {\n background-color: @base;\n border-color: @surface2;\n }\n .Bi9oQd {\n background-color: @surface1;\n }\n .akqY6 {\n background: @surface1;\n }\n .KFFQ0c .YfftMc,\n .KFFQ0c .YfftMc span,\n .KFFQ0c .YfftMc div,\n .KFFQ0c .YfftMc a,\n g-menu.DWsAYc g-menu-item a.K1yPdf,\n .f3LoEf,\n .TXBhSe:hover,\n .TXBhSe:not(:hover),\n .r025kc.lVm3ye,\n .Bo9xMe,\n .oyj2db {\n color: @subtext0;\n }\n .dyjrff,\n .LEwnzc {\n color: @subtext1;\n }\n .ZFiwCf {\n background-color: @surface0;\n &:hover {\n background-color: @surface1;\n }\n }\n .LGwnxb,\n .WGwSK {\n color: @text;\n }\n .EsIlz {\n background-color: @base;\n border-color: @surface1;\n }\n .O7G3Gd {\n color: @text;\n &:hover {\n color: @blue;\n }\n }\n .appbar {\n background: @base;\n border-top-color: @surface1;\n }\n .bSeRjc:hover .fKmH1e {\n color: @subtext1;\n background-color: @surface0;\n }\n .bSeRjc:hover div[aria-expanded=\"true\"] .fKmH1e,\n div[aria-expanded=\"true\"] .fKmH1e {\n background-color: fade(@blue, 25%);\n color: @blue;\n }\n .LHJvCe,\n .vqseUe,\n .dMCttd {\n color: @subtext0;\n }\n .dG2XIf .xpdbox .yc7KLc {\n background-color: @base;\n }\n .URgIvb {\n border-color: @blue;\n background-color: @blue;\n }\n .pdpvld {\n color: @green;\n }\n .YrbPuc {\n color: @subtext1;\n }\n .SRfaKe,\n .SRfaKe h2 {\n background-color: @mantle;\n }\n .y6CIle {\n background-color: @surface0;\n }\n .Yt787,\n .vDF3Oc.vDF3Oc .R8BTeb {\n color: @text;\n }\n .IDFSOe {\n background-color: @surface2;\n }\n .ffmmcd,\n .u7yw9 .WeviRb {\n border-color: @surface1;\n }\n .wdQNof {\n border-color: @surface1;\n background-color: @base;\n }\n .PewBWb {\n border-top-color: @surface1;\n }\n .eadHV.Ses7yd {\n color: @text !important;\n }\n .f,\n .j04ED,\n .j04ED a,\n .j04ED a:link,\n .XaIwc {\n color: @subtext0 !important;\n }\n #_Xg6uZYKGBYCDhbIPvK2s2AI_27\n > div:nth-child(3)\n > g-right-button:nth-child(1)\n > g-fab:nth-child(1),\n g-right-button.wgbRNb > g-fab:nth-child(1) {\n background-color: @crust !important;\n }\n .gb_2e {\n background-color: @surface0;\n }\n .gb_Ec {\n div:first-child {\n color: @text;\n }\n > * {\n color: @subtext0;\n }\n }\n .kLhEKe {\n background-color: @base;\n }\n .S8ee5.CwbYXd {\n color: @text;\n }\n .S8ee5 {\n background: @surface0;\n }\n .S8ee5:hover {\n background: @surface1;\n }\n .rhHIGd {\n background-color: @surface2;\n }\n .sY7ric {\n color: @text;\n }\n .I6a0ee {\n background-color: @base;\n border-color: @surface2;\n color: @text;\n }\n .I6a0ee:hover {\n background-color: @mantle;\n border-color: @surface2;\n }\n .I6a0ee:focus {\n background-color: @crust;\n border-color: @surface2;\n }\n .pxhZNb {\n background-color: @surface0 !important;\n color: @text;\n }\n .d2F2Td {\n color: @text;\n }\n .c07z9 {\n color: @subtext0;\n }\n .c07z9 a,\n .c07z9 a:active,\n .c07z9 a:link {\n color: @text;\n text-decoration-color: @subtext0;\n }\n .wHYlTd {\n color: @subtext0;\n }\n .dG2XIf .c2xzTb .wDYxhc:first-child {\n background: @base;\n }\n .fm06If .ILfuVd,\n .c2xzTb .ILfuVd,\n .Jb0Zif .c2xzTb .ILfuVd {\n color: @text;\n }\n .fm06If .ILfuVd b,\n .c2xzTb .ILfuVd b {\n background-color: fade(@blue, 25%);\n color: @text;\n }\n .GKS7s {\n background: @surface0;\n border-color: @surface1;\n box-shadow: inset 0 0 0 1px @surface2;\n }\n .GKS7s:hover {\n background-color: @surface1 !important;\n border-color: @surface2;\n }\n .yXK7lf em {\n color: @text;\n }\n .Lb0dA:hover {\n background-color: @surface0;\n }\n .Lb0dA[aria-expanded=\"true\"]:hover .EGarzf {\n color: @blue;\n }\n .Lb0dA[aria-expanded=\"true\"] {\n background-color: fade(@blue, 25%);\n }\n .BaegVc:hover {\n background-color: @surface0;\n }\n .hdtb-tl-sel .BaegVc {\n background-color: fade(@blue, 25%);\n }\n .BaegVc:focus {\n background-color: fade(@blue, 25%);\n }\n .TZqsAd {\n background: @overlay0;\n }\n .FalWJb {\n background: @base;\n }\n .YeThId {\n border-top-color: @surface1;\n }\n .k8XOCe {\n background-color: @surface0;\n }\n .s75CSd {\n color: @text;\n }\n .ZkkK1e,\n .uAbMZd {\n background: @base;\n border-color: @surface1;\n &:hover {\n background: @surface0;\n }\n }\n .QjI2jc {\n color: @subtext0;\n }\n .lhLbod {\n color: @subtext0;\n }\n .nr7I6e div[aria-expanded=\"true\"] .F75bid,\n .nr7I6e div[aria-expanded=\"true\"]:hover .fFI3rb .F75bid {\n color: @blue;\n }\n .F75bid {\n color: @subtext0;\n }\n div[aria-expanded=\"true\"] .fFI3rb {\n background-color: fade(@blue, 25%) !important;\n }\n div[aria-expanded=\"true\"]:hover .fFI3rb:hover {\n background-color: fade(@blue, 25%) !important;\n }\n .MAMMm {\n background: @mantle;\n box-shadow: 0 2px 6px @crust !important;\n }\n [selected].nWtjMe {\n background: fade(@blue, 25%) !important;\n }\n .uZNuIf:hover {\n background-color: @surface0;\n color: @text;\n }\n [selected].nWtjMe .FMKtTb {\n color: @text;\n }\n .nWtjMe .FMKtTb {\n color: @subtext0;\n }\n .GKS7s .FMKtTb,\n .GKS7s .RWhoyd.mol54e {\n color: @text;\n }\n .ePSouf .FMKtTb {\n color: @subtext0;\n }\n .NkCsjc:hover {\n background-color: @surface0 !important;\n color: @text;\n }\n .nr7I6e div[aria-haspopup=\"true\"]:hover .F75bid {\n color: @text;\n }\n a.hisnlb {\n background: fade(@overlay2, 25%);\n }\n div[aria-expanded=\"true\"] .fFI3rb,\n div[aria-expanded=\"true\"]:hover .fFI3rb:hover {\n background-color: @surface0 !important;\n }\n .hdtb-tl-sel .BaegVc .WjMmQ:hover {\n color: @blue;\n }\n .hdtb-mn-hd {\n color: @subtext0;\n }\n .hdtb-mn-hd:hover {\n color: @text;\n }\n .fSnalc {\n stroke: @blue;\n }\n .oOg6Ne {\n stroke: @yellow;\n }\n .ZqPjbb {\n stroke: @red;\n }\n .aPiskd {\n stroke: @green;\n }\n .s8GCU {\n background-color: @base;\n }\n .Lj9fsd {\n background-color: @base;\n }\n .jZWadf {\n background-color: @base;\n }\n .rQEFy,\n .rQEFy:hover {\n border-color: fade(@blue, 25%);\n background-color: fade(@blue, 25%);\n }\n .gbZSUe {\n color: @text;\n }\n .gbZSUe:hover {\n background: @surface0;\n }\n .XZ5MVe {\n color: @blue;\n }\n a:visited {\n color: @mauve;\n }\n .SvoXfb > .x5f7Bc {\n fill: @subtext0;\n }\n .SvoXfb:hover > .x5f7Bc {\n fill: @text;\n }\n .SvoXfb:hover {\n background-color: @surface0;\n }\n .IsZvec,\n .yxAsKe {\n color: @subtext0;\n }\n .zqrO0.k0Jjg .QuU3Wb,\n .zqrO0.k0Jjg:hover .QuU3Wb {\n color: @subtext1;\n }\n .uo4vr {\n color: @subtext0;\n }\n .minidiv .sfbg {\n background: @base;\n box-shadow: 0 1px 6px 0 @crust;\n }\n .aqCVJb {\n background-color: @blue !important;\n border-color: @blue !important;\n }\n .T8VaVe {\n color: @blue;\n }\n .tw-ta,\n #tw-source-text-container .tw-ta,\n #tw-source-rmn-container .tw-ta {\n color: @text;\n }\n .tw-bilingual-marked {\n border-color: @blue;\n }\n #tw-target {\n background-color: @surface0;\n }\n .tw-data-placeholder {\n color: @text;\n }\n .j1iyq {\n border-color: @surface2;\n }\n .w8qArf .fl {\n color: @text !important;\n }\n .HSryR a.B1uW2d {\n border-bottom-color: @surface2;\n }\n .usJj9c .zz3gNc {\n color: @text;\n }\n .Ss2Faf a {\n color: @text;\n }\n .aCOpRe em,\n .yXK7lf em {\n color: @text;\n }\n .FR7ZSc .niO4u {\n background-color: @base;\n border-color: @surface2;\n color: @blue;\n }\n .g {\n color: @text;\n }\n .VSHxQ {\n color: @subtext0;\n }\n .cF4V5c {\n background-color: @crust !important;\n }\n .cF4V5c g-menu-item a,\n .cF4V5c g-menu-item a:visited,\n .cF4V5c g-menu-item a:hover {\n color: @text;\n }\n .cF4V5c:hover g-menu-item:hover a,\n .cF4V5c:hover g-menu-item a:visited,\n .cF4V5c g-menu-item a:hover {\n background-color: @surface0;\n }\n .GZnQqe.LGiluc {\n border-top-color: @surface2 !important;\n }\n .pkWBse {\n box-shadow: 1px 1px 15px 0 @crust;\n }\n .dG2XIf {\n background: @base;\n border-color: @surface0 !important;\n }\n .Z0LcW {\n color: @text;\n }\n .i29hTd .qLLird {\n color: @text;\n }\n .i29hTd .kR7nSc {\n color: @text;\n }\n .N6Sb2c {\n color: @subtext0;\n }\n .C9iYEe {\n color: @subtext0;\n }\n .KcXNxb {\n background: @base;\n }\n .ss6qqb .PKDVJd {\n color: @subtext0;\n }\n a.oBa0Fe {\n color: @subtext0;\n }\n .o6juZc {\n background-color: @surface0;\n }\n .o6juZc:hover {\n background-color: @surface0;\n box-shadow: 0 4px 12px @crust;\n }\n .W6pGoe {\n background: @surface0;\n box-shadow: 0 4px 6px 0 @crust;\n }\n .WdWr7c {\n border-top-color: @surface2;\n }\n .sU3bKf {\n color: @text;\n }\n .O5OUld {\n color: @subtext0;\n }\n .zP7KFe {\n background: @surface1;\n }\n .O5OUld:hover {\n color: @blue;\n }\n .og3lId {\n color: @text;\n }\n .M3w8Nb .o6juZc {\n box-shadow: 0 1px 6px 0 @crust;\n }\n .r8xEL {\n color: @text;\n }\n .ZZ7G7b {\n color: @text;\n border-color: @surface1;\n }\n .NZmxZe {\n background-color: @base;\n border-color: @surface1;\n color: @text;\n }\n .NZmxZe:not(.rQEFy):hover,\n .cj2HCb.iuN0sf .w6PoOe:hover,\n .CgGjZc:hover {\n background-color: @surface0;\n border-color: @surface1;\n color: @text;\n }\n .ssfWCe .ZXJQ7c,\n .cj2HCb.iuN0sf .w6PoOe,\n .G2XB8d,\n .cj2HCb.iuN0sf .w6PoOe .KA8Jyb {\n color: @subtext0;\n .KA8Jyb:hover {\n fill: @subtext1;\n }\n }\n .KA8Jyb {\n fill: @subtext0;\n }\n .CgGjZc:hover .G2XB8d {\n color: @subtext1;\n }\n .o6OF0 {\n background-color: @surface1;\n &:hover {\n background-color: @surface2;\n }\n .SHFPkb {\n color: @text;\n }\n .PnfqLc {\n color: @subtext0;\n }\n }\n .zbRPDe,\n .scU1d {\n color: @text;\n }\n .UafVBb {\n background-color: @base;\n border-color: @surface2;\n }\n .mEQved {\n color: @subtext0;\n }\n .goxjub {\n > path:nth-child(1) {\n fill: @blue;\n }\n > path:nth-child(2) {\n fill: @green;\n }\n > path:nth-child(3) {\n fill: @yellow;\n }\n > path:nth-child(4) {\n fill: @red;\n }\n }\n [fill=\"#34a853\"] {\n fill: @green;\n }\n [fill=\"#4285f4\"] {\n fill: @blue;\n }\n [fill=\"#ea4335\"] {\n fill: @red;\n }\n [fill=\"#fbbc05\"] {\n fill: @yellow;\n }\n .ssfWCe .ZXJQ7c:hover {\n background-color: @surface0;\n color: @text;\n }\n .qcTKEe {\n background-color: @base;\n }\n .ooPrBf {\n background: @base;\n }\n .r9PaP {\n color: @subtext0;\n }\n .r9PaP:hover {\n color: @blue;\n }\n .H1KrKd {\n fill: @subtext0;\n }\n .cEPPT {\n border-bottom-color: @surface1;\n }\n .Ix6LGe {\n background: @base;\n box-shadow: 0 2px 10px 0 @crust;\n }\n .Hm7Qac:hover,\n .EuKAde {\n background-color: @surface0;\n }\n .igM9Le {\n color: @text;\n }\n .irf0hb {\n box-shadow: 1px 1px 15px 0 @crust;\n }\n .gb_Mc .gb_Vd button:hover svg,\n .gb_Mc .gb_d:hover {\n background-color: @surface0;\n }\n .gb_Mc svg,\n .gb_Rc.gb_Vc svg,\n .gb_Mc .gb_dd .gb_ld,\n .gb_Mc .gb_dd .gb_Lc,\n .gb_Mc .gb_dd .gb_fd,\n .gb_Rc.gb_Vc .gb_ld {\n color: @text;\n }\n .cEW58 {\n background-color: @surface0;\n }\n .dyAbMb {\n fill: @subtext0;\n }\n .zItAnd,\n .zItAnd:link,\n .zItAnd:visited,\n .zItAnd:hover,\n .zItAnd:active {\n color: @text;\n }\n .zItAnd {\n background-color: @base;\n border-color: @surface1;\n }\n .zItAnd:not(.MgQdud):hover {\n background-color: @surface0;\n border-color: @surface1;\n }\n .fKmH1e {\n background-color: @base;\n border-color: @surface1;\n color: @subtext0;\n }\n .fKmH1e:hover {\n background-color: @surface0;\n border-color: @surface1;\n }\n .nfSF8e,\n .WRhYSc {\n color: @subtext0;\n }\n .nfSF8e:hover,\n .WRhYSc:hover {\n background-color: @surface0;\n color: @subtext0;\n }\n .ssJ7i {\n color: @text;\n }\n .iAIpCb {\n color: @subtext0;\n }\n .KMdzJ,\n .ss6qqb .oBrLN,\n .ylgVCe {\n color: @subtext1;\n }\n .PmPt7d {\n color: @subtext0;\n }\n .gb_Mc a.gb_E,\n .gb_Mc span.gb_E {\n color: @text;\n }\n a.gb_E,\n span.gb_E {\n color: @text !important;\n }\n .RzdJxc {\n border-top-color: @surface2;\n }\n .rKnmn {\n border-top-color: @surface2;\n }\n .FzCfme {\n color: @subtext0;\n }\n .hMJ0yc {\n color: @subtext0;\n }\n .yg51vc {\n background-color: @base;\n }\n .hdtb-mitem a {\n color: @subtext0;\n }\n .hdtb-mitem .GOE98c,\n .hdtb-mitem a,\n .hdtb-mitem.hdtb-msel,\n .t2vtad {\n color: @subtext0;\n }\n .t2vtad:not(.hdtb-tl-sel) {\n color: @subtext0;\n }\n .dG2XIf .xpdopen .mJ2Mod {\n border-color: @surface1;\n }\n .t2vtad:not(.hdtb-tl-sel):hover {\n background-color: @surface0;\n border-color: @surface1;\n color: @text;\n box-shadow: 0 1px 1px @crust;\n }\n .hdtb-mitem:hover .GOE98c:hover,\n .hdtb-mitem:hover a,\n .hdtb-mitem.hdtb-msel,\n .t2vtad:hover {\n color: @blue;\n }\n .w6PoOe {\n color: @subtext0;\n }\n .w6PoOe:hover {\n color: @text;\n }\n .Lj9fsd.DU1Mzb {\n background-color: @base;\n box-shadow: 0 1px 6px 0 @crust;\n .o6juZc {\n border-color: @surface1 !important;\n }\n }\n .dZ5aUe .vbLSne .MjJqGe:not(.xvfzbc):hover {\n background-color: @surface0;\n }\n .FjVBEd {\n color: @green;\n }\n title-with-lhs-icon:hover .ekf0x h3 {\n color: @blue;\n }\n .GmE3X {\n color: @text;\n }\n .iv236 {\n color: @text;\n }\n .GLcBOb {\n border-bottom-color: @surface1;\n }\n .ss6qqb .Ui2TZ {\n color: @text;\n }\n .wx62f {\n color: @subtext0;\n }\n #rhs .u7yw9 {\n border-left-color: @surface1;\n }\n .ss6qqb .Jk5Tjc {\n border-color: @surface2;\n }\n #rhs .u7yw9 .cLjAic {\n border-bottom-color: @surface1;\n }\n .JNkvid .HnYYW {\n color: @text;\n }\n .aokhrd .TZahnb {\n border-left-color: @surface1;\n }\n .Cx1ZMc {\n color: @subtext0;\n }\n .CBPSbf {\n background-color: @base;\n }\n .E74aCb {\n color: @text;\n }\n .OE86Gc {\n background-color: @base;\n color: @text;\n fill: @text;\n }\n .c72nic {\n color: @text;\n }\n .GXMTjb {\n background-color: @base;\n border-color: @surface0;\n }\n .A9y7kf {\n color: @subtext0;\n }\n .OE86Gc a {\n color: @blue;\n }\n .Es2Et {\n color: @subtext0;\n }\n .KwJT0.VqKh3b div div {\n background-color: @base;\n fill: @text;\n color: @text;\n border-color: @surface1;\n }\n .rx7XFb {\n background-color: @surface0;\n }\n .VP31Vb {\n color: @text;\n }\n .HXQjqf {\n background-color: fade(@blue, 25%);\n color: @blue;\n }\n .SW5pqf {\n color: @blue;\n }\n .rQEFy:hover {\n color: @blue;\n }\n .hdtb-tl-sel {\n border-color: @surface2;\n background: @surface0;\n color: @text;\n }\n .hdtb-tl-sel:focus {\n border-color: @surface2;\n background: @surface0;\n color: @blue;\n }\n .t2vtad:active,\n .t2vtad:not(.hdtb-tl-sel):hover:active {\n background-color: @surface0 !important;\n box-shadow: inset 0 1px 2px @crust !important;\n }\n .gTl8xb {\n border-color: @subtext0 transparent;\n }\n .hdtb-mn-hd:hover .gTl8xb {\n border-color: @text transparent;\n }\n .h3L8Ub .yMAEcf {\n background: @surface0;\n border-color: @surface2;\n }\n .ynRric {\n color: @subtext0;\n }\n .cRV9hb .pcTkSc .wM6W7d {\n color: @text;\n }\n .h3L8Ub .yMAEcf.sbhl {\n background-color: @surface1;\n }\n .sbhl {\n background: @surface1;\n }\n .CjiZvb,\n .GZnQqe.EpPYLd:active {\n background-color: @surface0;\n }\n .PyJv1b {\n color: @text;\n }\n .REySof {\n color: @overlay2 !important;\n }\n .NQyKp {\n color: @surface0 !important;\n background: @accent-color !important;\n }\n .b0Xfjd {\n color: @base !important;\n }\n .LiOdre {\n background-color: @base;\n border-color: @surface1;\n }\n .LiOdre:hover {\n background-color: @mantle;\n border-color: @surface2;\n }\n .LiOdre:focus {\n border-color: @blue;\n }\n .mfsgsd {\n color: @text;\n }\n .GCSyeb {\n background: @surface1;\n }\n .IVvPP .cLjAic.WY0eLb,\n .Hwkikb.WY0eLb {\n border-left-color: @surface1;\n }\n .mQo3nc {\n background-color: @surface0;\n color: @subtext0 !important;\n }\n .cfBJGe {\n color: @text;\n }\n .f6F9Be {\n background: @mantle;\n }\n .KwU3F {\n color: @blue;\n }\n .b0KoTc {\n color: @text;\n }\n .dfB0uf {\n color: @text;\n }\n .unknown_loc {\n background: @text;\n }\n .GS5rRd {\n color: @blue;\n }\n .xSQxL {\n color: @blue;\n }\n .smiUbb {\n color: @text;\n }\n .b2hzT {\n border-bottom-color: @surface0;\n }\n #swml {\n border-left-color: @surface0;\n }\n .KXbwLb {\n background-color: @surface2;\n }\n .WZH4jc .VknLRd .GNJvt {\n background: @surface0;\n }\n .WZH4jc .VknLRd:hover .GNJvt {\n background: @surface1;\n }\n .GNJvt {\n color: @text;\n }\n .fJOpI.H9lube {\n background-color: @blue !important;\n border-color: @blue;\n }\n .XNo5Ab.XNo5Ab {\n color: @base !important;\n fill: @base !important;\n }\n .Ss2Faf.boljiHqtXe7__place-qa-title {\n color: @text !important;\n }\n .xEzgBc {\n color: @text !important;\n }\n .Ss2Faf.sq4Bpf {\n color: @text !important;\n }\n .ea0Lbe {\n background: @surface0;\n }\n .f6GA0,\n .CacfB,\n .Ua7Yuf {\n background: @base;\n }\n .DV7the {\n color: @blue;\n }\n .ZeVBtc {\n color: @subtext0;\n }\n .cB9M7 {\n background-color: @surface0;\n border-color: @surface1;\n color: @text;\n &:hover {\n border-color: @surface2;\n }\n &:focus {\n border-color: @blue;\n }\n }\n .Qwbd3 {\n background: @surface0;\n color: @text;\n border-color: @surface1;\n &:hover {\n background: @surface1;\n border-color: @surface2;\n }\n }\n .ArIAXb {\n fill: @surface0;\n }\n .qOFLsb {\n fill: @surface0;\n }\n .aHK1bd {\n color: @subtext0;\n }\n .diOlIe {\n border-top-color: @overlay0;\n }\n .p4pvTd {\n color: @text;\n }\n .gIYJUc {\n background: @base !important;\n border-color: @surface1 !important;\n }\n .Gdd5U > g:nth-child(2) {\n > circle:nth-child(1) {\n fill: @green !important;\n }\n > circle:nth-child(2) {\n fill: @blue !important;\n }\n > path:nth-child(3) {\n fill: @red !important;\n }\n > path:nth-child(4) {\n fill: @yellow !important;\n }\n > path:nth-child(5) {\n fill: @blue !important;\n }\n }\n .CbAZb {\n background: @base;\n border-bottom-color: @surface0;\n }\n .S8wJ3 {\n color: @text !important;\n }\n .ZI7elf {\n color: @text !important;\n }\n .tGS0Nc {\n color: @text;\n }\n .kzt0Nc a {\n color: @subtext0 !important;\n }\n .fgc1P,\n .N7KPxb {\n border-top-color: @surface0 !important;\n }\n .kQEH5b {\n color: @subtext0 !important;\n }\n .kNKdL {\n color: @text !important;\n }\n .q0yked:hover {\n background-color: @mantle !important;\n }\n .Oz5Rbb:hover {\n background: @mantle !important;\n }\n .lwwARb {\n background-color: @crust !important;\n }\n .LO47Ff {\n color: @text;\n }\n .j8PBfc {\n color: @subtext0;\n }\n .act-tim-txt-cnt {\n color: @text;\n }\n .act-switch-area {\n background-color: @base !important;\n }\n .EwDHG,\n .vNdLpe,\n .vNdLpe:visited {\n color: @subtext0 !important;\n }\n // \"Looking for results in English?\" popup\n [style*=\"background:#1f1000;border:1px solid #502900\"],\n [style*=\"background:#feefc3;border:1px solid #fdd663\"] {\n background: @mantle !important;\n border-color: @surface0 !important;\n box-shadow: 0 2px 4px @mantle !important;\n [style*=\"color:#bdc1c6\"],\n [style*=\"color:#202124\"] {\n color: @text !important;\n }\n }\n // translate this page label\n .eFM0qc.BCF2pd {\n background: @base !important;\n }\n // expand related question icon\n .aj35ze {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n // tabs\n [selected].YmvwI {\n color: @text;\n border-bottom-color: @text;\n }\n .YmvwI {\n color: @subtext0;\n }\n // search bar buttons popups\n [style^=\"background: rgb(32, 33, 36); border: 1px solid rgb(60, 64, 67);\"] {\n background: @mantle !important;\n border-color: @overlay0 !important;\n box-shadow: @mantle 1px 2px 4px !important;\n color: @text !important;\n [style^=\"border-style: solid;\"] {\n border-color: @overlay0 transparent !important;\n }\n }\n // google apps button\n .gb_F .gb_E,\n .gb_F .gb_D {\n fill: @text;\n }\n // translate popup\n .t4wgMc {\n background: @mantle;\n }\n .ELfqBe:hover,\n .ELfqBe:focus {\n background: @surface0;\n }\n .JFeuTc {\n color: @text;\n }\n // skip to content\n .S6VXfe {\n background: @base;\n }\n // selected image\n .qyKxnc.FnEtTd .srrRv {\n background: fade(@blue, 10%);\n }\n // images page sticky suggestions header\n .JiJthb,\n .JiJthb .GKS7s:not([selected]) {\n background: @mantle;\n }\n .JiJthb .F9Idpe.vezEod {\n background: linear-gradient(\n to left,\n transparent 0%,\n @mantle 60%,\n @mantle\n );\n }\n // footer logo\n [style^=\"background:url(/images/nav_logo321.webp)\"] {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n // tweets horizontal list\n g-right-button,\n g-left-button {\n & > g-fab {\n background: @crust !important;\n border-color: @surface0;\n }\n }\n .vwfsqc {\n .QuU3Wb {\n color: @text;\n }\n }\n // image overlays\n .yUzGqc.wr8GYd {\n background: fade(@crust, 75%);\n color: @text;\n }\n // google lens icon hover\n .ig2Tkd:hover:not(.RDPZE) {\n background: fade(@mantle, 80%);\n }\n // image resolution\n .UWuvyf {\n background-color: fade(@crust, 80%);\n color: @text;\n }\n // image hover shadow\n .mkpRId.qyKxnc:hover .F0uyec {\n background: fade(@crust, 5%);\n box-shadow: 0 2px 12px 0 @crust;\n }\n // advanced search\n input.jfk-textinput,\n .gGbPid {\n background: @base;\n color: @text;\n border-color: @overlay0;\n }\n .goog-menu {\n background: @mantle;\n }\n .goog-menuitem-highlight,\n .goog-menuitem-hover {\n background: @surface0;\n border-color: @surface0;\n }\n .goog-menuitem,\n .goog-menuitem-highlight .goog-menuitem-content,\n .goog-menuitem-hover .goog-menuitem-content {\n color: @text;\n }\n .goog-flat-menu-button-hover {\n border-color: @overlay2;\n .goog-flat-menu-button-dropdown {\n border-color: @overlay2 transparent;\n }\n }\n .goog-flat-menu-button-dropdown {\n border-color: @overlay0 transparent;\n }\n div.otByu div.FAcADc,\n div.lFApYd,\n .jfk-radiobutton-label {\n color: @subtext1;\n }\n color: @subtext0;\n }\n @media (prefers-color-scheme: light) {\n body {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n body {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n}\n\n@-moz-document regexp(\"^https?://(ogs\\\\.)?google\\\\..*\")\n{\n @media (prefers-color-scheme: light) {\n body {\n #catppuccin(@lightFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: dark) {\n body {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n #catppuccin(@lookup, @accent) {\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 .aRDKUe {\n .rRF0wd {\n fill: @yellow !important;\n }\n .ub0gT {\n fill: @base !important;\n }\n .Pzuhxc {\n color: @text !important;\n &:hover {\n background-color: @surface2 !important;\n }\n }\n .hCDve {\n color: @text !important;\n }\n .WkuXae {\n color: @blue;\n }\n .coHE2 {\n border-color: @surface2 !important;\n &:hover {\n background-color: fade(@blue, 25%);\n }\n }\n .eYSAde {\n color: @text !important;\n }\n .Lvwayc {\n background-color: @surface0 !important;\n }\n .Z6NXed {\n color: @text !important;\n }\n .bMnvr {\n background: @surface1 !important;\n }\n .Wdz6e {\n color: @subtext0 !important;\n }\n .LzIwWe {\n color: @text !important;\n }\n .znj3je {\n color: @text !important;\n }\n .fVFoBd {\n color: @text !important;\n }\n .cllK4d {\n background: @surface0 !important;\n color: @subtext0 !important;\n }\n .aFCkf {\n background: @surface0 !important;\n color: @blue !important;\n }\n .DgDbFe .vZvJBb:not(:first-child) .BVnP4c::before {\n color: @text !important;\n }\n .qLP7kc .jFfZdd {\n background: @base !important;\n }\n .Z6NXed:hover {\n background-color: @surface1 !important;\n }\n }\n .nz9sqb.EHzcec {\n background: var(--gm3-sys-color-surface-container-high, @surface0);\n .LVal7b {\n background: var(--gm3-sys-color-surface-container-low, @mantle);\n }\n }\n .nz9sqb {\n .NQV3m {\n color: var(--gm3-sys-color-primary, @blue);\n border-color: var(--gm3-sys-color-outline, @surface2);\n &:hover {\n background-color: fade(@blue, 25%);\n }\n &:focus {\n background-color: fade(@blue, 25%);\n }\n }\n .Rq5Gcb {\n color: @text !important;\n }\n .tX9u1b:hover {\n background-color: @surface0;\n }\n }\n .nz9sqb.o07G5 .tX9u1b:active,\n .nz9sqb.o07G5 .tX9u1b:active:focus,\n .nz9sqb.o07G5 .tX9u1b:active .Rq5Gcb,\n .nz9sqb.o07G5 .tX9u1b:active:hover .Rq5Gcb {\n background-color: @surface0;\n }\n .aRDKUe .pRjiJb,\n .aRDKUe .DmSTqc {\n color: @text;\n }\n .aRDKUe .idKC9b,\n .aRDKUe .MbHqJ {\n color: @subtext0;\n }\n .aRDKUe .GXg3Le {\n color: @blue;\n }\n .aRDKUe .G5bXNb {\n background-color: @mantle;\n &:hover {\n background-color: @base;\n }\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 Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/google",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/google",
"version": "0.3.2",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle",
"description": "Soothing pastel theme for Google",
"author": "Catppuccin",
"license": "MIT",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "latte",
"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 Google",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/google",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.css",
"name": "Google Catppuccin",
"originalDigest": "61ef848dfb8d290c34ea5a70c06c8915fcbf7144",
"_id": "a8d95ec4-f0d8-4874-b30c-e27b447e70b4",
"_rev": 1728231639586,
"id": 12,
"etag": "W/\"ac7e91bf6d0126f8b9b8f4b2ce333a4807748d706ecd97bd5ab441a59a3e4106\"",
"updateDate": 1728231639428
},
{
"enabled": true,
"installDate": 1715535918093,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Arch Wiki Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/arch-wiki\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/arch-wiki\n@version 0.0.9\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/arch-wiki/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aarch-wiki\n@description Soothing pastel theme for Arch Wiki\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('wiki.archlinux.org') {\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor, @accentColor);\n }\n }\n @media (prefers-color-scheme: light) {\n :root {\n #catppuccin(@lightFlavor, @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 #content table,\n #content h1,\n #content h2,\n #content h3,\n #content h4,\n #content h5,\n #content pre,\n #content code,\n #content tt {\n color: @text !important;\n }\n\n body.skin-vector-2022 .vector-sticky-header {\n color: @text !important;\n background-color: @mantle !important;\n border-bottom-color: @blue !important;\n }\n\n #vector-main-menu-pinned-container,\n #vector-page-tools-pinned-container {\n background-color: @base !important;\n }\n\n #ooui-php-191,\n #preferences .mw-htmlform-submit-buttons {\n background-color: @mantle !important;\n }\n\n .mw-echo-ui-notificationItemWidget-content-message-header,\n .oo-ui-labelElement-label {\n color: @text !important;\n }\n\n .oo-ui-optionWidget-selected {\n background-color: @surface2 !important;\n }\n\n .oo-ui-buttonElement-framed.oo-ui-widget-disabled\n > .oo-ui-buttonElement-button {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n filter: brightness(0.4);\n cursor: not-allowed;\n }\n\n .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {\n background-color: @surface1 !important;\n }\n\n .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {\n background-color: @surface2 !important;\n }\n\n .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(odd) td,\n .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled\n .oo-ui-tagMultiselectWidget-handle,\n .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined\n .oo-ui-tagItemWidget.oo-ui-widget-enabled,\n .mw-rcfilters-ui-cell.mw-rcfilters-ui-filterTagMultiselectWidget-views-select,\n .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,\n .oo-ui-popupWidget-popup,\n .mw-echo-ui-notificationItemWidget,\n .mw-echo-ui-placeholderItemWidget {\n background-color: @surface0 !important;\n }\n\n .mw-echo-ui-notificationsInboxWidget-toolbarWrapper {\n background-color: @base !important;\n }\n\n #archnavbar {\n background-color: @mantle !important;\n border-bottom-color: @blue !important;\n }\n .mw-parser-output {\n background-color: @base !important;\n }\n\n .mw-page-container {\n background-color: @base !important;\n }\n\n .vector-header-container {\n background-color: @base !important;\n }\n\n #content,\n header.mw-header li:not(.new),\n #mw-panel-toc,\n #mw-navigation li:not(.new),\n #mw-panel li:not(.new),\n #column-one li:not(.new),\n #footer {\n a:not([role=\"button\"], .new) {\n color: @blue !important;\n }\n }\n\n @media screen {\n html.client-darkmode {\n background-color: @base;\n }\n }\n\n .vector-feature-zebra-design-disabled,\n body {\n background-color: @base;\n }\n\n #archnavbarlogo {\n @svg: escape(\n ''\n );\n background: url(\"data:image/svg+xml,@{svg}\") !important;\n background-size: 190px 40px !important;\n }\n .cdx-text-input__input:enabled:focus {\n border-color: @blue;\n box-shadow: @blue !important;\n }\n\n .archwiki-template-box-tip {\n background-color: fadeout(hsla(90, 90%, 65%, 0.3), 10%) !important;\n border-color: fadeout(hsla(90, 90%, 75%, 0.3), 10%);\n color: @subtext1;\n }\n\n .archwiki-template-box-note {\n background-color: fadeout(hsla(208, 100%, 61%, 0.3), 5%) !important;\n border-color: fadeout(hsla(208, 100%, 81%, 0.3), 5%) !important;\n color: @subtext1;\n }\n\n .archwiki-template-box-warning {\n background-color: fadeout(hsla(7, 99%, 60%, 0.3), 5%) !important;\n border-color: fadeout(hsla(7, 99%, 80%, 0.3), 05%) !important;\n color: @subtext1;\n }\n\n .firstHeading {\n color: @accent-color !important;\n }\n\n #content {\n border-color: @overlay0;\n }\n\n #content pre:not([class*=\"CodeMirror\"]),\n #content code,\n #content tt {\n background-color: @surface0;\n color: @text;\n border-color: @overlay0;\n }\n\n .vector-pinned-container {\n border-color: @overlay0 !important;\n }\n\n .vector-pinnable-header-label {\n color: @text;\n }\n\n .vector-pinnable-header-toggle-button,\n .vector-pinnable-header-unpin-button {\n color: @mantle;\n background-color: @accent-color;\n border-color: @base;\n }\n\n .wikitable {\n background-color: @base;\n }\n\n .wikitable > tr > th,\n .wikitable > tr > td,\n .wikitable > * > tr > th,\n .wikitable > * > tr > td {\n color: @text;\n border-color: @crust;\n }\n\n .wikitable > tr > th,\n .wikitable > * > tr > th {\n background-color: @mantle;\n color: @text;\n }\n\n .pre {\n color: @mantle;\n }\n\n .mw-headline {\n color: @text;\n }\n\n .plainlinks,\n .archwiki-template-man,\n .external text {\n color: multiply(@blue, #555);\n }\n\n .cdx-button:enabled.cdx-button--weight-quiet,\n .cdx-button.cdx-button--fake-button--enabled,\n .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet,\n .diff-context,\n .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle,\n .oo-ui-checkboxInputWidget [type=\"checkbox\"] + span {\n background-color: @surface0;\n color: @text;\n border-color: @surface2;\n }\n\n .vector-feature-zebra-design-disabled,\n #contentSub:not(:empty) {\n color: @surface0 !important;\n }\n\n .mw-editfont-monospace {\n background-color: @surface0;\n color: @text;\n border-color: @surface1;\n }\n\n .diff-deletedline,\n .mw-message-box-warning {\n background-color: @yellow;\n color: @mantle;\n }\n\n .diff-addedline {\n background-color: @sky;\n color: @mantle;\n }\n\n .mw-message-box-error {\n background-color: @flamingo;\n border-color: @red;\n color: @base;\n }\n\n .mw-number-text {\n color: @text;\n }\n\n .cdx-checkbox__icon {\n background-color: @surface0;\n }\n\n .oo-ui-checkboxInputWidget.oo-ui-widget-enabled\n [type=\"checkbox\"]:checked\n + span,\n .cdx-checkbox__input:enabled:checked + .cdx-checkbox__icon,\n .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive {\n background-color: @blue;\n border-color: @sapphire;\n color: @mantle !important;\n }\n\n .vector-feature-zebra-design-disabled,\n #vector-toc-pinned-container,\n .vector-toc::after {\n background: linear-gradient(rgba(255, 255, 255, 0), @base) !important;\n }\n\n #archnavbar ul li.anb-selected a {\n color: @accent-color !important;\n }\n\n .archwiki-template-message {\n background-color: @base;\n }\n\n .catlinks {\n background-color: @mantle;\n }\n\n .mw-parser-output p {\n color: @text !important;\n }\n\n .archwiki-template-meta-related-articles {\n background-color: @surface0;\n }\n\n .archwiki-template-meta-related-articles p {\n color: @text;\n border-bottom-color: @blue;\n }\n\n .archwiki-template-meta-related-articles ul li a {\n color: @blue important;\n }\n\n .mw-plusminus-neg,\n a.new {\n color: @red !important;\n }\n\n .mw-plusminus-pos {\n color: @green;\n }\n\n .mw-plusminus-null {\n color: @subtext0;\n }\n\n .oo-ui-textInputWidget .oo-ui-inputWidget-input,\n .mw-widget-dateInputWidget-handle,\n .oo-ui-buttonElement-framed.oo-ui-widget-enabled\n > .oo-ui-buttonElement-button,\n #pagehistory li.selected {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface2 !important;\n }\n\n .oo-ui-menuSelectWidget {\n background-color: @surface0;\n border-color: @surface2;\n }\n\n .oo-ui-OptionWidget-highlighted {\n background-color: @overlay0 !important;\n }\n\n .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget,\n .minoredit,\n .comment {\n color: @text;\n }\n\n .mw-footer-container {\n color: @text !important;\n }\n\n #archnavbarlist li a {\n color: @blue !important;\n }\n\n .anb-selected {\n color: @subtext1 !important;\n }\n\n .mw-footer li {\n color: @text;\n }\n\n .vector-main-menu,\n .vector-pinnable-element {\n background-color: @base !important;\n }\n\n #p-navigation ul li a {\n color: @blue !important;\n }\n\n .archwiki-template-box-note a {\n color: @blue !important;\n }\n\n .archwiki-template-box-note a:visited {\n color: @mauve !important;\n }\n\n .mw-page-title-main {\n color: @text;\n }\n\n .vector-tab-noicon mw-list-item a {\n color: @blue;\n }\n\n .mw-header {\n background-color: @base !important;\n color: @text;\n }\n\n .mw-footer li a {\n color: @blue;\n }\n\n .cdx-text-input__input:enabled {\n background-color: @surface0 !important;\n color: @text !important;\n border-color: @surface1;\n }\n\n .cdx-button:enabled,\n .cdx-button.cdxbutton--fake-button--enabled {\n color: @mantle;\n background-color: @accent-color;\n border-color: @base;\n }\n\n .cdx-menu {\n background-color: @surface0;\n }\n\n .cdx-menu:hover {\n background-color: @base !important;\n }\n\n .anb-home {\n color: @text !important;\n }\n\n .vector-dropdown-content {\n background-color: @base !important;\n }\n\n .mw-headline::before {\n color: @accent-color !important;\n }\n\n .cdx-button {\n background-color: @base !important;\n color: @text !important;\n border-color: @base !important;\n }\n\n .mw-body {\n background-color: @base !important;\n color: @text !important;\n border-color: @base !important;\n }\n\n .mw-search-profile-tabs {\n background-color: @base !important;\n color: @text !important;\n border-color: @base !important;\n }\n\n .mw-content-ltr {\n background-color: @base !important;\n }\n\n .vector-sticky-pinned-container::after {\n background: @base !important;\n }\n\n .cdx-search-input {\n border-color: @mantle !important;\n }\n\n .oo-ui-widget:hover {\n background-color: @surface0 !important;\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": "Arch Wiki Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/arch-wiki",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/arch-wiki",
"version": "0.0.9",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/arch-wiki/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aarch-wiki",
"description": "Soothing pastel theme for Arch Wiki",
"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 Arch Wiki",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/arch-wiki",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/arch-wiki/catppuccin.user.css",
"name": "Arch Wiki Catppuccin",
"originalDigest": "c83a480ef6a27bc9a8a46713f1c929423dcae475",
"_id": "dfaa88d1-79ca-418c-8b2c-3cd5994a7de9",
"_rev": 1725606885821,
"id": 13,
"etag": "W/\"c2969398e0235b04250bc66f39b52c5fffffa3c55ab1f638278699fdec80f2ec\"",
"updateDate": 1725606885807
},
{
"enabled": true,
"installDate": 1715535966119,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name NixOS Wiki Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/nixos.wiki\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos.wiki\n@version 0.0.7\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos.wiki/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos.wiki\n@description Soothing pastel theme for NixOS Wiki\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('nixos.wiki') {\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 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 &[data-darkreader-scheme=\"dark\"] body::before {\n content: \"Please turn off DarkReader for this domain when Catppuccin for NixOS Wiki is active.\";\n background: @red;\n box-shadow:\n 0 4px 16px fade(@crust, 10%),\n 0 8px 32px fade(@crust, 5%);\n color: @crust;\n position: fixed;\n top: 0;\n right: 0;\n z-index: 99999;\n max-width: 24rem;\n padding: 0.75rem;\n margin: 0.5rem;\n border-radius: 5px;\n }\n\n body {\n background-color: @base;\n }\n hr {\n border-color: @surface2;\n }\n .navbar-default {\n color: @text;\n background-color: @mantle !important;\n background-image: none !important;\n border-color: transparent !important;\n\n .navbar-brand {\n color: @blue;\n &:hover {\n color: @sky;\n }\n }\n\n li {\n a {\n color: @text !important;\n &:hover {\n color: @subtext0 !important;\n }\n }\n &.nav.open > a,\n ul {\n background-color: @surface0 !important;\n background-image: none !important;\n a:hover {\n background-color: fade(@surface1, 50%) !important;\n background-image: none !important;\n }\n }\n }\n .active > a {\n color: @crust !important;\n &:hover {\n color: @base !important;\n }\n background: @blue !important;\n }\n }\n\n .search-query.form-control {\n color: @text;\n background-color: @surface0;\n border-color: @surface0;\n }\n\n * {\n color: @text;\n }\n\n a {\n color: @blue;\n &:hover {\n color: @sky;\n }\n &.new {\n color: @red;\n &:hover {\n color: @maroon;\n }\n }\n }\n\n .panel {\n background-color: @mantle;\n border-color: @mantle;\n .panel-heading {\n color: @text;\n background-color: @surface0 !important;\n border-bottom-color: @surface2;\n img {\n & when not (@lookup = latte) {\n filter: invert(100%);\n }\n }\n }\n }\n\n .btn-primary {\n color: @crust;\n background-color: @blue !important;\n background-image: none !important;\n border-color: @crust !important;\n &:hover {\n color: @crust !important;\n background-color: @sky !important;\n background-image: none !important;\n }\n }\n\n table {\n &,\n * {\n color: @text;\n border-color: @overlay0 !important;\n background-color: @mantle;\n }\n th {\n &,\n * {\n background-color: @surface0 !important;\n }\n }\n }\n\n blockquote,\n cite {\n border-left-color: @pink !important;\n }\n\n cite a {\n color: @pink;\n &:hover {\n color: @rosewater;\n }\n }\n\n pre,\n code {\n box-shadow: none !important;\n background-color: @mantle;\n border-color: @crust;\n }\n pre {\n color: @text;\n }\n code {\n color: @rosewater;\n }\n\n *[style*=\"background-color: #C1E5FF\"] {\n color: @text !important;\n background-color: fade(@blue, 15%) !important;\n border-color: @blue !important;\n }\n\n *[style*=\"background-color: #FFD0B7\"] {\n color: @text !important;\n background-color: fade(@peach, 15%) !important;\n border-color: @peach !important;\n }\n\n *[style*=\"background: #F6F6F6\"] {\n color: @text !important;\n background-color: fade(@overlay0, 15%) !important;\n border-color: @overlay0 !important;\n }\n\n .suggestions {\n .suggestions-result {\n background-color: @mantle;\n &:hover {\n background-color: mix(@base, @mantle, 50%);\n }\n color: @text;\n .highlight {\n color: @accent-color;\n }\n }\n .suggestions-results {\n border-color: @surface0 !important;\n }\n .suggestions-special {\n border-color: @surface0 !important;\n background-color: @mantle;\n &:hover {\n background-color: mix(@accent-color, @mantle, 15%);\n }\n .special-label {\n color: @subtext0;\n }\n .special-query {\n color: @text;\n }\n }\n }\n\n .toc {\n li.active > a {\n border-left-color: @accent-color !important;\n }\n ul.nav a:hover {\n background: @accent-color !important;\n &,\n * {\n color: @crust !important;\n }\n }\n }\n\n .page-header {\n border-bottom-color: @overlay2;\n }\n\n #catlinks {\n background-color: @mantle;\n border-color: @mantle;\n }\n\n #footer {\n background-color: @mantle;\n }\n\n .mw-search-profile-tabs {\n background-color: @base !important;\n border-color: @base !important;\n }\n\n .search-types .current a {\n color: @text;\n }\n\n .oo-ui-inputWidget-input {\n background-color: @overlay2 !important;\n color: @base;\n }\n\n .oo-ui-buttonElement-button {\n background-color: @mantle !important;\n color: @base !important;\n border-color: @mantle !important;\n }\n\n .oo-ui-labelElement-label {\n background-color: @mantle !important;\n color: @text !important;\n }\n\n .oo-ui-floatableElement-floatable,\n .oo-ui-widget:hover {\n background-color: @mantle !important;\n color: @text !important;\n }\n\n & when (@lookup = latte) {\n .oo-ui-inputWidget-input {\n background-color: @base !important;\n color: @text;\n }\n .oo-ui-buttonElement-button {\n background-color: @mantle !important;\n }\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": "NixOS Wiki Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/nixos.wiki",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/nixos.wiki",
"version": "0.0.7",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/nixos.wiki/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos.wiki",
"description": "Soothing pastel theme for NixOS Wiki",
"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 NixOS Wiki",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/nixos.wiki",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/nixos.wiki/catppuccin.user.css",
"name": "NixOS Wiki Catppuccin",
"originalDigest": "3958193b639b17fdd211a6b8a7ebdf25bb722fc5",
"_id": "d8442149-3453-43fb-9a0b-7db47465b4d9",
"_rev": 1720362457127,
"id": 14,
"etag": "W/\"458bc5b50a033436703f3cf816ce193e0da8d73159b390818432f200afb9d12a\"",
"updateDate": 1720362457038
},
{
"enabled": false,
"installDate": 1715536014707,
"sections": [
{
"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.23\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 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 --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 .mw-echo-ui-placeholderItemWidget,\n .oo-ui-popupWidget-popup,\n .mw-echo-ui-notificationItemWidget,\n .oo-ui-optionWidget-selected {\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 .mw-echo-ui-notificationItemWidget-content-message-header,\n .oo-ui-labelElement,\n #contentSub:not(:empty) {\n color: @text !important;\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\n .oo-ui-pendingElement-pending {\n background-color: @base;\n background-image: linear-gradient(\n 135deg,\n @surface0 25%,\n transparent 25%,\n transparent 50%,\n @surface0 50%,\n @surface0 75%,\n transparent 75%,\n transparent\n );\n }\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 .mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted,\n .cdx-menu-item--enabled.cdx-menu-item--highlighted {\n background-color: fade(@accent-color, 20%);\n }\n\n .mw-echo-ui-sortedListWidget,\n .mw-echo-ui-sortedListWidget-group,\n .mw-echo-ui-subGroupListWidget-header {\n border-color: @surface2;\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 !important;\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 .infobox-subheader,\n .infobox-full-data {\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-icon.mw-ui-icon-wikimedia-appearance {\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 .vector-icon.mw-ui-icon-wikimedia-unStar {\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 .oo-ui-icon-bell {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-next {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-expand {\n @svg: escape(\n ' expand '\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .oo-ui-icon-tray {\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.23",
"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",
"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"
}
]
},
"highlight-redirect": {
"type": "checkbox",
"label": "Highlight redirect links",
"name": "highlight-redirect",
"value": "1",
"default": "0",
"options": null
}
}
},
"author": "Catppuccin",
"description": "Soothing pastel theme for Wikipedia",
"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": "5a185f11fdbbed155d6594879c0b59f3f72985cc",
"_id": "1041e719-a6f4-4e67-8ae9-ccc268aad05c",
"_rev": 1729236424403,
"id": 15,
"etag": "W/\"49357e8e7bdc73a33d7421ba89cb86eee0b71614e3d6806fa08a267df7d51d02\"",
"updateDate": 1729236424338
},
{
"enabled": true,
"installDate": 1715536465127,
"sections": [
{
"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.3\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 [src=\"//ssl.gstatic.com/images/branding/product/1x/drive_2020q4_48dp.png\"]\n {\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.3",
"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",
"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 Google Drive",
"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": "5bfad1f16920db948b666492de7798392a27ea00",
"_id": "8cd5d5b6-853b-45bd-8fd9-052f0eb9851e",
"_rev": 1725888159430,
"id": 16,
"etag": "W/\"78a8167ceb084b1c63f2b4cb4ec70e77ddd0debd8166f3b4540eba178f149b26\"",
"updateDate": 1725888159390
},
{
"enabled": false,
"installDate": 1715536531937,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name Gmail Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/gmail\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/gmail\n@version 0.2.4\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agmail\n@description Soothing pastel theme for Gmail\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(\"mail.google.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 @crust-filter: @catppuccin[@@lookup][@crust_filter];\n @text-filter: @catppuccin[@@lookup][@text_filter];\n @yellow-filter: @catppuccin[@@lookup][@yellow_filter];\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 caret-color: @text;\n }\n\n #input-styling {\n input,\n select,\n button {\n background-color: @mantle;\n color: @text;\n border-color: @surface0;\n border-style: solid;\n border-width: 1px;\n box-shadow: none;\n }\n }\n\n * {\n text-shadow: none !important;\n }\n\n /* Gmail logo */\n [src=\"https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_default_1x_r5.png\"],\n [src=\"https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_dark_1x_r5.png\"]\n {\n height: unset !important;\n width: unset !important;\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n /* Tooltips */\n .T-ays-iP,\n .gb_Ac {\n background-color: @crust;\n color: @text;\n }\n\n /* Buttons */\n\n /* Solid primary */\n .T-I-atl {\n background-color: @accent-color;\n color: @crust;\n }\n\n /* Transparent primary */\n .l0,\n div.b8 .a8k,\n .bAo > .ad {\n color: @accent-color;\n\n &::before {\n background-color: @accent-color;\n }\n }\n\n /* Transparent secondary */\n .bs0 > .acM,\n .bti > .btg,\n .a8Y > .T-I-ax7 {\n color: @text;\n\n /* Disabled */\n &.acN {\n color: @subtext0;\n }\n\n &:hover::before {\n background-color: @overlay2;\n }\n }\n\n /* Header and sidebars */\n .w-asV,\n .bkL,\n .bhZ.bym,\n .bhZ.bjB,\n .bhZ.bym.baA {\n background-color: @mantle;\n }\n /* Header icons */\n .gb_Lc svg,\n .gb_Pc.gb_Uc svg,\n .gb_Lc .gb_rd .gb_sd,\n .gb_Lc .gb_rd .gb_Kc,\n .gb_Lc .gb_rd .gb_ud,\n .gb_Pc.gb_Uc .gb_sd {\n color: @text;\n }\n /* Search mail input */\n .gb_Lc .gb_hd {\n background-color: @crust;\n\n .gb_je,\n svg {\n color: @text;\n }\n }\n /* Active search / filter modal */\n .gssb_c {\n /* Icons */\n button svg,\n .asor {\n filter: @text-filter;\n }\n\n /* Recent searches */\n .aRp,\n .gssb_e,\n .gssb_m {\n background-color: @base;\n color: @text;\n }\n\n /* Hovered recent searches */\n .gssb_i {\n background-color: @surface0;\n\n > .gssb_a {\n border-left-color: @accent-color;\n }\n\n /* X icon */\n .gsaq_b {\n filter: @text-filter;\n }\n }\n\n .aSP,\n .gssb_e {\n border-color: @surface2;\n }\n\n /* Separator */\n .gssb_l {\n background-color: @surface0;\n }\n\n /* Search results */\n\n /* Icons */\n .gsoi_0,\n .asor_o,\n .gsoi_msra {\n filter: @text-filter;\n }\n\n /* People involved */\n .asor_e {\n color: @subtext0;\n }\n }\n /* Pill filters */\n .H2 {\n background-color: @base;\n border-color: @surface0;\n color: @subtext1;\n fill: @subtext1;\n\n &:hover {\n background-color: @mantle;\n }\n\n &.bws {\n background-color: @accent-color;\n color: @crust;\n fill: @crust;\n\n .HV {\n filter: @crust-filter;\n }\n\n &:hover .H1 {\n background-color: darken(@accent-color, 5%);\n }\n }\n }\n .aqc .H2 {\n border-color: @text;\n color: @text;\n\n &.bws {\n background-color: @surface2;\n color: @mantle;\n }\n }\n /* Advanced search/filters modal */\n .ZF-z6,\n .ZF-zT,\n .ZF-Av .lJ,\n .ZF-Av .lN {\n background-color: @base;\n\n &,\n .boo > .ZG,\n .boo .aQl > .J-JN-M-I-Jm,\n .boo .aaa > .J-JN-M-I-Jm,\n .boo .ZE > .J-JN-M-I-Jm {\n color: @text;\n }\n\n .btl.acK,\n .btn::before {\n filter: @text-filter;\n }\n\n /* Text inputs */\n .nr {\n background-color: @base;\n color: @text;\n\n &:focus {\n box-shadow: inset 0 -1px 0 0 @accent-color;\n }\n }\n\n /* Calendar input */\n .bs5::after {\n filter: @text-filter;\n }\n .J-JB-KA,\n .J-JB-KA-JS,\n .J-JB-KA-Jk,\n .J-JB-KA-LG {\n background-color: @base;\n color: @text;\n border-color: @surface0;\n\n /* Past days */\n .J-JB-KA-Ku-Kk {\n color: @subtext0;\n }\n /* Future days */\n .J-JB-KA-a1R-JB.J-JB-KA-LH,\n .J-JB-KA-a1R-JB.J-JB-KA-Ku-Kk,\n .J-JB-KA-JB.J-JB-KA-a1R-JB {\n color: @subtext1;\n }\n\n /* Hovered day */\n .J-JB-KA-JB:not(.J-JB-KA-K8, .J-JB-KA-KO):hover {\n color: @crust;\n\n &::before {\n background-color: fade(@accent-color, 70%);\n }\n }\n\n /* Selected day */\n .J-JB-KA-KO {\n color: @crust;\n\n &::before {\n background-color: @accent-color;\n }\n }\n\n /* Unselected today */\n .J-JB-KA-K8 {\n color: @crust;\n\n &::before {\n background-color: @overlay2;\n }\n }\n }\n\n /* Checkbox inputs */\n .bs1 + .bs3,\n .btj + .aD {\n color: @text;\n\n &::before {\n filter: @text-filter;\n }\n }\n\n /* Dropdown/select inputs */\n .J-JN-M-I {\n color: @text;\n }\n }\n\n /* Sidebar selected item */\n .TK .TO.nZ:active,\n .TK .TO.ol:active,\n .TK .TO.nZ,\n .TK .TO.ol,\n .byl .TK .nZ.aBP,\n .byl .TK .nZ.aS3,\n .byl .TK .nZ.aS4,\n .byl .TK .nZ.aS5,\n .byl .TK .nZ.aS6,\n .VDSZAf.H5o3mc {\n background-color: @surface0;\n }\n .TO.NQ,\n .n6 .ah9:hover,\n .n6 .ah9.aiu:hover,\n .n6 .ah9:focus,\n .TK .TO:active,\n .n6 .ah9.aiu:active,\n .CL:hover,\n .H5o3mc:not(.VDSZAf):hover,\n .CL.NQ,\n .H5o3mc:not(.VDSZAf).NQ {\n background-color: @surface1;\n }\n .byl .TK .TO.nZ > .aHS-bnt .n0,\n .TK .nZ > .aHS-bnt .bsU,\n .byl .TK .nZ.aS3 .nU > .n0,\n .TK .nZ.aS3 .bsU,\n .byl .TK .nZ.aS4 .nU > .n0,\n .TK .nZ.aS4 .bsU,\n .byl .TK .nZ.aS5 .nU > .n0,\n .TK .nZ.aS5 .bsU,\n .byl .TK .nZ.aS6 .nU > .n0,\n .TK .nZ.aS6 .bsU,\n .TK .TO.nZ .nU > .n0,\n .TK .ol.NQ .nU > .n0,\n .TK .TO.ol .nU > .n0,\n .TK .nZ .bsU,\n .TK .ol .bsU,\n .VDSZAf.H5o3mc > .Q7,\n .TO .nU > .n0,\n .TO.NQ .nU > .n0,\n .TO.nZ .nU > .n0,\n .ah9 > .CJ,\n .n3 > .CL > .CK,\n .aAv,\n .bsU {\n color: @text;\n }\n /* Icons */\n .nZ > .TN.aHS-bnt .qj,\n .TO:not(.nZ) > .TN > .qj:not([style*=\"background-color\"]),\n .n6 .n4 .G-asx,\n .aAw .aAu,\n .pM,\n .TO.nZ > .TN > .qj,\n .n3 .CL::before {\n filter: @text-filter;\n }\n\n /* Compose email button */\n .z0 > .L3 {\n background-color: @accent-color;\n color: @crust;\n\n &:focus {\n background-color: @text;\n }\n }\n .WR .z0 > .L3::before,\n .WR.anZ .z0 > .L3::before {\n filter: @crust-filter;\n }\n\n /* Top section of inbox */\n .bkK > .nH {\n background-color: @surface0;\n\n /* Icons */\n .bzn,\n .aqJ .amJ,\n .adg .adk {\n filter: @text-filter;\n }\n }\n /* Inbox categories */\n .aKx > .aKz {\n color: @text;\n }\n /* Icons */\n .aAy > div {\n filter: @text-filter;\n }\n /* Currently selected category */\n .J-KU-KO::before {\n background-color: @text;\n }\n /* Inbox categories hover */\n .aRz.J-KU:hover {\n background-color: @surface1;\n }\n /* Email count / pagination */\n div[aria-label=\"Show more messages\"] {\n .Dj {\n color: @subtext1;\n }\n\n &::before {\n background-color: @text;\n }\n }\n .h0 {\n color: @subtext1;\n }\n /* Inbox footer */\n .md.mj,\n .aeU .ma,\n .ma .mb,\n .ae3 .l6,\n .l9,\n .l8,\n .aiD {\n color: @subtext1;\n }\n /* Storage progress bar */\n .aiC {\n background-color: @overlay0;\n\n .aiA {\n background-color: @subtext0;\n }\n }\n /* External link icon */\n .aiz {\n filter: @text-filter;\n }\n\n /* Read emails */\n .yO {\n background-color: @base;\n color: @text;\n\n box-shadow: inset 0 -1px 0 0 @surface0;\n\n &:hover {\n box-shadow:\n inset 1px 0 0 @surface0,\n inset -1px 0 0 @surface0,\n 0 0 4px 0 @surface1,\n 0 0 6px 2px @surface1;\n }\n }\n /* Read email text */\n .zE {\n color: @text;\n }\n // Select icon\n .xY > .T-Jo,\n td.apU > .T-KT.aXw::before,\n // Important icon\n .pG .a9q,\n // Delete/trash icon\n .aqN,\n // Hover action icons\n .bqY li {\n filter: @text-filter;\n }\n /* Important icon filled, star icon filled */\n .ha .a9q.pH,\n .a9q.pH,\n .aoj,\n td.apU > .T-KT.T-KT-Jp::before {\n filter: @yellow-filter;\n }\n .pG:hover > .a9q::before {\n background-color: fade(@yellow, 30%);\n }\n /* Read email dates */\n .yO > .xW {\n color: @subtext0;\n }\n /* Read email summary truncated */\n .y2 {\n color: @subtext1;\n }\n /* Selected unread emails */\n .x7 {\n background-color: @accent-color;\n color: @mantle;\n\n /* Dates */\n .xW {\n color: @crust;\n }\n\n // Select icon\n .xY > .T-Jo,\n // Star icon\n td.apU > .T-KT.aXw::before,\n // Important icon\n .pG .a9q,\n // Delete/trash icon\n .aqN,\n // Hover action icons\n .bqY li {\n filter: @crust-filter;\n }\n }\n /* Unsubscribe button */\n .aOd.T-I {\n color: @text;\n box-shadow: inset 0 0 0 1px @surface2;\n }\n /* Draft text */\n .boq {\n color: @red;\n }\n /* No drafts message, trash 30 days message */\n .TD,\n .Tm .ya {\n background-color: @surface1;\n color: @text;\n }\n /* Your social/promotions/updates tab is empty */\n .aRs {\n background-color: @base;\n color: @subtext0;\n\n .aRv {\n color: @text;\n }\n .aRq {\n color: @accent-color;\n }\n }\n /* You could lose access banner */\n .GR {\n background-color: @base;\n\n /* Primary text */\n .GX {\n color: @text;\n }\n /* Subtext */\n .GT {\n color: @subtext1;\n }\n\n /* Dismiss button */\n .GW {\n color: @text;\n\n &::before {\n background-color: @text;\n }\n }\n /* Add recovery info button */\n .GV {\n color: @accent-color;\n\n &::before {\n background-color: @accent-color;\n }\n }\n }\n /* Attachments chips */\n .brc {\n box-shadow: inset 0 0 0 1px @surface0;\n color: @text;\n\n &:hover {\n background-color: @surface0;\n }\n }\n\n /* Floating menu */\n .J-M,\n .OO.Pa {\n background-color: @surface1;\n\n /* Menu section header */\n .J-awr,\n .asc {\n color: @subtext1;\n }\n\n /* Menu item */\n\n .J-N,\n .J-Ks-KO .J-N-Jz,\n .J-N-JT .J-N-Jz,\n .J-N-JW .J-N-Jz,\n .J-LC,\n .J-JK,\n .bmz {\n color: @text;\n }\n /* Disabled */\n .J-N-JE .J-N-atj,\n .J-N-JE .J-N-Jz {\n color: @subtext0 !important;\n }\n\n /* Checkmark, arrow, checkbox, star, calendar icon */\n .J-Ks-KO .J-N-Jo,\n .asi .J-Ks-KO::before,\n .J-Ph-hFsbo,\n .J-LC-Jo,\n .bi4 > .T-KT:not(.T-KT-Jp, .byM)::before,\n .aaA.mYVwse,\n .J-N-JX {\n filter: @text-filter;\n }\n .bmz.bjF::before {\n border-color: @subtext0;\n }\n\n /* Hovered menu item */\n .J-N-JT,\n .J-N-JW,\n .J-LC-JT,\n .J-LC-JW,\n .J-JK-JT,\n .J-JK-JW,\n .bmz.bk5 {\n background-color: @surface2;\n border-color: @overlay1;\n }\n\n /* Menu section divider */\n .J-Kh {\n border-top-color: @surface2;\n }\n }\n /* Modal search input */\n .agd .J-M-JJ input {\n background-color: @surface1;\n color: @text;\n }\n .bqf {\n box-shadow: inset 0 -2px 0 0 @surface2;\n\n &:focus {\n box-shadow: inset 0 -2px 0 0 @accent-color;\n }\n }\n /* Magnifying glass icon */\n .A0 {\n filter: @text-filter;\n }\n /* Edit label modal */\n div.Kj-JD {\n background-color: @base;\n\n /* Edit label text */\n span.Kj-JD-K7-K0 {\n color: @text;\n }\n\n /* Close X icon */\n span.Kj-JD-K7-Jq::after {\n filter: @text-filter;\n }\n\n #input-styling();\n\n /* Input labels */\n div.Kj-JD-Jz {\n color: @subtext1;\n }\n\n /* Cancel button */\n div.Kj-JD-Jl > button,\n .bBh .Kj-JD-Jl > .J-at1-auR {\n color: @subtext1;\n }\n\n /* Save button */\n div.Kj-JD-Jl > button.J-at1-atl,\n div.Kj-JD-Jl > button.J-at1-auR {\n background-color: @accent-color;\n color: @crust;\n }\n }\n\n /* Toast notifications */\n .bAp.b8.UC .vh {\n background-color: @crust;\n color: @text;\n }\n /* Close icon */\n .b8 .bBe .bBf {\n filter: @text-filter;\n }\n\n /* Compose mail window */\n /* Top header bar */\n .Hy.Hy .m,\n .IG {\n background-color: @mantle;\n\n .Hp,\n .zu,\n .H,\n .Iy .az9 {\n color: @text;\n }\n\n .Hm img,\n .SB,\n .b7 .mK,\n .bAm .aaq .mK,\n .Un .mK,\n .HX .mK,\n .HQ .Un::after {\n filter: @text-filter;\n }\n }\n .aaZ,\n .Ap,\n .Am,\n .aDg > .aDj,\n .aoP .Ar,\n .wO,\n .aoT,\n .agP,\n .aGb,\n .GQ {\n color: @text;\n caret-color: @text;\n\n &,\n &::before {\n background: @base;\n }\n }\n .gQ,\n .gO,\n .oL {\n color: @subtext0;\n }\n /* Bottom toolbar icons */\n .aaA,\n .btC .dv,\n .btC .og.T-I-J3,\n .btC .J-N-JX.og.T-I-J3,\n .btC .Y1,\n .btC .Xv.T-I.J-JN-M-I > .J-JN-M-I-JG,\n .J-JN-M-I-JG,\n .J-Z-M-I-J6-H > .J-Z-M-I-JG {\n filter: @text-filter;\n }\n /* Floating toolbar (expanded window) */\n .J-Z {\n background-color: @mantle;\n\n .J-Z-I,\n .J-Z-M-I {\n color: @subtext1;\n }\n }\n /* Send button */\n .gU .v7.T-I:not(.btz),\n .gU .hG:not(.v6) {\n background-color: @accent-color;\n color: @crust;\n }\n .hG > .G-asx,\n .SI .hG > .G-asx {\n filter: @crust-filter;\n }\n /* Contact autofill */\n .afC,\n .bvx {\n background: @mantle;\n\n /* Contact list item */\n .agJ {\n .aL8,\n .aXS {\n color: @text;\n }\n\n &:hover {\n background: @base;\n }\n }\n }\n\n --pkw-background: @mantle;\n --pkw-outline: @surface0;\n --pkw-outline-variant: @surface0;\n --pkw-on-surface-variant: @text;\n /* Contact chip */\n .agh,\n .bbV {\n background: @base;\n\n .afV {\n background: @base;\n color: @text;\n\n &:hover {\n background: @surface0;\n color: @text;\n }\n }\n }\n\n /* Settings */\n .dt {\n color: @text;\n }\n /* Navigation header */\n .v {\n /* Tabs */\n .fY,\n .f1 {\n background-color: @surface0;\n\n .f0 {\n color: @text;\n }\n }\n\n /* Currently selected tab */\n .fZ {\n box-shadow: inset 0 -2px 0 0 @accent-color;\n }\n }\n /* Main panel */\n .r4 {\n background-color: @base;\n color: @text;\n\n /* Dividers */\n .r7 td,\n .Jb .J0:not(:last-child) {\n border-bottom-color: @surface0;\n }\n\n /* Links */\n .r7 .e,\n .sA,\n .r4 .e,\n .el {\n color: @accent-color;\n }\n\n #input-styling();\n .qK,\n .qL {\n background-color: @mantle;\n }\n .nr,\n .Ar {\n background-color: @base;\n color: @text;\n border-color: @surface0 !important;\n }\n /* Some buttons */\n .Uu {\n box-shadow: inset 0 0 0 1px @surface0;\n color: @accent-color;\n }\n }\n /* Labels page */\n .alO {\n background-color: @base;\n color: @text;\n\n .rb {\n color: @subtext1;\n }\n\n /* Table items */\n .To.Ze {\n background-color: @surface0;\n }\n\n /* Links */\n .alP {\n color: @accent-color;\n }\n\n /* Dividers */\n .rZ {\n background-color: @surface0;\n }\n }\n\n /* Confirm popup modal */\n div[aria-modal=\"true\"] {\n --gm3-dialog-refactored-container-color: @base;\n --gm3-dialog-refactored-supporting-text-color: @text;\n --gm3-dialog-refactored-headline-color: @text;\n\n /* Buttons */\n [data-mdc-dialog-action=\"ok\"] {\n background-color: @accent-color;\n --gm3-button-text-label-text-color: @crust;\n --gm3-button-text-hover-label-text-color: @crust;\n --gm3-button-text-pressed-label-text-color: @crust;\n }\n\n [data-mdc-dialog-action=\"cancel\"] {\n --gm3-button-text-label-text-color: @subtext1;\n --gm3-button-text-hover-label-text-color: @text;\n --gm3-button-text-focus-label-text-color: @text;\n --gm3-button-text-pressed-label-text-color: @text;\n\n &:hover,\n &:focus,\n &:active {\n background-color: @surface0;\n }\n }\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; @yellow_filter: brightness(0) saturate(100%) invert(84%) sepia(47%) saturate(5389%) hue-rotate(348deg) brightness(92%) contrast(90%);; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; @crust_filter: brightness(0) saturate(100%) invert(96%) sepia(3%) saturate(583%) hue-rotate(187deg) brightness(92%) contrast(97%); };\n @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @yellow_filter: brightness(0) saturate(100%) invert(79%) sepia(20%) saturate(586%) hue-rotate(1deg) brightness(103%) contrast(84%); @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; @crust_filter: brightness(0) saturate(100%) invert(11%) sepia(6%) saturate(3257%) hue-rotate(192deg) brightness(93%) contrast(88%); };\n @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @yellow_filter: brightness(0) saturate(100%) invert(87%) sepia(24%) saturate(488%) hue-rotate(350deg) brightness(97%) contrast(93%); @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; @crust_filter: brightness(0) saturate(100%) invert(9%) sepia(7%) saturate(2560%) hue-rotate(198deg) brightness(95%) contrast(97%); };\n @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @yellow_filter: brightness(0) saturate(100%) invert(83%) sepia(35%) saturate(324%) hue-rotate(347deg) brightness(105%) contrast(95%); @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; @crust_filter: brightness(0) saturate(100%) invert(3%) sepia(12%) saturate(3951%) hue-rotate(206deg) brightness(96%) contrast(92%); };\n}\n\n// vim:ft=less\n",
"usercssData": {
"name": "Gmail Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/gmail",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/gmail",
"version": "0.2.4",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agmail",
"description": "Soothing pastel theme for Gmail",
"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 Gmail",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/gmail",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.css",
"name": "Gmail Catppuccin",
"originalDigest": "803728b3849f338ac0646ee805b282a997f81ff7",
"_id": "bc95164e-c1ea-4a5e-b5cb-4e83061e74c4",
"_rev": 1729236424433,
"id": 17,
"etag": "W/\"c31e95660fc63b727f517e5863c63b60440cec84fbb28a1d30c19501af53fd09\"",
"updateDate": 1729236424403
},
{
"enabled": true,
"installDate": 1715536630888,
"sections": [
{
"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.8\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 --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(@red) [];\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 --ig-bubble-background: #rgbify (@surface1) [];\n --ig-tertiary-icon: #rgbify (@accent-color) [];\n --always-dark-overlay: @accent-color;\n --secondary-text: @subtext0;\n --primary-text: @text;\n --primary-icon: @accent-color;\n --primary-button-text: @mantle !important;\n --primary-button: @blue !important;\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 /* close friends story things */\n .x9bdzbf {\n color: @text !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 /* new post thingy */\n ._aa1q._aa1q {\n color: @text !important;\n }\n\n /* sumting wong's popup box */\n .x879a55,\n .x7ywyr2,\n .x1l90r2v {\n background-color: @surface0 !important;\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 /* reel icon */\n .xq3z1fi {\n color: @accent-color !important;\n }\n\n /* Toggle sliders */\n .x1r7x56h {\n background-color: @accent-color;\n }\n .x100vrsf {\n background-color: @surface0;\n }\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: fade(@blue, 80%);\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 color: @text;\n }\n .x1bvjpef {\n color: @crust;\n }\n .x1bvjpef:hover {\n color: lighten(@accent-color, 5%);\n }\n\n /* notes */\n .xsnw5ke,\n .x3zg9eu::after {\n background-color: @surface0 !important;\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.8",
"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",
"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 Instagram",
"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": "2693d45835f1e567081b55fb9540e5669d439f65",
"_id": "64b66cea-b486-484e-be5e-6892494d1667",
"_rev": 1728750038921,
"id": 18,
"etag": "W/\"ef30bf1d3cacdb7739c602840a23ba25b85e080e9a2659e3e78fa9f8575baa25\"",
"updateDate": 1728750038829
},
{
"enabled": true,
"installDate": 1715536822168,
"sections": [
{
"code": ""
}
],
"sourceCode": "/* ==UserStyle==\n@name LinkedIn Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/linkedin\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/linkedin\n@version 0.0.7\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/linkedin/catppuccin.user.css\n@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alinkedin\n@description Soothing pastel theme for LinkedIn\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('www.linkedin.com') {\n :root:not(.theme--dark, .theme--mercado-dark) {\n #catppuccin(@lightFlavor, @accentColor);\n }\n :root.theme--dark,\n :root.theme--mercado-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 @surface0: @catppuccin[@@lookup][@surface0];\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 --black: @crust;\n --black-a90: @crust;\n --black-a75: @crust;\n --black-a60: fadeout(@crust, 40);\n --black-a45: @crust;\n --black-a30: @crust;\n --black-a15: @crust;\n --black-a12: @crust;\n --black-a08: @crust;\n --black-a04: @crust;\n --black-a100: @crust;\n\n --white: @text;\n --white-a06: @surface0;\n --white-a12: @surface0;\n --white-a18: @surface0;\n --white-a25: @surface0;\n --white-a30: @text;\n --white-a40: @text;\n --white-a45: @text;\n --white-a55: @text;\n --white-a60: @subtext0;\n --white-a70: @text;\n --white-a75: @text;\n --white-a85: @text;\n --white-a90: @text;\n --white-a100: @text;\n\n --blue-10: @blue;\n --blue-20: @blue;\n --blue-30: @blue;\n --blue-40: @blue;\n --blue-50: @blue;\n --blue-60: @blue;\n --blue-70: @blue;\n --blue-80: @blue;\n --blue-90: @blue;\n --blue-100: @blue;\n --blue-50-a20: fadeout(@blue, 80);\n --blue-50-a25: fadeout(@blue, 75);\n --blue-50-a30: fadeout(@blue, 70);\n --blue-50-a40: fadeout(@blue, 60);\n --blue-60-a10: fadeout(@blue, 90);\n --blue-60-a15: fadeout(@blue, 15);\n --blue-60-a20: fadeout(@blue, 80);\n --blue-60-a25: fadeout(@blue, 75);\n --blue-60-a30: fadeout(@blue, 70);\n --blue-60-a35: fadeout(@blue, 65);\n --blue-60-a40: fadeout(@blue, 60);\n --blue-60-a45: fadeout(@blue, 55);\n --blue-70-a30: fadeout(@sapphire, 70);\n --blue-70-a40: fadeout(@sapphire, 60);\n --blue-70-a50: fadeout(@sapphire, 50);\n\n --cool-gray-10: @mantle;\n --cool-gray-20: @surface0;\n --cool-gray-30: @mantle;\n --cool-gray-40: @mantle;\n --cool-gray-50: @mantle;\n --cool-gray-60: @mantle;\n --cool-gray-70: @mantle;\n --cool-gray-80: @surface0;\n --cool-gray-85: @mantle;\n --cool-gray-90: @mantle;\n --cool-gray-100: @mantle;\n --cool-gray-60-a10: fadeout(@mantle, 90);\n --cool-gray-60-a15: fadeout(@mantle, 85);\n --cool-gray-60-a20: fadeout(@mantle, 80);\n --cool-gray-60-a25: fadeout(@mantle, 75);\n --cool-gray-60-a30: fadeout(@mantle, 70);\n --cool-gray-60-a35: fadeout(@mantle, 65);\n\n --warm-gray-10: @overlay1;\n --warm-gray-20: @overlay1;\n --warm-gray-30: @overlay1;\n --warm-gray-40: @overlay1;\n --warm-gray-50: @overlay1;\n --warm-gray-60: @overlay1;\n --warm-gray-70: @overlay1;\n --warm-gray-80: @overlay1;\n --warm-gray-90: @overlay1;\n --warm-gray-100: @overlay1;\n --warm-gray-60-a10: fadeout(@overlay1, 90);\n --warm-gray-60-a15: fadeout(@overlay1, 85);\n --warm-gray-60-a20: fadeout(@overlay1, 80);\n --warm-gray-60-a25: fadeout(@overlay1, 75);\n --warm-gray-60-a30: fadeout(@overlay1, 70);\n --warm-gray-60-a35: fadeout(@overlay1, 65);\n\n --warm-red-10: @maroon;\n --warm-red-20: @maroon;\n --warm-red-30: @maroon;\n --warm-red-40: @maroon;\n --warm-red-50: @maroon;\n --warm-red-60: @maroon;\n --warm-red-70: @maroon;\n --warm-red-80: @maroon;\n --warm-red-90: @maroon;\n --warm-red-100: @maroon;\n --warm-red-60-a10: fadeout(@maroon, 90);\n --warm-red-60-a15: fadeout(@maroon, 85);\n --warm-red-60-a20: fadeout(@maroon, 80);\n --warm-red-60-a25: fadeout(@maroon, 75);\n --warm-red-60-a30: fadeout(@maroon, 70);\n --warm-red-60-a35: fadeout(@maroon, 65);\n\n --teal-10: @teal;\n --teal-20: @teal;\n --teal-30: @teal;\n --teal-40: @teal;\n --teal-50: @teal;\n --teal-60: @teal;\n --teal-70: @teal;\n --teal-80: @teal;\n --teal-90: @teal;\n --teal-100: @teal;\n --teal-50-a30: fadein(@teal, 70);\n --teal-60-a10: fadeout(@teal, 90);\n --teal-60-a15: fadeout(@teal, 85);\n --teal-60-a20: fadeout(@teal, 80);\n --teal-60-a25: fadeout(@teal, 75);\n --teal-60-a30: fadeout(@teal, 70);\n --teal-60-a35: fadeout(@teal, 65);\n\n --purple-10: @lavender;\n --purple-20: @lavender;\n --purple-30: @lavender;\n --purple-40: @lavender;\n --purple-50: @lavender;\n --purple-60: @lavender;\n --purple-70: @lavender;\n --purple-80: @lavender;\n --purple-90: @lavender;\n --purple-100: @lavender;\n --purple-40-a15: fadeout(@lavender, 85);\n --purple-60-a10: fadeout(@lavender, 90);\n --purple-60-a15: fadeout(@lavender, 85);\n --purple-60-a20: fadeout(@lavender, 80);\n --purple-60-a25: fadeout(@lavender, 75);\n --purple-60-a30: fadeout(@lavender, 70);\n --purple-60-a35: fadeout(@lavender, 65);\n --purple-70-a15: fadeout(@lavender, 85);\n\n --system-red-10: @red;\n --system-red-20: @red;\n --system-red-30: @red;\n --system-red-40: @red;\n --system-red-50: @red;\n --system-red-60: @red;\n --system-red-70: @red;\n --system-red-80: @red;\n --system-red-90: @red;\n --system-red-100: @red;\n --system-red-60-a10: fadeout(@red, 90);\n --system-red-60-a15: fadeout(@red, 85);\n --system-red-60-a20: fadeout(@red, 80);\n --system-red-60-a25: fadeout(@red, 75);\n --system-red-60-a30: fadeout(@red, 70);\n --system-red-60-a35: fadeout(@red, 65);\n\n --system-green-10: darken(@green, 20);\n --system-green-20: darken(@green, 20);\n --system-green-30: darken(@green, 20);\n --system-green-40: darken(@green, 20);\n --system-green-50: darken(@green, 20);\n --system-green-60: darken(@green, 20);\n --system-green-70: darken(@green, 20);\n --system-green-80: darken(@green, 20);\n --system-green-90: darken(@green, 20);\n --system-green-100: darken(@green, 20);\n --system-green-60-a10: fadeout(darken(@green, 20), 90);\n --system-green-60-a15: fadeout(darken(@green, 20), 85);\n --system-green-60-a20: fadeout(darken(@green, 20), 80);\n --system-green-60-a25: fadeout(darken(@green, 20), 75);\n --system-green-60-a30: fadeout(darken(@green, 20), 70);\n --system-green-60-a35: fadeout(darken(@green, 20), 65);\n\n --pink-10: @pink;\n --pink-20: @pink;\n --pink-30: @pink;\n --pink-40: @pink;\n --pink-50: @pink;\n --pink-60: @pink;\n --pink-70: @pink;\n --pink-80: @pink;\n --pink-90: @pink;\n --pink-100: @pink;\n --pink-60-a10: fadeout(@pink, 90);\n --pink-60-a15: fadeout(@pink, 85);\n --pink-60-a20: fadeout(@pink, 80);\n --pink-60-a25: fadeout(@pink, 75);\n --pink-60-a30: fadeout(@pink, 70);\n --pink-60-a35: fadeout(@pink, 65);\n\n --amber-10: @yellow;\n --amber-20: @yellow;\n --amber-30: @yellow;\n --amber-40: @yellow;\n --amber-50: @yellow;\n --amber-60: @yellow;\n --amber-70: @yellow;\n --amber-80: @yellow;\n --amber-90: @yellow;\n --amber-100: @yellow;\n --amber-30-a50: fadein(@yellow, 50);\n --amber-60-a10: fadeout(@yellow, 90);\n --amber-60-a15: fadeout(@yellow, 85);\n --amber-60-a20: fadeout(@yellow, 80);\n --amber-60-a25: fadeout(@yellow, 75);\n --amber-60-a30: fadeout(@yellow, 70);\n --amber-60-a35: fadeout(@yellow, 65);\n\n --copper-10: @rosewater;\n --copper-20: @rosewater;\n --copper-30: @rosewater;\n --copper-40: @rosewater;\n --copper-50: @rosewater;\n --copper-60: @rosewater;\n --copper-70: @rosewater;\n --copper-80: @rosewater;\n --copper-90: @rosewater;\n --copper-100: @rosewater;\n --copper-60-a10: fadeout(@rosewater, 90);\n --copper-60-a15: fadeout(@rosewater, 85);\n --copper-60-a20: fadeout(@rosewater, 80);\n --copper-60-a25: fadeout(@rosewater, 75);\n --copper-60-a30: fadeout(@rosewater, 70);\n --copper-60-a35: fadeout(@rosewater, 65);\n\n --green-10: @green;\n --green-20: @green;\n --green-30: @green;\n --green-40: @green;\n --green-50: @green;\n --green-60: @green;\n --green-70: @green;\n --green-80: @green;\n --green-90: @green;\n --green-100: @green;\n --green-60-a10: fadeout(@green, 90);\n --green-60-a15: fadeout(@green, 85);\n --green-60-a20: fadeout(@green, 80);\n --green-60-a25: fadeout(@green, 75);\n --green-60-a30: fadeout(@green, 70);\n --green-60-a35: fadeout(@green, 65);\n\n --sage-10: darken(@green, 40);\n --sage-20: darken(@green, 40);\n --sage-30: darken(@green, 40);\n --sage-40: darken(@green, 40);\n --sage-50: darken(@green, 40);\n --sage-60: darken(@green, 40);\n --sage-70: darken(@green, 40);\n --sage-80: darken(@green, 40);\n --sage-90: darken(@green, 40);\n --sage-100: darken(@green, 40);\n --sage-60-a10: fadeout(darken(@green, 40), 90);\n --sage-60-a15: fadeout(darken(@green, 40), 85);\n --sage-60-a20: fadeout(darken(@green, 40), 80);\n --sage-60-a25: fadeout(darken(@green, 40), 75);\n --sage-60-a30: fadeout(darken(@green, 40), 70);\n --sage-60-a35: fadeout(darken(@green, 40), 65);\n\n --lime-10: lighten(@green, 20);\n --lime-20: lighten(@green, 20);\n --lime-30: lighten(@green, 20);\n --lime-40: lighten(@green, 20);\n --lime-50: lighten(@green, 20);\n --lime-60: lighten(@green, 20);\n --lime-70: lighten(@green, 20);\n --lime-80: lighten(@green, 20);\n --lime-90: lighten(@green, 20);\n --lime-100: lighten(@green, 20);\n --lime-60-a10: fadeout(lighten(@green, 20), 90);\n --lime-60-a15: fadeout(lighten(@green, 20), 85);\n --lime-60-a20: fadeout(lighten(@green, 20), 80);\n --lime-60-a25: fadeout(lighten(@green, 20), 75);\n --lime-60-a30: fadeout(lighten(@green, 20), 70);\n --lime-60-a35: fadeout(lighten(@green, 20), 65);\n\n --camo-10: @accent-color;\n --camo-20: @accent-color;\n --camo-30: @accent-color;\n --camo-40: @accent-color;\n --camo-50: @accent-color;\n --camo-60: @accent-color;\n --camo-70: @accent-color;\n --camo-80: @accent-color;\n --camo-90: @accent-color;\n --camo-100: @accent-color;\n --camo-60-a10: fadeout(@accent-color, 90);\n --camo-60-a15: fadeout(@accent-color, 85);\n --camo-60-a20: fadeout(@accent-color, 80);\n --camo-60-a25: fadeout(@accent-color, 75);\n --camo-60-a30: fadeout(@accent-color, 70);\n --camo-60-a35: fadeout(@accent-color, 65);\n\n --smoke-10: @surface1;\n --smoke-20: @surface1;\n --smoke-30: @surface1;\n --smoke-40: @surface1;\n --smoke-50: @surface1;\n --smoke-60: @surface1;\n --smoke-70: @surface1;\n --smoke-80: @surface1;\n --smoke-90: @surface1;\n --smoke-100: @surface1;\n --smoke-60-a10: fadeout(@surface1, 90);\n --smoke-60-a15: fadeout(@surface1, 85);\n --smoke-60-a20: fadeout(@surface1, 80);\n --smoke-60-a25: fadeout(@surface1, 75);\n --smoke-60-a30: fadeout(@surface1, 70);\n --smoke-60-a35: fadeout(@surface1, 65);\n\n --lavender-10: @lavender;\n --lavender-20: @lavender;\n --lavender-30: @lavender;\n --lavender-40: @lavender;\n --lavender-50: @lavender;\n --lavender-60: @lavender;\n --lavender-70: @lavender;\n --lavender-80: @lavender;\n --lavender-90: @lavender;\n --lavender-100: @lavender;\n --lavender-60-a10: fadeout(@lavender, 90);\n --lavender-60-a15: fadeout(@lavender, 85);\n --lavender-60-a20: fadeout(@lavender, 80);\n --lavender-60-a25: fadeout(@lavender, 75);\n --lavender-60-a30: fadeout(@lavender, 70);\n --lavender-60-a35: fadeout(@lavender, 65);\n\n --mauve-10: @mauve;\n --mauve-20: @mauve;\n --mauve-30: @mauve;\n --mauve-40: @mauve;\n --mauve-50: @mauve;\n --mauve-60: @mauve;\n --mauve-70: @mauve;\n --mauve-80: @mauve;\n --mauve-90: @mauve;\n --mauve-100: @mauve;\n --mauve-60-a10: fadeout(@mauve, 90);\n --mauve-60-a15: fadeout(@mauve, 85);\n --mauve-60-a20: fadeout(@mauve, 80);\n --mauve-60-a25: fadeout(@mauve, 75);\n --mauve-60-a30: fadeout(@mauve, 70);\n --mauve-60-a35: fadeout(@mauve, 65);\n --mauve-80-a50: fadeout(@mauve, 50);\n\n --system-gray-10: @surface0;\n --system-gray-20: @surface0;\n --system-gray-30: @surface0;\n --system-gray-40: @surface0;\n --system-gray-50: @surface0;\n --system-gray-60: @surface0;\n --system-gray-70: @surface0;\n --system-gray-80: @surface0;\n --system-gray-90: @surface0;\n --system-gray-100: @surface0;\n --system-gray-60-a10: fadeout(@surface0, 90);\n --system-gray-60-a15: fadeout(@surface0, 85);\n --system-gray-60-a20: fadeout(@surface0, 80);\n --system-gray-60-a25: fadeout(@surface0, 75);\n --system-gray-60-a30: fadeout(@surface0, 70);\n --system-gray-60-a35: fadeout(@surface0, 65);\n --system-gray-60-a40: fadeout(@surface0, 60);\n --system-gray-60-a45: fadeout(@surface0, 55);\n\n --system-orange-10: @peach;\n --system-orange-20: @peach;\n --system-orange-30: @peach;\n --system-orange-40: @peach;\n --system-orange-50: @peach;\n --system-orange-60: @peach;\n --system-orange-70: @peach;\n --system-orange-80: @peach;\n --system-orange-90: @peach;\n --system-orange-100: @peach;\n --system-orange-60-a10: fadeout(@peach, 90);\n --system-orange-60-a15: fadeout(@peach, 85);\n --system-orange-60-a20: fadeout(@peach, 80);\n --system-orange-60-a25: fadeout(@peach, 75);\n --system-orange-60-a30: fadeout(@peach, 70);\n --system-orange-60-a35: fadeout(@peach, 65);\n\n /* quality of life changes */\n --color-border-low-emphasis: @surface0;\n\n /* Codeblock fixes */\n pre {\n --color-text-on-dark: @text;\n --color-background-container-dark-tint: @crust;\n }\n\n /* more accent */\n --voyager-color-background-badge-notification: @accent-color;\n --color-signal-positive: @accent-color;\n --color-checked: @accent-color;\n --color-checked-hover: @accent-color;\n --color-checked-active: @accent-color;\n\n /* fix for hover buttons */\n --artdeco-button-secondary-default-hover-background-color: fadeout(\n @blue,\n 80\n );\n\n /* text on dark */\n --color-text-on-dark: @text;\n\n & when not (@lookup =latte) {\n --color-element: @crust;\n }\n\n & when (@lookup =latte) {\n --black: @text;\n --black-a90: @text;\n --black-a75: @text;\n --black-a45: @text;\n --black-a30: @text;\n --black-a60: @subtext0;\n --black-a15: @text;\n --black-a04: @text;\n --black-a100: @text;\n\n --color-scrim: fadeout(@crust, 60%);\n --color-icon-on-dark: @text;\n\n --white: @mantle;\n --white-a06: @surface0;\n --white-a12: @surface0;\n --white-a18: @surface0;\n --white-a25: @surface0;\n --white-a30: @mantle;\n --white-a40: @mantle;\n --white-a45: @mantle;\n --white-a55: @mantle;\n --white-a60: @subtext0;\n --white-a70: @mantle;\n --white-a75: @mantle;\n --white-a85: @mantle;\n --white-a90: @mantle;\n --white-a100: @mantle;\n\n --warm-gray-10: @base;\n --warm-gray-20: @base;\n --warm-gray-30: @base;\n --warm-gray-40: @base;\n --warm-gray-50: @base;\n --warm-gray-60: @base;\n --warm-gray-70: @base;\n --warm-gray-80: @base;\n --warm-gray-90: @base;\n --warm-gray-100: @base;\n --warm-gray-60-a10: fadeout(@base, 90);\n --warm-gray-60-a15: fadeout(@base, 85);\n --warm-gray-60-a20: fadeout(@base, 80);\n --warm-gray-60-a25: fadeout(@base, 75);\n --warm-gray-60-a30: fadeout(@base, 70);\n --warm-gray-60-a35: fadeout(@base, 65);\n }\n\n .share-promoted-detour-button-legacy {\n background-color: @accent-color !important;\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": "LinkedIn Catppuccin",
"namespace": "github.com/catppuccin/userstyles/styles/linkedin",
"homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/linkedin",
"version": "0.0.7",
"updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/linkedin/catppuccin.user.css",
"supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alinkedin",
"description": "Soothing pastel theme for LinkedIn",
"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 LinkedIn",
"url": "https://github.com/catppuccin/userstyles/tree/main/styles/linkedin",
"updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/linkedin/catppuccin.user.css",
"name": "LinkedIn Catppuccin",
"originalDigest": "5a2463d5d2e29110f305cc90e25cae446204d489",
"_id": "6b9476a3-0669-4f08-ad55-60fd4bebfd93",
"_rev": 1728404438977,
"id": 19,
"etag": "W/\"a5578a7340e7f57f0d4ce9dc07dc20b72a8bf17242e79b1f1ce76528a33061bc\"",
"updateDate": 1728404438928
},
{
"enabled": true,
"installDate": 1715537040451,
"sections": [
{
"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.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.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",
"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": "sky",
"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"
}
]
},
"colorizeLogo": {
"type": "checkbox",
"label": "Colorize Logo",
"name": "colorizeLogo",
"value": "1",
"default": "0",
"options": null
},
"darkenShadows": {
"type": "checkbox",
"label": "Darken Shadows on Dark Themes",
"name": "darkenShadows",
"value": null,
"default": "1",
"options": null
}
}
},
"author": "Catppuccin",
"description": "Soothing pastel theme for Twitter",
"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": "c7afc1090d28a49801a4b6c3793f63e61e42e4d1",
"_id": "1e139126-7c8a-4c1b-9d13-6a2e55fa4423",
"_rev": 1716187649552,
"id": 20,
"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.2.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@1.0.0/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 --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 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: transparent;\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 {\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: @text !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 .sunset-background {\n background-color: @base !important;\n color: @text !important;\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 [alt=\"Unix & Linux\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n &:has([alt=\"Unix & Linux\"]) {\n @svg: escape(\n ''\n );\n background-image: 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.2.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": "c837f7906588ee8238cb435754d583abd498d679",
"_id": "1962007f-3241-4a9e-89e0-dd1644e6bfaf",
"_rev": 1729667933033,
"id": 21,
"etag": "W/\"0fb7230f35be322e6029c9aaff194414bbe6312665348f2d1574a41bd440f126\"",
"updateDate": 1729667932972
},
{
"enabled": true,
"installDate": 1730119940973,
"sections": [
{
"code": ""
}
],
"sourceCode": "/*==UserStyle==\n@name Youtube Music Catppuccin\n@namespace github.com/catppuccin/youtubemusic\n@version 0.4.3\n@description Soothing pastel theme for Youtube Music\n@author Catppuccin\n@updateURL https://raw.githubusercontent.com/catppuccin/youtubemusic/main/src/youtubemusic.user.css\n@preprocessor less\n\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(\"music.youtube.com\") {\n @import (css) url(\"https://youtubemusic.catppuccin.com/src/@{lightFlavor}.css\") (prefers-color-scheme: light);\n @import (css) url(\"https://youtubemusic.catppuccin.com/src/@{darkFlavor}.css\") (prefers-color-scheme: dark);\n \n html:not(.style-scope) {\n @accent: \"--ctp-@{accentColor}\";\n --ctp-accent: var(e(@accent)) !important;\n }\n}\n",
"usercssData": {
"name": "Youtube Music Catppuccin",
"namespace": "github.com/catppuccin/youtubemusic",
"version": "0.4.3",
"description": "Soothing pastel theme for Youtube Music",
"author": "Catppuccin",
"updateURL": "https://raw.githubusercontent.com/catppuccin/youtubemusic/main/src/youtubemusic.user.css",
"preprocessor": "less",
"vars": {
"lightFlavor": {
"type": "select",
"label": "Light Flavor",
"name": "lightFlavor",
"value": "macchiato",
"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": "red",
"default": "sapphire",
"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 Youtube Music",
"updateUrl": "https://raw.githubusercontent.com/catppuccin/youtubemusic/main/src/youtubemusic.user.css",
"name": "Youtube Music Catppuccin",
"preferScheme": "dark",
"originalDigest": "21afdba5c2f4f854275ae4cc35e6107549937656",
"_id": "19e5a670-10a3-48ca-a1a3-b4d6c31ca9e6",
"_rev": 1730119940973,
"id": 22,
"etag": "W/\"2e7b9cbf89be9664e93c5662916c9fcd12408f73fd601df0e293e3e1f1707a27\""
}
]