.theatre-top{position:relative;isolation:isolate;overflow:hidden;background:#130f10;min-height:560px;height:calc(100svh - var(--site-header-height,100px));max-height:1100px;color:#f9f4ea}.theatre-set{position:absolute;inset:0;z-index:-2;background:url('assets/theatre-opening-v2.webp') center/cover no-repeat;filter:brightness(.94)}.theatre-set:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#090708b3,transparent 26%,transparent 85%,#09070833)}.theatre-identity{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:min(76%,1100px)}.theatre-identity h1{margin:0}.theatre-identity img{display:block;width:100%;height:auto}.theatre-caption{position:absolute;bottom:9%;left:6%;right:6%;display:flex;justify-content:space-between;align-items:end;gap:24px;text-shadow:0 2px 10px #000}.theatre-caption p{font-size:clamp(17px,1.5vw,24px);font-weight:600;letter-spacing:.16em;margin:0}.theatre-caption small{display:block;font-size:11px;font-weight:400;letter-spacing:.12em;margin-top:14px}.theatre-caption a{font-size:11px;white-space:nowrap;border-bottom:1px solid #c5bca7;padding:12px 0}.theatre-caption a span{margin-left:18px}.opening-drapes{display:none;position:absolute;inset:0;z-index:3;pointer-events:none}.opening-drapes>div{position:absolute;top:0;bottom:0;width:50.2%;background-image:url('assets/bordeaux-velvet-curtain.webp');background-size:200% 100%;box-shadow:0 0 35px #0009}.opening-left{left:0;background-position:left center}.opening-right{right:0;background-position:right center}.theatre-pending .opening-drapes,.theatre-top.is-playing .opening-drapes{display:block;animation:opening-failsafe 6s steps(1,end) forwards}.theatre-top.is-playing .opening-left{animation:drape-left 1.8s linear(0, .8 72%, .9 82%, .96 90%, .99 96%, 1) .3s both}.theatre-top.is-playing .opening-right{animation:drape-right 1.8s linear(0, .8 72%, .9 82%, .96 90%, .99 96%, 1) .3s both}.theatre-top.is-playing .theatre-set{animation:stage-lights 1.2s ease-out 1.5s both}.theatre-top.is-playing .theatre-identity img{animation:opening-logo-arrive 3s cubic-bezier(.25,.65,.3,1) 1.8s both,logo-soft-light 1.2s ease-out 4.7s forwards}.theatre-top.is-playing .theatre-caption{animation:identity-arrive .8s ease-out 4.7s both}.opening-skip,.opening-replay{position:absolute;z-index:4;background:#150c1080;color:#f3e8db;border:1px solid #bda99a70;padding:10px 14px;font-size:10px;cursor:pointer;bottom:20px}.opening-skip{right:6%}.opening-replay{left:6%;background:transparent;border:0;padding-left:0}.opening-skip[hidden]{display:none}@keyframes drape-left{from{transform:translateX(0)}to{transform:translateX(-102%)}}@keyframes drape-right{from{transform:translateX(0)}to{transform:translateX(102%)}}@keyframes stage-lights{from{filter:brightness(.12)}to{filter:brightness(.94)}}@keyframes identity-arrive{from{opacity:0}to{opacity:1}}@keyframes opening-failsafe{to{visibility:hidden}}@media(max-width:700px){.theatre-top{min-height:480px;height:calc(87svh - var(--site-header-height,88px));max-height:800px}.theatre-set{background-size:auto 100%;background-position:center}.theatre-identity{width:94%;top:41%}.theatre-caption{left:6%;right:6%;bottom:12%;display:block}.theatre-caption p{font-size:17px;letter-spacing:.08em}.theatre-caption small{font-size:10px;line-height:1.8;letter-spacing:.04em;margin-top:10px}.theatre-caption a{display:inline-block;font-size:10px;margin-top:18px}.opening-skip,.opening-replay{bottom:16px}}@media(prefers-reduced-motion:reduce){.theatre-top *{animation:none!important}.opening-drapes{display:none!important}.theatre-pending .theatre-identity,.theatre-pending .theatre-caption{opacity:1}}

.theatre-identity{isolation:isolate}.theatre-identity:before{content:'';position:absolute;z-index:-1;inset:-22% -12%;pointer-events:none;background:radial-gradient(ellipse,rgba(255,239,208,.42),rgba(255,236,195,.15) 44%,transparent 72%);opacity:.8}.theatre-identity img{filter:brightness(2) saturate(.86)}.theatre-top.is-playing .theatre-identity:before{animation:logo-halo 1.2s ease-out 4.7s both}@keyframes opening-logo-arrive{0%{opacity:0;transform:translate3d(0,12px,0) scale(.7936508);filter:blur(9px)}35%{opacity:.35}100%{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}}@keyframes logo-soft-light{from{filter:brightness(1) saturate(1) blur(0)}to{filter:brightness(2) saturate(.86) blur(0)}}@keyframes logo-halo{from{opacity:0}to{opacity:.8}}@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .theatre-identity img,.theatre-top.is-playing .theatre-identity:before{animation:none!important;opacity:1;transform:none}}

