/* Shared catalog classes work in the shop, voice cards, profiles and guilds. */
[class*="cosmetic-horizons-"]:not([class*="cosmetic-horizons-name-"]){position:relative;isolation:isolate;background-color:#12101e!important;background-image:linear-gradient(#0d102e20,#0d09253d),var(--horizon-image)!important;background-size:cover!important;background-position:center!important}
.cosmetic-horizons-garden{--horizon-image:url("assets/horizons/garden.webp")}.cosmetic-horizons-coast{--horizon-image:url("assets/horizons/coast.webp")}.cosmetic-horizons-library{--horizon-image:url("assets/horizons/library.webp")}.cosmetic-horizons-aurora{--horizon-image:url("assets/horizons/aurora.webp")}.cosmetic-horizons-neon{--horizon-image:url("assets/horizons/neon.webp")}.cosmetic-horizons-orbit{--horizon-image:url("assets/horizons/orbit.webp")}
.shop-item-visual.cosmetic-horizons-garden{--horizon-image:url("assets/horizons/garden-thumb.webp")}.shop-item-visual.cosmetic-horizons-coast{--horizon-image:url("assets/horizons/coast-thumb.webp")}.shop-item-visual.cosmetic-horizons-library{--horizon-image:url("assets/horizons/library-thumb.webp")}.shop-item-visual.cosmetic-horizons-aurora{--horizon-image:url("assets/horizons/aurora-thumb.webp")}.shop-item-visual.cosmetic-horizons-neon{--horizon-image:url("assets/horizons/neon-thumb.webp")}.shop-item-visual.cosmetic-horizons-orbit{--horizon-image:url("assets/horizons/orbit-thumb.webp")}
:is(.cosmetic-horizons-aurora,.cosmetic-horizons-neon,.cosmetic-horizons-orbit)::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;animation:horizon-light 12s ease-in-out infinite!important;mask-image:radial-gradient(ellipse at center,#000 40%,transparent 72%)}
.cosmetic-horizons-aurora::after{background:conic-gradient(from 210deg at 15% 0%,transparent 15deg,#64ecd996 30deg,transparent 42deg,#ba96fa80 53deg,transparent 69deg),radial-gradient(ellipse at 78% 18%,#c8a5ff77,transparent 48%);transform-origin:top center}
.cosmetic-horizons-neon::after{background:repeating-linear-gradient(0deg,transparent 0 38px,#a6b5ff8a 40px 42px,transparent 45px 90px),linear-gradient(90deg,#4275ff70,transparent 25% 75%,#ed64de70);mask-image:linear-gradient(90deg,#000,transparent 28% 72%,#000);animation-name:horizon-scan!important;animation-duration:9s!important}
.cosmetic-horizons-orbit::after{background:radial-gradient(ellipse at 72% 27%,transparent 28%,#ffe2bd90 28.6%,transparent 29.5%),radial-gradient(circle at 76% 20%,#ffddb9 0 1.5px,transparent 3px),radial-gradient(circle at 18% 70%,#d4b4ff 0 1.5px,transparent 3px),radial-gradient(ellipse at 70% 64%,#a75cc565,transparent 50%);animation-name:horizon-orbit!important;animation-duration:16s!important}
@keyframes horizon-light{0%,100%{opacity:.45;transform:skewX(-5deg) scaleX(.96)}50%{opacity:1;transform:skewX(5deg) scaleX(1.04)}}
@keyframes horizon-scan{0%,100%{opacity:.4;transform:translateY(-14px)}50%{opacity:.9;transform:translateY(14px)}}
@keyframes horizon-orbit{0%,100%{opacity:.5;transform:rotate(-4deg) scale(.96)}50%{opacity:1;transform:rotate(4deg) scale(1.03)}}
[class*="cosmetic-horizons-name-"]{background-image:var(--signature-ink)!important;background-color:transparent!important;background-clip:text!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent;color:var(--signature-color,#eee)!important;background-size:220% 100%!important;text-shadow:0 0 7px var(--signature-glow,transparent)!important;box-shadow:none!important;filter:none!important;isolation:auto}
.cosmetic-horizons-name-jade{--signature-ink:linear-gradient(100deg,#a5efcb,#f3f5d0,#87dcbc);--signature-color:#b5efcf}
.cosmetic-horizons-name-coral{--signature-ink:linear-gradient(120deg,#ffc5b7,#f3dbb7,#faa6cb);--signature-color:#ffc5b7}
.cosmetic-horizons-name-silver{--signature-ink:linear-gradient(100deg,#b0d9f2,#fcfaf4,#b5bcf1);--signature-color:#d2ddf4}
.cosmetic-horizons-name-prism{--signature-ink:linear-gradient(110deg,#84eedd,#cfb0ff,#fff6df,#84eedd);--signature-color:#a2eeeb;--signature-glow:#9addea50;animation:horizon-ink 9s ease-in-out infinite!important}
.cosmetic-horizons-name-velvet{--signature-ink:linear-gradient(110deg,#c6acff,#f6d296,#fbe5ff,#c6acff);--signature-color:#d8b4ee;--signature-glow:#b7a0ee55;animation:horizon-ink 12s ease-in-out infinite!important}
.cosmetic-horizons-name-ember{--signature-ink:linear-gradient(120deg,#ffc67e,#ffddc6,#e5a4b7);--signature-color:#ffd1a0;--signature-glow:#f4b96955;animation:horizon-signature-light 5s ease-in-out infinite!important}
@keyframes horizon-ink{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes horizon-signature-light{0%,100%{opacity:1}50%{opacity:.76}}
body:is(.cosmetics-static,.no-animations:not(.cosmetics-force-motion)) [class*="cosmetic-horizons-"]::after,body:is(.cosmetics-static,.no-animations:not(.cosmetics-force-motion)) [class*="cosmetic-horizons-name-"]{animation:none!important}
@media(prefers-reduced-motion:reduce){body:not(.cosmetics-force-motion) [class*="cosmetic-horizons-"]::after,body:not(.cosmetics-force-motion) [class*="cosmetic-horizons-name-"]{animation:none!important}}
/* The light theme needs ink, not pastel luminance, to keep names readable. */
body[data-theme=light] [class*="cosmetic-horizons-name-"]{--signature-ink:linear-gradient(115deg,#315c64,#624579,#9a5736);--signature-color:#493e65;--signature-glow:transparent}

.cosmetic-horizons-neon::after{mask-image:linear-gradient(90deg,transparent,#000 7%,transparent 28% 72%,#000 93%,transparent),linear-gradient(transparent,#000 12% 88%,transparent);mask-composite:intersect}
