/*
 * The one place joblit.app's design tokens live.
 *
 * Before this, the same tokens were hand-copied into four files that had drifted
 * apart — shared.css, index.html, j/ and privacy/ — in three naming schemes,
 * with a light-themed privacy page. Every page now links this file first and
 * defines none of its own, so a change here reaches the whole product and the
 * copies can't disagree again.
 *
 * Transcribed from the app's src/theme/index.ts (which the static web can't
 * import). Colour roles follow the app's split: `accent` is a FILL only; text,
 * strokes and rings take `accent-ink`; the primary button is `solid` (white).
 */
:root {
  /* surfaces */
  --bg: #000000;
  --surface: #0C0C0E;     /* a card on the page */
  --raised: #151517;      /* an input or panel inside a card */
  --overlay: #1F1F22;     /* sheets and menus */
  --line: #2A2A2E;        /* hairline border */
  --line-soft: #1A1A1D;   /* divider inside a group */

  /* accent — a fill, and only a fill */
  --accent: #2F4FD6;
  --accent-pressed: #2540B4;
  --accent-ink: #8FB0FF;  /* accent as TEXT, strokes, the score ring's arc */
  --accent-soft: #141B33; /* a tinted fill behind a selected thing */
  --on-accent: #FFFFFF;   /* text on an accent fill */

  /* the primary control: a white pill with a black label */
  --solid: #FFFFFF;
  --on-solid: #000000;

  /* text — three neutral weights, no cast */
  --text: #FFFFFF;
  --text-muted: #A1A1A6;
  --text-faint: #6E6E73;

  /* state — never emphasis */
  --good: #3DDC97;
  --warn: #F5B94A;
  --bad: #FF6B85;

  /* spacing — roles, not sizes */
  --tight: 8px;
  --group: 16px;
  --gutter: 20px;
  --section: 32px;
  --major: 56px;

  --radius: 14px;

  /* type scale — the app's ramp, finally tokenised. size / line pairs. */
  --fs-hero: 56px;    --lh-hero: 58px;
  --fs-display: 40px; --lh-display: 46px;
  --fs-title: 28px;   --lh-title: 34px;
  --fs-heading: 20px; --lh-heading: 26px;
  --fs-body: 17px;    --lh-body: 24px;
  --fs-label: 15px;   --lh-label: 20px;
  --fs-caption: 13px; --lh-caption: 16px;
}

/* Native controls (checkboxes, range tracks, scrollbars) render light by
   default; a stark white control on near-black reads as a bug. This says the
   whole product is dark. */
:root { color-scheme: dark }