/* ============================================================================
   ai-aflat — DESIGN TOKENS (single source of truth for all colours)
   Identity „Pânza”. Imported by every page: the landing links this directly,
   the reading pages get it via `@import` at the top of panza.css.
   To reskin the whole site, change values HERE — nowhere else redefines colours.
   Light is the default; dark is applied by prefers-color-scheme OR a manual
   [data-theme="dark"] toggle (which wins over the system preference).
   ============================================================================ */

:root{
  color-scheme:light;

  /* --- surfaces --- */
  --bg:#FBF9F3;                 /* linen ground */
  --flax:#F1ECE1;               /* raised beige bands / cards */
  --surface:#FFFFFF;            /* white bands (press, who-we-are) */
  --card:#FFFFFF;
  --navy:#152438;               /* dark anchor surfaces: numbers, callout, who, footer, reading-page header */
  --navy-text:#F5F1E8;
  --navy-soft:#9FB0C8;
  --line:#E3DCCD;

  /* --- text --- */
  --ink:#152438;
  --ink-soft:#4E5B68;
  --body-text:#33465A;          /* reading-page article body */

  /* --- brand accents --- */
  --red:#B42B30;                /* folk red — accents only, never a CTA */
  --red-text:#B42B30;
  --stitch:rgba(180,43,48,.55);
  --stitch-on-navy:rgba(214,69,74,.65);
  --blue:#1F5FD0;               /* links */
  --cta:#1E56A0;                /* CTA fills — deep tricolor blue, fits the folk theme */
  --cta-hover:#163F70;
  --lex-underline:rgba(31,95,208,.32); /* citation-link underline */

  /* --- folk motif (programmatic; tiles are masks, colour comes from here) --- */
  --motif:rgba(150,44,51,.18);           /* faint field motif (hero) — 10% more transparent */
  --motif-solid:rgba(164,45,50,.82);     /* visible delimiter/border motif */
  --motif-on-navy:rgba(233,224,203,.15); /* beige motif on the dark bands */

  /* --- feedback / form messaging --- */
  --placeholder:#93876F;
  --msg-err:#B42B30;
  --msg-warn:#8A5A00;
  --msg-ok:#1C7A3D;

  /* --- misc --- */
  --shadow:rgba(21,36,56,.14);
  --field-opacity:.05;
  --band-opacity:.14;           /* reading-page pagehead folk band */

  /* --- theme-swapped component bits (landing header, press logos, logo swap) --- */
  --header-bg:rgba(251,249,243,.88);
  --lang-bg:#fff;
  --press-filter:grayscale(1);
  --press-filter-hover:grayscale(0);
  --logo-navy-display:block;    /* navy lockup on light header */
  --logo-white-display:none;

  /* --- hero phone screen (lit in light, dark in dark) --- */
  --p-screen:#FBF9F3; --p-surface:#FFFFFF; --p-ink:#152438; --p-muted:#93876F;
  --p-line:#ECE6D8; --p-bubble:#F1ECE1; --p-bubble-ink:#20303F; --p-field:#F6F2E8;
  --p-user:#152438; --p-accent:#1E56A0;

  /* --- typography (families only; not colours, but shared) --- */
  --disp:'Fraunces',Georgia,'Times New Roman',serif;
  --body-font:'Albert Sans',system-ui,-apple-system,sans-serif;
}

/* ---- dark variant: beige→night. System preference, unless the toggle forces light ---- */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0A1524; --flax:#122240; --surface:#0E1D33; --card:#14273F;
    --navy:#0C1A2E; --navy-text:#F5F1E8; --navy-soft:#9FB0C8; --line:rgba(244,241,233,.12);
    --ink:#F2EFE9; --ink-soft:#A7B6CC; --body-text:#C4CFDC;
    --red:#C1272D; --red-text:#E2646A; --stitch:rgba(214,69,74,.6); --stitch-on-navy:rgba(214,69,74,.65);
    --blue:#6AA0FF; --cta:#2A62BE; --cta-hover:#4A8DFF; --lex-underline:rgba(74,141,255,.4);
    --motif:rgba(224,208,170,.144); --motif-solid:rgba(214,196,156,.66); --motif-on-navy:rgba(233,224,203,.14);
    --placeholder:#8FA0B8; --msg-err:#FF9AA0; --msg-warn:#FFCE6A; --msg-ok:#6EE7A8;
    --shadow:rgba(0,0,0,.45); --field-opacity:.06; --band-opacity:.10;
    --header-bg:rgba(10,21,36,.9); --lang-bg:rgba(255,255,255,.05);
    --press-filter:brightness(0) invert(.86); --press-filter-hover:brightness(0) invert(1);
    --logo-navy-display:none; --logo-white-display:block;
    --p-screen:#0C1826; --p-surface:#132339; --p-ink:#EAF1FB; --p-muted:#8394AC;
    --p-line:rgba(255,255,255,.09); --p-bubble:#1C2E48; --p-bubble-ink:#DCE6F2; --p-field:#15263C;
    --p-user:#2C6FE0; --p-accent:#2A62BE;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0A1524; --flax:#122240; --surface:#0E1D33; --card:#14273F;
  --navy:#0C1A2E; --navy-text:#F5F1E8; --navy-soft:#9FB0C8; --line:rgba(244,241,233,.12);
  --ink:#F2EFE9; --ink-soft:#A7B6CC; --body-text:#C4CFDC;
  --red:#C1272D; --red-text:#E2646A; --stitch:rgba(214,69,74,.6); --stitch-on-navy:rgba(214,69,74,.65);
  --blue:#6AA0FF; --cta:#2A62BE; --cta-hover:#4A8DFF; --lex-underline:rgba(74,141,255,.4);
  --motif:rgba(224,208,170,.144); --motif-solid:rgba(214,196,156,.66); --motif-on-navy:rgba(233,224,203,.14);
  --placeholder:#8FA0B8; --msg-err:#FF9AA0; --msg-warn:#FFCE6A; --msg-ok:#6EE7A8;
  --shadow:rgba(0,0,0,.45); --field-opacity:.06; --band-opacity:.10;
  --header-bg:rgba(10,21,36,.9); --lang-bg:rgba(255,255,255,.05);
  --press-filter:brightness(0) invert(.86); --press-filter-hover:brightness(0) invert(1);
  --logo-navy-display:none; --logo-white-display:block;
  --p-screen:#0C1826; --p-surface:#132339; --p-ink:#EAF1FB; --p-muted:#8394AC;
  --p-line:rgba(255,255,255,.09); --p-bubble:#1C2E48; --p-bubble-ink:#DCE6F2; --p-field:#15263C;
  --p-user:#2C6FE0; --p-accent:#2A62BE;
}
