/* ============================================================
   Sciento — Design Tokens
   ============================================================ */
:root {
  /* Color */
  --ink: #0A0A0A;
  --ink-2: #1F1F1E;
  --paper: #F5F2EC;
  --surface: #FFFFFF;
  --surface-2: #FAF8F3;
  --line: #E5E2D8;
  --line-2: #D6D3C8;
  --muted: #6E6C66;
  --muted-2: #9B9890;
  --accent: #1B4332;
  --accent-ink: #0F2A1F;
  --accent-soft: #E6ECE8;
  --signal: #B5651D;
  --success: #2F6B3E;
  --warn: #8A6A18;
  --danger: #8C2A2A;

  /* Type */
  --font-serif: "Instrument Serif", "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Spacing (4px scale) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --s-10: 128px;
  --s-11: 160px;

  /* Radius */
  --r-sm: 4px;
  --r: 8px;
  --r-lg: 12px;

  /* Layout */
  --container-content: 720px;
  --container-prose: 880px;
  --container: 1200px;
  --container-wide: 1360px;

  /* Lines */
  --border: 1px solid var(--line);
  --border-strong: 1px solid var(--line-2);
  --border-ink: 1px solid var(--ink);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}