:root{--catalog-content-width:1440px;--catalog-gutter:clamp(32px,3vw,48px);font:16px/1.6 system-ui,sans-serif;color:#24362f;background:#f7f6f2;color-scheme:light}
*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:calc(var(--catalog-content-width) + 2 * var(--catalog-gutter));margin:auto;padding:24px var(--catalog-gutter)}header{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #d7dbd4}header a{color:inherit;font-weight:700;text-decoration:none}header span,footer{color:#59685e;font-size:.85rem}main{min-height:75vh;padding-top:50px}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.75rem}h1,h2,h3{font-family:Georgia,serif;font-weight:400;line-height:1.15}h1{font-size:clamp(2.5rem,6vw,4.5rem);max-width:700px;margin:20px 0}h2{font-size:2.2rem}h3{font-size:1.5rem;margin:15px 0}.intro{color:#59685e}form{margin:36px 0}label{display:block;font-size:.85rem;margin-bottom:8px}.search-row{display:flex;gap:12px;max-width:650px}input{min-width:0;flex:1;padding:14px;border:1px solid #929f94;background:white;font:inherit;border-radius:4px}button{font:inherit;padding:12px 20px;background:#294b3a;color:white;border:1px solid #294b3a;border-radius:4px;cursor:pointer}button:hover{background:#193627}button:disabled{opacity:.5;cursor:wait}button.quiet{background:transparent;color:#294b3a}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #b68336;outline-offset:4px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:28px;margin:28px 0}.card{display:block;width:100%;text-align:left;background:transparent;color:inherit;padding:0 0 16px;border:0;border-bottom:1px solid #ced4cc;border-radius:0}.card:hover{background:#eaece5}.card img,.placeholder{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e4e7df}.placeholder{display:grid;place-items:center;color:#5d695f;font-size:.9rem}.card h3,.card p{margin-left:8px;margin-right:8px}.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.gallery img,.gallery .placeholder{width:100%;aspect-ratio:4/3;max-height:520px;object-fit:contain;background:#e4e7df}dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 20px}dt{color:#59685e}dd{margin:0;overflow-wrap:anywhere}dialog{width:min(760px,94vw);max-height:90vh;border:1px solid #c4cec2;border-radius:8px;padding:24px;background:#f7f6f2;color:inherit}dialog::backdrop{background:#15271caa}#status{padding:16px 0}footer{border-top:1px solid #d7dbd4;margin-top:40px}[hidden]{display:none!important}@media(max-width:500px){header,main,footer{padding:20px}header span{display:none}.search-row{gap:8px}button{padding:12px}.grid{grid-template-columns:1fr}dl{grid-template-columns:1fr;gap:2px}dd{margin-bottom:10px}}
.card{text-decoration:none}.card h2{font-size:1.5rem;margin:16px 8px}nav{display:flex;gap:12px;flex-wrap:wrap}#share-link{width:100%;margin:16px 0}#content>p:first-child{color:#59685e}#content:empty{display:none}

#filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:28px 0}#search-field{flex:2;min-width:180px}#category-field,#thickness-field,#color-field,#finish-field{flex:1;min-width:160px}#filters input,#filters select{width:100%;min-height:50px}#filters select{padding:12px;border:1px solid #929f94;border-radius:4px;background:white;color:inherit;font:inherit}#filters button{min-height:50px}select:focus-visible{outline:3px solid #b68336;outline-offset:4px}@media(max-width:500px){#filters>div{flex-basis:100%}#filters button{flex:1}}

/* Compact material overview and slab comparison cards. */
.product-detail{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:40px;align-items:start;margin:32px 0 48px}
.product-detail .gallery{grid-template-columns:1fr;min-width:0;gap:12px}
.product-detail .gallery img,.product-detail .gallery .placeholder{display:block;max-height:420px;border-radius:8px}
.product-detail .gallery>:not(:first-child){max-height:180px}
.product-detail .detail-summary{min-width:0;padding:12px 0}
.product-detail h1{font-size:clamp(2rem,4vw,3.2rem);margin:0 0 24px;overflow-wrap:anywhere}
.product-detail dl{margin-top:24px;padding-top:20px;border-top:1px solid #d7dbd4;grid-template-columns:minmax(90px,auto) 1fr}
.product-detail:not(:has(.gallery)){grid-template-columns:1fr}
.slab-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}
.slab-card{background:#fff;border:1px solid #d7dbd4;border-radius:8px;overflow:hidden;padding-bottom:16px;transition:border-color .15s}
.slab-card:hover{background:#fff;border-color:#294b3a}
.slab-card img,.slab-card .placeholder{display:block;height:150px;aspect-ratio:auto;object-fit:cover}
.slab-card .placeholder{display:grid;font-size:.8rem}
.slab-card h2{font-family:system-ui,sans-serif;font-size:1rem;font-weight:600;margin:16px}
.slab-card .slab-facts{font-size:.85rem;grid-template-columns:1fr auto;gap:6px 12px;margin:16px 16px 0}
.slab-facts dd{text-align:right}
@media(max-width:700px){.product-detail{grid-template-columns:1fr;gap:20px;margin-top:24px}.product-detail .detail-summary{padding:0}.product-detail h1{margin-bottom:16px}.slab-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.slab-facts dd{margin:0}}

.slab-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.slab-toolbar h2{margin:0}
#slab-view{display:flex;border:1px solid #929f94;border-radius:5px;overflow:hidden}
#slab-view button{border:0;border-radius:0;padding:9px 18px;min-height:44px;background:transparent;color:#294b3a}
#slab-view button[aria-pressed="true"]{background:#294b3a;color:white}
#slab-view button:focus-visible{outline-offset:-4px}
.slab-list{grid-template-columns:1fr;gap:12px}
.slab-list .slab-card{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:20px;padding:12px}
.slab-list .slab-card img,.slab-list .slab-card .placeholder{height:75px;border-radius:4px;font-size:.65rem;text-align:center}
.slab-list .slab-card h2{margin:0}
.slab-list .slab-facts{margin:0;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px}
.slab-list .slab-card:not(:has(img,.placeholder)){grid-template-columns:1fr}
@media(max-width:600px){.slab-list .slab-card{grid-template-columns:76px minmax(0,1fr);gap:12px}.slab-list .slab-card img,.slab-list .slab-card .placeholder{grid-row:1/3;height:64px}.slab-list .slab-facts{grid-column:2;font-size:.8rem}.slab-list .slab-card:not(:has(img,.placeholder)){grid-template-columns:1fr}.slab-list .slab-card:not(:has(img,.placeholder)) .slab-facts{grid-column:1}}

.enlarge-image{display:block;padding:0;border:0;background:transparent;cursor:zoom-in;width:100%;border-radius:8px;overflow:hidden}
.enlarge-image:hover{background:transparent}.enlarge-image img{display:block}
#viewer{width:min(960px,96vw);max-height:94dvh;padding:24px;overscroll-behavior:contain}
.viewer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.viewer-top h2{font-size:1.6rem;margin:0;overflow-wrap:anywhere}
.viewer-top button{flex-shrink:0}.viewer-media img,.viewer-media .placeholder{display:block;width:100%;height:min(55dvh,560px);object-fit:contain;aspect-ratio:auto;background:#e4e7df}.viewer-media .placeholder{display:grid}
.viewer-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.viewer-thumbnails{display:flex;gap:10px;overflow-x:auto;padding:8px 3px;max-width:100%}.viewer-thumbnails:empty{display:none}
.viewer-thumbnails button{flex:0 0 80px;height:64px;padding:3px;background:#e4e7df;color:#294b3a;border:2px solid transparent;font-size:.75rem}.viewer-thumbnails button[aria-pressed="true"]{border-color:#294b3a}.viewer-thumbnails img,.viewer-thumbnails .placeholder{height:100%;width:100%;object-fit:cover;aspect-ratio:auto;font-size:.65rem}
#viewer-slabs{border-top:1px solid #ced4cc;margin-top:12px}#viewer-share-link{width:100%;margin-top:12px}#viewer-status:empty{display:none}
@media(max-width:600px){#viewer{padding:16px;width:96vw}.viewer-top h2{font-size:1.3rem}.viewer-actions button{flex:1}.viewer-media img,.viewer-media .placeholder{height:40dvh}}
#viewer-body dl{grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;margin:20px 0}#viewer-body dd{text-align:right;margin:0}
.viewer-top{position:sticky;top:-24px;background:#f7f6f2;z-index:1;padding:8px 0}
@media(max-width:600px){.viewer-top{top:-16px}}

#brand-header{max-width:none;padding:24px max(var(--catalog-gutter),calc((100% - var(--catalog-content-width))/2));align-items:center;background:#fff;border-bottom:1px solid #d7dbd4;min-height:115px}
#home.brand{display:flex;align-items:center;gap:18px;min-width:0}
#brand-logo{width:82px;height:66px;object-fit:contain;flex-shrink:0}
header .brand-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
header #brand-name{display:block;color:#24362f;font-family:Georgia,serif;font-size:clamp(1.3rem,2.2vw,1.9rem);font-weight:400;line-height:1.15;overflow-wrap:anywhere}
header .brand-subtitle{display:block;color:#59685e;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;font-weight:500}
header .brand-note{font-size:.8rem;white-space:nowrap}
.embedded main{padding-top:24px}
@media(max-width:600px){#brand-header{padding:18px 20px;min-height:92px}#home.brand{gap:12px}#brand-logo{width:60px;height:52px}header .brand-note{display:none}header .brand-copy{display:flex}}

/* Demo landing page: materials first, compact controls and consistent cards. */
main.catalog-landing{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;padding-top:30px;align-content:start}
.catalog-landing>nav{grid-column:2;grid-row:1;align-self:center}
.catalog-landing>.catalog-intro{grid-column:1;grid-row:1;min-width:0}
.catalog-intro h1{font-size:clamp(1.9rem,3.5vw,2.7rem);margin:0 0 8px;max-width:none;letter-spacing:-.025em}
.catalog-intro p{font-size:.95rem;color:#59685e;margin:0}
.catalog-landing>#filters,.catalog-landing>#list,.catalog-landing>#share-link,.catalog-landing>.slab-toolbar,.catalog-landing>#status{grid-column:1/-1}
.catalog-landing>.slab-toolbar:has(#list-heading[hidden]){display:none}
.catalog-landing>#filters{display:grid;grid-template-columns:minmax(160px,1.6fr) repeat(4,minmax(100px,1fr)) auto auto;gap:10px;align-items:end;margin:24px 0;padding:18px;background:#fff;border:1px solid #dce0d8;border-radius:8px}
.catalog-landing>#filters>div{min-width:0}
.catalog-landing #filters label{font-size:.75rem;margin-bottom:6px;font-weight:600;color:#526157}
.catalog-landing #filters input,.catalog-landing #filters select{min-height:44px;padding:10px;font-size:.85rem;border-color:#bcc5bb}
.catalog-landing #filters button{min-height:44px;padding:10px 12px;font-size:.85rem;white-space:nowrap}
.catalog-landing #share{background:transparent;color:#294b3a;border-color:#bac4b9;font-size:.85rem;min-height:44px}
.catalog-landing>#list{margin:0 0 24px;gap:24px;grid-template-columns:repeat(4,minmax(0,1fr))}
.material-card{background:#fff;border:1px solid #dce0d8;border-radius:8px;overflow:hidden;padding-bottom:16px;transition:box-shadow .15s,border-color .15s;min-width:0}
.material-card:hover{background:#fff;border-color:#9baa9b;box-shadow:0 5px 18px #24362f12}
.material-card img{display:block;aspect-ratio:4/3;width:100%;object-fit:cover}
.material-card h2{font-size:1rem;line-height:1.25;margin:16px 16px 6px;overflow-wrap:anywhere}
.material-card p{font-size:.8rem;color:#59685e;margin:0 16px}
.catalog-landing>#more,.catalog-landing>#retry{grid-column:1/-1;justify-self:center}
@media(max-width:1050px){.catalog-landing>#filters{grid-template-columns:repeat(4,minmax(0,1fr))}.catalog-landing #search-field{grid-column:span 2}.catalog-landing>#list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){main.catalog-landing{column-gap:12px;padding-top:24px}.catalog-landing>.catalog-intro{grid-column:1/-1}.catalog-landing>nav{grid-column:1/-1;grid-row:2;margin-top:16px}.catalog-landing>#filters{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px;margin:20px 0}.catalog-landing #search-field{grid-column:1/-1}.catalog-landing>#list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.material-card h2{font-size:.875rem;margin:12px 12px 5px}.material-card p{margin:0 12px}.material-card .placeholder{font-size:.75rem}.catalog-intro p{font-size:.85rem}}
@media(prefers-reduced-motion:reduce){.material-card{transition:none}}

/* Detail polish: balanced overview and a dialog with always-reachable controls. */
main:not(.catalog-landing)>nav button{min-height:44px;font-size:.85rem;padding:10px 16px}
main:not(.catalog-landing){padding-top:28px}
.product-detail{gap:32px;margin:24px 0 36px;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.product-detail .gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.product-detail .gallery>:first-child{grid-column:1/-1;max-height:none}
.product-detail .gallery .enlarge-image:not(:first-child){max-height:110px}
.product-detail .gallery .enlarge-image:not(:first-child) img{height:110px;aspect-ratio:auto;object-fit:cover}
.product-detail .gallery .enlarge-image:not(:first-child) .image-hint{display:none}
.enlarge-image{position:relative}
.image-hint{position:absolute;bottom:12px;right:12px;border-radius:4px;background:#ffffffeb;color:#294b3a;font:500 .75rem/1.4 system-ui,sans-serif;padding:7px 10px;pointer-events:none}
.product-detail .detail-summary{padding:26px;background:white;border:1px solid #dce0d8;border-radius:8px}
.product-detail h1{font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.02em;margin-bottom:20px}
.product-detail dl{font-size:.9rem;gap:12px 20px;margin-bottom:0}
.product-detail dt{font-size:.8rem;align-self:center}.product-detail dd{font-weight:500}
.slab-toolbar{padding-top:24px;border-top:1px solid #d7dbd4}.slab-toolbar h2{font-size:1.8rem}
.slab-card h2{color:#294b3a}.slab-card .slab-facts{font-size:.8rem}
#viewer{padding:0;width:min(980px,96vw);max-height:94dvh;border:1px solid #cbd2c9;border-radius:12px;overflow:hidden;box-shadow:0 24px 90px #13251b45;background:white}
#viewer[open]{display:flex;flex-direction:column}
#viewer .viewer-top{position:static;flex-shrink:0;margin:0;padding:16px 24px;background:white}
.viewer-top h2{font-size:1.4rem}.viewer-top button{background:transparent;color:#294b3a;border-color:#cbd2c9;font-size:.85rem;padding:9px 14px;min-height:44px}
.viewer-scroll{overflow:auto;min-height:0;padding:20px 24px;overscroll-behavior:contain}
.viewer-media img,.viewer-media .placeholder{height:min(48dvh,480px);border-radius:6px;background:#f5f6f3}
#viewer-body dl{padding:16px 20px;margin:16px 0 0;background:white;border:1px solid #dce0d8;border-radius:6px;font-size:.9rem;gap:8px 24px}
#viewer-body dt{font-size:.8rem;align-self:center}#viewer-body dd{font-weight:500}
.viewer-footer{flex-shrink:0;padding:14px 24px;background:white;border-top:1px solid #dce0d8}
.viewer-actions{margin:0;align-items:center;gap:10px}.viewer-actions button{min-height:44px;font-size:.85rem;padding:10px 16px}#viewer-share{margin-left:auto}
#viewer-slabs{margin:12px 0 0;border-top:0;padding:5px 3px}
.viewer-thumbnails button{flex-basis:72px;height:54px;border-radius:5px;border:2px solid #dce0d8;opacity:.75}
.viewer-thumbnails button[aria-pressed="true"]{border:3px solid #294b3a;box-shadow:0 0 0 2px #b9c7b7;opacity:1}
.viewer-thumbnails button:hover{opacity:1;background:#e4e7df}
#viewer-share-link{font-size:.85rem}#viewer-status{font-size:.85rem;margin:12px 0 0}
@media(max-width:700px){.product-detail{grid-template-columns:1fr;gap:18px}.product-detail .detail-summary{padding:20px}.product-detail h1{margin-bottom:16px}.product-detail dl{grid-template-columns:minmax(80px,auto) 1fr}.product-detail dd{margin:0}}
@media(max-width:600px){#viewer{width:96vw;max-height:96dvh}#viewer .viewer-top{padding:12px 16px}.viewer-scroll{padding:14px 16px}.viewer-footer{padding:12px 16px}.viewer-media img,.viewer-media .placeholder{height:34dvh}.viewer-actions button{padding:9px 10px;font-size:.8rem}.viewer-actions #viewer-share{flex:1.3}#viewer-body dl{padding:12px;font-size:.85rem;gap:6px 12px}.viewer-thumbnails button{flex-basis:64px;height:48px}.image-hint{font-size:.7rem}}

#filter-toggle{grid-column:1/-1;justify-self:stretch;text-align:left;margin:18px 0;min-height:44px;border-color:#bac4b9;background:white;font-size:.9rem}
#filter-toggle::after{content:'+';float:right;font-size:1.1rem;line-height:1.4}#filter-toggle[aria-expanded="true"]::after{content:'−'}
@media(max-width:700px){.catalog-landing>#filters{margin-top:0}.catalog-landing>#filter-toggle[aria-expanded="true"]{margin-bottom:10px}}

.material-card .material-specifications{font-weight:600;color:#24362f;font-size:.85rem;margin-top:8px;overflow-wrap:anywhere}
.material-card .material-classification{margin-top:5px;overflow-wrap:anywhere}
@media(max-width:700px){.material-card .material-specifications{font-size:.8rem}}

/* Full-width product imagery; metadata is a stationary layer above the slides. */
.product-detail.product-carousel{display:block;margin:24px 0 32px}
.product-hero{position:relative;isolation:isolate;border-radius:10px;overflow:hidden;background:#24362f;height:clamp(360px,48vw,560px)}
.hero-media{position:absolute;inset:0;z-index:-2}
.hero-media img,.hero-media .placeholder{width:100%;height:100%;max-height:none;aspect-ratio:auto;display:block}
.hero-media .hero-slide{position:relative;overflow:hidden;isolation:isolate}
.hero-backdrop{position:absolute;inset:-24px;z-index:-1;pointer-events:none;filter:blur(20px) brightness(.85)}
.hero-backdrop img{object-fit:cover}
.hero-media .hero-image{object-fit:contain}
.hero-media .placeholder{display:grid;color:#fff;background:#34473c;align-items:start;padding-top:40px}
.product-hero::after{content:'';position:absolute;inset:auto 0 0;height:45%;max-height:220px;z-index:-1;background:linear-gradient(180deg,transparent,rgba(9,20,14,.15) 45%,rgba(9,20,14,.6) 100%);pointer-events:none}
.hero-overlay{position:absolute;bottom:40px;left:32px;right:32px;color:white;pointer-events:none}
.product-carousel .hero-overlay h1{font-size:clamp(1.375rem,2vw,1.75rem);margin:0 0 8px;max-width:100%;line-height:1.1;text-shadow:0 1px 5px #0005}
.hero-overlay p{margin:6px 0;overflow-wrap:anywhere}.hero-specs{font-size:1rem;font-weight:600}.hero-classification{font-size:.9rem;color:#f0f3ee}
 .hero-arrow{position:absolute;display:grid;place-items:center;padding:0;width:44px;height:44px;min-height:44px;border:1px solid #ffffff40;border-radius:50%;background:#16251b66;color:white;backdrop-filter:blur(8px);cursor:pointer}
.hero-arrow:hover{background:#16251ba6}
.hero-arrow{top:50%;transform:translateY(-50%);width:48px;height:48px;border:0;background:rgba(50,47,40,.3);color:#fffdf6;backdrop-filter:blur(3px)}
.hero-arrow:hover{background:rgba(50,47,40,.5)}
.hero-arrow svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.hero-previous{left:16px}.hero-next{right:16px}
.hero-dots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;max-width:calc(100% - 140px);overflow-x:auto}
.hero-dots button{border:0;background:transparent;min-height:32px;width:24px;flex:0 0 24px;padding:0;display:grid;place-items:center}
.hero-dots button::after{content:'';width:7px;height:7px;border-radius:50%;background:#ffffff70;box-shadow:0 0 2px #0006}
.hero-dots button[aria-pressed="true"]::after{background:white;width:9px;height:9px}
.product-hero{cursor:zoom-in}
.hero-tiles{display:flex;gap:12px;overflow-x:auto;padding:12px 3px 4px}
.hero-tiles button{padding:3px;flex:0 0 120px;height:84px;border:2px solid transparent;background:transparent;border-radius:7px;overflow:hidden}
.hero-tiles button[aria-pressed="true"]{border-color:#294b3a;background:#fff}
.hero-tiles img,.hero-tiles .placeholder{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:3px}
.product-description{max-width:800px;color:#59685e;font-size:.95rem;white-space:pre-line}
@media(max-width:600px){.product-hero{height:420px}.hero-overlay{left:20px;right:20px;bottom:40px}.hero-previous{left:10px}.hero-next{right:10px}.hero-specs{font-size:.9rem}.hero-classification{font-size:.8rem}.hero-tiles button{flex-basis:90px;height:66px}}

.hero-track{display:flex;width:100%;height:100%;transition:transform 450ms cubic-bezier(.22,.61,.36,1);will-change:transform}
.hero-track.instant{transition:none}
.hero-slide{flex:0 0 100%;width:100%;height:100%;min-width:0}
.product-hero{touch-action:pan-y pinch-zoom}
.hero-media{user-select:none}.hero-media img{-webkit-user-drag:none}
.product-hero:focus-visible{outline:3px solid #b68336;outline-offset:4px}

/* Compact slab-card details; full properties remain in the slab dialog. */
.slab-summary{padding:12px 16px 0}
.slab-card .slab-summary p{margin:0;line-height:1.45;overflow-wrap:anywhere}
.slab-dimensions{font-size:.9rem;font-weight:600;color:#24362f}
.slab-card .slab-summary .slab-stock{margin-top:4px;font-size:.8rem;color:#59685e}
.slab-list .slab-summary{padding:0;min-width:0}

/* Image-first dialog with persistent edge navigation and compact slab details. */
#viewer .viewer-top{padding:12px 20px}
.viewer-heading{display:flex;align-items:baseline;gap:12px;min-width:0;flex-wrap:wrap}
.viewer-heading h2{font-size:1.2rem;line-height:1.3}
#viewer-position{font-size:.8rem;color:#667267;white-space:nowrap}
#viewer-close{border:0;border-radius:50%;width:40px;height:40px;min-height:40px;padding:0;font-size:1.6rem;line-height:1;background:transparent}
#viewer-close:hover{background:#eef0eb}
#viewer .viewer-scroll{padding:16px 20px}
.viewer-stage{position:relative;border-radius:7px;overflow:hidden}
.viewer-stage.without-image{min-height:64px}
.viewer-stage .hero-arrow:disabled{opacity:.3;cursor:default}
.viewer-media img,.viewer-media .placeholder{height:min(56dvh,560px)}
.viewer-detail-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}
#viewer-details{min-width:0}
#viewer-details .slab-summary{padding:0}
#viewer-details .slab-summary p{margin:0;line-height:1.5}
#viewer-details .slab-dimensions{font-size:1rem}
#viewer-details .slab-stock{font-size:.85rem;color:#59685e;margin-top:2px}
#viewer-share{flex-shrink:0;margin:0;padding:8px 12px;min-height:40px;font-size:.8rem;border-color:#cbd2c9}
#viewer-body #viewer-details dl{background:transparent;border:0;padding:0;margin:8px 0 0;font-size:.8rem}
#viewer .viewer-footer{padding:8px 20px 12px}
#viewer-slabs{margin:0;padding:5px 3px}
@media(max-width:600px){
  #viewer .viewer-top{padding:10px 12px}.viewer-heading{gap:4px 10px}.viewer-heading h2{font-size:1.05rem}
  #viewer .viewer-scroll{padding:12px}.viewer-media img,.viewer-media .placeholder{height:44dvh}
  .viewer-detail-row{gap:10px;flex-wrap:wrap;margin-top:10px}#viewer-share{margin-left:auto}
  #viewer .viewer-footer{padding:6px 12px 10px}
}

/* Manual dialog carousel shares the product track's sliding animation. */
.viewer-stage{touch-action:pan-y pinch-zoom}
#viewer-media{overflow:hidden;user-select:none}
.viewer-track{height:auto}
.viewer-track>.viewer-media{flex:0 0 100%;width:100%;min-width:0}
.viewer-media img{-webkit-user-drag:none}
.viewer-thumbnails button[aria-disabled="true"]{cursor:default}

/* Filter menus keep the existing values/API contract, with a styled popup. */
.catalog-landing #filters .filter-select,.catalog-sort .filter-select{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;border:1px solid #d5ddd3;border-radius:8px;background:#fff;color:#24362f;text-align:left;font-weight:400;white-space:normal;box-shadow:0 1px 2px #24362f04}
.filter-select span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filter-select::after{content:'';width:7px;height:7px;flex-shrink:0;border-right:1.5px solid #738273;border-bottom:1.5px solid #738273;transform:translateY(-2px) rotate(45deg)}
.catalog-landing #filters .filter-select:hover,.catalog-sort .filter-select:hover{background:#fafbf8;border-color:#9bae9b}
.catalog-landing #filters .filter-select[aria-expanded="true"],.catalog-sort .filter-select[aria-expanded="true"]{border-color:#8ba18b;box-shadow:0 0 0 3px #294b3a0c}
.filter-menu{position:fixed;z-index:1000;display:flex;flex-direction:column;gap:5px;padding:6px;border:1px solid #e0e6dd;border-radius:12px;background:#fff;color:#24362f;box-shadow:0 12px 36px #20352820,0 2px 6px #2035280a;font-size:.875rem}
.filter-menu input{width:100%;flex:0 0 auto;min-height:40px;border:1px solid #e0e6dd;border-radius:8px;padding:8px 11px;font-size:.85rem;background:#fafbf8}
.filter-options{overflow:auto;min-height:0;outline:none;overscroll-behavior:contain}
.filter-option{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:40px;padding:9px 12px;line-height:1.4;border-radius:7px;cursor:pointer;overflow-wrap:anywhere}
.filter-option.is-active{background:#f3f5ef}
.filter-option[aria-selected="true"]{background:#eaf1e8;color:#294b3a;font-weight:600}
.filter-option[aria-selected="true"]::after{content:'✓';flex-shrink:0;font-size:.95rem}
.filter-menu input:focus-visible{outline:2px solid #8ba18b;outline-offset:0}
.filter-empty{padding:8px 12px;margin:0;color:#7a8478;font-size:.85rem}
@media(max-width:700px){.filter-option{min-height:44px}}

/* Sort stays above the grid, separate from applied filters and visible on mobile. */
.catalog-landing>#catalog-sort{grid-column:1/-1;justify-self:end;margin:0 0 16px}
.catalog-sort{display:flex;align-items:center;gap:10px;min-width:0}
.catalog-sort label{font-size:.8rem;color:#59685e;margin:0;white-space:nowrap}
.catalog-sort .filter-select{min-width:165px;min-height:42px;padding:9px 12px;font-size:.85rem}
@media(max-width:700px){.catalog-sort .filter-select{min-width:155px}.catalog-landing>#catalog-sort{margin:0 0 14px}}

@media(max-width:600px){:root{--catalog-gutter:20px}}

/* Catalog updates retain their current layout and decoded images until ready. */
#list{position:relative}
.catalog-is-loading #list::after{content:'';position:absolute;inset:0;z-index:2;background:#f7f6f2a8;border-radius:8px}
.catalog-loading{position:fixed;z-index:30;display:grid;place-items:center;pointer-events:none}
.loading-widget{display:flex;align-items:center;gap:12px;max-width:calc(100% - 24px);padding:15px 22px;border-radius:999px;background:#fffffff2;color:#294b3a;box-shadow:0 6px 28px #24362f18;font-size:.875rem;line-height:1.4;text-align:center;backdrop-filter:blur(8px)}
.loading-spinner{width:24px;height:24px;flex:0 0 24px;border:2px solid #dce5d9;border-top-color:#294b3a;border-radius:50%;animation:catalog-spin .8s linear infinite}
@keyframes catalog-spin{to{transform:rotate(360deg)}}
.catalog-landing>#catalog-placeholders{grid-column:1/-1;margin:24px 0 16px}
.filter-placeholder{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:12px;align-items:end;height:106px;padding:18px;border:1px solid #e2e6de;border-radius:8px;background:#fff}
.filter-placeholder span{position:relative;height:44px;border-radius:6px;background:#eef1eb}
.filter-placeholder span::before{content:'';position:absolute;left:0;top:-16px;width:50%;height:8px;border-radius:4px;background:#eef1eb}
.sort-placeholder{width:210px;height:42px;margin:24px 0 0 auto;border-radius:8px;background:#e9ede5}
.skeleton-card{overflow:hidden;border-radius:8px;background:white}
.skeleton-media{aspect-ratio:4/3;background:#e6ebe2}
.skeleton-body{height:108px;padding:16px}
.skeleton-body span{display:block;height:12px;width:54%;margin:0 0 10px;border-radius:4px;background:#edf0e9}
.skeleton-body span:first-child{height:18px;width:72%}
.skeleton-body span:last-child{width:40%}
@media(max-width:1050px){.filter-placeholder{height:186px}}
@media(max-width:700px){
 .catalog-landing>#catalog-placeholders{margin:18px 0 14px}.filter-placeholder{height:50px;grid-template-columns:1fr;padding:12px}
 .filter-placeholder span{height:18px;width:35%}.filter-placeholder span::before,.filter-placeholder span:nth-child(n+2){display:none}
 .sort-placeholder{margin-top:18px}.skeleton-body{height:100px;padding:12px}.loading-widget{padding:12px 16px;font-size:.8rem}
}
@media(prefers-reduced-motion:reduce){.loading-spinner{animation:none}}

/* Product details share the page loader; slab paging leaves the hero in place. */
#content{position:relative}
.product-is-loading #list::after,.product-is-loading:not(.loading-slabs) #content::after{content:'';position:absolute;inset:0;z-index:2;background:#f7f6f2a8;border-radius:8px}
.skeleton-hero{position:relative;height:clamp(360px,48vw,560px);border-radius:10px;background:#e6ebe2}
.skeleton-hero-text{position:absolute;left:32px;right:32px;bottom:40px}
.skeleton-hero-text span{display:block;height:12px;width:140px;max-width:65%;margin-top:10px;border-radius:5px;background:#ffffffa8}
.skeleton-hero-text span:first-child{height:28px;width:300px}
.slab-grid .skeleton-media{height:150px;aspect-ratio:auto}
.slab-grid .skeleton-body{height:76px}
.product-is-loading:not(.loading-slabs) .slab-toolbar{min-height:44px}
@media(max-width:600px){.skeleton-hero{height:420px}.skeleton-hero-text{left:20px;right:20px}}

.bm-entry{display:inline-block;color:#294b3a;font-size:.85rem;margin-top:12px;text-underline-offset:3px}

.room-studio{display:inline-flex;align-items:center;justify-content:center;border:1px solid #294b3a;border-radius:4px;padding:12px 20px;color:#294b3a;text-decoration:none;font-size:1rem}.room-studio:hover{background:#e9eee7}