/* DeckSpace design tokens — the single source of truth for color, type and
   radius. Linked FIRST by every page (index.html, auth.html, share.html); no
   other file may declare a :root block. When you need a colour, a font size or
   a corner, take one from here rather than inventing a neighbouring value —
   that drift is what this file exists to stop. */
:root{
  /* ---- Ground & ink -------------------------------------------------------
     Warm near-white neutrals — a faint brown/olive undertone — so the surface
     reads calm rather than synthetic, and so the app and the public site
     (web/home.css) sit on ONE ramp instead of two. Every ground here is a
     literal home.css value except --hover and --sunken, which are app-only
     roles the site has no use for. Named by the job they do, not by shade.
     Lightness order, which the roles depend on: raised (lightest) > bg >
     hover > sunken > border. Note the app's --bg is the site's --band, not the
     site's --bg: the site puts its --bg above its --raised, and the app's roles
     require the opposite. */
  --bg:#f4f3f0;        /* app background */
  --panel:#ffffff;     /* cards, modals, inputs — the surface above --bg */
  --raised:#f7f6f3;    /* sidebar, inset fields */
  --sunken:#eae8e2;    /* segmented-control track, step markers */
  --hover:#eeece6;     /* row + ghost-button hover */
  --border:#e9e7e2;
  --border2:#dbd8d1;   /* stronger rule: control outlines, hover borders */
  /* A switch in its OFF state is a filled shape, not a rule: the track IS the
     control, so it has to clear 3:1 (WCAG 1.4.11) both against --panel behind
     it and against the white knob on top of it. --border2 manages 1.42 on both
     — the control disappears. This is the same warm neutral carried far enough
     down the ramp to be a shape: 3.4:1 either way. Not a border colour; do not
     use it as one. */
  --switch-off:#8f8b83;
  --text:#1b1a17;      /* 17.4:1 on --panel, 15.7:1 on --bg */
  --text2:#57544e;     /* 7.5:1 on --panel, 6.8:1 on --bg */
  /* --text3 is muted meta (uppercase labels, hints, placeholders) at 11–12px,
     so it still has to be readable on EVERY ground it lands on, including the
     --sunken segmented track (.aic-seg-or sets it at 11px directly on that).
     It clears 4.5:1 on all five: panel 5.6 · raised 5.2 · bg 5.1 · hover 4.8 ·
     sunken 4.6. This is a step darker than the site's own --ink3 (#6e6a62),
     which is fine on the site's grounds but lands at 4.4 on --sunken. */
  --text3:#6b675f;

  /* ---- Accent -------------------------------------------------------------
     Azure — the site's blue, so the logomark (which takes --accent) is the
     same brand as the buttons on the homepage. 5.0:1 against white, which
     clears AA both as body-sized text and as a fill with white on top.
     On the soft fill use --accent-text, not --accent: --accent on
     --accent-bg is only 4.4:1, --accent-text is 5.5:1. */
  --accent:#0f6fce;
  --accent-bg:#e8f1fc;      /* selected row / soft fill */
  --accent-text:#0d5fb8;    /* accent used as readable text — 6.3:1 on --panel */
  --accent-hover:#0b5cb0;   /* primary button hover — white on it is 6.6:1 */

  /* ---- Semantic ----------------------------------------------------------
     Not brand colours: these carry meaning and do not follow the accent. The
     reds, the amber star and the peach comment ring were already warm and read
     correctly on the warm ramp. --green takes the site's value so two files
     stop claiming different "the" greens; --green-bg is nudged off a cool mint
     to sit in the same warm key (meaning and contrast unchanged, 6.0:1). */
  --green:#17654e; --green-bg:#e4f1ea;
  --danger:#a3352f; --danger-bg:#fdecec; --danger-border:#f3c9c9;
  --star:#e09b2d; --star-hover:#b57b1c;
  --comment-ring:#f5d4b8;   /* ring on a slide dot that has comments */

  /* ---- Present mode: its own dark stage ----------------------------------
     A warm near-black, so the stage belongs to the same palette as the app it
     drops out of. --present-accent is --accent lifted to read on it (7.5:1);
     it is derived from the accent and must be re-measured if the hue moves.
     Careful with the two grounds here: the stage is only visible where the DECK
     is not, and the deck is usually white. Anything painted over the slide
     (the progress bar, the chip, the HUD) is measured against the SLIDE, so it
     needs a ground of its own — --present-scrim — rather than trusting
     --present-bg. --present-chip is that scrim at a lower opacity, deep enough
     that 12px white on it still clears 4.5:1 over a white slide (5.9:1; 18.9:1
     over the stage). At .45 it was 3.0:1 and the slide counter was the only
     slide-position readout in present mode. */
  --present-bg:#12110e;
  --present-accent:#5aa9f0;   /* the accent, lifted to read on the dark stage */
  --present-scrim:rgba(18,17,14,.75);
  --present-chip:rgba(18,17,14,.65);
  --present-border:#4a4741;   /* control outline on the dark stage */
  --live:#7ee2bd;

  /* ---- Type scale: six steps, no half-pixels ------------------------------
     Body stays at 13px — the density is right for a workspace tool; the fix is
     removing the sizes that sat half a pixel away from it. */
  --fs-micro:11px;   /* uppercase labels, meta */
  --fs-small:12px;   /* captions, hints, secondary rows */
  --fs-body:13px;    /* default UI text */
  --fs-lead:15px;    /* emphasis, brand name, icon glyphs */
  --fs-title:18px;   /* modal + section headings */

  /* ---- Radius scale ------------------------------------------------------ */
  --r-xs:4px;        /* bars, tails, inline inputs */
  --r-sm:6px;        /* buttons, inputs, chips, list rows */
  --r-md:10px;       /* cards, panels */
  --r-lg:16px;       /* modals, trays */
  --r-pill:999px;    /* badges, status pills, toasts */

  /* ---- Elevation ----------------------------------------------------------
     Warm-tinted rather than pure black, so shadows sit in the same family as
     the surface instead of muddying it. Geometry is the app's own — a
     workspace popover needs more lift than a marketing card. */
  --shadow-sm:0 1px 2px rgba(27,26,23,.05);
  --shadow-pop:0 8px 24px rgba(27,26,23,.12);
  --shadow-float:0 10px 30px rgba(27,26,23,.14);

  /* ---- Families ---------------------------------------------------------- */
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  font-size:15px;
}
