:root{color-scheme:dark;--bg:#080c10;--text:#c1cbd1;--muted:#6f8592;--line:#23313b;--cyan:#96bed2;--green:#91b6a2;--red:#db817c;font-family:Menlo,Consolas,"Liberation Mono","PingFang SC",monospace;font-size:13px;font-weight:400}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}body:after{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,#00000012 4px);z-index:5}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;background:transparent;color:inherit;border:1px solid var(--line);cursor:pointer;padding:11px 14px;border-radius:0;min-height:44px;text-align:left}button:hover{background:#14212a;border-color:#657d8b;color:#e3edf2}button:focus-visible,a:focus-visible,#log:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}button:disabled{opacity:.35;cursor:not-allowed}button.primary{border-color:#6e95a8;background:#15232b;color:#daebf3}button.danger{border-color:#80615f;color:#e2aaa5}a{color:var(--text);text-decoration:none}a:hover{color:white}p{line-height:1.8}h1,h2,strong,b{font-weight:400}h1,h2{font-size:15px;margin:0;letter-spacing:.08em}.terminal{max-width:1000px;height:100svh;margin:auto;padding:0 34px;display:flex;flex-direction:column;min-height:640px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);height:64px;flex-shrink:0;font-size:12px;letter-spacing:.08em}header span,.identity span{color:var(--muted)}.live{font-size:10px;color:var(--green);display:flex;align-items:center;gap:8px}.live i{height:5px;width:5px;background:var(--green);display:inline-block}.identity{display:flex;align-items:center;justify-content:space-between;padding:25px 0 20px;flex-shrink:0}.identity p{font-size:12px;margin:8px 0 0}.runtime{font-size:10px;line-height:1.8;color:var(--muted);text-align:right}.runtime strong{color:var(--text);font-size:12px}.meters{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;flex-shrink:0}.meters>div{font-size:10px;color:var(--muted);border-right:1px solid var(--line);padding-left:24px}.meters>div:first-child{padding-left:0}.meters>div:last-child{border:0}.meters small{font-size:10px}.meters b{display:block;color:var(--text);font-size:19px;margin-top:5px}.meters b span{font-size:12px;color:var(--muted);margin-left:5px}.meters b.critical{color:var(--red)}.log-label{display:flex;justify-content:space-between;align-items:center;min-height:42px;flex-shrink:0;font-size:10px;color:var(--muted);letter-spacing:.04em}.log-label button{font-size:10px;padding:3px 8px;min-height:30px}#log{flex:1;min-height:130px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#354651 transparent;padding:4px 10px 16px 0;line-height:1.8;overflow-wrap:anywhere}#lines>div{white-space:pre-wrap;margin-bottom:12px}.muted{color:var(--muted)}.accent{color:var(--cyan)}.good{color:var(--green)}.danger{color:var(--red)}.voice{color:#d6e2e7;padding-left:12px;border-left:1px solid #466173}.cursor{color:var(--cyan);animation:blink 1.2s step-end infinite}@keyframes blink{50%{opacity:0}}#controls{border-top:1px solid var(--line);padding:17px 0 13px;flex-shrink:0}.control-heading{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted);margin-bottom:13px}.channels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.channel{padding:10px 12px;display:flex;flex-direction:column;gap:6px;font-size:11px;min-height:73px}.channel .wave{color:#516a79;font-size:13px;letter-spacing:2px}.channel.selected{border-color:#7c9aac;background:#15222b}.channel.selected:disabled{opacity:1}.channel small{font-size:10px;color:var(--muted)}.actions{display:flex;gap:10px;margin-top:11px;flex-wrap:wrap}.actions button{flex:1;min-width:110px;text-align:center;font-size:12px}.actions button small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.hint{color:var(--muted);font-size:11px;margin:10px 0 0;line-height:1.7}.welcome{max-width:600px}.welcome p{margin:0 0 14px}.result-name{font-size:19px;color:var(--cyan);margin:5px 0 12px}.result-id{color:var(--muted);font-size:10px;letter-spacing:.08em}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:59px;flex-shrink:0;color:var(--muted);font-size:9px;padding-bottom:env(safe-area-inset-bottom)}footer nav{display:flex;flex-wrap:wrap;gap:14px}footer button{padding:0;border:0;min-height:38px;font-size:10px}dialog{background:#0c1319;color:var(--text);border:1px solid #405463;padding:24px;width:min(620px,calc(100% - 32px));max-height:85svh}dialog::backdrop{background:#000c}.dialog-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:18px}.dialog-header button{border:0;padding:6px;font-size:12px}#dialogBody{line-height:1.9;overflow-wrap:anywhere}#dialogBody ul{padding-left:20px}.archive-entry{border-bottom:1px solid var(--line);padding:14px 0}.archive-entry summary{cursor:pointer;color:var(--cyan)}.archive-entry p{font-size:12px;white-space:pre-wrap}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}[hidden]{display:none!important}.index{max-width:840px;padding:0 32px;margin:auto;min-height:100svh}.index header{height:80px}.index-main{padding:80px 0 50px}.index h1{font-size:56px;letter-spacing:-.05em}.index .kicker{font-size:11px;letter-spacing:.12em;color:var(--muted);margin-bottom:24px}.index .intro{color:var(--muted);font-size:13px;line-height:2;margin:24px 0 55px}.node-link{display:block;border-top:1px solid #4c6675;border-bottom:1px solid var(--line);padding:28px 0}.node-line{display:flex;justify-content:space-between;align-items:center}.node-link strong{font-size:20px}.node-link small{color:var(--green);font-size:11px}.node-link p{margin-bottom:0;color:var(--muted);font-size:12px}.index footer{margin-top:70px}
@media(min-width:1200px){.terminal{border-left:1px solid #172029;border-right:1px solid #172029;padding:0 40px}}@media(max-width:600px){:root{font-size:12px}.terminal{padding:0 18px;min-height:580px}header{height:45px;font-size:10px}.identity{padding:15px 0}.identity h1{font-size:13px}.identity p{font-size:10px}.meters{padding:8px 0}.meters>div{padding-left:12px;font-size:9px}.meters small{font-size:9px}.meters b{font-size:17px;margin-top:4px}.log-label{min-height:35px}#log{line-height:1.7;padding-bottom:6px}#lines>div{margin-bottom:10px}#controls{padding:12px 0 10px}.channels{gap:6px}.channel{padding:9px 8px;min-height:65px;font-size:10px}.channel .wave{font-size:10px;letter-spacing:1px}.actions{gap:6px}.actions button{padding:9px 4px;min-width:80px;font-size:11px}.control-heading{font-size:10px;margin-bottom:9px}footer{min-height:52px;align-items:flex-start;padding-top:5px;flex-direction:column;gap:0}footer nav{width:100%;justify-content:space-between;gap:5px}footer>span{font-size:8px}footer button{min-height:30px}.index-main{padding-top:60px}.index h1{font-size:44px}.index{padding:0 22px}.live span{display:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}@media(max-height:640px){.terminal{height:auto;min-height:100svh}#log{height:220px;flex:none}}

/* Terminal records retain grouping while individual lines print in sequence. */
#lines>div.continuation{margin-top:-10px}.meters>.error-meter{color:var(--red)}
@media(max-width:600px){#lines>div.continuation{margin-top:-8px}}

/* The write head is part of the current text line, including after wrapping. */
#log{scroll-behavior:auto;font-variant-ligatures:none}
#lines>div{min-height:1.8em}
#lines .printing::after,
#log[data-output="idle"] #lines>div:last-child::after{
 content:"\00a0";display:inline-block;width:.65em;height:1.05em;
 margin-left:1px;vertical-align:-.14em;background:var(--text);
 animation:dos-cursor 1s steps(1,end) infinite;
}
#lines .printing::after{animation:none}
@keyframes dos-cursor{0%,49%{opacity:1}50%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){
 #lines .printing::after,#log[data-output="idle"] #lines>div:last-child::after{animation:none}
}

.system-note{border-left:2px solid #466173;padding-left:12px;color:var(--text)}

/* Text-mode inverse labels, with separate colours for the four measurement types. */
#lines>.signal-metrics{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;padding:3px 0}
.signal-field{display:inline-flex;align-items:baseline;gap:8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.signal-key{padding:0 5px;line-height:1.45;background:var(--metric);color:#080c10;font-weight:700}
.field-rssi{--metric:#96bed2}.field-snr{--metric:#a2bfaa}.field-hops{--metric:#cfb680}.field-crc{--metric:#b4a5cf}
.signal-value{color:var(--text);min-width:3ch}.signal-value.warn{color:#e0bf77}.signal-value.pass{color:#a2bfaa}
.signal-value.bad{background:#db817c;color:#080c10;padding:0 4px;font-weight:700}
@media(max-width:600px){#lines>.signal-metrics{gap:6px 14px}.signal-field{gap:6px}}
@font-face{font-family:"Y29 Plex Mono";src:url("../assets/fonts/IBMPlexMono-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Y29 Fusion Pixel";src:url("../assets/fonts/FusionPixel12px-Mono-SC.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
/* Restrained DOS pass: text-mode contrast, denser geometry, no novelty CRT effects. */
:root{
 --bg:#06090c;--text:#bed0da;--muted:#728b99;--line:#3f5360;
 --cyan:#9fc4d6;--green:#8eb9c2;--amber:#91afbf;--red:#c98680;
 font-family:"Y29 Plex Mono","Y29 Fusion Pixel","Courier New","SimSun","宋体",Consolas,monospace;
}
body{
 background:radial-gradient(ellipse at 48% 42%,#0b1116 0,#06090c 68%);
 text-shadow:0 0 2px #9fc4d62b;
}
body:after{
 background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,#0007 4px),linear-gradient(90deg,#6b92a612,#0000 24%,#8bb6cb0d 72%,#0002);
 opacity:.5;
}
button{
 background:#080d11;border-color:#607480;
 box-shadow:inset 1px 1px #263640,inset -1px -1px #020405;
}
button:hover{background:var(--text);border-color:var(--text);color:#070b0e;text-shadow:none}
button:focus-visible,a:focus-visible,#log:focus-visible{outline:1px dashed var(--amber);outline-offset:3px}
button.primary{border-color:#829eac;background:#111b21;color:#e0ebf0}
button.danger{border-color:#7f5c52;color:#d49a89}
a:hover{background:var(--text);color:#070b0e;text-shadow:none}
p{line-height:1.65}
h1,h2{letter-spacing:.06em}
.terminal{max-width:920px;padding:0 28px}
header{height:58px;border-bottom:3px double var(--line);letter-spacing:.06em}
.live i{width:7px;height:7px;border:1px solid var(--green);background:transparent}
.identity{padding:19px 0 15px}
.meters{border:1px solid var(--line);padding:0}
.meters>div,.meters>div:first-child{padding:8px 12px}
.meters b{font-size:17px;margin-top:4px}
.log-label{
 min-height:36px;margin-top:10px;padding:0 8px;
 background:var(--muted);color:var(--bg);text-shadow:none;
}
#log{
 padding:10px 10px 14px 8px;line-height:1.65;
 border-left:1px solid #24333c;border-right:1px solid #24333c;
 scrollbar-color:#506875 transparent;
}
.accent{color:var(--cyan)}
#controls{border-top:3px double var(--line);padding:13px 0 11px}
.channel.selected{border-color:var(--text);background:var(--text);color:var(--bg);text-shadow:none}
footer{min-height:51px}
dialog{background:#080d11;border:3px double #657b88;padding:20px}
.signal-key{color:#070b0e}
footer button{
 padding-left:10px;padding-right:10px;
 background:transparent;border:0;box-shadow:none;
}
footer button:hover{background:transparent;color:#dceaf0;text-shadow:0 0 3px #9fc4d64d}
footer nav{align-items:center}
footer button{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.keycap{display:inline-block;padding:1px 4px;background:var(--muted);color:var(--bg);line-height:1.25;text-shadow:none}
.cmd-label{letter-spacing:.04em;color:var(--muted)}
footer button:hover .keycap{background:var(--text)}
footer button:hover .cmd-label{color:var(--text)}
@media(min-width:1200px){.terminal{border-left-color:#223039;border-right-color:#223039;padding:0 32px}}
@media(max-width:600px){
 .terminal{padding:0 14px}
 header{height:43px}
 .identity{padding:13px 0}
 .meters>div,.meters>div:first-child{padding:7px 6px}
 .log-label{margin-top:7px;min-height:31px}
 #log{padding:8px 7px 8px}
 #controls{padding:10px 0 8px}
 footer nav{gap:8px}
 footer button{padding-left:9px;padding-right:9px}
}

/* Data tones stay cool; only destructive/error feedback is allowed to turn red. */
.field-rssi{--metric:#91b8cb}.field-snr{--metric:#88aebd}.field-hops{--metric:#789cae}.field-crc{--metric:#9aabc3}
.signal-value.warn{color:#91afbf}.signal-value.pass{color:#91bbc5}

/* Dialogs use the same function-key language as the terminal command bar. */
dialog{padding:0}
.dialog-header{margin:0;padding:16px 18px;border-bottom:3px double var(--line);gap:18px}
.dialog-header h2{font-size:14px;letter-spacing:.08em}
.dialog-header #closeDialog{
 display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0;
 background:transparent;border:0;box-shadow:none;white-space:nowrap;
}
.dialog-header #closeDialog:hover{background:transparent;color:var(--text);text-shadow:none}
.dialog-header #closeDialog:hover .keycap{background:var(--text)}
.dialog-header #closeDialog:hover .cmd-label{color:var(--text)}
.dialog-header #closeDialog:focus-visible{outline:0}
.dialog-header #closeDialog:focus-visible .keycap{background:var(--text)}
.dialog-header #closeDialog:focus-visible .cmd-label{color:var(--text)}
#dialogBody{padding:18px 20px 20px;max-height:calc(85svh - 62px);overflow:auto}
.dialog-actions{gap:8px;margin-top:18px}
.dialog-actions button{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 12px;min-height:54px}
.dialog-actions button small{margin:0;color:var(--muted);font-size:10px}
.dialog-command{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.dialog-actions button:hover small,.dialog-actions button:hover .cmd-label{color:#070b0e}
.dialog-actions button:hover .keycap{background:#070b0e;color:var(--text)}
@media(max-width:600px){
 .dialog-header{padding:12px 13px}
 #dialogBody{padding:14px 14px 16px}
 .dialog-actions{display:grid;grid-template-columns:1fr}
 .dialog-actions button{justify-content:space-between}
}
