/* The selected 4A: a coordinated light show in a deep black room. */
[data-light-motion=moving] .stage-light-right{--from:-9deg;--to:-35deg;animation-delay:0s;animation-duration:12s}
.entrance .stage-lights{opacity:0;transition:opacity .55s ease-out}
.entrance.is-opening .stage-lights{opacity:1}
.entrance:not(.is-opening) .stage-light{animation-play-state:paused}
.rsvp-section .rsvp-needs{max-width:470px;margin-inline:auto;text-wrap:pretty}

.hero .hero-ball{transform:none}
.hero .hero-ball-left,.hero .hero-ball-right{z-index:1}
.hero .hero-ball-back{z-index:0;opacity:.85;filter:drop-shadow(0 0 10px #dce9ff18)}
.hero-ball-back-left{width:250px;left:120px;top:-18px}
.hero-ball-back-right{width:210px;right:110px;top:20px}
.hero .hero-ball-extra{z-index:0;opacity:.9;filter:drop-shadow(0 0 10px #dce9ff20)}
.hero-ball-extra-left{width:175px;left:230px;top:165px}
.hero-ball-extra-right{width:155px;right:220px;top:250px}
.ball-cable{position:absolute;left:calc(50% - .5px);bottom:80%;height:100vh;width:1px;background:linear-gradient(90deg,#79818d,#e6edf5);box-shadow:0 0 3px #eef5ff22}

[data-variant=a] :is(.countdown-section,.celebration,.rsvp-section){background:#030305}
.countdown-section>.reveal,.countdown-section>.countdown-finished{position:relative;z-index:2}
.meteor-shower{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:paint}
.meteor{position:absolute;left:var(--x);top:var(--y);width:var(--length);height:2px;opacity:0;background:linear-gradient(90deg,#fff,#e5eeff99 12%,#c6d9ff33 45%,transparent);border-radius:100%;filter:drop-shadow(0 0 3px #d9e9ff);transform:rotate(-42deg);animation:meteor-fall var(--duration) var(--delay) linear infinite}
.meteor::before{content:"";position:absolute;left:-2px;top:-1px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 7px 2px #e4eeffb0}
@keyframes meteor-fall{
  0%{opacity:0;transform:translate(90px,-80px) rotate(-42deg)}
  8%{opacity:1}
  42%{opacity:.95}
  65%,100%{opacity:0;transform:translate(calc(var(--travel)*-1),var(--travel)) rotate(-42deg)}
}
:is(.rsvp-section,.dance-section,.gifts-section) .silver-sky{color:#fff}
:is(.rsvp-section,.dance-section,.gifts-section) .silver-star{box-shadow:0 0 7px 2px #fff9,0 0 18px #d8e5ff66;animation-name:night-star-shine}
:is(.rsvp-section,.dance-section,.gifts-section) .silver-star-cross{width:calc(var(--size)*1.3);height:calc(var(--size)*1.3);filter:drop-shadow(0 0 5px #fff)}
.dance-section .silver-sky{mask-image:linear-gradient(90deg,#000 0 47%,#0005 57% 86%,#000 97%)}
@keyframes night-star-shine{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.25)}}
body:is(.effects-paused,.effects-idle) .meteor,.silver-effects-offscreen .meteor{animation-play-state:paused}
@media(min-width:1500px){.hero-ball-back-left{left:21%;top:-15px}.hero-ball-back-right{right:17%;top:20px}.hero-ball-extra-left{left:24%}.hero-ball-extra-right{right:25%}}
@media(min-width:761px) and (max-width:1100px){
  .hero-ball-extra-left{width:120px;left:17%;top:360px}
  .hero-ball-extra-right{width:115px;right:18%;top:400px}
}
@media(max-width:760px){
  [data-light-motion=moving] .stage-light-right{--from:-2deg;--to:-22deg}
  .hero-ball-back-left{width:130px;left:40px;top:20px}
  .hero-ball-back-right{width:110px;right:54px;top:96px}
  .hero-ball-extra-left{display:none}
  .hero-ball-extra-right{width:95px;right:-28px;top:40px}
  .dance-section .silver-star:nth-child(n+29){display:none}
  .dance-section .silver-sky{mask-image:linear-gradient(#000 0 45%,#0005 60% 90%,#000)}
  .meteor{width:calc(var(--length)*.7)}
}
@media(max-width:360px){
  .hero .hero-ball-left{width:190px;left:-39px;top:0}
  .hero .hero-ball-right{width:150px;right:-75px;top:108px}
  .hero-ball-back-right{width:100px;right:27px;top:60px}
}
@media(prefers-reduced-motion:reduce){
  .meteor{animation:none!important;opacity:.55;transform:rotate(-42deg)}
  .meteor:nth-child(n+9){display:none}
  :is(.rsvp-section,.dance-section,.gifts-section) .silver-star{opacity:.85}
}
