:root {
    --bg: #090b10;
    --surface: #12151c;
    --surface-2: #1a1f2b;
    --surface-3: #232936;
    --border: #2d3548;
    --border-focus: #14b8a6;
    --text: #eef2f7;
    --text-muted: #8b95a8;
    --primary: #14b8a6;
    --primary-hover: #0d9488;
    --primary-glow: rgba(20, 184, 166, 0.15);
    --primary-soft: rgba(20, 184, 166, 0.12);
    --success: #34d399;
    --danger: #f87171;
    --warning: #fbbf24;
    --radius: 10px;
    --radius-lg: 14px;
    --shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
    --font: 'Plus Jakarta Sans', system-ui, sans-serif;
    --font-mono: 'IBM Plex Mono', monospace;
    --sidebar-w: 240px;
    --topbar-h: 60px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
    font-family: var(--font);
    background: var(--bg);
    color: var(--text);
    line-height: 1.6;
    min-height: 100vh;
}

body.mesh-bg::before {
    content: '';
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 15% 20%, rgba(20, 184, 166, 0.08), transparent 45%),
        radial-gradient(circle at 85% 75%, rgba(59, 130, 246, 0.06), transparent 40%);
    pointer-events: none;
    z-index: 0;
}

a { color: var(--primary); text-decoration: none; }
a:hover { color: #2dd4bf; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }

.mono { font-family: var(--font-mono); font-size: 0.85em; }

.text-muted { color: var(--text-muted); }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }