/*
 * Latent Labs tokens. The one place colour, type and spacing are set (R30).
 *
 * Values: AM's proposal of 8 Oct 2026 (forge-hq brand/latentlabs/README.md),
 * as pinned in the blueprint's brand block. NOT YET ADOPTED: the board
 * decides the palette on 30 Oct 2026. If it picks differently, change the
 * values here and nowhere else.
 *
 * Rules that travel with these values:
 * - Highlight (Station Orange) does one job per surface: the call to action.
 *   Never in the mark, never on a heading, never as a section colour.
 * - Secondary grey #969A9F is for rules and marks only. It fails contrast as
 *   text on white (about 2.8:1), so it is never used for body text or labels.
 * - Text on the highlight is ink in both themes (white on #E8631F fails AA).
 */

@font-face { font-family: 'Gantari'; src: url('/fonts/gantari-regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Gantari'; src: url('/fonts/gantari-medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Gantari'; src: url('/fonts/gantari-semibold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Gantari'; src: url('/fonts/gantari-bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  color-scheme: light dark;

  /* Palette, light surfaces */
  --ink: #17191B;            /* headings, the mark */
  --body: #4A4F55;           /* Slate: running text, 7.7:1 on the off-white */
  --quote: #33393F;          /* dark slate grey: the spotlight quotes (AM 2 Nov) */
  --secondary: #969A9F;      /* rules, marks and the quote bubbles; never text on white */
  --on-secondary: #17191B;   /* ink on the grey: 5.9:1, both themes */
  --surface: #F6F7F8;        /* cool off-white: pure white is "radioactive" (AM 29 Oct call) */
  --surface-raised: #E6E8EA; /* a shade darker, so cards still lift off the off-white */
  --highlight: #E8631F;      /* Station Orange, light */
  --highlight-text: #B5480D; /* orange for small text: 5.0:1 on the off-white (Lighthouse, 3 Nov) */
  --on-highlight: #17191B;   /* 5.2:1 on #E8631F */
  --focus: #17191B;
  --error: #B3261E;          /* status red, not orange */
  --band-bg: #17191B;        /* charcoal band, light theme */
  --band-ink: #FFFFFF;
  --band-body: #C9CDD2;

  /* Type */
  --font: 'Gantari', 'Helvetica Neue', Arial, sans-serif;
  --step--1: 0.875rem;
  --step-0: 1.0625rem;
  --step-1: 1.25rem;
  --step-2: 1.5rem;
  --step-3: clamp(1.75rem, 1.4rem + 1.6vw, 2.375rem);
  --step-4: clamp(2.25rem, 1.6rem + 3vw, 3.25rem);
  --step-5: clamp(3rem, 1.8rem + 6.2vw, 6.5rem);
  --leading: 1.6;
  --tracking-tight: -0.025em;

  /* Space and layout (4px base) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --measure: 38rem;
  --wide: 76rem;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --radius: 8px;
  --fade-orange: 1.8s;      /* every fade to orange is slow and deliberate (AM 2 Nov) */
  --rule: 1px solid var(--secondary);

}

/* Dark: follows the reader's system setting (R31), or the header switch (data-theme). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #FFFFFF;
    --body: #C9CDD2;         /* Fog: 11.6:1 on #17191B */
    --quote: #D3D7DC;
    --surface: #17191B;
    --surface-raised: #2A2D31;
    --highlight: #FF7A3C;    /* Station Orange, dark */
    --highlight-text: #FF7A3C;
    --on-highlight: #17191B; /* 6.8:1 on #FF7A3C */
    --focus: #FFFFFF;
    --error: #FF8A80;
    --band-bg: #2A2D31;      /* raised charcoal, so the band still reads on a dark page */
  }
}
:root[data-theme="dark"] {
  --ink: #FFFFFF;
  --body: #C9CDD2;
  --quote: #D3D7DC;
  --surface: #17191B;
  --surface-raised: #2A2D31;
  --highlight: #FF7A3C;
  --highlight-text: #FF7A3C;
  --on-highlight: #17191B;
  --focus: #FFFFFF;
  --error: #FF8A80;
  --band-bg: #2A2D31;
  color-scheme: dark;
}
:root[data-theme="light"] { color-scheme: light; }