/* ============================================================
   STLCA · Seattle Tenant Landlord Compliance Authority
   Design: left sidebar · deep navy · STLCA blue · Inter
   ============================================================ */

:root {
  --bg:        #070b12;
  --bg2:       #0b1220;
  --panel:     #0f1928;
  --panel-h:   #131f30;
  --border:    rgba(255,255,255,.07);
  --border-b:  rgba(45,127,249,.28);
  --text:      #e9eef7;
  --muted:     rgba(233,238,247,.58);
  --dim:       rgba(233,238,247,.34);
  --blue:      #2d7ff9;
  --blue-l:    #5b9bff;
  --blue-dim:  rgba(45,127,249,.12);
  --teal:      #0ea5e9;
  --green:     #10b981;
  /* Severity - data numbers only */
  --s-ok:      #10b981;
  --s-mid:     #f59e0b;
  --s-high:    #f97316;
  --s-crit:    #ef4444;
  /* Brand gold - decorative only, never on data */
  --gold:      #c9a24a;
  --gold-dim:  rgba(201,162,74,.1);
  --gold-b:    rgba(201,162,74,.28);
  /* Layout */
  --sidebar-w: 220px;
  --r:         10px;
  --r-sm:      6px;
  --shadow:    0 8px 32px rgba(0,0,0,.5);
  --font:      'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono:      'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
  --t:         .18s ease;
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:15px; scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--text);
  font-family:var(--font); line-height:1.6;
  display:flex; min-height:100vh; overflow-x:hidden;
}
a { color:var(--blue); text-decoration:none; transition:color var(--t); }
a:hover { color:var(--blue-l); }
img { max-width:100%; display:block; }
ul,ol { list-style:none; }

/* ── Typography ── */
h1 { font-size:clamp(1.7rem,3vw,2.4rem); font-weight:700; line-height:1.2; letter-spacing:-.3px; }
h2 { font-size:clamp(1.2rem,2.2vw,1.65rem); font-weight:700; line-height:1.25; letter-spacing:-.2px; }
h3 { font-size:clamp(.95rem,1.5vw,1.1rem); font-weight:600; line-height:1.3; }
h4 { font-size:.88rem; font-weight:700; }
p  { color:var(--muted); line-height:1.75; font-size:.92rem; }
.kicker {
  display:block; font-size:.68rem; font-weight:700;
  text-transform:uppercase; letter-spacing:1.4px;
  color:var(--blue); margin-bottom:.45rem;
}

/* ── Sidebar ── */
.sidebar {
  width:var(--sidebar-w); flex-shrink:0;
  background:var(--bg2); border-right:1px solid var(--border);
  display:flex; flex-direction:column;
  position:fixed; top:0; left:0; bottom:0; z-index:100;
  overflow-y:auto;
}
.sidebar-brand {
  padding:20px 18px 16px;
  border-bottom:1px solid var(--border);
  display:flex; flex-direction:column; gap:10px;
}
.sidebar-logo { height:36px; width:auto; object-fit:contain; }
.sidebar-name { font-size:.72rem; font-weight:700; color:var(--blue); letter-spacing:.4px; line-height:1.3; }
.sidebar-sub  { font-size:.6rem; color:var(--dim); line-height:1.4; }
.sidebar-nav  { flex:1; padding:12px 0; }
.sidebar-section-label {
  font-size:.6rem; font-weight:700; text-transform:uppercase;
  letter-spacing:1.2px; color:var(--dim);
  padding:12px 18px 4px; display:block;
}
.sidebar-nav a {
  display:flex; align-items:center; gap:9px;
  padding:8px 18px; font-size:.82rem; font-weight:500;
  color:var(--muted); text-decoration:none;
  transition:all var(--t); border-left:2px solid transparent;
}
.sidebar-nav a:hover { color:var(--text); background:rgba(45,127,249,.06); border-left-color:var(--border-b); }
.sidebar-nav a.active { color:var(--blue-l); background:var(--blue-dim); border-left-color:var(--blue); font-weight:600; }
.sidebar-nav a .nav-icon { width:15px; height:15px; opacity:.55; flex-shrink:0; }
.sidebar-nav a:hover .nav-icon, .sidebar-nav a.active .nav-icon { opacity:1; }
.sidebar-divider { height:1px; background:var(--border); margin:8px 18px; }
.sidebar-footer {
  padding:14px 18px; border-top:1px solid var(--border);
  font-size:.62rem; color:var(--dim); line-height:1.6;
}
.sidebar-footer .flag { color:var(--blue); font-family:var(--mono); font-size:.6rem; }

/* Mobile sidebar toggle */
.sidebar-toggle {
  display:none; position:fixed; top:12px; left:12px; z-index:200;
  width:38px; height:38px; border-radius:8px;
  background:var(--bg2); border:1px solid var(--border);
  align-items:center; justify-content:center;
  cursor:pointer; flex-direction:column; gap:4px;
}
.sidebar-toggle span { display:block; width:18px; height:1.5px; background:var(--text); border-radius:2px; transition:all var(--t); }
.sidebar-toggle.open span:nth-child(1) { transform:translateY(5.5px) rotate(45deg); }
.sidebar-toggle.open span:nth-child(2) { opacity:0; }
.sidebar-toggle.open span:nth-child(3) { transform:translateY(-5.5px) rotate(-45deg); }
.sidebar-overlay {
  display:none; position:fixed; inset:0; z-index:99;
  background:rgba(7,11,18,.7); backdrop-filter:blur(4px);
}
.sidebar-overlay.open { display:block; }

/* ── Main content ── */
.main {
  margin-left:var(--sidebar-w); flex:1;
  display:flex; flex-direction:column; min-height:100vh;
}
.page { flex:1; padding:48px 52px; max-width:1060px; }
.page-sm { padding:40px 52px; }

/* ── Page header ── */
.page-header { margin-bottom:40px; padding-bottom:28px; border-bottom:1px solid var(--border); }
.page-header h1 { margin-bottom:10px; }
.page-header p  { max-width:640px; }
.page-header .source-note { font-size:.65rem; color:var(--dim); margin-top:8px; font-family:var(--mono); }

