/* Keep the floor, instruments and their photographic shadows on one plane.
   Click targets use the same percentage coordinates as the scene artwork. */
.stage.grounded-stage{display:block;min-height:0;height:auto;max-height:none;aspect-ratio:auto;padding:0;background:#000}
.grounded-stage::before{display:none}
.stage-scene{position:relative;width:100%;isolation:isolate;line-height:0}
.stage-scene-image{display:block;position:relative;width:100%;height:auto;z-index:0}
.stage-scene .stage-light{z-index:2;background:conic-gradient(from calc(157deg + var(--stage-aim,0deg)) at var(--stage-beam-origin-x,50%) 0%,transparent 0deg,#ffe3b30a 4deg,#ffe3b324 15deg,#fff0d038 23deg,#ffe3b324 31deg,#ffe3b30a 42deg,transparent 46deg);mask-image:linear-gradient(#000 0%,#000 var(--stage-beam-fade-start,72%),transparent var(--stage-beam-fade-end,97%))}
/* Reuse the exact registered photograph, revealing only the microphone under
   its spotlight. No replacement instrument, image edit or rectangular glow. */
.stage-microphone-highlight{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;user-select:none;opacity:var(--stage-performer-light,0);mask-image:radial-gradient(ellipse 8% 30% at 71.6% 61%,#000 0%,#000 80%,transparent 100%);transition:opacity .32s ease}
/* Reveal only the generated brass head and shockmount, not the re-rendered
   surrounding scene. The original piano, curtains, stand and floor stay intact.
   Both layers share the photograph's exact registration and existing lighting. */
.stage-microphone-brass,.stage-microphone-brass-highlight{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none;-webkit-mask-image:radial-gradient(ellipse 3.1% 8.5% at 71.45% 44.2%,#000 0%,#000 85%,transparent 100%);mask-image:radial-gradient(ellipse 3.1% 8.5% at 71.45% 44.2%,#000 0%,#000 85%,transparent 100%)}
.stage-microphone-brass{z-index:1}
.stage-microphone-brass-highlight{z-index:2;opacity:var(--stage-performer-light,0);transition:opacity .32s ease}
.stage-mic-spotlit .stage-scene .stage-light{background:conic-gradient(from 168deg at 71.6% 0%,transparent 0deg,#ffe3b312 3deg,#ffe3b333 8deg,#fff0d052 12deg,#ffe3b333 16deg,#ffe3b312 21deg,transparent 24deg)}
.stage-mic-spotlit .stage-scene::before{background:radial-gradient(ellipse 11% 4% at 71.6% 82%,#fff0c85c 0%,#ffdb9e30 35%,#ffdb9e00 100%)}
/* Floor reflections and the front footlights are baked into the photograph.
   This graduated dimmer reaches opaque black at that footlight row, so they
   truly go dark. The original image and all instrument coordinates stay intact. */
.stage-scene::before,.stage-scene::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}
.stage-scene::before{z-index:2;background:radial-gradient(ellipse 19% 7% at var(--stage-spot-x,50%) var(--stage-spot-y,85%),#fff0c852 0%,#ffdb9e25 35%,#ffdb9e00 100%);opacity:var(--stage-spot-light,1);transition:opacity .55s ease}
.stage-scene::after{background:linear-gradient(180deg,transparent 68%,#0004 74%,#000b 82%,#000 90%);opacity:var(--stage-floor-darkness,0);transition:opacity .55s ease}
.grounded-stage .stage-copy{top:13.5vw;z-index:3;width:min(64%,1000px);padding:0 10px}
.stage-intro{position:relative;padding:20px 20px 30px;background:#000;text-align:center}
.grounded-stage .stage-piano,.grounded-stage .stage-mic{position:absolute;z-index:2;display:block;min-width:44px;min-height:44px;max-width:none;margin:0;padding:0;border:0;border-radius:12px;background:transparent;filter:none;transform:none;cursor:pointer}
.grounded-stage .stage-piano{left:23%;top:45%;right:auto;bottom:auto;width:25%;height:34%}
.grounded-stage .stage-mic{left:67.9%;top:38%;right:auto;bottom:auto;width:7.3%;height:45%}
/* Remove the WebKit tap flash without removing button semantics or keyboard
   focus. visionOS draws its own gaze feedback from these interaction regions. */
.grounded-stage .stage-piano,.grounded-stage .stage-mic{appearance:none;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;box-shadow:none}
.grounded-stage .stage-piano:focus:not(:focus-visible),.grounded-stage .stage-mic:focus:not(:focus-visible){outline:none;background:transparent}
@media(min-width:701px){
  /* Functional hit-region geometry only; the scene photograph is untouched.
     Preserve generous phone targets and an unclipped keyboard focus outline. */
  .grounded-stage .stage-piano:not(:focus-visible){clip-path:polygon(0% 34%,16% 24%,47% 12%,66% 2%,81% 0%,75% 27%,81% 35%,94% 39%,98% 50%,100% 63%,89% 68%,88% 87%,78% 91%,64% 97%,49% 100%,45% 76%,26% 70%,12% 86%,9% 63%,1% 59%)}
  .grounded-stage .stage-mic:not(:focus-visible){clip-path:inset(0 round 50%)}
}
.grounded-stage .stage-piano:focus-visible{outline:2px solid #e8c789;outline-offset:5px;background:#f5d39508}
/* A small keyboard cue replaces the large rectangular mic focus box. The
   photographic microphone and its clear pointer/touch target stay unchanged. */
.grounded-stage .stage-mic:focus-visible{outline:none;background:transparent}
.grounded-stage .stage-mic:focus-visible::after{content:"";position:absolute;top:-12px;left:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:#e8c789;box-shadow:0 0 0 2px #000}
.grounded-stage .stage-piano:disabled{cursor:default}
/* Animate light over the existing photographic scene, never the instruments or
   curtains themselves. Text is outside these filtered layers. */
.stage-ambience-ready .stage-scene-image{filter:brightness(var(--stage-exposure,1));transition:filter .7s ease;animation:stage-warm-up 1.4s ease-out}
.stage-ambience-ready .stage-microphone-brass{filter:brightness(var(--stage-exposure,1));transition:filter .7s ease;animation:stage-warm-up 1.4s ease-out}
.stage-ambience-ready .stage-light{opacity:var(--stage-beam,.85);transform:none;transition:opacity .7s ease;animation:stage-beam-warm-up 1.4s ease-out}
html.voice-lighting-dimmed .masthead nav a{box-shadow:none}
@keyframes stage-warm-up{from{filter:brightness(.7)}to{filter:brightness(var(--stage-exposure,1))}}
@keyframes stage-beam-warm-up{from{opacity:.08}to{opacity:var(--stage-beam,.85)}}
@media(prefers-reduced-motion:reduce){
  .stage-microphone-brass-highlight{transition:none}
  .stage-ambience-ready .stage-microphone-brass{filter:brightness(var(--stage-exposure,1));transition:none;animation:none}
  .stage-microphone-highlight{transition:none}
  .stage-ambience-ready .stage-scene-image{filter:brightness(var(--stage-exposure,1));transition:none;animation:none}
  .stage-ambience-ready .stage-light{opacity:var(--stage-beam,.8);transform:none;transition:none;animation:none}
  .stage-scene::before{opacity:var(--stage-spot-light,1);transition:none}
  .stage-scene::after{opacity:var(--stage-floor-darkness,0);transition:none}
}
@media(max-width:1200px){
  /* Fit the whole stage so no caster, shadow or control is cropped on phones. */
  .grounded-stage .stage-copy{position:relative;top:auto;left:auto;transform:none;width:min(90%,700px);margin:0 auto;padding:42px 12px 30px}
  .grounded-stage .stage-copy h1{font-size:clamp(2.35rem,6.5vw,4rem)}
  .grounded-stage .stage-copy .intro{font-size:1rem}
}
@media(forced-colors:active){
  .stage-microphone-brass,.stage-microphone-brass-highlight{display:none}
  .stage-microphone-highlight{display:none}
  .stage-scene::before,.stage-scene::after,.stage-scene .stage-light{display:none}
  .grounded-stage .stage-piano,.grounded-stage .stage-mic{border:2px solid ButtonText;background:ButtonFace}
  .grounded-stage .stage-piano::after{content:'Piano';font:14px/1.2 sans-serif;color:ButtonText}
  .grounded-stage .stage-mic::after{content:'Mic';font:14px/1.2 sans-serif;color:ButtonText}
}
