: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;overflow-x:hidden}.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(96px + env(safe-area-inset-bottom));background:var(--primary-dark);color:#fff;z-index:25;border-radius:999px;align-items:center;gap:8px;height:48px;padding:0 20px;font-size:14px;font-weight:600;display:flex;box-shadow:0 10px 24px -8px #1b87cc80}.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}