/* ── Hero ── */
.hero {
  padding:56px 0 48px; position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(800px 500px at 60% -10%, rgba(45,127,249,.14), transparent 60%);
}
.hero-content { position:relative; z-index:1; max-width:720px; }
.hero h1 { font-size:clamp(1.8rem,3.5vw,2.8rem); margin-bottom:16px; }
.hero h1 em { font-style:normal; color:var(--blue); }
.hero-sub { font-size:1rem; color:var(--muted); max-width:580px; line-height:1.75; margin-bottom:28px; }
.hero-btns { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:44px; }

/* ── Accountability path ── */
.acc-path {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:0; margin-top:8px;
}
.acc-node {
  background:var(--panel); border:1px solid var(--border-b);
  border-radius:4px; padding:7px 14px;
  font-size:.72rem; font-weight:600; color:var(--blue-l);
  white-space:nowrap; transition:all var(--t);
}
.acc-node:hover { background:var(--blue-dim); }
.acc-arrow { color:var(--dim); font-size:.8rem; padding:0 6px; flex-shrink:0; }

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; gap:7px;
  font-size:.8rem; font-weight:600; padding:10px 22px;
  border-radius:6px; cursor:pointer; border:none;
  text-decoration:none; transition:all var(--t); letter-spacing:.1px;
}
.btn-primary { background:var(--blue); color:#fff; }
.btn-primary:hover { background:var(--blue-l); color:#fff; transform:translateY(-1px); box-shadow:0 4px 16px rgba(45,127,249,.35); }
.btn-outline { background:transparent; color:var(--text); border:1px solid var(--border); }
.btn-outline:hover { background:var(--blue-dim); border-color:var(--border-b); color:var(--blue-l); }
.btn-ghost  { background:transparent; color:var(--blue); padding:8px 0; font-size:.8rem; }
.btn-ghost:hover { color:var(--blue-l); }
.btn-sm { padding:7px 16px; font-size:.75rem; }

/* ── Cards ── */
.card {
  background:var(--panel); border:1px solid var(--border);
  border-radius:var(--r); padding:22px;
  transition:border-color var(--t), background var(--t);
}
.card:hover { border-color:var(--border-b); background:var(--panel-h); }
.card-icon { width:36px; height:36px; border-radius:8px; background:var(--blue-dim); display:flex; align-items:center; justify-content:center; margin-bottom:12px; font-size:1.1rem; }

/* ── Metric cards ── */
.metric-card { background:var(--panel); border:1px solid var(--border); border-radius:var(--r); padding:18px 20px; transition:border-color var(--t); }
.metric-card:hover { border-color:var(--border-b); }
.metric-label { font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--dim); margin-bottom:6px; }
.metric-value { font-size:1.9rem; font-weight:800; line-height:1; margin-bottom:5px; color:var(--text); }
.metric-note  { font-size:.7rem; color:var(--dim); line-height:1.4; }
/* Severity */
.metric-blue  .metric-value { color:var(--blue); }
.metric-teal  .metric-value { color:var(--teal); }
.metric-ok    .metric-value { color:var(--s-ok); }
.metric-mid   .metric-value { color:var(--s-mid); }
.metric-high  .metric-value { color:var(--s-high); }
.metric-crit  .metric-value { color:var(--s-crit); }

/* ── Finding stat ── */
.finding-stat { font-size:2.6rem; font-weight:800; line-height:1; margin-bottom:5px; }
.finding-stat.blue  { color:var(--blue); }
.finding-stat.teal  { color:var(--teal); }
.finding-stat.crit  { color:var(--s-crit); }
.finding-stat.high  { color:var(--s-high); }
.finding-stat.mid   { color:var(--s-mid); }
.finding-stat.ok    { color:var(--s-ok); }

/* ── Grids ── */
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.grid-7 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }

/* ── Section ── */
.section    { margin-bottom:56px; }
.section-sm { margin-bottom:36px; }
.section-header { margin-bottom:28px; }
.section-header h2 { margin-bottom:8px; }
.section-header p  { max-width:580px; }
.section-header.centered { text-align:center; }
.section-header.centered p { margin:0 auto; }

/* ── Divider ── */
.divider { height:1px; background:var(--border); margin:40px 0; }

/* ── Callout ── */
.callout {
  background:var(--blue-dim); border:1px solid var(--border-b);
  border-left:3px solid var(--blue); border-radius:var(--r);
  padding:16px 20px;
}
.callout p { font-size:.85rem; color:var(--muted); line-height:1.7; }
.callout strong { color:var(--text); }
.callout-gold {
  background:var(--gold-dim); border:1px solid var(--gold-b);
  border-left:3px solid var(--gold); border-radius:var(--r);
  padding:16px 20px;
}
.callout-gold p { font-size:.85rem; color:var(--muted); line-height:1.7; }

/* ── Layer cards (six layers) ── */
.layer-card {
  background:var(--panel); border:1px solid var(--border);
  border-radius:var(--r); padding:20px;
  display:flex; flex-direction:column; gap:8px;
  transition:border-color var(--t), background var(--t);
}
.layer-card:hover { border-color:var(--border-b); background:var(--panel-h); }
.layer-num {
  width:28px; height:28px; border-radius:6px;
  background:var(--blue-dim); border:1px solid var(--border-b);
  display:flex; align-items:center; justify-content:center;
  font-size:.72rem; font-weight:800; color:var(--blue);
}
.layer-title { font-size:.95rem; font-weight:700; color:var(--text); }
.layer-desc  { font-size:.82rem; color:var(--muted); line-height:1.6; }

/* ── District cards ── */
.district-card {
  background:var(--panel); border:1px solid var(--border);
  border-radius:var(--r); padding:18px;
  transition:all var(--t); cursor:pointer; text-decoration:none; display:block;
}
.district-card:hover { border-color:var(--border-b); background:var(--panel-h); transform:translateY(-1px); }
.district-badge {
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:6px;
  background:var(--blue-dim); border:1px solid var(--border-b);
  font-size:.78rem; font-weight:800; color:var(--blue); margin-bottom:10px;
}
.district-name { font-size:.9rem; font-weight:700; color:var(--text); margin-bottom:3px; }
.district-link { font-size:.72rem; font-weight:600; color:var(--blue); margin-top:10px; display:block; transition:color var(--t); }
.district-link:hover { color:var(--blue-l); }

