:root{--bg: #0c0f16;--panel: #141926;--panel-2: #0f141f;--line: rgba(255, 255, 255, .08);--text: #e9edf5;--dim: #96a0b5;--accent: #f0b03c;--good: #4ade80;--bad: #f87171;--ring: 0 0 0 3px color-mix(in srgb, var(--good) 65%, transparent), 0 0 18px 2px color-mix(in srgb, var(--good) 45%, transparent)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%}body{background:radial-gradient(1200px 700px at 85% -10%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 60%),radial-gradient(900px 600px at -10% 110%,rgba(80,120,255,.07),transparent 60%),var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}#app,.screen{height:100%}.screen{display:flex;flex-direction:column}.screen.center{align-items:center;justify-content:center}.screen[hidden]{display:none}.dim{color:var(--dim)}.card{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:0 18px 50px #00000073;max-width:420px;width:calc(100% - 32px)}.gate-card{text-align:left}.logo-row{display:flex;align-items:center;gap:14px}.logo-row h1{margin:0;font-size:22px;letter-spacing:.2px}.logo-row p{margin:2px 0 0;font-size:13px}.logo-row.small{gap:9px;font-size:15px}.logo-row.small .logo-mark{width:26px;height:26px;border-radius:7px}.logo-row.small .logo-mark svg{width:17px}.logo-mark{width:44px;height:44px;flex:none;border-radius:12px;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 60%,#ff7847));display:grid;place-items:center;box-shadow:0 4px 18px color-mix(in srgb,var(--accent) 35%,transparent)}.logo-mark svg{width:28px;fill:#10131b}.logo-img{max-height:44px;border-radius:10px}.logo-row.small .logo-img{max-height:26px}#gate-body{margin-top:22px}#gate-body .hint{font-size:13px;margin-top:14px}.spinner{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.button{appearance:none;border:0;border-radius:12px;padding:13px 22px;width:100%;font:inherit;font-weight:650;color:#171205;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#ffdf8a));cursor:pointer;transition:transform .08s ease,filter .15s ease}.button:hover{filter:brightness(1.06)}.button:active{transform:translateY(1px)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 55%,transparent);backdrop-filter:blur(10px)}.chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.chip{border:1px solid var(--line);border-radius:999px;background:var(--panel-2);color:var(--text);padding:6px 13px;font:inherit;font-size:13px;display:inline-flex;align-items:center;gap:7px}.chip.subtle{color:var(--dim)}.chip.clickable{cursor:pointer}.chip.clickable:hover{border-color:color-mix(in srgb,var(--accent) 60%,var(--line))}.dot{width:8px;height:8px;border-radius:50%;background:var(--dim);display:inline-block}.dot.ok{background:var(--good);box-shadow:0 0 8px var(--good)}.dot.warn{background:var(--accent)}.banner{background:color-mix(in srgb,var(--bad) 16%,var(--panel));border-bottom:1px solid color-mix(in srgb,var(--bad) 40%,transparent);color:color-mix(in srgb,var(--bad) 70%,white);text-align:center;padding:9px 16px;font-size:14px}#peer-area{flex:1;overflow-y:auto;padding:26px 22px 120px}#peer-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;max-width:1080px;margin:0 auto}#empty-state{text-align:center;margin-top:12vh;font-size:15px}.tile{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--line);border-radius:16px;padding:18px 14px 14px;text-align:center;position:relative;transition:border-color .2s ease}.tile.self{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.avatar-wrap{position:relative;width:64px;height:64px;margin:0 auto 10px}.avatar,.avatar-fallback{width:64px;height:64px;border-radius:14px;display:block;image-rendering:pixelated}.avatar-fallback{display:grid;place-items:center;font-weight:750;font-size:24px;color:#10131b}.avatar-wrap:after{content:"";position:absolute;inset:-5px;border-radius:18px;pointer-events:none;transition:box-shadow .12s ease}.tile.speaking .avatar-wrap:after{box-shadow:var(--ring)}.mute-badge{position:absolute;right:-6px;bottom:-6px;width:24px;height:24px;border-radius:50%;background:var(--bad);border:2px solid var(--panel);display:grid;place-items:center}.mute-badge svg{width:13px;fill:#fff}.tile-name{font-weight:650;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-sub{font-size:12px;margin-top:2px;min-height:17px}.gain-track{height:4px;border-radius:2px;background:var(--line);margin-top:10px;overflow:hidden}.gain-fill{height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 75%,transparent),var(--accent));transition:width .18s ease}.tile.self .gain-fill{background:linear-gradient(90deg,#3ba55d99,var(--good));transition:width .06s linear}.peer-volume{width:100%;margin:10px 0 0;accent-color:var(--accent)}.dock{position:fixed;left:50%;bottom:22px;transform:translate(-50%);display:flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--panel) 88%,black);border:1px solid var(--line);border-radius:999px;padding:10px 14px;box-shadow:0 14px 40px #00000080;backdrop-filter:blur(12px)}.round{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--panel-2);cursor:pointer;display:grid;place-items:center;transition:background .15s ease,border-color .15s ease}.round svg{width:22px;fill:var(--text)}.round:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}.round.engaged{background:color-mix(in srgb,var(--bad) 22%,var(--panel-2));border-color:color-mix(in srgb,var(--bad) 55%,transparent)}.round.engaged svg{fill:var(--bad)}.round .icon-off,.round.engaged .icon-on{display:none}.round.engaged .icon-off{display:block}.round.ptt-live{border-color:var(--good);box-shadow:0 0 12px color-mix(in srgb,var(--good) 45%,transparent)}.master-wrap{display:flex;align-items:center;gap:8px;padding:0 6px}.master-icon{width:20px;fill:var(--dim)}#master-volume{width:110px;accent-color:var(--accent)}.menu{position:fixed;top:62px;right:18px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:6px;min-width:200px;box-shadow:0 16px 44px #00000080;z-index:30}.menu button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;background:none;color:var(--text);font:inherit;font-size:14px;padding:10px 12px;border-radius:9px;cursor:pointer}.menu button:hover{background:var(--panel-2)}.menu button.active{color:var(--accent);font-weight:650}.menu .lock{font-size:12px;color:var(--dim)}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(340px,92vw);background:var(--panel);border-left:1px solid var(--line);padding:24px;z-index:40;overflow-y:auto;box-shadow:-18px 0 50px #00000073}.drawer h2{margin:0 0 18px;font-size:17px}.field{display:block;margin-bottom:16px;font-size:14px}.field>span{display:block;margin-bottom:6px;color:var(--dim);font-size:13px}.field select{width:100%;background:var(--panel-2);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:9px 10px;font:inherit;font-size:13px}.field.row{display:flex;align-items:center;gap:9px}.field.row>span{margin:0;color:var(--text);font-size:14px}.field input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px}.mini{border:1px solid var(--line);background:var(--panel-2);color:var(--dim);border-radius:8px;padding:4px 9px;font:inherit;font-size:12px;cursor:pointer;margin-left:auto}.small-note{font-size:12px}#toasts{position:fixed;right:18px;bottom:92px;display:flex;flex-direction:column;gap:8px;z-index:50;pointer-events:none}.toast{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:11px;padding:10px 14px;font-size:13px;box-shadow:0 10px 30px #00000073;animation:toast-in .18s ease,toast-out .3s ease 3.4s forwards}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}}@keyframes toast-out{to{opacity:0;transform:translateY(4px)}}@media (max-width: 560px){#peer-grid{grid-template-columns:repeat(auto-fill,minmax(124px,1fr))}.dock{width:calc(100% - 24px);justify-content:center}.menu{left:18px;right:18px}}