diff --git a/home/.config/fish/functions/autostart.fish b/home/.config/fish/functions/autostart.fish index 20a299c..cd6a9c7 100644 --- a/home/.config/fish/functions/autostart.fish +++ b/home/.config/fish/functions/autostart.fish @@ -1,3 +1,3 @@ function autostart - pypr & hyprpaper & waybar & poweralertd & wl-paste --type text --watch cliphist store & wl-paste --type image --watch cliphist store & wl-clip-persist --clipboard regular & avizo-service & systemctl --user start psi-notify & hypridle + pypr & hyprpaper & waybar & poweralertd -s & wl-paste --type text --watch cliphist store & wl-paste --type image --watch cliphist store & wl-clip-persist --clipboard regular & avizo-service & systemctl --user start psi-notify end diff --git a/home/.config/helix/languages.toml b/home/.config/helix/languages.toml index 3079b31..67b0b6d 100644 --- a/home/.config/helix/languages.toml +++ b/home/.config/helix/languages.toml @@ -22,7 +22,7 @@ args = ["--stdio"] [[language]] name = "rust" -language-servers = [ "rust-analyzer" ] +language-servers = [ "rust-analyzer", "copilot" ] [language-server.rust-analyzer.config] checkOnSave = { command = "clippy" } @@ -35,21 +35,25 @@ language-servers = [ "emmet-lsp", "vscode-html-language-server" ] name = "javascript" auto-format = true indent = { tab-width = 4, unit = " " } +language-servers = [ "typescript-language-server", "copilot" ] [[language]] name = "jsx" auto-format = true indent = { tab-width = 4, unit = " " } +language-servers = [ "typescript-language-server", "copilot" ] [[language]] name = "typescript" auto-format = true indent = { tab-width = 4, unit = " " } +language-servers = [ "typescript-language-server", "copilot" ] [[language]] name = "tsx" auto-format = true indent = { tab-width = 4, unit = " " } +language-servers = [ "typescript-language-server", "copilot" ] [[language]] name = "config" diff --git a/home/.config/hypr/hyprland.conf b/home/.config/hypr/hyprland.conf index e063548..fd1db7a 100644 --- a/home/.config/hypr/hyprland.conf +++ b/home/.config/hypr/hyprland.conf @@ -164,24 +164,31 @@ device { # Example windowrule v1 # windowrule = float, ^(kitty)$ -windowrule = opaque, brave -windowrule = float, imv -windowrule = opaque, imv -windowrule = float, title:(Media viewer) -windowrule = opaque, title:(Media viewer) -windowrule = opaque, title:(YouTube Music) -windowrule = opaque, title:(qutebrowser) -windowrule = opaque, title:(Slack) -windowrule = opaque, telegram -windowrule = float, mpv -windowrule = opaque, mpv -windowrule = opaque, swappy -windowrule = center 1, swappy -windowrule = stayfocused, swappy -# windowrule = size 50% 50%, mpv -# Example windowrule v2 -# windowrulev2 = float,class:^(kitty)$,title:^(kitty)$ -# See https://wiki.hyprland.org/Configuring/Window-Rules/ for more +windowrule = float, title:.*mpv$ +windowrule = opaque, title:.*mpv$ +windowrule = size 50% 50%, title:.*mpv$ +windowrule = float, content:video +windowrule = opaque, content:video +windowrule = size 50% 50%, content:video + +windowrule = float, title:.*imv.* +windowrule = opaque, title:.*imv.* +windowrule = size 70% 70%, title:.*imv.* +windowrule = float, content:photo +windowrule = opaque, content:photo +windowrule = size 70% 70%, content:photo + +windowrule = float, title:.*\.pdf$ +windowrule = opaque, title:.*\.pdf$ +windowrule = maximize, title:.*\.pdf$ + +windowrule = opaque, title:.*YouTube - Brave$ + +windowrule = opaque, title:swappy +windowrule = center 1, title:swappy +windowrule = stayfocused, title:swappy + +windowrule = opaque, title:^TelegramDesktop$ # See https://wiki.hyprland.org/Configuring/Keywords/ for more $mainMod = SUPER @@ -236,11 +243,11 @@ submap=reset # Scrachpads bind = $mainMod CTRL, T, exec, pypr toggle term -$dropterm = ^(wezterm_dropdown)$ +$dropterm = title:^wezterm_dropdown$ windowrule = float, $dropterm bind = $mainMod CTRL, V, exec, pypr toggle volume -$volume_sidemenu = ^(pavucontrol)$ +$volume_sidemenu = title:^Volume Control$ windowrule = float, $volume_sidemenu # Example binds, see https://wiki.hyprland.org/Configuring/Binds/ for more @@ -294,8 +301,8 @@ bind = , XF86AudioLowerVolume, exec, volumectl -u down bind = , XF86AudioMute, exec, volumectl toggle-mute bind = , XF86AudioMicMute, exec, volumectl -m toggle-mute -bind = , XF86MonBrightnessUp, exec, lightctl up -bind = , XF86MonBrightnessDown, exec, lightctl down +bind = , XF86MonBrightnessUp, exec, lightctl -D intel_backlight up +bind = , XF86MonBrightnessDown, exec, lightctl -D intel_backlight down # Move focus with mainMod + arrow keys bind = $mainMod, left, movefocus, l diff --git a/home/.config/hypr/pyprland.toml b/home/.config/hypr/pyprland.toml index 632b1c2..a824fcd 100644 --- a/home/.config/hypr/pyprland.toml +++ b/home/.config/hypr/pyprland.toml @@ -8,7 +8,8 @@ plugins = [ ] [scratchpads.term] -command = "wezterm start --always-new-process --class wezterm_dropdown" +command = "wezterm start --always-new-process" +class = "wezterm_dropdown" animation = "fromTop" unfocus = "hide" excludes = "*" @@ -16,7 +17,7 @@ lazy = true multi = false [scratchpads.volume] -command = "pavucontrol --class volume_sidemenu" +command = "pavucontrol" animation = "fromLeft" class = "volume_sidemenu" size = "40% 70%" diff --git a/home/.config/kitty/kitty.conf b/home/.config/kitty/kitty.conf new file mode 100644 index 0000000..e37530d --- /dev/null +++ b/home/.config/kitty/kitty.conf @@ -0,0 +1,2683 @@ +# vim:fileencoding=utf-8:foldmethod=marker + +#: Fonts {{{ + +#: kitty has very powerful font management. You can configure +#: individual font faces and even specify special fonts for particular +#: characters. + +font_family JetBrains Mono +bold_font JetBrains Mono Bold +italic_font JetBrains Mono Italic +bold_italic_font JetBrains Mono Bold Italic + +symbol_map U+E0A0-U+E0A3,U+E0C0-U+E0C7 PowerlineSymbols + +# Nerd Fonts v3.2.0 + +symbol_map U+e000-U+e00a,U+ea60-U+ebeb,U+e0a0-U+e0c8,U+e0ca,U+e0cc-U+e0d7,U+e200-U+e2a9,U+e300-U+e3e3,U+e5fa-U+e6b1,U+e700-U+e7c5,U+ed00-U+efc1,U+f000-U+f2ff,U+f000-U+f2e0,U+f300-U+f372,U+f400-U+f533,U+f0001-U+f1af0 Symbols Nerd Font Mono + +#: You can specify different fonts for the bold/italic/bold-italic +#: variants. The easiest way to select fonts is to run the `kitten +#: choose-fonts` command which will present a nice UI for you to +#: select the fonts you want with previews and support for selecting +#: variable fonts and font features. If you want to learn to select +#: fonts manually, read the font specification syntax +#: . + +font_size 12.0 + +#: Font size (in pts). + +# force_ltr no + +#: kitty does not support BIDI (bidirectional text), however, for RTL +#: scripts, words are automatically displayed in RTL. That is to say, +#: in an RTL script, the words "HELLO WORLD" display in kitty as +#: "WORLD HELLO", and if you try to select a substring of an RTL- +#: shaped string, you will get the character that would be there had +#: the string been LTR. For example, assuming the Hebrew word ירושלים, +#: selecting the character that on the screen appears to be ם actually +#: writes into the selection buffer the character י. kitty's default +#: behavior is useful in conjunction with a filter to reverse the word +#: order, however, if you wish to manipulate RTL glyphs, it can be +#: very challenging to work with, so this option is provided to turn +#: it off. Furthermore, this option can be used with the command line +#: program GNU FriBidi +#: to get BIDI support, because it will force kitty to always treat +#: the text as LTR, which FriBidi expects for terminals. + +# symbol_map + +#: E.g. symbol_map U+E0A0-U+E0A3,U+E0C0-U+E0C7 PowerlineSymbols + +#: Map the specified Unicode codepoints to a particular font. Useful +#: if you need special rendering for some symbols, such as for +#: Powerline. Avoids the need for patched fonts. Each Unicode code +#: point is specified in the form `U+`. You +#: can specify multiple code points, separated by commas and ranges +#: separated by hyphens. This option can be specified multiple times. +#: The syntax is:: + +#: symbol_map codepoints Font Family Name + +# narrow_symbols + +#: E.g. narrow_symbols U+E0A0-U+E0A3,U+E0C0-U+E0C7 1 + +#: Usually, for Private Use Unicode characters and some symbol/dingbat +#: characters, if the character is followed by one or more spaces, +#: kitty will use those extra cells to render the character larger, if +#: the character in the font has a wide aspect ratio. Using this +#: option you can force kitty to restrict the specified code points to +#: render in the specified number of cells (defaulting to one cell). +#: This option can be specified multiple times. The syntax is:: + +#: narrow_symbols codepoints [optionally the number of cells] + +# disable_ligatures never + +#: Choose how you want to handle multi-character ligatures. The +#: default is to always render them. You can tell kitty to not render +#: them when the cursor is over them by using cursor to make editing +#: easier, or have kitty never render them at all by using always, if +#: you don't like them. The ligature strategy can be set per-window +#: either using the kitty remote control facility or by defining +#: shortcuts for it in kitty.conf, for example:: + +#: map alt+1 disable_ligatures_in active always +#: map alt+2 disable_ligatures_in all never +#: map alt+3 disable_ligatures_in tab cursor + +#: Note that this refers to programming ligatures, typically +#: implemented using the calt OpenType feature. For disabling general +#: ligatures, use the font_features option. + +# font_features + +#: E.g. font_features none + +#: Choose exactly which OpenType features to enable or disable. Note +#: that for the main fonts, features can be specified when selecting +#: the font using the choose-fonts kitten. This setting is useful for +#: fallback fonts. + +#: Some fonts might have features worthwhile in a terminal. For +#: example, Fira Code includes a discretionary feature, zero, which in +#: that font changes the appearance of the zero (0), to make it more +#: easily distinguishable from Ø. Fira Code also includes other +#: discretionary features known as Stylistic Sets which have the tags +#: ss01 through ss20. + +#: For the exact syntax to use for individual features, see the +#: HarfBuzz documentation . + +#: Note that this code is indexed by PostScript name, and not the font +#: family. This allows you to define very precise feature settings; +#: e.g. you can disable a feature in the italic font but not in the +#: regular font. + +#: On Linux, font features are first read from the FontConfig database +#: and then this option is applied, so they can be configured in a +#: single, central place. + +#: To get the PostScript name for a font, use the `fc-scan file.ttf` +#: command on Linux or the `Font Book tool on macOS +#: `__. + +#: Enable alternate zero and oldstyle numerals:: + +#: font_features FiraCode-Retina +zero +onum + +#: Enable only alternate zero in the bold font:: + +#: font_features FiraCode-Bold +zero + +#: Disable the normal ligatures, but keep the calt feature which (in +#: this font) breaks up monotony:: + +#: font_features TT2020StyleB-Regular -liga +calt + +#: In conjunction with force_ltr, you may want to disable Arabic +#: shaping entirely, and only look at their isolated forms if they +#: show up in a document. You can do this with e.g.:: + +#: font_features UnifontMedium +isol -medi -fina -init + +# modify_font + +#: Modify font characteristics such as the position or thickness of +#: the underline and strikethrough. The modifications can have the +#: suffix px for pixels or % for percentage of original value. No +#: suffix means use pts. For example:: + +#: modify_font underline_position -2 +#: modify_font underline_thickness 150% +#: modify_font strikethrough_position 2px + +#: Additionally, you can modify the size of the cell in which each +#: font glyph is rendered and the baseline at which the glyph is +#: placed in the cell. For example:: + +#: modify_font cell_width 80% +#: modify_font cell_height -2px +#: modify_font baseline 3 + +#: Note that modifying the baseline will automatically adjust the +#: underline and strikethrough positions by the same amount. +#: Increasing the baseline raises glyphs inside the cell and +#: decreasing it lowers them. Decreasing the cell size might cause +#: rendering artifacts, so use with care. + +# box_drawing_scale 0.001, 1, 1.5, 2 + +#: The sizes of the lines used for the box drawing Unicode characters. +#: These values are in pts. They will be scaled by the monitor DPI to +#: arrive at a pixel value. There must be four values corresponding to +#: thin, normal, thick, and very thick lines. + +# undercurl_style thin-sparse + +#: The style with which undercurls are rendered. This option takes the +#: form (thin|thick)-(sparse|dense). Thin and thick control the +#: thickness of the undercurl. Sparse and dense control how often the +#: curl oscillates. With sparse the curl will peak once per character, +#: with dense twice. + +# text_composition_strategy platform + +#: Control how kitty composites text glyphs onto the background color. +#: The default value of platform tries for text rendering as close to +#: "native" for the platform kitty is running on as possible. + +#: A value of legacy uses the old (pre kitty 0.28) strategy for how +#: glyphs are composited. This will make dark text on light +#: backgrounds look thicker and light text on dark backgrounds +#: thinner. It might also make some text appear like the strokes are +#: uneven. + +#: You can fine tune the actual contrast curve used for glyph +#: composition by specifying up to two space-separated numbers for +#: this setting. + +#: The first number is the gamma adjustment, which controls the +#: thickness of dark text on light backgrounds. Increasing the value +#: will make text appear thicker. The default value for this is 1.0 on +#: Linux and 1.7 on macOS. Valid values are 0.01 and above. The result +#: is scaled based on the luminance difference between the background +#: and the foreground. Dark text on light backgrounds receives the +#: full impact of the curve while light text on dark backgrounds is +#: affected very little. + +#: The second number is an additional multiplicative contrast. It is +#: percentage ranging from 0 to 100. The default value is 0 on Linux +#: and 30 on macOS. + +#: If you wish to achieve similar looking thickness in light and dark +#: themes, a good way to experiment is start by setting the value to +#: 1.0 0 and use a dark theme. Then adjust the second parameter until +#: it looks good. Then switch to a light theme and adjust the first +#: parameter until the perceived thickness matches the dark theme. + +# text_fg_override_threshold 0 + +#: The minimum accepted difference in luminance between the foreground +#: and background color, below which kitty will override the +#: foreground color. It is percentage ranging from 0 to 100. If the +#: difference in luminance of the foreground and background is below +#: this threshold, the foreground color will be set to white if the +#: background is dark or black if the background is light. The default +#: value is 0, which means no overriding is performed. Useful when +#: working with applications that use colors that do not contrast well +#: with your preferred color scheme. + +#: WARNING: Some programs use characters (such as block characters) +#: for graphics display and may expect to be able to set the +#: foreground and background to the same color (or similar colors). +#: If you see unexpected stripes, dots, lines, incorrect color, no +#: color where you expect color, or any kind of graphic display +#: problem try setting text_fg_override_threshold to 0 to see if this +#: is the cause of the problem. + +#: }}} + +#: Text cursor customization {{{ + +# cursor #cccccc + +#: Default text cursor color. If set to the special value none the +#: cursor will be rendered with a "reverse video" effect. Its color +#: will be the color of the text in the cell it is over and the text +#: will be rendered with the background color of the cell. Note that +#: if the program running in the terminal sets a cursor color, this +#: takes precedence. Also, the cursor colors are modified if the cell +#: background and foreground colors have very low contrast. Note that +#: some themes set this value, so if you want to override it, place +#: your value after the lines where the theme file is included. + +# cursor_text_color #111111 + +#: The color of text under the cursor. If you want it rendered with +#: the background color of the cell underneath instead, use the +#: special keyword: `background`. Note that if cursor is set to none +#: then this option is ignored. Note that some themes set this value, +#: so if you want to override it, place your value after the lines +#: where the theme file is included. + +# cursor_shape block + +#: The cursor shape can be one of block, beam, underline. Note that +#: when reloading the config this will be changed only if the cursor +#: shape has not been set by the program running in the terminal. This +#: sets the default cursor shape, applications running in the terminal +#: can override it. In particular, shell integration +#: in kitty sets +#: the cursor shape to beam at shell prompts. You can avoid this by +#: setting shell_integration to no-cursor. + +# cursor_shape_unfocused hollow + +#: Defines the text cursor shape when the OS window is not focused. +#: The unfocused cursor shape can be one of block, beam, underline, +#: hollow and unchanged (leave the cursor shape as it is). + +# cursor_beam_thickness 1.5 + +#: The thickness of the beam cursor (in pts). + +# cursor_underline_thickness 2.0 + +#: The thickness of the underline cursor (in pts). + +cursor_blink_interval 0.5 linear + +#: The interval to blink the cursor (in seconds). Set to zero to +#: disable blinking. Negative values mean use system default. Note +#: that the minimum interval will be limited to repaint_delay. You can +#: also animate the cursor blink by specifying an easing function. For +#: example, setting this to option to 0.5 ease-in-out will cause the +#: cursor blink to be animated over a second, in the first half of the +#: second it will go from opaque to transparent and then back again +#: over the next half. You can specify different easing functions for +#: the two halves, for example: -1 linear ease-out. kitty supports all +#: the CSS easing functions . Note that turning on animations +#: uses extra power as it means the screen is redrawn multiple times +#: per blink interval. See also, cursor_stop_blinking_after. + +# cursor_stop_blinking_after 15.0 + +cursor_trail 3 +cursor_trail_decay 0.1 0.4 +cursor_trail_start_threshold 2 + +#: Stop blinking cursor after the specified number of seconds of +#: keyboard inactivity. Set to zero to never stop blinking. + +#: }}} + +#: Scrollback {{{ + +# scrollback_lines 2000 + +#: Number of lines of history to keep in memory for scrolling back. +#: Memory is allocated on demand. Negative numbers are (effectively) +#: infinite scrollback. Note that using very large scrollback is not +#: recommended as it can slow down performance of the terminal and +#: also use large amounts of RAM. Instead, consider using +#: scrollback_pager_history_size. Note that on config reload if this +#: is changed it will only affect newly created windows, not existing +#: ones. + +# scrollback_indicator_opacity 1.0 + +#: The opacity of the scrollback indicator which is a small colored +#: rectangle that moves along the right hand side of the window as you +#: scroll, indicating what fraction you have scrolled. The default is +#: one which means fully opaque, aka visible. Set to a value between +#: zero and one to make the indicator less visible. + +# scrollback_pager less --chop-long-lines --RAW-CONTROL-CHARS +INPUT_LINE_NUMBER + +#: Program with which to view scrollback in a new window. The +#: scrollback buffer is passed as STDIN to this program. If you change +#: it, make sure the program you use can handle ANSI escape sequences +#: for colors and text formatting. INPUT_LINE_NUMBER in the command +#: line above will be replaced by an integer representing which line +#: should be at the top of the screen. Similarly CURSOR_LINE and +#: CURSOR_COLUMN will be replaced by the current cursor position or +#: set to 0 if there is no cursor, for example, when showing the last +#: command output. + +# scrollback_pager_history_size 0 + +#: Separate scrollback history size (in MB), used only for browsing +#: the scrollback buffer with pager. This separate buffer is not +#: available for interactive scrolling but will be piped to the pager +#: program when viewing scrollback buffer in a separate window. The +#: current implementation stores the data in UTF-8, so approximately +#: 10000 lines per megabyte at 100 chars per line, for pure ASCII, +#: unformatted text. A value of zero or less disables this feature. +#: The maximum allowed size is 4GB. Note that on config reload if this +#: is changed it will only affect newly created windows, not existing +#: ones. + +# scrollback_fill_enlarged_window no + +#: Fill new space with lines from the scrollback buffer after +#: enlarging a window. + +# wheel_scroll_multiplier 5.0 + +#: Multiplier for the number of lines scrolled by the mouse wheel. +#: Note that this is only used for low precision scrolling devices, +#: not for high precision scrolling devices on platforms such as macOS +#: and Wayland. Use negative numbers to change scroll direction. See +#: also wheel_scroll_min_lines. + +# wheel_scroll_min_lines 1 + +#: The minimum number of lines scrolled by the mouse wheel. The scroll +#: multiplier wheel_scroll_multiplier only takes effect after it +#: reaches this number. Note that this is only used for low precision +#: scrolling devices like wheel mice that scroll by very small amounts +#: when using the wheel. With a negative number, the minimum number of +#: lines will always be added. + +# touch_scroll_multiplier 1.0 + +#: Multiplier for the number of lines scrolled by a touchpad. Note +#: that this is only used for high precision scrolling devices on +#: platforms such as macOS and Wayland. Use negative numbers to change +#: scroll direction. + +#: }}} + +#: Mouse {{{ + +# mouse_hide_wait 3.0 + +#: Hide mouse cursor after the specified number of seconds of the +#: mouse not being used. Set to zero to disable mouse cursor hiding. +#: Set to a negative value to hide the mouse cursor immediately when +#: typing text. Disabled by default on macOS as getting it to work +#: robustly with the ever-changing sea of bugs that is Cocoa is too +#: much effort. + +# url_color #0087bd +# url_style curly + +#: The color and style for highlighting URLs on mouse-over. url_style +#: can be one of: none, straight, double, curly, dotted, dashed. + +# open_url_with default + +#: The program to open clicked URLs. The special value default will +#: first look for any URL handlers defined via the open_actions +#: facility and if non +#: are found, it will use the Operating System's default URL handler +#: (open on macOS and xdg-open on Linux). + +# url_prefixes file ftp ftps gemini git gopher http https irc ircs kitty mailto news sftp ssh + +#: The set of URL prefixes to look for when detecting a URL under the +#: mouse cursor. + +# detect_urls yes + +#: Detect URLs under the mouse. Detected URLs are highlighted with an +#: underline and the mouse cursor becomes a hand over them. Even if +#: this option is disabled, URLs are still clickable. See also the +#: underline_hyperlinks option to control how hyperlinks (as opposed +#: to plain text URLs) are displayed. + +# url_excluded_characters + +#: Additional characters to be disallowed from URLs, when detecting +#: URLs under the mouse cursor. By default, all characters that are +#: legal in URLs are allowed. Additionally, newlines are allowed (but +#: stripped). This is to accommodate programs such as mutt that add +#: hard line breaks even for continued lines. \n can be added to this +#: option to disable this behavior. Special characters can be +#: specified using backslash escapes, to specify a backslash use a +#: double backslash. + +# show_hyperlink_targets no + +#: When the mouse hovers over a terminal hyperlink, show the actual +#: URL that will be activated when the hyperlink is clicked. + +# underline_hyperlinks hover + +#: Control how hyperlinks are underlined. They can either be +#: underlined on mouse hover, always (i.e. permanently underlined) or +#: never which means that kitty will not apply any underline styling +#: to hyperlinks. Uses the url_style and url_color settings for the +#: underline style. Note that reloading the config and changing this +#: value to/from always will only affect text subsequently received by +#: kitty. + +# copy_on_select no + +#: Copy to clipboard or a private buffer on select. With this set to +#: clipboard, selecting text with the mouse will cause the text to be +#: copied to clipboard. Useful on platforms such as macOS that do not +#: have the concept of primary selection. You can instead specify a +#: name such as a1 to copy to a private kitty buffer. Map a shortcut +#: with the paste_from_buffer action to paste from this private +#: buffer. For example:: + +#: copy_on_select a1 +#: map shift+cmd+v paste_from_buffer a1 + +#: Note that copying to the clipboard is a security risk, as all +#: programs, including websites open in your browser can read the +#: contents of the system clipboard. + +# paste_actions quote-urls-at-prompt,confirm + +#: A comma separated list of actions to take when pasting text into +#: the terminal. The supported paste actions are: + +#: quote-urls-at-prompt: +#: If the text being pasted is a URL and the cursor is at a shell prompt, +#: automatically quote the URL (needs shell_integration). +#: replace-dangerous-control-codes +#: Replace dangerous control codes from pasted text, without confirmation. +#: replace-newline +#: Replace the newline character from pasted text, without confirmation. +#: confirm: +#: Confirm the paste if the text to be pasted contains any terminal control codes +#: as this can be dangerous, leading to code execution if the shell/program running +#: in the terminal does not properly handle these. +#: confirm-if-large +#: Confirm the paste if it is very large (larger than 16KB) as pasting +#: large amounts of text into shells can be very slow. +#: filter: +#: Run the filter_paste() function from the file paste-actions.py in +#: the kitty config directory on the pasted text. The text returned by the +#: function will be actually pasted. +#: no-op: +#: Has no effect. + +# strip_trailing_spaces never + +#: Remove spaces at the end of lines when copying to clipboard. A +#: value of smart will do it when using normal selections, but not +#: rectangle selections. A value of always will always do it. + +# select_by_word_characters @-./_~?&=%+# + +#: Characters considered part of a word when double clicking. In +#: addition to these characters any character that is marked as an +#: alphanumeric character in the Unicode database will be matched. + +# select_by_word_characters_forward + +#: Characters considered part of a word when extending the selection +#: forward on double clicking. In addition to these characters any +#: character that is marked as an alphanumeric character in the +#: Unicode database will be matched. + +#: If empty (default) select_by_word_characters will be used for both +#: directions. + +# click_interval -1.0 + +#: The interval between successive clicks to detect double/triple +#: clicks (in seconds). Negative numbers will use the system default +#: instead, if available, or fallback to 0.5. + +# focus_follows_mouse no + +#: Set the active window to the window under the mouse when moving the +#: mouse around. On macOS, this will also cause the OS Window under +#: the mouse to be focused automatically when the mouse enters it. + +# pointer_shape_when_grabbed arrow + +#: The shape of the mouse pointer when the program running in the +#: terminal grabs the mouse. + +# default_pointer_shape beam + +#: The default shape of the mouse pointer. + +# pointer_shape_when_dragging beam + +#: The default shape of the mouse pointer when dragging across text. + +#: Mouse actions {{{ + +#: Mouse buttons can be mapped to perform arbitrary actions. The +#: syntax is: + +#: .. code-block:: none + +#: mouse_map button-name event-type modes action + +#: Where button-name is one of left, middle, right, b1 ... b8 with +#: added keyboard modifiers. For example: ctrl+shift+left refers to +#: holding the Ctrl+Shift keys while clicking with the left mouse +#: button. The value b1 ... b8 can be used to refer to up to eight +#: buttons on a mouse. + +#: event-type is one of press, release, doublepress, triplepress, +#: click, doubleclick. modes indicates whether the action is performed +#: when the mouse is grabbed by the program running in the terminal, +#: or not. The values are grabbed or ungrabbed or a comma separated +#: combination of them. grabbed refers to when the program running in +#: the terminal has requested mouse events. Note that the click and +#: double click events have a delay of click_interval to disambiguate +#: from double and triple presses. + +#: You can run kitty with the kitty --debug-input command line option +#: to see mouse events. See the builtin actions below to get a sense +#: of what is possible. + +#: If you want to unmap a button, map it to nothing. For example, to +#: disable opening of URLs with a plain click:: + +#: mouse_map left click ungrabbed + +#: See all the mappable actions including mouse actions here +#: . + +#: .. note:: +#: Once a selection is started, releasing the button that started it will +#: automatically end it and no release event will be dispatched. + +# clear_all_mouse_actions no + +#: Remove all mouse action definitions up to this point. Useful, for +#: instance, to remove the default mouse actions. + +#: Click the link under the mouse or move the cursor + +# mouse_map left click ungrabbed mouse_handle_click selection link prompt + +#:: First check for a selection and if one exists do nothing. Then +#:: check for a link under the mouse cursor and if one exists, click +#:: it. Finally check if the click happened at the current shell +#:: prompt and if so, move the cursor to the click location. Note +#:: that this requires shell integration +#:: to work. + +#: Click the link under the mouse or move the cursor even when grabbed + +# mouse_map shift+left click grabbed,ungrabbed mouse_handle_click selection link prompt + +#:: Same as above, except that the action is performed even when the +#:: mouse is grabbed by the program running in the terminal. + +#: Click the link under the mouse cursor + +# mouse_map ctrl+shift+left release grabbed,ungrabbed mouse_handle_click link + +#:: Variant with Ctrl+Shift is present because the simple click based +#:: version has an unavoidable delay of click_interval, to +#:: disambiguate clicks from double clicks. + +#: Discard press event for link click + +# mouse_map ctrl+shift+left press grabbed discard_event + +#:: Prevent this press event from being sent to the program that has +#:: grabbed the mouse, as the corresponding release event is used to +#:: open a URL. + +#: Paste from the primary selection + +# mouse_map middle release ungrabbed paste_from_selection + +#: Start selecting text + +# mouse_map left press ungrabbed mouse_selection normal + +#: Start selecting text in a rectangle + +# mouse_map ctrl+alt+left press ungrabbed mouse_selection rectangle + +#: Select a word + +# mouse_map left doublepress ungrabbed mouse_selection word + +#: Select a line + +# mouse_map left triplepress ungrabbed mouse_selection line + +#: Select line from point + +# mouse_map ctrl+alt+left triplepress ungrabbed mouse_selection line_from_point + +#:: Select from the clicked point to the end of the line. If you +#:: would like to select the word at the point and then extend to the +#:: rest of the line, change `line_from_point` to +#:: `word_and_line_from_point`. + +#: Extend the current selection + +# mouse_map right press ungrabbed mouse_selection extend + +#:: If you want only the end of the selection to be moved instead of +#:: the nearest boundary, use move-end instead of extend. + +#: Paste from the primary selection even when grabbed + +# mouse_map shift+middle release ungrabbed,grabbed paste_selection +# mouse_map shift+middle press grabbed discard_event + +#: Start selecting text even when grabbed + +# mouse_map shift+left press ungrabbed,grabbed mouse_selection normal + +#: Start selecting text in a rectangle even when grabbed + +# mouse_map ctrl+shift+alt+left press ungrabbed,grabbed mouse_selection rectangle + +#: Select a word even when grabbed + +# mouse_map shift+left doublepress ungrabbed,grabbed mouse_selection word + +#: Select a line even when grabbed + +# mouse_map shift+left triplepress ungrabbed,grabbed mouse_selection line + +#: Select line from point even when grabbed + +# mouse_map ctrl+shift+alt+left triplepress ungrabbed,grabbed mouse_selection line_from_point + +#:: Select from the clicked point to the end of the line even when +#:: grabbed. If you would like to select the word at the point and +#:: then extend to the rest of the line, change `line_from_point` to +#:: `word_and_line_from_point`. + +#: Extend the current selection even when grabbed + +# mouse_map shift+right press ungrabbed,grabbed mouse_selection extend + +#: Show clicked command output in pager + +# mouse_map ctrl+shift+right press ungrabbed mouse_show_command_output + +#:: Requires shell integration +#:: to work. + +#: }}} + +#: }}} + +#: Performance tuning {{{ + +# repaint_delay 10 + +#: Delay between screen updates (in milliseconds). Decreasing it, +#: increases frames-per-second (FPS) at the cost of more CPU usage. +#: The default value yields ~100 FPS which is more than sufficient for +#: most uses. Note that to actually achieve 100 FPS, you have to +#: either set sync_to_monitor to no or use a monitor with a high +#: refresh rate. Also, to minimize latency when there is pending input +#: to be processed, this option is ignored. + +# input_delay 3 + +#: Delay before input from the program running in the terminal is +#: processed (in milliseconds). Note that decreasing it will increase +#: responsiveness, but also increase CPU usage and might cause flicker +#: in full screen programs that redraw the entire screen on each loop, +#: because kitty is so fast that partial screen updates will be drawn. +#: This setting is ignored when the input buffer is almost full. + +# sync_to_monitor yes + +#: Sync screen updates to the refresh rate of the monitor. This +#: prevents screen tearing +#: when scrolling. +#: However, it limits the rendering speed to the refresh rate of your +#: monitor. With a very high speed mouse/high keyboard repeat rate, +#: you may notice some slight input latency. If so, set this to no. + +#: }}} + +#: Terminal bell {{{ + +enable_audio_bell no + +#: The audio bell. Useful to disable it in environments that require +#: silence. + +# visual_bell_duration 0.0 + +#: The visual bell duration (in seconds). Flash the screen when a bell +#: occurs for the specified number of seconds. Set to zero to disable. +#: The flash is animated, fading in and out over the specified +#: duration. The easing function used for the fading can be +#: controlled. For example, 2.0 linear will casuse the flash to fade +#: in and out linearly. The default if unspecified is to use ease-in- +#: out which fades slowly at the start, middle and end. You can +#: specify different easing functions for the fade-in and fade-out +#: parts, like this: 2.0 ease-in linear. kitty supports all the CSS +#: easing functions . + +# visual_bell_color none + +#: The color used by visual bell. Set to none will fall back to +#: selection background color. If you feel that the visual bell is too +#: bright, you can set it to a darker color. + +# window_alert_on_bell yes + +#: Request window attention on bell. Makes the dock icon bounce on +#: macOS or the taskbar flash on Linux. + +# bell_on_tab "🔔 " + +#: Some text or a Unicode symbol to show on the tab if a window in the +#: tab that does not have focus has a bell. If you want to use leading +#: or trailing spaces, surround the text with quotes. See +#: tab_title_template for how this is rendered. + +#: For backwards compatibility, values of yes, y and true are +#: converted to the default bell symbol and no, n, false and none are +#: converted to the empty string. + +# command_on_bell none + +#: Program to run when a bell occurs. The environment variable +#: KITTY_CHILD_CMDLINE can be used to get the program running in the +#: window in which the bell occurred. + +# bell_path none + +#: Path to a sound file to play as the bell sound. If set to none, the +#: system default bell sound is used. Must be in a format supported by +#: the operating systems sound API, such as WAV or OGA on Linux +#: (libcanberra) or AIFF, MP3 or WAV on macOS (NSSound). + +# linux_bell_theme __custom + +#: The XDG Sound Theme kitty will use to play the bell sound. Defaults +#: to the custom theme name specified in the XDG Sound theme +#: specification , falling back to the default +#: freedesktop theme if it does not exist. To change your sound theme +#: desktop wide, create +#: :file:~/.local/share/sounds/__custom/index.theme` with the +#: contents: + +#: [Sound Theme] + +#: Inherits=name-of-the-sound-theme-you-want-to-use + +#: Replace name-of-the-sound-theme-you-want-to-use with the actual +#: theme name. Now all compliant applications should use sounds from +#: this theme. + +#: }}} + +#: Window layout {{{ + +# remember_window_size yes +# initial_window_width 640 +# initial_window_height 400 + +#: If enabled, the OS Window size will be remembered so that new +#: instances of kitty will have the same size as the previous +#: instance. If disabled, the OS Window will initially have size +#: configured by initial_window_width/height, in pixels. You can use a +#: suffix of "c" on the width/height values to have them interpreted +#: as number of cells instead of pixels. + +# enabled_layouts * + +#: The enabled window layouts. A comma separated list of layout names. +#: The special value all means all layouts. The first listed layout +#: will be used as the startup layout. Default configuration is all +#: layouts in alphabetical order. For a list of available layouts, see +#: the layouts . + +# window_resize_step_cells 2 +# window_resize_step_lines 2 + +#: The step size (in units of cell width/cell height) to use when +#: resizing kitty windows in a layout with the shortcut +#: start_resizing_window. The cells value is used for horizontal +#: resizing, and the lines value is used for vertical resizing. + +# window_border_width 0.5pt + +#: The width of window borders. Can be either in pixels (px) or pts +#: (pt). Values in pts will be rounded to the nearest number of pixels +#: based on screen resolution. If not specified, the unit is assumed +#: to be pts. Note that borders are displayed only when more than one +#: window is visible. They are meant to separate multiple windows. + +# draw_minimal_borders yes + +#: Draw only the minimum borders needed. This means that only the +#: borders that separate the window from a neighbor are drawn. Note +#: that setting a non-zero window_margin_width overrides this and +#: causes all borders to be drawn. + +# window_margin_width 0 + +#: The window margin (in pts) (blank area outside the border). A +#: single value sets all four sides. Two values set the vertical and +#: horizontal sides. Three values set top, horizontal and bottom. Four +#: values set top, right, bottom and left. + +# single_window_margin_width -1 + +#: The window margin to use when only a single window is visible (in +#: pts). Negative values will cause the value of window_margin_width +#: to be used instead. A single value sets all four sides. Two values +#: set the vertical and horizontal sides. Three values set top, +#: horizontal and bottom. Four values set top, right, bottom and left. + +window_padding_width 3 + +#: The window padding (in pts) (blank area between the text and the +#: window border). A single value sets all four sides. Two values set +#: the vertical and horizontal sides. Three values set top, horizontal +#: and bottom. Four values set top, right, bottom and left. + +# single_window_padding_width -1 + +#: The window padding to use when only a single window is visible (in +#: pts). Negative values will cause the value of window_padding_width +#: to be used instead. A single value sets all four sides. Two values +#: set the vertical and horizontal sides. Three values set top, +#: horizontal and bottom. Four values set top, right, bottom and left. + +# placement_strategy center + +#: When the window size is not an exact multiple of the cell size, the +#: cell area of the terminal window will have some extra padding on +#: the sides. You can control how that padding is distributed with +#: this option. Using a value of center means the cell area will be +#: placed centrally. A value of top-left means the padding will be +#: only at the bottom and right edges. The value can be one of: top- +#: left, top, top-right, left, center, right, bottom-left, bottom, +#: bottom-right. + +# active_border_color #00ff00 + +#: The color for the border of the active window. Set this to none to +#: not draw borders around the active window. + +# inactive_border_color #cccccc + +#: The color for the border of inactive windows. + +# bell_border_color #ff5a00 + +#: The color for the border of inactive windows in which a bell has +#: occurred. + +# inactive_text_alpha 1.0 + +#: Fade the text in inactive windows by the specified amount (a number +#: between zero and one, with zero being fully faded). + +# hide_window_decorations no + +#: Hide the window decorations (title-bar and window borders) with +#: yes. On macOS, titlebar-only and titlebar-and-corners can be used +#: to only hide the titlebar and the rounded corners. Whether this +#: works and exactly what effect it has depends on the window +#: manager/operating system. Note that the effects of changing this +#: option when reloading config are undefined. When using titlebar- +#: only, it is useful to also set window_margin_width and +#: placement_strategy to prevent the rounded corners from clipping +#: text. Or use titlebar-and-corners. + +# window_logo_path none + +#: Path to a logo image. Must be in PNG/JPEG/WEBP/GIF/TIFF/BMP format. +#: Relative paths are interpreted relative to the kitty config +#: directory. The logo is displayed in a corner of every kitty window. +#: The position is controlled by window_logo_position. Individual +#: windows can be configured to have different logos either using the +#: launch action or the remote control +#: facility. + +# window_logo_position bottom-right + +#: Where to position the window logo in the window. The value can be +#: one of: top-left, top, top-right, left, center, right, bottom-left, +#: bottom, bottom-right. + +# window_logo_alpha 0.5 + +#: The amount the logo should be faded into the background. With zero +#: being fully faded and one being fully opaque. + +# window_logo_scale 0 + +#: The percentage (0-100] of the window size to which the logo should +#: scale. Using a single number means the logo is scaled to that +#: percentage of the shortest window dimension, while preseving aspect +#: ratio of the logo image. + +#: Using two numbers means the width and height of the logo are scaled +#: to the respective percentage of the window's width and height. + +#: Using zero as the percentage disables scaling in that dimension. A +#: single zero (the default) disables all scaling of the window logo. + +# resize_debounce_time 0.1 0.5 + +#: The time to wait (in seconds) before asking the program running in +#: kitty to resize and redraw the screen during a live resize of the +#: OS window, when no new resize events have been received, i.e. when +#: resizing is either paused or finished. On platforms such as macOS, +#: where the operating system sends events corresponding to the start +#: and end of a live resize, the second number is used for redraw- +#: after-pause since kitty can distinguish between a pause and end of +#: resizing. On such systems the first number is ignored and redraw is +#: immediate after end of resize. On other systems only the first +#: number is used so that kitty is "ready" quickly after the end of +#: resizing, while not also continuously redrawing, to save energy. + +# resize_in_steps no + +#: Resize the OS window in steps as large as the cells, instead of +#: with the usual pixel accuracy. Combined with initial_window_width +#: and initial_window_height in number of cells, this option can be +#: used to keep the margins as small as possible when resizing the OS +#: window. Note that this does not currently work on Wayland. + +# visual_window_select_characters 1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ + +#: The list of characters for visual window selection. For example, +#: for selecting a window to focus on with focus_visible_window. The +#: value should be a series of unique numbers or alphabets, case +#: insensitive, from the set 0-9A-Z\-=[];',./\\`. Specify your +#: preference as a string of characters. + +# confirm_os_window_close -1 + +#: Ask for confirmation when closing an OS window or a tab with at +#: least this number of kitty windows in it by window manager (e.g. +#: clicking the window close button or pressing the operating system +#: shortcut to close windows) or by the close_tab action. A value of +#: zero disables confirmation. This confirmation also applies to +#: requests to quit the entire application (all OS windows, via the +#: quit action). Negative values are converted to positive ones, +#: however, with shell_integration enabled, using negative values +#: means windows sitting at a shell prompt are not counted, only +#: windows where some command is currently running. Note that if you +#: want confirmation when closing individual windows, you can map the +#: close_window_with_confirmation action. + +#: }}} + +#: Tab bar {{{ + +# tab_bar_edge bottom + +#: The edge to show the tab bar on, top or bottom. + +# tab_bar_margin_width 0.0 + +#: The margin to the left and right of the tab bar (in pts). + +# tab_bar_margin_height 0.0 0.0 + +#: The margin above and below the tab bar (in pts). The first number +#: is the margin between the edge of the OS Window and the tab bar. +#: The second number is the margin between the tab bar and the +#: contents of the current tab. + +# tab_bar_style fade + +#: The tab bar style, can be one of: + +#: fade +#: Each tab's edges fade into the background color. (See also tab_fade) +#: slant +#: Tabs look like the tabs in a physical file. +#: separator +#: Tabs are separated by a configurable separator. (See also +#: tab_separator) +#: powerline +#: Tabs are shown as a continuous line with "fancy" separators. +#: (See also tab_powerline_style) +#: custom +#: A user-supplied Python function called draw_tab is loaded from the file +#: tab_bar.py in the kitty config directory. For examples of how to +#: write such a function, see the functions named draw_tab_with_* in +#: kitty's source code: kitty/tab_bar.py. See also +#: this discussion +#: for examples from kitty users. +#: hidden +#: The tab bar is hidden. If you use this, you might want to create +#: a mapping for the select_tab action which presents you with a list of +#: tabs and allows for easy switching to a tab. + +# tab_bar_align left + +#: The horizontal alignment of the tab bar, can be one of: left, +#: center, right. + +# tab_bar_min_tabs 2 + +#: The minimum number of tabs that must exist before the tab bar is +#: shown. + +# tab_switch_strategy previous + +#: The algorithm to use when switching to a tab when the current tab +#: is closed. The default of previous will switch to the last used +#: tab. A value of left will switch to the tab to the left of the +#: closed tab. A value of right will switch to the tab to the right of +#: the closed tab. A value of last will switch to the right-most tab. + +# tab_fade 0.25 0.5 0.75 1 + +#: Control how each tab fades into the background when using fade for +#: the tab_bar_style. Each number is an alpha (between zero and one) +#: that controls how much the corresponding cell fades into the +#: background, with zero being no fade and one being full fade. You +#: can change the number of cells used by adding/removing entries to +#: this list. + +# tab_separator " ┇" + +#: The separator between tabs in the tab bar when using separator as +#: the tab_bar_style. + +# tab_powerline_style angled + +#: The powerline separator style between tabs in the tab bar when +#: using powerline as the tab_bar_style, can be one of: angled, +#: slanted, round. + +# tab_activity_symbol none + +#: Some text or a Unicode symbol to show on the tab if a window in the +#: tab that does not have focus has some activity. If you want to use +#: leading or trailing spaces, surround the text with quotes. See +#: tab_title_template for how this is rendered. + +# tab_title_max_length 0 + +#: The maximum number of cells that can be used to render the text in +#: a tab. A value of zero means that no limit is applied. + +# tab_title_template "{fmt.fg.red}{bell_symbol}{activity_symbol}{fmt.fg.tab}{title}" + +#: A template to render the tab title. The default just renders the +#: title with optional symbols for bell and activity. If you wish to +#: include the tab-index as well, use something like: {index}:{title}. +#: Useful if you have shortcuts mapped for goto_tab N. If you prefer +#: to see the index as a superscript, use {sup.index}. All data +#: available is: + +#: title +#: The current tab title. +#: index +#: The tab index usable with goto_tab N goto_tab shortcuts. +#: layout_name +#: The current layout name. +#: num_windows +#: The number of windows in the tab. +#: num_window_groups +#: The number of window groups (a window group is a window and all of its overlay windows) in the tab. +#: tab.active_wd +#: The working directory of the currently active window in the tab +#: (expensive, requires syscall). Use active_oldest_wd to get +#: the directory of the oldest foreground process rather than the newest. +#: tab.active_exe +#: The name of the executable running in the foreground of the currently +#: active window in the tab (expensive, requires syscall). Use +#: active_oldest_exe for the oldest foreground process. +#: max_title_length +#: The maximum title length available. +#: keyboard_mode +#: The name of the current keyboard mode or the empty string if no keyboard mode is active. + +#: Note that formatting is done by Python's string formatting +#: machinery, so you can use, for instance, {layout_name[:2].upper()} +#: to show only the first two letters of the layout name, upper-cased. +#: If you want to style the text, you can use styling directives, for +#: example: +#: `{fmt.fg.red}red{fmt.fg.tab}normal{fmt.bg._00FF00}greenbg{fmt.bg.tab}`. +#: Similarly, for bold and italic: +#: `{fmt.bold}bold{fmt.nobold}normal{fmt.italic}italic{fmt.noitalic}`. +#: Note that for backward compatibility, if {bell_symbol} or +#: {activity_symbol} are not present in the template, they are +#: prepended to it. + +# active_tab_title_template none + +#: Template to use for active tabs. If not specified falls back to +#: tab_title_template. + +# active_tab_foreground #000 +# active_tab_background #eee +# active_tab_font_style bold-italic +# inactive_tab_foreground #444 +# inactive_tab_background #999 +# inactive_tab_font_style normal + +#: Tab bar colors and styles. + +# tab_bar_background none + +#: Background color for the tab bar. Defaults to using the terminal +#: background color. + +# tab_bar_margin_color none + +#: Color for the tab bar margin area. Defaults to using the terminal +#: background color for margins above and below the tab bar. For side +#: margins the default color is chosen to match the background color +#: of the neighboring tab. + +#: }}} + +#: Color scheme {{{ + +# foreground #dddddd +# background #000000 + +#: The foreground and background colors. + +# background_opacity 1.0 + +#: The opacity of the background. A number between zero and one, where +#: one is opaque and zero is fully transparent. This will only work if +#: supported by the OS (for instance, when using a compositor under +#: X11). Note that it only sets the background color's opacity in +#: cells that have the same background color as the default terminal +#: background, so that things like the status bar in vim, powerline +#: prompts, etc. still look good. But it means that if you use a color +#: theme with a background color in your editor, it will not be +#: rendered as transparent. Instead you should change the default +#: background color in your kitty config and not use a background +#: color in the editor color scheme. Or use the escape codes to set +#: the terminals default colors in a shell script to launch your +#: editor. See also second_transparent_bg. Be aware that using a value +#: less than 1.0 is a (possibly significant) performance hit. When +#: using a low value for this setting, it is desirable that you set +#: the background color to a color the matches the general color of +#: the desktop background, for best text rendering. If you want to +#: dynamically change transparency of windows, set +#: dynamic_background_opacity to yes (this is off by default as it has +#: a performance cost). Changing this option when reloading the config +#: will only work if dynamic_background_opacity was enabled in the +#: original config. + +# background_blur 0 + +#: Set to a positive value to enable background blur (blurring of the +#: visuals behind a transparent window) on platforms that support it. +#: Only takes effect when background_opacity is less than one. On +#: macOS, this will also control the blur radius (amount of blurring). +#: Setting it to too high a value will cause severe performance issues +#: and/or rendering artifacts. Usually, values up to 64 work well. +#: Note that this might cause performance issues, depending on how the +#: platform implements it, so use with care. Currently supported on +#: macOS and KDE. + +# background_image ~/.config/wezterm/lain.gif +# background_image_layout centered +# background_opacity 0.2 +# background_tint 0.5 + +#: Path to a background image. Must be in PNG/JPEG/WEBP/TIFF/GIF/BMP +#: format. + +# background_image_layout tiled + +#: Whether to tile, scale or clamp the background image. The value can +#: be one of tiled, mirror-tiled, scaled, clamped, centered or +#: cscaled. The scaled and cscaled values scale the image to the +#: window size, with cscaled preserving the image aspect ratio. + +# background_image_linear no + +#: When background image is scaled, whether linear interpolation +#: should be used. + +# second_transparent_bg none + +#: When the background color matches this color, background_opacity is +#: applied to it to render it as semi-transparent, just as for colors +#: matching the main background color. Useful in more complex UIs like +#: editors where you could want more than a single background color to +#: be rendered as transparent, for instance, for a cursor highlight +#: line background. Terminal applications can set this color using The +#: kitty color control escape code. + +# dynamic_background_opacity no + +#: Allow changing of the background_opacity dynamically, using either +#: keyboard shortcuts (increase_background_opacity and +#: decrease_background_opacity) or the remote control facility. +#: Changing this option by reloading the config is not supported. + +# background_tint 0.0 + +#: How much to tint the background image by the background color. This +#: option makes it easier to read the text. Tinting is done using the +#: current background color for each window. This option applies only +#: if background_opacity is set and transparent windows are supported +#: or background_image is set. + +# background_tint_gaps 1.0 + +#: How much to tint the background image at the window gaps by the +#: background color, after applying background_tint. Since this is +#: multiplicative with background_tint, it can be used to lighten the +#: tint over the window gaps for a *separated* look. + +# dim_opacity 0.4 + +#: How much to dim text that has the DIM/FAINT attribute set. One +#: means no dimming and zero means fully dimmed (i.e. invisible). + +# selection_foreground #000000 +# selection_background #fffacd + +#: The foreground and background colors for text selected with the +#: mouse. Setting both of these to none will cause a "reverse video" +#: effect for selections, where the selection will be the cell text +#: color and the text will become the cell background color. Setting +#: only selection_foreground to none will cause the foreground color +#: to be used unchanged. Note that these colors can be overridden by +#: the program running in the terminal. + +#: The color table {{{ + +#: The 256 terminal colors. There are 8 basic colors, each color has a +#: dull and bright version, for the first 16 colors. You can set the +#: remaining 240 colors as color16 to color255. + +# color0 #000000 +# color8 #767676 + +#: black + +# color1 #cc0403 +# color9 #f2201f + +#: red + +# color2 #19cb00 +# color10 #23fd00 + +#: green + +# color3 #cecb00 +# color11 #fffd00 + +#: yellow + +# color4 #0d73cc +# color12 #1a8fff + +#: blue + +# color5 #cb1ed1 +# color13 #fd28ff + +#: magenta + +# color6 #0dcdcd +# color14 #14ffff + +#: cyan + +# color7 #dddddd +# color15 #ffffff + +#: white + +# mark1_foreground black + +#: Color for marks of type 1 + +# mark1_background #98d3cb + +#: Color for marks of type 1 (light steel blue) + +# mark2_foreground black + +#: Color for marks of type 2 + +# mark2_background #f2dcd3 + +#: Color for marks of type 1 (beige) + +# mark3_foreground black + +#: Color for marks of type 3 + +# mark3_background #f274bc + +#: Color for marks of type 3 (violet) + +#: }}} + +#: }}} + +#: Advanced {{{ + +shell fish + +#: The shell program to execute. The default value of . means to use +#: the value of of the SHELL environment variable or if unset, +#: whatever shell is set as the default shell for the current user. +#: Note that on macOS if you change this, you might need to add +#: --login and --interactive to ensure that the shell starts in +#: interactive mode and reads its startup rc files. Environment +#: variables are expanded in this setting. + +editor hx + +#: The terminal based text editor (such as vim or nano) to use when +#: editing the kitty config file or similar tasks. + +#: The default value of . means to use the environment variables +#: VISUAL and EDITOR in that order. If these variables aren't set, +#: kitty will run your shell ($SHELL -l -i -c env) to see if your +#: shell startup rc files set VISUAL or EDITOR. If that doesn't work, +#: kitty will cycle through various known editors (vim, emacs, etc.) +#: and take the first one that exists on your system. + +# close_on_child_death no + +#: Close the window when the child process (usually the shell) exits. +#: With the default value no, the terminal will remain open when the +#: child exits as long as there are still other processes outputting +#: to the terminal (for example disowned or backgrounded processes). +#: When enabled with yes, the window will close as soon as the child +#: process exits. Note that setting it to yes means that any +#: background processes still using the terminal can fail silently +#: because their stdout/stderr/stdin no longer work. + +# remote_control_password + +#: Allow other programs to control kitty using passwords. This option +#: can be specified multiple times to add multiple passwords. If no +#: passwords are present kitty will ask the user for permission if a +#: program tries to use remote control with a password. A password can +#: also *optionally* be associated with a set of allowed remote +#: control actions. For example:: + +#: remote_control_password "my passphrase" get-colors set-colors focus-window focus-tab + +#: Only the specified actions will be allowed when using this +#: password. Glob patterns can be used too, for example:: + +#: remote_control_password "my passphrase" set-tab-* resize-* + +#: To get a list of available actions, run:: + +#: kitten @ --help + +#: A set of actions to be allowed when no password is sent can be +#: specified by using an empty password. For example:: + +#: remote_control_password "" *-colors + +#: Finally, the path to a python module can be specified that provides +#: a function is_cmd_allowed that is used to check every remote +#: control command. For example:: + +#: remote_control_password "my passphrase" my_rc_command_checker.py + +#: Relative paths are resolved from the kitty configuration directory. +#: See rc_custom_auth for details. + +# allow_remote_control no + +#: Allow other programs to control kitty. If you turn this on, other +#: programs can control all aspects of kitty, including sending text +#: to kitty windows, opening new windows, closing windows, reading the +#: content of windows, etc. Note that this even works over SSH +#: connections. The default setting of no prevents any form of remote +#: control. The meaning of the various values are: + +#: password +#: Remote control requests received over both the TTY device and the socket +#: are confirmed based on passwords, see remote_control_password. + +#: socket-only +#: Remote control requests received over a socket are accepted +#: unconditionally. Requests received over the TTY are denied. +#: See listen_on. + +#: socket +#: Remote control requests received over a socket are accepted +#: unconditionally. Requests received over the TTY are confirmed based on +#: password. + +#: no +#: Remote control is completely disabled. + +#: yes +#: Remote control requests are always accepted. + +# listen_on none + +#: Listen to the specified socket for remote control connections. Note +#: that this will apply to all kitty instances. It can be overridden +#: by the kitty --listen-on command line option. For UNIX sockets, +#: such as unix:${TEMP}/mykitty or unix:@mykitty (on Linux). +#: Environment variables are expanded and relative paths are resolved +#: with respect to the temporary directory. If {kitty_pid} is present, +#: then it is replaced by the PID of the kitty process, otherwise the +#: PID of the kitty process is appended to the value, with a hyphen. +#: For TCP sockets such as tcp:localhost:0 a random port is always +#: used even if a non-zero port number is specified. See the help for +#: kitty --listen-on for more details. Note that this will be ignored +#: unless allow_remote_control is set to either: yes, socket or +#: socket-only. Changing this option by reloading the config is not +#: supported. + +# env + +#: Specify the environment variables to be set in all child processes. +#: Using the name with an equal sign (e.g. env VAR=) will set it to +#: the empty string. Specifying only the name (e.g. env VAR) will +#: remove the variable from the child process' environment. Note that +#: environment variables are expanded recursively, for example:: + +#: env VAR1=a +#: env VAR2=${HOME}/${VAR1}/b + +#: The value of VAR2 will be /a/b. + +# filter_notification + +#: Specify rules to filter out notifications sent by applications +#: running in kitty. Can be specified multiple times to create +#: multiple filter rules. A rule specification is of the form +#: field:regexp. A filter rule can match on any of the fields: title, +#: body, app, type. The special value of all filters out all +#: notifications. Rules can be combined using Boolean operators. Some +#: examples:: + +#: filter_notification title:hello or body:"abc.*def" +#: # filter out notification from vim except for ones about updates, (?i) +#: # makes matching case insesitive. +#: filter_notification app:"[ng]?vim" and not body:"(?i)update" +#: # filter out all notifications +#: filter_notification all + +#: The field app is the name of the application sending the +#: notification and type is the type of the notification. Not all +#: applications will send these fields, so you can also match on the +#: title and body of the notification text. More sophisticated +#: programmatic filtering and custom actions on notifications can be +#: done by creating a notifications.py file in the kitty config +#: directory (~/.config/kitty). An annotated sample is available +#: . + +# watcher + +#: Path to python file which will be loaded for watchers +#: . Can be +#: specified more than once to load multiple watchers. The watchers +#: will be added to every kitty window. Relative paths are resolved +#: relative to the kitty config directory. Note that reloading the +#: config will only affect windows created after the reload. + +# exe_search_path + +#: Control where kitty finds the programs to run. The default search +#: order is: First search the system wide PATH, then ~/.local/bin and +#: ~/bin. If still not found, the PATH defined in the login shell +#: after sourcing all its startup files is tried. Finally, if present, +#: the PATH specified by the env option is tried. + +#: This option allows you to prepend, append, or remove paths from +#: this search order. It can be specified multiple times for multiple +#: paths. A simple path will be prepended to the search order. A path +#: that starts with the + sign will be append to the search order, +#: after ~/bin above. A path that starts with the - sign will be +#: removed from the entire search order. For example:: + +#: exe_search_path /some/prepended/path +#: exe_search_path +/some/appended/path +#: exe_search_path -/some/excluded/path + +# update_check_interval 24 + +#: The interval to periodically check if an update to kitty is +#: available (in hours). If an update is found, a system notification +#: is displayed informing you of the available update. The default is +#: to check every 24 hours, set to zero to disable. Update checking is +#: only done by the official binary builds. Distro packages or source +#: builds do not do update checking. Changing this option by reloading +#: the config is not supported. + +# startup_session none + +#: Path to a session file to use for all kitty instances. Can be +#: overridden by using the kitty --session =none command line option +#: for individual instances. See sessions +#: in the kitty +#: documentation for details. Note that relative paths are interpreted +#: with respect to the kitty config directory. Environment variables +#: in the path are expanded. Changing this option by reloading the +#: config is not supported. Note that if kitty is invoked with command +#: line arguments specifying a command to run, this option is ignored. + +# clipboard_control write-clipboard write-primary read-clipboard-ask read-primary-ask + +#: Allow programs running in kitty to read and write from the +#: clipboard. You can control exactly which actions are allowed. The +#: possible actions are: write-clipboard, read-clipboard, write- +#: primary, read-primary, read-clipboard-ask, read-primary-ask. The +#: default is to allow writing to the clipboard and primary selection +#: and to ask for permission when a program tries to read from the +#: clipboard. Note that disabling the read confirmation is a security +#: risk as it means that any program, even the ones running on a +#: remote server via SSH can read your clipboard. See also +#: clipboard_max_size. + +# clipboard_max_size 512 + +#: The maximum size (in MB) of data from programs running in kitty +#: that will be stored for writing to the system clipboard. A value of +#: zero means no size limit is applied. See also clipboard_control. + +# file_transfer_confirmation_bypass + +#: The password that can be supplied to the file transfer kitten +#: to skip the +#: transfer confirmation prompt. This should only be used when +#: initiating transfers from trusted computers, over trusted networks +#: or encrypted transports, as it allows any programs running on the +#: remote machine to read/write to the local filesystem, without +#: permission. + +# allow_hyperlinks yes + +#: Process hyperlink escape sequences (OSC 8). If disabled OSC 8 +#: escape sequences are ignored. Otherwise they become clickable +#: links, that you can click with the mouse or by using the hints +#: kitten . The +#: special value of ask means that kitty will ask before opening the +#: link when clicked. + +# shell_integration enabled + +#: Enable shell integration on supported shells. This enables features +#: such as jumping to previous prompts, browsing the output of the +#: previous command in a pager, etc. on supported shells. Set to +#: disabled to turn off shell integration, completely. It is also +#: possible to disable individual features, set to a space separated +#: list of these values: no-rc, no-cursor, no-title, no-cwd, no- +#: prompt-mark, no-complete, no-sudo. See Shell integration +#: for details. + +# allow_cloning ask + +#: Control whether programs running in the terminal can request new +#: windows to be created. The canonical example is clone-in-kitty +#: . +#: By default, kitty will ask for permission for each clone request. +#: Allowing cloning unconditionally gives programs running in the +#: terminal (including over SSH) permission to execute arbitrary code, +#: as the user who is running the terminal, on the computer that the +#: terminal is running on. + +# clone_source_strategies venv,conda,env_var,path + +#: Control what shell code is sourced when running clone-in-kitty in +#: the newly cloned window. The supported strategies are: + +#: venv +#: Source the file $VIRTUAL_ENV/bin/activate. This is used by the +#: Python stdlib venv module and allows cloning venvs automatically. +#: conda +#: Run conda activate $CONDA_DEFAULT_ENV. This supports the virtual +#: environments created by conda. +#: env_var +#: Execute the contents of the environment variable +#: KITTY_CLONE_SOURCE_CODE with eval. +#: path +#: Source the file pointed to by the environment variable +#: KITTY_CLONE_SOURCE_PATH. + +#: This option must be a comma separated list of the above values. +#: Only the first valid match, in the order specified, is sourced. + +# notify_on_cmd_finish never + +#: Show a desktop notification when a long-running command finishes +#: (needs shell_integration). The possible values are: + +#: never +#: Never send a notification. + +#: unfocused +#: Only send a notification when the window does not have keyboard focus. + +#: invisible +#: Only send a notification when the window both is unfocused and not visible +#: to the user, for example, because it is in an inactive tab or its OS window +#: is not currently active. + +#: always +#: Always send a notification, regardless of window state. + +#: There are two optional arguments: + +#: First, the minimum duration for what is considered a long running +#: command. The default is 5 seconds. Specify a second argument to set +#: the duration. For example: invisible 15. Do not set the value too +#: small, otherwise a command that launches a new OS Window and exits +#: will spam a notification. + +#: Second, the action to perform. The default is notify. The possible +#: values are: + +#: notify +#: Send a desktop notification. + +#: bell +#: Ring the terminal bell. + +#: command +#: Run a custom command. All subsequent arguments are the cmdline to run. + +#: Some more examples:: + +#: # Send a notification when a command takes more than 5 seconds in an unfocused window +#: notify_on_cmd_finish unfocused +#: # Send a notification when a command takes more than 10 seconds in a invisible window +#: notify_on_cmd_finish invisible 10.0 +#: # Ring a bell when a command takes more than 10 seconds in a invisible window +#: notify_on_cmd_finish invisible 10.0 bell +#: # Run 'notify-send' when a command takes more than 10 seconds in a invisible window +#: # Here %c is replaced by the current command line and %s by the job exit code +#: notify_on_cmd_finish invisible 10.0 command notify-send "job finished with status: %s" %c + +# term xterm-kitty + +#: The value of the TERM environment variable to set. Changing this +#: can break many terminal programs, only change it if you know what +#: you are doing, not because you read some advice on "Stack Overflow" +#: to change it. The TERM variable is used by various programs to get +#: information about the capabilities and behavior of the terminal. If +#: you change it, depending on what programs you run, and how +#: different the terminal you are changing it to is, various things +#: from key-presses, to colors, to various advanced features may not +#: work. Changing this option by reloading the config will only affect +#: newly created windows. + +# terminfo_type path + +#: The value of the TERMINFO environment variable to set. This +#: variable is used by programs running in the terminal to search for +#: terminfo databases. The default value of path causes kitty to set +#: it to a filesystem location containing the kitty terminfo database. +#: A value of direct means put the entire database into the env var +#: directly. This can be useful when connecting to containers, for +#: example. But, note that not all software supports this. A value of +#: none means do not touch the variable. + +# forward_stdio no + +#: Forward STDOUT and STDERR of the kitty process to child processes +#: as file descriptors 3 and 4. This is useful for debugging as it +#: allows child processes to print to kitty's STDOUT directly. For +#: example, echo hello world >&3 in a shell will print to the parent +#: kitty's STDOUT. When enabled, this also sets the +#: KITTY_STDIO_FORWARDED=3 environment variable so child processes +#: know about the forwarding. + +# menu_map + +#: Specify entries for various menus in kitty. Currently only the +#: global menubar on macOS is supported. For example:: + +#: menu_map global "Actions::Launch something special" launch --hold --type=os-window sh -c "echo hello world" + +#: This will create a menu entry named "Launch something special" in +#: an "Actions" menu in the macOS global menubar. Sub-menus can be +#: created by adding more levels separated by the :: characters. + +#: }}} + +#: OS specific tweaks {{{ + +# wayland_titlebar_color system + +#: The color of the kitty window's titlebar on Wayland systems with +#: client side window decorations such as GNOME. A value of system +#: means to use the default system colors, a value of background means +#: to use the background color of the currently active kitty window +#: and finally you can use an arbitrary color, such as #12af59 or red. + +# macos_titlebar_color system + +#: The color of the kitty window's titlebar on macOS. A value of +#: system means to use the default system color, light or dark can +#: also be used to set it explicitly. A value of background means to +#: use the background color of the currently active window and finally +#: you can use an arbitrary color, such as #12af59 or red. WARNING: +#: This option works by using a hack when arbitrary color (or +#: background) is configured, as there is no proper Cocoa API for it. +#: It sets the background color of the entire window and makes the +#: titlebar transparent. As such it is incompatible with +#: background_opacity. If you want to use both, you are probably +#: better off just hiding the titlebar with hide_window_decorations. + +# macos_option_as_alt no + +#: Use the Option key as an Alt key on macOS. With this set to no, +#: kitty will use the macOS native Option+Key to enter Unicode +#: character behavior. This will break any Alt+Key keyboard shortcuts +#: in your terminal programs, but you can use the macOS Unicode input +#: technique. You can use the values: left, right or both to use only +#: the left, right or both Option keys as Alt, instead. Note that +#: kitty itself always treats Option the same as Alt. This means you +#: cannot use this option to configure different kitty shortcuts for +#: Option+Key vs. Alt+Key. Also, any kitty shortcuts using +#: Option/Alt+Key will take priority, so that any such key presses +#: will not be passed to terminal programs running inside kitty. +#: Changing this option by reloading the config is not supported. + +# macos_hide_from_tasks no + +#: Hide the kitty window from running tasks on macOS (⌘+Tab and the +#: Dock). Changing this option by reloading the config is not +#: supported. + +# macos_quit_when_last_window_closed no + +#: Have kitty quit when all the top-level windows are closed on macOS. +#: By default, kitty will stay running, even with no open windows, as +#: is the expected behavior on macOS. + +# macos_window_resizable yes + +#: Disable this if you want kitty top-level OS windows to not be +#: resizable on macOS. + +# macos_thicken_font 0 + +#: Draw an extra border around the font with the given width, to +#: increase legibility at small font sizes on macOS. For example, a +#: value of 0.75 will result in rendering that looks similar to sub- +#: pixel antialiasing at common font sizes. Note that in modern kitty, +#: this option is obsolete (although still supported). Consider using +#: text_composition_strategy instead. + +# macos_traditional_fullscreen no + +#: Use the macOS traditional full-screen transition, that is faster, +#: but less pretty. + +# macos_show_window_title_in all + +#: Control where the window title is displayed on macOS. A value of +#: window will show the title of the currently active window at the +#: top of the macOS window. A value of menubar will show the title of +#: the currently active window in the macOS global menu bar, making +#: use of otherwise wasted space. A value of all will show the title +#: in both places, and none hides the title. See +#: macos_menubar_title_max_length for how to control the length of the +#: title in the menu bar. + +# macos_menubar_title_max_length 0 + +#: The maximum number of characters from the window title to show in +#: the macOS global menu bar. Values less than one means that there is +#: no maximum limit. + +# macos_custom_beam_cursor no + +#: Use a custom mouse cursor for macOS that is easier to see on both +#: light and dark backgrounds. Nowadays, the default macOS cursor +#: already comes with a white border. WARNING: this might make your +#: mouse cursor invisible on dual GPU machines. Changing this option +#: by reloading the config is not supported. + +# macos_colorspace srgb + +#: The colorspace in which to interpret terminal colors. The default +#: of srgb will cause colors to match those seen in web browsers. The +#: value of default will use whatever the native colorspace of the +#: display is. The value of displayp3 will use Apple's special +#: snowflake display P3 color space, which will result in over +#: saturated (brighter) colors with some color shift. Reloading +#: configuration will change this value only for newly created OS +#: windows. + +# linux_display_server auto + +#: Choose between Wayland and X11 backends. By default, an appropriate +#: backend based on the system state is chosen automatically. Set it +#: to x11 or wayland to force the choice. Changing this option by +#: reloading the config is not supported. + +# wayland_enable_ime yes + +#: Enable Input Method Extension on Wayland. This is typically used +#: for inputting text in East Asian languages. However, its +#: implementation in Wayland is often buggy and introduces latency +#: into the input loop, so disable this if you know you dont need it. +#: Changing this option by reloading the config is not supported, it +#: will not have any effect. + +#: }}} + +#: Keyboard shortcuts {{{ + +#: Keys are identified simply by their lowercase Unicode characters. +#: For example: a for the A key, [ for the left square bracket key, +#: etc. For functional keys, such as Enter or Escape, the names are +#: present at Functional key definitions +#: . +#: For modifier keys, the names are ctrl (control, ⌃), shift (⇧), alt +#: (opt, option, ⌥), super (cmd, command, ⌘). + +#: Simple shortcut mapping is done with the map directive. For full +#: details on advanced mapping including modal and per application +#: maps, see mapping . Some +#: quick examples to illustrate common tasks:: + +#: # unmap a keyboard shortcut, passing it to the program running in kitty +#: map kitty_mod+space +#: # completely ignore a keyboard event +#: map ctrl+alt+f1 discard_event +#: # combine multiple actions +#: map kitty_mod+e combine : new_window : next_layout +#: # multi-key shortcuts +#: map ctrl+x>ctrl+y>z action + +#: The full list of actions that can be mapped to key presses is +#: available here . + +# kitty_mod ctrl+shift + +#: Special modifier key alias for default shortcuts. You can change +#: the value of this option to alter all default shortcuts that use +#: kitty_mod. + +# clear_all_shortcuts no + +#: Remove all shortcut definitions up to this point. Useful, for +#: instance, to remove the default shortcuts. + +# action_alias + +#: E.g. action_alias launch_tab launch --type=tab --cwd=current + +#: Define action aliases to avoid repeating the same options in +#: multiple mappings. Aliases can be defined for any action and will +#: be expanded recursively. For example, the above alias allows you to +#: create mappings to launch a new tab in the current working +#: directory without duplication:: + +#: map f1 launch_tab vim +#: map f2 launch_tab emacs + +#: Similarly, to alias kitten invocation:: + +#: action_alias hints kitten hints --hints-offset=0 + +# kitten_alias + +#: E.g. kitten_alias hints hints --hints-offset=0 + +#: Like action_alias above, but specifically for kittens. Generally, +#: prefer to use action_alias. This option is a legacy version, +#: present for backwards compatibility. It causes all invocations of +#: the aliased kitten to be substituted. So the example above will +#: cause all invocations of the hints kitten to have the --hints- +#: offset=0 option applied. + +#: Clipboard {{{ + +#: Copy to clipboard + +# map kitty_mod+c copy_to_clipboard +# map cmd+c copy_to_clipboard + +#:: There is also a copy_or_interrupt action that can be optionally +#:: mapped to Ctrl+C. It will copy only if there is a selection and +#:: send an interrupt otherwise. Similarly, +#:: copy_and_clear_or_interrupt will copy and clear the selection or +#:: send an interrupt if there is no selection. + +#: Paste from clipboard + +# map kitty_mod+v paste_from_clipboard +# map cmd+v paste_from_clipboard + +#: Paste from selection + +# map kitty_mod+s paste_from_selection +# map shift+insert paste_from_selection + +#: Pass selection to program + +# map kitty_mod+o pass_selection_to_program + +#:: You can also pass the contents of the current selection to any +#:: program with pass_selection_to_program. By default, the system's +#:: open program is used, but you can specify your own, the selection +#:: will be passed as a command line argument to the program. For +#:: example:: + +#:: map kitty_mod+o pass_selection_to_program firefox + +#:: You can pass the current selection to a terminal program running +#:: in a new kitty window, by using the @selection placeholder:: + +#:: map kitty_mod+y new_window less @selection + +#: }}} + +#: Scrolling {{{ + +#: Scroll line up + +# map kitty_mod+up scroll_line_up +# map kitty_mod+k scroll_line_up +# map opt+cmd+page_up scroll_line_up +# map cmd+up scroll_line_up + +#: Scroll line down + +# map kitty_mod+down scroll_line_down +# map kitty_mod+j scroll_line_down +# map opt+cmd+page_down scroll_line_down +# map cmd+down scroll_line_down + +#: Scroll page up + +# map kitty_mod+page_up scroll_page_up +# map cmd+page_up scroll_page_up + +#: Scroll page down + +# map kitty_mod+page_down scroll_page_down +# map cmd+page_down scroll_page_down + +#: Scroll to top + +# map kitty_mod+home scroll_home +# map cmd+home scroll_home + +#: Scroll to bottom + +# map kitty_mod+end scroll_end +# map cmd+end scroll_end + +#: Scroll to previous shell prompt + +# map kitty_mod+z scroll_to_prompt -1 + +#:: Use a parameter of 0 for scroll_to_prompt to scroll to the last +#:: jumped to or the last clicked position. Requires shell +#:: integration +#:: to work. + +#: Scroll to next shell prompt + +# map kitty_mod+x scroll_to_prompt 1 + +#: Browse scrollback buffer in pager + +# map kitty_mod+h show_scrollback + +#:: You can pipe the contents of the current screen and history +#:: buffer as STDIN to an arbitrary program using launch --stdin- +#:: source. For example, the following opens the scrollback buffer in +#:: less in an overlay window:: + +#:: map f1 launch --stdin-source=@screen_scrollback --stdin-add-formatting --type=overlay less +G -R + +#:: For more details on piping screen and buffer contents to external +#:: programs, see launch . + +#: Browse output of the last shell command in pager + +# map kitty_mod+g show_last_command_output + +#:: You can also define additional shortcuts to get the command +#:: output. For example, to get the first command output on screen:: + +#:: map f1 show_first_command_output_on_screen + +#:: To get the command output that was last accessed by a keyboard +#:: action or mouse action:: + +#:: map f1 show_last_visited_command_output + +#:: You can pipe the output of the last command run in the shell +#:: using the launch action. For example, the following opens the +#:: output in less in an overlay window:: + +#:: map f1 launch --stdin-source=@last_cmd_output --stdin-add-formatting --type=overlay less +G -R + +#:: To get the output of the first command on the screen, use +#:: @first_cmd_output_on_screen. To get the output of the last jumped +#:: to command, use @last_visited_cmd_output. + +#:: Requires shell integration +#:: to work. + +#: }}} + +#: Window management {{{ + +#: New window + +# map kitty_mod+enter new_window +# map cmd+enter new_window + +#:: You can open a new kitty window running an arbitrary program, for +#:: example:: + +#:: map kitty_mod+y launch mutt + +#:: You can open a new window with the current working directory set +#:: to the working directory of the current window using:: + +#:: map ctrl+alt+enter launch --cwd=current + +#:: You can open a new window that is allowed to control kitty via +#:: the kitty remote control facility with launch --allow-remote- +#:: control. Any programs running in that window will be allowed to +#:: control kitty. For example:: + +#:: map ctrl+enter launch --allow-remote-control some_program + +#:: You can open a new window next to the currently active window or +#:: as the first window, with:: + +#:: map ctrl+n launch --location=neighbor +#:: map ctrl+f launch --location=first + +#:: For more details, see launch +#:: . + +#: New OS window + +# map kitty_mod+n new_os_window +# map cmd+n new_os_window + +#:: Works like new_window above, except that it opens a top-level OS +#:: window. In particular you can use new_os_window_with_cwd to open +#:: a window with the current working directory. + +#: Close window + +# map kitty_mod+w close_window +# map shift+cmd+d close_window + +#: Next window + +# map kitty_mod+] next_window + +#: Previous window + +# map kitty_mod+[ previous_window + +#: Move window forward + +# map kitty_mod+f move_window_forward + +#: Move window backward + +# map kitty_mod+b move_window_backward + +#: Move window to top + +# map kitty_mod+` move_window_to_top + +#: Start resizing window + +# map kitty_mod+r start_resizing_window +# map cmd+r start_resizing_window + +#: First window + +# map kitty_mod+1 first_window +# map cmd+1 first_window + +#: Second window + +# map kitty_mod+2 second_window +# map cmd+2 second_window + +#: Third window + +# map kitty_mod+3 third_window +# map cmd+3 third_window + +#: Fourth window + +# map kitty_mod+4 fourth_window +# map cmd+4 fourth_window + +#: Fifth window + +# map kitty_mod+5 fifth_window +# map cmd+5 fifth_window + +#: Sixth window + +# map kitty_mod+6 sixth_window +# map cmd+6 sixth_window + +#: Seventh window + +# map kitty_mod+7 seventh_window +# map cmd+7 seventh_window + +#: Eighth window + +# map kitty_mod+8 eighth_window +# map cmd+8 eighth_window + +#: Ninth window + +# map kitty_mod+9 ninth_window +# map cmd+9 ninth_window + +#: Tenth window + +# map kitty_mod+0 tenth_window + +#: Visually select and focus window + +# map kitty_mod+f7 focus_visible_window + +#:: Display overlay numbers and alphabets on the window, and switch +#:: the focus to the window when you press the key. When there are +#:: only two windows, the focus will be switched directly without +#:: displaying the overlay. You can change the overlay characters and +#:: their order with option visual_window_select_characters. + +#: Visually swap window with another + +# map kitty_mod+f8 swap_with_window + +#:: Works like focus_visible_window above, but swaps the window. + +#: }}} + +#: Tab management {{{ + +#: Next tab + +# map kitty_mod+right next_tab +# map shift+cmd+] next_tab +# map ctrl+tab next_tab + +#: Previous tab + +# map kitty_mod+left previous_tab +# map shift+cmd+[ previous_tab +# map ctrl+shift+tab previous_tab + +#: New tab + +# map kitty_mod+t new_tab +# map cmd+t new_tab + +#: Close tab + +# map kitty_mod+q close_tab +# map cmd+w close_tab + +#: Close OS window + +# map shift+cmd+w close_os_window + +#: Move tab forward + +# map kitty_mod+. move_tab_forward + +#: Move tab backward + +# map kitty_mod+, move_tab_backward + +#: Set tab title + +# map kitty_mod+alt+t set_tab_title +# map shift+cmd+i set_tab_title + + +#: You can also create shortcuts to go to specific tabs, with 1 being +#: the first tab, 2 the second tab and -1 being the previously active +#: tab, and any number larger than the last tab being the last tab:: + +#: map ctrl+alt+1 goto_tab 1 +#: map ctrl+alt+2 goto_tab 2 + +#: Just as with new_window above, you can also pass the name of +#: arbitrary commands to run when using new_tab and new_tab_with_cwd. +#: Finally, if you want the new tab to open next to the current tab +#: rather than at the end of the tabs list, use:: + +#: map ctrl+t new_tab !neighbor [optional cmd to run] +#: }}} + +#: Layout management {{{ + +#: Next layout + +# map kitty_mod+l next_layout + + +#: You can also create shortcuts to switch to specific layouts:: + +#: map ctrl+alt+t goto_layout tall +#: map ctrl+alt+s goto_layout stack + +#: Similarly, to switch back to the previous layout:: + +#: map ctrl+alt+p last_used_layout + +#: There is also a toggle_layout action that switches to the named +#: layout or back to the previous layout if in the named layout. +#: Useful to temporarily "zoom" the active window by switching to the +#: stack layout:: + +#: map ctrl+alt+z toggle_layout stack +#: }}} + +#: Font sizes {{{ + +#: You can change the font size for all top-level kitty OS windows at +#: a time or only the current one. + +#: Increase font size + +# map kitty_mod+equal change_font_size all +2.0 +# map kitty_mod+plus change_font_size all +2.0 +# map kitty_mod+kp_add change_font_size all +2.0 +# map cmd+plus change_font_size all +2.0 +# map cmd+equal change_font_size all +2.0 +# map shift+cmd+equal change_font_size all +2.0 + +#: Decrease font size + +# map kitty_mod+minus change_font_size all -2.0 +# map kitty_mod+kp_subtract change_font_size all -2.0 +# map cmd+minus change_font_size all -2.0 +# map shift+cmd+minus change_font_size all -2.0 + +#: Reset font size + +# map kitty_mod+backspace change_font_size all 0 +# map cmd+0 change_font_size all 0 + + +#: To setup shortcuts for specific font sizes:: + +#: map kitty_mod+f6 change_font_size all 10.0 + +#: To setup shortcuts to change only the current OS window's font +#: size:: + +#: map kitty_mod+f6 change_font_size current 10.0 +#: }}} + +#: Select and act on visible text {{{ + +#: Use the hints kitten to select text and either pass it to an +#: external program or insert it into the terminal or copy it to the +#: clipboard. + +#: Open URL + +# map kitty_mod+e open_url_with_hints + +#:: Open a currently visible URL using the keyboard. The program used +#:: to open the URL is specified in open_url_with. + +#: Insert selected path + +# map kitty_mod+p>f kitten hints --type path --program - + +#:: Select a path/filename and insert it into the terminal. Useful, +#:: for instance to run git commands on a filename output from a +#:: previous git command. + +#: Open selected path + +# map kitty_mod+p>shift+f kitten hints --type path + +#:: Select a path/filename and open it with the default open program. + +#: Insert selected line + +# map kitty_mod+p>l kitten hints --type line --program - + +#:: Select a line of text and insert it into the terminal. Useful for +#:: the output of things like: `ls -1`. + +#: Insert selected word + +# map kitty_mod+p>w kitten hints --type word --program - + +#:: Select words and insert into terminal. + +#: Insert selected hash + +# map kitty_mod+p>h kitten hints --type hash --program - + +#:: Select something that looks like a hash and insert it into the +#:: terminal. Useful with git, which uses SHA1 hashes to identify +#:: commits. + +#: Open the selected file at the selected line + +# map kitty_mod+p>n kitten hints --type linenum + +#:: Select something that looks like filename:linenum and open it in +#:: your default editor at the specified line number. + +#: Open the selected hyperlink + +# map kitty_mod+p>y kitten hints --type hyperlink + +#:: Select a hyperlink (i.e. a URL that has been marked as such by +#:: the terminal program, for example, by `ls --hyperlink=auto`). + + +#: The hints kitten has many more modes of operation that you can map +#: to different shortcuts. For a full description see hints kitten +#: . +#: }}} + +#: Miscellaneous {{{ + +#: Show documentation + +# map kitty_mod+f1 show_kitty_doc overview + +#: Toggle fullscreen + +# map kitty_mod+f11 toggle_fullscreen +# map ctrl+cmd+f toggle_fullscreen + +#: Toggle maximized + +# map kitty_mod+f10 toggle_maximized + +#: Toggle macOS secure keyboard entry + +# map opt+cmd+s toggle_macos_secure_keyboard_entry + +#: Unicode input + +# map kitty_mod+u kitten unicode_input +# map ctrl+cmd+space kitten unicode_input + +#: Edit config file + +# map kitty_mod+f2 edit_config_file +# map cmd+, edit_config_file + +#: Open the kitty command shell + +# map kitty_mod+escape kitty_shell window + +#:: Open the kitty shell in a new window / tab / overlay / os_window +#:: to control kitty using commands. + +#: Increase background opacity + +# map kitty_mod+a>m set_background_opacity +0.1 + +#: Decrease background opacity + +# map kitty_mod+a>l set_background_opacity -0.1 + +#: Make background fully opaque + +# map kitty_mod+a>1 set_background_opacity 1 + +#: Reset background opacity + +# map kitty_mod+a>d set_background_opacity default + +#: Reset the terminal + +# map kitty_mod+delete clear_terminal reset active +# map opt+cmd+r clear_terminal reset active + +#:: You can create shortcuts to clear/reset the terminal. For +#:: example:: + +#:: # Reset the terminal +#:: map f1 clear_terminal reset active +#:: # Clear the terminal screen by erasing all contents +#:: map f1 clear_terminal clear active +#:: # Clear the terminal scrollback by erasing it +#:: map f1 clear_terminal scrollback active +#:: # Scroll the contents of the screen into the scrollback +#:: map f1 clear_terminal scroll active +#:: # Clear everything on screen up to the line with the cursor or the start of the current prompt (needs shell integration) +#:: map f1 clear_terminal to_cursor active +#:: # Same as above except cleared lines are moved into scrollback +#:: map f1 clear_terminal to_cursor_scroll active + +#:: If you want to operate on all kitty windows instead of just the +#:: current one, use all instead of active. + +#:: Some useful functions that can be defined in the shell rc files +#:: to perform various kinds of clearing of the current window: + +#:: .. code-block:: sh + +#:: clear-only-screen() { +#:: printf "\e[H\e[2J" +#:: } + +#:: clear-screen-and-scrollback() { +#:: printf "\e[H\e[3J" +#:: } + +#:: clear-screen-saving-contents-in-scrollback() { +#:: printf "\e[H\e[22J" +#:: } + +#:: For instance, using these escape codes, it is possible to remap +#:: Ctrl+L to both scroll the current screen contents into the +#:: scrollback buffer and clear the screen, instead of just clearing +#:: the screen. For ZSH, in ~/.zshrc, add: + +#:: .. code-block:: zsh + +#:: ctrl_l() { +#:: builtin print -rn -- $'\r\e[0J\e[H\e[22J' >"$TTY" +#:: builtin zle .reset-prompt +#:: builtin zle -R +#:: } +#:: zle -N ctrl_l +#:: bindkey '^l' ctrl_l + +#:: Alternatively, you can just add map ctrl+l clear_terminal +#:: to_cursor_scroll active to kitty.conf which works with no changes +#:: to the shell rc files, but only clears up to the prompt, it does +#:: not clear anytext at the prompt itself. + +#: Clear up to cursor line + +# map cmd+k clear_terminal to_cursor active + +#: Reload kitty.conf + +# map kitty_mod+f5 load_config_file +# map ctrl+cmd+, load_config_file + +#:: Reload kitty.conf, applying any changes since the last time it +#:: was loaded. Note that a handful of options cannot be dynamically +#:: changed and require a full restart of kitty. Particularly, when +#:: changing shortcuts for actions located on the macOS global menu +#:: bar, a full restart is needed. You can also map a keybinding to +#:: load a different config file, for example:: + +#:: map f5 load_config /path/to/alternative/kitty.conf + +#:: Note that all options from the original kitty.conf are discarded, +#:: in other words the new configuration *replace* the old ones. + +#: Debug kitty configuration + +# map kitty_mod+f6 debug_config +# map opt+cmd+, debug_config + +#:: Show details about exactly what configuration kitty is running +#:: with and its host environment. Useful for debugging issues. + +#: Send arbitrary text on key presses + +#:: E.g. map ctrl+shift+alt+h send_text all Hello World + +#:: You can tell kitty to send arbitrary (UTF-8) encoded text to the +#:: client program when pressing specified shortcut keys. For +#:: example:: + +#:: map ctrl+alt+a send_text all Special text + +#:: This will send "Special text" when you press the Ctrl+Alt+A key +#:: combination. The text to be sent decodes ANSI C escapes +#:: so you can use escapes like \e to send control +#:: codes or \u21fb to send Unicode characters (or you can just input +#:: the Unicode characters directly as UTF-8 text). You can use +#:: `kitten show-key` to get the key escape codes you want to +#:: emulate. + +#:: The first argument to send_text is the keyboard modes in which to +#:: activate the shortcut. The possible values are normal, +#:: application, kitty or a comma separated combination of them. The +#:: modes normal and application refer to the DECCKM cursor key mode +#:: for terminals, and kitty refers to the kitty extended keyboard +#:: protocol. The special value all means all of them. + +#:: Some more examples:: + +#:: # Output a word and move the cursor to the start of the line (like typing and pressing Home) +#:: map ctrl+alt+a send_text normal Word\e[H +#:: map ctrl+alt+a send_text application Word\eOH +#:: # Run a command at a shell prompt (like typing the command and pressing Enter) +#:: map ctrl+alt+a send_text normal,application some command with arguments\r + +#: Open kitty Website + +# map shift+cmd+/ open_url https://sw.kovidgoyal.net/kitty/ + +#: Hide macOS kitty application + +# map cmd+h hide_macos_app + +#: Hide macOS other applications + +# map opt+cmd+h hide_macos_other_apps + +#: Minimize macOS window + +# map cmd+m minimize_macos_window + +#: Quit kitty + +# map cmd+q quit + +#: }}} + +#: }}} + +# vim:ft=kitty + +## name: Catppuccin Kitty Macchiato +## author: Catppuccin Org +## license: MIT +## upstream: https://github.com/catppuccin/kitty/blob/main/themes/macchiato.conf +## blurb: Soothing pastel theme for the high-spirited! + + + +# The basic colors +foreground #cad3f5 +background #24273a +selection_foreground #24273a +selection_background #f4dbd6 + +# Cursor colors +cursor #f4dbd6 +cursor_text_color #24273a + +# URL underline color when hovering with mouse +url_color #f4dbd6 + +# Kitty window border colors +active_border_color #b7bdf8 +inactive_border_color #6e738d +bell_border_color #eed49f + +# OS Window titlebar colors +wayland_titlebar_color system +macos_titlebar_color system + +# Tab bar colors +active_tab_foreground #181926 +active_tab_background #c6a0f6 +inactive_tab_foreground #cad3f5 +inactive_tab_background #1e2030 +tab_bar_background #181926 + +# Colors for marks (marked text in the terminal) +mark1_foreground #24273a +mark1_background #b7bdf8 +mark2_foreground #24273a +mark2_background #c6a0f6 +mark3_foreground #24273a +mark3_background #7dc4e4 + +# The 16 terminal colors + +# black +color0 #494d64 +color8 #5b6078 + +# red +color1 #ed8796 +color9 #ed8796 + +# green +color2 #a6da95 +color10 #a6da95 + +# yellow +color3 #eed49f +color11 #eed49f + +# blue +color4 #8aadf4 +color12 #8aadf4 + +# magenta +color5 #f5bde6 +color13 #f5bde6 + +# cyan +color6 #8bd5ca +color14 #8bd5ca + +# white +color7 #b8c0e0 +color15 #a5adcb diff --git a/home/.config/stylus-catppuccin.json b/home/.config/stylus-catppuccin.json index 53f6ce0..e451326 100644 --- a/home/.config/stylus-catppuccin.json +++ b/home/.config/stylus-catppuccin.json @@ -15,6 +15,7 @@ "styleViaXhr": false, "urlInstaller": true, "windowPosition": {}, + "compactWidth": 850, "config.autosave": true, "schemeSwitcher.enabled": "system", "schemeSwitcher.nightStart": "18:00", @@ -116,12 +117,12 @@ "code": "" } ], - "sourceCode": "/* ==UserStyle==\n@name Wikipedia Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/wikipedia\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia\n@version 2025.01.01\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.less\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 domain(\"wiktionary.org\"),\n domain(\"www.mediawiki.org\") {\n @import url(\"https://python.catppuccin.com/pygments/catppuccin-variables.important.css\");\n\n :root.skin-theme-clientpref-os,\n .skin-invert,\n .notheme {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n :root.skin-theme-clientpref-night {\n #catppuccin(@darkFlavor);\n }\n\n :root.skin-theme-clientpref-day {\n #catppuccin(@lightFlavor);\n }\n\n html.skin-theme-clientpref-os .skin-invert-image img,\n html.skin-theme-clientpref-os .skin-invert,\n html.skin-theme-clientpref-os\n .oo-ui-iconElement-icon:not(\n .oo-ui-image-progressive,\n .oo-ui-image-destructive,\n .oo-ui-checkboxInputWidget-checkIcon,\n .oo-ui-image-invert,\n .mw-no-invert\n ),\n html.skin-theme-clientpref-os .oo-ui-indicatorElement-indicator {\n filter: none;\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @yellow-filter: @catppuccin-filters[@@flavor][@yellow];\n @blue-filter: @catppuccin-filters[@@flavor][@blue];\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @crust-filter: @catppuccin-filters[@@flavor][@crust];\n @accent-filter: @catppuccin-filters[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --color-base: @text;\n --color-base--hover: @text;\n --color-emphasized: @text;\n --color-subtle: @subtext0;\n --color-inverted: @crust;\n --color-inverted-fixed: @crust;\n --color-progressive: @accent;\n --color-progressive--hover: darken(@accent, 5%);\n --color-progressive--active: darken(@accent, 5%);\n --color-progressive--focus: darken(@accent, 5%);\n --color-destructive: @red;\n --color-destructive--hover: @maroon;\n --color-destructive--active: @maroon;\n --color-visited: @lavender;\n --color-destructive--visited: #b97876;\n --color-error: @red;\n --color-warning: @yellow;\n --color-success: @green;\n --color-notice: @text;\n --color-icon-error: @red;\n --color-icon-warning: @yellow;\n --color-icon-success: @green;\n --color-icon-notice: @subtext0;\n --color-content-added: @green;\n --color-content-removed: @maroon;\n --color-placeholder: @subtext0;\n --color-disabled: @overlay2;\n --box-shadow-color-base: #fff;\n --box-shadow-color-inverted: #000;\n --box-shadow-color-progressive--focus: @accent;\n --background-color-interactive: @surface0;\n --background-color-interactive-subtle: @surface0;\n --background-color-interactive-subtle--hover: @surface1;\n --background-color-disabled: @overlay2;\n --background-color-disabled-subtle: @surface0;\n --background-color-progressive: @accent;\n --background-color-progressive-subtle: fade(@accent, 10%);\n --background-color-destructive-subtle: #421211;\n --background-color-progressive--active: fade(@accent, 70%);\n --background-color-progressive--hover: fade(@accent, 70%);\n --background-color-progressive--focus: fade(@accent, 70%);\n --background-color-error: @red;\n --background-color-error--hover: @maroon;\n --background-color-error--active: @maroon;\n --background-color-error-subtle: fade(@red, 20%);\n --background-color-warning-subtle: fade(@yellow, 20%);\n --background-color-success-subtle: fade(@green, 20%);\n --background-color-notice-subtle: @surface0;\n --background-color-content-added: #2a4b8d;\n --background-color-content-removed: #a66200;\n --background-color-backdrop-light: rgba(0, 0, 0, 0.65);\n --background-color-backdrop-dark: rgba(255, 255, 255, 0.65);\n --background-color-base: @base;\n --background-color-base-fixed: @base;\n --background-color-neutral: @base;\n --background-color-neutral-subtle: @surface0;\n --background-color-inverted: @text;\n --background-color-input-binary--checked: @accent;\n --border-base: 1px solid @surface0;\n --border-subtle: 1px solid @surface0;\n --border-color-base: @surface0;\n --border-color-interactive: @surface2;\n --border-color-interactive--hover: @overlay0;\n --border-color-disabled: #54595d;\n --border-color-subtle: @surface1;\n --border-color-muted: #404244;\n --border-color-inverted: #101418;\n --border-color-error: @red;\n --border-color-error--hover: @maroon;\n --border-color-warning: @yellow;\n --border-color-success: @green;\n --border-color-notice: @surface2;\n --border-color-content-added: @blue;\n --border-color-content-removed: @peach;\n --border-color-progressive: @accent;\n --border-color-progressive--active: @accent;\n --border-color-progressive--hover: @accent;\n --border-color-progressive--focus: @accent;\n\n /* Wiktionary */\n --wikt-palette-indigo: @lavender;\n --wikt-palette-lightindigo: fade(@lavender, 40%);\n --wikt-palette-lighterblue: fade(@blue, 20%);\n --wikt-palette-dulllightblue: fade(@blue, 40%);\n --wikt-palette-grey: @subtext0;\n --wikt-palette-lightergrey: fade(@subtext0, 40%);\n\n /* Other */\n\n .infobox {\n border-color: @surface2;\n }\n\n [style=\"color:white;\"], [style*=\"color:#ffffff\"] {\n color: @text !important;\n }\n .mw-collapsible-toggle-default {\n &::before, &::after {\n color: @subtext0;\n }\n }\n\n a {\n color: @accent;\n\n &:focus {\n outline-color: @accent;\n }\n }\n\n .mw-parser-output {\n a.external {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n /* Wikipedia Home */\n #mp-topbanner {\n background-color: @base;\n border-color: @surface1;\n }\n #mp-left {\n background-color: fade(@green, 20%);\n border-color: @green;\n\n .mp-h2 {\n background-color: fade(@green, 40%);\n border-color: fade(@green, 40%);\n }\n }\n #mp-right {\n background-color: fade(@blue, 20%);\n border-color: @blue;\n\n .mp-h2 {\n background-color: fade(@blue, 40%);\n border-color: fade(@blue, 40%);\n }\n }\n #mp-lower {\n background-color: fade(@lavender, 20%);\n border-color: @lavender;\n\n .mp-h2 {\n background-color: fade(@lavender, 40%);\n border-color: fade(@lavender, 40%);\n }\n }\n #mp-bottom .mp-h2 {\n background-color: fade(@accent, 40%);\n border-color: fade(@accent, 40%);\n }\n .wikipedia-languages-prettybars {\n background-color: @surface2;\n }\n\n /* MediaWiki Home */\n .mainpage_box {\n border-color: @surface2;\n\n .header_icon {\n filter: @text-filter;\n }\n\n .items {\n border-top-color: @surface1;\n }\n }\n .nmbox {\n background-color: @surface0;\n border-color: @surface2;\n\n .nmbox-header {\n background-color: @base;\n border-color: @surface1;\n }\n }\n /* MediaWiki Pages */\n .tpl-downloadmediawiki-icon {\n filter: @crust-filter;\n }\n .note-info {\n filter: @blue-filter;\n color: @text;\n background-color: fade(@blue, 20%);\n }\n .note-warn {\n filter: @yellow-filter;\n color: @text;\n background-color: fade(@yellow, 20%);\n }\n }\n\n /* OOUI */\n .oo-ui-iconElement-icon,\n .oo-ui-indicator-down {\n filter: @text-filter !important;\n }\n\n /* View source */\n textarea {\n background-color: @mantle;\n color: @text;\n }\n\n /* View history */\n .flaggedrevs-color-1 {\n background-color: fade(@blue, 10%);\n }\n\n /* Language search and settings */\n .uls-search,\n .uls-filtersuggestion,\n .uls-lcd,\n #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages,\n #language-settings-dialog,\n #languagesettings-settings-panel,\n .uls-language-settings-close-block {\n background-color: @mantle;\n }\n .uls-language-block a {\n color: @accent;\n }\n .uls-search-label,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-add-languages-button,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-language-settings-button,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-language-settings-button:hover,\n .uls-icon-close,\n .uls-languagefilter-clear {\n filter: @text-filter;\n }\n .uls-sub-panel, .language-settings-buttons {\n border-color: @surface1;\n }\n .uls-language-block > ul > li:hover {\n background-color: @surface0;\n }\n .languagesettings-menu .menu-section.active {\n background-color: @surface1;\n }\n\n /* Icons */\n\n img[alt=\"Edit this on Wikidata\"],\n img[alt=\"Edit this at Wikidata\"] {\n filter: @accent-filter;\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-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 filter: none;\n }\n\n .vector-icon {\n filter: none !important;\n\n &.mw-ui-icon-wikimedia-menu {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-ellipsis {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-appearance {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-expand {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-language-progressive {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-language {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-listBullet {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-fullScreen {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-userAvatar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-watchlist {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-tray {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-bell {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-star {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-userTalk {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-sandbox {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-unStar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.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-wikimedia-userContributions {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-logOut {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.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-wikimedia-edit {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-history {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-speechBubbles {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-editLock {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n }\n\n /* Root */\n :root:has(.central-featured) {\n #catppuccin(@lightFlavor);\n\n &, body {\n color: @text;\n background-color: @base;\n\n .svg-Wikipedia_wordmark {\n filter: @text-filter;\n }\n\n .central-featured-lang small,\n .other-project-tagline,\n .site-license,\n .footer-sidebar-text {\n color: @subtext1;\n }\n\n .central-featured-lang :hover {\n background-color: @surface1;\n }\n\n .other-project-link:hover {\n background-color: @surface1;\n }\n\n .search-container {\n #searchInput {\n color: @text;\n background-color: @mantle;\n border-color: @overlay2;\n box-shadow: none;\n\n &:focus {\n border-color: @accent;\n }\n }\n\n .js-langpicker-label {\n color: @subtext0;\n }\n .styled-select:hover {\n background-color: @surface1;\n }\n .sprite.svg-arrow-down {\n filter: @text-filter;\n }\n\n button[type=\"submit\"] {\n background-color: @accent;\n border-color: @accent;\n\n .svg-search-icon {\n filter: @crust-filter;\n }\n }\n\n .suggestions-dropdown {\n background-color: @mantle;\n border-color: @overlay2;\n\n .suggestion-link {\n border-bottom-color: @overlay0;\n\n &.active {\n background-color: fade(@accent, 10%);\n }\n\n .suggestion-thumbnail {\n @svg: escape(\n '',\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .suggestion-title {\n color: @text;\n }\n }\n }\n }\n\n hr {\n border-bottom-color: @surface1;\n }\n\n .lang-list-border {\n background-color: @surface2;\n }\n .lang-list-button {\n background-color: @mantle;\n color: @accent;\n outline-color: @mantle;\n border-color: @surface2;\n\n .svg-language-icon,\n .svg-arrow-down-blue {\n filter: @accent-filter;\n }\n\n &:focus {\n box-shadow: inset 0 0 0 1px @accent;\n }\n }\n .lang-list-container {\n background-color: @surface0;\n\n .bookshelf {\n border-top-color: @overlay1;\n box-shadow: none;\n\n .text {\n color: @text;\n background-color: @surface2;\n }\n }\n }\n }\n }\n}\n\n/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", + "sourceCode": "/* ==UserStyle==\n@name Wikipedia Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/wikipedia\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia\n@version 2025.02.02\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.less\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 domain(\"wiktionary.org\"),\n domain(\"www.mediawiki.org\") {\n @import url(\"https://python.catppuccin.com/pygments/catppuccin-variables.important.css\");\n\n :root.skin-theme-clientpref-os,\n .skin-invert,\n .notheme {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n :root.skin-theme-clientpref-night {\n #catppuccin(@darkFlavor);\n }\n\n :root.skin-theme-clientpref-day {\n #catppuccin(@lightFlavor);\n }\n\n html.skin-theme-clientpref-os .skin-invert-image img,\n html.skin-theme-clientpref-os .skin-invert,\n html.skin-theme-clientpref-os\n .oo-ui-iconElement-icon:not(\n .oo-ui-image-progressive,\n .oo-ui-image-destructive,\n .oo-ui-checkboxInputWidget-checkIcon,\n .oo-ui-image-invert,\n .mw-no-invert\n ),\n html.skin-theme-clientpref-os .oo-ui-indicatorElement-indicator {\n filter: none;\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @yellow-filter: @catppuccin-filters[@@flavor][@yellow];\n @blue-filter: @catppuccin-filters[@@flavor][@blue];\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @crust-filter: @catppuccin-filters[@@flavor][@crust];\n @accent-filter: @catppuccin-filters[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n --color-base: @text;\n --color-base--hover: @text;\n --color-emphasized: @text;\n --color-subtle: @subtext0;\n --color-inverted: @crust;\n --color-inverted-fixed: @crust;\n --color-progressive: @accent;\n --color-progressive--hover: darken(@accent, 5%);\n --color-progressive--active: darken(@accent, 5%);\n --color-progressive--focus: darken(@accent, 5%);\n --color-destructive: @red;\n --color-destructive--hover: @maroon;\n --color-destructive--active: @maroon;\n --color-visited: @lavender;\n --color-destructive--visited: #b97876;\n --color-error: @red;\n --color-warning: @yellow;\n --color-success: @green;\n --color-notice: @text;\n --color-icon-error: @red;\n --color-icon-warning: @yellow;\n --color-icon-success: @green;\n --color-icon-notice: @subtext0;\n --color-content-added: @green;\n --color-content-removed: @maroon;\n --color-placeholder: @subtext0;\n --color-disabled: @overlay2;\n --box-shadow-color-base: #fff;\n --box-shadow-color-inverted: #000;\n --box-shadow-color-progressive--focus: @accent;\n --background-color-interactive: @surface0;\n --background-color-interactive-subtle: @surface0;\n --background-color-interactive-subtle--hover: @surface1;\n --background-color-disabled: @overlay2;\n --background-color-disabled-subtle: @surface0;\n --background-color-progressive: @accent;\n --background-color-progressive-subtle: fade(@accent, 10%);\n --background-color-destructive-subtle: #421211;\n --background-color-progressive--active: fade(@accent, 70%);\n --background-color-progressive--hover: fade(@accent, 70%);\n --background-color-progressive--focus: fade(@accent, 70%);\n --background-color-error: @red;\n --background-color-error--hover: @maroon;\n --background-color-error--active: @maroon;\n --background-color-error-subtle: fade(@red, 20%);\n --background-color-warning-subtle: fade(@yellow, 20%);\n --background-color-success-subtle: fade(@green, 20%);\n --background-color-notice-subtle: @surface0;\n --background-color-content-added: #2a4b8d;\n --background-color-content-removed: #a66200;\n --background-color-backdrop-light: rgba(0, 0, 0, 0.65);\n --background-color-backdrop-dark: rgba(255, 255, 255, 0.65);\n --background-color-base: @base;\n --background-color-base-fixed: @base;\n --background-color-neutral: @base;\n --background-color-neutral-subtle: @surface0;\n --background-color-inverted: @text;\n --background-color-input-binary--checked: @accent;\n --border-base: 1px solid @surface0;\n --border-subtle: 1px solid @surface0;\n --border-color-base: @surface0;\n --border-color-interactive: @surface2;\n --border-color-interactive--hover: @overlay0;\n --border-color-disabled: #54595d;\n --border-color-subtle: @surface1;\n --border-color-muted: #404244;\n --border-color-inverted: #101418;\n --border-color-error: @red;\n --border-color-error--hover: @maroon;\n --border-color-warning: @yellow;\n --border-color-success: @green;\n --border-color-notice: @surface2;\n --border-color-content-added: @blue;\n --border-color-content-removed: @peach;\n --border-color-progressive: @accent;\n --border-color-progressive--active: @accent;\n --border-color-progressive--hover: @accent;\n --border-color-progressive--focus: @accent;\n\n /* Wiktionary */\n --wikt-palette-indigo: @lavender;\n --wikt-palette-lightindigo: fade(@lavender, 40%);\n --wikt-palette-lighterblue: fade(@blue, 20%);\n --wikt-palette-dulllightblue: fade(@blue, 40%);\n --wikt-palette-grey: @subtext0;\n --wikt-palette-lightergrey: fade(@subtext0, 40%);\n\n /* Other */\n\n .infobox {\n border-color: @surface2;\n }\n\n [style=\"color:white;\"], [style*=\"color:#ffffff\"] {\n color: @text !important;\n }\n .mw-collapsible-toggle-default {\n &::before, &::after {\n color: @subtext0;\n }\n }\n\n a {\n &:focus {\n outline-color: @accent;\n }\n }\n\n .mw-parser-output {\n a.external {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n /* Wikipedia Home */\n #mp-topbanner {\n background-color: @base;\n border-color: @surface1;\n }\n #mp-left {\n background-color: fade(@green, 20%);\n border-color: @green;\n\n .mp-h2 {\n background-color: fade(@green, 40%);\n border-color: fade(@green, 40%);\n }\n }\n #mp-right {\n background-color: fade(@blue, 20%);\n border-color: @blue;\n\n .mp-h2 {\n background-color: fade(@blue, 40%);\n border-color: fade(@blue, 40%);\n }\n }\n #mp-lower {\n background-color: fade(@lavender, 20%);\n border-color: @lavender;\n\n .mp-h2 {\n background-color: fade(@lavender, 40%);\n border-color: fade(@lavender, 40%);\n }\n }\n #mp-bottom .mp-h2 {\n background-color: fade(@accent, 40%);\n border-color: fade(@accent, 40%);\n }\n .wikipedia-languages-prettybars {\n background-color: @surface2;\n }\n\n /* MediaWiki Home */\n .mainpage_box {\n border-color: @surface2;\n\n .header_icon {\n filter: @text-filter;\n }\n\n .items {\n border-top-color: @surface1;\n }\n }\n .nmbox {\n background-color: @surface0;\n border-color: @surface2;\n\n .nmbox-header {\n background-color: @base;\n border-color: @surface1;\n }\n }\n /* MediaWiki Pages */\n .tpl-downloadmediawiki-icon {\n filter: @crust-filter;\n }\n .note-info {\n filter: @blue-filter;\n color: @text;\n background-color: fade(@blue, 20%);\n }\n .note-warn {\n filter: @yellow-filter;\n color: @text;\n background-color: fade(@yellow, 20%);\n }\n }\n\n /* OOUI */\n .oo-ui-iconElement-icon,\n .oo-ui-indicator-down {\n filter: @text-filter !important;\n }\n\n /* View source */\n textarea {\n background-color: @mantle;\n color: @text;\n }\n\n /* View history */\n .flaggedrevs-color-1 {\n background-color: fade(@blue, 10%);\n }\n\n /* Language search and settings */\n .uls-search,\n .uls-filtersuggestion,\n .uls-lcd,\n #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages,\n #language-settings-dialog,\n #languagesettings-settings-panel,\n .uls-language-settings-close-block {\n background-color: @mantle;\n }\n .uls-language-block a {\n color: @accent;\n }\n .uls-search-label,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-add-languages-button,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-language-settings-button,\n #uls-settings-block.uls-settings-block--vector-2022\n > button.uls-language-settings-button:hover,\n .uls-icon-close,\n .uls-languagefilter-clear {\n filter: @text-filter;\n }\n .uls-sub-panel, .language-settings-buttons {\n border-color: @surface1;\n }\n .uls-language-block > ul > li:hover {\n background-color: @surface0;\n }\n .languagesettings-menu .menu-section.active {\n background-color: @surface1;\n }\n\n /* Icons */\n\n img[alt=\"Edit this on Wikidata\"],\n img[alt=\"Edit this at Wikidata\"] {\n filter: @accent-filter;\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-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 filter: none;\n }\n\n .vector-icon {\n filter: none !important;\n\n &.mw-ui-icon-wikimedia-menu {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-ellipsis {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-appearance {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-expand {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-language-progressive {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-language {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-listBullet {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\") !important;\n }\n\n &.mw-ui-icon-wikimedia-fullScreen {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-userAvatar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-watchlist {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-tray {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-bell {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-star {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-userTalk {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-sandbox {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-settings {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-unStar {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.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-wikimedia-userContributions {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-logOut {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.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-wikimedia-edit {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-history {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-speechBubbles {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n &.mw-ui-icon-wikimedia-editLock {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n }\n }\n\n /* Root */\n :root:has(.central-featured) {\n #catppuccin(@lightFlavor);\n\n &, body {\n color: @text;\n background-color: @base;\n\n .svg-Wikipedia_wordmark {\n filter: @text-filter;\n }\n\n .central-featured-lang small,\n .other-project-tagline,\n .site-license,\n .footer-sidebar-text {\n color: @subtext1;\n }\n\n .central-featured-lang :hover {\n background-color: @surface1;\n }\n\n .other-project-link:hover {\n background-color: @surface1;\n }\n\n .search-container {\n #searchInput {\n color: @text;\n background-color: @mantle;\n border-color: @overlay2;\n box-shadow: none;\n\n &:focus {\n border-color: @accent;\n }\n }\n\n .js-langpicker-label {\n color: @subtext0;\n }\n .styled-select:hover {\n background-color: @surface1;\n }\n .sprite.svg-arrow-down {\n filter: @text-filter;\n }\n\n button[type=\"submit\"] {\n background-color: @accent;\n border-color: @accent;\n\n .svg-search-icon {\n filter: @crust-filter;\n }\n }\n\n .suggestions-dropdown {\n background-color: @mantle;\n border-color: @overlay2;\n\n .suggestion-link {\n border-bottom-color: @overlay0;\n\n &.active {\n background-color: fade(@accent, 10%);\n }\n\n .suggestion-thumbnail {\n @svg: escape(\n '',\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n }\n\n .suggestion-title {\n color: @text;\n }\n }\n }\n }\n\n hr {\n border-bottom-color: @surface1;\n }\n\n .lang-list-border {\n background-color: @surface2;\n }\n .lang-list-button {\n background-color: @mantle;\n color: @accent;\n outline-color: @mantle;\n border-color: @surface2;\n\n .svg-language-icon,\n .svg-arrow-down-blue {\n filter: @accent-filter;\n }\n\n &:focus {\n box-shadow: inset 0 0 0 1px @accent;\n }\n }\n .lang-list-container {\n background-color: @surface0;\n\n .bookshelf {\n border-top-color: @overlay1;\n box-shadow: none;\n\n .text {\n color: @text;\n background-color: @surface2;\n }\n }\n }\n }\n }\n}\n\n/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", "usercssData": { "name": "Wikipedia Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/wikipedia", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia", - "version": "2025.01.01", + "version": "2025.02.02", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia", "description": "Soothing pastel theme for Wikipedia", @@ -286,12 +287,12 @@ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia", "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.less", "name": "Wikipedia Catppuccin", - "originalDigest": "7196b64757e0a7258ee49a9e73da8da7436279e9", + "originalDigest": "9fa8182bd94759afd889b21b3d1d64adc0bb9ae5", "_id": "1041e719-a6f4-4e67-8ae9-ccc268aad05c", - "_rev": 1736501783415, + "_rev": 1742161344375, "id": 15, - "etag": "W/\"efedf625b9a6e8642c269ae8ffda4a07da94c8f60d2a503def11e0f47eb379a9\"", - "updateDate": 1736501268375 + "etag": "W/\"db6c1f6b6458e67c3d85e3743795ff57e5cf9d7f1e11848dc6e9914cc8c3c65d\"", + "updateDate": 1742161326988 }, { "enabled": true, @@ -465,7 +466,7 @@ "name": "NixOS Search Catppuccin", "updateDate": 1736501252704, "_id": "c79c1637-d3ba-4bdb-b460-bb9367f36c9c", - "_rev": 1736501771442, + "_rev": 1742161226538, "id": 1, "originalDigest": "301ff934d9d40f26c4c8560aa16f7bed13a4782c", "etag": "W/\"fd8c36a8372ea205bb65c560c756f5bae6e86ba694776a373e09b9db610f5e15\"" @@ -480,12 +481,12 @@ "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 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.less\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);\n }\n :root.dark {\n #catppuccin(@darkFlavor);\n }\n :root:not(.light, .dark) {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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;\n --color-divider-subtle: @surface0;\n --color-divider-interactive: @accent;\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;\n --color-primary-50: @accent;\n --color-primitive-primary-60: @accent;\n --color-primitive-primary-70: darken(@accent, 5%);\n --color-container-interactive: transparent;\n --color-button-background: @accent;\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;\n border-color: @accent !important;\n color: @base !important;\n }\n .tab-item.active .icon {\n fill: @accent !important;\n }\n .tab-item.active ::after {\n background: @accent !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;\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/* deno-fmt-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", + "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 2025.02.28\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.less\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);\n }\n :root.dark {\n #catppuccin(@darkFlavor);\n }\n :root:not(.light, .dark) {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n &, .is-serp {\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;\n --color-divider-subtle: @surface0;\n --color-divider-interactive: @accent;\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;\n --color-primary-50: @accent;\n --color-primitive-primary-60: @accent;\n --color-primitive-primary-70: darken(@accent, 5%);\n --color-container-interactive: transparent;\n --color-button-background: @accent;\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, #submit-llm-button {\n svg {\n fill: @overlay2;\n }\n\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 svg {\n fill: @base;\n }\n }\n }\n\n #clear-query-button svg {\n fill: @overlay2;\n }\n\n #searchbox::placeholder {\n color: @subtext0;\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;\n border-color: @accent !important;\n color: @base !important;\n }\n .tab-item.active .icon {\n fill: @accent !important;\n }\n .tab-item.active ::after {\n background: @accent !important;\n }\n .conversation-input-field.type--default {\n background: @crust;\n border-color: @crust;\n color: @text;\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;\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/* deno-fmt-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", "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": "2024.12.31", + "version": "2025.02.28", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abrave-search", "description": "Soothing pastel theme for Brave Search", @@ -640,12 +641,12 @@ "author": "Catppuccin", "description": "Soothing pastel theme for Brave Search", "name": "Brave Search Catppuccin", - "updateDate": 1736501253969, + "updateDate": 1742161328231, "_id": "32352688-6557-43a8-ac09-6f44295035d0", - "_rev": 1736501771456, + "_rev": 1742161339935, "id": 2, - "originalDigest": "35800bff3a46ce28d4758706545d8e005980b5c5", - "etag": "W/\"c967b42a0f2ea1f47f2131bf9b15ec46a41d0fb4788edbbfa5ea6705a41eb5a7\"", + "originalDigest": "2bc1a594dbb80e35f1a88b50a37b8e42bc1e61ad", + "etag": "W/\"a60ae40f8f533df8a83a75155a89ff5bc2016d350ce0c3e910ad85aebb7d6764\"", "preferScheme": "none" }, { @@ -658,12 +659,12 @@ "code": "" } ], - "sourceCode": "/* ==UserStyle==\n@name ChatGPT Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/chatgpt\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt\n@version 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.less\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);\n }\n\n :root.dark {\n #catppuccin(@darkFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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(@flavor = latte, @crust, @text);\n @black: if(@flavor = latte, @text, @crust);\n --white: @white;\n --black: @black;\n\n & when not(@flavor = 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;\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 --message-surface: var(--gray-700) !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 (@flavor = 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;\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 --message-surface: var(--gray-100) !important;\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;\n --link-hover: if(\n @flavor = latte,\n lighten(@accent, 10%),\n darken(@accent, 10%)\n );\n\n *:focus {\n --tw-ring-offset-color: @base;\n --tw-ring-color: @accent;\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;\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;\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;\n color: @base;\n\n &:hover {\n background-color: darken(@accent, 10%);\n }\n\n &:focus-visible {\n --tw-ring-color: darken(@accent, 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 !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;\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;\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;\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 !important;\n }\n\n .dark\\:radix-state-checked\\:border-green-600[data-state=\"checked\"]:is(\n .dark *\n ) {\n border-color: @accent;\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, 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;\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(@flavor = 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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n background-color: @base;\n caret-color: @text;\n\n a {\n color: @accent;\n }\n\n body,\n .oai-header,\n .oai-footer,\n .login-container,\n .main-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;\n\n + .email-label {\n color: @accent;\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;\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);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n --primary-color: @accent;\n --primary-color-no-override: @accent;\n --action-primary-color: @accent;\n --link-color: @accent;\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;\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: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", + "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 2025.03.10\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.less\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);\n }\n\n :root.dark {\n #catppuccin(@darkFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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(@flavor = latte, @crust, @text);\n @black: if(@flavor = latte, @text, @crust);\n --white: @white;\n --black: @black;\n\n & when not(@flavor = 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;\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 --message-surface: var(--gray-700) !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 (@flavor = 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;\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 --message-surface: var(--gray-100) !important;\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;\n --link-hover: if(\n @flavor = latte,\n lighten(@accent, 10%),\n darken(@accent, 10%)\n );\n\n *:focus {\n --tw-ring-offset-color: @base;\n --tw-ring-color: @accent;\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;\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;\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;\n color: @base;\n\n &:hover {\n background-color: darken(@accent, 10%);\n }\n\n &:focus-visible {\n --tw-ring-color: darken(@accent, 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: @accent;\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-brand-purple {\n background-color: @accent !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 /* Main message input box */\n .bg-\\[\\#303030\\],\n .dark\\:bg-\\[\\#303030\\] {\n background-color: @surface0;\n &.dark when (@flavor = latte) {\n background-color: @subtext0;\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;\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;\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;\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: fade(@accent, 10%);\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 !important;\n }\n\n .dark\\:radix-state-checked\\:border-green-600[data-state=\"checked\"]:is(\n .dark *\n ) {\n border-color: @accent;\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, 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;\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: @accent;\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(@flavor = 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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n background-color: @base;\n caret-color: @text;\n\n a {\n color: @accent;\n }\n\n body,\n .oai-header,\n .oai-footer,\n .login-container,\n .main-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;\n\n + .email-label {\n color: @accent;\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;\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);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :root {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n --primary-color: @accent;\n --primary-color-no-override: @accent;\n --action-primary-color: @accent;\n --link-color: @accent;\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;\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: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", "usercssData": { "name": "ChatGPT Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/chatgpt", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt", - "version": "2024.12.31", + "version": "2025.03.10", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt", "description": "Soothing pastel theme for ChatGPT", @@ -818,12 +819,12 @@ "author": "Catppuccin", "description": "Soothing pastel theme for ChatGPT", "name": "ChatGPT Catppuccin", - "updateDate": 1736501255248, + "updateDate": 1742161329659, "_id": "b053cab5-a06a-4e0b-92a6-85a53326e988", - "_rev": 1736501771479, + "_rev": 1742161337702, "id": 3, - "originalDigest": "53c23d2066944b20587ba35ba1381ab6a351399c", - "etag": "W/\"8e120a3627a940cac3d5babfc25ebc88ba19f290b8d24729c30767dfc30e4a1d\"" + "originalDigest": "fa73d878ff230e1e3091c18a8b5f2d2bfabc6525", + "etag": "W/\"6b7524c2236d6b5a04d8e9455d461792cf6e28bcd926d173cd8db59c08d73e19\"" }, { "enabled": true, @@ -997,7 +998,7 @@ "name": "DeepL Catppuccin", "updateDate": 1736501256596, "_id": "e083a452-5ef6-4812-8b76-5970f5c98476", - "_rev": 1736501771520, + "_rev": 1742161226578, "id": 4, "originalDigest": "a41c2ea71030b695a5d2cbb6ec7f97b2e595d084", "etag": "W/\"19ec979b7c5efe91c6fd74df129b3990998bc607623214a56b16665b980e7bf1\"" @@ -1012,12 +1013,12 @@ "code": "" } ], - "sourceCode": "/* ==UserStyle==\n@name GitHub Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/github\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/github\n@version 2025.01.05\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.less\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(\n \"https:\\/\\/(gist\\.)*github\\.com(?!((\\/.+?\\/.+?\\/commit\\/[A-Fa-f0-9]+\\.(patch|diff)$)|\\/home$|\\/features($|\\/.*)|\\/marketplace($|\\?.*|\\/.*)|\\/organizations\\/plan)).*$\"\n ),\n regexp(\"https:\\/\\/viewscreen\\.githubusercontent\\.com(\\/diff\\/img|\\/view).*\") {\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\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(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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;\n color: @text;\n\n --color-social-reaction-bg-reacted-hover: fade(@accent, 30%);\n --color-notifications-button-hover-bg: fade(@accent, 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: fade(\n @accent,\n 40%\n ) !important;\n --color-calendar-halloween-graph-day-L2-bg: fade(\n @accent,\n 60%\n ) !important;\n --color-calendar-halloween-graph-day-L3-bg: fade(\n @accent,\n 80%\n ) !important;\n --color-calendar-halloween-graph-day-L4-bg: @accent !important;\n --color-calendar-winter-graph-day-L1-bg: fade(\n @accent,\n 40%\n ) !important;\n --color-calendar-winter-graph-day-L2-bg: fade(\n @accent,\n 60%\n ) !important;\n --color-calendar-winter-graph-day-L3-bg: fade(\n @accent,\n 80%\n ) !important;\n --color-calendar-winter-graph-day-L4-bg: @accent !important;\n --color-calendar-graph-day-bg: @surface0 !important;\n --color-calendar-graph-day-border: transparent !important;\n --color-calendar-graph-day-L1-bg: fade(@accent, 40%) !important;\n --color-calendar-graph-day-L2-bg: fade(@accent, 60%) !important;\n --color-calendar-graph-day-L3-bg: fade(@accent, 80%) !important;\n --color-calendar-graph-day-L4-bg: @accent !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;\n --color-user-mention-bg: fade(@accent, 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-additionNum-bgColor: fade(@green, 30%);\n --diffBlob-additionNum-fgColor: @text;\n --diffBlob-additionLine-bgColor: fade(@green, 15%);\n --diffBlob-additionWord-bgColor: fade(@green, 30%);\n --diffBlob-additionWord-fgColor: @text;\n --diffBlob-deletionNum-bgColor: fade(@red, 30%);\n --diffBlob-deletionNum-fgColor: @text;\n --diffBlob-deletionLine-bgColor: fade(@red, 15%);\n --diffBlob-deletionWord-bgColor: fade(@red, 30%);\n --diffBlob-deletionWord-fgColor: @text;\n --diffBlob-hunkNum-bgColor-rest: fade(@accent, 40%);\n --diffBlob-hunkNum-bgColor-hover: fade(@accent, 75%);\n --diffBlob-hunkLine-bgColor: fade(@accent, 25%);\n --diffBlob-expander-iconColor: @subtext0;\n --diffBlob-emptyNum-bgColor: @mantle;\n --diffBlob-emptyLine-bgColor: @mantle;\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;\n --control-checked-bgColor-hover: lighten(@accent, 5%);\n --control-checked-bgColor-active: lighten(@accent, 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;\n --control-checked-borderColor-hover: @accent;\n --control-checked-borderColor-active: @accent;\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, 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;\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: @subtext0;\n --underlineNav-borderColor-active: @accent;\n --underlineNav-borderColor-hover: #6e768166;\n --underlineNav-iconColor-rest: #848d97;\n --selection-bgColor: fade(@accent, 30%);\n --reactionButton-selected-bgColor-rest: fade(@accent, 20%);\n --reactionButton-selected-bgColor-hover: fade(@accent, 35%);\n --reactionButton-selected-fgColor-rest: @accent;\n --reactionButton-selected-fgColor-hover: @accent;\n --fgColor-default: @text;\n --fgColor-muted: @subtext1;\n --fgColor-onEmphasis: @base;\n --fgColor-white: if(@flavor = latte, @crust, @text);\n --fgColor-disabled: @surface2;\n --fgColor-link: @accent;\n --fgColor-neutral: @subtext1;\n --fgColor-accent: @accent;\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, 20%);\n --bgColor-accent-emphasis: @accent;\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, 50%);\n --borderColor-accent-emphasis: @accent;\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 (@flavor = 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(@flavor = 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: fade(@red, 15%);\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: fade(@red, 40%);\n --color-prettylights-syntax-markup-inserted-text: @text;\n --color-prettylights-syntax-markup-inserted-bg: fade(@green, 40%);\n --color-prettylights-syntax-markup-changed-text: @text;\n --color-prettylights-syntax-markup-changed-bg: fade(@yellow, 40%);\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:\n 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust;\n --shadow-floating-medium:\n 0px 0px 0px 1px @surface0, 0px 8px 16px -4px @crust, 0px 4px 32px -4px\n @crust, 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust;\n --shadow-floating-large:\n 0px 0px 0px 1px @surface0, 0px 24px 48px 0px #010409;\n --shadow-floating-xlarge:\n 0px 0px 0px 1px @surface0, 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 /* Customer Terms & Agreements Page: https://github.com/customer-terms */\n .enterprise-customer-agreement {\n color: @text !important;\n\n &:hover {\n .octicon,\n h3 {\n color: @accent !important;\n }\n }\n }\n\n /* Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */\n --data-blue-color-emphasis: @accent;\n --data-red-color-emphasis: @red;\n --data-green-color-emphasis: @green;\n\n /* Copilot Chat */\n --display-green-fgColor: @green;\n --display-teal-fgColor: @teal;\n --display-purple-fgColor: @mauve;\n --display-blue-fgColor: @blue;\n --display-pink-fgColor: @pink;\n --display-gray-fgColor: @subtext0;\n react-app[app-name=\"copilot-immersive-v1\"],\n copilot-dashboard-entrypoint {\n button {\n color: @text;\n }\n }\n\n --tooltip-fgColor: @base;\n --tooltip-bgColor: @overlay2;\n\n /* Refined GitHub */\n --rgh-heat-color: @peach;\n\n .turbo-progress-bar {\n background-color: @accent;\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 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,\n darken(@accent, 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;\n stroke: @accent;\n }\n\n .subnav-link.selected {\n border-bottom-color: @accent;\n }\n\n /* Pull request check in progress indicator */\n [stroke=\"#DBAB0A\" i] {\n stroke: fade(@yellow, 70%) !important;\n }\n [fill=\"#DBAB0A\" i] {\n fill: @yellow !important;\n }\n }\n}\n\n@-moz-document url-prefix(\n \"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);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n ::selection {\n background-color: fade(@accent, 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;\n --color-fg-muted: @subtext1;\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\n #diagram {\n .node rect,\n .node circle,\n .node ellipse,\n .node polygon,\n .node path {\n fill: fade(@accent, 10%);\n stroke: @accent;\n }\n\n .cluster rect {\n fill: @surface0;\n stroke: @surface2;\n }\n\n .label text,\n span,\n p {\n fill: @text;\n color: @text;\n }\n\n .flowchart-link {\n stroke: @subtext0;\n }\n .marker {\n stroke: @subtext0;\n fill: @subtext0;\n }\n\n .edgeLabel {\n background-color: @crust;\n p {\n background-color: @surface2;\n }\n }\n }\n\n .octicon {\n fill: var(--color-fg-muted) !important;\n }\n }\n}\n\n@-moz-document regexp(\n \"https:\\/\\/notebooks\\.githubusercontent\\.com\\/view\\/ipynb.*\"\n ) {\n :root {\n #catppuccin(@darkFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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: fade(@text, 87%);\n --jp-ui-font-color2: fade(@text, 54%);\n --jp-ui-font-color3: fade(@text, 28%);\n --jp-ui-inverse-font-color0: @crust;\n --jp-ui-inverse-font-color1: fade(@crust, 80%);\n --jp-ui-inverse-font-color2: fade(@crust, 50%);\n --jp-ui-inverse-font-color3: fade(@crust, 30%);\n --jp-content-font-color0: @text;\n --jp-content-font-color1: @text;\n --jp-content-font-color2: fade(@text, 70%);\n --jp-content-font-color3: fade(@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: fade(@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: fade(@overlay2, 14%);\n --jp-rendermime-error-background: fade(@red, 18%);\n --jp-rendermime-table-row-background: var(--color-scale-gray-9);\n --jp-rendermime-table-row-hover-background: fade(@surface2, 14%);\n --jp-dialog-background: fade(@crust, 60%);\n --jp-toolbar-box-shadow: 0px 0px 2px 0px fade(@crust, 80%);\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: fade(@blue, 30%);\n --jp-editor-selected-focused-background: fade(@blue, 14%);\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/* deno-fmt-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", + "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 2025.02.04.1\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.less\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 /* Match every page on GitHub except github.com/home, github.com/features/*, and github.com/organizations/plan. */\nregexp(\n \"https:\\/\\/github\\.com(?!(\\/home$|\\/features($|\\/.*)|\\/organizations\\/plan)).*$\"\n ),\n domain(\"gist.github.com\"),\n domain(\"docs.github.com\"),\n domain(\"viewscreen.githubusercontent.com\") {\n [data-color-mode=\"auto\"] {\n @media (prefers-color-scheme: light) {\n &[data-light-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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;\n color: @text;\n\n --color-social-reaction-bg-reacted-hover: fade(@accent, 30%);\n --color-notifications-button-hover-bg: fade(@accent, 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: fade(\n @accent,\n 40%\n ) !important;\n --color-calendar-halloween-graph-day-L2-bg: fade(\n @accent,\n 60%\n ) !important;\n --color-calendar-halloween-graph-day-L3-bg: fade(\n @accent,\n 80%\n ) !important;\n --color-calendar-halloween-graph-day-L4-bg: @accent !important;\n --color-calendar-winter-graph-day-L1-bg: fade(\n @accent,\n 40%\n ) !important;\n --color-calendar-winter-graph-day-L2-bg: fade(\n @accent,\n 60%\n ) !important;\n --color-calendar-winter-graph-day-L3-bg: fade(\n @accent,\n 80%\n ) !important;\n --color-calendar-winter-graph-day-L4-bg: @accent !important;\n --color-calendar-graph-day-bg: @surface0 !important;\n --color-calendar-graph-day-border: transparent !important;\n --color-calendar-graph-day-L1-bg: fade(@accent, 40%) !important;\n --color-calendar-graph-day-L2-bg: fade(@accent, 60%) !important;\n --color-calendar-graph-day-L3-bg: fade(@accent, 80%) !important;\n --color-calendar-graph-day-L4-bg: @accent !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;\n --color-user-mention-bg: fade(@accent, 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-additionNum-bgColor: fade(@green, 30%);\n --diffBlob-additionNum-fgColor: @text;\n --diffBlob-additionLine-bgColor: fade(@green, 15%);\n --diffBlob-additionWord-bgColor: fade(@green, 30%);\n --diffBlob-additionWord-fgColor: @text;\n --diffBlob-deletionNum-bgColor: fade(@red, 30%);\n --diffBlob-deletionNum-fgColor: @text;\n --diffBlob-deletionLine-bgColor: fade(@red, 15%);\n --diffBlob-deletionWord-bgColor: fade(@red, 30%);\n --diffBlob-deletionWord-fgColor: @text;\n --diffBlob-hunkNum-bgColor-rest: fade(@accent, 40%);\n --diffBlob-hunkNum-bgColor-hover: fade(@accent, 75%);\n --diffBlob-hunkLine-bgColor: fade(@accent, 25%);\n --diffBlob-expander-iconColor: @subtext0;\n --diffBlob-emptyNum-bgColor: @mantle;\n --diffBlob-emptyLine-bgColor: @mantle;\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;\n --control-checked-bgColor-hover: lighten(@accent, 5%);\n --control-checked-bgColor-active: lighten(@accent, 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;\n --control-checked-borderColor-hover: @accent;\n --control-checked-borderColor-active: @accent;\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, 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;\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: @subtext0;\n --underlineNav-borderColor-active: @accent;\n --underlineNav-borderColor-hover: #6e768166;\n --underlineNav-iconColor-rest: #848d97;\n --selection-bgColor: fade(@accent, 30%);\n --reactionButton-selected-bgColor-rest: fade(@accent, 20%);\n --reactionButton-selected-bgColor-hover: fade(@accent, 35%);\n --reactionButton-selected-fgColor-rest: @accent;\n --reactionButton-selected-fgColor-hover: @accent;\n --fgColor-default: @text;\n --fgColor-muted: @subtext1;\n --fgColor-onEmphasis: @base;\n --fgColor-white: if(@flavor = latte, @crust, @text);\n --fgColor-disabled: @surface2;\n --fgColor-link: @accent;\n --fgColor-neutral: @subtext1;\n --fgColor-accent: @accent;\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, 20%);\n --bgColor-accent-emphasis: @accent;\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, 50%);\n --borderColor-accent-emphasis: @accent;\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 (@flavor = 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(@flavor = 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: fade(@red, 15%);\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: fade(@red, 40%);\n --color-prettylights-syntax-markup-inserted-text: @text;\n --color-prettylights-syntax-markup-inserted-bg: fade(@green, 40%);\n --color-prettylights-syntax-markup-changed-text: @text;\n --color-prettylights-syntax-markup-changed-bg: fade(@yellow, 40%);\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:\n 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust;\n --shadow-floating-medium:\n 0px 0px 0px 1px @surface0, 0px 8px 16px -4px @crust, 0px 4px 32px -4px\n @crust, 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust;\n --shadow-floating-large:\n 0px 0px 0px 1px @surface0, 0px 24px 48px 0px #010409;\n --shadow-floating-xlarge:\n 0px 0px 0px 1px @surface0, 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 /* Customer Terms & Agreements Page: https://github.com/customer-terms */\n .enterprise-customer-agreement {\n color: @text !important;\n\n &:hover {\n .octicon,\n h3 {\n color: @accent !important;\n }\n }\n }\n\n /* Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */\n --data-blue-color-emphasis: @accent;\n --data-red-color-emphasis: @red;\n --data-green-color-emphasis: @green;\n\n /* Copilot Chat */\n --display-green-fgColor: @green;\n --display-teal-fgColor: @teal;\n --display-purple-fgColor: @mauve;\n --display-blue-fgColor: @blue;\n --display-pink-fgColor: @pink;\n --display-gray-fgColor: @subtext0;\n react-app[app-name=\"copilot-immersive-v1\"],\n copilot-dashboard-entrypoint {\n button {\n color: @text;\n }\n }\n\n /* docs.github.com */\n --color-fg-default: @text;\n --color-canvas-default: @base;\n --color-canvas-subtle: @mantle;\n\n --tooltip-fgColor: @base;\n --tooltip-bgColor: @overlay2;\n\n /* Refined GitHub */\n --rgh-heat-color: @peach;\n\n .turbo-progress-bar {\n background-color: @accent;\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 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,\n darken(@accent, 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;\n stroke: @accent;\n }\n\n .subnav-link.selected {\n border-bottom-color: @accent;\n }\n\n /* Pull request check in progress indicator */\n [stroke=\"#DBAB0A\" i] {\n stroke: fade(@yellow, 70%) !important;\n }\n [fill=\"#DBAB0A\" i] {\n fill: @yellow !important;\n }\n\n /* Issue timeline icon */\n [class*=\"prc-Timeline-TimelineBadge\"], .TimelineItem-Badge {\n /* Completed */\n path[d=\"M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm1.5 0a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm10.28-1.72-4.5 4.5a.75.75 0 0 1-1.06 0l-2-2a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l1.47 1.47 3.97-3.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z\"],\n /* Duplicate / Not planned */\n path[d=\"M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM3.965 13.096a6.5 6.5 0 0 0 9.131-9.131ZM1.5 8a6.474 6.474 0 0 0 1.404 4.035l9.131-9.131A6.499 6.499 0 0 0 1.5 8Z\"],\n /* Reopen */\n path[d=\"M5.029 2.217a6.5 6.5 0 0 1 9.437 5.11.75.75 0 1 0 1.492-.154 8 8 0 0 0-14.315-4.03L.427 1.927A.25.25 0 0 0 0 2.104V5.75A.25.25 0 0 0 .25 6h3.646a.25.25 0 0 0 .177-.427L2.715 4.215a6.491 6.491 0 0 1 2.314-1.998ZM1.262 8.169a.75.75 0 0 0-1.22.658 8.001 8.001 0 0 0 14.315 4.03l1.216 1.216a.25.25 0 0 0 .427-.177V10.25a.25.25 0 0 0-.25-.25h-3.646a.25.25 0 0 0-.177.427l1.358 1.358a6.501 6.501 0 0 1-11.751-3.11.75.75 0 0 0-.272-.506Z\"],\n path[d=\"M9.06 9.06a1.5 1.5 0 1 1-2.12-2.12 1.5 1.5 0 0 1 2.12 2.12Z\"] {\n fill: @base;\n }\n }\n }\n}\n\n@-moz-document url-prefix(\n \"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);\n }\n &[data-light-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n\n @media (prefers-color-scheme: dark) {\n &[data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n &[data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n }\n }\n [data-color-mode=\"light\"][data-light-theme=\"dark\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"dark\"] {\n #catppuccin(@darkFlavor);\n }\n [data-color-mode=\"light\"][data-light-theme=\"light\"],\n [data-color-mode=\"dark\"][data-dark-theme=\"light\"] {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n ::selection {\n background-color: fade(@accent, 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;\n --color-fg-muted: @subtext1;\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\n #diagram {\n .node rect,\n .node circle,\n .node ellipse,\n .node polygon,\n .node path {\n fill: fade(@accent, 10%);\n stroke: @accent;\n }\n\n .cluster rect {\n fill: @surface0;\n stroke: @surface2;\n }\n\n .label text,\n span,\n p {\n fill: @text;\n color: @text;\n }\n\n .flowchart-link {\n stroke: @subtext0;\n }\n .marker {\n stroke: @subtext0;\n fill: @subtext0;\n }\n\n .edgeLabel {\n background-color: @crust;\n p {\n background-color: @surface2;\n }\n }\n }\n\n .octicon {\n fill: var(--color-fg-muted) !important;\n }\n }\n}\n\n@-moz-document regexp(\n \"https:\\/\\/notebooks\\.githubusercontent\\.com\\/view\\/ipynb.*\"\n ) {\n :root {\n #catppuccin(@darkFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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: fade(@text, 87%);\n --jp-ui-font-color2: fade(@text, 54%);\n --jp-ui-font-color3: fade(@text, 28%);\n --jp-ui-inverse-font-color0: @crust;\n --jp-ui-inverse-font-color1: fade(@crust, 80%);\n --jp-ui-inverse-font-color2: fade(@crust, 50%);\n --jp-ui-inverse-font-color3: fade(@crust, 30%);\n --jp-content-font-color0: @text;\n --jp-content-font-color1: @text;\n --jp-content-font-color2: fade(@text, 70%);\n --jp-content-font-color3: fade(@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: fade(@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: fade(@overlay2, 14%);\n --jp-rendermime-error-background: fade(@red, 18%);\n --jp-rendermime-table-row-background: var(--color-scale-gray-9);\n --jp-rendermime-table-row-hover-background: fade(@surface2, 14%);\n --jp-dialog-background: fade(@crust, 60%);\n --jp-toolbar-box-shadow: 0px 0px 2px 0px fade(@crust, 80%);\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: fade(@blue, 30%);\n --jp-editor-selected-focused-background: fade(@blue, 14%);\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/* deno-fmt-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", "usercssData": { "name": "GitHub Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/github", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/github", - "version": "2025.01.05", + "version": "2025.02.04.1", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub", "description": "Soothing pastel theme for GitHub", @@ -1172,12 +1173,12 @@ "author": "Catppuccin", "description": "Soothing pastel theme for GitHub", "name": "GitHub Catppuccin", - "updateDate": 1736501257932, + "updateDate": 1742161330935, "_id": "942b2272-4772-41b7-b97c-848a6b3b1d85", - "_rev": 1736501771538, + "_rev": 1742161336197, "id": 5, - "originalDigest": "0753cdc4f2d2bc109870927f0580979c86ffbdae", - "etag": "W/\"01845e564c46a959aa83e248ee5685bcfddb5fc0ef07862674dff2c1c4a21858\"" + "originalDigest": "5b93e8c031efb02ea7c2ce3adf049fc85abe3a69", + "etag": "W/\"733f9b5f54a4027912117043f1695d0653e701b3cfb350000366278de41dec62\"" }, { "enabled": true, @@ -1351,7 +1352,7 @@ "name": "Proton Catppuccin", "updateDate": 1736501259261, "_id": "25aa2163-58b2-45e3-92f2-43e0627cd34c", - "_rev": 1736501771618, + "_rev": 1742161226667, "id": 6, "originalDigest": "ed3f8ea3e854fe9657eeb03d60fae14b75f4c6bd", "etag": "W/\"7ac11010046f18a66d95500b599b29a6ccb2ef2243fb8ab712731de6ff1d6d79\"" @@ -1528,7 +1529,7 @@ "name": "Stylus Catppuccin", "updateDate": 1736501260589, "_id": "6b26ec88-4cef-48be-bdbf-8a4dcb334a9e", - "_rev": 1736501771638, + "_rev": 1742161226679, "id": 7, "originalDigest": "a8e53383ef97ea6947741c9c2204318dad446a51", "etag": "W/\"513ed9ef5757b62f824db991b80057c52f8c3b8a314dae1944df523dc3f6b7ea\"" @@ -1543,12 +1544,12 @@ "code": "" } ], - "sourceCode": "/* ==UserStyle==\n@name YouTube Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/youtube\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube\n@version 2025.01.05\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.less\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);\n }\n :root:not([dark]) {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @text-filter: @catppuccin-filters[@@flavor][@text];\n\n @white: if(@flavor = latte, @base, @text);\n @black: if(@flavor = latte, @text, @base);\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n background: @base !important;\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 !important;\n --yt-brand-medium-red: @accent !important;\n --yt-brand-light-red: @accent !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: fade(@crust, 85%) !important;\n --yt-spec-black-pure-alpha-30: fade(@crust, 70%) !important;\n --yt-spec-black-pure-alpha-60: fade(@crust, 40%) !important;\n --yt-spec-black-pure-alpha-80: fade(@crust, 20%) !important;\n --yt-spec-black-1-alpha-98: fade(@crust, 2%) !important;\n --yt-spec-black-1-alpha-95: fade(@crust, 5%) !important;\n --yt-spec-white-1-alpha-10: fade(@text, 90%) !important;\n --yt-spec-white-1-alpha-20: fade(@text, 80%) !important;\n --yt-spec-white-1-alpha-25: fade(@text, 75%) !important;\n --yt-spec-white-1-alpha-30: fade(@text, 70%) !important;\n --yt-spec-white-1-alpha-70: fade(@text, 30%) !important;\n --yt-spec-white-1-alpha-95: fade(@text, 5%) !important;\n --yt-spec-white-1-alpha-98: fade(@text, 2%) !important;\n --yt-brand-medium-red-alpha-90: fade(@accent, 10%) !important;\n --yt-brand-medium-red-alpha-30: fade(@accent, 70%) !important;\n --yt-brand-light-red-alpha-30: fade(@accent, 70%) !important;\n --yt-spec-light-blue-alpha-30: fade(@sapphire, 70%) !important;\n --yt-spec-dark-blue-alpha-30: fade(@sapphire, 70%) !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: fade(@surface1, 90%) !important;\n --yt-spec-outline: @surface0 !important;\n --yt-spec-shadow: fade(@crust, 75%) !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 !important;\n --yt-spec-call-to-action-inverse: @accent !important;\n --yt-spec-suggested-action: fade(@accent, 20%) !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 !important;\n --yt-spec-brand-icon-active: @accent !important;\n --yt-spec-brand-button-background: @accent !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 !important;\n --yt-spec-themed-green: @green !important;\n --yt-spec-ad-indicator: @teal !important;\n --yt-spec-themed-overlay-background: fade(@crust, 20%) !important;\n --yt-spec-commerce-badge-background: @green !important;\n --yt-spec-static-brand-red: @accent !important;\n --yt-spec-static-brand-white: @text !important;\n --yt-spec-static-brand-black: @base !important;\n --yt-spec-static-clear-color: fade(@crust, 100%) !important;\n --yt-spec-static-clear-black: fade(@crust, 100%) !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: fade(\n @crust,\n 70%\n ) !important;\n --yt-spec-static-overlay-background-light: fade(\n @crust,\n 90%\n ) !important;\n --yt-spec-static-overlay-text-primary: @text !important;\n --yt-spec-static-overlay-text-secondary: fade(\n @subtext0,\n 30%\n ) !important;\n --yt-spec-static-overlay-text-disabled: fade(\n @subtext0,\n 70%\n ) !important;\n --yt-spec-static-overlay-call-to-action: @accent !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 !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 !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 @flavor = latte,\n @crust,\n @surface0\n ) !important;\n --yt-spec-verified-badge-background: @overlay0 !important;\n --yt-spec-call-to-action-fadeoutd: fade(@sapphire, 70%) !important;\n --yt-spec-call-to-action-hover: @accent !important;\n --yt-spec-brand-button-background-hover: @accent !important;\n --yt-spec-brand-link-text-fadeoutd: fade(\n @accent,\n 70%\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 !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: fade(@text, 70%);\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: fade(\n @crust,\n 100%\n ) !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 !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 !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: fade(@text, 46%) !important;\n --yt-live-chat-text-input-field-inactive-underline-color: @subtext0\n !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 !important;\n --yt-live-chat-mention-background-color: @accent !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: fade(@mantle, 50%);\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: fade(\n @mantle,\n 70%\n ) !important;\n --yt-grey: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color: @subtext0\n !important;\n --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1\n !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 !important;\n --yt-live-chat-slider-active-color: @accent !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: fade(\n @crust,\n 50%\n ) !important;\n --yt-live-chat-automod-button-explanation-color: fade(\n @accent,\n 30%\n ) !important;\n --yt-live-chat-shimmer-background-color: fade(@crust, 60%) !important;\n --yt-live-chat-shimmer-linear-gradient: linear-gradient(\n 0deg,\n fade(@text, 90%) 40%,\n fade(@base, 70%) 50%,\n fade(@text, 90%) 60%\n ) !important;\n --yt-live-chat-vem-background-color: @mantle !important;\n --yt-live-chat-product-picker-icon-color: fade(@text, 50%) !important;\n --yt-live-chat-product-picker-hover-color: @overlay0 !important;\n --yt-live-chat-product-picker-disabled-icon-color: fade(\n @text,\n 70%\n ) !important;\n --yt-live-chat-action-panel-background-color-transparent: (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 !important;\n --yt-endpoint-visited-color: @accent !important;\n --yt-endpoint-hover-color: @accent !important;\n\n --sb-dark-red-outline: @accent !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 !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 !important;\n --light-primary-color: @accent !important;\n --dark-primary-color: @blue !important;\n --accent-color: @accent !important;\n --light-accent-color: @accent !important;\n --dark-accent-color: @accent !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 !important;\n --yt-endpoint-visited-color: @accent !important;\n color: @accent !important;\n }\n\n .yt-page-navigation-progress {\n background: @accent !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\n !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(@flavor = latte) {\n background: fade(@surface0, 80%);\n }\n .ytp-load-progress when not(@flavor = 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 !important;\n --yt-button-payment-background-color: @accent !important;\n }\n\n yt-icon-button.yt-live-chat-item-list-renderer {\n background-color: @accent;\n color: @crust;\n\n &:hover {\n background-color: darken(@accent, 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;\n }\n\n /* Icons */\n\n [fill=\"red\"],\n [fill=\"#F00\"],\n [fill=\"#FF0000\"],\n [fill=\"#f03\"],\n [fill=\"#FF0033\"] {\n fill: @accent !important;\n }\n\n [fill=\"white\"] {\n fill: if(@flavor = 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 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 !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 !important;\n\n + [stroke] {\n stroke: @accent !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;\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;\n\n &:hover {\n background-color: darken(@accent, 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 color: @text;\n background-color: @surface0;\n &:hover {\n background-color: @surface1;\n }\n }\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;\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;\n border-color: @surface2;\n\n &:hover {\n background-color: fade(@accent, 30%);\n color: @accent;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @accent;\n\n &:hover {\n background-color: fade(@accent, 30%);\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent;\n\n &:hover {\n background-color: lighten(@accent, 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 ytd-searchbox[has-focus] #container.ytd-searchbox {\n border-color: @accent;\n }\n\n .ytSearchboxComponentInputBox,\n .ytSearchboxComponentInputBoxDark {\n background: var(--ytd-searchbox-background) !important;\n color: var(--ytd-searchbox-text-color) !important;\n border-color: var(--ytd-searchbox-border-color) !important;\n box-shadow: none;\n }\n\n .ytSearchboxComponentInputBoxHasFocus,\n .ytSearchboxComponentInputBoxHasFocusDark {\n border-color: @accent !important;\n }\n\n .ytSuggestionComponentSuggestionHover:hover,\n .ytSuggestionComponentSuggestionHoverDark:hover {\n background: @surface1 !important;\n }\n\n .ytSearchboxComponentSuggestionsContainer,\n .ytSearchboxComponentSuggestionsContainerDark {\n background: var(--yt-spec-raised-background) !important;\n border-color: var(--yt-spec-raised-background) !important;\n }\n\n .ytSuggestionComponentSuggestion,\n .ytSuggestionComponentSuggestionDark {\n color: var(--ytd-searchbox-text-color) !important;\n }\n\n .ytSearchboxComponentSearchButton,\n .ytSearchboxComponentSearchButtonDark {\n color: var(--ytd-searchbox-text-color) !important;\n background: @surface0 !important;\n border-color: var(--ytd-searchbox-border-color) !important;\n }\n\n .ytSearchboxComponentClearButtonIcon,\n .ytSearchboxComponentClearButtonIconDark {\n color: var(--ytd-searchbox-text-color) !important;\n }\n\n .ytSearchboxComponentReportButton,\n .ytSearchboxComponentReportButtonDark,\n .ytSuggestionComponentRemoveLink,\n .ytSuggestionComponentRemoveLinkDark {\n color: @subtext0 !important;\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;\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 .ytwHowThisWasMadeSectionViewModelSectionTitle,\n .ytwHowThisWasMadeSectionViewModelBodyHeader {\n color: @text;\n }\n\n .ytwHowThisWasMadeSectionViewModelBodyText {\n color: @subtext0;\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;\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;\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;\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;\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 !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;\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;\n }\n .yt-spec-avatar-shape__live-badge {\n background-color: @accent;\n }\n\n .ytp-button,\n .ytp-subtitles-button {\n &[aria-pressed]::after {\n background-color: @accent;\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, 10%) !important;\n box-shadow: fade(@accent, 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 !important;\n }\n\n .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--filled {\n background-color: @accent;\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: @subtext0;\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 !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 /* Live chat replay */\n .ytVideoMetadataCarouselViewModelHost,\n .YtVideoMetadataCarouselViewModelHost {\n background-color: @surface0;\n\n .ytCarouselTitleViewModelTitle,\n .YtCarouselTitleViewModelTitle,\n .yt-core-attributed-string,\n .yt-icon-shape {\n color: @text;\n }\n }\n\n /* AI-generated video summary */\n .video-summary-content-view-model-wiz__paragraph {\n color: @text;\n }\n\n /* Playlist collapsed sidebar */\n #next-video-title {\n color: @text !important;\n }\n #publisher-container {\n .yt-simple-endpoint.style-scope.yt-formatted-string,\n .index-message-wrapper.style-scope.ytd-playlist-panel-renderer,\n .index-message-wrapper.style-scope.ytd-playlist-panel-renderer::before {\n color: @subtext0 !important;\n }\n }\n\n /* Playlist metadata */\n .metadata-stats.style-scope.ytd-playlist-byline-renderer,\n .yt-lockup-metadata-view-model-wiz__metadata {\n color: @subtext0 !important;\n }\n\n /* Playlist titles in search results */\n .yt-core-attributed-string.yt-core-attributed-string--white-space-pre-wrap {\n color: @text !important;\n }\n }\n}\n\n@-moz-document url-prefix(\"https://studio.youtube.com\") {\n :root[dark] {\n #catppuccin(@darkFlavor);\n }\n :root {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n [src=\"https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg\"] {\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 !important;\n --ytcp-call-to-action-inverse: @mantle !important;\n --ytcp-call-to-action-raised-background: @accent !important;\n --yt-spec-brand-button-background: @accent !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\n !important;\n\n --yt-spec-brand-background-primary: @surface0 !important;\n\n --yt-compact-link-icon-color: @overlay2 !important;\n --ytcp-icon-active: @accent !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 !important;\n --ytcp-themed-blue: @accent !important;\n --ytcp-badge-blue: fade(@accent, 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 !important;\n --ytcp-focus: @accent !important;\n --ytcp-selected-item: @accent !important;\n --ytcp-hover-item: @overlay2 !important;\n --ytcp-chip-active-focus: @accent !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);\n }\n html {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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;\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;\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/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", + "sourceCode": "/* ==UserStyle==\n@name YouTube Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/youtube\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube\n@version 2025.01.28\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.less\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);\n }\n :root:not([dark]) {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @text-filter: @catppuccin-filters[@@flavor][@text];\n\n @white: if(@flavor = latte, @base, @text);\n @black: if(@flavor = latte, @text, @base);\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 30%);\n }\n\n input,\n textarea {\n &::placeholder {\n color: @subtext0 !important;\n }\n }\n\n color: @text;\n background: @base !important;\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 !important;\n --yt-brand-medium-red: @accent !important;\n --yt-brand-light-red: @accent !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: fade(@crust, 85%) !important;\n --yt-spec-black-pure-alpha-30: fade(@crust, 70%) !important;\n --yt-spec-black-pure-alpha-60: fade(@crust, 40%) !important;\n --yt-spec-black-pure-alpha-80: fade(@crust, 20%) !important;\n --yt-spec-black-1-alpha-98: fade(@crust, 2%) !important;\n --yt-spec-black-1-alpha-95: fade(@crust, 5%) !important;\n --yt-spec-white-1-alpha-10: fade(@text, 90%) !important;\n --yt-spec-white-1-alpha-20: fade(@text, 80%) !important;\n --yt-spec-white-1-alpha-25: fade(@text, 75%) !important;\n --yt-spec-white-1-alpha-30: fade(@text, 70%) !important;\n --yt-spec-white-1-alpha-70: fade(@text, 30%) !important;\n --yt-spec-white-1-alpha-95: fade(@text, 5%) !important;\n --yt-spec-white-1-alpha-98: fade(@text, 2%) !important;\n --yt-brand-medium-red-alpha-90: fade(@accent, 10%) !important;\n --yt-brand-medium-red-alpha-30: fade(@accent, 70%) !important;\n --yt-brand-light-red-alpha-30: fade(@accent, 70%) !important;\n --yt-spec-light-blue-alpha-30: fade(@sapphire, 70%) !important;\n --yt-spec-dark-blue-alpha-30: fade(@sapphire, 70%) !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: fade(@surface1, 90%) !important;\n --yt-spec-outline: @surface0 !important;\n --yt-spec-shadow: fade(@crust, 75%) !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 !important;\n --yt-spec-call-to-action-inverse: @accent !important;\n --yt-spec-suggested-action: fade(@accent, 20%) !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 !important;\n --yt-spec-brand-icon-active: @accent !important;\n --yt-spec-brand-button-background: @accent !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 !important;\n --yt-spec-themed-green: @green !important;\n --yt-spec-ad-indicator: @teal !important;\n --yt-spec-themed-overlay-background: fade(@crust, 20%) !important;\n --yt-spec-commerce-badge-background: @green !important;\n --yt-spec-static-brand-red: @accent !important;\n --yt-spec-static-brand-white: @text !important;\n --yt-spec-static-brand-black: @base !important;\n --yt-spec-static-clear-color: fade(@crust, 100%) !important;\n --yt-spec-static-clear-black: fade(@crust, 100%) !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: fade(\n @crust,\n 70%\n ) !important;\n --yt-spec-static-overlay-background-light: fade(\n @crust,\n 90%\n ) !important;\n --yt-spec-static-overlay-text-primary: @text !important;\n --yt-spec-static-overlay-text-secondary: fade(\n @subtext0,\n 30%\n ) !important;\n --yt-spec-static-overlay-text-disabled: fade(\n @subtext0,\n 70%\n ) !important;\n --yt-spec-static-overlay-call-to-action: @accent !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 !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 !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 @flavor = latte,\n @crust,\n @surface0\n ) !important;\n --yt-spec-verified-badge-background: @overlay0 !important;\n --yt-spec-call-to-action-fadeoutd: fade(@sapphire, 70%) !important;\n --yt-spec-call-to-action-hover: @accent !important;\n --yt-spec-brand-button-background-hover: @accent !important;\n --yt-spec-brand-link-text-fadeoutd: fade(\n @accent,\n 70%\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 !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: fade(@text, 70%);\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: fade(\n @crust,\n 100%\n ) !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 !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 !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: fade(@text, 46%) !important;\n --yt-live-chat-text-input-field-inactive-underline-color: @subtext0\n !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 !important;\n --yt-live-chat-mention-background-color: @accent !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: fade(@mantle, 50%);\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: fade(\n @mantle,\n 70%\n ) !important;\n --yt-grey: @subtext0 !important;\n --yt-live-chat-text-input-field-suggestion-background-color: @subtext0\n !important;\n --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1\n !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 !important;\n --yt-live-chat-slider-active-color: @accent !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: fade(\n @crust,\n 50%\n ) !important;\n --yt-live-chat-automod-button-explanation-color: fade(\n @accent,\n 30%\n ) !important;\n --yt-live-chat-shimmer-background-color: fade(@crust, 60%) !important;\n --yt-live-chat-shimmer-linear-gradient: linear-gradient(\n 0deg,\n fade(@text, 90%) 40%,\n fade(@base, 70%) 50%,\n fade(@text, 90%) 60%\n ) !important;\n --yt-live-chat-vem-background-color: @mantle !important;\n --yt-live-chat-product-picker-icon-color: fade(@text, 50%) !important;\n --yt-live-chat-product-picker-hover-color: @overlay0 !important;\n --yt-live-chat-product-picker-disabled-icon-color: fade(\n @text,\n 70%\n ) !important;\n --yt-live-chat-action-panel-background-color-transparent: (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 !important;\n --yt-endpoint-visited-color: @accent !important;\n --yt-endpoint-hover-color: @accent !important;\n\n --sb-dark-red-outline: @accent !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 !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 !important;\n --light-primary-color: @accent !important;\n --dark-primary-color: @blue !important;\n --accent-color: @accent !important;\n --light-accent-color: @accent !important;\n --dark-accent-color: @accent !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 !important;\n --yt-endpoint-visited-color: @accent !important;\n color: @accent !important;\n }\n\n .yt-page-navigation-progress {\n background: @accent !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\n !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(@flavor = latte) {\n background: fade(@surface0, 80%);\n }\n .ytp-load-progress when not(@flavor = 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 !important;\n --yt-button-payment-background-color: @accent !important;\n }\n\n yt-icon-button.yt-live-chat-item-list-renderer {\n background-color: @accent;\n color: @crust;\n\n &:hover {\n background-color: darken(@accent, 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;\n }\n\n /* Icons */\n\n [fill=\"red\"],\n [fill=\"#F00\"],\n [fill=\"#FF0000\"],\n [fill=\"#f03\"],\n [fill=\"#FF0033\"] {\n fill: @accent !important;\n }\n\n [fill=\"white\"] {\n fill: if(@flavor = 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 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 !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 !important;\n\n + [stroke] {\n stroke: @accent !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;\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;\n\n &:hover {\n background-color: darken(@accent, 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 color: @text;\n background-color: @surface0;\n &:hover {\n background-color: @surface1;\n }\n }\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;\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;\n border-color: @surface2;\n\n &:hover {\n background-color: fade(@accent, 30%);\n color: @accent;\n }\n }\n\n &.yt-spec-button-shape-next--text {\n color: @accent;\n\n &:hover {\n background-color: fade(@accent, 30%);\n }\n }\n\n &.yt-spec-button-shape-next--filled {\n color: @crust;\n background-color: @accent;\n\n &:hover {\n background-color: lighten(@accent, 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 ytd-searchbox[has-focus] #container.ytd-searchbox {\n border-color: @accent;\n }\n\n .ytSearchboxComponentInputBox,\n .ytSearchboxComponentInputBoxDark {\n background: var(--ytd-searchbox-background) !important;\n color: var(--ytd-searchbox-text-color) !important;\n border-color: var(--ytd-searchbox-border-color) !important;\n box-shadow: none;\n }\n\n .ytSearchboxComponentInputBoxHasFocus,\n .ytSearchboxComponentInputBoxHasFocusDark {\n border-color: @accent !important;\n }\n\n .ytSuggestionComponentSuggestionHover:hover,\n .ytSuggestionComponentSuggestionHoverDark:hover {\n background: @surface1 !important;\n }\n\n .ytSearchboxComponentSuggestionsContainer,\n .ytSearchboxComponentSuggestionsContainerDark {\n background: var(--yt-spec-raised-background) !important;\n border-color: var(--yt-spec-raised-background) !important;\n }\n\n .ytSuggestionComponentSuggestion,\n .ytSuggestionComponentSuggestionDark {\n color: var(--ytd-searchbox-text-color) !important;\n }\n\n .ytSearchboxComponentSearchButton,\n .ytSearchboxComponentSearchButtonDark {\n color: var(--ytd-searchbox-text-color) !important;\n background: @surface0 !important;\n border-color: var(--ytd-searchbox-border-color) !important;\n }\n\n .ytSearchboxComponentClearButtonIcon,\n .ytSearchboxComponentClearButtonIconDark {\n color: var(--ytd-searchbox-text-color) !important;\n }\n\n .ytSearchboxComponentReportButton,\n .ytSearchboxComponentReportButtonDark,\n .ytSuggestionComponentRemoveLink,\n .ytSuggestionComponentRemoveLinkDark {\n color: @subtext0 !important;\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;\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 .ytwHowThisWasMadeSectionViewModelSectionTitle,\n .ytwHowThisWasMadeSectionViewModelBodyHeader {\n color: @text;\n }\n\n .ytwHowThisWasMadeSectionViewModelBodyText {\n color: @subtext0;\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;\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;\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;\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[aria-checked=\"true\"] .ytp-menuitem-toggle-checkbox {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n background-color: @accent;\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 !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;\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;\n }\n .yt-spec-avatar-shape__live-badge {\n background-color: @accent;\n }\n\n .ytp-button,\n .ytp-subtitles-button {\n &[aria-pressed]::after {\n background-color: @accent;\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, 10%) !important;\n box-shadow: fade(@accent, 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 !important;\n }\n\n .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--filled {\n background-color: @accent;\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: @subtext0;\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 !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 /* Live chat replay */\n .ytVideoMetadataCarouselViewModelHost,\n .YtVideoMetadataCarouselViewModelHost {\n background-color: @surface0;\n\n .ytCarouselTitleViewModelTitle,\n .YtCarouselTitleViewModelTitle,\n .yt-core-attributed-string,\n .yt-icon-shape {\n color: @text;\n }\n }\n\n /* AI-generated video summary */\n .video-summary-content-view-model-wiz__paragraph {\n color: @text;\n }\n\n /* Playlist collapsed sidebar */\n #next-video-title {\n color: @text !important;\n }\n #publisher-container {\n .yt-simple-endpoint.style-scope.yt-formatted-string,\n .index-message-wrapper.style-scope.ytd-playlist-panel-renderer,\n .index-message-wrapper.style-scope.ytd-playlist-panel-renderer::before {\n color: @subtext0 !important;\n }\n }\n\n /* Playlist metadata */\n .metadata-stats.style-scope.ytd-playlist-byline-renderer,\n .yt-lockup-metadata-view-model-wiz__metadata {\n color: @subtext0 !important;\n }\n\n /* Playlist titles in search results */\n .yt-core-attributed-string.yt-core-attributed-string--white-space-pre-wrap {\n color: @text !important;\n }\n }\n}\n\n@-moz-document url-prefix(\"https://studio.youtube.com\") {\n :root[dark] {\n #catppuccin(@darkFlavor);\n }\n :root {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n [src=\"https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg\"] {\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 !important;\n --ytcp-call-to-action-inverse: @mantle !important;\n --ytcp-call-to-action-raised-background: @accent !important;\n --yt-spec-brand-button-background: @accent !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\n !important;\n\n --yt-spec-brand-background-primary: @surface0 !important;\n\n --yt-compact-link-icon-color: @overlay2 !important;\n --ytcp-icon-active: @accent !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 !important;\n --ytcp-themed-blue: @accent !important;\n --ytcp-badge-blue: fade(@accent, 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 !important;\n --ytcp-focus: @accent !important;\n --ytcp-selected-item: @accent !important;\n --ytcp-hover-item: @overlay2 !important;\n --ytcp-chip-active-focus: @accent !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);\n }\n html {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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;\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;\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/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", "usercssData": { "name": "YouTube Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/youtube", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/youtube", - "version": "2025.01.05", + "version": "2025.01.28", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube", "description": "Soothing pastel theme for YouTube", @@ -1719,12 +1720,12 @@ "author": "Catppuccin", "description": "Soothing pastel theme for YouTube", "name": "YouTube Catppuccin", - "updateDate": 1736501261923, + "updateDate": 1742161268069, "_id": "394d935b-9e6c-4e0e-8adf-6ee7777aed72", - "_rev": 1736501771660, + "_rev": 1742161293224, "id": 8, - "originalDigest": "2ce36682f8c9a72e739fd7d294fb7a38012c6471", - "etag": "W/\"361c4b8104ab99ccf2ec126b73eeb0a197c949eed465b0424acddaf009b4a1db\"" + "originalDigest": "fa46e9016f518e9fcf9147c4e40bd14a47d75fa3", + "etag": "W/\"f4f5f4d192318f280a7cec5270e98ca0cff2f3f7720816a4568f9caa67484f8a\"" }, { "enabled": false, @@ -1751,7 +1752,7 @@ "name": "Dark NixOS", "originalDigest": "320c15d7c6497b600a750f87d10774e7f42304ff", "_id": "1129d226-3ef7-41d3-938e-9757e3408b54", - "_rev": 1736501771717, + "_rev": 1742161226719, "installationUrl": "https://uso.kkx.one/style/163453", "id": 9, "etag": "W/\"c17-+Vy7znL1V6VKjdpQQv+y1Esk5BQ\"" @@ -1929,7 +1930,7 @@ "preferScheme": "none", "originalDigest": "058c1d7ab59bd67b167ea11b387bca67209e6533", "_id": "56054689-3988-4fbd-b9eb-15d3cbd763ae", - "_rev": 1736501771717, + "_rev": 1742161226721, "id": 10, "etag": "W/\"552fed86e3856b8695fc46b0cbae531e8675bc41d1c1263a81f4419a9dee1671\"", "updateDate": 1736501263250 @@ -2106,7 +2107,7 @@ "name": "DuckDuckGo Catppuccin", "originalDigest": "c10b0003593080fd54ec9f6f342daa2acb808416", "_id": "0dc8d202-eec3-4899-967c-76c944413214", - "_rev": 1736501771723, + "_rev": 1742161226724, "id": 11, "etag": "W/\"5498e38db36015bf7da29aa0cbac932a76962f9adc3d24f340603e7626acf5d0\"", "updateDate": 1736501264521 @@ -2119,12 +2120,12 @@ "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 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.less\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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n iframe {\n color-scheme: none !important;\n }\n\n ::selection {\n background-color: fade(@accent, 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 !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 !important;\n }\n .EL3pcf {\n color: @accent !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 !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;\n }\n\n /* some play buttons on games */\n .fxvhbc,\n .pGGGle {\n background-color: @accent;\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 !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;\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, 30%) 50%,\n #0000 50%\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(to bottom, transparent, @base);\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 !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);\n }\n }\n @media (prefers-color-scheme: dark) {\n body {\n #catppuccin(@darkFlavor);\n }\n }\n}\n\n@-moz-document regexp(\"^https?://(ogs\\\\.)?google\\\\..*\") {\n body {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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#rgbify(@color) {\n @rgb: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", + "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 2025.02.12\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.less\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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n iframe {\n color-scheme: none !important;\n }\n\n ::selection {\n background-color: fade(@accent, 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 !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 !important;\n }\n .EL3pcf {\n color: @accent !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 !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;\n }\n\n /* some play buttons on games */\n .fxvhbc,\n .pGGGle {\n background-color: @accent;\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 !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;\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, 30%) 50%,\n #0000 50%\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(to bottom, transparent, @base);\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 !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 // knowledge panel\n .Qc895c,\n .Utq4Cb.PZPZlf,\n .SU02Qd g-inner-card {\n background-color: @surface0 !important;\n }\n .Qc895c div,\n .Utq4Cb.PZPZlf div,\n .CYJS5e {\n color: @text !important;\n }\n .CYJS5e.W0urI,\n .REySof.T9jMmf,\n .b0Xfjd.Hyaw8c,\n .dvfTSb.OdANFd {\n background-color: @surface0 !important;\n color: @text !important;\n }\n .CYJS5e.W0urI:hover {\n background-color: @surface1 !important;\n }\n .gEYEQc.x5W9xd.qYvl9c.klitem,\n .MJfuMd {\n background-color: @base !important;\n border-color: @surface1 !important;\n }\n .NQyKp.Hyaw8c.h4wEae.Maj6Tc {\n border-color: @text !important;\n }\n color: @subtext0;\n }\n @media (prefers-color-scheme: light) {\n body {\n #catppuccin(@lightFlavor);\n }\n }\n @media (prefers-color-scheme: dark) {\n body {\n #catppuccin(@darkFlavor);\n }\n }\n}\n\n@-moz-document regexp(\"^https?://(ogs\\\\.)?google\\\\..*\") {\n body {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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#rgbify(@color) {\n @rgb: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", "usercssData": { "name": "Google Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/google", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/google", - "version": "2024.12.31", + "version": "2025.02.12", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle", "description": "Soothing pastel theme for Google", @@ -2281,12 +2282,12 @@ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/google", "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.less", "name": "Google Catppuccin", - "originalDigest": "a4249e7dccb8ac3c427892936c0fee1e217a40ae", + "originalDigest": "4b43bb43398ea73946a2a9a0ec3e4025643aa4bf", "_id": "a8d95ec4-f0d8-4874-b30c-e27b447e70b4", - "_rev": 1736501771787, + "_rev": 1742161296509, "id": 12, - "etag": "W/\"736e96e91a8d2408d316099ef0e19c74440d8643c90fa3b87299b6447f4771a8\"", - "updateDate": 1736501265774 + "etag": "W/\"207a28f3afabfa4d2e4c4ed49eccdede59d87340275b083b4aaf5f40799d5920\"", + "updateDate": 1742161269412 }, { "enabled": true, @@ -2460,7 +2461,7 @@ "name": "Arch Wiki Catppuccin", "originalDigest": "258005f99fc7349fa3d1781160cac99f0379f7f2", "_id": "dfaa88d1-79ca-418c-8b2c-3cd5994a7de9", - "_rev": 1736501771901, + "_rev": 1742161226822, "id": 13, "etag": "W/\"efaea70ffcda14292b46600cd3eeb6fb8530f0655bb26ff1d65c2bb35000cde2\"", "updateDate": 1736501267040 @@ -2637,7 +2638,7 @@ "name": "NixOS Wiki Catppuccin", "originalDigest": "3958193b639b17fdd211a6b8a7ebdf25bb722fc5", "_id": "d8442149-3453-43fb-9a0b-7db47465b4d9", - "_rev": 1736501771923, + "_rev": 1742161226834, "id": 14, "etag": "W/\"458bc5b50a033436703f3cf816ce193e0da8d73159b390818432f200afb9d12a\"", "updateDate": 1720362457038 @@ -2814,7 +2815,7 @@ "name": "Google Drive Catppuccin", "originalDigest": "c9df54a3c479076fffabbf43340062fca641ccc6", "_id": "8cd5d5b6-853b-45bd-8fd9-052f0eb9851e", - "_rev": 1736501771990, + "_rev": 1742161226843, "id": 16, "etag": "W/\"57e18b9d6f318f071322cb97329959ca441dec7cf5b67995208a09ff72ff2b3e\"", "updateDate": 1736501269640 @@ -2827,12 +2828,12 @@ "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 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.less\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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @crust-filter: @catppuccin-filters[@@flavor][@crust];\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @yellow-filter: @catppuccin-filters[@@flavor][@yellow];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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 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;\n color: @crust;\n }\n\n /* Transparent primary */\n .l0,\n div.b8 .a8k,\n .bAo > .ad {\n color: @accent;\n\n &::before {\n background-color: @accent;\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;\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;\n color: @crust;\n fill: @crust;\n\n .HV {\n filter: @crust-filter;\n }\n\n &:hover .H1 {\n background-color: darken(@accent, 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;\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, 70%);\n }\n }\n\n /* Selected day */\n .J-JB-KA-KO {\n color: @crust;\n\n &::before {\n background-color: @accent;\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;\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;\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;\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;\n\n &::before {\n background-color: @accent;\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;\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;\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;\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;\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;\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;\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;\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;\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/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", + "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 2025.01.15\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.less\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 :root {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @crust-filter: @catppuccin-filters[@@flavor][@crust];\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @yellow-filter: @catppuccin-filters[@@flavor][@yellow];\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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 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;\n color: @crust;\n }\n\n /* Transparent primary */\n .l0,\n div.b8 .a8k,\n .bAo > .ad {\n color: @accent;\n\n &::before {\n background-color: @accent;\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_Kc 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_Kc .gb_hd {\n background-color: @surface1;\n\n .gb_je,\n .gb_qe,\n .gsan_a,\n .gsas_a,\n svg {\n color: @text;\n }\n }\n /* Search mail input on focus */\n .gb_hd.gb_id {\n background-color: @base;\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;\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;\n color: @crust;\n fill: @crust;\n\n .HV {\n filter: @crust-filter;\n }\n\n &:hover .H1 {\n background-color: darken(@accent, 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;\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, 70%);\n }\n }\n\n /* Selected day */\n .J-JB-KA-KO {\n color: @crust;\n\n &::before {\n background-color: @accent;\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;\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;\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;\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;\n\n &::before {\n background-color: @accent;\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;\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;\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;\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;\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;\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;\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;\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;\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/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", "usercssData": { "name": "Gmail Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/gmail", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/gmail", - "version": "2024.12.31", + "version": "2025.01.15", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agmail", "description": "Soothing pastel theme for Gmail", @@ -2989,12 +2990,12 @@ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/gmail", "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.less", "name": "Gmail Catppuccin", - "originalDigest": "0a0bb1c7ee8faf92b58b49ba30423b6a6a63e356", + "originalDigest": "2ecb32ebc3b93e854e8cb16ae817887f955b674b", "_id": "bc95164e-c1ea-4a5e-b5cb-4e83061e74c4", - "_rev": 1736501772016, + "_rev": 1742161421208, "id": 17, - "etag": "W/\"26c008f4c8fb9071014eb8025d189a045cf57d5576d71860252cd928485fb2f2\"", - "updateDate": 1736501270935 + "etag": "W/\"950ea1f5e0e81cb580c0f21eb2802c94cb360d3ae8d908a614983f8d31b98438\"", + "updateDate": 1742161332268 }, { "enabled": true, @@ -3004,12 +3005,12 @@ "code": "" } ], - "sourceCode": "/* ==UserStyle==\n@name Instagram Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/instagram\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/instagram\n@version 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.less\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);\n }\n ._aa4c {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @dark-color: if(@flavor = latte, @text, @crust);\n @light-color: if(@flavor = latte, @crust, @text);\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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: fade(@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: fade(@surface0, 20%);\n --ig-text-on-color: #rgbify(@crust)[];\n --ig-badge: #rgbify(@accent)[];\n --ig-primary-button: #rgbify(@accent)[];\n --ig-primary-button-hover: fade(@accent, 80%);\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)[];\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)[];\n --always-dark-overlay: @accent;\n --secondary-text: @subtext0;\n --primary-text: @text;\n --primary-icon: @accent;\n --primary-button-text: @mantle !important;\n --primary-button: @blue !important;\n scrollbar-color: @accent @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 !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;\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 fade(@dark-color, 80%);\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;\n }\n svg[aria-label=\"Close\"] {\n color: @text;\n }\n svg[aria-label=\"Verified\"] {\n fill: @accent;\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 background-color: @surface1 !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 !important;\n }\n }\n .xk5f4mz {\n background-color: @mantle;\n &:hover {\n background-color: @accent;\n }\n }\n .x3nfvp2 {\n color: @text !important;\n &:hover {\n color: @crust;\n }\n }\n\n /* reel icon */\n .xq3z1fi {\n color: @accent !important;\n }\n\n /* Toggle sliders */\n .x1r7x56h {\n background-color: @accent;\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 !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 @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 /* 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 !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 fade(@dark-color, 30%);\n }\n\n /* Dialog overlay */\n .x7r02ix[role=\"dialog\"] {\n box-shadow: 0 5px 10px 0 fade(@dark-color, 50%);\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 !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 fade(@dark-color, 60%);\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;\n border-radius: 10px;\n }\n }\n}\n\n@-moz-document regexp(\"^.*instagram.com/direct.*\") {\n ._aa4d {\n #catppuccin(@darkFlavor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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, 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: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", + "sourceCode": "/* ==UserStyle==\n@name Instagram Catppuccin\n@namespace github.com/catppuccin/userstyles/styles/instagram\n@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/instagram\n@version 2025.02.11\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.less\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);\n }\n ._aa4c {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\n\n @text-filter: @catppuccin-filters[@@flavor][@text];\n @dark-color: if(@flavor = latte, @text, @crust);\n @light-color: if(@flavor = latte, @crust, @text);\n\n color-scheme: if(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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: fade(@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: fade(@surface0, 20%);\n --ig-text-on-color: #rgbify(@crust)[];\n --ig-badge: #rgbify(@accent)[];\n --ig-primary-button: #rgbify(@accent)[];\n --ig-primary-button-hover: fade(@accent, 80%);\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)[];\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)[];\n --always-dark-overlay: @accent;\n --secondary-text: @subtext0;\n --primary-text: @text;\n --primary-icon: @accent;\n --primary-button-text: @mantle !important;\n --primary-button: @blue !important;\n --mwp-primary-theme-color: darken(@blue, 10%);\n --chat-composer-button-color: darken(@blue, 10%);\n scrollbar-color: @accent @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 !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;\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 fade(@dark-color, 80%);\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 svg[aria-label=\"Verified\"] {\n fill: @accent !important;\n }\n svg[aria-label=\"Next\"],\n svg[aria-label=\"Go back\"],\n svg[aria-label=\"Close\"] {\n fill: @text !important;\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:not(\n [style*=\"background-color: rgb(var(--ig-highlight-background))\"]\n ) {\n background-color: var(--surface1) !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 !important;\n }\n }\n .xk5f4mz {\n background-color: @mantle;\n &:hover {\n background-color: @accent;\n }\n }\n .x3nfvp2 {\n color: @text !important;\n &:hover {\n color: @crust;\n }\n }\n\n /* reel icon */\n .xq3z1fi {\n color: @accent !important;\n }\n\n /* Toggle sliders */\n .x1r7x56h {\n background-color: @accent;\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 !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 @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 /* 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 !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 fade(@dark-color, 30%);\n }\n\n /* Dialog overlay */\n .x7r02ix[role=\"dialog\"] {\n box-shadow: 0 5px 10px 0 fade(@dark-color, 50%);\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 !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 fade(@dark-color, 60%);\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;\n border-radius: 10px;\n }\n }\n}\n\n@-moz-document regexp(\"^.*instagram.com/direct.*\") {\n ._aa4d {\n #catppuccin(@darkFlavor);\n }\n ._aa4c {\n #catppuccin(@lightFlavor);\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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, 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 /* voice clip */\n div.x7ywyr2 {\n &[style*=\"background-color: rgb(var(--ig-highlight-background))\"] {\n div[aria-label=\"Play\"],\n div[aria-label=\"Pause\"],\n div[role=\"timer\"],\n div[role=\"slider\"] {\n background-color: @text !important;\n }\n div[style*=\"clip-path\"] div.x5yr21d.xh8yej3.x1bhxuv2 {\n background-color: @subtext0 !important;\n }\n div[aria-label=\"Play\"]:hover {\n background-color: @subtext1 !important;\n }\n }\n &[style*=\"background-color: var(--mwp-primary-theme-color)\"] {\n background-color: var(--mwp-primary-theme-color) !important;\n div[aria-label=\"Play\"],\n div[aria-label=\"Pause\"],\n div[role=\"slider\"],\n div[role=\"timer\"] {\n background-color: @text !important;\n }\n div[aria-label=\"Play\"]:hover {\n background-color: @subtext1 !important;\n }\n }\n }\n /* voice clip recording container */\n div[style*=\"background-color: var(--chat-composer-button-color)\"] {\n div[role=\"slider\"] {\n opacity: 1 !important;\n background-color: darken(@blue, 4%) !important;\n }\n div[aria-label=\"Play\"],\n div[aria-label=\"Pause\"],\n div[role=\"timer\"],\n div[aria-label=\"Stop recording\"] {\n background-color: @text !important;\n }\n }\n\n /* explicit music icon in notes */\n .x1cp0k07 {\n color: @text;\n }\n }\n}\n\n#rgbify(@color) {\n @rgb: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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/* deno-fmt-ignore */\n@catppuccin-filters: {\n @latte: { @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) hue-rotate(266deg) brightness(93%) contrast(97%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) hue-rotate(255deg) brightness(94%) contrast(100%); @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) hue-rotate(342deg) brightness(84%) contrast(94%); @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) hue-rotate(331deg) brightness(99%) contrast(82%); @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) hue-rotate(356deg) brightness(103%) contrast(99%); @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) hue-rotate(354deg) brightness(95%) contrast(83%); @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) hue-rotate(76deg) brightness(95%) contrast(66%); @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) hue-rotate(139deg) brightness(100%) contrast(82%); @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) hue-rotate(166deg) brightness(99%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%) contrast(105%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) hue-rotate(195deg) brightness(83%) contrast(91%); @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) hue-rotate(191deg) brightness(77%) contrast(81%); @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) hue-rotate(189deg) brightness(82%) contrast(88%); @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) hue-rotate(187deg) brightness(92%) contrast(88%); @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) hue-rotate(182deg) brightness(109%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) hue-rotate(182deg) brightness(98%) contrast(92%); @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) hue-rotate(196deg) brightness(106%) contrast(82%); };\n @frappe: { @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) hue-rotate(280deg) brightness(107%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) hue-rotate(225deg) brightness(94%) contrast(91%); @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) hue-rotate(305deg) brightness(91%) contrast(99%); @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) hue-rotate(307deg) brightness(109%) contrast(90%); @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) hue-rotate(335deg) brightness(96%) contrast(94%); @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) hue-rotate(309deg) brightness(105%) contrast(80%); @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) hue-rotate(42deg) brightness(87%) contrast(89%); @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) hue-rotate(110deg) brightness(85%) contrast(81%); @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) hue-rotate(141deg) brightness(109%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%) contrast(95%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) hue-rotate(191deg) brightness(98%) contrast(96%); @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) hue-rotate(192deg) brightness(96%) contrast(97%); @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) hue-rotate(198deg) brightness(88%) contrast(75%); @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) hue-rotate(197deg) brightness(86%) contrast(79%); };\n @macchiato: { @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) hue-rotate(280deg) brightness(102%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) hue-rotate(222deg) brightness(104%) contrast(93%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) hue-rotate(305deg) brightness(110%) contrast(86%); @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) hue-rotate(306deg) brightness(93%) contrast(101%); @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) hue-rotate(330deg) brightness(103%) contrast(92%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) hue-rotate(314deg) brightness(101%) contrast(87%); @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) hue-rotate(48deg) brightness(92%) contrast(85%); @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) hue-rotate(110deg) brightness(87%) contrast(90%); @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) hue-rotate(142deg) brightness(96%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) hue-rotate(191deg) brightness(92%) contrast(88%); @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) hue-rotate(194deg) brightness(90%) contrast(90%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) hue-rotate(200deg) brightness(93%) contrast(85%); @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) hue-rotate(202deg) brightness(98%) contrast(88%); };\n @mocha: { @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) hue-rotate(315deg) brightness(107%) contrast(90%); @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) hue-rotate(283deg) brightness(101%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) hue-rotate(224deg) brightness(96%) contrast(102%); @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) hue-rotate(294deg) brightness(104%) contrast(91%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) hue-rotate(306deg) brightness(116%) contrast(84%); @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) hue-rotate(338deg) brightness(98%) contrast(101%); @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) hue-rotate(313deg) brightness(102%) contrast(95%); @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) hue-rotate(63deg) brightness(104%) contrast(78%); @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) hue-rotate(108deg) brightness(93%) contrast(90%); @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) hue-rotate(164deg) brightness(106%) contrast(84%); @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%) contrast(100%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) hue-rotate(190deg) brightness(100%) contrast(93%); @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) hue-rotate(202deg) brightness(93%) contrast(87%); @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) hue-rotate(202deg) brightness(95%) contrast(90%); @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) hue-rotate(220deg) brightness(95%) contrast(91%); };\n};\n", "usercssData": { "name": "Instagram Catppuccin", "namespace": "github.com/catppuccin/userstyles/styles/instagram", "homepageURL": "https://github.com/catppuccin/userstyles/tree/main/styles/instagram", - "version": "2024.12.31", + "version": "2025.02.11", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainstagram", "description": "Soothing pastel theme for Instagram", @@ -3166,12 +3167,12 @@ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/instagram", "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.less", "name": "Instagram Catppuccin", - "originalDigest": "20640cd4d8b690a5817c17f1e1b1c04ed1966eb0", + "originalDigest": "3e5f475bc2d8928b0fce81f6e2490324965551ea", "_id": "64b66cea-b486-484e-be5e-6892494d1667", - "_rev": 1736501772047, + "_rev": 1742161342496, "id": 18, - "etag": "W/\"7b2fbeacba3c2a8b8a00f0fd40db5b8f5f617e14ef6acccccfe05fa133ea1607\"", - "updateDate": 1736501272265 + "etag": "W/\"4bd38f29c77e320f35ab0e380939c0102dc4497db6f32841f4da650e19e3d061\"", + "updateDate": 1742161333600 }, { "enabled": true, @@ -3345,7 +3346,7 @@ "name": "LinkedIn Catppuccin", "originalDigest": "ae523380f1d5d16bd800b95d418b953eedb0247b", "_id": "6b9476a3-0669-4f08-ad55-60fd4bebfd93", - "_rev": 1736501772073, + "_rev": 1742161226891, "id": 19, "etag": "W/\"bff9ea80ca44fd018c8406567bfc78c99d2936583903338cf6857aca14959f4b\"", "updateDate": 1736501273529 @@ -3538,7 +3539,7 @@ "name": "Twitter Catppuccin", "originalDigest": "4a5e999e35277b9d67e6521e06d2db9e2c5bcc97", "_id": "1e139126-7c8a-4c1b-9d13-6a2e55fa4423", - "_rev": 1736501772100, + "_rev": 1742161226908, "id": 20, "etag": "W/\"a0b13f25ae5c948653e32394a9aba0cb5f5487b38fa576a661815d7820e5960d\"", "updateDate": 1736501274825 @@ -3551,12 +3552,12 @@ "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 2024.12.31\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.less\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\"),\n domain(\"stackexchange.com\"),\n domain(\"serverfault.com\"),\n domain(\"superuser.com\"),\n domain(\"mathoverflow.net\"),\n domain(\"askubuntu.com\"),\n 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);\n }\n }\n body:not(.theme-highcontrast).unified-theme.theme-dark {\n &,\n .themed {\n #catppuccin(@darkFlavor);\n }\n }\n\n body:not(.theme-highcontrast).unified-theme.theme-system {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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;\n --theme-button-primary-hover-background-color: darken(@accent, 5%);\n --theme-button-primary-active-background-color: @text;\n --theme-link-color: @accent;\n --theme-link-color-hover: darken(@accent, 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;\n --theme-tag-border-color: @accent;\n --theme-tag-color: @mantle;\n --theme-tag-hover-background-color: darken(@accent, 5%);\n --theme-tag-hover-border-color: darken(@accent, 5%);\n --theme-tag-hover-color: @mantle;\n --theme-post-title-color: @accent;\n --theme-post-title-color-hover: darken(@accent, 5%);\n\n --highlight-bg: @mantle;\n\n --theme-primary: @accent;\n --theme-primary-100: fade(@accent, 20%);\n --theme-primary-200: fade(@accent, 30%);\n --theme-primary-500: fade(@accent, 90%);\n --theme-primary-600: @accent;\n\n --translucent-secondary: fade(@accent, 10%);\n --theme-secondary-100: fade(@accent, 20%);\n --theme-secondary-200: fade(@accent, 30%);\n --theme-secondary-300: fade(@accent, 40%);\n --theme-secondary-400: fade(@accent, 50%);\n --theme-secondary-500: fade(@accent, 60%);\n --theme-secondary-600: fade(@accent, 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: 0 1px 1px @crust, 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;\n color: @crust;\n }\n\n #onetrust-button-group button#onetrust-pc-btn-handler {\n background-color: @crust !important;\n border-color: @accent !important;\n color: @accent !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 !important;\n border-color: @accent;\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 [alt=\"Cryptography\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n &:has([alt=\"Cryptography\"]) {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n\n .site-header {\n background-image: none;\n }\n }\n }\n}\n\n#rgbify(@color) {\n @rgb: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", + "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 2025.02.02\n@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.less\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\"),\n domain(\"stackexchange.com\"),\n domain(\"serverfault.com\"),\n domain(\"superuser.com\"),\n domain(\"mathoverflow.net\"),\n domain(\"askubuntu.com\"),\n 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);\n }\n }\n body:not(.theme-highcontrast).unified-theme.theme-dark {\n &,\n .themed {\n #catppuccin(@darkFlavor);\n }\n }\n\n body:not(.theme-highcontrast).unified-theme.theme-system {\n @media (prefers-color-scheme: light) {\n #catppuccin(@lightFlavor);\n }\n @media (prefers-color-scheme: dark) {\n #catppuccin(@darkFlavor);\n }\n }\n\n #catppuccin(@flavor) {\n @rosewater: @catppuccin[@@flavor][@rosewater];\n @flamingo: @catppuccin[@@flavor][@flamingo];\n @pink: @catppuccin[@@flavor][@pink];\n @mauve: @catppuccin[@@flavor][@mauve];\n @red: @catppuccin[@@flavor][@red];\n @maroon: @catppuccin[@@flavor][@maroon];\n @peach: @catppuccin[@@flavor][@peach];\n @yellow: @catppuccin[@@flavor][@yellow];\n @green: @catppuccin[@@flavor][@green];\n @teal: @catppuccin[@@flavor][@teal];\n @sky: @catppuccin[@@flavor][@sky];\n @sapphire: @catppuccin[@@flavor][@sapphire];\n @blue: @catppuccin[@@flavor][@blue];\n @lavender: @catppuccin[@@flavor][@lavender];\n @text: @catppuccin[@@flavor][@text];\n @subtext1: @catppuccin[@@flavor][@subtext1];\n @subtext0: @catppuccin[@@flavor][@subtext0];\n @overlay2: @catppuccin[@@flavor][@overlay2];\n @overlay1: @catppuccin[@@flavor][@overlay1];\n @overlay0: @catppuccin[@@flavor][@overlay0];\n @surface2: @catppuccin[@@flavor][@surface2];\n @surface1: @catppuccin[@@flavor][@surface1];\n @surface0: @catppuccin[@@flavor][@surface0];\n @base: @catppuccin[@@flavor][@base];\n @mantle: @catppuccin[@@flavor][@mantle];\n @crust: @catppuccin[@@flavor][@crust];\n @accent: @catppuccin[@@flavor][@@accentColor];\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(@flavor = latte, light, dark);\n\n ::selection {\n background-color: fade(@accent, 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;\n --theme-button-primary-hover-background-color: darken(@accent, 5%);\n --theme-button-primary-active-background-color: @text;\n --theme-link-color: @blue;\n --theme-link-color-hover: @sky;\n --theme-link-color-visited: @lavender;\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;\n --theme-tag-border-color: @accent;\n --theme-tag-color: @mantle;\n --theme-tag-hover-background-color: darken(@accent, 5%);\n --theme-tag-hover-border-color: darken(@accent, 5%);\n --theme-tag-hover-color: @mantle;\n\n --highlight-bg: @mantle;\n\n --theme-primary: @accent;\n --theme-primary-100: fade(@accent, 20%);\n --theme-primary-200: fade(@accent, 30%);\n --theme-primary-500: fade(@accent, 90%);\n --theme-primary-600: @accent;\n\n --translucent-secondary: fade(@accent, 10%);\n --theme-secondary-100: fade(@accent, 20%);\n --theme-secondary-200: fade(@accent, 30%);\n --theme-secondary-300: fade(@accent, 40%);\n --theme-secondary-400: fade(@accent, 50%);\n --theme-secondary-500: fade(@accent, 60%);\n --theme-secondary-600: fade(@accent, 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: 0 1px 1px @crust, 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;\n color: @crust;\n }\n\n #onetrust-button-group button#onetrust-pc-btn-handler {\n background-color: @crust !important;\n border-color: @accent !important;\n color: @accent !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 !important;\n border-color: @accent;\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 [alt=\"Cryptography\"] {\n @svg: escape(\n ''\n );\n content: url(\"data:image/svg+xml,@{svg}\");\n }\n &:has([alt=\"Cryptography\"]) {\n @svg: escape(\n ''\n );\n background-image: url(\"data:image/svg+xml,@{svg}\");\n\n .site-header {\n background-image: none;\n }\n }\n }\n}\n\n#rgbify(@color) {\n @rgb: red(@color), green(@color), blue(@color);\n}\n\n/* deno-fmt-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", "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": "2024.12.31", + "version": "2025.02.02", "updateURL": "https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.less", "supportURL": "https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astack-overflow", "description": "Soothing pastel theme for Stack Overflow", @@ -3713,12 +3714,12 @@ "url": "https://github.com/catppuccin/userstyles/tree/main/styles/stack-overflow", "updateUrl": "https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.less", "name": "Stack Overflow Catppuccin", - "originalDigest": "475148def18b07161d61fd34e3c773cdaa887904", + "originalDigest": "7131ae980873725e62efaabc621b69fd7ecef969", "_id": "1962007f-3241-4a9e-89e0-dd1644e6bfaf", - "_rev": 1736501772135, + "_rev": 1742161294951, "id": 21, - "etag": "W/\"6c15e06d0c8c6684d729a48581e5e6d0d9ba507b4d8e61b0d3d52f0712f757fa\"", - "updateDate": 1736501276161 + "etag": "W/\"cfbbd71a613bfee979bcc99d749f31ce4be6d9c1f1d5d3a5189b66bca9f844b6\"", + "updateDate": 1742161274194 }, { "enabled": true, @@ -3728,11 +3729,11 @@ "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", + "sourceCode": "/*==UserStyle==\n@name Youtube Music Catppuccin\n@namespace github.com/catppuccin/youtubemusic\n@version 0.4.4\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", + "version": "0.4.4", "description": "Soothing pastel theme for Youtube Music", "author": "Catppuccin", "updateURL": "https://raw.githubusercontent.com/catppuccin/youtubemusic/main/src/youtubemusic.user.css", @@ -3887,10 +3888,11 @@ "updateUrl": "https://raw.githubusercontent.com/catppuccin/youtubemusic/main/src/youtubemusic.user.css", "name": "Youtube Music Catppuccin", "preferScheme": "dark", - "originalDigest": "21afdba5c2f4f854275ae4cc35e6107549937656", + "originalDigest": "53f591a7cc23d1e537ab89babc99600d82ba8db2", "_id": "19e5a670-10a3-48ca-a1a3-b4d6c31ca9e6", - "_rev": 1736501772211, + "_rev": 1742161280901, "id": 22, - "etag": "W/\"2e7b9cbf89be9664e93c5662916c9fcd12408f73fd601df0e293e3e1f1707a27\"" + "etag": "W/\"b29949601cee6b1194e002720452fdaa353e6d135f94ef4c7cbd6f0cd0e96215\"", + "updateDate": 1742161235927 } ] \ No newline at end of file diff --git a/nixos/bootloader.nix b/nixos/bootloader.nix index 5e23b54..1eff3e8 100644 --- a/nixos/bootloader.nix +++ b/nixos/bootloader.nix @@ -6,7 +6,10 @@ boot.loader.efi.canTouchEfiVariables = true; boot.loader.timeout = 2; boot.initrd.enable = true; + boot.initrd.verbose = false; boot.initrd.systemd.enable = true; + boot.initrd.availableKernelModules = [ "i915" ]; + boot.initrd.kernelModules = [ "i915" ]; boot.consoleLogLevel = 3; boot.plymouth = { enable = true; diff --git a/nixos/display-manager.nix b/nixos/display-manager.nix index 93c90a6..616a2d0 100644 --- a/nixos/display-manager.nix +++ b/nixos/display-manager.nix @@ -6,12 +6,21 @@ enable = true; settings = { default_session = { - command = "${pkgs.greetd.tuigreet}/bin/tuigreet --time --time-format '%I:%M %p | %a • %h | %F' --cmd Hyprland"; - user = "greeter"; + command = "${pkgs.greetd.tuigreet}/bin/tuigreet \ + --time --time-format '%I:%M %p | %a • %h | %F' \ + --cmd 'uwsm start hyprland'"; + user = "greeter"; }; }; }; + users.users.greeter = { + isNormalUser = false; + description = "greetd greeter user"; + extraGroups = [ "video" "audio" ]; + linger = true; + }; + environment.systemPackages = with pkgs; [ greetd.tuigreet ]; diff --git a/nixos/flake.nix b/nixos/flake.nix index 1298317..fb13c6c 100644 --- a/nixos/flake.nix +++ b/nixos/flake.nix @@ -50,7 +50,7 @@ ./mosh.nix ./firewall.nix ./dns.nix - # ./vpn.nix + ./vpn.nix ./users.nix ./virtualisation.nix ./programming-languages.nix diff --git a/nixos/hyprland.nix b/nixos/hyprland.nix index 6126e23..0f410f7 100644 --- a/nixos/hyprland.nix +++ b/nixos/hyprland.nix @@ -2,10 +2,16 @@ { # Enable Hyprland - programs.hyprland.enable = true; + programs.hyprland = { + enable = true; + withUWSM = true; + }; environment.sessionVariables.NIXOS_OZONE_WL = "1"; environment.sessionVariables.WLR_NO_HARDWARE_CURSORS = "1"; + programs.hyprlock.enable = true; + services.hypridle.enable = true; + environment.systemPackages = with pkgs; [ pyprland hyprpicker @@ -15,6 +21,7 @@ hyprpaper inputs.wezterm.packages.${pkgs.system}.default + kitty cool-retro-term starship diff --git a/nixos/linux-kernel.nix b/nixos/linux-kernel.nix index e26f5f8..f45c498 100644 --- a/nixos/linux-kernel.nix +++ b/nixos/linux-kernel.nix @@ -2,10 +2,18 @@ { # Linux Kernel + security.forcePageTableIsolation = true; + security.lockKernelModules = true; + # security.protectKernelImage = true; + security.unprivilegedUsernsClone = true; + security.virtualisation.flushL1DataCache = "cond"; boot.kernelPackages = pkgs.linuxKernel.packages.linux_zen; boot.kernelParams = [ - "splash" "quiet" + "splash" + "loglevel=3" + "rd.udev.log_priority=3" + "systemd.show_status=auto" "fbcon=nodefer" "vt.global_cursor_default=0" "kernel.modules_disabled=1" diff --git a/nixos/llm.nix b/nixos/llm.nix index 27b72af..543b003 100644 --- a/nixos/llm.nix +++ b/nixos/llm.nix @@ -4,7 +4,7 @@ services.ollama = { enable = true; - loadModels = [ "llama3.2:3b" "llama3.2-vision:11b" "phi4:14b" "deepseek-r1:7b" "dolphin3:8b" "smallthinker:3b" "nomic-embed-text" ]; + loadModels = [ "llama3.2:3b" "llama3.2-vision:11b" "phi4:14b" "deepseek-r1:7b" "dolphin3:8b" "smallthinker:3b" "nomic-embed-text" "gemma3:12b" "gemma3:27b" "deepcoder:14b" ]; acceleration = "cuda"; }; diff --git a/nixos/utils.nix b/nixos/utils.nix index 18694e0..fbce551 100644 --- a/nixos/utils.nix +++ b/nixos/utils.nix @@ -14,5 +14,6 @@ surrealdb-migrations surrealist trunk + sqlx-cli ]; } diff --git a/nixos/virtualisation.nix b/nixos/virtualisation.nix index 5b0577b..5cd1731 100644 --- a/nixos/virtualisation.nix +++ b/nixos/virtualisation.nix @@ -1,6 +1,12 @@ { pkgs, ... }: { + # Enable Kasm + # services.kasmweb = { + # enable = true; + # listenPort = 9999; + # }; + # Enable Containerd # virtualisation.containerd.enable = true; @@ -15,6 +21,7 @@ # }; # users.extraGroups.docker.members = [ "xnm" ]; + # Enable Podman virtualisation.podman = { enable = true; @@ -31,7 +38,7 @@ environment.systemPackages = with pkgs; [ nvidia-docker - # nerdctl + nerdctl # firecracker # firectl @@ -39,6 +46,7 @@ distrobox qemu + lima podman-compose podman-tui diff --git a/nixos/vpn.nix b/nixos/vpn.nix index fc8cfd8..a76c2c1 100644 --- a/nixos/vpn.nix +++ b/nixos/vpn.nix @@ -7,5 +7,8 @@ environment.systemPackages = with pkgs; [ mullvad-closest + + mullvad-browser + tor-browser ]; }