:root{--bg:#0e0f13;--card:#171921;--card2:#1f222c;--line:#2a2e3a;--tx:#f2f3f7;--mut:#8b90a0;--acc:#ff6a2b;--acc2:#ffb347;--ok:#34c77b;--warn:#f5a524;--bad:#ef4d5e;--r:16px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html,body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.35 -apple-system,"SF Pro Text",Roboto,system-ui,sans-serif}
body{padding-bottom:96px;overscroll-behavior-y:none}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:rgba(14,15,19,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{font-weight:800;font-size:21px;letter-spacing:-.4px}.brand span{color:var(--acc)}
.point{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:13px;max-width:62%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.point.need{border-color:var(--acc);box-shadow:0 0 0 3px rgba(255,106,43,.18)}
.adminbar{display:flex;align-items:center;gap:8px;padding:8px 14px;background:#2a1a10;border-bottom:1px solid #4a2c18;font-size:13px}
.adminbar b{flex:1;color:var(--acc2)}.adminbar button{background:var(--acc);color:#111;border-radius:10px;padding:6px 10px;font-weight:600}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:12px 14px 4px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;padding:9px 14px;border-radius:12px;background:var(--card);border:1px solid var(--line);color:var(--mut);font-weight:600;white-space:nowrap}
.tab.on{background:var(--acc);border-color:var(--acc);color:#111}
.tools{padding:8px 14px 0}
#search{width:100%;padding:11px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);outline:none}
#search:focus{border-color:var(--acc)}
.brands{display:flex;gap:6px;overflow-x:auto;padding:10px 0 2px;scrollbar-width:none}.brands::-webkit-scrollbar{display:none}
.chip{flex:none;padding:6px 11px;border-radius:999px;background:transparent;border:1px solid var(--line);color:var(--mut);font-size:13px}
.chip.on{border-color:var(--acc);color:var(--acc)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px 14px}
@media(min-width:640px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-align:left;display:flex;flex-direction:column;transition:transform .12s}
.card:active{transform:scale(.98)}
.card .ph{position:relative;aspect-ratio:1/1;background:#0a0b0e;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;display:block}
.badge{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(0,0,0,.65);backdrop-filter:blur(6px)}
.badge.in{color:var(--ok)}.badge.pre{color:var(--warn)}.badge.hid{color:var(--bad)}
.card .meta{padding:9px 10px 11px}
.card .b{font-size:12px;color:var(--mut)}.card .n{font-weight:700;margin:1px 0 4px}
.card .p{font-weight:800;color:var(--acc2)}.card .p.none{color:var(--mut);font-weight:500;font-size:12px}
.card .cnt{font-size:12px;color:var(--mut)}
.empty{text-align:center;color:var(--mut);padding:40px}
.cartbar{position:fixed;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:30;background:var(--acc);color:#111;border-radius:16px;padding:14px 16px;font-weight:800;display:flex;justify-content:space-between;box-shadow:0 10px 30px rgba(255,106,43,.35)}
.fab{position:fixed;right:14px;bottom:calc(78px + env(safe-area-inset-bottom));z-index:29;background:#2a1a10;border:1px solid #4a2c18;color:var(--acc2);border-radius:999px;padding:9px 13px;font-weight:700}
.fab.on{background:var(--acc2);color:#111}
.sheet{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end}
.sheet[hidden]{display:none}
.sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.sheet-box{position:relative;width:100%;max-height:92vh;overflow-y:auto;background:var(--bg);border-radius:22px 22px 0 0;border:1px solid var(--line);padding:16px 14px calc(20px + env(safe-area-inset-bottom));animation:up .2s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:0}}
.sheet-x{position:sticky;top:0;float:right;z-index:2;width:34px;height:34px;border-radius:50%;background:var(--card2);color:var(--mut)}
.hero{width:100%;max-height:260px;object-fit:cover;border-radius:14px;background:#0a0b0e;display:block;margin:4px 0 12px}
h2{margin:0 0 2px;font-size:20px}.sub{color:var(--mut);margin-bottom:10px}
.price{font-size:20px;font-weight:800;color:var(--acc2);margin:6px 0 12px}
.row{display:flex;align-items:center;gap:10px;padding:9px;background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.row img{width:46px;height:46px;border-radius:9px;object-fit:cover;background:#0a0b0e;flex:none}
.row .t{flex:1;min-width:0}.row .t b{display:block;font-weight:600;overflow-wrap:anywhere}
.st{font-size:12px}.st.in{color:var(--ok)}.st.pre{color:var(--warn)}
.step{display:flex;align-items:center;gap:2px;flex:none}
.step button{width:34px;height:34px;border-radius:10px;background:var(--card2);font-size:18px;font-weight:700}
.step span{min-width:26px;text-align:center;font-weight:700}
.btn{display:block;width:100%;padding:14px;border-radius:14px;background:var(--acc);color:#111;font-weight:800;font-size:16px;margin-top:10px}
.btn.sec{background:var(--card2);color:var(--tx)}.btn.bad{background:#3a1a1f;color:var(--bad)}
.btn[disabled]{opacity:.45}
label.f{display:block;margin:10px 0 4px;color:var(--mut);font-size:13px}
.inp{width:100%;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--card);outline:none}
.inp:focus{border-color:var(--acc)}
textarea.inp{min-height:64px;resize:vertical}
.pts{display:grid;gap:8px}
.pt{padding:13px;border-radius:12px;background:var(--card);border:1px solid var(--line);text-align:left;font-weight:600}
.pt.on{border-color:var(--acc);background:#22150d}
.sum{display:flex;justify-content:space-between;font-weight:800;font-size:17px;margin:12px 0 2px}
.note{color:var(--mut);font-size:12.5px;margin-top:6px}
.adm{border:1px dashed #6a4222;background:#1c130c;border-radius:12px;padding:10px;margin:10px 0}
.adm .line{display:flex;gap:8px;align-items:center;margin:6px 0}.adm .inp{padding:8px 10px}
.adm .small{padding:8px 10px;border-radius:9px;background:var(--card2);font-size:13px;white-space:nowrap}
.num{width:64px;text-align:center}.adm .num{width:92px}
.ord{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:8px;font-size:13px}
.ord pre{white-space:pre-wrap;margin:6px 0;font:inherit;color:var(--tx)}
.ord .acts{display:flex;gap:8px}.ord .acts button{flex:1;padding:9px;border-radius:10px;background:var(--card2);font-weight:700}
.done{text-align:center;padding:24px 8px}.done .big{font-size:54px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(88px + env(safe-area-inset-bottom));z-index:99;background:#000d;color:#fff;padding:10px 14px;border-radius:12px;font-size:14px;max-width:88%}

.age18{font-size:11px;font-weight:700;padding:2px 6px;border:1px solid currentColor;border-radius:6px;opacity:.8;vertical-align:middle;margin-left:6px}
.age-note{font-size:11px;opacity:.65;text-align:center;padding:4px 10px}

.note{font-size:12px;color:var(--mut);margin:0 0 8px;line-height:1.35}
select.inp{appearance:auto}
.cd,.cdl{font-weight:700;font-variant-numeric:tabular-nums;color:var(--acc);margin:8px 0}
.mybar{padding:8px 14px 0}
.my{background:var(--card);border:1px solid var(--acc);border-radius:var(--r);padding:12px;margin-bottom:8px}
.my .sub{margin:2px 0 8px}
.my .acts{display:flex;gap:6px;flex-wrap:wrap}
.my .acts button{flex:1;min-width:90px;padding:9px 6px;border-radius:10px;border:1px solid var(--line);background:var(--card2);font-size:13px}