:root{--c-bg:#e6e6fa;--c-card-light:#f8f4ff;--c-purple-light:#9d81ba;--c-purple-mid:#8b5fbf;--c-brand:#673147;--c-brand-dark:#2d1b33;--c-card-dark:#2d1b33;--c-grid:indigo;--f-display:"Mada", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}html,body{min-height:100%}#root{min-height:100vh}body{background-color:var(--c-bg);color:var(--c-brand);font-family:var(--f-display);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;position:relative;overflow-x:hidden}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}a{color:inherit;text-decoration:none}button{font-family:inherit}.bg-canvas{z-index:0;pointer-events:none;background-image:repeating-radial-gradient(circle,#0000 0 48px,#6731470f 48px 50px);width:200%;height:200%;animation:150s linear infinite rotateBg;position:fixed;top:-50%;left:-50%;-webkit-mask-image:linear-gradient(to bottom right,#000 20%,#0000 80%);mask-image:linear-gradient(to bottom right,#000 20%,#0000 80%)}@keyframes rotateBg{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.1)}to{transform:rotate(360deg)scale(1)}}@media (prefers-reduced-motion:reduce){.bg-canvas{animation:none}}.particle-canvas{z-index:1;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.topnav{top:0;z-index:50;background:0 0;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem clamp(1.25rem,5vw,4rem);display:flex;position:fixed;inset-inline:0}.topnav-brand{letter-spacing:-.01em;color:var(--c-brand-dark);font-size:1.5rem;font-weight:900}.topnav-links{gap:1.75rem;display:flex}.topnav-links a{color:var(--c-brand);padding:.25rem 0;font-size:1.02rem;font-weight:600;transition:color .25s;position:relative}.topnav-links a:after{content:"";bottom:-2px;background:var(--c-brand-dark);height:2px;transition:transform .25s;position:absolute;inset-inline:0;transform:scaleX(0)}.topnav-links a:hover{color:var(--c-brand-dark)}.topnav-links a:hover:after{transform:scaleX(1)}.topnav-actions{align-items:center;gap:.6rem;display:flex}.topnav-login{color:var(--c-brand);border-radius:999px;padding:.55rem .85rem;font-weight:700;transition:color .25s}.topnav-login:hover{color:var(--c-brand-dark)}.topnav-cta{background:var(--c-brand-dark);color:var(--c-bg);border-radius:999px;padding:.6rem 1.4rem;font-weight:800;transition:transform .25s,opacity .25s}.topnav-cta:hover{opacity:.92;transform:translateY(-2px)}.topnav-burger{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;padding:8px;display:none}.topnav-burger span{background:var(--c-brand-dark);border-radius:2px;width:26px;height:2.5px;transition:transform .3s,opacity .3s}.topnav-burger.is-open span:first-child{transform:translateY(7.5px)rotate(45deg)}.topnav-burger.is-open span:nth-child(2){opacity:0}.topnav-burger.is-open span:nth-child(3){transform:translateY(-7.5px)rotate(-45deg)}.topnav-mobile{top:58px;-webkit-backdrop-filter:blur(14px);opacity:0;pointer-events:none;background:#f5f2faf7;border-bottom:1px solid #6731471a;flex-direction:column;padding:.5rem 1.5rem 1.25rem;transition:transform .3s,opacity .3s;display:flex;position:fixed;inset-inline:0;transform:translateY(-12px)}.topnav-mobile.is-open{opacity:1;pointer-events:auto;transform:translateY(0)}.topnav-mobile a{color:var(--c-brand);border-bottom:1px solid #67314714;padding:.85rem .25rem;font-size:1.1rem;font-weight:700}.topnav-mobile a.m-cta{color:var(--c-bg);background:var(--c-brand-dark);text-align:center;border:none;border-radius:999px;margin-top:.85rem}@media (width<=820px){.topnav-links,.topnav-actions{display:none}.topnav-burger{display:flex}}@media (width>=821px){.topnav-mobile{display:none}}.pill-btn{background:var(--c-brand-dark);color:var(--c-bg);font-family:var(--f-display);cursor:pointer;border:none;border-radius:999px;align-items:center;padding:1.25rem 3rem;font-size:1.1rem;font-weight:700;transition:all .4s cubic-bezier(.25,1,.5,1);display:inline-flex;position:relative;overflow:hidden}.pill-btn:after{content:"";box-shadow:inset 0 0 0 2px var(--c-brand-dark);opacity:0;border-radius:999px;transition:all .4s cubic-bezier(.25,1,.5,1);position:absolute;inset:0;transform:scale(1.1)}.pill-label{z-index:1;position:relative}.btn-icon{z-index:1;opacity:0;transition:all .4s cubic-bezier(.25,1,.5,1);position:absolute;left:1.5rem;transform:translate(10px)}.pill-btn:hover{color:var(--c-brand-dark);background:0 0;padding-left:4rem}.pill-btn:hover:after{opacity:1;transform:scale(1)}.pill-btn:hover .btn-icon{opacity:1;transform:translate(0)}.hero-section{z-index:30;direction:ltr;flex-direction:column;align-items:flex-start;max-width:520px;display:flex;position:absolute;bottom:12vh;left:8vw}.hero-title{font-family:var(--f-display);letter-spacing:-.02em;color:var(--c-brand-dark);will-change:transform;margin-bottom:2rem;font-size:clamp(5rem,10vw,11rem);font-weight:900;line-height:.85;transition:transform .3s ease-out}.hero-desc{text-align:left;color:var(--c-brand);opacity:.85;max-width:90%;margin-bottom:2.5rem;font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.6}@media (width<=768px){.hero-section{text-align:center;align-items:center;max-width:88vw;bottom:14vh;left:50%;transform:translate(-50%)}.hero-desc{text-align:center}}.scatter-container{z-index:10;pointer-events:none;width:70vw;height:100%;position:absolute;top:0;right:0}.tool-card{pointer-events:auto;cursor:pointer;will-change:transform;border-radius:16px;width:180px;height:112px;transition:all .5s cubic-bezier(.34,1.56,.64,1);position:absolute;overflow:hidden;box-shadow:0 20px 40px #2d1b3314}.tool-card:after{content:"";pointer-events:none;border-radius:16px;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #fff3}.tool-card:hover{box-shadow:0 30px 60px #2d1b3326;z-index:20!important;transform:scale(1.15)translateY(-10px)!important}.tool-card.clicked{animation:.3s ease-out card-click}@keyframes card-click{0%{transform:scale(1.15)translateY(-10px)}50%{transform:scale(.95)translateY(5px)}to{transform:scale(1.15)translateY(-10px)}}.ripple{pointer-events:none;background:#6731474d;border-radius:50%;animation:.6s ease-out ripple-effect;position:absolute;transform:scale(0)}@keyframes ripple-effect{to{opacity:0;transform:scale(4)}}@keyframes float-1{0%,to{transform:translate(0)rotate(-4deg)}50%{transform:translate(-15px,-25px)rotate(2deg)}}@keyframes float-2{0%,to{transform:translate(0)rotate(6deg)}50%{transform:translate(20px,-15px)rotate(-2deg)}}@keyframes float-3{0%,to{transform:translate(0)rotate(-2deg)}50%{transform:translate(10px,20px)rotate(4deg)}}@keyframes float-4{0%,to{transform:translate(0)rotate(8deg)}50%{transform:translate(-20px,15px)rotate(1deg)}}.card-1{background:var(--c-purple-mid);z-index:12;animation:12s ease-in-out infinite float-1;top:15%;left:10%}.card-2{background:var(--c-purple-light);z-index:11;animation:14s ease-in-out 1s infinite float-2;top:8%;left:55%}.card-3{background:var(--c-card-dark);z-index:15;animation:15s ease-in-out 2s infinite float-3;top:35%;left:35%}.card-4{background:var(--c-purple-light);z-index:13;animation:13s ease-in-out .5s infinite float-4;top:30%;left:75%}.card-5{background:var(--c-purple-light);z-index:14;animation:16s ease-in-out 1.5s infinite float-2;top:60%;left:15%}.card-6{background:var(--c-purple-mid);z-index:16;animation:14s ease-in-out .2s infinite float-1;top:65%;left:60%}.card-7{background:var(--c-card-dark);z-index:17;animation:15s ease-in-out 2.5s infinite float-4;top:80%;left:35%}.card-8{background:var(--c-card-dark);z-index:11;animation:17s ease-in-out 1s infinite float-3;top:55%;left:85%}.card-art{width:100%;height:100%;position:relative}.card-art svg{width:100%;height:100%;display:block}@media (prefers-reduced-motion:reduce){.tool-card{animation:none}}.reveal{opacity:0;will-change:opacity, transform;transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);transform:translateY(28px)}.reveal.is-visible{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transition:none;transform:none}}.section{z-index:5;max-width:1200px;margin:0 auto;padding:clamp(5rem,10vw,8rem) clamp(1.5rem,7vw,7rem);scroll-margin-top:84px;position:relative}.closing{scroll-margin-top:84px}.section-head{text-align:center;margin-bottom:clamp(2.5rem,5vw,4rem)}.section-title{letter-spacing:-.02em;color:var(--c-brand-dark);font-size:clamp(2.4rem,5vw,4rem);font-weight:900;line-height:1.05}.section-sub{color:var(--c-brand);opacity:.8;max-width:60ch;margin:1rem auto 0;font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.6}.grid-cell{display:flex}.grid-cell>*{flex:1;width:100%}.games-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem;display:grid}.game-tile{background:var(--tile-bg);cursor:pointer;border-radius:18px;align-items:flex-end;min-height:150px;padding:1.25rem;transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s;display:flex;position:relative;overflow:hidden;box-shadow:0 16px 36px #2d1b331a}.game-tile:hover{transform:translateY(-8px)scale(1.02);box-shadow:0 26px 50px #2d1b3333}.game-tile .g-spot{top:-30px;background:#ffffff1f;border-radius:50%;width:120px;height:120px;position:absolute;inset-inline-start:-30px}.game-tile.dark-text .g-spot{background:#6731471a}.game-tile .g-name{z-index:2;font-size:1.5rem;font-weight:800;position:relative}.game-tile.light-text .g-name{color:var(--c-card-light)}.game-tile.dark-text .g-name{color:var(--c-brand-dark)}.steps{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;display:grid}.step{background:var(--c-card-light);border-radius:20px;padding:2.25rem 1.75rem;transition:transform .35s,box-shadow .35s;box-shadow:0 16px 36px #2d1b3314}.step:hover{transform:translateY(-6px);box-shadow:0 24px 48px #2d1b3324}.step-num{background:var(--c-brand-dark);width:56px;height:56px;color:var(--c-bg);border-radius:50%;justify-content:center;align-items:center;margin-bottom:1.25rem;font-size:1.5rem;font-weight:900;display:flex}.step h3{color:var(--c-brand-dark);margin-bottom:.6rem;font-size:1.4rem;font-weight:800}.step p{color:var(--c-brand);opacity:.8;line-height:1.6}.plans{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));align-items:stretch;gap:1.5rem;display:grid}.plan{background:var(--c-card-light);border-radius:24px;flex-direction:column;padding:2.5rem 2rem;transition:transform .35s,box-shadow .35s;display:flex;position:relative;box-shadow:0 16px 36px #2d1b3314}.plan:hover{transform:translateY(-8px);box-shadow:0 28px 56px #2d1b3329}.plan.featured{background:var(--c-brand-dark);color:var(--c-bg)}.plan-badge{top:1.25rem;background:var(--c-purple-mid);color:#fff;border-radius:999px;padding:.35rem .8rem;font-size:.8rem;font-weight:700;position:absolute;inset-inline-start:1.25rem}.plan-name{margin-bottom:1rem;font-size:1.4rem;font-weight:800}.plan-price{font-size:3.2rem;font-weight:900;line-height:1}.plan-price .cur{opacity:.8;margin-inline-start:.4rem;font-size:1.1rem;font-weight:700}.plan-period{opacity:.7;margin-top:.4rem;margin-bottom:1.5rem}.plan ul{flex-direction:column;gap:.7rem;margin-bottom:2rem;list-style:none;display:flex}.plan li{align-items:center;gap:.6rem;display:flex}.plan li svg{color:var(--c-purple-mid);flex:none}.plan.featured li svg{color:var(--c-purple-light)}.plan-cta{text-align:center;background:var(--c-brand-dark);color:var(--c-bg);border-radius:999px;margin-top:auto;padding:.9rem 1.5rem;font-size:1.05rem;font-weight:800;transition:transform .3s,opacity .3s}.plan.featured .plan-cta{background:var(--c-bg);color:var(--c-brand-dark)}.plan-cta:hover{opacity:.92;transform:translateY(-2px)}.features-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;display:grid}.feature{background:var(--c-card-light);border-radius:20px;padding:2rem;transition:transform .35s,box-shadow .35s;box-shadow:0 16px 36px #2d1b3312}.feature:hover{transform:translateY(-6px);box-shadow:0 24px 48px #2d1b3324}.feature-icon{background:var(--c-purple-light);width:60px;height:60px;color:var(--c-brand-dark);border-radius:16px;justify-content:center;align-items:center;margin-bottom:1.25rem;display:flex}.feature h3{color:var(--c-brand-dark);margin-bottom:.5rem;font-size:1.3rem;font-weight:800}.feature p{color:var(--c-brand);opacity:.8;line-height:1.6}.closing{z-index:5;text-align:center;padding:clamp(4rem,8vw,7rem) 1.5rem;position:relative}.closing h2{letter-spacing:-.02em;color:var(--c-brand-dark);margin-bottom:2rem;font-size:clamp(2.4rem,6vw,4.5rem);font-weight:900}.closing-cta{justify-content:center;display:flex}.site-footer{z-index:5;border-top:1px solid #67314726;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;max-width:1200px;margin:0 auto;padding:3rem clamp(1.5rem,7vw,7rem) 2.5rem;display:flex;position:relative}.footer-brand{color:var(--c-brand-dark);font-size:1.8rem;font-weight:900}.footer-links{flex-wrap:wrap;gap:1.5rem;display:flex}.footer-links a{color:var(--c-brand);font-weight:600;transition:color .3s}.footer-links a:hover{color:var(--c-brand-dark)}.footer-copy{text-align:center;width:100%;color:var(--c-brand);opacity:.6;padding-top:1rem;font-size:.9rem}.home{width:100%;position:relative}.hero-screen{width:100%;height:100vh;min-height:600px;position:relative;overflow:hidden}.placeholder{width:100%;min-height:100vh;position:relative;overflow:hidden}.placeholder-inner{z-index:5;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;height:100%;padding:1rem;display:flex;position:relative}.placeholder-inner h1{letter-spacing:-.02em;color:var(--c-brand);font-size:clamp(2.5rem,8vw,5rem);font-weight:900}.placeholder-inner p{color:var(--c-purple-mid);font-size:1.2rem;font-weight:500}.placeholder-inner .back{color:var(--c-purple-mid);border-bottom:2px solid var(--c-purple-light);margin-top:.75rem;padding-bottom:2px;font-weight:700;transition:color .3s}.placeholder-inner .back:hover{color:var(--c-brand)}
