:root{color-scheme:dark;--bg:#0d0e16;--panel:#15151f;--line:#30293f;--fg:#f5f2fb;--muted:#b2adc4;--accent:#b283ff;--gold:#f4b84e;font-family:'IBM Plex Sans',system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:radial-gradient(ellipse at 82% 18%,#4c1c7720,transparent 27%),var(--bg);color:var(--fg)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.symbols{position:absolute;width:0;height:0;overflow:hidden}.page{max-width:1510px;padding:26px 40px 0;margin:auto}.icon{width:21px;height:21px;flex-shrink:0}.stroke{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.lilac{color:var(--accent)}.gold{color:var(--gold)!important}.skip{position:fixed;top:-100px;left:20px;background:var(--accent);color:#170734;padding:15px;z-index:100}.skip:focus{top:12px}.nav{display:flex;align-items:center;gap:35px;padding:16px 22px;background:#12131dd9;border:1px solid #2b253a;border-radius:22px}.brand{display:flex;align-items:center;gap:10px;font-size:29px;font-weight:700;letter-spacing:-1.2px}.brand img{object-fit:contain}.nav nav{margin-left:auto;display:flex;gap:30px;font-size:16px}.nav nav a{color:#e0dbe9;transition:color .2s}.nav nav a:hover{color:var(--accent)}.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:17px 25px;border:1px solid transparent;border-radius:15px;font-weight:600;font-size:17px;line-height:1.3;transition:transform .2s,background .2s,border-color .2s;min-height:48px}.button:hover{transform:translateY(-2px)}.primary{background:linear-gradient(120deg,#bd3fed,#853cf0 60%,#a06cf8);color:white;border-color:#c89bff66;box-shadow:0 8px 28px #923cfa30}.primary:hover{filter:brightness(1.12)}.outline,.quiet{border-color:#7e579e;background:#11121a88}.outline:hover,.quiet:hover{background:#a77dff12;border-color:var(--accent)}.nav-contact{padding:10px 18px;font-size:15px;border-color:#b06fe9;min-height:44px}.hero{display:grid;grid-template-columns:.78fr 1.22fr;gap:40px;align-items:center;padding:75px 0 55px;min-height:555px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.25em;color:var(--accent);margin:0 0 21px}.hero-copy>.eyebrow{display:none}.hero h1{font-size:clamp(65px,6.6vw,100px);letter-spacing:-.065em;line-height:1.03;margin:0 0 26px;font-weight:700;white-space:nowrap}.hero h1 span{color:var(--accent)}.lead{font-size:21px;line-height:1.55;color:var(--muted);max-width:460px;margin:0 0 34px}.actions{display:flex;gap:14px;flex-wrap:wrap}.platform{display:flex;align-items:center;gap:9px;color:#8c849e;font-size:13px;margin:21px 0 0}.platform .icon{width:14px;height:14px}.app-window{display:grid;grid-template-columns:110px minmax(0,1fr) 78px;gap:12px;padding:19px 15px 16px;background:linear-gradient(140deg,#161723,#0b0c13);border:1px solid #9156c7;border-radius:28px;box-shadow:0 28px 70px #0006,0 0 45px #7721e019;transform:perspective(1300px) rotateY(-5deg) rotate(-2deg);position:relative;isolation:isolate}.app-window:before{content:'';position:absolute;inset:11px;border-radius:21px;z-index:-1;background:#0a0b1240}.preview-sidebar{display:flex;flex-direction:column;gap:27px;padding:15px 0}.preview-brand{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:700;letter-spacing:-.4px}.preview-brand img{object-fit:contain}.preview-menu{display:grid;gap:10px}.preview-menu button{display:flex;align-items:center;gap:8px;padding:12px 9px;border:1px solid transparent;border-radius:10px;background:none;color:#9690ad;text-align:left;font-size:12px}.preview-menu button.active{background:#a56afe21;border-color:#775094;color:#d1adff}.preview-menu button:hover{background:#a77dff15}.preview-menu .icon{width:17px;height:17px}.preview-platform{display:flex;gap:7px;font-size:11px;color:#777187;margin-top:auto}.preview-platform .icon{width:14px;height:14px}.preview-main{min-width:0}.music-player{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #3e2c55;border-radius:12px;background:#191528;margin-bottom:13px}.music-player button{width:30px;height:30px;flex-shrink:0;border:0;border-radius:50%;background:#a77dff;color:#1c0a38;font-size:12px}.music-player strong{display:block;font-size:12px}.music-player div span{display:block;font-size:10px;color:#aaa0bf;margin-top:3px}.waveform{display:flex;align-items:center;gap:3px;height:24px;margin-left:auto}.waveform i{display:block;width:3px;height:8px;border-radius:2px;background:#9959ed}.waveform i:nth-child(3n){height:17px}.waveform i:nth-child(4n){height:12px}.waveform i:nth-child(5n){height:22px}.waveform.playing i{animation:equalizer 1s ease-in-out infinite alternate}.waveform i:nth-child(2n){animation-delay:-.5s}.waveform i:nth-child(3n){animation-delay:-.2s}@keyframes equalizer{to{transform:scaleY(.35)}}.screen{display:block;position:relative;width:100%;padding:0;border:0;background:#0b0b13;border-radius:12px;overflow:hidden}.screen:after{content:'Ampliar';position:absolute;right:10px;bottom:10px;padding:6px 10px;border-radius:8px;background:#101017e8;color:#eee;font-size:12px;opacity:0;transition:opacity .2s}.screen:hover:after,.screen:focus-visible:after{opacity:1}.screen img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.preview-main .screen{border:1px solid #353047;height:260px}.preview-main .screen img{height:100%;object-fit:cover}.preview-main .gameplay-screen img{object-fit:cover;object-position:center}.preview-bottom{display:flex;align-items:center;gap:7px;padding:11px 10px 0;color:#b7a6d3;font-size:10px}.preview-bottom div{margin-right:auto}.preview-bottom div span{display:block;color:#82758f;font-size:9px}.preview-bottom strong{display:block;font-size:11px;color:#e4d7f5;margin-top:3px}.preview-bottom .icon{width:15px;height:15px}.preview-detail{display:flex;flex-direction:column;align-items:center;text-align:center;gap:25px;background:#18132355;border:1px solid #3c2d50;border-radius:12px;padding:20px 5px}.preview-detail div>span{display:block;color:#9b8dab;font-size:10px}.preview-detail strong{display:block;font-size:17px;margin-top:6px}.preview-detail div:nth-of-type(2) strong{font-size:12px}.detail-target{width:56px;height:56px;color:#a367f2}.mini-bars{display:flex;align-items:center;gap:3px;height:33px;margin-top:auto}.mini-bars i{width:4px;height:22px;background:#9b57ec;border-radius:2px}.mini-bars i:nth-child(2n){height:13px}.mini-bars i:nth-child(3n){height:30px}h2{font-size:clamp(35px,3.5vw,52px);font-weight:700;line-height:1.12;letter-spacing:-.04em;margin:0}h3{font-size:21px;font-weight:600;letter-spacing:-.025em;margin:0 0 11px}p{line-height:1.55}.intro-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.intro-cards article{display:flex;gap:24px;padding:29px 28px 31px;border:1px solid #3d2a59;border-radius:22px;background:linear-gradient(130deg,#181423,#11121d);align-items:flex-start}.intro-icon{display:grid;place-items:center;width:65px;height:65px;flex-shrink:0;border:1px solid #624291;border-radius:17px;background:#6c39a51c;color:var(--accent)}.intro-icon svg{width:33px;height:33px}.intro-icon.gold{background:#c28b261a;border-color:#775e34}.intro-cards h3{font-size:22px;line-height:1.3;margin-top:3px}.intro-cards p{margin:0;color:var(--muted);font-size:16px}.showcase{padding:100px 0 82px}.showcase-layout{display:grid;grid-template-columns:.8fr 1.7fr;gap:30px;align-items:start}.showcase-copy{padding-top:40px}.showcase-copy .eyebrow{letter-spacing:.35em;font-size:11px}.showcase-copy h2{font-size:clamp(35px,3.3vw,49px);line-height:1.18}.showcase-copy>p:last-child{font-size:18px;color:var(--muted);max-width:345px;margin-top:29px}.stacked-screens{position:relative;height:430px;min-width:0}.stacked-screens figure{margin:0;position:absolute;background:linear-gradient(130deg,#171523,#0f101a);border:1px solid #655780;border-radius:19px;padding:11px 8px 8px;box-shadow:0 18px 42px #0004}.window-front{width:72%;left:0;top:0;transform:perspective(1000px) rotateY(-5deg) rotate(-3deg);z-index:1}.window-back{width:44%;right:0;top:45px;transform:perspective(1000px) rotateY(-6deg) rotate(-2deg);z-index:2}.window-bar{display:flex;gap:5px;padding:2px 5px 9px}.window-bar i{width:5px;height:5px;background:#807588;border-radius:50%}.window-bar i:first-child{background:#ac8786}.stacked-screens .screen{border-radius:11px}.window-front .screen{height:280px}.window-back .screen{height:290px}.stacked-screens .screen img{height:100%;width:100%;object-fit:cover;object-position:center}.window-front .screen img{width:145%;max-width:none;margin-left:-22.5%}.window-back .screen img{width:215%;max-width:none;margin-left:-57.5%}.stacked-screens figcaption{position:absolute;top:calc(100% + 27px);left:5px;right:5px;display:flex;gap:15px;transform:rotate(2deg);padding-top:7px}.stacked-screens figcaption svg{width:30px;height:30px;color:var(--accent);flex-shrink:0}.stacked-screens figcaption h3{font-size:18px;line-height:1.3;margin-bottom:7px}.stacked-screens figcaption p{font-size:14px;line-height:1.5;color:var(--muted);margin:0}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}.feature{display:flex;align-items:center;gap:22px;padding:25px;border:1px solid #3d2a59;border-radius:22px;background:linear-gradient(125deg,#191425,#11121c)}.feature-icon{display:grid;place-items:center;width:65px;height:65px;flex-shrink:0;border:1px solid #8760bd;border-radius:50%;background:#a77dff0b;color:var(--accent)}.feature-icon svg{width:31px;height:31px}.feature-icon.gold{border-color:#9b7535}.feature h3{font-size:19px;line-height:1.3;margin-bottom:8px}.feature p{font-size:15px;color:var(--muted);margin:0}.contact{position:relative;overflow:hidden;padding:66px 60px 61px;border:1px solid #77569b;border-radius:27px;background:radial-gradient(ellipse at 100% 0%,#a967f5 0%,#6930a56a 27%,transparent 56%),radial-gradient(ellipse at 83% 110%,#7342a9a6,transparent 38%),linear-gradient(120deg,#1d1629,#101119 48%,#281740);min-height:410px;isolation:isolate}.contact:after{content:'';position:absolute;width:550px;height:550px;border-radius:50%;border:1px solid #bb8cf02e;right:-80px;top:48px;z-index:-1}.contact-copy{position:relative;z-index:1;width:66%}.contact-copy .eyebrow{display:none}.contact h2{font-size:clamp(40px,4.3vw,61px);line-height:1.14;letter-spacing:-.035em;white-space:nowrap}.contact-copy>p:not(.contact-help){color:#cec8d9;max-width:635px;font-size:22px;line-height:1.45;margin:18px 0 33px}.contact-actions{display:flex;align-items:center;gap:10px}.discord-user{display:flex;align-items:center;gap:17px;border:1px solid #403349;background:#191621b0;border-radius:17px;padding:8px 8px 8px 20px;font-size:23px;white-space:nowrap}.discord-user>.icon{width:33px;height:33px}.discord-user button{font-size:15px;margin-left:12px;padding:15px 19px;background:#a46df5;color:#160c27;box-shadow:none}.contact-actions>.button{font-size:15px;padding:15px 17px;border-color:#aa7fd5;white-space:nowrap}.contact-help{font-size:12px;color:#a799ba;min-height:20px;margin:13px 0 0}.discord-art{position:absolute;width:345px;height:345px;object-fit:contain;right:49px;top:39px;z-index:0;filter:drop-shadow(0 26px 24px #150b32b0)}.faq{margin:54px 15px 62px}.faq .eyebrow{margin:0 0 4px;font-size:15px;letter-spacing:.08em}.faq details{border-bottom:1px solid #36303f}.faq summary{position:relative;padding:23px 34px 23px 0;font-size:24px;font-weight:600;cursor:pointer;list-style:none;letter-spacing:-.02em}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'';position:absolute;right:13px;top:31px;width:10px;height:10px;border-right:1.5px solid #e9e0f4;border-bottom:1.5px solid #e9e0f4;transform:rotate(45deg)}.faq details[open] summary:after{transform:rotate(225deg)}.faq details p{font-size:17px;color:var(--muted);max-width:850px;margin:0 0 24px}footer{border-top:1px solid #36303f;display:flex;align-items:center;gap:24px;padding:29px 0 38px}footer .brand{font-size:28px}footer p{font-size:14px;color:var(--muted)}footer>a:last-child{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:15px;color:#c5bcd2}dialog{padding:18px;background:#16171f;border:1px solid #625374;border-radius:24px;max-width:min(1250px,94vw);color:var(--fg);overflow:auto}dialog::backdrop{background:#07070de8;backdrop-filter:blur(8px)}dialog img{display:block;width:100%;height:auto;border-radius:12px}dialog p{margin:16px 40px 0 4px;font-size:14px}.dialog-close{display:block;margin:0 0 12px auto;border:1px solid #665673;background:#242031;color:white;border-radius:10px;width:38px;height:38px}.dialog-close:hover{background:#403054}@media(min-width:1600px){.hero{min-height:600px}.preview-main .screen{height:290px}}@media(max-width:1200px){.page{padding:22px 30px 0}.hero{gap:28px;grid-template-columns:.78fr 1.22fr}.hero h1{font-size:76px}.lead{font-size:19px}.app-window{grid-template-columns:88px minmax(0,1fr);gap:9px;padding:13px}.preview-detail{display:none}.preview-main .screen{height:245px}.preview-brand{font-size:13px}.preview-brand img{width:20px;height:20px}.preview-menu button{font-size:11px;padding:10px 6px;gap:5px}.intro-cards article{gap:17px;padding:24px 20px}.intro-icon{width:48px;height:48px;border-radius:13px}.intro-icon svg{width:27px;height:27px}.intro-cards h3{font-size:20px}.intro-cards p{font-size:15px}.showcase-layout{grid-template-columns:.82fr 1.5fr}.showcase-copy h2{font-size:39px}.window-front .screen{height:240px}.window-back .screen{height:260px}.stacked-screens{height:410px}.feature{padding:21px;gap:15px}.feature-icon{width:48px;height:48px}.feature h3{font-size:17px}.feature p{font-size:14px}.contact{padding:48px 40px}.contact h2{font-size:48px}.contact-copy{width:72%}.contact-copy>p:not(.contact-help){font-size:20px;max-width:530px}.discord-art{width:280px;height:280px;right:15px;top:50px}.discord-user{font-size:20px;gap:12px;padding-left:14px}.discord-user button{font-size:14px;margin-left:5px;padding:15px}.contact-actions>.button{font-size:14px;padding:15px}}@media(max-width:950px){.hero{grid-template-columns:1fr 1.18fr}.hero h1{font-size:64px}.hero .button{font-size:15px;padding:15px 18px}.app-window{grid-template-columns:70px minmax(0,1fr)}.preview-sidebar{padding-top:10px;gap:20px}.preview-brand{font-size:10px}.preview-menu button{font-size:10px;padding:10px 4px}.preview-menu .icon{width:14px;height:14px}.preview-main .screen{height:220px}.music-player{padding:9px;gap:6px}.music-player strong{font-size:11px}.waveform{gap:2px}.waveform i{width:2px}.intro-cards article{display:block}.intro-icon{margin-bottom:18px}.intro-cards h3{font-size:20px}.showcase-layout{display:block}.showcase-copy{padding-top:0;max-width:680px;display:grid;grid-template-columns:1fr 1fr;gap:0 30px;align-items:center;margin-bottom:30px}.showcase-copy .eyebrow{grid-column:1/-1}.showcase-copy h2{font-size:40px}.showcase-copy>p:last-child{margin:0;max-width:330px}.stacked-screens{height:470px;max-width:760px;margin:auto}.window-front .screen{height:300px}.window-back .screen{height:315px}.features{margin-top:30px}.feature{display:block}.feature-icon{margin-bottom:16px}.contact h2{font-size:43px}.contact-copy{width:100%}.contact-copy>p:not(.contact-help){max-width:480px;font-size:18px}.discord-art{width:215px;height:215px;right:10px;top:75px;opacity:.55}.contact-actions{position:relative;z-index:2}.contact h2{white-space:normal}.contact{min-height:370px}.contact-actions>.button{background:#181120d9}.faq summary{font-size:22px}}@media(max-width:700px){.page{padding:16px 19px 0}.nav{padding:12px 14px;gap:12px;flex-wrap:wrap;border-radius:18px}.brand{font-size:24px}.brand img{width:34px;height:34px}.nav nav{order:3;width:100%;justify-content:center;gap:25px;padding:7px 0 2px;font-size:14px}.nav-contact{margin-left:auto;padding:9px 12px;font-size:13px}.hero{grid-template-columns:1fr;padding:39px 0 38px;gap:35px}.hero h1{font-size:clamp(57px,12vw,80px);margin-bottom:22px}.lead{font-size:18px;max-width:450px;margin-bottom:26px}.hero .button{font-size:16px}.app-window{grid-template-columns:80px minmax(0,1fr);padding:12px;transform:rotate(-1deg);border-radius:21px;gap:9px}.preview-brand{font-size:12px}.preview-menu button{font-size:11px}.preview-main .screen{height:210px}.preview-main .screen img{object-fit:cover}.preview-sidebar{padding:9px 0}.preview-platform{font-size:10px;gap:4px}.preview-platform .icon{width:11px}.music-player strong{font-size:12px}.waveform i:nth-child(n+11){display:none}.intro-cards{grid-template-columns:1fr;gap:13px}.intro-cards article{display:flex;padding:23px;gap:19px;border-radius:19px}.intro-icon{margin:0;width:53px;height:53px}.intro-cards h3{font-size:20px}.intro-cards p{font-size:15px}.showcase{padding:56px 0}.showcase-copy{display:block;margin-bottom:28px}.showcase-copy h2{font-size:38px}.showcase-copy>p:last-child{font-size:17px;margin-top:22px;max-width:400px}.stacked-screens{height:auto;display:flex;flex-direction:column;gap:28px}.stacked-screens figure{position:relative;top:auto;left:auto;right:auto;width:100%;padding:9px;transform:none}.stacked-screens .screen{height:230px}.window-front .screen img{width:145%;margin-left:-22.5%}.window-back .screen img{width:145%;margin-left:-22.5%}.stacked-screens figcaption{position:relative;top:auto;left:auto;right:auto;transform:none;padding:20px 5px 12px}.stacked-screens figcaption h3{font-size:19px}.features{grid-template-columns:1fr;margin-top:25px;gap:13px}.feature{display:flex;padding:23px}.feature-icon{margin:0;width:54px;height:54px}.feature h3{font-size:19px}.feature p{font-size:15px}.contact{padding:32px 25px 27px;border-radius:23px;min-height:0}.contact h2{font-size:39px;max-width:310px}.contact-copy>p:not(.contact-help){font-size:18px;margin-top:20px;margin-bottom:24px;max-width:330px}.discord-art{position:relative;display:block;top:auto;right:auto;width:205px;height:205px;margin:18px auto 0;opacity:1}.contact:after{width:400px;height:400px;right:-70px;top:auto;bottom:-170px}.contact-actions{display:block}.discord-user{flex-wrap:wrap;font-size:22px;padding:16px;gap:14px}.discord-user button{width:100%;margin:5px 0 0}.contact-actions>.button{margin-top:12px;width:100%}.contact-help{font-size:12px;margin-top:14px}.faq{margin:37px 0 45px}.faq summary{font-size:19px;padding:22px 30px 22px 0}.faq summary:after{top:28px}.faq details p{font-size:16px}.faq .eyebrow{font-size:13px}.faq summary:after{right:5px}footer{flex-wrap:wrap;gap:13px;padding:25px 0 30px}footer .brand{font-size:23px}footer .brand img{width:30px;height:30px}footer p{order:3;width:100%;margin:0;font-size:13px}footer>a:last-child{font-size:13px;gap:6px}.button{min-height:46px}}@media(max-width:380px){.page{padding-left:13px;padding-right:13px}.nav nav{gap:20px}.nav-contact span{display:none}.hero h1{font-size:54px}.hero .actions{gap:10px}.hero .button{padding:14px 17px}.app-window{grid-template-columns:65px minmax(0,1fr)}.preview-main .screen{height:185px}.preview-brand{font-size:10px}.preview-menu button{font-size:10px;gap:4px}.waveform i:nth-child(n+7){display:none}.preview-bottom{padding-left:3px;padding-right:3px}.preview-bottom>span{display:none}.contact{padding:28px 20px}.contact h2{font-size:37px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* Reference composition: perspective, illuminated edges and orbital background. */
.hero,.showcase{position:relative;isolation:isolate}.hero:before{content:'';position:absolute;z-index:-1;width:950px;height:400px;border:1px solid #9451ed40;border-radius:50%;left:-330px;top:125px;transform:rotate(27deg);background:linear-gradient(160deg,transparent 30%,#6731ad26 70%,#8844dc3d);box-shadow:inset 0 -28px 55px #7837c022;pointer-events:none}.hero:after{content:'';position:absolute;z-index:-1;right:-30px;top:70px;width:65%;height:85%;background:radial-gradient(ellipse,#8b3eef38,transparent 65%);filter:blur(24px);pointer-events:none}.page{overflow:hidden}.primary{border:1px solid #d69aff;box-shadow:inset 0 1px 7px #e0b1ff80,0 7px 32px #9926ef60,0 0 14px #b949e52b;background:linear-gradient(115deg,#bd39ed,#833af0 65%,#ad6df6)}.reference-preview{grid-template-columns:115px minmax(0,1fr);gap:0;padding:20px 14px 18px;transform:perspective(1300px) rotateY(-9deg) rotateX(3deg) rotate(-2deg);border-color:#bd79f2;box-shadow:0 28px 60px #0008,0 0 35px #8e30e32b,inset 0 0 2px #e9b5ff80;border-radius:29px}.reference-preview .preview-sidebar{padding:17px 9px 0 0;gap:26px;position:relative}.preview-menu a{display:flex;align-items:center;gap:8px;padding:13px 7px;font-size:11px;color:#a79abc;border-radius:10px}.preview-menu a.active{border:1px solid #9160c2;background:#a66bff24;color:#ecd9ff}.game-stage{height:390px;position:relative;overflow:hidden;border-radius:15px;background:#171223}.game-stage video{width:100%;height:100%;object-fit:cover;display:block}.floating-card{border:1px solid #62448088;background:linear-gradient(125deg,#13121fec,#171126e8);border-radius:12px;box-shadow:0 7px 25px #0004;backdrop-filter:blur(8px)}.game-stage .music-player{position:absolute;top:13px;left:13px;width:62%;margin:0;padding:11px 9px;gap:7px;z-index:2}.game-stage .music-player strong{font-size:12px}.game-stage .music-player .waveform{overflow:hidden}.game-stage .music-player button{width:25px;height:25px}.sensitivity-card{position:absolute;right:10px;top:13px;width:31%;padding:15px 10px;display:flex;align-items:center;gap:6px;font-size:10px;color:#c6b3dc}.sensitivity-card strong{font-size:12px;color:#e9dcff}.stats-card{position:absolute;right:12px;top:82px;padding:16px;width:97px}.stats-card>span,.rhythm-card>span,.mode-card>span{font-size:10px;color:#b1a3c7;display:block}.stats-card>strong{font-size:17px;display:block;margin-top:5px}.stats-card hr{border:0;border-top:1px solid #453253;margin:15px 0}.progress-ring{width:55px;height:55px;border-radius:50%;margin:17px auto 0;background:conic-gradient(#ac62ff var(--progress,0deg),#392a53 0);position:relative;box-shadow:0 0 16px #8e45dd33}.progress-ring:after{content:'';position:absolute;inset:5px;border-radius:50%;background:#141020}.mode-card{position:absolute;bottom:0;left:0;right:7px;padding:13px 9px}.mode-card strong{font-size:11px;display:block;margin-top:6px}.rhythm-card{position:absolute;right:12px;bottom:12px;width:160px;padding:12px}.rhythm-card .waveform{margin:10px 0 0;justify-content:space-between;height:27px}.showcase:before{content:'';position:absolute;z-index:-1;width:900px;height:470px;right:-170px;top:0;border-radius:50%;border:1px solid #8554ce35;transform:rotate(-26deg);background:radial-gradient(ellipse,#7240bc2a,transparent 67%);box-shadow:0 0 50px #662ca815;pointer-events:none}.showcase:after{content:'';position:absolute;z-index:-1;width:85%;height:220px;right:0;top:290px;border-top:1px solid #885bd943;border-radius:50%;transform:rotate(-23deg);background:linear-gradient(180deg,#7e43ce15,transparent);pointer-events:none}.stacked-screens{height:450px}.stacked-screens figure{border-color:#9173b4;box-shadow:inset 0 1px 2px #d4b5ff80,0 0 27px #8838d724,0 25px 40px #0005}.window-front{transform:perspective(1100px) rotateY(-12deg) rotateX(3deg) rotate(-3deg);width:74%}.window-back{transform:perspective(1100px) rotateY(-11deg) rotateX(2deg) rotate(-2deg);width:43%;top:44px}.window-front .screen img{width:100%;margin:0;object-fit:cover;object-position:48% center}.window-back .screen img{width:175%;margin-left:-38%;object-position:center}.stacked-screens figcaption:before{content:'';position:absolute;height:27px;width:50px;left:27px;top:-25px;border-bottom:1px solid #a66fe9;border-right:1px solid #a66fe9;transform:skewX(-38deg)}.stacked-screens figcaption:after{content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:#b887ff;left:84px;top:-27px;box-shadow:0 0 10px #ad68f7}.features{margin-top:35px}
@media(max-width:1200px){.reference-preview{grid-template-columns:94px minmax(0,1fr)}.game-stage{height:350px}.game-stage .music-player{width:59%}.sensitivity-card{width:33%;gap:3px;padding:16px 5px;font-size:9px}.preview-menu a{font-size:10px}.stats-card{width:85px;padding:12px}.window-front .screen{height:265px}.window-back .screen{height:280px}}
@media(max-width:950px){.reference-preview{grid-template-columns:77px minmax(0,1fr)}.game-stage{height:320px}.game-stage .music-player{width:calc(100% - 20px);left:10px}.sensitivity-card{top:80px;left:10px;width:132px}.stats-card{top:135px;right:10px;width:77px}.stats-card>strong{font-size:15px}.stats-card hr{margin:9px 0}.progress-ring{width:42px;height:42px;margin-top:12px}.rhythm-card{width:133px}.preview-menu a{font-size:9px;padding:12px 3px}.mode-card{padding:10px 6px}.mode-card strong{font-size:10px}}
@media(max-width:700px){.reference-preview{grid-template-columns:75px minmax(0,1fr);transform:perspective(900px) rotateY(-6deg) rotate(-1deg);padding:11px}.game-stage{height:310px}.hero:before{width:700px;left:-450px;top:120px}.hero:after{width:100%;top:300px}.preview-menu a{font-size:9px}.reference-preview .preview-brand{font-size:10px;gap:2px}.reference-preview .preview-brand img{width:18px;height:18px}.stacked-screens{height:690px;display:block}.stacked-screens figure{position:absolute;width:86%;transform:perspective(900px) rotateY(-8deg) rotate(-3deg)}.stacked-screens .window-front{left:0;top:0}.stacked-screens .window-back{right:0;left:auto;top:345px;width:78%;transform:perspective(900px) rotateY(-7deg) rotate(-2deg)}.stacked-screens .screen{height:205px}.stacked-screens figcaption{position:absolute;top:calc(100% + 18px);left:5px;right:5px;padding:8px 0;transform:rotate(2deg)}.stacked-screens figcaption h3{font-size:17px}.stacked-screens figcaption p{font-size:13px}.stacked-screens figcaption:before,.stacked-screens figcaption:after{display:none}.features{margin-top:12px}}
/* Full interfaces, balanced overlap and consistent perspective. */
.showcase-layout{grid-template-columns:.78fr 1.7fr;gap:34px;align-items:center}.showcase-copy{padding-top:0}.stacked-screens{height:490px;perspective:1300px}.stacked-screens .window-front{width:69%;left:0;top:20px;transform:perspective(1200px) rotateY(-9deg) rotateX(2deg) rotate(-3deg);z-index:1}.stacked-screens .window-back{width:58%;right:0;top:126px;transform:perspective(1200px) rotateY(-9deg) rotateX(2deg) rotate(-2deg);z-index:2}.stacked-screens .screen{height:auto;aspect-ratio:16/9}.stacked-screens .screen img{width:100%;height:100%;margin:0;object-fit:contain;object-position:center;background:#0b0b12}.stacked-screens figcaption{top:calc(100% + 25px)}.window-front figcaption{max-width:62%}.stacked-screens figcaption h3{font-size:18px}.stacked-screens figcaption p{font-size:14px}.stacked-screens figure{transition:translate .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s,border-color .65s}.stacked-screens figure:hover{translate:0 -9px;border-color:#bc90ee;box-shadow:inset 0 1px 3px #ead9ff88,0 0 36px #9949e740,0 30px 45px #0006}.sound-active{box-shadow:0 0 13px #be73f866!important}.music-player button{transition:background .3s,box-shadow .3s,scale .3s}.music-player button:hover{scale:1.1}.music-player #video-sound{width:30px;height:30px}
@media(min-width:1450px){.stacked-screens{height:540px}}
@media(max-width:950px){.showcase-layout{display:block}.showcase-copy{margin-bottom:34px}.stacked-screens{height:490px}.window-front figcaption{max-width:60%}}
@media(max-width:700px){.stacked-screens{height:auto;display:flex;flex-direction:column;gap:95px;padding:10px 5px 70px}.stacked-screens .window-front,.stacked-screens .window-back{position:relative;width:96%;left:auto;right:auto;top:auto;transform:perspective(1000px) rotateY(-6deg) rotate(-2deg);align-self:flex-start}.stacked-screens .window-back{width:96%;align-self:flex-end;transform:perspective(1000px) rotateY(-6deg) rotate(1deg)}.stacked-screens .screen{height:auto;aspect-ratio:16/9}.window-front figcaption{max-width:none}.stacked-screens figcaption{top:calc(100% + 16px);transform:none}.stacked-screens figcaption h3{font-size:18px}.stacked-screens figcaption p{font-size:14px}.features{margin-top:20px}}
/* Motion has a shared tempo; angles and screen contents stay legible. */
@media(prefers-reduced-motion:no-preference){
 .motion-ready .reveal{opacity:0;transition:opacity .85s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms)}
 .motion-ready .reveal.in-view{opacity:1}
 .hero-media.in-view{animation:frame-light 7s ease-in-out 1s infinite}
 .hero:before{animation:orbit-drift 16s ease-in-out infinite alternate}
 .hero:after{animation:halo-breathe 9s ease-in-out infinite alternate}
 .showcase:before{animation:showcase-orbit 18s ease-in-out infinite alternate}
 .showcase:after{animation:halo-breathe 10s ease-in-out infinite alternate}
 .discord-art{animation:discord-float 7s ease-in-out infinite}
 .hero .primary{position:relative;overflow:hidden;isolation:isolate;translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:translate .2s,transform .3s,box-shadow .4s;animation:cta-light 5s ease-in-out infinite}
 .hero .primary:after{content:'';position:absolute;inset:-50% -60%;background:linear-gradient(110deg,transparent 36%,#ffffff30 45%,#ffffff60 50%,transparent 59%);transform:translateX(-80%);animation:button-sheen 7s cubic-bezier(.2,.7,.2,1) infinite;pointer-events:none;z-index:-1}
 .nav-contact{translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:translate .2s,transform .3s}
 .nav nav a{position:relative}.nav nav a:after{content:'';position:absolute;height:1px;left:0;right:0;bottom:-6px;background:#b885ff;transform:scaleX(0);transform-origin:left;transition:transform .35s}.nav nav a:hover:after{transform:scaleX(1)}
 .intro-cards article,.feature{position:relative;isolation:isolate;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s,opacity .85s,translate .85s,filter .85s}
 .intro-cards article:before,.feature:before{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(260px circle at var(--light-x,50%) var(--light-y,50%),#b575ff20,transparent 72%);opacity:0;transition:opacity .45s;z-index:-1;pointer-events:none}
 .intro-cards article:hover,.feature:hover{transform:translateY(-6px);border-color:#8c62bb;box-shadow:0 17px 40px #0005,0 0 25px #8b43d322}.intro-cards article:hover:before,.feature:hover:before{opacity:1}
 .intro-icon,.feature-icon{transition:scale .45s,rotate .45s,box-shadow .45s}.intro-cards article:hover .intro-icon,.feature:hover .feature-icon{scale:1.06;rotate:-5deg;box-shadow:0 0 24px #aa58f62b}
 .contact{transition:border-color .6s,box-shadow .6s,opacity .85s,translate .85s,filter .85s}.contact:hover{border-color:#bc83fa;box-shadow:0 0 45px #8745c922}.faq summary{transition:color .3s}.faq summary:hover{color:#c9a3ff}.faq summary:after{transition:transform .3s}
 .screen img{transition:filter .45s}.screen:hover img{filter:brightness(1.09)}
 .gallery-open{overflow:hidden}
}
@keyframes frame-light{0%,100%{box-shadow:0 28px 60px #0008,0 0 30px #8e30e324,inset 0 0 2px #e9b5ff80}50%{box-shadow:0 28px 60px #0008,0 0 43px #8e30e348,inset 0 0 3px #e9b5ffa0}}
@keyframes cta-light{0%,100%{box-shadow:inset 0 1px 7px #e0b1ff80,0 7px 29px #9926ef55,0 0 14px #b949e52b}50%{box-shadow:inset 0 1px 7px #e0b1ffa0,0 7px 36px #9926ef80,0 0 18px #b949e54a}}
@keyframes button-sheen{0%,60%{transform:translateX(-80%)}85%,100%{transform:translateX(80%)}}
@keyframes orbit-drift{from{transform:translate(-8px,-8px) rotate(25deg)}to{transform:translate(16px,12px) rotate(29deg)}}
@keyframes showcase-orbit{from{transform:translate(0,-8px) rotate(-26deg)}to{transform:translate(-20px,12px) rotate(-22deg)}}
@keyframes halo-breathe{from{opacity:.55}to{opacity:1}}
@keyframes discord-float{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -12px;rotate:2deg}}
/* Crop only the empty margins around the progress interface. */
.stacked-screens .window-back{width:45%;top:92px}.window-back .screen{aspect-ratio:32/27}.window-back .screen img{width:150%;height:100%;max-width:none;margin-left:-25%;object-fit:fill}.window-back figcaption{max-width:none}
@media(max-width:700px){.stacked-screens .window-back{width:92%;top:auto}}
.audio-start{position:absolute;left:12px;bottom:12px;z-index:3;border:1px solid #cda0ff;border-radius:11px;background:#753ddcec;color:white;padding:10px 13px;font-size:12px;font-weight:600;box-shadow:0 5px 23px #7029cb60;transition:background .25s,transform .25s}.audio-start[hidden]{display:none}.audio-start:hover{background:#935bea;transform:translateY(-2px)}.faq-content{display:flow-root}.faq .faq-content p{margin:0;padding:0 0 24px}.faq details.is-expanded summary:after{transform:rotate(225deg)}.faq details:not(.is-expanded) summary:after{transform:rotate(45deg)}.faq summary:after{transition:transform .4s cubic-bezier(.22,1,.36,1)}

/* Viewport-wide ambient background; the content width no longer clips its curves. */
html{overflow-x:clip}body{overflow-x:clip;position:relative;isolation:isolate;background:var(--bg)}body:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 24%,#622b9420,transparent 55%),radial-gradient(ellipse at 7% 85%,#57257814,transparent 58%)}.page{overflow:visible}.hero:before{width:clamp(950px,80vw,2200px);height:clamp(400px,30vw,800px);left:calc(50% - 65vw)}.hero:after{filter:none;background:radial-gradient(ellipse,#8b3eef32,transparent 72%)}.showcase:before{width:clamp(900px,75vw,2100px);height:clamp(470px,36vw,950px);right:calc(50% - 64vw)}.showcase:after{width:max(85%,70vw);right:calc(50% - 52vw)}
@media(max-width:700px){.hero:before{width:700px;height:400px;left:-450px}.showcase:before{width:900px;height:470px;right:-380px}.showcase:after{width:105%;right:-20%}}
.mobile-video-controls{display:none}
@media(max-width:700px){.hero{gap:24px;padding-top:28px}.hero h1{font-size:clamp(52px,12vw,68px)}.hero .lead{margin-bottom:22px}.reference-preview{display:block;padding:8px;border-radius:20px;transform:none}.reference-preview .preview-sidebar,.game-stage .floating-card,.game-stage .audio-start{display:none}.game-stage{height:auto;aspect-ratio:16/9;border-radius:12px}.game-stage video{width:100%;height:100%;object-fit:contain}.mobile-video-controls{display:flex;justify-content:space-between;gap:10px;padding:9px 2px 1px;min-height:51px}.mobile-video-controls button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 12px;border:1px solid #654384;background:#1d142b;color:#ead9ff;border-radius:10px;font-size:13px}.mobile-video-controls button[hidden]{display:none}.mobile-video-controls #mobile-sound{margin-left:auto;border-color:#a56adb;background:#7637c9;color:white}}
/* Let the demonstration and main actions carry the light. */
.hero{padding-bottom:74px}.showcase{padding-top:135px;padding-bottom:115px}.features{margin-top:65px;gap:25px}.faq{margin-top:74px;margin-bottom:80px}.hero:before{opacity:.55}.hero:after{background:radial-gradient(ellipse,#8b3eef20,transparent 72%)}.showcase:before{opacity:.55}.showcase:after{background:linear-gradient(180deg,#7e43ce0c,transparent);border-color:#885bd926}.intro-cards article,.feature{background:linear-gradient(130deg,#15121d,#11121a);border-color:#342a42}.intro-cards article:hover,.feature:hover{box-shadow:0 14px 34px #0004;border-color:#71548f}.intro-cards article:hover .intro-icon,.feature:hover .feature-icon{box-shadow:none}.intro-cards article:before,.feature:before{background:radial-gradient(260px circle at var(--light-x,50%) var(--light-y,50%),#b575ff10,transparent 72%)}.contact:hover{box-shadow:none}.demo-screen{position:relative}.demo-screen:after{display:none!important}.demo-screen video{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:contain;background:#0c0b13}.stacked-screens .demo-window{border-color:#b87bec;box-shadow:inset 0 1px 3px #ead9ff70,0 0 28px #9744e432,0 24px 40px #0005}.stacked-screens .demo-window:hover,.stacked-screens .demo-window:focus-within{z-index:3;border-color:#d09afd;box-shadow:inset 0 1px 3px #ead9ff88,0 0 35px #9744e442,0 24px 40px #0005}.stacked-screens .window-back{box-shadow:inset 0 1px 2px #d4b5ff50,0 17px 36px #0004}.window-front figcaption{max-width:65%}
@media(max-width:950px){.showcase{padding-top:100px;padding-bottom:90px}.features{margin-top:48px}}
@media(max-width:700px){.hero{padding-bottom:42px}.showcase{padding-top:75px;padding-bottom:78px}.features{margin-top:42px;gap:17px}.faq{margin-top:48px;margin-bottom:56px}.window-front figcaption{max-width:none}.demo-screen video{object-fit:contain}}
