/* Shared storefront, independent Base and Liquid renderers. */
:root{--header:76px}
.header-actions{justify-self:end;display:flex;align-items:center;gap:24px}
.mode-nav{display:flex;gap:14px}.mode-nav a{font-size:10px;color:#888;text-decoration:none}.mode-nav a.active{color:#111;border-bottom:1px solid}
.hero{height:calc(100svh - var(--header));min-height:520px;position:relative;background:#fff}
.hero .model-stage{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;background:transparent}
.hero canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.hero canvas:active{cursor:grabbing}
.model-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:10px;pointer-events:none}
.material-choice{position:absolute;z-index:3;left:0;top:53%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;gap:11px;width:100vw;padding:7px 18px;background:rgba(28,28,28,.56);color:rgba(255,255,255,.9);font-size:11px;letter-spacing:.08em;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);transition:opacity .28s ease,transform .28s ease;}
.material-choice a{position:relative;color:inherit;text-decoration:none;padding:2px 0 4px;border:0;transition:color .16s ease}
.material-choice a:after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:transparent;transition:background-color .16s ease}
.material-choice a:hover,.material-choice a:focus-visible{color:#fff}
.material-choice a:focus-visible{outline:1px solid #fff;outline-offset:5px}
.material-choice a.is-pressed:after,.material-choice a.active:after{background:currentColor}
.material-choice.is-dismissed{opacity:0;transform:translateY(calc(-50% + 8px));pointer-events:none}
.model-reset{position:absolute;z-index:3;left:50%;bottom:12px;transform:translateX(-50%);border:0;background:transparent;color:#858585;padding:8px 12px;font:500 10px "DM Mono",monospace;letter-spacing:.1em;text-align:center;text-transform:lowercase;white-space:nowrap;cursor:pointer}
.model-reset:hover{color:#555}
.model-reset:focus-visible{outline:1px solid #aaa;outline-offset:2px}
.page-loader{display:grid;place-items:center;z-index:2147483647}
.page-loader.done{opacity:0;visibility:hidden;pointer-events:none}
.variant-liquid .model-stage{position:fixed;inset:0;height:100svh;z-index:2147483646;pointer-events:none;transform:translateY(calc((var(--header) + env(safe-area-inset-top))/2))}
.variant-liquid canvas{pointer-events:none;cursor:default}
.variant-liquid .material-choice{z-index:2147483646}
.variant-liquid .material-choice:not(.is-dismissed){pointer-events:auto}
.site-header{z-index:2147483647}
.menu-panel,.cart-panel{z-index:2147483647}
.scrim{z-index:2147483646}
body:has(.scrim.open) .model-stage{visibility:hidden}
#catalog{scroll-margin-top:var(--header)}
.variant-resin .hero:after{content:"";position:absolute;z-index:0;left:50%;bottom:12%;width:min(46vw,560px);height:9%;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(72,57,43,.11),transparent 68%);filter:blur(14px);pointer-events:none}
@media(max-width:700px){:root{--header:64px}.header-actions{gap:10px}.mode-nav{gap:9px}.material-choice{top:52%;width:100vw;padding:6px 14px;font-size:10px}.model-reset{bottom:8px;padding:7px 10px;font-size:9px}}

/* Keep a complete product card visible on desktop and use a clear Snapchat-style action strip. */
@media(min-width:901px){
 .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:16px;row-gap:58px;padding-top:28px}
 .product-media{aspect-ratio:4/5;max-height:calc(100svh - 220px);min-height:300px}
 .add-product{display:block;width:100%;min-height:34px;margin-top:10px;border:0;background:#8d8d8d;color:#fff;padding:8px 14px;text-align:center;text-transform:lowercase;opacity:1}
 .add-product:hover,.add-product:focus-visible{background:#696969}
 .add-product:focus-visible{outline:1px solid #111;outline-offset:2px}
}
@media(min-width:701px) and (max-width:900px){
 .product-media{max-height:calc(100svh - 220px)}
 .add-product{display:block;width:100%;min-height:34px;margin-top:10px;border:0;background:#8d8d8d;color:#fff;padding:8px 14px;text-align:center;text-transform:lowercase;opacity:1}
}
@media(max-width:700px){
 .add-product{display:block;width:100%;min-height:32px;margin-top:9px;border:0;background:#8d8d8d;color:#fff;padding:7px 10px;text-align:center;text-transform:lowercase;opacity:1}
}

/* Artwork loader: download progress, then a rendered scene. */
.page-loader{background:#fff;z-index:2147483647;isolation:isolate}
.loader-picture,.loader-picture img,.loader-cover{position:absolute;inset:0;width:100%;height:100%}
.loader-picture img{object-fit:cover;object-position:center top}
.loader-cover{background:#fff;will-change:transform}
.loader-meta{position:absolute;z-index:2;top:24px;left:28px;right:28px;display:flex;justify-content:space-between;gap:14px;color:#111}
.loader-meta span,.loader-meta button{background:rgba(255,255,255,.85);padding:5px 8px;font:10px "DM Mono",monospace}
.loader-meta button{border:1px solid;cursor:pointer}
body:not(:has(.page-loader.done)) .site-header{visibility:hidden}
@media(max-width:700px){.loader-meta{left:12px;right:12px;top:16px}}

.header-left{justify-self:start;display:flex;align-items:center}.menu-toggle{width:34px;height:30px;display:grid;place-items:center;border:0;background:none;padding:0;cursor:pointer;color:var(--ink)}.menu-toggle span{display:block;font:400 31px/.62 Arial,sans-serif;letter-spacing:-.16em;transform:scaleX(1.08)}.menu-toggle:focus-visible{outline:1px solid currentColor;outline-offset:5px}.cart-line-icon{display:block;width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.cart-toggle{gap:5px}.solar-icon{display:block;width:24px;height:24px;flex-shrink:0}#cartClose{display:grid;place-items:center;min-width:40px;min-height:40px}

.editorial-collage,.editorial-collage img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.editorial-collage img{-webkit-user-drag:none}

.language-nav{display:flex;align-items:center;gap:6px;font-size:10px;color:#888}.language-nav button{font:inherit;background:none;border:0;color:#888;padding:10px 2px;cursor:pointer}.language-nav button.active{color:#111;text-decoration:underline;text-underline-offset:4px}.language-nav button:focus-visible{outline:1px solid #111;outline-offset:2px}

/* Safe-area aware loading; root artwork also paints Safari's page backdrop. */
html.is-loading{overflow:hidden;overscroll-behavior:none;scroll-behavior:auto;background-color:#fff;background-image:linear-gradient(to bottom,#fff calc(100% - var(--loader-progress,0%)),transparent calc(100% - var(--loader-progress,0%))),url("/public/loader-desktop.webp");background-size:100% 100lvh;background-position:center top;background-repeat:no-repeat}
html.is-loading body{position:fixed;inset:0;width:100%;overflow:hidden;overscroll-behavior:none;background:transparent}
html.is-loading .page-loader{bottom:auto;height:100vh;height:100lvh;background:transparent}
.loader-meta{top:max(24px,env(safe-area-inset-top));left:max(28px,env(safe-area-inset-left));right:max(28px,env(safe-area-inset-right))}
.site-header{padding-top:env(safe-area-inset-top);height:calc(var(--header) + env(safe-area-inset-top));padding-left:max(28px,env(safe-area-inset-left));padding-right:max(28px,env(safe-area-inset-right))}
.category-nav{top:calc(var(--header) + env(safe-area-inset-top))}
.cart-head{padding-top:calc(28px + env(safe-area-inset-top))}
.cart-foot{bottom:calc(28px + env(safe-area-inset-bottom))}
@media(max-width:700px){
 html.is-loading{background-image:linear-gradient(to bottom,#fff calc(100% - var(--loader-progress,0%)),transparent calc(100% - var(--loader-progress,0%))),url("/public/loader-mobile.jpg")}
 .loader-meta{top:max(16px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right))}
 .site-header{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
 .header-left{gap:8px}.menu-toggle{width:30px}.menu-toggle span{font-size:28px}.cart-line-icon{width:25px;height:23px}
}
@media(prefers-reduced-motion:reduce){.page-loader{transition:none}}

/* Keep loader labels centered and unboxed over the artwork. */
.loader-meta{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}
.loader-meta span,.loader-meta button{background:transparent;padding:0}
.loader-meta span:first-child{text-align:left}
.loader-meta span:nth-child(2){text-align:center}
.loader-meta span:nth-child(3),.loader-meta button{text-align:right}