.radio-heading{display:grid;grid-template-columns:86px 1fr 86px;align-items:center;min-height:54px;margin-bottom:18px}.radio-heading h1{grid-column:2;margin:0;font-size:32px;letter-spacing:-.05em}.radio-page .radio-back{position:static;display:inline-flex;align-items:center;justify-content:center;gap:2px;width:76px;min-height:42px;border:1px solid #cfdbc7;border-radius:14px;background:linear-gradient(#fff,#e9f0e2);box-shadow:0 3px 0 #d2ddc9;color:#36533c;text-decoration:none;font-weight:650}.radio-back svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.radio-back:active{transform:translateY(2px);box-shadow:0 1px 0 #d2ddc9}.radio-entry{box-sizing:border-box;width:100%;max-width:448px;padding:25px 28px 20px;border:1px solid #ffffffcf;background:linear-gradient(145deg,#fff,#f8fbf5);box-shadow:0 6px 0 #d9e4d0,0 20px 45px #2b4c3020}.radio-entry-icon{display:block;margin:0 auto;width:76px;height:98px;filter:drop-shadow(0 9px 6px #29442b25);animation:radio-hello 2.6s ease-in-out infinite}.radio-entry h2{font-size:20px;margin:14px 0 22px;font-weight:650;letter-spacing:-.04em}.radio-entry .radio-entry-form{display:grid;gap:10px;margin:0}.radio-entry-form label{font-weight:650;color:#4c6449;margin-top:0}.radio-entry-form input{margin:0;min-height:52px;border:1px solid #becfb3;border-radius:13px;background:#fff;color:#284432;transition:border-color .2s,box-shadow .2s}.radio-entry-form input:focus{outline:0;border-color:#527c45;box-shadow:0 0 0 4px #a3c78430}.radio-entry-form #radio-code{text-align:center;letter-spacing:.2em;font-variant-numeric:tabular-nums;font-size:24px}.radio-entry-form #radio-code::placeholder{font-size:17px;letter-spacing:.03em;color:#8a9b81}.radio-entry-form button{min-height:53px;margin-top:3px;display:flex;justify-content:center;align-items:center;gap:9px;transition:transform .1s,box-shadow .1s,filter .2s}.radio-entry-form button:hover{filter:brightness(1.06)}.radio-entry-form button:active{transform:translateY(3px);box-shadow:0 1px 0 #203a26}.radio-entry-form .radio-join-button{background:linear-gradient(#eff5e6,#dce9ce);border-color:#b6cba6;box-shadow:0 4px 0 #b9cda9;color:#31573b}.radio-join-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.radio-entry-divider{display:flex;align-items:center;gap:12px;color:#7a8e71;font-size:12px;padding:17px 0 7px}.radio-entry-divider:before,.radio-entry-divider:after{content:'';height:1px;background:#dde7d6;flex:1}.radio-entry>p{margin-bottom:0;font-size:12px}.radio-nav-link{display:inline-flex;align-items:center;gap:4px}.radio-nav-link img{object-fit:contain;vertical-align:middle}.walkie[data-state=talking] #radio-led{background:#ff6a4c;animation:radio-led .6s ease-in-out infinite alternate;box-shadow:0 0 13px #ff744c}.walkie[data-state=waiting] #radio-led,.walkie[data-state=reconnecting] #radio-led{background:#ffcd63;animation:radio-led .8s ease-in-out infinite alternate;box-shadow:0 0 12px #ffcd63}.walkie[data-state=listening] #radio-led{background:#b5f76f;animation:radio-led .45s ease-in-out infinite alternate}.walkie[data-state=waiting] .radio-lcd strong{font-size:18px;line-height:1.45;margin-top:8px}.walkie[data-state=talking] .radio-lcd{box-shadow:inset 3px 3px 9px #4b663877,0 0 17px #b9ee7c50}.walkie[data-state=talking] .radio-ptt:before{content:'';position:absolute;inset:5px;border:1px solid #c8ed9c66;border-radius:28px;animation:radio-transmit 1s ease-out infinite}.radio-ptt{position:relative;overflow:hidden}.walkie[data-state=waiting] .radio-wave i{animation:radio-wave .9s ease-in-out infinite alternate}.walkie[data-state=sending] .radio-wave i{animation:radio-wave .35s ease-in-out infinite alternate}.walkie[data-state=reconnecting] .radio-lcd{background:radial-gradient(ellipse at 40% 20%,#f3e8c6,#c3b17f)}@keyframes radio-hello{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-4px) rotate(2deg)}}@keyframes radio-led{from{opacity:.5}to{opacity:1}}@keyframes radio-transmit{from{opacity:.8;transform:scale(.96)}to{opacity:0;transform:scale(1.04)}}
@media(max-width:650px){.radio-page .radio-heading{min-height:46px;margin-bottom:13px;grid-template-columns:72px 1fr 72px}.radio-heading h1{font-size:25px;margin:0}.radio-page .radio-back{width:64px;min-height:37px;border-radius:12px;font-size:12px}.radio-entry{padding:20px 22px 19px;max-width:420px}.radio-entry h2{font-size:19px;margin:12px 0 21px}.radio-entry-icon{width:65px;height:83px}.radio-entry-divider{padding-top:14px}.radio-page:has(.radio-entry) .radio-disclosure{display:none}}
@media(max-height:550px) and (orientation:landscape){.radio-page .radio-heading{position:relative;margin:0;min-height:30px;grid-template-columns:70px 1fr 70px}.radio-heading h1{font-size:20px}.radio-page .radio-back{min-height:27px;width:60px;font-size:11px}.radio-page:has(.walkie) .radio-heading{min-height:24px}.radio-entry{display:block;max-width:660px;padding:14px 20px}.radio-entry>.radio-entry-icon,.radio-entry>h2,.radio-entry>p{display:none}.radio-entry .radio-entry-form{grid-template-columns:1fr 1fr;column-gap:22px;row-gap:7px}.radio-entry-form label[for=radio-name]{grid-column:1;grid-row:1}.radio-entry-form #radio-name{grid-column:1;grid-row:2}.radio-entry-form button[value=create]{grid-column:1;grid-row:3}.radio-entry-form label[for=radio-code]{grid-column:2;grid-row:1}.radio-entry-form #radio-code{grid-column:2;grid-row:2}.radio-entry-form button[value=join]{grid-column:2;grid-row:3}.radio-entry-divider{display:none}.radio-entry-form input,.radio-entry-form button{min-height:44px;padding:9px}.walkie[data-state=waiting] .radio-lcd strong{font-size:15px;margin:6px 0 2px}}
.radio-entry-form label{margin:0}.radio-ptt svg{transition:transform .1s}.walkie[data-state=talking] .radio-ptt svg{transform:scale(calc(1 + var(--voice-level,0)*.18))}.walkie[data-state=talking] .radio-wave i{height:calc(4px + var(--voice-level,0)*18px);animation:none;transition:height .08s}.walkie[data-state=talking] .radio-wave i:nth-child(2n){height:calc(4px + var(--voice-level,0)*11px)}
@media(prefers-reduced-motion:reduce){.radio-entry-icon,.walkie #radio-led,.radio-ptt:before{animation:none!important}.radio-entry-form button,.radio-entry-form input,.radio-ptt svg,.radio-wave i{transition:none!important}.walkie[data-state=talking] .radio-ptt svg{transform:none}}