/*
 * ═══ OutaStory UI v2 — the seven color worlds ═══
 * Per-world palette overrides on top of ui-v2.css's default token layer.
 * Everything is scoped to html[data-ui="v2"] with a per-world data-theme
 * attribute (plus the .theme-preview duplicates below) and is INERT unless
 * App.Web stamps data-ui="v2". Loads after ui-v2.css in App.razor/index.html.
 * NOTE: keep comments in this file free of curly braces — UiV2ContrastTests'
 * ParseBlock splits on brace pairs across the whole file text.
 *
 * Structure per world = two blocks mirroring ui-v2.css exactly:
 *   light — bare world anchor (fallback), the html-level mode attribute, the
 *           binary descendant re-anchor div, and the Theme Studio preview tile;
 *   dark  — same minus the bare fallback.
 * The descendant re-anchor is required for the same reason ui-v2.css documents
 * on its own light block: AppLayout/ReaderLayout/GateLayout stamp an inner
 * binary div where themes/default.css would otherwise re-win.
 *
 * Preview tiles: each selector list carries a .theme-preview duplicate so the
 * Theme Studio can render an inactive world inside the active one — sharing the
 * selector list keeps every value single-sourced (no copied blocks). The one
 * exception is "default", whose canonical palette lives in ui-v2.css; its two
 * preview blocks at the end of this file are literal value copies and MUST be
 * kept in lockstep with ui-v2.css.
 *
 * Contrast pairs are enforced by UiV2ContrastTests (7 worlds x 2 modes) —
 * adjust lightness, keep hue, if a value change fails the harness.
 */

/* ══ NEBULA — cosmic violet-indigo, aurora accents ══ */

