html:root {
  --background: 40 48.4% 93.9%;
  --foreground: 229.6 27.7% 16.3%;
  --card: 42 55.6% 96.5%;
  --card-foreground: 229.6 27.7% 16.3%;
  --popover: 42 55.6% 96.5%;
  --popover-foreground: 229.6 27.7% 16.3%;
  --primary: 222.6 48.7% 15.3%;
  --primary-foreground: 40 48.4% 93.9%;
  --secondary: 40 31% 88.6%;
  --secondary-foreground: 222.6 48.7% 15.3%;
  --muted: 40 31% 88.6%;
  --muted-foreground: 228 9.5% 41.2%;
  --accent: 39.4 40.8% 49%;
  --accent-foreground: 222.6 48.7% 15.3%;
  --destructive: 0 55.8% 39%;
  --destructive-foreground: 40 48.4% 93.9%;
  --border: 40 27.9% 83.1%;
  --input: 41.4 26.1% 78.2%;
  --ring: 222.6 48.7% 15.3%;
  --radius: 0.375rem;
  --font-heading: "Fraunces", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "Menlo", ui-monospace, monospace;
  --shadow-sm: 0 1px 2px rgb(30 34 53 / 0.06);
  --shadow-md: 0 4px 14px -4px rgb(30 34 53 / 0.12);
  --shadow-lg: 0 16px 40px -12px rgb(30 34 53 / 0.18);
}
html body { font-family: var(--font-body); }
html h1, html h2, html h3, html h4, html h5, html h6, html .font-heading, html .font-display { font-family: var(--font-heading); }
html .font-sans, html .font-body { font-family: var(--font-body); }
html .font-mono { font-family: var(--font-mono); }
