/* Council Record: one public look. Design tokens (T39).
   Every colour, size, radius and border on a public page comes from this file.
   Contrast ratios: run `node design/uniform-ui/contrast.mjs`; the table is in spec.md. */
/* Inter, self-hosted (SIL Open Font License 1.1). site.ts copies the files from the pinned
   @fontsource/inter package and puts its versioned folder name into these URLs. */
@font-face { font-family: Inter; font-style: normal; font-weight: 400; font-display: swap; src: url('/vendor/inter-5.2.8/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: Inter; font-style: normal; font-weight: 500; font-display: swap; src: url('/vendor/inter-5.2.8/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: Inter; font-style: normal; font-weight: 600; font-display: swap; src: url('/vendor/inter-5.2.8/inter-latin-600-normal.woff2') format('woff2'); }

:root {
  color-scheme: light;

  /* Colour: text and surfaces */
  --bg: #ffffff;
  --surface: #f5f6f8;        /* panels, AI-written blocks, footer band */
  --surface-2: #e9ecef;      /* disabled fills, skeleton lines */
  --ink: #111111;            /* 18.88:1 on --bg */
  --ink-2: #4b5058;          /* 8.12:1 secondary text, headings of small labels */
  --muted: #5c6168;          /* 6.24:1 dates, hints; the lightest text colour allowed */

  /* Colour: lines */
  --line: #e3e6ea;           /* decorative dividers only (exempt from 1.4.11) */
  --border: #7a8089;         /* 3.98:1 inputs, selects, checkboxes, tags: any edge that shows a control */

  /* Colour: action */
  --accent: #1e5fd7;         /* 5.72:1 links, primary fill, secondary border and text */
  --accent-strong: #1748a8;  /* 8.30:1 hover and pressed */
  --accent-tint: #eef3fd;    /* selected rows, civic chip, info alert */
  --focus: #1e5fd7;          /* 5.72:1 focus ring, 2px solid, 2px offset */

  /* Colour: status (USWDS Alert roles, in reader tokens) */
  --info: var(--accent);
  --info-tint: #eef3fd;
  --success: #1e7a3e;        /* 5.37:1 */
  --success-tint: #ecf6ef;
  --error: #b3261e;          /* 6.54:1 */
  --error-tint: #fcefee;
  --warning: #8a5a00;        /* 5.93:1; used for "Likely match" only */
  --warning-tint: #fdf6e4;
  --major: #a63f12;          /* 6.29:1 with white text; "Major meeting" badge */
  --on-fill: #ffffff;        /* text and marks on a filled accent, major, ink-2 or data colour */
  --mark: #fff0b5;           /* search match behind ink text */

  /* Data colours: they mean a kind of data, not an action. Each passes 4.5:1 with --on-fill text. */
  --data-highlight: #2f5fd0; /* a highlight of the meeting */
  --data-quote: #8a5a00;     /* a key quote (same value as --warning) */
  --data-standout: #2f7d4f;  /* a standout moment */
  --data-place: #7c5cc4;     /* a neighborhood in the briefing text */
  --data-place-strong: #4c2f9e;
  --map-district: #d4dee8;   /* a council district that is not selected */
  --map-focus: #083b42;      /* the district outline under the pointer or focus */
  --map-marker: #243d4b;     /* a city marker on the Explore map (city-map.js uses the same value) */

  /* Type: Inter everywhere. No serif. */
  --font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --text-xs: 0.8125rem;      /* 13px chips, badges, fine print. The smallest size. */
  --text-sm: 0.875rem;       /* 14px meta, labels, nav, buttons */
  --text-md: 0.9375rem;      /* 15px body */
  --text-lg: 1.125rem;       /* 18px card titles, h3 */
  --text-xl: 1.375rem;       /* 22px section titles, h2 */
  --text-2xl: 1.625rem;      /* 26px page title, h1 (24px under 640px) */
  --leading: 1.6;
  --leading-tight: 1.3;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-strong: 600;

  /* Radius: three values only */
  --radius-sm: 4px;          /* buttons, inputs, selects, checkboxes, alerts, AI badge */
  --radius-md: 8px;          /* panels, cards, video frames, menus */
  --radius-pill: 999px;      /* chips and tags */

  /* Space: 4px steps */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  /* Borders and focus */
  --border-width: 1px;
  --focus-ring: 2px solid var(--focus);
  --focus-offset: 2px;

  /* Size */
  --control-height: 40px;    /* buttons, inputs, selects, Google button */
  --target-min: 24px;        /* WCAG 2.5.8 floor for any small target (chips, links in lists) */
  --page-reading: 40rem;     /* text column */
  --page-wide: 72rem;        /* header, footer, wide pages: always the same width */
}