/* The creator-platform atmosphere is decorative and stays inside the stage. */
.hero-stage .social-dust{display:block;position:absolute;inset:0;z-index:0;overflow:hidden;contain:paint;pointer-events:none;user-select:none}
.hero-stage .social-dust>.social-chip{position:absolute;display:inline-flex;align-items:center;justify-content:center;left:var(--x);top:var(--y);bottom:auto;width:var(--size);height:var(--size);max-width:calc(100% - 24px);color:var(--tone,#e7caff);font-size:var(--size);opacity:0;transform-origin:center;filter:drop-shadow(0 0 9px #c781dd18);animation:creator-atmosphere var(--duration,24s) linear infinite;animation-delay:var(--delay,-8s);will-change:transform,opacity}
.hero-stage .social-dust .ui-icon{display:block;width:1em;height:1em;max-width:none;flex-shrink:0;stroke-width:1.35}
.hero-stage .social-dust>.social-chip.social-pill{width:auto;height:auto;gap:7px;padding:9px 13px;border:1px solid currentColor;border-radius:999px;background:#ee86bd10;box-shadow:inset 0 1px 0 #ffffff12;font-family:Manrope,Arial,sans-serif;font-size:9px;font-weight:800;letter-spacing:1.1px;white-space:nowrap}
.hero-stage .social-dust>.social-pill .ui-icon{width:17px;height:17px}
.hero-stage .social-dust>.social-pill.social-subscribe{background:#ff5a8220;color:#ffc2cb}
@keyframes creator-atmosphere{
  0%{transform:translate3d(0,150px,0) rotate(var(--tilt,-12deg));opacity:0}
  14%{opacity:var(--alpha,.26)}
  50%{transform:translate3d(var(--drift,16px),-35px,0) rotate(calc(var(--tilt,-12deg) + 12deg));opacity:var(--alpha,.26)}
  84%{opacity:var(--alpha,.26)}
  100%{transform:translate3d(0,-235px,0) rotate(calc(var(--tilt,-12deg) + 25deg));opacity:0}
}
@media(max-width:700px){
  .hero-stage .social-dust>.social-chip:nth-child(n){display:inline-flex;font-size:clamp(20px,calc(var(--size) * .7),32px);width:clamp(20px,calc(var(--size) * .7),32px);height:clamp(20px,calc(var(--size) * .7),32px);animation-duration:calc(var(--duration,24s) * 1.15);left:var(--mobile-x,var(--x));top:var(--mobile-y,var(--y))}
  .hero-stage .social-dust>.social-chip:nth-child(n+9){display:none}
  .hero-stage .social-dust>.social-chip.social-pill{width:auto;height:auto;padding:6px 9px;gap:5px;font-size:7px;letter-spacing:.7px}
  .hero-stage .social-dust>.social-pill .ui-icon{width:13px;height:13px}
}
@media(prefers-reduced-motion:reduce){.hero-stage .social-dust{display:none!important}.hero-stage .social-dust>.social-chip{animation:none!important}}
