:root{--bg:#f4f1ea;--surface:#fff;--surface-2:#e9e4d8;--text:#15181c;--muted:#5b5f66;--accent:#f2a900;--accent-text:#15181c;--record:#d7261e;--ok:#1e8e3e;--danger:#b3261e;--border:#d3cdbf;--tap:64px;--radius:14px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#111418;--surface:#1b1f24;--surface-2:#262b31;--text:#f3f1ec;--muted:#a3a8ae;--accent:#ffb300;--border:#363c44;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#111418;--surface:#1b1f24;--surface-2:#262b31;--text:#f3f1ec;--muted:#a3a8ae;--accent:#ffb300;--border:#363c44;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#app{background:var(--bg);height:100%;color:var(--text);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;margin:0;font:18px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button,input,textarea{font:inherit;color:inherit}button{min-height:var(--tap);min-width:var(--tap);border-radius:var(--radius);cursor:pointer;touch-action:manipulation;border:0}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:var(--accent-text);padding:0 1.25rem;font-weight:700}.secondary{background:var(--surface-2);padding:0 1.25rem}.danger{color:var(--danger);border:2px solid var(--danger);background:0 0}.ghost{background:0 0}.icon{padding:0;font-size:1.5rem}.big{width:100%;font-size:1.15rem}.screen{max-width:560px;padding:max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));flex-direction:column;gap:16px;min-height:100%;margin:0 auto;display:flex}.screen.center{justify-content:center;align-items:center}.logo{letter-spacing:.08em;color:var(--accent);margin:0;font-size:2.6rem}h2{margin:0;font-size:1.5rem}h3{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:8px 0 0;font-size:.95rem}.hint{color:var(--muted);margin:0}.small{font-size:.85rem}.error{color:var(--danger);margin:0;font-weight:600}.row{align-items:center;gap:12px;display:flex}.form{flex-direction:column;gap:16px;display:flex}.form label{flex-direction:column;gap:6px;font-weight:600;display:flex}input,textarea{min-height:var(--tap);border:2px solid var(--border);border-radius:var(--radius);background:var(--surface);width:100%;padding:0 16px}textarea{resize:vertical;padding:12px 16px}.code-input{letter-spacing:.15em;text-align:center;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:1.8rem}.grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;display:grid}.card{background:var(--surface);border:2px solid var(--border);flex-direction:column;align-items:center;gap:8px;padding:16px 8px;display:flex}.card.muted{color:var(--muted)}.avatar{background:var(--surface-2);border-radius:50%;place-items:center;width:64px;height:64px;font-size:1.4rem;font-weight:700;display:grid}.card-name{text-align:center;overflow-wrap:anywhere;font-weight:600}.search{position:sticky;top:0}.lang-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.lang-item{background:var(--surface);text-align:start;border:2px solid #0000;justify-content:space-between;align-items:center;width:100%;padding:0 16px;font-size:1.15rem;display:flex}.lang-item.selected{border-color:var(--accent)}.lang-code{color:var(--muted);font-family:ui-monospace,Menlo,monospace;font-size:.85rem}.switch-row,.setting{min-height:var(--tap);justify-content:space-between;align-items:center;gap:16px;font-weight:600;display:flex}.switch-row input{width:32px;height:32px;min-height:0;accent-color:var(--accent)}.segmented{gap:6px;display:flex}.segmented button{background:var(--surface-2)}.segmented button.on{background:var(--accent);color:var(--accent-text);font-weight:700}.spinner{border:5px solid var(--surface-2);border-top-color:var(--accent);border-radius:50%;width:48px;height:48px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.talk{--main-size:1.5rem;grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);grid-template-columns:minmax(0,1fr);height:100%;display:grid;overflow:hidden}.talk.size-0{--main-size:1.2rem}.talk.size-2{--main-size:2rem}.half{min-height:0;padding:10px 12px max(12px, env(safe-area-inset-bottom));border:4px solid #0000;flex-direction:column;gap:8px;transition:border-color .1s;display:flex}.half-B{padding-bottom:max(12px, env(safe-area-inset-top));background:var(--surface-2);transform:rotate(180deg)}.half.recording{border-color:var(--record)}.half-head{align-items:center;gap:8px;display:flex}.lang-button{background:var(--surface);border:2px solid var(--border);min-height:48px;padding:0 14px;font-weight:700}.half-status{color:var(--muted);font-weight:600}.phrases{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;overflow-y:auto}.empty{color:var(--muted);text-align:center;margin:auto;font-size:1.1rem}.phrase{background:var(--surface);border-radius:var(--radius);border-inline-start:6px solid var(--border);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;padding:10px 14px}.phrase.other{border-inline-start-color:var(--accent)}.phrase.speaking{box-shadow:0 0 0 3px var(--accent)}.phrase.recording .main,.phrase.recognizing .main,.phrase.translating .main{color:var(--muted)}.phrase .main{font-size:var(--main-size);overflow-wrap:anywhere;margin:0;font-weight:600;line-height:1.3}.phrase .sub{color:var(--muted);margin:4px 0 0;font-size:.95rem}.phrase-error{color:var(--danger);margin:4px 0 0;font-weight:600}.hold-row,.type-row{gap:8px;display:flex}.hold{background:var(--accent);min-height:96px;color:var(--accent-text);-webkit-user-select:none;user-select:none;touch-action:none;flex:1;font-size:1.35rem;font-weight:800}.hold[aria-pressed=true]{background:var(--record);color:#fff}.type-row input{flex:1;min-width:0}.type-row .primary.icon{width:var(--tap);flex:none}.middle{background:var(--bg);border-block:1px solid var(--border);align-items:center;gap:8px;min-width:0;min-height:56px;padding:0 8px;font-size:.9rem;display:flex}.middle .icon{min-width:52px;min-height:52px}.spacer{flex:1}.dot{background:var(--muted);border-radius:50%;flex:none;width:14px;height:14px}.dot.open{background:var(--ok)}.dot.reconnecting,.dot.closed{background:var(--record)}.demo{white-space:nowrap;text-overflow:ellipsis;background:var(--accent);min-width:0;color:var(--accent-text);border-radius:8px;flex:0 auto;padding:2px 8px;font-weight:700;overflow:hidden}.status-text,.usage{color:var(--muted);font-weight:600}.toast{background:var(--text);color:var(--bg);border-radius:var(--radius);text-align:center;z-index:10;padding:16px;font-weight:700;position:fixed;bottom:calc(50% - 40px);left:16px;right:16px;box-shadow:0 8px 24px #0000004d}.overlay{z-index:20;background:#0000008c;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.dialog{background:var(--surface);border-radius:20px;flex-direction:column;gap:14px;width:min(520px,100%);padding:20px;font-size:1.1rem;display:flex}.dialog p{margin:0}.dialog hr{border:0;border-top:1px solid var(--border);width:100%;margin:0}.rotated-text{transform:rotate(180deg)}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}