/* A single magical workshop, lit with restrained night and lamplight colors */
.hub{min-height:100svh;background:#151924;padding-bottom:24px}
.hub__grid,.hub__stars,.hub__cloud,.hub__moon,.world__back,.world__path{display:none}
.hub__top{height:76px;background:#151924;border-bottom:2px solid #3a4155}
.hub__intro{margin:24px auto 20px;padding:0 20px;text-align:center}
.hub__intro p{font-size:11px;line-height:1.8;color:#9ebbad}
.hub__intro h1{font-size:clamp(22px,2.6vw,36px);margin:12px 0;line-height:1.4;text-shadow:3px 3px #303347}
.hub__intro h1 br{display:none}.hub__intro h1 span{margin-left:.6em;color:#c1b2d3;text-shadow:3px 3px #303347}
.hub__intro small{font:13px/1.9 var(--px);color:#b6bed1;max-width:none;padding:0}
.studio-viewport{position:relative;max-width:1280px;margin:auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#7d849c #1b2130;border:3px solid #44475b;box-shadow:8px 8px #0d111a;overscroll-behavior-x:contain}
.hub .world{position:relative;inset:auto;width:100%;height:auto;min-height:0;aspect-ratio:1536/1024;border:0;box-shadow:none;background:#1b2130;overflow:hidden}
.studio-panorama{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:fill;image-rendering:pixelated}
.landmark{top:39%;bottom:auto;height:36%;width:17%;scale:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;border:2px solid transparent;transition:border-color .2s,background .2s;filter:none!important}
.landmark--studio{left:6%}.landmark--principles{left:27%}.landmark--games{left:45%}.landmark--friends{left:61%}.landmark--contact{left:82%;right:auto}
.landmark:hover,.landmark.is-near,.landmark:focus-visible{transform:none;border-color:#e4cf9f;background:#c8b3dc0d;outline-offset:2px}
.landmark strong{background:#171b2af0;border:2px solid #777e96;font-size:11px;line-height:1.7;padding:6px 10px;color:#f0e8d7;margin-bottom:-24px;box-shadow:3px 3px #111521}
.landmark small{position:absolute;top:calc(100% + 28px);background:#161c2ded;padding:4px 7px;color:#c1cad9;font:10px/1.7 var(--px);white-space:nowrap}
.landmark.is-near:before{content:'EXPLORE';top:-27px;font-size:10px;line-height:1.7;background:#1a2233;padding:3px 6px;color:#e6d4ab;animation:none}
.hero-sprite{bottom:12%;left:10%;transition:none;will-change:left;pointer-events:none;scale:1;transform-origin:bottom center;filter:drop-shadow(3px 4px #15152188)}
.hero-sprite.is-walking{animation:none}
.hero-sprite.is-walking i{animation:studioSteps .38s steps(2,end) infinite}
@keyframes studioSteps{50%{height:10px;box-shadow:22px 3px #080b12}}
.room-directory{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:4px 24px;margin:16px auto 4px;padding:0 16px}
.room-directory a{display:flex;align-items:center;min-height:44px;font:11px/1.8 var(--px);color:#bfc8da;border-bottom:2px solid transparent}
.room-directory a:hover,.room-directory a:focus-visible{color:#f0d3a4;border-color:#bba5d0}
.hub__help{position:relative;inset:auto;translate:none;text-align:center;white-space:normal;line-height:2;margin:12px 16px;color:#96a4ba;font-size:10px}
.mobile-controls{position:relative;inset:auto;margin:12px auto 4px}
.page{--room-accent:#aac7b8;background:#181e2c;min-height:100svh;padding:120px 6vw 80px}
.page.is-active{display:flex;align-items:center;justify-content:flex-end;gap:50px}
.page .page__art{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;object-position:15% center;filter:brightness(.65);translate:none!important}
.page .page__shade{position:fixed;background:linear-gradient(90deg,#171e2910,#171e29c9);inset:0}
.studio-note,.garden-manifesto,.fountain-message,.games-cabinet{position:relative;inset:auto;transform:none;width:min(650px,54vw);margin:0;padding:32px;border:4px solid var(--room-accent);box-shadow:8px 8px #0c1321b3;clip-path:none;background:#1e302df5;color:#e5eee5;z-index:5}
.studio-note>p:first-child,.garden-manifesto>p:first-child,.fountain-message>p:first-child,.games-cabinet>p:first-child{color:var(--room-accent);font:11px/1.8 var(--px);margin:0 0 24px}
.studio-note h2,.garden-manifesto h2,.games-cabinet h2,.fountain-message h2{font:clamp(21px,2vw,30px)/1.6 var(--px);margin:0 0 24px;text-shadow:3px 3px #18212a}
.studio-note h2 span,.garden-manifesto h2 span,.games-cabinet h2 span,.fountain-message h2 span{color:var(--room-accent)}
.type-line{font:13px/2.1 var(--px);color:inherit}.type-line i{background:var(--room-accent);animation:none}
.studio-note .room-copy,.room-copy{font:13px/2.1 var(--px);color:inherit;margin:24px 0}
.chapter-link{display:block;padding:18px 0 8px;margin-top:20px;border-top:2px dashed var(--room-accent);font:11px/2 var(--px);color:var(--room-accent);min-height:48px}
.chapter-link:hover{color:#fff;text-decoration:underline;text-underline-offset:6px}
.page--principles{--room-accent:#715550}.page--principles .page__art{object-position:36% center}
.garden-manifesto{background:#e2d5bff5;color:#3d3440;border-color:#bc9e82;box-shadow:8px 8px #2b263c88}
.garden-manifesto h2{text-shadow:none}.garden-manifesto>p:first-child,.garden-manifesto h2 span{color:#715550}
.garden-manifesto li{font:12px/2 var(--px);grid-template-columns:40px 1fr;padding:18px 0;border-color:#bba78e}
.garden-manifesto li b{color:#75555c}.garden-manifesto small{font:12px/2 var(--px);color:#55464e}.garden-manifesto .chapter-link:hover{color:#4f3858}
.page--games{--room-accent:#bfa8d4}.page--games .page__art{object-position:53% center}
.games-cabinet{width:min(760px,64vw);background:#282239f5}
.game-slots{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.game-slot{padding:24px 16px;background:#1a1c2c;border:3px solid #847699;text-align:center;box-shadow:4px 4px #111625}
.slot-code{display:block;font:9px/2 var(--px);color:#b6aec7;min-height:36px}
.slot-lock{display:grid;place-items:center;font:38px var(--px);width:80px;height:80px;border:4px double #9b89b0;color:#e0c796;margin:26px auto}
.game-slot h3{font:12px/1.9 var(--px);color:#d7c6e7}.game-slot p{font:10px/2 var(--px);color:#b5adc6}.game-slot--future{border-color:#526177}.game-slot--future .slot-lock{color:#aab7c8;border-color:#63748b}
.page--friends{--room-accent:#d6bd94;align-items:flex-start;justify-content:space-between}.page--friends .page__art{object-position:69% center}
.partner-story{position:relative;inset:auto;margin:35px 0 0;padding:28px;width:40%;background:#242b37ef;border:3px solid #a8957f;text-shadow:none}
.partner-story h2{font-size:25px;line-height:1.6}.partner-story h2 span{color:#d6bd94}.partner-story>p:last-of-type{font:12px/2.1 var(--px);color:#e0d9cc}
.partner-map{position:relative;inset:auto;width:min(600px,50%);height:auto;aspect-ratio:600/650;margin:0;background:#463e3bec;border:8px solid #9a7e68;box-shadow:8px 8px #17182380}
.partner-road path{stroke:#d6bd94}.partner-stop p{font:10px/1.8 var(--px);background:#292d39}
.page--contact{--room-accent:#a8c5d3;justify-content:flex-start}.page--contact .page__art{object-position:91% center}
.fountain-message{background:#1c2b3ef5}.fountain-message>p:not(:first-child){font:12px/2 var(--px)}
.fountain-message>p:first-child:after{content:'ON AIR';font-size:9px}
.contact-lines a span{font-size:10px}.contact-lines a b{font:11px/1.8 var(--px)}.contact-lines a{padding:16px 10px;min-height:80px}
.signal-display__top,.signal-display__hint,.radio-label{font-family:var(--px);font-size:10px;line-height:1.8}
.page__hint{color:#bbc6d8}.return-portal,.return-portal--light{font-size:11px}
.transition .object-transition{display:block!important;position:absolute;inset:0;background:#172031;overflow:hidden;animation:roomFade .92s ease-in-out both}
.object-transition img{width:100%;height:100%;object-fit:cover;object-position:var(--focus-x) var(--focus-y);transform-origin:var(--focus-x) var(--focus-y);animation:roomZoom .92s cubic-bezier(.22,.65,.3,1) both;image-rendering:pixelated}
.object-transition__veil{position:absolute;inset:0;background:#102c28;animation:screenOpen .92s steps(10) both}
.object-transition--pixels .object-transition__veil{background:#ddd0b8;animation:bookOpen .92s steps(12) both}
.object-transition--arcade .object-transition__veil{background:repeating-linear-gradient(0deg,#29223a 0 12px,#75628e 12px 16px);animation:arcadeOpen .92s steps(12) both}
.object-transition--flock .object-transition__veil{background:#594738;animation:boardOpen .92s steps(12) both}
.object-transition--water .object-transition__veil{background:repeating-linear-gradient(0deg,#193344 0 25px,#9bb9c5 25px 28px);animation:radioOpen .92s steps(12) both}
@keyframes roomFade{0%,100%{opacity:0}18%,78%{opacity:1}}
@keyframes roomZoom{from{transform:scale(1)}to{transform:scale(2.4)}}
@keyframes screenOpen{0%,100%{clip-path:inset(49% 49%);opacity:0}45%,65%{clip-path:inset(0);opacity:1}}
@keyframes bookOpen{0%,100%{clip-path:inset(0 50%)}45%,65%{clip-path:inset(0)}}
@keyframes arcadeOpen{0%,100%{clip-path:inset(50% 0)}45%,65%{clip-path:inset(0)}}
@keyframes boardOpen{0%,100%{transform:translateY(100%)}45%,65%{transform:translateY(0)}}
@keyframes radioOpen{0%,100%{clip-path:inset(0 100% 0 0)}45%,65%{clip-path:inset(0)}}
@media(min-width:1100px){.studio-viewport{width:min(1100px,84vw)}.hub__intro{margin-top:20px}}
@media(max-width:900px){.hub__status span:first-child{display:none}.hub__intro h1 br{display:block}.hub__intro h1 span{margin:0}.studio-viewport{margin:0 16px}.page.is-active{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:300px 20px 50px;gap:24px}.studio-note,.garden-manifesto,.games-cabinet,.fountain-message,.partner-story{width:100%;max-width:680px;margin:0 auto;padding:26px 22px}.page .page__art{height:100svh;object-fit:cover;filter:brightness(.72)}.page .page__shade{background:linear-gradient(0deg,#151d2ef5 10%,#151d2e66 65%,transparent)}.partner-map{width:100%;max-width:600px;margin:auto}.partner-story h2{font-size:23px}.page__hint{display:none}.contact-lines a b{font-size:10px}.page--friends{gap:24px}}
@media(max-width:600px){.hub{min-height:100svh;padding-bottom:14px}.hub__top{height:68px;padding:10px 16px}.brand{font-size:10px}.brand>span{width:38px;height:38px}.hub__status{font-size:8px}.hub__intro{margin:20px auto 16px}.hub__intro p{font-size:9px}.hub__intro h1{font-size:21px;margin:12px 0;line-height:1.6}.hub__intro small{font-size:10px;line-height:2;max-width:330px}.studio-viewport{margin:0 10px}.hub .world{width:900px;min-width:900px;height:600px;aspect-ratio:auto;bottom:auto}.hero-sprite{scale:.8}.landmark strong{font-size:10px}.landmark small{font-size:9px}.room-directory{gap:0 18px;margin:12px 8px 0;padding:0}.room-directory a{font-size:10px;min-height:44px}.mobile-controls{display:flex;position:sticky;bottom:8px;left:auto;right:auto;width:max-content;max-width:100%;z-index:30;background:#171d2ff2;border:2px solid #424f67;padding:8px 12px;gap:15px}.mobile-controls p{font-size:8px}.hub__help{display:block;font-size:9px;margin:10px}.desktop-help{display:none}.touch-help{display:inline}.page.is-active{padding-top:260px}.studio-note h2,.garden-manifesto h2,.games-cabinet h2,.fountain-message h2{font-size:19px;line-height:1.7}.type-line,.studio-note .room-copy,.room-copy{font-size:12px;line-height:2.1}.garden-manifesto li{font-size:11px;grid-template-columns:30px 1fr}.garden-manifesto small{font-size:11px}.game-slots{grid-template-columns:1fr}.game-slot{padding:18px}.slot-code{min-height:auto}.slot-lock{margin:18px auto}.contact-lines{grid-template-columns:1fr}.contact-lines a:first-child{grid-column:auto}.contact-lines a span{font-size:10px}.contact-lines a b{font-size:10px}.signal-display__top{font-size:8px}.return-portal,.return-portal--light{font-size:9px;top:14px;left:16px}.partner-stop p{font-size:8px}.partner-map{min-height:420px}.partner-stop{width:120px}.partner-story>p:last-of-type{font-size:11px}}
.page--studio{--scene-x:15%}.page--principles{--scene-x:36%}.page--games{--scene-x:53%}.page--friends{--scene-x:69%}.page--contact{--scene-x:91%}
@media(min-width:901px){.page .page__art{transform:scale(1.35);transform-origin:var(--scene-x) 55%}}
@media(max-width:600px){.hub{padding-bottom:120px}.hub.is-active{display:flex;flex-direction:column}.hub__top{order:0;flex-shrink:0}.hub__intro{order:1}.room-directory{order:2;margin:0 10px 14px;gap:0 16px}.studio-viewport{order:3;height:480px;flex-shrink:0}.hub__help{order:4;margin-bottom:0}.mobile-controls{position:fixed;bottom:12px;left:50%;right:auto;translate:-50% 0;margin:0}.hub .world{margin-top:-120px}}
@media(prefers-reduced-motion:reduce){.hero-sprite.is-walking i,.signal-wave i,.pixel-cursor.is-hover i{animation:none}.transition .object-transition{display:none!important}}
