/* Keep the moving artwork safely inside the stationary portrait frame. */
.simple-profile[data-pose="portrait"] .sp-portrait-window{
  isolation:isolate;inset:2.5% 3.5% -2%;overflow:visible;
}
.simple-profile[data-pose="portrait"] .sp-portrait-window .sp-hero{
  z-index:1;overflow:visible;
  filter:drop-shadow(-5px 4px 11px #7957e83d) drop-shadow(5px 7px 13px #35bfe32b) drop-shadow(0 10px 12px #03040b99);
}
.simple-profile[data-character="elevenlabs"][data-pose="portrait"] .sp-portrait-window .sp-hero{
  filter:none;
}
/* This source includes a backdrop: blend its sides into the stationary frame. */
.simple-profile[data-character="elevenlabs"][data-pose="portrait"] .sp-portrait-window{
  mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent);
}
.simple-profile[data-pose="portrait"] .sp-art-glow{
  background:radial-gradient(ellipse at 31% 35%,#8c63ec42,transparent 53%),radial-gradient(ellipse at 76% 50%,#38b9e92b,transparent 53%),radial-gradient(ellipse at 50% 77%,#d35d9a19,transparent 55%);
}
.simple-profile[data-pose="portrait"] .sp-portrait-window::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(ellipse at 25% 20%,#c9a7ff1c,transparent 48%),radial-gradient(ellipse at 80% 30%,#80e9ff14,transparent 42%);
  mix-blend-mode:screen;mask-image:radial-gradient(ellipse,#000 35%,transparent 75%);
}
.simple-profile[data-pose="portrait"] .sp-depth-plane{
  position:absolute;inset:0;width:100%;height:100%;z-index:2;
  pointer-events:none;overflow:visible;transform-origin:50% 70%;
  backface-visibility:hidden;
}
.simple-profile[data-pose-loading="true"] .sp-depth-plane{visibility:hidden}
.sp-depth-shirt{--breath-y:-1.5px;--breath-scale:1.003;--breath-z:1px;--parallax:.25}
.sp-depth-straps{--breath-y:-1.1px;--breath-scale:1.002;--breath-z:2px;--parallax:.45}
.sp-depth-neck{--breath-y:-.55px;--breath-scale:1.001;--breath-z:1px;--parallax:.3}
.sp-depth-face{--breath-y:-.35px;--breath-scale:1;--breath-z:1px;--parallax:.3}
.sp-depth-headphones{--breath-y:-1.15px;--breath-scale:1.001;--breath-z:2px;--parallax:.65}
.sp-depth-hair{--breath-y:-.75px;--breath-scale:1;--breath-z:2px;--parallax:.8}
.sp-depth-torso{--breath-y:-1.2px;--breath-scale:1.002;--breath-z:1px;--parallax:.2}
.sp-depth-head{--breath-y:-.5px;--breath-scale:1;--breath-z:1px;--parallax:.25}
.sp-depth-crown{--breath-y:-.7px;--breath-scale:1;--breath-z:1px;--parallax:.35}
.sp-depth-hair,.sp-depth-headphones,.sp-depth-straps,.sp-depth-crown{filter:brightness(1.025) drop-shadow(0 2px 3px #08051030)}
.simple-profile[data-character="minimax"][data-pose="portrait"] .sp-depth-plane image{transform-box:fill-box;transform-origin:center bottom;transform:scale(.9)}
@media(prefers-reduced-motion:no-preference){
  .simple-profile[data-pose="portrait"] .sp-portrait-window{
    transform:perspective(950px) rotateX(var(--portrait-tilt-x,0deg)) rotateY(var(--portrait-tilt-y,0deg));
    transform-origin:50% 52%;
  }
  .simple-profile[data-pose="portrait"] .sp-depth-plane{
    transform:translate3d(calc(var(--portrait-shift-x,0px)*var(--parallax)),calc(var(--portrait-shift-y,0px)*var(--parallax)),0);
  }
  .simple-profile[data-portrait-motion="on"] .sp-depth-plane{animation:sp-portrait-breathe 4.8s ease-in-out infinite}
  /* The battle pauses independently while its profile remains animated. */
  html.motion-paused .simple-profile[data-portrait-motion="on"] .sp-depth-plane{animation-play-state:running!important}
  html.motion-hidden .simple-profile[data-portrait-motion="on"] .sp-depth-plane{animation-play-state:paused!important}
  @keyframes sp-portrait-breathe{
    0%,100%{transform:perspective(1000px) translate3d(calc(var(--portrait-shift-x,0px)*var(--parallax)),calc(var(--portrait-shift-y,0px)*var(--parallax)),0) scaleY(1)}
    50%{transform:perspective(1000px) translate3d(calc(var(--portrait-shift-x,0px)*var(--parallax)),calc(var(--portrait-shift-y,0px)*var(--parallax) + var(--breath-y)),var(--breath-z)) scaleY(var(--breath-scale))}
  }
}
@media(max-width:700px){
  .simple-profile[data-pose="portrait"] .sp-portrait-window{inset:2% 2% -2%}
  .simple-profile[data-pose="portrait"] .sp-portrait-window .sp-hero{filter:drop-shadow(0 3px 5px #10102f88)}
  .simple-profile[data-character="elevenlabs"][data-pose="portrait"] .sp-portrait-window .sp-hero{filter:none}
  .sp-depth-plane{--breath-z:0px;--breath-y:-.35px;--breath-scale:1.001}
}