/* Warm-up mini games (games.js): website, Windows and the Android games screen (native-games.html). */
.games-list{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.games-card{display:flex;align-items:center;gap:14px;width:100%;max-width:none;text-align:left;white-space:normal;padding:12px 14px;border:1px solid var(--line,#2a3a44);border-radius:14px;background:var(--panel,#162230);color:var(--ink,#ebf2f8)}
.games-icon{font-size:30px;line-height:1;flex:none}
.games-card-text{display:flex;flex-direction:column;gap:3px}
.games-card-text strong{font-size:16px}
.games-card-text small{color:var(--muted,#a0b3c3)}
.games-card-text .games-best{color:var(--accent,#b7f45c);font-weight:600}
.games-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.games-hud{display:flex;flex-wrap:wrap;gap:8px 18px;margin:8px 0}
.games-stat{display:flex;gap:6px;align-items:baseline}
.games-stat>span:first-child{color:var(--muted,#a0b3c3)}
.games-stat>span:last-child{font-weight:700;font-variant-numeric:tabular-nums}
.games-results{margin-top:10px}
.games-results .games-stat{font-size:16px;padding:2px 0}
.games-tries{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px}
.games-record{color:var(--accent,#b7f45c);font-weight:700;font-size:18px;margin:8px 0}
.games-start{min-width:140px}
/* Start lights */
.games-lights{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;width:100%;max-width:none;min-height:230px;padding:24px 12px;border-radius:16px;border:2px solid var(--line,#2a3a44);background:#10181e;color:#fff;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:none}
/* Only the game decides the colour: hovering or pressing never tints the field (it would look like the green light). */
.games-lights:hover,.games-lights:focus,.games-lights:active{background:#10181e;border-color:var(--line,#2a3a44);transform:none;filter:none}
.games-lights.go,.games-lights.go:hover,.games-lights.go:focus,.games-lights.go:active{background:#1f8a3a;border-color:#2fbf55}
.games-lights.false,.games-lights.false:hover,.games-lights.false:focus,.games-lights.false:active{background:#6b1f1f;border-color:#c43b3b}
.games-lamps{display:flex;gap:clamp(8px,3vw,18px)}
.games-lamp{width:clamp(34px,11vw,56px);height:clamp(34px,11vw,56px);border-radius:50%;background:#2a1414;border:3px solid #000;box-shadow:inset 0 0 8px #000}
.games-lamp.on{background:#ff2b2b;box-shadow:0 0 18px #ff2b2b,inset 0 0 6px #ffb3b3}
.games-say{font-size:20px;text-align:center}
.games-lights.go .games-say{font-size:34px;letter-spacing:.06em}
/* Hitting points */
.games-board{position:relative;height:min(58vh,420px);min-height:260px;border:2px solid var(--line,#2a3a44);border-radius:16px;background:#10181e;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}
.games-board.miss{animation:games-miss .18s}
.games-dot{position:absolute;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,#ff5757 19% 45%,#fff 46% 58%,#ff5757 59%);box-shadow:0 0 12px #ff575788;cursor:pointer}
@keyframes games-miss{50%{border-color:#ff5757;background:#2a1414}}
/* Finding a number */
.games-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;max-width:460px;margin:8px auto;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.games-grid.idle{display:flex;justify-content:center;padding:40px 0}
.games-cell{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:10px;border:1px solid var(--line,#2a3a44);background:var(--panel,#162230);color:var(--ink,#ebf2f8);font-size:clamp(18px,5.5vw,26px);font-weight:700;cursor:pointer}
.games-cell.wrong{animation:games-wrong .3s}
.games-wanted{font-size:26px;color:var(--accent,#b7f45c)}
@keyframes games-wrong{50%{background:#8a2020;border-color:#ff5757}}
/* The Android games screen: the page's own simple frame. */
body.native-games{margin:0;padding:16px;background:#0c141f;color:#ebf2f8;font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--panel:#162230;--ink:#ebf2f8;--muted:#a0b3c3;--line:#2a3a44;--accent:#b7f45c}
body.native-games.light{background:#f5f7f8;color:#18252c;--panel:#fff;--ink:#18252c;--muted:#536570;--line:#d3dde2;--accent:#087a3e}
body.native-games.light .games-lights,body.native-games.light .games-board{background:#1b262d}
body.native-games h1{font-size:24px;margin:4px 0 8px}
body.native-games button{font:inherit;min-height:44px;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
body.native-games button.primary{background:var(--accent);color:#0c141f;border-color:var(--accent);font-weight:700}
body.native-games .account-hint{color:var(--muted)}
.games-toast{position:fixed;left:16px;right:16px;bottom:16px;padding:12px 16px;border-radius:12px;background:#222e32;color:#f3f6f5}
@media (prefers-reduced-motion:reduce){.games-board.miss,.games-cell.wrong{animation:none}}
