/* Boxed It! — POP ART theme (comic-book / Lichtenstein). Display: Bangers (OFL), body: Nunito (OFL), both bundled in fonts/. */
@font-face{font-family:'Bangers';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/bangers-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bangers';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/bangers-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Nunito';font-style:normal;font-display:swap;font-weight:200 1000;src:url(fonts/nunito-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Nunito';font-style:normal;font-display:swap;font-weight:200 1000;src:url(fonts/nunito-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --paper:#FFF1EC; --card:#FFFFFF; --ink:#111111; --mut:#3D3A36;
  --pink:#FF4FA3; --pink2:#FFD3E8; --coral:#FF7A1A; --blue:#FF4FA3; --blue2:#FFD3E8; --butter:#FFE600; --yellow:#FFB400; --yellow2:#FFF0B8; --teal:#12C2A8; --violet:#A35BFF; --red:#F2452B; --orange:#FF7A1A; --sunset:linear-gradient(135deg,#FF4FA3 0%,#FF6A6A 50%,#FF8A2A 100%);
  --bw:3px; --line:var(--bw) solid var(--ink); --sh:4px 4px 0 var(--ink); --sh-sm:3px 3px 0 var(--ink); --r:10px;
  --comic:'Bangers','Impact','Arial Black',system-ui,sans-serif;
  --burst:polygon(50% 0%,58% 9.8%,69.1% 3.8%,72.8% 15.9%,85.4% 14.6%,84.1% 27.2%,96.2% 30.9%,90.2% 42%,100% 50%,90.2% 58%,96.2% 69.1%,84.1% 72.8%,85.4% 85.4%,72.8% 84.1%,69.1% 96.2%,58% 90.2%,50% 100%,42% 90.2%,30.9% 96.2%,27.2% 84.1%,14.6% 85.4%,15.9% 72.8%,3.8% 69.1%,9.8% 58%,0% 50%,9.8% 42%,3.8% 30.9%,15.9% 27.2%,14.6% 14.6%,27.2% 15.9%,30.9% 3.8%,42% 9.8%);
  --spiky:polygon(50% 0%,59.3% 15.2%,75% 6.7%,75.5% 24.5%,93.3% 25%,84.8% 40.7%,100% 50%,84.8% 59.3%,93.3% 75%,75.5% 75.5%,75% 93.3%,59.3% 84.8%,50% 100%,40.7% 84.8%,25% 93.3%,24.5% 75.5%,6.7% 75%,15.2% 59.3%,0% 50%,15.2% 40.7%,6.7% 25%,24.5% 24.5%,25% 6.7%,40.7% 15.2%);
  --dots:radial-gradient(circle,rgba(17,17,17,.09) 1.3px,transparent 1.8px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.45 'Nunito',system-ui,-apple-system,sans-serif;font-weight:600}
body{background-color:var(--paper);background-image:var(--dots),radial-gradient(circle,rgba(255,79,163,.12) 1.3px,transparent 1.8px);background-size:9px 9px,9px 9px;background-position:0 0,4.5px 4.5px;background-attachment:fixed;min-height:100vh}
.hidden{display:none!important}.muted{color:var(--mut)}.small{font-size:12.5px}
svg{display:block}
code{background:var(--yellow2);border:2px solid var(--ink);border-radius:4px;padding:0 5px;font-size:12px}
h3,h4{font-family:var(--comic);font-weight:400;letter-spacing:.8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* header + wordmark */
.top{position:sticky;top:0;z-index:5;background:var(--paper);background-image:var(--dots);background-size:9px 9px;border-bottom:var(--line);padding:calc(env(safe-area-inset-top) + 8px) 16px 8px;margin-bottom:16px}
.brand{font-family:var(--comic);font-weight:400;font-size:34px;line-height:1;letter-spacing:1.5px;display:flex;align-items:center;gap:10px;color:var(--yellow);-webkit-text-stroke:1.6px var(--ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);transform-origin:left center}
.brand .logo{width:46px;height:46px;border:var(--line);border-radius:8px;box-shadow:var(--sh-sm);transform:rotate(-4deg)}
.spark-emoji{font-family:var(--comic);font-size:13px;letter-spacing:.5px;color:var(--ink);-webkit-text-stroke:0;text-shadow:none;background:var(--coral);border:2.5px solid var(--ink);padding:3px 8px 2px;border-radius:4px;transform:rotate(6deg) translateY(-6px);box-shadow:2px 2px 0 var(--ink)}
.spark-emoji::before{content:'POW!'}
/* banner = speech bubble */
.banner{position:relative;margin:12px 4px 4px;background:#fff;color:var(--ink);border:var(--line);border-radius:18px;padding:9px 14px;font-size:12.5px;font-weight:800;box-shadow:var(--sh-sm)}
.banner::before{content:'!';display:inline-grid;place-items:center;width:20px;height:20px;margin-right:6px;background:var(--yellow);border:2px solid var(--ink);border-radius:50%;font-family:var(--comic);font-size:14px;vertical-align:-4px}
main{padding:0 16px calc(132px + env(safe-area-inset-bottom))}

/* hero = comic panel */
.hero{position:relative;overflow:hidden;isolation:isolate;background:var(--butter);border:var(--line);border-radius:4px;padding:12px 14px 12px;margin-bottom:18px;box-shadow:6px 6px 0 var(--ink)}
.hero::after{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,var(--pink) 2.6px,transparent 3.1px);background-size:11px 11px;-webkit-mask-image:linear-gradient(115deg,transparent 35%,#000 100%);mask-image:linear-gradient(115deg,transparent 30%,#000 100%);opacity:1}
.pow-badge{position:absolute;right:-1px;top:-2px;width:112px;height:112px;z-index:2;transform:rotate(4deg);transform-origin:50% 50%;animation:pow 3.2s ease-in-out infinite;pointer-events:none}
@keyframes pow{0%,62%,100%{transform:rotate(4deg) scale(1)}70%{transform:rotate(1deg) scale(1.08)}78%{transform:rotate(5deg) scale(.97)}86%{transform:rotate(4deg) scale(1.02)}}
@media (prefers-reduced-motion:reduce){.pow-badge{animation:none}}
.lbl{display:block;color:var(--mut);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.4px}
.hero>.lbl{display:inline-block;margin-top:4px;background:#fff;color:var(--ink);border:2.5px solid var(--ink);padding:2px 9px;font-size:11.5px;box-shadow:2px 2px 0 var(--ink);position:relative;z-index:1}
/* POW badge: black burst outline + coloured burst fill behind text */
.big,.item .val b{position:relative;isolation:isolate;display:inline-block}
.big{display:block;width:max-content;max-width:calc(100% - 78px)}
.big[data-len='9']{font-size:37px;padding-left:34px;padding-right:34px}.big[data-len='10'],.big[data-len='11']{font-size:32px;padding-left:30px;padding-right:30px}.big[data-len='12'],.big[data-len='13'],.big[data-len='14']{font-size:26px;padding-left:26px;padding-right:26px}
.big::before,.item .val b::before{content:'';position:absolute;inset:0;z-index:-2;background:var(--ink);clip-path:var(--burst)}
.big::after,.item .val b::after{content:'';position:absolute;inset:3px;z-index:-1;background:var(--coral);clip-path:var(--burst)}
.big{font-family:var(--comic);font-weight:400;font-size:42px;line-height:1;letter-spacing:1.5px;color:#fff;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ink);padding:26px 40px 24px;margin:-2px 0 6px -12px;transform:rotate(-3deg);z-index:1}
.row3{display:flex;gap:8px;position:relative;z-index:1}
.row3>div{flex:1;min-width:0;background:#fff;border:2.5px solid var(--ink);border-radius:4px;padding:6px 8px;box-shadow:2px 2px 0 var(--ink)}
.row3 .lbl{font-size:10.5px}
.row3 b{font-size:15px;font-weight:900;display:inline-block;margin-top:2px}
.spark{width:100%;height:44px;margin-top:10px;position:relative;z-index:1;background:#fff;border:2.5px solid var(--ink);border-radius:4px}
.pill{display:inline-block;border:2px solid var(--ink);border-radius:4px;padding:0 6px;font-weight:900;white-space:nowrap}
.up{color:#0A5A99}.down{color:#A8322F}
.pill.up{background:var(--blue);color:var(--ink)}.pill.down{background:var(--coral);color:var(--ink)}

/* toolbar + inputs */
.tools{display:flex;gap:8px;margin-bottom:16px}
input,select{width:100%;background:#fff;color:var(--ink);border:var(--line);border-radius:8px;padding:10px 12px;font:inherit;font-weight:700;box-shadow:var(--sh-sm);outline:none;transition:box-shadow .1s}
input::placeholder{color:#77716A}
input:focus,select:focus{box-shadow:3px 3px 0 var(--blue)}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='3.5' stroke-linecap='square'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;background-size:15px;padding-right:30px}
.tools input{flex:1}.tools select{width:auto}
.icon{background:var(--blue);color:var(--ink);border:var(--line);border-radius:8px;min-width:46px;display:grid;place-items:center;box-shadow:var(--sh-sm);cursor:pointer}
.icon:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:square}

/* items */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.list{display:flex;flex-direction:column;gap:12px}
.item{background:var(--card);border:var(--line);border-radius:6px;overflow:hidden;cursor:pointer;position:relative;box-shadow:var(--sh);transition:transform .08s,box-shadow .08s}
.item:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.item img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;display:block;padding:8px;border-bottom:var(--line)}
.item .meta{padding:6px 10px 10px}
.item .nm{font-weight:900;font-size:13.5px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.item .muted.small{margin-top:1px}
.item .val{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;margin-top:6px;font-size:11.5px;gap:4px}
.item .val b{font-family:var(--comic);font-weight:400;font-size:17px;letter-spacing:.6px;line-height:1;color:var(--ink);padding:9px 13px 8px;margin-left:-6px;transform:rotate(-4deg)}
.item .val b::after{background:var(--yellow)}
.badge{position:absolute;top:8px;left:8px;background:var(--yellow);color:var(--ink);border:2.5px solid var(--ink);font-family:var(--comic);font-size:14px;letter-spacing:.6px;line-height:1.1;border-radius:4px;padding:2px 7px 1px;box-shadow:2px 2px 0 var(--ink);transform:rotate(-4deg)}
.badge.oob{left:auto;right:8px;background:var(--blue);transform:rotate(3deg)}
.badge.qty{top:auto;left:auto;right:8px;bottom:auto;top:38px;background:var(--pink);color:var(--ink);transform:rotate(5deg)}
.list .item{display:flex;align-items:center}
.list .item img{width:92px;height:92px;flex:none;margin:8px;border:var(--line);border-radius:4px;padding:6px}
.list .item .meta{flex:1;padding:10px 12px 10px 4px}
.list .badge{top:12px;left:12px;font-size:12px;padding:1px 6px}
.list .badge.oob{right:auto;top:auto;bottom:12px}
.list .badge.qty{left:auto;right:10px;top:8px}
/* empty state = speech bubble */
.empty{position:relative;text-align:center;padding:20px 20px 24px;background:#fff;border:var(--line);border-radius:28px;box-shadow:var(--sh);margin:6px 0 34px}
.empty::after{content:'';position:absolute;left:56px;bottom:-16px;width:28px;height:28px;background:#fff;border-right:var(--line);border-bottom:var(--line);transform:rotate(45deg) skew(14deg,14deg)}
.empty-art{width:150px;height:140px;margin:0 auto 4px}
.empty h3{margin:4px 0 4px;font-size:28px;color:var(--coral);-webkit-text-stroke:1.2px var(--ink);paint-order:stroke fill;text-shadow:2px 2px 0 var(--ink)}
.empty p{margin:0 0 16px;color:var(--mut);font-weight:700}

/* cards & forms */
.card{background:var(--card);border:var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:16px;box-shadow:var(--sh)}
.card h3{display:inline-block;margin:0 0 8px;font-size:24px;line-height:1;background:var(--yellow);border:2.5px solid var(--ink);padding:4px 10px 2px;transform:rotate(-1.5deg);box-shadow:2px 2px 0 var(--ink)}
.card input,.card select{box-shadow:2px 2px 0 var(--ink)}
.card input:focus,.card select:focus{box-shadow:3px 3px 0 var(--blue)}
label{display:block;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.3px;color:var(--ink);margin:10px 0}
label input,label select{margin-top:5px;text-transform:none;letter-spacing:0;font-size:15px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#fff;color:var(--ink);border:var(--line);border-radius:10px;padding:9px 16px 8px;font-family:var(--comic);font-weight:400;font-size:18px;letter-spacing:.9px;text-decoration:none;cursor:pointer;box-shadow:var(--sh-sm);transition:transform .08s,box-shadow .08s;line-height:1.15}
.btn:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}
.btn:disabled{opacity:.6}
.btn.primary{background:var(--blue);color:var(--ink)}
.btn.danger{background:var(--coral);color:var(--ink)}
.btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center}.btns.end{justify-content:space-between;margin-top:16px}.btns.end .btn.primary{flex:1;padding:11px 18px 10px;font-size:22px}

/* scan */
.reader{position:relative;background-color:var(--blue);background-image:radial-gradient(circle,rgba(255,255,255,.35) 2.4px,transparent 2.9px);background-size:12px 12px;border:var(--line);border-radius:6px;overflow:hidden;min-height:240px;margin-bottom:16px;box-shadow:var(--sh)}
.reader:empty::before{content:'';position:absolute;inset:28px 50px 70px;border-radius:8px;border:4px dashed var(--ink);background:rgba(255,255,255,.22)}
.reader:empty::after{content:'Tap “Start camera” and point at the box barcode';position:absolute;inset:auto 16px 18px;margin:auto;width:max-content;max-width:calc(100% - 32px);background:#fff;border:2.5px solid var(--ink);border-radius:14px;padding:5px 12px;color:var(--ink);font-size:12.5px;font-weight:800;box-shadow:2px 2px 0 var(--ink)}
.reader:empty{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60' fill='%23111'%3E%3Crect x='4' y='0' width='5' height='60'/%3E%3Crect x='13' y='0' width='3' height='60'/%3E%3Crect x='20' y='0' width='7' height='60'/%3E%3Crect x='31' y='0' width='3' height='60'/%3E%3Crect x='38' y='0' width='5' height='60'/%3E%3Crect x='47' y='0' width='3' height='60'/%3E%3Crect x='54' y='0' width='8' height='60'/%3E%3Crect x='66' y='0' width='3' height='60'/%3E%3Crect x='73' y='0' width='5' height='60'/%3E%3Crect x='82' y='0' width='3' height='60'/%3E%3Crect x='89' y='0' width='7' height='60'/%3E%3Crect x='100' y='0' width='3' height='60'/%3E%3Crect x='107' y='0' width='6' height='60'/%3E%3C/svg%3E"),radial-gradient(circle,rgba(255,255,255,.35) 2.4px,transparent 2.9px);background-repeat:no-repeat,repeat;background-position:center 40%,0 0;background-size:116px 58px,12px 12px}
.reader video{border-radius:0}
.scanctl{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.scanctl .btn{flex:none}
/* status line = small speech bubble */
#scanmsg{position:relative;flex:1;font-size:12.5px;font-weight:800;color:var(--ink);background:#fff;border:2.5px solid var(--ink);border-radius:14px;padding:6px 10px;box-shadow:2px 2px 0 var(--ink)}
#scanmsg::before{content:'';position:absolute;left:-11px;top:50%;width:12px;height:12px;margin-top:-6px;background:#fff;border-left:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(45deg) translate(3px,-3px) skew(12deg,12deg)}

/* bottom tabs */
.tabs{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;background:#fff;border:var(--line);border-radius:14px;padding:7px 6px;box-shadow:var(--sh);z-index:6;max-width:560px;margin:0 auto}
.tabs button{flex:1;background:none;border:0;color:var(--mut);display:flex;flex-direction:column;align-items:center;gap:2px;font-family:var(--comic);font-size:14px;letter-spacing:.8px;cursor:pointer;padding:3px 0}
.tabs button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:square;stroke-linejoin:miter}
.tabs button.on{color:var(--ink)}
.tabs button.on:not(.scanbtn) svg{background:var(--blue);border:2.5px solid var(--ink);border-radius:6px;padding:2px;width:38px;height:30px;margin:-4px 0 -1px;box-shadow:2px 2px 0 var(--ink)}
.tabs .scanbtn i{display:grid;place-items:center;width:58px;height:58px;margin-top:-34px;border-radius:50%;background:var(--blue);color:var(--ink);border:var(--line);box-shadow:var(--sh-sm)}
.tabs .scanbtn.on i{background:var(--yellow)}
.tabs .scanbtn i svg{width:26px;height:26px;stroke-width:2.8}

/* sheet */
dialog{width:100%;max-width:520px;margin:auto auto 0;border:var(--line);border-bottom:0;border-radius:16px 16px 0 0;background:var(--card);color:var(--ink);padding:10px 16px calc(18px + env(safe-area-inset-bottom));max-height:92vh;box-shadow:0 -4px 0 var(--ink)}
dialog::backdrop{background-color:rgba(17,17,17,.5);background-image:radial-gradient(circle,rgba(255,62,158,.4) 1.5px,transparent 2px);background-size:8px 8px}
dialog input,dialog select{box-shadow:2px 2px 0 var(--ink)}
.grab{width:46px;height:7px;border:2px solid var(--ink);border-radius:4px;background:var(--yellow);margin:0 auto 12px}
.sheethead{display:flex;gap:12px;align-items:center;margin-bottom:4px}
.sheethead img{width:72px;height:72px;object-fit:contain;background:#fff;border:var(--line);border-radius:6px;box-shadow:var(--sh-sm);padding:4px;transform:rotate(-2deg)}
.sheethead .ttl{font-family:var(--comic);font-weight:400;font-size:24px;letter-spacing:.8px;line-height:1.05}.sheethead>div{flex:1;min-width:0}
.x{height:40px;min-width:40px;border-radius:50%;box-shadow:var(--sh-sm);background:var(--yellow);font-size:15px;font-weight:900;color:var(--ink)}
.two{display:flex;gap:10px}.two label{flex:1;min-width:0}
.pricebar{display:flex;gap:10px;margin-top:10px}.pricebar .btn{flex:1;font-size:16px;padding:9px 8px 8px}
#f-price{background:var(--blue)}#f-comps{background:var(--yellow)}
/* price message = speech bubble */
#f-pmsg{position:relative;margin:16px 0 4px;background:#fff;border:2.5px solid var(--ink);border-radius:16px;padding:8px 12px;font-weight:700;color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
#f-pmsg::before{content:'';position:absolute;left:26px;top:-11px;width:14px;height:14px;background:#fff;border-left:2.5px solid var(--ink);border-top:2.5px solid var(--ink);transform:rotate(45deg) skew(10deg,10deg)}
#f-pmsg:empty{display:none}
.hist{margin-top:10px}.hist:empty{display:none}.hist svg{width:100%;height:54px;margin-bottom:6px;background:#fff;border:2.5px solid var(--ink);border-radius:4px}
.hist table{width:100%;font-size:12.5px;color:var(--mut);border-collapse:collapse;background:var(--yellow2);border:2.5px solid var(--ink)}
.hist td{padding:5px 10px;border-bottom:1.5px dashed rgba(17,17,17,.3)}.hist td:last-child{text-align:right;font-weight:900;color:var(--ink)}
details{margin-top:8px}summary{cursor:pointer;padding:6px 0;font-weight:900;text-transform:uppercase;letter-spacing:.4px}

.item img[src="icon.svg"]{background:var(--blue2)!important;padding:26px!important}
.list .item img[src="icon.svg"]{padding:12px!important}
.sheethead img[src="icon.svg"]{background:var(--blue2)!important;padding:8px!important}
.spark:empty{display:none}
@media(min-width:700px){.grid{grid-template-columns:repeat(4,1fr)}main{max-width:900px;margin:auto}}
#refresh-all{margin-top:12px}
#st-status{line-height:1.7;font-weight:700}

/* add flow: segmented control + catalog search */
.seg{display:flex;background:#fff;border:var(--line);border-radius:10px;padding:4px;gap:4px;margin-bottom:16px;box-shadow:var(--sh)}
.seg button{flex:1;border:2.5px solid transparent;background:none;border-radius:6px;padding:7px 0 5px;font-family:var(--comic);font-size:18px;letter-spacing:.8px;color:var(--mut);cursor:pointer}
.seg button.on{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
.two label.num{flex:0 0 34%}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 4px;margin-top:4px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:2.5px solid var(--ink);border-radius:999px;padding:4px 12px;background:#fff;color:var(--ink);font:inherit;font-size:12.5px;font-weight:900;cursor:pointer;box-shadow:2px 2px 0 var(--ink)}
.chip:active{transform:translate(2px,2px);box-shadow:none}
.chip.on{background:var(--blue);color:var(--ink)}
/* catalog message = speech bubble */
.cmsg{position:relative;margin:2px 4px 14px;background:#fff;border:2.5px solid var(--ink);border-radius:16px;padding:7px 12px;font-weight:800;color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.cmsg::before{content:'';position:absolute;left:24px;top:-10px;width:13px;height:13px;background:#fff;border-left:2.5px solid var(--ink);border-top:2.5px solid var(--ink);transform:rotate(45deg) skew(10deg,10deg)}
.cmsg:empty{display:none}
.results h4{margin:16px 2px 10px;font-size:22px;line-height:1}
.results h4 .small{font-family:'Nunito',system-ui,sans-serif;font-weight:800;letter-spacing:0}
.res{display:flex;align-items:center;gap:10px;background:var(--card);border:var(--line);border-radius:8px;padding:8px 10px 8px 8px;margin-bottom:12px;box-shadow:var(--sh)}
.res img{width:64px;height:64px;flex:none;object-fit:contain;background:#fff;border:2.5px solid var(--ink);border-radius:4px}
.res img[src="icon.svg"]{background:var(--blue2);padding:8px}
.rmeta{flex:1;min-width:0}
.rmeta .nm{font-weight:900;font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pills{display:flex;flex-wrap:wrap;gap:5px;margin:5px 0 3px}
.tag{font-size:11px;font-weight:900;border:2px solid var(--ink);border-radius:4px;padding:0 6px;background:#fff;color:var(--ink);line-height:1.5}
.tag.num{background:var(--yellow)}
.tag.own{background:var(--blue)}
.ell{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.res .add{flex:none;padding:7px 11px 6px;font-size:16px}

/* variants / exclusives = comic stickers */
.item .vb{position:relative;display:flex;flex-wrap:wrap;gap:5px;margin:-30px 8px 6px;pointer-events:none;z-index:1}
.vtag{font-family:var(--comic);font-weight:400;font-size:13px;letter-spacing:.6px;line-height:1.1;border:2.5px solid var(--ink);border-radius:4px;padding:2px 7px 1px;background:var(--blue);color:var(--ink);box-shadow:2px 2px 0 var(--ink);transform:rotate(-3deg)}
.vtag.ex{background:var(--yellow);transform:rotate(2deg)}
.vtag.chase,.tag.chase{background:var(--coral);color:var(--ink);transform:rotate(-5deg)}
.vtag.chase::before,.tag.chase::before{content:'★ '}
.tag.chase{font-family:var(--comic);font-weight:400;font-size:13px;letter-spacing:.6px;box-shadow:2px 2px 0 var(--ink)}
.list .item .vb{position:absolute;left:12px;bottom:12px;margin:0;max-width:88px}
.list .item .vb .vtag{font-size:11px;padding:1px 5px}
.tag.new{background:var(--pink);color:var(--ink);font-family:var(--comic);font-weight:400;font-size:13px;letter-spacing:1px;transform:rotate(-4deg);box-shadow:2px 2px 0 var(--ink)}
.tag.var{background:var(--blue2)}
.tag.ex{background:var(--yellow);font-family:var(--comic);font-weight:400;font-size:13px;letter-spacing:.6px;transform:rotate(2deg);box-shadow:2px 2px 0 var(--ink)}
.chip.special{background:var(--yellow);font-family:var(--comic);font-weight:400;font-size:15px;letter-spacing:.8px;padding:3px 12px 2px}
.chip.special.on{background:var(--coral);color:var(--ink)}
.photo-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 4px}
.small-btn{padding:7px 12px 6px;font-size:15px}
.btn.ghost{background:var(--paper);color:var(--ink)}
.tag.chance{background:var(--pink2);font-style:italic}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.tag.var.chase{background:var(--coral);color:var(--ink)}
.empty-art{width:100px;height:94px}
.empty{padding:12px 18px 18px}.empty h3{margin:2px 0 2px}.empty p{margin:0 0 12px}

/* ============ 2026 glass layer (frosted UI chrome over the pop-art page) ============ */
:root{--glass:rgba(255,255,255,.58);--glass-hi:rgba(255,255,255,.78);--glass-edge:rgba(255,255,255,.75);--blur:blur(18px) saturate(160%);
  --soft:0 10px 28px rgba(17,17,17,.12);--sh-g:3px 3px 0 var(--ink);--spring:cubic-bezier(.34,1.56,.64,1);--ease-out:cubic-bezier(.2,.8,.2,1)}
/* solid fallbacks first (no backdrop-filter support) */
.top{background:var(--paper);background-image:none;border-bottom:2px solid var(--ink);box-shadow:0 6px 20px rgba(17,17,17,.06)}
.tabs{border-width:2px;border-radius:22px;box-shadow:var(--sh-g),var(--soft)}
.tools{background:#fff;border:2px solid var(--ink);border-radius:16px;padding:7px;box-shadow:var(--sh-g),var(--soft)}
.tools input,.tools select,.tools .icon{border-width:2px;box-shadow:none;border-radius:10px}
.tools input,.tools select{background-color:rgba(255,255,255,.85)}
.item,.res,.card{border-width:2px;box-shadow:var(--sh-g),0 8px 20px rgba(17,17,17,.07)}
.item{border-radius:12px}.res{border-radius:12px}.card{border-radius:14px}
.item img{border-bottom-width:2px}
.res img,.list .item img{border-width:2px}
dialog{border-width:2px;border-radius:24px 24px 0 0;box-shadow:0 -12px 40px rgba(17,17,17,.18)}
.banner{background:var(--glass-hi);border-width:2px}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .top{background:rgba(255,241,236,.6);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:inset 0 -1px 0 var(--glass-edge),0 8px 24px rgba(17,17,17,.08)}
  .tabs{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:inset 0 0 0 1.5px var(--glass-edge),var(--sh-g),var(--soft)}
  .tools{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:inset 0 0 0 1.5px var(--glass-edge),var(--sh-g),var(--soft)}
  .item,.res{background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);box-shadow:inset 0 0 0 1px var(--glass-edge),var(--sh-g),0 8px 20px rgba(17,17,17,.07)}
  .card{background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(12px) saturate(150%);backdrop-filter:blur(12px) saturate(150%);box-shadow:inset 0 0 0 1px var(--glass-edge),var(--sh-g),0 8px 20px rgba(17,17,17,.07)}
  dialog{background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%);box-shadow:inset 0 1px 0 var(--glass-edge),0 -12px 40px rgba(17,17,17,.18)}
  dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
  .banner{-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
  .seg{background:var(--glass-hi);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
}
/* micro-interactions: springy press */
.btn,.icon,.chip,.x,.tabs button,.seg button{transition:transform .35s var(--spring),box-shadow .2s var(--ease-out),background-color .2s}
.btn:active,.icon:active,.x:active{transform:scale(.94);box-shadow:1px 1px 0 var(--ink)}
.chip:active{transform:scale(.92)}
.tabs button:active{transform:scale(.9)}
.tabs .scanbtn i{transition:transform .35s var(--spring)}
.tabs .scanbtn:active i{transform:scale(.9) rotate(-6deg)}
.item,.res{transition:transform .35s var(--spring),box-shadow .2s var(--ease-out)}
.item:active,.res:active{transform:scale(.97);box-shadow:1px 1px 0 var(--ink),0 4px 10px rgba(17,17,17,.06)}
/* tab switch, sheet open, staggered cards */
@keyframes viewIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes sheetUp{from{opacity:.4;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes cardIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.view{animation:viewIn .32s var(--ease-out)}
dialog[open]{animation:sheetUp .38s var(--spring)}
dialog[open]::backdrop{animation:fadeIn .25s ease-out}
#list .item,.results .res{animation:cardIn .42s var(--ease-out) backwards}
#list .item:nth-child(2),.results .res:nth-of-type(2){animation-delay:.04s}#list .item:nth-child(3),.results .res:nth-of-type(3){animation-delay:.08s}
#list .item:nth-child(4),.results .res:nth-of-type(4){animation-delay:.12s}#list .item:nth-child(5),.results .res:nth-of-type(5){animation-delay:.16s}
#list .item:nth-child(6),.results .res:nth-of-type(6){animation-delay:.2s}#list .item:nth-child(7),.results .res:nth-of-type(7){animation-delay:.24s}
#list .item:nth-child(n+8),.results .res:nth-of-type(n+8){animation-delay:.28s}
@media (prefers-reduced-motion:reduce){.view,dialog[open],dialog[open]::backdrop,#list .item,.results .res,.pow-badge{animation:none!important}
  .btn,.icon,.chip,.x,.tabs button,.seg button,.item,.res,.tabs .scanbtn i{transition:none!important}}

/* ============ girly-pop palette overrides (v12) ============ */
.hero{background:var(--sunset)}
.hero::after{background-image:radial-gradient(circle,rgba(255,230,0,.85) 2.4px,transparent 2.9px);opacity:1}
.big::after{background:var(--butter)}
.big{color:var(--pink)}
.pill.up{background:var(--teal);color:var(--ink)}.pill.down{background:var(--red);color:var(--ink)}
.up{color:#0B6E60}.down{color:#B5311C}
.tag.own,.badge.oob{background:var(--teal)}
.badge.qty{background:var(--orange)}
.tag.new{background:var(--violet)}
.btn.danger{background:var(--red)}
.chip.special.on{background:var(--orange)}
.empty h3{color:var(--pink)}

/* ============ v14: Pop # titles, property chips, series search, Pop detail sheet ============ */
.res{cursor:pointer}
.rimg{position:relative;flex:none}
.rimg .tag.num{position:absolute;left:-6px;bottom:-7px;font-family:var(--comic);font-weight:400;font-size:12.5px;letter-spacing:.5px;padding:1px 5px 0;transform:rotate(-5deg);box-shadow:2px 2px 0 var(--ink)}
.nm .hash,.d-title .hash{font-family:var(--comic);font-weight:400;letter-spacing:.6px;color:var(--pink);-webkit-text-stroke:1px var(--ink);paint-order:stroke fill}
.pchip{display:inline-flex;align-items:center;gap:5px;max-width:100%;margin:3px 0 4px;border:2px solid var(--ink);border-radius:999px;padding:1px 10px 1px 8px;background:var(--butter);color:var(--ink);font:inherit;font-size:12px;font-weight:900;line-height:1.5;cursor:pointer;box-shadow:2px 2px 0 var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .35s var(--spring),box-shadow .2s}
.pchip::before{content:'';flex:none;width:9px;height:9px;border-radius:50%;background:var(--pink);border:2px solid var(--ink)}
.pchip:active{transform:scale(.92);box-shadow:none}
.pchip.lg{font-size:14px;padding:3px 14px 3px 10px}
.pchip.static{cursor:default;font-family:'Nunito',system-ui,sans-serif;letter-spacing:0;vertical-align:2px}
.shead{scroll-margin-top:84px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tag.lst{background:var(--pink2)}
.tag.yr{background:#fff}
.tag.soft{background:var(--yellow2);font-weight:800}
.btn.more{display:flex;width:100%;margin:4px 0 18px;background:var(--butter)}
.btn.more:disabled{opacity:.6}

/* full-screen detail sheet */
dialog.detail{max-width:560px;height:100%;max-height:100dvh;margin:0 auto;border:0;border-radius:0;padding:0;display:none;flex-direction:column;background:var(--paper)}
dialog.detail[open]{display:flex}
@media (min-width:600px){dialog.detail{border-left:2px solid var(--ink);border-right:2px solid var(--ink)}}
.d-bar{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:rgba(255,241,236,.92);border-bottom:2px solid var(--ink)}
.d-crumb{font-family:var(--comic);font-size:19px;letter-spacing:.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 16px calc(28px + env(safe-area-inset-bottom))}
.d-hero{position:relative;isolation:isolate;display:grid;place-items:center;height:250px;margin:2px 0 14px;border:2px solid var(--ink);border-radius:16px;overflow:hidden;background:var(--sunset);box-shadow:var(--sh-g),0 10px 26px rgba(17,17,17,.1)}
.d-hero::after{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,rgba(255,230,0,.8) 2.2px,transparent 2.7px);background-size:13px 13px;opacity:.9}
.d-burst{position:absolute;z-index:-1;width:250px;height:250px;background:#fff;border-radius:50%;box-shadow:0 0 0 2px var(--ink);clip-path:polygon(50% 0,58% 18%,75% 6%,74% 26%,94% 22%,84% 40%,100% 50%,84% 60%,94% 78%,74% 74%,75% 94%,58% 82%,50% 100%,42% 82%,25% 94%,26% 74%,6% 78%,16% 60%,0 50%,16% 40%,6% 22%,26% 26%,25% 6%,42% 18%)}
.d-hero img{max-width:72%;max-height:220px;object-fit:contain;filter:drop-shadow(4px 4px 0 rgba(17,17,17,.85))}
.d-hero img[src="icon.svg"]{width:120px}
.d-numbadge{position:absolute;top:12px;left:12px;background:var(--butter);border:2.5px solid var(--ink);border-radius:6px;padding:3px 10px 1px;font-family:var(--comic);font-size:24px;letter-spacing:1px;box-shadow:3px 3px 0 var(--ink);transform:rotate(-5deg)}
.d-title{margin:0 0 4px;font-size:30px;line-height:1.05;font-family:var(--comic);font-weight:400;letter-spacing:.8px}
.d-tags{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 14px}
.d-value{position:relative;border:2px solid var(--ink);border-radius:16px;padding:12px 14px;background:#fff;box-shadow:var(--sh-g),0 8px 20px rgba(17,17,17,.07);margin-bottom:12px}
.d-vlabel{display:inline-block;background:var(--pink);border:2px solid var(--ink);border-radius:4px;padding:0 8px;font-size:11.5px;font-weight:900;text-transform:uppercase;letter-spacing:.4px;transform:rotate(-2deg)}
.d-val{font-family:var(--comic);font-size:46px;line-height:1.05;letter-spacing:1.5px;color:var(--butter);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ink);margin:6px 0 2px}
.d-add{display:flex;width:100%;font-size:22px;padding:12px 16px 10px;margin:4px 0 6px}
.d-sec{margin-top:18px}
.d-sec h3,.d-more h4{display:inline-block;margin:0 0 10px;font-family:var(--comic);font-weight:400;font-size:22px;letter-spacing:.8px;line-height:1;background:var(--yellow);border:2px solid var(--ink);padding:4px 10px 2px;transform:rotate(-1.5deg);box-shadow:2px 2px 0 var(--ink)}
.d-more h4{font-size:18px;margin:16px 0 8px;background:var(--pink2)}
.d-more h4 .small{font-family:'Nunito',system-ui,sans-serif;letter-spacing:0;font-size:11px}
.vrow{display:flex;gap:10px;overflow-x:auto;padding:2px 4px 10px 2px;scroll-snap-type:x proximity}
.vrow::-webkit-scrollbar{display:none}
.vcard{flex:none;width:122px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:stretch;gap:4px;text-align:left;background:rgba(255,255,255,.75);border:2px solid var(--ink);border-radius:12px;padding:7px;font:inherit;color:var(--ink);cursor:pointer;box-shadow:var(--sh-g);transition:transform .35s var(--spring),box-shadow .2s}
.vcard:active{transform:scale(.95);box-shadow:1px 1px 0 var(--ink)}
.vcard img{width:100%;height:92px;object-fit:contain;background:#fff;border:2px solid var(--ink);border-radius:8px}
.vlbl{align-self:flex-start;font-family:var(--comic);font-size:13px;letter-spacing:.6px;line-height:1.2;background:var(--blue2);border:2px solid var(--ink);border-radius:4px;padding:1px 6px 0;transform:rotate(-3deg);margin-top:-14px;margin-left:4px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vcard:has(.vlbl) .vlbl{box-shadow:2px 2px 0 var(--ink)}
.vnm{font-size:12px;font-weight:900;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vex{font-size:10.5px;font-weight:900;background:var(--yellow);border:1.5px solid var(--ink);border-radius:3px;padding:0 4px;align-self:flex-start}
.sites{display:flex;flex-wrap:wrap;gap:8px}
.site{display:inline-flex;align-items:center;gap:6px;border:2px solid var(--ink);border-radius:999px;padding:4px 12px 4px 4px;background:#fff;color:var(--ink);text-decoration:none;font-weight:900;font-size:13px;box-shadow:2px 2px 0 var(--ink);transition:transform .35s var(--spring),box-shadow .2s}
.site:active{transform:scale(.93);box-shadow:none}
.site b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:2px solid var(--ink);font-family:var(--comic);font-weight:400;font-size:14px;line-height:1;background:var(--butter)}
.site::after{content:'↗';font-size:11px;margin-left:-2px}
.s-mercari b{background:#FFD3E8}.s-whatnot b{background:var(--butter)}.s-facebook b{background:#BFE3FF}.s-ppg b{background:#C7F5E8}.s-funko b{background:var(--pink)}.s-ebay-sold b{background:var(--orange)}
.d-more{margin-top:20px;border:2px solid var(--ink);border-radius:16px;background:rgba(255,255,255,.7);padding:0 14px;box-shadow:var(--sh-g)}
.d-more summary{list-style:none;cursor:pointer;padding:12px 0;font-family:var(--comic);font-size:21px;letter-spacing:.8px;display:flex;align-items:center;justify-content:space-between}
.d-more summary::-webkit-details-marker{display:none}
.d-more summary::after{content:'+';display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--butter);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);font-size:20px;transition:transform .3s var(--spring)}
.d-more[open] summary::after{content:'–'}
.d-more[open]{padding-bottom:14px}
.d-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.d-stats div{background:#fff;border:2px solid var(--ink);border-radius:8px;padding:5px 6px;text-align:center;box-shadow:2px 2px 0 var(--ink)}
.d-stats div.wide{grid-column:1/-1}
.d-stats span{display:block;font-size:10.5px;font-weight:900;text-transform:uppercase;color:var(--mut)}
.d-stats b{font-family:var(--comic);font-weight:400;font-size:18px;letter-spacing:.5px}
.d-chart .chart{width:100%;height:auto;background:#fff;border:2px solid var(--ink);border-radius:10px;box-shadow:2px 2px 0 var(--ink)}
.chart .grid{stroke:#111;stroke-opacity:.18;stroke-dasharray:3 4}
.chart .band{fill:var(--pink);fill-opacity:.22}
.chart .ln{fill:none;stroke:#111;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.chart .dot{fill:var(--pink);stroke:#111;stroke-width:2}.chart .dot.last{fill:#FFB400}
.chart text{font:800 10px 'Nunito',system-ui,sans-serif;fill:#3D3A36}
.d-empty{background:var(--yellow2);border:2px dashed var(--ink);border-radius:12px;padding:12px 14px;font-size:13.5px;font-weight:700}
.d-empty b{font-family:var(--comic);font-weight:400;font-size:18px;letter-spacing:.6px;display:block}
.d-list{display:flex;flex-direction:column;gap:7px}
.lrow{display:flex;align-items:center;gap:9px;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:5px 9px 5px 5px;color:var(--ink);text-decoration:none;box-shadow:2px 2px 0 var(--ink)}
.lrow img{width:42px;height:42px;flex:none;object-fit:cover;border:1.5px solid var(--ink);border-radius:6px;background:#fff}
.lrow .lt{flex:1;min-width:0;font-size:12px;font-weight:700;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lrow b{font-family:var(--comic);font-weight:400;font-size:17px;letter-spacing:.5px}
.d-soldbtn{display:flex;margin-top:14px;background:var(--orange)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .d-bar{background:rgba(255,241,236,.62);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
  dialog.detail{background:var(--paper)}
  .d-value{background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(12px) saturate(150%);backdrop-filter:blur(12px) saturate(150%);box-shadow:inset 0 0 0 1px var(--glass-edge),var(--sh-g),0 8px 20px rgba(17,17,17,.07)}
}
@media (prefers-reduced-motion:reduce){.pchip,.vcard,.site,.d-more summary::after{transition:none!important}}
.vrow{align-items:flex-start}

/* ---------- v15: home search ---------- */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hsearch{position:sticky;top:var(--top-h,64px);z-index:4;margin:-6px -6px 16px;padding:6px 6px 2px;border-radius:0 0 22px 22px;transition:background .2s,box-shadow .2s,padding .2s}
.hs-pill{display:flex;align-items:center;gap:4px;background:#fff;border:3px solid var(--ink);border-radius:999px;padding:5px 5px 5px 12px;box-shadow:4px 4px 0 var(--ink);transition:box-shadow .15s,transform .15s}
.hs-pill:focus-within{box-shadow:4px 4px 0 var(--pink),0 0 0 3px var(--pink2);transform:translate(-1px,-1px)}
.hs-mag svg{width:24px;height:24px;display:block;fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.hs-pill input{flex:1;min-width:0;border:0!important;box-shadow:none!important;background:transparent!important;font-size:16px;font-weight:800;color:var(--ink);padding:10px 2px;outline:none;text-overflow:ellipsis}
.hs-pill input::placeholder{color:#5c5650;font-weight:700;font-size:15px;letter-spacing:-.3px}
.hs-pill input::-webkit-search-cancel-button{display:none}
.hs-clear{flex:none;width:34px;height:34px;border-radius:50%;border:2px solid var(--ink);background:var(--pink2);color:var(--ink);font-weight:900;font-size:15px;line-height:1;cursor:pointer}
.hs-go{flex:none;min-height:44px;padding:0 13px;border-radius:999px;border:2.5px solid var(--ink);background:var(--butter);color:var(--ink);font-family:var(--comic);font-size:18px;letter-spacing:1px;cursor:pointer;box-shadow:2px 2px 0 var(--ink)}
.hs-go:active{transform:translate(2px,2px);box-shadow:none}
.qchips{display:flex;gap:8px;overflow-x:auto;padding:12px 2px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.qchips::-webkit-scrollbar{display:none}
.qchip{flex:none;min-height:36px;padding:6px 13px;border-radius:999px;border:2px solid var(--ink);background:rgba(255,255,255,.85);color:var(--ink);font-weight:900;font-size:14px;cursor:pointer;box-shadow:2px 2px 0 var(--ink);white-space:nowrap}
.qchip.pop:nth-child(3n+1){background:var(--pink2)}.qchip.pop:nth-child(3n+2){background:var(--yellow2)}
.qchip:active{transform:translate(2px,2px);box-shadow:none}
.hsearch.stuck{background:rgba(255,241,236,.92);box-shadow:0 8px 18px rgba(17,17,17,.08);padding-bottom:8px}
.hsearch.stuck .qchips{display:none}
.hsearch.stuck .hs-pill{box-shadow:3px 3px 0 var(--ink)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .hsearch.stuck{background:rgba(255,241,236,.6);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
}
.hs-bar{gap:8px}
.hs-pill.sm{flex:1;padding:3px 4px 3px 12px;box-shadow:3px 3px 0 var(--ink)}
.hs-pill.sm input{padding:8px 4px;font-size:16px}
.hs-pill.sm .hs-mag svg{width:20px;height:20px}
.hs-scroll .qchips{padding-top:2px}
.owned{margin-bottom:6px}
.owned h4{margin-top:4px}
.own-card{border-color:var(--ink);background:linear-gradient(90deg,var(--yellow2),#fff 60%)}
@media (prefers-reduced-motion:reduce){.hsearch,.hs-pill{transition:none}.hs-pill:focus-within{transform:none}}