:root{--primary:#30afff;--primary-dark:#1b87cc;--primary-soft:#e8f6ff;--primary-line:#c9e9ff;--bg:#f7f9fc;--surface:#fff;--text:#243447;--muted:#718096;--faint:#a0aec0;--border:#e2e8f0;--track:#edf2f7;--dash:#cbd6e2;--ok:#4a8c6f;--ok-soft:#4a8c6f1a;--ok-bar:#8fd6a8;--danger:#d64550;--shadow:0 1px 2px #2434470a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;line-height:1.45}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0}a{color:inherit;text-decoration:none}.num{font-variant-numeric:tabular-nums}.shell{background:var(--bg);max-width:430px;min-height:100dvh;margin:0 auto;position:relative}.wrap{padding:18px 20px calc(112px + env(safe-area-inset-bottom));flex-direction:column;gap:16px;display:flex}.wrap.flat{padding-bottom:calc(96px + env(safe-area-inset-bottom))}.h1{font-size:21px}.h1,.h2{letter-spacing:-.02em;font-weight:600}.h2{font-size:22px}.sec{letter-spacing:-.01em;font-size:15px;font-weight:600}.sub{font-size:13px}.sub,.tiny{color:var(--muted)}.link,.tiny{font-size:12px}.link{color:var(--primary);font-weight:500}.between{justify-content:space-between}.between,.rowx{align-items:center;display:flex}.rowx{gap:12px}.col{flex-direction:column;display:flex}.gap8{gap:8px}.gap10{gap:10px}.gap12{gap:12px}.gap16{gap:16px}.grid2{grid-template-columns:1fr 1fr;gap:12px;display:grid}.hero{background:var(--primary-soft);border:1px solid var(--primary-line);border-radius:18px;padding:20px}.hero-l{color:var(--primary);letter-spacing:.02em;font-size:12px;font-weight:600}.hero-v{letter-spacing:-.03em;margin-top:6px;font-size:33px;font-weight:700}.card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;padding:16px}.card.lg{border-radius:18px;padding:20px}.stat-l{color:var(--muted);font-size:12px}.stat-v{margin-top:6px;font-size:17px;font-weight:600}.list{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;overflow:hidden}.item{text-align:left;align-items:center;gap:12px;width:100%;padding:14px 16px;display:flex}.sep{background:var(--track);height:1px;margin:0 16px}.av{background:var(--primary-soft);width:38px;height:38px;color:var(--primary-dark);border-radius:999px;flex:none;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex}.av.mute{color:var(--muted)}.av.mute,.ic{background:var(--bg)}.ic{border:1px solid var(--border);border-radius:11px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.grow{flex:1;min-width:0}.name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.meta{color:var(--muted);margin-top:2px;font-size:12px}.amt{font-size:14px}.amt,.badge{font-weight:600}.badge{color:var(--primary);background:var(--primary-soft);white-space:nowrap;border-radius:999px;padding:5px 10px;font-size:11px}.badge.ok{color:var(--ok);background:var(--ok-soft)}.badge.grey{color:var(--muted);background:var(--track)}.pill{align-items:center;gap:6px;padding:7px 12px;font-size:12px;font-weight:600;display:inline-flex}.chip,.pill{background:var(--surface);border:1px solid var(--border);border-radius:999px}.chip{color:var(--muted);white-space:nowrap;padding:8px 14px;font-size:13px;font-weight:500}.chip.on{background:var(--primary-soft);border-color:var(--primary-line);color:var(--primary-dark);font-weight:600}.scroller{scrollbar-width:none;gap:8px;padding-bottom:2px;display:flex;overflow-x:auto}.scroller::-webkit-scrollbar{display:none}.field{background:var(--surface);border:1px solid var(--border);border-radius:14px;align-items:center;gap:10px;height:48px;padding:0 14px;display:flex}.field.tall{height:52px}.field:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #30afff1f}.field input{background:0 0;border:0;outline:0;flex:1;width:100%;min-width:0;font-size:14px}.field input::placeholder{color:var(--faint)}.field select{background:0 0;border:0;outline:0;flex:1;font-size:14px}.lbl{color:var(--muted);margin-bottom:8px;font-size:12px}.btn{border-radius:14px;justify-content:center;align-items:center;gap:8px;width:100%;height:50px;font-size:15px;font-weight:600;display:flex}.btn.p{background:var(--primary);color:#fff}.btn.d{background:var(--primary-dark);color:#fff}.btn.o{background:var(--surface);border:1px solid var(--border);color:var(--text)}.btn:disabled{opacity:.45}.dashed{border:1px dashed var(--dash);color:var(--primary);border-radius:16px;align-items:center;gap:12px;width:100%;padding:14px 16px;font-size:14px;font-weight:600;display:flex}.track{background:#fff;border-radius:999px;height:8px;display:flex;overflow:hidden}.track.thin{background:var(--track);height:6px}.track i{background:var(--primary);height:100%;display:block}.track i.ok{background:var(--ok-bar)}.steps{gap:6px;display:flex}.steps i{background:var(--border);border-radius:999px;flex:1;height:4px}.steps i.on{background:var(--primary)}.tabs{background:var(--track);border-radius:14px;gap:6px;padding:4px;display:flex}.tabs button{height:40px;color:var(--muted);border-radius:11px;flex:1;font-size:13px;font-weight:500}.tabs button.on{color:var(--text);background:#fff;font-weight:600;box-shadow:0 1px 2px #2434470f}.topbar{gap:14px;padding:16px 20px 0}.back,.topbar{align-items:center;display:flex}.back{border:1px solid var(--border);border-radius:12px;flex:none;justify-content:center;width:38px;height:38px}.back,.sticky{background:var(--surface)}.sticky{border-top:1px solid var(--border);padding:14px 20px calc(20px + env(safe-area-inset-bottom));z-index:30;max-width:430px;margin:0 auto;position:fixed;bottom:0;left:0;right:0}.sticky.above-nav{bottom:calc(76px + env(safe-area-inset-bottom))}.fab{right:max(20px,50vw - 195px);bottom:calc(88px + env(safe-area-inset-bottom));background:var(--primary-dark);color:#fff;letter-spacing:-.01em;z-index:25;border-radius:999px;align-items:center;gap:6px;height:42px;padding:0 15px;font-size:13px;font-weight:600;display:flex;box-shadow:0 8px 18px -8px #1b87cc7a}.fab,.nav{position:fixed}.nav{height:calc(76px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--border);z-index:20;grid-template-columns:repeat(4,1fr);align-items:start;max-width:430px;margin:0 auto;padding-top:12px;display:grid;bottom:0;left:0;right:0}.nav a{color:var(--faint);flex-direction:column;align-items:center;gap:5px;font-size:11px;font-weight:500;display:flex}.nav a.on{color:var(--primary);font-weight:600}.scrim{z-index:40;background:#24344747;inset:0}.scrim,.sheet{position:fixed}.sheet{background:var(--surface);padding:14px 20px calc(28px + env(safe-area-inset-bottom));z-index:41;border-radius:26px 26px 0 0;max-width:430px;max-height:88dvh;margin:0 auto;bottom:0;left:0;right:0;overflow-y:auto;box-shadow:0 -12px 40px -12px #24344740}.handle{background:var(--border);border-radius:999px;width:40px;height:4px;margin:0 auto 18px}.prod{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);text-align:left;border-radius:16px;flex-direction:column;align-items:flex-start;min-height:118px;padding:16px;display:flex}.prod.on{border:1.5px solid var(--primary);box-shadow:0 0 0 3px #30afff1f}.prod .pic{background:var(--primary-soft);border-radius:12px;justify-content:center;width:36px;height:36px;margin-bottom:14px}.prod .pic,.qty{align-items:center;display:flex}.qty{background:var(--bg);border:1px solid var(--border);border-radius:14px;justify-content:space-between;height:56px;padding:0 8px}.qty b{font-size:20px;font-weight:600}.qbtn{border:1px solid var(--border);background:#fff;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.qbtn.p{background:var(--primary);border-color:var(--primary)}.price{border:1.5px solid var(--primary);background:#fff;border-radius:14px;align-items:center;gap:10px;height:56px;padding:0 16px;display:flex;box-shadow:0 0 0 3px #30afff1f}.price input{background:0 0;border:0;outline:0;flex:1;width:100%;min-width:0;font-size:18px;font-weight:600}.subtotal{background:var(--primary-soft);border-radius:14px;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.subtotal span{color:var(--primary-dark);font-size:13px;font-weight:500}.subtotal b{letter-spacing:-.02em;font-size:18px;font-weight:700}.sel{background:var(--primary);border-radius:999px;flex:none;justify-content:center;align-items:center;width:22px;height:22px;display:flex}.picked{border:1.5px solid var(--primary)!important}.empty{text-align:center;color:var(--muted);padding:34px 10px}.empty,.err{font-size:13px}.err{color:#b3323c;background:#fdecee;border-radius:12px;padding:11px 14px}.spin{text-align:center;width:100%;color:var(--muted);padding:30px 0;font-size:13px}.center{flex-direction:column;justify-content:center;min-height:100dvh;padding:28px 24px;display:flex}body,html{overscroll-behavior-y:contain}body{touch-action:manipulation;-webkit-user-select:none;user-select:none}input,select,textarea{-webkit-user-select:text;user-select:text}.shell{overflow-x:hidden}.back,.btn,.chip,.dashed,.nav a,.pill,.prod,.qbtn,.tabs button,a.card,a.item,button.card,button.item{isolation:isolate;position:relative;overflow:hidden}.fab{isolation:isolate;overflow:hidden}.rp{opacity:.18;pointer-events:none;z-index:0;background:currentColor;border-radius:999px;animation:.58s cubic-bezier(.2,0,0,1) forwards rp;position:absolute;transform:scale(0)}@keyframes rp{to{opacity:0;transform:scale(1)}}.btn.d .rp,.btn.p .rp,.fab .rp,.qbtn.p .rp{opacity:.32;background:#fff}.back,.btn,.chip,.dashed,.fab,.pill,.prod,.qbtn,.tabs button{transition:transform .13s cubic-bezier(.2,0,0,1),box-shadow .13s,background .15s}.back:active,.btn:active,.chip:active,.dashed:active,.pill:active,.qbtn:active,.tabs button:active{transform:scale(.962)}.prod:active{transform:scale(.955)}.fab:active{transform:scale(.935);box-shadow:0 4px 12px -6px #1b87cc8c}a.card:active,a.item:active,button.card:active,button.item:active{background:#f1f5fa}a.card,a.item,button.card,button.item{transition:background .16s}.btn:disabled{transform:none!important}.pb-enter-active,.pb-leave-active,.pf-enter-active,.pf-leave-active{transition:transform .24s cubic-bezier(.2,0,0,1),opacity .18s}.pf-enter-from{opacity:0;transform:translate(30px)}.pf-leave-to{opacity:0;transform:translate(-18px)}.pb-enter-from{opacity:0;transform:translate(-30px)}.pb-leave-to{opacity:0;transform:translate(30px)}.sheet-enter-active{animation:.3s cubic-bezier(.2,0,0,1) shUp}.sheet-leave-active{animation:.22s cubic-bezier(.4,0,1,1) reverse shUp}@keyframes shUp{0%{transform:translateY(101%)}to{transform:translateY(0)}}.fade-enter-active,.fade-leave-active{transition:opacity .24s}.fade-enter-from,.fade-leave-to{opacity:0}.sk{background:linear-gradient(90deg,#e9eef5 25%,#f6f9fc 37%,#e9eef5 63%) 0 0/400% 100%;border-radius:10px;animation:1.3s ease-in-out infinite skm}@keyframes skm{0%{background-position:100%}to{background-position:0}}.sk-card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;padding:16px}.ld{border:2px solid #ffffff61;border-top-color:#fff;border-radius:999px;width:16px;height:16px;animation:.7s linear infinite spin;display:inline-block}.ld.dark{border-color:#24344738;border-top-color:var(--primary)}@keyframes spin{to{transform:rotate(1turn)}}.snack{left:50%;bottom:calc(96px + env(safe-area-inset-bottom));color:#fff;z-index:80;background:#243447;border-radius:13px;width:calc(100% - 40px);max-width:360px;padding:13px 18px;font-size:13px;font-weight:500;position:fixed;transform:translate(-50%);box-shadow:0 14px 30px -12px #00000080}.snack.bad{background:#b3323c}.snack.good{background:#2f6b51}.snack-enter-active,.snack-leave-active{transition:opacity .22s,transform .22s cubic-bezier(.2,0,0,1)}.snack-enter-from,.snack-leave-to{opacity:0;transform:translate(-50%,16px)}.dlg{background:var(--surface);z-index:81;border-radius:24px;width:calc(100% - 56px);max-width:330px;padding:24px 22px 14px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 24px 60px -18px #24344780}.dlg h3{letter-spacing:-.02em;margin-bottom:8px;font-size:18px;font-weight:600}.dlg p{color:var(--muted);margin-bottom:18px;font-size:13px}.dlg-act{justify-content:flex-end;gap:6px;display:flex}.dlg-act button{height:44px;color:var(--primary-dark);border-radius:12px;padding:0 18px;font-size:14px;font-weight:600;position:relative;overflow:hidden}.dlg-act button.danger{color:var(--danger)}.dlg-enter-active,.dlg-leave-active{transition:opacity .2s,transform .2s cubic-bezier(.2,0,0,1)}.dlg-enter-from,.dlg-leave-to{opacity:0;transform:translate(-50%,-50%)scale(.9)}.nav a{gap:3px}.nav .navic{border-radius:999px;justify-content:center;align-items:center;width:46px;height:28px;transition:background .24s cubic-bezier(.2,0,0,1);display:flex;position:relative}.nav a.on .navic{background:var(--primary-soft)}.nav a span:last-child{transition:color .2s}.wrap>*{animation:.3s cubic-bezier(.2,0,0,1) backwards fadeUp}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}}.handle{cursor:grab}.wrap>:nth-child(2){animation-delay:40ms}.wrap>:nth-child(3){animation-delay:80ms}.wrap>:nth-child(4){animation-delay:.115s}.wrap>:nth-child(5){animation-delay:.145s}.wrap>:nth-child(n+6){animation-delay:.17s}.field input,.field select,.price input,input,select,textarea{font-size:16px}.field input::placeholder{font-size:15px}.fab,.nav{transition:transform .22s cubic-bezier(.2,0,0,1),opacity .18s,background .15s}html.kb-open .fab{opacity:0;pointer-events:none;transform:translateY(180%)}html.kb-open .nav{opacity:0;pointer-events:none;transform:translateY(110%)}html.kb-open .wrap{padding-bottom:32px}html.kb-open .sticky{bottom:0}.pinwrap{min-height:100dvh;padding:52px 24px calc(30px + env(safe-area-inset-bottom));flex-direction:column;justify-content:space-between;gap:28px;display:flex}.pinlogo{background:var(--primary-soft);border-radius:19px;align-items:center;width:58px;height:58px;margin:0 auto 18px}.dots,.pinlogo{justify-content:center;display:flex}.dots{gap:15px;margin-top:26px}.dot{border:1.5px solid var(--dash);border-radius:999px;width:14px;height:14px;transition:transform .18s cubic-bezier(.2,0,0,1),background .18s,border-color .18s}.dot.on{background:var(--primary);border-color:var(--primary);transform:scale(1.15)}.dot.bad{background:var(--danger);border-color:var(--danger)}.pinmsg{min-height:20px;color:var(--muted);margin-top:18px;font-size:13px}.pinmsg.bad{color:var(--danger);font-weight:500}.keys{grid-template-columns:repeat(3,1fr);gap:13px;width:100%;max-width:300px;margin:0 auto;display:grid}.key{background:var(--surface);border:1px solid var(--border);height:64px;box-shadow:var(--shadow);isolation:isolate;border-radius:999px;justify-content:center;align-items:center;font-size:23px;font-weight:500;transition:transform .12s cubic-bezier(.2,0,0,1),background .15s;display:flex;position:relative;overflow:hidden}.key:active{background:var(--primary-soft);transform:scale(.92)}.key.ghost{box-shadow:none;background:0 0;border-color:#0000}.key:disabled{opacity:.4}@keyframes shk{10%,90%{transform:translate(-7px)}30%,70%{transform:translate(8px)}50%{transform:translate(-5px)}}.shk{animation:.45s cubic-bezier(.36,.07,.19,.97) shk}.chip:disabled{opacity:.38}