:root {
  --background: 204 100% 97%;
  --foreground: 202 80% 24%;
  --card: 0 0% 100%;
  --card-foreground: 202 80% 24%;
  --popover: 0 0% 100%;
  --popover-foreground: 202 80% 24%;
  --primary: 201 96% 32%;
  --primary-foreground: 0 0% 100%;
  --secondary: 199 89% 48%;
  --secondary-foreground: 0 0% 100%;
  --muted: 206 41% 93%;
  --muted-foreground: 215 16% 47%;
  --accent: 142 76% 36%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 72% 51%;
  --destructive-foreground: 0 0% 100%;
  --border: 201 94% 86%;
  --input: 201 94% 86%;
  --ring: 201 96% 32%;
  --radius: 0.5rem;
}

.dark {
  --background: 223 49% 8%;
  --foreground: 204 100% 97%;
  --card: 222 47% 11%;
  --card-foreground: 204 100% 97%;
  --popover: 222 47% 11%;
  --popover-foreground: 204 100% 97%;
  --primary: 198 93% 60%;
  --primary-foreground: 202 80% 24%;
  --secondary: 200 98% 39%;
  --secondary-foreground: 204 100% 97%;
  --muted: 217 33% 17%;
  --muted-foreground: 215 20% 65%;
  --accent: 142 71% 45%;
  --accent-foreground: 202 80% 24%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 204 100% 97%;
  --border: 217 33% 17%;
  --input: 217 33% 17%;
  --ring: 198 93% 60%;
  --radius: 0.5rem;
  color-scheme: dark;
}

@layer base {
  * { @apply border-border; }
  body {
    @apply bg-background text-foreground;
    font-family: 'Fira Sans', system-ui, -apple-system, sans-serif;
  }
}