*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#080b14;color:#f5f7fb;font-family:"DM Sans",system-ui,sans-serif;line-height:1.5}a{text-decoration:none;color:inherit}button{font:inherit;color:inherit;border:0;cursor:pointer}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 6vw;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:10;background:rgba(8,11,20,.82);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px}.brand-mark{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#f5f7fb;color:#080b14;font-family:"Space Grotesk";font-weight:700}.nav nav{display:flex;gap:32px;color:#a9afbf;font-size:14px}.nav nav a:hover,.text-link:hover{color:#fff}.ghost-btn,.outline-btn{background:transparent;border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 15px;font-weight:600}.hero{max-width:1200px;margin:auto;min-height:680px;padding:92px 6vw 80px;display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center}.eyebrow,.kicker{font-size:11px;letter-spacing:.16em;font-weight:700;color:#9da5b9}.eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:20px}.live-dot{width:7px;height:7px;border-radius:50%;background:#8dffb2;box-shadow:0 0 14px #8dffb2}.hero h1{font-family:"Space Grotesk";font-size:clamp(54px,7vw,86px);line-height:.98;letter-spacing:-.055em;margin:0 0 25px}.hero h1 em{font-style:normal;background:linear-gradient(100deg,#fff 10%,#9da8ff 55%,#f0a9ff);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy>p{max-width:570px;color:#a9afbf;font-size:18px;line-height:1.7}.hero-actions{display:flex;gap:24px;align-items:center;margin-top:30px}.primary-btn{background:#f5f7fb;color:#080b14;padding:14px 20px;border-radius:13px;font-weight:800;transition:transform .2s,box-shadow .2s}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,255,255,.12)}.text-link{font-weight:600;color:#c0c5d2}.mini-stats{display:flex;gap:34px;margin-top:48px}.mini-stats div{display:flex;flex-direction:column}.mini-stats strong{font:700 22px "Space Grotesk"}.mini-stats span{font-size:11px;color:#767e92;margin-top:3px}.hero-card-wrap{position:relative}.hero-card-wrap:before{content:"";position:absolute;inset:-70px;background:radial-gradient(circle,rgba(125,135,255,.2),transparent 62%);z-index:-1}.hero-card{border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));border-radius:28px;padding:28px;box-shadow:0 30px 90px rgba(0,0,0,.35);max-width:440px;margin:auto}.card-top,.panel-head{display:flex;justify-content:space-between;align-items:center;color:#81899d;font-size:10px;letter-spacing:.12em;font-weight:700}.card-top b{letter-spacing:0;color:#a9ffbe;font-size:11px}.challenge-icon{font-size:46px;margin-top:45px}.hero-card h2{font:700 35px "Space Grotesk";letter-spacing:-.03em;margin:5px 0}.hero-card p{color:#8f97a9}.reaction-demo{height:180px;margin:24px 0;border-radius:20px;background:#060810;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.target{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:#f5f7fb;color:#080b14;font-size:12px;font-weight:900;transition:transform .15s}.target:active{transform:scale(.9)}.ms{position:absolute;bottom:14px;font-size:12px;color:#737b8d}.card-btn{width:100%;padding:13px;border-radius:12px;background:rgba(255,255,255,.1);font-weight:700}.section{max-width:1200px;margin:auto;padding:100px 6vw}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}.section h2,.skills h2,.how h2,.cta h2{font:700 42px/1.08 "Space Grotesk";letter-spacing:-.04em;margin:10px 0}.small-note{color:#777f92;font-size:13px}.game-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.game-card{text-align:left;min-height:250px;padding:22px;border-radius:20px;background:#0e1220;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;transition:transform .2s,border-color .2s}.game-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.22)}.game-card.featured{background:linear-gradient(145deg,#171c32,#0e1220)}.game-icon{font-size:34px;margin-bottom:auto}.game-title{font:700 22px "Space Grotesk"}.game-desc{color:#858da0;font-size:13px;margin-top:5px}.game-score{margin-top:22px;font-size:12px;font-weight:800}.skills{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.skill-copy p{color:#9299aa;max-width:480px;font-size:17px}.outline-btn{margin-top:16px}.skill-panel{padding:28px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:#0d111c}.panel-head{font-size:12px;letter-spacing:0;color:#d9dce5;margin-bottom:30px}.panel-head b{color:#8f97aa;font-size:11px}.bar-row{display:grid;grid-template-columns:75px 1fr 28px;gap:12px;align-items:center;margin:20px 0;font-size:12px;color:#9299aa}.bar-row strong{text-align:right;color:#e9ebf2}.bar{height:7px;background:#191e2a;border-radius:20px;overflow:hidden}.bar i{display:block;height:100%;background:#cdd3ff;border-radius:20px}.trend{border-top:1px solid rgba(255,255,255,.08);padding-top:18px;margin-top:26px;color:#9299aa;font-size:12px}.how{text-align:center}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;text-align:left;margin-top:45px}.steps>div{padding:28px;border-top:1px solid rgba(255,255,255,.14)}.steps b{color:#737b8d;font-size:11px}.steps h3{font:700 24px "Space Grotesk";margin:25px 0 6px}.steps p{color:#858da0;font-size:14px}.cta{max-width:1080px;margin:40px auto 100px;padding:45px 50px;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:linear-gradient(120deg,#12172a,#0b0e18);display:flex;justify-content:space-between;align-items:center}.cta h2{font-size:34px;max-width:620px}.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(10px);display:none;place-items:center;z-index:30;padding:20px}.modal.open{display:grid}.modal-box{width:min(620px,100%);background:#0d111c;border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:32px;position:relative}.close{position:absolute;right:18px;top:15px;background:transparent;font-size:28px;color:#9299aa}.game-area{margin-top:25px}.type-text{font:600 20px/1.7 "Space Grotesk";padding:20px;border-radius:14px;background:#070a11;color:#e5e8f0}.type-input{width:100%;margin-top:12px;padding:15px;border-radius:12px;border:1px solid #303648;background:#111625;color:white;outline:none}.type-input:focus{border-color:#8e99ff;box-shadow:0 0 0 3px rgba(142,153,255,.12)}.type-result{text-align:center;margin-top:16px;color:#aeb5c5}.math-q{text-align:center;font:700 42px "Space Grotesk"}.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}.choice{padding:15px;background:#171c2a;border-radius:12px;font-weight:700}.choice:hover{background:#22293a}.memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.memory-card{aspect-ratio:1;background:#181d2b;border-radius:10px;font-size:0}.memory-card.flipped{font-size:25px;background:#2a3146}.focus-board{height:300px;border-radius:15px;background:#070a11;position:relative}.focus-dot{position:absolute;width:36px;height:36px;border-radius:50%;background:#f5f7fb}.focus-score{text-align:center;margin-top:10px;color:#9299aa}.typing-hud{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.typing-hud span{padding:10px 12px;border-radius:12px;background:#111625;color:#7f879b;font-size:11px;text-align:center}.typing-hud b{display:block;color:#f4f6fb;font:700 18px "Space Grotesk"}.bubble-board{height:330px;border-radius:18px;background:radial-gradient(circle at 50% 100%,rgba(124,137,255,.12),transparent 60%),#060810;border:1px solid rgba(255,255,255,.07);position:relative;overflow:hidden}.type-bubble{position:absolute;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#f5f7fb,#aeb8ff);color:#090c15;font:800 17px "Space Grotesk";box-shadow:0 0 25px rgba(160,170,255,.25);animation-name:floatUp;animation-timing-function:linear;animation-fill-mode:forwards}.type-bubble:hover{transform:scale(1.08)}@keyframes floatUp{from{bottom:-58px;transform:scale(.8);opacity:.3}15%{opacity:1}to{bottom:105%;transform:scale(1.05);opacity:.85}}
.auth-box{width:min(470px,100%)}.auth-box input{display:block;width:100%;margin:10px 0;padding:14px 15px;border-radius:12px;border:1px solid #303648;background:#111625;color:#fff;outline:none}.auth-box input:focus{border-color:#8e99ff}.auth-box .primary-btn{width:100%;margin-top:8px}.switch-auth{display:block;width:100%;margin-top:16px;background:none;color:#aeb5c5;font-size:13px}.auth-message{min-height:22px;text-align:center;margin-top:14px;color:#a9ffbe;font-size:13px}.profile-drawer{position:fixed;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);display:none;justify-content:flex-end;z-index:40}.profile-drawer.open{display:flex}.profile-panel{width:min(460px,100%);height:100%;overflow:auto;background:#0d111c;border-left:1px solid rgba(255,255,255,.12);padding:38px 30px;position:relative}.profile-head{display:flex;align-items:center;gap:15px;margin:24px 0}.profile-head h2{font:700 28px "Space Grotesk";margin:0}.profile-head p{margin:3px 0;color:#7f879b;font-size:13px}.avatar{width:54px;height:54px;border-radius:16px;background:#f5f7fb;color:#080b14;display:grid;place-items:center;font:700 24px "Space Grotesk"}.profile-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0 32px}.profile-summary div{padding:15px 8px;text-align:center;border-radius:14px;background:#141927}.profile-summary b{display:block;font:700 22px "Space Grotesk"}.profile-summary span{font-size:10px;color:#7f879b}.profile-panel h3{font:700 15px "Space Grotesk";margin:25px 0 12px}.activity-list{display:grid;gap:7px}.activity-item{display:flex;justify-content:space-between;gap:10px;padding:12px;border-radius:10px;background:#111625;font-size:12px}.activity-item span,.muted{color:#7f879b}.interest-list{display:flex;flex-wrap:wrap;gap:7px}.interest-pill{padding:7px 10px;border-radius:99px;background:#171d2d;color:#cbd1df;font-size:11px}.full{width:100%;margin-top:30px}.typing-input-row{display:grid;grid-template-columns:1fr 110px;gap:10px}.typing-input-row .type-input{margin-top:12px;text-transform:uppercase}.typing-input-row .card-btn{margin-top:12px}
footer{border-top:1px solid rgba(255,255,255,.08);padding:28px 6vw;color:#777f92;display:flex;justify-content:space-between;font-size:12px}@media(max-width:850px){.nav nav{display:none}.hero{grid-template-columns:1fr;gap:30px;padding-top:60px}.hero-card{max-width:none}.game-grid{grid-template-columns:repeat(2,1fr)}.skills{grid-template-columns:1fr;gap:35px}.cta{margin:20px 6vw 60px;display:block}.cta .primary-btn{margin-top:20px}.steps{grid-template-columns:1fr}}@media(max-width:520px){.nav{padding:0 5vw}.hero,.section{padding-left:5vw;padding-right:5vw}.hero h1{font-size:50px}.hero-copy>p{font-size:16px}.mini-stats{gap:20px}.game-grid{grid-template-columns:1fr}.section h2,.skills h2,.how h2{font-size:34px}.cta{padding:30px}.cta h2{font-size:28px}footer{flex-wrap:wrap;gap:14px}.typing-hud span{padding:8px 5px}.bubble-board{height:290px}.typing-input-row{grid-template-columns:1fr 95px}.profile-panel{padding:30px 20px}}