.battle-mode-picker{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:#293c3b;border-top:1px solid #69795e;color:#d4d8bd}
.battle-heading-main{display:flex;align-items:center;gap:12px;min-width:0}
#battle-profile{padding:3px 5px;border:1px solid #8a9876;background:#233a35;cursor:pointer;color:#e4dbb7;min-width:44px;flex-shrink:0}
#battle-portrait{display:block;width:26px;height:32px;margin:auto}#battle-portrait svg{width:100%;height:100%}
#battle-profile small{display:block;font-size:9px;line-height:1.3}
#battle-field #battle-hero{padding:0;border:0;background:transparent;cursor:pointer;min-width:44px}
#battle-hero:focus-visible,#battle-profile:focus-visible{outline:3px solid #d9c281;outline-offset:3px}
#arcade-enemy-stats{display:block;font-size:10px;margin-top:4px;color:#d4dabc}
#arcade-enemy-stats[hidden],#arcade-recovery[hidden]{display:none}
#sound-dialog #arcade-recovery{color:#dce8ac;padding:8px;border:1px solid #8caa75;background:#344f3c}
#arcade-resume:disabled{opacity:.5;cursor:default}
.battle-mode-picker button{font:inherit;font-size:12px;padding:8px 14px;border:1px solid #879577;background:#314840;color:#e5dec0;min-height:38px;cursor:pointer}
.battle-mode-picker button[aria-pressed="true"]{background:#d2bd7e;color:#293e35;border-color:#dcc991}
.battle-mode-picker>span{font-size:11px;margin-left:auto}
#arcade-layer{position:absolute;inset:0;pointer-events:none;z-index:102}
#arcade-layer[hidden],#arcade-hud[hidden],#arcade-controls[hidden],#arcade-overlay[hidden],#arcade-enemy-health[hidden]{display:none}
#arcade-shots i{position:absolute;width:11px;height:8px;background:#faf0af;border:2px solid #b99c4f;box-shadow:-4px 0 #79a5a3;transform:translate(-50%,-50%)}
#arcade-aim{position:absolute;width:26px;height:26px;border:2px dashed #efdc94;transform:translate(-50%,-50%);border-radius:50%}
#arcade-aim::after{content:"+";display:grid;place-items:center;height:100%;color:#fff1b7;font:18px ui-monospace,monospace;line-height:18px}
#arcade-warning{position:absolute;transform:translate(-50%,-50%);border:3px solid #d9a46b;border-radius:50%;width:90px;height:43px;text-align:center;color:#fff0c7;background:#85543488;font-size:11px;padding-top:8px;white-space:nowrap}
#arcade-slash{position:absolute;transform:translate(-50%,-50%);border:3px solid #ece2ac;border-radius:50%;width:62px;height:48px;color:#fff2b2;text-align:center;font-size:31px;background:#b8c38940}
#arcade-hud{position:absolute;z-index:112;top:12px;left:12px;background:#223732eb;border:1px solid #9ca378;color:#eee6c5;padding:9px 12px;width:176px;pointer-events:none}
#sound-dialog #arcade-hud label{display:flex;justify-content:space-between;margin:0;font-size:12px;color:#eee6c5}
#arcade-hud progress,#arcade-enemy-health{width:100%;height:8px;display:block;margin:6px 0;border:0;appearance:none;background:#172929;accent-color:#adbc7e}
#arcade-hud progress::-webkit-progress-bar,#arcade-enemy-health::-webkit-progress-bar{background:#172929}
#arcade-hud progress::-webkit-progress-value{background:#b7c591}
#arcade-enemy-health::-webkit-progress-value{background:#d3ad78}
#arcade-score{display:block;font-size:11px;color:#c6ceb1}
.arcade-mode #battle-field .battle-kills{display:none}
.arcade-mode #battle-field .battle-enemy-title{min-width:150px}
.arcade-mode #battle-field{touch-action:pan-y;cursor:crosshair}
.arcade-mode .battle-spell,.arcade-mode .battle-victory-particles{display:none}
.arcade-mode #battle-monster>svg{animation:none}
#battle-monster.arcade-downed{visibility:hidden}
#battle-hero.arcade-hurt{outline:2px solid #d5ab79;outline-offset:2px}
#arcade-controls{position:absolute;z-index:115;left:12px;right:12px;bottom:12px;display:flex;align-items:end;justify-content:space-between;pointer-events:none}
#arcade-controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;font:inherit;font-size:13px;min-width:43px;min-height:43px;color:#f0e5bd;background:#263d37e8;border:1px solid #a6b18a;box-shadow:0 2px #162725}
#arcade-controls button[aria-pressed="true"]{background:#647953}
.arcade-dpad{display:grid;grid-template-columns:repeat(3,43px);grid-template-rows:repeat(2,43px);gap:3px}
.arcade-dpad [data-arcade-action="up"]{grid-column:2}
.arcade-dpad [data-arcade-action="left"]{grid-column:1;grid-row:2}
.arcade-dpad [data-arcade-action="down"]{grid-column:2;grid-row:2}
.arcade-dpad [data-arcade-action="right"]{grid-column:3;grid-row:2}
.arcade-action-buttons{display:flex;flex-direction:column;gap:7px;align-items:end}
.arcade-action-buttons>div{display:flex;gap:7px}
#arcade-controls .arcade-action-buttons [data-arcade-action]{padding:7px 12px;min-width:64px;min-height:53px}
#arcade-controls small{display:block;font-size:10px;color:#c5cbaa}
#arcade-controls #arcade-pause{min-height:34px;padding:5px 9px;font-size:11px}
#arcade-overlay{position:absolute;inset:0;z-index:120;display:grid;place-items:center;padding:16px;background:#172a2c72;cursor:default}
#arcade-overlay>div{max-width:355px;background:#243c38f5;color:#f1e5bd;border:1px solid #b0aa7c;padding:20px;text-align:center}
#arcade-overlay h4{font-size:17px}
#sound-dialog #arcade-overlay p{color:#d5dbc0;font-size:12px;line-height:1.8;margin:10px 0}
#arcade-overlay button{font:inherit;font-size:12px;padding:10px 13px;min-height:42px;cursor:pointer;border:1px solid #9aa87f;background:#405b48;color:#f3e8c2;margin:4px}
.arcade-message{display:none;font-size:12px;margin:6px 13px;color:#6a7048;min-height:18px}
.arcade-mode .arcade-message:not(:empty){display:block}
#sound-dialog .arcade-mode .battle-health label{font-size:11px}
@media(max-width:620px){
 .battle-heading-main{gap:7px}.battle-heading-main .adventure-kicker{display:none}#sound-dialog .battle-heading{padding:7px 9px}#sound-dialog .battle-heading h3{font-size:14px}
 .battle-mode-picker{padding:6px 9px;gap:5px}.battle-mode-picker button{font-size:11px;padding:6px 10px}.battle-mode-picker>span{display:none}
 #arcade-hud{top:9px;left:9px;padding:7px 8px;width:135px}#sound-dialog #arcade-hud label{font-size:10px}#arcade-score{font-size:10px}
 .arcade-mode #battle-field .battle-enemy-title{top:9px;right:9px;min-width:125px;padding:6px 8px}
 .arcade-mode #battle-field .battle-enemy-title b{font-size:11px}
 #arcade-controls{left:9px;right:9px;bottom:9px}.arcade-dpad{grid-template-columns:repeat(3,36px);grid-template-rows:repeat(2,38px);gap:3px}
 #arcade-controls button{min-width:36px;min-height:38px;font-size:11px}#arcade-controls .arcade-action-buttons [data-arcade-action]{min-width:52px;min-height:46px;padding:5px 7px}
 #arcade-overlay>div{padding:14px}#arcade-overlay h4{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.arcade-mode #battle-hero *,.arcade-mode #battle-monster *{animation:none!important}}
/* Knockout: the hero lies down, the overlay explains what this adventure loses (never lessons or records). */
.arcade-mode #battle-hero.arcade-down>svg{transform:rotate(78deg) translate(14%,-18%);opacity:.85;transition:transform .25s steps(3,end)}
#arcade-overlay.knocked-out>div{border-color:#c98a6a;background:#3a2f2cf2}
#arcade-overlay.knocked-out h4{color:#f6c9a8}
@media(prefers-reduced-motion:reduce){.arcade-mode #battle-hero.arcade-down>svg{transition:none}}