@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#111019;--surface:#1b1925;--line:#35303e;--text:#fff9fc;--muted:#aaa3b5;--pink:#ff5eac;--cyan:#67e6e0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--bg);font-family:Manrope,Arial,sans-serif}button,input{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}.shell{width:min(1180px,calc(100% - 64px));margin:auto}.announcement{background:#f870b5;color:#250d26;text-align:center;padding:9px 30px;font-size:10px;font-weight:900;letter-spacing:2px}.announcement span{float:right;letter-spacing:1px}.site-header{position:sticky;top:0;background:#111019ee;backdrop-filter:blur(20px);z-index:5;border-bottom:1px solid #ffffff12}.nav{display:flex;align-items:center;min-height:82px;gap:38px}.brand{font:900 27px 'Space Grotesk',sans-serif;letter-spacing:-1.7px;white-space:nowrap}.brand span{color:var(--pink)}.brand i{color:var(--cyan);font-style:normal}.nav-links,.nav nav{display:flex;gap:28px;margin:auto}.nav-links a,.nav nav a{font-size:11px;font-weight:800;letter-spacing:1px;color:#dbd2e0}.nav-login{background:var(--pink);border:0;border-radius:9px;padding:14px 20px;color:#240b23;font-weight:900;white-space:nowrap;font-size:11px}.menu-toggle{display:none;background:none;border:0;color:white;font-size:27px}.kicker{color:var(--pink);font-size:11px;letter-spacing:2px;font-weight:900;margin-bottom:20px}.kicker span{color:#696474;margin-left:15px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Space Grotesk',sans-serif}h1{font-size:clamp(72px,9vw,148px);line-height:.86;letter-spacing:-9px;margin:30px 0}h1 em,h2 em{font-style:normal;color:var(--pink)}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px;min-height:650px;padding:70px 0 90px}.hero p{max-width:440px;color:#aaa3b5;line-height:1.85;font-size:15px}.hero p b{color:white}.actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}.btn{border:0;border-radius:9px;font-weight:900;letter-spacing:.5px;font-size:11px;display:inline-flex;justify-content:center;align-items:center;padding:19px 22px}.primary{background:var(--pink);color:#251322}.outline{background:transparent;color:white;border:1px solid #615767}.dark{background:#15101c;color:white}.hero-footer{font-size:10px;font-weight:900;color:#92889d;letter-spacing:1.7px;margin-top:65px}.hero-art{height:490px;position:relative;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at center,#77416c 0,#4a294d 38%,#30203c 72%,#241a30);border:1px solid #79516d;display:flex;align-items:center;justify-content:center}.hero-art:before{content:'✳';position:absolute;font-size:500px;color:#ffffff08;line-height:1;transform:rotate(-15deg)}.orbit{position:absolute;border:1px solid #ffffff30;border-radius:50%}.orbit-one{width:430px;height:430px}.orbit-two{width:335px;height:335px}.disc{width:275px;height:275px;border-radius:50%;background:repeating-conic-gradient(from 3deg,#ff71b9 0deg 12deg,#e84a9c 12deg 24deg);border:14px solid #f58cce;outline:9px solid #ffffff15;box-shadow:0 20px 80px #ff7ac355;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(-13deg);z-index:1;text-shadow:4px 5px #af3a86}.disc small{font-size:46px;font-weight:1000;line-height:1}.disc strong{font-size:57px;line-height:1;font-weight:1000}.disc span{font-size:36px;color:#fff1b2}.sticker{position:absolute;top:65px;right:45px;z-index:2;background:#e9ff8b;color:#292a26;padding:17px;transform:rotate(14deg);font-size:21px;line-height:1;font-weight:1000;clip-path:polygon(8% 0,100% 8%,90% 100%,0 85%)}.art-tag{position:absolute;bottom:110px;left:30px;background:#9aeee5;color:#21202c;padding:10px 20px;transform:rotate(-11deg);font-size:19px;font-weight:900;line-height:1.1}.art-caption{position:absolute;bottom:24px;right:25px;font-size:10px;font-weight:900;letter-spacing:1.4px}.ticker{background:#a9f1e6;color:#1c2730;overflow:hidden;padding:13px 0;font-size:13px;font-weight:1000;white-space:nowrap;letter-spacing:2px}.ticker div{width:max-content;animation:move 22s linear infinite}@keyframes move{to{transform:translateX(-42%)}}.section{padding-top:125px;padding-bottom:125px;scroll-margin-top:65px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:44px}.section-head h2,.community h2{font-size:clamp(40px,5vw,70px);line-height:1.05;letter-spacing:-3px;margin:0}.section-head>p{max-width:300px;line-height:1.8;color:var(--muted);font-size:13px}.feature-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:18px}.feature{min-height:340px;background:#252032;border:1px solid #514156;padding:25px;border-radius:15px;display:flex;flex-direction:column;overflow:hidden}.feature small,.music-poster small{font-size:10px;letter-spacing:1.5px;font-weight:800}.feature h3{font-size:20px;margin:auto 0 8px}.feature p{font-size:12px;color:#bfb5c7;margin:0}.feature-big{background:#e95aa3;color:#1c1121}.feature-big p{color:#382239}.feature.purple{background:#44315f}.feature.cyan{background:#276c77}.lane{display:flex;justify-content:center;align-items:center;margin:auto 0;font-size:28px;transform:rotate(-9deg);white-space:nowrap}.lane b{background:#fff59a;border-radius:9px;padding:10px;margin-left:14px}.feature-symbol{font-size:130px;text-align:center;margin:auto;color:#ffffff68}.character-section{background:#171520}.character-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:20px}.character-stage{--tone:#ff78bc;border-radius:16px;background:radial-gradient(circle at 60% 48%,var(--tone),#38243f 75%);min-height:490px;padding:24px;display:flex;flex-direction:column;position:relative;overflow:hidden}.character-stage.green{--tone:#83e6ae}.character-stage.violet{--tone:#ae97fa}.character-stage.cyan{--tone:#7be2ed}.character-stage.red{--tone:#ef7b81}.stage-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.4px;font-weight:900}.char-symbol{font-family:'Space Grotesk';font-size:250px;font-weight:900;line-height:1;align-self:center;margin:auto;filter:drop-shadow(8px 13px 0 #13121b60)}.stage-bottom{position:relative}.stage-bottom small{font-size:10px;font-weight:900;letter-spacing:1px}.stage-bottom h3{font-size:48px;line-height:1;margin:9px 0}.stage-bottom p{font-size:13px;margin:0}.character-list{display:flex;flex-direction:column;gap:9px}.character-option{width:100%;border:1px solid #3a3546;background:#26222e;border-radius:12px;color:white;padding:12px;display:flex;align-items:center;gap:16px;text-align:left;min-height:75px}.character-option.active{border-color:var(--pink);background:#3b2a43}.character-option>span:nth-child(2){flex:1}.character-option b{font-size:13px;display:block}.character-option small{font-size:9px;color:var(--muted);display:block;margin-top:3px}.ch-avatar{border-radius:8px;width:48px;height:48px;display:grid;place-items:center;background:#e97caf;color:#312033;font-size:25px;font-weight:900}.ch-avatar.green{background:#84e6a4}.ch-avatar.violet{background:#b5a3eb}.ch-avatar.cyan{background:#80e4e6}.ch-avatar.red{background:#fa9695}.muted{font-size:11px;color:#958aa0;line-height:1.7}.music-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:26px}.music-poster{background:linear-gradient(145deg,#fe8ec2,#cd4b9a 67%,#622966);padding:26px;border-radius:15px;min-height:440px;overflow:hidden;color:#2b1532}.record{height:235px;width:235px;border-radius:50%;background:repeating-radial-gradient(circle,#181622 0px,#181622 5px,#39303f 6px,#181622 9px);margin:18px auto -25px;display:grid;place-items:center;box-shadow:20px 20px 36px #50224466}.record b{width:75px;height:75px;border-radius:50%;background:#fa86c0;color:#21172b;display:grid;place-items:center}.music-poster h3{font-size:66px;line-height:.8;margin:22px 0 0}.track-list{padding-top:12px}.track-label{display:flex;justify-content:space-between;font-weight:900;font-size:10px;letter-spacing:2px;padding:12px 0 25px}.track{display:flex;align-items:center;gap:14px;border-bottom:1px solid #393440;padding:19px 0}.track>span{font-size:12px;color:#a49aaf}.track-icon{width:54px;height:54px;border-radius:10px;background:#cf5f9e;display:grid;place-items:center;font-size:26px}.track>div:nth-of-type(2){flex:1}.track b{font-size:13px}.track small{display:block;color:#aea4b5;font-size:9px;margin-top:5px;letter-spacing:.5px}.bars{letter-spacing:2px;color:#ff75bb;font-size:18px}.community{background:#ff7ab9;color:#271528;padding:110px 0;text-align:center;scroll-margin-top:70px;position:relative;overflow:hidden}.community .kicker{color:#552c48}.community h2{font-size:clamp(50px,7vw,93px)}.community h2 em{color:#fff}.community p{max-width:580px;line-height:1.8;margin:28px auto;font-size:14px}.perks{font-size:11px;letter-spacing:1px;font-weight:900;margin:25px auto 35px}.footer{padding:70px 0;color:#ada1b4}.footer p{font-size:12px;margin:20px 0}.footer div{border-top:1px solid #332c3c;padding-top:18px;font-size:10px}.modal-backdrop{position:fixed;inset:0;background:#0a0812d9;display:grid;place-items:center;z-index:20;padding:20px}.modal-backdrop[hidden]{display:none}.modal{position:relative;width:min(440px,100%);border-radius:18px;background:#241d2e;border:1px solid #66516a;padding:35px;box-shadow:0 25px 100px #0008}.modal-icon{font-size:43px;color:var(--pink)}.modal h2{font-size:32px;margin:7px 0}.modal p{font-size:12px;color:#b4a9c0}.modal label{display:block;font-size:10px;letter-spacing:1px;font-weight:900;margin:20px 0}.modal input{display:block;width:100%;border:1px solid #51435c;background:#171220;border-radius:8px;color:white;padding:14px;margin-top:8px;outline:none}.modal input:focus{border-color:var(--pink)}.submit-auth{width:100%}.close-modal{position:absolute;right:18px;top:14px;background:none;color:white;border:0;font-size:20px}.swap-auth{display:block;margin:17px auto 0;background:none;border:0;color:#ff88c4;font-size:10px;font-weight:900}.notice{position:fixed;bottom:20px;right:20px;background:#e46cac;color:#231322;padding:17px;border-radius:10px;z-index:30;max-width:90vw;font-size:13px;font-weight:800}.profile-page{padding:110px 0;min-height:75vh}.profile-page h1{font-size:clamp(42px,7vw,90px);letter-spacing:-3px}.profile-page h1 span{color:var(--pink)}.profile-page>p{color:var(--muted)}.profile-card{display:flex;align-items:center;gap:25px;background:#292233;border:1px solid #54425d;padding:30px;border-radius:16px;margin:40px 0}.avatar{font-size:72px;font-weight:900;background:var(--pink);color:#261321;width:130px;height:130px;border-radius:20px;display:grid;place-items:center}.profile-card small{color:var(--pink);font-size:10px;font-weight:900}.profile-card h2{font-size:34px;margin:12px 0}.profile-card p{color:#c0b1c7;margin-bottom:8px}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.stat-grid div{background:#221d2a;padding:30px;border-radius:12px}.stat-grid b{font-size:42px;display:block;color:var(--pink)}.stat-grid span{font-size:10px;font-weight:900;letter-spacing:1px}
@media(max-width:850px){.announcement span{display:none}.nav{gap:15px;min-height:70px}.menu-toggle{display:block;margin-left:auto}.nav-links{display:none;position:absolute;top:70px;left:0;right:0;background:#1b1622;padding:28px;flex-direction:column;gap:24px}.nav-links.open{display:flex}.hero{grid-template-columns:1fr;padding:60px 0}.hero-art{height:430px}.feature-grid{grid-template-columns:1fr 1fr}.feature-big{grid-column:1/-1}.character-layout,.music-layout{grid-template-columns:1fr}.section{padding-top:80px;padding-bottom:80px}.bars{display:none}}@media(max-width:540px){.shell{width:calc(100% - 34px)}.brand{font-size:21px}.nav-login{padding:11px 12px;font-size:10px}.hero h1{font-size:74px;letter-spacing:-6px}.hero-art{height:340px}.disc{width:205px;height:205px}.disc small{font-size:34px}.disc strong{font-size:42px}.orbit-one{width:300px;height:300px}.orbit-two{width:240px;height:240px}.sticker{right:12px;top:22px}.section-head{display:block}.section-head>p{margin-top:18px}.feature-grid,.stat-grid{grid-template-columns:1fr}.feature-big{grid-column:auto}.feature{min-height:250px}.character-stage{min-height:380px}.char-symbol{font-size:160px}.stage-bottom h3{font-size:35px}.track>small{display:none}.perks{line-height:2}.profile-card{flex-direction:column;align-items:start}}
