:root { color-scheme: dark; }
body { margin: 0; min-height: 100vh; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: radial-gradient(circle at top, #222844 0%, #090d18 70%); color: #f5f7ff; }
.arcade-shell { max-width: 980px; margin: 0 auto; padding: 40px 20px 60px; }
.arcade-header h1 { margin: 0 0 8px; }
.arcade-header p { margin: 0 0 18px; color: #cfd5ff; }
.user-pill { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: #141a2e; border: 1px solid #3c4a84; }
.user-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.account-manage-btn { padding: 8px 12px; border-radius: 10px; border: 1px solid #3c4a84; background: #141a2e; color: #f5f7ff; cursor: pointer; }
.game-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
.game-card { background: rgba(12, 16, 34, 0.9); border: 1px solid #303a63; border-radius: 16px; padding: 16px; }
.game-thumb { height: 130px; border-radius: 12px; font-size: 52px; display: grid; place-items: center; background: linear-gradient(130deg, #2f6dd9, #9c4dff); }
.play-btn, .auth-actions button { display: inline-block; margin-top: 10px; padding: 10px 14px; border-radius: 10px; border: 0; background: #5f7dff; color: #fff; text-decoration: none; cursor: pointer; }
.auth-overlay { position: fixed; inset: 0; display: grid; place-items: center; background: rgba(2, 3, 8, 0.8); backdrop-filter: blur(3px); }
.auth-overlay[hidden] { display: none !important; }
.auth-card { width: min(420px, 92vw); background: #11172d; border: 1px solid #3b4a86; border-radius: 14px; padding: 20px; }
.auth-card label { display: block; margin-top: 12px; }
.auth-card label[hidden] { display: none !important; }
.auth-card input { width: 100%; margin-top: 5px; padding: 10px; box-sizing: border-box; border-radius: 8px; border: 1px solid #405089; background: #0a1023; color: #fff; }
.auth-actions { display: flex; gap: 10px; }
.auth-actions-stack { flex-direction: column; }
.auth-actions-stack button { margin-top: 0; }
#auth-feedback { min-height: 22px; color: #ffd17b; }
#account-feedback { min-height: 22px; color: #ffd17b; }

.auth-note { margin: 12px 0 4px; font-size: 0.88rem; line-height: 1.4; color: #b9c4ff; }
.link-button { margin-top: 8px; padding: 0; border: 0; background: transparent; color: #9db0ff; cursor: pointer; text-decoration: underline; font: inherit; }
.account-options { display: grid; gap: 8px; margin: 12px 0; }
.account-options button,
#account-action-submit { display: inline-block; padding: 10px 14px; border-radius: 10px; border: 0; background: #5f7dff; color: #fff; cursor: pointer; }
#account-action-form { margin-bottom: 12px; }
