@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes rotate-angle{to{--angle:360deg}}@keyframes sweep{0%{left:-150%}20%{left:150%}to{left:150%}}@keyframes pulse-glow{0%{opacity:.2;transform:scale(1)}to{opacity:.6;transform:scale(1.1)}}@keyframes particle-rise{0%{transform:translateY(0) scale(1);opacity:0}20%{opacity:.8}to{transform:translateY(-100px) scale(0);opacity:0}}.avatar-container{position:relative;width:150px;height:150px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}.avatar-content{z-index:10;background:#111;border-radius:50%;width:85%;height:85%;position:relative;overflow:hidden;box-shadow:inset 0 0 20px #000}.avatar-content img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}.avatar-content:before{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(0deg,rgba(0,0,0,.9) 10%,transparent 60%);z-index:2}.cosmetic-shine:after{content:"";position:absolute;top:-50%;left:-150%;width:200%;height:200%;background:linear-gradient(90deg,transparent 40%,rgba(255,255,255,.45) 50%,transparent 60%);animation:sweep 4s infinite;z-index:5}.cosmetic-glow{position:absolute;inset:0;background:radial-gradient(circle,transparent 35%,var(--glow-color) 110%);z-index:4;mix-blend-mode:screen;animation:pulse-glow 2.5s infinite alternate}.back-aura{width:130px;height:130px;background:var(--glow-color);filter:blur(25px);opacity:.3;z-index:1;animation:pulse-glow 4s infinite alternate}.back-aura,.frame-base{position:absolute;border-radius:50%}.frame-base{inset:0;z-index:10;pointer-events:none;background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#334155,#f1f5f9,#94a3b8,#334155) border-box;border:6px solid transparent}.f-aether{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#3b82f6,#93c5fd,#3b82f6) border-box;animation:rotate-angle 3s linear infinite;box-shadow:0 0 20px rgba(59,130,246,.4)}.f-gold{background:linear-gradient(#1a1401,#1a1401) padding-box,conic-gradient(from var(--angle),#78350f,#fde047,#fbbf24,#78350f) border-box;animation:rotate-angle 4s linear infinite;box-shadow:0 0 20px rgba(251,191,36,.4)}.f-silver{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#334155,#f1f5f9,#94a3b8,#334155) border-box;animation:rotate-angle 5s linear infinite}.f-fire{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#b91c1c,#ef4444,#f59e0b,#b91c1c) border-box;animation:rotate-angle 2.5s linear infinite;box-shadow:0 0 30px #b91c1c}.f-void{background:linear-gradient(#000,#000) padding-box,conic-gradient(from var(--angle),#581c87,#a855f7,#000,#581c87) border-box;animation:rotate-angle 3.5s linear infinite;box-shadow:0 0 25px #7e22ce}.f-nature{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#059669,#34d399,#059669) border-box;animation:rotate-angle 4s linear infinite;box-shadow:0 0 25px rgba(16,185,129,.5)}.f-crimson{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#450a0a,#dc2626,#450a0a) border-box;animation:rotate-angle 3s ease-in-out infinite;box-shadow:0 0 20px #991b1b}.f-celestial{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#bfdbfe,#fff,#bfdbfe) border-box;animation:rotate-angle 5s linear infinite;box-shadow:0 0 40px #fff}.f-tech{background:#000 padding-box,conic-gradient(from var(--angle),#0891b2,#22d3ee,#0891b2) border-box;animation:rotate-angle 2s linear infinite;box-shadow:0 0 20px #06b6d4}.f-obsidian{background:linear-gradient(#111,#111) padding-box,conic-gradient(from var(--angle),#000,#444,#111,#000) border-box;animation:rotate-angle 6s linear infinite}.particle-wrap{inset:-20px;z-index:11;pointer-events:none;overflow:hidden}.p-dot,.particle-wrap{position:absolute;border-radius:50%}.p-dot{width:3px;height:3px;background:white;opacity:0;bottom:20%;animation-name:particle-rise;animation-timing-function:ease-out;animation-iteration-count:infinite;animation-duration:2s}.p1{left:30%;animation-delay:0s}.p2{left:60%;animation-delay:.5s}.p3{left:45%;animation-delay:1.2s}.p4{left:75%;animation-delay:1.8s}.p5{left:15%;animation-delay:2.2s}.fire-dots .p-dot{background:#f59e0b;box-shadow:0 0 8px #ef4444;width:2px;height:4px;border-radius:1px}.void-dots .p-dot{background:#a855f7;box-shadow:0 0 8px #7e22ce}.nature-dots .p-dot{background:#34d399;box-shadow:0 0 8px #059669}.aether-dots .p-dot{background:#93c5fd;box-shadow:0 0 8px #3b82f6}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-5px) rotate(-5deg)}75%{transform:translateX(5px) rotate(5deg)}}@keyframes floatUp{0%{transform:translateY(0) scale(.5);opacity:0}20%{opacity:1;transform:translateY(-10px) scale(1.2)}to{transform:translateY(-40px) scale(1);opacity:0}}@keyframes spawn{0%{transform:scale(.3) translateY(-100px);opacity:0}60%{transform:scale(1.1) translateY(10px);opacity:1}to{transform:scale(1) translateY(0)}}@keyframes ripple{0%{transform:scale(0);opacity:.8;border-width:0}to{transform:scale(2.5);opacity:0;border-width:10px}}@keyframes sheen{0%{transform:translateX(-100%) skewX(-15deg)}to{transform:translateX(200%) skewX(-15deg)}}@keyframes destroy{0%{filter:grayscale(0);opacity:1;transform:scale(1)}50%{filter:grayscale(1) contrast(2);transform:scale(.95)}to{filter:grayscale(1);opacity:0;transform:scale(.8)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.animate-shake{animation:shake .4s cubic-bezier(.36,.07,.19,.97) both}.animate-float-up{animation:floatUp 1s ease-out forwards}.animate-spawn{animation:spawn .6s cubic-bezier(.175,.885,.32,1.275) both}.animate-ripple{animation:ripple .8s ease-out forwards}.animate-sheen{animation:sheen 1s ease-in-out forwards}.animate-destroy{animation:destroy 1.5s ease-in-out forwards}