/* ===== Hearth design system v2 ===== */
:root{
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;
  --t-xs:12px;--t-sm:14px;--t-md:16px;--t-lg:20px;--t-xl:26px;--t-2xl:32px;
  --r2:calc(var(--r) - 6px);
  --sh:0 1px 1px rgba(40,25,10,.04),0 2px 6px rgba(40,25,10,.05),0 12px 28px -8px rgba(40,25,10,.10);
  --sh2:0 2px 4px rgba(40,25,10,.05),0 18px 40px -10px rgba(40,25,10,.20);
  --ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.4,.5,1);
  font-size:16.5px;
}
[data-theme=dark]{--sh:0 1px 1px rgba(0,0,0,.3),0 10px 30px -10px rgba(0,0,0,.55);--sh2:0 20px 50px -12px rgba(0,0,0,.7)}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-.005em}
h1{font-size:var(--t-2xl);letter-spacing:-.03em;font-weight:900}
h2{font-size:var(--t-lg);letter-spacing:-.015em}h3{font-size:var(--t-md);letter-spacing:-.01em}
#app{position:relative;z-index:1}
html,body{background:var(--bg)}
body.hasbg{background:transparent}body.hasbg html{background:transparent}
/* background layer */
#bglayer{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:var(--bg)}
#bglayer .bgimg{position:absolute;inset:-2%;background-size:cover;background-position:center;transition:filter .4s,opacity .6s}
#bglayer .bgimg:not(.photo){background-size:auto,cover}
#bglayer .bgimg.anim{background-size:320% 320%;animation:bgdrift 48s ease-in-out infinite}
#bglayer .bgimg.kb{animation:kb 70s ease-in-out infinite alternate}
#bglayer .bgdim{position:absolute;inset:0;background:#000;opacity:0;transition:opacity .3s}
@keyframes bgdrift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes kb{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.14) translate(-2%,-1.5%)}}
body.hasbg nav.side{background:color-mix(in srgb,var(--card) 82%,transparent);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
body.bgdark main>h1,body.bgdark main>.row:first-child h1,body.bgdark main>.row:first-child .mut,body.bgdark main>div>.row:first-child h1,body.bgdark main>div>.row:first-child .mut{color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.35)}
/* nav */
nav.side{background:var(--card);border-right:1px solid color-mix(in srgb,var(--line) 70%,transparent);box-shadow:1px 0 0 rgba(0,0,0,.02);gap:6px;padding:18px 0}
nav.side .logo{font-size:13px;letter-spacing:.28em;font-weight:900;margin-bottom:14px;background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 55%,#f59e0b));-webkit-background-clip:text;background-clip:text;color:transparent}
.navb{position:relative;transition:background .25s var(--ease),color .25s,transform .25s var(--ease);font-size:11.5px;letter-spacing:.01em;gap:5px;padding:10px 0 9px}
.navb .i{display:grid;place-items:center;height:26px}.navb .ico{transition:transform .35s var(--spring)}
.navb:hover{background:color-mix(in srgb,var(--acc2) 60%,transparent)}.navb:hover .ico{transform:translateY(-1px) scale(1.06)}
.navb:active{transform:scale(.95)}
.navb.on{background:var(--acc2);color:var(--acc)}.navb.on .ico{stroke-width:2.2}
.navb.on::before{content:'';position:absolute;left:-8px;top:22%;bottom:22%;width:4px;border-radius:0 4px 4px 0;background:var(--acc)}
/* cards + controls */
.card{border-radius:var(--r);border:1px solid color-mix(in srgb,var(--line) 75%,transparent);box-shadow:var(--sh);padding:20px;transition:box-shadow .3s var(--ease),transform .3s var(--ease)}
.btn{border-radius:14px;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 4px 12px -4px color-mix(in srgb,var(--acc) 55%,transparent);transition:transform .15s var(--ease),box-shadow .2s,filter .2s;letter-spacing:-.005em}
.btn:hover{filter:brightness(1.05)}.btn:active{transform:scale(.97)}
.btn.g,.btn.q,.btn.d{box-shadow:none}.btn.q:hover{background:var(--acc2)}
.btn[disabled]{opacity:.55;pointer-events:none}
input,select,textarea{border-radius:13px;transition:border-color .2s,box-shadow .2s,background .2s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc) 18%,transparent)}
.seg{border-radius:15px;padding:4px;background:color-mix(in srgb,var(--acc2) 85%,var(--line))}.seg button{transition:background .2s,box-shadow .2s,color .2s;border-radius:11px}
.seg button.on{box-shadow:0 1px 2px rgba(0,0,0,.08),0 4px 10px -4px rgba(0,0,0,.18)}
.chip{background:var(--acc2);letter-spacing:0}
.av{box-shadow:0 0 0 2px var(--card),0 2px 6px rgba(0,0,0,.12)}
.ev{border-radius:var(--r2);background:color-mix(in srgb,var(--bg) 70%,var(--card));transition:transform .2s var(--ease),box-shadow .2s}.ev:hover{transform:translateX(2px);box-shadow:var(--sh)}
.chk{transition:transform .25s var(--spring),background .2s,border-color .2s}.chk:active{transform:scale(.85)}.chk.on{animation:pop .35s var(--spring)}
@keyframes pop{0%{transform:scale(.7)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
/* views + motion */
main{scroll-behavior:smooth}
main.vin>*{animation:viewIn .5s var(--ease) both}
main.vin>*:nth-child(2){animation-delay:.04s}main.vin>*:nth-child(3){animation-delay:.08s}main.vin>*:nth-child(n+4){animation-delay:.12s}
@keyframes viewIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.wid{transition:box-shadow .3s var(--ease),transform .3s var(--ease),border-color .3s}
main.vin .wid{animation:widIn .55s var(--ease) both}
.vin .wgrid>.wid:nth-child(1){animation-delay:.02s}.vin .wgrid>.wid:nth-child(2){animation-delay:.06s}.vin .wgrid>.wid:nth-child(3){animation-delay:.1s}.vin .wgrid>.wid:nth-child(4){animation-delay:.14s}.vin .wgrid>.wid:nth-child(5){animation-delay:.18s}.vin .wgrid>.wid:nth-child(n+6){animation-delay:.22s}
@keyframes widIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
body:not(.wediting) .wid:not(.nocard):not(.drag):hover{box-shadow:var(--sh2)}
main.vin #wboard.editing .wid{animation:none}
.wid{border-radius:var(--r);box-shadow:var(--sh);border-color:color-mix(in srgb,var(--line) 70%,transparent)}
.wt{display:flex;align-items:center;gap:7px;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:var(--wacc,var(--acc));opacity:.95;margin-bottom:8px}
.wt span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:9px;background:color-mix(in srgb,var(--wacc,var(--acc)) 13%,transparent)}.wt .ico{width:15px;height:15px}
.wpick button span,.wbtns button span{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:var(--acc2);color:var(--acc);font-size:0}
.wpick button span .ico,.wbtns button span .ico{width:24px;height:24px}
.wpick button{transition:transform .2s var(--ease),border-color .2s,box-shadow .2s}.wpick button:hover{transform:translateY(-2px);box-shadow:var(--sh)}
.whn .ico{width:15px;height:15px;vertical-align:-3px}
/* empty states */
.wempty{gap:10px}.weorb,.wempty .wei{transition:transform .5s var(--spring)}
.wempty .wei{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:28px;opacity:1;filter:none;background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--acc2) 50%,#fff),var(--acc2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 10%,transparent),0 8px 20px -8px color-mix(in srgb,var(--acc) 40%,transparent);animation:floaty 5s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-4px)}}
.wempty{font-weight:700;color:var(--mut)}
/* modal */
#modal{background:rgba(24,16,10,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .25s ease both}
#modal .box{border-radius:26px;box-shadow:var(--sh2);animation:boxIn .38s var(--spring) both}
@keyframes fadeIn{from{opacity:0}}@keyframes boxIn{from{opacity:0;transform:translateY(18px) scale(.97)}}
@media(max-width:760px){#modal .box{animation:sheetUp .42s var(--ease) both}}
#toast{border-radius:99px;padding:12px 20px;box-shadow:var(--sh2);transform:translate(-50%,12px);transition:opacity .3s,transform .35s var(--spring)}#toast.on{transform:translate(-50%,0)}
/* phone nav */
@media(max-width:760px){
 nav.side{background:color-mix(in srgb,var(--card) 86%,transparent);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);padding:6px 8px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -8px 30px -12px rgba(0,0,0,.18);gap:2px}
 .navb{padding:7px 0 6px;border-radius:14px;width:64px}.navb.on::before{display:none}.navb.on{background:color-mix(in srgb,var(--acc) 14%,transparent)}
 h1{font-size:26px}
}
/* today at a glance */
.glance{--g:var(--wacc,var(--acc));display:flex;flex-direction:column;gap:14px;height:100%}
.ghero{display:flex;align-items:flex-start;gap:12px;justify-content:space-between;flex-wrap:wrap}
.gdate{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--g)}
.ghi{margin:2px 0 0;font-size:clamp(22px,3.2vw,34px);letter-spacing:-.03em;font-weight:900;line-height:1.1}
.gwx{display:flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--g) 9%,transparent);border-radius:18px;padding:8px 14px}.gwi{font-size:34px;line-height:1}.gwx b{font-size:24px;display:block;line-height:1}.gwx small{color:var(--mut);font-weight:700;font-size:12px}
.gtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(98px,1fr));gap:10px;flex:1;min-height:0}
.gtile{background:color-mix(in srgb,var(--g) 6%,var(--card));border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:var(--r2);padding:12px 14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.gtile.gwide{grid-column:span 2}
.gtt{display:flex;align-items:center;gap:6px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:var(--mut)}
.gev{display:flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer;min-width:0}.gev i{width:4px;height:22px;border-radius:3px;flex:none}.gev span{font-size:12px;color:var(--mut);font-weight:800;min-width:54px;flex:none}.gev b{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gnone{color:var(--mut);font-weight:700;font-size:14px}
.gbig{font-size:34px;font-weight:900;letter-spacing:-.03em;line-height:1}.gbig small{font-size:13px;color:var(--mut);font-weight:700;letter-spacing:0}
.gppl{display:flex;gap:10px;flex-wrap:wrap}.gp{display:flex;flex-direction:column;align-items:center;gap:3px}.gp small{font-size:11px;font-weight:800;color:var(--mut)}
.gdin{font-weight:800;font-size:17px;line-height:1.25}
.glbanner{position:relative;margin-bottom:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 12%,var(--card)),var(--card));border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:calc(var(--r) + 4px);padding:18px;box-shadow:var(--sh)}
#wboard~*,.glbanner+#wboard{margin-top:0}
.glx{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--mut);display:grid;place-items:center}.glx .ico{transform:rotate(45deg)}
@media(max-width:760px){.glbanner{margin:calc(-2px) 0 12px;padding:14px}.gtile.gwide{grid-column:1/-1}.gtiles{grid-template-columns:1fr 1fr}.ghi{font-size:24px}}
/* calendar */
.legend{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.lg{display:inline-flex;align-items:center;gap:7px;padding:7px 14px 7px 10px;border-radius:99px;background:var(--card);border:1px solid var(--line);font-weight:800;font-size:14px;transition:opacity .2s,transform .15s}.lg:active{transform:scale(.96)}.lg i{width:12px;height:12px;border-radius:50%}.lg.off{opacity:.4}
.wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.wkd{background:var(--card);border:1px solid color-mix(in srgb,var(--line) 75%,transparent);border-radius:var(--r);box-shadow:var(--sh);padding:10px 8px 8px;display:flex;flex-direction:column;gap:8px;min-height:340px;position:relative;min-width:0}
.wkd.t{box-shadow:0 0 0 2px var(--acc),var(--sh)}
.wkh{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer}.dw{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--mut)}
.dn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:19px;font-weight:900}.wkd.t .dn{background:var(--acc);color:#fff;box-shadow:0 6px 14px -4px color-mix(in srgb,var(--acc) 60%,transparent)}
.wkb{display:flex;flex-direction:column;gap:6px;flex:1}.wkn{color:var(--mut);text-align:center;opacity:.5;padding:8px;font-weight:700;font-size:13px}
.wka{align-self:center;width:34px;height:34px;border-radius:50%;background:var(--acc2);color:var(--acc);display:grid;place-items:center;opacity:.7;transition:opacity .2s,transform .2s}.wka:hover{opacity:1;transform:scale(1.1)}
.epill{--pc:var(--acc);position:relative;background:color-mix(in srgb,var(--pc) 13%,var(--card));border-left:4px solid var(--pc);border-radius:12px;padding:7px 9px 7px 10px;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s;min-width:0}
.epill:hover{transform:translateY(-1px);box-shadow:0 6px 14px -6px color-mix(in srgb,var(--pc) 55%,transparent)}
.epill .et{font-size:11px;font-weight:800;color:color-mix(in srgb,var(--pc) 75%,var(--ink));letter-spacing:.02em}.epill .en{font-weight:800;font-size:14px;line-height:1.2;overflow-wrap:anywhere}
.epill .ep{display:flex;gap:3px;margin-top:5px}.epill .ep i{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px var(--card)}
.dayp{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:12px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity}
.dcol{background:var(--card);border:1px solid color-mix(in srgb,var(--line) 75%,transparent);border-radius:var(--r);box-shadow:var(--sh);padding:12px;display:flex;flex-direction:column;gap:8px;min-height:320px;scroll-snap-align:start;border-top:4px solid var(--pc)}
.dch{--pc:var(--acc);display:flex;align-items:center;gap:10px;margin-bottom:4px}.dch b{flex:1;font-size:17px}.dch small{color:var(--mut);font-weight:700}
.dcl{margin-top:6px;border-top:1px dashed var(--line);padding-top:6px}
@media(max-width:760px){.dayp{grid-auto-columns:minmax(78vw,1fr)}}
@media(max-width:900px){.wk{grid-template-columns:1fr}.wkd{min-height:0;flex-direction:row;flex-wrap:wrap;align-items:flex-start}.wkh{flex-direction:row;gap:10px;width:100%;justify-content:flex-start}.wkb{flex:1 1 100%}.wka{position:absolute;top:10px;right:10px}}
@media(min-width:901px) and (max-width:1200px){.wk{gap:6px}.epill{padding:6px 7px}.epill .en{font-size:13px}}
/* backgrounds modal */
.bgrow,.bggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;margin-bottom:6px}.bgrow{grid-template-columns:1fr 1fr}
.bgt{position:relative;display:flex;flex-direction:column;gap:5px;text-align:center;font-size:12px;font-weight:800;color:var(--mut);padding:0;cursor:pointer;transition:transform .2s var(--ease)}
.bgt i{display:grid;place-items:center;height:62px;border-radius:14px;border:2px solid transparent;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);background-size:auto,cover;background-position:center;color:var(--acc);font-style:normal;transition:border-color .2s}
.bgt.on i{border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 25%,transparent)}.bgt.on{color:var(--acc)}.bgt:active{transform:scale(.96)}
.bgt.up i{background:var(--acc2)}
#modal h3{margin:16px 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
/* night dimming (display mode) */
body.night #app{filter:brightness(var(--nd,.35)) saturate(.75) sepia(.12);transition:filter 1.5s ease}
body.night #bglayer{filter:brightness(var(--nd,.35)) saturate(.7);transition:filter 1.5s}
body.night::after{content:'';position:fixed;inset:0;z-index:9990;pointer-events:none;background:rgba(30,12,0,.18)}
body.night #asfab,body.night #aspanel{display:none}body.night .aswake{opacity:.85}
/* ===== assistant ===== */
#asfab{position:fixed;right:calc(18px + env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));z-index:45;width:58px;height:58px;border-radius:50%;color:#fff;display:grid;place-items:center;background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 45%,#7c3aed));box-shadow:0 10px 26px -6px color-mix(in srgb,var(--acc) 70%,transparent),0 0 0 4px color-mix(in srgb,var(--card) 70%,transparent);transition:transform .25s var(--spring),box-shadow .3s}
#asfab:hover{transform:scale(1.06)}#asfab:active{transform:scale(.94)}#asfab.on{transform:rotate(90deg) scale(.92)}
#asfab.busy::before,#asfab.listen::before{content:'';position:absolute;inset:-6px;border-radius:50%;border:3px solid var(--acc);opacity:.5;animation:ring 1.4s ease-out infinite}
#asfab.listen::after{content:'';position:absolute;inset:-14px;border-radius:50%;border:3px solid var(--acc);opacity:.3;animation:ring 1.4s .35s ease-out infinite}
@keyframes ring{from{transform:scale(.85);opacity:.7}to{transform:scale(1.25);opacity:0}}
.asbadge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:#dc2626;color:#fff;font:800 11px/20px system-ui;text-align:center;font-style:normal;padding:0 5px}
@media(max-width:760px){#asfab{bottom:calc(86px + env(safe-area-inset-bottom));width:54px;height:54px;right:14px}body.kiosk #asfab{bottom:calc(18px + env(safe-area-inset-bottom))}}
body.asopen #asfab{display:none}
.aswake{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:44;display:flex;align-items:center;gap:9px;background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:var(--sh2);border-radius:99px;padding:8px 8px 8px 14px;font-size:13px;font-weight:800;color:var(--mut);white-space:nowrap}
.aswake b{background:var(--acc2);color:var(--acc);border-radius:99px;padding:5px 11px;font-size:12px}.asdot{width:10px;height:10px;border-radius:50%;background:#9ca3af}.aswake.live .asdot{background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
@media(max-width:760px){.aswake{bottom:calc(84px + env(safe-area-inset-bottom));max-width:calc(100vw - 100px);overflow:hidden}}
#aspanel{position:fixed;right:calc(18px + env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));z-index:60;width:min(410px,calc(100vw - 28px));height:min(640px,calc(100dvh - 40px));background:var(--card);border:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:28px;box-shadow:0 30px 80px -20px rgba(0,0,0,.5);display:flex;flex-direction:column;overflow:hidden;animation:asIn .4s var(--spring) both}
@keyframes asIn{from{opacity:0;transform:translateY(24px) scale(.96)}}
#aspanel header{display:flex;align-items:center;gap:10px;padding:14px 14px 12px 16px;border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--acc) 8%,var(--card)),var(--card))}
#aspanel header b{font-size:17px;display:block;letter-spacing:-.02em}#aspanel header small{color:var(--mut);font-weight:700;font-size:12.5px}
.asorb{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 40%,#7c3aed));box-shadow:0 12px 28px -8px color-mix(in srgb,var(--acc) 70%,transparent);margin:0 auto 10px}.asorb.sm{width:38px;height:38px;margin:0;flex:none;box-shadow:none}.asorb.sm svg{width:20px;height:20px}
.asib{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--mut);background:transparent;flex:none;transition:background .2s,color .2s,transform .15s}.asib:hover{background:var(--acc2);color:var(--acc)}.asib:active{transform:scale(.9)}
.asib.mic.on{background:#dc2626;color:#fff;animation:pulse2 1.2s infinite}@keyframes pulse2{50%{box-shadow:0 0 0 8px rgba(220,38,38,.2)}}
.asib.go{background:var(--acc);color:#fff}.asib.go:hover{background:var(--acc);color:#fff;filter:brightness(1.08)}
#asmsgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.asm{max-width:86%;padding:10px 14px;border-radius:20px;line-height:1.4;font-size:15px;animation:msgIn .35s var(--ease) both;overflow-wrap:anywhere}
@keyframes msgIn{from{opacity:0;transform:translateY(8px) scale(.97)}}
.asm.user{align-self:flex-end;background:var(--acc);color:#fff;border-bottom-right-radius:6px}
.asm.bot{align-self:flex-start;background:color-mix(in srgb,var(--acc2) 70%,var(--card));border-bottom-left-radius:6px}.asm.err{background:#fef2f2;color:#991b1b}
.aschips{display:flex;flex-direction:column;gap:4px;margin-top:8px}.aschips span{font-size:13px;font-weight:800;color:#15803d;background:color-mix(in srgb,#22c55e 14%,var(--card));padding:5px 10px;border-radius:10px}
.typing{display:flex;gap:5px;padding:14px 16px}.typing i{width:8px;height:8px;border-radius:50%;background:var(--mut);animation:dots 1.2s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes dots{40%{transform:translateY(-5px);opacity:.4}}
.asconf{align-self:stretch;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:16px;padding:12px;font-weight:700;display:flex;flex-direction:column;gap:10px}[data-theme=dark] .asconf{background:#3a1f0e;color:#fdba74;border-color:#7c2d12}
.asempty{margin:auto;text-align:center;padding:10px}.asempty h3{margin:0 0 4px;font-size:20px}.asempty p{margin:0 0 14px;font-size:14px}
.asugg{display:flex;flex-direction:column;gap:7px}.asugg button{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:10px 14px;text-align:left;font-weight:700;font-size:14px;transition:border-color .2s,transform .15s}.asugg button:hover{border-color:var(--acc)}.asugg button:active{transform:scale(.98)}
.astimers{display:flex;gap:6px;flex-wrap:wrap;padding:8px 14px 0}.astimer{background:var(--acc2);color:var(--acc);border-radius:99px;padding:5px 12px;font-weight:800;font-size:13px;cursor:pointer}
#aspanel footer{padding:10px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
#asform{display:flex;gap:6px;align-items:center}#asin{flex:1;min-width:0;border-radius:99px;padding:0 16px;min-height:46px}.asleft{text-align:center;font-size:12px;color:var(--mut);font-weight:700;margin-bottom:6px}
@media(max-width:760px){#aspanel{left:0;right:0;bottom:0;width:100%;height:min(82dvh,720px);border-radius:28px 28px 0 0;animation:sheetUp .42s var(--ease) both}}
#ascard .wchk{margin:8px 0}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* mic / recording states */
.asrec{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 16px 12px;margin:0 12px 8px;border:1px solid var(--line);border-radius:20px;background:color-mix(in srgb,var(--acc) 8%,var(--card));color:var(--ink,inherit);cursor:pointer;font:inherit;width:calc(100% - 24px);animation:pop .25s ease both;--lvl:0}
.asrec b{font-size:15px}.asrec small{opacity:.65;font-size:12px}
.asrorb{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 60%,#000));margin-bottom:4px}
.asrorb svg{width:26px;height:26px;position:relative;z-index:1}
.asrorb i{position:absolute;inset:0;border-radius:50%;background:var(--acc);opacity:.35;transform:scale(calc(1 + var(--lvl)*.7));transition:transform .09s linear}
.asrec:not(.tr) .asrorb::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:3px solid var(--acc);opacity:.4;animation:ring 1.4s ease-out infinite}
.asrec.tr{cursor:default}.asrec.tr .asrorb svg{animation:floaty 1.2s ease-in-out infinite}
.asqk{display:flex;gap:7px;overflow-x:auto;padding:2px 12px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.asqk::-webkit-scrollbar{display:none}
.asqk button{flex:none;background:var(--bg);border:1px solid var(--line);border-radius:99px;padding:7px 13px;font-size:13px;font-weight:700;white-space:nowrap;color:inherit;font-family:inherit}
.asib.mic.on{background:var(--acc);color:#fff}
#aspanel.rec .asugg{display:none}