:root{--sky1:#b3e5ff;--sky2:#8fd3ff;--green:#4caf50;--accent:#7c3aed}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,Arial,sans-serif;background:linear-gradient(180deg,var(--sky1),var(--sky2));color:#063}
.wrap{max-width:520px;margin:24px auto;padding:12px;text-align:center}
h1{margin:6px 0 12px;font-family:Orbitron,monospace;color:#046}
.hud{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.score{font-weight:700;color:#043}
.controls{display:flex;gap:8px}
.btn{padding:8px 12px;border-radius:8px;border:0;background:linear-gradient(90deg,var(--accent),#00e5ff);color:#fff;font-weight:700;cursor:pointer}
.btn.ghost{background:transparent;border:1px solid rgba(0,0,0,0.08);color:#063}
.game-area{background:transparent;padding:8px;border-radius:12px;display:flex;justify-content:center}
canvas{background:linear-gradient(180deg,#95d6ff,#7ecbff);border-radius:10px;border:6px solid rgba(255,255,255,0.5);box-shadow:0 14px 40px rgba(6,50,70,0.2)}
.hint{margin-top:8px;color:rgba(6,48,62,0.85)}

/* Touch controls overlay */
.game-area{position:relative}
.touch-controls{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:12px;align-items:center;z-index:60}
.touch-btn{width:62px;height:62px;border-radius:50%;border:0;background:rgba(0,0,0,0.18);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(3,16,24,0.22);backdrop-filter: blur(4px);}
.touch-btn.primary{width:78px;height:78px;font-size:26px;background:linear-gradient(180deg,#ffd54f,#ffb300);color:#3b1f00}
.touch-btn:active{transform:translateY(2px)}

@media (max-width:480px){
	.touch-controls{gap:8px;bottom:10px}
	.touch-btn{width:48px;height:48px;font-size:18px}
	.touch-btn.primary{width:64px;height:64px;font-size:22px}
}

/* Floating home button */
.home-btn{position:fixed;top:14px;left:14px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.95);color:#046;text-decoration:none;box-shadow:0 8px 24px rgba(3,16,24,0.18);z-index:120;font-size:20px}
.home-btn:active{transform:translateY(1px)}

@media (max-width:480px){
	.home-btn{width:40px;height:40px;top:10px;left:10px;font-size:18px}
}

/* simple responsive */
@media (max-width:480px){.wrap{padding:8px}canvas{width:100%;height:auto}}