body { margin: 0; font-family: 'Segoe UI', sans-serif; background: #2c3e50; color: white; overflow: hidden; }
.nav-bar { position: absolute; top: 10px; right: 20px; z-index: 1000; }
.nav-bar a { color: #ecf0f1; text-decoration: none; font-weight: bold; }
.auth-card { background: #34495e; width: 350px; margin: 100px auto; padding: 40px; border-radius: 20px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
input { padding: 12px; width: 80%; margin: 10px 0; border-radius: 8px; border: none; }
.btn { padding: 12px 30px; background: #2ecc71; color: white; border: none; border-radius: 8px; cursor: pointer; font-weight: bold; }
.stats-box { position: absolute; top: 20px; left: 20px; background: rgba(0,0,0,0.7); padding: 20px; border-radius: 15px; width: 220px; }
.bar-wrap { margin: 10px 0; display: flex; align-items: center; }
.bar-fill { height: 10px; border-radius: 5px; transition: width 0.3s; }
.buy-menu { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; }
.buy-menu button { padding: 12px 20px; border-radius: 25px; border: none; background: #3498db; color: white; font-weight: bold; cursor: pointer; }
#controls-hint { position: absolute; bottom: 90px; width: 100%; text-align: center; font-weight: bold; text-shadow: 2px 2px 5px black; }
.flash { background: #e74c3c; padding: 10px; text-align: center; }