/* ============================================================
   FSI DESIGN SYSTEM — shared across static pages and the
   daily-generated pages (snapshot.py, domain_scorecard.py).
   Loaded AFTER each page's inline <style> so it wins the cascade.

   Identity: financial-terminal / editorial.
   - Ink-black surfaces, one amber brand accent.
   - Green/red reserved for data direction only.
   - Space Grotesk for prose, IBM Plex Mono for every number.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
    --ink:        #0B0D12;
    --ink-raise:  #11151C;
    --surface:    #161C24;
    --line:       #232B36;
    --muted:      #5A6472;
    --dim:        #76828F;
    --text-2:     #9CA7B2;
    --text:       #E6E9ED;
    --bright:     #F7F9FB;
    --accent:     #E3A857;   /* brand amber */
    --accent-2:   #EFC689;
    --up:         #22c55e;
    --down:       #ef4444;
    --font-sans:  'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono:  'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

/* ── Typography ─────────────────────────────────────────── */

body {
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
    font-family: var(--font-sans);
    letter-spacing: -0.015em;
}

/* Every number on the site reads as data */
table, td, th {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
}
th {
    font-family: var(--font-mono);
    font-weight: 600;
    letter-spacing: 0.06em;
}

/* Nav and footer become terminal chrome */
.nav-links a, .nav-mobile a {
    font-family: var(--font-mono);
    font-size: 0.74rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
footer {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.02em;
}

/* Data-stamp convention — use on "Updated ..." lines */
.stamp, .updated {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--muted);
}

/* ── Shared components (used by the new homepage and available
      to generated pages) ─────────────────────────────────── */

.kicker {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--accent);
}

.panel {
    background: var(--ink-raise);
    border: 1px solid var(--line);
    border-radius: 10px;
}

.btn-solid {
    display: inline-block;
    background: var(--accent);
    color: #14110A !important;
    font-family: var(--font-mono);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 13px 26px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: filter 0.15s;
}
.btn-solid:hover { filter: brightness(1.1); }

.btn-ghost {
    display: inline-block;
    background: transparent;
    color: var(--text-2) !important;
    font-family: var(--font-mono);
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 12px 22px;
    border-radius: 8px;
    border: 1px solid var(--line);
    transition: border-color 0.15s, color 0.15s;
}
.btn-ghost:hover { border-color: var(--accent); color: var(--accent) !important; }

.delta-up   { color: var(--up); }
.delta-down { color: var(--down); }

/* Momentum heat cells (domain strip) */
.heat-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    background: var(--ink-raise);
    border: 1px solid var(--line);
    border-radius: 8px;
    text-decoration: none;
    transition: border-color 0.15s;
}
.heat-cell:hover { border-color: var(--accent); }
.heat-cell .hc-name {
    font-size: 0.8rem;
    color: var(--text-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.heat-cell .hc-val {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    font-weight: 600;
}