/* Attention Genie — Riso Press tokens
   Locked visual system (Claude direction 5a). Paper / ink / amber is superseded.
   Pair with RISO_PRESS.md. CEO copy locks live in DESIGN_SYSTEM.md. */

:root {
  /* Color — two inks and a paper. Do not invent a third. */
  --ag-paper: oklch(0.965 0.024 92);
  --ag-blue: oklch(0.45 0.24 265);
  --ag-orange: oklch(0.74 0.21 48);
  --ag-blue-deep: oklch(0.25 0.16 265);
  --ag-blue-ink: oklch(0.3 0.2 265);
  --ag-orange-ink: oklch(0.55 0.19 45);

  /* Type — each face has one job */
  --ag-display: "Archivo Black", "Arial Black", Impact, sans-serif;
  --ag-label: "Space Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ag-body: "Karla", "Helvetica Neue", Helvetica, Arial, sans-serif;

  --ag-display-size: 62px;
  --ag-display-line: 0.94;
  --ag-display-track: -0.045em;
  --ag-display-max: 11ch;
  --ag-h2: 34px;
  --ag-step: 30px;
  --ag-door-title: 20px;
  --ag-price: 52px;
  --ag-body-size: 15.5px;
  --ag-body-line: 1.4;
  --ag-label-size: 12px;
  --ag-label-track: 0.1em;
  --ag-chip-size: 11.5px;
  --ag-wordmark: 19px;

  /* Space */
  --ag-gutter: 44px;
  --ag-band-y: 46px;
  --ag-gap: 16px;
  --ag-card-pad: 22px 20px 24px;
  --ag-door-pad: 24px 22px;
  --ag-header-y: 20px;

  /* Chrome — radius 0 everywhere. The only curve is a circle. */
  --ag-radius: 0;
  --ag-rule: 3px;
  --ag-rule-header: 4px;
  --ag-rule-chip: 2px;

  --ag-circle-lg: 200px;
  --ag-circle-sm: 152px;
}

@media (max-width: 800px) {
  :root {
    --ag-gutter: 24px;
    --ag-band-y: 36px;
    --ag-header-y: 16px;
    --ag-display-size: 44px;
    --ag-h2: 28px;
    --ag-step: 28px;
    --ag-price: 48px;
  }
}

@media (max-width: 480px) {
  :root {
    --ag-gutter: 20px;
    --ag-band-y: 32px;
    --ag-display-size: 36px;
    --ag-h2: 26px;
    --ag-wordmark: 15px;
    --ag-price: 44px;
    --ag-circle-lg: 120px;
    --ag-circle-sm: 92px;
  }
}