:root{--bg:#0f141a;--bg2:#161d25;--bg3:#1e2731;--fg:#e6edf3;--fg2:#9fb0c0;--line:#2b3742;--acc:#4cc2ff;--ok:#3fd67a;--warn:#f5c542;--bad:#ff5f6d;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
--g-src:#ff9f43;--g-dst:#ffd166;--g-path:#c8b6ff;--g-dti:#ff5f6d;--g-time:#7bdff2;--g-lat:#3fd67a;--g-lon:#63e6be;--g-sym:#f78fb3;--g-ext:#4cc2ff;--g-alt:#a3e635;--g-comment:#9fb0c0;--g-msg:#ffb3c6;--g-obj:#ffcf99;--g-tele:#b8f1ff;--g-wx:#8ecae6;--g-mice:#e0aaff;--g-other:#6c7a89}
*{box-sizing:border-box}html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--fg);font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;display:flex;flex-direction:column;overflow:hidden}
a{color:var(--acc)}
#top{display:flex;align-items:center;gap:14px;padding:6px 12px;background:var(--bg2);border-bottom:1px solid var(--line);flex:0 0 auto;flex-wrap:wrap}
.brand{font-size:15px;white-space:nowrap}.brand .sub{color:var(--fg2);font-size:12px;margin-left:8px}
.chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-left:auto}
.chip{background:var(--bg3);border:1px solid var(--line);border-radius:14px;padding:3px 10px;font-size:12px;white-space:nowrap;display:flex;align-items:center;gap:6px}
.chip.ok{border-color:var(--ok);color:var(--ok)}.chip.warn{border-color:var(--warn);color:var(--warn)}.chip.bad{border-color:var(--bad);color:var(--bad)}.chip.info{border-color:var(--acc);color:var(--acc)}
.meter{width:80px;height:8px;background:#0a0e12;border-radius:4px;overflow:hidden;border:1px solid var(--line)}
.meter div{height:100%;width:0;background:linear-gradient(90deg,var(--ok),var(--warn) 60%,var(--bad));transition:width .3s}
#banner{background:#3a1f22;color:#ffd7da;border-bottom:1px solid var(--bad);padding:8px 14px;font-size:13px}
main{flex:1 1 auto;display:flex;min-height:0}
#map{flex:1 1 auto;background:#0a0e12}
#side{flex:0 0 460px;display:flex;flex-direction:column;border-left:1px solid var(--line);background:var(--bg2);min-height:0}
#tabs{display:flex;border-bottom:1px solid var(--line)}
#tabs button{flex:1;background:none;border:0;color:var(--fg2);padding:8px 4px;cursor:pointer;font-size:12px;border-bottom:2px solid transparent}
#tabs button.active{color:var(--fg);border-bottom-color:var(--acc)}
.filters{display:flex;gap:6px;padding:6px 8px;border-bottom:1px solid var(--line);align-items:center;flex-wrap:wrap}
.filters input[type=text],.filters input:not([type]),.filters select{background:var(--bg3);color:var(--fg);border:1px solid var(--line);border-radius:4px;padding:4px 6px;font-size:12px}
.filters input:not([type]){flex:1;min-width:120px}.filters label{font-size:11px;color:var(--fg2);display:flex;align-items:center;gap:3px}
.tab{flex:1 1 auto;overflow:auto;min-height:0}
#feed .pkt{padding:6px 10px;border-bottom:1px solid var(--line);cursor:pointer;display:grid;grid-template-columns:52px 1fr auto;gap:2px 8px}
#feed .pkt:hover{background:var(--bg3)}#feed .pkt.sel{background:#1f3140}
#feed .pkt.new{animation:flash 1.2s}
@keyframes flash{from{background:#2a4a35}to{background:transparent}}
.pkt .t{color:var(--fg2);font-family:var(--mono);font-size:11px}.pkt .call{font-weight:600}.pkt .sum{grid-column:2/4;color:var(--fg2);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pkt .raw{grid-column:1/4;font-family:var(--mono);font-size:11px;color:#7f8f9d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{display:inline-block;padding:0 6px;border-radius:9px;font-size:10px;line-height:16px;background:var(--bg3);border:1px solid var(--line);color:var(--fg2);margin-left:4px;vertical-align:middle}
.badge.f-position,.badge.f-mic-e{border-color:var(--g-lat);color:var(--g-lat)}.badge.f-message,.badge.f-bulletin{border-color:var(--g-msg);color:var(--g-msg)}
.badge.f-object,.badge.f-item{border-color:var(--g-obj);color:var(--g-obj)}.badge.f-wx{border-color:var(--g-wx);color:var(--g-wx)}
.badge.f-telemetry,.badge.f-telemetry-message{border-color:var(--g-tele);color:var(--g-tele)}.badge.f-status{border-color:var(--g-time);color:var(--g-time)}
.badge.direct{border-color:var(--ok);color:var(--ok)}.badge.inj{border-color:var(--warn);color:var(--warn)}
.sym{width:24px;height:24px;background-repeat:no-repeat;display:inline-block;vertical-align:middle;position:relative}
.sym.ov{position:absolute;left:0;top:0}.sym.s16{width:16px;height:16px;background-size:256px 96px}
.sym-wrap{background:none;border:0}.sym-wrap .lbl{position:absolute;left:26px;top:4px;font:600 11px/1 var(--mono);color:#fff;text-shadow:0 0 3px #000,0 0 3px #000,0 0 2px #000;white-space:nowrap;pointer-events:none}
.home-icon{font-size:20px;text-shadow:0 0 4px #000}
table.grid{width:100%;border-collapse:collapse;font-size:12px}table.grid th,table.grid td{padding:4px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.grid th{color:var(--fg2);font-weight:500;position:sticky;top:0;background:var(--bg2);cursor:pointer}table.grid tr:hover td{background:var(--bg3)}table.grid td.num{text-align:right;font-family:var(--mono)}
.pane{padding:10px}.pane h3{margin:12px 0 6px;font-size:12px;color:var(--fg2);text-transform:uppercase;letter-spacing:.5px}.pane h3:first-child{margin-top:0}
.kv{display:grid;grid-template-columns:130px 1fr;gap:3px 10px;font-size:12px}.kv div:nth-child(odd){color:var(--fg2)}.kv .mono{font-family:var(--mono)}
.btn{background:var(--bg3);color:var(--fg);border:1px solid var(--line);border-radius:4px;padding:5px 10px;cursor:pointer;font-size:12px}.btn:hover{border-color:var(--acc)}.btn.sm{padding:2px 8px;font-size:11px}
textarea{width:100%;background:var(--bg3);color:var(--fg);border:1px solid var(--line);border-radius:4px;font-family:var(--mono);font-size:12px;padding:6px}
select.wide{width:100%;background:var(--bg3);color:var(--fg);border:1px solid var(--line);border-radius:4px;padding:5px;font-size:12px}
pre.log{background:#0a0e12;border:1px solid var(--line);border-radius:4px;padding:6px;font-size:11px;max-height:220px;overflow:auto;white-space:pre-wrap;color:#9fb0c0}
.tip{background:#1b2a33;border-left:3px solid var(--acc);padding:6px 8px;margin:6px 0;font-size:12px;color:#cfe3ef}
#detail{position:absolute;left:0;right:460px;bottom:0;height:52%;background:var(--bg2);border-top:1px solid var(--acc);display:flex;flex-direction:column;z-index:1000;box-shadow:0 -6px 20px rgba(0,0,0,.5)}
#detail-head{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px solid var(--line);font-weight:600}.grow{flex:1}
#detail-body{overflow:auto;padding:10px;font-size:12px}
.rawline{font-family:var(--mono);font-size:14px;line-height:1.9;word-break:break-all;background:#0a0e12;padding:8px 10px;border-radius:6px;border:1px solid var(--line);margin:6px 0}
.rawline span{padding:2px 0;border-bottom:3px solid;cursor:pointer;color:var(--fg)}.rawline span.hl,.rawline span:hover{background:#2a3a48}
.rawline .g-src{border-color:var(--g-src)}.rawline .g-dst{border-color:var(--g-dst)}.rawline .g-path{border-color:var(--g-path)}.rawline .g-dti{border-color:var(--g-dti);background:#3a1f22}
.rawline .g-time{border-color:var(--g-time)}.rawline .g-lat{border-color:var(--g-lat)}.rawline .g-lon{border-color:var(--g-lon)}.rawline .g-sym{border-color:var(--g-sym)}.rawline .g-ext{border-color:var(--g-ext)}
.rawline .g-alt{border-color:var(--g-alt)}.rawline .g-comment{border-color:var(--g-comment)}.rawline .g-msg{border-color:var(--g-msg)}.rawline .g-obj{border-color:var(--g-obj)}.rawline .g-tele{border-color:var(--g-tele)}
.rawline .g-wx{border-color:var(--g-wx)}.rawline .g-mice{border-color:var(--g-mice)}.rawline .g-other{border-color:var(--g-other)}
.legend{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11px;color:var(--fg2);margin:4px 0 8px}.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:middle}
table.anat{width:100%;border-collapse:collapse;font-size:12px}table.anat th,table.anat td{padding:4px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}table.anat th{color:var(--fg2);font-weight:500}
table.anat tr.hl td{background:#2a3a48}table.anat td.bytes{font-family:var(--mono);white-space:pre;color:#fff}table.anat td.pos{font-family:var(--mono);color:var(--fg2);white-space:nowrap}
table.anat td.val{font-family:var(--mono)}table.anat .ref a{font-size:11px}
.dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:middle}
.hex{font-family:var(--mono);font-size:12px;word-break:break-all}.hex span{padding:1px 2px;border-radius:2px;margin-right:2px;display:inline-block}
details{margin:8px 0}summary{cursor:pointer;color:var(--fg2)}
.bars{display:flex;align-items:flex-end;gap:2px;height:90px;border-bottom:1px solid var(--line);padding:0 2px}.bars div{flex:1;background:var(--acc);min-height:1px;position:relative}.bars div:hover{background:var(--ok)}
.bars div span{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);font-size:10px;color:var(--fg2);display:none}.bars div:hover span{display:block}
.hbar{display:grid;grid-template-columns:150px 1fr 40px;gap:6px;align-items:center;font-size:12px;margin:2px 0}.hbar .b{height:10px;background:var(--acc);border-radius:2px}.hbar .n{text-align:right;font-family:var(--mono);color:var(--fg2)}
.leaflet-popup-content-wrapper{background:var(--bg2);color:var(--fg);border:1px solid var(--line)}.leaflet-popup-tip{background:var(--bg2)}.leaflet-popup-content{font-size:12px;margin:10px 12px}.leaflet-popup-content .kv{grid-template-columns:90px 1fr}
.leaflet-container{font-family:inherit}.leaflet-control-layers,.leaflet-bar a{background:var(--bg2);color:var(--fg);border-color:var(--line)}.leaflet-bar a:hover{background:var(--bg3)}
.ctl{background:var(--bg2);border:1px solid var(--line);border-radius:4px;padding:4px 8px;font-size:12px;color:var(--fg);cursor:pointer;margin-bottom:4px;display:block}
.empty{padding:20px;color:var(--fg2);text-align:center}
@media (max-width:900px){#side{flex-basis:100%}#map{display:none}#detail{right:0}}

/* ---- modem / scope additions ---- */
#mapwrap{flex:1 1 auto;display:flex;flex-direction:column;min-width:0;position:relative}
#scope-strip{flex:0 0 auto;background:#07090c;border-bottom:1px solid var(--line)}
#scope-canvas{display:block;width:100%;height:110px}
#scope-legend{display:flex;gap:12px;font-size:11px;color:var(--fg2);padding:2px 8px}#scope-legend i{display:inline-block;width:10px;height:3px;margin-right:4px;vertical-align:middle}
.btnchip{cursor:pointer;font:inherit}.btnchip.on{border-color:var(--acc);color:var(--acc)}
.badge.dec-dw{border-color:#ffb86b;color:#ffb86b}.badge.dec-py{border-color:#7bdff2;color:#7bdff2}
.modem{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.modem .ctl-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:6px 0}.modem input[type=range]{flex:1;min-width:120px}
.modem canvas{display:block;width:100%;background:#07090c;border:1px solid var(--line);border-radius:4px;margin:4px 0}
.modem .lane-title{font-size:11px;color:var(--fg2);margin-top:6px}
table.bits{border-collapse:collapse;font-size:11px;font-family:var(--mono)}table.bits td,table.bits th{padding:2px 6px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}table.bits th{color:var(--fg2);font-weight:500;position:sticky;top:0;background:var(--bg2)}
table.bits .b1{color:#3fd67a}table.bits .b0{color:#9fb0c0}table.bits .stuff{color:#ffb86b;text-decoration:line-through}table.bits tr.hl td{background:#2a3a48}
.role-dst{color:var(--g-dst)}.role-src{color:var(--g-src)}.role-digi{color:var(--g-path)}.role-ctl{color:var(--g-dti)}.role-pid{color:var(--g-time)}.role-info{color:#fff}.role-fcs{color:var(--g-alt)}
.steps{counter-reset:s;padding-left:0;list-style:none}.steps li{counter-increment:s;margin:6px 0;padding-left:28px;position:relative}.steps li:before{content:counter(s);position:absolute;left:0;top:0;width:20px;height:20px;border-radius:10px;background:var(--bg3);border:1px solid var(--acc);color:var(--acc);font-size:11px;text-align:center;line-height:20px}