:root{color:#000;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#fff;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline-offset:5px;outline:2px solid #000}.app{flex-direction:column;width:min(100%,612px);min-height:100dvh;margin:0 auto;padding:12px 24px;display:flex}.topbar{justify-content:space-between;align-items:center;gap:16px;min-height:48px;display:flex}.topbar h1{margin:0;font-size:24px;font-weight:500}.icon-button{color:inherit;background:#fff;border:0;flex-shrink:0;place-items:center;width:48px;height:48px;padding:9px;display:inline-grid}.icon-button svg{width:30px;height:30px}.main-footer{justify-content:flex-end;margin-top:auto;padding-top:12px;display:flex}.connection.off svg{transform:rotate(180deg)}.connection.connected svg>circle{fill:#000}.connection.connected svg>path{stroke:#fff}.connection.pending svg{animation:1.2s steps(2,jump-none) infinite blink}.main-content{flex-direction:column;flex:1;align-items:center;gap:24px;padding:28px 0 12px;display:flex}.frequency{width:100%;min-width:0}.channel-row{align-items:center;gap:12px;display:flex}.field-history{width:100%;min-width:0;max-width:520px;position:relative}.field-outline{border:1px solid #000;border-radius:4px;align-items:center;display:flex}.field-outline input{letter-spacing:1px;background:#fff;border:0;border-radius:4px;width:100%;min-width:0;height:56px;padding:14px 16px;font-size:24px}input::placeholder{color:#000;opacity:.38}.history-toggle svg{width:22px;height:22px}.participants{text-align:center;flex:0 0 32px;font-size:24px}.history{z-index:2;background:#fff;border:1px solid #000;border-radius:4px;width:100%;position:absolute;top:calc(100% + 4px);overflow:hidden}.history button{text-align:left;overflow-wrap:anywhere;background:#fff;border:0;width:100%;min-height:56px;padding:12px 16px;font-size:18px;display:block}.history button:focus-visible{outline-offset:-4px}.button{background:#fff;border:1px solid #000;border-radius:4px;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:10px 16px;display:inline-flex}.button svg{flex-shrink:0;width:24px;height:24px}.button:disabled{opacity:.38}.talk-area{flex:1;place-items:center;width:100%;min-width:0;min-height:min(380px,90vw);display:grid}.ptt{aspect-ratio:1;color:#000;touch-action:none;-webkit-user-select:none;user-select:none;background:#fff;border:0;border-radius:50%;width:min(100%,380px);padding:0;display:block}.halo{width:100%;height:100%;display:block;position:relative}.halo-art{width:100%;height:100%;display:block}.halo-icon{width:76px;height:76px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.halo-icon svg{width:100%;height:100%;display:block}.halo-icon.inverse{color:#fff}.halo-ring{transform-origin:50%;transform-box:view-box}.halo-ring.rotating{animation:6s linear infinite rotate}.settings-content{margin-top:24px}.settings-row{border-bottom:1px solid #000;min-width:0;padding:24px 0}.settings-row label,.settings-row h2{margin:0 0 16px;font-size:16px;font-weight:600;display:block}.settings-row h3{margin:24px 0 0;font-size:14px;font-weight:600}.settings-row h2+label{font-size:14px}.settings-row p{margin:12px 0 0;line-height:1.5}.settings-row .hint{font-size:14px}.settings-row .button{max-width:100%}.setting-action{align-items:center;gap:16px;display:flex}.setting-action input,select{background:#fff;border:1px solid #000;border-radius:4px;width:100%;min-width:0;min-height:48px;padding:12px}.build-version{overflow-wrap:anywhere}.settings-footer{margin-top:auto;padding-top:32px;font-size:12px;line-height:1.5}.settings-footer p{margin:4px 0}.error{overflow-wrap:anywhere;border:1px solid #000;border-radius:4px;padding:12px 16px;font-size:14px;line-height:1.5}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes blink{to{opacity:0}}@media (width<=400px){.app{padding:12px 16px}.setting-action{flex-wrap:wrap}.field-outline input{padding-left:12px;font-size:20px}}@media (prefers-reduced-motion:reduce){.halo-ring.rotating,.connection.pending svg{animation:none}}