/* Craig design tokens: the single source for color, type, geometry, and scene motion.
   Colors and type stacks come from the extension's shipped UI. Nothing else in the site
   may use a color literal. */
:root {
  color-scheme: light;

  /* Neutrals */
  --ink: #0c0e0d;
  --paper: #f8faf7;
  --foam: #c9cec8;
  --quiet: #313631;

  /* On-ink neutrals: the site's dark coverage band and footer (the extension has no dark surface) */
  --quiet-on-ink: #aeb5ae;
  --rule-on-ink: #4c544d;
  --grid-on-ink: rgba(248, 250, 247, .09);

  /* Callouts: a light tint of paper for short asides */
  --callout: #eceee9;

  /* State colors: the extension's risk bands. Only for the gauge, finding borders, and finding labels. */
  --state-low: #2f8a35;
  --state-caution: #9a6714;
  --state-elevated: #b2571f;
  --state-high: #b23a38;
  --positive: var(--state-low);
  --danger: var(--state-high);

  /* Type */
  --font-ui: system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Geometry: 8px rhythm, hard 2px rules, square corners */
  --space: 8px;
  --border: 2px solid var(--ink);
  --hairline: 1px solid var(--foam);
  --shadow-panel: 8px 8px 0 rgba(12, 14, 13, .14);

  /* Scene motion: always stepped, never smooth */
  --idle-loop: 6s steps(48) infinite;
  --tide-loop: 9s steps(4, end) infinite;
  --lookout-loop: 5s steps(2, end) infinite;
}