/* ==========================================================================
   hounsfieldhub — design tokens
   Single source of truth for colour and type. Taken from the brand sheet.

   RULE: amber is the human / community accent. It never carries alert or
   error meaning. Nothing in this system may use it for warnings.
   ========================================================================== */

:root {
  /* --- brand colours, exactly as approved on the sheet --- */
  --hh-charcoal: #0B1220;   /* Deep Charcoal  — backgrounds            */
  --hh-cyan:     #00D1FF;   /* Electric Cyan  — accents                */
  --hh-amber:    #FFB020;   /* Warm Amber     — highlights / community */
  --hh-offwhite: #F7F7F5;   /* Off-White      — text                   */
  --hh-slate:    #6B7280;   /* Slate Gray     — secondary              */

  /* --- type: Inter for headings/UI, Source Sans 3 for body --- */
  --font-display: 'Inter', system-ui, -apple-system, sans-serif;
  --font-body: 'Source Sans 3', system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, 'JetBrains Mono', 'SFMono-Regular', Menlo, monospace;

  --step--1: clamp(0.85rem, 0.82rem + 0.15vw, 0.95rem);
  --step-0:  clamp(1rem,    0.97rem + 0.15vw, 1.1rem);
  --step-1:  clamp(1.25rem, 1.15rem + 0.5vw,  1.5rem);
  --step-2:  clamp(1.5rem,  1.3rem  + 1vw,    2.1rem);
  --step-3:  clamp(2rem,    1.5rem  + 2.4vw,  3.4rem);

  --radius: 12px;
  --radius-sm: 8px;
  --measure: 66ch;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --maxw: 1120px;

  /* --- dark is the default: reading-room look --- */
  --bg:            var(--hh-charcoal);
  --bg-raised:     #121A2B;
  --bg-sunken:     #070C15;
  --fg:            var(--hh-offwhite);
  --fg-muted:      #9AA6B8;
  --border:        #1F2A3D;
  --accent:        var(--hh-cyan);
  --accent-soft:   rgba(0, 209, 255, 0.12);
  --on-accent:     #04222C;
  --human:         var(--hh-amber);
  --human-soft:    rgba(255, 176, 32, 0.12);
  --link:          var(--hh-cyan);
  --shadow:        0 18px 40px rgba(0, 0, 0, 0.45);

  /* the mark: white rings work on charcoal, not on paper */
  --mark-line: #E9ECF2;
  --mark-disc: #B9BFC9;
  --mark-core: #0B1220;
  --grid-opacity: 0.5;
}

/* Light mode is a calm variant, not an inversion: both accents are darkened
   so they hold WCAG AA on a light background. */
[data-theme="light"] {
  --bg:          var(--hh-offwhite);
  --bg-raised:   #FFFFFF;
  --bg-sunken:   #EBEAE4;
  --fg:          #0B1220;
  --fg-muted:    #5A6068;
  --border:      #D6D5CE;
  --accent:      #00758F;
  --accent-soft: rgba(0, 117, 143, 0.10);
  --on-accent:   #FFFFFF;
  --human:       #A55F00;
  --human-soft:  rgba(165, 95, 0, 0.10);
  --link:        #00758F;
  --shadow:      0 14px 30px rgba(11, 18, 32, 0.10);

  --mark-line: #0B1220;
  --mark-disc: #98A2AE;
  --mark-core: #0B1220;
  --grid-opacity: 0.3;
}
