:root{color-scheme:light dark;--bg: #fafaf7;--fg: #1a1a1a;--muted: #666;--accent: #c75d3a;--user-bg: #efebe3;--assistant-bg: #f7f3ea;--border: #e5e0d4;font-family:Georgia,Iowan Old Style,Palatino Linotype,Palatino,serif}@media(prefers-color-scheme:dark){:root{--bg: #1a1816;--fg: #f0ebe1;--muted: #999;--user-bg: #2a2622;--assistant-bg: #221f1c;--border: #3a352f}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}.app{max-width:720px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding:2rem 1.5rem}header{text-align:center;margin-bottom:1.5rem}header h1{font-size:2.5rem;margin:0;font-style:italic;letter-spacing:.02em}.subtitle{color:var(--muted);margin:.25rem 0 0;font-size:.95rem}.transcript{flex:1;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;padding:1rem 0;max-height:60vh}.hint{color:var(--muted);text-align:center;font-style:italic;margin:auto}.turn{padding:.75rem 1rem;border-radius:.5rem;border:1px solid var(--border);max-width:85%}.turn-user{align-self:flex-end;background:var(--user-bg)}.turn-assistant{align-self:flex-start;background:var(--assistant-bg)}.role{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:.25rem;display:flex;align-items:center;gap:.5rem}.replay{width:1.4rem;height:1.4rem;padding:0;border:1px solid var(--border);border-radius:50%;background:transparent;color:var(--muted);font-size:.6rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s,background .15s}.replay:hover{color:var(--fg);border-color:var(--fg);background:var(--user-bg)}.text{font-size:1.05rem;line-height:1.5;white-space:pre-wrap}.error{background:#b94a3a;color:#fff;padding:.75rem 1rem;border-radius:.5rem;margin:.5rem 0;font-size:.9rem}footer{display:flex;gap:.75rem;align-items:center;justify-content:center;padding-top:1rem}.mic{flex:1;max-width:300px;padding:1rem 1.5rem;font-size:1.1rem;font-family:inherit;border:2px solid var(--accent);border-radius:999px;background:var(--accent);color:#fff;cursor:pointer;transition:transform .1s,background .2s;font-style:italic;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.mic:hover:not(:disabled){transform:scale(1.02)}.mic:active:not(:disabled){transform:scale(.98)}.mic-listening{background:#b94a3a;border-color:#b94a3a;animation:pulse 1.2s ease-in-out infinite}.mic-thinking,.mic-speaking{background:var(--muted);border-color:var(--muted)}.mic:disabled{cursor:not-allowed;opacity:.7}.reset{padding:.75rem 1rem;font-size:.9rem;font-family:inherit;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--fg);cursor:pointer}.reset:disabled{opacity:.4;cursor:not-allowed}.lang-bar{display:flex;align-items:center;gap:.5rem;justify-content:center;padding:.5rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:.5rem 0;font-size:.85rem}.lang-bar-label{color:var(--muted);font-style:italic;text-transform:lowercase}.lang-picker{position:relative;min-width:180px}.lang-picker-button{display:flex;align-items:center;justify-content:space-between;gap:.5rem;width:100%;padding:.4rem .8rem;font-family:inherit;font-style:italic;font-size:.9rem;color:var(--fg);background:var(--user-bg);border:1px solid var(--border);border-radius:999px;cursor:pointer;transition:border-color .15s}.lang-picker-button:hover{border-color:var(--accent)}.lang-picker-caret{font-size:.7rem;color:var(--muted)}.lang-picker-open{background:var(--bg);border:1px solid var(--accent);border-radius:.5rem;overflow:hidden;position:absolute;inset:0 auto auto 0;width:max(100%,240px);z-index:10;box-shadow:0 6px 24px #00000026}.lang-picker-input{width:100%;padding:.5rem .75rem;font-family:inherit;font-size:.9rem;color:var(--fg);background:var(--bg);border:none;border-bottom:1px solid var(--border);outline:none;box-sizing:border-box}.lang-picker-list{max-height:280px;overflow-y:auto;margin:0;padding:.25rem 0;list-style:none}.lang-picker-item{display:flex;align-items:baseline;gap:.5rem;padding:.4rem .75rem;font-size:.9rem;cursor:pointer}.lang-picker-item.is-highlight{background:var(--user-bg)}.lang-picker-item-label{font-style:italic}.lang-picker-item-sub{color:var(--muted);font-size:.8rem}.lang-picker-empty{padding:.5rem .75rem;color:var(--muted);font-size:.85rem;font-style:italic}.user-bar{display:flex;justify-content:center;align-items:center;gap:.75rem;margin-top:.5rem;font-size:.85rem;color:var(--muted)}.user-email{font-style:italic}.signout{padding:.2rem .6rem;font-size:.75rem;font-family:inherit;font-style:italic;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;transition:color .15s,border-color .15s}.signout:hover{color:var(--fg);border-color:var(--fg)}.auth,.auth-loading{max-width:420px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:2rem 1.5rem}.auth header{text-align:center;margin-bottom:2rem}.auth header h1{font-size:2.5rem;margin:0;font-style:italic}.auth-form{display:flex;flex-direction:column;gap:1rem;background:var(--assistant-bg);border:1px solid var(--border);border-radius:.75rem;padding:1.5rem}.auth-form h2{margin:0;font-size:1.25rem;font-style:italic;text-align:center}.auth-form label{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;color:var(--muted)}.auth-form input{padding:.6rem .75rem;font-size:1rem;font-family:inherit;border:1px solid var(--border);border-radius:.4rem;background:var(--bg);color:var(--fg)}.auth-form input:focus{outline:none;border-color:var(--accent)}.auth-error{background:#b94a3a;color:#fff;padding:.6rem .75rem;border-radius:.4rem;font-size:.85rem}.auth-submit{padding:.75rem 1rem;font-size:1rem;font-family:inherit;font-style:italic;border:2px solid var(--accent);border-radius:.4rem;background:var(--accent);color:#fff;cursor:pointer}.auth-submit:disabled{opacity:.6;cursor:not-allowed}.auth-toggle{background:transparent;border:none;color:var(--muted);font-family:inherit;font-size:.85rem;font-style:italic;cursor:pointer;text-align:center}.auth-toggle:hover:not(:disabled){color:var(--fg)}@keyframes pulse{0%,to{box-shadow:0 0 #b94a3a80}50%{box-shadow:0 0 0 12px #b94a3a00}}
