:root{color-scheme:light;font-family:Arial,Helvetica,sans-serif;color:#242d29;background:#303d34;--shell:#ded6b9;--edge:#8a8c72;--panel:#cbc3a8;--ink:#242d29;--orange:#bd4c29}
*{box-sizing:border-box}body{margin:0;padding:20px 12px max(24px,env(safe-area-inset-bottom));min-height:100dvh;display:flex;justify-content:center;align-items:flex-start;font-size:14px;line-height:1.4}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #254ae3;outline-offset:4px}button:disabled{cursor:default}button,textarea{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}
.radio{position:relative;width:380px;max-width:100%;padding:24px;background:var(--shell);border:3px solid var(--edge);border-radius:26px;box-shadow:0 9px 0 #9a9c80,0 18px 24px #00000030}
.screw{position:absolute;top:8px;width:7px;height:7px;border-radius:50%;background:var(--edge)}.screw:after{content:'';position:absolute;top:3px;left:1px;right:1px;height:1px;background:var(--shell);transform:rotate(-30deg)}.screw.left{left:9px}.screw.right{right:9px}
.top{display:flex;justify-content:space-between;gap:8px;align-items:center;margin:2px 0 20px}h1{font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;font-size:30px;letter-spacing:1.8px;line-height:1;margin:0}.subbrand{font-family:'Courier New',monospace;font-size:11px;letter-spacing:1.5px;margin-top:7px}.link-button{min-height:44px;display:flex;gap:7px;align-items:center;border:0;background:transparent;padding:4px;font-size:13px}.led{width:8px;height:8px;border-radius:50%;background:#858977;box-shadow:0 0 0 3px #85897722;flex:none}.led.online{background:#347140;box-shadow:0 0 0 3px #34714022}
.grill{height:25px;display:grid;grid-template-columns:repeat(9,1fr);gap:7px;margin-bottom:20px}.grill span{border-radius:3px;background:#969a82;box-shadow:inset 0 2px 2px #00000030}
.lcd{background:#cad99d;color:#29391f;border:6px solid #525947;border-radius:9px;box-shadow:inset 0 4px 8px #24301830,0 1px 0 #ffffff60;padding:15px 14px;font-family:'Courier New',monospace}.lcd-top{display:flex;justify-content:space-between;gap:8px;font-size:11px;letter-spacing:1px}.channel{display:flex;justify-content:space-between;align-items:center;margin:12px 0 14px;gap:12px}.channel h2{font-size:22px;letter-spacing:1px;font-weight:700;line-height:1.2;margin:0;overflow-wrap:anywhere;min-width:0}.channel-number{font-size:52px;font-weight:700;line-height:1;letter-spacing:-3px}.state{border-top:1px solid #29391f50;padding-top:12px;display:flex;justify-content:space-between;gap:6px;align-items:center;font-weight:700;font-size:15px}.state-lamp{width:9px;height:9px;background:currentColor;flex:none}.lcd p{font-size:13px;min-height:36px;padding-top:5px;margin:0}
.people-button{margin:18px 0 0;display:flex;align-items:center;justify-content:space-between;width:100%;border:1px solid var(--edge);background:var(--panel);padding:12px;border-radius:6px;min-height:57px;text-align:left;box-shadow:0 2px 0 var(--edge);gap:10px}.people-button strong{font-size:14px}.people-button #members-summary{display:block;font-size:12px;margin-top:2px;overflow-wrap:anywhere}.people-button>span:last-child{font-size:24px}
.ptt{width:100%;min-height:144px;margin-top:20px;background:var(--orange);color:#fff5e0;border:3px solid #783821;border-radius:14px;box-shadow:0 6px 0 #783821,inset 0 2px 0 #ffffff40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;user-select:none;-webkit-user-select:none;touch-action:none;-webkit-touch-callout:none}.ptt #ptt-title{font-family:Impact,'Arial Narrow',sans-serif;font-size:27px;letter-spacing:1.2px;line-height:1.15}.ptt #ptt-hint{font-size:12px;text-align:center;padding:0 5px}.grip{height:6px;width:64px;background:repeating-linear-gradient(90deg,#ffffff55 0 2px,transparent 2px 6px)}.ptt[aria-pressed="true"]{transform:translateY(4px);box-shadow:0 2px 0 #783821,inset 0 3px 10px #00000025}.ptt:disabled,.radio.busy .ptt{background:#8c8471;border-color:#635f52;box-shadow:0 6px 0 #635f52;color:#fff8e8}
.controls{display:flex;align-items:flex-end;justify-content:space-between;margin-top:24px;gap:8px}.volume{display:flex;gap:6px;align-items:center}.label{font-family:'Courier New',monospace;font-size:11px;font-weight:700;letter-spacing:1px;margin-bottom:3px}.key{min-width:44px;min-height:44px;border:1px solid var(--edge);border-radius:7px;background:var(--panel);box-shadow:0 3px 0 var(--edge);padding:6px;font-size:14px}.volume .key{font-size:20px}#volume{font-family:'Courier New',monospace;font-size:13px;min-width:38px;text-align:center}.sound-key{font-size:11px}.sound-key span{font-size:12px}.key:disabled{opacity:.5}
footer{margin-top:19px;padding-top:12px;border-top:1px solid var(--edge);display:flex;justify-content:space-between;gap:8px;font-size:11px;font-family:'Courier New',monospace;letter-spacing:.4px;flex-wrap:wrap}#self{overflow-wrap:anywhere}.notice{font-size:13px;margin-top:14px;padding:10px 0;border-top:1px solid var(--edge);overflow-wrap:anywhere}
dialog{width:360px;max-width:calc(100% - 24px);max-height:calc(100dvh - 48px);padding:20px;background:var(--shell);color:var(--ink);border:3px solid var(--edge);border-radius:15px;box-shadow:0 10px 25px #00000045}dialog::backdrop{background:#18251cbb}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.dialog-top h2{font-size:21px;margin:0}.dialog-top .key{font-size:24px}dialog p{margin:10px 0 15px}dialog label{display:block;font-weight:700;margin-bottom:6px}textarea{display:block;width:100%;resize:vertical;border:2px solid var(--edge);border-radius:6px;background:#f4f0df;padding:10px;font-size:16px;color:var(--ink)}.primary,.secondary{display:block;width:100%;min-height:46px;border:2px solid var(--edge);border-radius:7px;padding:10px;margin-top:12px;font-weight:700;background:var(--panel)}.primary{background:var(--orange);color:#fff5e0;border-color:#783821}.small{font-size:12px}.error{font-size:13px;font-weight:700;color:#802a14}.person{padding:12px 0;border-top:1px solid var(--edge);display:flex;align-items:center;gap:12px}.person strong{display:block;overflow-wrap:anywhere}.person small{font-size:12px}.person-type{width:40px;height:40px;background:var(--panel);border-radius:6px;display:grid;place-items:center;font-family:'Courier New',monospace;font-size:11px;flex:none}.person-status{margin-left:auto;font-size:12px}
body{padding-top:max(20px,env(safe-area-inset-top))}
@media(max-width:380px){body{padding: max(12px,env(safe-area-inset-top)) 7px max(24px,env(safe-area-inset-bottom))}.radio{padding:17px}h1{font-size:27px}.controls{gap:5px}.volume{gap:3px}.key{padding:5px}#volume{min-width:34px}.lcd{padding:14px 11px}.lcd p{font-size:12px}.state{font-size:14px}.ptt #ptt-title{font-size:25px}}