:root{--ink:#16181d;--mut:#5c6370;--line:#dfe3ea;--bg:#fff;--accent:#0b5}
*{box-sizing:border-box}body{margin:0;font:16px/1.55 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
.demo-banner{margin:0;padding:.6rem 1rem;background:#fff4d6;border-bottom:1px solid #e8d08a;font-weight:600;font-size:.9rem;text-align:center}
header.site,footer.site,main{max-width:64rem;margin:0 auto;padding:1rem}
header.site{display:flex;gap:1.5rem;align-items:baseline;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.brand{font-weight:700;font-size:1.15rem;text-decoration:none;color:var(--ink)}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.9rem;flex-wrap:wrap;font-size:.9rem}
nav ul ul{display:none}
a{color:#064;text-underline-offset:2px}
h1{font-size:1.6rem;line-height:1.25}h2{font-size:1.15rem;margin-top:2rem}h3,h4{font-size:1rem}
.crumbs{list-style:none;display:flex;gap:.5rem;padding:0;font-size:.85rem;color:var(--mut);flex-wrap:wrap}
.crumbs li+li::before{content:"/";margin-right:.5rem;color:var(--line)}
.grid{list-style:none;padding:0;display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr))}
.grid li{border:1px solid var(--line);border-radius:6px;padding:.7rem;font-size:.92rem;min-width:0;overflow-wrap:anywhere}
.gallery{display:flex;gap:.5rem;overflow-x:auto;margin:1rem 0}
.gallery img{width:9rem;height:auto;border:1px solid var(--line);border-radius:6px}
img{max-width:100%;height:auto}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{text-align:left;padding:.4rem .6rem;border-bottom:1px solid var(--line)}
th{width:40%;color:var(--mut);font-weight:600}
.price{font-size:1.25rem;font-weight:700}
.stock{font-size:.8rem;font-weight:600;color:var(--mut)}
.sku{color:var(--mut);font-size:.88rem}
footer.site{border-top:1px solid var(--line);margin-top:3rem;color:var(--mut);font-size:.88rem}
.legal{margin-top:1rem}
@media(max-width:40rem){header.site{gap:.75rem}main{padding:1rem .9rem}}