:root{--bg: #f7f5f1;--card: #ffffff;--text: #1f1c18;--muted: #6b645b;--border: #e4ddd2;--accent: #2f6f4f;--accent-text: #ffffff;--danger: #a33b2b;--danger-text: #ffffff;--code-bg: #eef4f0;--user-bubble: color-mix(in srgb, var(--accent) 12%, var(--card));--radius: 12px;--radius-sm: 8px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:16px;line-height:1.5;color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #15171a;--card: #1e2125;--text: #ebe8e3;--muted: #a29b91;--border: #33373d;--accent: #5fb58a;--accent-text: #0f1a14;--danger: #f08a7b;--danger-text: #1a0f0d;--code-bg: #1d2a23}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;padding-top:max(14px,env(safe-area-inset-top));border-bottom:1px solid var(--border);background:var(--card)}.brand{color:var(--text);text-decoration:none;font-weight:700;font-size:1.1rem}.brand span{color:var(--muted);font-weight:500}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin-bottom:16px}label{display:grid;gap:4px;font-weight:600;font-size:.9rem}label .hint{font-weight:400;color:var(--muted)}input,select,textarea{font:inherit;font-weight:400;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;width:100%}input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:2px}button{font:inherit;font-weight:600;border-radius:var(--radius-sm);padding:10px 18px;border:1px solid transparent;cursor:pointer;touch-action:manipulation}button.primary{background:var(--accent);color:var(--accent-text)}button.secondary{background:transparent;color:var(--text);border-color:var(--border)}button.danger{background:transparent;color:var(--danger);border-color:var(--danger)}button.danger-solid{background:var(--danger);color:var(--danger-text)}button.link{background:none;border:none;padding:0;color:var(--accent);font-weight:500}button:disabled{opacity:.6;cursor:wait}.badge{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;border:1px solid var(--border);border-radius:999px;padding:1px 8px;color:var(--muted);white-space:nowrap}.code{font-family:ui-monospace,SF Mono,Menlo,monospace;font-weight:700;letter-spacing:.25em;background:var(--code-bg);border-radius:10px}.error{color:var(--danger);margin:0}.empty{color:var(--muted);margin:0}:root{font-size:19px}body{min-height:100dvh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:2}.brand{font-size:1.15rem}#status{font-size:.8rem;padding:4px 12px;max-width:65%;white-space:normal;text-align:right}#status .dot{width:8px;height:8px;border-radius:50%;background:var(--border)}#status.live{color:var(--accent);border-color:var(--accent)}#status.live .dot{background:var(--accent);animation:pulse 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){#status.live .dot{animation:none}}@keyframes pulse{50%{opacity:.35}}main{flex:1;width:100%;max-width:720px;margin:0 auto;padding:16px 16px 140px}h1{font-size:1.4rem;margin:0 0 4px}.sub{color:var(--muted);margin:0 0 16px}#pair{display:grid;gap:14px;margin-top:8px}#pair input.code{font-size:1.6rem;text-align:center;text-transform:uppercase;padding:14px 12px;letter-spacing:.2em}#pair input.code::placeholder{color:color-mix(in srgb,var(--muted) 45%,transparent);letter-spacing:.2em}#transcript{display:flex;flex-direction:column;gap:12px}#transcript .empty{text-align:center;margin-top:32px}.msg{max-width:88%;padding:12px 16px;border-radius:var(--radius);border:1px solid var(--border);white-space:pre-wrap;overflow-wrap:anywhere}.msg .who{display:block;font-size:.75rem;font-weight:600;color:var(--muted);margin-bottom:2px}.msg.bot{align-self:flex-start;background:var(--card);border-bottom-left-radius:4px}.msg.user{align-self:flex-end;background:var(--user-bubble);border-color:color-mix(in srgb,var(--accent) 25%,var(--border));border-bottom-right-radius:4px}.msg .interim{color:var(--muted);font-style:italic}button.big{width:100%;min-height:64px;font-size:1.2rem;border-radius:var(--radius)}#actionbar{position:fixed;left:0;right:0;bottom:0;z-index:2;padding:12px 16px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 70%,transparent)}#actionbar button{display:block;max-width:720px;margin:0 auto}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(min-width:720px){main{padding-top:28px}.msg{max-width:75%}}