@layer base {
  :root {
    --background: 36 30% 98%;
    --foreground: 25 35% 15%;

    --card: 36 25% 96%;
    --card-foreground: 25 35% 15%;

    --popover: 36 25% 96%;
    --popover-foreground: 25 35% 15%;

    --primary: 26 78% 38%;
    --primary-foreground: 40 50% 98%;

    --secondary: 32 40% 90%;
    --secondary-foreground: 25 35% 15%;

    --muted: 32 20% 92%;
    --muted-foreground: 25 15% 42%;

    --accent: 38 85% 50%;
    --accent-foreground: 25 35% 10%;

    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;

    --border: 32 25% 85%;
    --input: 32 25% 85%;
    --ring: 26 78% 38%;

    --radius: 0.5rem;
  }
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  scroll-behavior: smooth;
}