:root{--bg-top: #040915;--bg-mid: #162b57;--bg-bottom: #311b4a;--card: rgba(7, 17, 36, .84);--ink: #eff6ff;--muted: #b7c9e7;--accent: #69dcff;--shadow: 0 12px 30px rgba(2, 4, 10, .36)}*{box-sizing:border-box}body{margin:0;font-family:Trebuchet MS,Segoe UI,sans-serif;color:var(--ink);min-height:100vh;background:radial-gradient(circle at 20% 14%,rgba(116,236,255,.18),transparent 40%),radial-gradient(circle at 85% 0%,rgba(255,106,146,.13),transparent 36%),linear-gradient(180deg,var(--bg-top),var(--bg-mid) 58%,var(--bg-bottom))}.page{width:min(100%,920px);margin:0 auto;padding:14px 12px 28px}.hero h1{margin:0;font-size:clamp(1.9rem,6vw,2.7rem);letter-spacing:.02em}.subtitle{margin:10px 0 0;color:var(--muted);line-height:1.42}.game-card{margin-top:15px;border-radius:16px;background:var(--card);border:1px solid rgba(255,255,255,.2);box-shadow:var(--shadow);backdrop-filter:blur(8px);padding:12px}.hud{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 14px;margin-bottom:10px;font-weight:600}.hud p{margin:0}#earthState.locked{color:#ffc3cb}#earthState.unlocked{color:#9fffb9}.canvas-wrap{position:relative;width:100%;aspect-ratio:9 / 16;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.25);background:#050811}#gameCanvas{display:block;width:100%;height:100%;touch-action:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#030b168c;padding:16px}.overlay.hidden{display:none}.overlay-card{width:min(100%,380px);border-radius:14px;border:1px solid rgba(105,220,255,.35);background:#040e1fe6;box-shadow:var(--shadow);text-align:center;padding:14px 12px}.overlay-card h2{margin:0}.overlay-card p{margin:10px 0 0;line-height:1.42}.action-btn{border:0;margin-top:12px;padding:10px 14px;border-radius:10px;background:linear-gradient(180deg,#9ef2ff,#69dcff);color:#03203b;font-weight:700;font-size:1rem}.controls{margin-top:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.dir-btn{border:0;border-radius:12px;padding:11px 8px;color:#f3fbff;font-size:.94rem;font-weight:700;background:linear-gradient(180deg,#20335f,#162542);box-shadow:0 7px 14px #00000045}.dir-btn:active{transform:translateY(1px)}.instructions,.seo-copy{margin-top:16px;border-radius:14px;background:#030c1e94;border:1px solid rgba(255,255,255,.16);padding:12px}.instructions h2,.seo-copy h2{margin-top:0}.instructions ol{margin:8px 0;padding-left:18px}.instructions li{margin:6px 0;line-height:1.36}.hint{margin:8px 0 0;color:var(--muted)}kbd{border:1px solid rgba(255,255,255,.3);border-radius:5px;padding:0 6px;background:#ffffff14}@media(min-width:760px){.page{padding:20px}.canvas-wrap,.controls{max-width:480px;margin-inline:auto}.controls{margin-top:12px}}