/* ── Interactive map ── */
.map-wrap { display:grid; grid-template-columns:1fr 300px; gap:24px; align-items:start; }
.map-svg  { width:100%; height:auto; display:block; }
.map-panel { position:sticky; top:20px; }
.map-readout { background:var(--panel); border:1px solid var(--border); border-radius:var(--r); padding:18px; min-height:180px; }
.map-metric-toggle { display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.map-metric-btn {
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm);
  padding:8px 12px; font-size:.76rem; font-weight:600; color:var(--muted);
  cursor:pointer; text-align:left; transition:all var(--t);
}
.map-metric-btn:hover { border-color:var(--border-b); color:var(--text); }
.map-metric-btn.active { border-color:var(--blue); color:var(--blue-l); background:var(--blue-dim); }
.map-legend { display:flex; align-items:center; gap:8px; margin-top:10px; }
.map-legend-bar { flex:1; height:6px; border-radius:3px; }
.map-legend-label { font-size:.65rem; color:var(--dim); font-family:var(--mono); }

/* ── Data table ── */
.data-table { width:100%; border-collapse:collapse; font-size:.8rem; }
.data-table th { padding:9px 12px; text-align:left; font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--blue); border-bottom:2px solid var(--border-b); }
.data-table td { padding:8px 12px; border-bottom:1px solid var(--border); vertical-align:top; color:var(--muted); }
.data-table tr:hover td { background:rgba(45,127,249,.03); }
.data-table td:first-child { color:var(--text); font-weight:600; }
.data-table code { font-family:var(--mono); font-size:.72rem; color:var(--blue-l); background:rgba(45,127,249,.08); padding:1px 5px; border-radius:3px; }

/* ── Module grid (RARE) ── */
.module-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.module-node {
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r);
  padding:18px; cursor:pointer; transition:all var(--t);
  display:flex; flex-direction:column; gap:8px;
}
.module-node:hover, .module-node.active { border-color:var(--blue); background:var(--panel-h); }
.module-num   { font-size:.62rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--blue); }
.module-icon  { width:32px; height:32px; color:var(--blue-l); }
.module-icon svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.module-title { font-size:.92rem; font-weight:700; color:var(--text); }
.module-desc  { font-size:.76rem; color:var(--muted); line-height:1.55; }
.module-tag   { font-size:.62rem; font-weight:600; text-transform:uppercase; letter-spacing:.5px; color:var(--dim); margin-top:auto; padding-top:6px; }

/* Module modal */
.module-modal-backdrop {
  display:none; position:fixed; inset:0; z-index:2000;
  background:rgba(7,11,18,.88); backdrop-filter:blur(8px);
  align-items:center; justify-content:center; padding:20px;
}
.module-modal-backdrop.open { display:flex; }
.module-modal {
  background:var(--bg2); border:1px solid var(--border-b);
  border-radius:var(--r); padding:28px; max-width:560px; width:100%;
  max-height:88vh; overflow-y:auto; position:relative;
}
.module-modal-close {
  position:absolute; top:14px; right:14px;
  background:var(--panel); border:1px solid var(--border); border-radius:50%;
  width:28px; height:28px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:.9rem; color:var(--muted); transition:all var(--t);
}
.module-modal-close:hover { color:var(--text); border-color:var(--border-b); }
.module-outputs { display:flex; flex-direction:column; gap:6px; margin:10px 0; }
.module-outputs li {
  display:flex; align-items:center; gap:8px;
  font-size:.82rem; color:var(--text); padding:7px 10px;
  background:rgba(255,255,255,.03); border:1px solid var(--border); border-radius:var(--r-sm);
}
.module-outputs li::before { content:'›'; color:var(--blue); font-weight:700; flex-shrink:0; }
.module-guardrail {
  background:var(--blue-dim); border:1px solid var(--border-b);
  border-radius:var(--r-sm); padding:12px 14px;
  font-size:.78rem; color:var(--muted); line-height:1.65; margin-top:12px; font-style:italic;
}

/* ── Question grid ── */
.question-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.question-item {
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r);
  padding:14px 16px; display:flex; align-items:flex-start; gap:10px;
  transition:border-color var(--t);
}
.question-item:hover { border-color:var(--border-b); }
.question-mark {
  width:24px; height:24px; border-radius:50%;
  background:var(--blue-dim); border:1px solid var(--border-b);
  display:flex; align-items:center; justify-content:center;
  font-size:.72rem; font-weight:800; color:var(--blue); flex-shrink:0;
}
.question-text { font-size:.84rem; color:var(--text); font-weight:500; line-height:1.45; }

/* ── Template list ── */
.template-list { display:flex; flex-direction:column; gap:6px; }
.template-item {
  display:flex; align-items:center; gap:10px; padding:9px 12px;
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm);
  transition:border-color var(--t);
}
.template-item:hover { border-color:var(--border-b); }
.template-num {
  width:22px; height:22px; border-radius:50%; background:var(--blue-dim);
  border:1px solid var(--border-b); display:flex; align-items:center; justify-content:center;
  font-size:.68rem; font-weight:800; color:var(--blue); flex-shrink:0;
}
.template-text { font-size:.82rem; color:var(--text); font-weight:500; }

/* ── Priority card ── */
.priority-card {
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r);
  padding:18px 20px; display:flex; align-items:flex-start; gap:12px;
  transition:border-color var(--t);
}
.priority-card:hover { border-color:var(--border-b); }
.priority-num {
  width:28px; height:28px; border-radius:6px; background:var(--blue-dim);
  border:1px solid var(--border-b); display:flex; align-items:center; justify-content:center;
  font-size:.76rem; font-weight:800; color:var(--blue); flex-shrink:0;
}

