/* Screen blending is isolated to this dark inset, never the white page or robot. */
body #work-progress .work-energy.thinking-media {
  height:auto!important;min-height:0;margin:10px 20px!important;
  border:0;mask-image:none;perspective:none;overflow:visible;
  display:flex;justify-content:center;contain:layout paint;
}
#work-progress .work-energy.thinking-media > :not(.thinking-media-stage){display:none!important}
.thinking-media-stage {
  position:relative;isolation:isolate;width:min(100%,220px);aspect-ratio:1;
  flex:0 1 220px;overflow:hidden;border-radius:20px;
  background:#020715;
  border:1px solid rgba(141,187,255,.36);
  box-shadow:0 8px 24px rgba(27,58,138,.16),inset 0 1px rgba(214,236,255,.2);
}
.thinking-media-stage::after {
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  box-shadow:inset 0 0 18px rgba(47,96,170,.2);
}
.thinking-media-stage :is(.thinking-anim,.thinking-media-poster) {
  position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;
  mix-blend-mode:screen;filter:drop-shadow(0 0 12px rgba(91,140,255,.4));
  pointer-events:none;
}
.thinking-media-stage .thinking-anim{opacity:0}
.thinking-media-stage .thinking-media-poster{opacity:1}
.thinking-media-stage[data-playback="playing"] .thinking-anim{opacity:1}
.thinking-media-stage[data-playback="playing"] .thinking-media-poster{opacity:0}
#thinking-preview-controls {
  position:fixed;z-index:90;bottom:16px;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:10px;max-width:calc(100% - 24px);
  padding:10px 14px;border:1px solid #fff;border-radius:16px;
  background:rgba(244,250,255,.96);color:#1B3A8A;
  box-shadow:0 8px 24px rgba(40,80,160,.16);font:700 12px system-ui;
}
#thinking-preview-controls button{
  color:#1B3A8A;white-space:nowrap;border:1px solid #fff;border-radius:10px;
  background:linear-gradient(145deg,#fff,#e6f0ff);padding:8px 12px;
  box-shadow:0 4px 12px rgba(40,80,160,.13);
}
#thinking-preview-controls [role="status"]{font-size:10px;font-weight:500;white-space:nowrap}
@media(max-width:760px){
  body #work-progress.thinking-media-enabled,
  body.workspace-ready #work-progress.thinking-media-enabled:not(.alarm-docked){
    bottom:var(--thinking-mobile-bottom,258px)!important;
  }
  body #work-progress .work-energy.thinking-media{margin:6px 16px!important}
  .thinking-media-stage{width:124px;flex-basis:124px;border-radius:16px}
  #thinking-preview-controls{flex-wrap:wrap;justify-content:center;gap:6px;width:max-content}
  #thinking-preview-controls [role="status"]{flex-basis:100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .thinking-media-stage .thinking-anim{opacity:0!important}
  .thinking-media-stage .thinking-media-poster{opacity:1!important}
}
