/* An emission point, a transfer field, a dark core. These are one scene,
   not a viewport-wide overlay; text and all native controls stay stationary. */
.studio-visual { grid-area:scene; position:relative; min-width:0; width:100%; align-self:center; }
#main .source-agency .studio-hero .studio-scene {
  position:relative; display:block; height:390px; min-height:390px; padding:0;
  overflow:visible; border:0; background:none;
  isolation:isolate; pointer-events:none; perspective:800px; --capture-energy:0;
  --accretion-light:#ff0080; --lens-x:0px; --lens-y:0px;
}
#main .source-agency .studio-scene::before {
  content:''; position:absolute; inset:-10% -12%; z-index:-1; opacity:.22; border:0;
  background:repeating-radial-gradient(ellipse at 69% 50%,transparent 0 26px,#00ffff30 27px 28px,transparent 29px 40px);
  transform:translate(var(--lens-x),var(--lens-y)) rotate(-12deg) scaleY(.62);
  mask-image:radial-gradient(ellipse at 62% 50%,#0003,transparent 66%);
}
#main .source-agency .studio-scene::after {
  content:''; position:absolute; inset:-18% -12%; z-index:-2; opacity:.7; border:0;
  background:radial-gradient(ellipse at 67% 50%,#ff008018,transparent 58%),radial-gradient(ellipse at 25% 43%,#00ffff12,transparent 42%);
  mask-image:radial-gradient(ellipse,#000 22%,transparent 70%);
}
#main .source-agency .studio-emitter {
  position:absolute; left:17%; top:43%; width:128px; height:128px; z-index:4;
  transform:translate(-50%,-50%) rotate(-8deg); overflow:visible;
  filter:drop-shadow(0 0 14px #00ffff28); animation:studio-source-drift 16s ease-in-out infinite;
}
#main .source-agency .studio-scene .dimension-portal {
  position:absolute; left:67%; top:49%; width:246px; height:246px; z-index:3;
  transform:translate(-50%,-50%); flex:none; overflow:visible; border:0; background:none;
}
#main .studio-scene .portal-core { animation:none; transform:none; overflow:visible; }
#main .studio-scene .portal-ring { border:0; box-shadow:none; }
#main .studio-scene .portal-ring-outer {
  width:120%; height:120%; inset:-10%;
  background:conic-gradient(from 0deg,transparent,#ff0080 12%,#ffb46b 24%,transparent 34%,#00ffff80 47%,#bd00ff 58%,transparent 70%,#ff6b00 85%,transparent);
  mask-image:radial-gradient(closest-side,transparent 65%,#000 71%,#000 77%,transparent 83%);
  animation:studio-disc-turn 18s linear infinite;
  filter:drop-shadow(0 0 5px #ff6b0050); opacity:.85;
}
#main .studio-scene .portal-ring-middle {
  width:78%; height:78%; border:1px solid #bda6ff55;
  box-shadow:0 0 14px #bd00ff20,inset 0 0 12px #00ffff15;
  transform:rotate(-12deg) scaleY(.46); animation:studio-orbital-breathe 11s ease-in-out infinite;
}
#main .studio-scene .portal-ring-inner {
  width:43%; height:43%; border:1px solid #ffb56a99;
  box-shadow:0 0 12px #ff873a50,inset 0 0 16px #ff008030; animation:none;
}
#main .studio-scene .portal-event-horizon {
  width:37%; height:37%; z-index:4; animation:none;
  background:radial-gradient(circle,#000 49%,#160b1e 62%,#ffae63 68%,#ff6b0040 72%,transparent 76%);
  box-shadow:0 0 24px #ff6b0025;
}
#main .studio-scene .portal-singularity {
  width:31%; height:31%; z-index:5; animation:none; background:#010103;
  box-shadow:0 0 4px 2px #050508,inset 0 0 9px #ffffff14;
}
#main .studio-scene .vortex-particles { width:105%; height:105%; opacity:.28; animation-duration:12s; }
#main .studio-scene .portal-energy-field {
  inset:-44%; width:auto; height:auto; border-radius:50%; filter:blur(10px); animation:none;
  background:radial-gradient(circle,transparent 16%,var(--accretion-light) 23%,transparent 62%);
  opacity:calc(.12 + var(--capture-energy)*.16); transform:translate(var(--lens-x),var(--lens-y));
}
.portal-corona,.portal-flux {
  position:absolute; inset:5%; border-radius:50%; pointer-events:none;
  background:conic-gradient(from 20deg,transparent 8%,#ffc995bb 19%,#ff008080 28%,transparent 39%,#00ffff65 62%,transparent 79%);
  mask-image:radial-gradient(closest-side,transparent 65%,#0008 69%,#000 71%,transparent 77%);
  transform:rotate(var(--portal-turn,0rad)); opacity:calc(.55 + var(--capture-energy)*.25);
}
.portal-flux {
  inset:-15%; opacity:.45;
  background:conic-gradient(from 170deg,transparent,#00ffff40 13%,transparent 22%,#bd00ff60 57%,transparent 68%,#ff6b0060 83%,transparent);
  mask-image:radial-gradient(closest-side,transparent 71%,#000 72%,transparent 74%);
  transform:rotate(-12deg) scaleY(.46) rotate(var(--portal-turn,0rad));
}
.portal-accretion-disc,.portal-lensing-arc {
  position:absolute; inset:0; border-radius:50%; pointer-events:none;
}
.portal-accretion-disc {
  inset:-7%; border:3px solid transparent; border-top-color:#ffd1a399; border-bottom-color:#ff008088;
  transform:rotate(-12deg) scaleY(.46); filter:drop-shadow(0 0 5px #ff6b0060);
}
.portal-lensing-arc {
  inset:24%; border:2px solid transparent; border-top-color:#ffc99bcc;
  transform:rotate(-18deg); filter:drop-shadow(0 -3px 6px #ff8b5c88); z-index:6;
}
.portal-lensing-arc-back { inset:17% 25% 28%; opacity:.3; transform:rotate(162deg); z-index:1; }
.studio-scene .portal-particle-stream { position:absolute; inset:0; z-index:2; overflow:visible; }
.studio-scene .portal-flying-particle {
  position:absolute; top:0; left:0; border-radius:50%; background:var(--particle-color);
  box-shadow:0 0 7px var(--particle-color); transform-origin:0 50%; will-change:transform,opacity;
}
.studio-scene .portal-flying-particle::before {
  content:''; position:absolute; right:35%; top:20%; width:var(--particle-tail,18px); height:60%;
  background:linear-gradient(90deg,transparent,var(--particle-color)); border-radius:50%; opacity:.55;
}
.studio-scene .portal-flying-particle[hidden] { display:none!important; }
#main .studio-scene .studio-scene-label { position:absolute; left:0; right:0; bottom:14px; font-size:12px; line-height:1.4; white-space:normal; letter-spacing:.07em; text-align:start; }
.studio-scene[data-portal-active="false"] *, .studio-scene[data-portal-active="false"] *::before,
.studio-scene[data-portal-active="false"]::before { animation-play-state:paused!important; }
@keyframes studio-source-drift {
  0%,100% { transform:translate(-50%,-50%) rotate(-8deg); }
  50% { transform:translate(-50%,calc(-50% - 8px)) rotate(6deg); }
}
@keyframes studio-disc-turn {
  from { transform:rotate(-12deg) scaleY(.46) rotate(0deg); }
  to { transform:rotate(-12deg) scaleY(.46) rotate(360deg); }
}
@keyframes studio-orbital-breathe {
  0%,100% { transform:rotate(-12deg) scaleY(.46); opacity:.35; }
  50% { transform:rotate(-12deg) scaleY(.53); opacity:.8; }
}
@media(max-width:900px) {
  #main .source-agency .studio-hero .studio-scene { height:170px; min-height:170px; }
  #main .source-agency .studio-emitter { left:18%; top:44%; width:72px; height:72px; }
  #main .source-agency .studio-scene .dimension-portal { left:68%; top:46%; width:132px; height:132px; }
  #main .studio-scene .studio-scene-label { bottom:10px; font-size:12px; letter-spacing:.035em; }
}
@media(prefers-reduced-motion:reduce) {
  .studio-scene *, .studio-scene *::before { animation:none!important; transition:none!important; }
  .studio-scene .portal-particle-stream { display:none; }
}
@media print { .studio-visual { display:none; } }