*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#19211c;background:#f2f2ed;font-family:Arial,Helvetica,sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d9a41e;outline-offset:4px}button[hidden],[hidden]{display:none!important}.hero{position:relative;width:100%;height:100svh;min-height:420px;overflow:clip;isolation:isolate;background:#dededb}.studio-viewport{position:absolute;inset:0;overflow:clip;outline:none;touch-action:pan-y}.scene{position:relative;width:100%;height:100%;background:#dededb url('assets/studio-grigio.png') center center/cover no-repeat}.objects{position:absolute;width:1774px;height:887px;transform-origin:0 0}.hotspot{position:absolute;padding:0;border:0;background:transparent;z-index:5;outline-offset:3px}.hotspot:focus-visible{outline:2px dashed #a97a0d;border-radius:5px}.hotspot svg{display:block;width:100%;height:100%;overflow:visible}.hotspot::after{content:'';position:absolute;inset:-18px;border-radius:50%;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,#fff1b34d 0%,#ffe9a02e 35%,#ffe9a010 58%,#ffe9a000 78%);filter:blur(12px);transition:opacity .35s}.hotspot:focus-visible::after{opacity:1}@media(hover:hover) and (pointer:fine){.hotspot:hover::after{opacity:1}.is-dragging .hotspot::after{opacity:0}}#doorButton{border-radius:8px}#coffeeLink{overflow:visible}.coffee-art{position:absolute;inset:0;background:url('assets/studio-grigio.png') -468px -321px/1774px 887px no-repeat;transition:transform .3s,filter .3s;transform-origin:50% 95%;border-radius:9px;pointer-events:none}#coffeeLink.is-active .coffee-art{transform:none;filter:brightness(1.035)}
.portrait{position:absolute;right:1vw;bottom:-2px;height:89svh;aspect-ratio:400/680;z-index:12;outline:none;pointer-events:none;transform:translate(var(--person-x,0),var(--person-y,0));transition:filter .6s}#characterArt{width:100%;height:217.647%;display:block;overflow:visible;pointer-events:none}#restPose{pointer-events:visiblePainted;cursor:pointer;transform-origin:50% 32%;animation:quiet-breath 8.2s ease-in-out infinite}.eyes-closed{display:none}.is-blinking .eyes-open{display:none}.is-blinking .eyes-closed{display:inline}@keyframes quiet-breath{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-1.2px) rotate(.08deg)}72%{transform:translateY(-.35px) rotate(-.045deg)}}
.speech-card{position:absolute;right:28vw;top:23%;width:min(390px,40vw);padding:23px 34px 23px 24px;z-index:31;background:#fffef8;border:2px solid #212620;border-radius:19px;box-shadow:4px 5px 0 #dcae35;line-height:1.45;font-size:clamp(16px,1.45vw,21px);animation:card-in .22s ease-out}.speech-card strong{font-weight:700}.card-close{position:absolute;right:9px;top:7px;border:0;background:transparent;width:25px;height:25px;font-size:23px;line-height:1;color:#5f655c}.card-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.card-actions:empty{display:none}.card-actions a,.card-actions button{padding:9px 13px;border:1px solid #202820;border-radius:8px;background:#e6b92f;color:#1d261d;font-size:13px;font-weight:600;text-decoration:none;line-height:1.3}.card-actions button.secondary,.card-actions a.secondary{background:#f5f4ec}.card-actions button:disabled{cursor:default;background:#e9e9e2;border-color:#b5b8ad;color:#74796f}.story-step{display:block;margin-top:14px;font-size:11px;color:#778071;letter-spacing:.08em}@keyframes card-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
#alexaButton{z-index:7}.alexa-glow{position:absolute;width:35px;height:6px;border-radius:50%;left:8px;bottom:1px;background:#5cdbff;filter:blur(2px);box-shadow:0 0 12px 4px #40c5ff99,0 0 25px 9px #55d2ff40;opacity:0;pointer-events:none}.is-playing .alexa-glow{opacity:.65;animation:alexa-breathe 4.2s ease-in-out infinite}.music-notes{position:absolute;inset:0;overflow:visible;opacity:0;pointer-events:none;color:#111}.is-playing .music-notes{opacity:1}.music-notes i{position:absolute;left:23px;top:9px;font-size:24px;font-style:normal;opacity:0}.is-playing .music-notes i{animation:music-note 3.6s linear infinite}.music-notes i:nth-child(2){animation-delay:.9s}.music-notes i:nth-child(3){animation-delay:1.8s}.music-notes i:nth-child(4){animation-delay:2.7s}@keyframes alexa-breathe{0%,100%{opacity:.4;filter:blur(2px) brightness(.9)}50%{opacity:.78;filter:blur(2px) brightness(1.12)}}@keyframes music-note{0%{opacity:0;transform:translate(-2px,0) rotate(-8deg)}15%{opacity:.85}80%{opacity:.6}100%{opacity:0;transform:translate(22px,-87px) rotate(16deg)}}
.spotify-panel{position:absolute;bottom:22px;left:22px;width:340px;z-index:32;padding:12px;background:#20251f;color:#f7f8f2;border:1px solid #64705e;border-radius:16px;box-shadow:0 8px 35px #16221a40}.player-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px;font-size:12px;letter-spacing:.03em}.player-heading button{background:transparent;border:0;color:#fff;font-size:24px;line-height:20px;width:28px;height:24px}.spotify-panel iframe{border:0;display:block;width:100%;height:152px;border-radius:12px}.spotify-panel small{display:block;color:#aeb7a7;margin-top:8px;font-size:10px}
#paperCanvas{position:absolute;inset:0;z-index:2;pointer-events:none}.printer-led{position:absolute;width:4px;height:2px;border-radius:2px;opacity:0;pointer-events:none}.led-green{left:81px;top:32px;background:#66ff75;box-shadow:0 0 4px 2px #62ff67}.led-blue{left:82px;top:43px;background:#47d8ff;box-shadow:0 0 4px 2px #47d8ff}.is-printing .led-green{animation:printer-spy .63s steps(1) infinite}.is-printing .led-blue{animation:printer-spy .91s .2s steps(1) infinite}@keyframes printer-spy{0%,45%{opacity:1}46%,100%{opacity:.1}}
.lamp-halo{position:absolute;left:-27px;top:-27px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,#fff9bdbd 0,#ffe78261 22%,#ffe78200 68%);opacity:0;filter:blur(7px);transition:opacity .4s;pointer-events:none}.lamp-bulb{position:absolute;left:17px;top:14px;width:10px;height:10px;border-radius:50%;background:#fffbd3;box-shadow:0 0 8px 4px #ffe599;opacity:0;transition:opacity .3s;pointer-events:none}.is-lit .lamp-halo,.is-lit .lamp-bulb{opacity:1}.room-dark{position:absolute;inset:0;z-index:3;background:#03070c;opacity:0;pointer-events:none;transition:opacity .65s}.is-dark .room-dark{opacity:.965}.is-dark .portrait{filter:brightness(.07) saturate(.35)}.is-dark .coffee-art,.is-dark #referencesButton svg{filter:brightness(.06)}.is-dark #phoneButton svg{filter:brightness(.07)}.is-dark #phoneButton.is-on svg{filter:brightness(.6)}.is-dark .music-notes{color:#111}.is-dark .hotspot::after{background:none}#restoreLight{position:absolute;top:16px;left:16px;z-index:33;border:1px solid #6b746c;border-radius:20px;background:#182019;color:#dce5da;padding:10px 15px;font-size:12px}.phone-display{opacity:0;transition:opacity .3s}#phoneButton.is-on .phone-display{opacity:1;filter:drop-shadow(0 0 3px #93d7ef)}.is-dark #phoneButton.is-on .phone-display{filter:drop-shadow(0 0 5px #a9e4ff)}
.mobile-nav{display:none}.below-studio{padding:100px max(6vw,24px);background:#f1f1eb;scroll-margin-top:20px}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:bold}.below-studio h1{font-size:clamp(30px,4vw,58px);max-width:760px;letter-spacing:-.04em;margin:22px 0}.below-studio>p:not(.eyebrow){color:#66705f;max-width:570px;line-height:1.7}.section-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:55px 0}.section-grid article{border-top:1px solid #c8ccbf;padding-top:24px;scroll-margin-top:28px}.section-grid span{font-size:10px;letter-spacing:.1em;color:#747e6c}.section-grid h2{font-size:24px;font-weight:500;letter-spacing:-.03em}.section-grid p{font-size:14px;line-height:1.65;color:#66705f}.contact-actions{display:flex;flex-wrap:wrap;gap:12px}.contact-actions a,.back-top{color:#253b28;font-size:13px;text-underline-offset:5px}.contact-actions a{border:1px solid #a2ab98;padding:9px 12px;border-radius:5px;text-decoration:none}
@media(max-width:820px){.hero{height:100svh;min-height:360px}.studio-viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-y}.studio-viewport::-webkit-scrollbar{display:none}.scene{width:var(--world-width,200svh);max-width:none}.portrait{right:auto;left:var(--mobile-person,73%);bottom:-100px;height:76svh;min-height:390px;aspect-ratio:400/680;transform:translateX(-50%);transition:left .4s ease,filter .6s;z-index:12}.portrait #characterArt{height:217.647%}.speech-card{left:14px;right:14px;top:auto!important;bottom:calc(100px + env(safe-area-inset-bottom));width:auto;max-width:none;max-height:34svh;overflow-y:auto;padding:16px 33px 16px 17px;font-size:15px;border-radius:13px;box-shadow:3px 4px 0 #dcae35}.card-actions{margin-top:12px;gap:7px}.card-actions a,.card-actions button{min-height:38px;padding:9px 12px;font-size:12px}.mobile-nav{position:absolute;display:block;z-index:35;left:14px;right:14px;bottom:calc(12px + env(safe-area-inset-bottom));background:#fffcf0ed;border:1px solid #8d9283;border-radius:13px;padding:8px 12px;box-shadow:0 3px 15px #1c261d19;user-select:none}.pan-hint{display:block;text-align:center;font-size:10px;color:#5d6759;margin-bottom:2px;letter-spacing:.04em}.pan-controls{display:flex;align-items:center;gap:12px}.pan-controls button{border:0;background:transparent;width:34px;height:31px;font-size:23px;line-height:1;color:#293626}.pan-controls button:disabled{opacity:.3}.pan-controls input{accent-color:#6b795c;width:100%;min-width:0;height:24px}.is-dragging .hotspot{cursor:grabbing}.spotify-panel{top:12px;bottom:auto;left:12px;right:12px;width:auto;max-width:380px}.below-studio{padding:65px 24px}.section-grid{grid-template-columns:1fr;gap:30px}.is-dark .mobile-nav{background:#20291fed;color:#d9e1d3;border-color:#535e4f}.is-dark .pan-hint,.is-dark .pan-controls button{color:#d9e1d3}}
@media(max-height:500px) and (max-width:820px){.portrait{height:110svh;bottom:-55px;min-height:0}.speech-card{left:22%;right:25%;max-height:65svh;bottom:85px}.mobile-nav{left:25%;right:25%}.spotify-panel{width:330px;right:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}#restPose{animation:none}.is-playing .alexa-glow{opacity:.65}.is-playing .music-notes i{opacity:0}}

#lightSwitch::before,#lampButton::before,#alexaButton::before{content:'';position:absolute;inset:-7px}
@media(max-height:500px) and (max-width:820px){.spotify-panel{width:43vw;max-width:330px}.speech-card{left:49%;right:14px;max-height:66svh}}
#coffeeFloor,#coffeeFlow{position:absolute;inset:0;width:1774px;height:887px;pointer-events:none}#coffeeFloor{z-index:2}#coffeeFlow{z-index:6;transition:filter .65s}.is-dark #coffeeFlow{filter:brightness(.055)}#coffeeLink.is-brewing .coffee-art{filter:brightness(1.025)}

/* Keep the physical light switch easy to find with the room lights off. */
#lightSwitch svg{transition:filter .65s}.is-dark #lightSwitch svg{filter:brightness(.8) drop-shadow(0 0 9px #bfd8f055)}.is-dark #lightSwitch circle{fill:#9fd9ef}

/* A short speech tail stays clear of the mouth. */
@media(min-width:821px){.speech-card::after{content:"";position:absolute;right:-9px;top:var(--tail-y,56px);width:15px;height:15px;background:#fffef8;border-top:2px solid #212620;border-right:2px solid #212620;transform:translateY(-50%) rotate(45deg);border-radius:0 2px 0 0;pointer-events:none}}

@media(min-width:821px){.speech-card[data-tail]::after{left:var(--tail-x);right:auto;transform:translateX(-50%) rotate(45deg)}.speech-card[data-tail="bottom"]::after{top:auto;bottom:-9px;border:0;border-right:2px solid #212620;border-bottom:2px solid #212620}.speech-card[data-tail="top"]::after{top:-9px;bottom:auto;border:0;border-left:2px solid #212620;border-top:2px solid #212620}}

/* Door is behind the central chair: clip its light and hit area to the visible surface.
   Coordinates are in the same fixed artwork space as the door hotspot. */
#doorButton{clip-path:path('M0 0H205V204C196 204 192 211 192 224L187 357C176 356 159 356 151 360C143 364 142 378 148 384L171 388L169 404H0Z')}
#doorButton::after{inset:4px 6px;border-radius:12px;background:radial-gradient(ellipse at 45% 44%,#fff1b34d 0%,#ffe9a02e 32%,#ffe9a010 56%,#ffe9a000 76%);filter:blur(14px)}
.is-dark #doorButton::after{background:none}

@media(min-width:821px){.speech-card.is-door-card{width:180px;padding:17px 30px 17px 18px;font-size:17px;border-radius:14px}}

#mossCanvas{position:absolute;inset:0;width:1774px;height:887px;pointer-events:none;z-index:2}
#mossButton{border-radius:5px}
/* Smaller wall plate; keep its existing comfortable click/tap target. */
#lightSwitch svg{width:20px;height:33px;margin:7.5px auto}
/* Room lights off: only the lamp and Alexa remain emissive. */
.is-dark #coffeeLink.is-active .coffee-art,.is-dark #coffeeLink.is-brewing .coffee-art{filter:brightness(.055);transform:none}

.is-dark #phoneButton.is-on svg{filter:brightness(.055)}
.is-dark #phoneButton.is-on .phone-display{filter:none}
.is-dark #lightSwitch svg{filter:brightness(.45)}
.is-dark #lightSwitch circle{fill:#8a8a84}



/* Translate the complete room layer, including hotspots, liquids and particles. */
.scene{translate:0 var(--scene-shift,0px)}.portrait{translate:0 var(--portrait-shift,0px)}
.hero.parallax-active .scene,.hero.parallax-active .portrait{will-change:translate}
@media(prefers-reduced-motion:reduce){.scene,.portrait{translate:none!important}}

/* Six independent routes, sizes and phases around the speaker. */
.is-playing .music-notes i{animation:music-drift var(--note-duration,4s) var(--note-delay,0s) linear infinite}
.music-notes i:nth-child(1){font-size:19px;--note-x:-65px;--note-y:-78px;--note-turn:-28deg;--note-duration:3.7s;--note-delay:-.4s}
.music-notes i:nth-child(2){font-size:28px;--note-x:73px;--note-y:-48px;--note-turn:24deg;--note-duration:4.4s;--note-delay:-1.8s}
.music-notes i:nth-child(3){font-size:22px;--note-x:-78px;--note-y:22px;--note-turn:-16deg;--note-duration:4.1s;--note-delay:-2.5s}
.music-notes i:nth-child(4){font-size:31px;--note-x:65px;--note-y:52px;--note-turn:32deg;--note-duration:4.8s;--note-delay:-3.7s}
.music-notes i:nth-child(5){font-size:16px;--note-x:-8px;--note-y:-111px;--note-turn:18deg;--note-duration:3.9s;--note-delay:-1.2s}
.music-notes i:nth-child(6){font-size:25px;--note-x:12px;--note-y:82px;--note-turn:-25deg;--note-duration:4.6s;--note-delay:-.8s}
@keyframes music-drift{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.72)}12%{opacity:.85}48%{opacity:.72;transform:translate(calc(var(--note-x)*.44),calc(var(--note-y)*.38)) rotate(calc(var(--note-turn)*-.3)) scale(.94)}80%{opacity:.5}100%{opacity:0;transform:translate(var(--note-x),var(--note-y)) rotate(var(--note-turn)) scale(1.08)}}
@media(prefers-reduced-motion:reduce){.is-playing .music-notes i{animation:none;opacity:0}}
.spotify-panel{background:#282624;border-color:#625b54}.spotify-panel small{color:#c0b7ae}

#phoneButton svg{transform:scale(.88);transform-origin:50% 55%}

.moss-ground{position:absolute;inset:0;width:1774px;height:887px;pointer-events:none;z-index:2}

@media(max-width:820px){.portrait{bottom:-40px}#panLeft,#panRight{display:none}.pan-controls{gap:0}}
@media(max-height:500px) and (max-width:820px){.portrait{bottom:-20px}}

.moss-bare{position:absolute;left:348px;top:48px;width:198px;height:198px;z-index:1;pointer-events:none}

/* A tiny locator light, independent of the dimmed switch plate. */
#lightSwitch::after{content:"";position:absolute;inset:auto;left:13px;top:29px;width:3px;height:2px;border-radius:2px;background:#a5c7d0;filter:blur(.45px);box-shadow:0 0 3px 1px #9bbcc82b;opacity:0;pointer-events:none;transition:opacity .65s}
.hero.is-dark #lightSwitch::after{background:#a5c7d0;opacity:.58}
.hero:not(.is-dark) #lightSwitch::after{opacity:0}

/* Reveal the matching artwork beneath darkness, with a feathered falloff. */
.local-light{position:absolute;display:block;pointer-events:none;opacity:0;background-image:url('assets/studio-grigio.png');background-size:1774px 887px;background-repeat:no-repeat;transition:opacity .65s;z-index:-1}
#lampButton .local-light{left:-78px;top:-60px;width:200px;height:170px;background-position:-1168px -224px;mask-image:radial-gradient(ellipse at 99px 79px,#000 0%,#0009 24%,#0000 72%);-webkit-mask-image:radial-gradient(ellipse at 99px 79px,#000 0%,#0009 24%,#0000 72%);filter:sepia(.18) brightness(1.12)}
.is-dark #lampButton.is-lit .local-light{opacity:.48}
.is-dark #lampButton.is-lit .lamp-halo{left:-68px;top:-66px;width:180px;height:180px;background:radial-gradient(circle,#fff3b15c 0%,#ffdc6e24 28%,#ffcf430a 48%,#ffcf4300 72%);filter:blur(12px)}
#alexaButton .local-light{left:-40px;top:4px;width:130px;height:95px;background-position:-1202px -232px;mask-image:radial-gradient(ellipse at 65px 40px,#0009 0%,#0005 20%,#0000 70%);-webkit-mask-image:radial-gradient(ellipse at 65px 40px,#0009 0%,#0005 20%,#0000 70%);filter:brightness(1.12)}
.is-dark #alexaButton.is-playing .local-light{opacity:.28}
.is-dark #alexaButton.is-playing .alexa-glow{box-shadow:0 0 12px 4px #40c5ff99,0 0 30px 13px #55d2ff25;filter:blur(3px)}
#printerButton .local-light{left:45px;top:-2px;width:76px;height:80px;background-position:-363px -318px;mask-image:radial-gradient(ellipse at 37px 40px,#0009 0%,#0005 20%,#0000 70%);-webkit-mask-image:radial-gradient(ellipse at 37px 40px,#0009 0%,#0005 20%,#0000 70%)}
.is-dark #printerButton.is-printing .local-light{opacity:.21;animation:printer-local-light .91s steps(1) infinite}
.is-dark .is-printing .led-green{box-shadow:0 0 4px 2px #62ff6780,0 0 13px 5px #62ff6729}
.is-dark .is-printing .led-blue{box-shadow:0 0 4px 2px #47d8ff80,0 0 14px 6px #47d8ff26}
#lightSwitch .local-light{left:-5px;top:12px;width:40px;height:36px;background-position:-858px -225px;mask-image:radial-gradient(ellipse,#0009 0%,#0000 68%);-webkit-mask-image:radial-gradient(ellipse,#0009 0%,#0000 68%)}
.is-dark #lightSwitch .local-light{opacity:.09}
@keyframes printer-local-light{0%,45%{opacity:.21}46%,100%{opacity:.06}}
@media(prefers-reduced-motion:reduce){.is-dark #printerButton.is-printing .local-light{animation:none;opacity:.14}}

.window-daylight,.daylight-spill{position:absolute;inset:0;width:1774px;height:887px;pointer-events:none}
.window-daylight{z-index:0;mix-blend-mode:multiply}.daylight-spill{z-index:1;mix-blend-mode:soft-light}

.studio-wall-color{position:absolute;inset:0;width:1774px;height:887px;z-index:0;pointer-events:none}

@media(max-width:820px){
 .hero .mobile-nav{left:auto;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:auto;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
 #studioInfo{display:block;min-width:45px;height:35px;padding:0 10px;background:#e6b92f;color:#25221c;border:1px solid #25221c;border-radius:8px;font-size:12px;font-weight:600;line-height:1;box-shadow:0 2px 8px #00000016}
 #studioInfoTip{position:absolute;right:0;bottom:47px;white-space:nowrap;padding:11px 14px;background:#fffdf8;border:1px solid #25221c;border-radius:10px;font-size:13px;color:#25221c;box-shadow:2px 3px 0 #e6b92f}
}

.monitor-window-light{position:absolute;inset:0;width:1774px;height:887px;z-index:4;pointer-events:none;opacity:0;transition:opacity .65s}
.is-dark .monitor-window-light{opacity:.2}

/* Arriving in the studio: an entrance independent of the scroll parallax. */
@media(prefers-reduced-motion:no-preference){.portrait #characterArt{animation:character-arrival 1.35s cubic-bezier(.22,.7,.25,1) .2s both;transform-origin:50% 30%}}
@keyframes character-arrival{0%{transform:translateX(110vw) rotate(2deg)}75%{transform:translateX(-7px) rotate(-.4deg)}100%{transform:translateX(0) rotate(0)}}
#studioFloorLayers{position:absolute;inset:0;width:1774px;height:887px;pointer-events:none;z-index:2}

.portrait.is-sleeping .eyes-open{display:none!important}.portrait.is-sleeping .eyes-closed{display:inline!important}.portrait.is-yawning .eyes-open{display:inline!important}.portrait.is-yawning .eyes-closed{display:none!important}
.sleep-bubble{position:absolute;z-index:32;display:flex;align-items:center;gap:7px;min-width:85px;min-height:57px;padding:12px 16px;background:#fffef8;color:#212620;border:2px solid #212620;border-radius:24px;font-family:Inter,Arial,sans-serif;box-shadow:4px 5px 0 #dcae35;pointer-events:none}.sleep-bubble:after{content:"";position:absolute;right:6px;bottom:-8px;width:14px;height:14px;border-right:2px solid #212620;border-bottom:2px solid #212620;background:#fffef8;transform:skewY(30deg) rotate(15deg)}.sleep-bubble span{position:relative;z-index:1;display:block;animation:sleep-z 2.8s ease-in-out infinite;font-weight:600;font-size:16px}.sleep-bubble span:nth-child(2){font-size:22px;animation-delay:.35s}.sleep-bubble span:nth-child(3){font-size:28px;animation-delay:.7s}@keyframes sleep-z{0%,100%{transform:translateY(2px);opacity:.55}50%{transform:translateY(-4px);opacity:1}}@media(prefers-reduced-motion:reduce){.sleep-bubble span{animation:none}}

/* A smaller, raised mobile portrait with continuous horizontal positioning. */
@media(max-width:820px){.portrait{height:68svh;min-height:330px;bottom:50px;transition:left .85s cubic-bezier(.22,.61,.36,1),filter .6s}.speech-card{left:16px;right:16px;bottom:calc(100px + env(safe-area-inset-bottom));padding:23px 56px 22px 21px;max-height:min(40svh,320px);font-size:15px;line-height:1.55;border-radius:16px;scrollbar-width:thin}.speech-card .card-close{right:8px;top:8px;width:40px;height:40px;font-size:27px;display:grid;place-items:center;border-radius:50%}.speech-card .card-close:active{background:#efc23825}.speech-card #speechCopy{overflow-wrap:anywhere}.speech-card .card-actions{gap:10px;margin-top:17px;margin-right:-32px;padding-right:0}.speech-card .card-actions a,.speech-card .card-actions button{min-height:44px;padding:11px 14px;font-size:13px}.speech-card .card-actions:empty{display:none}}
@media(max-height:500px) and (max-width:820px){.portrait{height:82svh;min-height:0;bottom:30px}.speech-card{left:35%;right:16px;bottom:86px;max-height:calc(100svh - 120px);padding-top:18px;padding-bottom:18px}}
@media(prefers-reduced-motion:reduce) and (max-width:820px){.portrait{transition:filter .6s}}
@media(max-width:820px){.hero .mobile-nav{left:16px;right:auto}.hero #studioInfoTip{left:0;right:auto}}
/* Entrance and an immediately visible invitation to explore. */
.studio-welcome{position:absolute;inset:0;z-index:48;display:grid;place-items:center;background:#f5f3efc9;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);padding:24px}.studio-welcome-card{text-align:center;width:min(420px,100%);font-family:Inter,Arial,sans-serif;color:#282521;animation:studio-intro-appear .7s ease both}.studio-welcome-card>img{display:block;margin:0 auto 20px;object-fit:contain}.studio-welcome h2{font-weight:400;font-size:clamp(35px,4vw,54px);letter-spacing:-.06em;line-height:1.08;margin:0}.studio-entry-instructions{font-size:16px;line-height:1.65;margin:8px 0 22px}.studio-welcome button{border:1px solid #282521;border-radius:8px;background:#efc238;color:#282521;min-height:46px;padding:12px 20px;font-weight:600;font-size:15px}.studio-gesture{position:relative;height:75px;width:130px;margin:15px auto 5px}.studio-gesture svg{position:absolute;width:52px;height:52px;left:40px;top:8px;animation:studio-gesture-swipe 1.5s ease-in-out infinite}.studio-gesture span{position:absolute;left:8px;right:8px;top:32px;border-top:2px dashed #bda976}.studio-gesture i{position:absolute;width:22px;height:22px;left:54px;top:8px;border:1px solid #d5aa25;border-radius:50%;animation:studio-gesture-tap 1.5s ease-out infinite}
.studio-discover{position:absolute;z-index:28;top:100px;left:24px;max-width:380px;display:flex;align-items:center;gap:20px;background:#fffdf8ec;border:1px solid #c9bca4;border-radius:12px;padding:13px 15px;box-shadow:0 4px 18px #28252110;font-family:Inter,Arial,sans-serif}.studio-discover strong{font-size:14px;display:block;color:#282521;font-weight:600}.studio-discover span{font-size:11px;line-height:1.5;display:block;color:#776a57;margin-top:4px}.studio-discover a{white-space:nowrap;color:#282521;font-size:12px;font-weight:600;background:#efc238;border:1px solid #282521;border-radius:7px;padding:10px 12px;text-decoration:none}
.studio-tour #macButton,.studio-tour #coffeeLink,.studio-tour #printerButton{outline:2px solid #efc238;outline-offset:4px;animation:studio-object-invite 2.2s ease-in-out 3;border-radius:9px}.studio-tour #coffeeLink{animation-delay:.3s}.studio-tour #printerButton{animation-delay:.6s}
@keyframes studio-intro-appear{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes studio-gesture-swipe{0%,100%{transform:translateX(-20px)}50%{transform:translateX(20px)}}@keyframes studio-gesture-tap{0%,100%{opacity:0;transform:translateX(-20px) scale(.8)}20%{opacity:.8}50%{opacity:0;transform:translateX(20px) scale(1.4)}}@keyframes studio-object-invite{0%,100%{outline-color:#efc23800}45%{outline-color:#efc238}}
@media(max-width:820px){.portrait{height:58svh;min-height:280px;bottom:118px}.studio-discover{top:82px;left:14px;right:14px;max-width:none;justify-content:space-between;gap:10px;padding:11px 12px}.studio-discover strong{font-size:13px}.studio-discover span{font-size:10px}.studio-discover a{font-size:11px;padding:10px}.studio-welcome-card>img{width:40px;height:40px;margin-bottom:18px}.studio-welcome h2{font-size:40px}.studio-entry-instructions{font-size:15px}}
@media(max-height:500px) and (max-width:820px){.portrait{height:72svh;min-height:0;bottom:44px}.studio-discover{top:65px;right:auto;width:300px;padding:8px 10px}.studio-welcome h2{font-size:30px}.studio-welcome-card>img{width:28px;height:28px;margin-bottom:8px}.studio-gesture{height:50px;margin-top:5px}.studio-gesture svg{height:40px}.studio-entry-instructions{font-size:13px;margin:4px 0 10px}}
@media(prefers-reduced-motion:reduce){.studio-welcome-card,.studio-gesture svg,.studio-gesture i,.studio-tour #macButton,.studio-tour #coffeeLink,.studio-tour #printerButton{animation:none}.studio-gesture i{display:none}}

/* Horizontal studio dragging works from the character; vertical scrolling stays native. */
@media(max-width:820px){.portrait{pointer-events:auto;touch-action:pan-y;user-select:none;-webkit-user-select:none}.portrait #characterArt,.portrait #restPose{touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.is-dragging .portrait,.is-dragging #restPose{cursor:grabbing}}

.studio-scroll-cue{display:none}
@media(max-width:820px){.studio-scroll-cue{position:absolute;z-index:30;left:80px;right:16px;bottom:calc(18px + env(safe-area-inset-bottom));max-width:260px;margin-left:auto;display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 16px;border:1px solid #a99b82;border-radius:12px;background:#fffdf8ec;color:#282521;text-decoration:none;font-family:Inter,Arial,sans-serif;box-shadow:0 3px 12px #28252114}.studio-scroll-cue strong{display:block;font-size:13px;font-weight:600;line-height:1.3}.studio-scroll-cue small{display:block;font-size:11px;line-height:1.4;margin-top:2px;color:#746754}.studio-scroll-cue svg{width:22px;height:28px;flex:none;animation:studio-scroll-down 2.6s ease-in-out infinite}.studio-scroll-cue:active{background:#efc238}.studio-scroll-cue:focus-visible{outline:2px solid #282521;outline-offset:3px}}
@keyframes studio-scroll-down{0%,100%{transform:translateY(-2px);opacity:.55}50%{transform:translateY(3px);opacity:1}}
@media(prefers-reduced-motion:reduce){.studio-scroll-cue svg{animation:none}}

#studioDiscoverDismiss{display:none}
@media(max-width:820px){.portrait{left:var(--mobile-person,88%)}.studio-discover{top:82px;left:14px;right:auto;width:auto;max-width:calc(100% - 28px);gap:12px;padding:8px 10px;border-radius:9px;background:#fffdf8de;box-shadow:none}.studio-discover strong{font-size:12px;font-weight:400}.studio-discover span,.studio-discover>a{display:none}.studio-discover #studioDiscoverDismiss{display:block;flex:none;background:transparent;color:#4e483f;border:0;border-left:1px solid #d7cdbb;border-radius:0;padding:8px 0 8px 11px;font:inherit;font-size:11px;font-weight:600;min-height:36px;cursor:pointer}.studio-discover.hint-dismissed{display:none}}

.hero:has(.studio-welcome:not([hidden])) .studio-discover{visibility:hidden}

.studio-pan-arrows{display:none}
@media(max-width:820px){.studio-pan-arrows{position:absolute;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:35;display:flex;gap:9px;touch-action:manipulation}.studio-pan-arrows button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #a99c86;border-radius:50%;background:#fffdf8ed;color:#282521;box-shadow:0 2px 8px #28252112;cursor:pointer;transition:background .2s,opacity .2s}.studio-pan-arrows svg{width:23px;height:23px}.studio-pan-arrows button:active{background:#efc238}.studio-pan-arrows button:disabled{opacity:.35;cursor:default}.studio-pan-arrows button:focus-visible{outline:2px solid #efc238;outline-offset:3px}.hero:has(.studio-welcome:not([hidden])) .studio-pan-arrows{visibility:hidden}}

@media(max-width:820px){.hero,.hero .studio-viewport,.hero .scene,.hero .objects,.hero .hotspot,.hero .portrait,.hero #characterArt,.hero #restPose{touch-action:pan-y pinch-zoom}.studio-viewport{scroll-behavior:auto;overscroll-behavior-x:none;-webkit-overflow-scrolling:auto}.scene,.objects,.portrait,.hotspot{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.hero .studio-pan-arrows,.hero .mobile-nav,.hero .speech-card,.hero .studio-welcome{touch-action:manipulation}}

/* A compact music dock leaves the mobile studio visible. */
.spotify-panel iframe{height:80px}
@media(max-width:820px){.spotify-panel{top:auto;bottom:80px;left:14px;right:14px;width:auto;max-width:340px;margin-left:auto;padding:9px;border-radius:14px}.spotify-panel .player-heading{margin-bottom:6px;font-size:11px;min-height:28px}.spotify-panel .player-heading button{width:32px;height:28px}.spotify-panel small{font-size:10px;margin-top:6px}.spotify-panel iframe{height:80px;min-height:80px}}

@media(max-width:820px){.studio-pan-arrows{gap:5px}.studio-pan-arrows button{width:36px;height:36px;border:0;background:#efc238;color:#fff;box-shadow:0 2px 8px #28252112}.studio-pan-arrows svg{width:18px;height:18px}.studio-pan-arrows button:active{background:#e6b728}.studio-pan-arrows button:disabled{background:#efc238;opacity:.45}}

@media(max-width:820px){.hero .mobile-nav,.hero .studio-pan-arrows{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom));transform:none;translate:none;transition:none}}

@media(min-width:821px){.hero .studio-discover{display:none}}

.coffee-appointment-copy{font-size:.78em;line-height:1.55;margin:12px 0 0;color:#716a62}

@media(min-width:821px){.studio-welcome .studio-gesture{display:none}.studio-welcome .studio-entry-instructions{margin-top:24px}}

/* Clear contact actions in the office phone speech bubble. */
.speech-card .card-actions a[href^="tel:"],.speech-card .card-actions a[href^="https://wa.me/"]{display:inline-flex;align-items:center;justify-content:center;gap:9px}
.speech-card .card-actions a[href^="https://wa.me/"]{background:#25d366;border-color:#128c46;color:#102919}
.speech-card .card-actions a[href^="tel:"]::before{content:"";display:block;flex:none;width:20px;height:20px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6.62%2010.79a15.46%2015.46%200%200%200%206.59%206.59l2.2-2.2a1%201%200%200%201%201.02-.24%2011.36%2011.36%200%200%200%203.57.57%201%201%200%200%201%201%201V20a1%201%200%200%201-1%201C10.61%2021%203%2013.39%203%204a1%201%200%200%201%201-1h3.5a1%201%200%200%201%201%201c0%201.24.2%202.44.57%203.57a1%201%200%200%201-.25%201.02l-2.2%202.2Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.speech-card .card-actions a[href^="https://wa.me/"]::before{content:"";display:block;flex:none;width:20px;height:20px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M20.52%203.48A11.87%2011.87%200%200%200%2012.07%200C5.49%200%20.14%205.35.14%2011.93c0%202.1.55%204.16%201.6%205.97L.05%2024l6.24-1.64a11.9%2011.9%200%200%200%205.77%201.47h.01c6.57%200%2011.92-5.35%2011.93-11.93a11.87%2011.87%200%200%200-3.48-8.42ZM12.07%2021.8a9.87%209.87%200%200%201-5.03-1.38l-.36-.21-3.7.97.99-3.6-.24-.37a9.88%209.88%200%200%201-1.51-5.28c0-5.47%204.45-9.92%209.93-9.92a9.85%209.85%200%200%201%207.01%202.91%209.86%209.86%200%200%201%202.9%207.02c0%205.47-4.45%209.92-9.99%209.86Zm5.45-7.43c-.3-.15-1.76-.87-2.04-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.94%201.17-.17.2-.35.22-.65.07-.3-.15-1.26-.46-2.4-1.47-.89-.8-1.49-1.78-1.66-2.08-.18-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.19.05-.37-.03-.52-.07-.15-.67-1.61-.92-2.21-.24-.58-.49-.5-.67-.51h-.57c-.2%200-.52.07-.8.37-.27.3-1.04%201.02-1.04%202.49s1.07%202.89%201.22%203.09c.15.2%202.1%203.2%205.08%204.49.71.31%201.27.49%201.71.63.72.23%201.37.2%201.89.12.57-.08%201.76-.72%202.01-1.42.25-.7.25-1.3.17-1.42-.07-.13-.27-.2-.57-.35Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}

.studio-welcome-card{width:min(480px,100%)}@media(max-width:820px){.studio-welcome{padding-left:20px;padding-right:20px}}