html.studio-pending body>.workspace,html.studio-pending body>.topbar{visibility:hidden}
#studio-intro{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0;padding:0;color:#224a40;background:#f5efe3;overflow:auto;box-sizing:border-box;overscroll-behavior:contain}#studio-intro::backdrop{background:#f5efe3}#studio-intro *{box-sizing:border-box}#studio-intro:after{content:'';position:fixed;inset:0;pointer-events:none;background:url('assets/handmade-paper.png');opacity:.16;z-index:6;mix-blend-mode:multiply}.studio-nav{height:74px;padding:19px 34px;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #234b4020;position:relative;z-index:7}.studio-nav>span{font-size:16px;font-weight:700}.studio-nav small{display:block;font:7px monospace;letter-spacing:1.5px;margin-top:6px}.studio-skip{font-size:11px;padding:9px 0;border-bottom:1px solid #234b4050}.studio-layout{height:calc(100dvh - 155px);min-height:430px;display:grid;grid-template-columns:230px minmax(0,1fr);padding-left:34px}.studio-caption{position:relative;padding-top:58px;z-index:2;pointer-events:none}.studio-kicker{font:9px monospace;letter-spacing:1.5px;color:#1e87a0}.studio-caption h1{font-size:clamp(37px,4.2vw,62px);font-weight:800;line-height:1.2;letter-spacing:-2px;margin:23px 0 25px}.studio-caption h1 em{font-style:normal;color:#da5c99;text-shadow:2px 1px #efd355}.studio-caption p{font-size:12px;line-height:1.9;color:#647565}.studio-rule{height:1px;background:#244b4030;width:75%;margin:25px 0 17px}.studio-note{font-size:10px;line-height:1.8;color:#6c7b6b}.studio-mini-label{font:8px/1.8 monospace;letter-spacing:1.2px;margin-top:35px;color:#51705c}.studio-viewport{position:relative;min-width:0;height:100%;overflow:hidden}.studio-canvas-host{width:100%;height:100%;position:relative}.studio-canvas-host canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline:none}.studio-loading{position:absolute;top:50%;left:50%;translate:-50% -50%;font-size:12px;max-width:80%;text-align:center;padding:20px;background:#f5efe3e8}.studio-loading[hidden]{display:none}.studio-portal{position:absolute;z-index:3;display:none;align-items:center;gap:5px;transform:translate(16px,-12px);padding:0;border:0;background:transparent;white-space:nowrap;animation:studio-guide-float 3s ease-in-out infinite}.scene-ready .studio-portal{display:flex}.studio-portal svg{width:28px;height:36px;fill:#efd355;stroke:#234b40;stroke-width:1.6;transform:rotate(-25deg)}.studio-portal>span{background:#fdf7e8;padding:10px 12px;border:1px solid #285342;box-shadow:3px 3px 0 #e6a6c5;font-size:12px;font-weight:700;transform:rotate(3deg);transition:background .2s}.studio-portal small{display:block;font-size:9px;font-weight:400;margin-top:4px}.studio-portal:hover>span,.studio-portal.is-hovered>span{background:#f3d975}.studio-speech{position:absolute;bottom:30px;left:50%;transform:translate(-50%,10px);background:#fbf6e7ef;border:1px solid #34534235;padding:12px 18px;font-size:12px;border-radius:3px;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;max-width:85%;text-align:center;line-height:1.7;z-index:4}.studio-speech.visible{opacity:1;transform:translate(-50%,0)}.studio-orientation{position:absolute;bottom:23px;right:25px;font:8px monospace;color:#76927f;text-align:center;pointer-events:none}.studio-orientation b{display:block;font-size:28px;font-weight:400;color:#c16b92;line-height:1}.studio-orientation small{display:block;font-size:6px;margin-top:6px;letter-spacing:1.1px}.studio-tooltip{position:absolute;z-index:5;background:#234b40;color:#fff6e6;font-size:10px;padding:9px 12px;pointer-events:none;opacity:0;max-width:230px;transition:opacity .1s;border-radius:2px}.studio-tooltip.visible{opacity:1}.studio-foot{min-height:81px;border-top:1px solid #234b4020;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 34px;position:relative;z-index:7}.studio-discovery{display:flex;align-items:center;gap:7px;font-size:10px;color:#647b67}.studio-discovery i{width:6px;height:6px;border-radius:50%;background:#589b70}.studio-tools{display:flex;align-items:center;gap:7px}.studio-tools button{font-size:10px;padding:8px 11px;background:#e6eadc;border:1px solid transparent}.studio-tools button:hover{background:#eab6d0;border-color:#234b4030}.studio-tools button span{margin-left:7px}.studio-enter{font-size:12px;padding:12px 19px;background:#e6a6c5;border:1px solid #234b40;box-shadow:3px 3px 0 #234b40;white-space:nowrap}.studio-enter span{margin-left:18px}.studio-enter:hover{background:#eed55c}.studio-replay{font-size:11px;border-bottom:1px solid #234b4050;padding:5px 0;white-space:nowrap}#studio-intro button:focus-visible,.studio-replay:focus-visible{outline:2px solid #208dac;outline-offset:5px}.is-entering .studio-portal,.is-entering .studio-nav,.is-entering .studio-caption,.is-entering .studio-foot{opacity:0;transition:opacity .25s;pointer-events:none}.is-entering .studio-viewport{pointer-events:none}.studio-arrived .board{animation:studio-arrive .65s ease both}@keyframes studio-guide-float{50%{margin-top:-6px}}@keyframes studio-arrive{from{opacity:.2;filter:blur(2px)}to{opacity:1;filter:blur(0)}}
@media(max-width:1000px){.studio-layout{grid-template-columns:175px minmax(0,1fr);padding-left:25px}.studio-caption{padding-top:45px}.studio-caption h1{font-size:43px}.studio-discovery{display:none}.studio-foot{gap:12px}.studio-tools button{padding:8px}.studio-mini-label{margin-top:22px}.studio-portal{transform:translate(-20px,-25px)}}
@media(max-width:650px){.studio-nav{height:62px;padding:14px 18px}.studio-nav>span{font-size:13px}.studio-nav small{font-size:6px}.studio-skip{font-size:10px}.studio-layout{height:calc(100dvh - 190px);min-height:440px;display:block;padding:0;position:relative}.studio-caption{position:absolute;top:14px;left:20px;padding:0;pointer-events:none}.studio-kicker{font-size:7px;letter-spacing:1px}.studio-caption h1{font-size:27px;line-height:1.15;margin:10px 0}.studio-caption h1 br{display:none}.studio-caption p,.studio-rule,.studio-note,.studio-mini-label{display:none}.studio-viewport{height:100%}.studio-canvas-host{height:100%;padding-top:30px}.studio-portal{transform:translate(-50%,-32px);animation:none}.studio-portal svg{width:20px;height:27px}.studio-portal>span{font-size:10px;padding:7px 9px}.studio-portal small{font-size:8px}.studio-speech{bottom:15px;font-size:11px;width:80%}.studio-tooltip,.studio-orientation{display:none}.studio-foot{margin:0 18px;min-height:128px;flex-wrap:wrap;gap:12px;padding:14px 0;justify-content:center;align-content:center}.studio-tools{gap:5px;flex-wrap:wrap;justify-content:center}.studio-tools button{font-size:9px;padding:9px}.studio-enter{width:100%;max-width:330px;font-size:12px;padding:11px}.studio-replay{font-size:9px}}
@media(prefers-reduced-motion:reduce){.studio-portal,.studio-arrived .board{animation:none}}.motion-off .studio-portal{animation:none}
.studio-layout{grid-template-rows:minmax(0,1fr)}.studio-tools button[aria-pressed="true"]{background:#f1d66a;border-color:#285342}@media(min-width:651px) and (max-height:680px){.studio-layout{min-height:340px}.studio-caption{padding-top:24px}.studio-caption h1{font-size:38px;margin:15px 0}.studio-rule{margin:15px 0}.studio-mini-label{display:none}}


/* A floating printer's seal: circular type and a hand-drawn ink sparkle. */
.studio-portal{width:96px;height:112px;display:none;flex-direction:column;gap:0;transform:translate(15px,-52px);animation:none;isolation:isolate}
.scene-ready .studio-portal{display:flex}
.studio-portal .portal-seal{width:90px;height:90px;overflow:visible;fill:none;stroke:none;transform:none;flex-shrink:0;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.portal-orbit{transform-origin:60px 60px;animation:portal-orbit 24s linear infinite}
.portal-orbit text{fill:#245e51;font:600 9px monospace;letter-spacing:1.6px;stroke:none}
.portal-core{fill:#faf4df;fill-opacity:.88;stroke:#245e51;stroke-opacity:.15;stroke-width:.8}
.portal-star{fill:#df5293;stroke:#a93c6e;stroke-width:.65;transform-origin:60px 60px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.portal-star-shadow{fill:#efcf47;transform:translate(3px,2px)}
.portal-spark{stroke:#218da7;stroke-width:1.5;stroke-linecap:round}
.studio-portal>.portal-caption{background:none;border:0;box-shadow:none;padding:0;transform:none;font-size:10px;font-weight:500;letter-spacing:3px;color:#245e51;text-shadow:0 1px 5px #fff9e8;transition:transform .25s}
.studio-portal .portal-caption small{position:absolute;top:15px;left:50%;transform:translate(-50%,4px);font-size:10px;letter-spacing:1px;opacity:0;transition:opacity .25s,transform .25s;white-space:nowrap}
.studio-portal:hover>.portal-caption,.studio-portal.is-hovered>.portal-caption{background:none}
.studio-portal:is(:hover,:focus-visible,.is-hovered) .portal-star{transform:rotate(90deg) scale(.85)}
.studio-portal:is(:hover,:focus-visible,.is-hovered) .portal-seal{transform:translateY(-4px) scale(1.08)}
.studio-portal:is(:hover,:focus-visible,.is-hovered) .portal-caption small{opacity:1;transform:translate(-50%,0)}
@keyframes portal-orbit{to{transform:rotate(360deg)}}
@media(max-width:650px){.studio-portal{width:76px;height:92px;transform:translate(0,-38px)}.studio-portal .portal-seal{width:72px;height:72px}.studio-portal>.portal-caption{font-size:9px;letter-spacing:2px}}
@media(prefers-reduced-motion:reduce){.portal-orbit{animation:none}.studio-portal *{transition:none!important}}.motion-off .portal-orbit{animation:none}

.inspecting-doll .studio-portal,.inspecting-doll .studio-orientation{display:none!important}.inspecting-doll .studio-tooltip{display:none}
@media(min-width:651px){.studio-nav{height:64px;padding-top:14px;padding-bottom:14px}.studio-layout{height:calc(100dvh - 129px)}.studio-foot{min-height:65px}}

/* Let the room occupy the hero instead of a small framed column. */
@media(min-width:651px){
 #studio-intro .studio-nav{position:absolute;top:0;left:0;right:0;border-bottom:0;pointer-events:none}
 #studio-intro .studio-nav button{pointer-events:auto}
 #studio-intro .studio-layout{height:calc(100dvh - 56px);min-height:400px;grid-template-columns:190px minmax(0,1fr);padding-left:28px}
 #studio-intro .studio-caption{padding-top:110px}
 #studio-intro .studio-caption h1{font-size:clamp(36px,3.6vw,56px)}
 #studio-intro .studio-foot{min-height:56px;margin:0 28px;border-top:0}
 #studio-intro .studio-mini-label{margin-top:24px}
}
@media(min-width:651px) and (max-height:680px){#studio-intro .studio-caption{padding-top:86px}#studio-intro .studio-caption h1{font-size:35px}#studio-intro .studio-caption p{font-size:11px}#studio-intro .studio-rule{margin:12px 0}}
