/* ============================================================
   DilutionWatch — shared page theme override · 2026-07
   Loaded AFTER per-page inline styles on tracker/data pages.
   Aligns them with the refined system in homepage.css:
   Plus Jakarta Sans + JetBrains Mono, single accent, hairline
   borders, no gradient text, no pills, no glows, no emoji icons.
   ============================================================ */
:root{
    --bg-primary:#0a0e16;--bg-card:#0e131d;--bg-card-hover:#131926;
    --border:rgba(151,163,182,0.13);--border-hover:rgba(122,167,240,0.4);
    --text-primary:#e9eef6;--text-secondary:#97a3b6;--text-muted:#5f6c81;
    --sky-blue:#7aa7f0;--primary:#3b82f6;
    --critical:#e2606c;--high:#d9a03f;--medium:#5b93e8;--low:#34b98a;
    --font-ui:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
}
body{font-family:var(--font-ui);background:var(--bg-primary);color:var(--text-primary)}
a{color:var(--sky-blue)}
a:hover{color:#a8c4f4}

/* page hero */
.hero-badge{display:inline-block;background:transparent;border:1px solid rgba(122,167,240,0.35);border-radius:4px;padding:4px 12px;font-size:0.68rem;color:var(--sky-blue);font-weight:500;text-transform:uppercase;letter-spacing:0.14em;gap:0;font-family:var(--font-mono)}
.hero-badge::before{content:none}
.hero h1{background:none;-webkit-text-fill-color:currentColor;color:var(--text-primary);font-weight:700;letter-spacing:-0.025em}
.hero h1 span{background:none;-webkit-text-fill-color:currentColor;color:var(--sky-blue)}
.hero p,.hero-desc{color:var(--text-secondary)}

/* bolted-on seo cta bands (inline-styled in some pages) */
.seo-cta,.seo-static-notes,.seo-extra-notes{background:var(--bg-card)!important;border:1px solid var(--border)!important;border-left:2px solid var(--primary)!important;border-radius:10px!important;color:var(--text-primary)!important}
.seo-static-notes p,.seo-extra-notes p{color:var(--text-secondary)!important}

/* stats */
.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px}
.stat-value{font-family:var(--font-mono);font-weight:600;color:var(--text-primary)}
.stat-value.critical{color:var(--critical)}
.stat-value.warn{color:var(--high)}
.stat-label{font-family:var(--font-mono);letter-spacing:0.1em;font-size:0.68rem}

/* controls */
.filter-btn{background:transparent;border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);font-family:var(--font-ui)}
.filter-btn:hover,.filter-btn.active{background:rgba(59,130,246,0.08);border-color:rgba(122,167,240,0.45);color:var(--sky-blue)}
.search-input{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;font-family:var(--font-ui)}
.search-input:focus{border-color:rgba(122,167,240,0.5)}

/* tables */
th{background:var(--bg-card);color:var(--text-muted);font-family:var(--font-mono);letter-spacing:0.08em;font-size:0.68rem;border-bottom:1px solid rgba(151,163,182,0.22)}
th:hover{color:var(--sky-blue)}
td{border-bottom:1px solid rgba(151,163,182,0.07)}
tr:hover td{background:rgba(151,163,182,0.03)}
.ticker-link{font-family:var(--font-mono);font-weight:600}
.ratio-val,.mono,.num{font-family:var(--font-mono);font-weight:600}

/* badges: pills → rectangular small-caps tags */
.risk-badge{border-radius:4px;font-family:var(--font-mono);font-weight:600;font-size:0.66rem;letter-spacing:0.08em;padding:3px 8px}
.risk-badge.CRITICAL{background:rgba(226,96,108,0.1);color:var(--critical);border:1px solid rgba(226,96,108,0.35)}
.risk-badge.HIGH{background:rgba(217,160,63,0.1);color:var(--high);border:1px solid rgba(217,160,63,0.35)}
.risk-badge.MEDIUM{background:rgba(91,147,232,0.1);color:var(--medium);border:1px solid rgba(91,147,232,0.35)}
.risk-badge.LOW{background:rgba(52,185,138,0.1);color:var(--low);border:1px solid rgba(52,185,138,0.35)}
.risk-badge.MINIMAL{background:rgba(151,163,182,0.08);color:var(--text-secondary);border:1px solid rgba(151,163,182,0.25)}

/* education cards: hide emoji icons, hairline card */
.edu-icon{display:none}
.edu-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px}
.edu-card h3{letter-spacing:-0.01em}

/* CTA */
.cta-box{background:var(--bg-card);border:1px solid var(--border);border-radius:12px}
.cta-btn{background:var(--primary);color:#fff;border-radius:8px;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,0.3)}
.cta-btn:hover{background:#2f6fe0;box-shadow:0 4px 14px rgba(28,63,124,0.5);transform:translateY(-1px)}

/* footer */
.footer{border-top:1px solid var(--border)}
.footer-col h4{font-family:var(--font-mono);letter-spacing:0.12em;font-size:0.68rem}
.footer-col a:hover{color:var(--text-secondary)}
.footer-bottom{color:var(--text-muted)}

/* loading */
.loading-spinner{border-color:var(--border);border-top-color:var(--sky-blue)}

/* ── styles.css page family (about/legal/screener/reset) overrides ──
   NOTE: no generic `section` rule here — tracker pages have unboxed
   sections (.hero/.education) that must stay unboxed; the legal/about
   boxed sections re-skin themselves through the var redefinitions. */
header{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:none}
header::before,header::after{content:none}
header h1{text-shadow:none;font-weight:700;letter-spacing:-0.025em}
header .site-logo{width:min(380px,85%)}
section:not([class]){background:var(--bg-card);border:1px solid var(--border);border-radius:12px;box-shadow:none}
h2{color:var(--text-primary);font-weight:700;letter-spacing:-0.02em}
label{color:var(--text-secondary)}
.form-group label{color:var(--text-secondary)}
input[type="email"],input[type="text"],input[type="time"]{border:1px solid rgba(151,163,182,0.22);border-radius:8px;background:var(--bg-primary);font-family:var(--font-ui)}
input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(59,130,246,0.12)}
.btn-secondary{text-transform:none;letter-spacing:0;border:1px solid rgba(151,163,182,0.22);color:var(--text-secondary);border-radius:8px;background:transparent}
.btn-secondary:hover{color:var(--text-primary);border-color:var(--text-muted);background:rgba(151,163,182,0.05);transform:none;box-shadow:none}
footer a{color:var(--sky-blue);font-weight:500}