/* The same candid portrait takes on a different visual story for each audience. */
.emily-stage{
  position:relative;
  isolation:isolate;
  width:100%;
  height:clamp(490px,43vw,620px);
  min-height:0;
  max-width:none;
  aspect-ratio:auto;
  margin:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.emily-stage__backdrop{
  position:absolute;
  inset:5% 13% 1% 2%;
  overflow:hidden;
  border-radius:24px;
  background:#24192d;
  box-shadow:0 30px 60px #26173038;
  z-index:0;
}
.emily-stage__video{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  background:#24192d;
  pointer-events:none;
}
.emily-stage__backdrop::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,#160f1f24,transparent 42%),linear-gradient(0deg,#160f1f80,transparent 44%);
  pointer-events:none;
}
.emily-stage__person,
.mpv-host-photo.emily-stage img,
.mgo-host-photo.emily-stage img,
.mpl-host-photo.emily-stage img{
  position:absolute;
  z-index:4;
  display:block;
  width:185%;
  height:auto;
  min-height:0;
  max-width:none;
  aspect-ratio:auto;
  left:-60%;
  bottom:-1%;
  object-fit:contain;
  filter:drop-shadow(0 17px 19px #25162f46);
  pointer-events:none;
}
.emily-stage__light,
.emily-stage__halo,
.emily-stage__frame,
.emily-stage__trail,
.emily-stage__spark{display:none}

/* Invisible owner: the speaker is visibly in front of the camera frame. */
.emily-stage--visibility .emily-stage__backdrop{
  border:1px solid #8a6b9680;
}
.emily-stage--visibility .emily-stage__frame{
  inset:15% 26% 9% 9%;
  z-index:2;
  border:2px solid #f2ddba;
  border-radius:45% 45% 4px 4px / 32% 32% 4px 4px;
  box-shadow:0 0 0 12px #f8e9d50d,inset 0 0 30px #f9e3b527;
}
.emily-stage--visibility .emily-stage__frame::before,
.emily-stage--visibility .emily-stage__frame::after{
  content:"";
  position:absolute;
  width:24px;
  height:24px;
  border-color:#f7d9a2;
  border-style:solid;
}
.emily-stage--visibility .emily-stage__frame::before{top:12%;left:-13%;border-width:2px 0 0 2px}
.emily-stage--visibility .emily-stage__frame::after{right:-20%;bottom:15%;border-width:0 2px 2px 0}
.emily-stage--visibility .emily-stage__light{
  z-index:1;
  left:-4%;top:11%;width:82%;height:78%;
  border-radius:50%;
  background:radial-gradient(ellipse,#e7bed873 0,#e7bed825 38%,transparent 69%);
  filter:blur(23px);
  animation:emily-visibility-light 10s ease-in-out infinite alternate;
}

/* Overgiving owner: scattered attention gathers at the mic and travels outward. */
.emily-stage--overgiving .emily-stage__backdrop{
  border:1px solid #8a6b9680;
}
.emily-stage--overgiving .emily-stage__light{
  z-index:1;
  left:13%;top:10%;width:65%;height:67%;
  border-radius:50%;
  background:radial-gradient(circle,#f7d7bf61 0,#f7d7bf21 44%,transparent 73%);
  filter:blur(14px);
  animation:emily-overgiving-breathe 10s ease-in-out infinite;
}
.emily-stage--overgiving .emily-stage__trail{
  z-index:3;
  left:38%;top:49%;width:53%;height:2px;
  transform:rotate(-13deg) scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,#f8d7a5,#f8d7a5aa,transparent);
  box-shadow:0 0 13px #f6d5a5;
  animation:emily-overgiving-trail 10s linear infinite;
}
.emily-stage--overgiving .emily-stage__spark{
  z-index:5;
  width:8px;height:8px;
  border-radius:50%;
  background:#ffdfad;
  box-shadow:0 0 8px 3px #ffddb999;
  animation:emily-overgiving-spark 10s ease-in-out infinite;
}
.emily-stage--overgiving .emily-stage__spark--one{--start-x:5%;--start-y:24%;animation-delay:0s}
.emily-stage--overgiving .emily-stage__spark--two{--start-x:24%;--start-y:4%;animation-delay:-.15s}
.emily-stage--overgiving .emily-stage__spark--three{--start-x:11%;--start-y:66%;animation-delay:-.3s}
.mgo-host-copy .mgo-section-cta .mgo-button{animation:emily-overgiving-cta 10s ease-in-out infinite}

/* Hesitant leader: a continuous stage light moves behind a still, assured Emily. */
.emily-stage--leadership .emily-stage__backdrop{
  border:1px solid #8a6b9680;
  box-shadow:0 30px 65px #2b193e4a;
}
.emily-stage--leadership .emily-stage__backdrop::before{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:23%;
  background:linear-gradient(0deg,#24142f,#5f3c6c44 77%,transparent);
}
.emily-stage--leadership .emily-stage__light{
  z-index:1;
  left:13%;top:0;width:77%;height:93%;
  background:conic-gradient(from 198deg at 49% 0%,transparent 0deg,#fce0a95c 24deg,#fce0a911 56deg,transparent 81deg);
  filter:blur(10px);
  -webkit-mask-image:radial-gradient(ellipse,black 35%,transparent 73%);
  mask-image:radial-gradient(ellipse,black 35%,transparent 73%);
  transform-origin:50% 0;
  animation:emily-leadership-spotlight 10s ease-in-out infinite alternate;
}
.emily-stage--leadership .emily-stage__halo{
  z-index:2;
  width:45%;aspect-ratio:1;
  right:4%;top:18%;
  border:1px solid #e8c78b9c;
  border-radius:50%;
  box-shadow:0 0 38px #f2cb986b,inset 0 0 33px #f2cb9848;
  animation:emily-leadership-halo 10s ease-in-out infinite;
}

@keyframes emily-visibility-light{
  0%,100%{opacity:.45;transform:translateX(-5%) scale(.9)}
  50%{opacity:.95;transform:translateX(17%) scale(1.12)}
}
@keyframes emily-overgiving-breathe{
  0%,100%{opacity:.36;transform:scale(.75)}
  40%{opacity:.9;transform:scale(1)}
  75%{opacity:.4;transform:scale(1.15)}
}
@keyframes emily-overgiving-trail{
  0%,30%{opacity:0;transform:rotate(-13deg) scaleX(0)}
  45%{opacity:1;transform:rotate(-13deg) scaleX(.2)}
  75%{opacity:.95;transform:rotate(-13deg) scaleX(1)}
  90%,100%{opacity:0;transform:rotate(-13deg) scaleX(1)}
}
@keyframes emily-overgiving-spark{
  0%{left:var(--start-x);top:var(--start-y);opacity:0;transform:scale(.5)}
  12%{opacity:1}
  34%{left:38%;top:49%;opacity:1;transform:scale(1.2)}
  75%{left:91%;top:38%;opacity:.9;transform:scale(.8)}
  84%,100%{left:101%;top:35%;opacity:0;transform:scale(.4)}
}
@keyframes emily-overgiving-cta{
  0%,65%,100%{box-shadow:0 0 0 0 #e9c99a00}
  76%{box-shadow:0 0 0 7px #e9c99a4d,0 0 27px #e9c99a75}
}
@keyframes emily-leadership-spotlight{
  0%{opacity:.3;transform:rotate(-10deg)}
  45%{opacity:1;transform:rotate(5deg)}
  100%{opacity:.55;transform:rotate(14deg)}
}
@keyframes emily-leadership-halo{
  0%,100%{opacity:.25;transform:scale(.84)}
  48%{opacity:.9;transform:scale(1.08)}
}

@media(max-width:800px){
  .emily-stage{height:clamp(340px,78vw,420px);max-width:600px;margin-inline:auto}
  .emily-stage__person,
  .mpv-host-photo.emily-stage img,
  .mgo-host-photo.emily-stage img,
  .mpl-host-photo.emily-stage img{width:130%;left:-25%}
}
@media(max-width:520px){
  .emily-stage{height:clamp(340px,78vw,380px)}
  .emily-stage__backdrop{inset:4% 9% 1% 1%}
  .emily-stage__person,
  .mpv-host-photo.emily-stage img,
  .mgo-host-photo.emily-stage img,
  .mpl-host-photo.emily-stage img{width:130%;left:-25%;bottom:0}
  .emily-stage--visibility .emily-stage__frame{inset:13% 22% 7% 7%}
  .emily-stage--leadership .emily-stage__halo{right:0}
}
@media(prefers-reduced-motion:reduce){
  .emily-stage__video{visibility:hidden}
  .emily-stage__light,
  .emily-stage__halo,
  .emily-stage__trail,
  .emily-stage__spark,
  .mgo-host-copy .mgo-section-cta .mgo-button{animation:none!important}
  .emily-stage--overgiving .emily-stage__spark{display:none}
  .emily-stage--overgiving .emily-stage__trail{transform:rotate(-13deg) scaleX(1);opacity:.45}
}