/* Observatory day: indigo ink on cool starlit paper. */
html[data-ui="v2"][data-theme="nebula"],
html[data-ui="v2"][data-theme="nebula"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="nebula"] [data-theme="light"],
.theme-preview[data-theme="nebula"][data-theme-mode="light"] {
	--os-primary: #4B3BD8;
	--os-primary-hover: #3D2EC2;
	--os-primary-light: #E7E4FB;
	--os-primary-dark: #372AAE;
	--os-gradient-start: #4B3BD8;
	--os-gradient-end: #2A1E7E;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #0A8FA8;
	--os-accent-hover: #0C7E93;

	--os-background: #F2F2FA;
	--os-surface: #FFFFFF;
	--os-surface-variant: #EAEAF6;
	--os-surface-elevated: #FFFFFF;

	--os-text-primary: #14122B;
	--os-text-secondary: #454363;
	--os-text-tertiary: #63608A;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #EAEAF8;

	--os-border: #DEDCEE;
	--os-border-light: #E9E7F5;
	--os-border-focus: #4B3BD8;

	--os-success: #12805C;
	--os-success-light: #DCF5EA;
	--os-error: #C93B52;
	--os-error-light: #FCE7EA;
	--os-warning: #94660A;
	--os-warning-light: #FBF1DA;
	--os-info: #3A5FE0;

	--os-star-filled: #E09C2E;
	--os-star-empty: #D7D5E6;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(10, 9, 26, 0.55);
	--os-overlay-light: rgba(10, 9, 26, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(20, 18, 43, 0.05), 0 2px 8px rgba(20, 18, 43, 0.05);
	--os-shadow-md: 0 2px 4px rgba(20, 18, 43, 0.06), 0 8px 24px rgba(20, 18, 43, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(20, 18, 43, 0.07), 0 16px 48px rgba(20, 18, 43, 0.14);

	--os-glass-bg: rgba(255, 255, 255, 0.62);
	--os-glass-bg-strong: rgba(255, 255, 255, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(20, 18, 43, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(20, 18, 43, 0.10), 0 32px 80px rgba(20, 18, 43, 0.18);
	--os-glow-primary: 0 8px 24px rgba(75, 59, 216, 0.20);
	--os-glow-accent: 0 8px 24px rgba(10, 143, 168, 0.18);

	--os-focus-ring-color: #4B3BD8;

	color-scheme: light;
}

/* Deep space: violet plasma over a void-black starfield. */
html[data-ui="v2"][data-theme="nebula"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="nebula"] [data-theme="dark"],
.theme-preview[data-theme="nebula"][data-theme-mode="dark"] {
	--os-primary: #8F82FF;
	--os-primary-hover: #A49AFF;
	--os-primary-light: #232350;
	--os-primary-dark: #4B3BD8;
	--os-gradient-start: #8F82FF;
	--os-gradient-end: #4636D6;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #2FD5E6;
	--os-accent-hover: #55E0ED;

	--os-background: #070714;
	--os-surface: #101022;
	--os-surface-variant: #16162D;
	--os-surface-elevated: #1B1B38;

	--os-text-primary: #EAEAF8;
	--os-text-secondary: #B4B2D4;
	--os-text-tertiary: #8A88B0;
	--os-text-on-primary: #0D0B24;
	--os-text-on-dark: #EAEAF8;

	--os-border: #26264A;
	--os-border-light: #1E1E3C;
	--os-border-focus: #8F82FF;

	--os-success: #34D9A4;
	--os-success-light: #0E3A2C;
	--os-error: #FF7B84;
	--os-error-light: #3C1922;
	--os-warning: #FFBE4F;
	--os-warning-light: #3A2C10;
	--os-info: #7CA5FF;

	--os-star-filled: #FFBE4F;
	--os-star-empty: #34345A;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(4, 4, 12, 0.74);
	--os-overlay-light: rgba(4, 4, 12, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(2, 2, 10, 0.45), 0 2px 8px rgba(2, 2, 10, 0.35);
	--os-shadow-md: 0 2px 4px rgba(2, 2, 10, 0.5), 0 8px 24px rgba(2, 2, 10, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(2, 2, 10, 0.55), 0 16px 48px rgba(2, 2, 10, 0.55);

	--os-glass-bg: rgba(16, 16, 34, 0.55);
	--os-glass-bg-strong: rgba(16, 16, 34, 0.72);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(160, 160, 255, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(180, 180, 255, 0.06);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(2, 2, 10, 0.6), 0 32px 80px rgba(2, 2, 10, 0.65);
	--os-glow-primary: 0 0 24px rgba(143, 130, 255, 0.4);
	--os-glow-accent: 0 0 24px rgba(47, 213, 230, 0.32);

	--os-focus-ring-color: #8F82FF;

	color-scheme: dark;
}

/* ══ VELVET — deep plum & rose, luxurious ══ */

/* Boudoir cream: plum ink on blushed paper, antique gold trim. */
html[data-ui="v2"][data-theme="velvet"],
html[data-ui="v2"][data-theme="velvet"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="velvet"] [data-theme="light"],
.theme-preview[data-theme="velvet"][data-theme-mode="light"] {
	--os-primary: #8E2D55;
	--os-primary-hover: #7B2447;
	--os-primary-light: #F7E4EC;
	--os-primary-dark: #6C1E3C;
	--os-gradient-start: #8E2D55;
	--os-gradient-end: #55152F;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #96702B;
	--os-accent-hover: #855F22;

	--os-background: #FAF1EE;
	--os-surface: #FFFCFA;
	--os-surface-variant: #F3E4DF;
	--os-surface-elevated: #FFFCFA;

	--os-text-primary: #2C1420;
	--os-text-secondary: #5C4250;
	--os-text-tertiary: #7A6270;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F6E9EE;

	--os-border: #EBDAD4;
	--os-border-light: #F2E5E0;
	--os-border-focus: #8E2D55;

	--os-success: #1E7D5A;
	--os-success-light: #DFF3EA;
	--os-error: #C23A46;
	--os-error-light: #FAE5E7;
	--os-warning: #96660D;
	--os-warning-light: #F9EFDA;
	--os-info: #6E4FB2;

	--os-star-filled: #C08A28;
	--os-star-empty: #E2D3CD;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(30, 10, 20, 0.55);
	--os-overlay-light: rgba(30, 10, 20, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(44, 20, 32, 0.05), 0 2px 8px rgba(44, 20, 32, 0.05);
	--os-shadow-md: 0 2px 4px rgba(44, 20, 32, 0.06), 0 8px 24px rgba(44, 20, 32, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(44, 20, 32, 0.07), 0 16px 48px rgba(44, 20, 32, 0.14);

	--os-glass-bg: rgba(255, 250, 248, 0.62);
	--os-glass-bg-strong: rgba(255, 250, 248, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(44, 20, 32, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(44, 20, 32, 0.10), 0 32px 80px rgba(44, 20, 32, 0.18);
	--os-glow-primary: 0 8px 24px rgba(142, 45, 85, 0.20);
	--os-glow-accent: 0 8px 24px rgba(150, 112, 43, 0.18);

	--os-focus-ring-color: #8E2D55;

	color-scheme: light;
}

/* Midnight velvet: rose glow and gold thread on deep plum. */
html[data-ui="v2"][data-theme="velvet"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="velvet"] [data-theme="dark"],
.theme-preview[data-theme="velvet"][data-theme-mode="dark"] {
	--os-primary: #E58BB0;
	--os-primary-hover: #EDA2C0;
	--os-primary-light: #3C1F2E;
	--os-primary-dark: #C9688F;
	--os-gradient-start: #E58BB0;
	--os-gradient-end: #8E2D55;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #D9B25F;
	--os-accent-hover: #E3C078;

	--os-background: #170D13;
	--os-surface: #211219;
	--os-surface-variant: #2A1821;
	--os-surface-elevated: #321D28;

	--os-text-primary: #F6E9EE;
	--os-text-secondary: #D0B3C0;
	--os-text-tertiary: #A8899A;
	--os-text-on-primary: #2A0E1C;
	--os-text-on-dark: #F6E9EE;

	--os-border: #432A36;
	--os-border-light: #362028;
	--os-border-focus: #E58BB0;

	--os-success: #4BD6A0;
	--os-success-light: #103828;
	--os-error: #FF8585;
	--os-error-light: #3E1720;
	--os-warning: #F5C05A;
	--os-warning-light: #3A2B12;
	--os-info: #B79BE8;

	--os-star-filled: #E9C46A;
	--os-star-empty: #4A3440;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(12, 4, 9, 0.72);
	--os-overlay-light: rgba(12, 4, 9, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(8, 2, 5, 0.45), 0 2px 8px rgba(8, 2, 5, 0.35);
	--os-shadow-md: 0 2px 4px rgba(8, 2, 5, 0.5), 0 8px 24px rgba(8, 2, 5, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(8, 2, 5, 0.55), 0 16px 48px rgba(8, 2, 5, 0.55);

	--os-glass-bg: rgba(33, 18, 25, 0.55);
	--os-glass-bg-strong: rgba(33, 18, 25, 0.72);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(255, 210, 225, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 220, 235, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(8, 2, 5, 0.6), 0 32px 80px rgba(8, 2, 5, 0.65);
	--os-glow-primary: 0 0 24px rgba(229, 139, 176, 0.35);
	--os-glow-accent: 0 0 24px rgba(217, 178, 95, 0.3);

	--os-focus-ring-color: #E58BB0;

	color-scheme: dark;
}

/* ══ NOIR — disciplined monochrome ink, one cold accent ══ */

/* Case file: printing ink on bone paper, steel-blue evidence tags. */
html[data-ui="v2"][data-theme="noir"],
html[data-ui="v2"][data-theme="noir"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="noir"] [data-theme="light"],
.theme-preview[data-theme="noir"][data-theme-mode="light"] {
	--os-primary: #22201B;
	--os-primary-hover: #35322B;
	--os-primary-light: #E2E0D8;
	--os-primary-dark: #121110;
	--os-gradient-start: #2E2B25;
	--os-gradient-end: #121110;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #2E5F74;
	--os-accent-hover: #264F61;

	--os-background: #EFEDE8;
	--os-surface: #F8F7F3;
	--os-surface-variant: #E4E1DA;
	--os-surface-elevated: #FCFBF8;

	--os-text-primary: #171612;
	--os-text-secondary: #47453F;
	--os-text-tertiary: #66645B;
	--os-text-on-primary: #F8F7F3;
	--os-text-on-dark: #ECEAE2;

	--os-border: #D8D5CC;
	--os-border-light: #E5E2DA;
	--os-border-focus: #2E5F74;

	--os-success: #2E6B4F;
	--os-success-light: #E0EEE6;
	--os-error: #A83A32;
	--os-error-light: #F6E4E2;
	--os-warning: #83600F;
	--os-warning-light: #F3ECD8;
	--os-info: #33627E;

	--os-star-filled: #A87F24;
	--os-star-empty: #D3D0C6;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(15, 14, 10, 0.55);
	--os-overlay-light: rgba(15, 14, 10, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(23, 22, 18, 0.06), 0 2px 8px rgba(23, 22, 18, 0.05);
	--os-shadow-md: 0 2px 4px rgba(23, 22, 18, 0.07), 0 8px 24px rgba(23, 22, 18, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(23, 22, 18, 0.08), 0 16px 48px rgba(23, 22, 18, 0.14);

	--os-glass-bg: rgba(248, 247, 243, 0.62);
	--os-glass-bg-strong: rgba(248, 247, 243, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(23, 22, 18, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.55);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(23, 22, 18, 0.11), 0 32px 80px rgba(23, 22, 18, 0.18);
	--os-glow-primary: 0 8px 24px rgba(34, 32, 27, 0.18);
	--os-glow-accent: 0 8px 24px rgba(46, 95, 116, 0.2);

	--os-focus-ring-color: #2E5F74;

	color-scheme: light;
}

/* After hours: bone type on ink black, the accent stays cold. */
html[data-ui="v2"][data-theme="noir"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="noir"] [data-theme="dark"],
.theme-preview[data-theme="noir"][data-theme-mode="dark"] {
	--os-primary: #E0DCCE;
	--os-primary-hover: #EDEADF;
	--os-primary-light: #2A2A26;
	--os-primary-dark: #C9C4B2;
	--os-gradient-start: #E0DCCE;
	--os-gradient-end: #8F8B7C;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #6FB3CC;
	--os-accent-hover: #8CC4D9;

	--os-background: #0C0C0B;
	--os-surface: #151513;
	--os-surface-variant: #1C1C1A;
	--os-surface-elevated: #232320;

	--os-text-primary: #ECEAE2;
	--os-text-secondary: #B5B2A6;
	--os-text-tertiary: #8A887D;
	--os-text-on-primary: #171612;
	--os-text-on-dark: #ECEAE2;

	--os-border: #2E2E2A;
	--os-border-light: #232320;
	--os-border-focus: #6FB3CC;

	--os-success: #4EC98F;
	--os-success-light: #12302A;
	--os-error: #FF8177;
	--os-error-light: #38191B;
	--os-warning: #E8B54A;
	--os-warning-light: #332811;
	--os-info: #7FB6D9;

	--os-star-filled: #E8B54A;
	--os-star-empty: #33332E;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(3, 3, 2, 0.74);
	--os-overlay-light: rgba(3, 3, 2, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45), 0 2px 8px rgba(0, 0, 0, 0.35);
	--os-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.5), 0 8px 24px rgba(0, 0, 0, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.55), 0 16px 48px rgba(0, 0, 0, 0.55);

	--os-glass-bg: rgba(21, 21, 19, 0.55);
	--os-glass-bg-strong: rgba(21, 21, 19, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(236, 234, 226, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(236, 234, 226, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(0, 0, 0, 0.6), 0 32px 80px rgba(0, 0, 0, 0.65);
	--os-glow-primary: 0 0 24px rgba(224, 220, 206, 0.2);
	--os-glow-accent: 0 0 24px rgba(111, 179, 204, 0.28);

	--os-focus-ring-color: #6FB3CC;

	color-scheme: dark;
}

/* ══ PARCHMENT — warm paper & sepia, literary ══ */

/* Manuscript: sepia ink on aged paper, rubricated red accents. */
html[data-ui="v2"][data-theme="parchment"],
html[data-ui="v2"][data-theme="parchment"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="parchment"] [data-theme="light"],
.theme-preview[data-theme="parchment"][data-theme-mode="light"] {
	--os-primary: #6B4A1A;
	--os-primary-hover: #5A3D14;
	--os-primary-light: #EFE2C6;
	--os-primary-dark: #4E350F;
	--os-gradient-start: #7A5522;
	--os-gradient-end: #45300D;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #9C3D22;
	--os-accent-hover: #86331B;

	--os-background: #F4E9D4;
	--os-surface: #FBF4E4;
	--os-surface-variant: #ECDFC0;
	--os-surface-elevated: #FDF8EC;

	--os-text-primary: #241A0C;
	--os-text-secondary: #55452C;
	--os-text-tertiary: #6F5F42;
	--os-text-on-primary: #FBF4E4;
	--os-text-on-dark: #F0E4C8;

	--os-border: #E0D2B2;
	--os-border-light: #EADDC2;
	--os-border-focus: #6B4A1A;

	--os-success: #4E6B1C;
	--os-success-light: #E8EFD2;
	--os-error: #A83A22;
	--os-error-light: #F5E2D8;
	--os-warning: #855A08;
	--os-warning-light: #F1E5C2;
	--os-info: #325FA8;

	--os-star-filled: #A8770E;
	--os-star-empty: #D9CBA8;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(30, 22, 8, 0.55);
	--os-overlay-light: rgba(30, 22, 8, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(36, 26, 12, 0.06), 0 2px 8px rgba(36, 26, 12, 0.05);
	--os-shadow-md: 0 2px 4px rgba(36, 26, 12, 0.07), 0 8px 24px rgba(36, 26, 12, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(36, 26, 12, 0.08), 0 16px 48px rgba(36, 26, 12, 0.14);

	--os-glass-bg: rgba(251, 244, 228, 0.62);
	--os-glass-bg-strong: rgba(251, 244, 228, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(36, 26, 12, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 240, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(36, 26, 12, 0.11), 0 32px 80px rgba(36, 26, 12, 0.18);
	--os-glow-primary: 0 8px 24px rgba(107, 74, 26, 0.2);
	--os-glow-accent: 0 8px 24px rgba(156, 61, 34, 0.18);

	--os-focus-ring-color: #6B4A1A;

	color-scheme: light;
}

/* Candlelit study: gilt lettering and ember light on old oak. */
html[data-ui="v2"][data-theme="parchment"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="parchment"] [data-theme="dark"],
.theme-preview[data-theme="parchment"][data-theme-mode="dark"] {
	--os-primary: #D9BC84;
	--os-primary-hover: #E5CB9B;
	--os-primary-light: #3A2F1A;
	--os-primary-dark: #C0A468;
	--os-gradient-start: #D9BC84;
	--os-gradient-end: #8A6B38;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #E08560;
	--os-accent-hover: #EA9B7B;

	--os-background: #16110A;
	--os-surface: #201910;
	--os-surface-variant: #292013;
	--os-surface-elevated: #322817;

	--os-text-primary: #F0E4C8;
	--os-text-secondary: #C7B694;
	--os-text-tertiary: #9C8C6C;
	--os-text-on-primary: #241A0C;
	--os-text-on-dark: #F0E4C8;

	--os-border: #40351F;
	--os-border-light: #322817;
	--os-border-focus: #D9BC84;

	--os-success: #A4C462;
	--os-success-light: #26300F;
	--os-error: #FF9273;
	--os-error-light: #3C1E14;
	--os-warning: #EEC463;
	--os-warning-light: #3A2E10;
	--os-info: #8FB0E8;

	--os-star-filled: #EEC463;
	--os-star-empty: #453A22;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(8, 6, 2, 0.72);
	--os-overlay-light: rgba(8, 6, 2, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(4, 3, 0, 0.45), 0 2px 8px rgba(4, 3, 0, 0.35);
	--os-shadow-md: 0 2px 4px rgba(4, 3, 0, 0.5), 0 8px 24px rgba(4, 3, 0, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(4, 3, 0, 0.55), 0 16px 48px rgba(4, 3, 0, 0.55);

	--os-glass-bg: rgba(32, 25, 16, 0.55);
	--os-glass-bg-strong: rgba(32, 25, 16, 0.72);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(240, 228, 200, 0.09);
	--os-glass-highlight: inset 0 1px 0 rgba(240, 228, 200, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(4, 3, 0, 0.6), 0 32px 80px rgba(4, 3, 0, 0.65);
	--os-glow-primary: 0 0 24px rgba(217, 188, 132, 0.3);
	--os-glow-accent: 0 0 24px rgba(224, 133, 96, 0.28);

	--os-focus-ring-color: #D9BC84;

	color-scheme: dark;
}

/* ══ QUILL — classic ink-blue on cream ══ */

/* Fountain pen: blue-black ink on cream stock, a brass nib. */
html[data-ui="v2"][data-theme="quill"],
html[data-ui="v2"][data-theme="quill"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="quill"] [data-theme="light"],
.theme-preview[data-theme="quill"][data-theme-mode="light"] {
	--os-primary: #1E4468;
	--os-primary-hover: #173854;
	--os-primary-light: #E2EAF2;
	--os-primary-dark: #12314E;
	--os-gradient-start: #23507A;
	--os-gradient-end: #122E48;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #8F6E1F;
	--os-accent-hover: #7C5E18;

	--os-background: #FAF6EB;
	--os-surface: #FFFDF6;
	--os-surface-variant: #F1EBD8;
	--os-surface-elevated: #FFFDF6;

	--os-text-primary: #14202E;
	--os-text-secondary: #42536A;
	--os-text-tertiary: #5E6F86;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #EAE4D2;

	--os-border: #E4DCC8;
	--os-border-light: #EEE8D6;
	--os-border-focus: #1E4468;

	--os-success: #22704E;
	--os-success-light: #DEF0E4;
	--os-error: #B03A30;
	--os-error-light: #F8E5E2;
	--os-warning: #8E6608;
	--os-warning-light: #F6ECD2;
	--os-info: #2C5FA8;

	--os-star-filled: #BE8E1E;
	--os-star-empty: #DCD4BE;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(12, 20, 30, 0.55);
	--os-overlay-light: rgba(12, 20, 30, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(20, 32, 46, 0.05), 0 2px 8px rgba(20, 32, 46, 0.05);
	--os-shadow-md: 0 2px 4px rgba(20, 32, 46, 0.06), 0 8px 24px rgba(20, 32, 46, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(20, 32, 46, 0.07), 0 16px 48px rgba(20, 32, 46, 0.14);

	--os-glass-bg: rgba(255, 253, 246, 0.62);
	--os-glass-bg-strong: rgba(255, 253, 246, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(20, 32, 46, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(20, 32, 46, 0.10), 0 32px 80px rgba(20, 32, 46, 0.18);
	--os-glow-primary: 0 8px 24px rgba(30, 68, 104, 0.2);
	--os-glow-accent: 0 8px 24px rgba(143, 110, 31, 0.18);

	--os-focus-ring-color: #1E4468;

	color-scheme: light;
}

/* Midnight ink: cream type in an inkwell-blue night. */
html[data-ui="v2"][data-theme="quill"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="quill"] [data-theme="dark"],
.theme-preview[data-theme="quill"][data-theme-mode="dark"] {
	--os-primary: #8FB8E4;
	--os-primary-hover: #A6C7EC;
	--os-primary-light: #1E3348;
	--os-primary-dark: #6E9CC9;
	--os-gradient-start: #8FB8E4;
	--os-gradient-end: #3A6890;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #D9B25A;
	--os-accent-hover: #E4C176;

	--os-background: #0D1320;
	--os-surface: #141E2C;
	--os-surface-variant: #1A2738;
	--os-surface-elevated: #213042;

	--os-text-primary: #EAE4D2;
	--os-text-secondary: #C2BCAA;
	--os-text-tertiary: #94937E;
	--os-text-on-primary: #0D1B2A;
	--os-text-on-dark: #EAE4D2;

	--os-border: #2A3A4E;
	--os-border-light: #22303F;
	--os-border-focus: #8FB8E4;

	--os-success: #4CC896;
	--os-success-light: #0F3324;
	--os-error: #FF8A78;
	--os-error-light: #3A1B18;
	--os-warning: #E9BC55;
	--os-warning-light: #34290F;
	--os-info: #86AEE8;

	--os-star-filled: #E9BC55;
	--os-star-empty: #33424F;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(4, 8, 14, 0.72);
	--os-overlay-light: rgba(4, 8, 14, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(2, 5, 9, 0.45), 0 2px 8px rgba(2, 5, 9, 0.35);
	--os-shadow-md: 0 2px 4px rgba(2, 5, 9, 0.5), 0 8px 24px rgba(2, 5, 9, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(2, 5, 9, 0.55), 0 16px 48px rgba(2, 5, 9, 0.55);

	--os-glass-bg: rgba(20, 30, 44, 0.55);
	--os-glass-bg-strong: rgba(20, 30, 44, 0.72);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(234, 228, 210, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(234, 228, 210, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(2, 5, 9, 0.6), 0 32px 80px rgba(2, 5, 9, 0.65);
	--os-glow-primary: 0 0 24px rgba(143, 184, 228, 0.3);
	--os-glow-accent: 0 0 24px rgba(217, 178, 90, 0.28);

	--os-focus-ring-color: #8FB8E4;

	color-scheme: dark;
}

/* ══ AETHER — ethereal cyan-lavender, the glass showcase ══ */

/* Morning mist: periwinkle ink in icy light; glass turns thinner
 * and blurrier here than anywhere else (alphas down, blur up) —
 * still zero new backdrop-filter rules, tokens only. */
html[data-ui="v2"][data-theme="aether"],
html[data-ui="v2"][data-theme="aether"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="aether"] [data-theme="light"],
.theme-preview[data-theme="aether"][data-theme-mode="light"] {
	--os-primary: #5450D6;
	--os-primary-hover: #4643C0;
	--os-primary-light: #E8E8FB;
	--os-primary-dark: #3B38A8;
	--os-gradient-start: #5450D6;
	--os-gradient-end: #2F5EB8;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #0A8FB0;
	--os-accent-hover: #0B7D9A;

	--os-background: #F3F5FB;
	--os-surface: #FDFDFF;
	--os-surface-variant: #E9EDF8;
	--os-surface-elevated: #FFFFFF;

	--os-text-primary: #191830;
	--os-text-secondary: #4B4A68;
	--os-text-tertiary: #64648C;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #EDF0FB;

	--os-border: #DEE2F0;
	--os-border-light: #E9ECF6;
	--os-border-focus: #5450D6;

	--os-success: #0E8070;
	--os-success-light: #DDF4EF;
	--os-error: #CC4258;
	--os-error-light: #FBE6EA;
	--os-warning: #91680A;
	--os-warning-light: #F8F0DA;
	--os-info: #3E6AE0;

	--os-star-filled: #E0A23A;
	--os-star-empty: #D6DAE8;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(12, 12, 28, 0.5);
	--os-overlay-light: rgba(12, 12, 28, 0.32);

	--os-shadow-sm: 0 1px 2px rgba(25, 24, 48, 0.04), 0 2px 8px rgba(25, 24, 48, 0.05);
	--os-shadow-md: 0 2px 4px rgba(25, 24, 48, 0.05), 0 8px 24px rgba(25, 24, 48, 0.08);
	--os-shadow-lg: 0 4px 8px rgba(25, 24, 48, 0.06), 0 16px 48px rgba(25, 24, 48, 0.13);

	--os-glass-bg: rgba(255, 255, 255, 0.45);
	--os-glass-bg-strong: rgba(255, 255, 255, 0.66);
	--os-glass-blur: 28px;
	--os-glass-border: rgba(84, 80, 214, 0.14);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.75);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(25, 24, 48, 0.09), 0 32px 80px rgba(25, 24, 48, 0.16);
	--os-glow-primary: 0 8px 24px rgba(84, 80, 214, 0.22);
	--os-glow-accent: 0 8px 24px rgba(10, 143, 176, 0.2);

	--os-focus-ring-color: #5450D6;

	color-scheme: light;
}

/* Aurora veil: lavender light through cyan glass on deep indigo. */
html[data-ui="v2"][data-theme="aether"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="aether"] [data-theme="dark"],
.theme-preview[data-theme="aether"][data-theme-mode="dark"] {
	--os-primary: #96A0FF;
	--os-primary-hover: #ACB4FF;
	--os-primary-light: #232A52;
	--os-primary-dark: #7580E8;
	--os-gradient-start: #8F9DFF;
	--os-gradient-end: #3ECBDD;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #46DCE8;
	--os-accent-hover: #6AE5EE;

	--os-background: #0A0D1C;
	--os-surface: #121627;
	--os-surface-variant: #181D33;
	--os-surface-elevated: #1E2440;

	--os-text-primary: #EDF0FB;
	--os-text-secondary: #B7BCDC;
	--os-text-tertiary: #8B90B4;
	--os-text-on-primary: #0E1230;
	--os-text-on-dark: #EDF0FB;

	--os-border: #272E52;
	--os-border-light: #1F2542;
	--os-border-focus: #96A0FF;

	--os-success: #3EDCB4;
	--os-success-light: #0D3A30;
	--os-error: #FF8296;
	--os-error-light: #3C1826;
	--os-warning: #FFC55E;
	--os-warning-light: #382C10;
	--os-info: #7FB2FF;

	--os-star-filled: #FFC55E;
	--os-star-empty: #333A5E;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(5, 7, 16, 0.66);
	--os-overlay-light: rgba(5, 7, 16, 0.44);

	--os-shadow-sm: 0 1px 2px rgba(2, 3, 9, 0.4), 0 2px 8px rgba(2, 3, 9, 0.3);
	--os-shadow-md: 0 2px 4px rgba(2, 3, 9, 0.45), 0 8px 24px rgba(2, 3, 9, 0.4);
	--os-shadow-lg: 0 4px 8px rgba(2, 3, 9, 0.5), 0 16px 48px rgba(2, 3, 9, 0.5);

	--os-glass-bg: rgba(18, 22, 39, 0.42);
	--os-glass-bg-strong: rgba(18, 22, 39, 0.62);
	--os-glass-blur: 28px;
	--os-glass-border: rgba(150, 160, 255, 0.16);
	--os-glass-highlight: inset 0 1px 0 rgba(190, 200, 255, 0.12);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(2, 3, 9, 0.55), 0 32px 80px rgba(2, 3, 9, 0.6);
	--os-glow-primary: 0 0 24px rgba(150, 160, 255, 0.45);
	--os-glow-accent: 0 0 24px rgba(70, 220, 232, 0.35);

	--os-focus-ring-color: #96A0FF;

	color-scheme: dark;
}

/* ══ CRIMSON — deep red & ember, dramatic ══ */

/* Daylight manuscript: blood-red ink on smoked paper. */
html[data-ui="v2"][data-theme="crimson"],
html[data-ui="v2"][data-theme="crimson"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="crimson"] [data-theme="light"],
.theme-preview[data-theme="crimson"][data-theme-mode="light"] {
	--os-primary: #9A1B23;
	--os-primary-hover: #841219;
	--os-primary-light: #F5DEDD;
	--os-primary-dark: #6E0F14;
	--os-gradient-start: #A32028;
	--os-gradient-end: #520A0E;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #A4491A;
	--os-accent-hover: #8F3D13;

	--os-background: #F0EAE2;
	--os-surface: #FAF6F0;
	--os-surface-variant: #E6DED0;
	--os-surface-elevated: #FCF9F4;

	--os-text-primary: #1E1412;
	--os-text-secondary: #52443E;
	--os-text-tertiary: #6F5F58;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F4E3D8;

	--os-border: #DFD5C6;
	--os-border-light: #E9E1D4;
	--os-border-focus: #9A1B23;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #D8CDBC;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(20, 10, 8, 0.55);
	--os-overlay-light: rgba(20, 10, 8, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(30, 20, 18, 0.06), 0 2px 8px rgba(30, 20, 18, 0.05);
	--os-shadow-md: 0 2px 4px rgba(30, 20, 18, 0.07), 0 8px 24px rgba(30, 20, 18, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(30, 20, 18, 0.08), 0 16px 48px rgba(30, 20, 18, 0.14);

	--os-glass-bg: rgba(250, 246, 240, 0.62);
	--os-glass-bg-strong: rgba(250, 246, 240, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(30, 20, 18, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(30, 20, 18, 0.11), 0 32px 80px rgba(30, 20, 18, 0.18);
	--os-glow-primary: 0 8px 24px rgba(154, 27, 35, 0.2);
	--os-glow-accent: 0 8px 24px rgba(164, 73, 26, 0.18);

	--os-focus-ring-color: #9A1B23;

	color-scheme: light;
}

/* Embers: the candle just blew out — heat still in the walls. */
html[data-ui="v2"][data-theme="crimson"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="crimson"] [data-theme="dark"],
.theme-preview[data-theme="crimson"][data-theme-mode="dark"] {
	--os-primary: #E86452;
	--os-primary-hover: #EF7D6C;
	--os-primary-light: #3C1B16;
	--os-primary-dark: #C74534;
	--os-gradient-start: #E86452;
	--os-gradient-end: #8E1F1A;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #E8A050;
	--os-accent-hover: #EFB36C;

	--os-background: #120808;
	--os-surface: #1C0F0E;
	--os-surface-variant: #251413;
	--os-surface-elevated: #2E1A18;

	--os-text-primary: #F4E3D8;
	--os-text-secondary: #CCAF9F;
	--os-text-tertiary: #A08578;
	--os-text-on-primary: #240A06;
	--os-text-on-dark: #F4E3D8;

	--os-border: #442622;
	--os-border-light: #331B18;
	--os-border-focus: #E86452;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #4C2E28;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(8, 3, 2, 0.76);
	--os-overlay-light: rgba(8, 3, 2, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(5, 1, 1, 0.45), 0 2px 8px rgba(5, 1, 1, 0.35);
	--os-shadow-md: 0 2px 4px rgba(5, 1, 1, 0.5), 0 8px 24px rgba(5, 1, 1, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(5, 1, 1, 0.55), 0 16px 48px rgba(5, 1, 1, 0.55);

	--os-glass-bg: rgba(28, 15, 14, 0.55);
	--os-glass-bg-strong: rgba(28, 15, 14, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(244, 227, 216, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(244, 227, 216, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(5, 1, 1, 0.6), 0 32px 80px rgba(5, 1, 1, 0.65);
	--os-glow-primary: 0 0 24px rgba(232, 100, 82, 0.4);
	--os-glow-accent: 0 0 24px rgba(232, 160, 80, 0.32);

	--os-focus-ring-color: #E86452;

	color-scheme: dark;
}

/* ══ LEGEND — Fantasy epic. Daybreak battlefield. ══ */
html[data-ui="v2"][data-theme="legend"],
html[data-ui="v2"][data-theme="legend"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="legend"] [data-theme="light"],
.theme-preview[data-theme="legend"][data-theme-mode="light"] {
	--os-primary: #1F6B3C;
	--os-primary-hover: #175430;
	--os-primary-light: #DCEDE0;
	--os-primary-dark: #114327;
	--os-gradient-start: #2E7D46;
	--os-gradient-end: #123A22;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #8F6F1F;
	--os-accent-hover: #7A5E17;

	--os-background: #EEF3EC;
	--os-surface: #F7FAF5;
	--os-surface-variant: #DFE9DC;
	--os-surface-elevated: #FBFDF9;

	--os-text-primary: #14201A;
	--os-text-secondary: #3E5247;
	--os-text-tertiary: #566A5E;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #E6F2E4;

	--os-border: #D2DECE;
	--os-border-light: #E2EADD;
	--os-border-focus: #1F6B3C;

	--os-success: #2F6E44;
	--os-success-light: #DFEEDD;
	--os-error: #A93B2A;
	--os-error-light: #F7E2DC;
	--os-warning: #74570A;
	--os-warning-light: #F1E9CE;
	--os-info: #33589E;

	--os-star-filled: #8F6F1F;
	--os-star-empty: #CDD8C8;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(12, 20, 14, 0.55);
	--os-overlay-light: rgba(12, 20, 14, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(16, 26, 18, 0.06), 0 2px 8px rgba(16, 26, 18, 0.05);
	--os-shadow-md: 0 2px 4px rgba(16, 26, 18, 0.07), 0 8px 24px rgba(16, 26, 18, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(16, 26, 18, 0.08), 0 16px 48px rgba(16, 26, 18, 0.14);

	--os-glass-bg: rgba(247, 250, 245, 0.62);
	--os-glass-bg-strong: rgba(247, 250, 245, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(16, 26, 18, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 252, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(16, 26, 18, 0.11), 0 32px 80px rgba(16, 26, 18, 0.18);
	--os-glow-primary: 0 8px 24px rgba(31, 107, 60, 0.2);
	--os-glow-accent: 0 8px 24px rgba(143, 111, 31, 0.18);

	--os-focus-ring-color: #1F6B3C;

	color-scheme: light;
}

/* Dusk battlefield — the banner still catches the last light. */
html[data-ui="v2"][data-theme="legend"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="legend"] [data-theme="dark"],
.theme-preview[data-theme="legend"][data-theme-mode="dark"] {
	--os-primary: #57C77F;
	--os-primary-hover: #6ED892;
	--os-primary-light: #16341F;
	--os-primary-dark: #3AA663;
	--os-gradient-start: #57C77F;
	--os-gradient-end: #1C5A34;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #E0B75A;
	--os-accent-hover: #EAC776;

	--os-background: #0B140E;
	--os-surface: #121F16;
	--os-surface-variant: #182A1D;
	--os-surface-elevated: #1F3324;

	--os-text-primary: #E6F2E4;
	--os-text-secondary: #ABC4AB;
	--os-text-tertiary: #83A489;
	--os-text-on-primary: #0A2413;
	--os-text-on-dark: #E6F2E4;

	--os-border: #2C4433;
	--os-border-light: #1E3325;
	--os-border-focus: #57C77F;

	--os-success: #6FD495;
	--os-success-light: #10331E;
	--os-error: #FF9282;
	--os-error-light: #3C1A14;
	--os-warning: #EFC168;
	--os-warning-light: #3A2E10;
	--os-info: #8FB4EE;

	--os-star-filled: #EFC168;
	--os-star-empty: #33493A;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(4, 8, 5, 0.76);
	--os-overlay-light: rgba(4, 8, 5, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(2, 5, 3, 0.45), 0 2px 8px rgba(2, 5, 3, 0.35);
	--os-shadow-md: 0 2px 4px rgba(2, 5, 3, 0.5), 0 8px 24px rgba(2, 5, 3, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(2, 5, 3, 0.55), 0 16px 48px rgba(2, 5, 3, 0.55);

	--os-glass-bg: rgba(18, 31, 22, 0.55);
	--os-glass-bg-strong: rgba(18, 31, 22, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(230, 242, 228, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(230, 242, 228, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(2, 5, 3, 0.6), 0 32px 80px rgba(2, 5, 3, 0.65);
	--os-glow-primary: 0 0 24px rgba(87, 199, 127, 0.4);
	--os-glow-accent: 0 0 24px rgba(224, 183, 90, 0.32);

	--os-focus-ring-color: #57C77F;

	color-scheme: dark;
}

/* ══ HIGH-CONTRAST — maximum legibility. No gradients, no glass, no motion. ══ */
html[data-ui="v2"][data-theme="high-contrast"],
html[data-ui="v2"][data-theme="high-contrast"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="high-contrast"] [data-theme="light"],
.theme-preview[data-theme="high-contrast"][data-theme-mode="light"] {
	--os-primary: #0000C0;
	--os-primary-hover: #000090;
	--os-primary-light: #E8E8FF;
	--os-primary-dark: #000078;
	--os-gradient-start: #0000C0;
	--os-gradient-end: #0000C0;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #6B0080;
	--os-accent-hover: #550066;

	--os-background: #FFFFFF;
	--os-surface: #FFFFFF;
	--os-surface-variant: #F2F2F2;
	--os-surface-elevated: #FFFFFF;

	--os-text-primary: #000000;
	--os-text-secondary: #1A1A1A;
	--os-text-tertiary: #2E2E2E;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #FFFFFF;

	--os-border: #000000;
	--os-border-light: #333333;
	--os-border-focus: #0000C0;

	--os-success: #0B4F0B;
	--os-success-light: #E4F2E4;
	--os-error: #990000;
	--os-error-light: #FCE8E8;
	--os-warning: #5C4400;
	--os-warning-light: #F5EDD6;
	--os-info: #17357F;

	--os-star-filled: #5C4400;
	--os-star-empty: #4A4A4A;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(0, 0, 0, 0.85);
	--os-overlay-light: rgba(0, 0, 0, 0.7);

	--os-shadow-sm: none;
	--os-shadow-md: none;
	--os-shadow-lg: none;

	--os-glass-bg: #FFFFFF;
	--os-glass-bg-strong: #FFFFFF;
	--os-glass-blur: 0px;
	--os-glass-border: #000000;
	--os-glass-highlight: none;

	--os-elevation-1: none;
	--os-elevation-2: none;
	--os-elevation-3: none;
	--os-elevation-4: none;
	--os-glow-primary: none;
	--os-glow-accent: none;

	--os-focus-ring-color: #0000C0;

	color-scheme: light;
}

/* White on black. Cool accents kept bright for AAA. */
html[data-ui="v2"][data-theme="high-contrast"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="high-contrast"] [data-theme="dark"],
.theme-preview[data-theme="high-contrast"][data-theme-mode="dark"] {
	--os-primary: #99C2FF;
	--os-primary-hover: #B3D1FF;
	--os-primary-light: #0A1A33;
	--os-primary-dark: #7FB0F5;
	--os-gradient-start: #99C2FF;
	--os-gradient-end: #99C2FF;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #F5C2FF;
	--os-accent-hover: #F9D6FF;

	--os-background: #000000;
	--os-surface: #000000;
	--os-surface-variant: #141414;
	--os-surface-elevated: #000000;

	--os-text-primary: #FFFFFF;
	--os-text-secondary: #EDEDED;
	--os-text-tertiary: #D6D6D6;
	--os-text-on-primary: #000000;
	--os-text-on-dark: #FFFFFF;

	--os-border: #FFFFFF;
	--os-border-light: #CCCCCC;
	--os-border-focus: #99C2FF;

	--os-success: #7FE39B;
	--os-success-light: #0A2913;
	--os-error: #FFA9A0;
	--os-error-light: #330A06;
	--os-warning: #FFD75E;
	--os-warning-light: #332A08;
	--os-info: #99C2FF;

	--os-star-filled: #FFD75E;
	--os-star-empty: #6E6E6E;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(0, 0, 0, 0.9);
	--os-overlay-light: rgba(0, 0, 0, 0.75);

	--os-shadow-sm: none;
	--os-shadow-md: none;
	--os-shadow-lg: none;

	--os-glass-bg: #000000;
	--os-glass-bg-strong: #000000;
	--os-glass-blur: 0px;
	--os-glass-border: #FFFFFF;
	--os-glass-highlight: none;

	--os-elevation-1: none;
	--os-elevation-2: none;
	--os-elevation-3: none;
	--os-elevation-4: none;
	--os-glow-primary: none;
	--os-glow-accent: none;

	--os-focus-ring-color: #99C2FF;

	color-scheme: dark;
}

/* ══ CHRISTMAS — holly red & pine, warm candlelight ══ */

/* Christmas morning: holly-red ink on warm cream card stock. */
html[data-ui="v2"][data-theme="christmas"],
html[data-ui="v2"][data-theme="christmas"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="christmas"] [data-theme="light"],
.theme-preview[data-theme="christmas"][data-theme-mode="light"] {
	--os-primary: #B3282D;
	--os-primary-hover: #9F1D22;
	--os-primary-light: #F4DEDF;
	--os-primary-dark: #89191D;
	--os-gradient-start: #BB2E33;
	--os-gradient-end: #6F1316;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #1F6B3C;
	--os-accent-hover: #17572F;

	--os-background: #F3F0EA;
	--os-surface: #FBF9F4;
	--os-surface-variant: #E8E3D8;
	--os-surface-elevated: #FDFCF8;

	--os-text-primary: #1E1512;
	--os-text-secondary: #52433E;
	--os-text-tertiary: #6F5E58;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F0EFE6;

	--os-border: #E1DBCE;
	--os-border-light: #ECE7DD;
	--os-border-focus: #B3282D;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #E1DBCE;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(13, 20, 16, 0.55);
	--os-overlay-light: rgba(13, 20, 16, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(30, 21, 18, 0.06), 0 2px 8px rgba(30, 21, 18, 0.05);
	--os-shadow-md: 0 2px 4px rgba(30, 21, 18, 0.07), 0 8px 24px rgba(30, 21, 18, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(30, 21, 18, 0.08), 0 16px 48px rgba(30, 21, 18, 0.14);

	--os-glass-bg: rgba(251, 249, 244, 0.62);
	--os-glass-bg-strong: rgba(251, 249, 244, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(30, 21, 18, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(30, 21, 18, 0.11), 0 32px 80px rgba(30, 21, 18, 0.18);
	--os-glow-primary: 0 8px 24px rgba(179, 40, 45, 0.2);
	--os-glow-accent: 0 8px 24px rgba(31, 107, 60, 0.18);

	--os-focus-ring-color: #B3282D;

	color-scheme: light;
}

/* Christmas Eve: embers and fairy lights against deep pine dark. */
html[data-ui="v2"][data-theme="christmas"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="christmas"] [data-theme="dark"],
.theme-preview[data-theme="christmas"][data-theme-mode="dark"] {
	--os-primary: #E8574F;
	--os-primary-hover: #EF7069;
	--os-primary-light: #3C1816;
	--os-primary-dark: #C53B33;
	--os-gradient-start: #E8574F;
	--os-gradient-end: #8B1F19;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #57C77F;
	--os-accent-hover: #6FD292;

	--os-background: #0D1410;
	--os-surface: #152018;
	--os-surface-variant: #19261F;
	--os-surface-elevated: #1E2F25;

	--os-text-primary: #F0EFE6;
	--os-text-secondary: #C4C2B1;
	--os-text-tertiary: #9A9888;
	--os-text-on-primary: #160908;
	--os-text-on-dark: #F0EFE6;

	--os-border: #2C4035;
	--os-border-light: #213128;
	--os-border-focus: #E8574F;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #2C4035;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(6, 9, 7, 0.76);
	--os-overlay-light: rgba(6, 9, 7, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(6, 9, 7, 0.45), 0 2px 8px rgba(6, 9, 7, 0.35);
	--os-shadow-md: 0 2px 4px rgba(6, 9, 7, 0.5), 0 8px 24px rgba(6, 9, 7, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(6, 9, 7, 0.55), 0 16px 48px rgba(6, 9, 7, 0.55);

	--os-glass-bg: rgba(21, 32, 24, 0.55);
	--os-glass-bg-strong: rgba(21, 32, 24, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(240, 239, 230, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(240, 239, 230, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(6, 9, 7, 0.6), 0 32px 80px rgba(6, 9, 7, 0.65);
	--os-glow-primary: 0 0 24px rgba(232, 87, 79, 0.4);
	--os-glow-accent: 0 0 24px rgba(87, 199, 127, 0.32);

	--os-focus-ring-color: #E8574F;

	color-scheme: dark;
}

/* ══ NEW YEAR — midnight & champagne, celebratory countdown ══ */

/* Countdown morning: midnight-blue ink on champagne-white card. */
html[data-ui="v2"][data-theme="new-year"],
html[data-ui="v2"][data-theme="new-year"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="new-year"] [data-theme="light"],
.theme-preview[data-theme="new-year"][data-theme-mode="light"] {
	--os-primary: #28418F;
	--os-primary-hover: #1E347A;
	--os-primary-light: #DFE4F3;
	--os-primary-dark: #192C66;
	--os-gradient-start: #2D4797;
	--os-gradient-end: #11204C;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #8A6A14;
	--os-accent-hover: #74580E;

	--os-background: #EEF0F6;
	--os-surface: #F8F9FC;
	--os-surface-variant: #DCE0EC;
	--os-surface-elevated: #FCFDFE;

	--os-text-primary: #131722;
	--os-text-secondary: #3F4556;
	--os-text-tertiary: #596073;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #E9ECF6;

	--os-border: #D2D6E5;
	--os-border-light: #E0E4EF;
	--os-border-focus: #28418F;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #D2D6E5;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(9, 11, 20, 0.55);
	--os-overlay-light: rgba(9, 11, 20, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(19, 23, 34, 0.06), 0 2px 8px rgba(19, 23, 34, 0.05);
	--os-shadow-md: 0 2px 4px rgba(19, 23, 34, 0.07), 0 8px 24px rgba(19, 23, 34, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(19, 23, 34, 0.08), 0 16px 48px rgba(19, 23, 34, 0.14);

	--os-glass-bg: rgba(248, 249, 252, 0.62);
	--os-glass-bg-strong: rgba(248, 249, 252, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(19, 23, 34, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(19, 23, 34, 0.11), 0 32px 80px rgba(19, 23, 34, 0.18);
	--os-glow-primary: 0 8px 24px rgba(40, 65, 143, 0.2);
	--os-glow-accent: 0 8px 24px rgba(138, 106, 20, 0.18);

	--os-focus-ring-color: #28418F;

	color-scheme: light;
}

/* Midnight strikes: champagne fireworks against a deep-blue sky. */
html[data-ui="v2"][data-theme="new-year"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="new-year"] [data-theme="dark"],
.theme-preview[data-theme="new-year"][data-theme-mode="dark"] {
	--os-primary: #8FA8EE;
	--os-primary-hover: #AABDF4;
	--os-primary-light: #17203B;
	--os-primary-dark: #6985D5;
	--os-gradient-start: #8FA8EE;
	--os-gradient-end: #2750C3;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #E0B75A;
	--os-accent-hover: #E8C575;

	--os-background: #090B14;
	--os-surface: #111527;
	--os-surface-variant: #121629;
	--os-surface-elevated: #171C32;

	--os-text-primary: #E9ECF6;
	--os-text-secondary: #B0B7CE;
	--os-text-tertiary: #888EA3;
	--os-text-on-primary: #1C2848;
	--os-text-on-dark: #E9ECF6;

	--os-border: #232A46;
	--os-border-light: #191E35;
	--os-border-focus: #8FA8EE;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #232A46;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(4, 5, 9, 0.76);
	--os-overlay-light: rgba(4, 5, 9, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(4, 5, 9, 0.45), 0 2px 8px rgba(4, 5, 9, 0.35);
	--os-shadow-md: 0 2px 4px rgba(4, 5, 9, 0.5), 0 8px 24px rgba(4, 5, 9, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(4, 5, 9, 0.55), 0 16px 48px rgba(4, 5, 9, 0.55);

	--os-glass-bg: rgba(17, 21, 39, 0.55);
	--os-glass-bg-strong: rgba(17, 21, 39, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(233, 236, 246, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(233, 236, 246, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(4, 5, 9, 0.6), 0 32px 80px rgba(4, 5, 9, 0.65);
	--os-glow-primary: 0 0 24px rgba(143, 168, 238, 0.4);
	--os-glow-accent: 0 0 24px rgba(224, 183, 90, 0.32);

	--os-focus-ring-color: #8FA8EE;

	color-scheme: dark;
}

/* ══ VALENTINE — rose & dusty mauve, tender romance ══ */

/* Daylight love note: rose ink on soft blush paper. */
html[data-ui="v2"][data-theme="valentine"],
html[data-ui="v2"][data-theme="valentine"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="valentine"] [data-theme="light"],
.theme-preview[data-theme="valentine"][data-theme-mode="light"] {
	--os-primary: #A62650;
	--os-primary-hover: #911C42;
	--os-primary-light: #F4DEE5;
	--os-primary-dark: #7C1839;
	--os-gradient-start: #AE2B56;
	--os-gradient-end: #62112C;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #7A4E5E;
	--os-accent-hover: #6A4251;

	--os-background: #F8EDEF;
	--os-surface: #FCF6F7;
	--os-surface-variant: #F0D9DD;
	--os-surface-elevated: #FEFAFB;

	--os-text-primary: #241318;
	--os-text-secondary: #583E46;
	--os-text-tertiary: #765861;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F6E6EC;

	--os-border: #E9CED3;
	--os-border-light: #F2DEE2;
	--os-border-focus: #A62650;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #E9CED3;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(23, 10, 15, 0.55);
	--os-overlay-light: rgba(23, 10, 15, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(36, 19, 24, 0.06), 0 2px 8px rgba(36, 19, 24, 0.05);
	--os-shadow-md: 0 2px 4px rgba(36, 19, 24, 0.07), 0 8px 24px rgba(36, 19, 24, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(36, 19, 24, 0.08), 0 16px 48px rgba(36, 19, 24, 0.14);

	--os-glass-bg: rgba(252, 246, 247, 0.62);
	--os-glass-bg-strong: rgba(252, 246, 247, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(36, 19, 24, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(36, 19, 24, 0.11), 0 32px 80px rgba(36, 19, 24, 0.18);
	--os-glow-primary: 0 8px 24px rgba(166, 38, 80, 0.2);
	--os-glow-accent: 0 8px 24px rgba(122, 78, 94, 0.18);

	--os-focus-ring-color: #A62650;

	color-scheme: light;
}

/* Candlelit evening: rose glow against deep plum dark. */
html[data-ui="v2"][data-theme="valentine"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="valentine"] [data-theme="dark"],
.theme-preview[data-theme="valentine"][data-theme-mode="dark"] {
	--os-primary: #EF7DA0;
	--os-primary-hover: #F598B4;
	--os-primary-light: #3C1622;
	--os-primary-dark: #D5587E;
	--os-gradient-start: #EF7DA0;
	--os-gradient-end: #B9204F;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #D8A0B4;
	--os-accent-hover: #E3B8C7;

	--os-background: #170A0F;
	--os-surface: #221219;
	--os-surface-variant: #2C131D;
	--os-surface-elevated: #361723;

	--os-text-primary: #F6E6EC;
	--os-text-secondary: #CEADB9;
	--os-text-tertiary: #A48490;
	--os-text-on-primary: #3D1622;
	--os-text-on-dark: #F6E6EC;

	--os-border: #492432;
	--os-border-light: #381A25;
	--os-border-focus: #EF7DA0;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #492432;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(10, 4, 7, 0.76);
	--os-overlay-light: rgba(10, 4, 7, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(10, 4, 7, 0.45), 0 2px 8px rgba(10, 4, 7, 0.35);
	--os-shadow-md: 0 2px 4px rgba(10, 4, 7, 0.5), 0 8px 24px rgba(10, 4, 7, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(10, 4, 7, 0.55), 0 16px 48px rgba(10, 4, 7, 0.55);

	--os-glass-bg: rgba(34, 18, 25, 0.55);
	--os-glass-bg-strong: rgba(34, 18, 25, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(246, 230, 236, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(246, 230, 236, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(10, 4, 7, 0.6), 0 32px 80px rgba(10, 4, 7, 0.65);
	--os-glow-primary: 0 0 24px rgba(239, 125, 160, 0.4);
	--os-glow-accent: 0 0 24px rgba(216, 160, 180, 0.32);

	--os-focus-ring-color: #EF7DA0;

	color-scheme: dark;
}

/* ══ CARNIVAL — magenta & teal, festival lights ══ */

/* Parade daylight: magenta ink on warm carnival cream. */
html[data-ui="v2"][data-theme="carnival"],
html[data-ui="v2"][data-theme="carnival"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="carnival"] [data-theme="light"],
.theme-preview[data-theme="carnival"][data-theme-mode="light"] {
	--os-primary: #8E2A8B;
	--os-primary-hover: #791F77;
	--os-primary-light: #F2E0F2;
	--os-primary-dark: #661A63;
	--os-gradient-start: #962F93;
	--os-gradient-end: #4C134A;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #0F6E6B;
	--os-accent-hover: #0A5755;

	--os-background: #F5F0E8;
	--os-surface: #FBF8F2;
	--os-surface-variant: #ECE3D5;
	--os-surface-elevated: #FDFBF6;

	--os-text-primary: #1D141E;
	--os-text-secondary: #4F4151;
	--os-text-tertiary: #6C5B6E;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F1E8F4;

	--os-border: #E5DBCA;
	--os-border-light: #EFE7D9;
	--os-border-focus: #8E2A8B;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #E5DBCA;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(18, 10, 22, 0.55);
	--os-overlay-light: rgba(18, 10, 22, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(29, 20, 30, 0.06), 0 2px 8px rgba(29, 20, 30, 0.05);
	--os-shadow-md: 0 2px 4px rgba(29, 20, 30, 0.07), 0 8px 24px rgba(29, 20, 30, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(29, 20, 30, 0.08), 0 16px 48px rgba(29, 20, 30, 0.14);

	--os-glass-bg: rgba(251, 248, 242, 0.62);
	--os-glass-bg-strong: rgba(251, 248, 242, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(29, 20, 30, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(29, 20, 30, 0.11), 0 32px 80px rgba(29, 20, 30, 0.18);
	--os-glow-primary: 0 8px 24px rgba(142, 42, 139, 0.2);
	--os-glow-accent: 0 8px 24px rgba(15, 110, 107, 0.18);

	--os-focus-ring-color: #8E2A8B;

	color-scheme: light;
}

/* Night parade: neon magenta and teal against deep purple dark. */
html[data-ui="v2"][data-theme="carnival"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="carnival"] [data-theme="dark"],
.theme-preview[data-theme="carnival"][data-theme-mode="dark"] {
	--os-primary: #DD7BD8;
	--os-primary-hover: #E693E1;
	--os-primary-light: #381A36;
	--os-primary-dark: #C059BB;
	--os-gradient-start: #DD7BD8;
	--os-gradient-end: #972E92;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #4FC4C0;
	--os-accent-hover: #67CFCB;

	--os-background: #120A16;
	--os-surface: #1C1224;
	--os-surface-variant: #23132B;
	--os-surface-elevated: #2B1834;

	--os-text-primary: #F1E8F4;
	--os-text-secondary: #C4B1CA;
	--os-text-tertiary: #9A88A0;
	--os-text-on-primary: #2B152A;
	--os-text-on-dark: #F1E8F4;

	--os-border: #3C2448;
	--os-border-light: #2D1A37;
	--os-border-focus: #DD7BD8;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #3C2448;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(8, 4, 10, 0.76);
	--os-overlay-light: rgba(8, 4, 10, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(8, 4, 10, 0.45), 0 2px 8px rgba(8, 4, 10, 0.35);
	--os-shadow-md: 0 2px 4px rgba(8, 4, 10, 0.5), 0 8px 24px rgba(8, 4, 10, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(8, 4, 10, 0.55), 0 16px 48px rgba(8, 4, 10, 0.55);

	--os-glass-bg: rgba(28, 18, 36, 0.55);
	--os-glass-bg-strong: rgba(28, 18, 36, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(241, 232, 244, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(241, 232, 244, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(8, 4, 10, 0.6), 0 32px 80px rgba(8, 4, 10, 0.65);
	--os-glow-primary: 0 0 24px rgba(221, 123, 216, 0.4);
	--os-glow-accent: 0 0 24px rgba(79, 196, 192, 0.32);

	--os-focus-ring-color: #DD7BD8;

	color-scheme: dark;
}

/* ══ EASTER — spring green & lilac, fresh morning ══ */

/* Spring morning: fresh-green ink on soft meadow-white paper. */
html[data-ui="v2"][data-theme="easter"],
html[data-ui="v2"][data-theme="easter"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="easter"] [data-theme="light"],
.theme-preview[data-theme="easter"][data-theme-mode="light"] {
	--os-primary: #4A7A28;
	--os-primary-hover: #3B651E;
	--os-primary-light: #E8F2E0;
	--os-primary-dark: #305218;
	--os-gradient-start: #51832D;
	--os-gradient-end: #213910;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #7A5A9E;
	--os-accent-hover: #6C4E8E;

	--os-background: #F2F5EA;
	--os-surface: #FAFCF4;
	--os-surface-variant: #E6ECD7;
	--os-surface-elevated: #FCFEF8;

	--os-text-primary: #182014;
	--os-text-secondary: #475340;
	--os-text-tertiary: #62705B;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #EEF4E4;

	--os-border: #DEE5CD;
	--os-border-light: #E9EEDC;
	--os-border-focus: #4A7A28;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #DEE5CD;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(15, 20, 10, 0.55);
	--os-overlay-light: rgba(15, 20, 10, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(24, 32, 20, 0.06), 0 2px 8px rgba(24, 32, 20, 0.05);
	--os-shadow-md: 0 2px 4px rgba(24, 32, 20, 0.07), 0 8px 24px rgba(24, 32, 20, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(24, 32, 20, 0.08), 0 16px 48px rgba(24, 32, 20, 0.14);

	--os-glass-bg: rgba(250, 252, 244, 0.62);
	--os-glass-bg-strong: rgba(250, 252, 244, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(24, 32, 20, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(24, 32, 20, 0.11), 0 32px 80px rgba(24, 32, 20, 0.18);
	--os-glow-primary: 0 8px 24px rgba(74, 122, 40, 0.2);
	--os-glow-accent: 0 8px 24px rgba(122, 90, 158, 0.18);

	--os-focus-ring-color: #4A7A28;

	color-scheme: light;
}

/* Spring dusk: pastel green and lilac against deep moss dark. */
html[data-ui="v2"][data-theme="easter"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="easter"] [data-theme="dark"],
.theme-preview[data-theme="easter"][data-theme-mode="dark"] {
	--os-primary: #9CCE6A;
	--os-primary-hover: #ACD880;
	--os-primary-light: #29361D;
	--os-primary-dark: #7CAC4C;
	--os-gradient-start: #9CCE6A;
	--os-gradient-end: #53792D;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #C0A8E4;
	--os-accent-hover: #D3C1ED;

	--os-background: #0F140A;
	--os-surface: #182012;
	--os-surface-variant: #1E2814;
	--os-surface-elevated: #253119;

	--os-text-primary: #EEF4E4;
	--os-text-secondary: #BFCBAC;
	--os-text-tertiary: #96A084;
	--os-text-on-primary: #10150B;
	--os-text-on-dark: #EEF4E4;

	--os-border: #354426;
	--os-border-light: #27341B;
	--os-border-focus: #9CCE6A;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #354426;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(7, 9, 4, 0.76);
	--os-overlay-light: rgba(7, 9, 4, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(7, 9, 4, 0.45), 0 2px 8px rgba(7, 9, 4, 0.35);
	--os-shadow-md: 0 2px 4px rgba(7, 9, 4, 0.5), 0 8px 24px rgba(7, 9, 4, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(7, 9, 4, 0.55), 0 16px 48px rgba(7, 9, 4, 0.55);

	--os-glass-bg: rgba(24, 32, 18, 0.55);
	--os-glass-bg-strong: rgba(24, 32, 18, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(238, 244, 228, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(238, 244, 228, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(7, 9, 4, 0.6), 0 32px 80px rgba(7, 9, 4, 0.65);
	--os-glow-primary: 0 0 24px rgba(156, 206, 106, 0.4);
	--os-glow-accent: 0 0 24px rgba(192, 168, 228, 0.32);

	--os-focus-ring-color: #9CCE6A;

	color-scheme: dark;
}

/* ══ HALLOWEEN — pumpkin & violet, spooky dusk ══ */

/* Autumn afternoon: pumpkin ink on pale gourd-cream paper. */
html[data-ui="v2"][data-theme="halloween"],
html[data-ui="v2"][data-theme="halloween"][data-theme-mode="light"],
html[data-ui="v2"][data-theme="halloween"] [data-theme="light"],
.theme-preview[data-theme="halloween"][data-theme-mode="light"] {
	--os-primary: #B34A0E;
	--os-primary-hover: #9C3D06;
	--os-primary-light: #F8E5DA;
	--os-primary-dark: #843305;
	--os-gradient-start: #BC5013;
	--os-gradient-end: #652602;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #5E3A8E;
	--os-accent-hover: #51307C;

	--os-background: #F2EDE4;
	--os-surface: #FAF6EE;
	--os-surface-variant: #E8E0D2;
	--os-surface-elevated: #FCF9F2;

	--os-text-primary: #201712;
	--os-text-secondary: #54463E;
	--os-text-tertiary: #726157;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F4E9DC;

	--os-border: #E1D8C7;
	--os-border-light: #EBE4D6;
	--os-border-focus: #B34A0E;

	--os-success: #37704A;
	--os-success-light: #E1EEDF;
	--os-error: #B3362B;
	--os-error-light: #F8E3DE;
	--os-warning: #8E5E06;
	--os-warning-light: #F4EAD2;
	--os-info: #3E5BAA;

	--os-star-filled: #C08428;
	--os-star-empty: #E1D8C7;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(18, 12, 8, 0.55);
	--os-overlay-light: rgba(18, 12, 8, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(32, 23, 18, 0.06), 0 2px 8px rgba(32, 23, 18, 0.05);
	--os-shadow-md: 0 2px 4px rgba(32, 23, 18, 0.07), 0 8px 24px rgba(32, 23, 18, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(32, 23, 18, 0.08), 0 16px 48px rgba(32, 23, 18, 0.14);

	--os-glass-bg: rgba(250, 246, 238, 0.62);
	--os-glass-bg-strong: rgba(250, 246, 238, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(32, 23, 18, 0.10);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 252, 248, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(32, 23, 18, 0.11), 0 32px 80px rgba(32, 23, 18, 0.18);
	--os-glow-primary: 0 8px 24px rgba(179, 74, 14, 0.2);
	--os-glow-accent: 0 8px 24px rgba(94, 58, 142, 0.18);

	--os-focus-ring-color: #B34A0E;

	color-scheme: light;
}

/* Trick-or-treat night: pumpkin glow against deep violet dark. */
html[data-ui="v2"][data-theme="halloween"][data-theme-mode="dark"],
html[data-ui="v2"][data-theme="halloween"] [data-theme="dark"],
.theme-preview[data-theme="halloween"][data-theme-mode="dark"] {
	--os-primary: #F08A3C;
	--os-primary-hover: #F69C56;
	--os-primary-light: #3E2614;
	--os-primary-dark: #C46C29;
	--os-gradient-start: #F08A3C;
	--os-gradient-end: #884511;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #A883DE;
	--os-accent-hover: #BB9DE7;

	--os-background: #120C08;
	--os-surface: #1C130C;
	--os-surface-variant: #271A11;
	--os-surface-elevated: #302015;

	--os-text-primary: #F4E9DC;
	--os-text-secondary: #CCB9A3;
	--os-text-tertiary: #A0907C;
	--os-text-on-primary: #0F0905;
	--os-text-on-dark: #F4E9DC;

	--os-border: #443022;
	--os-border-light: #332318;
	--os-border-focus: #F08A3C;

	--os-success: #56C990;
	--os-success-light: #0F3322;
	--os-error: #FF9282;
	--os-error-light: #401A16;
	--os-warning: #F0B855;
	--os-warning-light: #3A2A10;
	--os-info: #8FA8EE;

	--os-star-filled: #F0B855;
	--os-star-empty: #443022;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(8, 5, 4, 0.76);
	--os-overlay-light: rgba(8, 5, 4, 0.52);

	--os-shadow-sm: 0 1px 2px rgba(8, 5, 4, 0.45), 0 2px 8px rgba(8, 5, 4, 0.35);
	--os-shadow-md: 0 2px 4px rgba(8, 5, 4, 0.5), 0 8px 24px rgba(8, 5, 4, 0.45);
	--os-shadow-lg: 0 4px 8px rgba(8, 5, 4, 0.55), 0 16px 48px rgba(8, 5, 4, 0.55);

	--os-glass-bg: rgba(28, 19, 12, 0.55);
	--os-glass-bg-strong: rgba(28, 19, 12, 0.74);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(244, 233, 220, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(244, 233, 220, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(8, 5, 4, 0.6), 0 32px 80px rgba(8, 5, 4, 0.65);
	--os-glow-primary: 0 0 24px rgba(240, 138, 60, 0.4);
	--os-glow-accent: 0 0 24px rgba(168, 131, 222, 0.32);

	--os-focus-ring-color: #F08A3C;

	color-scheme: dark;
}

/* High-contrast component overrides. The promo banner is designed as
   translucent white text over a dark gradient backdrop; high-contrast uses a
   flat primary-coloured gradient, so that assumption breaks. Re-skin the
   banner as a bordered flat surface with token-driven AAA text instead. */
html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 {
	background: var(--os-surface-variant);
	border: 2px solid var(--os-border);
	box-shadow: none;
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__title,
html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__subtitle,
html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__body,
html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__valid-until {
	color: var(--os-text-primary);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__code {
	border: 2px dashed var(--os-border);
	background-color: var(--os-surface);
	color: var(--os-text-primary);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__cta {
	background-color: var(--os-primary);
	color: var(--os-text-on-primary);
	border: 2px solid var(--os-border);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-banner--v2 .promo-banner__cta:hover {
	background-color: var(--os-primary-hover);
	color: var(--os-text-on-primary);
}

/* AuthorAvatar's placeholder paints white initials directly on
   var(--os-gradient) for the missing-avatar case (no art loaded yet, or no
   placeholder art at all) — same flat-gradient failure as the promo banner
   above. Re-skin as a bordered flat surface with token-driven AAA text. */
html[data-ui="v2"][data-theme="high-contrast"] .author-avatar--placeholder {
	background: var(--os-surface-variant);
	border: 2px solid var(--os-border);
}

html[data-ui="v2"][data-theme="high-contrast"] .author-avatar__initials {
	color: var(--os-text-primary);
}

/* PromoDetail's own banner card (Pages/Notifications/PromoDetail.razor.css)
   is a second, page-scoped gradient hero-card with the same white-on-gradient
   assumption as the shared promo banner — re-skin it the same way. */
html[data-ui="v2"][data-theme="high-contrast"] .promo-detail-page__banner {
	background: var(--os-surface-variant);
	border: 2px solid var(--os-border);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-detail-page__banner-subtitle,
html[data-ui="v2"][data-theme="high-contrast"] .promo-detail-page__banner-title {
	color: var(--os-text-primary);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-detail-page__banner-cta {
	background: var(--os-primary);
	color: var(--os-text-on-primary);
	border: 2px solid var(--os-border);
}

html[data-ui="v2"][data-theme="high-contrast"] .promo-detail-page__banner-cta:hover {
	background: var(--os-primary-hover);
	color: var(--os-text-on-primary);
}

/* The v2 cinematic heroes (home HeroBanner, AuthorDetail, story Detail) paint
   their gradient-only fallback backdrop underneath a dark scrim + hard-white
   text, so the text stays readable once real art loads over it. High-contrast
   flattens var(--os-gradient) to a single flat colour, which the scrim alone
   cannot save when no art is set — swap the backdrop layer for the near-black
   overlay token instead; the scrim and hard-white text rules are untouched,
   and once art loads it fully covers this layer anyway. */
html[data-ui="v2"][data-theme="high-contrast"] .hero-banner--v2 .hero-banner__backdrop,
html[data-ui="v2"][data-theme="high-contrast"] .author-hero--v2 .author-hero__backdrop,
html[data-ui="v2"][data-theme="high-contrast"] .story-detail__backdrop {
	background: var(--os-overlay);
}

/* ══ DEFAULT — Theme Studio preview duplicates ══
 * The canonical default palette lives in ui-v2.css; preview tiles for it need
 * a self-contained anchor here because the ui-v2.css blocks are keyed on <html>
 * attributes a tile can't carry. Values below are literal copies of ui-v2.css's
 * light/dark blocks — KEEP IN LOCKSTEP with that file. */
.theme-preview[data-theme="default"][data-theme-mode="light"] {
	--os-primary: #6D4AFF;
	--os-primary-hover: #5B3AE6;
	--os-primary-light: #EDE8FF;
	--os-primary-dark: #4C2FD6;
	--os-gradient-start: #6D4AFF;
	--os-gradient-end: #3E1F9E;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #0E9F85;
	--os-accent-hover: #0C8A73;

	--os-background: #F7F4EE;
	--os-surface: #FFFFFF;
	--os-surface-variant: #F1EDE4;
	--os-surface-elevated: #FFFFFF;

	--os-text-primary: #17141F;
	--os-text-secondary: #4A4458;
	--os-text-tertiary: #6E6880;
	--os-text-on-primary: #FFFFFF;
	--os-text-on-dark: #F2EFF8;

	--os-border: #E4DFD3;
	--os-border-light: #EFEBE1;
	--os-border-focus: #6D4AFF;

	--os-success: #0E7C68;
	--os-success-light: #DFF7F1;
	--os-error: #CC3B3B;
	--os-error-light: #FCE8E8;
	--os-warning: #9A6B00;
	--os-warning-light: #FBF1DC;
	--os-info: #2F6BE4;

	--os-star-filled: #E8A33D;
	--os-star-empty: #D9D3C7;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(13, 11, 22, 0.55);
	--os-overlay-light: rgba(13, 11, 22, 0.35);

	--os-shadow-sm: 0 1px 2px rgba(23, 20, 31, 0.05), 0 2px 8px rgba(23, 20, 31, 0.05);
	--os-shadow-md: 0 2px 4px rgba(23, 20, 31, 0.06), 0 8px 24px rgba(23, 20, 31, 0.09);
	--os-shadow-lg: 0 4px 8px rgba(23, 20, 31, 0.07), 0 16px 48px rgba(23, 20, 31, 0.14);

	--os-glass-bg: rgba(255, 255, 255, 0.62);
	--os-glass-bg-strong: rgba(255, 255, 255, 0.78);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(23, 20, 31, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.6);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(23, 20, 31, 0.10), 0 32px 80px rgba(23, 20, 31, 0.18);
	--os-glow-primary: 0 8px 24px rgba(109, 74, 255, 0.18);
	--os-glow-accent: 0 8px 24px rgba(14, 159, 133, 0.18);

	--os-focus-ring-color: #6D4AFF;

	color-scheme: light;
}

.theme-preview[data-theme="default"][data-theme-mode="dark"] {
	--os-primary: #8B70FF;
	--os-primary-hover: #9D85FF;
	--os-primary-light: #2A2344;
	--os-primary-dark: #6D4AFF;
	--os-gradient-start: #8B70FF;
	--os-gradient-end: #4C2FD6;
	--os-gradient: linear-gradient(135deg, var(--os-gradient-start), var(--os-gradient-end));
	--os-accent: #2BD4B4;
	--os-accent-hover: #4BE0C4;

	--os-background: #0F0D18;
	--os-surface: #171422;
	--os-surface-variant: #1E1A2C;
	--os-surface-elevated: #231E33;

	--os-text-primary: #F2EFF8;
	--os-text-secondary: #B9B2CC;
	--os-text-tertiary: #8D86A6;
	--os-text-on-primary: #14102A;
	--os-text-on-dark: #F2EFF8;

	--os-border: #2C2740;
	--os-border-light: #241F36;
	--os-border-focus: #8B70FF;

	--os-success: #2BD4B4;
	--os-success-light: #123B33;
	--os-error: #FF7A70;
	--os-error-light: #3C1A20;
	--os-warning: #FFB94D;
	--os-warning-light: #3A2B12;
	--os-info: #6E9BFF;

	--os-star-filled: #FFB94D;
	--os-star-empty: #3A3450;
	--os-tab-active: var(--os-primary);
	--os-tab-inactive: var(--os-text-tertiary);
	--os-overlay: rgba(6, 5, 12, 0.72);
	--os-overlay-light: rgba(6, 5, 12, 0.5);

	--os-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.3);
	--os-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.45), 0 8px 24px rgba(0, 0, 0, 0.4);
	--os-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.5), 0 16px 48px rgba(0, 0, 0, 0.5);

	--os-glass-bg: rgba(23, 20, 34, 0.55);
	--os-glass-bg-strong: rgba(23, 20, 34, 0.72);
	--os-glass-blur: 16px;
	--os-glass-border: rgba(255, 255, 255, 0.08);
	--os-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.05);

	--os-elevation-1: var(--os-shadow-sm);
	--os-elevation-2: var(--os-shadow-md);
	--os-elevation-3: var(--os-shadow-lg);
	--os-elevation-4: 0 8px 16px rgba(0, 0, 0, 0.55), 0 32px 80px rgba(0, 0, 0, 0.6);
	--os-glow-primary: 0 0 24px rgba(139, 112, 255, 0.35);
	--os-glow-accent: 0 0 24px rgba(43, 212, 180, 0.3);

	--os-focus-ring-color: #8B70FF;

	color-scheme: dark;
}