/* NOVAS — the v2 colour system.
 *
 * One sheet, three apps: Schema, Deck and Praxis all read their colour from
 * here, so "the red" is a value in one file rather than three that drift. Each
 * app keeps its own metrics (column widths, type scales, the register gutter)
 * next to the rules that use them; only what has to MATCH lives here.
 *
 * Light is the home ground — the design was drawn on paper — and dark is the
 * same block written a second time under html[data-theme="dark"], which
 * out-specifies :root and so wins wherever it lands. Everything downstream
 * that reads a token harmonises for free.
 *
 * The dark reference is the ink, not the paint: Claude's and ChatGPT's dark
 * modes are warm near-black grounds with a three-step surface ramp and text a
 * little under pure white. No pure black, no pure white, no blue-black. It
 * runs on the warm axis the light theme already uses — #F4F2ED is a warm
 * paper and #141311 is its night.
 *
 *   --paper    the page                        darkest in dark, lightest in light
 *   --sunken   a tray, a thead, a quiet band   the middle step either way
 *   --surface  a card                          the other end
 *
 * Three steps, so a tray inside a card reads as recessed and a note box on the
 * bare page reads as raised — from the SAME token, in both themes.
 *
 * The four hues keep their meanings (crimson "the part that changes", ochre
 * Casual, indigo Polite, green) and are relit for a dark ground. Each is
 * chosen to clear 4.5:1 against its OWN tint, not merely against the page: a
 * suffix chip puts red text on --red-bg, and a value picked against the page
 * alone fails there. Body text runs 9.2:1, quiet text 5.1:1.
 */

:root {
    color-scheme: light;

    /* ---- v2 palette ---- */
    --paper:    #F4F2ED;
    --surface:  #FFFFFF;
    --sunken:   #FAF8F4;
    --line-2:   #CDC8BD;

    /* in a sentence: the part that changes */
    --red-bg:   rgba(190, 44, 70, .07);
    --red-ln:   rgba(190, 44, 70, .32);

    /* in the gutter: register */
    /* Darker than it needs to be on white (7.4:1). Several lessons put a
       register chip inside a red-tinted pattern box, where the lighter
       #8A5512 fell to 4.4:1. */
    --casual:    #7A4B10;
    --casual-bg: rgba(138, 85, 18, .09);
    --casual-ln: rgba(138, 85, 18, .34);
    --polite:    #2B4C93;
    --polite-bg: rgba(43, 76, 147, .08);
    --polite-ln: rgba(43, 76, 147, .32);

    --green:    #0E7358;
    --green-bg: rgba(14, 115, 88, .07);
    --green-ln: rgba(14, 115, 88, .28);
    --slate:    #4A5560;

    /* ---- the base stylesheet's own tokens, re-pointed ----
       Everything in style.css and in the lesson <style> blocks that
       reads var(--red) / var(--ink) / var(--border) … harmonises for
       free. This single block does more work than the rest of the
       file put together. */
    /* Text and icons drawn ON a filled accent. White on paper; in dark the
       accents themselves become the light colour, so what sits on them has to
       flip with them or the fill turns into a white-on-pink smear. */
    --on-red:     #FFFFFF;
    --on-ink:     #FFFFFF;
    --on-polite:  #FFFFFF;

    --red:        #BE2C46;
    --red-light:  rgba(190, 44, 70, .07);
    --red-mid:    rgba(190, 44, 70, .32);
    --red-dark:   #A32340;
    --ink:        #16181A;
    --ink-mid:    #3A3E42;
    /* Darker than it looks like it needs to be on white (6.3:1 there). Several
       lessons put muted text and furigana on a tinted card, where the lighter
       #6A6F73 fell to 4.1:1 — under AA. One value that passes on every
       background this palette produces beats a value that passes on paper. */
    --ink-soft:   #5C6165;
    --border:     #E4E0D8;
    --bg:         #F4F2ED;
    --card-bg:    #FFFFFF;
    --radius:     14px;
    --ease:     cubic-bezier(.16, 1, .3, 1);

    /* Headings use no display face at all — just the page's own two text
       faces, one weight heavier.

       Anton came first and carries no kana: six lesson titles and 98 section
       headings contain Japanese, and in all of them the kana dropped to Noto
       at 400, thin and wide inside a heavy condensed face. Zen Kaku Gothic
       New fixed the coverage but brought its own problem — its kana keep a
       calligraphic stroke modulation that reads as handwriting at 900.

       So: no third typeface. Latin comes from Inter and kana from Noto Sans
       JP, which is exactly the pairing already running through every
       paragraph and every Japanese sentence on the page. Two neutral
       grotesques that were built to sit together, at 800 rather than 400–500.
       It also keeps one Latin face across the heading, the body, the rail and
       the lesson numbers. */
    --display: 'Inter', 'Noto Sans JP', system-ui, sans-serif;
    --display-weight: 800;
}

html[data-theme="dark"] {
    color-scheme: dark;

    /* ---- v2 palette ---- */
    --paper:    #141311;
    --surface:  #24221F;
    --sunken:   #1E1D1A;
    --line-2:   #4B4741;

    --red-bg:   rgba(255, 135, 152, .13);
    --red-ln:   rgba(255, 135, 152, .38);

    --casual:    #DBA463;
    --casual-bg: rgba(219, 164, 99, .14);
    --casual-ln: rgba(219, 164, 99, .36);
    --polite:    #8AABE8;
    --polite-bg: rgba(138, 171, 232, .14);
    --polite-ln: rgba(138, 171, 232, .36);

    --green:    #5CC79D;
    --green-bg: rgba(92, 199, 157, .13);
    --green-ln: rgba(92, 199, 157, .34);
    --slate:    #9AA6B2;

    /* on a light accent, whatever sits on it has to go dark */
    --on-red:     #2B1319;
    --on-ink:     #141311;
    --on-polite:  #141B2A;

    /* ---- the base stylesheet's own tokens, re-pointed ---- */
    --red:        #FF8798;
    --red-light:  rgba(255, 135, 152, .13);
    --red-mid:    rgba(255, 135, 152, .38);
    /* the filled red button's hover: on paper it darkens, here it lifts */
    --red-dark:   #FFA3B0;
    --ink:        #F2F0EA;
    --ink-mid:    #C8C4BB;
    /* Lighter than it looks like it needs to be on the page (7.5:1 there).
       Furigana is --ink-soft, and f01/f02 set furigana inside .sb-kanji,
       a --polite-bg tinted card: the darker value fell to 3.9:1 on that
       lift. One value that passes on every background this palette
       produces beats a value that passes on the page. The light theme's
       --ink-soft carries the identical note for the identical reason. */
    --ink-soft:   #A8A39A;
    --border:     #37342F;
    --bg:         #141311;
    --card-bg:    #24221F;
}