
:root{--bg:#09090a;--pn:#131315;--ln:#26262a;--tx:#f4f4f5;--mut:#a1a1a6;--bad:#f87171;--ok:#86efac;--pb:#d9d9dc;--pt:#111;--hl:#1c1c1f;--fld:#18181a;--glow:rgba(120,120,130,.16);color-scheme:dark;box-sizing:border-box}
:root[data-t=light]{--bg:#f4f4f6;--pn:#fff;--ln:#e4e4e8;--tx:#121214;--mut:#6b6b74;--bad:#dc2626;--ok:#16a34a;--pb:#18181b;--pt:#fff;--hl:#ececf0;--fld:#f4f4f6;--glow:rgba(0,0,0,.05);color-scheme:light}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;transition:background .3s,color .3s}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(900px 480px at 50% -8%,var(--glow),transparent);pointer-events:none}
#r{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px)}
.sc{width:100%;max-width:580px;margin:0 auto;padding:20px 20px 120px;flex:1;animation:in .35s ease both}
.sc.w{max-width:900px}
.sc.c{max-width:440px;display:flex;flex-direction:column;justify-content:center;padding-bottom:40px;text-align:center}
.sc.c .fl,.sc.c .bt{text-align:left}.sc.c .bt{text-align:center}
.sc>*{animation:up .5s cubic-bezier(.2,.8,.2,1) both}
.sc>*:nth-child(2){animation-delay:.05s}.sc>*:nth-child(3){animation-delay:.1s}.sc>*:nth-child(4){animation-delay:.15s}.sc>*:nth-child(5){animation-delay:.2s}.sc>*:nth-child(6){animation-delay:.25s}.sc>*:nth-child(n+7){animation-delay:.3s}
@keyframes in{from{opacity:0}to{opacity:1}}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes flt{50%{transform:translateY(-9px)}}
@keyframes pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
.im{mix-blend-mode:screen;display:block}
:root[data-t=light] .im{mix-blend-mode:normal;background:#0c0c0e;border-radius:22px}
.fl8{animation:flt 4s ease-in-out infinite}
.m{color:var(--mut);font-size:13px}.mb{margin:0 0 16px}.c{text-align:center}
.h2{font-size:26px;font-weight:700;margin:6px 0 6px;letter-spacing:-.01em}
.mh{margin:0 0 14px;font-size:18px}
.tb{display:flex;align-items:center;gap:12px;margin-bottom:16px;font-size:18px;font-weight:600}
.bk{background:none;border:0;color:var(--tx);padding:4px;margin-left:-4px;cursor:pointer;display:flex;transition:transform .2s}.bk:active{transform:translateX(-3px)}
.bt{font:inherit;font-weight:600;font-size:15px;border:1px solid var(--ln);border-radius:14px;padding:15px;width:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;background:var(--hl);color:var(--tx);transition:transform .15s,opacity .2s,filter .2s}
.bt:active{transform:scale(.97)}.bt:hover{filter:brightness(1.08)}.bt:disabled{opacity:.5}
.bt.p{background:var(--pb);color:var(--pt);border-color:var(--pb)}.bt.out{background:none;color:var(--bad);border-color:rgba(248,113,113,.35)}.bt.sm{width:auto;padding:9px 14px;font-size:13px;margin:0}
.fl{display:flex;align-items:center;gap:12px;background:var(--pn);border:1px solid var(--ln);border-radius:14px;padding:0 14px;margin-bottom:12px;color:var(--mut);transition:border-color .2s}
.fl:focus-within{border-color:var(--mut)}
input{font:inherit;color:var(--tx);background:none;border:0;outline:0;width:100%;padding:15px 0;min-width:0}
input.in{background:var(--pn);border:1px solid var(--ln);border-radius:14px;padding:15px 14px;margin-bottom:14px;transition:border-color .2s}input.in:focus{border-color:var(--mut)}
input[type=number]{-moz-appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
label{display:block;font-size:13px;margin:0 0 8px;color:var(--mut)}
.er{color:var(--bad);font-size:13px;min-height:20px;margin:6px 0;text-align:center}
.lk{color:var(--mut);font-size:13px;cursor:pointer}.lk.u{color:var(--tx);text-decoration:underline}
.hp{width:230px;margin:10px auto}.lg{width:96px;margin:0 auto 6px}.sm{width:34px}.xl{font-size:34px;margin:6px 0}
.sub{color:var(--mut);margin:0 0 26px;line-height:1.5}
.dts{display:flex;gap:6px;justify-content:center;margin-top:18px}.dts i{width:6px;height:6px;border-radius:50%;background:var(--ln)}.dts i.on{background:var(--tx);width:18px;border-radius:4px}
.hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.br{display:flex;align-items:center;gap:8px;font-weight:700}
.rt{display:flex;align-items:center;gap:14px}.ib0{position:relative;background:none;border:0;color:var(--tx);padding:0;cursor:pointer}
.dot{position:absolute;top:-2px;right:-2px;width:9px;height:9px;border-radius:50%;background:#ef4444;animation:pop .4s both}
.av{width:36px;height:36px;border-radius:50%;background:var(--hl);display:grid;place-items:center;font-weight:600;overflow:hidden;flex:none;object-fit:cover}.av.big{width:56px;height:56px;font-size:22px}
.avw{cursor:pointer;transition:transform .2s}.avw:active{transform:scale(.92)}
.cd{background:var(--pn);border:1px solid var(--ln);border-radius:18px;padding:16px;margin-bottom:14px;transition:transform .2s,border-color .2s}
.tot{display:flex;gap:14px;align-items:center;cursor:pointer}.tot:hover,.tcard:hover{transform:translateY(-2px);border-color:var(--mut)}
.ib{width:48px;height:48px;border-radius:14px;background:var(--hl);display:grid;place-items:center;flex:none}.ib.s2{width:38px;height:38px;border-radius:11px}
.sv{font-size:24px;font-weight:700}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.g3 .cd{margin:0;padding:12px}.g3 b{font-size:22px}
.g2{display:flex;justify-content:space-between;margin:12px 0 14px}.g2 div:last-child{text-align:right}
.sec{display:flex;justify-content:space-between;align-items:center;margin:8px 0 12px}.sec span{cursor:pointer}
.tg2{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.tg2 .cd{margin:0}
.tt{display:flex;gap:12px;align-items:center}.tt b{font-size:14px}.tt .sv{font-size:15px}
.th,.dth{width:52px;height:52px;border-radius:12px;object-fit:cover;background:var(--hl);flex:none}.dth{width:84px;height:84px;border-radius:14px}
.pr{display:flex;align-items:center;gap:8px;margin:12px 0 8px;font-size:12px}.bar{flex:1;height:8px;border-radius:9px;background:var(--hl);overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--tx);border-radius:9px;transition:width 1s cubic-bezier(.2,.8,.2,1)}
.drop{border:1px dashed var(--mut);border-radius:16px;padding:26px;text-align:center;color:var(--mut);margin-bottom:16px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;background:center/cover;transition:border-color .2s}.drop b{color:var(--tx)}
.drop.has{min-height:150px;justify-content:center;color:#fff;text-shadow:0 1px 4px #000}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.chip{padding:10px 16px;border-radius:12px;border:1px solid var(--ln);background:var(--hl);font-size:13px;cursor:pointer;transition:transform .15s,background .2s}.chip:active{transform:scale(.95)}.chip.on{background:var(--pb);color:var(--pt);font-weight:600}.chip.big{flex:1;text-align:center;min-width:28%}
.jar{width:190px;margin:18px auto 0}.hint{text-align:center;cursor:pointer;margin-top:16px}
.hr{display:flex;gap:12px;align-items:center;background:var(--pn);border:1px solid var(--ln);border-radius:14px;padding:12px;margin-bottom:10px;font-size:13px}.hr b{font-size:13px}
.gw{flex:1;min-width:0}.gw b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.up{color:var(--ok)}.ot{color:var(--bad)}
.tabs{display:flex;gap:8px;margin-bottom:16px}.tabs div{flex:1;text-align:center;padding:11px;border-radius:12px;background:var(--hl);font-size:13px;cursor:pointer;transition:background .2s}.tabs .on{background:var(--pb);color:var(--pt);font-weight:600}
.nt{display:flex;gap:12px;align-items:center;background:var(--pn);border:1px solid var(--ln);border-radius:16px;padding:14px;margin-bottom:12px;font-size:13px}.nb{width:44px;flex:none}.nt b{font-size:14px}
.sw{width:50px;height:28px;border-radius:20px;background:var(--ln);position:relative;cursor:pointer;flex:none;transition:background .25s}.sw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:left .25s cubic-bezier(.3,1.4,.5,1)}.sw.on{background:#6b6b70}.sw.on i{left:25px}
.rd{display:flex;gap:12px;align-items:center;padding:8px 0;cursor:pointer;font-size:14px}.rd i{width:20px;height:20px;border-radius:50%;border:2px solid var(--mut);display:grid;place-items:center;flex:none}.rd.on i:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--tx);animation:pop .25s both}
.pf{display:flex;gap:14px;align-items:center}.pf .av{cursor:pointer}
.rg{padding:4px 16px}.rw{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--ln);font-size:14px;cursor:pointer}.rw:last-child{border:0}.rw span{display:flex;align-items:center;gap:10px}.rw.red{color:var(--bad)}
.ch{width:100%;height:110px;display:block}.ch polyline{stroke-dasharray:1000;stroke-dashoffset:1000;animation:dr 1.4s .2s ease forwards}@keyframes dr{to{stroke-dashoffset:0}}
.lb2{display:flex;justify-content:space-between;font-size:11px;color:var(--mut);margin-top:6px}
.rk{width:26px;text-align:center;font-weight:700;color:var(--mut)}.rk1{color:#facc15}.rk2{color:#cbd5e1}.rk3{color:#d28b4f}
.lb.me{border-color:var(--mut)}.rgt{text-align:right;flex:none}
.nav{position:fixed;bottom:0;left:0;right:0;background:var(--pn);border-top:1px solid var(--ln);padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));z-index:10;animation:in .4s both}
.ni{max-width:580px;margin:0 auto;display:flex;align-items:center}
.ni div{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;color:var(--mut);flex:1;cursor:pointer;transition:color .2s,transform .15s}.ni div:active{transform:scale(.92)}.ni .on{color:var(--tx)}
.ni .fab{width:52px;height:52px;border-radius:50%;background:var(--pb);color:var(--pt);justify-content:center;flex:none;margin-top:-22px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.md{position:fixed;inset:0;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:24px;z-index:30;animation:in .2s both}
.bx{background:var(--pn);border:1px solid var(--ln);border-radius:20px;padding:22px;max-width:400px;width:100%;max-height:85vh;overflow:auto;animation:pop .25s cubic-bezier(.2,1.2,.4,1) both}.row{display:flex;gap:10px}.row>*{flex:1}
.md.dr{justify-content:flex-start;align-items:stretch;padding:0}.dp{background:var(--bg);width:84%;max-width:340px;padding:20px 18px;overflow:auto;border-right:1px solid var(--ln);animation:sl .3s cubic-bezier(.2,.8,.2,1) both}@keyframes sl{from{transform:translateX(-100%)}to{transform:none}}
.cl{max-height:48vh;overflow:auto;margin-top:6px}.cl .rw{padding:12px 0}
#toast{position:fixed;top:calc(env(safe-area-inset-top,0px) + 12px);left:50%;transform:translate(-50%,-170%);width:calc(100% - 28px);max-width:420px;background:var(--pn);border:1px solid var(--ln);box-shadow:0 8px 30px rgba(0,0,0,.4);border-radius:18px;padding:14px;z-index:40;transition:transform .45s cubic-bezier(.2,1.2,.4,1);display:flex;gap:12px;cursor:pointer;font-size:13px;color:var(--mut)}
#toast.on{transform:translate(-50%,0)}#toast b{display:block;color:var(--tx);font-size:14px;margin-bottom:2px}
#cv{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
.dn{position:relative}.dn .im{width:230px;margin:0 auto;animation:pop .6s both,flt 4s 1s ease-in-out infinite}
.ld{width:30px;height:30px;border-radius:50%;border:3px solid var(--ln);border-top-color:var(--tx);animation:spin .8s linear infinite;margin:auto}
@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}
