/* =====================================================================
   HDI — Direction D1 "Daylight editorial" — tokens (2026-09-18, PROPOSED)
   Shape follows Tamdoma (surface x role, brand accent, motion vars).
   Print extension (--print-*) is ours: Tamdoma has no print layer.
   Light is the default. Dark is opt-in only: <html data-theme="dark">.
   ===================================================================== */
@import url("../fonts/fonts.css");

:root{
  color-scheme: light;

  /* --- primitives ---------------------------------------------------- */
  --ink:        #002231;  /* brand navy, now the ink                    */
  --ink-2:      #2C4653;  /* secondary text                             */
  --ink-3:      #526772;  /* muted: metadata only, never caveats        */
  --paper:      #FAF7F0;  /* warm paper white                            */
  --paper-2:    #F2ECE0;  /* card / panel                                */
  --paper-3:    #FFFDF8;  /* elevated (inputs, sheets)                   */
  --harbour:    #0B6A7E;  /* accent: brand cyan evolved to pass AA       */
  --harbour-dk: #084F5E;  /* accent hover / pressed                      */
  --harbour-lt: #D7ECEF;  /* accent wash, never behind text-as-meaning   */
  --ochre:      #8A5300;  /* editorial second accent (quote marks, rules)*/
  --rule:       #D9D1C1;  /* hairlines (decorative, not UI)              */
  --rule-ui:    #7E7565;  /* UI borders: inputs, options (>= 3:1)        */
  --cyan-heritage:#06B6D4;/* old brand cyan: graphics only, never text   */

  /* --- Tamdoma semantic: surfaces ------------------------------------ */
  --surface-base:     var(--paper);
  --surface-card:     var(--paper-2);
  --surface-elevated: var(--paper-3);

  /* --- Tamdoma semantic: foreground roles (same on all 3 surfaces) --- */
  --role-body:    var(--ink);
  --role-heading: var(--ink);
  --role-muted:   var(--ink-3);
  --role-link:    var(--harbour);
  --role-inverse: var(--paper);

  --text-primary:   var(--ink);
  --text-secondary: var(--ink-2);
  --text-muted:     var(--ink-3);
  --text-inverse:   var(--paper);
  --border-default: var(--rule-ui);
  --border-subtle:  var(--rule);
  --brand-accent:       var(--harbour);
  --brand-accent-hover: var(--harbour-dk);
  --brand-on-accent:    var(--paper);

  /* --- focus / touch -------------------------------------------------- */
  --focus-ring-color:  var(--harbour);
  --focus-ring-width:  3px;     /* Tamdoma min 2px; we use 3 for the app */
  --focus-ring-offset: 2px;
  --touch-min: 44px;

  /* --- type ----------------------------------------------------------- */
  --font-display: "Newsreader", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body:    "Atkinson Hyperlegible Next", "Segoe UI", "Helvetica Neue", sans-serif; /* H-2: Arial dropped (Legolas 2026-09-21) */
  --font-story:   var(--font-display);
  --font-mono:    ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* web scale (locked by the mockup, per Tamdoma _page-assignments) */
  --fs-display: clamp(2.9rem, 1.6rem + 5.6vw, 6.25rem);
  --fs-h1:      clamp(2.25rem, 1.6rem + 2.8vw, 3.75rem);
  --fs-h2:      clamp(1.75rem, 1.35rem + 1.7vw, 2.75rem);
  --fs-h3:      1.375rem;
  --fs-lead:    clamp(1.1875rem, 1.1rem + .4vw, 1.375rem);
  --fs-body:    1.125rem;   /* 18px */
  --fs-small:   1rem;       /* 16px: floor for any reader text on web */
  --fs-label:   .875rem;    /* 14px caps labels only, weight 600 */
  --lh-tight: 1.04; --lh-head: 1.15; --lh-body: 1.6;
  --measure: 66ch;

  /* rhythm (mockup decision) */
  --space-1:.25rem; --space-2:.5rem; --space-3:1rem; --space-4:1.5rem;
  --space-5:2.5rem; --space-6:4rem; --space-7:6.5rem; --space-8:10rem;
  --radius: 2px;            /* sharp, editorial */
  --shadow: none;

  /* --- motion (Tamdoma tokens, unchanged) ---------------------------- */
  --motion-duration-fast: 150ms;
  --motion-duration-base: 300ms;
  --motion-duration-slow: 600ms;
  --motion-duration-calm: 1200ms;  /* D1 addition: "breathing" reveals, see MOTION.md */
  --motion-ease-out:    cubic-bezier(.16,1,.3,1);
  --motion-ease-in-out: cubic-bezier(.65,0,.35,1);
  --motion-ease-spring: cubic-bezier(.34,1.56,.64,1); /* declared, unused: too bouncy for calm */
  --motion-reveal-distance: 30px;
  --motion-stagger-step: 100ms;

  /* --- print extension ------------------------------------------------ */
  --print-body:     10pt;   /* report body, sans */
  --print-story:    10.5pt; /* story body, serif */
  --print-lead:     12.5pt;
  --print-h2:       24pt;
  --print-h3:       13pt;
  --print-label:    8pt;    /* caps labels, weight 600 */
  --print-min:      8pt;    /* nothing reader-facing smaller */
  --print-margin-top: 16mm; --print-margin-bottom: 18mm;
  --print-margin-outer: 18mm; --print-margin-inner: 20mm;
  --print-marginalia: 38mm; /* left column for kickers and labels */
  --print-gutter: 7mm;
  --print-rule: .35mm;
}

/* Dark mode: opt-in only (user toggle). Never follows the OS by default. */
:root[data-theme="dark"]{
  color-scheme: dark;
  --surface-base:#00161F; --surface-card:#002231; --surface-elevated:#0A3040;
  --role-body:#F3EEE4; --role-heading:#F3EEE4; --role-muted:#A3B3B9; --role-link:#7DD3E3; --role-inverse:#002231;
  --text-primary:#F3EEE4; --text-secondary:#C9D3D6; --text-muted:#A3B3B9; --text-inverse:#002231;
  --border-default:#7B929B; --border-subtle:#1E3C49;
  --brand-accent:#7DD3E3; --brand-accent-hover:#A5E3EE; --brand-on-accent:#002231;
  --focus-ring-color:#7DD3E3;
  --ink:#F3EEE4; --ink-2:#C9D3D6; --ink-3:#A3B3B9; --paper:#00161F; --paper-2:#002231; --paper-3:#0A3040;
  --harbour:#7DD3E3; --harbour-dk:#A5E3EE; --rule:#1E3C49; --rule-ui:#7B929B; --ochre:#E8B866;
}

@media (prefers-reduced-motion: reduce){
  :root{ --motion-duration-fast:.01ms; --motion-duration-base:.01ms; --motion-duration-slow:.01ms;
         --motion-duration-calm:.01ms; --motion-reveal-distance:0px; --motion-stagger-step:0ms; }
}