/* Game-only menus. Native dialog provides focus containment and Escape/Back dismissal. */
.war .arcade-actions { display:flex; justify-content:center; gap:.7cqw; margin-top:.8cqw; flex-wrap:wrap; }
.war .arcade-actions button { color:#f3ddb6; background:#372719; border:1px solid #a47c48; border-radius:.3cqw; font-weight:bold; font-size:1.15cqw; padding:.65cqw 1cqw; }
.war #arcade-message { font-size:1cqw; margin:.6cqw 0 0; min-height:1.2em; color:#f3cd87; text-align:center; }
.war .war-overlay:has(#result:not([hidden])) #overlay-note { display:none; }
.war .arcade-dialog { color:#f2dfb8; border:2px solid #9d7645; border-radius:8px; background:linear-gradient(#35271fee,#211a16),#211a16; width:min(92vw,640px); max-height:85dvh; overflow:auto; padding:20px; box-shadow:0 12px 50px #0009; font-family:Arial,sans-serif; }
.war .arcade-dialog::backdrop { background:#100b08b8; }
.war .arcade-dialog h2 { font-size:clamp(19px,3vw,26px); line-height:1.15; margin:0 0 18px; max-width:none; }
.war .arcade-dialog h3 { font-size:15px; color:#f5bd65; margin:18px 0 5px; }
.war .arcade-dialog p { font-size:14px; line-height:1.45; }
.war .arcade-dialog button { min-height:44px; padding:10px 16px; color:#f2dfb8; border:1px solid #a47c48; background:#463020; border-radius:4px; font-size:13px; font-weight:bold; }
.war .arcade-dialog .primary { color:#24170d; background:#e5ac4e; }
.war .arcade-dialog button:disabled { opacity:.5; cursor:wait; }
.war .dialog-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.war .instruction-lead { font-weight:bold; font-size:19px!important; color:#f5bd65; }
.war .instruction-points { display:grid; gap:8px; font-size:15px; margin:18px 0; }
.war .arcade-dialog table { border-collapse:collapse; width:100%; font-size:14px; }
.war .arcade-dialog th,.war .arcade-dialog td { padding:7px 8px; border-bottom:1px solid #66503b; text-align:left; }
.war .arcade-dialog th:last-child,.war .arcade-dialog td:last-child { text-align:right; font-variant-numeric:tabular-nums; }
.war .own-score { background:#614720; color:#ffe5a3; }
.war .arcade-dialog input { width:100%; max-width:420px; min-height:44px; padding:10px; font-size:16px; color:#f2dfb8; background:#1b1410; border:1px solid #af8657; border-radius:4px; }
.war .arcade-dialog label { display:block; margin:14px 0 8px; font-size:15px; }
.war #name-error { color:#ffb19b; }
.war #week-label { font-size:12px; color:#cbb79c; }
@media(max-width:600px) {
  .war .arcade-dialog { padding:16px; }
  .war .arcade-actions { gap:.5cqw; }
  .war .arcade-actions button { font-size:1.6cqw; padding:1cqw; }
  .war #arcade-message { font-size:1.2cqw; }
}
/* On narrow screens, menu text/buttons stay usable in a board-connected card.
   The underlying canvas still keeps its exact artwork ratio and positions. */
@media(max-width:600px) {
  .war .war-overlay { inset:50% 3% auto; translate:0 -50%; padding:16px; min-height:230px; max-height:88dvh; overflow:auto; }
  .war .war-overlay .war-eyebrow { font-size:10px; margin-bottom:8px; }
  .war .war-overlay h2 { font-size:20px; margin-bottom:8px; }
  .war .war-overlay #overlay-copy { font-size:12px; margin-bottom:10px; }
  .war .war-overlay .war-result { font-size:22px; margin-bottom:10px; }
  .war .war-overlay #start { font-size:13px; min-height:44px; padding:10px 18px; }
  .war .war-overlay .arcade-actions button { min-height:44px; font-size:11px; padding:8px; }
  .war .war-overlay #arcade-message { font-size:11px; margin-top:7px; }
  .war .war-overlay .war-small { font-size:10px; margin-top:8px; }
  .war .war-overlay:has(#result:not([hidden])):has(.leroy:not([hidden])) { padding-left:24cqw; padding-right:12px; }
}