/* Product colony renderer: clear photos, soft photo-coloured light, dark space. */
.hero {background-image:linear-gradient(180deg,#02050bd1,#03070cb3 60%,#02050b91),url('assets/art/home.webp');background-color:#03070c;}
.hero .hero-starlight {opacity:.3;}
.hero .hero-orbits {opacity:.3;}
#planet {position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:hidden;touch-action:none;}
#planet .style-sphere-canvas:focus-visible {outline:1px solid #d8f48a88!important;outline-offset:-8px;}
.hero[data-mode="globe"] .click-cue {top:calc(45% + var(--planet-radius,220px));}
.hero:not([data-mode="globe"]) #planet {inset:0;}
.planet-map {position:absolute;left:0;top:0;width:100%;height:100%;touch-action:none;cursor:grab;will-change:transform;}
.planet-map[hidden] {display:none;}
.planet-map:active {cursor:grabbing;}
.planet-room {position:absolute;padding:0;border:0;background:none;color:inherit;cursor:pointer;overflow:visible;contain:layout style;}
.planet-photo {position:absolute;inset:2px;overflow:hidden;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);pointer-events:none;}
.planet-room img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.12);pointer-events:none;}
.planet-room {clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#08101a;filter:drop-shadow(0 4px 10px #0005);}
.planet-room[aria-pressed="true"],.planet-room:focus-visible {background:#08101a;outline:0;}
.planet-room:after {content:"";position:absolute;inset:0;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);box-shadow:inset 0 0 16px #ffffff18;pointer-events:none;}
.hero[data-transition="unfolding"] .planet-room,.hero[data-transition="folding"] .planet-room {filter:none;pointer-events:none;}
.hero .grid-selection {left:50%!important;top:auto!important;bottom:85px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);display:flex;align-items:center;gap:22px;padding:13px 24px;border:1px solid #cad7bb35;border-radius:20px;background:#070e16eb;}
.hero .grid-selection[hidden] {display:none;}
.hero .grid-selection h3 {font-size:24px;}
.hero .grid-selection p {margin:5px 0 0;font-size:12px;color:#b2bcb8;}
.hero .grid-selection #enter-room {font-size:20px;}
.hero[data-mode="grid"] .grid-heading {top:130px;}
.hero[data-mode="grid"] .scene-tools {font-size:16px;bottom:24px;}
.hero[data-mode="grid"] .scene-frame {border-color:#bdd4c433;}
.hero[data-mode="focus"] .room-image {background-size:contain;background-repeat:no-repeat;background-position:50% 48%;background-color:#070e16;}
.hero[data-mode="focus"] .room-hex:after {background:linear-gradient(0deg,#04070de8,transparent 38%,transparent 76%,#04070d66);}
@media(max-width:600px){
 #planet {inset:0;}
 .hero[data-mode="globe"] .click-cue {top:calc(35% + var(--planet-radius,170px));}
 .hero .grid-selection {padding:12px 16px;gap:16px;bottom:95px;}
 .hero .grid-selection h3 {font-size:20px;}
 .hero .grid-selection p {font-size:10px;}
 .hero .grid-selection #enter-room {font-size:17px;}
 .hero[data-mode="grid"] .scene-tools {font-size:12px;padding:7px 13px;gap:12px;white-space:nowrap;bottom:28px;}
 .tools-count {padding-left:12px;}
 .hero[data-mode="grid"] .grid-heading {top:132px;}
 .hero[data-mode="grid"] .grid-heading h2 {font-size:22px;}
 .hero[data-mode="focus"] .room-image {background-position:50% 40%;}
}
@media(prefers-reduced-motion:reduce){.planet-map{will-change:auto;}}
.hero .intro {position:absolute;z-index:5;}
.hero .click-cue {z-index:5;}

.planet-rim {position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#cbd8cd3d;stroke-width:.7;pointer-events:none;}
.planet-room[aria-pressed="true"] .planet-rim,.planet-room:focus-visible .planet-rim {stroke:#deef8d;stroke-width:1.2;}

/* Keep the viewport stable while the planet becomes a browsable sheet. */
html {scrollbar-gutter:stable;}
.hero .intro {transition:opacity .3s ease,transform .5s ease;}
.hero[data-transition="preparing"] .intro {opacity:0;transform:translateY(12px);pointer-events:none;}
.hero[data-transition="preparing"] .explore-toolbar,.hero[data-transition="preparing"] .grid-heading,.hero[data-transition="preparing"] .scene-tools,.hero[data-transition="preparing"] .grid-selection {opacity:0;pointer-events:none;}
.hero[data-transition="unfolding"] .explore-toolbar,.hero[data-transition="folding"] .explore-toolbar,
.hero[data-transition="unfolding"] .grid-heading,.hero[data-transition="folding"] .grid-heading,
.hero[data-transition="unfolding"] .scene-tools,.hero[data-transition="folding"] .scene-tools,
.hero[data-transition="unfolding"] .grid-selection,.hero[data-transition="folding"] .grid-selection {opacity:clamp(0,calc((var(--unfold-progress,0) - .75) * 4),1);pointer-events:none;}
.hero .grid-heading h2 {font-size:clamp(22px,2vw,30px);background:#050c15b8;}
.planet-room {filter:drop-shadow(0 2px 5px #0003);}
.planet-rim {stroke:#d2e0d326;stroke-width:.65;}
.hero[data-mode="grid"] .scene-frame {opacity:.35;}

/* Photo-first depth and a restrained luminous selection, derived from product plaza. */
.planet-room {background:transparent;clip-path:none;opacity:.6;transition:opacity .3s ease;}
.planet-room[aria-pressed="true"],.planet-room:focus-visible,.planet-room:hover {opacity:1;background:transparent;}
.planet-rim {overflow:visible;stroke:#d1ddc72e;}
.planet-room[aria-pressed="true"] .planet-rim {stroke:#e5f0b5;stroke-width:1.8;filter:drop-shadow(0 0 5px #d7f49e88) drop-shadow(0 0 12px #b5dbbc30);}
.planet-room[aria-pressed="true"] .planet-photo {filter:brightness(1.04);}
.hero[data-transition="unfolding"] .planet-room,.hero[data-transition="folding"] .planet-room {transition:none;}
.hero .grid-selection {border-color:#e1ecc744;background:linear-gradient(135deg,#10191af2,#08101bed);box-shadow:0 10px 35px #0003;}
@media(prefers-reduced-motion:reduce){.planet-room{transition:none;}}

.hero[data-mode="globe"] .click-cue {--cue-size:64px;width:64px;height:64px;top:calc(var(--planet-center-y) + var(--planet-radius) + 8px);}

.hero:not([data-mode="globe"]) .click-cue {opacity:0;visibility:hidden;pointer-events:none;}