@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap'); :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: 217 91% 60%; --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: 217 91% 60%; --chart-1: 217 91% 60%; --chart-2: 142 71% 45%; --chart-3: 38 92% 50%; --chart-4: 0 84% 60%; --chart-5: 262 83% 58%; --radius: 0.5rem; --sidebar: 0 0% 100%; --sidebar-foreground: 240 5.3% 26.1%; --sidebar-primary: 217 91% 60%; --sidebar-primary-foreground: 0 0% 98%; --sidebar-accent: 217 91% 95%; --sidebar-accent-foreground: 217 91% 30%; --sidebar-border: 220 13% 91%; --sidebar-ring: 217 91% 60%; } /* Dark mode — applied via .dark class on */ .dark { --background: 222.2 84% 4.9%; --foreground: 210 40% 98%; --card: 222.2 47.4% 8%; --card-foreground: 210 40% 98%; --popover: 222.2 47.4% 8%; --popover-foreground: 210 40% 98%; --primary: 217 91% 60%; --primary-foreground: 222.2 47.4% 11.2%; --secondary: 217.2 32.6% 17.5%; --secondary-foreground: 210 40% 98%; --muted: 217.2 32.6% 17.5%; --muted-foreground: 215 20.2% 65.1%; --accent: 217.2 32.6% 17.5%; --accent-foreground: 210 40% 98%; --destructive: 0 62.8% 50.6%; --destructive-foreground: 210 40% 98%; --border: 217.2 32.6% 17.5%; --input: 217.2 32.6% 17.5%; --ring: 217 91% 60%; --sidebar: 222.2 47.4% 8%; --sidebar-foreground: 210 40% 90%; --sidebar-primary: 217 91% 60%; --sidebar-primary-foreground: 222.2 47.4% 11.2%; --sidebar-accent: 217 91% 18%; --sidebar-accent-foreground: 217 91% 85%; --sidebar-border: 217.2 32.6% 17.5%; --sidebar-ring: 217 91% 60%; } * { border-color: hsl(var(--border)); } html { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; -webkit-text-size-adjust: 100%; tab-size: 4; } body { margin: 0; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 14px; line-height: 1.5; color: hsl(var(--foreground)); background: hsl(var(--background)); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } *, *::before, *::after { box-sizing: border-box; border-width: 0; border-style: solid; } h1, h2, h3, h4, h5, h6, p { margin: 0; } ul, ol { margin: 0; padding: 0; list-style: none; } button, input, select, textarea { font: inherit; color: inherit; margin: 0; } button { cursor: pointer; background: none; border: none; padding: 0; } a { color: inherit; text-decoration: none; } img, svg { display: block; max-width: 100%; } ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: hsl(var(--border)); border-radius: 5px; } ::-webkit-scrollbar-thumb:hover { background: hsl(var(--muted-foreground) / 0.4); } :focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; } button:focus { outline: none; } button:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; }