:root {
    --bg: #080c16;
    --bg-elev: #0c1220;
    --surface: #111a2c;
    --surface-2: #152039;
    --border: #22304a;
    --border-soft: #1a2540;
    --text: #e8edf7;
    --text-dim: #8b96ac;
    --text-faint: #5b6884;
    --accent: #4c7eff;
    --accent-soft: rgba(76, 126, 255, .14);
    --mint: #22d3ac;
    --mint-soft: rgba(34, 211, 172, .14);
    --amber: #f5a623;
    --amber-soft: rgba(245, 166, 35, .14);
    --coral: #ff5c7a;
    --coral-soft: rgba(255, 92, 122, .14);
    --yt: #ff3b3b;
    --ig1: #f77737;
    --ig2: #c13584;
    --ig3: #833ab4;
    --fb: #3b82f6;
    --gmb: #34c77b;
    --radius: 14px;
    --radius-sm: 9px;
    --sidebar-w: 264px;
    --sidebar-w-collapsed: 76px;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    background:
        radial-gradient(1100px 600px at 85% -10%, rgba(76, 126, 255, .08), transparent 60%),
        radial-gradient(900px 500px at -10% 110%, rgba(34, 211, 172, .05), transparent 60%),
        var(--bg);
    color: var(--text);
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
}

h1,
h2,
h3,
.display {
    font-family: 'Space Grotesk', sans-serif;
}

.mono {
    font-family: 'JetBrains Mono', monospace;
}

a {
    color: inherit;
    text-decoration: none;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}