/* Full-screen drawing, with foreground controls kept inside iPhone safe areas. */
:root{--viewport-safe-top:0px;--viewport-safe-bottom:0px;--viewport-safe-left:0px;--viewport-safe-right:0px}
@media(pointer:coarse) and (max-width:1000px),(pointer:coarse) and (max-height:599px){
 :root{--viewport-safe-top:env(safe-area-inset-top,0px);--viewport-safe-bottom:env(safe-area-inset-bottom,0px);--viewport-safe-left:env(safe-area-inset-left,0px);--viewport-safe-right:env(safe-area-inset-right,0px);--safe-navigation-height:78px}
 body{padding-left:var(--viewport-safe-left);padding-right:var(--viewport-safe-right);padding-bottom:var(--viewport-safe-bottom)}
 body::before{content:'';display:block;height:calc(var(--safe-navigation-height) + var(--viewport-safe-top));flex-shrink:0;pointer-events:none}
 body .header:not(.end-return-navigation){position:fixed!important;top:0!important;height:calc(var(--safe-navigation-height) + var(--viewport-safe-top))!important;min-height:calc(var(--safe-navigation-height) + var(--viewport-safe-top))!important;max-height:calc(var(--safe-navigation-height) + var(--viewport-safe-top))!important;padding-top:var(--viewport-safe-top);padding-left:max(20px,var(--viewport-safe-left));padding-right:max(20px,var(--viewport-safe-right));box-sizing:border-box}
 .header .brand{top:calc(50% + var(--viewport-safe-top)/2)}
 .header .menu-button{top:calc(32px + var(--viewport-safe-top));right:max(6vw,var(--viewport-safe-right))}
 .header .mobile-menu{top:100%}
 body.home-video-entrance .home-video-cover .intro-inner{padding-left:calc(24px + var(--viewport-safe-left))!important;padding-right:calc(24px + var(--viewport-safe-right))!important}
 body.studio-page .studio-glass-cover .intro-inner{margin-left:calc(24px + var(--viewport-safe-left));margin-right:calc(24px + var(--viewport-safe-right))}

 .floating-navigation{margin-top:var(--viewport-safe-top);margin-left:var(--viewport-safe-left)}
 .floating-menu-panel{max-height:calc(100dvh - var(--viewport-safe-top) - var(--viewport-safe-bottom) - 90px)}
 .mobile-journey .about-journey-window>.about-story-photo,.mobile-journey .instagram-collage-background,.studio-page.has-document-backdrop>.safari-document-backdrop>.mobile-studio-background{top:var(--mobile-header-height,78px)!important}
}
@media(pointer:coarse) and (orientation:landscape) and (max-height:599px){
 :root{--safe-navigation-height:58px}
 .header .menu-button{top:calc(14px + var(--viewport-safe-top))}
}
/* The paint plane may be taller than the unchanged foreground gesture box. */
body.studio-page.has-entrance-glass-plane .studio-glass-cover::before{display:none!important}
.studio-entrance-glass{position:absolute;inset:0 0 auto;width:100%;height:100%;height:max(100%,calc(100lvh + env(safe-area-inset-bottom,0px)));z-index:-1;pointer-events:none;background:linear-gradient(135deg,#15151a9c,#12121880 50%,#202028a6);backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);box-shadow:0 12px 35px #0005;will-change:transform}

/* While covered, the existing touch owner holds document scroll at zero.
   Anchor entrance paint in the document so Safari does not extend a fixed
   bottom edge with an opaque browser-toolbar fill. Hide/return logic unchanged. */
@media(pointer:coarse) and (max-width:599px),(pointer:coarse) and (max-height:599px){
 html.iphone-experience body:is(.home-video-entrance,.studio-page)>.studio-glass-cover{position:absolute!important;top:var(--mobile-header-height,78px)!important}
 html.iphone-experience .has-home-document-video>.home-entrance-document-surface>.home-entrance-document-video{position:absolute!important;top:var(--mobile-header-height,78px)!important}
}

/* Home-confirmed note anchor; the same small owner also avoids a full-screen
   fixed note container on the three document-backed catalogue pages.
   The notes keep their original viewport pixel coordinates and animation.
   A zero-size fixed anchor avoids Safari treating their transparent owner
   as a full-screen color-extension surface. Clip to the visible viewport. */
html.iphone-experience body:is(.home-page,.studio-page,.workshops-page,.credits-page) .logo-note-rain{inset:0 auto auto 0;width:0;height:0;contain:none;overflow:visible;clip:rect(0px,100vw,100dvh,0px)}

/* Keep copy and cue at their captured positions inside the moving entrance.
   Safari toolbar/pull height changes must not recenter them mid-gesture. */
html.iphone-experience body:is(.home-video-entrance,.studio-page)>.studio-glass-cover.has-rigid-entrance .intro-inner{height:var(--entrance-copy-height)!important}
html.iphone-experience body:is(.home-video-entrance,.studio-page)>.studio-glass-cover.has-rigid-entrance>.mobile-studio-swipe-hint{top:var(--entrance-hint-top)!important;bottom:auto!important}

/* Match the Home startup gate: no original Studio eyebrow/copy may paint
   before the phone glass and its final copy layout have been mounted. */
html.studio-entrance-pending body.studio-page .intro-inner{opacity:0!important;pointer-events:none!important}

/* Preserve title flow; only the small identity line shares a measured baseline. */
html.iphone-experience body:is(.studio-page,.credits-page,.workshops-page,.price-page){--hero-brand-top:42px}
html.iphone-experience body:is(.studio-page,.credits-page,.workshops-page,.price-page) .intro-inner>.hero-brand-label{translate:0 var(--hero-brand-shift,0px)}
@media(orientation:landscape){html.iphone-experience body:is(.studio-page,.credits-page,.workshops-page,.price-page){--hero-brand-top:24px}}
