@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--red:#f34c59;--muted:#b5afb4}*{box-sizing:border-box}body{margin:0;background:#100c10;color:#faf7f9;font-family:Manrope,Arial,sans-serif;font-size:16px}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--red);outline-offset:6px}#film,.shade,.grain,#particles{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}#film{object-fit:cover;filter:saturate(.5);z-index:-4}.shade{background:linear-gradient(0deg,rgba(9,8,11,.9),rgba(12,8,12,.38) 60%,rgba(9,8,11,.7)),radial-gradient(ellipse at 50% 45%,transparent,#100a10aa);z-index:-3}.grain{opacity:.09;z-index:5;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}#particles{overflow:hidden;z-index:-1}.particle{position:absolute;width:2px;height:2px;background:#eab9bd;border-radius:50%;animation:drift var(--speed) linear infinite;opacity:0;box-shadow:0 0 10px #e05a61}@keyframes drift{0%{transform:translateY(105vh);opacity:0}20%,75%{opacity:.6}100%{transform:translate(40px,-10vh);opacity:0}}.scene{min-height:100svh;display:flex;flex-direction:column;opacity:0;transition:opacity 1s ease}.entered .scene{opacity:1}header{padding:30px 45px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:20px;font-weight:800;letter-spacing:-1px}.brand span{color:var(--red);padding:0 8px}.header-note{font-size:12px;letter-spacing:3px;color:#c5bac1}.quiet{border:0;background:none;color:#bfb8bd;font-size:12px;padding:10px}.quiet:hover{color:#fff}main{display:grid;place-items:center;flex:1;padding:30px 24px 48px;perspective:1000px}.profile{width:min(100%,620px);position:relative;padding:25px 32px 20px;background:linear-gradient(135deg,#242026b3,#121015d4);border:1px solid #ffffff26;box-shadow:0 30px 100px #0007,inset 0 1px #ffffff0a;border-radius:16px;backdrop-filter:blur(22px);transform:translateY(25px);transition:transform .4s ease;overflow:hidden}.profile:before{content:'';position:absolute;top:0;left:32px;width:90px;height:2px;background:var(--red);box-shadow:0 0 25px var(--red)}.entered .profile{transform:translateY(0)}.card-top,.card-bottom{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:2px;color:#c1b9c0}.card-top b,.card-bottom b{color:var(--red);margin-left:8px}.identity{display:flex;align-items:center;gap:25px;margin:37px 0 33px}.avatar{height:100px;width:100px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font:italic 800 86px/1 'Barlow Condensed',Arial,sans-serif;background:linear-gradient(135deg,#444047,#17141a);border:1px solid #ffffff28;border-radius:24px;box-shadow:0 6px 30px #0005;position:relative;padding-bottom:13px}.avatar>span{color:var(--red)}.avatar i{position:absolute;bottom:-9px;right:-9px;padding:5px 9px;border-radius:6px;background:#ed4555;font:800 12px Manrope,Arial;font-style:normal;letter-spacing:1px}.eyebrow{font-size:13px;color:#d5cbd1;margin:0 0 3px}h1{font:800 clamp(48px,8vw,68px)/1 'Barlow Condensed',Impact,sans-serif;letter-spacing:1px;margin:0;text-shadow:0 0 40px #fff1}h1 span,.red{color:var(--red)}.type-line{font-size:14px;color:#d2c8d0;margin:13px 0 0;min-height:21px}.caret{color:var(--red);animation:blink 1s steps(2) infinite}@keyframes blink{50%{opacity:0}}.divider{display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:2px;color:#aaa0aa;margin-bottom:16px}.divider i{height:1px;background:#ffffff15;flex:1}.socials{display:grid;grid-template-columns:1fr 1fr;gap:12px}.social{display:flex;align-items:center;gap:14px;padding:18px 17px;text-align:left;border:1px solid #ffffff16;background:#ffffff04;border-radius:9px;position:relative;transition:background .25s,border-color .25s,transform .25s;min-width:0}.social:hover{background:#f34c5910;border-color:#f34c5980;transform:translateY(-3px)}.social svg{width:25px;height:25px;fill:currentColor;flex-shrink:0}.social>span{font-size:15px;font-weight:700}.social small{display:block;color:#b5aab3;font-size:12px;margin-top:5px;font-weight:400}.social b{font-size:10px;color:#978c96;margin-left:auto;align-self:flex-start;font-weight:400}.server svg{color:#ff6872}.card-bottom{margin-top:24px;padding-top:17px;border-top:1px solid #ffffff14;font-size:10px}.signature{font-family:Georgia,serif;font-style:italic;font-size:21px;letter-spacing:-1px;color:#d0c5cd}.card-bottom>span:last-child{letter-spacing:1.5px}footer{padding:0 45px 28px;display:flex;justify-content:space-between;align-items:end;gap:20px}.player{width:420px;display:flex;align-items:center;gap:15px;padding:16px 18px;background:#171319ad;border:1px solid #ffffff1a;border-radius:12px;backdrop-filter:blur(20px)}.play{background:#ffffff0c;border:1px solid #ffffff20;border-radius:50%;height:36px;width:36px;flex-shrink:0;font-size:16px}.track{flex:1;min-width:0}.track>span{font-size:13px;font-weight:700;display:block}.track-sub{font-size:9px;letter-spacing:.1px}.track small{display:block;font-size:11px;color:#b6aab4;margin-top:4px}.progress{height:2px;background:#ffffff16;margin-top:10px;overflow:hidden}.progress>div{height:100%;width:0;background:var(--red)}.equalizer{height:20px;display:flex;align-items:center;gap:3px}.equalizer i{width:2px;height:7px;background:var(--red);animation:eq .8s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.3s;height:19px}.equalizer i:nth-child(3){animation-delay:-.6s;height:13px}.equalizer i:nth-child(4){animation-delay:-.2s}@keyframes eq{to{height:3px}}.paused .equalizer i{animation-play-state:paused}.volume{display:flex;align-items:center}.volume .quiet{font-size:19px;padding:5px}input[type=range]{width:55px;accent-color:var(--red);height:3px;cursor:pointer}.footer-mark{font-size:10px;letter-spacing:2px;color:#b6aab4}.entry{position:fixed;inset:0;width:100%;height:100svh;z-index:10;border:0;background:radial-gradient(ellipse at center,#250e1680,#09080bd9);backdrop-filter:blur(12px);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .8s,visibility .8s}.entry-code{font-size:13px;letter-spacing:7px;color:#c3b9c2;margin-bottom:22px}.entry-title{font:800 clamp(75px,18vw,150px)/1 'Barlow Condensed',Impact,sans-serif;letter-spacing:2px;animation:reveal 1.3s ease-out}.entry-cta{margin-top:35px;font-size:12px;letter-spacing:3px;border-bottom:1px solid #ffffff36;padding:0 0 15px}.entry-cta>span{color:var(--red);padding-left:24px}.entry-note{margin-top:26px;font-size:12px;color:#b3a5b0}.entered .entry{opacity:0;visibility:hidden;pointer-events:none}@keyframes reveal{from{opacity:0;transform:translateY(25px);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);padding:12px 22px;background:#f4edf3;color:#20151e;border-radius:8px;opacity:0;pointer-events:none;z-index:20;transition:.3s;max-width:90vw;text-align:center;font-size:14px}.toast.show{opacity:1;transform:translate(-50%,0)}.cursor{position:fixed;width:25px;height:25px;border:1px solid #f34c5980;border-radius:50%;pointer-events:none;z-index:30;transform:translate(-50%,-50%);opacity:0}.reduced *, .reduced *:before{animation:none!important;transition:none!important}.reduced #particles,.reduced .cursor{display:none}.reduced .profile{transform:none!important}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}.cursor,#particles{display:none}}@media(max-width:650px){header{padding:24px}.header-note{display:none}main{padding:22px 18px 32px}.profile{padding:22px}.identity{gap:20px;margin:30px 0}.avatar{width:78px;height:78px;font-size:68px;border-radius:19px}h1{font-size:52px}.type-line{font-size:12px}.social{padding:16px 12px;gap:10px}.social>span{font-size:14px}.social small{font-size:11px}.social b{display:none}footer{padding:0 18px 22px;justify-content:center}.footer-mark{display:none}.player{width:min(100%,440px)}.card-top{font-size:10px}.cursor{display:none}}@media(max-width:370px){.identity{gap:14px}.avatar{width:62px;height:62px;font-size:55px}h1{font-size:44px}.socials{grid-template-columns:1fr}.track-sub{display:none}.volume input{width:35px}}@media(max-height:740px) and (min-width:651px){header{padding-top:20px;padding-bottom:12px}main{padding:16px}.identity{margin:22px 0}.profile{padding-top:20px}.card-bottom{margin-top:16px}.player{padding:12px 16px}}
/* Crimson motion edition */
@property --edge-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.ambient{position:fixed;inset:-20%;pointer-events:none;z-index:-2;background:radial-gradient(ellipse at 20% 35%,#e3133926,transparent 40%),radial-gradient(ellipse at 85% 70%,#970a2033,transparent 40%);animation:ambient-drift 16s ease-in-out infinite alternate}.pointer-glow{position:fixed;left:0;top:0;width:0;height:0;pointer-events:none;z-index:0}.pointer-glow:after{content:'';position:absolute;width:420px;height:420px;left:-210px;top:-210px;background:radial-gradient(circle,#ef244115,transparent 68%)}header,main,footer{position:relative;z-index:1}.profile{width:min(100%,650px);padding:25px 32px 20px;background:linear-gradient(130deg,#201820db,#100b12e8);border-color:#ef51653d;box-shadow:0 30px 100px #0008,0 0 70px #e3233815;overflow:visible;isolation:isolate}.profile:before{inset:-1px;width:auto;height:auto;border-radius:16px;padding:1px;background:conic-gradient(from var(--edge-angle),#ff4c6710 15%,#ff4c67bb 25%,#ffaeae 27%,#ff4c6710 40%,#ff4c6710 65%,#ff4c6790 80%,#ff4c6710 95%);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;box-shadow:none;pointer-events:none;animation:border-orbit 9s linear infinite}.profile:after{content:'';position:absolute;inset:0;border-radius:16px;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 15% 0,#e13c4215,transparent 60%);animation:card-glow 5s ease-in-out infinite alternate}.identity{margin:28px 0}.avatar{width:110px;height:110px;border-radius:0;padding:0;display:block;background:#0a080d;border:1px solid #ff768a88;box-shadow:0 0 0 5px #f4445510,0 0 35px #ea2a4045;animation:avatar-glow 4s ease-in-out infinite alternate}.avatar video{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:1;border-radius:0}.avatar i{z-index:2;bottom:-10px;right:-10px;border-radius:3px}.name h1{position:relative;background:linear-gradient(110deg,#fff 20%,#d1bdc9 35%,#fff 45%,#ff8d9d 50%,#fff 58%,#d1bdc9 80%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:name-shine 8s ease-in-out infinite;text-shadow:0 0 35px #ff547825}.name h1 span{color:var(--red)}.name .eyebrow{letter-spacing:1px}.type-line{white-space:nowrap}.socials{grid-template-columns:1fr 1fr;gap:11px}.social{overflow:hidden;background:radial-gradient(180px circle at var(--mx,0px) var(--my,0px),#ff3d5712,transparent 70%),#ffffff04;transition:transform .3s,border-color .3s,box-shadow .3s}.social:hover{box-shadow:0 8px 30px #ee2c4420;transform:translateY(-4px);border-color:#ff748694;background-color:#fb3b5910}.social:after{content:'';position:absolute;inset:0;transform:translateX(-150%) skewX(-20deg);background:linear-gradient(90deg,transparent,#fff1,transparent);pointer-events:none;animation:link-sheen 9s ease-in-out infinite}.social:nth-child(2):after{animation-delay:1s}.social:nth-child(3):after{animation-delay:2s}.social:nth-child(4):after{animation-delay:3s}.discord{grid-column:1/-1;padding-top:13px;padding-bottom:13px}.discord>span{display:flex;align-items:center;gap:15px}.discord small{margin-top:0}.server{grid-column:1/-1;min-height:110px;background:linear-gradient(105deg,#3d1026a0,#1b0d16);border-color:#e8475e45;padding:10px 22px;gap:23px}.server-logo{width:128px;height:106px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 0 13px #f023424a);animation:logo-float 4.5s ease-in-out infinite}.server>span{font-size:22px;letter-spacing:.2px}.server small{font-size:12px}.server em{display:block;font-size:9px;letter-spacing:2px;color:#ff8f9e;font-style:normal;margin-top:12px}.server b{padding-top:10px}.entered .identity{animation:rise-in .8s .1s both}.entered .social{animation:rise-in .65s both}.entered .social:nth-child(1){animation-delay:.18s}.entered .social:nth-child(2){animation-delay:.28s}.entered .social:nth-child(3){animation-delay:.38s}.entered .social:nth-child(4){animation-delay:.48s}.entered .player{animation:rise-in .8s .6s both}.card-top b,.card-bottom b{display:inline-block;animation:star-turn 12s linear infinite}.entry-title{text-shadow:0 0 60px #e3334825;animation:entry-breathe 4s ease-in-out infinite}.entry-cta{animation:cta-glow 2.5s ease-in-out infinite}.click-ring{position:fixed;width:10px;height:10px;margin:-5px;border:1px solid #ff7088;border-radius:50%;pointer-events:none;z-index:40;animation:click-expand .65s ease-out forwards}.cursor{box-shadow:0 0 15px #ef3e4c30}.reduced .ambient,.reduced .pointer-glow{display:none}
@keyframes border-orbit{to{--edge-angle:360deg}}@keyframes ambient-drift{to{transform:translate(5%,-4%) scale(1.1)}}@keyframes card-glow{to{opacity:.3}}@keyframes avatar-glow{to{box-shadow:0 0 0 5px #f4445518,0 0 48px #ea2a4070}}@keyframes name-shine{0%,20%{background-position:100% 0}80%,100%{background-position:0 0}}@keyframes logo-float{50%{transform:translateY(-5px) rotate(-2deg)}}@keyframes link-sheen{0%,65%{transform:translateX(-150%) skewX(-20deg)}90%,100%{transform:translateX(150%) skewX(-20deg)}}@keyframes rise-in{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}@keyframes star-turn{to{transform:rotate(360deg)}}@keyframes entry-breathe{50%{text-shadow:0 0 90px #e3334870;transform:translateY(-4px)}}@keyframes cta-glow{50%{border-color:#ff587d;color:#ffb1bc}}@keyframes click-expand{to{transform:scale(8);opacity:0}}
@media(max-width:650px){.profile{padding:22px}.avatar{width:85px;height:85px}.identity{gap:20px}.server{padding:9px 15px;gap:17px}.server-logo{width:110px;height:93px}.server>span{font-size:21px}.discord>span{gap:12px}.type-line{font-size:11px}.pointer-glow{display:none}.server em{font-size:8px}.name h1{font-size:49px}}@media(max-width:370px){.avatar{width:65px;height:65px}.name h1{font-size:42px}.identity{gap:15px}.socials{grid-template-columns:1fr}.discord>span{display:block}.discord small{margin-top:5px}.type-line{font-size:10px}}@media(prefers-reduced-motion:reduce){.ambient,.pointer-glow{display:none}}
.profile-tagline{margin:10px 0 0;font-size:15px;font-weight:800;letter-spacing:1.2px;color:#ff9dac;text-shadow:0 0 18px #f34c5940}.profile-tagline + .type-line{margin-top:8px}
/* Extra movement, with the existing animation toggle respected. */
.entered .profile{animation:profile-hover 7s ease-in-out infinite}.avatar:after{content:'';position:absolute;inset:-5px;border:1px solid #fb496052;pointer-events:none;animation:avatar-frame 4s ease-in-out infinite}.profile-tagline{animation:tagline-glow 3.5s ease-in-out infinite}.social:hover svg{animation:icon-bounce .65s ease-in-out infinite alternate}.social:active{scale:.98}.cursor-spark{position:fixed;width:4px;height:4px;border-radius:50%;background:#ff96ab;box-shadow:0 0 10px #ff345d;pointer-events:none;z-index:29;animation:spark-fade .65s ease-out forwards}.social{transition:transform .3s,border-color .3s,box-shadow .3s,scale .2s}.divider i{background:linear-gradient(90deg,#ffffff15,#f4527270,#ffffff15);background-size:200% 100%;animation:divider-flow 4s linear infinite}.brand{animation:brand-glow 6s ease-in-out infinite}
@keyframes profile-hover{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes avatar-frame{0%,100%{opacity:.25;scale:1}50%{opacity:.8;scale:1.05}}@keyframes tagline-glow{0%,100%{text-shadow:0 0 12px #f34c5930}50%{text-shadow:0 0 24px #f34c59a0}}@keyframes icon-bounce{to{transform:translateY(-3px) rotate(-7deg)}}@keyframes spark-fade{to{translate:0 20px;scale:.1;opacity:0}}@keyframes divider-flow{to{background-position:-200% 0}}@keyframes brand-glow{50%{text-shadow:0 0 20px #f34c5970}}
.reduced .cursor-spark{display:none}
@media(prefers-reduced-motion:reduce){.cursor-spark{display:none}}
