/* pah.moi — theme palettes: 4 foundation (§11) + 4 seasonal (§12) + event (§13–14) families * (ADR-0010, ADR-0011). Hand-maintained CSS; every value is a TESTED INVARIANT — a change that * drops any critical contrast pair below WCAG AA, breaks grayscale surface separation, or makes an * accent read as the danger state FAILS CI via site_generator/tests/theme_contrast.rs (which parses * this file and gates all 17 palettes). So edit values freely; the test is the guard — and the same * file also gates the light/system-light duplicate blocks against drifting apart. * * The DEFAULT theme (`standard`) also ships as a minimal dark FLOOR inline in every page * (site_generator FALLBACK_CSS) so a readable document survives even if this sheet fails to load. * This sheet is requested render-blocking in , so switching themes is flash-free. Light * appearances are independently designed (themes §16.2), not inverted. `monochrome` status is * grayscale by design (themes §17.1 exempts it) — meaning carried by label + icon + shape, never * colour. `aprilfools` is the sequence-only Matrix Override (§15) — dark-only (light == dark), * applied by the April-Fools controller, not offered as a selectable theme (so 16 selectable + it). * Each theme is keyed by [data-theme=...] (not `html`) so a preview swatch can scope its own * theme locally. * * `--syntax-*` (#442) is the newest family and the only one whose siblings are read *against each * other* rather than against a surface: four JSON node kinds sit one line apart in the same tree, * so `syntax_kinds_stay_distinguishable_from_each_other` gates pairwise RGB distance as well as AA * on `--surface-inset` and `--surface-panel`, the two surfaces a code block lives on. Four of the * eight names arch themes §9.9 reserves are minted; the other four wait for a call site. It is * per-theme (unlike `--severity-*`, which is one scale site-wide) because syntax tint is * decoration that has to sit inside the palette, not a finding that has to mean the same * everywhere. `monochrome` answers it with a luminance ladder rather than four hues, and * `aprilfools` with four phosphor steps — see toolset-style-guide §23. */ /* ===== STANDARD SLATE — technical, current running through it ===== */ [data-theme="standard"] { --surface-root:#0b0f14; --surface-panel:#11161c; --surface-elevated:#171d24; --surface-inset:#080b0f; --surface-hover:#1b2530; --surface-selected:#1f3038; --surface-overlay:rgba(4,7,10,0.72); --surface-border:#2b3742; --border-muted:#1c242c; --border-standard:#2b3742; --border-strong:#3d4c5a; --text-primary:#c7d1d9; --text-secondary:#9fb2c0; --text-muted:#8394a1; --text-inverse:#0b0f14; --text-link:#00e5d3; --accent-primary:#00e5d3; --accent-primary-hover:#4defe0; --accent-primary-active:#00b7a8; --accent-secondary:#ff8a3d; --accent-on-primary:#04211f; --status-success:#3ddc84; --status-warning:#ff9f45; --status-danger:#ff6b78; --status-info:#5cc8ff; --focus-ring:#7b61ff; --selection-background:#1f3a44; --selection-foreground:#eafaf8; --caret:#00e5d3; --scrollbar-thumb:#2b3742; --scrollbar-track:#0b0f14; --syntax-variable:#218ebc; --syntax-string:#24974a; --syntax-number:#be730f; --syntax-keyword:#ba58e4; } [data-theme="standard"][data-appearance="light"] { --surface-root:#f4f6f8; --surface-panel:#e7ecf0; --surface-elevated:#ffffff; --surface-inset:#dde3e9; --surface-hover:#dbe2e8; --surface-selected:#cfe6e2; --surface-overlay:rgba(20,28,35,0.42); --surface-border:#c1cad2; --border-muted:#d4dbe0; --border-standard:#c1cad2; --border-strong:#98a6b1; --text-primary:#1b232b; --text-secondary:#3b4a56; --text-muted:#566673; --text-inverse:#ffffff; --text-link:#006b60; --accent-primary:#006b60; --accent-primary-hover:#008375; --accent-primary-active:#00514a; --accent-secondary:#a8501d; --accent-on-primary:#ffffff; --status-success:#146c3c; --status-warning:#8a5212; --status-danger:#b3283c; --status-info:#1667a8; --focus-ring:#4b34d6; --selection-background:#cfe8e4; --selection-foreground:#08201d; --caret:#006b60; --scrollbar-thumb:#c1cad2; --scrollbar-track:#f4f6f8; --syntax-variable:#186889; --syntax-string:#1a6e36; --syntax-number:#8b530b; --syntax-keyword:#9621c8; } @media (prefers-color-scheme: light) { [data-theme="standard"][data-appearance="system"] { --surface-root:#f4f6f8; --surface-panel:#e7ecf0; --surface-elevated:#ffffff; --surface-inset:#dde3e9; --surface-hover:#dbe2e8; --surface-selected:#cfe6e2; --surface-overlay:rgba(20,28,35,0.42); --surface-border:#c1cad2; --border-muted:#d4dbe0; --border-standard:#c1cad2; --border-strong:#98a6b1; --text-primary:#1b232b; --text-secondary:#3b4a56; --text-muted:#566673; --text-inverse:#ffffff; --text-link:#006b60; --accent-primary:#006b60; --accent-primary-hover:#008375; --accent-primary-active:#00514a; --accent-secondary:#a8501d; --accent-on-primary:#ffffff; --status-success:#146c3c; --status-warning:#8a5212; --status-danger:#b3283c; --status-info:#1667a8; --focus-ring:#4b34d6; --selection-background:#cfe8e4; --selection-foreground:#08201d; --caret:#006b60; --scrollbar-thumb:#c1cad2; --scrollbar-track:#f4f6f8; --syntax-variable:#186889; --syntax-string:#1a6e36; --syntax-number:#8b530b; --syntax-keyword:#9621c8; } } /* ===== WARM TERMINAL — parchment, brass, oxidized metal ===== */ [data-theme="warm"] { --surface-root:#14100b; --surface-panel:#1f1810; --surface-elevated:#2c2113; --surface-inset:#0f0b07; --surface-hover:#2c2115; --surface-selected:#352818; --surface-overlay:rgba(9,6,3,0.72); --surface-border:#3b2d1c; --border-muted:#2a2015; --border-standard:#3b2d1c; --border-strong:#523d26; --text-primary:#f0e6d2; --text-secondary:#cdba99; --text-muted:#a59175; --text-inverse:#14100b; --text-link:#ffb454; --accent-primary:#ffb454; --accent-primary-hover:#ffc880; --accent-primary-active:#e09328; --accent-secondary:#d98a54; --accent-on-primary:#2a1a06; --status-success:#7cc85f; --status-warning:#ffa63d; --status-danger:#ff7a5c; --status-info:#54c6d6; --focus-ring:#4fd6c4; --selection-background:#3a2c17; --selection-foreground:#f6ecd8; --caret:#ffb454; --scrollbar-thumb:#3b2d1c; --scrollbar-track:#14100b; --syntax-variable:#3493a5; --syntax-string:#4b9830; --syntax-number:#bb7812; --syntax-keyword:#cf5abb; } [data-theme="warm"][data-appearance="light"] { --surface-root:#f1e6d0; --surface-panel:#fdf8ec; --surface-elevated:#f6ecd6; --surface-inset:#e6d8bd; --surface-hover:#ebddc0; --surface-selected:#ecdcbb; --surface-overlay:rgba(42,30,12,0.40); --surface-border:#cbb489; --border-muted:#ddcca8; --border-standard:#cbb489; --border-strong:#a6885a; --text-primary:#3a2c17; --text-secondary:#5f4d31; --text-muted:#6f5a38; --text-inverse:#fdf8ec; --text-link:#8a4b12; --accent-primary:#8a4b12; --accent-primary-hover:#a85d1c; --accent-primary-active:#6b3a0d; --accent-secondary:#985729; --accent-on-primary:#fdf8ec; --status-success:#256c2a; --status-warning:#8a5212; --status-danger:#a9372c; --status-info:#1b6680; --focus-ring:#145e57; --selection-background:#ead9b5; --selection-foreground:#2a1e0c; --caret:#8a4b12; --scrollbar-thumb:#cbb489; --scrollbar-track:#f1e6d0; --syntax-variable:#23636f; --syntax-string:#336620; --syntax-number:#7e510d; --syntax-keyword:#992c87; } @media (prefers-color-scheme: light) { [data-theme="warm"][data-appearance="system"] { --surface-root:#f1e6d0; --surface-panel:#fdf8ec; --surface-elevated:#f6ecd6; --surface-inset:#e6d8bd; --surface-hover:#ebddc0; --surface-selected:#ecdcbb; --surface-overlay:rgba(42,30,12,0.40); --surface-border:#cbb489; --border-muted:#ddcca8; --border-standard:#cbb489; --border-strong:#a6885a; --text-primary:#3a2c17; --text-secondary:#5f4d31; --text-muted:#6f5a38; --text-inverse:#fdf8ec; --text-link:#8a4b12; --accent-primary:#8a4b12; --accent-primary-hover:#a85d1c; --accent-primary-active:#6b3a0d; --accent-secondary:#985729; --accent-on-primary:#fdf8ec; --status-success:#256c2a; --status-warning:#8a5212; --status-danger:#a9372c; --status-info:#1b6680; --focus-ring:#145e57; --selection-background:#ead9b5; --selection-foreground:#2a1e0c; --caret:#8a4b12; --scrollbar-thumb:#cbb489; --scrollbar-track:#f1e6d0; --syntax-variable:#23636f; --syntax-string:#336620; --syntax-number:#7e510d; --syntax-keyword:#992c87; } } /* ===== COLD CONSOLE — precision instrumentation, steel, blue-black glass ===== */ [data-theme="cold"] { --surface-root:#070b12; --surface-panel:#0d1421; --surface-elevated:#152130; --surface-inset:#04070d; --surface-hover:#182636; --surface-selected:#1c3149; --surface-overlay:rgba(3,6,12,0.74); --surface-border:#27384c; --border-muted:#1a2534; --border-standard:#27384c; --border-strong:#39526d; --text-primary:#d3e0ec; --text-secondary:#a6bacd; --text-muted:#87a0b5; --text-inverse:#070b12; --text-link:#2ad3ee; --accent-primary:#2ad3ee; --accent-primary-hover:#67e3f6; --accent-primary-active:#12a7c0; --accent-secondary:#8b9bff; --accent-on-primary:#052029; --status-success:#34d399; --status-warning:#fbbf45; --status-danger:#f87171; --status-info:#4cbdf8; --focus-ring:#9b8bff; --selection-background:#123047; --selection-foreground:#e6f6fb; --caret:#2ad3ee; --scrollbar-thumb:#27384c; --scrollbar-track:#070b12; --syntax-variable:#1c8bc2; --syntax-string:#25945d; --syntax-number:#a97b0e; --syntax-keyword:#886fe8; } [data-theme="cold"][data-appearance="light"] { --surface-root:#eef3f8; --surface-panel:#dde8f2; --surface-elevated:#f7fafd; --surface-inset:#d3e1ee; --surface-hover:#d6e3f0; --surface-selected:#cbe3f4; --surface-overlay:rgba(15,34,51,0.42); --surface-border:#b1c6da; --border-muted:#cad9e8; --border-standard:#b1c6da; --border-strong:#82a0bf; --text-primary:#0f2233; --text-secondary:#33485c; --text-muted:#4a5f74; --text-inverse:#ffffff; --text-link:#0a5f78; --accent-primary:#0a5f78; --accent-primary-hover:#0d7593; --accent-primary-active:#074a5e; --accent-secondary:#3538cd; --accent-on-primary:#ffffff; --status-success:#0f5f36; --status-warning:#8a5510; --status-danger:#b3283c; --status-info:#1465a6; --focus-ring:#4f2fd0; --selection-background:#cbe3f4; --selection-foreground:#08202e; --caret:#0a5f78; --scrollbar-thumb:#b1c6da; --scrollbar-track:#eef3f8; --syntax-variable:#14648d; --syntax-string:#18613d; --syntax-number:#7a590a; --syntax-keyword:#5f3ee0; } @media (prefers-color-scheme: light) { [data-theme="cold"][data-appearance="system"] { --surface-root:#eef3f8; --surface-panel:#dde8f2; --surface-elevated:#f7fafd; --surface-inset:#d3e1ee; --surface-hover:#d6e3f0; --surface-selected:#cbe3f4; --surface-overlay:rgba(15,34,51,0.42); --surface-border:#b1c6da; --border-muted:#cad9e8; --border-standard:#b1c6da; --border-strong:#82a0bf; --text-primary:#0f2233; --text-secondary:#33485c; --text-muted:#4a5f74; --text-inverse:#ffffff; --text-link:#0a5f78; --accent-primary:#0a5f78; --accent-primary-hover:#0d7593; --accent-primary-active:#074a5e; --accent-secondary:#3538cd; --accent-on-primary:#ffffff; --status-success:#0f5f36; --status-warning:#8a5510; --status-danger:#b3283c; --status-info:#1465a6; --focus-ring:#4f2fd0; --selection-background:#cbe3f4; --selection-foreground:#08202e; --caret:#0a5f78; --scrollbar-thumb:#b1c6da; --scrollbar-track:#eef3f8; --syntax-variable:#14648d; --syntax-string:#18613d; --syntax-number:#7a590a; --syntax-keyword:#5f3ee0; } } /* ===== MONOCHROME — reduction, print, documentation ===== */ [data-theme="monochrome"] { --surface-root:#060606; --surface-panel:#151515; --surface-elevated:#202020; --surface-inset:#000000; --surface-hover:#282828; --surface-selected:#333333; --surface-overlay:rgba(0,0,0,0.80); --surface-border:#3a3a3a; --border-muted:#262626; --border-standard:#3a3a3a; --border-strong:#585858; --text-primary:#f2f2f2; --text-secondary:#cacaca; --text-muted:#9c9c9c; --text-inverse:#060606; --text-link:#f2f2f2; --accent-primary:#f2f2f2; --accent-primary-hover:#ffffff; --accent-primary-active:#cfcfcf; --accent-secondary:#9c9c9c; --accent-on-primary:#060606; --status-success:#e0e0e0; --status-warning:#bdbdbd; --status-danger:#fafafa; --status-info:#c4c4c4; --focus-ring:#ffffff; --selection-background:#333333; --selection-foreground:#ffffff; --caret:#f2f2f2; --scrollbar-thumb:#3a3a3a; --scrollbar-track:#060606; --syntax-variable:#f2f2f2; --syntax-string:#cdcdcd; --syntax-number:#a8a8a8; --syntax-keyword:#828282; } [data-theme="monochrome"][data-appearance="light"] { --surface-root:#ffffff; --surface-panel:#f3f3f3; --surface-elevated:#e8e8e8; --surface-inset:#ffffff; --surface-hover:#ebebeb; --surface-selected:#dedede; --surface-overlay:rgba(0,0,0,0.34); --surface-border:#cbcbcb; --border-muted:#e0e0e0; --border-standard:#cbcbcb; --border-strong:#9e9e9e; --text-primary:#0a0a0a; --text-secondary:#333333; --text-muted:#5b5b5b; --text-inverse:#ffffff; --text-link:#0a0a0a; --accent-primary:#0a0a0a; --accent-primary-hover:#000000; --accent-primary-active:#333333; --accent-secondary:#5b5b5b; --accent-on-primary:#ffffff; --status-success:#2b2b2b; --status-warning:#4a4a4a; --status-danger:#000000; --status-info:#383838; --focus-ring:#0a0a0a; --selection-background:#d4d4d4; --selection-foreground:#0a0a0a; --caret:#0a0a0a; --scrollbar-thumb:#cbcbcb; --scrollbar-track:#ffffff; --syntax-variable:#000000; --syntax-string:#252525; --syntax-number:#4a4a4a; --syntax-keyword:#6f6f6f; } @media (prefers-color-scheme: light) { [data-theme="monochrome"][data-appearance="system"] { --surface-root:#ffffff; --surface-panel:#f3f3f3; --surface-elevated:#e8e8e8; --surface-inset:#ffffff; --surface-hover:#ebebeb; --surface-selected:#dedede; --surface-overlay:rgba(0,0,0,0.34); --surface-border:#cbcbcb; --border-muted:#e0e0e0; --border-standard:#cbcbcb; --border-strong:#9e9e9e; --text-primary:#0a0a0a; --text-secondary:#333333; --text-muted:#5b5b5b; --text-inverse:#ffffff; --text-link:#0a0a0a; --accent-primary:#0a0a0a; --accent-primary-hover:#000000; --accent-primary-active:#333333; --accent-secondary:#5b5b5b; --accent-on-primary:#ffffff; --status-success:#2b2b2b; --status-warning:#4a4a4a; --status-danger:#000000; --status-info:#383838; --focus-ring:#0a0a0a; --selection-background:#d4d4d4; --selection-foreground:#0a0a0a; --caret:#0a0a0a; --scrollbar-thumb:#cbcbcb; --scrollbar-track:#ffffff; --syntax-variable:#000000; --syntax-string:#252525; --syntax-number:#4a4a4a; --syntax-keyword:#6f6f6f; } } /* ============================================================================ * SEASONAL (themes §12) + EVENT (§13–14) FAMILIES — #30. Same token contract as the * foundation families above; every value WCAG-AA-verified (theme_contrast.rs). * ========================================================================== */ /* ===== SPRING — Rain Circuit ===== */ [data-theme="spring"] { --surface-root:#0c1218; --surface-panel:#131b23; --surface-elevated:#1b2530; --surface-inset:#080d12; --surface-hover:#202d38; --surface-selected:#22323d; --surface-overlay:rgba(6,10,14,0.72); --surface-border:#2d3b47; --border-muted:#1e2833; --border-standard:#2d3b47; --border-strong:#405060; --text-primary:#dce0d4; --text-secondary:#a3b0b8; --text-muted:#8b99a3; --text-inverse:#0c1218; --text-link:#5ee08a; --accent-primary:#5ee08a; --accent-primary-hover:#86ecab; --accent-primary-active:#37b566; --accent-secondary:#c4a9ff; --accent-on-primary:#06210f; --status-success:#4bd888; --status-warning:#f0a94a; --status-danger:#ff6b78; --status-info:#6cc6ff; --focus-ring:#7d6bff; --selection-background:#22323d; --selection-foreground:#e9f2ea; --caret:#5ee08a; --scrollbar-thumb:#2d3b47; --scrollbar-track:#0c1218; --syntax-variable:#2b92ac; --syntax-string:#299c2d; --syntax-number:#a98215; --syntax-keyword:#b168db; } [data-theme="spring"][data-appearance="light"] { --surface-root:#dfe4e2; --surface-panel:#eef1ee; --surface-elevated:#e4e9e8; --surface-inset:#f4f6f4; --surface-hover:#d6dedc; --surface-selected:#cfe6d6; --surface-overlay:rgba(40,50,55,0.30); --surface-border:#a7b2b0; --border-muted:#c3ccca; --border-standard:#a7b2b0; --border-strong:#7f8c8a; --text-primary:#1a232a; --text-secondary:#41525c; --text-muted:#4f6068; --text-inverse:#f6f8f6; --text-link:#0d6a35; --accent-primary:#0d6a35; --accent-primary-hover:#0e6834; --accent-primary-active:#0a5228; --accent-secondary:#6a3fd4; --accent-on-primary:#f2fbf4; --status-success:#0d6a35; --status-warning:#845000; --status-danger:#c02231; --status-info:#0a63a6; --focus-ring:#5326c9; --selection-background:#cfe6d6; --selection-foreground:#12281b; --caret:#0d6a35; --scrollbar-thumb:#a7b2b0; --scrollbar-track:#dfe4e2; --syntax-variable:#217286; --syntax-string:#207923; --syntax-number:#836410; --syntax-keyword:#9838d0; } @media (prefers-color-scheme: light) { [data-theme="spring"][data-appearance="system"] { --surface-root:#dfe4e2; --surface-panel:#eef1ee; --surface-elevated:#e4e9e8; --surface-inset:#f4f6f4; --surface-hover:#d6dedc; --surface-selected:#cfe6d6; --surface-overlay:rgba(40,50,55,0.30); --surface-border:#a7b2b0; --border-muted:#c3ccca; --border-standard:#a7b2b0; --border-strong:#7f8c8a; --text-primary:#1a232a; --text-secondary:#41525c; --text-muted:#4f6068; --text-inverse:#f6f8f6; --text-link:#0d6a35; --accent-primary:#0d6a35; --accent-primary-hover:#0e6834; --accent-primary-active:#0a5228; --accent-secondary:#6a3fd4; --accent-on-primary:#f2fbf4; --status-success:#0d6a35; --status-warning:#845000; --status-danger:#c02231; --status-info:#0a63a6; --focus-ring:#5326c9; --selection-background:#cfe6d6; --selection-foreground:#12281b; --caret:#0d6a35; --scrollbar-thumb:#a7b2b0; --scrollbar-track:#dfe4e2; --syntax-variable:#217286; --syntax-string:#207923; --syntax-number:#836410; --syntax-keyword:#9838d0; } } /* ===== SUMMER — Long Signal ===== */ [data-theme="summer"] { --surface-root:#0a1220; --surface-panel:#101d30; --surface-elevated:#182a42; --surface-inset:#060c16; --surface-hover:#1f3350; --surface-selected:#254564; --surface-overlay:rgba(4,8,16,0.72); --surface-border:#2c4058; --border-muted:#1c2c42; --border-standard:#2c4058; --border-strong:#3f5877; --text-primary:#dde8f2; --text-secondary:#d8c6a2; --text-muted:#98abc0; --text-inverse:#0a1220; --text-link:#2fd9c8; --accent-primary:#2fd9c8; --accent-primary-hover:#5fe6d8; --accent-primary-active:#1fb0a2; --accent-secondary:#f5b843; --accent-on-primary:#052421; --status-success:#4bd888; --status-warning:#f7a94b; --status-danger:#ff7a86; --status-info:#63c3ff; --focus-ring:#8a7bff; --selection-background:#254564; --selection-foreground:#eef7f5; --caret:#2fd9c8; --scrollbar-thumb:#2c4058; --scrollbar-track:#0a1220; --syntax-variable:#2194bd; --syntax-string:#279e47; --syntax-number:#b67e0f; --syntax-keyword:#a66fe4; } [data-theme="summer"][data-appearance="light"] { --surface-root:#e5ecf3; --surface-panel:#f6fafd; --surface-elevated:#eaf1f8; --surface-inset:#d5dfe9; --surface-hover:#dde8f2; --surface-selected:#cadff0; --surface-overlay:rgba(30,45,66,0.28); --surface-border:#a3b6c9; --border-muted:#c4d2e0; --border-standard:#a3b6c9; --border-strong:#7089a3; --text-primary:#14263c; --text-secondary:#3f5673; --text-muted:#54687f; --text-inverse:#f6fafd; --text-link:#03687d; --accent-primary:#03687d; --accent-primary-hover:#0a8299; --accent-primary-active:#034f60; --accent-secondary:#b06a05; --accent-on-primary:#ffffff; --status-success:#186f3d; --status-warning:#8d5400; --status-danger:#b72b38; --status-info:#1b64a0; --focus-ring:#5b45d6; --selection-background:#cadff0; --selection-foreground:#14263c; --caret:#03687d; --scrollbar-thumb:#a3b6c9; --scrollbar-track:#e5ecf3; --syntax-variable:#176581; --syntax-string:#1b6b30; --syntax-number:#7d560a; --syntax-keyword:#7c2cd7; } @media (prefers-color-scheme: light) { [data-theme="summer"][data-appearance="system"] { --surface-root:#e5ecf3; --surface-panel:#f6fafd; --surface-elevated:#eaf1f8; --surface-inset:#d5dfe9; --surface-hover:#dde8f2; --surface-selected:#cadff0; --surface-overlay:rgba(30,45,66,0.28); --surface-border:#a3b6c9; --border-muted:#c4d2e0; --border-standard:#a3b6c9; --border-strong:#7089a3; --text-primary:#14263c; --text-secondary:#3f5673; --text-muted:#54687f; --text-inverse:#f6fafd; --text-link:#03687d; --accent-primary:#03687d; --accent-primary-hover:#0a8299; --accent-primary-active:#034f60; --accent-secondary:#b06a05; --accent-on-primary:#ffffff; --status-success:#186f3d; --status-warning:#8d5400; --status-danger:#b72b38; --status-info:#1b64a0; --focus-ring:#5b45d6; --selection-background:#cadff0; --selection-foreground:#14263c; --caret:#03687d; --scrollbar-thumb:#a3b6c9; --scrollbar-track:#e5ecf3; --syntax-variable:#176581; --syntax-string:#1b6b30; --syntax-number:#7d560a; --syntax-keyword:#7c2cd7; } } /* ===== AUTUMN — Oxide Furnace ===== */ [data-theme="autumn"] { --surface-root:#12100b; --surface-panel:#1b1710; --surface-elevated:#262015; --surface-inset:#0b0906; --surface-hover:#2c2417; --surface-selected:#38301f; --surface-overlay:rgba(8,6,3,0.72); --surface-border:#3a3020; --border-muted:#241d13; --border-standard:#3a3020; --border-strong:#54452e; --text-primary:#ede3ce; --text-secondary:#cbb896; --text-muted:#ab967a; --text-inverse:#12100b; --text-link:#ffb454; --accent-primary:#ffb454; --accent-primary-hover:#ffc878; --accent-primary-active:#e09433; --accent-secondary:#f0763a; --accent-on-primary:#241304; --status-success:#8fbf5f; --status-warning:#ffb454; --status-danger:#ff7a6b; --status-info:#6bb8e0; --focus-ring:#7aa2c8; --selection-background:#3a2f1c; --selection-foreground:#faf3e4; --caret:#ffb454; --scrollbar-thumb:#3a3020; --scrollbar-track:#12100b; --syntax-variable:#3790a6; --syntax-string:#51952f; --syntax-number:#c47113; --syntax-keyword:#cc5ea7; } [data-theme="autumn"][data-appearance="light"] { --surface-root:#efe6d4; --surface-panel:#f8f1e3; --surface-elevated:#fdf8ec; --surface-inset:#e4d9c3; --surface-hover:#e8dcc4; --surface-selected:#e0d0b0; --surface-overlay:rgba(60,45,25,0.28); --surface-border:#c2ad86; --border-muted:#dccdb0; --border-standard:#c2ad86; --border-strong:#9a8258; --text-primary:#33281a; --text-secondary:#5c4a33; --text-muted:#6f5c42; --text-inverse:#fdf8ec; --text-link:#9c4712; --accent-primary:#9c4712; --accent-primary-hover:#b45a1e; --accent-primary-active:#7a360c; --accent-secondary:#a8410f; --accent-on-primary:#fdf8ec; --status-success:#316c15; --status-warning:#875010; --status-danger:#b03024; --status-info:#1c658d; --focus-ring:#2f5a86; --selection-background:#e0d0b0; --selection-foreground:#2a2115; --caret:#9c4712; --scrollbar-thumb:#c2ad86; --scrollbar-track:#efe6d4; --syntax-variable:#266272; --syntax-string:#386620; --syntax-number:#864e0d; --syntax-keyword:#9b3177; } @media (prefers-color-scheme: light) { [data-theme="autumn"][data-appearance="system"] { --surface-root:#efe6d4; --surface-panel:#f8f1e3; --surface-elevated:#fdf8ec; --surface-inset:#e4d9c3; --surface-hover:#e8dcc4; --surface-selected:#e0d0b0; --surface-overlay:rgba(60,45,25,0.28); --surface-border:#c2ad86; --border-muted:#dccdb0; --border-standard:#c2ad86; --border-strong:#9a8258; --text-primary:#33281a; --text-secondary:#5c4a33; --text-muted:#6f5c42; --text-inverse:#fdf8ec; --text-link:#9c4712; --accent-primary:#9c4712; --accent-primary-hover:#b45a1e; --accent-primary-active:#7a360c; --accent-secondary:#a8410f; --accent-on-primary:#fdf8ec; --status-success:#316c15; --status-warning:#875010; --status-danger:#b03024; --status-info:#1c658d; --focus-ring:#2f5a86; --selection-background:#e0d0b0; --selection-foreground:#2a2115; --caret:#9c4712; --scrollbar-thumb:#c2ad86; --scrollbar-track:#efe6d4; --syntax-variable:#266272; --syntax-string:#386620; --syntax-number:#864e0d; --syntax-keyword:#9b3177; } } /* ===== WINTER — Polar Signal ===== */ [data-theme="winter"] { --surface-root:#08111a; --surface-panel:#0f1b26; --surface-elevated:#182735; --surface-inset:#050c13; --surface-hover:#1d2f3e; --surface-selected:#22384a; --surface-overlay:rgba(4,10,16,0.72); --surface-border:#2c3f4f; --border-muted:#1e2c38; --border-standard:#2c3f4f; --border-strong:#405568; --text-primary:#dbe7f0; --text-secondary:#a9becd; --text-muted:#8ba1b2; --text-inverse:#08111a; --text-link:#35d6f0; --accent-primary:#35d6f0; --accent-primary-hover:#6ee6f6; --accent-primary-active:#12b0cc; --accent-secondary:#5a8cff; --accent-on-primary:#04202a; --status-success:#3ddc84; --status-warning:#ffb454; --status-danger:#ff6b7d; --status-info:#5cc8ff; --focus-ring:#8fb4ff; --selection-background:#1f3a4a; --selection-foreground:#eef8fc; --caret:#35d6f0; --scrollbar-thumb:#2c3f4f; --scrollbar-track:#08111a; --syntax-variable:#218ece; --syntax-string:#299965; --syntax-number:#a58210; --syntax-keyword:#a16de3; } [data-theme="winter"][data-appearance="light"] { --surface-root:#f4f8fb; --surface-panel:#e6eef4; --surface-elevated:#dbe6ee; --surface-inset:#eef4f8; --surface-hover:#d3e0ea; --surface-selected:#c3d8e8; --surface-overlay:rgba(15,30,45,0.40); --surface-border:#aebecb; --border-muted:#cbd8e2; --border-standard:#aebecb; --border-strong:#8599a8; --text-primary:#10222f; --text-secondary:#3c5163; --text-muted:#4e6273; --text-inverse:#f4f8fb; --text-link:#0a6fa8; --accent-primary:#0a6fa8; --accent-primary-hover:#0d84c6; --accent-primary-active:#075884; --accent-secondary:#234fd6; --accent-on-primary:#f4f8fb; --status-success:#15703f; --status-warning:#945600; --status-danger:#c62134; --status-info:#10618f; --focus-ring:#1256d6; --selection-background:#c3d8e8; --selection-foreground:#10222f; --caret:#0a6fa8; --scrollbar-thumb:#aebecb; --scrollbar-track:#e6eef4; --syntax-variable:#196d9d; --syntax-string:#1f744d; --syntax-number:#7e640c; --syntax-keyword:#833fdb; } @media (prefers-color-scheme: light) { [data-theme="winter"][data-appearance="system"] { --surface-root:#f4f8fb; --surface-panel:#e6eef4; --surface-elevated:#dbe6ee; --surface-inset:#eef4f8; --surface-hover:#d3e0ea; --surface-selected:#c3d8e8; --surface-overlay:rgba(15,30,45,0.40); --surface-border:#aebecb; --border-muted:#cbd8e2; --border-standard:#aebecb; --border-strong:#8599a8; --text-primary:#10222f; --text-secondary:#3c5163; --text-muted:#4e6273; --text-inverse:#f4f8fb; --text-link:#0a6fa8; --accent-primary:#0a6fa8; --accent-primary-hover:#0d84c6; --accent-primary-active:#075884; --accent-secondary:#234fd6; --accent-on-primary:#f4f8fb; --status-success:#15703f; --status-warning:#945600; --status-danger:#c62134; --status-info:#10618f; --focus-ring:#1256d6; --selection-background:#c3d8e8; --selection-foreground:#10222f; --caret:#0a6fa8; --scrollbar-thumb:#aebecb; --scrollbar-track:#e6eef4; --syntax-variable:#196d9d; --syntax-string:#1f744d; --syntax-number:#7e640c; --syntax-keyword:#833fdb; } } /* ===== OCTOBER 1 — Green and Gold ===== */ [data-theme="october1"] { --surface-root:#0a120c; --surface-panel:#0f1e14; --surface-elevated:#16281c; --surface-inset:#060c08; --surface-hover:#1c3324; --surface-selected:#234030; --surface-overlay:rgba(3,8,5,0.72); --surface-border:#2c4433; --border-muted:#1b2c20; --border-standard:#2c4433; --border-strong:#3f5c48; --text-primary:#eef5ef; --text-secondary:#b9cdbf; --text-muted:#93a898; --text-inverse:#0a120c; --text-link:#ffcf4d; --accent-primary:#ffcf4d; --accent-primary-hover:#ffdd78; --accent-primary-active:#e0af2e; --accent-secondary:#3ddc84; --accent-on-primary:#241a02; --status-success:#3ddc84; --status-warning:#ffb454; --status-danger:#ff6b78; --status-info:#5cc8ff; --focus-ring:#7bd88f; --selection-background:#234030; --selection-foreground:#eef8f0; --caret:#ffcf4d; --scrollbar-thumb:#2c4433; --scrollbar-track:#0a120c; --syntax-variable:#2f93b1; --syntax-string:#299c40; --syntax-number:#a88209; --syntax-keyword:#cb59d3; } [data-theme="october1"][data-appearance="light"] { --surface-root:#f9f6ea; --surface-panel:#f0e9cf; --surface-elevated:#fffdf4; --surface-inset:#e6dab6; --surface-hover:#ebe1c2; --surface-selected:#e3d7b1; --surface-overlay:rgba(30,25,8,0.40); --surface-border:#c7b078; --border-muted:#ded0a4; --border-standard:#c7b078; --border-strong:#a68f54; --text-primary:#182a17; --text-secondary:#39492f; --text-muted:#585433; --text-inverse:#ffffff; --text-link:#1f5c34; --accent-primary:#1f5c34; --accent-primary-hover:#194c2b; --accent-primary-active:#143d22; --accent-secondary:#b5820a; --accent-on-primary:#ffffff; --status-success:#106831; --status-warning:#835500; --status-danger:#b3202e; --status-info:#1660b0; --focus-ring:#1f5c34; --selection-background:#e3d7b1; --selection-foreground:#182a17; --caret:#1f5c34; --scrollbar-thumb:#c7b078; --scrollbar-track:#f0e9cf; --syntax-variable:#206377; --syntax-string:#195f27; --syntax-number:#725806; --syntax-keyword:#952a9d; } @media (prefers-color-scheme: light) { [data-theme="october1"][data-appearance="system"] { --surface-root:#f9f6ea; --surface-panel:#f0e9cf; --surface-elevated:#fffdf4; --surface-inset:#e6dab6; --surface-hover:#ebe1c2; --surface-selected:#e3d7b1; --surface-overlay:rgba(30,25,8,0.40); --surface-border:#c7b078; --border-muted:#ded0a4; --border-standard:#c7b078; --border-strong:#a68f54; --text-primary:#182a17; --text-secondary:#39492f; --text-muted:#585433; --text-inverse:#ffffff; --text-link:#1f5c34; --accent-primary:#1f5c34; --accent-primary-hover:#194c2b; --accent-primary-active:#143d22; --accent-secondary:#b5820a; --accent-on-primary:#ffffff; --status-success:#106831; --status-warning:#835500; --status-danger:#b3202e; --status-info:#1660b0; --focus-ring:#1f5c34; --selection-background:#e3d7b1; --selection-foreground:#182a17; --caret:#1f5c34; --scrollbar-thumb:#c7b078; --scrollbar-track:#f0e9cf; --syntax-variable:#206377; --syntax-string:#195f27; --syntax-number:#725806; --syntax-keyword:#952a9d; } } /* ===== HALLOWEEN — Haunted Terminal ===== */ [data-theme="halloween"] { --surface-root:#120a17; --surface-panel:#1a1024; --surface-elevated:#241634; --surface-inset:#0b0610; --surface-hover:#2c1c40; --surface-selected:#382452; --surface-overlay:rgba(10,5,16,0.72); --surface-border:#3d2b54; --border-muted:#271a37; --border-standard:#3d2b54; --border-strong:#574075; --text-primary:#ece6f2; --text-secondary:#c3b2d6; --text-muted:#a692bf; --text-inverse:#120a17; --text-link:#c39bff; --accent-primary:#b98cff; --accent-primary-hover:#cba7ff; --accent-primary-active:#9d68f0; --accent-secondary:#4ee39a; --accent-on-primary:#1a0f28; --status-success:#4ee39a; --status-warning:#ffab52; --status-danger:#ff6b7d; --status-info:#7fb4ff; --focus-ring:#8fb8ff; --selection-background:#3a2757; --selection-foreground:#f3ecfa; --caret:#b98cff; --scrollbar-thumb:#3d2b54; --scrollbar-track:#120a17; --syntax-variable:#268db3; --syntax-string:#259556; --syntax-number:#b8750f; --syntax-keyword:#c053e1; } [data-theme="halloween"][data-appearance="light"] { --surface-root:#f4f0f7; --surface-panel:#ece6f2; --surface-elevated:#e3dbee; --surface-inset:#fbf9fd; --surface-hover:#e0d5ee; --surface-selected:#d6c6ea; --surface-overlay:rgba(40,25,55,0.28); --surface-border:#bda9d4; --border-muted:#d8cce6; --border-standard:#bda9d4; --border-strong:#8f74b0; --text-primary:#241233; --text-secondary:#4a2d63; --text-muted:#5f4478; --text-inverse:#f4f0f7; --text-link:#7a34d6; --accent-primary:#7d33d9; --accent-primary-hover:#6a22c4; --accent-primary-active:#5a17ab; --accent-secondary:#136b41; --accent-on-primary:#ffffff; --status-success:#136b41; --status-warning:#8a5000; --status-danger:#bd2032; --status-info:#2358c8; --focus-ring:#3b4fd6; --selection-background:#d6c6ea; --selection-foreground:#241233; --caret:#7d33d9; --scrollbar-thumb:#bda9d4; --scrollbar-track:#ece6f2; --syntax-variable:#1d6c88; --syntax-string:#175c35; --syntax-number:#8c580b; --syntax-keyword:#9f23c5; } @media (prefers-color-scheme: light) { [data-theme="halloween"][data-appearance="system"] { --surface-root:#f4f0f7; --surface-panel:#ece6f2; --surface-elevated:#e3dbee; --surface-inset:#fbf9fd; --surface-hover:#e0d5ee; --surface-selected:#d6c6ea; --surface-overlay:rgba(40,25,55,0.28); --surface-border:#bda9d4; --border-muted:#d8cce6; --border-standard:#bda9d4; --border-strong:#8f74b0; --text-primary:#241233; --text-secondary:#4a2d63; --text-muted:#5f4478; --text-inverse:#f4f0f7; --text-link:#7a34d6; --accent-primary:#7d33d9; --accent-primary-hover:#6a22c4; --accent-primary-active:#5a17ab; --accent-secondary:#136b41; --accent-on-primary:#ffffff; --status-success:#136b41; --status-warning:#8a5000; --status-danger:#bd2032; --status-info:#2358c8; --focus-ring:#3b4fd6; --selection-background:#d6c6ea; --selection-foreground:#241233; --caret:#7d33d9; --scrollbar-thumb:#bda9d4; --scrollbar-track:#ece6f2; --syntax-variable:#1d6c88; --syntax-string:#175c35; --syntax-number:#8c580b; --syntax-keyword:#9f23c5; } } /* ===== CHRISTMAS — Evergreen and Candlelight ===== * Red-led in DARK, red-accented in LIGHT (#249) — the same dark/light asymmetry #41 settled for the * green-and-gold pair, and for the same reason: a red bright enough to pop as the hero cannot clear * 4.5:1 as a link colour on a near-white surface. Dark promotes cranberry to the hero and demotes * the candle gold to the secondary (it keeps the focus ring, so the ring never reads as the accent); * light keeps the gold hero and switches the secondary + link + caret from green to holly red. The * evergreen surfaces are untouched in both — the request was the accent, not the greens. */ [data-theme="christmas"] { --surface-root:#08130d; --surface-panel:#0e1c14; --surface-elevated:#2c1c15; --surface-inset:#050d08; --surface-hover:#14281c; --surface-selected:#1c3626; --surface-overlay:rgba(4,10,6,0.72); --surface-border:#2b4433; --border-muted:#1a2c20; --border-standard:#2b4433; --border-strong:#3e5c48; --text-primary:#f2e6cf; --text-secondary:#d3c3a0; --text-muted:#ac9d78; --text-inverse:#08130d; --text-link:#ff4d70; --accent-primary:#ff4d70; --accent-primary-hover:#ff7d97; --accent-primary-active:#e02a52; --accent-secondary:#f0c04a; --accent-on-primary:#2a0410; --status-success:#4fc27a; --status-warning:#f0a83d; --status-danger:#ff9b8f; --status-info:#6cc6e8; --focus-ring:#f5c95a; --selection-background:#22402c; --selection-foreground:#f7f0dd; --caret:#ff4d70; --scrollbar-thumb:#2b4433; --scrollbar-track:#08130d; --syntax-variable:#3192aa; --syntax-string:#299b3c; --syntax-number:#a98111; --syntax-keyword:#9e71d9; } [data-theme="christmas"][data-appearance="light"] { --surface-root:#f7f1e3; --surface-panel:#dde8da; --surface-elevated:#fbf6ec; --surface-inset:#eae3d2; --surface-hover:#dde9dc; --surface-selected:#cfe2d0; --surface-overlay:rgba(70,55,30,0.28); --surface-border:#b3bfa9; --border-muted:#d3ceba; --border-standard:#b3bfa9; --border-strong:#8a9a82; --text-primary:#1a2b1e; --text-secondary:#2f4a34; --text-muted:#556b57; --text-inverse:#fbf6ec; --text-link:#c2182b; --accent-primary:#6a4f0c; --accent-primary-hover:#836417; --accent-primary-active:#513c08; --accent-secondary:#c2182b; --accent-on-primary:#fef9ec; --status-success:#1a6e3c; --status-warning:#8a5a12; --status-danger:#6e0c1a; --status-info:#1a5f86; --focus-ring:#155e34; --selection-background:#f2d3d1; --selection-foreground:#1a2b1e; --caret:#c2182b; --scrollbar-thumb:#b3bfa9; --scrollbar-track:#dde8da; --syntax-variable:#246a7b; --syntax-string:#1e6f2b; --syntax-number:#7a5d0c; --syntax-keyword:#7b3dcc; } @media (prefers-color-scheme: light) { [data-theme="christmas"][data-appearance="system"] { --surface-root:#f7f1e3; --surface-panel:#dde8da; --surface-elevated:#fbf6ec; --surface-inset:#eae3d2; --surface-hover:#dde9dc; --surface-selected:#cfe2d0; --surface-overlay:rgba(70,55,30,0.28); --surface-border:#b3bfa9; --border-muted:#d3ceba; --border-standard:#b3bfa9; --border-strong:#8a9a82; --text-primary:#1a2b1e; --text-secondary:#2f4a34; --text-muted:#556b57; --text-inverse:#fbf6ec; --text-link:#c2182b; --accent-primary:#6a4f0c; --accent-primary-hover:#836417; --accent-primary-active:#513c08; --accent-secondary:#c2182b; --accent-on-primary:#fef9ec; --status-success:#1a6e3c; --status-warning:#8a5a12; --status-danger:#6e0c1a; --status-info:#1a5f86; --focus-ring:#155e34; --selection-background:#f2d3d1; --selection-foreground:#1a2b1e; --caret:#c2182b; --scrollbar-thumb:#b3bfa9; --scrollbar-track:#dde8da; --syntax-variable:#246a7b; --syntax-string:#1e6f2b; --syntax-number:#7a5d0c; --syntax-keyword:#7b3dcc; } } /* ===== NEW YEAR — Monochrome and Gold ===== */ [data-theme="newyear"] { --surface-root:#0a0a0b; --surface-panel:#16161a; --surface-elevated:#202027; --surface-inset:#050506; --surface-hover:#26262e; --surface-selected:#2e2f3a; --surface-overlay:rgba(0,0,0,0.72); --surface-border:#35353d; --border-muted:#232329; --border-standard:#35353d; --border-strong:#4a4a54; --text-primary:#f2f2f4; --text-secondary:#bdbdc4; --text-muted:#9c9ca4; --text-inverse:#0a0a0b; --text-link:#e8c76a; --accent-primary:#e8c76a; --accent-primary-hover:#f2d789; --accent-primary-active:#cba94f; --accent-secondary:#ddceb0; --accent-on-primary:#1a1508; --status-success:#4ec98a; --status-warning:#f2a341; --status-danger:#f0616f; --status-info:#6cc0f0; --focus-ring:#c9c9d2; --selection-background:#2e2f3a; --selection-foreground:#f2f2f4; --caret:#e8c76a; --scrollbar-thumb:#35353d; --scrollbar-track:#0a0a0b; --syntax-variable:#338fb0; --syntax-string:#309648; --syntax-number:#a57f14; --syntax-keyword:#b95ed4; } [data-theme="newyear"][data-appearance="light"] { --surface-root:#fbfbfc; --surface-panel:#eeeef1; --surface-elevated:#e4e4e9; --surface-inset:#ffffff; --surface-hover:#e2e2e8; --surface-selected:#d6d8e2; --surface-overlay:rgba(10,10,12,0.45); --surface-border:#c0c0c9; --border-muted:#dcdce2; --border-standard:#c0c0c9; --border-strong:#96969f; --text-primary:#16161a; --text-secondary:#43434b; --text-muted:#5b5b63; --text-inverse:#fbfbfc; --text-link:#8a6410; --accent-primary:#8a6410; --accent-primary-hover:#a3781e; --accent-primary-active:#6e4f0c; --accent-secondary:#a88a4a; --accent-on-primary:#fbfbfc; --status-success:#137038; --status-warning:#94560a; --status-danger:#c0293b; --status-info:#1667b8; --focus-ring:#8a6410; --selection-background:#d6d8e2; --selection-foreground:#16161a; --caret:#8a6410; --scrollbar-thumb:#c0c0c9; --scrollbar-track:#eeeef1; --syntax-variable:#286f8a; --syntax-string:#257638; --syntax-number:#826310; --syntax-keyword:#a033c1; } @media (prefers-color-scheme: light) { [data-theme="newyear"][data-appearance="system"] { --surface-root:#fbfbfc; --surface-panel:#eeeef1; --surface-elevated:#e4e4e9; --surface-inset:#ffffff; --surface-hover:#e2e2e8; --surface-selected:#d6d8e2; --surface-overlay:rgba(10,10,12,0.45); --surface-border:#c0c0c9; --border-muted:#dcdce2; --border-standard:#c0c0c9; --border-strong:#96969f; --text-primary:#16161a; --text-secondary:#43434b; --text-muted:#5b5b63; --text-inverse:#fbfbfc; --text-link:#8a6410; --accent-primary:#8a6410; --accent-primary-hover:#a3781e; --accent-primary-active:#6e4f0c; --accent-secondary:#a88a4a; --accent-on-primary:#fbfbfc; --status-success:#137038; --status-warning:#94560a; --status-danger:#c0293b; --status-info:#1667b8; --focus-ring:#8a6410; --selection-background:#d6d8e2; --selection-foreground:#16161a; --caret:#8a6410; --scrollbar-thumb:#c0c0c9; --scrollbar-track:#eeeef1; --syntax-variable:#286f8a; --syntax-string:#257638; --syntax-number:#826310; --syntax-keyword:#a033c1; } } /* ===== VALENTINE'S DAY — Dusty Rose ===== */ [data-theme="valentine"] { --surface-root:#140a10; --surface-panel:#241019; --surface-elevated:#33161f; --surface-inset:#0d060a; --surface-hover:#3a1a26; --surface-selected:#4a2130; --surface-overlay:rgba(10,4,7,0.72); --surface-border:#4a2632; --border-muted:#341620; --border-standard:#4a2632; --border-strong:#653545; --text-primary:#f3dfe0; --text-secondary:#e0b9bf; --text-muted:#c79aa4; --text-inverse:#140a10; --text-link:#f2a3b0; --accent-primary:#e88a9c; --accent-primary-hover:#f2a3b0; --accent-primary-active:#d06e82; --accent-secondary:#f6c1cd; --accent-on-primary:#2a0d15; --status-success:#5fd39a; --status-warning:#f0b458; --status-danger:#ff6b7e; --status-info:#7db8e8; --focus-ring:#c9a4f2; --selection-background:#4a2130; --selection-foreground:#fbeef0; --caret:#e88a9c; --scrollbar-thumb:#4a2632; --scrollbar-track:#140a10; --syntax-variable:#348db4; --syntax-string:#309659; --syntax-number:#bc7417; --syntax-keyword:#d7539e; } [data-theme="valentine"][data-appearance="light"] { --surface-root:#fbf3ef; --surface-panel:#f6e6e6; --surface-elevated:#f2dadd; --surface-inset:#fdf8f5; --surface-hover:#eecfd3; --surface-selected:#e6bcc4; --surface-overlay:rgba(90,40,55,0.18); --surface-border:#d3a8b0; --border-muted:#e8cccf; --border-standard:#d3a8b0; --border-strong:#b87f8c; --text-primary:#4a1420; --text-secondary:#6e2634; --text-muted:#7a3a46; --text-inverse:#fbf3ef; --text-link:#a4243b; --accent-primary:#b23a54; --accent-primary-hover:#c44a64; --accent-primary-active:#8f2440; --accent-secondary:#d06e82; --accent-on-primary:#fff5f6; --status-success:#127143; --status-warning:#805210; --status-danger:#c02033; --status-info:#1a6098; --focus-ring:#7a1f3a; --selection-background:#e6bcc4; --selection-foreground:#4a1420; --caret:#b23a54; --scrollbar-thumb:#d3a8b0; --scrollbar-track:#f6e6e6; --syntax-variable:#286b89; --syntax-string:#1e5d37; --syntax-number:#8f5812; --syntax-keyword:#b52a79; } @media (prefers-color-scheme: light) { [data-theme="valentine"][data-appearance="system"] { --surface-root:#fbf3ef; --surface-panel:#f6e6e6; --surface-elevated:#f2dadd; --surface-inset:#fdf8f5; --surface-hover:#eecfd3; --surface-selected:#e6bcc4; --surface-overlay:rgba(90,40,55,0.18); --surface-border:#d3a8b0; --border-muted:#e8cccf; --border-standard:#d3a8b0; --border-strong:#b87f8c; --text-primary:#4a1420; --text-secondary:#6e2634; --text-muted:#7a3a46; --text-inverse:#fbf3ef; --text-link:#a4243b; --accent-primary:#b23a54; --accent-primary-hover:#c44a64; --accent-primary-active:#8f2440; --accent-secondary:#d06e82; --accent-on-primary:#fff5f6; --status-success:#127143; --status-warning:#805210; --status-danger:#c02033; --status-info:#1a6098; --focus-ring:#7a1f3a; --selection-background:#e6bcc4; --selection-foreground:#4a1420; --caret:#b23a54; --scrollbar-thumb:#d3a8b0; --scrollbar-track:#f6e6e6; --syntax-variable:#286b89; --syntax-string:#1e5d37; --syntax-number:#8f5812; --syntax-keyword:#b52a79; } } /* ===== EARTH — Globe and Ocean (February 28) ===== * The schoolroom-globe palette, and the only two-hue identity in the set (#247): ocean blue is the * hero, land green the secondary, and brown is held back as a HIGHLIGHT — borders, the pressed * accent state, the scrollbar, the ambiance motes — never a primary. That is what keeps the blue and * the green from muddying each other: two hues at accent weight, one warm hue at edge weight. Dark * is the default (style-guide) and was tuned first; the ocean deliberately sits away from `winter`'s * polar cyan (RGB dist 60 dark) because Feb 28 falls inside the winter season, so the two are one * click apart in the panel. Light keeps the same three roles on paper-white with brown rules. */ [data-theme="earth"] { --surface-root:#061318; --surface-panel:#0c1f26; --surface-elevated:#14303a; --surface-inset:#040d11; --surface-hover:#173a46; --surface-selected:#1d4653; --surface-overlay:rgba(3,9,12,0.72); --surface-border:#4d3a28; --border-muted:#24201b; --border-standard:#4d3a28; --border-strong:#7c5f41; --text-primary:#e6f1f4; --text-secondary:#b0cbd4; --text-muted:#8fadb8; --text-inverse:#061318; --text-link:#4a9ef2; --accent-primary:#4a9ef2; --accent-primary-hover:#7bbcf7; --accent-primary-active:#a9743f; --accent-secondary:#57c47c; --accent-on-primary:#03161f; --status-success:#3ddc84; --status-warning:#f0a94a; --status-danger:#ff6b78; --status-info:#8fb4ff; --focus-ring:#e8c98f; --selection-background:#1d4653; --selection-foreground:#eaf6fa; --caret:#4a9ef2; --scrollbar-thumb:#4d3a28; --scrollbar-track:#061318; --syntax-variable:#2b91cb; --syntax-string:#2a9d45; --syntax-number:#b67f12; --syntax-keyword:#aa6fdd; } [data-theme="earth"][data-appearance="light"] { --surface-root:#f3f8fa; --surface-panel:#e2eef3; --surface-elevated:#ffffff; --surface-inset:#d6e7ee; --surface-hover:#dbeaf0; --surface-selected:#cbe4ee; --surface-overlay:rgba(10,26,32,0.42); --surface-border:#b9a184; --border-muted:#d5e2e8; --border-standard:#b9a184; --border-strong:#8a6b4a; --text-primary:#0f2731; --text-secondary:#2f4d59; --text-muted:#4a6671; --text-inverse:#ffffff; --text-link:#0d4a8a; --accent-primary:#0d4a8a; --accent-primary-hover:#0a3c71; --accent-primary-active:#6b4a2a; --accent-secondary:#1a6b3c; --accent-on-primary:#ffffff; --status-success:#146c3c; --status-warning:#8a5212; --status-danger:#b3283c; --status-info:#1668b0; --focus-ring:#6b4a2a; --selection-background:#cbe4ee; --selection-foreground:#0f2731; --caret:#0d4a8a; --scrollbar-thumb:#b9a184; --scrollbar-track:#e2eef3; --syntax-variable:#1f6790; --syntax-string:#1e6f31; --syntax-number:#815a0d; --syntax-keyword:#8734cf; } @media (prefers-color-scheme: light) { [data-theme="earth"][data-appearance="system"] { --surface-root:#f3f8fa; --surface-panel:#e2eef3; --surface-elevated:#ffffff; --surface-inset:#d6e7ee; --surface-hover:#dbeaf0; --surface-selected:#cbe4ee; --surface-overlay:rgba(10,26,32,0.42); --surface-border:#b9a184; --border-muted:#d5e2e8; --border-standard:#b9a184; --border-strong:#8a6b4a; --text-primary:#0f2731; --text-secondary:#2f4d59; --text-muted:#4a6671; --text-inverse:#ffffff; --text-link:#0d4a8a; --accent-primary:#0d4a8a; --accent-primary-hover:#0a3c71; --accent-primary-active:#6b4a2a; --accent-secondary:#1a6b3c; --accent-on-primary:#ffffff; --status-success:#146c3c; --status-warning:#8a5212; --status-danger:#b3283c; --status-info:#1668b0; --focus-ring:#6b4a2a; --selection-background:#cbe4ee; --selection-foreground:#0f2731; --caret:#0d4a8a; --scrollbar-thumb:#b9a184; --scrollbar-track:#e2eef3; --syntax-variable:#1f6790; --syntax-string:#1e6f31; --syntax-number:#815a0d; --syntax-keyword:#8734cf; } } /* ===== CANADA DAY — Maple Red ===== */ [data-theme="canada"] { --surface-root:#14171a; --surface-panel:#1b1f24; --surface-elevated:#22272d; --surface-inset:#0e1113; --surface-hover:#262c33; --surface-selected:#33221f; --surface-overlay:rgba(8,10,12,0.72); --surface-border:#333b43; --border-muted:#242a30; --border-standard:#333b43; --border-strong:#495259; --text-primary:#f2f4f6; --text-secondary:#b8c0c8; --text-muted:#98a2ab; --text-inverse:#14171a; --text-link:#ff6a5a; --accent-primary:#ff5a4a; --accent-primary-hover:#ff7d70; --accent-primary-active:#e13d2e; --accent-secondary:#ff8f84; --accent-on-primary:#2a0806; --status-success:#3ddc84; --status-warning:#ff9f45; --status-danger:#ff8484; --status-info:#5cc8ff; --focus-ring:#7fa8d8; --selection-background:#3a2420; --selection-foreground:#ffe9e5; --caret:#ff5a4a; --scrollbar-thumb:#333b43; --scrollbar-track:#14171a; --syntax-variable:#3392ca; --syntax-string:#2a9f59; --syntax-number:#b88012; --syntax-keyword:#b86bda; } [data-theme="canada"][data-appearance="light"] { --surface-root:#ffffff; --surface-panel:#eef1f4; --surface-elevated:#e2e7ec; --surface-inset:#f6f8fa; --surface-hover:#e6eaee; --surface-selected:#f6dcd8; --surface-overlay:rgba(40,44,48,0.28); --surface-border:#b8c2cb; --border-muted:#d5dce2; --border-standard:#b8c2cb; --border-strong:#8b97a1; --text-primary:#1a1f24; --text-secondary:#4a555e; --text-muted:#57636c; --text-inverse:#ffffff; --text-link:#c42317; --accent-primary:#c42317; --accent-primary-hover:#a81a10; --accent-primary-active:#8f130b; --accent-secondary:#7a1109; --accent-on-primary:#ffffff; --status-success:#0f763b; --status-warning:#8a5200; --status-danger:#8c1420; --status-info:#0b63b0; --focus-ring:#1a1f24; --selection-background:#f6dcd8; --selection-foreground:#3a0d08; --caret:#c42317; --scrollbar-thumb:#b8c2cb; --scrollbar-track:#eef1f4; --syntax-variable:#266f99; --syntax-string:#207743; --syntax-number:#8b620e; --syntax-keyword:#9e34cc; } @media (prefers-color-scheme: light) { [data-theme="canada"][data-appearance="system"] { --surface-root:#ffffff; --surface-panel:#eef1f4; --surface-elevated:#e2e7ec; --surface-inset:#f6f8fa; --surface-hover:#e6eaee; --surface-selected:#f6dcd8; --surface-overlay:rgba(40,44,48,0.28); --surface-border:#b8c2cb; --border-muted:#d5dce2; --border-standard:#b8c2cb; --border-strong:#8b97a1; --text-primary:#1a1f24; --text-secondary:#4a555e; --text-muted:#57636c; --text-inverse:#ffffff; --text-link:#c42317; --accent-primary:#c42317; --accent-primary-hover:#a81a10; --accent-primary-active:#8f130b; --accent-secondary:#7a1109; --accent-on-primary:#ffffff; --status-success:#0f763b; --status-warning:#8a5200; --status-danger:#8c1420; --status-info:#0b63b0; --focus-ring:#1a1f24; --selection-background:#f6dcd8; --selection-foreground:#3a0d08; --caret:#c42317; --scrollbar-thumb:#b8c2cb; --scrollbar-track:#eef1f4; --syntax-variable:#266f99; --syntax-string:#207743; --syntax-number:#8b620e; --syntax-keyword:#9e34cc; } } /* ===== SAINT PATRICK'S DAY — Green and Gold (id saintpatrick) ===== * DARK retuned in #248: the hero moved from a bright spring mint (#2fd873, HSL 145°/68%/52%) to a * true emerald (#00c078, HSL 158°/100%/38%) — deeper, bluer, fully saturated. Hover and active are * DERIVED from it (18% toward white / 78% of it) rather than hand-picked, so the three stay one * ramp. `--status-success` deliberately still equals the hero: success IS the theme's identity here, * and the deeper emerald still clears AA on both root and panel. The secondary and link moved from * warm gold to yellow (52° rather than 44°), which raises their contrast as a side effect. The LIGHT * variant is gold-hero by design from #41 and is deliberately untouched. */ [data-theme="saintpatrick"] { --surface-root:#04160d; --surface-panel:#0b2818; --surface-elevated:#123a25; --surface-inset:#020e07; --surface-hover:#164a2e; --surface-selected:#1d5a38; --surface-overlay:rgba(2,12,7,0.74); --surface-border:#245a3a; --border-muted:#183a26; --border-standard:#245a3a; --border-strong:#357a52; --text-primary:#e9f7ed; --text-secondary:#b3d6bf; --text-muted:#8bb89b; --text-inverse:#04160d; --text-link:#ffe866; --accent-primary:#00c078; --accent-primary-hover:#2ecb90; --accent-primary-active:#00965e; --accent-secondary:#ffe14d; --accent-on-primary:#04160c; --status-success:#00c078; --status-warning:#ff9a3d; --status-danger:#ff6b78; --status-info:#4fd6c0; --focus-ring:#8af0ac; --selection-background:#1d5a38; --selection-foreground:#eafbf0; --caret:#00c078; --scrollbar-thumb:#245a3a; --scrollbar-track:#04160d; --syntax-variable:#2d9ab6; --syntax-string:#2ba337; --syntax-number:#ab8c0e; --syntax-keyword:#c869d7; } [data-theme="saintpatrick"][data-appearance="light"] { --surface-root:#f4fbf5; --surface-panel:#e3f3e7; --surface-elevated:#ffffff; --surface-inset:#d5ecd9; --surface-hover:#d9efdd; --surface-selected:#c8e8ce; --surface-overlay:rgba(8,24,14,0.42); --surface-border:#a6c2ac; --border-muted:#cbdccf; --border-standard:#a6c2ac; --border-strong:#7c9d84; --text-primary:#10281a; --text-secondary:#2c5238; --text-muted:#496b52; --text-inverse:#ffffff; --text-link:#7a5400; --accent-primary:#8a6000; --accent-primary-hover:#734f00; --accent-primary-active:#5f4100; --accent-secondary:#0a7a44; --accent-on-primary:#ffffff; --status-success:#14763a; --status-warning:#9a4d00; --status-danger:#c62436; --status-info:#1667b8; --focus-ring:#8a6000; --selection-background:#c8e8ce; --selection-foreground:#10281a; --caret:#8a6000; --scrollbar-thumb:#a6c2ac; --scrollbar-track:#e3f3e7; --syntax-variable:#206c7e; --syntax-string:#1e7127; --syntax-number:#76610a; --syntax-keyword:#9e2faf; } @media (prefers-color-scheme: light) { [data-theme="saintpatrick"][data-appearance="system"] { --surface-root:#f4fbf5; --surface-panel:#e3f3e7; --surface-elevated:#ffffff; --surface-inset:#d5ecd9; --surface-hover:#d9efdd; --surface-selected:#c8e8ce; --surface-overlay:rgba(8,24,14,0.42); --surface-border:#a6c2ac; --border-muted:#cbdccf; --border-standard:#a6c2ac; --border-strong:#7c9d84; --text-primary:#10281a; --text-secondary:#2c5238; --text-muted:#496b52; --text-inverse:#ffffff; --text-link:#7a5400; --accent-primary:#8a6000; --accent-primary-hover:#734f00; --accent-primary-active:#5f4100; --accent-secondary:#0a7a44; --accent-on-primary:#ffffff; --status-success:#14763a; --status-warning:#9a4d00; --status-danger:#c62436; --status-info:#1667b8; --focus-ring:#8a6000; --selection-background:#c8e8ce; --selection-foreground:#10281a; --caret:#8a6000; --scrollbar-thumb:#a6c2ac; --scrollbar-track:#e3f3e7; --syntax-variable:#206c7e; --syntax-string:#1e7127; --syntax-number:#76610a; --syntax-keyword:#9e2faf; } } /* ===== APRIL FOOLS — Matrix Override (dark-only; id aprilfools, sequence-only) ===== */ [data-theme="aprilfools"] { --surface-root:#010601; --surface-panel:#04120a; --surface-elevated:#0a2213; --surface-inset:#000300; --surface-hover:#0d2a15; --surface-selected:#123720; --surface-overlay:rgba(0,6,2,0.82); --surface-border:#164a24; --border-muted:#0d2611; --border-standard:#164a24; --border-strong:#22662f; --text-primary:#7dffa1; --text-secondary:#4fce74; --text-muted:#43a862; --text-inverse:#010601; --text-link:#b6ff3a; --accent-primary:#b6ff3a; --accent-primary-hover:#caff6a; --accent-primary-active:#8fd21f; --accent-secondary:#39ff7a; --accent-on-primary:#02180a; --status-success:#39ff7a; --status-warning:#d4ff2a; --status-danger:#ff6a6a; --status-info:#5affc0; --focus-ring:#d9ffe6; --selection-background:#123720; --selection-foreground:#e6ffee; --caret:#b6ff3a; --scrollbar-thumb:#164a24; --scrollbar-track:#010601; --syntax-variable:#5cffc8; --syntax-string:#9dff5c; --syntax-number:#d8ff3a; --syntax-keyword:#21e07a; } [data-theme="aprilfools"][data-appearance="light"] { --surface-root:#010601; --surface-panel:#04120a; --surface-elevated:#0a2213; --surface-inset:#000300; --surface-hover:#0d2a15; --surface-selected:#123720; --surface-overlay:rgba(0,6,2,0.82); --surface-border:#164a24; --border-muted:#0d2611; --border-standard:#164a24; --border-strong:#22662f; --text-primary:#7dffa1; --text-secondary:#4fce74; --text-muted:#43a862; --text-inverse:#010601; --text-link:#b6ff3a; --accent-primary:#b6ff3a; --accent-primary-hover:#caff6a; --accent-primary-active:#8fd21f; --accent-secondary:#39ff7a; --accent-on-primary:#02180a; --status-success:#39ff7a; --status-warning:#d4ff2a; --status-danger:#ff6a6a; --status-info:#5affc0; --focus-ring:#d9ffe6; --selection-background:#123720; --selection-foreground:#e6ffee; --caret:#b6ff3a; --scrollbar-thumb:#164a24; --scrollbar-track:#010601; --syntax-variable:#5cffc8; --syntax-string:#9dff5c; --syntax-number:#d8ff3a; --syntax-keyword:#21e07a; } @media (prefers-color-scheme: light) { [data-theme="aprilfools"][data-appearance="system"] { --surface-root:#010601; --surface-panel:#04120a; --surface-elevated:#0a2213; --surface-inset:#000300; --surface-hover:#0d2a15; --surface-selected:#123720; --surface-overlay:rgba(0,6,2,0.82); --surface-border:#164a24; --border-muted:#0d2611; --border-standard:#164a24; --border-strong:#22662f; --text-primary:#7dffa1; --text-secondary:#4fce74; --text-muted:#43a862; --text-inverse:#010601; --text-link:#b6ff3a; --accent-primary:#b6ff3a; --accent-primary-hover:#caff6a; --accent-primary-active:#8fd21f; --accent-secondary:#39ff7a; --accent-on-primary:#02180a; --status-success:#39ff7a; --status-warning:#d4ff2a; --status-danger:#ff6a6a; --status-info:#5affc0; --focus-ring:#d9ffe6; --selection-background:#123720; --selection-foreground:#e6ffee; --caret:#b6ff3a; --scrollbar-thumb:#164a24; --scrollbar-track:#010601; --syntax-variable:#5cffc8; --syntax-string:#9dff5c; --syntax-number:#d8ff3a; --syntax-keyword:#21e07a; } } /* ============================================================================ * APRIL FOOLS sequence effects (§15, #31) — inert until the WASM April-Fools * controller sets data-aprilfools="malfunction"|"matrix" on . Palette is * the [data-theme="aprilfools"] block above; these are the phase effects. * ========================================================================== */ /* Phase One — Interface Malfunction: a playful, NON-blocking notice. Never hides controls, never * impersonates an OS dialog; gentle motion only (no rapid flashing). */ .pahmoi-af-notice { position:fixed; left:50%; top:1rem; transform:translateX(-50%); z-index:60; max-width:min(92vw,640px); padding:0.8rem 1rem; font-size:0.9rem; background:var(--surface-elevated); color:var(--text-primary); border:2px dashed var(--status-warning); border-radius:6px; box-shadow:0 6px 24px rgba(0,0,0,0.45); animation:pahmoi-af-glitch-in 0.5s ease-out; } .pahmoi-af-title { color:var(--status-warning); font-weight:700; letter-spacing:0.04em; } .pahmoi-af-body { color:var(--text-muted); margin:0.35rem 0 0; } .pahmoi-af-actions { display:flex; gap:0.5rem; flex-wrap:wrap; margin-top:0.6rem; } .pahmoi-af-btn { font:inherit; cursor:pointer; padding:0.3rem 0.7rem; border-radius:4px; color:var(--accent-on-primary); background:var(--accent-primary); border:1px solid var(--accent-primary); } .pahmoi-af-btn.secondary { color:var(--text-link); background:transparent; border-color:var(--border-strong); } /* A one-shot glitchy entrance (NOT looping — a perpetually-moving button is hostile + un-clickable); it settles to the static resting transform so the notice holds still and stays interactive. */ @keyframes pahmoi-af-glitch-in { 0% { transform:translateX(-50%) translateY(-8px) skewX(-3deg); opacity:0; } 55% { transform:translateX(-50%) skewX(2deg); opacity:1; } 100% { transform:translateX(-50%) skewX(0); opacity:1; } } /* Phase Two — Matrix Override: brief transition flash, then code rain BEHIND content (§15.3). The * flash is non-interactive (pointer-events:none) and fades itself out, so [Force Re-Align] stays * clickable immediately beneath it (§15.1). */ .pahmoi-af-transition { position:fixed; inset:0; z-index:70; display:grid; place-content:center; gap:0.5rem; text-align:center; padding:1rem; background:rgba(1,6,1,0.94); pointer-events:none; color:var(--accent-primary); font-weight:700; letter-spacing:0.08em; animation:pahmoi-af-flash 2.6s ease-out forwards; } @keyframes pahmoi-af-flash { 0%,78%{opacity:1;} 100%{opacity:0;visibility:hidden;} } .pahmoi-af-exit { position:fixed; right:1rem; bottom:1rem; z-index:80; } .pahmoi-coderain { position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; display:flex; justify-content:space-around; } .pahmoi-coderain .col { writing-mode:vertical-rl; text-orientation:upright; white-space:nowrap; color:var(--accent-secondary); opacity:0.55; font-size:1rem; line-height:1.05; text-shadow:0 0 6px var(--accent-primary); animation:pahmoi-af-fall linear infinite; } .pahmoi-coderain.paused .col { animation-play-state:paused; } /* paused when the tab is hidden */ /* Each column falls at its own speed and offset. The figures are `coderain_fall(i)` in site_frontend, carried here by `data-col` rather than by an inline style: `style-src` in static/_headers has no 'unsafe-inline', so an inline animation is DROPPED in production and the rain falls as one solid block (#398, the #380 `data-w` pattern). A test walks the function against these rules, so the two cannot drift. */ .pahmoi-coderain .col[data-col="0"] { animation-duration:4.00s; animation-delay:0.00s; } .pahmoi-coderain .col[data-col="1"] { animation-duration:4.53s; animation-delay:0.37s; } .pahmoi-coderain .col[data-col="2"] { animation-duration:5.06s; animation-delay:0.74s; } .pahmoi-coderain .col[data-col="3"] { animation-duration:5.59s; animation-delay:1.11s; } .pahmoi-coderain .col[data-col="4"] { animation-duration:6.12s; animation-delay:1.48s; } .pahmoi-coderain .col[data-col="5"] { animation-duration:6.65s; animation-delay:1.85s; } .pahmoi-coderain .col[data-col="6"] { animation-duration:7.18s; animation-delay:2.22s; } .pahmoi-coderain .col[data-col="7"] { animation-duration:7.71s; animation-delay:2.59s; } .pahmoi-coderain .col[data-col="8"] { animation-duration:4.24s; animation-delay:2.96s; } .pahmoi-coderain .col[data-col="9"] { animation-duration:4.77s; animation-delay:3.33s; } .pahmoi-coderain .col[data-col="10"] { animation-duration:5.30s; animation-delay:3.70s; } .pahmoi-coderain .col[data-col="11"] { animation-duration:5.83s; animation-delay:0.07s; } .pahmoi-coderain .col[data-col="12"] { animation-duration:6.36s; animation-delay:0.44s; } .pahmoi-coderain .col[data-col="13"] { animation-duration:6.89s; animation-delay:0.81s; } .pahmoi-coderain .col[data-col="14"] { animation-duration:7.42s; animation-delay:1.18s; } .pahmoi-coderain .col[data-col="15"] { animation-duration:7.95s; animation-delay:1.55s; } .pahmoi-coderain .col[data-col="16"] { animation-duration:4.48s; animation-delay:1.92s; } .pahmoi-coderain .col[data-col="17"] { animation-duration:5.01s; animation-delay:2.29s; } @keyframes pahmoi-af-fall { from{transform:translateY(-110%);} to{transform:translateY(110%);} } html[data-aprilfools="matrix"] main, html[data-aprilfools="matrix"] .site-header, html[data-aprilfools="matrix"] .site-footer { position:relative; z-index:1; } @media (max-width:600px) { .pahmoi-coderain .col:nth-child(even) { display:none; } } /* mobile density */ @media (prefers-reduced-motion: reduce) { .pahmoi-coderain { display:none; } .pahmoi-af-notice { animation:none; } .pahmoi-af-transition { animation:none; opacity:0; visibility:hidden; } } html[data-motion="reduced"] .pahmoi-coderain { display:none; } html[data-motion="reduced"] .pahmoi-af-notice { animation:none; } html[data-motion="reduced"] .pahmoi-af-transition { animation:none; opacity:0; visibility:hidden; } /* ============================================================================ * AMBIANCE (#49) — a restrained drifting-motes overlay (#pahmoi-season), tinted * per theme; inert until data-seasonal-effects (a seasonal theme) or * data-event-effects (an event theme) is set. OFF under reduced motion (faint * static). Sits BEHIND content (isolated body + z-index:-1) so it never disturbs * the theme panel's stacking. * ========================================================================== */ html[data-seasonal-effects="true"] body, html[data-event-effects="true"] body { isolation:isolate; } .pahmoi-season { position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:0; transition:opacity 0.5s ease; } html[data-seasonal-effects="true"][data-theme="spring"] .pahmoi-season, html[data-seasonal-effects="true"][data-theme="summer"] .pahmoi-season, html[data-seasonal-effects="true"][data-theme="autumn"] .pahmoi-season, html[data-seasonal-effects="true"][data-theme="winter"] .pahmoi-season, html[data-event-effects="true"][data-theme="october1"] .pahmoi-season, html[data-event-effects="true"][data-theme="halloween"] .pahmoi-season, html[data-event-effects="true"][data-theme="christmas"] .pahmoi-season, html[data-event-effects="true"][data-theme="newyear"] .pahmoi-season, html[data-event-effects="true"][data-theme="valentine"] .pahmoi-season, html[data-event-effects="true"][data-theme="earth"] .pahmoi-season, html[data-event-effects="true"][data-theme="canada"] .pahmoi-season, html[data-event-effects="true"][data-theme="saintpatrick"] .pahmoi-season { opacity:0.55; background-image: radial-gradient(1.5px 1.5px at 15% 12%, currentColor 50%, transparent 51%), radial-gradient(1.5px 1.5px at 42% 58%, currentColor 50%, transparent 51%), radial-gradient(1.5px 1.5px at 68% 30%, currentColor 50%, transparent 51%), radial-gradient(1.5px 1.5px at 88% 74%, currentColor 50%, transparent 51%), radial-gradient(1.5px 1.5px at 30% 88%, currentColor 50%, transparent 51%), radial-gradient(1.5px 1.5px at 58% 8%, currentColor 50%, transparent 51%); background-size:100% 55vh; animation:pahmoi-season-drift 16s linear infinite; } /* per-theme tint (drives the motes' currentColor) */ html[data-theme="winter"] .pahmoi-season { color:#cfe8ff; } html[data-theme="spring"] .pahmoi-season { color:#8fe0b0; } html[data-theme="summer"] .pahmoi-season { color:#ffd98a; } html[data-theme="autumn"] .pahmoi-season { color:#ffb072; } html[data-theme="halloween"] .pahmoi-season { color:#ff9a3d; } /* Christmas motes follow the new red hero (#249) rather than the demoted candle gold. */ html[data-theme="christmas"] .pahmoi-season { color:#ff8f9c; } html[data-theme="newyear"] .pahmoi-season { color:#ffe08a; } html[data-theme="valentine"] .pahmoi-season { color:#ffb3c8; } html[data-theme="canada"] .pahmoi-season { color:#ff9a9a; } html[data-theme="october1"] .pahmoi-season { color:#9be0a8; } /* Earth's motes are the brown highlight — the one place the relief colour drifts over the page. */ html[data-theme="earth"] .pahmoi-season { color:#c89a62; } /* Retuned with the emerald hero (#248) — the old #8fe0b0 mint now reads as a different theme. */ html[data-theme="saintpatrick"] .pahmoi-season { color:#57d9a0; } @keyframes pahmoi-season-drift { from { background-position:0 0; } to { background-position:0 55vh; } } @media (prefers-reduced-motion: reduce) { .pahmoi-season { animation:none; opacity:0.22; } } html[data-motion="reduced"] .pahmoi-season { animation:none; opacity:0.22; }