/* ============================================================
   tokens-v2.css - Glass theme token layer (v2)
   Governs ALL colors, radii, shadows, and type tokens for the
   glass theme. Page content never hardcodes values; it uses
   the tokens below.

   Palette: white page, glass surfaces, ink-slate accent.
   RULE: accent family is ink-slate. No green anywhere.
   Dark variant uses deep navy page, brightened ice accent.
   ============================================================ */
:root {
    /* page */
    --page-bg: #F7F5F2;
    --ink-1: #16203A;
    --ink-2: #4A5A7C;
    --ink-3: #7A88A6;
    /* accent: ink slate */
    --accent: #33415C;
    --accent-hover: #22304A;
    --accent-wash: #EDF0F4;
    --accent-line: #D3DAE3;
    /* surfaces (glass) */
    --glass-fill: rgba(255,255,255,0.65);
    --glass-fill-strong: rgba(255,255,255,0.85);
    --glass-border: rgba(255,255,255,0.92);
    --shadow-glass: 0 8px 32px rgba(22,32,58,0.10), 0 2px 8px rgba(22,32,58,0.06);
    --shadow-glass-hover: 0 14px 44px rgba(22,32,58,0.16);
    /* semantic */
    --color-success: #33415C;
    --color-warning: #B06A18;
    --color-danger: #A93A3A;
    /* callout washes */
    --note-wash: var(--accent-wash);
    --warn-wash: #F7EFE4;
    --danger-wash: #F8EAEA;
    /* chart palette (5 shades, ink family) */
    --chart-1: var(--accent);
    --chart-2: #5C7090;
    --chart-3: #8F9EB4;
    --chart-4: #B4C0CE;
    --chart-5: #D5DCE4;
    /* code */
    --code-bg: rgba(22,32,58,0.05);
    --code-border: var(--accent-line);
    /* radii */
    --radius-xl: 22px;
    --radius-lg: 16px;
    --radius-md: 12px;
    --radius-xs: 6px;
    --radius-pill: 999px;
    /* type */
    --font-serif: "Newsreader", Georgia, serif;
    --font-sans: "Inter", system-ui, -apple-system, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    /* motion */
    --motion-fast: 0.18s ease;
    --motion-med: 0.3s ease;
}
html[data-theme="dark"] {
    --page-bg: #0A1020;
    --ink-1: #E8EDF5;
    --ink-2: #A9B6CF;
    --ink-3: #7A88A6;
    --accent: #C7D2E4;
    --accent-hover: #E1E7F0;
    --accent-wash: #16213A;
    --accent-line: #26334F;
    --glass-fill: rgba(18,28,50,0.55);
    --glass-fill-strong: rgba(24,36,62,0.80);
    --glass-border: rgba(199,210,228,0.16);
    --shadow-glass: 0 8px 32px rgba(0,0,0,0.42), 0 2px 8px rgba(0,0,0,0.32);
    --shadow-glass-hover: 0 14px 44px rgba(0,0,0,0.55);
    --color-success: #C7D2E4;
    --color-warning: #E0A96E;
    --color-danger: #E08A8A;
    --note-wash: var(--accent-wash);
    --warn-wash: #262015;
    --danger-wash: #261717;
    /* chart palette must be redeclared in dark or legacy tokens.css wins */
    --chart-1: var(--accent);
    --chart-2: #8F9EB4;
    --chart-3: #A9B6CF;
    --chart-4: #C7D2E4;
    --chart-5: #E1E7F0;
    --code-bg: rgba(199,210,228,0.08);
    --code-border: var(--accent-line);
}