/* Cheap Hunt — "the want list". Ruled paper, ballpoint indigo, and the collector's yellow price sticker.
   Yellow (#f5f744, brand) is ONLY for stickers and highlighter marks; never a background slab. */

@font-face{font-family:"Big Shoulders";src:url(fonts/bigshoulders.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Atkinson";src:url(fonts/atkinson-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Atkinson";src:url(fonts/atkinson-400i.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Atkinson";src:url(fonts/atkinson-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --hi:#f5f744;        /* highlighter / price sticker (brand yellow) */
  --ink:#16123a;       /* ballpoint indigo */
  --ink-2:#4b4670;     /* secondary text, 8.5:1 on paper */
  --lav:#a192fa;       /* brand lavender */
  --lav-ink:#4a35c4;   /* lavender dark enough for link text, 7:1 on paper */
  --paper:#fbfaff;
  --rule:#d9d4f0;
  --red:#c2183b;
  --ok:#1e6b3a;
  --display:"Big Shoulders",Impact,"Arial Narrow",sans-serif;
  --body:"Atkinson",system-ui,sans-serif;
  --measure:68ch;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--body)}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
a{color:var(--lav-ink);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--ink);text-decoration-color:var(--lav)}
:focus-visible{outline:3px solid var(--lav-ink);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--hi);color:var(--ink);padding:10px 14px;font-weight:700;z-index:50}
.skip:focus{left:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--display);font-weight:900;line-height:.95;letter-spacing:-.005em;margin:0;text-wrap:balance}
h1{font-size:clamp(46px,7vw,88px);margin:.15em 0 .3em}
h2{font-size:clamp(32px,4vw,44px);margin:1.6em 0 .5em}
h3{font-size:26px;margin:0 0 .3em}
p{margin:0 0 1em;max-width:var(--measure)}
.lead{font-size:21px;line-height:1.5;color:var(--ink-2);max-width:58ch}
.muted,.hint{color:var(--ink-2);font-size:16px}
.mark{background:linear-gradient(transparent 55%,var(--hi) 55%,var(--hi) 92%,transparent 92%);padding:0 .1em}

/* ---------- header ---------- */
.top{border-bottom:2px solid var(--ink);background:var(--paper);flex:none}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px 28px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.brand{font-family:var(--display);font-weight:900;font-size:34px;line-height:1;color:var(--ink);text-decoration:none;letter-spacing:-.01em}
.brand:hover{color:var(--ink)}
.brand{display:inline-flex;align-items:center;gap:12px}
.brand-mark{width:52px;height:52px;transition:transform .25s ease}
.brand:hover .brand-mark,.brand:focus-visible .brand-mark{transform:rotate(-12deg)}
.top nav{display:flex;align-items:center;gap:6px 22px;flex-wrap:wrap}
.top nav a{color:var(--ink);text-decoration:none;font-weight:700;font-size:16px;padding:4px 0}
.top nav a[aria-current]{background:linear-gradient(transparent 60%,var(--hi) 60%)}
.top nav a:hover{text-decoration:underline}
.top nav .btn{padding:9px 16px}
button.link{background:none;border:0;padding:4px 0;font:700 16px var(--body);color:var(--ink);cursor:pointer}
button.link:hover{text-decoration:underline}
form.inline{display:inline}

