:root{color-scheme:dark;--white:#fff;--muted:rgba(255,255,255,.7);--dim:rgba(255,255,255,.45);--glass:rgba(8,8,10,.36);--glass-line:rgba(255,255,255,.12);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
html{min-height:100%;cursor:url("assets/cursor.png") 8 8,auto}
body{min-height:100vh;min-height:100svh;margin:0;overflow:hidden;background:#050505;color:var(--white);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a,input{cursor:inherit}button{font:inherit}svg{display:block;width:1.2em;height:1.2em;fill:currentColor}
.background{position:fixed;inset:-2%;z-index:-4;width:104%;height:104%;object-fit:cover;filter:saturate(1.12) contrast(1.08) brightness(.76);opacity:1;transform:scale(1.025);transition:filter 1.2s ease,transform 12s linear,opacity .22s ease}.background.is-switching{opacity:.12}
body.is-entered .background{filter:saturate(1.15) contrast(1.1) brightness(.82);transform:scale(1.06)}
body.is-entered.scene-alt .background{filter:saturate(.86) contrast(1.2) brightness(.7) hue-rotate(36deg)}
.background-vignette{position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(circle at 50% 42%,transparent 0 14rem,rgba(0,0,0,.12) 31rem,rgba(0,0,0,.66) 100%),linear-gradient(180deg,rgba(0,0,0,.15),transparent 38%,rgba(0,0,0,.36))}
.grain{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.72'/%3E%3C/svg%3E")}
.particles{position:fixed;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity 1.2s .25s ease}body.is-entered .particles{opacity:.72}
.cursor-light{position:fixed;left:0;top:0;z-index:-1;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(90,174,255,.1),rgba(136,76,255,.045) 34%,transparent 70%);filter:blur(12px);pointer-events:none;opacity:0;transform:translate3d(calc(var(--mouse-x,50vw) - 50%),calc(var(--mouse-y,50vh) - 50%),0);transition:opacity .5s ease}body.is-entered .cursor-light{opacity:1}
.scanlines{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.025;background:repeating-linear-gradient(180deg,transparent 0,transparent 3px,#fff 4px)}
.cursor-ring,.cursor-dot{position:fixed;left:0;top:0;z-index:30;border-radius:50%;pointer-events:none;opacity:0;will-change:transform}.cursor-ring{width:30px;height:30px;border:1px solid rgba(255,255,255,.48);box-shadow:0 0 18px rgba(115,180,255,.22);transition:width .18s,height .18s,border-color .18s,background .18s,opacity .25s}.cursor-dot{width:4px;height:4px;background:#fff;box-shadow:0 0 8px #fff;transition:opacity .25s}body.is-entered .cursor-ring,body.is-entered .cursor-dot{opacity:1}.cursor-ring.is-hovering{width:46px;height:46px;border-color:rgba(255,255,255,.8);background:rgba(255,255,255,.055)}
.click-wave{position:fixed;z-index:29;width:12px;height:12px;border:1px solid rgba(255,255,255,.8);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%) scale(.25);animation:click-wave .62s var(--ease) forwards}

.entry{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#050505;transition:opacity .72s var(--ease),visibility .72s}
.entry::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.035),transparent 34%);pointer-events:none}
.entry.is-hidden{visibility:hidden;opacity:0;pointer-events:none}
.entry.is-hidden .entry__button{transform:scale(1.15);filter:blur(8px)}
.entry__glow{position:absolute;width:190px;height:60px;border-radius:50%;background:rgba(255,255,255,.12);filter:blur(46px);animation:breathe 2.6s ease-in-out infinite}
.entry__button{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:11px;border:0;padding:30px;background:transparent;color:#fff;text-shadow:0 0 22px rgba(255,255,255,.38);transition:transform .25s ease,opacity .25s ease}
.entry__button span{font-size:clamp(1.4rem,3.3vw,2rem);font-weight:700;letter-spacing:-.035em}
.entry__button small{color:rgba(255,255,255,.35);font-size:.62rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.entry__button:hover{transform:scale(1.035)}

.volume{position:fixed;top:max(18px,env(safe-area-inset-top));left:max(18px,env(safe-area-inset-left));z-index:5;display:flex;align-items:center;gap:9px;width:150px;padding:8px 11px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(4,4,5,.32);box-shadow:0 8px 30px rgba(0,0,0,.22);backdrop-filter:blur(14px);opacity:0;transform:translateY(-10px);transition:opacity .5s .4s ease,transform .5s .4s var(--ease),background .2s}
body.is-entered .volume{opacity:1;transform:none}.volume:hover{background:rgba(4,4,5,.5)}
.volume__button{display:grid;place-items:center;width:23px;height:23px;flex:none;border:0;padding:0;background:transparent;color:#fff}.volume__button svg{width:20px;height:20px}.icon-muted{display:none}.volume.is-muted .icon-volume{display:none}.volume.is-muted .icon-muted{display:block}
.volume__track{position:relative;display:flex;width:100%}.volume__range{width:100%;height:3px;margin:0;appearance:none;border-radius:10px;outline:0;background:linear-gradient(90deg,#fff 0 70%,rgba(255,255,255,.25) 70%)}.volume__range::-webkit-slider-thumb{width:10px;height:10px;appearance:none;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.08)}.volume__range::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:#fff}
.equalizer{display:flex;align-items:flex-end;gap:2px;width:15px;height:15px}.equalizer i{width:2px;height:4px;border-radius:2px;background:rgba(255,255,255,.8);animation:eq .72s ease-in-out infinite alternate}.equalizer i:nth-child(2){height:10px;animation-delay:-.5s}.equalizer i:nth-child(3){height:7px;animation-delay:-.25s}.equalizer i:nth-child(4){height:12px;animation-delay:-.62s}.volume.is-muted .equalizer i{height:3px;animation-play-state:paused;opacity:.35}
.scene-toggle{position:fixed;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));z-index:5;display:flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(4,4,5,.32);box-shadow:0 8px 30px rgba(0,0,0,.22);color:rgba(255,255,255,.7);backdrop-filter:blur(14px);opacity:0;transform:translateY(-10px);transition:opacity .5s .45s,transform .5s .45s var(--ease),color .2s,background .2s}.scene-toggle svg{width:16px;height:16px}.scene-toggle span{font-size:.62rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase}.scene-toggle:hover{color:#fff;background:rgba(4,4,5,.55)}.scene-toggle:disabled{pointer-events:none;color:rgba(255,255,255,.35)}.scene-toggle.is-loading svg{animation:spin .75s linear infinite}body.is-entered .scene-toggle{opacity:1;transform:none}

.shell{position:relative;display:grid;min-height:100vh;min-height:100svh;place-items:center;padding:38px 18px}
.profile{--rx:0deg;--ry:0deg;--shine-x:50%;--shine-y:50%;position:relative;width:min(100%,440px);display:flex;flex-direction:column;align-items:center;padding:34px 32px 28px;border:1px solid transparent;border-radius:28px;text-align:center;opacity:0;transform:perspective(900px) translateY(18px) scale(.985) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:opacity .75s .18s var(--ease),transform .75s .18s var(--ease),background .4s,border-color .4s,box-shadow .4s}
body.is-entered .profile{opacity:1;transform:none}
.profile:hover{border-color:rgba(255,255,255,.1);background:linear-gradient(145deg,rgba(10,10,12,.2),rgba(10,10,12,.06));box-shadow:0 30px 80px rgba(0,0,0,.15);backdrop-filter:blur(4px);transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry))}
.profile__shine{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s}.profile__shine::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--shine-x) var(--shine-y),rgba(255,255,255,.13),transparent 38%)}.profile:hover .profile__shine{opacity:1}
.avatar-wrap,.name-row,.eyebrow,.role,.location,.discord,.socials{opacity:0;transform:translateY(12px)}body.is-entered .avatar-wrap{animation:reveal .7s .28s var(--ease) forwards}body.is-entered .name-row{animation:reveal .65s .36s var(--ease) forwards}body.is-entered .eyebrow{animation:reveal .6s .42s var(--ease) forwards}body.is-entered .role{animation:reveal .6s .47s var(--ease) forwards}body.is-entered .location{animation:reveal .6s .52s var(--ease) forwards}body.is-entered .discord{animation:reveal .7s .58s var(--ease) forwards}body.is-entered .socials{animation:reveal .7s .66s var(--ease) forwards}
.profile__halo{position:absolute;top:18px;width:175px;height:175px;border-radius:50%;background:conic-gradient(from 90deg,rgba(55,255,230,.32),rgba(145,86,255,.42),rgba(255,255,255,.12),rgba(55,255,230,.32));filter:blur(34px);opacity:.33;pointer-events:none;animation:halo 7s linear infinite}
.avatar-wrap{position:relative;isolation:isolate}.avatar-wrap::before{content:"";position:absolute;inset:-4px;z-index:-1;border-radius:50%;background:conic-gradient(from 25deg,#55f2e5,#966aff,#fff,#55f2e5);filter:blur(1px);animation:spin 7s linear infinite}
.avatar{display:block;width:118px;aspect-ratio:1;border:3px solid rgba(8,8,10,.86);border-radius:50%;object-fit:cover;object-position:center 31%;box-shadow:0 8px 35px rgba(0,0,0,.45),0 0 25px rgba(107,92,255,.32)}
.avatar-status{position:absolute;right:4px;bottom:7px;width:17px;height:17px;border:3px solid #101013;border-radius:50%;background:#28d46f;box-shadow:0 0 12px rgba(40,212,111,.7)}
.name-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px}
h1{position:relative;margin:0;color:#fff;font-family:"Playfair Display",Georgia,serif;font-size:clamp(2.35rem,7vw,3.1rem);font-weight:700;line-height:.96;letter-spacing:-.04em;text-shadow:0 2px 4px rgba(0,0,0,.85),0 0 15px rgba(255,255,255,.45)}
.name-effect{isolation:isolate}.name-effect::before{content:attr(data-text);position:absolute;inset:0;z-index:-1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.4);text-shadow:-3px 0 11px rgba(0,255,232,.68),3px 0 11px rgba(142,78,255,.7);animation:glitch 1.7s steps(2,end) infinite}.name-effect::after{content:"✦  ·  ✧";position:absolute;inset:-18px -45px;z-index:-1;color:rgba(255,255,255,.65);font-family:Inter,sans-serif;font-size:12px;letter-spacing:35px;opacity:.78;filter:drop-shadow(0 0 5px #fff);animation:sparkle 2.8s ease-in-out infinite}
.verified{display:grid;width:19px;height:19px;place-items:center;color:#fff;filter:drop-shadow(0 0 5px rgba(255,255,255,.75))}.verified svg{width:19px;height:19px}
.eyebrow{margin-top:8px;color:rgba(255,255,255,.38);font-size:.55rem;font-weight:700;letter-spacing:.21em}
.role{max-width:420px;margin:7px 0 0;color:#fff;font-size:clamp(.92rem,2.2vw,1.04rem);font-weight:600;line-height:1.45;text-wrap:balance;text-shadow:0 2px 4px rgba(0,0,0,.85)}
.role__accent{background:linear-gradient(90deg,#fff,#a9f8ff 48%,#c7b4ff);background-size:180% auto;color:transparent;background-clip:text;-webkit-background-clip:text;animation:text-flow 4s linear infinite}
.location{display:inline-flex;align-items:center;gap:6px;margin:19px 0 24px;color:var(--muted);font-size:.82rem;font-weight:500;text-decoration:none;text-shadow:0 2px 4px #000;transition:color .18s,transform .18s}.location svg{width:16px;height:16px}.location:hover{color:#fff;transform:translateY(-1px)}

.discord{position:relative;display:flex;align-items:center;width:min(100%,330px);min-height:82px;gap:13px;padding:10px 12px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:linear-gradient(115deg,rgba(255,255,255,.105),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 17px 40px rgba(0,0,0,.27);backdrop-filter:blur(15px);transition:transform .22s var(--ease),border-color .22s,background .22s}.discord:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.17);background:linear-gradient(115deg,rgba(255,255,255,.13),rgba(255,255,255,.05))}
.discord__avatar{position:relative;flex:none}.discord__avatar img{display:block;width:60px;aspect-ratio:1;border:2px solid rgba(255,214,60,.9);border-radius:15px;object-fit:cover;object-position:center 31%}.discord__avatar span{position:absolute;right:-2px;bottom:0;width:16px;height:16px;border:3px solid #19191b;border-radius:50%;background:#23a55a}
.discord__copy{min-width:0;text-align:left}.discord__name{display:flex;align-items:center;gap:5px}.discord__name strong{font-size:1.04rem;font-weight:600}.rank-img{display:block;width:18px;height:18px;object-fit:contain}.rank-img--orb{width:20px;height:20px}.discord__copy p{display:flex;align-items:center;gap:5px;margin:5px 0 0;color:rgba(255,255,255,.68);font-size:.73rem;white-space:nowrap}.discord__copy p i{width:5px;height:5px;border-radius:50%;background:#23a55a;box-shadow:0 0 6px #23a55a}
.copy-discord{display:grid;width:32px;height:32px;margin-left:auto;place-items:center;border:0;border-radius:10px;background:transparent;color:rgba(255,255,255,.35);opacity:0;transition:opacity .2s,color .2s,background .2s}.discord:hover .copy-discord,.copy-discord:focus-visible{opacity:1}.copy-discord:hover{color:#fff;background:rgba(255,255,255,.08)}.copy-discord svg{width:16px;height:16px}

.socials{display:flex;justify-content:center;gap:9px;margin-top:24px}.social{position:relative;display:grid;width:38px;height:38px;place-items:center;border:1px solid rgba(255,255,255,.15);border-radius:12px;color:#fff;text-decoration:none;box-shadow:0 9px 24px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.12);transition:transform .2s var(--ease),filter .2s,box-shadow .2s}.social svg{width:22px;height:22px}.social span{position:absolute;bottom:-29px;padding:5px 8px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(8,8,9,.75);color:#fff;font-size:.62rem;opacity:0;pointer-events:none;transform:translateY(-3px);backdrop-filter:blur(8px);transition:.18s}.social:hover{transform:translateY(-4px) scale(1.04);filter:brightness(1.1);box-shadow:0 13px 28px rgba(0,0,0,.38)}.social:hover span{opacity:1;transform:none}.social--steam{background:linear-gradient(145deg,#f7f7f7,#c5c5c5);color:#777}.social--youtube{background:linear-gradient(145deg,#ff3131,#d80000)}.social--instagram{background:linear-gradient(145deg,#f15b7b,#b82fc8)}.social--spotify{background:linear-gradient(145deg,#37e778,#13af4b)}.social--email{background:linear-gradient(145deg,#fff,#ccc);color:#888}
.views{position:absolute;left:max(22px,calc(50% - 300px));bottom:max(28px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:7px;color:#fff;font-size:.84rem;font-weight:600;text-shadow:0 2px 5px #000;opacity:0;transform:translateY(8px);transition:opacity .55s .65s,transform .55s .65s}.views svg{width:18px;height:18px}.views small{color:rgba(255,255,255,.48);font-size:.66rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em}body.is-entered .views{opacity:1;transform:none}
.brand{position:absolute;right:max(22px,calc(50% - 300px));bottom:max(29px,env(safe-area-inset-bottom));color:rgba(255,255,255,.45);font-size:.75rem;font-weight:600;letter-spacing:.05em;opacity:0;transition:opacity .55s .7s}.brand span{color:rgba(255,255,255,.2)}body.is-entered .brand{opacity:1}
.toast{position:fixed;left:50%;bottom:30px;z-index:8;padding:10px 15px;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:rgba(8,8,9,.82);box-shadow:0 12px 35px rgba(0,0,0,.35);color:#fff;font-size:.76rem;opacity:0;pointer-events:none;transform:translate(-50%,15px);backdrop-filter:blur(12px);transition:.3s var(--ease)}.toast.show{opacity:1;transform:translate(-50%,0)}

@keyframes breathe{50%{opacity:.45;transform:scale(1.25)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes halo{to{transform:rotate(360deg)}}@keyframes glitch{0%,100%{transform:translate(0);opacity:.6}25%{transform:translate(-1px,1px);opacity:.85}50%{transform:translate(1px,-1px);opacity:.65}75%{transform:translate(1px,1px);opacity:.9}}@keyframes sparkle{0%,100%{opacity:.35;transform:scale(.97)}50%{opacity:.9;transform:scale(1.04)}}@keyframes eq{to{height:14px}}@keyframes reveal{to{opacity:1;transform:none}}@keyframes text-flow{to{background-position:180% center}}@keyframes click-wave{to{opacity:0;transform:translate(-50%,-50%) scale(5.5)}}
@media(max-width:560px){body{overflow-y:auto}.shell{padding:70px 14px 76px}.profile{width:min(100%,375px);padding:28px 20px 24px}.profile:hover{backdrop-filter:none;transform:none}.avatar{width:106px}.location{margin:17px 0 22px}.discord{width:min(100%,320px)}.volume{top:12px;left:12px;width:118px}.equalizer{display:none}.scene-toggle{top:12px;right:12px}.scene-toggle span{display:none}.views{left:18px;bottom:20px}.brand{right:18px;bottom:21px}.social span{display:none}.cursor-light,.cursor-ring,.cursor-dot{display:none}}
@media(max-height:690px) and (min-width:561px){.profile{padding-top:20px;padding-bottom:18px}.avatar{width:92px}.profile__halo{width:130px;height:130px}.location{margin:13px 0 17px}.discord{min-height:70px}.discord__avatar img{width:50px}.socials{margin-top:18px}.views,.brand{bottom:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}.background{transform:none!important}}