@font-face {
  font-family: Lora;
  src: url("assets/Lora.ttf") format("truetype");
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: Manrope;
  src: url("assets/Manrope.ttf") format("truetype");
  font-weight: 200 800;
  font-display: swap;
}
:root {
  color-scheme: light;
  --color-ink: #3b2e24;
  --color-muted: #726355;
  --color-accent: #d4a017;
  --color-accent-hover: #c69412;
  --color-paper: #fefbf6;
  --color-paper-warm: #f8e6c8;
  --color-surface: #ffffff;
  --color-blue: #5b6e8a;
  --color-green: #6baa77;
  --color-coral: #e6afa3;
  --color-soft-blue: #d7e7f3;
  --color-success: #34643d;
  --color-success-surface: #eef5ea;
  --color-error: #923e32;
  --color-error-surface: #fcf0eb;
  --color-info: #405572;
  --color-info-surface: #eef3f8;
  --color-gold-surface: #fbf0d7;
  --color-line: #e7ded1;
  --color-control-line: #968473;
  --color-focus: #405572;
  --font-display: Lora, Georgia, serif;
  --font-ui: Manrope, system-ui, sans-serif;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --shadow-small: 0 4px 16px #3b2e2408;
}