.drawer-head .fav{position:static}
.pop{max-width:min(320px,90vw);padding:14px 16px;border-radius:var(--rs);border:var(--b);background:var(--sf);color:var(--tx)}
dialog{border:0;padding:0;color:var(--tx);background:var(--sf);max-width:none;max-height:none}
dialog::backdrop{background:#0006}
.sheet{position:fixed;inset:auto 0 0;margin:0;width:100%;max-height:88vh;border-radius:20px 20px 0 0;display:none;flex-direction:column}
.sheet[open],.drawer[open]{display:flex}
.sheet-head,.drawer-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px;border-bottom:var(--b)}
.sheet-head h2{margin:0}
.nav-btns{display:flex;gap:8px;margin-right:auto}
.sheet-body{overflow-y:auto;padding:4px 16px 16px}
.sheet-foot{display:flex;gap:8px;justify-content:flex-end;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:var(--b)}
.sheet-foot .primary{flex:1}
.drawer{position:fixed;inset:0;margin:0;width:100%;height:100%;flex-direction:column;overflow-y:auto}
.gallery{--g:0px;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;background:var(--sk);flex:none}
.gallery img{flex:none;width:100%;max-height:60vh;aspect-ratio:3/4;object-fit:contain;scroll-snap-align:center}
.drawer-body{padding:16px 16px 40px}
.fix{margin:12px 0}
.fix summary{color:var(--ac);font-weight:550}
.pricebox{display:grid;gap:6px;margin:16px 0;padding:12px 14px;border-radius:var(--rs);background:var(--sk)}
.pricebox div{display:flex;justify-content:space-between;gap:8px}
.pricebox .total{border-top:var(--b);padding-top:6px;font-size:1.1rem}
.seller{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bars{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.bars li{display:grid;grid-template-columns:8.5em 1fr 2.5em;gap:8px;align-items:center;font-size:.88rem}
meter{width:100%;height:10px}
.specs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:4px 12px;font-size:.88rem}
.specs dt{color:var(--mu)}
.specs dd{margin:0;overflow-wrap:anywhere}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;transition:.25s;background:var(--tx);color:var(--bg);padding:12px 18px;z-index:60;pointer-events:none;max-width:90vw}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (min-width:700px){.sheet{inset:0;margin:auto;width:min(560px,92vw);border-radius:20px;max-height:85vh}.drawer{inset:0 0 0 auto;width:min(480px,100vw);box-shadow:-10px 0 40px #0003}}
.sheet{max-height:88dvh}.sheet[open]{animation:up .2s ease-out}.drawer[open]{animation:fade .15s}@keyframes up{from{transform:translateY(24px);opacity:0}}@keyframes fade{from{opacity:0}}
.sheet-body{padding:0 16px 8px}.fs{border-bottom:var(--b)}.fs>summary{align-items:center;min-height:52px;font-weight:600;cursor:pointer}.fs>summary::after{content:"▾";color:var(--mu)}.fs:not([open])>summary::after{content:"▸"}
.fs-t{flex:1}.sum{max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ac);font-size:.85rem;font-weight:500}.sum:empty{display:none}.fs-b{display:grid;gap:10px;padding:0 0 16px}.fs-b .two{margin:0}
.nmax{display:none;gap:4px;font-size:.85rem;color:var(--mu)}.fs:has(input[value=numbered_max]:checked) .nmax{display:grid}.hint{margin:0;font-size:.85rem}.pos{align-self:center;min-width:4.2em;text-align:center;font-size:.85rem;color:var(--mu)}
.check{position:relative}.check input[type]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.check:has(input:focus-visible){outline:3px solid var(--ac);outline-offset:2px}.check:has(input[type=checkbox]:checked) span::before{content:"✓ ";color:var(--ac);font-weight:700}.check:has(input:checked){font-weight:600}.check[hidden]{display:none}
.totop{position:fixed;right:16px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:6;width:44px;height:44px;display:grid;place-items:center;border:var(--b);border-radius:99px;background:var(--gl);backdrop-filter:blur(8px);color:var(--tx);box-shadow:var(--sh);cursor:pointer}.totop[hidden]{display:none}.totop svg{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
[data-hscroll]{user-select:none}[data-hscroll].dragging{cursor:grabbing}[data-hscroll].dragging *{pointer-events:none}
.hs-a{position:sticky;flex:none;width:0;z-index:3}.hs-l{left:8px;margin-right:calc(-1*var(--g,8px))}.hs-r{right:8px;margin-left:calc(-1*var(--g,8px))}
.hs-b{position:absolute;top:50%;translate:0 -50%;width:44px;height:44px;display:grid;place-items:center;padding:0;border:var(--b);border-radius:99px;background:var(--sf);color:var(--tx);box-shadow:0 2px 10px #0003;cursor:pointer}.hs-l .hs-b{left:0}.hs-r .hs-b{right:0}.hs-b:hover{background:var(--as)}.hs-b svg{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover) and (pointer:fine){.can-l>.hs-l,.can-r>.hs-r{display:block}}
.gal{position:relative;flex:none}.gcount{position:absolute;right:10px;bottom:10px;padding:2px 10px;border-radius:99px;background:var(--gl);font-size:.8rem;pointer-events:none}.gallery.dragging{scroll-snap-type:none}
#drawer-body{flex:1;display:flex;flex-direction:column}.drawer-body{flex:1}
.cta{position:sticky;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--sf);border-top:var(--b)}.cta span{display:grid}.cta strong{font-size:1.2rem}.cta .btn{flex:1;max-width:260px}
.bars meter{appearance:none;height:8px;border-radius:99px;background:var(--sk)}.bars meter::-webkit-meter-bar{height:8px;border:0;border-radius:99px;background:var(--sk)}.bars meter::-webkit-meter-optimum-value{border-radius:99px;background:var(--ac)}.bars meter::-moz-meter-bar{border-radius:99px;background:var(--ac)}

.drawer-head{position:sticky;top:0;z-index:3;background:var(--sf)}
