/* ============================================================
   Statistical Engines — design tokens (instrument-panel system)
   ============================================================ */
:root {
    --se-bg: #E7EEF5;
    --se-bg-grid: rgba(19,28,46,0.05);
    --se-surface: #FCFDFE;
    --se-surface-raised: #FFFFFF;
    --se-ink: #131C2E;
    --se-ink-muted: #5B6B82;
    --se-ink-faint: #93A2B8;
    --se-line: rgba(19,28,46,0.14);
    --se-line-strong: rgba(19,28,46,0.28);

    --se-brass: #B5762E;
    --se-steel: #1F6E9C;
    --se-rust: #A13E2E;

    --se-positive: #3F7D5C;
    --se-negative: #B23B2E;

    --se-shadow: 0 1px 2px rgba(19,28,46,0.06), 0 8px 24px -12px rgba(19,28,46,0.14);
}

@media (prefers-color-scheme: dark) {
    :root {
        --se-bg: #0E1620;
        --se-bg-grid: rgba(231,238,245,0.045);
        --se-surface: #172233;
        --se-surface-raised: #1C2940;
        --se-ink: #E7EEF5;
        --se-ink-muted: #8FA0B8;
        --se-ink-faint: #5C6C82;
        --se-line: rgba(231,238,245,0.14);
        --se-line-strong: rgba(231,238,245,0.26);

        --se-brass: #BA7E3A;
        --se-steel: #4A9BCC;
        --se-rust: #D07059;

        --se-positive: #5FA37D;
        --se-negative: #D9695A;

        --se-shadow: 0 1px 2px rgba(0,0,0,0.3), 0 12px 32px -12px rgba(0,0,0,0.5);
    }
}

* { box-sizing: border-box; }

body {
    background:
        linear-gradient(var(--se-bg-grid) 1px, transparent 1px) 0 0 / 32px 32px,
        linear-gradient(90deg, var(--se-bg-grid) 1px, transparent 1px) 0 0 / 32px 32px,
        var(--se-bg);
    color: var(--se-ink);
    font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Big Shoulders Display", sans-serif;
    font-weight: 600;
    letter-spacing: 0.01em;
}

a { color: var(--se-brass); }
a:hover { color: var(--se-brass); opacity: 0.85; }

.mono {
    font-family: "IBM Plex Mono", ui-monospace, "SF Mono", Consolas, monospace;
    font-variant-numeric: tabular-nums;
}

/* ===== Navbar ===== */
.navbar.se-navbar {
    background: var(--se-surface) !important;
    border-bottom: 2px solid var(--se-line-strong);
    box-shadow: none;
}
.se-navbar .navbar-brand {
    font-family: "Big Shoulders Display", sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: 0.01em;
    color: var(--se-ink) !important;
}
.se-navbar .nav-link {
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--se-ink-muted) !important;
}
.se-navbar .nav-link:hover,
.se-navbar .nav-link.active { color: var(--se-brass) !important; }
.se-navbar .navbar-toggler {
    border-color: var(--se-line-strong);
}
.se-navbar .navbar-toggler-icon {
    filter: var(--se-navbar-toggler-filter, none);
}
@media (prefers-color-scheme: dark) {
    .se-navbar .navbar-toggler-icon { filter: invert(1); }
}

/* ===== Bootstrap component overrides for the instrument-panel palette ===== */
.card {
    background: var(--se-surface);
    border-color: var(--se-line);
    color: var(--se-ink);
}
.table { color: var(--se-ink); }
.table > :not(caption) > * > * { background: transparent; color: inherit; }
.btn-primary {
    background: var(--se-brass);
    border-color: var(--se-brass);
}
.btn-primary:hover {
    background: var(--se-rust);
    border-color: var(--se-rust);
}
.form-control, .form-select {
    background: var(--se-surface);
    border-color: var(--se-line);
    color: var(--se-ink);
}
.form-control:focus, .form-select:focus {
    border-color: var(--se-brass);
    box-shadow: 0 0 0 0.2rem rgba(181,118,46,0.2);
}

/* ============================================================
   Public home page — shared widget/chart mechanics
   (bento grid + panel layout lives in home.css, loaded only
   on the home page)
   ============================================================ */
.chart-container svg { display: block; width: 100%; overflow: visible; }