:root {
  color-scheme: light;
  --paper: #f5f0e8;
  --paper-strong: #fffdf9;
  --ink: #24211d;
  --ink-soft: #6d665e;
  --line: rgba(67, 56, 45, .14);
  --brand: #a4472d;
  --brand-deep: #7f321e;
  --brand-soft: #f2d5c6;
  --sage: #66826d;
  --shadow: 0 16px 44px rgba(55, 42, 29, .10);
  --shadow-soft: 0 5px 18px rgba(55, 42, 29, .08);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 30px;
  --space-1: .35rem;
  --space-2: .65rem;
  --space-3: 1rem;
  --space-4: 1.4rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --tap: 44px;
  --nav-height: 72px;
  --content-max: 1120px;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
}

[data-theme="dark"] {
  color-scheme: dark;
  --paper: #171512;
  --paper-strong: #211e1a;
  --ink: #f3eee6;
  --ink-soft: #afa79d;
  --line: rgba(239, 227, 212, .12);
  --brand: #df7c5e;
  --brand-deep: #f39a7d;
  --brand-soft: #48291f;
  --sage: #8cad95;
  --shadow: 0 18px 48px rgba(0, 0, 0, .28);
  --shadow-soft: 0 5px 20px rgba(0, 0, 0, .20);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #171512;
    --paper-strong: #211e1a;
    --ink: #f3eee6;
    --ink-soft: #afa79d;
    --line: rgba(239, 227, 212, .12);
    --brand: #df7c5e;
    --brand-deep: #f39a7d;
    --brand-soft: #48291f;
    --sage: #8cad95;
  }
}