:root {
    --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --bg: #0b1020;
    --bg-soft: #11182c;
    --surface: rgba(255, 255, 255, 0.075);
    --surface-strong: rgba(255, 255, 255, 0.115);
    --surface-muted: rgba(255, 255, 255, 0.045);
    --border: rgba(255, 255, 255, 0.12);
    --text: #eef4ff;
    --text-muted: #9aa8c7;
    --primary: #70e1f5;
    --primary-strong: #6a8dff;
    --accent: #b388ff;
    --success: #4ade80;
    --warning: #fbbf24;
    --danger: #fb7185;

    --radius-xs: 10px;
    --radius-sm: 14px;
    --radius-md: 20px;
    --radius-lg: 28px;
    --shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.25);
    --shadow-glow: 0 0 50px rgba(112, 225, 245, 0.18);
    --sidebar-width: 292px;
    --topbar-height: 92px;
    --content-max: 1440px;
}

html[data-theme='light'] {
    --bg: #f4f7fb;
    --bg-soft: #e8eef8;
    --surface: rgba(255, 255, 255, 0.88);
    --surface-strong: rgba(255, 255, 255, 0.98);
    --surface-muted: rgba(15, 23, 42, 0.045);
    --border: rgba(15, 23, 42, 0.1);
    --text: #111827;
    --text-muted: #64748b;
    --shadow-soft: 0 18px 60px rgba(15, 23, 42, 0.10);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--font-sans);
    color: var(--text);
    background:
        radial-gradient(circle at top left, rgba(112, 225, 245, 0.18), transparent 34rem),
        radial-gradient(circle at 80% 8%, rgba(179, 136, 255, 0.18), transparent 28rem),
        linear-gradient(135deg, var(--bg), var(--bg-soft));
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}