:root{color-scheme:light dark;font-family:system-ui,sans-serif;--bg: #fafaf8;--fg: #1b1b1b;--muted: #666;--panel: #f0efeb;--accent: #2f6f5e;--border: #d8d6d0}@media(prefers-color-scheme:dark){:root{--bg: #15171a;--fg: #eceae4;--muted: #9a9a94;--panel: #1f2226;--accent: #7fc1ad;--border: #33373c}}body{margin:0;background:var(--bg);color:var(--fg)}.app{padding:16px;max-width:1100px;margin:0 auto}.muted{color:var(--muted)}.error{color:#b23b3b}button,input,select{font:inherit;padding:8px 12px;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--fg)}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.join{display:grid;gap:12px;max-width:420px}.join label{display:grid;gap:4px}.join .or{text-align:center;color:var(--muted)}.join .row{display:flex;gap:8px;align-items:end}.join .row label{flex:1}.roomctl{display:inline-flex;gap:8px;align-items:center}.roomctl code{user-select:all}.call{display:grid;grid-template-columns:1fr 320px;grid-template-rows:auto 1fr auto auto;gap:12px}.bar{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.tier{padding:4px 10px;border-radius:999px;background:var(--panel);border:1px solid var(--border)}.stage{display:grid;grid-template-columns:2fr 1fr;gap:12px;align-items:start}.video{margin:0;position:relative;background:var(--panel);border-radius:8px;overflow:hidden;aspect-ratio:16 / 9}.video video{width:100%;height:100%;object-fit:cover;display:block}.video .avatar{position:absolute;inset:0;display:grid;place-items:center;font-size:48px;color:var(--muted)}.video figcaption{position:absolute;left:8px;bottom:8px;background:#00000080;color:#fff;padding:2px 8px;border-radius:4px;font-size:13px}.notices{grid-column:1;list-style:none;margin:0;padding:0;display:grid;gap:4px}.notices li{padding:6px 10px;border-left:3px solid var(--accent);background:var(--panel);border-radius:0 6px 6px 0}.controls{grid-column:1;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.controls .leave{margin-left:auto}.side{grid-column:2;grid-row:2 / span 3;display:grid;gap:12px;align-content:start}.side h2{font-size:14px;margin:0 0 6px;color:var(--muted)}.side ul,.side ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}.chat ol{max-height:260px;overflow:auto}.chat form{display:flex;gap:6px;margin-top:6px}.chat input{flex:1}.chat .own b{color:var(--accent)}.transcript .partial{color:var(--muted)}@media(max-width:800px){.call{grid-template-columns:1fr}.side{grid-column:1;grid-row:auto}.stage{grid-template-columns:1fr}}.cloud{font-size:.85rem;padding:.1rem .5rem;border-radius:999px;border:1px solid currentColor;opacity:.85}.cloud-unavailable,.cloud-paused{opacity:.6}.talking{background:var(--accent);color:#fff}.transcript h2 .export{margin-left:8px;font-weight:400;font-size:.85em}.transcript h2 .export button{margin-right:4px}.stage.shared{grid-column:1 / -1}.screenhost{display:flex;justify-content:center}canvas.screen{max-width:100%;max-height:60vh;background:#000;border-radius:4px}
