/* Warfallow v4 — игровое меню (Esc), цвета игроков в таблице команд. Грузится после hud.css. */
.roster-row:not(.empty) { box-shadow: inset 3px 0 0 var(--pc, transparent); padding-left: 4px; }

.game-menu { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 20px; background: radial-gradient(ellipse at 50% 40%, rgba(10, 16, 24, .55), rgba(4, 7, 11, .85)); backdrop-filter: blur(5px); animation: gm-fade .18s ease both; }
.game-menu[hidden] { display: none; }
@keyframes gm-fade { from { opacity: 0; } to { opacity: 1; } }
.gm-card { width: min(420px, 100%); max-height: calc(100vh - 40px); overflow: auto; padding: 22px 22px 18px; border-radius: 10px; border: 1px solid rgba(196, 165, 107, .5);
  background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, 0) 40%), #101823; box-shadow: 0 24px 60px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(240, 207, 138, .15); animation: gm-rise .22s ease both; }
@keyframes gm-rise { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.gm-head { display: flex; align-items: center; gap: 14px; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--border); }
.gm-head h2 { margin: 0; font-family: var(--serif); font-weight: 500; font-size: 1.7rem; letter-spacing: .04em; color: var(--gold-2); }
.gm-head p { margin: 2px 0 0; color: var(--mute); font-size: .85rem; }
.gm-page { display: grid; gap: 8px; }
.gm-page[hidden] { display: none; }
.gm-btn { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 10px 16px; text-align: left; text-decoration: none; color: var(--ink);
  font-size: 1rem; font-weight: 600; letter-spacing: .02em; border: 1px solid var(--border); border-radius: 6px; background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)), #141e2b; cursor: pointer; }
.gm-btn small { font-size: .74rem; font-weight: 400; color: var(--mute); letter-spacing: 0; text-align: right; }
.gm-btn:hover, .gm-btn:focus-visible { border-color: var(--gold); background: #1b2836; }
.gm-btn.primary { background: linear-gradient(180deg, #e3bf74, #b48a3e); color: #1b1408; border-color: #e3bf74; }
.gm-btn.primary small { color: rgba(27, 20, 8, .7); }
.gm-btn.primary:hover, .gm-btn.primary:focus-visible { background: linear-gradient(180deg, #f0cf8a, #c39a4c); }
.gm-btn.danger { color: #ffb1a3; }
.gm-btn.danger:hover, .gm-btn.danger:focus-visible { border-color: var(--bad); background: rgba(240, 138, 122, .08); }
.gm-keys { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0 0 8px; font-size: .9rem; }
.gm-keys dt { color: var(--ink); white-space: nowrap; } .gm-keys dd { margin: 0; color: var(--mute); }
kbd { display: inline-block; min-width: 1.6em; padding: 1px 6px; border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 4px; background: #0b1118; font: 600 .78rem/1.4 system-ui, sans-serif; text-align: center; color: var(--gold-2); }
.gm-setting { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 46px; padding: 6px 4px; border-bottom: 1px solid rgba(255, 255, 255, .05); }
.gm-toggle { position: relative; width: 50px; min-height: 28px; height: 28px; padding: 0; border-radius: 999px; background: #0b1118; }
.gm-toggle i { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--mute); transition: transform .15s, background .15s; }
.gm-toggle[aria-pressed="true"] { border-color: var(--gold); background: rgba(216, 179, 106, .2); }
.gm-toggle[aria-pressed="true"] i { transform: translateX(22px); background: var(--gold-2); }
.gm-seg { display: inline-flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.gm-seg button { border: 0; border-radius: 0; min-height: 32px; padding: 4px 12px; font-size: .85rem; background: #0b1118; }
.gm-seg button[aria-pressed="true"] { background: rgba(216, 179, 106, .25); color: var(--gold-2); }
.gm-note { margin: 4px 0 8px; color: var(--mute); font-size: .88rem; line-height: 1.5; }
@media (max-width: 420px) { .gm-btn small { display: none; } .gm-keys { grid-template-columns: 1fr; gap: 2px; } .gm-keys dd { margin-bottom: 6px; } }
.gm-btn { white-space: nowrap; } .gm-btn small { white-space: normal; }

.gm-slider input[type=range] { width: 150px; accent-color: var(--gold, #d8b36a); }