/* ===== Reset & variables ===== */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

:root {
    --color-primary: #1e4a7a;
    --color-primary-dark: #143252;
    --color-primary-light: #e8f0fa;
    --color-accent: #ff6b35;
    --color-accent-dark: #e05420;

    --color-success: #1a9e5c;
    --color-success-bg: #e6f7ee;
    --color-warning: #d97706;
    --color-warning-bg: #fef3e2;
    --color-danger: #dc2626;
    --color-danger-bg: #fdecec;
    --color-info: #2563eb;
    --color-info-bg: #eaf1fe;

    --color-text: #1c2530;
    --color-text-muted: #5b6b7c;
    --color-border: #d9e1ea;
    --color-bg: #f4f7fb;
    --color-surface: #ffffff;

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;

    --shadow-sm: 0 1px 3px rgba(20, 40, 70, 0.08);
    --shadow-md: 0 4px 16px rgba(20, 40, 70, 0.12);
    --shadow-lg: 0 12px 32px rgba(20, 40, 70, 0.18);

    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --header-height: 60px;
}

body {
    font-family: var(--font-sans);
    color: var(--color-text);
    background: var(--color-bg);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { margin: 0 0 0.5em; font-weight: 700; line-height: 1.25; color: var(--color-primary-dark); }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.1rem; }
p { margin: 0 0 1em; }
a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

small, .text-muted { color: var(--color-text-muted); }

::-webkit-scrollbar { height: 10px; width: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c3cedb; border-radius: 8px; }