/** * Mysterious Galaxies — Mission Control design tokens (brand-guidelines §14). * * Two independent axes on : * data-reading = "night" (default) | "day" — visitor toggle, set pre-paint * data-tone = "nominal" (default) | "anomaly" — per-episode field * * No-JS fallback: with no data-reading attribute the html{} block applies, * so the page renders Night · Nominal. */ /* ---- Night (default) · Nominal ---- */ html { /* Reading-mode surfaces (§14.1) */ --bg: #0E0E10; --panel: #15161A; --inset: #08090B; --ink: #E8E2D4; --mut: #8A857A; --rule: rgba(232, 226, 212, .16); /* Tone accents (§14.2) */ --acc: #FC3D21; --signal: #EF9F27; --info: #4D7FD6; /* Typography (§14.3) */ --font-display: 'Space Grotesk', system-ui, sans-serif; --font-mono: 'Space Mono', ui-monospace, monospace; --font-body: 'Inter', system-ui, sans-serif; /* Layout (§14.4) */ --radius: 6px; --radius-pill: 4px; --radius-input: 4px; --hairline: 0.5px solid var(--rule); --measure: 600px; color-scheme: dark; } /* ---- Day · Nominal ---- */ html[data-reading="day"] { --bg: #E8E2D4; --panel: #DCD5C4; --inset: #D3CBB8; --ink: #1C1815; --mut: #6F6656; --rule: rgba(28, 24, 21, .2); --acc: #C6301A; --signal: #7C5210; --info: #2C5A8C; color-scheme: light; } /* ---- Anomaly overrides (§14.2: alarm-red signal, cooled ink, panel desaturated one notch) ---- */ html[data-tone="anomaly"] { --signal: #E24B4A; --ink: #DAD5CC; --panel: #151617; } html[data-reading="day"][data-tone="anomaly"] { --signal: #A32D2D; --ink: #211C17; --panel: #D9D3C9; }