/* ElectionTracker.live: election-night components (banner, tally strip, calls board) */
.etl-banner{display:flex;align-items:flex-start;gap:12px;background:#2a1215;border:1px solid #7f1d1d;border-left:4px solid #ef4444;border-radius:10px;padding:12px 16px;margin:0 0 14px;color:#fde8e8;font-size:15px;line-height:1.5;animation:etlIn .35s ease}
.etl-banner-test{background:#2a2410;border-color:#8a6d1d;border-left-color:#f59e0b;color:#fdf2d8}
.etl-banner-tag{flex:0 0 auto;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.12em;background:#ef4444;color:#fff;border-radius:4px;padding:4px 7px;margin-top:1px}
.etl-banner-test .etl-banner-tag{background:#f59e0b;color:#1a1a1a}
.etl-banner-text{flex:1;font-weight:500}
@keyframes etlIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.etl-strip{max-width:1200px;margin:18px auto 6px;padding:0 24px}
.etl-strip-box{background:linear-gradient(135deg,#10131d,#0b0d14);border:1px solid #2a2e42;border-radius:14px;padding:18px 20px;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.etl-strip-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.etl-live{display:inline-flex;align-items:center;gap:8px;font:700 12px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#4ade80}
.etl-live i{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:etlPulse 1.8s infinite}
.etl-live.is-test{color:#fbbf24}.etl-live.is-test i{background:#f59e0b}
.etl-live.is-stale{color:#f87171}.etl-live.is-stale i{background:#ef4444;animation:none}
@keyframes etlPulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}70%{box-shadow:0 0 0 9px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.etl-updated{font:12px 'JetBrains Mono',monospace;color:#8a8d96}
.etl-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:12px}
.etl-tile{background:#151925;border:1px solid #262a3b;border-radius:10px;padding:14px 16px;min-width:0}
.etl-tile h3{margin:0 0 10px;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#8a8d96}
.etl-nums{display:flex;justify-content:space-between;align-items:baseline;font:700 30px/1 'JetBrains Mono',monospace;margin-bottom:8px}
.etl-nums .d{color:#60a5fa}.etl-nums .r{color:#f87171}.etl-nums small{font:500 11px 'JetBrains Mono',monospace;color:#8a8d96;letter-spacing:.06em}
.etl-bar{position:relative;height:12px;border-radius:6px;background:#232838;overflow:hidden;display:flex}
.etl-bar .d{background:#3b82f6}.etl-bar .r{background:#ef4444;margin-left:auto}.etl-bar .o{background:#a855f7}
.etl-bar .mid{position:absolute;left:50%;top:-3px;bottom:-3px;width:2px;background:#f59e0b;transform:translateX(-1px)}
.etl-sub{font-size:12.5px;color:#a3a6b0;margin-top:8px;line-height:1.45}
.etl-sub strong{color:#e8e6e1}
.etl-control{display:inline-block;margin-top:6px;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.06em;padding:4px 8px;border-radius:4px;background:#232838;color:#c9cbd2}
.etl-control.d{background:#1e3a5f;color:#93c5fd}.etl-control.r{background:#5f1e1e;color:#fca5a5}
.etl-calls{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px solid #262a3b;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.etl-call{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.35;color:#d6d4cf;background:#121521;border:1px solid #23273a;border-radius:8px;padding:9px 10px}
.etl-dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px;margin-top:4px;background:#a855f7}.etl-dot.d{background:#3b82f6}.etl-dot.r{background:#ef4444}
.etl-call small{display:block;font:11px 'JetBrains Mono',monospace;color:#8a8d96;margin-top:3px}
.etl-strip-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;font-size:12px;color:#8a8d96}
.etl-strip-foot a{font:700 12px 'JetBrains Mono',monospace;color:#c4a35a;text-decoration:none}
.etl-strip-foot a:hover{color:#fff}
.etl-next{font:600 13px 'JetBrains Mono',monospace;color:#fbbf24}
.etl-hero-note{font:600 13px 'JetBrains Mono',monospace;color:#fbbf24;margin-top:14px;letter-spacing:.04em}

/* Results board */
.etl-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.etl-race{background:#151925;border:1px solid #2a2e40;border-radius:10px;padding:14px 15px;position:relative;overflow:hidden}
.etl-race.projected.d{border-color:#2b4f86;box-shadow:inset 3px 0 0 #3b82f6}
.etl-race.projected.r{border-color:#7a2f2f;box-shadow:inset 3px 0 0 #ef4444}
.etl-race.projected.o{border-color:#5b3a86;box-shadow:inset 3px 0 0 #a855f7}
.etl-race.too_close{border-color:#7a5d1d;box-shadow:inset 3px 0 0 #f59e0b}
.etl-race-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.etl-race h3{margin:0;font:700 18px/1.2 'Crimson Pro',Georgia,serif;color:#f2f1ed}
.etl-pill{flex:0 0 auto;font:700 10px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:4px;background:#232838;color:#a3a6b0}
.etl-pill.projected{background:#14301f;color:#4ade80}.etl-pill.too_close{background:#3a2c0e;color:#fbbf24}
.etl-cands{list-style:none;margin:10px 0 0;padding:0}
.etl-cands li{display:flex;align-items:center;gap:8px;font-size:14px;padding:3px 0;color:#c6c7cc}
.etl-cands li.win{color:#fff;font-weight:600}
.etl-cands li.win::after{content:'\2713  projected';margin-left:auto;font:700 10px 'JetBrains Mono',monospace;color:#4ade80;letter-spacing:.05em}
.etl-meta{font:11px/1.5 'JetBrains Mono',monospace;color:#8a8d96;margin-top:9px;overflow-wrap:anywhere}
.etl-meta a{color:#c4a35a}
.etl-note{font-size:12.5px;color:#d9c78f;margin-top:7px}
.etl-section-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:26px 0 10px;flex-wrap:wrap}
.etl-section-h h2{margin:0}
.etl-section-h span{font:12px 'JetBrains Mono',monospace;color:#8a8d96}
.etl-chips{display:flex;gap:6px;flex-wrap:wrap}
.etl-chips button{font:600 12px 'JetBrains Mono',monospace;padding:8px 12px;border-radius:999px;border:1px solid #3a3e52;background:#111421;color:#c2c4ca;cursor:pointer}
.etl-chips button[aria-pressed="true"]{background:#c4a35a;color:#0b0c10;border-color:#c4a35a}
.etl-chips button:focus-visible{outline:2px solid #c4a35a;outline-offset:2px}

@media(max-width:900px){.etl-grid{grid-template-columns:1fr}.etl-strip{padding:0 16px}}
@media(max-width:520px){.etl-nums{font-size:24px}.etl-strip-box{padding:14px}.etl-board{grid-template-columns:1fr}.etl-calls{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.etl-live i{animation:none}.etl-banner{animation:none}}