/* ==========================================================================================
   STEEL CONFIRM for every GameUI.confirm (owner-approved samples, 21 Oct 2026; markup in game-ui.js confirm()).
   The pause menu's steel frame (pause-menu.css tokens --pm-*, the four .rumble-gear corners) with a tone per action:
   .tone-gold buys / upgrades / claims, .tone-red destructive actions, .tone-blue everything else. A gear medallion holds the
   portrait or a painted glyph (lock, flag); sentences become a who line, a rarity step in the game's rarity colours, a recessed
   well of costs (balance before -> after) or progress, and small chips. Loaded after pause-menu.css.
   :not(#cf-x) lifts every rule to ID weight: ui-system.css styles .primary inside :is(...#start...), whose ID weight and !important
   otherwise turn every confirm button green (the old green Remove / Surrender bug).
   ========================================================================================== */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x){--cf-rim:linear-gradient(180deg,#f3d27a,#c08a2e 40%,#9a6418 75%,#6b4508);--cf-title:#ffd66e;--cf-btn:var(--pm-gold-btn);--cf-btn-edge:#a8640c;--cf-btn-ink:#6a3a08;
 width:min(310px,calc(100vw - 40px));max-height:calc(100dvh - 60px);margin:auto;padding:22px 18px 18px;overflow:visible;border:0!important;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);text-align:center}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x).tone-red{--cf-rim:linear-gradient(180deg,#ffb49a,#e0583c 40%,#a82a18 75%,#5a1208);--cf-title:#ff9e86;--cf-btn:var(--pm-red-btn);--cf-btn-edge:#84200f;--cf-btn-ink:#5a1208}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x).tone-blue{--cf-rim:linear-gradient(180deg,#d6e4ff,#7f9fe0 40%,#3f5ca8 75%,#1f2f66);--cf-title:#c4d8ff;--cf-btn-edge:#22397a;--cf-btn-ink:#14245a;
 --cf-btn:radial-gradient(ellipse 90% 55% at 50% 0,#ffffff4a,#fff0 70%) padding-box,linear-gradient(180deg,#7fa8f0,#4a74cf 60%,#2f52a8) padding-box,linear-gradient(180deg,#1f3270,#0c1538) border-box}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x):has(>.confirm-medal){padding-top:46px}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)::before{content:'';position:absolute;inset:4px;z-index:-1;border:1.5px solid transparent!important;border-radius:11px;background:radial-gradient(ellipse 90% 40% at 50% 0,#ffffff14,#fff0 70%) padding-box,linear-gradient(180deg,#333b5a,#252b45 45%,#1a1e31) padding-box,var(--cf-rim) border-box!important;box-shadow:inset 0 0 0 1px #0007!important;pointer-events:none}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>:is(.eyebrow,.confirm-close){display:none!important}
/* gear medallion: portrait or glyph in a slate well, ringed in the tone, on a big steel gear above the frame */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>.confirm-medal{position:absolute;left:50%;top:-38px;z-index:7;width:76px;height:76px;margin-left:-38px;background:url(assets/ui/portrait-cog.svg?v=949c0b804bdd99ef) center/contain no-repeat;filter:drop-shadow(0 3px 4px #000b)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>.confirm-medal>:is(img,.confirm-glyph){position:absolute;left:14px;top:14px;width:48px;height:48px;margin:0;padding:0;border:0;border-radius:50%;object-fit:cover;object-position:50% 12%;background:radial-gradient(circle at 50% 35%,#4a5580,#1d2238);box-shadow:inset 0 0 0 2.5px var(--cf-title),0 0 0 1.5px var(--pm-ink)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>.confirm-medal>.confirm-glyph{display:grid;place-items:center}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>.confirm-medal>.confirm-glyph svg{width:30px;height:30px;filter:drop-shadow(0 1px 0 #000a)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) h2{margin:0;padding:0;color:var(--cf-title)!important;font:800 calc(22px * var(--rk-s,1))/1.1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.05em;text-transform:uppercase;text-shadow:0 2px 0 var(--pm-ink),1px 0 0 #10142acc,-1px 0 0 #10142acc!important;overflow-wrap:anywhere}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>.confirm-who{margin:4px 0 0;color:#f1ead8;font:700 calc(15px * var(--rk-s,1))/1.2 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 1px 0 var(--pm-ink)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x)>p{margin:8px 0 0;color:#d8dbe6!important;font:600 calc(13.5px * var(--rk-s,1))/1.3 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-align:center}
/* rarity step: chips filled and rimmed in the rarity colours (same hexes as the Unit Info --next colours) */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-step{display:flex;align-items:center;justify-content:center;gap:6px;margin:10px 0 0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-rarity{--r:#aeb8c3;display:inline-flex;align-items:center;height:26px;padding:0 11px;border:1.5px solid transparent;border-radius:13px;background:linear-gradient(180deg,color-mix(in srgb,var(--r) 88%,#fff),color-mix(in srgb,var(--r) 70%,#10142a)) padding-box,linear-gradient(180deg,color-mix(in srgb,var(--r) 45%,#fff),var(--r) 50%,color-mix(in srgb,var(--r) 55%,#000)) border-box;box-shadow:0 0 0 1px var(--pm-ink),inset 0 1px 0 #ffffff40;color:#fff;font:800 13px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.03em;text-shadow:0 1px 0 #000c,0 0 3px #0008}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-rarity.r-uncommon{--r:#6fc25a}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-rarity.r-rare{--r:#5aa8f0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-rarity.r-epic{--r:#c07ae6}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-rarity.r-legendary{--r:#f0b04a}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-step>.confirm-glyph svg{display:block;width:20px;height:20px}
/* gains (shop) */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-gains{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:10px 0 0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-gain{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px 0 5px;border-radius:15px;background:var(--pm-recess)!important;box-shadow:inset 0 2px 3px #000,inset 0 0 0 1px #000a,0 0 0 1.5px #9a6418!important;color:#fff8e6;font:800 17px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 1px 0 #000}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-gain>.resource-icon{width:24px;height:24px;object-fit:contain}
/* recessed well: cost columns side by side, or a progress bar */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-well{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:12px 0 0;padding:9px 10px 8px;border-radius:10px;background:var(--pm-recess)!important;box-shadow:inset 0 2px 3px #000,inset 0 0 0 1px #000a}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-cost{display:flex;flex-direction:column;align-items:center;gap:3px;margin:0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-price{display:inline-flex;align-items:center;gap:6px;color:#fff8e6!important;font:800 24px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 2px 0 #000;font-variant-numeric:tabular-nums}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-price>.resource-icon{width:28px;height:28px;object-fit:contain}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-after{color:#a9b0c8!important;font:700 12px/1.2 var(--wr-font-display,'Rubik',system-ui,sans-serif);font-variant-numeric:tabular-nums;opacity:1}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-cost.insufficient :is(.confirm-price b,.confirm-after){color:#ff7a66!important}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-progress{display:flex;align-items:center;gap:7px;width:100%}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-progress>.resource-icon{flex:none;width:26px;height:26px;object-fit:contain}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-bar{position:relative;flex:1;height:14px;border-radius:7px;background:#05060b;box-shadow:inset 0 1px 2px #000,0 0 0 1px #000a;overflow:hidden}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-bar>i{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:linear-gradient(#ffd0a0,#e96a34 50%,#9a3a1c)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-progress>b{flex:none;color:#fff8e6;font:800 14px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 1px 0 #000;font-variant-numeric:tabular-nums}
/* small chips: +1 LV, + Talent, rating loss */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:10px 0 0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-chip{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 10px;border:1.5px solid transparent;border-radius:13px;background:linear-gradient(#333b5a,#1a1e31) padding-box,linear-gradient(#f3d27a,#9a6418) border-box;box-shadow:0 0 0 1px var(--pm-ink);color:#fff8e6;font:800 13px/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);text-shadow:0 1px 0 #000}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-chip.is-down{background:linear-gradient(#333b5a,#1a1e31) padding-box,linear-gradient(#ffb49a,#a82a18) border-box}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-chip>.resource-icon{width:18px;height:18px;object-fit:contain}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-chip>.confirm-glyph svg{display:block;width:15px;height:15px}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-benefits{margin:10px 0 0;padding:0;border:0;background:none;color:#a8f08a!important;font-weight:700}
/* buttons: steel Cancel, tone-coloured action */
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 0}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:0;height:46px;min-height:0;margin:0;padding:0 6px;border:2px solid transparent!important;border-radius:10px;background:var(--pm-steel-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 #0006!important;color:#f1ead8!important;font:800 calc(14.5px * var(--rk-s,1))/1 var(--wr-font-display,'Rubik',system-ui,sans-serif);letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;text-shadow:0 1px 0 var(--pm-ink)!important}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>.primary{background:var(--cf-btn)!important;box-shadow:0 0 0 1px var(--pm-ink),inset 0 -3px 0 var(--cf-btn-edge),inset 0 1px 0 #ffffff60!important;color:#fff8e6!important;text-shadow:0 2px 0 var(--cf-btn-ink),1px 0 0 var(--cf-btn-ink),-1px 0 0 var(--cf-btn-ink)!important}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>.primary.danger{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!important;text-shadow:0 2px 0 #5a1208,1px 0 0 #5a1208,-1px 0 0 #5a1208!important}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>button>.resource-icon{flex:none;width:20px;height:20px;object-fit:contain;filter:drop-shadow(0 1px 0 #0009)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>button:disabled{filter:grayscale(.85);opacity:.55}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>button:active{transform:translateY(2px)}
:root body dialog.game-confirm.rumble-confirm.rumble-confirm.is-steel.is-steel:not(#cf-x) .confirm-actions>button:focus-visible{outline:2px solid #ffeaa6;outline-offset:2px}
