@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');
:root { color-scheme: dark; --bg:#030507; --panel:#0c0f14; --border:#263147; --text:#e2e8f0; --muted:#94a3b8; --vs:#c084fc; --nc:#60a5fa; --tr:#fb7185; }
/* The app's terrain and facility polygons, with independent alert playback. */
.alert-territory { max-width:850px; margin:32px 0; scroll-margin-top:90px; }
.alert-territory [hidden] { display:none !important; }
.map-notice { margin:0 0 14px; }
.map-controls { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.map-controls input[type=range] { flex:1 1 240px; width:100%; min-width:0; accent-color:var(--vs); cursor:pointer; min-height:32px; }
.map-controls input:disabled { cursor:default; }
.map-time { flex-basis:100%; font:12px/1.6 'JetBrains Mono',monospace; color:var(--muted); }
.map-button { background:var(--panel); color:var(--text); border:1px solid var(--border); min-height:44px; padding:9px 14px; }
.map-button[aria-pressed=true] { border-color:var(--vs); color:var(--vs); }
.map-legend { display:flex; flex-wrap:wrap; gap:8px 18px; font:11px/1.7 'JetBrains Mono',monospace; margin-bottom:10px; }
.map-legend .hex-vs { color:var(--vs); }.map-legend .hex-nc { color:var(--nc); }.map-legend .hex-tr { color:var(--tr); }
.map-legend .hex-neutral { color:#cbd5e1; }.map-legend .hex-unknown { color:#94a3b8; }
.alert-map-viewport { position:relative; width:100%; max-width:850px; aspect-ratio:1; background:#070d12; border:1px solid var(--border); overflow:hidden; touch-action:none; cursor:grab; }
.alert-map-viewport:active { cursor:grabbing; }
.alert-map-stage { position:absolute; width:100%; height:100%; background:center/contain no-repeat; transform-origin:center; }
.alert-map-stage svg { position:absolute; inset:0; width:100%; height:100%; }
.alert-map-stage polygon { fill:rgba(148,163,184,.12); stroke:rgba(245,245,245,.38); stroke-width:.1; cursor:pointer; }
.alert-map-stage polygon.hex-vs { fill:rgba(192,132,252,.3); }.alert-map-stage polygon.hex-nc { fill:rgba(96,165,250,.3); }.alert-map-stage polygon.hex-tr { fill:rgba(251,113,133,.3); }
.alert-map-stage polygon.hex-neutral { fill:rgba(148,163,184,.25); }.alert-map-stage polygon.hex-unknown { fill:rgba(32,39,51,.65); stroke-dasharray:.3 .3; }
.alert-map-stage polygon:hover,.alert-map-stage polygon.selected { stroke:#fff; stroke-width:.3; fill-opacity:.9; }
.alert-map-stage polygon.hex-cutoff { stroke:#94a3b8; stroke-dasharray:.35 .2; }
.map-lattice-links { pointer-events:none; }
.lattice-backdrop { stroke:#070d12; stroke-width:.5; stroke-opacity:.75; }
.lattice-line { stroke:#94a3b8; stroke-width:.22; stroke-linecap:round; }
.lattice-vs .lattice-line { stroke:#d8b4fe; }.lattice-nc .lattice-line { stroke:#93c5fd; }.lattice-tr .lattice-line { stroke:#fda4af; }
.lattice-border .lattice-line { stroke:#fbbf24; stroke-dasharray:.65 .35; }
.lattice-cutoff .lattice-line,.lattice-unknown .lattice-line { stroke:#94a3b8; stroke-dasharray:.3 .3; }
.lattice-inactive { opacity:.3; }
.map-lattice-legend { max-width:850px; font-size:11px; margin:0 0 12px; }
.map-facility-marker.marker-cutoff { border-color:#fbbf24; background:#263147cc; }
.map-facility-marker { position:absolute; transform:translate(-50%,-50%); min-height:0; width:25px; height:22px; padding:0; border:1px solid #d1d5db99; color:white; background:#263147aa; font:700 8px/1 'JetBrains Mono',monospace; text-shadow:0 1px 3px #000; clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%); cursor:pointer; }
.map-facility-marker.hex-vs { background:#6b21a899; }.map-facility-marker.hex-nc { background:#1d4ed899; }.map-facility-marker.hex-tr { background:#b91c1c99; }
.map-facility-marker.hex-unknown { color:#cbd5e1; background:#0f172abb; }
.map-facility-marker.selected,.map-facility-marker:hover,.map-facility-marker:focus-visible { filter:brightness(1.7); outline:2px solid white; }
.map-zoom-controls,.map-history-paging { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:12px 0; }
.map-detail { max-width:850px; margin:0 0 18px; padding:12px 16px; background:var(--panel); border-left:2px solid var(--vs); color:var(--muted); font-size:12px; }
.map-capture-history { max-width:850px; border:1px solid var(--border); padding:0 16px; }
.map-capture-history summary { cursor:pointer; padding:14px 0; color:var(--text); font-size:13px; }
.map-capture-history .map-button { font-size:11px; padding:6px 10px; }
.map-capture-history th { white-space:nowrap; }
@media(max-width:640px) { .map-controls { gap:8px; }.map-facility-marker { width:18px; height:16px; font-size:6px; }.map-legend { gap:6px 12px; font-size:10px; }.map-time { font-size:11px; }.map-capture-history { padding:0 10px; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:15px/1.65 Inter,sans-serif; }
main { max-width:1260px; margin:auto; padding:130px 40px 50px; }
.oracle-header { padding-bottom:30px; border-bottom:1px solid var(--border); }
.eyebrow { display:flex; align-items:center; flex-wrap:wrap; gap:16px; color:var(--muted); font:11px/1.6 'JetBrains Mono',monospace; letter-spacing:.18em; }
.eyebrow span { color:#fbbf24; border:1px solid #665124; padding:3px 8px; font-size:10px; letter-spacing:.08em; }
h1 { margin:16px 0 12px; font:900 clamp(42px,6vw,76px)/1.1 Orbitron,monospace; letter-spacing:-.055em; }
h1 span { color:var(--vs); }
.intro { max-width:640px; color:var(--muted); font-size:17px; margin:0; }
.controls { display:flex; align-items:center; gap:20px; flex-wrap:wrap; padding:24px 0; }
label { display:grid; gap:5px; font-size:12px; color:var(--muted); }
select,input[type=search] { background:var(--panel); border:1px solid var(--border); border-radius:3px; color:var(--text); padding:11px 13px; font:14px Inter,sans-serif; min-height:44px; }
button { background:var(--vs); color:#160b23; border:0; border-radius:3px; padding:13px 18px; font:700 13px Inter,sans-serif; cursor:pointer; min-height:44px; }
button span { margin-left:24px; font-size:18px; }
button:disabled { opacity:.6; cursor:wait; }
button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible { outline:2px solid var(--vs); outline-offset:4px; }
.controls button { margin-top:23px; }
.auto { display:flex; flex-direction:row; align-items:center; gap:9px; margin-top:23px; cursor:pointer; }
input[type=checkbox] { accent-color:var(--vs); width:17px; height:17px; }
#status { margin:0; width:100%; color:var(--muted); font-size:13px; }
#status.error { color:#fda4af; }
.empty-state { display:flex; align-items:center; gap:32px; border:1px solid var(--border); background:var(--panel); padding:36px; margin-bottom:30px; }
.oracle-mark { font-size:100px; line-height:1; color:var(--vs); font-family:serif; }
.empty-state h2 { margin:0 0 10px; font-size:22px; }
.empty-state p { max-width:740px; color:var(--muted); margin:8px 0; }
.small { font-size:12px; color:var(--muted); }
.report { border-top:2px solid var(--border); padding-top:24px; margin-bottom:48px; }
.report-header { display:flex; justify-content:space-between; align-items:start; gap:16px; margin-bottom:20px; }
.report-header h2 { font-size:26px; margin:0 0 4px; }
.report-header p { color:var(--muted); margin:0; font-size:13px; }
.evidence { border:1px solid #665124; color:#fbbf24; white-space:nowrap; padding:5px 10px; font:11px/1.6 'JetBrains Mono',monospace; }
.forecast { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--border); background:var(--panel); }
.faction { padding:25px; border-right:1px solid var(--border); position:relative; }
.faction:last-child { border:0; }
.faction::before { content:''; height:3px; background:var(--faction); position:absolute; top:-1px; left:0; right:0; }
.vs { --faction:var(--vs); } .nc { --faction:var(--nc); } .tr { --faction:var(--tr); }
.faction-name { color:var(--faction); font:700 14px/1.6 Orbitron,monospace; }
.odds { font:500 clamp(34px,5vw,60px)/1.4 'JetBrains Mono',monospace; color:#f8fafc; letter-spacing:-.06em; }
.odds span { font-size:22px; color:var(--muted); }
.faction p { margin:0; font-size:12px; color:var(--muted); }
.bar { background:#202936; height:5px; margin:16px 0 12px; }
.bar i { display:block; height:100%; background:var(--faction); }
.callout { color:var(--muted); font-size:13px; padding:14px 0; margin:0 0 16px; }
.callout strong { color:var(--text); }
.section-label { font:500 11px/1.6 'JetBrains Mono',monospace; color:var(--muted); letter-spacing:.15em; text-transform:uppercase; margin:30px 0 12px; }
.scroll-table { overflow-x:auto; border:1px solid var(--border); }
table { width:100%; border-collapse:collapse; text-align:left; font-size:13px; }
th,td { padding:12px 16px; border-bottom:1px solid #1e293b; white-space:nowrap; }
thead th { color:var(--muted); font-size:11px; font-weight:500; background:var(--panel); }
tbody tr:last-child th,tbody tr:last-child td { border:0; }
tbody th { font-weight:500; }
td { font-family:'JetBrains Mono',monospace; }
.color-vs { color:var(--vs); } .color-nc { color:var(--nc); } .color-tr { color:var(--tr); }
.analysis-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.focus-row { display:grid; grid-template-columns:80px 1fr 65px; gap:14px; align-items:center; padding:11px 0; border-bottom:1px solid #1e293b; font-size:12px; }
.focus-row .bar { margin:0; }
.focus-row .bar i { background:var(--faction); }
.focus-row .value { text-align:right; font-family:'JetBrains Mono',monospace; }
.validation { background:var(--panel); border:1px solid var(--border); padding:20px; }
.validation p { color:var(--muted); margin:0 0 14px; font-size:13px; }
.validation dl { display:grid; grid-template-columns:1fr auto; gap:8px 20px; margin:0; font-size:12px; }
.validation dt { color:var(--muted); } .validation dd { margin:0; font-family:'JetBrains Mono',monospace; }
.roster-controls { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:14px; align-items:end; }
.roster-controls input { width:min(350px,100%); }
.roster-controls p { margin:0; color:var(--muted); font-size:12px; }
.player-link { color:var(--text); text-decoration:none; font-family:Inter,sans-serif; }
.player-link:hover { color:var(--vs); text-decoration:underline; }
.player-tag { color:var(--muted); margin-right:5px; }
.roster-paging { display:flex; gap:10px; margin-top:12px; }
.roster-paging button { border:1px solid var(--border); color:var(--text); background:var(--panel); }
.roster-paging button:disabled { cursor:default; opacity:.4; }
.analogues { display:grid; grid-template-columns:1fr 1fr; gap:0 24px; }
.analogue { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid #1e293b; font-size:12px; }
.analogue small { display:block; color:var(--muted); }
.methodology { border-top:1px solid var(--border); margin-top:24px; padding:24px 0; }
summary { cursor:pointer; font-size:14px; color:var(--text); }
.method-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:20px; }
.method-grid h3 { font-size:14px; margin:0; }
.method-grid p,.methodology li { font-size:13px; color:var(--muted); }
footer { border-top:1px solid var(--border); margin-top:20px; padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; color:var(--muted); font:10px/1.6 'JetBrains Mono',monospace; letter-spacing:.08em; }
footer a { color:var(--vs); text-decoration:none; }
[hidden] { display:none !important; }
.oracle-chart { border:1px solid var(--border); background:var(--panel); padding:20px 22px; margin:4px 0 28px; }
.oracle-chart-heading { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.oracle-chart-heading .section-label { margin:0 0 4px; }
.oracle-chart-heading h3 { margin:0; font-size:19px; font-weight:500; }
.oracle-chart-legend,.oracle-chart-legend>div { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
.oracle-chart-legend { justify-content:space-between; margin:18px 0 4px; font:11px 'JetBrains Mono',monospace; color:var(--muted); }
.oracle-chart-legend span { display:inline-flex; align-items:center; gap:6px; }
.chart-faction i { width:7px; height:7px; background:currentColor; }
.chart-key { width:25px; border-top:3px solid var(--text); }
.chart-key-territory { border-top:2px dashed var(--muted); }
.oracle-chart-svg { width:100%; display:block; overflow:visible; }
.chart-grid { stroke:var(--border); stroke-width:1; }
.chart-tick { fill:var(--muted); font:11px 'JetBrains Mono',monospace; }
.chart-win,.chart-territory { fill:none; stroke:currentColor; vector-effect:non-scaling-stroke; }
.chart-win { stroke-width:2.5; }
.chart-territory { stroke-width:1.5; stroke-dasharray:5 5; opacity:.6; }
.chart-dot { fill:currentColor; }
.chart-dot-replay { fill:var(--panel); stroke:currentColor; stroke-width:1.5; vector-effect:non-scaling-stroke; }
.oracle-chart-provenance { display:flex; gap:18px; flex-wrap:wrap; margin:12px 0 0; }
.historical-result { font:13px 'JetBrains Mono',monospace; border:1px solid currentColor; padding:8px 12px; white-space:nowrap; }
#alert-view { max-width:min(520px,80vw); }
#older-alerts { background:transparent; border:1px solid var(--border); color:var(--muted); }
.chart-guide { stroke:var(--muted); stroke-dasharray:3 4; opacity:.65; }
.chart-hit { cursor:crosshair; touch-action:pan-y; }
.chart-scrubber { display:flex; align-items:center; gap:18px; margin:12px 0; }
.chart-scrubber label { flex:1; min-width:0; }
.chart-scrubber input { accent-color:var(--vs); width:100%; margin:0; min-height:32px; }
.chart-latest { background:transparent; color:var(--text); border:1px solid var(--border); font-size:11px; padding:8px 11px; }
.chart-readout { background:var(--bg); border-left:2px solid var(--vs); padding:12px 14px; }
.chart-readout p { display:flex; gap:16px; flex-wrap:wrap; justify-content:space-between; margin:0 0 8px; font-size:12px; }
.chart-readout>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; font:12px 'JetBrains Mono',monospace; }
.chart-readout small { display:block; font-size:10px; margin-top:5px; color:var(--muted); }
.chart-note { margin:12px 0; }
.chart-data summary { font-size:12px; color:var(--muted); }
.chart-data .scroll-table { margin-top:12px; }
@media(max-width:720px) { .oracle-chart { padding:16px 12px; } .oracle-chart-heading { align-items:start; } .oracle-chart-heading h3 { font-size:17px; } .oracle-chart-heading>span { font-size:10px; white-space:nowrap; } .oracle-chart-svg { height:230px; } .chart-readout { padding:10px; } .chart-readout>div { gap:7px; font-size:11px; } .chart-readout small { font-size:9px; } }
@media(max-width:720px) { main { padding:100px 18px 30px; } .empty-state { padding:22px; gap:18px; } .oracle-mark { font-size:60px; } .empty-state h2 { font-size:18px; } .faction { padding:18px 12px; } .odds { font-size:34px; } .analysis-grid,.method-grid { grid-template-columns:1fr; gap:10px; } .report-header { flex-direction:column; } .controls { gap:14px; } .analogues { grid-template-columns:1fr; } th,td { padding:11px 12px; } }
@media(max-width:390px) { .odds { font-size:29px; } .odds span { font-size:16px; } .faction-name { font-size:12px; } .auto { margin-top:0; } }