@font-face { font-family: "Inter"; src: url("../fonts/InterVariable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/InterVariable-Italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-Variable-latin.woff2") format("woff2"); font-weight: 100 800; font-style: normal; font-display: swap; }
:root, [data-theme="dark"] {
  --bg: #0a0a0a;
  --ink: #f2f2f2;
  --ink-muted: #a8a8a8;
  --rule: var(--ink);
  --rule-soft: #636363;
  --hover: #1a1a1a;
  --tag-bg: #333333;
  --accent: #9cc2a5;
  --on-accent: #0a0a0a;
  --on-ink: var(--bg);
  --danger: #ff8f75;
  --scrim: #000000;
}
[data-theme="light"] {
  --bg: #ffffff;
  --ink: #000000;
  --ink-muted: #595959;
  --rule: var(--ink);
  --rule-soft: #8c8c8c;
  --hover: #f0f0f0;
  --tag-bg: #e4e4e4;
  --accent: #3d6a4a;
  --on-accent: #ffffff;
  --on-ink: var(--bg);
  --danger: #c0392b;
  --scrim: #000000;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-none: 0;
  --size-text: 680px;
  --size-rule: 1px;
  --size-control: 44px;
  --size-check: 16px;
  --duration-fast: 80ms;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
.display { font-family: var(--font-sans); font-size: 72px; line-height: 0.95; font-weight: 800; letter-spacing: -0.03em; }
.section { font-family: var(--font-sans); font-size: 40px; line-height: 1; font-weight: 800; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-sans); font-size: 40px; line-height: 44px; font-weight: 700; letter-spacing: -0.02em; }
.h2 { font-family: var(--font-sans); font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -0.01em; }
.h3 { font-family: var(--font-sans); font-size: 18px; line-height: 24px; font-weight: 600; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 28px; font-weight: 400; }
.ui { font-family: var(--font-sans); font-size: 16px; line-height: 22px; font-weight: 500; }
.small { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.button { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 600; letter-spacing: 0.01em; }
.tag { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 500; letter-spacing: 0.02em; }
.meta { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }