@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";:root{--bg: #050510;--purple: #a855f7;--purple-dark: #6b21a8;--purple-glow: rgba(168, 85, 247, .6);--green: #4ade80;--green-glow: rgba(74, 222, 128, .5);--cyan: #22d3ee;--cyan-glow: rgba(34, 211, 238, .5);--pink: #f472b6;--pink-glow: rgba(244, 114, 182, .5);--text: #f1f5f9;--text-dim: #94a3b8}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:"Press Start 2P",monospace;font-size:10px;line-height:1.8;min-height:100vh;overflow-x:hidden}.page-shell:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px);pointer-events:none;z-index:1000}.page-shell{min-height:100vh;position:relative}.galaxy-bg{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:0;background:radial-gradient(ellipse at 20% 20%,rgba(168,85,247,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(34,211,238,.1) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(6,6,20,1) 0%,var(--bg) 100%)}.pixel-stars{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(2px 2px at 10% 20%,#fff 100%,transparent),radial-gradient(2px 2px at 25% 45%,rgba(255,255,255,.8) 100%,transparent),radial-gradient(3px 3px at 40% 10%,var(--purple) 100%,transparent),radial-gradient(2px 2px at 55% 80%,#fff 100%,transparent),radial-gradient(2px 2px at 70% 35%,rgba(255,255,255,.6) 100%,transparent),radial-gradient(3px 3px at 85% 60%,var(--cyan) 100%,transparent),radial-gradient(2px 2px at 15% 70%,#fff 100%,transparent),radial-gradient(2px 2px at 30% 90%,rgba(255,255,255,.7) 100%,transparent),radial-gradient(2px 2px at 60% 50%,#fff 100%,transparent),radial-gradient(3px 3px at 90% 15%,var(--pink) 100%,transparent),radial-gradient(2px 2px at 5% 55%,rgba(255,255,255,.9) 100%,transparent),radial-gradient(2px 2px at 75% 85%,#fff 100%,transparent),radial-gradient(2px 2px at 45% 25%,var(--green) 100%,transparent),radial-gradient(2px 2px at 95% 40%,#fff 100%,transparent),radial-gradient(3px 3px at 20% 5%,var(--purple) 100%,transparent),radial-gradient(2px 2px at 50% 95%,rgba(255,255,255,.8) 100%,transparent),radial-gradient(2px 2px at 35% 65%,#fff 100%,transparent),radial-gradient(2px 2px at 80% 25%,rgba(255,255,255,.6) 100%,transparent),radial-gradient(2px 2px at 65% 70%,var(--cyan) 100%,transparent),radial-gradient(2px 2px at 12% 88%,rgba(255,255,255,.7) 100%,transparent);animation:twinkle 4s ease-in-out infinite alternate}@keyframes twinkle{0%{opacity:.7}to{opacity:1}}.nebula{position:absolute;border-radius:50%;filter:blur(80px);animation:pulse-glow 6s ease-in-out infinite alternate}.nebula--1{top:-10%;left:-20%;width:60%;height:60%;background:radial-gradient(ellipse at center,var(--purple) 0%,transparent 60%);opacity:.4}.nebula--2{bottom:-20%;right:-15%;width:70%;height:60%;background:radial-gradient(ellipse at center,var(--cyan) 0%,var(--purple-dark) 30%,transparent 60%);opacity:.3;animation-delay:3s}@keyframes pulse-glow{0%{opacity:.25;transform:scale(1)}to{opacity:.45;transform:scale(1.1)}}.planet{position:absolute;border-radius:12px;animation:float 8s ease-in-out infinite}.planet--1{top:10%;right:8%;width:70px;height:70px;background:linear-gradient(135deg,var(--pink) 0%,var(--purple-dark) 100%);box-shadow:inset -10px -10px 20px #0006,inset 5px 5px 10px #ffffff1a,0 0 40px var(--pink-glow),0 0 80px var(--pink-glow)}.planet--2{bottom:15%;left:5%;width:50px;height:50px;background:linear-gradient(135deg,var(--cyan) 0%,#0369a1 100%);border-radius:10px;box-shadow:inset -8px -8px 15px #0006,inset 4px 4px 8px #ffffff1a,0 0 30px var(--cyan-glow),0 0 60px var(--cyan-glow);animation-delay:2s}.planet--1:before,.planet--2:before{content:"";position:absolute;top:15%;left:15%;width:20%;height:20%;background:#ffffff80;border-radius:50%}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(5deg)}}.pixel-asteroid{position:absolute;background:linear-gradient(135deg,#6b7280,#374151);border-radius:3px;box-shadow:2px 2px #00000080;animation:drift 20s linear infinite}.pixel-asteroid--1{top:30%;right:20%;width:12px;height:8px}.pixel-asteroid--2{top:55%;left:15%;width:8px;height:10px;animation-delay:5s;animation-duration:25s}.pixel-asteroid--3{bottom:40%;right:25%;width:14px;height:8px;animation-delay:10s;animation-duration:18s}@keyframes drift{0%{transform:translate(0) translateY(0) rotate(0)}to{transform:translate(-50px) translateY(30px) rotate(360deg)}}.game-landing{position:relative;z-index:1}.splash{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:60px;gap:60px}.splash-ship{position:relative;display:flex;flex-direction:column;align-items:center;animation:ship-hover 4s ease-in-out infinite;filter:drop-shadow(0 0 20px var(--purple-glow)) drop-shadow(0 0 40px var(--purple-glow))}@keyframes ship-hover{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.ship{width:100%;max-width:450px;height:auto;image-rendering:pixelated;transform:scaleX(-1);-webkit-mask-image:linear-gradient(to bottom,black 0%,black 55%,transparent 90%),linear-gradient(to right,transparent 0%,black 25%,black 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,black 0%,black 55%,transparent 90%),linear-gradient(to right,transparent 0%,black 25%,black 100%);mask-composite:intersect}.splash-content{display:flex;flex-direction:column;gap:36px}.game-title{display:flex;flex-direction:column;gap:12px}.title-pre{font-size:11px;color:var(--cyan);letter-spacing:6px;text-shadow:0 0 10px var(--cyan-glow),0 0 20px var(--cyan-glow);animation:flicker 3s ease-in-out infinite}@keyframes flicker{0%,to{opacity:1}92%{opacity:1}93%{opacity:.8}94%{opacity:1}95%{opacity:.9}96%{opacity:1}}.game-title h1{font-size:clamp(42px,8vw,72px);line-height:1.1;color:#fff;text-shadow:0 0 10px var(--purple-glow),0 0 20px var(--purple-glow),0 0 40px var(--purple-glow),4px 4px 0 var(--purple-dark);animation:title-pulse 3s ease-in-out infinite alternate}@keyframes title-pulse{0%{text-shadow:0 0 10px var(--purple-glow),0 0 20px var(--purple-glow),0 0 40px var(--purple-glow),4px 4px 0 var(--purple-dark)}to{text-shadow:0 0 20px var(--purple-glow),0 0 40px var(--purple-glow),0 0 60px var(--purple-glow),4px 4px 0 var(--purple-dark)}}.title-tagline{font-size:14px;color:var(--green);letter-spacing:3px;text-shadow:0 0 10px var(--green-glow),0 0 20px var(--green-glow)}.splash-desc{font-size:12px;line-height:2.2;color:var(--text-dim);max-width:450px;text-shadow:0 2px 4px rgba(0,0,0,.5)}.splash-cta{display:flex;gap:20px}.splash-hint{font-size:10px;color:var(--text-dim);display:flex;align-items:center;gap:10px}.blink{color:var(--green);text-shadow:0 0 10px var(--green-glow);animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.arcade-btn{display:inline-flex;align-items:center;gap:14px;padding:18px 36px;background:linear-gradient(180deg,var(--purple) 0%,var(--purple-dark) 100%);border:4px solid #fff;color:#fff;font-family:"Press Start 2P",monospace;font-size:14px;cursor:pointer;text-decoration:none;position:relative;overflow:hidden;box-shadow:0 0 20px var(--purple-glow),0 8px 0 var(--purple-dark),0 10px 20px #0006;transition:all .15s ease;text-shadow:0 2px 4px rgba(0,0,0,.3)}.arcade-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.arcade-btn:hover{transform:translateY(-4px);box-shadow:0 0 30px var(--purple-glow),0 0 60px var(--purple-glow),0 12px 0 var(--purple-dark),0 14px 30px #0006}.arcade-btn:hover:before{left:100%}.arcade-btn:active{transform:translateY(4px);box-shadow:0 0 20px var(--purple-glow),0 4px 0 var(--purple-dark),0 6px 15px #0006}.btn-icon{font-size:12px;animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translate(0)}50%{transform:translate(3px)}}.arcade-btn--large{font-size:18px;padding:24px 48px}.select-screen{padding:100px 60px;position:relative}.select-header{display:flex;align-items:center;justify-content:center;gap:30px;margin-bottom:60px}.select-header h2{font-size:20px;white-space:nowrap;text-shadow:0 0 20px var(--purple-glow),0 0 40px var(--purple-glow)}.header-line{flex:1;max-width:200px;height:4px;background:linear-gradient(90deg,transparent,var(--purple),transparent);box-shadow:0 0 10px var(--purple-glow)}.select-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:30px;max-width:1100px;margin:0 auto}.select-card{background:linear-gradient(180deg,#140a28e6,#0a0519f2);border:3px solid var(--purple);padding:28px;position:relative;transition:all .3s ease;box-shadow:0 0 20px #a855f733,inset 0 0 30px #a855f70d}.select-card:hover{transform:translateY(-8px) scale(1.02);border-color:var(--cyan);box-shadow:0 0 30px var(--cyan-glow),0 0 60px #22d3ee4d,inset 0 0 40px #22d3ee1a}.select-card:before{content:"";position:absolute;top:-3px;left:-3px;right:-3px;height:28px;background:linear-gradient(90deg,var(--purple-dark),var(--purple),var(--purple-dark));box-shadow:0 0 15px var(--purple-glow)}.select-card:hover:before{background:linear-gradient(90deg,#0369a1,var(--cyan),#0369a1);box-shadow:0 0 15px var(--cyan-glow)}.card-icon{position:absolute;top:2px;right:10px;font-size:16px;filter:drop-shadow(0 0 5px currentColor)}.card-title{margin-top:32px;margin-bottom:18px;font-size:12px;color:var(--green);text-shadow:0 0 10px var(--green-glow)}.card-options{display:flex;flex-direction:column;gap:10px}.card-options span{font-size:9px;color:var(--text-dim);transition:all .2s ease}.select-card:hover .card-options span{color:var(--text);text-shadow:0 0 5px rgba(255,255,255,.3)}.how-to-play{padding:100px 60px;text-align:center}.how-to-play h2{font-size:22px;margin-bottom:60px;text-shadow:0 0 20px var(--purple-glow),0 0 40px var(--purple-glow)}.steps{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;max-width:1200px;margin:0 auto}.step{display:flex;align-items:flex-start;gap:18px;background:linear-gradient(180deg,#140a28cc,#0a0519e6);border:2px solid var(--purple-dark);padding:24px;min-width:200px;transition:all .3s ease;box-shadow:0 0 15px #a855f726}.step:hover{transform:translateY(-5px);border-color:var(--purple);box-shadow:0 0 25px var(--purple-glow)}.step-num{width:40px;height:40px;background:linear-gradient(135deg,var(--purple) 0%,var(--purple-dark) 100%);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;box-shadow:0 0 15px var(--purple-glow)}.step-content{text-align:left}.step-title{font-size:11px;color:var(--cyan);margin-bottom:8px;text-shadow:0 0 10px var(--cyan-glow)}.step-desc{font-size:9px;color:var(--text-dim);line-height:1.8}.step-arrow{font-size:24px;color:var(--green);text-shadow:0 0 15px var(--green-glow);animation:arrow-pulse 1s ease-in-out infinite}@keyframes arrow-pulse{0%,to{opacity:1;transform:translate(0)}50%{opacity:.7;transform:translate(5px)}}@media(max-width:900px){.step-arrow{display:none}}.stats-section{padding:80px 60px;display:flex;justify-content:center;gap:50px;flex-wrap:wrap;max-width:1000px;margin:0 auto}.stat-block{display:flex;flex-direction:column;gap:12px;min-width:220px}.stat-label{font-size:10px;color:var(--text-dim);letter-spacing:1px}.stat-bar{height:20px;background:#581c874d;border:2px solid var(--purple);position:relative;overflow:hidden;box-shadow:0 0 10px #a855f733}.stat-fill{height:100%;background:linear-gradient(90deg,var(--purple-dark),var(--purple));box-shadow:0 0 20px var(--purple-glow);position:relative}.stat-fill:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shine 2s ease-in-out infinite}@keyframes shine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.stat-fill--full{background:linear-gradient(90deg,#0369a1,var(--cyan));box-shadow:0 0 20px var(--cyan-glow)}.stat-fill--green{background:linear-gradient(90deg,#15803d,var(--green));box-shadow:0 0 20px var(--green-glow)}.stat-val{font-size:11px;color:var(--text);text-shadow:0 0 5px rgba(255,255,255,.3)}.insert-coin{padding:120px 60px;display:flex;justify-content:center}.coin-box{text-align:center;padding:60px;border:4px solid var(--purple);background:linear-gradient(180deg,#140a28f2,#0a0519fa);max-width:550px;position:relative;box-shadow:0 0 40px var(--purple-glow),0 0 80px #a855f733,inset 0 0 60px #a855f71a}.coin-box:before{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;background:linear-gradient(45deg,var(--purple),var(--cyan),var(--purple),var(--pink));z-index:-1;animation:border-glow 3s linear infinite;background-size:400% 400%}@keyframes border-glow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.coin-text{font-size:16px;margin-bottom:40px;text-shadow:0 0 20px var(--purple-glow);animation:coin-blink 1.2s step-end infinite}@keyframes coin-blink{0%,to{opacity:1;text-shadow:0 0 20px var(--purple-glow),0 0 40px var(--purple-glow)}50%{opacity:.6;text-shadow:0 0 10px var(--purple-glow)}}.credits{margin-top:30px;font-size:9px;color:var(--cyan);letter-spacing:3px;text-shadow:0 0 10px var(--cyan-glow)}.footer{padding:40px;text-align:center;font-size:11px;color:var(--text-dim);border-top:2px solid var(--purple-dark);background:linear-gradient(180deg,rgba(10,5,25,.95) 0%,var(--bg) 100%);position:relative;z-index:1;box-shadow:0 -10px 40px #a855f71a}.footer span{text-shadow:0 0 10px var(--purple-glow)}@media(max-width:900px){.splash{grid-template-columns:1fr;text-align:center;padding:80px 30px;gap:40px}.splash-ship{order:-1;max-width:320px;margin:0 auto}.splash-content{align-items:center}.splash-desc{text-align:center}.select-screen,.how-to-play,.stats-section,.insert-coin{padding:80px 30px}.coin-box{padding:40px 30px}.select-header h2,.how-to-play h2{font-size:16px}}
