/* ============================================================
   Reel theme: shared tokens for the public "reel" pages
   (landing, login, register, Hall of Fame, benchmark, wiki index + article).
   Included through templates/public/partials/reel_theme_head.html.
   These pages are dark only; the logged-in app has its own (light) styling.

   Source of truth: the --reel-* RGB channels. Tailwind maps them as the
   reel-* colours (tailwind.config.js), so markup uses bg-reel-ink,
   text-reel-fg, border-reel-line, bg-reel-blue/10 ... The --lp-* colours the
   existing component CSS (.lp-*, .ls-*, .hf-*, .wk-*) reads are derived from
   the same channels.

   Roles (do not mix them):
   blue / blue2   action fills, strokes, focus rings, glows
   link / link2   blue text and links
   onblue         text on a blue fill (ink)
   orange / amber warnings and findings only, never CTAs
   ============================================================ */

:root {
    color-scheme: dark;
    --reel-ink: 4 7 12;          /* #04070c */
    --reel-ink2: 10 20 34;       /* #0a1422 */
    --reel-ink3: 13 26 43;       /* #0d1a2b */
    --reel-line: 22 38 58;       /* #16263a */
    --reel-line2: 33 54 80;      /* #213650 */
    --reel-dim: 107 127 151;     /* #6b7f97 */
    --reel-mute: 141 160 184;    /* #8da0b8 */
    --reel-soft: 195 208 222;    /* #c3d0de */
    --reel-fg: 238 244 250;      /* #eef4fa */
    --reel-blue: 56 169 228;     /* #38a9e4 */
    --reel-blue2: 143 214 247;   /* #8fd6f7 */
    --reel-link: 56 169 228;     /* #38a9e4 */
    --reel-link2: 143 214 247;   /* #8fd6f7 */
    --reel-onblue: 4 7 12;       /* #04070c */
    --reel-orange: 255 106 26;   /* #ff6a1a */
    --reel-amber: 255 165 58;    /* #ffa53a */
    --reel-warn: 255 210 189;    /* #ffd2bd, warning text */

    --lp-ink: rgb(var(--reel-ink));
    --lp-ink-2: rgb(var(--reel-ink2));
    --lp-ink-3: rgb(var(--reel-ink3));
    --lp-line: rgb(var(--reel-line));
    --lp-line-2: rgb(var(--reel-line2));
    --lp-dim: rgb(var(--reel-dim));
    --lp-mute: rgb(var(--reel-mute));
    --lp-soft: rgb(var(--reel-soft));
    --lp-fg: rgb(var(--reel-fg));
    --lp-blue: rgb(var(--reel-blue));
    --lp-blue-2: rgb(var(--reel-blue2));
    --lp-link: rgb(var(--reel-link));
    --lp-link-2: rgb(var(--reel-link2));
    --lp-on-blue: rgb(var(--reel-onblue));
    --lp-orange: rgb(var(--reel-orange));
    --lp-amber: rgb(var(--reel-amber));
    --lp-warn-text: rgb(var(--reel-warn));
    --lp-warn-bg: rgb(var(--reel-orange) / .08);
    --lp-warn-line: rgb(var(--reel-orange) / .35);
    --lp-focus-ring: rgb(var(--reel-blue) / .25);
    --lp-hover: rgb(var(--reel-ink3) / .7);
    --lp-footer: #060b12;
}

/* Page ground. Overriding body.bg-slate-50 (base.html) needs the explicit pair. */
html, body.bg-slate-50 { background: var(--lp-ink); }
main.flex-grow { background: var(--lp-ink); color: var(--lp-soft); font-family: 'Public Sans', ui-sans-serif, system-ui, sans-serif; }

/* Print (wiki articles, /stats and the rest): paper, not ink. Swap the channels
   to dark-on-white and drop chrome that means nothing on paper. public.css
   already hides the site header and footer. */
@media print {
    :root {
        color-scheme: light;
        --reel-ink: 255 255 255;
        --reel-ink2: 255 255 255;
        --reel-ink3: 241 244 248;
        --reel-line: 214 221 230;
        --reel-line2: 190 200 212;
        --reel-dim: 84 96 112;
        --reel-mute: 60 74 92;
        --reel-soft: 28 38 52;
        --reel-fg: 0 0 0;
        --reel-link: 10 90 140;
        --reel-link2: 10 90 140;
        --reel-orange: 194 65 12;
        --reel-amber: 154 74 6;
        --reel-warn: 154 52 18;
    }
    /* public.css hides every <header> in print; the article head is one */
    header.wk-article-head { display: block !important; background: none !important; }
    canvas, #cookie-notice, #analytics-consent, .wk-rail, .wk-toc-mobile, .wk-article__end, .wk-anchor { display: none !important; }
    .wk-prose pre { white-space: pre-wrap; break-inside: avoid; }
    .wk-prose :is(h2, h3) { break-after: avoid; }
}