.showcase-page{padding:42px 0 65px;}
.showcase-heading{display:flex;justify-content:space-between;align-items:baseline;gap:30px;margin-bottom:12px;}
.showcase-heading h1{font-size:clamp(55px,6.2vw,92px);line-height:1.06;letter-spacing:-.065em;font-weight:400;margin-left:-4px;}
.showcase-heading>p{font-size:13px;color:var(--muted);}
.showcase-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:clamp(30px,4vw,70px);}
.shelf-stage{position:relative;height:clamp(580px,69vh,800px);min-width:0;isolation:isolate;}
.shelf-stage canvas{position:relative;z-index:2;display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y;opacity:0;transition:opacity .2s ease;}
.shelf-stage canvas:active{cursor:grabbing;}.shelf-stage canvas:focus-visible{outline:1px solid #a2a79d;outline-offset:-8px;}
.shelf-reset{position:absolute;bottom:0;left:50%;transform:translateX(-50%);z-index:3;font-size:9px;color:#7a7f73;border:0;background:none;padding:10px 14px;}
.showcase-details{padding:28px 0 40px;}
.showcase-number{font-size:10px;color:#a0a295;margin-bottom:42px;}
.showcase-maker{font-size:10px;text-transform:uppercase;letter-spacing:.07em;margin-bottom:15px;color:#777d70;}
.showcase-details h2{font-size:35px;line-height:1.12;letter-spacing:-1.4px;font-weight:400;max-width:250px;}
.showcase-edition{font-size:9px;color:#8c9084;margin-top:16px;}
.showcase-note{font-size:14px;color:#747a6d;line-height:1.65;margin:28px 0;max-width:250px;}
.showcase-product-link{font-size:12px;margin-top:34px;max-width:250px;width:100%;padding-bottom:10px;border-bottom:1px solid #bac0b1;justify-content:space-between;}
.shelf-lamp-controls{display:flex;gap:22px;align-items:center;margin-top:27px;}
.shelf-light-switch{display:flex;gap:11px;align-items:center;border:0;background:none;padding:5px 0;font-size:9px;color:#737b69;}
.shelf-light-switch i{position:relative;width:27px;height:15px;border-radius:12px;background:#bdc3b6;transition:background .2s;}.shelf-light-switch i:after{content:'';position:absolute;top:3px;left:3px;width:9px;height:9px;border-radius:50%;background:#f9f9f2;transition:transform .2s;}.shelf-light-switch[aria-pressed="true"] i{background:#7d8870;}.shelf-light-switch[aria-pressed="true"] i:after{transform:translateX(12px);}
.shelf-palette{display:flex;gap:8px;}.shelf-palette button{height:18px;width:18px;background:var(--lamp-colour);border:3px solid var(--paper);border-radius:50%;}.shelf-palette button[aria-pressed="true"]{outline:1px solid #a1a896;}
.shelf-index{border-top:1px solid var(--rule);margin-top:32px;display:grid;grid-template-columns:repeat(3,1fr);gap:0 35px;}
.shelf-index button{display:grid;grid-template-columns:24px 1fr;gap:8px 16px;text-align:left;background:none;border:0;padding:24px 0;color:#747b6b;}.shelf-index button>span:nth-child(2){font-size:13px;}.shelf-index button>.mono{font-size:9px;}.shelf-index button>span:last-child{grid-column:2;color:#92998a;}.shelf-index button[aria-pressed="true"]{color:var(--ink);}.shelf-index button[aria-pressed="true"]>span:first-child{border-bottom:1px solid currentColor;padding-bottom:5px;}
.shelf-fallback{visibility:hidden;position:absolute;inset:9% 8%;display:flex;flex-direction:column;transform:perspective(1600px) rotateY(-9deg);background:linear-gradient(90deg,#c5c8c4,#dfe0dc 45%,#b9bfbb);border:8px solid #bfc4c0;border-top:5px solid #e9eae7;box-shadow:18px 22px 36px #444e3420;}
.fallback-tier{height:33.333%;border-bottom:10px solid #c4c9c5;display:grid;grid-template-columns:repeat(3,1fr);padding:12px 18px 0;box-shadow:inset 0 15px 16px #4c55472b,inset -12px 0 18px #4c554716;background:linear-gradient(0deg,#f2f2ed 0,#bfc5bf 12%,transparent 13%);}
.fallback-tier:last-child{border-bottom:0;}.fallback-object{display:flex;align-items:flex-end;justify-content:center;min-height:0;padding-bottom:15px;}.fallback-object img{max-width:100%;height:85%;object-fit:contain;}.fallback-object span{font-size:12px;}
.shelf-stage.is-rendered canvas{opacity:1;}.shelf-stage.is-static .shelf-fallback{visibility:visible;}.shelf-stage.is-static canvas{visibility:hidden;}.shelf-stage.is-static .shelf-reset{display:none;}
.shelf-stage:not(.is-rendered):not(.is-static) .shelf-bottom-tools{visibility:hidden;}
@media(max-width:1100px){.showcase-layout{grid-template-columns:minmax(0,1fr) 215px;gap:25px;}.showcase-details h2{font-size:30px;}.shelf-stage{height:600px;}}
@media(max-width:760px){.showcase-page{padding-top:30px;}.showcase-heading{align-items:flex-start;flex-direction:column;gap:14px;}.showcase-heading h1{font-size:64px;}.showcase-layout{grid-template-columns:1fr;gap:0;}.shelf-stage{height:clamp(470px,78vw,650px);margin:0 -12px;}.showcase-details{padding:25px 0 14px;}.showcase-number{margin-bottom:20px;}.showcase-details h2{font-size:38px;max-width:100%;}.showcase-note{max-width:360px;margin:20px 0;}.showcase-product-link{max-width:360px;}.shelf-index{grid-template-columns:1fr;margin-top:25px;}.showcase-heading>p{font-size:12px;}}
@media(prefers-reduced-motion:reduce){.shelf-stage canvas,.shelf-light-switch i,.shelf-light-switch i:after{transition:none;}}
.showcase-layout:has(.shelf-stage.is-static) .shelf-lamp-controls{display:none;}
/* Objects leave their numbered slot and become a quiet, tactile study. */
.showcase-page [hidden]{display:none!important;}
.shelf-stage{scroll-margin-top:24px;}.shelf-stage canvas{touch-action:pan-y;}.shelf-stage.is-inspecting canvas{touch-action:none;}
.shelf-inspect-bar{position:absolute;inset:10px 8px auto;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:4;pointer-events:none;}
.shelf-return{pointer-events:auto;display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:13px 16px;color:var(--ink);font-size:10px;}
.shelf-return:hover{background:#e8ebdf;}.shelf-return>span:first-child{font-size:18px;line-height:12px;}
.shelf-inspect-hint{font-size:8px;color:#8a9182;letter-spacing:.02em;}
.shelf-bottom-tools{position:absolute;bottom:0;left:0;right:0;z-index:4;display:flex;justify-content:center;align-items:center;gap:20px;}
.shelf-bottom-tools .shelf-reset{position:static;transform:none;}
.shelf-zoom{display:flex;gap:3px;}.shelf-zoom button{width:34px;height:34px;border:1px solid var(--rule);background:var(--paper);font-size:18px;color:var(--ink);}
.shelf-invitation{color:#8c9481;}.shelf-invitation>span{font-size:35px;display:block;margin-bottom:25px;font-weight:300;}.shelf-invitation h2{font-size:38px;letter-spacing:-1.6px;line-height:1.17;max-width:230px;}
.shelf-index button{position:relative;padding-right:25px;transition:color .2s,background .2s;}.shelf-index button:hover,.shelf-index button:focus-visible{color:var(--ink);background:#e9eddf70;}
.shelf-index button>span:nth-child(3){grid-column:2;color:#92998a;}.shelf-index button>.shelf-pick-icon{position:absolute;right:4px;top:24px;font-size:17px;opacity:0;transform:translate(-4px,4px);transition:transform .2s,opacity .2s;}.shelf-index button:is(:hover,:focus-visible,[aria-pressed="true"])>.shelf-pick-icon{opacity:1;transform:none;}
.object-controls{margin-top:28px;}.object-controls>p,.object-controls>label{font-size:9px;color:#7b846f;letter-spacing:.03em;}.object-choices{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px;}.object-choices button,.object-action{font-size:10px;padding:10px 12px;border:1px solid #c9cebe;background:transparent;border-radius:2px;color:#747d68;}.object-choices button:hover,.object-action:hover{border-color:#7b876d;}.object-choices button[aria-pressed="true"]{background:#e5e9dc;border-color:#89977c;color:#333d2b;}
.object-controls input{display:block;width:100%;min-width:0;margin:13px 0 10px;border:0;border-bottom:1px solid #aab49c;background:transparent;padding:10px 0 13px;font-family:monospace;font-size:16px;color:var(--ink);border-radius:0;}.object-controls input::placeholder{color:#a1a892;font-size:12px;}.object-controls input:focus{outline:none;border-bottom-color:#485c39;}
.object-shutter{display:flex;align-items:center;gap:12px;font-size:11px;padding:12px 16px;}.object-shutter i{width:12px;height:12px;border-radius:50%;background:#899779;box-shadow:0 0 0 3px var(--paper),0 0 0 4px #a1ad93;}
.shelf-photo{margin:24px 0 0;padding:9px 9px 14px;background:#fafaf6;border:1px solid #dfe3d6;transform:rotate(-2deg);box-shadow:0 6px 13px #3c47200c;}.shelf-photo img{display:block;width:100%;max-height:200px;object-fit:contain;background:#f0f1eb;}.shelf-photo figcaption{font-size:10px;color:#858b7e;padding:12px 2px 8px;}.shelf-photo a{font-size:10px;color:#515d45;text-decoration:underline;text-underline-offset:3px;}
.camera-flash{position:absolute;inset:8%;pointer-events:none;z-index:3;background:#fff;opacity:0;}.is-flashing .camera-flash{animation:shelf-flash .2s ease-out;}@keyframes shelf-flash{0%{opacity:.6}100%{opacity:0}}
.fallback-object{border:0;background:none;cursor:pointer;}.fallback-object:hover img{transform:translateY(-8px);}.shelf-static-object{position:absolute;inset:15% 16%;z-index:2;display:none;}.shelf-static-object img{width:100%;height:100%;object-fit:contain;}.shelf-stage.is-static.is-inspecting .shelf-fallback{opacity:.1;}.shelf-stage.is-static.is-inspecting .shelf-static-object{display:block;}.showcase-layout:has(.shelf-stage.is-static) .shelf-play-controls,.shelf-stage.is-static .shelf-inspect-hint,.shelf-stage.is-static .shelf-bottom-tools{display:none;}
@media(max-width:760px){.shelf-inspect-bar{inset:10px 5px auto;}.shelf-inspect-hint{display:none;}.shelf-return{padding:12px;font-size:9px;}.shelf-invitation{display:flex;align-items:center;gap:20px;padding-top:12px;}.shelf-invitation>span{font-size:25px;margin:0;}.shelf-invitation h2{font-size:27px;max-width:none;}.object-controls{max-width:360px;}.shelf-photo{max-width:250px;}.object-choices button{min-height:42px;}.shelf-zoom button{width:42px;height:42px;}}
@media(prefers-reduced-motion:reduce){.shelf-index button,.shelf-index button>.shelf-pick-icon{transition:none;}.is-flashing .camera-flash{animation:none;}}
.shelf-return-mobile{display:none;}@media(max-width:760px){.showcase-page.is-inspecting .shelf-return-mobile{display:flex;margin-top:28px;width:max-content;}}

.object-controls textarea{display:block;resize:vertical;min-height:90px;width:100%;margin-top:13px;border:1px solid #bcc6af;background:transparent;padding:12px;font:14px/1.6 monospace;text-transform:uppercase;color:var(--ink);border-radius:2px;}.object-controls textarea:focus{outline:1px solid #7a8a6b;outline-offset:2px;}.object-controls textarea::placeholder{text-transform:none;font-size:12px;color:#8f9d80;}.object-controls input[type="range"]{padding:0;margin:20px 0 12px;accent-color:#7b876b;border:0;height:22px;cursor:ew-resize;}.watch-time{display:block;font-size:13px;letter-spacing:.12em;color:var(--ink);margin-bottom:15px;}
