/* ============================================================================
   Design tokens — the accepted design language from /v2/mockup.html.
   Loaded by both the public site and /admin so diagrams and previews look
   identical in both places. Do not fork these values.
   ========================================================================== */

:root {
  /* surfaces */
  --paper: #fbfaf7;
  --paper-2: #f4f1e9;
  --panel: #ffffff;

  /* ink */
  --ink: #1a1917;
  --ink-70: #4e4a44;
  /* 4.61:1 on --paper — clears WCAG AA for small text (was #7b756b at 4.37:1). */
  --muted: #787168;
  --faint: #a8a196;

  /* rules */
  --rule: rgba(26, 25, 23, 0.14);
  --rule-soft: rgba(26, 25, 23, 0.075);

  /* accent */
  --accent: #b4432a;
  --accent-soft: rgba(180, 67, 42, 0.32);
  --accent-wash: rgba(180, 67, 42, 0.045);

  /* type */
  --serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia,
    'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, Roboto, Helvetica, Arial,
    sans-serif;
  --mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  /* page */
  --page: 1160px;
  --gutter: 48px;
}

@media (max-width: 1000px) {
  :root {
    --gutter: 36px;
  }
}

@media (max-width: 680px) {
  :root {
    --gutter: 22px;
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}