/* FPL-001/REQ-002 (codeperts #3186) — the one token file. 332 declarations (315 + --crumb-max-w, --drop-line, the two time-picker tokens of item 39, --series-5…--series-9 of item 42 and the five Grid tokens of item 45 and --busy-area-delay of FPL-001/REQ-039, row 87 and the two content-cell tokens --heat-content-w / --heat-content-h of FPL-001/REQ-038, row 30 — see claude-docs/UI-LAYER.md §2), one :root rule.
   Source: the finalized sheet's eight :root blocks (../mockups/01-shell.html … 08-page-parts.html),
   flattened per FR-2's four rulings (--search-w-bar dropped, --tip-lane-h/--menu-lane-h dropped,
   --drawer-w-list/--scrim-navy aliased). The sheet is FINAL (DEC-011) — a disagreement between this
   file and the sheet is a defect here, never the other way round.
   No other selector may exist in this file (FR-4, ELEMENT_RULE_IN_TOKEN_FILE) and no other layer
   file may redeclare a name from this set (TOKEN_REDEFINED_OUTSIDE_LAYER). See claude-docs/UI-LAYER.md. */
:root {
  /* brand — the ONE re-brand edit point (1) */
  --brand: #7338ba;

  /* typeface (2) */
  --font-sans: Inter, "Segoe UI", Roboto, system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;

  /* type scale (16) */
  --fs-body: 14px; --lh-body: 20px;
  --fs-small: 12px; --lh-small: 16px;
  --fs-caption: 11px; --lh-caption: 16px;
  --fs-heading-sm: 14px; --lh-heading-sm: 20px;
  --fs-heading-md: 16px; --lh-heading-md: 24px;
  --fs-title: 20px; --lh-title: 28px;
  --lh-tight: 14px;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600;

  /* spacing, 4px base (8) */
  --space-2: 2px; --space-4: 4px; --space-8: 8px; --space-12: 12px;
  --space-16: 16px; --space-24: 24px; --space-32: 32px; --space-48: 48px;

  /* controls (9) */
  --control-h-sm: 28px; --control-h: 32px; --control-h-lg: 36px;
  --input-pad-x: 10px; --btn-pad-x: 14px; --btn-pad-x-sm: 10px;
  --border-w: 1px; --radius: 4px; --radius-pill: 999px;

  /* rows (5) */
  --row-h: 40px; --row-h-dense: 36px; --row-head-h: 36px; --cell-pad-x: 12px; --pill-h: 22px;

  /* neutrals + accent (11) */
  --text: #1f2933; --text-secondary: #52606d; --placeholder: #9aa5b1;
  --line: #e4e7eb; --fill-1: #f5f7fa; --surface: #ffffff; --page: #f7f8fa;
  --accent: var(--brand); --accent-hover: #5f2c9c; --accent-soft: #f1eafa; --on-accent: #ffffff;

  /* semantic pairs (10) */
  --ok: #1e8e5a; --ok-bg: #e3f5ec; --warn: #9a5c00; --warn-bg: #fff4dc;
  --error: #d13438; --error-bg: #fde8e8; --info: var(--accent); --info-bg: var(--accent-soft);
  --neutral: #6b7280; --neutral-bg: #eef0f3;

  /* shell (21) */
  --topbar-h: 48px; --topbar-bg: #1b2b48; --topbar-text: rgba(255, 255, 255, .85);
  --topbar-text-active: #ffffff; --topbar-fill: rgba(255, 255, 255, .12); --topbar-underline: 2px;
  --mod-pad-x: 8px; --mod-gap: 4px; --modulerow-h: 40px; --logo-h: 28px; --logo-maxw: 160px;
  --logo-gap: 24px; --logo-placeholder-w: 110px; --logo-placeholder-h: 20px;
  --content-pad: 32px; --panel-pad: 20px; --search-w: 240px; --menu-col-w: 200px; --crumb-max-w: 160px;
  --gate-progress-w: 160px; --gate-progress-h: 2px; --drawer-w: 400px;

  /* section rail (4) */
  --rail-w: 220px; --rail-w-collapsed: 56px; --rail-item-h: 36px; --rail-active-w: 3px;

  /* icons, avatars, badge (5) */
  --icon-sm: 16px; --icon-lg: 20px; --avatar: 28px; --avatar-sm: 24px; --badge: 16px;

  /* elevation — one overlay shadow, none on surfaces (1) */
  --shadow-overlay: 0 4px 16px rgba(16, 24, 40, .12);

  /* focus ring (2) */
  --focus-w: 2px; --focus-offset: 2px;

  /* motion, busy, disabled (10) */
  --motion-micro: 100ms; --motion-menu: 150ms; --motion-overlay: 200ms; --ease: ease-out;
  --spin-dur: 700ms; --indet-dur: 1400ms; --spinner-size: 14px; --spinner-stroke: 2px;
  --busy-opacity: .65; --disabled-opacity: .4;

  /* family 2 band (21) */
  --dialog-w: 440px; --btn-min-w: 64px; --accent-press: #4e2482; --error-hover: #b02b2f;
  --error-press: #98252a; --split-seam: rgba(255, 255, 255, .28); --tag-h: var(--pill-h);
  --tag-max-w: 160px; --tip-bg: #1f2933; --tip-text: #ffffff; --tip-max-w: 240px;
  --tip-pad-y: 6px; --tip-pad-x: 8px; --tip-arrow: 6px; --tip-gap: 6px; --tip-delay: 300ms;
  --dot: 8px; --touch-target: 40px; --busy-delay: 200ms; --busy-area-delay: 300ms; --menu-w-filter: 260px; --menu-pad: 8px;

  /* family 3 band (29) */
  --banner-pad-y: 12px; --banner-pad-x: 16px; --banner-clamp: 2; --banner-line-info: #dccdf0;
  --banner-line-warn: #f0dcb0; --banner-line-error: #f4c7c8; --dialog-pad: 24px;
  --scrim: rgba(27, 43, 72, .4); --field-w: 280px; --textarea-h: 64px; --textarea-pad-y: 6px;
  --seam-pad: 16px; --code-pad-y: 2px; --code-pad-x: 6px; --empty-pad-y: 48px; --empty-max-w: 420px;
  --progress-h: 6px; --progress-w: 320px; --skel-bg: #e9edf2; --skel-sheen: #f2f5f9;
  --skel-h: 12px; --skel-h-lg: 20px; --skel-radius: 2px; --skel-dur: 1200ms; --skel-sweep: 480px;
  --skel-after: 1000ms; --stale-after: 300s; --success-hold: 1500ms; --undo-window: 8s;

  /* family 4 band (41) */
  --line-hover: #cbd2d9; --affix-pad: var(--space-32); --stepper-w: var(--control-h-sm);
  --opt-h: var(--control-h); --opt-visible: 8; --select-w: 240px; --combo-w: 320px;
  --check-size: var(--icon-sm); --check-mark: var(--space-12); --check-dash: var(--space-2);
  --radio-dot: 6px; --check-gap: var(--space-8); --group-gap: var(--space-8); --switch-w: 36px;
  --switch-h: 20px; --switch-knob: 16px; --switch-pad: 2px; --cal-cell: var(--control-h);
  --cal-pad: var(--space-12); --cal-dot: 4px; --period-w: 180px; --edit-w: 360px;
  --edit-key-w: 140px; --drag-w: 20px; --drop-h: 120px; --thumb: 64px;
  --field-gap-y: var(--space-16); --section-gap-y: var(--space-24); --ta-max-rows: 6;
  --tip-h-1: calc(var(--tip-pad-y) * 2 + var(--lh-small));
  --tip-h-2: calc(var(--tip-pad-y) * 2 + var(--lh-small) * 2);
  --tip-h-3: calc(var(--tip-pad-y) * 2 + var(--lh-small) * 3);
  --tip-room-1: calc(var(--tip-h-1) + var(--tip-gap) + var(--space-8));
  --tip-room-2: calc(var(--tip-h-2) + var(--tip-gap) + var(--space-8));
  --tip-room-3: calc(var(--tip-h-3) + var(--tip-gap) + var(--space-8));
  --typeahead-min: 2; --typeahead-debounce: 250ms; --typeahead-cap: 10;
  --select-search-from: 9; --reason-min: 10; --upload-max-mb: 5;
  --drop-line: calc(var(--border-w) * 2); /* 10b (row 48): the drop-target line between two rows while a row is held — twice a hairline, so it can never read as a row divider */

  /* family 5 band (20) — the nine series colours (REQ-013), the plot, the bars, the hairline, the swatch */
  --series-1: var(--accent); --series-2: #6b7280; --series-3: #1e8e5a; --series-4: #c77700;
  --series-5: #1d39c4; --series-6: #08979c; --series-7: #9e1068; --series-8: #5b8c00; --series-9: #374151; /* REQ-013: geekblue, cyan, magenta, lime, slate ("Other", always last; not --neutral, which is series 2) */
  --plot-h: 160px; --plot-h-sm: 96px; --bar-w: 28px; --bar-w-sm: 14px; --bar-gap: 12px;
  --bar-gap-sm: 2px; --gbar-h: 16px; --gbar-label-w: 180px; --gbar-value-w: 56px;
  --seg-line: rgba(255, 255, 255, .55); --swatch: 10px;

  /* heat grid (9) */
  --cell: 32px; --heat-name-w: 180px; --heat-content-w: calc(var(--cell) * 2); --heat-content-h: calc(var(--row-h) + var(--border-w)); --heat-present: var(--ok-bg); --heat-absent: var(--error-bg);
  --heat-leave: var(--accent-soft); --heat-weekend: var(--fill-1); --heat-holiday-dot: 6px;
  --heat-frozen: rgba(31, 41, 51, .05); --trend-cell: 16px;

  /* avatar ladder (4) */
  --avatar-md: 32px; --avatar-lg: 40px; --avatar-dot: 8px; --avatar-dot-ring: 2px;

  /* stat tiles (4) */
  --tile-h: 96px; --fs-number: 28px; --lh-number: 36px; --minibar-h: 4px;

  /* meters and pips (6) */
  --meter-h: 8px; --meter-w: 220px; --meter-target-w: 2px; --pip-w: 16px; --pip-h: 6px; --pip-gap: 4px;

  /* timeline (8) */
  --day-h: 28px; --tick-h: 5px; --shot-tick-w: 1px; --shot-h: 6px; --log-dot: 8px;
  --log-time-w: 88px;
  --log-rail-x: calc(var(--log-time-w) + var(--space-8) + var(--log-dot) / 2);
  --log-text-x: calc(var(--log-time-w) + var(--space-8) + var(--log-dot) + var(--space-8));

  /* tree (2) */
  --tree-indent: 20px; --tree-sel-w: 3px;

  /* filmstrip (3) */
  --thumb-w: 64px; --thumb-h: 40px; --thumb-sel-w: 2px;

  /* explanation card inset (2) */
  --inset-edge-w: 3px; --inset-pad: 16px;

  /* table extras (4) */
  --trunc-w: 160px; --batch-h: 44px; --kv-label-w: 160px; --sel-edge-w: 3px;

  /* family 6 band (9) */
  --z-menu: 30; --z-tip: 40; --z-drawer: 50; --z-dialog: 60; --z-lightbox: 70;
  --drawer-w-edit: 50vw; --drawer-min: 560px; --drawer-max: 960px; --drawer-w-list: var(--drawer-w);

  /* scrim alias (1) */
  --scrim-navy: var(--scrim);

  /* lightbox, narrow width, overlay constants (17) */
  --lightbox-bg: rgba(27, 43, 72, .96); --lightbox-bar-h: var(--topbar-h);
  --lightbox-pad: var(--space-24); --lightbox-arrow: var(--touch-target); --shot-ratio: 16 / 10;
  --on-dark: rgba(255, 255, 255, .85); --on-dark-strong: #ffffff;
  --on-dark-fill: rgba(255, 255, 255, .12); --on-dark-line: rgba(255, 255, 255, .22);
  --error-on-dark: #ff9a9d; --overlay-narrow: 900px; --dialog-narrow-inset: 32px;
  --slide-interval: 2s; --slide-pause-on: hover; --z-drawer-2: 52;
  --drawer-stack-max: 2; --dialog-fields-max: 4;

  /* page tab strip (9) */
  --tab-h: 36px; --tab-pad-x: 16px; --tab-underline: 2px; --tab-label: var(--fw-medium);
  --tab-badge-h: 18px; --tab-badge-pad-x: 6px; --tab-badge-gap: var(--space-8);
  --tab-strip-pad-x: var(--content-pad); --tab-fade-w: 32px;

  /* the page header (4) */
  --page-pad-y: var(--space-24); --page-access-gap: var(--space-8);
  --verdict-pad: var(--space-16); --count-w: 120px;

  /* page layout (7) */
  --page-gap: var(--space-16); --tiles: 4; --preview-w: 400px; --print-w: 794px;
  --tab-overflow-at: 8; --tab-min-visible: 2; --page-narrow: 1000px;

  /* M1 · the verdict block (2) */
  --verdict-measure: 92ch; --verdict-sentences: 2;

  /* M2 · the page access line (1) */
  --access-stack-gap: var(--space-2);

  /* M4 · the print surface (6) */
  --print-pad: var(--space-24); --print-cell: 24px; --print-name-w: 150px;
  --print-rule-w: 2px; --print-rows: 25; --print-days: 14;

  /* M6 · the channel preview card (4) */
  --prev-img-h: 96px; --prev-img-h-wide: 160px; --prev-img-gap: var(--space-4); --prev-imgs-max: 4;

  /* M7 · the page-level validation summary (2) */
  --vsum-indent: var(--space-24); --vsum-gap: var(--space-4);

  /* 7c · the time picker popover (row 45, REQ-011 / sheet 04 §7c) (2) */
  --tp-col-w: 56px; --tp-visible: 7;

  /* 1c / 1d · the Grid's tree rows, footer totals, sticky edges and detail row (row 19, REQ-007 / sheet 05 §1c–1d) (5) */
  --grid-name-w: 360px; --grid-day-w: 104px; --grid-total-w: 104px; --grid-scroll-h: 480px; --grid-toggle-w: 32px;

  /* 332 declarations */
}
