:root {
    --bg: #f5f7f8;
    --bg-soft: #eef3f4;
    --surface: rgba(255, 255, 255, .88);
    --surface-solid: #ffffff;
    --surface-2: #f9fbfb;
    --surface-hover: #f3f8f8;
    --border: rgba(15, 48, 55, .10);
    --border-strong: rgba(15, 48, 55, .16);
    --text: #17343a;
    --text-strong: #0d252a;
    --muted: #6f858a;
    --muted-2: #91a2a6;
    --accent: #0d9ca6;
    --accent-strong: #087b84;
    --accent-soft: #dff5f5;
    --accent-faint: rgba(13, 156, 166, .08);
    --success: #25a86b;
    --warning: #d98b32;
    --danger: #d76363;
    --shadow-sm: 0 8px 28px rgba(22, 54, 61, .06);
    --shadow-md: 0 16px 48px rgba(22, 54, 61, .09);
    --sidebar-width: 252px;
    --topbar-height: 76px;
    --radius-sm: 12px;
    --radius: 18px;
    --radius-lg: 24px;
    --ease: cubic-bezier(.2,.8,.2,1);
    --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="dark"] {
    --bg: #0f1719;
    --bg-soft: #131e21;
    --surface: rgba(24, 36, 39, .92);
    --surface-solid: #182427;
    --surface-2: #1d2a2e;
    --surface-hover: #213236;
    --border: rgba(201, 231, 235, .09);
    --border-strong: rgba(201, 231, 235, .15);
    --text: #d9e7e9;
    --text-strong: #f4fbfb;
    --muted: #8fa5a9;
    --muted-2: #6f858a;
    --accent: #3bb8bf;
    --accent-strong: #69d0d5;
    --accent-soft: rgba(59, 184, 191, .14);
    --accent-faint: rgba(59, 184, 191, .08);
    --shadow-sm: 0 8px 28px rgba(0, 0, 0, .16);
    --shadow-md: 0 18px 54px rgba(0, 0, 0, .24);
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at 85% 5%, rgba(30, 179, 186, .08), transparent 28rem),
        radial-gradient(circle at 5% 95%, rgba(58, 139, 153, .06), transparent 24rem),
        var(--bg);
    color: var(--text);
    font-family: var(--font);
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    transition: background .35s ease, color .35s ease;
}
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
button, input, textarea { outline: none; }
img, svg { display: block; }
::selection { background: rgba(13,156,166,.18); }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(104, 131, 136, .28); border-radius: 20px; border: 2px solid transparent; background-clip: content-box; }

h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 { color: var(--text-strong); line-height: 1.18; letter-spacing: -.025em; }
h1 { font-size: clamp(2rem, 3vw, 2.75rem); margin-bottom: 10px; }
h2 { font-size: clamp(1.4rem, 2vw, 1.8rem); }
h3 { font-size: 1.15rem; }
p { color: var(--muted); }
small { font-size: .82rem; }
.icon { flex: 0 0 auto; }


/* v6 readability pass */
body { font-size: 16px; line-height: 1.6; }
h1 { font-size: clamp(2.15rem, 3vw, 3rem); }
h2 { font-size: clamp(1.55rem, 2.2vw, 2rem); }
h3 { font-size: 1.22rem; }
small { font-size: .86rem; }
button, input, textarea, select { font-size: 15px; }

:root { --sidebar-width: 264px; }