@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap');
:root{--bg:#101018;--panel:#191923;--panel2:#20202d;--text:#f4f0e8;--muted:#92909f;--pink:#ff4f91;--cyan:#50e3d0;--yellow:#f6d66b;--line:#343342;--pixel:'Press Start 2P',monospace;--body:'Rubik',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}.scanlines{position:fixed;inset:0;pointer-events:none;z-index:10;opacity:.055;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px);mix-blend-mode:screen}
.topbar{height:82px;padding:0 7.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;background:#101018ed;position:relative;z-index:12}.brand{display:flex;align-items:center;gap:11px;font:11px var(--pixel);letter-spacing:-1px}.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--pink);color:#17131e;font:22px var(--pixel);clip-path:polygon(0 0,80% 0,80% 20%,100% 20%,100% 100%,0 100%);position:relative}.brand-mark span{font:10px var(--body);position:absolute;right:3px;top:2px}.brand-light{color:var(--cyan)}.brand small{display:block;color:#777486;font:7px var(--pixel);letter-spacing:0;margin-top:7px}.main-nav{display:flex;gap:37px;color:#a7a4b2;font-size:13px}.main-nav a{transition:.2s}.main-nav a:hover,.main-nav a.active{color:var(--cyan)}.top-action{border:1px solid #454253;background:transparent;color:var(--text);padding:12px 17px;font-size:11px;cursor:pointer}.top-action span{color:var(--pink);margin-right:7px}.menu-toggle{display:none;background:none;border:0;color:white;font-size:24px}
.hero{min-height:630px;padding:82px 9% 35px;position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;background:radial-gradient(ellipse at 74% 48%,#29213b 0,transparent 43%),linear-gradient(115deg,#11111b,#151321 70%,#11111b)}.hero:before{content:"";position:absolute;inset:0;opacity:.15;background-image:linear-gradient(#555 1px,transparent 1px),linear-gradient(90deg,#555 1px,transparent 1px);background-size:50px 50px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-copy{position:relative;z-index:1;max-width:550px}.eyebrow{font:9px var(--pixel);letter-spacing:1px;color:var(--cyan);margin-bottom:22px}.eyebrow i{display:inline-block;width:7px;height:7px;background:var(--pink);margin-right:8px;box-shadow:0 0 12px var(--pink)}h1,h2,h3,p{margin-top:0}h1{font:clamp(35px,5vw,66px)/1.25 var(--pixel);letter-spacing:-3px;margin-bottom:26px}h1 em{font-style:normal;color:var(--pink);text-shadow:4px 4px 0 #6e2852}.hero-copy>p{color:#aaa7b5;line-height:1.8;font-size:15px;max-width:420px}.hero-buttons{display:flex;gap:13px;margin-top:31px}.button{border:0;padding:16px 20px;font-weight:700;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:18px;transition:transform .2s,filter .2s}.button:hover{transform:translateY(-3px);filter:brightness(1.1)}.button-primary{background:var(--cyan);color:#10151a;box-shadow:4px 4px 0 #267e78}.button-primary span{font-size:18px}.button-ghost{background:#ffffff09;color:var(--text);border:1px solid #494557}.hero-meta{display:flex;gap:35px;margin-top:58px;color:#777587;font:8px var(--pixel)}.hero-meta b{color:var(--yellow);font-size:15px;margin-right:7px}
.hero-art{height:450px;position:relative;display:grid;place-items:center}.orbit{position:absolute;border:1px solid #ffffff17;border-radius:50%;transform:rotate(-20deg)}.orbit-one{width:480px;height:230px}.orbit-two{width:550px;height:320px;transform:rotate(35deg)}.arcade{position:relative;width:260px;height:365px;background:linear-gradient(110deg,#454052,#252333 35%,#191925);border:5px solid #71667e;border-radius:18px 18px 10px 10px;box-shadow:20px 28px 0 #08080d,0 0 55px #ff4f9130;transform:perspective(700px) rotateY(-8deg);padding:13px 14px}.arcade:before{content:"";position:absolute;inset:5px;border:1px solid #ffffff25;border-radius:12px;pointer-events:none}.arcade-top{height:31px;display:flex;justify-content:space-between;align-items:center;font:8px var(--pixel);color:var(--yellow)}.live-dot{font:7px var(--body);color:var(--pink)}.arcade-screen{height:205px;margin-top:7px;background:linear-gradient(#211b48 0%,#51336e 55%,#f05a8a 100%);border:8px solid #11111a;position:relative;overflow:hidden;box-shadow:inset 0 0 18px #05050a}.screen-sun{position:absolute;width:60px;height:60px;border-radius:50%;background:var(--yellow);top:25px;right:38px;box-shadow:0 0 30px #f6d66b80}.screen-mountain{position:absolute;bottom:34px;width:150px;height:100px;background:#24214d;clip-path:polygon(50% 0,100% 100%,0 100%)}.mountain-a{left:-15px}.mountain-b{right:-20px;bottom:20px;background:#30244f}.screen-ground{position:absolute;bottom:0;height:40px;width:100%;background:repeating-linear-gradient(90deg,#251e45 0 8px,#34234b 8px 16px)}.screen-player{position:absolute;bottom:33px;left:45%;font-size:34px;color:var(--cyan);text-shadow:0 0 15px var(--cyan)}.screen-score{position:absolute;top:9px;left:9px;color:white;font:7px var(--pixel)}.arcade-controls{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 12px}.dpad{font-size:36px;color:#a8a2b4;text-shadow:2px 2px #111}.control-label{font:6px var(--pixel);color:var(--cyan)}.arcade-buttons{display:flex;gap:8px;transform:rotate(-20deg)}.arcade-buttons i{width:18px;height:18px;border-radius:50%;background:var(--pink);box-shadow:2px 3px #7a2449}.arcade-buttons i+ i{background:var(--yellow);box-shadow:2px 3px #8b7130}.arcade-speaker{font-size:12px;letter-spacing:5px;color:#777080;text-align:center}.floating-chip{position:absolute;padding:12px 15px;background:#171622;border:1px solid #595166;color:#a5a1b0;font:8px var(--pixel);line-height:1.8;box-shadow:5px 5px 0 #09090e;transform:rotate(-8deg)}.floating-chip b{color:var(--pink)}.chip-left{left:1%;top:100px}.chip-right{right:0;bottom:82px;transform:rotate(7deg)}.pixel-star{position:absolute;color:var(--yellow);font-size:28px}.star-a{top:35px;right:16%}.star-b{bottom:48px;left:15%;color:var(--pink)}.hero-bottom{position:absolute;bottom:25px;left:9%;right:9%;display:flex;align-items:center;gap:17px;color:#696779;font:7px var(--pixel)}.scroll-line{height:1px;background:#555264;flex:1}
.section-wrap{max-width:1240px;margin:auto;padding-left:7%;padding-right:7%}.catalog{padding-top:100px;padding-bottom:100px}.section-heading{display:flex;align-items:end;justify-content:space-between}.section-heading h2,.feature-intro h2,.community h2{font:clamp(24px,3vw,36px)/1.45 var(--pixel);letter-spacing:-2px;margin:0}.section-heading h2 span,.feature-intro h2 span,.community h2 span{color:var(--pink)}.catalog-count{text-align:right;color:#777486;font:7px var(--pixel);display:flex;flex-direction:column;gap:8px}.catalog-count b{font:22px var(--pixel);color:var(--yellow)}.toolbar{margin:35px 0 25px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.search-box{height:43px;display:flex;align-items:center;gap:10px;padding:0 12px;background:var(--panel);border:1px solid var(--line);min-width:210px;flex:1;max-width:290px;color:#8e8b9c}.search-box>span{font-size:23px}.search-box input{width:100%;background:transparent;border:0;outline:0;color:white;font-size:12px}.search-box kbd{border:1px solid #454253;padding:3px 6px;font-size:10px}.filters{display:flex;gap:5px;flex-wrap:wrap}.filter,.favorites-toggle{border:1px solid transparent;background:transparent;color:#8d899a;padding:11px 13px;font-size:11px;cursor:pointer}.filter.active,.filter:hover{color:var(--cyan);border-color:#50e3d044;background:#50e3d00c}.favorites-toggle{margin-left:auto;border-color:var(--line);color:#d0cbd8}.favorites-toggle span{color:var(--pink);margin-left:6px}
.game-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.game-card{background:var(--panel);border:1px solid #302e3d;min-width:0;transition:transform .22s,border-color .22s;position:relative;overflow:hidden}.game-card:hover{transform:translateY(-6px);border-color:#71627c}.game-art{height:165px;position:relative;display:grid;place-items:center;overflow:hidden}.game-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#171621aa,transparent 70%)}.game-art .art-symbol{font-size:65px;filter:drop-shadow(5px 6px 0 #111);z-index:1;transition:transform .3s}.game-card:hover .art-symbol{transform:scale(1.12) rotate(-5deg)}.art-arcade{background:radial-gradient(circle at 50% 45%,#f9a34b,#8b376a 50%,#2a2047)}.art-puzzle{background:linear-gradient(135deg,#203f5b,#337c83)}.art-action{background:linear-gradient(135deg,#4a245b,#c44972)}.art-space{background:radial-gradient(circle at 55% 40%,#5441a0,#171b3c 65%)}.art-racing{background:linear-gradient(145deg,#194e4b,#e4a04b)}.art-maze{background:linear-gradient(135deg,#25335e,#17172b)}.art-platform{background:linear-gradient(135deg,#a34e5d,#f1b65c)}.art-retro{background:linear-gradient(135deg,#393052,#252e54)}.art-grid{position:absolute;inset:0;opacity:.2;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:18px 18px}.game-tag{position:absolute;top:12px;left:12px;z-index:2;background:#101018c9;color:var(--cyan);padding:6px 8px;font:7px var(--pixel)}.fav-btn{position:absolute;top:9px;right:10px;z-index:3;border:0;background:#101018b8;color:#fff;width:30px;height:30px;border-radius:50%;font-size:17px;cursor:pointer}.fav-btn.selected{color:var(--pink)}.game-info{padding:16px}.game-info h3{font-size:14px;margin:0 0 7px}.game-info p{font-size:11px;color:#8d8999;line-height:1.55;min-height:34px;margin-bottom:15px}.game-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #302e3d;padding-top:12px}.game-bottom span{font:7px var(--pixel);color:#777486}.play-link{border:0;background:none;color:var(--cyan);font-size:11px;font-weight:700;cursor:pointer}.play-link:hover{color:white}.empty-state{text-align:center;padding:50px;color:var(--muted);font-size:13px}
.feature-band{padding-top:75px;padding-bottom:75px;background:#171620;max-width:none;display:grid;grid-template-columns:1fr 1.1fr;gap:10%;align-items:center}.feature-intro{justify-self:end}.feature-intro h2{font-size:clamp(25px,3vw,38px)}.feature-list{max-width:540px}.feature-list article{display:grid;grid-template-columns:44px 1fr 25px;gap:15px;align-items:start;padding:22px 0;border-bottom:1px solid #373442}.feature-icon{font-size:23px;color:var(--cyan)}.feature-list h3{font-size:14px;margin:0 0 7px}.feature-list p{font-size:11px;line-height:1.7;color:#9692a1;margin:0}.feature-list article>b{font:8px var(--pixel);color:#777486;padding-top:4px}
.community{padding-top:90px;padding-bottom:90px;display:flex;justify-content:space-between;align-items:center;gap:25px}.community h2{font-size:clamp(22px,3vw,34px)}.community p{color:#9995a4;font-size:13px;margin:15px 0 0}.footer{border-top:1px solid #302e3d;padding:25px 7%;display:flex;align-items:center;justify-content:space-between;color:#777486;font:7px var(--pixel)}.footer-brand{color:var(--text)}.footer>a:last-child{color:var(--cyan)}
.modal{position:fixed;inset:0;z-index:30;display:none;place-items:center;padding:20px}.modal.open{display:grid}.modal-backdrop{position:absolute;inset:0;background:#07070dcc;backdrop-filter:blur(7px)}.modal-card{position:relative;width:min(500px,100%);background:#191823;border:1px solid #575064;padding:28px;box-shadow:10px 10px 0 #08080d;max-height:95vh;overflow:auto}.modal-close{position:absolute;right:15px;top:10px;background:none;border:0;color:#aaa;font-size:27px;cursor:pointer}.modal-eyebrow{font:8px var(--pixel);color:var(--cyan);margin-bottom:15px}.modal-card h2{font:18px var(--pixel);margin:0 0 12px}.modal-card h2 span{color:var(--pink)}.modal-description{font-size:12px;color:#aaa6b5;line-height:1.6}.game-hud{display:flex;justify-content:space-between;font:8px var(--pixel);color:#9c98a7;margin:18px 0 10px}.game-hud b{color:var(--yellow);margin-left:8px}#gameCanvas{display:block;width:min(100%,400px);height:auto;margin:auto;background:#0e1720;border:4px solid #38354a;image-rendering:pixelated}.game-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:17px}.game-controls .button{padding:12px 15px;font-size:10px}.game-controls>span{font-size:9px;color:#9692a1}.mobile-controls{display:none;margin-top:15px;text-align:center}.mobile-controls button{width:42px;height:35px;margin:3px;background:#292736;border:1px solid #514b62;color:white;font-size:18px}
@media(max-width:950px){.hero{padding-left:7%;padding-right:7%}.hero-art{transform:scale(.86)}.game-grid{grid-template-columns:repeat(2,1fr)}.toolbar{align-items:flex-start}.favorites-toggle{margin-left:0}.feature-band{gap:5%}}
@media(max-width:650px){.topbar{height:70px;padding:0 5%}.main-nav,.top-action{display:none}.menu-toggle{display:block}.main-nav.mobile-open{display:flex;position:absolute;top:69px;left:0;right:0;background:#171620;padding:20px;flex-direction:column;gap:18px;border-bottom:1px solid var(--line)}.hero{display:block;padding:65px 7% 70px;min-height:0}.hero-copy{max-width:100%}h1{font-size:clamp(34px,9vw,52px)}.hero-copy>p{font-size:13px}.hero-art{height:370px;margin-top:15px;transform:scale(.82)}.hero-bottom{left:7%;right:7%;font-size:6px}.hero-meta{margin-top:35px}.section-wrap{padding-left:6%;padding-right:6%}.catalog{padding-top:70px;padding-bottom:70px}.section-heading h2{font-size:24px}.toolbar{gap:9px}.search-box{max-width:none;flex-basis:100%}.filters{width:100%}.filter{padding:9px}.favorites-toggle{padding:9px}.game-grid{gap:10px}.game-art{height:125px}.game-art .art-symbol{font-size:49px}.game-info{padding:12px}.game-info h3{font-size:12px}.game-info p{font-size:10px;min-height:45px}.feature-band{display:block;padding-top:60px;padding-bottom:55px}.feature-intro{margin-bottom:28px}.feature-list article{grid-template-columns:35px 1fr 20px}.community{padding-top:65px;padding-bottom:65px;display:block}.community .button{margin-top:25px}.footer{padding:22px 6%;gap:15px;flex-wrap:wrap}.footer>span{order:3;width:100%;font-size:6px}.modal-card{padding:22px 17px}.game-controls{align-items:flex-start;flex-direction:column}.mobile-controls{display:block}}
@media(max-width:380px){.game-grid{grid-template-columns:1fr}.game-art{height:160px}.hero-buttons{flex-wrap:wrap}.floating-chip{font-size:7px}.arcade{transform:scale(.9)}}