:root{--bg: #0b1020;--bg-elev: #131a33;--bg-elev-2: #1c2547;--fg: #f4f6fb;--fg-dim: #a4adc7;--accent: #4f8cff;--accent-hover: #6aa0ff;--danger: #ef4444;--danger-hover: #f87171;--ok: #22c55e;--warn: #f59e0b;--border: rgba(255, 255, 255, .08);--shadow: 0 10px 30px rgba(0, 0, 0, .35);--radius: 14px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 80% -10%,#1b2552 0%,transparent 60%),radial-gradient(900px 500px at -10% 110%,#0e1840 0%,transparent 55%),var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}button{font-family:inherit;cursor:pointer}input{font-family:inherit}.home{display:flex;align-items:center;justify-content:center;height:100%;padding:24px}.home__card{width:100%;max-width:420px;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:32px 28px;box-shadow:var(--shadow)}.home__title{margin:0 0 6px;font-size:28px;letter-spacing:-.02em}.home__subtitle{margin:0 0 24px;color:var(--fg-dim);font-size:14px}.home__form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--fg-dim)}.field input{background:var(--bg-elev-2);border:1px solid var(--border);border-radius:10px;color:var(--fg);font-size:15px;padding:12px 14px;outline:none;transition:border-color .15s}.field input:focus{border-color:var(--accent)}.btn-primary{background:var(--accent);border:none;border-radius:10px;color:#fff;font-size:15px;font-weight:600;padding:12px 16px;transition:background .15s}.btn-primary:hover{background:var(--accent-hover)}.form-error{color:#fecaca;background:#ef44441f;border:1px solid rgba(239,68,68,.35);border-radius:8px;padding:8px 10px;font-size:13px}.home__footer{margin:18px 0 0;color:var(--fg-dim);font-size:13px;text-align:center}.home__footer a{color:var(--accent-hover);text-decoration:none}.home__footer a:hover{text-decoration:underline}.home__user{display:flex;align-items:center;gap:12px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--border)}.home__avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#2b3a7a,#4f8cff);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}.home__user-text{flex:1;min-width:0}.home__user-name{font-weight:600;font-size:14px}.home__user-email{color:var(--fg-dim);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.link-btn{background:transparent;border:1px solid var(--border);color:var(--fg-dim);font-size:12px;padding:6px 10px;border-radius:8px;flex-shrink:0}.link-btn:hover{color:var(--fg);background:var(--bg-elev-2)}.state-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:14px;padding:24px;text-align:center}.state-screen__detail{color:var(--fg-dim);max-width:480px;word-break:break-word}.spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,.15);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.room{display:flex;flex-direction:column;height:100dvh;width:100vw;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.room__header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#0b102099;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:5}.room__title{font-weight:600;letter-spacing:-.01em}.room__meta{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--fg-dim)}.share-btn{display:inline-flex;align-items:center;gap:6px;background:var(--bg-elev);border:1px solid var(--border);color:var(--fg);padding:6px 10px;border-radius:8px;font-size:12px;font-weight:500;transition:background .15s,border-color .15s}.share-btn:hover{background:var(--bg-elev-2);border-color:#4f8cff80}.share-btn svg{display:block}.toast{position:absolute;top:calc(100% + 6px);right:16px;background:var(--bg-elev-2);border:1px solid var(--border);color:var(--fg);padding:6px 12px;border-radius:8px;font-size:12px;box-shadow:var(--shadow);animation:toast-in .18s ease-out}@keyframes toast-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 480px){.share-btn span{display:none}}.pill{padding:3px 8px;border-radius:999px;background:#ffffff14;text-transform:capitalize;font-size:11px}.pill--connected{color:var(--ok);background:#22c55e1f}.pill--reconnecting,.pill--connecting{color:var(--warn);background:#f59e0b1f}.pill--error,.pill--disconnected{color:var(--danger);background:#ef44441f}.banner{display:flex;align-items:flex-start;gap:12px;margin:8px 8px 0;padding:12px 14px;border-radius:var(--radius);background:#f59e0b1f;border:1px solid rgba(245,158,11,.4);color:#fde7c2}.banner__text{flex:1;display:flex;flex-direction:column;gap:2px;font-size:13px;line-height:1.4}.banner__text strong{color:var(--warn);font-size:13px}.banner__actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.banner__btn{background:var(--warn);border:none;color:#1c1402;font-weight:600;border-radius:8px;padding:8px 14px;font-size:13px}.banner__btn:hover{filter:brightness(1.08)}.banner__dismiss{background:transparent;border:none;color:#fde7c2;width:28px;height:28px;font-size:20px;line-height:1;padding:0;border-radius:6px;opacity:.7}.banner__dismiss:hover{opacity:1;background:#ffffff14}@media (max-width: 480px){.banner{flex-direction:column;align-items:stretch}}.grid{flex:1;display:grid;gap:8px;padding:8px;min-height:0;grid-auto-rows:1fr;grid-template-columns:1fr}.grid--n2,.grid--n3,.grid--n4{grid-template-columns:1fr 1fr}.grid--n5,.grid--n6{grid-template-columns:1fr 1fr 1fr}@media (max-width: 640px){.grid--n2,.grid--n3,.grid--n4{grid-template-columns:1fr}.grid--n5,.grid--n6{grid-template-columns:1fr 1fr}}.tile{position:relative;background:var(--bg-elev);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);min-height:0;min-width:0}.tile--speaking{outline:2px solid var(--accent);outline-offset:-2px}.tile__video{width:100%;height:100%;object-fit:cover;background:#000}.tile__video--hidden{display:none}.tile__placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.avatar{width:88px;height:88px;border-radius:50%;background:linear-gradient(135deg,#2b3a7a,#4f8cff);color:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:600;letter-spacing:.05em}.tile__overlay{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#0000008c;font-size:12px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.tile__badge{background:#ef4444cc;color:#fff;padding:1px 6px;border-radius:6px;font-size:10px}.control-bar{display:flex;justify-content:center;gap:8px;padding:12px;background:#0b1020b8;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--border);flex-wrap:wrap}.ctrl{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:76px;padding:10px 12px;border-radius:12px;background:var(--bg-elev);border:1px solid var(--border);color:var(--fg);font-size:11px;transition:background .15s,border-color .15s,color .15s}.ctrl:hover{background:var(--bg-elev-2)}.ctrl--off{background:#ef444426;border-color:#ef444466;color:var(--danger-hover)}.ctrl--active{background:#4f8cff2e;border-color:#4f8cff80;color:var(--accent-hover)}.ctrl--leave{background:var(--danger);border-color:var(--danger);color:#fff}.ctrl--leave:hover{background:var(--danger-hover)}@media (max-width: 480px){.ctrl{min-width:60px;padding:8px 6px;font-size:10px}.ctrl span{display:none}}.chat{position:fixed;top:0;right:0;bottom:0;width:min(360px,100%);background:var(--bg-elev);border-left:1px solid var(--border);display:flex;flex-direction:column;transform:translate(100%);transition:transform .2s ease;z-index:10;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.chat--open{transform:translate(0);box-shadow:-10px 0 30px #00000080}.chat__header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border);font-weight:600}.chat__close{background:transparent;border:none;color:var(--fg-dim);font-size:22px;line-height:1;padding:0;width:28px;height:28px}.chat__messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}.chat__empty{color:var(--fg-dim);text-align:center;margin-top:30px;font-size:13px}.chat__msg{display:flex;flex-direction:column;gap:2px;max-width:85%;align-self:flex-start}.chat__msg--self{align-self:flex-end}.chat__from{font-size:11px;color:var(--fg-dim);padding-left:4px}.chat__bubble{background:var(--bg-elev-2);padding:8px 12px;border-radius:12px;font-size:14px;line-height:1.35;word-wrap:break-word}.chat__msg--self .chat__bubble{background:var(--accent);color:#fff}.chat__form{display:flex;gap:8px;padding:10px;border-top:1px solid var(--border)}.chat__input{flex:1;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:10px;color:var(--fg);font-size:14px;padding:10px 12px;outline:none}.chat__input:focus{border-color:var(--accent)}.chat__send{background:var(--accent);border:none;color:#fff;border-radius:10px;padding:0 14px;font-weight:600}.chat__send:disabled{opacity:.5;cursor:not-allowed}