:root{color-scheme:light dark;--surface:#fff;--bg:#f7f7f8;--text:#161719;--muted:#52555b;--line:#dedfe3;--accent:#973413}
@media(prefers-color-scheme:dark){:root{--surface:#191c20;--bg:#0f1113;--text:#f4f4f5;--muted:#c1c3c7;--line:#383b42;--accent:#ff956f}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,sans-serif}
header,main{width:min(1120px,calc(100% - 36px));margin:auto}
header{padding:22px 0;border-bottom:1px solid var(--line)}
.brand{font-size:1.25rem;font-weight:800;color:var(--text);text-decoration:none}
a{color:var(--accent)}
nav{display:flex;justify-content:space-between;gap:16px;margin:20px 0}
article{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,5vw,60px);padding:clamp(16px,3vw,32px);border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.gallery{display:grid;align-content:start;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}
figure{margin:0;border-radius:14px;background:var(--bg);overflow:hidden}
figure:first-child{grid-column:1/-1}
img{display:block;width:100%;aspect-ratio:5/4;object-fit:contain;padding:12px}
[hidden]{display:none!important}
figcaption,.missing-photo{padding:0 12px 12px;color:var(--muted);font-size:.85rem}
h1{font-size:clamp(28px,4vw,47px);line-height:1.1;letter-spacing:-.04em;margin:10px 0 18px;overflow-wrap:anywhere}
.status{font-weight:700;color:var(--accent)}
.price{font-size:1.8rem;font-weight:800;margin:12px 0}
dl div{display:flex;gap:8px}
dt{font-weight:700}
dd{margin:0}
.description{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--muted)}
.action{display:inline-block;padding:10px 16px;border:1px solid var(--line);border-radius:10px;font-weight:700}
main{padding-bottom:48px}
@media(max-width:720px){article{grid-template-columns:1fr}.gallery:empty{display:none}}

/* Product gallery and purchase details */
:root{--action:#bd3c0b;--accent:#a5330b}
@media(prefers-color-scheme:dark){:root{--bg:#101316;--surface:#171b1f;--accent:#ffa877}}
.brand span{color:var(--accent)}
article{align-items:start;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);padding:clamp(14px,3vw,30px)}
.gallery{display:block}
.gallery-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;border-radius:16px}
.gallery-track figure{flex:0 0 100%;min-width:0;scroll-snap-align:start}
.gallery-image{display:block;position:relative;cursor:zoom-in}
.gallery-image img{aspect-ratio:5/4;padding:clamp(12px,3vw,32px)}
.enlarge{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--text);font-size:1.3rem}
.gallery-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px;font-variant-numeric:tabular-nums}
.gallery-controls button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--text);cursor:pointer;font:inherit}
.gallery-controls button:disabled{opacity:.4;cursor:default}
.product-copy{padding:clamp(0px,1.5vw,18px);min-width:0}
.status{display:inline-block;margin:0 0 8px;padding:4px 10px;background:var(--bg);border:1px solid var(--line);border-radius:999px;font-size:.85rem}
.price{font-size:clamp(30px,4vw,42px);line-height:1.1;letter-spacing:-.03em}
dl{margin:20px 0}
dl:empty{display:none}
dl div{justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
dd{text-align:end;overflow-wrap:anywhere}
.action{background:var(--action);color:white;text-decoration:none}
.action:hover{background:#9d3109}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:720px){article{grid-template-columns:minmax(0,1fr)}.product-copy{padding:4px}}

/* Storefront product layout */
article { background: transparent; border: 0; padding: 0; gap: clamp(24px, 5vw, 64px); }
.gallery-track figure { border: 1px solid var(--line); background: var(--surface); }
.gallery-image img { aspect-ratio: 1; }
.product-copy { padding: clamp(0px, 2vw, 24px) 0; }
.product-copy h1 { margin-top: 0; }
.product-copy .action { display: block; width: min(100%, 360px); text-align: center; }
.gallery-thumbnails { display: flex; gap: 10px; margin-top: 12px; padding: 3px; overflow-x: auto; }
.gallery-thumbnails button { flex: 0 0 68px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; }
.gallery-thumbnails button[aria-current] { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.gallery-thumbnails img { aspect-ratio: 1; padding: 6px; }
.product-description { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 24px; }
.product-description h2 { margin: 0 0 12px; font-size: clamp(21px, 3vw, 28px); }
.product-description p { max-width: 75ch; }
@media(max-width:720px) { .product-copy { padding: 0; } }
