/* Lakeside Analytics — design tokens. Single source of truth.
   Nothing outside this file defines a color.

   Two themes from one identity: warm green-black ground with a gold accent,
   and its light counterpart on a warm paper ground with a deeper gold. The
   dark set is the original; the light set was derived from it and every pair
   was measured, not eyeballed — ratios noted inline.

   Resolution order: system preference by default, overridden by an explicit
   [data-theme] on <html> when the reader picks one. */

:root {
  color-scheme: light dark;

  /* Space — 4px base, no value off this scale */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 24px;  --s-6: 32px;  --s-7: 48px;  --s-8: 64px;
  --s-9: 96px;  --s-10: 128px; --s-11: 160px;

  /* Type scale */
  --t-display-1: clamp(44px, 5.4vw, 76px);
  --t-display-2: clamp(32px, 3.4vw, 50px);
  --t-display-3: clamp(24px, 2.2vw, 32px);
  --t-heading: 19px;
  --t-body-lg: 18px;
  --t-body: 16px;
  --t-meta: 12px;
  --t-micro: 11px;

  /* Geometry */
  --container: 1240px;
  --gutter: clamp(20px, 5vw, 48px);
  --radius: 6px;

  /* Hero surface system. Every panel in the hero — copy, viz, stats, jump — shares one
     radius and one internal padding, and all four align to the container edge. Before
     this they used three radii (12/8/6) and three paddings, and the copy panel's
     backing overhung the container by 24px so its left edge missed the stats bar below. */
  --surface-radius: 12px;
  --surface-pad-x: clamp(20px, 2.2vw, 40px);
  --surface-pad-y: clamp(20px, 1.8vw, 32px);
  --radius-pill: 999px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------- LIGHT (default) ----------
   text 16.5:1 · text-2 7.4:1 · text-3 4.6:1 · accent 5.5:1 on --bg.
   Chart pair #5E4410/#868C89: CVD dE 23.5, normal dE 24.1, both >=3:1. */
:root,
:root[data-theme="light"] {
  --bg:            #F6F4ED;
  --bg-raised:     #FFFDF7;
  --bg-sunken:     #EDEAE0;

  --line:          rgba(20, 23, 15, 0.13);
  --line-strong:   rgba(20, 23, 15, 0.26);

  --text:          #14170F;
  --text-2:        #4C5147;
  /* Darkened from #6B7065. This is the 11px muted tone — the eyebrow, the demo's
     provenance line, "live · synthetic data", and the six stage links under the demo —
     and all of it sits over the painting, whose light passages push the composited
     background up to 0.659 relative luminance. Measured there, #6B7065 gave 3.43:1 to
     4.12:1 against a 4.5:1 requirement at that size: the smallest type on the page was
     the only type that failed. #565A50 measures 4.77:1 in the worst spot and is still
     visibly lighter than --text-2, so the tonal hierarchy survives. */
  --text-3:        #565A50;

  --accent:        #7A5E22;
  --accent-quiet:  rgba(122, 94, 34, 0.30);

  --chart-hi:      #5E4410;
  --chart-lo:      #868C89;

  /* Brand marks — logo hover only, never UI. Darkened from each published
     value so they clear contrast on a light ground. */
  --brand-c1-word:   #004977;
  --brand-c1-swoosh: #D03027;
  --brand-mb:        #6B7276;
  --brand-pl:        #4A55E0;
  --brand-mc:        #16365C;
}

/* ---------- DARK ----------
   The original committed theme. text 15.9:1 · text-2 7.1:1 · accent 8.0:1.
   Chart pair #C6A464/#646b71: CVD dE 21.3, normal dE 23.6, both >=3:1. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg:            #0F1210;
    --bg-raised:     #151916;
    --bg-sunken:     #0A0D0B;

    --line:          rgba(233, 228, 214, 0.09);
    --line-strong:   rgba(233, 228, 214, 0.18);

    --text:          #EDE8DC;
    --text-2:        #ADAB9C;
    --text-3:        #868475;

    --accent:        #C6A464;
    --accent-quiet:  rgba(198, 164, 100, 0.28);

    --chart-hi:      #C6A464;
    --chart-lo:      #646b71;

    --brand-c1-word:   #EDE8DC;
    --brand-c1-swoosh: #E04A44;
    --brand-mb:        #C8CDD2;
    --brand-pl:        #8E93FF;
    --brand-mc:        #C7D3E4;
  }
}

/* Explicit choice wins over system preference, in both directions. */
:root[data-theme="dark"] {
  --bg:            #0F1210;
  --bg-raised:     #151916;
  --bg-sunken:     #0A0D0B;

  --line:          rgba(233, 228, 214, 0.09);
  --line-strong:   rgba(233, 228, 214, 0.18);

  --text:          #EDE8DC;
  --text-2:        #ADAB9C;
  --text-3:        #868475;

  --accent:        #C6A464;
  --accent-quiet:  rgba(198, 164, 100, 0.28);

  --chart-hi:      #C6A464;
  --chart-lo:      #646b71;

  --brand-c1-word:   #EDE8DC;
  --brand-c1-swoosh: #E04A44;
  --brand-mb:        #C8CDD2;
  --brand-pl:        #8E93FF;
  --brand-mc:        #C7D3E4;
}