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

:root {
    --bg-body: #f5f7fb;
    --bg-container: rgba(255, 255, 255, 0.88);
    --bg-nav: rgba(18, 24, 33, 0.92);
    --text-main: #182233;
    --text-muted: #647084;
    --accent: #1f8f8a;
    --accent-2: #e95f46;
    --accent-3: #d69b1f;
    --accent-4: #7c5cff;
    --accent-5: #19a66a;
    --danger: #e24a4a;
    --warning: #d88a17;
    --success: #16a36f;
    --info: #2878d8;
    --border: rgba(23, 34, 51, 0.1);
    --header-bg: rgba(247, 249, 252, 0.82);
    --shadow-soft: 0 18px 50px rgba(32, 45, 70, 0.1);
    --shadow-card: 0 12px 30px rgba(32, 45, 70, 0.08);
    --ring-teal: rgba(31, 143, 138, 0.18);
    --ring-coral: rgba(233, 95, 70, 0.18);
    --ring-amber: rgba(214, 155, 31, 0.18);
    --ring-violet: rgba(124, 92, 255, 0.18);
    --card-bg: rgba(255, 255, 255, 0.9);
    --soft-bg: rgba(247, 250, 252, 0.82);
    --chip-bg: rgba(31, 143, 138, 0.1);
    --border-color: var(--border);
}

[data-theme="dark"] {
    --bg-body: #080b12;
    --bg-container: rgba(18, 24, 34, 0.86);
    --bg-nav: rgba(7, 10, 16, 0.94);
    --text-main: #edf3fb;
    --text-muted: #9aa9bd;
    --accent: #24c6b8;
    --accent-2: #ff735f;
    --accent-3: #f1b742;
    --accent-4: #9b83ff;
    --accent-5: #39d98a;
    --border: rgba(255,255,255,0.11);
    --header-bg: rgba(13, 18, 27, 0.88);
    --shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.32);
    --shadow-card: 0 12px 38px rgba(0, 0, 0, 0.26);
    --card-bg: rgba(18, 24, 34, 0.88);
    --soft-bg: rgba(255, 255, 255, 0.06);
    --chip-bg: rgba(36, 198, 184, 0.12);
    --border-color: var(--border);
}

body { 
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: var(--bg-body); 
    color: var(--text-main); 
    padding-top: 80px; 
    transition: background-color 0.5s; 
    line-height: 1.5; 
    min-height: 100vh; 
}

::selection {
    background: var(--accent);
    color: white;
}

button,
input {
    font: inherit;
}