/* ── CTA ── */
.cta-block {
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r);
  padding:36px 40px; text-align:center;
  background:radial-gradient(600px 300px at 50% 50%, rgba(45,127,249,.08), transparent 70%);
}
.cta-block h2 { margin-bottom:10px; }
.cta-block p  { max-width:480px; margin:0 auto 24px; }
.cta-btns { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* ── Footer ── */
.footer {
  background:var(--bg2); border-top:1px solid var(--border);
  padding:36px 52px 24px; margin-left:0;
}
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:36px; margin-bottom:28px; }
.footer-brand-name { font-size:.88rem; font-weight:800; color:var(--blue); margin-bottom:2px; }
.footer-brand-full { font-size:.6rem; color:var(--dim); margin-bottom:10px; }
.footer-tagline    { font-size:.78rem; color:var(--muted); line-height:1.65; max-width:260px; }
.footer-col h4 { font-size:.62rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--dim); margin-bottom:12px; }
.footer-col ul { display:flex; flex-direction:column; gap:8px; }
.footer-col ul li a { font-size:.78rem; color:var(--muted); text-decoration:none; transition:color var(--t); }
.footer-col ul li a:hover { color:var(--text); }
.footer-bottom { border-top:1px solid var(--border); padding-top:18px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.footer-bottom p { font-size:.7rem; color:var(--dim); }
.footer-flag { font-family:var(--mono); font-size:.62rem; color:var(--blue); }

/* ── Reveal animation ── */
[data-reveal] { opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease; }
[data-reveal].revealed { opacity:1; transform:translateY(0); }

/* ── Utilities ── */
.text-blue  { color:var(--blue); }
.text-teal  { color:var(--teal); }
.text-muted { color:var(--muted); }
.text-dim   { color:var(--dim); }
.text-crit  { color:var(--s-crit); }
.text-high  { color:var(--s-high); }
.text-mid   { color:var(--s-mid); }
.text-ok    { color:var(--s-ok); }
.text-center { text-align:center; }
.mono { font-family:var(--mono); }
.mt-8  { margin-top:8px; }  .mt-12 { margin-top:12px; } .mt-16 { margin-top:16px; }
.mt-24 { margin-top:24px; } .mt-32 { margin-top:32px; } .mt-40 { margin-top:40px; }
.mb-8  { margin-bottom:8px; } .mb-16 { margin-bottom:16px; } .mb-24 { margin-bottom:24px; }

/* ── Responsive ── */
@media (max-width:1100px) {
  .grid-4 { grid-template-columns:repeat(2,1fr); }
  .grid-7 { grid-template-columns:repeat(3,1fr); }
  .module-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:24px; }
  .map-wrap { grid-template-columns:1fr; }
  .map-panel { position:static; }
}
@media (max-width:820px) {
  :root { --sidebar-w:0px; }
  .sidebar { transform:translateX(-220px); width:220px; transition:transform var(--t); }
  .sidebar.open { transform:translateX(0); }
  .sidebar-toggle { display:flex; }
  .main { margin-left:0; }
  .page, .page-sm { padding:56px 24px 36px; }
  .footer { padding:28px 24px 20px; }
  .grid-2 { grid-template-columns:1fr; }
  .grid-3 { grid-template-columns:1fr; }
  .grid-4 { grid-template-columns:1fr; }
  .grid-7 { grid-template-columns:repeat(2,1fr); }
  .module-grid { grid-template-columns:1fr; }
  .hero-btns { flex-direction:column; align-items:flex-start; }
  .acc-path { gap:6px; }
  .acc-arrow { display:none; }
  .footer-grid { grid-template-columns:1fr; gap:20px; }
  .footer-bottom { flex-direction:column; }
}
@media (max-width:480px) {
  .grid-7 { grid-template-columns:1fr; }
  .page, .page-sm { padding:52px 16px 28px; }
}