/* ---------- buttons ---------- */
.btn{display:inline-block;font:700 17px/1.2 var(--body);color:var(--paper);background:var(--ink);border:2px solid var(--ink);border-radius:6px;padding:12px 22px;text-decoration:none;cursor:pointer}
.btn:hover{background:#2a2466;border-color:#2a2466;color:var(--paper)}
.btn.alt{background:#fff;color:var(--ink)}
.btn.alt:hover{background:var(--ink);color:var(--paper)}
.btn.big{font-size:19px;padding:15px 26px}
.btn.small{font-size:15px;padding:6px 12px}
.top nav a.btn,.top nav a.btn:hover{color:var(--paper)}
/* the account button stays a button on its own page: the current-page highlighter is for text links only */
.top nav a.btn[aria-current]{background:var(--ink);box-shadow:0 0 0 3px var(--hi)}
.actions{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin:12px 0 0}

/* ---------- the price sticker (the one loud thing) ---------- */
.sticker{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;background:var(--hi);color:var(--ink);
  border-radius:10px;padding:6px 12px 7px;transform:rotate(-3deg);box-shadow:2px 3px 0 var(--ink);font-family:var(--display);line-height:1;white-space:nowrap}
.sticker small{font:700 13px/1 var(--body)}
.sticker b{font-weight:900;font-size:30px;margin-top:2px}

/* ---------- main ---------- */
body{min-height:100vh;display:flex;flex-direction:column}
main.wrap{flex:1 0 auto;width:100%;padding-top:40px;padding-bottom:88px}
.flash{max-width:var(--measure);padding:12px 16px;border-left:6px solid;border-radius:4px;font-weight:700;margin:0 0 24px}
.flash.success{border-color:var(--ok);background:#eaf6ee;color:#14481f}
.flash.error{border-color:var(--red);background:#fdecf0;color:#7e0f26}

/* home hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 48px;align-items:center;padding:28px 0 44px;border-bottom:2px solid var(--ink)}
.hero h1{max-width:12ch}
.hero-badge{position:relative;width:clamp(240px,28vw,340px);aspect-ratio:1;margin-right:24px}
.hero-mark{width:100%;height:100%;transform:rotate(-9deg);filter:drop-shadow(7px 9px 0 var(--ink))}
.hero-sticker{position:absolute;right:-28px;bottom:-18px;margin:0;transform:rotate(7deg);background:var(--hi);color:var(--ink);border-radius:16px;
  padding:14px 22px 16px;box-shadow:5px 6px 0 var(--ink);border:3px solid var(--ink);text-align:center;font-family:var(--display);line-height:.85}
.hero-sticker .amount{display:block;font-weight:900;font-size:clamp(64px,7vw,92px);letter-spacing:-.02em}
.hero-sticker .what{display:block;font-weight:700;font-size:26px;margin-top:4px}

/* the want list: ruled lines, not boxes */
.wantlist{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.want{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:6px 20px;align-items:center;padding:16px 4px 16px 0;border-bottom:1px solid var(--rule)}
.want-thumb{grid-row:1/span 2;width:72px;height:72px;object-fit:cover;border:2px solid var(--ink);border-radius:6px;background:#fff}
.want-thumb.none{display:flex;align-items:center;justify-content:center;border:2px dashed var(--rule);background:transparent}
.want-mark{width:58%;height:58%;opacity:.35;transform:rotate(-8deg)}
.want:nth-child(even) .want-mark{transform:rotate(6deg)}
.want-title{font-weight:700;font-size:20px;line-height:1.35;color:var(--ink);text-decoration:none}
.want-title:hover{text-decoration:underline;text-decoration-color:var(--lav)}
.want-meta{grid-column:2;display:flex;flex-wrap:wrap;gap:4px 18px;margin:0;color:var(--ink-2);font-size:15px}
.want .sticker{grid-column:3;grid-row:1/span 2}
.want:nth-child(even) .sticker{transform:rotate(2deg)}
.empty{max-width:var(--measure);border:2px dashed var(--rule);border-radius:8px;padding:22px 24px;color:var(--ink-2)}
.empty p:last-child{margin:0}

/* comparison table */
.compare{width:100%;max-width:900px;border-collapse:collapse;font-size:17px}
.compare th,.compare td{text-align:left;vertical-align:top;padding:14px 16px 14px 0;border-bottom:1px solid var(--rule)}
.compare thead th{font-family:var(--display);font-weight:900;font-size:26px;border-bottom:2px solid var(--ink)}
.compare tbody th{font-weight:700;width:30%}
.compare td.us{font-weight:700}

/* steps */
.steps{counter-reset:s;list-style:none;padding:0;margin:0;max-width:760px}
.steps li{counter-increment:s;position:relative;padding:14px 0 14px 68px;border-bottom:1px solid var(--rule)}
.steps li::before{content:counter(s);position:absolute;left:0;top:12px;width:56px;font-family:var(--display);font-weight:900;font-size:40px;line-height:1;color:var(--ink)}
.steps strong{display:block}

/* filters */
.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:8px 16px;align-items:end;margin:8px 0 28px}
.filters .field{display:flex;flex-direction:column;gap:4px}
.filters label{font-weight:700;font-size:15px}

/* forms */
.form{display:flex;flex-direction:column;gap:6px;max-width:640px}
.form.narrow{max-width:440px}
.form label{font-weight:700;margin-top:12px}
.form .check{font-weight:400;margin-top:6px;display:flex;align-items:center;gap:10px}
input,select,textarea{font:400 17px/1.4 var(--body);color:var(--ink);background:#fff;border:2px solid #8a85ad;border-radius:6px;padding:11px 12px;width:100%}
input:hover,select:hover,textarea:hover{border-color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--ink);outline:3px solid var(--lav);outline-offset:1px}
input[type=checkbox],input[type=radio]{width:20px;height:20px;accent-color:var(--ink);margin:0}
input[type=file]{padding:9px;background:var(--paper)}
input[aria-invalid=true],select[aria-invalid=true]{border-color:var(--red)}
fieldset{border:0;border-top:1px solid var(--rule);margin:14px 0 0;padding:10px 0 0}
legend{font-weight:700;padding:0}
.err{color:var(--red);font-weight:700;font-size:15px;margin:2px 0 0}
.form .btn{align-self:flex-start;margin-top:18px}

/* detail pages */
.back{font-weight:700;font-size:16px}
.facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px 28px;max-width:var(--measure);margin:8px 0 24px;padding:16px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.facts dt{font-weight:700}
.facts dd{margin:0}
.details,.note{max-width:var(--measure);border-left:4px solid var(--lav);padding:6px 0 6px 16px;margin:0 0 16px;white-space:normal}
.statusline{font-size:20px}
.offerlist{list-style:none;padding:0;margin:0;border-top:2px solid var(--ink);max-width:860px}
.offer{padding:18px 0;border-bottom:1px solid var(--rule)}
.offer p{margin:4px 0}
.offer.accepted{border-left:6px solid var(--ok);padding-left:16px}
.offer.declined,.offer.withdrawn{color:var(--ink-2)}
.offer .status{font-weight:700}
.photos{list-style:none;padding:0;margin:10px 0;display:flex;gap:10px;flex-wrap:wrap}
.photos img{display:block;width:120px;height:120px;object-fit:cover;border:2px solid var(--ink);border-radius:6px}

/* tables */
.tbl{width:100%;border-collapse:collapse;font-size:17px}
.tbl th,.tbl td{text-align:left;padding:12px 14px 12px 0;border-bottom:1px solid var(--rule)}
.tbl thead th{border-bottom:2px solid var(--ink)}

/* legal pages read as documents */
.doc{max-width:var(--measure)}
.doc h2{font-size:32px}
.doc li{margin-bottom:6px}

/* footer */
.foot{flex:none;border-top:2px solid var(--ink);padding:28px 0 36px;color:var(--ink-2);font-size:16px}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px}
.foot p{margin:0}
.foot .tag{font-family:var(--display);font-weight:700;font-size:24px;color:var(--ink);line-height:1.1}
.footlinks{display:flex;flex-wrap:wrap;gap:6px 18px}
.footlinks a{color:var(--ink);font-weight:700}

/* cookie choice */
.consent{position:fixed;left:16px;right:16px;bottom:16px;max-width:620px;background:var(--paper);color:var(--ink);border:2px solid var(--ink);border-radius:10px;
  box-shadow:5px 6px 0 var(--ink);padding:16px 18px;z-index:40}
.consent p{margin:0 0 10px;font-size:16px}
.consentform{display:flex;flex-wrap:wrap;gap:10px}
.consentform .btn{font-size:16px;padding:9px 16px}
.consentform .btn.current{box-shadow:0 0 0 3px var(--lav)}
.hp{position:absolute;left:-9999px;top:-9999px}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .hero{grid-template-columns:1fr}
  .hero-badge{justify-self:start;margin:8px 0 24px 8px}
  .filters{grid-template-columns:1fr 1fr}
  .filters .field.q{grid-column:1/-1}
}
@media (max-width:560px){
  body{font-size:17px}
  .wrap,main.wrap{padding-left:16px;padding-right:16px}
  main.wrap{padding-top:28px}
  .hero-badge{width:220px}
  .hero-sticker{right:-14px}
  .hero-sticker .amount{font-size:60px}
  .hero-sticker .what{font-size:22px}
  .brand-mark{width:44px;height:44px}
  .filters{grid-template-columns:1fr}
  .want{grid-template-columns:56px 1fr}
  .want-thumb{width:56px;height:56px}
  .want .sticker{grid-column:2;grid-row:auto;justify-self:start}
  .compare thead{display:none}
  .compare tr{display:block;padding:10px 0;border-bottom:1px solid var(--rule)}
  .compare th,.compare td{display:block;border:0;padding:2px 0;width:auto}
  .compare td::before{content:attr(data-label) ": ";font-weight:400;color:var(--ink-2)}
  .facts{grid-template-columns:1fr}
  .facts dd{margin-bottom:8px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* item titles can be long: detail pages use a smaller display size */
h1.item{font-size:clamp(34px,4.6vw,58px);max-width:24ch}


/* the mark used as a stamp, in the footer, and on the not-found page */
.empty.stamped{display:flex;align-items:center;gap:18px}
.stamp{flex:none;width:56px;height:56px;transform:rotate(-10deg)}
.foot-brand{display:flex;align-items:flex-start;gap:16px}
.foot-mark{flex:none;width:64px;height:64px;transform:rotate(8deg)}
.lost{display:flex;align-items:center;gap:40px;flex-wrap:wrap;padding:24px 0}
.lost-mark{width:min(260px,60vw);height:auto;transform:rotate(168deg);filter:drop-shadow(6px 8px 0 var(--ink))}
.lost h1{max-width:12ch}
@media (prefers-reduced-motion:reduce){.brand-mark{transition:none}}
.empty.stamped{flex-wrap:wrap}.empty.stamped p{flex:1 1 260px}.empty.stamped p:last-child{flex:0 0 auto;white-space:nowrap}

/* Want picker */
.picks{margin:4px 0 8px;max-width:860px}
.picks h2{margin-top:.6em}
.picklist{list-style:none;padding:0;margin:8px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 24px;border-top:2px solid var(--ink)}
.picklist li{border-bottom:1px solid var(--rule)}
.picklist a{display:flex;flex-direction:column;gap:2px;padding:12px 2px;color:var(--ink);text-decoration:none}
.picklist a:hover .pick-title{text-decoration:underline;text-decoration-color:var(--lav)}
.pick-title{font-weight:700;line-height:1.3}
.pick-meta{color:var(--ink-2);font-size:14px}
.pick-price{font-size:15px}
.pick-wanted{align-self:flex-start;background:var(--hi);font-weight:700;font-size:13px;padding:1px 8px;border-radius:4px;margin-top:2px}
.combo{position:relative}
.combo-list{position:absolute;left:0;right:0;top:100%;z-index:30;list-style:none;margin:4px 0 0;padding:4px 0;background:#fff;border:2px solid var(--ink);border-radius:8px;box-shadow:4px 5px 0 var(--ink);max-height:360px;overflow:auto}
.combo-list li{padding:8px 12px;cursor:pointer;display:flex;flex-direction:column}
.combo-list li[aria-selected=true],.combo-list li:hover{background:#fbfac9}
.opt-title{font-weight:700}
.opt-meta{font-size:14px;color:var(--ink-2)}
.item-head.has-img{display:grid;grid-template-columns:minmax(160px,280px) minmax(0,1fr);gap:28px;align-items:start}
.item-img{width:100%;height:auto;border:2px solid var(--ink);border-radius:8px;box-shadow:4px 5px 0 var(--ink);background:#fff}
.combo-list li.has-img{display:grid;grid-template-columns:48px 1fr;column-gap:12px}
.combo-list li.has-img .opt-img{grid-row:1/span 2;width:48px;height:48px;object-fit:cover;border-radius:4px;border:1px solid var(--rule)}
@media (max-width:560px){.item-head.has-img{grid-template-columns:1fr}.item-img{max-width:260px}}
.editwant{max-width:var(--measure);margin:8px 0 8px;border-top:1px solid var(--rule);padding-top:10px}
.editwant summary{cursor:pointer;font-weight:700;color:var(--lav-ink)}
.item-fig{margin:0}.item-fig figcaption{font-size:14px;color:var(--ink-2);margin-top:8px}
.pick-img{width:100%;height:140px;object-fit:contain;background:#fff;border:1px solid var(--rule);border-radius:6px;margin-bottom:8px}
.suggested .want-title{display:flex;gap:10px;align-items:flex-start;cursor:pointer}.suggested .want-title input{margin-top:5px}

/* mobile menu: a Menu button at 900px and below (only when JS runs; otherwise the nav stays visible) */
.menu-toggle{display:none;align-items:center;gap:10px;background:transparent;border:2px solid var(--ink);border-radius:8px;padding:8px 12px;
  font:700 16px var(--body);color:var(--ink);cursor:pointer}
.menu-toggle .bars{display:inline-flex;flex-direction:column;gap:4px;width:22px}
.menu-toggle .bars span{display:block;height:3px;border-radius:2px;background:var(--ink);transition:transform .2s ease,opacity .2s ease}
.menu-toggle[aria-expanded=true] .bars span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded=true] .bars span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded=true] .bars span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:900px){
  .js .menu-toggle{display:inline-flex}
  .js .top nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;border-top:2px solid var(--ink);margin-top:6px;padding-top:6px}
  .js .top nav.open{display:flex}
  .js .top nav a,.js .top nav form{padding:12px 2px;border-bottom:1px solid var(--rule);font-size:18px}
  .js .top nav a.btn{text-align:center;margin:12px 0 6px;border-bottom:2px solid var(--ink);padding:12px 16px}
  .js .top nav button.link{font-size:18px;padding:0}
}
@media (prefers-reduced-motion:reduce){.menu-toggle .bars span{transition:none}}

/* Dashboard submenu (desktop: a dropdown panel; mobile: indented inside the Menu). Without JS the panel shows inline. */
.dash-menu{position:relative}
.dash-top{display:inline-flex;align-items:center;gap:6px}
.js .dash-top::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .15s ease}
.js .dash-top[aria-expanded=true]::after{transform:rotate(-135deg) translateY(-1px)}
.dash-sub{list-style:none;margin:0;padding:0;display:flex;gap:6px 18px;flex-wrap:wrap}
.dash-sub a,.dash-sub button.link{font-weight:700;font-size:16px;color:var(--ink);text-decoration:none}
.js .dash-sub{display:none}
.js .dash-sub.open{display:flex}
@media (min-width:901px){
  .js .dash-sub{position:absolute;right:0;top:calc(100% + 12px);z-index:45;flex-direction:column;gap:0;min-width:230px;padding:6px 0;
    background:var(--paper);border:2px solid var(--ink);border-radius:10px;box-shadow:5px 6px 0 var(--ink)}
  .js .dash-sub li a,.js .dash-sub li form{display:block;padding:10px 18px}
  .js .dash-sub li a:hover,.js .dash-sub li a[aria-current]{background:#fbfac9;text-decoration:none}
  .js .dash-sub li:last-child{border-top:1px solid var(--rule);margin-top:4px}
}
@media (max-width:900px){
  .js .dash-menu{border-bottom:1px solid var(--rule)}
  .js .top nav .dash-top{padding:12px 2px;border-bottom:0;width:100%;justify-content:space-between}
  .js .dash-sub.open{flex-direction:column;gap:0;padding:0 0 8px 18px;border-left:3px solid var(--hi);margin-left:2px}
  .js .dash-sub li a,.js .dash-sub li form{display:block;padding:10px 2px;font-size:17px}
}
/* overview tiles */
.dash{list-style:none;padding:0;margin:8px 0 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;max-width:none}
.dash a{display:flex;flex-direction:column;gap:4px;height:100%;padding:16px 18px;border:2px solid var(--ink);border-radius:10px;color:var(--ink);text-decoration:none;box-shadow:4px 5px 0 var(--ink);background:#fff}
.dash a:hover{background:#fbfac9}
.dash-label{font-weight:700}
.dash-n{font-family:var(--display);font-weight:900;font-size:44px;line-height:1}
.dash-n small{font:700 15px var(--body);color:var(--ink-2)}
.dash-note{color:var(--ink-2);font-size:15px}

/* availability */
.avail{display:inline-block;font-weight:700;font-size:14px;padding:1px 8px;border-radius:4px;margin-left:6px}
.avail.in_stock{background:#d9f2df;color:#14481f}.avail.limited{background:#fff1c2;color:#6b4e00}
.want-meta .avail{margin-left:0}
.avail-box{max-width:var(--measure);margin:12px 0 20px;padding:14px 18px;border:2px solid var(--ink);border-radius:10px;background:#fff;box-shadow:4px 5px 0 var(--ink)}
.avail-box h2{margin:0 0 8px;font-size:30px}
.stores{list-style:none;padding:0;margin:0}.stores li{padding:8px 0;border-bottom:1px solid var(--rule);line-height:1.5}
.stores li:last-child{border-bottom:0}.stores li a{margin-left:8px}
.matchreview{margin-top:10px}.matchreview summary{cursor:pointer;font-weight:700;color:var(--lav-ink)}.matchreview li{margin:6px 0}
.huntlist{list-style:none;padding:0;margin:0;border-top:2px solid var(--ink)}
.hunt{padding:18px 0;border-bottom:1px solid var(--rule)}
.hunt-head{display:flex;justify-content:space-between;gap:16px;align-items:center}
.margin{margin:6px 0}
.avail.spotted{background:#e6e0ff;color:#3a2a9a}.spotform{max-width:var(--measure);margin:10px 0 16px}.spotform summary{cursor:pointer;font-weight:700;color:var(--lav-ink)}
.catnav{display:flex;flex-wrap:wrap;gap:6px 14px;margin:10px 0 14px}.catnav a[aria-current]{font-weight:700;color:var(--ink);text-decoration-thickness:3px}
.areas{margin:0 0 16px}.areas a[aria-current]{font-weight:700}
.mostwanted{list-style:none;margin:0;padding:0;counter-reset:mw}
.mw{counter-increment:mw;display:grid;grid-template-columns:2.4rem 64px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.mw::before{content:counter(mw);font-family:var(--display);font-size:1.8rem;font-weight:800;color:var(--lav-ink);text-align:right}
.mw-img{width:64px;height:64px;object-fit:contain;background:#fff;border:1px solid var(--rule)}
.mw-body p{margin:2px 0}.mw-meta{color:var(--ink-2)}.mw-act a{margin-right:12px}
@media (max-width:480px){.mw{grid-template-columns:2rem 1fr}.mw-img,.mw .sticker{display:none}}
.mw-noimg{display:block;border-style:dashed;background:transparent}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.alertlist{list-style:none;padding:0;max-width:var(--measure)}.alertlist li{padding:10px 0;border-bottom:1px solid var(--rule)}.alertlist .inline{display:inline;margin-left:10px}
@media (max-width:480px){.brand{font-size:25px;gap:8px}.brand .brand-mark{width:38px;height:38px}}
.hotlist{list-style:none;margin:0;padding:0}
.hot{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--rule)}
.hot-body p{margin:2px 0}.hot .want-title{font-weight:700;font-size:1.05rem}
.heat{font-weight:700;color:var(--lav-ink)}.demand{background:var(--hi);display:inline-block;padding:2px 8px;margin:4px 0}
.hot-stores summary{cursor:pointer;color:var(--lav-ink);font-weight:700}.hot-stores .stores{margin:6px 0 4px}
@media (max-width:480px){.hot{grid-template-columns:48px 1fr}.hot .mw-img{width:48px;height:48px}}

/* two-sided layout (v0.24): equal columns for collectors and feeders */
.sides{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:24px 0}
.side{min-width:0}.side h2{margin-bottom:10px}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:8px 0 32px}
.door{border:2px solid var(--ink);padding:20px 22px;background:#fff;box-shadow:6px 6px 0 var(--ink)}
.door h2{font-size:34px;margin:0 0 8px}.door .actions{margin:16px 0 0}
.minilist{list-style:none;padding:0;margin:0}.minilist li{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.minilist img,.minilist .mw-noimg{width:52px;height:52px;object-fit:contain;background:#fff;border:1px solid var(--rule)}
.center{text-align:center}
.page-head .actions{margin:14px 0 4px}
.howbox{border-top:2px solid var(--ink);margin:36px 0 0;padding-top:8px}
.steps.compact li{padding:10px 0 10px 48px}.steps.compact li::before{font-size:30px;top:9px;width:40px}
.tabs{display:flex;flex-wrap:wrap;gap:4px 22px;border-bottom:2px solid var(--ink);margin:18px 0 14px}
.tabs a{padding:8px 0;font-weight:700;text-decoration:none;color:var(--ink-2)}.tabs a[aria-current]{color:var(--ink);box-shadow:inset 0 -5px 0 var(--hi)}
.pager{display:flex;gap:18px;align-items:center;margin:18px 0}
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.way{border-top:4px solid var(--lav);padding-top:8px}.way h3{font-family:var(--display);font-size:26px;margin:0 0 6px}
.wantlist.compact li{padding:8px 0;border-bottom:1px solid var(--rule);list-style:none}.wantlist.compact{padding:0}
.boxes{margin-top:36px;border-top:2px solid var(--ink);padding-top:8px;max-width:var(--measure)}
.compare{table-layout:fixed}.compare col.c-q{width:28%}.compare col.c-a{width:36%}
@media (max-width:768px){.sides,.doors,.ways{grid-template-columns:1fr}}

/* Your account (v0.26) */
.needs{border:2px solid var(--ink);background:var(--hi);padding:12px 18px;margin:8px 0 8px;box-shadow:5px 5px 0 var(--ink);max-width:var(--measure)}
.needs h2{font-size:26px;margin:0 0 6px}.needs ul{margin:0;padding-left:20px}.needs li{padding:3px 0;font-weight:700}
.acctlist{list-style:none;padding:0;margin:0 0 10px}.acctlist li{padding:8px 0;border-bottom:1px solid var(--rule)}
.facts-list{list-style:none;padding:0;margin:14px 0}.facts-list li{padding:6px 0}
.details-box,.adminstrip{border-top:2px solid var(--ink);margin-top:30px;padding-top:6px}
.detailsform{display:grid;grid-template-columns:minmax(0,1fr) 9rem auto;gap:12px 16px;align-items:end;max-width:640px;margin:8px 0}
.detailsform .field{display:flex;flex-direction:column;gap:6px}.detailsform label{font-weight:700}
@media (max-width:480px){.detailsform{grid-template-columns:1fr}.detailsform .btn{justify-self:start}}
.adminstrip ul{padding-left:20px}
.adminstrip .dash{max-width:none}
.hot .want-title{font-weight:700;font-size:1.05rem}.item-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.is-disabled{color:var(--ink-2);opacity:.55;cursor:not-allowed;text-decoration:none}.btn.is-disabled{background:#d9d6e8;border-color:#d9d6e8;color:#55516f;opacity:1}
.mw-act{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}.mw-act a{margin:0}.mw-act .inline{margin:0}
.door .actions .btn,.page-head .actions .btn{margin:0}
/* button rows (v0.27.3): one gap everywhere; side by side, stacked full-width on phones */
.item-actions{gap:12px 14px}.mw-act{gap:10px 12px}
.acctlist .btn{margin-left:10px}
@media (max-width:480px){.actions,.item-actions{flex-direction:column;align-items:stretch}.actions .btn,.item-actions .btn,.item-actions form,.item-actions form .btn{width:100%;text-align:center}
  .acctlist .btn{display:block;margin:8px 0 0;text-align:center}}
/* home lists as boxed panels (v0.27.5): equal height, button pinned to the bottom so both line up */
.panels{align-items:stretch}
.panel{border:2px solid var(--ink);background:#fff;box-shadow:6px 6px 0 var(--ink);padding:20px 22px;display:flex;flex-direction:column}
.panel h2{margin:0 0 6px}.panel .minilist li:last-child{border-bottom:0}
.panel-foot{margin:auto 0 0;padding-top:16px;max-width:none}
p.center{max-width:none;text-align:center;margin:32px 0 8px}

/* Wordmark (v0.32.1): the "s" belongs to neither half, so it reads "collectibles mart" and "collectible smart" */
.brand-name .wm-s{color:var(--lav-ink)}
.brand-name .wm-mart{color:var(--hi);-webkit-text-stroke:.06em var(--ink);paint-order:stroke fill}