:root{--bg: #f4f6f8;--surface: #ffffff;--surface-2: #eef2f5;--text: #0f172a;--muted: #64748b;--border: #dbe2e8;--accent: #0f766e;--accent-2: #14b8a6;--accent-ink: #ffffff;--mine: #ccfbf1;--danger: #dc2626;--warn: #b45309;--radius: 14px;color-scheme:light}@media(prefers-color-scheme:dark){:root{--bg: #0b1220;--surface: #131c2e;--surface-2: #1b2638;--text: #e6edf5;--muted: #8b9bb0;--border: #26344a;--accent: #14b8a6;--accent-2: #2dd4bf;--accent-ink: #042f2e;--mine: #123a3a;--danger: #f87171;--warn: #fbbf24;color-scheme:dark}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}a{color:inherit;text-decoration:none}input,textarea,button,select{font:inherit;color:inherit}input,textarea{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);font-size:16px}textarea{resize:vertical}input:focus,textarea:focus{outline:2px solid var(--accent-2);outline-offset:0}h1,h2{margin:0;line-height:1.2}h2{font-size:1.2rem}.page{max-width:560px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) 16px max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px}.center{align-items:center;justify-content:center;min-height:60vh}.center-text{text-align:center}.hero{text-align:center;padding:24px 0 8px;display:grid;justify-items:center;gap:8px}.hero h1{font-size:1.7rem}.muted{color:var(--muted)}.small{font-size:.85rem}.error{color:var(--danger)}.warn{color:var(--warn);margin:6px 0 0}.pre{white-space:pre-wrap;margin:4px 0 0}.grow{flex:1;min-width:0}.row{display:flex;gap:8px;align-items:center}.stack{display:flex;flex-direction:column;gap:16px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px}.section-title{font-size:.9rem;color:var(--muted);font-weight:600;margin:4px 0 8px}.list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.list-item{display:flex;align-items:center;gap:8px}.list-item a{display:grid}.code-input{text-transform:uppercase;letter-spacing:.15em;font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border-radius:12px;border:1px solid var(--border);background:var(--surface);font-weight:600;cursor:pointer}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.block{width:100%}.btn:disabled{opacity:.5}.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:none;background:transparent;font-size:1.2rem;cursor:pointer}.icon-btn:active{background:var(--surface-2)}.icon-btn.big{width:52px;height:52px;background:var(--surface-2);font-size:1.35rem}.icon-btn.big.on{background:var(--accent);color:var(--accent-ink)}.icon-btn.big.off{opacity:.6}.link{border:none;background:none;color:var(--accent);font-weight:600;padding:0;cursor:pointer}.topbar{display:flex;align-items:center;gap:8px}.topbar .title{font-size:1.25rem}.field{display:flex;flex-direction:column;gap:6px}.field>span{font-weight:600;font-size:.92rem}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:.85rem;cursor:pointer}.segmented{display:flex;background:var(--surface-2);border-radius:12px;padding:4px;gap:4px}.segmented label{flex:1;text-align:center;padding:10px 6px;border-radius:9px;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer}.segmented label.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #0000001f}.segmented input{display:none}.small-seg label{padding:6px;font-size:.8rem}.lang-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.lang{display:flex;align-items:center;gap:8px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);text-align:left;cursor:pointer;font-size:.95rem}.lang.on{border-color:var(--accent);outline:2px solid var(--accent);background:var(--mine)}.flag{font-size:1.3rem}.share{display:grid;justify-items:center;gap:10px}.qr{width:min(240px,70vw);aspect-ratio:1;border-radius:12px;background:#fff;padding:6px}.room-code{font-size:1.6rem;font-weight:800;letter-spacing:.25em}.room{height:100dvh;display:flex;flex-direction:column;max-width:720px;margin:0 auto}.room-head{display:flex;align-items:center;gap:4px;padding:max(8px,env(safe-area-inset-top)) 8px 8px;background:var(--surface);border-bottom:1px solid var(--border)}.room-title{display:grid}.room-title strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--danger);vertical-align:middle}.dot.ok{background:#22c55e}.people{display:flex;gap:6px;overflow-x:auto;padding:8px 12px;flex-shrink:0}.person{white-space:nowrap;font-size:.82rem;padding:4px 10px;border-radius:999px;background:var(--surface-2)}.person.me{outline:1px solid var(--accent)}.messages{flex:1;overflow-y:auto;padding:8px 12px 16px;display:flex;flex-direction:column;gap:10px}.hint{text-align:center;color:var(--muted);padding:24px 8px;font-size:.92rem}.bubble{max-width:88%;padding:10px 12px;border-radius:16px;background:var(--surface);border:1px solid var(--border)}.bubble.mine{align-self:flex-end;background:var(--mine);border-color:transparent;border-bottom-right-radius:4px}.bubble.theirs{align-self:flex-start;border-bottom-left-radius:4px}.bubble.err{outline:1px solid var(--danger)}.bubble .main{font-size:1.15rem;font-weight:500;white-space:pre-wrap;word-break:break-word}.bubble .sub{margin-top:4px;font-size:.88rem;color:var(--muted);white-space:pre-wrap}.bubble .who{margin-bottom:2px}.partial{opacity:.7}.replay{margin-top:6px;border:none;background:none;color:var(--accent);font-size:.82rem;padding:0;cursor:pointer}.controls{padding:10px 12px max(12px,env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);display:grid;gap:10px}.control-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.mic{--level: 0;flex:1;height:76px;border-radius:38px;border:none;background:var(--accent);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:1.05rem;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none;box-shadow:0 0 0 calc(var(--level) * 14px) #14b8a659;transition:transform .08s,box-shadow .08s}.mic:disabled{opacity:.5}.mic.active{transform:scale(1.03);background:var(--danger);color:#fff}.mic.listening:not(.active){background:var(--accent-2)}.mic-icon{font-size:1.6rem}.type-row input{padding:10px 12px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:10}.sheet{position:relative;width:100%;max-width:560px;max-height:90dvh;overflow-y:auto;background:var(--surface);border-radius:20px 20px 0 0;padding:24px 16px max(24px,env(safe-area-inset-bottom));display:grid;gap:14px}.sheet .close{position:absolute;top:10px;right:10px}.toast{position:fixed;left:50%;bottom:150px;transform:translate(-50%);background:#111827;color:#fff;padding:10px 16px;border-radius:999px;font-size:.9rem;max-width:calc(100% - 32px);z-index:20;text-align:center}