@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700&family=Share+Tech+Mono&display=swap');

:root{--black:#050608;--body:#0a0b0e;--panel:#15171b;--metal:#25272b;--line:#393c42;--red:#e31b23;--hot:#ff343c;--green:#45ef8d;--amber:#ffb430;--screen:#07120d;--muted:#92959b;--white:#f5f5f6;--shadow:0 25px 80px rgba(0,0,0,.55)}
*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:var(--body);color:var(--white);font-family:Inter,Arial,sans-serif;min-height:100vh}.noise{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 50% -20%,rgba(227,27,35,.16),transparent 38%),linear-gradient(135deg,#111318,#050608 55%)}.noise:after{content:"";position:absolute;inset:0;opacity:.1;background-image:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(255,255,255,.025) 4px)}button,input{font:inherit}.topbar{height:82px;padding:0 max(24px,calc((100vw - 1340px)/2));border-bottom:1px solid #292b30;background:rgba(5,6,8,.92);display:flex;align-items:center;justify-content:space-between;backdrop-filter:blur(15px)}.identity{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}.identity img{width:61px;height:61px;object-fit:contain}.identity span{display:flex;flex-direction:column;line-height:1}.identity strong{font:800 1.42rem "Barlow Condensed",sans-serif;letter-spacing:.08em;text-transform:uppercase}.identity small{margin-top:6px;color:#83868d;font-size:.62rem;letter-spacing:.19em;text-transform:uppercase}.network-state{display:flex;align-items:center;gap:10px;color:#85888f;text-transform:uppercase;font-size:.66rem;font-weight:700;letter-spacing:.15em}.network-state i{width:9px;height:9px;border-radius:50%;background:#5a5c62;box-shadow:0 0 0 4px rgba(90,92,98,.12)}.network-state i.online{background:var(--green);box-shadow:0 0 12px var(--green),0 0 0 4px rgba(69,239,141,.12)}
.station-shell{width:min(calc(100% - 36px),1340px);margin:auto;padding:45px 0 80px}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:35px}.intro>div:first-child{max-width:800px}.kicker{font:700 .68rem Inter,sans-serif;color:var(--red);letter-spacing:.2em;text-transform:uppercase;margin:0 0 8px}.intro h1{font:800 clamp(3.5rem,7vw,6.5rem)/.85 "Barlow Condensed",sans-serif;text-transform:uppercase;margin:0 0 18px;letter-spacing:.01em}.intro p:not(.kicker){color:#a1a4aa;line-height:1.7;margin:0;max-width:720px}.intro kbd{background:#25272c;border:1px solid #4a4d54;border-bottom-width:3px;padding:2px 8px;border-radius:4px;color:#fff}.online-count{display:flex;flex-direction:column;align-items:flex-end;border-right:3px solid var(--red);padding-right:18px}.online-count strong{font:800 4rem/.8 "Barlow Condensed",sans-serif}.online-count span{margin-top:10px;color:#85888f;font-size:.66rem;text-transform:uppercase;letter-spacing:.16em}
.radio-rig{border:1px solid #494c52;background:linear-gradient(#292c31,#181a1e);border-radius:11px;box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.18);overflow:hidden;position:relative}.radio-rig:before,.radio-rig:after{content:"";position:absolute;top:50%;width:8px;height:52%;transform:translateY(-50%);background:repeating-linear-gradient(#25272b 0 10px,#111216 10px 18px);border:1px solid #393b40}.radio-rig:before{left:0}.radio-rig:after{right:0}.rig-top,.rig-bottom{height:38px;display:flex;align-items:center;gap:28px;padding:0 28px;background:linear-gradient(#32353a,#1b1d21);border-bottom:1px solid #0a0b0d;color:#b8bac0;font:700 .58rem Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px #000}.rig-top .serial{margin-left:auto;color:#6f7279}.rig-face{display:grid;grid-template-columns:.36fr .64fr;gap:28px;padding:34px;background:linear-gradient(115deg,#1d1f23,#101115);border-block:1px solid #45484e;box-shadow:inset 0 0 50px #050607}.speaker-panel{border:1px solid #31343a;background:#0b0c0e;padding:25px;position:relative;min-height:470px;display:flex;flex-direction:column;justify-content:center;align-items:center}.speaker-holes{position:absolute;inset:18px;background:radial-gradient(circle,#030304 0 3px,#25272b 3.5px 5px,transparent 5.5px);background-size:16px 16px;mask-image:radial-gradient(ellipse,#000 45%,transparent 72%);opacity:.8}.brand-plate{position:relative;z-index:1;width:180px;height:180px;border-radius:50%;display:grid;place-items:center;background:#050506;border:1px solid #41444a;box-shadow:0 8px 25px #000}.brand-plate img{width:160px;filter:drop-shadow(0 7px 10px #000)}.meter{position:absolute;bottom:24px;left:25px;right:25px;z-index:2;display:grid;grid-template-columns:20px 1fr 32px;align-items:center;color:#676a70;font:600 .55rem Inter,sans-serif}.meter-bars{display:flex;gap:3px;align-items:end;height:22px}.meter-bars i{flex:1;height:30%;background:#25282c}.meter-bars i:nth-child(n+4){height:45%}.meter-bars i:nth-child(n+7){height:65%}.meter-bars i:nth-child(n+10){height:100%}.meter-bars i.lit{background:var(--green);box-shadow:0 0 7px rgba(69,239,141,.6)}.meter-bars i.lit:nth-child(n+10){background:var(--red);box-shadow:0 0 7px var(--red)}
.control-panel{display:grid;grid-template-columns:1fr 150px;gap:24px}.display-bezel{background:#050706;border:9px solid #292b2e;outline:1px solid #55585e;box-shadow:inset 0 0 0 2px #000,0 10px 24px #000;padding:20px 25px 16px;min-width:0}.display-topline,.display-footer{display:flex;align-items:center;justify-content:space-between;font:400 .72rem "Share Tech Mono",monospace;color:#53cf83;text-transform:uppercase;letter-spacing:.1em}.display-topline span:first-child{color:#ff3841}.frequency{display:flex;align-items:baseline;white-space:nowrap;color:#ff3039;text-shadow:0 0 9px rgba(255,48,57,.7);font:400 clamp(4.4rem,8vw,8rem)/.9 "Share Tech Mono",monospace;letter-spacing:-.08em;margin:8px 0}.frequency b{font-weight:400}.frequency small{font-size:.9rem;letter-spacing:.08em;margin-left:13px;color:#d34c52;text-shadow:none}.room-line{display:flex;align-items:center;gap:12px;border-block:1px solid #173322;padding:8px 0;font:400 .78rem "Share Tech Mono",monospace;color:#6be29b;text-transform:uppercase}.room-line span{display:inline-grid;place-items:center;width:29px;height:18px;background:#184f2e;color:#7dffaf}.transmitting .room-line span{background:#83161c;color:#ffb9bc;box-shadow:0 0 12px rgba(255,48,57,.4)}.scope{height:70px;margin:6px 0;border-bottom:1px solid #173322;background:repeating-linear-gradient(0deg,transparent 0 13px,rgba(69,239,141,.08) 14px),repeating-linear-gradient(90deg,transparent 0 28px,rgba(69,239,141,.08) 29px)}.scope canvas{width:100%;height:100%}.frequency-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.tuning-knob{width:122px;height:122px;border-radius:50%;background:repeating-conic-gradient(#4d5055 0deg 3deg,#1b1d20 4deg 7deg);border:5px solid #0b0c0d;box-shadow:0 11px 18px #000,inset 0 0 0 4px #3c3f44;display:grid;place-items:center}.tuning-knob div{width:75%;height:75%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a4d52,#17191c 60%);box-shadow:inset 0 0 14px #000}.step-button{width:48px;height:38px;border:1px solid #4b4e54;background:linear-gradient(#32353a,#17191c);color:#e8e8e9;font-size:1.3rem;cursor:pointer;box-shadow:0 4px #090a0b}.step-button:active{transform:translateY(3px);box-shadow:0 1px #090a0b}.lower-controls{grid-column:1/-1;display:grid;grid-template-columns:1fr 105px minmax(230px,310px);gap:18px;align-items:end;border-top:1px solid #34373c;padding-top:23px}.dial-control{display:flex;flex-direction:column;gap:10px;color:#898c92;font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase}.dial-control input{accent-color:var(--red)}.utility-button{height:60px;border:1px solid #45484e;background:linear-gradient(#292c30,#15171a);color:#85888f;text-transform:uppercase;font-size:.58rem;font-weight:700;letter-spacing:.1em;cursor:pointer}.utility-button i{display:block;width:8px;height:8px;border-radius:50%;background:#555;margin:0 auto 7px}.utility-button.active i{background:var(--green);box-shadow:0 0 9px var(--green)}.ptt-button{height:72px;border:1px solid #ff4a51;background:linear-gradient(#d6252c,#8f1016);color:#fff;box-shadow:0 7px #4c090c,0 11px 18px #000;cursor:pointer;text-transform:uppercase;display:grid;grid-template-columns:25px 1fr;grid-template-rows:1fr 1fr;align-items:center;text-align:left;padding:10px 18px;user-select:none;touch-action:none}.ptt-button:disabled{filter:grayscale(1);opacity:.45;cursor:not-allowed}.ptt-led{grid-row:1/-1;width:13px;height:13px;border-radius:50%;background:#4a0d10;border:1px solid #ff777b}.ptt-button strong{font:800 1.1rem "Barlow Condensed",sans-serif;letter-spacing:.09em}.ptt-button small{font-size:.58rem;color:#ffc4c6;letter-spacing:.05em}.ptt-button:not(:disabled):active,.transmitting .ptt-button{transform:translateY(5px);box-shadow:0 2px #4c090c,0 5px 12px #000;background:linear-gradient(#ff343c,#bd171e)}.transmitting .ptt-led{background:#fff;box-shadow:0 0 13px #fff}.rig-bottom{border-bottom:0;border-top:1px solid #4a4d53}.power-light{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}.warning-label{margin-left:auto;color:#a57936}
.below-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:22px;margin-top:24px}.panel{border:1px solid #33363b;background:rgba(14,15,18,.9);box-shadow:0 16px 40px rgba(0,0,0,.25)}.panel-heading{display:flex;align-items:end;justify-content:space-between;padding:24px 25px;border-bottom:1px solid #303238}.panel-heading h2{font:800 2rem/1 "Barlow Condensed",sans-serif;text-transform:uppercase;margin:0}.panel-heading>span{font-size:.6rem;color:#686b72;letter-spacing:.14em;text-transform:uppercase}.channel-list{display:grid;grid-template-columns:repeat(2,1fr);padding:10px}.channel{position:relative;display:grid;grid-template-columns:43px 110px 1fr 30px;gap:12px;align-items:center;min-height:62px;background:transparent;border:1px solid transparent;color:#fff;text-align:left;padding:8px 12px;cursor:pointer}.channel:hover{background:#181a1e}.channel.selected{background:#211416;border-color:#6e2025}.channel-band{font:700 .62rem Inter,sans-serif;text-transform:uppercase;color:#777a81}.channel strong{font:400 1.15rem "Share Tech Mono",monospace;color:#ef5b61}.channel-name{font-size:.78rem;color:#aaa}.occupancy{font-style:normal;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#24262b;color:#8f9298;font-size:.65rem}.channel.selected .occupancy{background:var(--red);color:#fff}.operator-list{padding:10px;max-height:325px;overflow:auto}.operator{display:grid;grid-template-columns:13px 1fr auto;gap:11px;align-items:center;padding:12px 13px;border-bottom:1px solid #282a2f}.operator i{width:8px;height:8px;background:#4fd78a;border-radius:50%;box-shadow:0 0 6px #4fd78a}.operator strong{font:700 1rem "Share Tech Mono",monospace}.operator span{font-size:.54rem;color:#6e7178;letter-spacing:.1em}.operator.talking{background:#2b1114}.operator.talking i{background:var(--red);box-shadow:0 0 8px var(--red)}.operator.talking span{color:#ff777c}.operator.self strong{color:#f4676c}.empty-operators{min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#55585e}.empty-operators span{font-size:3rem}.empty-operators p{font-size:.75rem}.operator-self{margin:0 20px 20px;border-left:2px solid var(--red);padding-left:12px;display:grid;grid-template-columns:10px 1fr;align-items:center}.operator-self[hidden]{display:none}.operator-self i{width:7px;height:7px;border-radius:50%;background:var(--green)}.operator-self span{font-size:.55rem;color:#777;letter-spacing:.1em;text-transform:uppercase}.operator-self strong{grid-column:2;font:600 .9rem "Share Tech Mono",monospace}.info-strip{display:grid;grid-template-columns:repeat(3,1fr);margin-top:24px;border:1px solid #2c2e33}.info-strip>div{padding:18px 22px;display:flex;flex-direction:column;border-right:1px solid #2c2e33}.info-strip>div:last-child{border:0}.info-strip strong{font:700 .65rem Inter,sans-serif;color:#d44a50;letter-spacing:.14em;text-transform:uppercase}.info-strip span{font-size:.72rem;color:#767980;margin-top:3px}
footer{height:85px;border-top:1px solid #26282d;background:#050608;display:flex;align-items:center;gap:13px;padding:0 max(24px,calc((100vw - 1340px)/2));color:#666970;font-size:.65rem;text-transform:uppercase;letter-spacing:.1em}footer img{width:45px;height:45px}footer a{margin-left:auto;color:#9a9da3;text-decoration:none}.join-overlay{position:fixed;inset:0;z-index:100;background:rgba(2,3,4,.91);backdrop-filter:blur(13px);display:grid;place-items:center;padding:20px;transition:.35s}.join-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.join-dialog{width:min(100%,510px);border:1px solid #4b4e54;background:linear-gradient(145deg,#1a1c20,#0b0c0f);padding:38px 45px;box-shadow:0 30px 100px #000;text-align:center;position:relative}.join-dialog:before{content:"";position:absolute;inset:8px;border:1px solid #282a2f;pointer-events:none}.join-dialog img{width:150px;filter:drop-shadow(0 10px 15px #000)}.join-dialog h2{font:800 3rem/.95 "Barlow Condensed",sans-serif;text-transform:uppercase;margin:8px 0 12px}.join-dialog>p:not(.kicker){color:#9b9ea4;line-height:1.6;font-size:.85rem}.join-dialog form{text-align:left;margin-top:25px}.join-dialog label{display:block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;margin-bottom:7px}.join-dialog input{width:100%;height:52px;border:1px solid #464950;background:#08090b;color:#fff;padding:0 15px;font:500 1.1rem "Share Tech Mono",monospace;text-transform:uppercase;outline:none}.join-dialog input:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(227,27,35,.12)}.join-button{width:100%;height:54px;margin-top:13px;border:1px solid #ff4a51;background:linear-gradient(#e02b32,#951219);color:#fff;text-transform:uppercase;font:800 1rem "Barlow Condensed",sans-serif;letter-spacing:.1em;cursor:pointer}.join-button:disabled{opacity:.5}.join-dialog>small{display:block;color:#64676d;font-size:.63rem;line-height:1.5;margin-top:22px}.join-error{min-height:22px;color:#ff777c;font-size:.72rem;margin-top:10px}.toast{position:fixed;right:25px;bottom:25px;z-index:200;background:#17231c;border-left:4px solid var(--green);color:#c9f8dc;padding:14px 20px;box-shadow:0 10px 35px #000;transform:translateY(30px);opacity:0;pointer-events:none;transition:.25s;font-size:.82rem}.toast.error{background:#2c1315;border-color:var(--red);color:#ffd8da}.toast.show{transform:none;opacity:1}
@media(max-width:1050px){.rig-face{grid-template-columns:1fr}.speaker-panel{display:none}.below-grid{grid-template-columns:1fr}.control-panel{grid-template-columns:1fr 130px}.frequency{font-size:clamp(4rem,11vw,7rem)}}
@media(max-width:720px){.topbar{height:70px;padding:0 15px}.identity img{width:48px;height:48px}.identity strong{font-size:1.08rem}.identity small{font-size:.5rem}.network-state span{display:none}.station-shell{width:min(calc(100% - 20px),1340px);padding-top:28px}.intro{align-items:flex-start}.intro h1{font-size:3.8rem}.online-count strong{font-size:2.8rem}.online-count span{font-size:.52rem}.rig-top{padding:0 16px}.rig-top span:nth-child(2),.rig-top .serial{display:none}.rig-face{padding:17px}.control-panel{display:block}.display-bezel{padding:15px 14px;border-width:6px}.frequency{font-size:clamp(3.7rem,17vw,6rem)}.frequency small{font-size:.62rem;margin-left:6px}.frequency-controls{flex-direction:row;margin:20px 0}.tuning-knob{width:90px;height:90px}.lower-controls{grid-template-columns:1fr 90px;margin-top:0}.ptt-button{grid-column:1/-1}.channel-list{grid-template-columns:1fr}.channel{grid-template-columns:40px 95px 1fr 28px}.info-strip{grid-template-columns:1fr}.info-strip>div{border-right:0;border-bottom:1px solid #2c2e33}.info-strip>div:last-child{border:0}.join-dialog{padding:30px 24px}.join-dialog img{width:125px}.join-dialog h2{font-size:2.5rem}footer{padding:0 15px}footer span{display:none}}
@media(max-width:460px){.intro>div:first-child p:not(.kicker){font-size:.82rem}.online-count{display:none}.frequency{font-size:15vw}.room-line strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.display-footer{font-size:.58rem}.panel-heading{padding:20px}.channel{gap:7px;padding-inline:8px}.channel-name{font-size:.68rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}.noise:after{display:none}}
.info-strip{grid-template-columns:repeat(5,1fr)}
@media(max-width:720px){.info-strip{grid-template-columns:1fr}}
.lower-controls{grid-template-columns:1fr 95px 95px minmax(230px,310px)}
@media(max-width:720px){.lower-controls{grid-template-columns:1fr 80px 80px}.lower-controls .ptt-button{grid-column:1/-1}}
