.shop{max-width:1180px;margin:0 auto;padding:140px 24px 72px;text-align:center}
.shop h1{font-weight:500;font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:.03em;margin:10px 0 6px}
.shop-sub{opacity:.7;font-size:1.15rem;margin:0 0 36px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:28px;text-align:left}
.pc{background:var(--cream-soft);border:1px solid var(--ink-35);border-radius:3px;overflow:hidden;display:flex;flex-direction:column}
.pc-img{aspect-ratio:1/1;background:#fff;display:flex;align-items:center;justify-content:center}
.pc-img img{width:100%;height:100%;object-fit:contain;display:block}
.pc-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.pc-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.pc-top h2{font-weight:500;font-size:1.45rem;margin:0}
.pc-price{font-size:1.3rem;font-weight:600}
.pc-fit{margin:0;font-size:1rem;opacity:.7}
.pc-colors-label{margin:6px 0 0;font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.sws{display:flex;flex-wrap:wrap;gap:5px;}
.sw{font-family:inherit;font-size:.82rem;padding:3px 8px;border:1px solid var(--ink-35);background:transparent;color:var(--navy);border-radius:2px;cursor:pointer}
.sw.on,.sw:hover{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.pc-avail{margin:4px 0 0;font-size:.92rem;font-style:italic;opacity:.8}
.pc-foot{margin-top:auto;padding-top:12px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.buy{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--navy);border:1px solid var(--navy);padding:8px 12px;border-radius:2px}
a.buy:hover{background:var(--navy);color:var(--cream)}
@media(max-width:640px){.shop{padding-top:110px}.grid{grid-template-columns:1fr 1fr;gap:14px}.pc-top h2{font-size:1.15rem}.pc-foot{flex-direction:column;align-items:flex-start}}
@media(max-width:420px){.grid{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 30px}
.chip{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;padding:9px 14px;border:1px solid var(--ink-35);background:transparent;color:var(--navy);border-radius:2px;cursor:pointer}
.chip.on,.chip:hover{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.pc[hidden]{display:none}
@media(max-width:640px){.chips{gap:6px;margin-bottom:22px}.chip{padding:8px 11px;font-size:.58rem}}
.pc-num{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;opacity:.55;margin-right:6px;vertical-align:middle}
.pc-view{display:inline-flex;gap:0;margin:2px 0 2px;border:1px solid var(--ink-35);border-radius:2px;align-self:flex-start}
.pv{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;padding:7px 14px;border:0;background:transparent;color:var(--navy);cursor:pointer}
.pv+.pv{border-left:1px solid var(--ink-35)}
.pv.on{background:var(--navy);color:var(--cream)}

.pc-foot{flex-wrap:wrap;gap:8px 0}

.pc-ship{margin:6px 0 0;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;opacity:.6}
.buy.buy-etsy{background:var(--navy);color:var(--cream)}
a.buy.buy-etsy:hover{opacity:.85}
.pc-foot{gap:8px 10px;justify-content:flex-start}
.pu-group{margin:2px 0}
.pc [hidden]{display:none}

/* ---- Round 2: tools, filters, drawer ---- */
.chip .n{opacity:.6;margin-left:4px}
.tools{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 14px;text-align:left}
.count{margin:0;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-right:auto}
.sortwrap{display:flex;align-items:center;gap:8px}
.sortwrap label,.fgroup legend{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.sortwrap select{font:inherit;font-size:.95rem;color:var(--navy);background:var(--cream-soft);border:1px solid var(--ink-35);border-radius:2px;padding:7px 10px}
.clear{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;background:none;border:0;border-bottom:1px solid var(--navy);color:var(--navy);padding:2px 0;cursor:pointer}
.clear[hidden]{display:none}
.ft-open,.fhead,.fbackdrop,.ffoot{display:none}
.fpanel{border:1px solid var(--ink-35);border-radius:3px;background:var(--cream-soft);padding:16px 18px;margin:0 0 26px;text-align:left}
.fbody{display:flex;flex-wrap:wrap;gap:20px 40px}
.fgroup{border:0;margin:0;padding:0;min-width:0}
.fgroup legend{padding:0;margin-bottom:8px}
.fopts{display:flex;flex-wrap:wrap;gap:6px}
.ft{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:8px 11px;border:1px solid var(--ink-35);background:transparent;color:var(--navy);border-radius:2px;cursor:pointer}
.ft.on,.ft:hover{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.ft-sw{width:30px;height:30px;padding:3px;border:1px solid var(--ink-35);background:transparent;border-radius:50%;cursor:pointer}
.ft-sw span{display:block;width:100%;height:100%;border-radius:50%;border:1px solid var(--ink-35)}
.ft-sw.on{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy)}
.ft:focus-visible,.ft-sw:focus-visible,.chip:focus-visible,.sw:focus-visible,.pv:focus-visible,.buy:focus-visible,.clear:focus-visible,.sortwrap select:focus-visible,.ft-open:focus-visible,.fclose:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.empty{padding:48px 0;text-align:center}
.empty p{font-size:1.25rem;margin:0 0 16px}
.empty[hidden],.grid[hidden]{display:none}
.is-sorted .pc-num{display:none}

/* whole-card link (stretched) */
.pc{position:relative;transition:border-color .15s,box-shadow .15s}
.pc:hover{border-color:var(--navy);box-shadow:0 6px 18px rgba(31,45,71,.12)}
.pc-link{color:inherit;text-decoration:none}
.pc-link::after{content:"";position:absolute;inset:0;z-index:1}
.pc-link:focus-visible{outline:none}
.pc-link:focus-visible::after{outline:2px solid var(--navy);outline-offset:-3px;border-radius:3px}
.pc .sws,.pc .pc-view,.pc .pc-foot{position:relative;z-index:2}

@media(max-width:760px){
  .tools{justify-content:space-between}
  .ft-open{display:inline-block;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;padding:10px 14px;border:1px solid var(--navy);background:transparent;color:var(--navy);border-radius:2px;cursor:pointer}
  .ft-open.has{background:var(--navy);color:var(--cream)}
  
  .fpanel{position:fixed;top:0;right:0;bottom:0;width:min(360px,92vw);z-index:200;margin:0;border-radius:0;border-width:0 0 0 1px;display:none;flex-direction:column;padding:0;background:var(--cream)}
  .fpanel.open{display:flex}
  .fhead{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--ink-35);font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
  .fclose{font-size:1.8rem;line-height:1;background:none;border:0;color:var(--navy);cursor:pointer;padding:0 6px}
  .fbody{flex-direction:column;flex-wrap:nowrap;gap:22px;padding:18px;overflow-y:auto;flex:1}
  .fsort .sortwrap{display:flex;flex-direction:column;align-items:flex-start}
  .fsort select{width:100%}
  .ffoot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;border-top:1px solid var(--ink-35)}
  .fbackdrop{display:block;position:fixed;inset:0;background:rgba(20,28,45,.45);z-index:190}
  .fbackdrop[hidden]{display:none}
  body.noscroll{overflow:hidden}
  .ft{padding:10px 12px}
  .ft-sw{width:36px;height:36px}
}
.fsort:empty{display:none}