/* Name colours belong to the separately equipped palette. Effects add decoration only. */
:is(.name-effect-aurora,.name-effect-chrome,.name-effect-embers,.name-effect-frostline,.name-effect-inkflow,.name-effect-carbon,.name-effect-laser,.name-effect-starlight,.name-effect-circuit,.name-effect-velvet){position:relative;isolation:isolate;padding:5px 9px;text-shadow:none!important}
:is(.name-effect-aurora,.name-effect-chrome,.name-effect-embers,.name-effect-frostline,.name-effect-inkflow,.name-effect-carbon,.name-effect-laser,.name-effect-starlight,.name-effect-circuit,.name-effect-velvet)::before,:is(.name-effect-aurora,.name-effect-chrome,.name-effect-embers,.name-effect-frostline,.name-effect-inkflow,.name-effect-carbon,.name-effect-laser,.name-effect-starlight,.name-effect-circuit,.name-effect-velvet)::after{content:'';position:absolute;pointer-events:none;z-index:1}
/* Orbiting leaves replace the former Aurora fill, avoiding Prism Flow duplication. */
.name-effect-aurora::before,.name-effect-aurora::after{width:7px;height:4px;border-radius:7px 0 7px 0;background:var(--name-color-two);top:3px;left:3px;animation:fx-leaf 4s ease-in-out infinite}
.name-effect-aurora::after{top:auto;left:auto;bottom:3px;right:3px;animation-delay:-2s}
.name-effect-chrome::before,.name-effect-chrome::after{inset:2px 4px auto;height:1px;background:linear-gradient(90deg,transparent,var(--name-color-two),#fff,var(--name-color-two),transparent)}
.name-effect-chrome::after{inset:auto 4px 2px}
.name-effect-embers::after{inset:0;background:radial-gradient(circle at 12% 85%,#ffcf75 0 1.3px,transparent 2px),radial-gradient(circle at 45% 85%,#e78a45 0 1.3px,transparent 2px),radial-gradient(circle at 78% 90%,#ffdc97 0 1.3px,transparent 2px);animation:fx-embers 2.6s ease-out infinite}
.name-effect-frostline::before,.name-effect-frostline::after{width:5px;height:10px;border:1px solid var(--name-color-two);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);top:calc(50% - 5px);left:1px;animation:fx-ice 4s ease-in-out infinite}
.name-effect-frostline::after{left:auto;right:1px;animation-delay:-2s}
.name-effect-inkflow::before,.name-effect-inkflow::after{width:4px;height:5px;border-radius:40% 40% 60% 60%;background:var(--name-color-two);left:18%;top:1px;animation:fx-ink 3.8s ease-in-out infinite}
.name-effect-inkflow::after{left:78%;animation-delay:-1.9s}
.name-effect-carbon::before{inset:0;border:1px dashed color-mix(in srgb,var(--name-color-two) 65%,transparent);border-radius:1px;opacity:.7}
.name-effect-laser::before,.name-effect-laser::after{width:16px;height:2px;background:var(--name-color-two);top:1px;left:0;animation:fx-rails 3.8s ease-in-out infinite alternate}
.name-effect-laser::after{top:auto;bottom:1px;animation-direction:alternate-reverse}
.name-effect-starlight{padding:10px 12px!important}
.name-effect-starlight::before,.name-effect-starlight::after{left:2px;right:2px;height:9px;background-image:url("name-starlight.svg?v=1");background-size:100% 9px;background-repeat:no-repeat;animation:fx-stars 3.4s ease-in-out infinite}
.name-effect-starlight::before{top:0}.name-effect-starlight::after{bottom:0;transform:scaleX(-1);animation-delay:-1.7s}
.name-effect-circuit::after{inset:auto 8px 0;height:3px;background:repeating-linear-gradient(90deg,var(--name-color-two) 0 5px,transparent 5px 9px);background-size:18px 100%;animation:fx-circuit 1.4s linear infinite}
.name-effect-velvet::before,.name-effect-velvet::after{width:4px;height:12px;top:calc(50% - 6px);left:0;background:var(--name-color-two);clip-path:polygon(0 0,100% 30%,100% 70%,0 100%)}
.name-effect-velvet::after{left:auto;right:0;transform:scaleX(-1)}
@keyframes fx-leaf{0%,100%{transform:translateX(0) rotate(-25deg);opacity:.45}50%{transform:translateX(14px) rotate(25deg);opacity:1}}
@keyframes fx-embers{0%{opacity:0;transform:translateY(4px)}25%{opacity:.9}100%{opacity:0;transform:translateY(-7px)}}
@keyframes fx-ice{0%,100%{transform:scale(.7);opacity:.45}50%{transform:scale(1);opacity:1}}
@keyframes fx-ink{0%,100%{height:3px;transform:translateY(0);opacity:.5}50%{height:6px;transform:translateY(2px);opacity:.9}}
@keyframes fx-rails{from{left:0}to{left:calc(100% - 16px)}}
@keyframes fx-stars{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes fx-circuit{to{background-position:18px 0}}
.leaderboard-section tr:is(.rank-1,.rank-2,.rank-3) .leader-name[class*="name-effect-"]{filter:none}
@media(prefers-reduced-motion:reduce){[class*="name-effect-"]{animation:none!important}[class*="name-effect-"]::before,[class*="name-effect-"]::after{animation:none!important}.name-effect-embers::after{opacity:0}}

/* Prism animates the purchased palette, including multi-colour gradients. */
.name-effect-prism{background-image:var(--name-gradient,linear-gradient(90deg,var(--name-color-one),var(--name-color-two)))!important}
