/* Isolated motion study; the original site's layout and content are preserved. */
.intro-surface { position: relative; isolation: isolate; overflow: hidden; }
.intro-panel { position: relative; z-index: 1; }
@media screen {
  .intro-surface {
    --intro-text: #faf9fc;
    --ink: var(--intro-text);
    --body: var(--intro-text);
    --muted: var(--intro-text);
    --accent: var(--intro-text);
    --panel-muted: var(--intro-text);
    --on-panel: var(--intro-text);
  }
  .intro-surface .intro-panel h1,
  .intro-surface .portrait-slot,
  .intro-surface .intro-motion-control { color: var(--intro-text); }
}
.brain-stage { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; perspective: 1000px; }
.brain-rotor { width: min(580px, 78vw); opacity: .23; transform-style: preserve-3d; transform-origin: 50% 48%; }
.brain-art { width: 100%; height: auto; user-select: none; -webkit-user-drag: none; }
.motion-control { font: inherit; font-size: .75rem; line-height: 1.4; border: 1px solid var(--lavender); border-radius: 4px; padding: 8px 12px; cursor: pointer; background: var(--page); color: var(--plum); }
.motion-control:hover { border-color: var(--plum); }
.motion-control:focus-visible { outline: 2px solid var(--lavender); outline-offset: 4px; }
.motion-control[hidden] { display: none; }
.intro-motion-control { position: absolute; z-index: 2; right: max(24px, calc((100vw - 1120px) / 2 + 36px)); bottom: 14px; background: transparent; color: var(--parchment); border-color: var(--violet); }
.intro-motion-control:hover { border-color: var(--lavender); }
.awards-motion-page { isolation: isolate; }
.awards-motion-page .site-header, .awards-motion-page .site-footer { position: relative; z-index: 3; }
.awards-motion-page .page-intro { position: relative; padding-right: 160px; }
.awards-motion-control { position: absolute; right: 0; bottom: 50px; }
.balloon-sky { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 2; --gutter: max(44px, calc((100vw - 1120px) / 2)); }
.brain-balloon { position: absolute; top: -180px; width: var(--size); left: calc(var(--gutter) * var(--lane) - var(--size) / 2); opacity: .85; animation: balloon-fall var(--duration) linear infinite; animation-delay: var(--delay); }
.brain-balloon:nth-child(even) { left: auto; right: calc(var(--gutter) * var(--lane) - var(--size) / 2); }
.balloon-sway { animation: balloon-sway var(--sway-duration) ease-in-out infinite alternate; animation-delay: var(--delay); }
.balloon-art { transform: rotate(var(--rotation)); user-select: none; -webkit-user-drag: none; }
.balloon-string { display: block; width: 24%; height: 35px; margin: -3px auto 0; color: #a798b7; opacity: .6; }
.balloon-sky[data-running="false"] *, .balloon-sky[data-running="false"] { animation-play-state: paused; }
.balloon-sky[data-running="false"] .brain-balloon { animation-play-state: paused; }
@keyframes balloon-fall { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, calc(100vh + 360px), 0); } }
@keyframes balloon-sway { from { transform: translate3d(-7px, 0, 0) rotate(-7deg); } to { transform: translate3d(7px, 0, 0) rotate(7deg); } }
@media (max-width: 800px) {
  .brain-rotor { width: min(560px, 96vw); opacity: .18; }
  .brain-balloon { width: 40px; left: -9px; opacity: .7; }
  .brain-balloon:nth-child(even) { right: -9px; }
  .brain-balloon:nth-child(n+5) { display: none; }
  .balloon-string { height: 23px; }
  .awards-motion-page .page-intro { padding-right: 0; }
  .awards-motion-control { position: static; margin-top: 3px; }
}
@media (prefers-reduced-motion: reduce) {
  .balloon-sky:not([data-user-enabled="true"]) { display: none; }
}
@media print { .brain-stage, .balloon-sky, .motion-control { display: none; } }