:root{--p:#7b5fd0;--bg:#f6f3ff;--c:#fff;--t:#2b2640}*{box-sizing:border-box}body{margin:0;font-family:system-ui,Segoe UI,Arial;background:var(--bg);color:var(--t);padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
#auth{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:16px}.card{background:var(--c);padding:24px;border-radius:16px;max-width:380px;width:100%;box-shadow:0 4px 20px #0001}
h1{margin:0;color:var(--p)}.sub{color:#777;font-size:.9rem}input,textarea,select{width:100%;padding:11px;margin:5px 0;border:1px solid #d6cdf0;border-radius:10px;font:inherit;background:#fff;color:inherit}
button{background:var(--p);color:#fff;border:0;padding:11px 14px;border-radius:10px;font:inherit;cursor:pointer}button.alt{background:#e7e1f8;color:var(--p)}button.mini{padding:5px 9px;background:#fff3}.err{color:#c0392b}
#auth button{width:100%;margin-top:8px}#app{max-width:720px;margin:auto;display:flex;flex-direction:column;height:100vh;height:100dvh}header{background:var(--p);color:#fff;padding:12px 14px;display:flex;gap:10px;align-items:center}header span{flex:1;text-align:right;opacity:.9}
nav{display:flex;background:#fff}nav button{flex:1;background:none;color:#555;border-radius:0;border-bottom:3px solid transparent}nav button.on{color:var(--p);border-color:var(--p)}
.tab{flex:1;overflow:auto;padding:12px}#chat{display:flex;flex-direction:column;overflow:hidden}#msgs{flex:1;overflow:auto}
.m{max-width:85%;padding:10px 13px;margin:6px 0;border-radius:16px;white-space:pre-wrap;line-height:1.4}.m.assistant{background:#fff;border-bottom-left-radius:4px}.m.user{background:var(--p);color:#fff;margin-left:auto;border-bottom-right-radius:4px}
.row{display:flex;gap:6px;align-items:flex-end;margin:6px 0}.row textarea{margin:0;resize:none;max-height:120px}.row button{white-space:nowrap}#mic.on{background:#e74c3c;animation:p 1s infinite}@keyframes p{50%{opacity:.5}}
.opts{display:flex;gap:10px;font-size:.8rem;flex-wrap:wrap;align-items:center}.opts select{width:auto;padding:4px}.opts input{width:auto}label{display:block;margin:6px 0}label input[type=checkbox]{width:auto}
#dl div{padding:8px;background:#fff;border-radius:8px;margin:4px 0;cursor:pointer}@media(prefers-color-scheme:dark){:root{--bg:#17141f;--c:#241f33;--t:#eee}.m.assistant,nav,#dl div{background:#241f33}input,textarea,select{background:#241f33;border-color:#4a4066}button.alt{background:#35294f}}