/* G page: full artwork, Safari controls and device safe areas. */
:root{--safe-vh:100vh;--left-safe:env(safe-area-inset-left,0px);--right-safe:env(safe-area-inset-right,0px)}
@supports(height:100svh){:root{--safe-vh:100svh}}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.gate{position:relative;width:100%;height:auto;min-height:var(--safe-vh);max-width:none;margin:0;padding:80px max(24px,var(--right-safe)) max(30px,env(safe-area-inset-bottom,0px)) max(24px,var(--left-safe));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}
.gate .gallery{position:relative;inset:auto;display:block;padding:0;width:min(1100px,100%,calc((var(--safe-vh) - 240px)*16/9));height:auto;min-height:0;max-width:100%;aspect-ratio:16/9;overflow:hidden;flex:0 0 auto}
.gate .image-stage{position:absolute;inset:0;transform:none;width:100%;height:100%;max-height:none;aspect-ratio:16/9}
.gate .slide{object-fit:contain}.gate .previous,.gate .next{top:calc(50% - 22px);width:44px;height:44px}.gate .previous{left:8px}.gate .next{right:8px}
.gate .motion-toggle{position:fixed;top:max(16px,env(safe-area-inset-top,0px));right:max(16px,var(--right-safe));width:44px;height:44px;z-index:5}
.gate .gate-language{position:fixed;left:max(16px,var(--left-safe));right:auto;top:max(16px,env(safe-area-inset-top,0px));z-index:5;min-height:44px}
.gate-scene{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.gate .dots{position:static;transform:none;display:flex;flex:0 0 auto;justify-content:center;margin:30px 0 12px;gap:0}.gate .dot{min-width:44px;min-height:44px;padding:12px}
.gate .action-area{position:static;transform:none;flex:0 0 auto;width:min(420px,100%);max-width:none}.gate .watch-button{min-height:58px;background:linear-gradient(110deg,#ffedc0,#f9dfa0);font-size:15px}.gate-watch-note{display:none}
select:focus-visible{outline:2px solid var(--cream);outline-offset:4px}::selection{background:#f9dfa0;color:#101820}
.guide-open,.guide-open body{overflow:hidden;overscroll-behavior:none}
dialog{max-height:calc(var(--safe-vh) - 32px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.guide-card{padding-bottom:max(20px,env(safe-area-inset-bottom,0px))}.guide-hint{color:#c0c7d1;font-size:13px;line-height:1.65;margin:0 0 22px}
.close-guide{width:44px;height:44px;top:8px;right:8px}.manual-copy input{font-size:16px;min-height:48px;-webkit-user-select:text;user-select:text}.guide-steps li{overflow-wrap:anywhere}.copy-status{overflow-wrap:anywhere}
dialog[data-fallback][open]{position:fixed;inset:16px 0;margin:auto;z-index:100;box-shadow:0 0 0 100vmax #020408d9}
@supports(height:100dvh){dialog{max-height:calc(100dvh - 32px)}}
@media(max-width:600px){.gate{padding-top:max(80px,calc(env(safe-area-inset-top,0px) + 54px));padding-left:max(16px,var(--left-safe));padding-right:max(16px,var(--right-safe))}.gate .gallery{width:min(100%,calc((var(--safe-vh) - 250px)*16/9))}.gate .previous{left:4px}.gate .next{right:4px}.gate .action-area{width:min(100%,420px)}}
@media(max-height:600px) and (orientation:landscape){
 .gate{min-height:var(--safe-vh);padding:54px max(20px,var(--right-safe)) max(12px,env(safe-area-inset-bottom,0px)) max(20px,var(--left-safe))}
 .gate .gallery{width:min(760px,100%,calc((var(--safe-vh) - 164px)*16/9))}.gate .dots{margin:4px 0 0}.gate .watch-button{min-height:44px;padding:10px 20px;font-size:14px}
 .gate .motion-toggle,.gate .gate-language{top:8px}
 dialog{width:min(620px,calc(100vw - max(32px,var(--left-safe)) - max(32px,var(--right-safe))))}.guide-card{padding:22px 26px 16px}.safari-mark{display:none}#guide-title{margin-bottom:12px;padding-right:24px;font-size:19px}.guide-hint{margin-bottom:12px}.guide-steps{gap:10px}.guide-divider{margin:14px 0 10px;padding-top:12px}
}

.gate .gallery,.gate .dots{direction:ltr}.gate .watch-button span{min-width:0;line-height:1.5;overflow-wrap:anywhere}
[dir=rtl] .button-arrow{transform:scaleX(-1)}[dir=rtl] .guide-card{text-align:start}
.manual-copy input{direction:ltr;text-align:left;unicode-bidi:plaintext}#guide-title{padding-inline:28px}
@media(max-width:360px){.gate .watch-button{font-size:14px;padding-left:16px;padding-right:16px}}
@media(max-height:600px) and (orientation:landscape){.gate .watch-button{font-size:13px;padding-top:8px;padding-bottom:8px}}