:root {
  --paper: #fefdfa;
  --paper-alt: #f3efe7;
  --paper-sunk: #e9e4d8;
  --ink: #1a1a1a;
  --ink-2: #4a4a47;
  --ink-muted: #8a8a85;
  --ink-faint: #b8b4ac;
  --border: #e3dfd7;
  --border-strong: #c9c3b6;
  --border-faint: #efeae0;
  --critical: #c1272d;
  --critical-bg: #fbeceb;
  --critical-border: #f0c7c4;
  --high: #e07a1f;
  --high-bg: #fcf0e3;
  --high-border: #f3d4ad;
  --low: #3a7a3a;
  --low-bg: #e5f0e2;
  --low-border: #b9d6b5;
  --info: #3a6ea5;
  --info-bg: #e6eef7;
  --info-border: #b3c8df;
  --accent: #5a3aa5;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --r-2: 4px;
  --r-3: 8px;
  --r-pill: 999px;
  --control-h: 32px;
  --shadow-focus: 0 0 0 3px rgba(90, 58, 165, 0.18);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 120ms;
}

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

html { color-scheme: light; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
}

a { color: var(--ink); }
a:hover { color: var(--accent); }