/* MX03 / MX05: bounded pointer light and motes around the original mascot, never over working text. */
.native-today .native-mascot-banner { min-height: 188px; }
.native-today .native-banner-copy { max-width: calc(100% - 120px); }
.native-today .native-banner-art { margin-left: auto; margin-right: 20px; }
.native-today .native-wing-arc { display: none; }
.hero-atmosphere { position: absolute; pointer-events: none; overflow: hidden; inset: 0 0 0 auto; width: 52%; z-index: 0; border-radius: inherit; contain: strict; mask-image: linear-gradient(to right, transparent, #000 24%); }
.hero-atmosphere::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 190px 150px at var(--atmosphere-x, 76%) var(--atmosphere-y, 54%), color-mix(in srgb, var(--dept-wash) 70%, transparent), transparent 90%), radial-gradient(ellipse at 100% 20%, color-mix(in srgb, var(--wing-5) 12%, transparent), transparent 72%); }
.hero-atmosphere::after { content: ''; position: absolute; width: 240px; height: 105px; right: -40px; top: 50%; border: 1px solid color-mix(in srgb, var(--dept-accent) 24%, transparent); border-radius: 50%; transform: translateY(-50%) rotate(-28deg); box-shadow: 0 0 0 24px color-mix(in srgb, var(--dept-accent) 3%, transparent), 0 0 0 25px color-mix(in srgb, var(--dept-accent) 9%, transparent), 0 0 0 49px color-mix(in srgb, var(--wing-5) 2%, transparent), 0 0 0 50px color-mix(in srgb, var(--wing-5) 10%, transparent); }
.hero-atmosphere canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; }
.hero-atmosphere[data-state="off"] { display: none; }
.hero-atmosphere[data-state="still"] canvas { display: none; }
.hero-atmosphere[data-state="paused"] canvas { opacity: .55; }
@media (max-width: 699px) {
  .native-today .native-mascot-banner { min-height: 150px; }
  .native-today .native-banner-copy { max-width: calc(100% - 78px); }
  .native-today .native-banner-art { margin-right: 0; }
  .hero-atmosphere { width: 38%; }
  .hero-atmosphere::after { width: 150px; height: 76px; right: -70px; opacity: .65; }
}
@media (forced-colors: active) { .hero-atmosphere { display: none; } }
