:root {
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;
  --primary: 222.2 47.4% 11.2%;
  --primary-foreground: 210 40% 98%;
  --secondary: 210 40% 96.1%;
  --secondary-foreground: 222.2 47.4% 11.2%;
  --muted: 210 40% 96.1%;
  --muted-foreground: 215.4 16.3% 46.9%;
  --accent: 210 40% 96.1%;
  --accent-foreground: 222.2 47.4% 11.2%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;
  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 222.2 84% 4.9%;
  --radius: 0.75rem;
}

* { border-color: hsl(var(--border)); }
body { background: hsl(var(--background)); color: hsl(var(--foreground)); }
.glass-grid {
  background-image:
    linear-gradient(to right, rgba(15,23,42,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15,23,42,.06) 1px, transparent 1px);
  background-size: 36px 36px;
}
.card {
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  background: hsl(var(--card));
  color: hsl(var(--card-foreground));
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: calc(var(--radius) - 2px);
  padding: .625rem 1rem;
  font-size: .875rem;
  font-weight: 600;
  transition: .15s ease;
  border: 1px solid transparent;
}
.btn-primary { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-primary:hover { opacity: .92; }
.btn-secondary { background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground)); }
.btn-secondary:hover { background: hsl(210 40% 92%); }
.btn-outline { border-color: hsl(var(--border)); background: transparent; }
.btn-outline:hover { background: hsl(var(--accent)); }
.btn-ghost:hover { background: hsl(var(--accent)); }
.input, .textarea, .select {
  width: 100%;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--input));
  background: transparent;
  padding: .625rem .75rem;
  font-size: .875rem;
  outline: none;
}
.textarea { min-height: 110px; resize: vertical; }
.input:focus, .textarea:focus, .select:focus {
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}
.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid hsl(var(--border));
  padding: .125rem .5rem;
  font-size: .75rem;
  font-weight: 600;
  color: hsl(var(--muted-foreground));
}
.prose-ai h3 { font-weight: 800; margin-top: 1rem; margin-bottom: .5rem; }
.prose-ai p { margin: .5rem 0; }
.prose-ai ul { list-style: disc; padding-left: 1.25rem; margin: .5rem 0; }
.prose-ai ol { list-style: decimal; padding-left: 1.25rem; margin: .5rem 0; }
.prose-ai pre { background: #0f172a; color: white; padding: 1rem; border-radius: .75rem; overflow-x: auto; }
.prose-ai code { background: hsl(var(--muted)); padding: .1rem .25rem; border-radius: .25rem; }
.scrollbar-thin::-webkit-scrollbar { width: 8px; height: 8px; }
.scrollbar-thin::-webkit-scrollbar-track { background: transparent; }
.scrollbar-thin::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }