@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap");
html:root {
  --background: 42.9 30.4% 95.5%;
  --foreground: 30 12.5% 6.3%;
  --card: 0 0% 100%;
  --card-foreground: 30 12.5% 6.3%;
  --popover: 0 0% 100%;
  --popover-foreground: 30 12.5% 6.3%;
  --primary: 357.7 72.1% 49.2%;
  --primary-foreground: 0 0% 100%;
  --secondary: 30 12.5% 6.3%;
  --secondary-foreground: 42.9 30.4% 95.5%;
  --muted: 41.5 25.5% 90%;
  --muted-foreground: 38.6 7.1% 38.8%;
  --accent: 41.2 24.2% 87.1%;
  --accent-foreground: 30 12.5% 6.3%;
  --destructive: 357.3 77.8% 38.8%;
  --destructive-foreground: 0 0% 100%;
  --border: 41.1 21.3% 82.5%;
  --input: 41.7 17.6% 74.3%;
  --ring: 357.7 72.1% 49.2%;
  --radius: 0rem;
  --font-heading: "Archivo", ui-sans-serif, system-ui, sans-serif;
  --font-body: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --shadow-sm: 0 1px 0 0 rgb(18 16 14 / 0.10);
  --shadow-md: 0 2px 0 0 rgb(18 16 14 / 0.12);
  --shadow-lg: 0 18px 40px -24px rgb(18 16 14 / 0.45);
}
html .dark {
  --background: 30 12.5% 6.3%;
  --foreground: 42 31.3% 93.7%;
  --card: 36 10.6% 9.2%;
  --card-foreground: 42 31.3% 93.7%;
  --popover: 36 10.6% 9.2%;
  --popover-foreground: 42 31.3% 93.7%;
  --primary: 2.3 77.4% 53.1%;
  --primary-foreground: 0 0% 100%;
  --secondary: 42 31.3% 93.7%;
  --secondary-foreground: 30 12.5% 6.3%;
  --muted: 42 16.7% 11.8%;
  --muted-foreground: 40 8.9% 60.4%;
  --accent: 36 15.2% 12.9%;
  --accent-foreground: 42 31.3% 93.7%;
  --destructive: 3.5 100% 66.1%;
  --destructive-foreground: 30 12.5% 6.3%;
  --border: 38.2 13.6% 15.9%;
  --input: 38.6 13.7% 20%;
  --ring: 2.3 77.4% 53.1%;
}
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); }