:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#eef3f1;--bg-2:#e3ede8;--surface:#fff;--ink:#0c1512;--ink-soft:#4f615a;--muted:#8a938f;--teal:#0f6e56;--teal-press:#0b5642;--teal-tint:#dcece6;--teal-live:#18936f;--coral:#f08a6e;--coral-ink:#b5532f;--coral-tint:#fdeee8;--line:#e7ebe9;--radius:18px;--shadow:0 12px 34px -14px #0c211b3d, 0 2px 6px -2px #0c211b14;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang HK,Microsoft JhengHei,Noto Sans CJK HK,Hiragino Sans,system-ui,sans-serif}*{box-sizing:border-box}html,body{height:100%}body{margin:0}#root{min-height:100dvh}.field{background:radial-gradient(1100px 560px at 50% -8%, var(--bg) 0%, var(--bg-2) 72%);justify-content:center;align-items:center;min-height:100dvh;padding:20px;display:flex}.card{background:var(--surface);border-radius:var(--radius);width:100%;max-width:420px;box-shadow:var(--shadow);padding:28px 24px 24px;position:relative;overflow:hidden}.card:before{content:"";background:var(--teal);height:5px;position:absolute;top:0;left:0;right:0}.card.accent-live:before{background:linear-gradient(90deg, var(--teal), var(--teal-live))}.card.accent-coral:before{background:var(--coral)}.brand{align-items:center;gap:10px;margin-bottom:22px;display:flex}.brand-mark{background:var(--teal);color:#fff;border-radius:9px;flex:none;place-items:center;width:28px;height:28px;font-size:16px;font-weight:800;display:grid}.brand-name{color:var(--ink);font-size:13px;font-weight:600;line-height:1.2}.brand-trust{color:var(--muted);margin-top:2px;font-size:12px}.title{color:var(--ink);margin:0 0 4px;font-size:clamp(22px,6vw,27px);font-weight:700;line-height:1.2}.subtitle{color:var(--ink-soft);margin:0;font-size:15px}.lead{color:var(--ink-soft);margin:8px 0 0;font-size:16px;line-height:1.45}.hint{color:var(--muted);margin:6px 0 0;font-size:13px;line-height:1.45}.center{text-align:center}.warn{color:var(--coral-ink);background:var(--coral-tint);border-radius:10px;margin:12px 0 0;padding:10px 12px;font-size:13px;line-height:1.4}.spin-wrap{justify-content:center;margin:14px 0 8px;display:flex}.spinner{border:3px solid var(--teal-tint);border-top-color:var(--teal);border-radius:50%;width:28px;height:28px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.consent{border:1px solid var(--line);background:#fbfdfc;border-radius:14px;margin:18px 0;padding:4px 14px}.consent-row{align-items:flex-start;gap:12px;padding:13px 0;display:flex}.consent-row+.consent-row{border-top:1px solid var(--line)}.consent-row input{width:20px;height:20px;accent-color:var(--teal);flex:none;margin-top:1px}.consent-row span{color:var(--ink);font-size:15px;line-height:1.4}.btn{appearance:none;cursor:pointer;border:none;border-radius:12px;width:100%;padding:15px 16px;font-family:inherit;font-size:16px;font-weight:600;transition:background-color .12s,transform 60ms}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid var(--teal-tint);outline-offset:2px}.btn-primary{background:var(--teal);color:#fff}.btn-primary:hover{background:var(--teal-press)}.btn-primary:disabled{cursor:default;background:#9bb7ad}.btn-ghost{background:var(--teal-tint);color:var(--teal-press);margin-top:10px}.btn-ghost:hover{background:#cfe4dc}.btn-leave{background:var(--coral);color:#5a1e0c;margin-top:10px}.btn-leave:hover{background:#ec7a5b}.status{color:var(--teal);align-items:center;gap:8px;margin:4px 0 0;font-size:14px;font-weight:600;display:inline-flex}.dot{background:var(--teal-live);border-radius:50%;width:9px;height:9px;animation:1.8s ease-out infinite pulse}@keyframes pulse{0%{box-shadow:0 0 #18936f73}70%{box-shadow:0 0 0 8px #18936f00}to{box-shadow:0 0 #18936f00}}.room{border:1px solid var(--line);border-radius:14px;margin:16px 0;overflow:hidden}.room-head{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:12px 14px 6px;font-size:12px}.person{color:var(--ink);align-items:center;gap:10px;padding:10px 14px;font-size:15px;display:flex}.person+.person{border-top:1px solid var(--line)}.person.you{color:var(--teal-press);font-weight:600}.person-empty{color:var(--muted);padding:2px 14px 14px;font-size:13px}.avatar{background:var(--teal-tint);width:28px;height:28px;color:var(--teal-press);border-radius:50%;flex:none;place-items:center;font-size:13px;font-weight:700;display:grid}@media (prefers-reduced-motion:reduce){.spinner,.dot,.btn{transition:none;animation:none}}