/* ZUNVI design tokens: one set for every page, Night (dark, the default) and Dawn (light).
   Visible refresh R1 (docs/design/refresh-2026-11.md §5, prototype docs/design/refresh-prototype.html):
   the site's app.css and the home page's css/home-field.css both read these, so the home page
   and the inner pages look like one product. Meaning and contrast: docs/design/palette.md.
   js/theme-init.js sets html[data-theme] before first paint; without it the page stays Night.
   Motion tokens (--m-*) stay in css/motion.css. */

:root {
    color-scheme: dark;
    --ground: #070a1a;
    --ground-2: #0b1129;
    --panel: #0e1430;
    --panel-2: #141b3d;
    --line: rgba(180, 200, 255, .14);
    --line-strong: rgba(180, 200, 255, .26);
    --ink: #eef2ff;
    --muted: #a3accb;
    --teal: #46e0d6;
    --teal-ink: #06141c;
    --violet: #a98bff;
    --indigo: #5b5bf0;
    --saffron: #f4bc5c;
    /* Saffron as text (ribbons, hiring signals): 11.42:1 on the Night ground, 5.40:1 on Dawn. */
    --saffron-text: #f4bc5c;
    --saffron-ink: #2a1a00;
    --lotus: #f48fb1;
    --teal-soft: rgba(70, 224, 214, .12);
    --violet-soft: rgba(169, 139, 255, .14);
    --saffron-soft: rgba(244, 188, 92, .14);
    --glow-a: rgba(70, 224, 214, .30);
    --glow-b: rgba(169, 139, 255, .26);
    --glow-c: rgba(91, 91, 240, .24);
    --glow-d: rgba(244, 188, 92, .10);
    --contour: rgba(150, 225, 255, .10);
    --header-bg: rgba(7, 10, 26, .94);
    --header-bg-glass: rgba(7, 10, 26, .7);
    --shadow: 0 18px 50px rgba(0, 0, 0, .45);
    --max: 1180px;
}

html[data-theme="light"] {
    color-scheme: light;
    --ground: #f8f4ec;
    --ground-2: #f2ece0;
    --panel: #ffffff;
    --panel-2: #f3eefa;
    --line: rgba(28, 31, 63, .13);
    --line-strong: rgba(28, 31, 63, .24);
    --ink: #1c1f3f;
    --muted: #4d5375;
    --teal: #09716c;
    --teal-ink: #ffffff;
    --violet: #6b46c9;
    --indigo: #4a3fb0;
    --saffron: #f4bc5c;
    --saffron-text: #8a5a00;
    --saffron-ink: #2a1a00;
    --lotus: #a23a6b;
    --teal-soft: rgba(9, 113, 108, .09);
    --violet-soft: rgba(107, 70, 201, .09);
    --saffron-soft: rgba(233, 162, 59, .16);
    --glow-a: rgba(246, 199, 122, .42);
    --glow-b: rgba(167, 139, 250, .24);
    --glow-c: rgba(70, 214, 208, .20);
    --glow-d: rgba(244, 143, 177, .16);
    --contour: rgba(60, 60, 120, .12);
    --header-bg: rgba(248, 244, 236, .95);
    --header-bg-glass: rgba(248, 244, 236, .72);
    --shadow: 0 14px 40px rgba(60, 50, 90, .14);
}

/* Hue classes for art tiles, glyphs and badges (decorative; every count beside them is also text). */
.h-teal { --hue: #46e0d6; --hue-soft: rgba(70, 224, 214, .30); --hue-soft-2: rgba(91, 91, 240, .22); }
.h-violet { --hue: #b9a0ff; --hue-soft: rgba(169, 139, 255, .32); --hue-soft-2: rgba(70, 224, 214, .14); }
.h-saffron { --hue: #f4bc5c; --hue-soft: rgba(244, 188, 92, .30); --hue-soft-2: rgba(244, 143, 177, .16); }
.h-lotus { --hue: #f7a3c2; --hue-soft: rgba(244, 143, 177, .28); --hue-soft-2: rgba(169, 139, 255, .18); }
.h-indigo { --hue: #9aa2ff; --hue-soft: rgba(91, 91, 240, .36); --hue-soft-2: rgba(70, 224, 214, .14); }
html[data-theme="light"] .h-teal { --hue: #09716c; --hue-soft: rgba(70, 214, 208, .26); --hue-soft-2: rgba(246, 199, 122, .28); }
html[data-theme="light"] .h-violet { --hue: #6b46c9; --hue-soft: rgba(167, 139, 250, .30); --hue-soft-2: rgba(246, 199, 122, .22); }
html[data-theme="light"] .h-saffron { --hue: #8a5a00; --hue-soft: rgba(246, 199, 122, .50); --hue-soft-2: rgba(244, 143, 177, .20); }
html[data-theme="light"] .h-lotus { --hue: #a23a6b; --hue-soft: rgba(244, 143, 177, .30); --hue-soft-2: rgba(246, 199, 122, .24); }
html[data-theme="light"] .h-indigo { --hue: #4a3fb0; --hue-soft: rgba(91, 91, 240, .20); --hue-soft-2: rgba(70, 214, 208, .18); }