:root{color-scheme:dark;font:16px/1.5 system-ui,sans-serif;background:#0a101b;color:#edf4ff}*{box-sizing:border-box}body{margin:0}main{max-width:620px;margin:auto;padding:24px 18px 40px}header{display:flex;justify-content:space-between;gap:12px;align-items:center}.brand{font-weight:800;letter-spacing:.13em}.badge{font-size:.85rem;color:#adc2d8}.station{padding:35px 0 24px}.station p{font-size:.8rem;letter-spacing:.14em;color:#58d9ed}h1{font-size:2.6rem;margin:8px 0 14px;line-height:1.2}h1 span{display:block;font-size:1.5rem;font-weight:400;color:#adc2d8}#status{border-left:3px solid #e6b86a;padding-left:12px;color:#e6b86a}.panel{background:#121e30;border:1px solid #2b3d56;border-radius:18px;padding:22px;margin-bottom:18px}h2{font-size:1.15rem;margin:0 0 10px}p{color:#b9cadd}button,select{font:inherit;width:100%;border:1px solid #42617d;border-radius:10px;padding:13px;background:#233951;color:#fff;margin:6px 0;min-height:48px}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,select:focus-visible{outline:3px solid #58d9ed;outline-offset:3px}label{display:block;margin-top:14px}#ptt{margin-top:22px;min-height:180px;font-weight:800;font-size:1.3rem;touch-action:none;user-select:none;background:#145168;border:2px solid #58d9ed}#ptt span{display:block;font-weight:400;font-size:.85rem;margin-top:8px}#ptt.active{background:#9d3447;border-color:#ffb2bd}meter{width:100%;height:20px;margin-top:16px}audio{width:100%}.small,footer{font-size:.85rem;color:#96acc4}footer{text-align:center;padding:14px}button:disabled#ptt{background:#233951}
:root{--accent:#58d9ed}input{font:inherit;width:100%;border:1px solid #42617d;border-radius:10px;padding:13px;background:#0b1422;color:#fff;margin:6px 0;min-height:48px}input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}#radioPtt{min-height:160px;margin:20px 0;font-size:1.3rem;font-weight:800;touch-action:none;user-select:none;-webkit-user-select:none;background:#145168;border:2px solid var(--accent)}#radioPtt span{display:block;font-weight:400;font-size:.85rem;margin-top:8px}#radioPtt.active{background:#9d3447;border-color:#ffb2bd}#radioPtt:disabled{background:#233951}summary{cursor:pointer;font-weight:600;min-height:32px}pre{font:13px/1.5 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}#remoteAudio{margin-top:10px}#mediaStatus{font-size:.85rem}

.network{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}.network div{background:#0b1422;border-radius:10px;padding:12px}.network dt{font-size:.8rem;color:#adc2d8}.network dd{margin:4px 0 0;font-size:1.15rem;font-weight:600}input[type=range]{padding:0;accent-color:#58d9ed}output{font-variant-numeric:tabular-nums}

.check{display:flex;gap:10px;align-items:flex-start}.check input{width:22px;min-height:22px;margin:3px 0;flex-shrink:0}.tableScroll{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:.82rem}th,td{padding:10px 6px;border-bottom:1px solid #2b3d56;text-align:left;overflow-wrap:anywhere}#serverTx.keyed{color:#ffb2bd}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.75rem 0}.keypad button{margin:0}td button{font-size:.8rem;padding:.5rem;min-width:5rem}#liveLevel{width:100%;height:1.5rem}#nodeInfo{white-space:pre-wrap;overflow-wrap:anywhere}.tableScroll table{min-width:550px}

/* Compact views with phone bottom navigation. Hidden panels stay mounted for live audio. */
[hidden]{display:none!important}.viewTitle{font-size:1.35rem;margin:18px 0 12px}.station{padding:20px 0 14px}.station p{margin:4px 0}h1{font-size:1.8rem;margin:6px 0 10px}h1 span{font-size:1rem}.appNav{position:sticky;top:0;z-index:20;display:flex;gap:4px;padding:8px;background:#0a101bf5;border:1px solid #2b3d56;border-radius:12px}.appNav button{width:auto;flex:1;font-size:.85rem;padding:10px 4px;margin:0;min-height:44px;background:transparent;border-color:transparent}.appNav button[aria-selected=true]{background:#145168;border-color:#58d9ed;color:white}.panel>summary{margin:0}.panel[open]>summary{margin-bottom:14px}.panel textarea{font:inherit;width:100%;max-width:100%;background:#0b1422;color:#fff;border:1px solid #42617d;border-radius:10px;padding:12px;resize:vertical}.panel input[type=checkbox]{width:22px;min-height:22px;flex-shrink:0}.panel a{color:#75dfec}details:not([open]){padding:16px 20px}
@media(max-width:640px){main{padding:16px 12px calc(88px + env(safe-area-inset-bottom))}.appNav{position:fixed;top:auto;bottom:0;left:0;right:0;border-radius:0;border-left:0;border-right:0;padding:8px 6px calc(8px + env(safe-area-inset-bottom));gap:2px;box-shadow:0 -8px 25px #0006}.appNav button{font-size:.78rem;min-height:48px}.panel{padding:18px;border-radius:14px;margin-bottom:12px}.station{padding-top:16px}#radioPtt{min-height:145px;margin:14px 0}.badge{font-size:.75rem}}
.directoryCard{border:1px solid #2b3d56;background:#0b1422;border-radius:12px;padding:14px;margin:12px 0}.directoryCard h3{margin:0;font-size:1.05rem}.directoryCard p{font-size:.85rem;margin:8px 0;overflow-wrap:anywhere}.directoryState{color:#75dfec}.directoryActions,.directoryPages{display:flex;gap:8px;align-items:center}.directoryActions button{font-size:.8rem;padding:8px;min-width:0}.directoryPages span{white-space:nowrap;font-size:.8rem}.appNav button{font-size:.75rem}@media(max-width:640px){.appNav button{font-size:.67rem;padding:8px 2px;line-height:1.2}}

.directoryActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}

.talking-active{background:#104c3c!important;border-left:4px solid #55dbac}.talking-person{color:#6fe1c0}#talkingCurrent li,#talkingLast li{padding:.4rem;overflow-wrap:anywhere}#talkingCurrent:empty{display:none}
