/* npshop: every book in one table with the best cell marked (shared by the board) */
.npshop{margin:12px 0 2px}
.npshop .shbest{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.npshop .bestchip{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border:1px solid rgba(95,255,170,.35);border-radius:10px;background:rgba(95,255,170,.07);flex:1 1 150px;max-width:260px;min-width:0}
.npshop .bestchip .lb{font-family:var(--font-body);font-weight:600;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--haze)}
.npshop .bestchip .num{font-family:var(--font-body);font-weight:700;font-size:18px;color:var(--turf);font-variant-numeric:tabular-nums}
.npshop .bestchip .num small{font-weight:600;font-size:13px;color:var(--turf);opacity:.85;margin-left:4px}
.npshop .bestchip .bk{font-family:var(--font-body);font-size:12.5px;color:var(--ice)}
.npshop .bestchip.none{border-color:var(--hairline);background:transparent}
.npshop .bestchip.none .num{color:var(--dim);font-size:13px;font-weight:600}
.npshop .shsec{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.04em;color:var(--ice);margin:16px 0 8px}
.npshop .shsec:first-child{margin-top:0}
.npshop .shwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.npshop table.sh{border-collapse:separate;border-spacing:0;width:100%;font-family:var(--font-body);font-size:14.5px;font-variant-numeric:tabular-nums;margin:0 0 6px}
.npshop table.sh th{font-weight:600;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--haze);text-align:right;padding:6px 10px 8px;border-bottom:1px solid var(--hairline);white-space:nowrap}
.npshop table.sh th:first-child{text-align:left}
.npshop table.sh td{padding:9px 10px;border-bottom:1px solid var(--hairline);text-align:right;white-space:nowrap;color:var(--ice)}
.npshop table.sh td:first-child{text-align:left;font-weight:600;color:var(--ice)}
.npshop table.sh td .pr{font-size:12.5px;color:var(--haze);margin-left:1px}
.npshop table.sh td.na{color:var(--dim)}
.npshop table.sh td.best{color:var(--turf);font-weight:700}
.npshop table.sh td.best .pr{color:var(--turf);opacity:.85}
.npshop table.sh td .q{display:inline-block;padding:3px 9px;border:1px solid transparent}
.npshop table.sh td.best .q{border-radius:999px;background:rgba(95,255,170,.14);border-color:rgba(95,255,170,.4)}
.npshop table.sh tr.ref td{color:var(--dim)}
.npshop table.sh tr.ref td:first-child{color:var(--haze);font-weight:500}
.npshop table.sh tr.ref td .pr{color:var(--dim)}
.npshop table.sh tr.ref td.best{color:var(--haze);font-weight:600}
.npshop table.sh tr.ref td.best .q{background:transparent;border-color:var(--hairline)}
.npshop .reftag{font-family:var(--font-body);font-size:10.5px;color:var(--dim);margin-left:6px;text-transform:uppercase;letter-spacing:.05em}
/* A quote we have not SEEN inside NPShop.STALE_HOURS: dimmed with real opacity
   (a colour swap can leave text reading fine, which is the lesson this project
   already learned) and never allowed the .best pill. .staletag names the age
   beside the book, because dimming on its own reads as a broken page. */
.npshop table.sh td.stale{opacity:.45}
.npshop table.sh td.stale .q{border-color:transparent;background:transparent}
.npshop .staletag{font-family:var(--font-body);font-size:10.5px;color:var(--dim);margin-left:6px;white-space:normal;letter-spacing:.03em}
.npshop .shnone{font-size:13.5px;color:var(--haze);padding:6px 0}
.npshop table.sh th .abbr{display:none}
@media (max-width:640px){
  .npshop table.sh th .full{display:none} .npshop table.sh th .abbr{display:inline}
  .npshop table.sh{font-size:13.5px;table-layout:fixed}
  .npshop table.sh th:first-child,.npshop table.sh td:first-child{width:31%;white-space:normal;font-size:13px}
  .npshop table.sh td{padding:8px 3px}
  .npshop table.sh td .q{padding:3px 6px}
  .npshop .reftag{display:block;margin:2px 0 0}
  .npshop .staletag{display:block;margin:2px 0 0;margin-left:0}
  .npshop .bestchip{max-width:none;padding:8px 10px}
  .npshop .bestchip .num{font-size:17px}
}