/* ==========================================================================================
   PAUSE MENU REVAMP (owner-approved mockup pause-menu.src.html: .pm/.pm-in/.gc/.pm-h/.snd/.pm-s/.mm/.mb/.track/.mks/.tm/.rs/.ir/.it/.tg/.dv/.sr/.cf)
   Same family as the battle HUD (battle-hud.css): bevelled dark-steel frame, slate panel with a gold rim, steel gear corners from
   assets/ui/portrait-cog.svg with a steel cap, team colours from the accessibility palette (--team-ally/-light/-dark, --team-enemy/-light/-dark)
   and the HUD's gold boss-gear filter. Markup: settings-panel.js menu() / strip(); the steel confirm (every GameUI.confirm) lives in confirm-steel.css. Loaded after settings-panel.css and battle-hud.css; desktop keeps the 0.9 dialog zoom.
   ========================================================================================== */
:root{--pm-ink:#10142a;
 --pm-steel:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='24'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9 0.05' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0.315 0 0 0 -0.147'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/160px 24px,linear-gradient(180deg,#b3bbcd 0,#76809a 18%,#454c63 60%,#2b3042 100%);
 --pm-slate:radial-gradient(ellipse 90% 40% at 50% 0,#ffffff14,#fff0 70%) padding-box,linear-gradient(180deg,#333b5a,#252b45 45%,#1a1e31) padding-box,linear-gradient(180deg,#f3d27a,#c08a2e 40%,#9a6418 75%,#6b4508) border-box;
 --pm-frame-shadow:0 0 0 1px var(--pm-ink),inset 0 1px 0 #ffffffa0,inset 0 -1px 0 #0008,0 12px 28px #000d,0 3px 6px #000b;
 --pm-title-shadow:0 2px 0 var(--pm-ink),1px 0 0 #10142acc,-1px 0 0 #10142acc,0 -1px 0 #10142a99,0 3px 6px #0009;
 --pm-gold-btn:radial-gradient(ellipse 90% 55% at 50% 0,#ffffff5c,#fff0 70%) padding-box,linear-gradient(180deg,#ffdc5c,#f3a51e 62%,#d88a14) padding-box,linear-gradient(180deg,#8a5a10,#3a2306) border-box;
 --pm-steel-btn:radial-gradient(ellipse 90% 45% at 50% 0,#ffffff1c,#fff0 70%) padding-box,linear-gradient(180deg,#3d4669,#283050 60%,#1f2540) padding-box,linear-gradient(180deg,#c9d0de,#7a839b 40%,#3a4158 80%,#2b3042) border-box;
 --pm-red-btn:radial-gradient(ellipse 90% 55% at 50% 0,#ffffff40,#fff0 70%) padding-box,linear-gradient(180deg,#f06a52,#cf3f2c 60%,#a82a18) padding-box,linear-gradient(180deg,#7a1a08,#3a0a02) border-box;
 --pm-recess:linear-gradient(#0c0f1d,#161a2c 70%,#1d2236)}

/* ---------- frame: steel bevel (the dialog) + slate inner with a gold rim ---------- */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu){width:min(340px,calc(100vw - 40px));max-width:none;max-height:none;padding:4px;overflow:visible;border:0;border-radius:15px;background:var(--pm-steel)!important;box-shadow:var(--pm-frame-shadow)!important;color:#fff!important;font-family:var(--wr-font-display,'Rubik','Segoe UI',system-ui,sans-serif)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-pause-in{position:relative;max-height:calc(100dvh - 120px);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:10px 14px 14px;border:1.5px solid transparent;border-radius:11px;background:var(--pm-slate)!important;box-shadow:inset 0 0 0 1px #0007!important;border-color:transparent!important}

/* four small steel gears on the corners (pause panel and the steel confirm) */
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear{position:absolute;z-index:6;width:24px;height:24px;pointer-events:none;background:url(assets/ui/portrait-cog.svg?v=949c0b804bdd99ef) center/contain no-repeat!important;filter:drop-shadow(0 1px 1.5px #000c)}
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear::after{content:'';position:absolute;left:31%;top:31%;width:38%;height:38%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#e3e8f0,#7d8699 60%,#3a4054)!important;box-shadow:inset 0 0 0 1px var(--pm-ink)!important}
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear.tl{left:-9px;top:-9px}
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear.tr{right:-9px;top:-9px}
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear.bl{left:-9px;bottom:-9px}
:root :is(dialog.rumble-pause,dialog.rumble-confirm.is-steel)>.rumble-gear.br{right:-9px;bottom:-9px}

/* ---------- header: music coin | title | sound coin ---------- */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-head{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;gap:4px;height:42px;padding:0;text-align:center}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-title{grid-column:2;max-width:none;margin:0;padding:0;overflow:hidden;border:0;border-radius:0;background:none!important;box-shadow:none!important;color:#fff3d6!important;font:800 calc(25px * var(--rk-s))/1.1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.07em;text-transform:uppercase;text-overflow:ellipsis;white-space:nowrap;text-shadow:var(--pm-title-shadow)!important}
/* long titles ("Brawl paused") step down so they fit between the coins */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-title.is-long{font-size:calc(21px * var(--rk-s));letter-spacing:.04em}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd{position:relative;top:auto;left:auto;right:auto;width:40px;height:40px;box-shadow:inset 0 -3px 0 var(--b-lo),inset 0 0 0 1px #ffffff26,0 0 0 2px #8c95ab,0 0 0 3px var(--pm-ink),0 2px 5px #0008!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd.is-music{grid-column:1}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd.is-sound{grid-column:3}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd .sp-icon{width:23px;height:23px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd[aria-pressed="false"]::after{width:28px;margin-left:-14px}
/* live menu note under the title ("The match keeps running") */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-pause-in>.rumble-subtitle{margin:3px 0 0;color:#e7cf8f!important;font:700 calc(10.5px * var(--rk-s))/1.2 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.16em;text-align:center;text-transform:uppercase;text-shadow:0 1px 0 var(--pm-ink)!important}

/* ---------- battle strip: map name, mirrored keep bars, clock ---------- */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip{margin-top:9px;padding:6px 7px;border-radius:9px;background:var(--pm-recess)!important;box-shadow:inset 0 2px 3px #000,inset 0 0 0 1px #000a,0 1px 0 #ffffff1c!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-map{margin:1px 0 5px;overflow:hidden;color:#e7cf8f!important;font:700 calc(10.5px * var(--rk-s))/1.1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.16em;text-align:center;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;text-shadow:none!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-map:last-child{margin-bottom:1px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip .ally{--c:var(--team-ally,#4682ff);--c-hi:var(--team-ally-light,#6199ff);--c-lo:var(--team-ally-dark,#1e50c8)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip .enemy{--c:var(--team-enemy,#dc4646);--c-hi:var(--team-enemy-light,#ff666c);--c-lo:var(--team-enemy-dark,#b41e1e)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-bars{display:flex;align-items:center;height:34px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-medal{position:relative;z-index:3;flex:none;width:34px;height:34px;filter:drop-shadow(0 1px 2px #000b)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-medal::before{content:'';position:absolute;inset:0;background:url(assets/ui/portrait-cog.svg?v=949c0b804bdd99ef) center/contain no-repeat!important}
/* boss enemy: the HUD's gold-tinted gear */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-medal.is-boss::before{filter:sepia(.9) saturate(2.6) hue-rotate(-12deg) brightness(1.05)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-medal img{position:absolute;left:17%;top:17%;z-index:1;width:66%;height:66%;border-radius:50%;background:#141826!important;object-fit:cover}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-medal::after{content:'';position:absolute;left:17%;top:17%;z-index:2;width:66%;height:66%;border-radius:50%;box-shadow:inset 0 0 0 2px var(--c),inset 0 0 0 3px #0008!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-bar{position:relative;z-index:1;flex:1;min-width:0;height:19px;margin:0 -6px;padding:2.5px;border-radius:5px;background:linear-gradient(180deg,#b3bbcd 0,#76809a 34%,#454c63 70%,#2b3042 100%)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 1px 0 #ffffffa0,inset 0 -1px 0 #0008!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track{position:relative;display:block;height:100%;overflow:hidden;border-radius:3px;background:linear-gradient(#05060b,#191c2a 70%,#252939)!important;box-shadow:inset 0 2px 2px #000,inset 0 0 0 1px #000b!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track>i{position:absolute;top:0;bottom:0;left:0;display:block}
/* mirrored enemy bar: empties towards the enemy medallion, like the HUD */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-bar.enemy .rumble-track>i{left:auto;right:0}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track>.trail{background:linear-gradient(#ffe796,#e5ae24)!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track>.fill{background:linear-gradient(180deg,var(--c-hi) 0,var(--c) 48%,var(--c-lo) 100%)!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track>.fill::after{content:'';position:absolute;left:2px;right:2px;top:2px;height:1.5px;border-radius:2px;background:#ffffff6b!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-track>b{position:absolute;inset:0;z-index:2;display:grid;place-items:center;color:#fff8e6!important;font:700 9.5px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 1px 0 #000,1px 0 0 #000b,-1px 0 0 #000b,0 0 3px #000!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-bar.ally .rumble-track>b{padding-left:6px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-bar.enemy .rumble-track>b{padding-right:6px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-marks{position:absolute;inset:2.5px;z-index:1;pointer-events:none}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-marks em{position:absolute;top:0;bottom:0;width:2px;margin-right:-1px;background:#ffe4aadd!important;box-shadow:0 0 2px #000!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-marks em::before{content:'';position:absolute;left:50%;top:-6px;width:8px;height:7px;transform:translateX(-50%);background:linear-gradient(#fff1b3,#e5ae24 60%,#9a6418)!important;clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 1px 0 var(--pm-ink))}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-marks em.passed{background:#8a8794aa!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-marks em.passed::before{background:linear-gradient(#a7a4b0,#5c5a66)!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-clock{position:relative;z-index:4;flex:none;display:grid;place-items:center;width:50px;height:28px;border:2px solid transparent;border-radius:7px;color:#fff6e2!important;font:800 16px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);font-variant-numeric:tabular-nums;text-shadow:0 1px 0 var(--pm-ink),1px 0 0 #10142acc,-1px 0 0 #10142acc,0 2px 3px #0008!important;background:radial-gradient(ellipse 80% 45% at 50% 0,#ffffff24,#fff0 70%) padding-box,linear-gradient(180deg,#414b70,#272e49 55%,#1a1f33) padding-box,linear-gradient(180deg,#fff0b0,#e2b04c 38%,#a86e1c 70%,#6b4508) border-box!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -2px 0 #0006,0 2px 3px #000b!important;border-color:transparent!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-labels{display:flex;justify-content:space-between;gap:8px;margin-top:3px;padding:0 2px;color:#a9b0c8!important;font:700 calc(8.5px * var(--rk-s))/1.2 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-labels span{min-width:0;overflow:hidden;text-overflow:ellipsis}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-labels span:first-child{flex:none;max-width:45%}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-labels span:last-child{text-align:right}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-strip-labels .is-boss{color:#f3d27a!important}

/* ---------- actions ---------- */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions{display:block;padding:0}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions[hidden],:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto[hidden]{display:none}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn{min-width:0;min-height:0;margin:0;cursor:pointer;transition:transform .08s,filter .08s}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn:active{transform:translateY(2px)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn:focus-visible,:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-snd:focus-visible{outline:2px solid #ffeaa6;outline-offset:2px}
/* big gold Resume */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions>.rumble-btn.primary{display:flex;gap:12px;width:100%;height:58px;margin-top:12px;padding:0 12px;border:2px solid transparent;border-radius:11px;background:var(--pm-gold-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -4px 0 #a8640c,inset 0 1px 0 #fffa,0 4px 6px #000b!important;color:#fff8e6!important;font:800 calc(25px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;text-shadow:0 2px 0 #6a3a08,1.5px 0 0 #6a3a08,-1.5px 0 0 #6a3a08,0 -1.5px 0 #6a3a08!important;border-color:transparent!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions>.rumble-btn.primary .sp-icon{width:26px;height:26px;filter:drop-shadow(0 1px 0 #6a3a08)}
/* Restart / Settings / How to play tiles (two in the live menu) */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-tiles{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:9px;margin-top:10px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.tile{display:flex;flex-direction:column;gap:5px;width:auto;height:70px;padding:0 4px;border:2px solid transparent;border-radius:10px;background:var(--pm-steel-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 #0006,0 3px 4px #000a!important;color:#f1ead8!important;font:700 calc(11.5px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.03em;text-transform:none;text-shadow:0 1px 0 var(--pm-ink)!important;border-color:transparent!important;font-weight:700!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.tile .sp-icon{width:30px;height:30px;filter:drop-shadow(0 1px 1px #000a)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.tile .rumble-btn-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Inspect battlefield: the mockup's recessed row, with the eye icon and a chevron */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.row{display:flex;justify-content:flex-start;gap:9px;width:100%;height:44px;margin-top:10px;padding:0 12px 0 10px;border:0;border-radius:9px;background:linear-gradient(#141829,#1c2135)!important;box-shadow:inset 0 2px 3px #000b,inset 0 0 0 1px #000a,0 1px 0 #ffffff18!important;color:#f1ead8!important;font:700 calc(14px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.02em;text-align:left;text-transform:none;text-shadow:0 1px 0 var(--pm-ink)!important;font-weight:700!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.row .sp-icon{width:22px;height:22px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.row .rumble-btn-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-chevron{flex:none;width:10px;height:10px;margin-right:4px;border-right:3px solid #c9d0de;border-bottom:3px solid #c9d0de;border-radius:1px;transform:rotate(-45deg);filter:drop-shadow(0 1px 0 var(--pm-ink))}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.row:hover{filter:brightness(1.18)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-btn.row:active{transform:none;box-shadow:inset 0 3px 5px #000,inset 0 0 0 1px #000a,0 1px 0 #ffffff18!important}
/* divider, then red Surrender / Leave raid set apart */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-divider{height:2px;margin:14px 4px 12px;background:linear-gradient(90deg,#0000,#0009 15%,#0009 85%,#0000)!important;box-shadow:0 1px 0 #ffffff1a!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions>.rumble-btn.danger{display:flex;gap:10px;width:100%;height:46px;padding:0 12px;border:2px solid transparent;border-radius:10px;background:var(--pm-red-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 #84200f,inset 0 1px 0 #ffffff70,0 3px 5px #000b!important;color:#fff4ea!important;font:800 calc(17px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.07em;text-transform:uppercase;text-shadow:0 2px 0 #5a1208,1px 0 0 #5a1208,-1px 0 0 #5a1208!important;border-color:transparent!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-actions>.rumble-btn.danger .sp-icon{width:22px;height:22px}

/* ---------- How to play page, slate in the same panel ---------- */
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto{margin-top:9px;padding:12px 12px 14px;border:0;border-radius:9px;background:var(--pm-recess)!important;box-shadow:inset 0 2px 3px #000,inset 0 0 0 1px #000a,0 1px 0 #ffffff1c!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto-title{margin:0 0 12px;color:#ffd66e!important;font:800 calc(18px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.08em;text-align:center;text-transform:uppercase;text-shadow:0 2px 0 var(--pm-ink),1px 0 0 #10142acc,-1px 0 0 #10142acc!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto .sp-howto{grid-template-columns:auto minmax(0,1fr);gap:9px 12px;margin:0}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto .sp-howto dt{color:#f3d27a!important;font:700 calc(13px * var(--rk-s))/1.2 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.06em;text-shadow:0 1px 0 var(--pm-ink)!important}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto .sp-howto dt .sp-icon{width:24px;height:24px;filter:drop-shadow(0 1px 1px #000a)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto .sp-howto dd{margin:0;color:#d8dbe6!important;font:600 calc(13px * var(--rk-s))/1.3 var(--wr-font-display,'Rubik',system-ui,sans-serif)}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto-actions{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:10px;margin-top:14px}
:root dialog.rumble-pause:is(#battle-pause-dialog,#live-battle-menu) .rumble-howto-actions .rumble-btn{display:flex;width:auto;height:46px;padding:0 8px;border:2px solid transparent;border-radius:10px;background:var(--pm-steel-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 #0006,0 3px 4px #000a!important;color:#f1ead8!important;font:800 calc(13.5px * var(--rk-s))/1.05 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.05em;text-transform:uppercase;text-shadow:0 1px 0 var(--pm-ink)!important;border-color:transparent!important}

/* ---------- Inspect battlefield chip (shown while the panel is closed) ---------- */
:root #rumble-inspect-chip.rumble-inspect{width:max-content;gap:10px;padding:5px 5px 5px 16px;border:2px solid transparent;background:var(--pm-slate)!important;box-shadow:0 0 0 1px var(--pm-ink),0 6px 16px #000b!important;color:#f1ead8!important;font:700 calc(14px * var(--rk-s))/1.25 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 1px 0 var(--pm-ink)!important;border-color:transparent!important}
:root #rumble-inspect-chip.rumble-inspect .rumble-btn{min-height:40px;padding:0 16px;border:2px solid transparent;background:var(--pm-gold-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 #a8640c,inset 0 1px 0 #fffa!important;color:#fff8e6!important;font:800 calc(15px * var(--rk-s))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.06em;text-shadow:0 2px 0 #6a3a08,1px 0 0 #6a3a08,-1px 0 0 #6a3a08!important;border-color:transparent!important}

/* ---------- steel confirm: moved to confirm-steel.css (every GameUI.confirm is steel since 0.463.0) ---------- */

/* ===== Inspect battlefield tips (battle-help.js .battle-help-tooltip): slate panel with a gold rim like the tap bubbles, a painted
   object icon in a steel medallion with a team-colour ring, the title in gold and a pointer to the tapped spot. ===== */
:root body .battle-help-tooltip{display:grid;grid-template-columns:50px minmax(0,1fr);column-gap:12px;row-gap:3px;align-items:center;box-sizing:border-box;width:max-content;max-width:min(286px,calc(100vw - 16px));padding:11px 14px 12px 11px;border:2.5px solid #d9a94a;border-radius:12px;background:radial-gradient(ellipse 90% 45% at 50% 0,#ffffff17,#fff0 70%),linear-gradient(180deg,#333b5a,#262d47 50%,#1a1e31);box-shadow:0 0 0 1px #10142a,0 12px 28px #000c,inset 0 1px 0 #ffffff1f;color:#f6f3ec;font-family:Rubik,'Segoe UI',system-ui,sans-serif;animation:battle-help-in .16s ease-out both}
:root body .battle-help-tooltip[hidden]{display:none}
.battle-help-tooltip::before,.battle-help-tooltip::after{content:'';position:absolute;left:var(--bh-arrow,50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;transform:translateX(-50%);pointer-events:none}
.battle-help-tooltip::before{bottom:-12px;border-top:12px solid #d9a94a}
.battle-help-tooltip::after{bottom:-8px;border-top:9px solid #1d2236}
.battle-help-tooltip.is-below::before{bottom:auto;top:-12px;border-top:0;border-bottom:12px solid #d9a94a}
.battle-help-tooltip.is-below::after{bottom:auto;top:-8px;border-top:0;border-bottom:9px solid #343c5b}
.battle-help-icon{grid-row:1/3;--bh-team:#e8b445;position:relative;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#5a6798,#252c48);box-shadow:0 0 0 2px #10142a,0 0 0 4.5px #8c95ab,0 0 0 5.5px #10142a,inset 0 0 0 2.5px var(--bh-team),inset 0 2px 4px #0009}
.battle-help-icon[data-team="ally"]{--bh-team:var(--team-ally,#4682ff)}
.battle-help-icon[data-team="enemy"]{--bh-team:var(--team-enemy,#dc4646)}
.battle-help-icon svg{width:38px;height:38px;filter:drop-shadow(0 1.5px 1px #000c)}
:root body .battle-help-tooltip strong{align-self:end;font:800 15.5px/1.1 Rubik,sans-serif;letter-spacing:.02em;color:#ffd66e;text-shadow:0 1px 0 #10142a,1px 0 0 #10142acc,-1px 0 0 #10142acc}
:root body .battle-help-tooltip p{align-self:start;margin:0;font:500 12.5px/1.38 Rubik,sans-serif;color:#d8dbe6}
@keyframes battle-help-in{from{opacity:0;transform:translateY(4px) scale(.97)}to{opacity:1;transform:none}}
html.reduce-motion .battle-help-tooltip{animation:none}
@media (prefers-reduced-motion:reduce){.battle-help-tooltip{animation:none}}