/* Optical placement follows the official Strand wordmark, with room for the address. */
html:is([data-venue=sy],[data-venue=st]) .hero .hero-masthead{inset:0}
html:is([data-venue=sy],[data-venue=st]) .hero .location-note{position:absolute;top:125px;left:5vw;right:5vw}
html:is([data-venue=sy],[data-venue=st]) .hero #hero-title{position:absolute;left:50%;top:var(--signature-y,46%);transform:translate(-50%,-50%);margin:0;width:max-content;max-width:100%;isolation:isolate}
html[data-venue=st] .hero .hero-brand-logo{width:min(459px,calc(100vw - 70px));height:auto;max-height:none;max-width:none}
.signature-replay{position:relative;display:block;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:inherit;line-height:0;cursor:pointer;pointer-events:auto;isolation:isolate;-webkit-tap-highlight-color:transparent}
.signature-replay:focus-visible{outline:2px solid var(--accent);outline-offset:14px}
.signature-replay:disabled{cursor:default}
.signature-replay .hero-brand-logo{display:block}
.signature-parts{position:absolute;inset:0;pointer-events:none;z-index:2;perspective:650px;perspective-origin:50% 45%}
.signature-piece{position:absolute;inset:0;transform-style:preserve-3d}
.signature-parts i{position:absolute;inset:0;background-image:var(--signature-image);background-size:100% 100%;background-repeat:no-repeat;backface-visibility:hidden}
.signature-edge{filter:brightness(.4) saturate(.8);opacity:0}
.signature-replay[data-signature-phase=rest] .signature-parts{visibility:hidden}
html:is([data-venue=sy],[data-venue=st]) .signature-replay[data-signature-phase=waiting] .signature-parts{visibility:hidden}
.signature-hint::after{content:'Replay signature'}
.signature-hint{position:absolute;left:50%;top:100%;transform:translateX(-50%);padding-top:13px;font:12px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:#fff;white-space:nowrap;opacity:0;transition:opacity .2s ease;text-shadow:0 1px 5px #000}
.signature-replay[data-signature-phase=rest]:is(:hover,:focus-visible) .signature-hint{opacity:.8}
.signature-replay:disabled .signature-hint{display:none}
html[data-venue=ab] .signature-replay{filter:drop-shadow(0 2px 3px #000b)}
/* Gallery and Discover occupy separate rows at every desktop height. */

@media(max-width:600px){html:is([data-venue=sy],[data-venue=st]) .hero .location-note{top:145px;left:7vw;right:7vw}}
@media(prefers-reduced-motion:reduce){.signature-parts{display:none!important}.signature-replay .hero-brand-logo{opacity:1!important}}
html[data-motion=off] .signature-parts{display:none!important}
html[data-motion=off] .signature-replay .hero-brand-logo{opacity:1!important}
/* Preserve Abigail's film registration while clearing its address on short phones. */
@media(max-width:600px){html[data-venue=ab] .hero{min-height:max(795px,calc(100svh - 40px))}}


/* A shallow landscape viewport needs a composed, shorter film canvas. Abigail's
   mark still follows the film crop; its closing-title registration stays intact. */
@media(orientation:landscape) and (max-height:500px){
 html[data-venue] .hero{min-height:max(320px,calc(100svh - 40px));padding:0 5vw 80px}
 html[data-venue] .hero .location-note{top:86px;font-size:8px}
 html[data-venue=sy] .hero .hero-brand-logo{height:100px}
 html[data-venue=st] .hero .hero-brand-logo{width:320px}
 html[data-venue] .hero .hero-copy{max-width:58%;text-align:left}
 html[data-venue] .hero .hero-address{font-size:11px;margin:0}
 html[data-venue] .hero .hero-actions{margin-top:8px;justify-content:flex-start}
 html[data-venue] .hero .hero-actions .text-link{font-size:11px;min-height:44px;margin-block:-6px}
 html[data-venue] .hero .hero-edge{bottom:24px;left:5vw;right:auto;width:calc(50% - 150px)}
 html[data-venue] .hero .hero-edition{display:none}
 html[data-venue] .hero #hero-play{min-height:44px}
 html[data-venue] .hero .hero-edge>a{display:none}
 html[data-venue] .reservation-dock{width:auto;padding:5px;bottom:max(12px,env(safe-area-inset-bottom))}
 html[data-venue] .reservation-dock>span{display:none}
 html[data-venue] .reservation-dock .button{min-height:44px;padding:10px 16px;font-size:12px}
 .signature-hint{padding-top:7px;font-size:12px}
}
/* Keep Gallery alongside Explore when the centered dock fills a short phone. */
@media(max-width:600px) and (max-height:720px) and (orientation:portrait){
 html[data-venue=ab] .hero{padding-bottom:249px}
}
/* Preserve white-letter separation through Strand's brightest lighting cues. */
html[data-venue=st] .signature-replay{filter:drop-shadow(0 1px 2px #000b) drop-shadow(0 3px 8px #0008)}
@media(orientation:landscape) and (max-height:360px){
 html[data-venue] .hero .location-note{display:none}
 html[data-venue=st] .hero .hero-brand-logo{width:280px}
 html[data-venue] .hero .hero-copy{translate:0 12px}
 html[data-venue] .hero .hero-edge{inset:12px auto auto 5vw;border:0;padding:0}
 html[data-venue] .hero .hero-edition{display:none}
}

@media(max-width:600px) and (max-height:720px) and (orientation:portrait){
 html[data-venue] .hero .hero-edge{inset:12px auto auto 7vw;width:auto;border:0;padding:0}
 html[data-venue] .hero .hero-edge :is(.hero-edition,a){display:none}
 html[data-venue] .hero #hero-play{min-height:44px}
 html[data-venue=ab] .hero .hero-actions{translate:0 -12px}
}
@media(orientation:landscape) and (max-height:360px){
 html[data-venue] .hero .hero-actions{justify-content:flex-start}
 html[data-venue] .hero .hero-copy{align-self:flex-start;margin-inline:0;text-align:left}
 html[data-venue] .hero .hero-address{margin-inline:0}
}


/* Small portrait screens keep the complete hero action row above the fixed dock. */
@media(max-width:600px) and (max-height:620px) and (orientation:portrait){
 html[data-venue] .hero{min-height:calc(100svh - 40px);padding-bottom:120px;gap:0}
 html[data-venue] .hero .location-note{display:none}
 html[data-venue] .hero .hero-copy{text-align:left}
 html[data-venue] .hero .hero-address{margin-inline:0}
 html[data-venue] .hero .hero-actions{justify-content:flex-start;translate:none}
}

/* Light is confined to the original artwork, never a glow across the film. */
.signature-parts .signature-light{opacity:0;background-image:linear-gradient(115deg,transparent 42%,#fff3c340 47%,#fff8e6 50%,#fff3c340 53%,transparent 58%);background-size:260% 100%;background-position:150% 50%;-webkit-mask:var(--signature-image) center/100% 100% no-repeat;mask:var(--signature-image) center/100% 100% no-repeat;mix-blend-mode:screen}
html[data-venue=sy] .signature-parts .signature-light{background-image:linear-gradient(0deg,transparent 40%,#af956250 46%,#ffe5b8 50%,#af956250 54%,transparent 60%);background-size:100% 260%;background-position:50% 150%}
html[data-venue=st] .signature-parts .signature-light{background-image:linear-gradient(105deg,transparent 42%,#b2c9ee50 47%,#fff 50%,#b2c9ee50 53%,transparent 58%)}

/* Pausing motion must not dim the venue identity. */
html[data-venue=ab] .signature-replay:disabled{opacity:1}


/* Original bird artwork, with position and wing motion separated. */
html[data-venue=ab] .signature-parts{perspective:none}
.signature-flight{position:absolute;inset:0;transform-origin:50% 26%;transform-style:preserve-3d}
html[data-venue=ab] .signature-parts .signature-light{background-image:linear-gradient(112deg,transparent 36%,#b8800020 41%,#ffe4a4a0 47%,#fff9e9 49.5%,#fffdf5 50%,#ffe4a4a0 52%,transparent 60%)}
.signature-parts .signature-reflection{opacity:0;background-image:radial-gradient(ellipse at center,#fffdf0 0%,#ffe7aaa0 12%,#e6b75030 28%,transparent 52%);background-size:220% 150%;background-position:130% 100%;-webkit-mask:var(--signature-image) center/100% 100% no-repeat;mask:var(--signature-image) center/100% 100% no-repeat;mix-blend-mode:screen}

/* Arrival lighting lives behind the original artwork and vanishes completely. */
.signature-halo{position:absolute;inset:-70% -45%;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 41%,#fff0ba 0%,#ffc65b90 12%,#e9aa3320 32%,transparent 55%);mix-blend-mode:screen;filter:blur(8px)}
.signature-flare{position:absolute;left:-40%;top:26%;width:180%;height:3px;pointer-events:none;opacity:0;background:linear-gradient(90deg,transparent,#d6963a30 20%,#ffe4aa 40%,#fff 50%,#ffe4aa 60%,#d6963a30 80%,transparent);box-shadow:0 0 18px 4px #ffc866a0;mix-blend-mode:screen}

html[data-venue=ab] .signature-replay[data-signature-phase=waiting] .signature-flight{visibility:hidden}


/* Strand's rolling period leaves a track on the ground, as a wheel would (logo-signature.js, trailFrames;
   Egie 2026-10-23: "make the trail as if the dot was a wheel on the ground"). A thin white line along the
   line the dot rolls on, touching its lowest point (y 92 of the 385 x 106 artwork) and fading out behind it:
   up to 144 x 3 px of the artwork, ending under the dot's centre. */
.signature-trail{position:absolute;left:58.052%;top:84.434%;width:37.403%;height:2.830%;opacity:0;transform-origin:100% 50%;pointer-events:none;border-radius:2px;background:linear-gradient(90deg,#fff0,#ffffff66 45%,#ffffffd9);clip-path:polygon(0 30%,100% 0,100% 100%,0 70%)}