*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;color:#1d1d1f;background:#f6f6f8}
a{color:#0a58ca}
header.site{background:#111;color:#fff;padding:.75rem 1rem}
header.site a{color:#fff;text-decoration:none;margin-right:1rem}
header.site .brand{font-weight:700;font-size:1.15rem}
header.site .tagline{color:#bbb;font-size:.85rem;margin-right:1rem}
main{max-width:960px;margin:0 auto;padding:1rem}
h1{font-size:1.6rem;margin:.5rem 0 1rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.card{background:#fff;border-radius:8px;padding:1rem;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.card h3{font-size:1rem;margin:0 0 .5rem}
.price{font-size:1.25rem;font-weight:700}
.was{text-decoration:line-through;color:#666;margin-left:.4rem}
.off{background:#c62828;color:#fff;border-radius:4px;padding:0 .4rem;font-size:.85rem;margin-left:.4rem}
.meta,.asof{color:#555;font-size:.85rem}
.tag{display:inline-block;background:#e8eaf6;border-radius:4px;padding:0 .4rem;margin:0 .25rem .25rem 0;font-size:.8rem}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{text-align:left;padding:.5rem;border-bottom:1px solid #e5e5e5;vertical-align:top}
.btn{display:inline-block;background:#f0a500;color:#111;font-weight:700;padding:.4rem .9rem;border-radius:6px;text-decoration:none;white-space:nowrap}
.btn:hover{background:#ffb81c}
.empty{background:#fff;padding:1.5rem;border-radius:8px}
footer.site{max-width:960px;margin:2rem auto 0;padding:1rem;border-top:1px solid #ddd;font-size:.85rem;color:#444}
@media (max-width:600px){
 h1{font-size:1.3rem}
 header.site .tagline{display:block;margin:.2rem 0}
 table,thead,tbody,tr,th,td{display:block}
 thead{display:none}
 tr{border-bottom:1px solid #e5e5e5;padding:.5rem 0}
 td{border:0;padding:.2rem .5rem}
 td[data-label]::before{content:attr(data-label) ": ";font-weight:600}
}