@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9144,400;9144,500;9144,600&family=Instrument+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap");
html:root {
  --background: 36 55.6% 96.5%;
  --foreground: 21.8 14.7% 14.7%;
  --card: 0 0% 100%;
  --card-foreground: 21.8 14.7% 14.7%;
  --popover: 0 0% 100%;
  --popover-foreground: 21.8 14.7% 14.7%;
  --primary: 14.4 49.8% 46.1%;
  --primary-foreground: 25 100% 97.6%;
  --secondary: 33 41.7% 90.6%;
  --secondary-foreground: 21.8 14.7% 14.7%;
  --muted: 33.8 40% 92.2%;
  --muted-foreground: 24.7 8.3% 40.2%;
  --accent: 24 62.5% 90.6%;
  --accent-foreground: 15.3 54.4% 31%;
  --destructive: 4.2 76.5% 40%;
  --destructive-foreground: 10 100% 97.6%;
  --border: 32.5 32.4% 85.5%;
  --input: 32.5 32.4% 85.5%;
  --ring: 14.4 49.8% 46.1%;
  --radius: 0.75rem;
  --font-heading: "Fraunces", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --shadow-sm: 0 1px 2px rgb(43 36 32 / 0.05);
  --shadow-md: 0 4px 14px -4px rgb(43 36 32 / 0.10);
  --shadow-lg: 0 16px 40px -12px rgb(43 36 32 / 0.16);
}
html .dark {
  --background: 20 12.5% 9.4%;
  --foreground: 32 38.5% 92.4%;
  --card: 25.7 11.1% 12.4%;
  --card-foreground: 32 38.5% 92.4%;
  --popover: 25.7 11.1% 12.4%;
  --popover-foreground: 32 38.5% 92.4%;
  --primary: 16.1 61.8% 61%;
  --primary-foreground: 10.9 25.6% 8.4%;
  --secondary: 24 12.8% 15.3%;
  --secondary-foreground: 32 38.5% 92.4%;
  --muted: 24 13.5% 14.5%;
  --muted-foreground: 26.4 14.5% 66.1%;
  --accent: 20 26.1% 18%;
  --accent-foreground: 19.7 71.1% 82.4%;
  --destructive: 358.1 75.1% 59%;
  --destructive-foreground: 10.9 25.6% 8.4%;
  --border: 23.1 12.6% 20.2%;
  --input: 23.1 12.6% 20.2%;
  --ring: 16.1 61.8% 61%;
}
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); }
