/* atlas.css — overview, compare and grouped-search additions.
   Loaded after styles.css. Nothing here overrides the existing look; it uses
   the same variables so the brand stays put. */

.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}
.g2{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;align-items:start}
.mt{margin-top:16px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:5px;padding:17px}
.panel h3{margin:0 0 10px;font-family:var(--mono);font-size:12px;letter-spacing:1.4px;
  color:var(--mut);text-transform:uppercase;font-weight:500}

.stat .num{font-family:var(--mono);font-size:29px;font-weight:700;line-height:1.1}
.stat .num.hot{color:var(--red-text)}
.stat .lbl{font-size:12.5px;color:var(--mut);margin-top:5px}
.stat .sub2{font-family:var(--mono);font-size:11px;color:var(--line-strong);margin-top:7px}

/* type composition bar */
.compo{display:flex;height:34px;border-radius:4px;overflow:hidden;margin:2px 0 12px}
.compo i{display:block}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--mut)}
.legend span{display:flex;align-items:center;gap:7px}
.legend b{width:11px;height:11px;border-radius:2px;display:block}

/* source bars */
.srow{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #1b2739}
.srow:last-of-type{border-bottom:0}
.srow .flag{font-family:var(--mono);font-size:11px;letter-spacing:1px;color:var(--mut);
  width:34px;flex:0 0 auto}
.srow .nm{font-size:13.5px;width:132px;flex:0 0 auto}
.srow .track{flex:1;height:9px;background:#0c1420;border-radius:5px;overflow:hidden}
.srow .track i{display:block;height:100%;background:var(--line-strong)}
.srow .track i.big{background:var(--red)}
.srow .n{font-family:var(--mono);font-size:13px;width:66px;text-align:right;flex:0 0 auto}

/* agreement tiers */
.ovg{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.ovc{background:#101a27;border:1px solid var(--line);border-radius:5px;padding:14px;
  text-align:center}
.ovc.hot{border-color:var(--red);background:#1a1218}
.ovc .n{font-family:var(--mono);font-size:26px;font-weight:700}
.ovc.hot .n{color:var(--red-text)}
.ovc .l{font-size:11.5px;color:var(--mut);margin-top:5px;line-height:1.45}
.pipsrow{display:flex;gap:3px;justify-content:center;margin-top:9px}
.pipsrow i{width:8px;height:8px;border-radius:2px;background:#233145;display:block}
.pipsrow i.on{background:var(--red)}

.note{font-size:12.5px;color:var(--mut);line-height:1.65;margin-top:12px}
.note b{color:var(--ink);font-weight:600}

/* comparison matrix */
.mx{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:13px}
.mx th{color:var(--mut);font-weight:500;font-size:11px;letter-spacing:1px;padding:11px 8px;
  border-bottom:1px solid var(--line);text-align:center}
.mx th.rowh{text-align:left;width:210px}
.mx td{padding:0;border-bottom:1px solid #1b2739;text-align:center}
.mx td.rowh{text-align:left;padding:12px 8px;font-family:ui-sans-serif,sans-serif;font-size:13.5px}
.mx td.rowh small{display:block;color:var(--mut);font-size:11.5px;margin-top:2px}
.cell{display:block;padding:14px 6px}
.cell .v{display:block;font-size:15px;font-weight:700}
.cell .p{display:block;font-size:10.5px;color:var(--mut);margin-top:3px;line-height:1.3}
.cell.self{color:var(--line-strong)}
.cell.hot .v{color:#ff8c94}
.h0{background:#111b28}.h1{background:#16232f}.h2{background:#1e2b33}
.h3{background:#2c2b30}.h4{background:#3d2830}.h5{background:#55262f}
.keyrow{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:12px;color:var(--mut)}
.scale{display:flex;flex:0 0 auto}
.scale i{width:34px;height:11px;display:block}

/* pair venn */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px;align-items:start}
.venn{width:300px;height:170px;position:relative;margin:4px auto 0}
.circ{position:absolute;top:10px;width:190px;height:132px;border-radius:50%;border:2px solid}
.circ.l{left:0;border-color:#3f8f7d;background:rgba(63,143,125,.14)}
.circ.r{left:110px;border-color:#c04a58;background:rgba(192,74,88,.14)}
.circ span{position:absolute;top:56px;font-family:var(--mono);font-size:15px;font-weight:700}
.circ.l span{left:26px}
.circ.r span{right:26px}
.vmid{position:absolute;left:150px;top:56px;transform:translateX(-50%);font-family:var(--mono);
  font-size:17px;font-weight:700;color:#ff8c94;z-index:2}
.vlab{position:absolute;bottom:6px;font-family:var(--mono);font-size:10.5px;letter-spacing:1px;
  color:var(--mut)}
.vlab.l{left:30px}.vlab.r{right:30px}
.kv{display:flex;justify-content:space-between;padding:9px 0;font-size:13.5px;
  border-bottom:1px solid #1b2739}
.kv:last-child{border-bottom:0}
.kv span{color:var(--mut)}
.kv b{font-family:var(--mono);font-weight:600}

/* grouped search results */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 12px}
.chip{font-family:var(--mono);font-size:11.5px;letter-spacing:.8px;padding:6px 12px;
  border-radius:3px;border:1px solid var(--line);background:var(--card);color:var(--mut);
  cursor:pointer}
.chip b{color:var(--ink);margin-left:6px}
.chip.on{border-color:var(--red);background:#1c1218;color:var(--ink)}
.ghit{display:flex;align-items:center;gap:13px;padding:13px 16px;border-bottom:1px solid #1b2739;
  cursor:pointer;width:100%;text-align:left;background:none;border-left:0;border-right:0;
  border-top:0;color:var(--ink);font:inherit}
.ghit:last-child{border-bottom:0}
.ghit:hover{background:#182437}
.ghit .nm{font-size:15px}
.ghit .ty{font-family:var(--mono);font-size:10px;letter-spacing:.8px;color:var(--mut);
  border:1px solid var(--line);padding:2px 7px;border-radius:3px}
.conf{margin-left:auto;display:flex;align-items:center;gap:11px}
.pips{display:flex;gap:3px}
.pips i{width:9px;height:16px;border-radius:2px;background:#1e2b3d;display:block}
.pips i.on{background:var(--red)}
.conf .lab{font-family:var(--mono);font-size:10.5px;letter-spacing:.7px;color:var(--mut);
  width:82px;text-align:right}
.conf .lab.four{color:var(--red-text)}

/* cross-authority record */
.rechead{padding:20px 22px;border-bottom:1px solid var(--line)}
.rechead h3{margin:0 0 6px;font-size:24px;letter-spacing:-.3px}
.rechead .rmeta{font-family:var(--mono);font-size:12px;color:var(--mut);letter-spacing:.5px}
.verdict{margin-top:14px;padding:13px 16px;border-radius:4px;font-size:14px;line-height:1.55}
.verdict.four{background:#1c1218;border:1px solid #5c2029;color:#ffb9bf}
.verdict.four b{color:#ff8c94}
.verdict.some{background:#141f2e;border:1px solid var(--line);color:var(--mut)}
.verdict.some b{color:var(--ink)}
.auth{display:grid;grid-template-columns:130px 1fr 140px;gap:0;align-items:center;
  padding:13px 22px;border-bottom:1px solid #1b2739}
.auth .who{font-family:var(--mono);font-size:11.5px;letter-spacing:1px;color:var(--mut)}
.auth .as{font-size:15px}
.auth .as small{display:block;font-family:var(--mono);font-size:11px;color:var(--mut);margin-top:3px}
.auth .ref{font-family:var(--mono);font-size:12px;color:var(--line-strong);text-align:right}
.auth.miss .as{color:var(--mut);font-style:italic;font-size:14px}
.auth.miss .who{opacity:.5}
.links{display:flex;gap:9px;flex-wrap:wrap;padding:15px 22px;border-top:1px solid var(--line)}
.links a{font-family:var(--mono);font-size:11.5px;letter-spacing:.6px;padding:8px 13px;
  border-radius:3px;border:1px solid var(--line);color:var(--mut);text-decoration:none}
.links a:hover{border-color:var(--line-strong);color:var(--ink)}
.recnote{font-size:12.5px;color:var(--mut);line-height:1.65;padding:15px 22px;
  border-top:1px solid var(--line)}
.recnote b{color:var(--ink);font-weight:600}

@media(max-width:900px){
  .g4,.ovg{grid-template-columns:1fr 1fr}
  .g2,.pair{grid-template-columns:1fr}
  .auth{grid-template-columns:1fr;gap:4px}
  .auth .ref{text-align:left}
}

/* containers used by ships.html / fleet-map.html that previously had no
   rules (chips ran together; count line unstyled) */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 12px}
.resline{color:var(--mut);font:600 12px var(--mono);letter-spacing:.08em;
  text-transform:uppercase;margin:10px 0 8px}

/* Ocean Watch */
.ocean-wrap{max-width:1260px}
.watch-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  margin-bottom:14px}
.watch-head h1{margin-top:0}
.watch-source{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--mut);border:1px solid var(--line);border-radius:5px;padding:9px 11px;
  margin:0;min-width:220px;text-align:right}
.watch-warning{background:#281a13;border:1px solid #674226;border-radius:5px;
  padding:13px 15px;font-size:13.5px;line-height:1.55;margin:13px 0 16px}
.watch-warning strong{color:#ffca9c}
.watch-board{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);
  gap:16px;align-items:stretch}
.watch-map-panel,.watch-detail{background:linear-gradient(180deg,#121c2a,#0d1520);
  border:1px solid #2f415b;border-radius:5px;padding:13px;box-shadow:0 0 0 1px rgba(255,255,255,.02),
  0 18px 44px rgba(0,0,0,.28)}
.map-frame{position:relative;border:1px solid #365070;border-radius:5px;overflow:hidden;
  background:#06101a;box-shadow:inset 0 0 42px rgba(61,247,173,.08)}
#oceanMap,#oceanGlobe{height:560px;min-height:420px;overflow:hidden;background:#06101a}
#oceanGlobe{display:none}
.map-frame.globe-mode #oceanMap{display:none}
.map-frame.globe-mode #oceanGlobe{display:block}
#oceanMap .leaflet-tile-pane{filter:saturate(.48) brightness(.92) contrast(1.14);
  opacity:.96}
#oceanMap .leaflet-control-attribution{background:rgba(4,10,18,.72);color:#9fb2c8;
  font:10px var(--mono)}
#oceanMap .leaflet-control-attribution a{color:#d1dae8}
#oceanMap .leaflet-control-zoom a{background:rgba(8,17,29,.88);border-color:#365070;
  color:#dbe8f6}
#oceanMap .leaflet-popup-content-wrapper,#oceanMap .leaflet-popup-tip{background:#0c1420;
  color:var(--ink);border:1px solid #435c7d;box-shadow:0 12px 28px rgba(0,0,0,.42)}
.watch-popup strong{font-family:var(--mono);letter-spacing:.04em}
.watch-popup span{color:#b8c6d8;font-size:12px}
.vessel-popup strong{display:block;font-size:15px;margin-bottom:6px}
.vessel-popup dl{display:grid;grid-template-columns:92px minmax(0,1fr);gap:4px 10px;
  margin:9px 0 0;border-top:1px solid #1b2739;padding-top:8px}
.vessel-popup dt{font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#8fb4d8}
.vessel-popup dd{margin:0;color:#eef6ff;font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.popup-note{display:block;margin-top:8px;color:#9fb2c8!important;font-family:var(--mono)}
#oceanGlobe .maplibregl-popup-content{background:#0c1420;color:var(--ink);
  border:1px solid #435c7d;border-radius:5px;box-shadow:0 12px 28px rgba(0,0,0,.42)}
#oceanGlobe .maplibregl-popup-tip{border-top-color:#435c7d;border-bottom-color:#435c7d}
.map-frame:before{content:"";position:absolute;inset:0;z-index:450;pointer-events:none;
  background:
    linear-gradient(rgba(4,10,18,.2),rgba(4,10,18,.2)),
    linear-gradient(rgba(61,247,173,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(61,247,173,.06) 1px,transparent 1px),
    radial-gradient(circle at 50% 52%,transparent 0 28%,rgba(61,247,173,.08) 29%,
      transparent 30%,transparent 48%,rgba(255,93,104,.08) 49%,transparent 50%);
  background-size:100% 100%,44px 44px,44px 44px,100% 100%;mix-blend-mode:multiply}
.map-frame:after{content:"";position:absolute;inset:0;z-index:451;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(61,247,173,.2),transparent 1px) left 50% top 0/1px 100% no-repeat,
    linear-gradient(rgba(61,247,173,.2),transparent 1px) left 0 top 50%/100% 1px no-repeat,
    radial-gradient(circle at 50% 52%,transparent 0 30%,rgba(61,247,173,.11) 31%,
      transparent 32%,transparent 54%,rgba(255,93,104,.1) 55%,transparent 56%),
    radial-gradient(circle at 50% 52%,transparent 0 62%,rgba(6,16,26,.34) 100%);
  opacity:.52}
.map-sweep{position:absolute;left:50%;top:52%;z-index:451;pointer-events:none;
  width:155%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) rotate(0deg);
  transform-origin:50% 50%;background:conic-gradient(from -20deg,
    rgba(61,247,173,.34) 0deg,rgba(61,247,173,.18) 16deg,
    rgba(61,247,173,.04) 34deg,rgba(61,247,173,0) 52deg 360deg);
  mix-blend-mode:screen;opacity:.42;animation:radarSweep 7.5s linear infinite}
.map-sweep:after{content:"";position:absolute;inset:49.85% 50% auto auto;width:50%;
  height:2px;background:linear-gradient(90deg,rgba(61,247,173,.68),transparent);
  box-shadow:0 0 16px rgba(61,247,173,.38);transform-origin:left center}
@keyframes radarSweep{to{transform:translate(-50%,-50%) rotate(360deg)}}
.map-hud,.map-legend{position:absolute;z-index:452;pointer-events:none;background:rgba(7,14,25,.82);
  border:1px solid rgba(97,128,159,.55);backdrop-filter:blur(6px);box-shadow:0 10px 28px rgba(0,0,0,.28)}
.map-hud{left:14px;top:14px;border-radius:5px;padding:9px 11px;display:flex;
  flex-direction:column;gap:3px}
.map-hud span{font:700 10px var(--mono);letter-spacing:.14em;color:#7decc2}
.map-hud b{font:700 12px var(--mono);letter-spacing:.08em;color:#eef6ff}
.map-legend{right:14px;bottom:14px;border-radius:5px;padding:8px 10px;display:flex;
  gap:11px;align-items:center;flex-wrap:wrap}
.map-legend span{font:700 10.5px var(--mono);letter-spacing:.06em;color:#c8d5e4;
  display:flex;align-items:center;gap:5px}
.map-legend i{width:9px;height:9px;border-radius:50%;display:block;box-shadow:0 0 12px currentColor}
.map-legend i.live{background:#3df7ad;color:#3df7ad}
.map-legend i.stale{background:#ffd166;color:#ffd166}
.map-legend i.dark{background:#aeb7c6;color:#aeb7c6}
.map-tools{position:absolute;right:14px;top:14px;z-index:453;display:flex;gap:8px;
  align-items:center;flex-wrap:wrap;justify-content:flex-end;max-width:min(520px,calc(100% - 280px))}
.map-tools button,.track-select{font:700 10.5px var(--mono);letter-spacing:.07em;text-transform:uppercase;
  border:1px solid rgba(97,128,159,.62);border-radius:4px;background:rgba(7,14,25,.86);
  color:#c8d5e4;padding:7px 9px;box-shadow:0 10px 24px rgba(0,0,0,.22)}
.map-tools button{cursor:pointer}
.map-tools button:hover,.map-tools button.on{border-color:#ff5d68;color:#fff;background:#1c1218}
.segmented{display:flex;background:rgba(7,14,25,.86);border-radius:4px;overflow:hidden}
.segmented button{border-radius:0;box-shadow:none}
.track-select{display:flex;gap:7px;align-items:center;padding:5px 8px;color:#8fb4d8}
.track-select select{background:#101a27;color:#eef6ff;border:1px solid #314861;border-radius:3px;
  font:700 11px var(--mono);padding:4px 6px}
.watch-map-panel.analysis-mode{position:fixed;inset:0;z-index:1000;border:0;border-radius:0;
  padding:12px;background:#07101a}
.watch-map-panel.analysis-mode .map-frame{height:calc(100vh - 44px);border-radius:5px}
.watch-map-panel.analysis-mode #oceanMap,.watch-map-panel.analysis-mode #oceanGlobe{
  height:100%;min-height:0}
.watch-map-panel.analysis-mode #mapNote{margin:8px 0 0}
.contact-marker{filter:drop-shadow(0 0 8px rgba(61,247,173,.42))}
.contact-marker.selected{filter:drop-shadow(0 0 10px rgba(255,93,104,.82))}
.contact-halo{filter:drop-shadow(0 0 16px rgba(255,93,104,.72))}
@keyframes pulsePing{0%{transform:translate(-50%,-50%) scale(.72);opacity:.52}
  100%{transform:translate(-50%,-50%) scale(1.35);opacity:0}}
@media(prefers-reduced-motion:reduce){.map-sweep{animation:none!important}}
.watch-detail{max-height:620px;overflow:auto}
.watch-detail h2{margin:4px 0 10px}
.detail-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;
  border-bottom:1px solid #1b2739;padding-bottom:12px;margin-bottom:12px}
.detail-title h3{margin:0;font-size:22px;line-height:1.2}
.watch-kv{grid-template-columns:116px minmax(0,1fr);gap:5px 14px}
.watch-kv dd{font-size:12.5px}
.watch-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:16px 0}
.watch-controls{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);
  gap:10px 14px;align-items:start;margin-top:8px}
.watch-controls .searchbox{grid-row:1 / span 2}
.watch-list{border:1px solid var(--line);border-radius:5px;background:var(--card);
  overflow:hidden;margin-top:10px}
.watch-pager{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 10px}
.pager-btn{font:700 11px var(--mono);letter-spacing:.05em;border:1px solid var(--line);
  border-radius:4px;background:#111b28;color:var(--mut);padding:7px 10px;cursor:pointer}
.pager-btn:hover{border-color:var(--line-strong);color:var(--ink)}
.pager-btn.on{border-color:var(--red);background:#1c1218;color:#fff}
.pager-btn:disabled{opacity:.42;cursor:not-allowed}
.pager-gap,.pager-meta{font:700 11px var(--mono);color:var(--mut);padding:0 4px}
.pager-meta{margin-left:auto;letter-spacing:.08em;text-transform:uppercase}
.watch-row{width:100%;display:grid;grid-template-columns:minmax(240px,1.35fr)
  minmax(210px,.95fr) 112px;align-items:center;gap:14px;padding:13px 15px;
  border:0;border-bottom:1px solid #1b2739;background:transparent;color:var(--ink);
  text-align:left;cursor:pointer;font:inherit}
.watch-row:last-child{border-bottom:0}
.watch-row:hover,.watch-row.on{background:#182437}
.watch-main b,.watch-voyage b{display:block;font-size:14.5px;line-height:1.25}
.watch-main small,.watch-voyage small{display:block;color:var(--mut);font:600 11px var(--mono);
  letter-spacing:.04em;margin-top:4px;overflow-wrap:anywhere}
.watch-status{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;
  min-width:92px;border-radius:4px;border:1px solid var(--line);padding:5px 8px;
  color:var(--ink);font:700 11px var(--mono);letter-spacing:.06em;text-transform:uppercase}
.watch-status small{font:600 10px var(--mono);letter-spacing:0;text-transform:none;color:var(--mut)}
.watch-status.live{border-color:#1f8b4c;background:#11261c;color:#83f0aa}
.watch-status.stale{border-color:#92651a;background:#241c10;color:#ffd18a}
.watch-status.dark{border-color:#637083;background:#151b24;color:#c7d1df}
.watch-status.no_data{border-color:#334155;background:#111827;color:#92a2b8}
.watch-timeline{border:1px solid #1b2739;border-radius:5px;overflow:hidden;margin-bottom:14px}
.timeline-row{display:grid;grid-template-columns:132px minmax(0,1fr);gap:7px 12px;
  padding:10px 11px;border-bottom:1px solid #1b2739;font-size:12.5px}
.timeline-row:last-child{border-bottom:0}
.timeline-row b{font-family:var(--mono);font-size:11px;color:var(--ink)}
.timeline-row span{font-family:var(--mono);font-size:12px;color:var(--mut)}
.timeline-row small{grid-column:2;color:var(--line-strong);font-size:11.5px}
.timeline-row.gap{background:#1a1218}
.timeline-row.gap b{color:#ff8c94}
.empty{padding:34px 20px;text-align:center;color:var(--mut)}

@media(max-width:1050px){
  .watch-board,.watch-controls{grid-template-columns:1fr}
  .watch-controls .searchbox{grid-row:auto}
  .watch-stats{grid-template-columns:repeat(2,1fr)}
  .watch-detail{max-height:none}
}

@media(max-width:680px){
  .watch-head{display:block}
  .watch-source{text-align:left;margin-top:10px}
  #oceanMap,#oceanGlobe{height:430px;min-height:360px}
  .map-hud{left:10px;top:10px;padding:7px 9px}
  .map-tools{left:10px;right:10px;top:auto;bottom:48px;max-width:none;justify-content:flex-start}
  .map-tools button,.track-select{font-size:10px;padding:6px 7px}
  .map-legend{left:10px;right:10px;bottom:8px;justify-content:flex-start}
  .watch-map-panel.analysis-mode{padding:8px}
  .watch-map-panel.analysis-mode .map-frame{height:calc(100vh - 38px)}
  .watch-row{grid-template-columns:1fr;gap:8px}
  .watch-status{width:max-content}
  .watch-stats{grid-template-columns:1fr}
  .timeline-row{grid-template-columns:1fr}
  .timeline-row small{grid-column:1}
}

/* Signal Replay */
.replay-wrap{max-width:1440px}
.replay-shell{display:grid;grid-template-columns:250px minmax(0,1fr) 310px;gap:14px;
  align-items:stretch}
.replay-panel,.replay-map-panel{background:linear-gradient(180deg,#121c2a,#0d1520);
  border:1px solid #2f415b;border-radius:5px;padding:13px;box-shadow:0 18px 44px rgba(0,0,0,.24)}
.replay-panel h2{margin-top:4px}
.replay-panel label{display:flex;align-items:center;gap:9px;padding:9px 0;
  border-bottom:1px solid #1b2739;color:#c8d5e4;font-size:13px}
.replay-panel label span{min-width:0;flex:1}
.replay-panel label b{flex:0 0 auto;min-width:26px;text-align:center;border:1px solid #314861;
  border-radius:3px;background:#0c1420;color:#9fb2c8;font:700 10px var(--mono);
  line-height:1;padding:5px 6px}
.replay-panel input{accent-color:var(--red)}
.replay-map-frame #replayMap{height:650px;min-height:460px;overflow:hidden;background:#06101a}
#replayMap .leaflet-tile-pane{filter:saturate(.48) brightness(.92) contrast(1.14);opacity:.96}
#replayMap .leaflet-control-attribution{background:rgba(4,10,18,.72);color:#9fb2c8;
  font:10px var(--mono)}
#replayMap .leaflet-control-zoom a{background:rgba(8,17,29,.88);border-color:#365070;
  color:#dbe8f6}
#replayMap .leaflet-popup-content-wrapper,#replayMap .leaflet-popup-tip{background:#0c1420;
  color:var(--ink);border:1px solid #435c7d;box-shadow:0 12px 28px rgba(0,0,0,.42)}
.replay-controls{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  margin-top:12px}
.replay-controls input[type=range]{width:100%;accent-color:var(--red)}
.event-stack,.receipt-stack{display:flex;flex-direction:column;gap:8px}
.event-row{width:100%;border:1px solid #22314a;border-radius:4px;background:#101a27;color:var(--ink);
  text-align:left;padding:10px;cursor:pointer}
.event-row:hover{border-color:#5f7898;background:#162336}
.event-row b,.receipt b{display:block;font-size:13px;line-height:1.25}
.event-row span,.receipt span{display:block;color:var(--mut);font:700 10.5px var(--mono);
  letter-spacing:.04em;margin-top:4px}
.event-row small{display:block;color:#8fa2b8;font-size:11.5px;line-height:1.45;margin-top:5px}
.receipt{border:1px solid #22314a;border-radius:4px;background:#101a27;padding:10px}
.receipt a{display:inline-block;font:700 10.5px var(--mono);letter-spacing:.06em;
  margin-top:7px;text-transform:uppercase}

@media(max-width:1120px){
  .replay-shell{grid-template-columns:1fr}
  .replay-map-frame #replayMap{height:520px}
}