:root{--bg:#e6ebee;--pn:#f6f8f9;--ink:#16252d;--mu:#5b6d77;--key:#fff;--op:#d9e3e8;--ac:#0e6b66;--acx:#fff;--rec:#c2412d;--ln:#cfd9de;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0f1519;--pn:#182026;--ink:#e8f0f3;--mu:#8fa3ad;--key:#222d34;--op:#2d3b44;--ac:#46c2b6;--acx:#07201d;--rec:#ff7a63;--ln:#2c3942}}
:root[data-theme="dark"]{--bg:#0f1519;--pn:#182026;--ink:#e8f0f3;--mu:#8fa3ad;--key:#222d34;--op:#2d3b44;--ac:#46c2b6;--acx:#07201d;--rec:#ff7a63;--ln:#2c3942}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}
.app{max-width:960px;margin:0 auto;padding:16px;display:grid;gap:16px;align-items:start}
@media(min-width:820px){.app{grid-template-columns:minmax(0,430px) 1fr;padding:32px 16px}}
.card{background:var(--pn);border:1px solid var(--ln);border-radius:22px;padding:14px}
button{font:inherit;border:0;cursor:pointer;color:inherit;background:none}
button:focus-visible{outline:3px solid var(--ac);outline-offset:2px}
.top{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.top h1{font-size:1rem;margin:0 auto 0 4px;font-weight:800}
.chip{font-size:.74rem;font-weight:700;padding:6px 10px;border-radius:99px;border:1px solid var(--ln);color:var(--mu)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--pn);border-color:var(--ink)}
#mi{visibility:hidden;color:var(--ac);border-color:var(--ac)}
.screen{background:var(--bg);border-radius:16px;padding:12px 16px;text-align:right;min-height:112px;display:flex;flex-direction:column;justify-content:flex-end}
#ex{color:var(--mu);font-size:1.05rem;word-break:break-all;max-height:3.4em;overflow:auto}
#res{font-size:2.6rem;font-weight:800;font-variant-numeric:tabular-nums;word-break:break-all;line-height:1.15}
#res.pre{color:var(--ink)}#res.err{color:var(--rec)}
.voice{display:flex;align-items:center;gap:12px;margin:12px 0}
#mic{flex:none;width:64px;height:64px;border-radius:50%;background:var(--ac);color:var(--acx);display:grid;place-items:center}
#mic.on{background:var(--rec);animation:pl 1.2s infinite}
@keyframes pl{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--rec) 50%,transparent)}100%{box-shadow:0 0 0 18px transparent}}
@media(prefers-reduced-motion:reduce){#mic.on{animation:none}}
#heard{font-size:.9rem;color:var(--mu);line-height:1.35}#heard b{color:var(--ink)}
.pad{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pad.sci{grid-template-columns:repeat(5,1fr);margin-bottom:8px}
.pad button{height:54px;border-radius:14px;background:var(--key);font-weight:700;font-size:1.2rem;border:1px solid var(--ln)}
.pad button:active{transform:scale(.96)}
.pad.sci button{height:40px;font-size:.82rem;color:var(--mu)}
.pad .o{background:var(--op);color:var(--ac)}.pad .f{background:var(--op)}
.pad .eq{background:var(--ac);color:var(--acx);border-color:var(--ac)}
aside h2{font-size:.95rem;margin:0 0 8px}
aside section+section{margin-top:18px}
.say{display:flex;flex-wrap:wrap;gap:6px}
.say button{border:1px solid var(--ln);background:var(--key);border-radius:10px;padding:7px 10px;font-size:.84rem;text-align:left}
#hist{list-style:none;margin:0;padding:0;max-height:300px;overflow:auto}
#hist li button{width:100%;display:flex;justify-content:space-between;gap:12px;padding:9px 6px;border-bottom:1px solid var(--ln);text-align:left}
#hist span:first-child{color:var(--mu);word-break:break-all}#hist span:last-child{font-weight:800;white-space:nowrap}
.empty{color:var(--mu);font-size:.88rem}
.lnk{font-size:.8rem;color:var(--mu);text-decoration:underline;float:right}
[hidden]{display:none!important}
button,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
select.chip{background:var(--pn);appearance:none;cursor:pointer}
#res{cursor:pointer}#res.err{font-size:1.4rem;color:var(--rec)}