.account-level-crest,
.account-party-diamond,
.pregame-account-avatar-wrap,
.account-social-avatar,
.account-diamond,
.real-player-marker { isolation: isolate; }

/* One canonical account diamond, scaled from the 66px store reference. */
.account-diamond {
  --diamond-size:66px;
  --diamond-frame-size:112px;
  --diamond-effect-scale:1;
  --diamond-label-size:23px;
  --diamond-icon-size:30px;
  --diamond-crown-size:22px;
  --diamond-crown-icon-size:16px;
  --tier:#b97845;
  --tier-rgb:185,120,69;
  position:relative;
  z-index:1;
  width:var(--diamond-size);
  height:var(--diamond-size);
  display:grid;
  flex:0 0 var(--diamond-size);
  place-items:center;
  overflow:visible;
}
.account-diamond.tier-silver{--tier:#cbd5dc;--tier-rgb:203,213,220}.account-diamond.tier-gold{--tier:#f1cf7a;--tier-rgb:241,207,122}
.account-diamond > .cosmetic-frame {
  inset:auto;
  left:50%;
  top:50%;
  width:112px;
  height:112px;
  transform:translate(-50%,-50%) scale(var(--diamond-effect-scale));
  transform-origin:50% 50%;
}
.account-diamond > .account-diamond-core {
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  margin:0;
  overflow:hidden;
  border:4px solid var(--tier);
  border-radius:0;
  background:linear-gradient(145deg,rgba(var(--tier-rgb),.27),rgba(1,7,12,.97));
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.62),inset 0 0 18px rgba(var(--tier-rgb),.16),0 0 20px rgba(var(--tier-rgb),.25);
  transform:rotate(45deg);
}
.account-level-wrap .account-diamond-level > .account-level-crest{
  width:100%;
  height:100%;
}
.account-diamond > .account-diamond-core > img{position:absolute;z-index:1;inset:-14%;width:128%;height:128%;object-fit:cover;transform:rotate(-45deg) scale(1.08)}
.account-diamond > .account-diamond-core > b{position:absolute;z-index:3;inset:0;display:grid;place-items:center;color:#fff6df;font:900 calc(var(--diamond-label-size) + 4px)/1 var(--condensed);text-shadow:0 1px 4px #000,0 0 9px #000,0 0 12px var(--tier);transform:rotate(-45deg)}
.account-diamond > .account-diamond-core > i:not(.account-diamond-crown){color:var(--tier);font-size:var(--diamond-icon-size);opacity:.4;transform:rotate(-45deg)}
.account-diamond > .account-diamond-crown{position:absolute;z-index:5;left:50%;top:122%;width:var(--diamond-crown-size);height:var(--diamond-crown-size);display:grid;place-items:center;border:0;background:transparent;color:#f1cf7a;font-size:var(--diamond-crown-icon-size);line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 4px rgba(255,248,218,.92),0 0 9px rgba(241,207,122,.68);filter:none;transform:translate(-50%,-50%);pointer-events:none}
.account-diamond-store{--diamond-size:66px;--diamond-frame-size:112px;--diamond-effect-scale:1;--diamond-label-size:23px}.account-diamond-level{--diamond-size:58px;--diamond-frame-size:98px;--diamond-effect-scale:.879;--diamond-label-size:27px}.account-level-wrap.compact .account-diamond-level{--diamond-size:52px;--diamond-frame-size:88px;--diamond-effect-scale:.788;--diamond-label-size:18px;--diamond-crown-size:19px;--diamond-crown-icon-size:13px}.profile-main .account-diamond-level{--diamond-size:96px;--diamond-frame-size:163px;--diamond-effect-scale:1.455;--diamond-label-size:42px}.account-diamond-party{--diamond-size:48px;--diamond-frame-size:82px;--diamond-effect-scale:.727;--diamond-label-size:17px;--diamond-crown-size:20px;--diamond-crown-icon-size:14px}.account-diamond-social{--diamond-size:48px;--diamond-frame-size:82px;--diamond-effect-scale:.727;--diamond-label-size:16px}.account-party-invite-row.compact .account-diamond-social{--diamond-size:34px;--diamond-frame-size:58px;--diamond-effect-scale:.515;--diamond-label-size:12px}.account-social-row .account-diamond-social{justify-self:center}.account-diamond-pregame{--diamond-size:40px;--diamond-frame-size:68px;--diamond-effect-scale:.606;--diamond-label-size:16px;--diamond-icon-size:23px}.account-diamond-access{--diamond-size:52px;--diamond-frame-size:88px;--diamond-effect-scale:.788;--diamond-label-size:20px;--diamond-crown-size:19px;--diamond-crown-icon-size:13px}
.victory-diamond-row{--diamond-size:52px;--diamond-frame-size:88px;--diamond-effect-scale:.788;--diamond-label-size:17px}.victory-diamond-winner{--diamond-size:104px;--diamond-frame-size:176px;--diamond-effect-scale:1.576;--diamond-label-size:36px}.victory-diamond-final{--diamond-size:78px;--diamond-frame-size:132px;--diamond-effect-scale:1.182;--diamond-label-size:28px}.victory-diamond-table{--diamond-size:38px;--diamond-frame-size:65px;--diamond-effect-scale:.576;--diamond-label-size:13px}.victory-diamond-credit{--diamond-size:50px;--diamond-frame-size:85px;--diamond-effect-scale:.758;--diamond-label-size:17px}
.profile-main{overflow:visible}
.account-party-track{gap:14px}.account-party-member{width:76px;flex-basis:76px}.account-party-member>.account-diamond-party{margin:5px auto 0}.account-party-member>.account-party-name{top:62px}

.cosmetic-frame {
  --fx: #ff8c2e;
  --fx2: #ffe2a1;
  --fx3: #a7290b;
  position: absolute;
  z-index: 0;
  inset: -12px;
  overflow: visible;
  pointer-events: none;
  transform: rotate(-45deg);
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--fx) 65%, transparent));
}

.real-player-marker > .cosmetic-frame { inset:auto;left:50%;top:50%;width:112px;height:112px;transform:translate(-50%,-50%) scale(.455);transform-origin:50% 50%; }
.pregame-account-avatar-wrap > .cosmetic-frame { inset:auto;left:50%;top:50%;width:112px;height:112px;transform:translate(-50%,-50%) scale(var(--diamond-effect-scale,.607));transform-origin:50% 50%; }

.cosmetic-frame-field,
.cosmetic-frame-aura,
.cosmetic-frame-ornaments,
.cosmetic-frame-ornaments i { position: absolute; display: block; }

.cosmetic-frame-field { z-index: 0; inset: -4%; }
.cosmetic-frame-aura { z-index: 1; inset: 18%; transform: rotate(45deg); }
.cosmetic-frame-ornaments { z-index: 2; inset: 0; }
.cosmetic-frame-ornaments i { width: 8px; height: 8px; }

.cosmetic-particle-stage {
  position: absolute;
  z-index: 3;
  inset: -30%;
  overflow: visible !important;
  transform: translateZ(0);
}

.cosmetic-particle-stage > canvas {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
  mix-blend-mode: screen;
}