/* ── Print ── */
@media print {
  :root { --bg:#fff; --bg2:#f8f8f8; --panel:#f4f4f4; --text:#111; --muted:#444; --dim:#666; --blue:#1a56cc; --border:#ccc; --border-b:#93c5fd; --blue-dim:#eff6ff; }
  @page { margin:16mm; size:letter; }
  .sidebar, .sidebar-toggle, .sidebar-overlay, .hero-btns .btn-outline, .cta-block .btn { display:none !important; }
  .main { margin-left:0 !important; }
  .page, .page-sm { padding:0 !important; }
  [data-reveal] { opacity:1 !important; transform:none !important; }
  a[href^="http"]::after { content:" ("attr(href)")"; font-size:7pt; color:#666; }
  a.btn::after, .sidebar-nav a::after, .footer-col a::after { content:"" !important; }
  h1,h2,h3 { page-break-after:avoid; }
  .card,.metric-card,.district-card,.priority-card { page-break-inside:avoid; }
  .module-modal-backdrop { display:none !important; }
}


/* ============================================================
   READABILITY + HOSTINGER DEPLOYMENT PATCH - 2026-06-28
   Replaces the cramped fixed left rail with a readable top nav,
   centers page content, and keeps content visible even if JS delays.
   ============================================================ */
html { background: var(--bg); }
body {
  display: block !important;
  min-height: 100vh;
  overflow-x: hidden;
  background: linear-gradient(180deg, #070b12 0%, #08111f 46%, #070b12 100%);
}

/* Top navigation */
.sidebar {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  bottom: auto !important;
  width: 100% !important;
  min-height: 68px;
  height: auto !important;
  z-index: 1000;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 18px;
  padding: 10px clamp(18px, 4vw, 48px);
  background: rgba(7, 11, 18, .96);
  border-right: 0 !important;
  border-bottom: 1px solid var(--border-b);
  box-shadow: 0 14px 36px rgba(0,0,0,.28);
  backdrop-filter: blur(14px);
  overflow: visible !important;
}
.sidebar-brand {
  padding: 0 !important;
  border: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 12px;
  min-width: 245px;
  color: var(--text);
  text-decoration: none;
}
.sidebar-logo { height: 34px; width: auto; flex-shrink: 0; }
.sidebar-name { font-size: .92rem !important; font-weight: 800; letter-spacing: .5px; color: #75aaff; }
.sidebar-sub { font-size: .62rem !important; max-width: 235px; color: rgba(233,238,247,.62); line-height: 1.3; }
.sidebar-section-label, .sidebar-divider, .sidebar-footer, .nav-icon { display: none !important; }
.sidebar-nav {
  flex: 1;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 0 !important;
  overflow-x: auto;
  scrollbar-width: none;
}
.sidebar-nav::-webkit-scrollbar { display:none; }
.sidebar-nav a {
  display: inline-flex !important;
  align-items: center;
  min-height: 40px;
  padding: 9px 12px !important;
  border-left: 0 !important;
  border-bottom: 2px solid transparent;
  border-radius: 10px;
  white-space: nowrap;
  color: rgba(233,238,247,.72) !important;
  font-size: .82rem !important;
  font-weight: 650;
  text-decoration: none;
}
.sidebar-nav a:hover { background: rgba(45,127,249,.09); color: #fff !important; border-bottom-color: rgba(45,127,249,.35); }
.sidebar-nav a.active { background: rgba(45,127,249,.14) !important; color: #8dbbff !important; border-bottom-color: var(--blue); }

/* Page layout */
.main { margin-left: 0 !important; width: 100%; min-height: calc(100vh - 68px); display: flex; flex-direction: column; }
main { width: 100%; }
.container, .page, .page-sm {
  width: 100%;
  max-width: 1120px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.container { padding-left: clamp(18px, 4vw, 44px); padding-right: clamp(18px, 4vw, 44px); }
.page, .page-sm { padding: clamp(34px, 5vw, 58px) clamp(18px, 4vw, 44px) 56px !important; }
.page-header { padding: 44px 0 30px !important; }
.page-header .container { max-width: 1120px; }
.section { margin-bottom: 48px; }
.divider { margin: 32px auto; max-width: 1120px; }

/* Readability */
p, li { font-size: .98rem; line-height: 1.78; }
h1 { font-size: clamp(2rem, 5vw, 3.55rem); letter-spacing: -.04em; }
h2 { font-size: clamp(1.38rem, 3vw, 2rem); }
h3 { font-size: clamp(1rem, 2vw, 1.24rem); }
.hero { padding: clamp(44px, 8vw, 86px) 0 56px !important; }
.hero-content { max-width: 860px; }
.hero-sub { max-width: 760px; font-size: 1.05rem; color: rgba(233,238,247,.78); }
.card, .metric-card, .layer-card, .district-card, .priority-card, .question-item, .callout {
  box-shadow: 0 12px 34px rgba(0,0,0,.18);
}
.card p, .metric-note, .layer-desc { color: rgba(233,238,247,.72); }
.metric-value, .finding-stat { overflow-wrap:anywhere; }

/* Do not hide content if JS is late or blocked. */
[data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }

/* Tables and wide legacy widgets should scroll instead of blowing out the page. */
table { max-width: 100%; }
.data-table, table { display: table; }
main, section, .card, .callout { min-width: 0; }

/* Mobile */
@media (max-width: 920px) {
  .sidebar {
    min-height: 62px;
    padding: 10px 68px 10px 16px;
    flex-wrap: wrap;
    gap: 8px;
  }
  .sidebar-brand { min-width: 0; max-width: calc(100vw - 96px); }
  .sidebar-logo { height: 30px; }
  .sidebar-sub { display: none; }
  .sidebar-nav {
    display: none !important;
    flex: 0 0 100%;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
    gap: 4px;
    padding: 8px 0 4px !important;
    overflow: visible;
  }
  .sidebar.open .sidebar-nav { display: flex !important; }
  .sidebar-nav a { width: 100%; justify-content: flex-start; padding: 12px 14px !important; }
  .sidebar-toggle {
    display:flex !important;
    left: auto !important;
    right: 16px !important;
    top: 12px !important;
    background: rgba(15,25,40,.96) !important;
    border-color: rgba(45,127,249,.35) !important;
    z-index: 1100;
  }
  .sidebar-overlay { z-index: 900; background: rgba(7,11,18,.65); }
  .grid-2, .grid-3, .grid-4, .grid-7, .module-grid { grid-template-columns: 1fr !important; }
  .hero-btns { flex-direction: row !important; align-items: stretch !important; }
  .hero-btns .btn { flex: 1 1 180px; justify-content:center; }
}

@media (max-width: 520px) {
  html { font-size: 14px; }
  .sidebar { padding-left: 14px; }
  .sidebar-name { font-size: .82rem !important; }
  .container, .page, .page-sm { padding-left: 16px !important; padding-right: 16px !important; }
  .hero-btns { flex-direction: column !important; }
  .acc-path { gap: 7px; }
  .acc-node { white-space: normal; width: 100%; text-align: center; }
  .acc-arrow { display:none; }
}

/* Footer readability */
.footer { margin-left: 0 !important; padding-left: clamp(18px,4vw,48px) !important; padding-right: clamp(18px,4vw,48px) !important; }
.footer-grid { max-width: 1120px; margin-left:auto; margin-right:auto; }
.footer-bottom { max-width: 1120px; margin-left:auto; margin-right:auto; }


/* ============================================================
   FINAL VISUAL QA PATCH - buckets, readability, mobile, Hostinger
   ============================================================ */
:root{
  --bg:#050811;
  --bg2:#07101d;
  --panel:#0d1828;
  --panel-h:#111f33;
  --border:rgba(174,197,232,.18);
  --border-b:rgba(65,145,255,.38);
  --text:#f5f8ff;
  --muted:#d7e1ef;
  --dim:#aebbd0;
  --blue:#2d7ff9;
  --blue-l:#8dbbff;
  --blue-dim:rgba(45,127,249,.16);
  --gold:#d7b66a;
  --shadow:0 18px 60px rgba(0,0,0,.38);
}
html{font-size:17px;background:var(--bg);}
body{display:block!important;background:radial-gradient(circle at 12% 0%,rgba(45,127,249,.16),transparent 34%),linear-gradient(180deg,#050811 0%,#08101d 44%,#050811 100%)!important;color:var(--text)!important;min-height:100vh;overflow-x:hidden;}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 72%);z-index:-1;}
a{color:#9fc5ff;} a:hover{color:#fff;}
p,li{font-size:1.05rem!important;line-height:1.78!important;color:var(--muted)!important;}
small,.metric-note,.source-note{color:var(--dim)!important;line-height:1.55!important;}
h1{font-size:clamp(2.55rem,6vw,4.8rem)!important;line-height:1.02!important;letter-spacing:-.055em!important;color:var(--text)!important;}
h2{font-size:clamp(1.65rem,3.3vw,2.55rem)!important;line-height:1.12!important;color:var(--text)!important;}
h3{font-size:clamp(1.12rem,2vw,1.42rem)!important;color:var(--text)!important;}
.kicker{font-size:.77rem!important;color:#8dbbff!important;letter-spacing:1.7px!important;}
.main{margin-left:0!important;width:100%!important;display:block!important;}
.container,.page,.page-sm{max-width:1180px!important;margin-left:auto!important;margin-right:auto!important;padding-left:clamp(18px,5vw,54px)!important;padding-right:clamp(18px,5vw,54px)!important;}
.page,.page-sm{padding-top:88px!important;padding-bottom:70px!important;}
.page-header{padding-top:100px!important;padding-bottom:42px!important;}
.section{margin-bottom:62px!important;}
.divider{max-width:1180px!important;border-color:rgba(141,187,255,.18)!important;margin:42px auto!important;}
/* Hide old sidebar/top nav classes if any old CSS survives */
.sidebar,.sidebar-toggle,.sidebar-overlay{display:none!important;}
/* Brand + bucket navigation */
.brand-mark{position:fixed;left:22px;top:18px;z-index:1400;display:flex;align-items:center;gap:10px;min-width:0;padding:9px 12px;border:1px solid rgba(141,187,255,.26);border-radius:999px;background:rgba(7,16,29,.82);backdrop-filter:blur(14px);box-shadow:0 14px 38px rgba(0,0,0,.34);text-decoration:none;color:var(--text)!important;}
.brand-mark img{width:34px;height:34px;object-fit:cover;border-radius:50%;background:#fff;}
.brand-mark b{display:block;font-size:.86rem;letter-spacing:.08em;color:#fff;line-height:1;}
.brand-mark small{display:block;font-size:.61rem;color:var(--dim)!important;line-height:1.2;margin-top:3px;}
.bucket-toggle{position:fixed;left:22px;bottom:22px;z-index:1400;display:flex;align-items:center;gap:12px;min-height:52px;padding:0 18px;border-radius:999px;border:1px solid rgba(141,187,255,.34);background:linear-gradient(135deg,#123765,#0a1b32);color:#fff;font:800 .86rem/1 var(--font);letter-spacing:.08em;text-transform:uppercase;box-shadow:0 20px 60px rgba(0,0,0,.42);cursor:pointer;}
.bucket-toggle-bars{display:grid;gap:5px}.bucket-toggle-bars i{display:block;width:20px;height:2px;background:#fff;border-radius:2px;}
.bucket-drawer{position:fixed;inset:0;z-index:1500;pointer-events:none;}
.bucket-drawer.open{pointer-events:auto;}
.bucket-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58);opacity:0;transition:.22s ease;}
.bucket-drawer.open .bucket-backdrop{opacity:1;}
.bucket-panel{position:absolute;left:18px;right:18px;bottom:18px;max-height:min(82vh,760px);max-width:1180px;margin:0 auto;overflow:auto;border:1px solid rgba(141,187,255,.28);border-radius:28px;background:linear-gradient(180deg,rgba(12,24,40,.98),rgba(5,11,20,.98));box-shadow:0 32px 100px rgba(0,0,0,.62);padding:28px;transform:translateY(36px);opacity:0;transition:.24s ease;}
.bucket-drawer.open .bucket-panel{transform:translateY(0);opacity:1;}
.bucket-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid rgba(141,187,255,.18);}
.bucket-head h1{font-size:clamp(2rem,4vw,3.4rem)!important;margin:0 0 8px!important;}
.bucket-head p{max-width:680px;margin:0!important;}
.bucket-kicker,.bucket-eyebrow{font-size:.72rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:#8dbbff;margin-bottom:8px;}
.bucket-close{width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;font-size:28px;line-height:1;cursor:pointer;}
.bucket-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.bucket-card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid rgba(141,187,255,.18);border-radius:20px;padding:22px;min-height:280px;}
.bucket-card h2{font-size:1.35rem!important;margin:0 0 10px!important;letter-spacing:-.03em!important;}
.bucket-card p{font-size:.96rem!important;color:#d7e1ef!important;margin-bottom:18px!important;}
.bucket-links{display:grid;gap:8px;margin-top:auto;}.bucket-links a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 12px;border-radius:12px;background:rgba(45,127,249,.10);border:1px solid rgba(45,127,249,.18);color:#f5f8ff!important;font-size:.95rem;font-weight:800;text-decoration:none;}
.bucket-links a:hover{background:rgba(45,127,249,.20);}
html.bucket-open{overflow:hidden;}
/* Hero + Seattle visual */
.hero{padding-top:82px!important;padding-bottom:32px!important;}
.hero-content{max-width:980px!important;}
.hero h1 em{color:#8dbbff;font-style:normal;text-shadow:0 0 42px rgba(45,127,249,.24);}
.hero-sub{max-width:880px!important;font-size:1.18rem!important;color:#e3ebf7!important;}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0!important;}
.btn{font-size:.96rem!important;min-height:46px!important;padding:12px 18px!important;border-radius:999px!important;font-weight:850!important;letter-spacing:.01em!important;}
.btn-primary{background:linear-gradient(135deg,#2d7ff9,#175ec0)!important;color:#fff!important;border:1px solid rgba(141,187,255,.55)!important;}
.btn-outline{background:rgba(255,255,255,.045)!important;color:#f6f9ff!important;border:1px solid rgba(141,187,255,.28)!important;}
.acc-path{background:rgba(255,255,255,.04)!important;border:1px solid rgba(141,187,255,.22)!important;border-radius:24px!important;padding:18px!important;gap:10px!important;}
.acc-node{font-size:.9rem!important;color:#fff!important;background:rgba(45,127,249,.14)!important;border-color:rgba(141,187,255,.25)!important;padding:10px 12px!important;border-radius:999px!important;}
.acc-arrow{color:#8dbbff!important;}
.seattle-photo-section{margin-top:-18px!important;margin-bottom:46px!important;}
.seattle-photo-card{border:1px solid rgba(141,187,255,.24);border-radius:28px;overflow:hidden;background:#07101d;box-shadow:var(--shadow);}
.seattle-photo-card img{width:100%;display:block;aspect-ratio:16/7;object-fit:cover;}
.seattle-photo-caption{font-size:.9rem;color:#d7e1ef;padding:16px 20px;border-top:1px solid rgba(141,187,255,.18);background:rgba(255,255,255,.035);}
/* Home buckets */
.home-buckets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.home-bucket{min-height:210px;display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));border:1px solid rgba(141,187,255,.20);text-decoration:none;color:#fff!important;box-shadow:0 18px 50px rgba(0,0,0,.25);}
.home-bucket span{font-size:.78rem;font-weight:900;letter-spacing:.16em;color:#8dbbff}.home-bucket b{font-size:1.28rem}.home-bucket small{font-size:.95rem!important;color:#d7e1ef!important;line-height:1.55!important;}
.home-bucket:hover{transform:translateY(-2px);border-color:rgba(141,187,255,.44);background:rgba(45,127,249,.10);}
/* Cards and metrics */
.card,.metric-card,.layer-card,.district-card,.priority-card,.question-item,.callout,.map-readout,.chart-section,.finding-card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;border:1px solid rgba(141,187,255,.18)!important;border-radius:20px!important;}
.card p,.layer-desc,.metric-note,.finding-body,.chart-sub{color:#d7e1ef!important;font-size:.98rem!important;}
.metric-label,.district-link,.layer-title{color:#f5f8ff!important;}
.metric-value,.finding-stat{font-size:clamp(2rem,4vw,3.25rem)!important;line-height:1!important;overflow-wrap:anywhere;}
.layer-num{color:#8dbbff!important;background:rgba(45,127,249,.16)!important;border-color:rgba(141,187,255,.22)!important;}
.question-item{min-height:96px!important;align-items:center!important;}.question-text{font-size:1rem!important;color:#fff!important;}
/* District map preservation */
#districtMapHost{display:block!important;min-height:520px;}
.map-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) 320px!important;gap:24px!important;align-items:start!important;}
.map-svg{width:100%!important;height:auto!important;min-height:420px;background:rgba(255,255,255,.035);border:1px solid rgba(141,187,255,.18);border-radius:24px;padding:12px;}
.map-metric-btn{font-size:.9rem!important;color:#f5f8ff!important;background:rgba(255,255,255,.045)!important;border-color:rgba(141,187,255,.22)!important;padding:12px!important;border-radius:12px!important;}
.map-legend-label{font-size:.78rem!important;color:#d7e1ef!important;}
/* Legacy tables */
table{width:100%;border-collapse:collapse;} th,td{font-size:.95rem!important;line-height:1.55!important;color:#f4f7ff!important;} th{color:#fff!important;} td{color:#dbe6f5!important;}
/* RRIO page duplicate inline nav suppression / readable tune */
body > div[style*="position:sticky"]{display:none!important;}
nav{display:none!important;}
.wrap{max-width:1060px!important;padding:132px 24px 80px!important;}
.hdr h1{font-size:clamp(2.4rem,5vw,4rem)!important;}.hdr .sub{font-size:1.08rem!important;color:#e3ebf7!important;}.stat .lbl{font-size:.82rem!important;color:#d7e1ef!important;}.finding-body{font-size:1rem!important;}
/* Mobile */
@media(max-width:980px){
  html{font-size:16px;}
  .brand-mark{left:14px;top:12px;right:14px;width:auto;max-width:calc(100vw - 28px);}.brand-mark small{display:none;}
  .bucket-toggle{left:14px;right:14px;bottom:14px;justify-content:center;border-radius:18px;min-height:56px;}
  .bucket-panel{left:10px;right:10px;bottom:10px;max-height:86vh;padding:20px;border-radius:22px;}
  .bucket-head{gap:12px}.bucket-grid{grid-template-columns:1fr;}.bucket-card{min-height:auto;}
  .page,.page-sm{padding-top:92px!important;padding-left:16px!important;padding-right:16px!important;}.page-header{padding-top:96px!important;}
  .home-buckets{grid-template-columns:1fr;}.home-bucket{min-height:auto;}
  .grid-2,.grid-3,.grid-4,.grid-7,.module-grid{grid-template-columns:1fr!important;}
  .hero{padding-top:76px!important;}.hero-btns{flex-direction:column!important;}.hero-btns .btn{width:100%;justify-content:center;}
  .acc-path{display:grid!important;grid-template-columns:1fr!important;}.acc-arrow{display:none!important;}.acc-node{text-align:center!important;width:100%;}
  .map-wrap{grid-template-columns:1fr!important;}#districtMapHost{min-height:0;}.map-svg{min-height:320px;}.map-panel{position:static!important;}
  .seattle-photo-card img{aspect-ratio:4/3;}
  .footer{padding-bottom:88px!important;}
}
@media(max-width:520px){
  html{font-size:15.5px;}
  h1{font-size:clamp(2.25rem,13vw,3.2rem)!important;}
  h2{font-size:clamp(1.55rem,8vw,2.05rem)!important;}
  p,li{font-size:1.02rem!important;}
  .brand-mark img{width:30px;height:30px;}.brand-mark b{font-size:.82rem;}
  .container,.page,.page-sm{padding-left:14px!important;padding-right:14px!important;}
}

/* FINAL MICROFIX: readable mobile buttons + no white logo blob */
.brand-mark img{display:none!important}
.brand-seal{display:grid!important;place-items:center!important;width:44px!important;height:34px!important;border-radius:999px!important;border:1px solid rgba(141,187,255,.32)!important;background:linear-gradient(135deg,#2d7ff9,#0c2546)!important;color:#fff!important;font-size:.58rem!important;font-weight:950!important;letter-spacing:.08em!important}
@media(max-width:980px){.hero-btns{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}.hero-btns .btn{flex:0 0 auto!important;width:100%!important;min-height:54px!important;height:auto!important;padding:14px 18px!important;border-radius:18px!important}.bucket-toggle{bottom:10px!important}.brand-mark{border-radius:18px!important}}


/* ============================================================
   STLCA FINAL HARD REPAIR - no old sidebar, no tiny text, map visible
   ============================================================ */
html{font-size:18px!important;scroll-padding-top:24px!important;}
body{background:#050b14!important;color:#f6f9ff!important;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif!important;}
body, p, li, td, th, .metric-note, .layer-desc, .finding-body, .chart-sub, .source-note{line-height:1.68!important;}
p, li{font-size:1rem!important;color:#e3ebf7!important;}
small,.metric-note,.source-note,.district-link,.footer-tagline{color:#c8d5e8!important;}
h1,h2,h3,h4,.metric-label,.layer-title{color:#f8fbff!important;}
a{color:#8dbbff!important;}
.sidebar,.sidebar-toggle,.sidebar-overlay,#sidebar,#sidebarToggle,#sidebarOverlay,.sidebar-nav,.sidebar-brand,.sidebar-footer{display:none!important;visibility:hidden!important;width:0!important;max-width:0!important;overflow:hidden!important;pointer-events:none!important;}
.main{margin-left:0!important;width:100%!important;max-width:none!important;display:block!important;min-height:100vh!important;}
main{width:100%!important;}
.page,.page-sm,.container{box-sizing:border-box!important;}
.container{max-width:1180px!important;}
.page{max-width:1180px!important;margin:0 auto!important;padding-left:24px!important;padding-right:24px!important;}
body>div[style*="position:sticky"], body>nav, nav{display:none!important;}
/* Bucket nav only: not top nav */
.brand-mark{position:fixed!important;left:20px!important;top:18px!important;right:auto!important;z-index:1400!important;max-width:min(410px,calc(100vw - 40px))!important;}
.bucket-toggle{position:fixed!important;left:20px!important;bottom:20px!important;z-index:1400!important;min-height:56px!important;font-size:.92rem!important;}
/* Hero readability */
.hero{padding-top:112px!important;}
.hero h1{font-size:clamp(3rem,7.2vw,6.8rem)!important;line-height:.98!important;letter-spacing:-.07em!important;}
.hero-sub{font-size:clamp(1.08rem,1.55vw,1.34rem)!important;line-height:1.68!important;color:#eef5ff!important;max-width:940px!important;}
.btn{font-size:1rem!important;min-height:50px!important;padding:13px 20px!important;}
/* Better sections/cards */
.section{padding-top:72px!important;padding-bottom:72px!important;}
.section-header p{font-size:1.05rem!important;max-width:780px!important;color:#dce8f7!important;}
.card,.metric-card,.layer-card,.district-card,.priority-card,.question-item,.callout,.map-readout,.chart-section,.finding-card,.home-bucket{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03))!important;border:1px solid rgba(141,187,255,.22)!important;box-shadow:0 18px 54px rgba(0,0,0,.24)!important;}
.card p,.layer-desc,.metric-note,.finding-body,.chart-sub{color:#dce8f7!important;font-size:1rem!important;}
.metric-value,.finding-stat{font-size:clamp(2.1rem,4vw,3.35rem)!important;line-height:1!important;}
/* District map: show full map, including D1, within viewport */
#districtMapHost{display:block!important;min-height:0!important;}
.map-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) 340px!important;gap:28px!important;align-items:start!important;}
.map-svg{display:block!important;width:100%!important;height:min(72vh,760px)!important;max-height:760px!important;min-height:520px!important;background:rgba(255,255,255,.045)!important;border:1px solid rgba(141,187,255,.28)!important;border-radius:26px!important;padding:12px!important;}
.map-panel{position:sticky!important;top:24px!important;}
.district-jump-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:10px!important;margin:24px 0 28px!important;}
.district-jump-grid a{display:flex!important;align-items:center!important;justify-content:center!important;min-height:52px!important;border-radius:16px!important;background:rgba(45,127,249,.13)!important;border:1px solid rgba(141,187,255,.28)!important;color:#f6f9ff!important;text-decoration:none!important;font-weight:850!important;}
.district-jump-grid a:hover{background:rgba(45,127,249,.24)!important;border-color:rgba(141,187,255,.48)!important;}
/* Legacy aliases */
.alias-page{max-width:880px;margin:0 auto;padding:140px 24px 90px;}
.alias-panel{border:1px solid rgba(141,187,255,.25);border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));padding:34px;box-shadow:0 24px 70px rgba(0,0,0,.34);}
.alias-panel h1{font-size:clamp(2.4rem,7vw,4.4rem);line-height:1;margin:0 0 14px;}
.alias-panel p{font-size:1.1rem;color:#e3ebf7;}
/* Mobile */
@media(max-width:980px){
  html{font-size:17px!important;}
  .brand-mark{left:12px!important;top:12px!important;right:12px!important;max-width:calc(100vw - 24px)!important;border-radius:18px!important;}
  .bucket-toggle{left:12px!important;right:12px!important;bottom:10px!important;justify-content:center!important;border-radius:18px!important;min-height:58px!important;}
  .page,.page-sm,.container{padding-left:16px!important;padding-right:16px!important;}
  .hero{padding-top:96px!important;}
  .hero h1{font-size:clamp(2.45rem,13vw,4.2rem)!important;}
  .hero-sub{font-size:1.05rem!important;}
  .grid-2,.grid-3,.grid-4,.grid-7,.home-buckets,.module-grid{grid-template-columns:1fr!important;}
  .map-wrap{grid-template-columns:1fr!important;}
  .map-panel{position:static!important;}
  .map-svg{height:70vh!important;min-height:560px!important;max-height:760px!important;}
  .district-jump-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .district-jump-grid a:first-child{grid-column:1/-1!important;}
  .bucket-grid{grid-template-columns:1fr!important;}
  .footer{padding-bottom:92px!important;}
}
@media(max-width:520px){
  html{font-size:16.5px!important;}
  p,li{font-size:1.02rem!important;}
  .map-svg{height:68vh!important;min-height:520px!important;}
  .district-jump-grid{grid-template-columns:1fr!important;}
}