/* A broad warm stage wash, without visible beam edges. */
.theatre-identity:before{display:none!important}.theatre-set{filter:brightness(1.12) sepia(.12) saturate(1.04)}.theatre-top.is-playing .theatre-set{animation:stage-warm-wash 1.5s ease-out 4.7s both}.stage-lighting{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.38;mix-blend-mode:screen;background:linear-gradient(180deg,rgba(255,231,193,.16),rgba(255,224,178,.22) 55%,rgba(255,226,187,.06));}.theatre-top.is-playing .stage-lighting{animation:stage-wash-arrive 1.5s ease-out 4.7s both}@keyframes stage-warm-wash{from{filter:brightness(.32) sepia(0) saturate(1)}to{filter:brightness(1.12) sepia(.12) saturate(1.04)}}@keyframes stage-wash-arrive{from{opacity:0}to{opacity:.38}}@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .theatre-set,.theatre-top.is-playing .stage-lighting{animation:none!important}.stage-lighting{opacity:.38}}

/* Keep the overhead fixtures in frame, including on wide desktop screens. */
.theatre-top .theatre-set{background-position:center top}

.theatre-top .theatre-identity{top:48%}@media(max-width:700px){.theatre-top .theatre-identity{top:47%}}

.stage-projection{position:absolute;left:var(--projection-left,12%);top:var(--projection-top,6%);width:var(--projection-width,76%);height:var(--projection-height,54%);z-index:-1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;padding:8px;box-sizing:border-box;overflow:hidden;pointer-events:none;opacity:.42;mix-blend-mode:multiply;filter:saturate(1.05) brightness(1.05);-webkit-mask-image:linear-gradient(0deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(0deg,transparent,#000 3%,#000 97%,transparent)}.stage-projection img{width:100%;height:100%;min-height:0;min-width:0;object-fit:contain;display:block}.theatre-top.is-playing .stage-projection{animation:projection-on .85s ease-out 1.65s both}@keyframes projection-on{from{opacity:0}to{opacity:.42}}@media(max-width:700px){.stage-projection{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:5px;padding:4px;opacity:.36}@keyframes projection-on{from{opacity:0}to{opacity:.36}}}@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .stage-projection{animation:none!important}}

/* Colour returns to the projected posters soon after the curtain opens. */
.stage-projection img{filter:grayscale(0)}.theatre-top.is-playing .stage-projection img{animation:poster-colour-return .55s ease-in-out .75s both}@keyframes poster-colour-return{from{filter:grayscale(1) contrast(1.35) brightness(.72)}to{filter:grayscale(0) contrast(1) brightness(1)}}@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .stage-projection img{animation:none!important;filter:grayscale(0)}}

/* Keep identical compositing and geometry after the animation class is removed. */
.theatre-identity img{transform:translate3d(0,0,0) scale(1);backface-visibility:hidden}

/* Fit the entire theatre, including the audience, at every viewport ratio. */
.theatre-top .theatre-set{background-size:contain;background-position:center top}
.theatre-top .theatre-identity{width:min(calc(var(--scene-width,100vw) * .76),1100px);top:calc(var(--scene-height,100svh) * .48)}
@media(max-width:700px){.theatre-top .theatre-identity{width:calc(var(--scene-width,100vw) * .94);top:calc(var(--scene-height,100svh) * .47)}}

/* Hand the stage over to the works: crossfade, never drop the logo. */
.theatre-top .theatre-identity{opacity:0;pointer-events:none}
.theatre-pending .theatre-top .theatre-identity{opacity:1}
.theatre-top.is-playing .theatre-identity{animation:front-logo-dissolve 1.15s ease-in-out 4.7s both}
@keyframes front-logo-dissolve{from{opacity:1}to{opacity:0}}
.floor-identity{position:absolute;left:50%;top:calc(var(--scene-height,100svh) * .75);width:calc(var(--scene-width,100vw) * .65);transform:translate(-50%,-50%) perspective(1100px) rotateX(58deg);transform-origin:center;opacity:.72;mix-blend-mode:multiply;pointer-events:none;z-index:0}
.floor-identity img{display:block;width:100%;height:auto;filter:brightness(1.12);backface-visibility:hidden}
.theatre-pending .floor-identity{opacity:0}
.theatre-top.is-playing .floor-identity{animation:floor-logo-light 1.5s ease-in-out 4.7s both}
@keyframes floor-logo-light{from{opacity:0}to{opacity:.72}}
.theatre-top .stage-projection{opacity:.78;filter:saturate(1.08) brightness(1.08)}
.theatre-top.is-playing .stage-projection{animation:works-emerge 6.1s linear 1.65s both}
@keyframes works-emerge{0%{opacity:0}14%{opacity:.42}78.6%{opacity:.42}100%{opacity:.78}}
@media(max-width:700px){.floor-identity{width:calc(var(--scene-width,100vw) * .78);transform:translate(-50%,-50%) perspective(750px) rotateX(55deg)}}
@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .theatre-identity{animation:none!important;opacity:0}.theatre-top.is-playing .floor-identity{animation:none!important;opacity:.72}.theatre-top.is-playing .stage-projection{animation:none!important;opacity:.78}}

/* Keep the projection comfortably inside the stage floor. */
.floor-identity{top:calc(var(--scene-height,100svh) * .685);width:calc(var(--scene-width,100vw) * .58)}
@media(max-width:700px){.floor-identity{width:calc(var(--scene-width,100vw) * .7)}}

/* Four-corner projection shares the photographed floor perspective. */
.theatre-top .floor-identity{left:0;top:0;width:1000px;height:333.333333px;transform-origin:0 0;transform:none}.floor-identity img{width:100%;height:100%;object-fit:contain}

/* Introduce the brand, then leave the stage to the works. */
.theatre-top .theatre-identity{left:0;top:0;width:1000px;height:333.333333px;transform-origin:0 0;transform:var(--logo-front);opacity:0;mix-blend-mode:normal;pointer-events:none}
.theatre-top .theatre-identity h1{margin:0;width:100%;height:100%;line-height:0}
.theatre-top .theatre-identity img{width:100%;height:100%;object-fit:contain}
.theatre-pending .theatre-top .theatre-identity{opacity:1}
.theatre-top.is-playing .theatre-identity{animation:opening-brand-fade 1.5s ease-in-out 4.7s both}
@keyframes opening-brand-fade{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.theatre-top.is-playing .theatre-identity{animation:none!important;opacity:0}}

/* Extend the velvet drapes across the side areas of wider viewports. */
.theatre-top{background-color:#210f16;background-image:linear-gradient(90deg,#09060955,transparent 18%,transparent 82%,#09060955),url("assets/bordeaux-velvet-curtain.webp");background-position:center;background-size:100% 100%;background-repeat:no-repeat}

/* The moving curtains remain gathered at the same sides after opening. */
.theatre-top.is-playing .opening-drapes{animation:none}
@keyframes drape-left{from{transform:translateX(0)}to{transform:translateX(calc(-100% + var(--curtain-side-width,0px)))}}
@keyframes drape-right{from{transform:translateX(0)}to{transform:translateX(calc(100% - var(--curtain-side-width,0px)))}}

/* Keep captions inside the clear opening between the gathered curtains. */
.theatre-top .theatre-caption{left:calc((100% - var(--scene-width,100%)) / 2 + var(--scene-width,100%) * .06);right:calc((100% - var(--scene-width,100%)) / 2 + var(--scene-width,100%) * .06);z-index:2}
.theatre-top .opening-replay{left:calc((100% - var(--scene-width,100%)) / 2 + var(--scene-width,100%) * .06)}
.theatre-top .opening-skip{right:calc((100% - var(--scene-width,100%)) / 2 + var(--scene-width,100%) * .06)}

/* The black master wordmark appears white over the dark opening stage. */
.theatre-top .theatre-identity img{filter:brightness(0) invert(1)!important}

/* On phones, reserve only the stage aspect ratio and a compact caption area. */
@media(max-width:700px){.theatre-top{height:calc(100vw * .5628 + 230px);min-height:0;max-height:none;background:#130f10}.theatre-top .theatre-caption{bottom:74px}.theatre-top .opening-replay{bottom:22px}.theatre-top .opening-skip{bottom:22px}}

@media(max-width:700px){.theatre-top{height:calc(56.28vw + 230px);min-height:0;max-height:none;background:#130f10}.theatre-top .theatre-set{inset:0 0 auto;height:56.28vw;background-size:100% 100%}.theatre-top .stage-projection{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;padding:2px}.theatre-top .opening-drapes{bottom:auto;height:56.28vw}.theatre-top .theatre-caption{bottom:74px}.theatre-top .opening-replay{bottom:22px}}

/* A restrained moving wash keeps the open stage alive without shifting the artwork. */
.theatre-top .theatre-set::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 29%,rgb(255 237 194 / 10%) 39%,rgb(255 237 194 / 34%) 46%,rgb(255 245 218 / 46%) 50%,rgb(255 237 194 / 30%) 54%,rgb(255 237 194 / 8%) 61%,transparent 71%);background-size:230% 100%;mix-blend-mode:screen;animation:stage-living-light 12s ease-in-out infinite alternate}
@keyframes stage-living-light{from{background-position:100% 0;opacity:.48}to{background-position:0% 0;opacity:.95}}
@media(max-width:700px){.theatre-top{height:calc(56.28vw + 190px)}.theatre-top .theatre-caption{bottom:58px}.theatre-top .theatre-caption a{margin-top:12px;padding:8px 0}.theatre-top .opening-replay{bottom:15px}}
@media(prefers-reduced-motion:reduce){.theatre-top .theatre-set::before{animation:none;opacity:.25}}

/* Give the phone stage more presence and keep the supporting caption compact. */
@media(max-width:700px){.theatre-top{height:calc(74vw + 165px)}.theatre-top .theatre-set{height:74vw;background-size:auto 100%;background-position:center top}.theatre-top .opening-drapes{height:74vw}.theatre-top .theatre-caption{left:6%;right:6%;bottom:48px}.theatre-top .theatre-caption p{font-size:16px;letter-spacing:.04em}.theatre-top .theatre-caption small{margin-top:8px}.theatre-top .theatre-caption a{margin-top:9px;padding:7px 0}.theatre-top .opening-replay{left:6%;bottom:12px}.theatre-top .opening-skip{right:6%;bottom:12px}}

/* Match the phone ABOUT entrance height rather than a landscape image ratio. */
@media(max-width:700px){.theatre-top{height:calc(100svh - 100px);min-height:520px;max-height:none}.theatre-top .theatre-set,.theatre-top .opening-drapes{height:calc(100% - 165px)}.theatre-top .theatre-set{background-size:auto 100%;background-position:center top}.theatre-top .stage-projection{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:6px;padding:3px}.theatre-top .theatre-caption{bottom:48px}}

@media(max-width:700px){.theatre-top .stage-projection{gap:8px;padding:0;mask-image:none;-webkit-mask-image:none}}

@media(max-width:700px){.theatre-top .stage-projection{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:7px}.theatre-top .stage-projection img:nth-child(13){grid-column:2}.theatre-top .stage-projection img:nth-child(14){grid-column:3}.theatre-top .stage-projection img:nth-child(15){grid-column:4}.theatre-top .stage-projection img:nth-child(16){grid-column:5}}

@media(min-width:701px){.theatre-top .stage-projection{grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.theatre-top .stage-projection img:nth-child(n){grid-column:auto}}

/* A deliberate replay may animate even when automatic motion is disabled. */
.theatre-top.motion-requested.is-playing .opening-drapes{display:block!important;animation:none!important;visibility:visible!important}
.theatre-top.motion-requested.is-playing .opening-left{animation:drape-left 1.8s ease-in-out .3s both!important}
.theatre-top.motion-requested.is-playing .opening-right{animation:drape-right 1.8s ease-in-out .3s both!important}
.theatre-top.motion-requested.is-playing .theatre-identity{animation:opening-brand-fade 1.5s ease-in-out 4.7s both!important}
.theatre-top.motion-requested.is-playing .theatre-identity img{animation:opening-logo-arrive 3s ease-out 1.8s both!important}
.theatre-top.motion-requested.is-playing .theatre-caption{animation:identity-arrive .8s ease-out 4.7s both!important}
.theatre-top.motion-requested .theatre-set::before{animation:stage-living-light 12s ease-in-out infinite alternate!important}

/* Both moving beams share a fixed source at the top centre of the stage. */
.theatre-top .theatre-set::before,.theatre-top .theatre-set::after{content:"";position:absolute;inset:auto;top:0;left:33%;width:34%;height:110%;pointer-events:none;transform-origin:50% 0;background:linear-gradient(to bottom,rgb(255 244 214 / 8%) 0%,rgb(255 239 195 / 32%) 28%,rgb(255 239 195 / 25%) 70%,transparent 100%);background-size:100% 100%;clip-path:polygon(50% 0,100% 100%,0 100%);filter:blur(7px);mix-blend-mode:screen;opacity:.85}
.theatre-top .theatre-set::before{animation:stage-fan-left 9s ease-in-out infinite alternate}
.theatre-top .theatre-set::after{animation:stage-fan-right 9s ease-in-out infinite alternate}
@keyframes stage-fan-left{from{transform:rotate(-6deg)}to{transform:rotate(-29deg)}}
@keyframes stage-fan-right{from{transform:rotate(6deg)}to{transform:rotate(29deg)}}
@media(prefers-reduced-motion:reduce){.theatre-top .theatre-set::before{animation:none;transform:rotate(-17deg)}.theatre-top .theatre-set::after{animation:none;transform:rotate(17deg)}}
.theatre-top.motion-requested .theatre-set::before{animation:stage-fan-left 9s ease-in-out infinite alternate!important}
.theatre-top.motion-requested .theatre-set::after{animation:stage-fan-right 9s ease-in-out infinite alternate!important}

/* A soft moving wash starts only after the logo has dissolved. The clip ends before the audience. */
.theatre-top .theatre-set::before,.theatre-top .theatre-set::after{content:none!important;animation:none!important}
.stage-ambient{position:absolute;left:0;top:0;width:100%;height:calc(var(--scene-height, 600px) * .82);overflow:hidden;pointer-events:none;z-index:0;mix-blend-mode:screen;mask-image:linear-gradient(to bottom,#000 0%,#000 80%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 80%,transparent 100%)}
.stage-ambient>span{position:absolute;left:5%;top:0;width:90%;height:120%;transform-origin:50% 0;background:radial-gradient(ellipse at 50% 0%,rgb(255 239 201 / 22%) 0%,rgb(255 239 201 / 15%) 22%,rgb(255 239 201 / 6%) 43%,transparent 65%);filter:blur(15px);animation:soft-stage-sway 11s ease-in-out 6.2s infinite alternate both}
.theatre-top.is-playing .stage-ambient{animation:ambient-appear .35s ease-out 6.2s both}
@keyframes ambient-appear{from{opacity:0}to{opacity:1}}
@keyframes soft-stage-sway{from{transform:rotate(-15deg)}to{transform:rotate(15deg)}}
@media(prefers-reduced-motion:reduce){.stage-ambient{opacity:0}.stage-ambient>span{animation:none}}
.theatre-top.motion-requested.is-playing .stage-ambient{animation:ambient-appear .35s ease-out 6.2s both!important}
.theatre-top.motion-requested .stage-ambient>span{animation:soft-stage-sway 11s ease-in-out 6.2s infinite alternate both!important}

/* The moving pools originate at the four visible overhead fixtures. */
.stage-ambient{left:calc((100% - var(--scene-width,100%))/2);width:var(--scene-width,100%);height:calc(var(--scene-height,600px) * .82)}
.stage-ambient>.fixture-wash{top:1.3%;left:calc(var(--fixture-x) - 15%);width:30%;height:100%;transform-origin:50% 0;background:radial-gradient(ellipse at 50% 0%,rgb(255 239 202 / 42%) 0%,rgb(255 235 191 / 28%) 28%,rgb(255 235 191 / 12%) 55%,transparent 76%);filter:blur(9px);animation:fixture-sweep 8s ease-in-out 6.2s infinite alternate both}
.wash-left{--fixture-x:15%;--angle-start:-30deg;--angle-end:-12deg}
.wash-middle-left{--fixture-x:42.5%;--angle-start:-10deg;--angle-end:8deg}
.wash-middle-right{--fixture-x:57.5%;--angle-start:10deg;--angle-end:-8deg}
.wash-right{--fixture-x:85%;--angle-start:30deg;--angle-end:12deg}
@keyframes fixture-sweep{from{transform:rotate(var(--angle-start))}to{transform:rotate(var(--angle-end))}}
@media(prefers-reduced-motion:reduce){.stage-ambient>.fixture-wash{animation:none;transform:rotate(var(--angle-start))}}
.theatre-top.motion-requested .stage-ambient>.fixture-wash{animation:fixture-sweep 8s ease-in-out 6.2s infinite alternate both!important}

/* Only the two centre top lights sweep; side fixtures keep their photographed illumination. */
.stage-ambient>.fixture-wash{top:5.5%;height:92%;width:30%;left:calc(var(--fixture-x) - 15%);filter:blur(12px)}
.stage-ambient>.wash-middle-left{--fixture-x:42.5%;--angle-start:-14deg;--angle-end:12deg}
.stage-ambient>.wash-middle-right{--fixture-x:57.5%;--angle-start:14deg;--angle-end:-12deg}

/* Restore the previously approved continuous sweep rather than white stationary pools. */
.theatre-top .stage-ambient{display:none}
.theatre-top .theatre-set::before{content:""!important;inset:0;left:0;top:0;width:100%;height:100%;clip-path:none;filter:none;transform:none;transform-origin:center;background:linear-gradient(115deg,transparent 20%,rgb(255 237 194 / 24%) 43%,rgb(255 245 218 / 38%) 50%,rgb(255 237 194 / 18%) 57%,transparent 80%);background-size:230% 100%;mix-blend-mode:screen;animation:stage-living-light 12s ease-in-out infinite alternate!important}
.theatre-top .theatre-set::after{content:""!important;inset:0;width:auto;height:auto;clip-path:none;filter:none;transform:none;mix-blend-mode:normal;opacity:1;background:linear-gradient(0deg,#090708b3,transparent 26%,transparent 85%,#09070833);animation:none!important}
@keyframes stage-living-light{from{background-position:100% 0;opacity:.3}to{background-position:0% 0;opacity:.85}}
@media(prefers-reduced-motion:reduce){.theatre-top .theatre-set::before{animation:none!important;opacity:.25}}
.theatre-top.motion-requested .theatre-set::before{animation:stage-living-light 12s ease-in-out infinite alternate!important}

/* Soft cones remain attached to the two overhead sources; no moving white patches. */
.theatre-top .theatre-set::before,.theatre-top .theatre-set::after{content:none!important;animation:none!important}
.theatre-top .stage-ambient{display:block;left:calc((100% - var(--scene-width,100%))/2);top:0;width:var(--scene-width,100%);height:calc(var(--scene-height,600px) * .80);overflow:hidden;opacity:1;mix-blend-mode:screen;mask-image:linear-gradient(#000 0%,#000 86%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 86%,transparent 100%)}
.theatre-top .stage-ambient>.fixture-wash{top:6%;left:calc(var(--fixture-x) - 50%);width:100%;height:115%;background:conic-gradient(from 165deg at 50% 0%,transparent 0deg,rgb(255 239 204 / 4%) 5deg,rgb(255 239 204 / 17%) 11deg,rgb(255 239 204 / 28%) 15deg,rgb(255 239 204 / 17%) 19deg,rgb(255 239 204 / 4%) 25deg,transparent 30deg,transparent 360deg);background-size:100% 100%;clip-path:none;filter:blur(9px);transform-origin:50% 0;opacity:.9;animation:overhead-gentle-sweep 9s ease-in-out 6.2s infinite alternate both}
.theatre-top .wash-middle-left{--fixture-x:42.5%;--angle-start:-13deg;--angle-end:11deg}
.theatre-top .wash-middle-right{--fixture-x:57.5%;--angle-start:13deg;--angle-end:-11deg}
@keyframes overhead-gentle-sweep{from{transform:rotate(var(--angle-start))}to{transform:rotate(var(--angle-end))}}
.theatre-top.is-playing .stage-ambient{animation:ambient-appear .5s ease-out 6.2s both}
@media(prefers-reduced-motion:reduce){.theatre-top .stage-ambient{opacity:0}.theatre-top .stage-ambient>.fixture-wash{animation:none}}
.theatre-top.motion-requested.is-playing .stage-ambient{animation:ambient-appear .5s ease-out 6.2s both!important}
.theatre-top.motion-requested .stage-ambient>.fixture-wash{animation:overhead-gentle-sweep 9s ease-in-out 6.2s infinite alternate both!important}

/* Longer light-on ramp, broader sweep and a modest contrast lift. */
.theatre-top .stage-ambient>.fixture-wash{background:conic-gradient(from 165deg at 50% 0%,transparent 0deg,rgb(255 239 204 / 6%) 5deg,rgb(255 239 204 / 23%) 11deg,rgb(255 239 204 / 37%) 15deg,rgb(255 239 204 / 23%) 19deg,rgb(255 239 204 / 6%) 25deg,transparent 30deg,transparent 360deg);animation-duration:7.5s}
.theatre-top .wash-middle-left{--angle-start:-22deg;--angle-end:19deg}
.theatre-top .wash-middle-right{--angle-start:22deg;--angle-end:-19deg}
.theatre-top.is-playing .stage-ambient{animation:ambient-appear 1.8s cubic-bezier(.45,0,.3,1) 6.2s both}
.theatre-top.motion-requested.is-playing .stage-ambient{animation:ambient-appear 1.8s cubic-bezier(.45,0,.3,1) 6.2s both!important}
.theatre-top.motion-requested .stage-ambient>.fixture-wash{animation-duration:7.5s!important}

/* Keep the larger sixteen-poster composition on desktop; retain eighteen on phones. */
@media(min-width:701px){.theatre-top .stage-projection{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.theatre-top .stage-projection>img:nth-child(n+17){display:none}}

/* Phone background is cropped horizontally; use its actual fixture coordinates. */
@media(max-width:700px){.theatre-top .wash-middle-left{--fixture-x:var(--mobile-light-left,32.5%)}.theatre-top .wash-middle-right{--fixture-x:var(--mobile-light-right,67.5%)}.theatre-top .stage-ambient>.fixture-wash{top:var(--mobile-light-top,6%)}}

/* Show the closed curtains while the automatically played opening prepares. */
.theatre-pending .theatre-top .opening-drapes{display:block!important;visibility:visible!important}.theatre-top.motion-requested.is-playing .opening-left{animation:drape-left 1.8s linear(0,.8 72%,.9 82%,.96 90%,.99 96%,1) .3s both!important}.theatre-top.motion-requested.is-playing .opening-right{animation:drape-right 1.8s linear(0,.8 72%,.9 82%,.96 90%,.99 96%,1) .3s both!important}