/* Ember Crown: asymmetric flame tongues and a restless forged border. */
.cosmetic-frame-ember-crown { --fx:#ff6818; --fx2:#ffe3a0; --fx3:#a91408; }
.cosmetic-frame-ember-crown .cosmetic-frame-field {
  background: conic-gradient(from 25deg,transparent 0 12%,rgba(255,75,10,.38) 15%,transparent 19% 37%,rgba(255,181,45,.25) 41%,transparent 46% 65%,rgba(255,64,10,.42) 69%,transparent 74%);
  filter: blur(5px);
  animation: cosmetic-ember-heat 1.1s steps(5,end) infinite;
}
.cosmetic-frame-ember-crown .cosmetic-frame-aura {
  border: 2px solid #ff8a24;
  border-top-color:#ffe7a0;
  border-right-color:#b9270b;
  box-shadow: 0 -5px 12px rgba(255,105,18,.7), inset 0 0 8px rgba(255,64,8,.5);
  animation: cosmetic-ember-border .72s steps(4,end) infinite alternate;
}
.cosmetic-frame-ember-crown .cosmetic-frame-ornaments i {
  bottom:13%;
  width:9px;
  height:25px;
  border-radius:70% 15% 70% 35%;
  background:linear-gradient(to top,#ff4b0b,#ffc13d 54%,rgba(255,247,190,.9));
  clip-path:polygon(50% 0,83% 28%,100% 67%,63% 100%,16% 84%,0 45%);
  transform-origin:50% 100%;
  animation:cosmetic-flame-tongue .7s ease-in-out infinite alternate;
}
.cosmetic-frame-ember-crown .cosmetic-frame-ornaments i:nth-child(1){left:23%;height:18px;animation-delay:-.2s}.cosmetic-frame-ember-crown .cosmetic-frame-ornaments i:nth-child(2){left:40%;height:28px;animation-delay:-.55s}.cosmetic-frame-ember-crown .cosmetic-frame-ornaments i:nth-child(3){right:38%;height:22px;animation-delay:-.38s}.cosmetic-frame-ember-crown .cosmetic-frame-ornaments i:nth-child(4){right:21%;height:17px;animation-delay:-.1s}

/* Frost Sparks: a quiet faceted frame with independently shimmering corners. */
.cosmetic-frame-frost-sparks { --fx:#4bdaff; --fx2:#efffff; --fx3:#246ed8; }
.cosmetic-frame-frost-sparks .cosmetic-frame-field { inset:8%; border:1px solid rgba(196,248,255,.3); transform:rotate(45deg); box-shadow:inset 0 0 14px rgba(51,196,255,.2); }
.cosmetic-frame-frost-sparks .cosmetic-frame-aura { border:1px solid #c8f8ff; box-shadow:0 0 4px #fff,inset 0 0 7px #3fcfff; clip-path:polygon(0 0,34% 0,50% 12%,66% 0,100% 0,100% 34%,88% 50%,100% 66%,100% 100%,66% 100%,50% 88%,34% 100%,0 100%,0 66%,12% 50%,0 34%); animation:cosmetic-frost-shimmer 3.8s linear infinite; }
.cosmetic-frame-frost-sparks .cosmetic-frame-ornaments i { width:17px;height:25px;background:linear-gradient(135deg,#fff,rgba(78,218,255,.8) 43%,rgba(35,104,215,.15));clip-path:polygon(50% 0,100% 48%,62% 100%,38% 100%,0 48%);filter:drop-shadow(0 0 4px #5ce7ff);animation:cosmetic-crystal-shine 2.6s ease-in-out infinite; }
.cosmetic-frame-frost-sparks .cosmetic-frame-ornaments i:nth-child(1){left:8%;top:8%;transform:rotate(-45deg)}.cosmetic-frame-frost-sparks .cosmetic-frame-ornaments i:nth-child(2){right:8%;top:8%;transform:rotate(45deg);animation-delay:-1.2s}.cosmetic-frame-frost-sparks .cosmetic-frame-ornaments i:nth-child(3){right:8%;bottom:8%;transform:rotate(135deg);animation-delay:-.6s}.cosmetic-frame-frost-sparks .cosmetic-frame-ornaments i:nth-child(4){left:8%;bottom:8%;transform:rotate(-135deg);animation-delay:-1.8s}

/* Arcane Violet: counter-rotating rune rings rather than a pulsing glow. */
.cosmetic-frame-arcane-violet { --fx:#a246ff; --fx2:#f1ceff; --fx3:#4820b6; }
.cosmetic-frame-arcane-violet .cosmetic-frame-field { inset:-2%; border:1px dashed rgba(218,142,255,.7); border-radius:50%; animation:cosmetic-arcane-orbit 8s linear infinite; }
.cosmetic-frame-arcane-violet .cosmetic-frame-field:after { content:"";position:absolute;inset:12%;border:2px dotted rgba(255,218,255,.55);border-radius:50%;animation:cosmetic-arcane-orbit 5s linear infinite reverse; }
.cosmetic-frame-arcane-violet .cosmetic-frame-aura { border:2px solid rgba(169,77,255,.75); box-shadow:0 0 10px #8e38f5,inset 0 0 11px rgba(221,125,255,.42); }
.cosmetic-frame-arcane-violet .cosmetic-frame-ornaments { animation:cosmetic-arcane-orbit 6.4s linear infinite reverse; }
.cosmetic-frame-arcane-violet .cosmetic-frame-ornaments i { left:calc(50% - 4px);top:-2px;border:1px solid #f2cbff;background:#6d26c9;box-shadow:0 0 7px #ce72ff;transform:rotate(45deg); }
.cosmetic-frame-arcane-violet .cosmetic-frame-ornaments i:nth-child(2){left:auto;right:-2px;top:calc(50% - 4px)}.cosmetic-frame-arcane-violet .cosmetic-frame-ornaments i:nth-child(3){top:auto;bottom:-2px}.cosmetic-frame-arcane-violet .cosmetic-frame-ornaments i:nth-child(4){left:-2px;top:calc(50% - 4px)}

/* Emerald Pulse: expanding route echoes and small leaf-shaped signals. */
.cosmetic-frame-emerald-pulse { --fx:#22dd8a; --fx2:#d9ffec; --fx3:#08734a; }
.cosmetic-frame-emerald-pulse .cosmetic-frame-field:before,.cosmetic-frame-emerald-pulse .cosmetic-frame-field:after { content:"";position:absolute;inset:22%;border:2px solid #55f2aa;border-radius:50%;animation:cosmetic-emerald-echo 2.2s cubic-bezier(.18,.75,.3,1) infinite; }
.cosmetic-frame-emerald-pulse .cosmetic-frame-field:after{animation-delay:-1.1s}.cosmetic-frame-emerald-pulse .cosmetic-frame-aura{border:1px solid rgba(92,255,180,.8);box-shadow:inset 0 0 12px rgba(19,205,119,.45)}
.cosmetic-frame-emerald-pulse .cosmetic-frame-ornaments i{width:7px;height:13px;border-radius:90% 0 90% 0;background:linear-gradient(#d8ffeb,#20d584);filter:drop-shadow(0 0 4px #2be59a);animation:cosmetic-leaf-float 2.5s ease-in-out infinite}.cosmetic-frame-emerald-pulse .cosmetic-frame-ornaments i:nth-child(1){left:11%;top:36%;transform:rotate(-55deg)}.cosmetic-frame-emerald-pulse .cosmetic-frame-ornaments i:nth-child(2){right:12%;top:28%;transform:rotate(35deg);animation-delay:-.8s}.cosmetic-frame-emerald-pulse .cosmetic-frame-ornaments i:nth-child(3){right:22%;bottom:9%;transform:rotate(145deg);animation-delay:-1.4s}.cosmetic-frame-emerald-pulse .cosmetic-frame-ornaments i:nth-child(4){left:22%;bottom:10%;transform:rotate(-145deg);animation-delay:-2s}

/* Solar Flare: a rotating corona with stable gold geometry. */
.cosmetic-frame-solar-flare { --fx:#ffc43d; --fx2:#fffbd0; --fx3:#eb7300; }
.cosmetic-frame-solar-flare .cosmetic-frame-field { inset:-9%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,244,151,.9) 0 1.3deg,transparent 1.3deg 15deg);mask:radial-gradient(circle,transparent 0 58%,#000 60% 68%,transparent 70%);animation:cosmetic-solar-turn 14s linear infinite; }
.cosmetic-frame-solar-flare .cosmetic-frame-aura { border:2px solid #ffe88b;box-shadow:0 0 13px #ffae23,inset 0 0 8px rgba(255,202,64,.35); }
.cosmetic-frame-solar-flare .cosmetic-frame-ornaments i{left:calc(50% - 3px);top:-5px;width:6px;height:12px;background:#fff4ae;clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 0 5px #ffc63e)}.cosmetic-frame-solar-flare .cosmetic-frame-ornaments i:nth-child(2){left:auto;right:-2px;top:calc(50% - 6px);transform:rotate(90deg)}.cosmetic-frame-solar-flare .cosmetic-frame-ornaments i:nth-child(3){top:auto;bottom:-5px;transform:rotate(180deg)}.cosmetic-frame-solar-flare .cosmetic-frame-ornaments i:nth-child(4){left:-2px;top:calc(50% - 6px);transform:rotate(-90deg)}

/* Void Static: a collapsing dark portal interrupted by hard digital cuts. */
.cosmetic-frame-void-static { --fx:#6748e8; --fx2:#d9d0ff; --fx3:#0c0819; }
.cosmetic-frame-void-static .cosmetic-frame-field { inset:-2%;border-radius:50%;background:radial-gradient(circle,transparent 38%,rgba(5,2,14,.94) 51%,rgba(90,55,205,.4) 58%,transparent 71%);filter:blur(2px);animation:cosmetic-void-collapse 3.4s ease-in-out infinite; }
.cosmetic-frame-void-static .cosmetic-frame-aura { border:2px solid #6f52e8;border-left-color:transparent;border-bottom-color:#151022;box-shadow:7px -3px 0 -1px rgba(197,181,255,.4),-6px 4px 0 -1px rgba(34,19,78,.8);animation:cosmetic-void-glitch 2.1s steps(1,end) infinite; }
.cosmetic-frame-void-static .cosmetic-frame-ornaments i{height:2px;width:21px;background:#dcd4ff;box-shadow:0 0 5px #fff;animation:cosmetic-static-cut 1.7s steps(2,end) infinite}.cosmetic-frame-void-static .cosmetic-frame-ornaments i:nth-child(1){left:2%;top:28%}.cosmetic-frame-void-static .cosmetic-frame-ornaments i:nth-child(2){right:-2%;top:43%;animation-delay:-.4s}.cosmetic-frame-void-static .cosmetic-frame-ornaments i:nth-child(3){left:8%;bottom:27%;animation-delay:-.8s}.cosmetic-frame-void-static .cosmetic-frame-ornaments i:nth-child(4){right:8%;bottom:18%;animation-delay:-1.2s}

/* Rose Nebula: drifting cloud mass with petals, not a generic sparkle ring. */
.cosmetic-frame-rose-nebula { --fx:#ff51c5; --fx2:#fff0fb; --fx3:#862ba9; }
.cosmetic-frame-rose-nebula .cosmetic-frame-field { inset:-10%;border-radius:50%;background:radial-gradient(ellipse at 25% 40%,rgba(255,89,201,.55),transparent 30%),radial-gradient(ellipse at 72% 58%,rgba(127,62,220,.52),transparent 34%),radial-gradient(circle at 53% 28%,rgba(255,231,249,.28),transparent 17%);filter:blur(7px);animation:cosmetic-nebula-drift 6s ease-in-out infinite alternate; }
.cosmetic-frame-rose-nebula .cosmetic-frame-aura { border:1px solid rgba(255,175,228,.75);border-radius:50%;box-shadow:0 0 13px rgba(255,75,193,.5),inset 0 0 10px rgba(130,53,198,.38);animation:cosmetic-nebula-ring 5s ease-in-out infinite; }
.cosmetic-frame-rose-nebula .cosmetic-frame-ornaments i{width:9px;height:14px;border-radius:100% 0 100% 0;background:linear-gradient(135deg,#fff,#ff67c9);filter:drop-shadow(0 0 4px #ff55c7);animation:cosmetic-petal-drift 3.2s ease-in-out infinite}.cosmetic-frame-rose-nebula .cosmetic-frame-ornaments i:nth-child(1){left:10%;top:17%;transform:rotate(-40deg)}.cosmetic-frame-rose-nebula .cosmetic-frame-ornaments i:nth-child(2){right:8%;top:31%;transform:rotate(45deg);animation-delay:-.9s}.cosmetic-frame-rose-nebula .cosmetic-frame-ornaments i:nth-child(3){right:22%;bottom:4%;transform:rotate(145deg);animation-delay:-1.7s}.cosmetic-frame-rose-nebula .cosmetic-frame-ornaments i:nth-child(4){left:19%;bottom:8%;transform:rotate(-125deg);animation-delay:-2.4s}

/* Storm Charge: intermittent bolts and flashes around a broken conductor. */
.cosmetic-frame-storm-charge { --fx:#389fff; --fx2:#f4ffff; --fx3:#1f4ccc; }
.cosmetic-frame-storm-charge .cosmetic-frame-field { inset:2%;border:1px dashed rgba(93,188,255,.7);transform:rotate(45deg);animation:cosmetic-storm-flash 2.4s steps(1,end) infinite; }
.cosmetic-frame-storm-charge .cosmetic-frame-aura { border:2px solid #45aaff;border-top-color:#fff;border-bottom-color:#2150cd;box-shadow:0 0 7px #318eff;animation:cosmetic-conductor-jolt 1.35s steps(2,end) infinite; }
.cosmetic-frame-storm-charge .cosmetic-frame-ornaments i{width:25px;height:9px;background:linear-gradient(90deg,#fff,#3b9fff);clip-path:polygon(0 38%,38% 38%,48% 0,58% 68%,100% 68%,100% 84%,55% 84%,47% 100%,35% 55%,0 55%);filter:drop-shadow(0 0 4px #fff);animation:cosmetic-bolt-blink 1.1s steps(1,end) infinite}.cosmetic-frame-storm-charge .cosmetic-frame-ornaments i:nth-child(1){left:-9%;top:22%;transform:rotate(25deg)}.cosmetic-frame-storm-charge .cosmetic-frame-ornaments i:nth-child(2){right:-9%;top:25%;transform:rotate(155deg);animation-delay:-.3s}.cosmetic-frame-storm-charge .cosmetic-frame-ornaments i:nth-child(3){right:3%;bottom:7%;transform:rotate(-130deg);animation-delay:-.65s}.cosmetic-frame-storm-charge .cosmetic-frame-ornaments i:nth-child(4){left:3%;bottom:5%;transform:rotate(-45deg);animation-delay:-.88s}

/* Blood Moon: a slow eclipse with falling crimson embers. */
.cosmetic-frame-blood-moon { --fx:#e71934; --fx2:#ffb4a6; --fx3:#59050f; }
.cosmetic-frame-blood-moon .cosmetic-frame-field:before { content:"";position:absolute;left:3%;top:1%;width:48%;height:48%;border-radius:50%;background:radial-gradient(circle at 36% 34%,#ff8b72,#d91b30 43%,#5c0611 72%);box-shadow:0 0 17px rgba(231,25,52,.85);animation:cosmetic-eclipse 5.8s ease-in-out infinite; }
.cosmetic-frame-blood-moon .cosmetic-frame-field:after { content:"";position:absolute;left:16%;top:-2%;width:43%;height:43%;border-radius:50%;background:#08050a;box-shadow:inset -5px 0 7px rgba(255,84,74,.28);animation:cosmetic-eclipse-shadow 5.8s ease-in-out infinite; }
.cosmetic-frame-blood-moon .cosmetic-frame-aura { border:2px solid #9e0b20;border-right-color:#ff5b4f;border-bottom-color:#3f040b;box-shadow:inset 0 0 12px rgba(175,5,29,.55); }
.cosmetic-frame-blood-moon .cosmetic-frame-ornaments i{top:11%;width:3px;height:13px;border-radius:50%;background:#ff5846;box-shadow:0 0 6px #e51831;animation:cosmetic-blood-fall 1.8s ease-in infinite}.cosmetic-frame-blood-moon .cosmetic-frame-ornaments i:nth-child(1){left:18%}.cosmetic-frame-blood-moon .cosmetic-frame-ornaments i:nth-child(2){left:42%;animation-delay:-.5s}.cosmetic-frame-blood-moon .cosmetic-frame-ornaments i:nth-child(3){right:31%;animation-delay:-1s}.cosmetic-frame-blood-moon .cosmetic-frame-ornaments i:nth-child(4){right:13%;animation-delay:-1.45s}

/* Atlas Prism: refraction bands and counter-rotating geometric facets. */
.cosmetic-frame-atlas-prism { --fx:#36dfff; --fx2:#ff5bd4; --fx3:#ffd85d; filter:drop-shadow(0 0 9px rgba(94,222,255,.72)); }
.cosmetic-frame-atlas-prism .cosmetic-frame-field { inset:-8%;border-radius:50%;background:conic-gradient(from 0deg,transparent,#38e8ff,transparent 20%,#746aff,transparent 42%,#ff54cd,transparent 63%,#ffd45c,transparent 82%,#38e8ff);mask:radial-gradient(circle,transparent 52%,#000 55% 62%,transparent 66%);animation:cosmetic-prism-turn 7s linear infinite; }
.cosmetic-frame-atlas-prism .cosmetic-frame-aura { border:2px solid transparent;background:linear-gradient(#090f18,#090f18) padding-box,conic-gradient(#3be7ff,#7771ff,#ff54ca,#ffd358,#3be7ff) border-box;box-shadow:0 0 10px rgba(86,215,255,.5);animation:cosmetic-prism-hue 4s linear infinite; }
.cosmetic-frame-atlas-prism .cosmetic-frame-ornaments { animation:cosmetic-prism-turn 9s linear infinite reverse; }
.cosmetic-frame-atlas-prism .cosmetic-frame-ornaments i{left:calc(50% - 5px);top:-4px;width:10px;height:14px;background:linear-gradient(135deg,#fff,#38ddff 45%,#ff5bd1);clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 0 5px #fff)}.cosmetic-frame-atlas-prism .cosmetic-frame-ornaments i:nth-child(2){left:auto;right:-5px;top:calc(50% - 7px);transform:rotate(90deg)}.cosmetic-frame-atlas-prism .cosmetic-frame-ornaments i:nth-child(3){top:auto;bottom:-4px;transform:rotate(180deg)}.cosmetic-frame-atlas-prism .cosmetic-frame-ornaments i:nth-child(4){left:-5px;top:calc(50% - 7px);transform:rotate(-90deg)}

/* Gilded Clockwork: visible mechanics with two independently turning gear rings. */
.cosmetic-frame-gilded-clockwork{--fx:#d9a84f;--fx2:#fff0b4;--fx3:#5f3a16;filter:drop-shadow(0 0 5px rgba(217,168,79,.75))}
.cosmetic-frame-gilded-clockwork .cosmetic-frame-field{inset:-4%;border-radius:50%;background:repeating-conic-gradient(from 0deg,#d6a64d 0 4deg,transparent 4deg 15deg);mask:radial-gradient(circle,transparent 51%,#000 53% 59%,transparent 61%);animation:cosmetic-clock-turn 12s linear infinite}
.cosmetic-frame-gilded-clockwork .cosmetic-frame-field:after{content:"";position:absolute;inset:15%;border-radius:50%;background:repeating-conic-gradient(from 8deg,rgba(255,231,163,.9) 0 3deg,transparent 3deg 22.5deg);mask:radial-gradient(circle,transparent 52%,#000 55% 64%,transparent 67%);animation:cosmetic-clock-turn 7s linear infinite reverse}
.cosmetic-frame-gilded-clockwork .cosmetic-frame-aura{border:3px double #d3a44e;box-shadow:inset 0 0 9px rgba(255,221,135,.35),0 0 7px rgba(145,90,29,.6)}
.cosmetic-frame-gilded-clockwork .cosmetic-frame-ornaments i{width:17px;height:17px;border:3px dotted #f0c76f;border-radius:50%;background:radial-gradient(circle,#fff0ad 0 16%,#704719 18% 38%,#d4a14a 40%);box-shadow:0 0 4px #8a571d;animation:cosmetic-clock-turn 3.8s linear infinite}.cosmetic-frame-gilded-clockwork .cosmetic-frame-ornaments i:nth-child(1){left:4%;top:11%}.cosmetic-frame-gilded-clockwork .cosmetic-frame-ornaments i:nth-child(2){right:4%;top:13%;animation-direction:reverse}.cosmetic-frame-gilded-clockwork .cosmetic-frame-ornaments i:nth-child(3){right:5%;bottom:9%;animation-duration:4.7s}.cosmetic-frame-gilded-clockwork .cosmetic-frame-ornaments i:nth-child(4){left:5%;bottom:9%;animation-direction:reverse;animation-duration:3.2s}

/* Oceanic Tide: layered liquid crests circulate around the lower edge. */
.cosmetic-frame-oceanic-tide{--fx:#28cce9;--fx2:#dfffff;--fx3:#075493;filter:drop-shadow(0 0 7px rgba(44,203,235,.72))}
.cosmetic-frame-oceanic-tide .cosmetic-frame-field{inset:-5%;overflow:hidden;border-radius:50%;background:radial-gradient(ellipse at 50% 105%,rgba(48,211,241,.72),transparent 53%)}
.cosmetic-frame-oceanic-tide .cosmetic-frame-field:before,.cosmetic-frame-oceanic-tide .cosmetic-frame-field:after{content:"";position:absolute;left:-30%;bottom:6%;width:160%;height:28%;border:3px solid rgba(163,247,255,.8);border-color:rgba(163,247,255,.8) transparent transparent;border-radius:50%;animation:cosmetic-tide-roll 2.8s ease-in-out infinite alternate}.cosmetic-frame-oceanic-tide .cosmetic-frame-field:after{bottom:15%;opacity:.55;animation-delay:-1.4s;animation-direction:alternate-reverse}
.cosmetic-frame-oceanic-tide .cosmetic-frame-aura{border:2px solid #4bdaf1;border-top-color:rgba(214,255,255,.88);border-bottom-color:#0873b0;box-shadow:inset 0 -8px 14px rgba(18,150,205,.35),0 0 8px #32cde8}
.cosmetic-frame-oceanic-tide .cosmetic-frame-ornaments i{width:9px;height:14px;border-radius:60% 45% 55% 45%;background:linear-gradient(135deg,#eaffff,#31cbe8 66%,#0875af);box-shadow:0 0 5px #8cf5ff;animation:cosmetic-droplet-orbit 3.3s ease-in-out infinite}.cosmetic-frame-oceanic-tide .cosmetic-frame-ornaments i:nth-child(1){left:11%;top:28%;transform:rotate(25deg)}.cosmetic-frame-oceanic-tide .cosmetic-frame-ornaments i:nth-child(2){right:13%;top:20%;transform:rotate(-28deg);animation-delay:-.8s}.cosmetic-frame-oceanic-tide .cosmetic-frame-ornaments i:nth-child(3){right:7%;bottom:24%;transform:rotate(55deg);animation-delay:-1.7s}.cosmetic-frame-oceanic-tide .cosmetic-frame-ornaments i:nth-child(4){left:8%;bottom:18%;transform:rotate(-50deg);animation-delay:-2.4s}

/* Phantom Circuit: hard right-angle traces, scanning bars, and reconnecting nodes. */
.cosmetic-frame-phantom-circuit{--fx:#31f2a4;--fx2:#eafff7;--fx3:#007a58;filter:drop-shadow(0 0 6px rgba(45,255,171,.7))}
.cosmetic-frame-phantom-circuit .cosmetic-frame-field{inset:2%;background:linear-gradient(90deg,transparent 47%,rgba(62,255,177,.75) 48% 50%,transparent 51%) 0 0/100% 28%,linear-gradient(0deg,transparent 47%,rgba(62,255,177,.7) 48% 50%,transparent 51%) 0 0/28% 100%;clip-path:polygon(0 19%,18% 19%,18% 0,82% 0,82% 19%,100% 19%,100% 81%,82% 81%,82% 100%,18% 100%,18% 81%,0 81%);animation:cosmetic-circuit-scan 2.4s steps(8,end) infinite}
.cosmetic-frame-phantom-circuit .cosmetic-frame-field:after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:#eafff7;box-shadow:0 0 8px #34f3aa;animation:cosmetic-scan-line 2.4s linear infinite}
.cosmetic-frame-phantom-circuit .cosmetic-frame-aura{border:2px solid #28da98;clip-path:polygon(0 0,37% 0,37% 8%,63% 8%,63% 0,100% 0,100% 37%,92% 37%,92% 63%,100% 63%,100% 100%,63% 100%,63% 92%,37% 92%,37% 100%,0 100%,0 63%,8% 63%,8% 37%,0 37%);box-shadow:inset 0 0 8px rgba(53,255,180,.45)}
.cosmetic-frame-phantom-circuit .cosmetic-frame-ornaments i{width:8px;height:8px;border:1px solid #b9ffe2;background:#10a873;box-shadow:0 0 7px #3cffb1;transform:rotate(45deg);animation:cosmetic-node-link 1.6s steps(2,end) infinite}.cosmetic-frame-phantom-circuit .cosmetic-frame-ornaments i:nth-child(1){left:3%;top:25%}.cosmetic-frame-phantom-circuit .cosmetic-frame-ornaments i:nth-child(2){right:3%;top:25%;animation-delay:-.4s}.cosmetic-frame-phantom-circuit .cosmetic-frame-ornaments i:nth-child(3){right:3%;bottom:25%;animation-delay:-.8s}.cosmetic-frame-phantom-circuit .cosmetic-frame-ornaments i:nth-child(4){left:3%;bottom:25%;animation-delay:-1.2s}

/* Celestial Compass: cardinal points, star field, and a continuously seeking needle. */
.cosmetic-frame-celestial-compass{--fx:#f5d681;--fx2:#ffffff;--fx3:#3987d2;filter:drop-shadow(0 0 7px rgba(99,190,255,.55))}
.cosmetic-frame-celestial-compass .cosmetic-frame-field{inset:-4%;border:1px dotted rgba(255,228,146,.68);border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,241,183,.62) 0 1deg,transparent 1deg 15deg);mask:radial-gradient(circle,transparent 47%,#000 49% 53%,transparent 55%);animation:cosmetic-compass-stars 18s linear infinite}
.cosmetic-frame-celestial-compass .cosmetic-frame-field:after{content:"";position:absolute;left:49%;top:7%;width:3px;height:43%;background:linear-gradient(#fff,#5fc9f6 48%,transparent);clip-path:polygon(50% 0,100% 82%,50% 100%,0 82%);filter:drop-shadow(0 0 4px #fff);transform-origin:50% 100%;animation:cosmetic-compass-seek 6s cubic-bezier(.45,.05,.55,.95) infinite}
.cosmetic-frame-celestial-compass .cosmetic-frame-aura{border:1px solid #ffe79a;border-radius:50%;box-shadow:0 0 7px rgba(255,230,150,.7),inset 0 0 9px rgba(67,157,224,.4)}
.cosmetic-frame-celestial-compass .cosmetic-frame-ornaments i{left:calc(50% - 5px);top:-6px;width:10px;height:15px;background:linear-gradient(#fff,#f0c85d);clip-path:polygon(50% 0,100% 68%,50% 100%,0 68%);filter:drop-shadow(0 0 5px #fff)}.cosmetic-frame-celestial-compass .cosmetic-frame-ornaments i:nth-child(2){left:auto;right:-6px;top:calc(50% - 7px);transform:rotate(90deg)}.cosmetic-frame-celestial-compass .cosmetic-frame-ornaments i:nth-child(3){top:auto;bottom:-6px;transform:rotate(180deg)}.cosmetic-frame-celestial-compass .cosmetic-frame-ornaments i:nth-child(4){left:-6px;top:calc(50% - 7px);transform:rotate(-90deg)}

/* Obsidian Thorns: fractured black crystal and slowly growing spikes. */
.cosmetic-frame-obsidian-thorns{--fx:#7333a5;--fx2:#efcfff;--fx3:#08030b;filter:drop-shadow(0 0 8px rgba(122,49,169,.75))}
.cosmetic-frame-obsidian-thorns .cosmetic-frame-field{inset:-5%;background:conic-gradient(from 20deg,transparent,rgba(110,39,151,.55) 9%,transparent 15% 31%,rgba(16,5,22,.9) 38%,transparent 44% 61%,rgba(119,42,159,.5) 68%,transparent 76%);filter:blur(4px);animation:cosmetic-thorn-shadow 4s ease-in-out infinite alternate}
.cosmetic-frame-obsidian-thorns .cosmetic-frame-aura{border:3px solid #211027;border-top-color:#8244a7;border-right-color:#08030a;clip-path:polygon(0 0,38% 0,45% 9%,55% 2%,65% 0,100% 0,100% 35%,91% 45%,100% 58%,100% 100%,63% 100%,55% 91%,43% 100%,0 100%,0 63%,8% 55%,0 43%);box-shadow:inset 0 0 12px rgba(117,40,155,.65),0 0 7px #000}
.cosmetic-frame-obsidian-thorns .cosmetic-frame-ornaments i{width:16px;height:31px;background:linear-gradient(90deg,#08030b,#712e92 58%,#dab0ef);clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 0 5px #5d237c);transform-origin:50% 100%;animation:cosmetic-thorn-grow 3s ease-in-out infinite}.cosmetic-frame-obsidian-thorns .cosmetic-frame-ornaments i:nth-child(1){left:2%;top:10%;transform:rotate(-47deg)}.cosmetic-frame-obsidian-thorns .cosmetic-frame-ornaments i:nth-child(2){right:2%;top:10%;transform:rotate(47deg);animation-delay:-.75s}.cosmetic-frame-obsidian-thorns .cosmetic-frame-ornaments i:nth-child(3){right:2%;bottom:8%;transform:rotate(133deg);animation-delay:-1.5s}.cosmetic-frame-obsidian-thorns .cosmetic-frame-ornaments i:nth-child(4){left:2%;bottom:8%;transform:rotate(-133deg);animation-delay:-2.25s}

@keyframes cosmetic-ember-heat{50%{opacity:.65;transform:scale(.96) rotate(2deg)}}
@keyframes cosmetic-ember-border{to{border-width:3px;filter:brightness(1.25)}}
@keyframes cosmetic-flame-tongue{to{transform:skewX(-9deg) scale(.72,1.18);filter:brightness(1.25)}}
@keyframes cosmetic-frost-shimmer{50%{filter:brightness(1.5) drop-shadow(0 0 5px #7de9ff)}}
@keyframes cosmetic-crystal-shine{50%{opacity:.55;filter:brightness(1.8) drop-shadow(0 0 8px #86ecff)}}
@keyframes cosmetic-arcane-orbit{to{transform:rotate(360deg)}}
@keyframes cosmetic-emerald-echo{0%{opacity:.85;transform:scale(.55)}100%{opacity:0;transform:scale(1.65)}}
@keyframes cosmetic-leaf-float{50%{margin-top:-5px;filter:brightness(1.4) drop-shadow(0 0 6px #34eda0)}}
@keyframes cosmetic-solar-turn{to{transform:rotate(360deg)}}
@keyframes cosmetic-void-collapse{50%{transform:scale(.82) rotate(13deg);filter:blur(5px)}}
@keyframes cosmetic-void-glitch{12%{transform:translate(3px,-1px) rotate(45deg)}14%{transform:translate(-4px,2px) rotate(45deg)}16%,100%{transform:translate(0) rotate(45deg)}67%{clip-path:polygon(0 0,100% 0,100% 43%,73% 43%,73% 55%,100% 55%,100% 100%,0 100%,0 66%,29% 66%,29% 54%,0 54%)}}
@keyframes cosmetic-static-cut{0%,86%{opacity:0;transform:scaleX(.2)}87%,92%{opacity:1;transform:scaleX(1)}93%,100%{opacity:0}}
@keyframes cosmetic-nebula-drift{to{transform:translate(4px,-3px) rotate(9deg) scale(1.08)}}
@keyframes cosmetic-nebula-ring{50%{transform:rotate(60deg);border-radius:40%;opacity:.7}}
@keyframes cosmetic-petal-drift{50%{margin-top:7px;filter:brightness(1.35) drop-shadow(0 0 7px #ff55c7)}}
@keyframes cosmetic-storm-flash{0%,83%,89%,100%{opacity:.38}84%,88%{opacity:1;box-shadow:0 0 16px #fff}}
@keyframes cosmetic-conductor-jolt{0%,74%,100%{transform:rotate(45deg)}75%{transform:translate(2px,-1px) rotate(46deg)}77%{transform:translate(-2px,1px) rotate(44deg)}}
@keyframes cosmetic-bolt-blink{0%,58%,64%,100%{opacity:0}59%,63%{opacity:1}}
@keyframes cosmetic-eclipse{50%{filter:brightness(1.25);transform:translate(3px,2px)}}
@keyframes cosmetic-eclipse-shadow{50%{transform:translate(-8px,5px)}}
@keyframes cosmetic-blood-fall{0%{opacity:0;transform:translateY(-4px) scaleY(.4)}25%{opacity:1}100%{opacity:0;transform:translateY(55px) scaleY(1.4)}}
@keyframes cosmetic-prism-turn{to{transform:rotate(360deg)}}
@keyframes cosmetic-prism-hue{to{filter:hue-rotate(360deg)}}
@keyframes cosmetic-clock-turn{to{transform:rotate(360deg)}}
@keyframes cosmetic-tide-roll{to{transform:translateX(12%) scaleY(1.25)}}
@keyframes cosmetic-droplet-orbit{50%{margin-top:-7px;filter:brightness(1.35) drop-shadow(0 0 8px #9affff)}}
@keyframes cosmetic-circuit-scan{50%{filter:brightness(1.45)}100%{background-position:28% 0,0 28%}}
@keyframes cosmetic-scan-line{to{transform:translateY(100px);opacity:0}}
@keyframes cosmetic-node-link{50%{opacity:.28;box-shadow:0 0 2px #3cffb1}}
@keyframes cosmetic-compass-stars{to{transform:rotate(360deg)}}
@keyframes cosmetic-compass-seek{0%,100%{transform:rotate(-34deg)}45%{transform:rotate(52deg)}67%{transform:rotate(18deg)}}
@keyframes cosmetic-thorn-shadow{to{transform:rotate(8deg) scale(1.08);filter:blur(7px)}}
@keyframes cosmetic-thorn-grow{0%,100%{scale:.82 1}50%{scale:1 1.18;filter:brightness(1.35) drop-shadow(0 0 7px #7c349f)}}

/* Movement trails. Each family has its own geometry and decay behavior. */
.cosmetic-trail-particle {
  --trail:#ff8b32;
  --trail2:#ffe4a5;
  --trail-dx:-14px;
  --trail-dy:0px;
  --trail-angle:0deg;
  --trail-side:0px;
  --trail-spin-angle:190deg;
  --trail-spin-short:25deg;
  --trail-spin-long:55deg;
  --trail-scale:1;
  --trail-render-scale:1;
  position:fixed;
  z-index:4;
  pointer-events:none;
  scale:var(--trail-render-scale);
  transform-origin:50% 50%;
  will-change:transform,opacity,filter;
}
.cosmetic-trail-preview-particle { position:absolute;z-index:4; }
.cosmetic-trail-map-anchor.maplibregl-marker {
  z-index:0 !important;
  width:0;
  height:0;
  pointer-events:none !important;
}
.client-game-shell .cosmetic-trail-map-anchor.maplibregl-marker {
  z-index:1 !important;
}
.cosmetic-trail-particle.cosmetic-trail-map-particle {
  position:absolute;
  z-index:0;
}
.player-marker-anchor.maplibregl-marker {
  z-index:12 !important;
}
.cosmetic-trail-particle > span,.cosmetic-trail-particle:before,.cosmetic-trail-particle:after { content:"";position:absolute;display:block;pointer-events:none; }

.cosmetic-trail-particle.cosmetic-trail-ember-wake { width:9px;height:17px;border-radius:75% 10% 70% 30%;background:linear-gradient(to top,rgba(255,49,3,.1),#ff5810 38%,#ffca46 74%,#fff4b5);box-shadow:0 0 8px #ff5d12;clip-path:polygon(50% 0,86% 30%,100% 69%,60% 100%,15% 84%,0 45%);animation:trail-ember-wake .9s ease-out forwards; }
.cosmetic-trail-particle.cosmetic-trail-ember-wake:after{left:2px;top:14px;width:4px;height:4px;border-radius:50%;background:#ffb633;box-shadow:7px 6px 0 -1px #f85a15,-5px 10px 0 -1px #ffdb73}.cosmetic-trail-particle.cosmetic-trail-ember-wake>span{inset:7px 2px 2px;background:#fff6c6;border-radius:50%;filter:blur(1px)}

.cosmetic-trail-particle.cosmetic-trail-frost-comet { --trail:#56ddff;--trail2:#f2ffff;width:34px;height:8px;background:linear-gradient(90deg,transparent,rgba(71,199,255,.26) 38%,#7eeaff 76%,#fff);clip-path:polygon(0 45%,72% 0,100% 50%,72% 100%);filter:drop-shadow(0 0 5px #5adeff);animation:trail-frost-comet .78s cubic-bezier(.2,.62,.24,1) forwards; }
.cosmetic-trail-particle.cosmetic-trail-frost-comet:after{right:-2px;top:-5px;width:15px;height:15px;background:#dfffff;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);box-shadow:0 0 7px #fff}.cosmetic-trail-particle.cosmetic-trail-frost-comet>span{left:6px;top:1px;width:3px;height:3px;background:#fff;box-shadow:7px -5px 0 #79e5ff,13px 6px 0 #c9fbff}

.cosmetic-trail-particle.cosmetic-trail-arcane-drift { --trail:#9b58ff;--trail2:#f4ddff;width:19px;height:19px;border:2px solid rgba(202,122,255,.88);border-radius:50%;box-shadow:0 0 8px #8739ef,inset 0 0 6px #b65cff;animation:trail-arcane-drift 1.32s cubic-bezier(.16,.65,.3,1) forwards; }
.cosmetic-trail-particle.cosmetic-trail-arcane-drift:before{inset:3px;border:1px dashed #f1d5ff;border-radius:50%;animation:trail-arcane-spin .75s linear infinite}.cosmetic-trail-particle.cosmetic-trail-arcane-drift:after{left:50%;top:-5px;width:5px;height:5px;background:#fff;box-shadow:0 0 6px #e6b8ff;transform:translateX(-50%) rotate(45deg)}.cosmetic-trail-particle.cosmetic-trail-arcane-drift>span{left:50%;top:50%;width:2px;height:2px;background:#fff;box-shadow:0 0 8px 3px #8f41e9}

.cosmetic-trail-particle.cosmetic-trail-emerald-echo { --trail:#20dc8b;--trail2:#d9ffeb;width:18px;height:18px;border:2px solid #45e9a3;background:rgba(26,207,126,.08);box-shadow:0 0 9px rgba(34,222,140,.8),inset 0 0 6px rgba(63,237,164,.5);animation:trail-emerald-echo 1.12s cubic-bezier(.15,.7,.28,1) forwards; }
.cosmetic-trail-particle.cosmetic-trail-emerald-echo:before{inset:-7px;border:1px solid rgba(81,246,176,.7);transform:scale(.55)}.cosmetic-trail-particle.cosmetic-trail-emerald-echo:after{inset:4px;background:rgba(177,255,220,.45)}

.cosmetic-trail-particle.cosmetic-trail-solar-ribbon { --trail:#ffc547;--trail2:#fffbd1;width:42px;height:6px;border-radius:80% 20% 80% 20%;background:linear-gradient(90deg,transparent,rgba(255,167,25,.38) 20%,#ffc84a 65%,#fffac0);box-shadow:0 0 8px #ffae22;animation:trail-solar-ribbon 1.02s cubic-bezier(.19,.68,.25,1) forwards; }
.cosmetic-trail-particle.cosmetic-trail-solar-ribbon:before{left:5px;right:2px;top:-5px;height:2px;border-radius:50%;background:linear-gradient(90deg,transparent,#fff0a0);transform:skewY(-12deg)}.cosmetic-trail-particle.cosmetic-trail-solar-ribbon:after{right:1px;top:-5px;width:15px;height:15px;border-radius:50%;background:radial-gradient(circle,#fff 0 12%,#ffd052 28%,rgba(255,191,49,.2) 59%,transparent 65%)}

.cosmetic-trail-particle.cosmetic-trail-void-smoke { --trail:#5f42d6;--trail2:#cfc6ff;width:28px;height:23px;border-radius:47% 53% 58% 42%;background:radial-gradient(ellipse at 40% 45%,rgba(119,86,226,.68),rgba(30,18,73,.75) 45%,rgba(2,1,8,0) 74%);filter:blur(1.5px) drop-shadow(0 0 5px #5333be);animation:trail-void-smoke 1.52s ease-out forwards; }
.cosmetic-trail-particle.cosmetic-trail-void-smoke:before{inset:-8px;border-radius:50%;background:radial-gradient(circle,rgba(9,3,25,.75),transparent 67%);filter:blur(4px)}.cosmetic-trail-particle.cosmetic-trail-void-smoke:after{left:7px;top:6px;width:3px;height:2px;background:#e1d9ff;box-shadow:9px 4px 0 #8e70ff,-5px 8px 0 #6345cf;opacity:.7}

.cosmetic-trail-particle.cosmetic-trail-rose-stardust { --trail:#ff50c5;--trail2:#fff;width:13px;height:13px;background:linear-gradient(135deg,#fff,#ff64c9);clip-path:polygon(50% 0,61% 37%,100% 50%,61% 63%,50% 100%,39% 63%,0 50%,39% 37%);filter:drop-shadow(0 0 5px #ff4fc5);animation:trail-rose-stardust 1.28s ease-out forwards; }
.cosmetic-trail-particle.cosmetic-trail-rose-stardust:after{left:-6px;top:8px;width:7px;height:10px;border-radius:100% 0 100% 0;background:rgba(255,117,204,.88);transform:rotate(35deg)}.cosmetic-trail-particle.cosmetic-trail-rose-stardust>span{left:13px;top:-3px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:5px 8px 0 #ff9ad9,-6px 15px 0 #d95cff}

.cosmetic-trail-particle.cosmetic-trail-storm-stream { --trail:#388fff;--trail2:#fff;width:36px;height:13px;background:linear-gradient(90deg,rgba(38,109,237,.08),#52adff 55%,#fff);clip-path:polygon(0 40%,31% 40%,41% 0,52% 70%,66% 28%,76% 70%,100% 70%,100% 88%,73% 88%,65% 55%,51% 100%,40% 35%,34% 57%,0 57%);filter:drop-shadow(0 0 4px #51b4ff);animation:trail-storm-stream .58s steps(5,end) forwards; }
.cosmetic-trail-particle.cosmetic-trail-storm-stream:after{right:2px;top:2px;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 9px 3px #4aa8ff}.cosmetic-trail-particle.cosmetic-trail-storm-stream>span{left:3px;top:-4px;width:20px;height:1px;background:#bdeeff;transform:rotate(-11deg)}

.cosmetic-trail-particle.cosmetic-trail-crimson-phantom { --trail:#ff304b;--trail2:#ffd2d8;width:22px;height:22px;border:2px solid rgba(255,61,82,.9);background:linear-gradient(135deg,rgba(255,78,92,.22),rgba(78,0,12,.12));box-shadow:0 0 10px rgba(255,35,63,.8),inset 0 0 8px rgba(255,62,82,.5);animation:trail-crimson-phantom 1.08s cubic-bezier(.2,.7,.25,1) forwards; }
.cosmetic-trail-particle.cosmetic-trail-crimson-phantom:before{inset:4px;border:1px solid rgba(255,187,191,.55)}.cosmetic-trail-particle.cosmetic-trail-crimson-phantom:after{left:50%;bottom:-8px;width:2px;height:8px;background:#ff6674;transform:translateX(-50%)}

.cosmetic-trail-particle.cosmetic-trail-atlas-spectrum { --trail:#33e1ff;--trail2:#ff63dc;width:40px;height:8px;background:linear-gradient(90deg,transparent,#38e5ff 27%,#7770ff 49%,#ff54c9 70%,#ffd457 91%,#fff);clip-path:polygon(0 40%,78% 0,100% 50%,78% 100%,0 60%);filter:drop-shadow(0 0 5px rgba(90,218,255,.85));animation:trail-atlas-spectrum 1.08s ease-out forwards; }
.cosmetic-trail-particle.cosmetic-trail-atlas-spectrum:before{left:8px;top:-8px;width:13px;height:13px;background:linear-gradient(135deg,#49e8ff,#ff59ca);clip-path:polygon(50% 0,100% 100%,0 100%);opacity:.8}.cosmetic-trail-particle.cosmetic-trail-atlas-spectrum:after{left:18px;top:5px;width:10px;height:10px;background:linear-gradient(135deg,#ffd35b,#746fff);clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(180deg)}.cosmetic-trail-particle.cosmetic-trail-atlas-spectrum>span{right:1px;top:1px;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 7px #fff}

.cosmetic-trail-particle.cosmetic-trail-clockwork-path{--trail:#d4a34d;--trail2:#fff0b0;width:19px;height:19px;border:3px dotted #dfb45f;border-radius:50%;background:radial-gradient(circle,#fff1b0 0 12%,#684016 15% 36%,#c6923f 39% 49%,transparent 52%);filter:drop-shadow(0 0 4px rgba(211,158,67,.8));animation:trail-clockwork-path 1.12s cubic-bezier(.15,.7,.24,1) forwards}
.cosmetic-trail-particle.cosmetic-trail-clockwork-path:before{inset:-5px;border:2px dashed rgba(255,218,132,.65);border-radius:50%}.cosmetic-trail-particle.cosmetic-trail-clockwork-path:after{right:-5px;bottom:-4px;width:4px;height:4px;border-radius:50%;background:#fff0a8;box-shadow:-14px 22px 0 -1px #aa6a25,7px 15px 0 -1px #e7b959}.cosmetic-trail-particle.cosmetic-trail-clockwork-path>span{left:50%;top:-7px;width:2px;height:7px;background:#e8bb61;box-shadow:0 26px 0 #e8bb61;transform:translateX(-50%)}

.cosmetic-trail-particle.cosmetic-trail-tidal-wake{--trail:#2bcde9;--trail2:#eaffff;width:31px;height:17px;border:0;border-bottom:4px solid #62e5f5;border-radius:0 0 60% 60%;background:radial-gradient(ellipse at 50% 100%,rgba(32,169,219,.46),transparent 67%);filter:drop-shadow(0 0 5px #42d6ed);animation:trail-tidal-wake 1.2s ease-out forwards}
.cosmetic-trail-particle.cosmetic-trail-tidal-wake:before{left:5px;bottom:-8px;width:22px;height:11px;border-bottom:2px solid rgba(209,255,255,.82);border-radius:50%}.cosmetic-trail-particle.cosmetic-trail-tidal-wake:after{right:4px;top:-3px;width:6px;height:9px;border-radius:60% 45% 55% 45%;background:#dfffff;box-shadow:-14px 7px 0 -1px #69e2f3,7px 12px 0 -2px #1eaeda}.cosmetic-trail-particle.cosmetic-trail-tidal-wake>span{left:2px;right:2px;bottom:1px;height:3px;background:linear-gradient(90deg,transparent,#fff,transparent);border-radius:50%}

.cosmetic-trail-particle.cosmetic-trail-neon-circuit{--trail:#2effad;--trail2:#effff9;width:38px;height:18px;border-left:2px solid #39f8ae;border-bottom:2px solid #39f8ae;background:linear-gradient(90deg,transparent 0 72%,rgba(53,255,181,.22));clip-path:polygon(0 72%,32% 72%,32% 30%,68% 30%,68% 62%,100% 62%,100% 100%,54% 100%,54% 55%,46% 55%,46% 100%,0 100%);filter:drop-shadow(0 0 4px #35f8ae);animation:trail-neon-circuit .92s steps(7,end) forwards}
.cosmetic-trail-particle.cosmetic-trail-neon-circuit:before{left:10px;top:3px;width:5px;height:5px;border:1px solid #dffff3;background:#087956;box-shadow:20px 7px 0 -1px #baffdf}.cosmetic-trail-particle.cosmetic-trail-neon-circuit:after{right:-2px;bottom:-2px;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 8px #41ffb8}.cosmetic-trail-particle.cosmetic-trail-neon-circuit>span{left:0;bottom:0;width:7px;height:2px;background:#fff;box-shadow:0 0 5px #fff}

.cosmetic-trail-particle.cosmetic-trail-starbound-course{--trail:#75d8ff;--trail2:#fff7c8;width:39px;height:5px;border-radius:50%;background:linear-gradient(90deg,transparent,rgba(82,187,255,.38) 35%,#c8eeff 76%,#fff);filter:drop-shadow(0 0 5px #6ed5ff);animation:trail-starbound-course 1.28s cubic-bezier(.17,.68,.25,1) forwards}
.cosmetic-trail-particle.cosmetic-trail-starbound-course:before{right:-5px;top:-6px;width:16px;height:16px;background:linear-gradient(135deg,#fff,#ffeaa2);clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);box-shadow:0 0 8px #fff}.cosmetic-trail-particle.cosmetic-trail-starbound-course:after{left:3px;top:-9px;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:9px 15px 0 #9be8ff,17px -3px 0 #fff2a8,26px 12px 0 #c3a6ff}.cosmetic-trail-particle.cosmetic-trail-starbound-course>span{left:-4px;top:-5px;width:24px;height:15px;border-top:1px dotted rgba(196,235,255,.7);transform:rotate(-8deg)}

.cosmetic-trail-particle.cosmetic-trail-obsidian-rift{--trail:#7532a4;--trail2:#eac8ff;width:35px;height:17px;background:linear-gradient(90deg,transparent,rgba(77,25,105,.38) 28%,#16071e 59%,#7e3ba5 82%,#e4b9f5);clip-path:polygon(0 43%,24% 35%,31% 0,43% 46%,56% 18%,64% 61%,79% 36%,100% 50%,77% 65%,64% 100%,55% 69%,40% 91%,31% 58%,0 62%);filter:drop-shadow(0 0 6px #722c97);animation:trail-obsidian-rift 1.08s ease-out forwards}
.cosmetic-trail-particle.cosmetic-trail-obsidian-rift:before{left:13px;top:-8px;width:8px;height:14px;background:linear-gradient(90deg,#08020c,#a862c6);clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(-24deg)}.cosmetic-trail-particle.cosmetic-trail-obsidian-rift:after{left:24px;top:9px;width:7px;height:12px;background:#17071d;clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(148deg);box-shadow:0 0 5px #8135a9}.cosmetic-trail-particle.cosmetic-trail-obsidian-rift>span{left:8px;top:7px;width:22px;height:2px;background:#d89cef;box-shadow:0 0 7px #8a3cac}

.account-trail-demo.cosmetic-trail-ember-wake{--trail:#ff6818;--trail2:#ffe3a0}.account-trail-demo.cosmetic-trail-frost-comet{--trail:#56ddff;--trail2:#efffff}.account-trail-demo.cosmetic-trail-arcane-drift{--trail:#9b58ff;--trail2:#f4ddff}.account-trail-demo.cosmetic-trail-emerald-echo{--trail:#20dc8b;--trail2:#d9ffeb}.account-trail-demo.cosmetic-trail-solar-ribbon{--trail:#ffc547;--trail2:#fffbd1}.account-trail-demo.cosmetic-trail-void-smoke{--trail:#5f42d6;--trail2:#cfc6ff}.account-trail-demo.cosmetic-trail-rose-stardust{--trail:#ff50c5;--trail2:#fff}.account-trail-demo.cosmetic-trail-storm-stream{--trail:#388fff;--trail2:#fff}.account-trail-demo.cosmetic-trail-crimson-phantom{--trail:#ff304b;--trail2:#ffd2d8}.account-trail-demo.cosmetic-trail-atlas-spectrum{--trail:#33e1ff;--trail2:#ff63dc}.account-trail-demo.cosmetic-trail-clockwork-path{--trail:#d4a34d;--trail2:#fff0b0}.account-trail-demo.cosmetic-trail-tidal-wake{--trail:#2bcde9;--trail2:#eaffff}.account-trail-demo.cosmetic-trail-neon-circuit{--trail:#2effad;--trail2:#effff9}.account-trail-demo.cosmetic-trail-starbound-course{--trail:#75d8ff;--trail2:#fff7c8}.account-trail-demo.cosmetic-trail-obsidian-rift{--trail:#7532a4;--trail2:#eac8ff}

.trail-variant-1{--trail-scale:.92}.trail-variant-2{--trail-scale:1.08}.trail-variant-3{--trail-scale:.78}
@keyframes trail-ember-wake{0%{opacity:.95;transform:translate(-50%,-50%) rotate(calc(var(--trail-angle) + 90deg)) scale(var(--trail-scale))}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx) + var(--trail-side)),calc(-50% + var(--trail-dy) - 18px)) rotate(calc(var(--trail-angle) + 74deg)) scale(.18,1.25);filter:blur(2px)}}
@keyframes trail-frost-comet{0%{opacity:1;transform:translate(-92%,-50%) rotate(var(--trail-angle)) scale(var(--trail-scale))}100%{opacity:0;transform:translate(calc(-92% + var(--trail-dx)),calc(-50% + var(--trail-dy) + var(--trail-side))) rotate(var(--trail-angle)) scale(.12,.48);filter:blur(1px)}}
@keyframes trail-arcane-drift{0%{opacity:.95;transform:translate(-50%,-50%) rotate(0) scale(var(--trail-scale))}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx) + var(--trail-side)),calc(-50% + var(--trail-dy) - 8px)) rotate(var(--trail-spin-angle)) scale(.35)}}
@keyframes trail-arcane-spin{to{transform:rotate(360deg)}}
@keyframes trail-emerald-echo{0%{opacity:.78;transform:translate(-50%,-50%) rotate(45deg) scale(.45)}45%{opacity:.55}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx)),calc(-50% + var(--trail-dy))) rotate(45deg) scale(1.65)}}
@keyframes trail-solar-ribbon{0%{opacity:.95;transform:translate(-92%,-50%) rotate(var(--trail-angle)) skewY(-4deg) scale(var(--trail-scale))}55%{transform:translate(calc(-92% + var(--trail-half-dx)),calc(-50% + var(--trail-half-dy) + var(--trail-side))) rotate(calc(var(--trail-angle) + 5deg)) skewY(7deg) scale(.75,1.2)}100%{opacity:0;transform:translate(calc(-92% + var(--trail-dx)),calc(-50% + var(--trail-dy))) rotate(calc(var(--trail-angle) - 4deg)) scale(.1,.35);filter:blur(1.5px)}}
@keyframes trail-void-smoke{0%{opacity:.72;transform:translate(-50%,-50%) scale(.65)}60%{opacity:.42;transform:translate(calc(-50% + var(--trail-half-dx) + var(--trail-side)),calc(-50% + var(--trail-half-dy) - 8px)) rotate(var(--trail-spin-short)) scale(1.4)}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx)),calc(-50% + var(--trail-dy) - 15px)) rotate(var(--trail-spin-long)) scale(2.1);filter:blur(7px)}}
@keyframes trail-rose-stardust{0%{opacity:1;transform:translate(-50%,-50%) rotate(0) scale(var(--trail-scale))}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx) + var(--trail-side)),calc(-50% + var(--trail-dy) + 13px)) rotate(var(--trail-spin-angle)) scale(.2);filter:blur(.8px)}}
@keyframes trail-storm-stream{0%,18%,42%{opacity:1;transform:translate(-93%,-50%) rotate(var(--trail-angle)) scale(var(--trail-scale))}10%,31%{opacity:.25;transform:translate(calc(-93% + 3px),calc(-50% - 2px)) rotate(calc(var(--trail-angle) + 2deg)) scale(1.1)}100%{opacity:0;transform:translate(calc(-93% + var(--trail-dx)),calc(-50% + var(--trail-dy))) rotate(var(--trail-angle)) scaleX(.15)}}
@keyframes trail-crimson-phantom{0%{opacity:.7;transform:translate(-50%,-90%) rotate(45deg) scale(.92)}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx)),calc(-90% + var(--trail-dy))) rotate(45deg) scale(1.65);filter:blur(2px)}}
@keyframes trail-atlas-spectrum{0%{opacity:.95;transform:translate(-94%,-50%) rotate(var(--trail-angle)) scale(var(--trail-scale));filter:hue-rotate(0deg) drop-shadow(0 0 5px #45dfff)}100%{opacity:0;transform:translate(calc(-94% + var(--trail-dx)),calc(-50% + var(--trail-dy) + var(--trail-side))) rotate(var(--trail-angle)) scale(.15,.5);filter:hue-rotate(240deg) drop-shadow(0 0 2px #ff5ac8)}}
@keyframes trail-clockwork-path{0%{opacity:.95;transform:translate(-50%,-50%) rotate(0) scale(var(--trail-scale))}100%{opacity:0;transform:translate(calc(-50% + var(--trail-dx)),calc(-50% + var(--trail-dy))) rotate(var(--trail-spin-angle)) scale(.45);filter:sepia(1) blur(1px)}}
@keyframes trail-tidal-wake{0%{opacity:.9;transform:translate(-80%,-50%) rotate(var(--trail-angle)) scale(.55,var(--trail-scale))}55%{opacity:.68;transform:translate(calc(-80% + var(--trail-half-dx)),calc(-50% + var(--trail-half-dy) + var(--trail-side))) rotate(var(--trail-angle)) scale(1.25,.9)}100%{opacity:0;transform:translate(calc(-80% + var(--trail-dx)),calc(-50% + var(--trail-dy) + 9px)) rotate(var(--trail-angle)) scale(1.7,.22);filter:blur(2px)}}
@keyframes trail-neon-circuit{0%,24%,49%{opacity:.9;transform:translate(-88%,-50%) rotate(var(--trail-angle)) scale(var(--trail-scale))}12%,37%{opacity:.35}100%{opacity:0;transform:translate(calc(-88% + var(--trail-dx)),calc(-50% + var(--trail-dy))) rotate(var(--trail-angle)) scale(.25);filter:blur(1px)}}
@keyframes trail-starbound-course{0%{opacity:1;transform:translate(-94%,-50%) rotate(var(--trail-angle)) scale(var(--trail-scale))}70%{opacity:.52}100%{opacity:0;transform:translate(calc(-94% + var(--trail-dx) + var(--trail-side)),calc(-50% + var(--trail-dy) - 11px)) rotate(calc(var(--trail-angle) - 8deg)) scale(.12,.4);filter:blur(1px)}}
@keyframes trail-obsidian-rift{0%{opacity:.9;transform:translate(-88%,-50%) rotate(var(--trail-angle)) scale(.6,var(--trail-scale))}45%{opacity:.78;transform:translate(calc(-88% + var(--trail-half-dx)),calc(-50% + var(--trail-half-dy))) rotate(var(--trail-angle)) scale(1.1)}100%{opacity:0;transform:translate(calc(-88% + var(--trail-dx)),calc(-50% + var(--trail-dy) + var(--trail-side))) rotate(calc(var(--trail-angle) + 9deg)) scale(1.45,.08);filter:blur(2px)}}

@media(max-width:800px){.profile-main .account-diamond-level{--diamond-size:54px;--diamond-frame-size:92px;--diamond-effect-scale:.818;--diamond-label-size:27px}.account-party-track{gap:10px}.account-party-member{width:62px;flex-basis:62px}.account-diamond-party{--diamond-size:42px;--diamond-frame-size:71px;--diamond-effect-scale:.636;--diamond-label-size:15px}.account-party-member>.account-party-name{top:51px}.account-social-row .account-diamond-social{--diamond-size:40px;--diamond-frame-size:68px;--diamond-effect-scale:.606;--diamond-label-size:14px}.account-invite-friend-row .account-diamond-social{--diamond-size:38px;--diamond-frame-size:65px;--diamond-effect-scale:.576;--diamond-label-size:13px}}
@media(max-width:620px){.account-party-track{gap:9px}.account-party-member{width:56px;flex-basis:56px}.account-diamond-party{--diamond-size:38px;--diamond-frame-size:65px;--diamond-effect-scale:.576;--diamond-label-size:14px;--diamond-crown-size:17px;--diamond-crown-icon-size:12px}.account-party-member>.account-party-name{top:45px}.account-diamond-pregame{--diamond-size:37px;--diamond-frame-size:63px;--diamond-effect-scale:.561;--diamond-label-size:15px}.victory-diamond-row{--diamond-size:44px;--diamond-frame-size:75px;--diamond-effect-scale:.667;--diamond-label-size:14px}.victory-diamond-winner{--diamond-size:86px;--diamond-frame-size:146px;--diamond-effect-scale:1.303;--diamond-label-size:30px}.victory-diamond-final{--diamond-size:62px;--diamond-frame-size:105px;--diamond-effect-scale:.939;--diamond-label-size:22px}.victory-diamond-credit{--diamond-size:44px;--diamond-frame-size:75px;--diamond-label-size:14px}}
@media(max-width:800px){.account-level-wrap.compact .account-diamond-level{--diamond-size:43px;--diamond-frame-size:73px;--diamond-effect-scale:.652;--diamond-label-size:16px;--diamond-crown-size:16px;--diamond-crown-icon-size:11px}}

@media (prefers-reduced-motion: reduce) {
  .cosmetic-trail-particle { animation:none !important; }
  .cosmetic-trail-particle { display:none; }
}