/* Approved lightweight battle design. Scoped to HUD/pause, never reward views. */
#hud{--battle-meters-top:max(34px,calc(env(safe-area-inset-top) + 27px));font-family:Georgia,'Songti SC',serif;color:#f5dfaf}
#hud :is(#stage-hud-name,#wave-label,#mode-hud,#arcana-hud,#map-hint,#mission,#passive-loadout,#f16-inventory,#f16-navigation,#secrets-hud){display:none!important}
#hud .xp{position:absolute;top:var(--battle-meters-top);left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));height:5px;border:1px solid #a88c56;background:#101820d9;box-shadow:0 0 0 1px #10171b}
#hud .xp i{background:linear-gradient(#fde4a0,#c18d39);box-shadow:none}
#hud .hud-top{position:absolute;inset:max(10px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) auto max(18px,env(safe-area-inset-left));height:86px;padding:0;align-items:start}
#hud #level{font-size:14px;margin:0;line-height:20px;text-shadow:0 2px 3px #000}
#hud #timer{position:absolute;left:50%;top:49px;transform:translateX(-50%);width:112px;height:38px;display:grid;place-items:center;background:url('/nightfall/assets/ui-brass/battle-light/timer.webp') center/100% 100% no-repeat;clip-path:polygon(12% 0,88% 0,100% 25%,100% 75%,88% 100%,12% 100%,0 75%,0 25%);font-size:24px;letter-spacing:1px;line-height:1;color:#f5dfaf}
#hud .stats{position:absolute;top:50px;left:0;right:0;display:grid;grid-template-columns:1fr;gap:3px;font:700 12px/1.3 Georgia,serif;color:#f5dfaf;text-shadow:0 2px 3px #000}
#hud #pause{position:absolute;right:0;top:-1px;min-width:44px;width:44px;height:42px;padding:0;border:0;border-radius:0;background:url('/nightfall/assets/ui-brass/battle-light/pause.webp') center/contain no-repeat;color:transparent;clip-path:polygon(18% 0,82% 0,100% 17%,100% 83%,82% 100%,18% 100%,0 83%,0 17%);box-shadow:none}
#hud .hp{position:absolute;bottom:auto;top:calc(var(--battle-meters-top) + 12px);left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));transform:none;width:auto;height:5px;border:1px solid #9a7a55;border-radius:2px;background:#101820d9;box-shadow:0 1px 3px #000;pointer-events:none}
#hud .hp i{background:linear-gradient(#df6b62,#9f303c);box-shadow:none;transition:width .12s}
#hud .hp span{top:-31px;left:auto;right:0;text-align:right;font:10px/1.2 Georgia,serif;color:#e6d5ae;text-shadow:0 1px 2px #000}
#hud .hp[data-low=true]{border-color:#f29778}
#hud #loadout{position:absolute;inset:auto auto max(16px,calc(env(safe-area-inset-bottom) + 10px)) 50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:auto;min-height:44px;padding:2px 0;border:0;border-radius:0;background:none;box-shadow:none;color:#e7d3a7;pointer-events:auto;animation:none}
#hud #loadout .battle-equipment-slot{position:relative;display:block;width:36px;height:36px;padding:0;border:0;background:none;box-shadow:none}
.battle-icon{display:block;width:100%;height:100%;background:none!important;overflow:hidden;image-rendering:pixelated;object-fit:contain}
#hud #loadout .battle-equipment-slot small{position:absolute;right:-3px;bottom:-3px;font:10px/1 Georgia,serif;color:#f5dfaf;text-shadow:0 1px 2px #000,1px 0 2px #000}
#hud #loadout .battle-more{font-size:16px;line-height:1;padding:0;border:0;background:none}
#hud #nova{position:absolute;inset:auto max(20px,env(safe-area-inset-right)) max(65px,calc(env(safe-area-inset-bottom) + 56px)) auto;width:84px;height:81px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:hidden;clip-path:circle(47% at 48% 50%);font-size:0;transition:filter .15s,opacity .15s}
#hud #nova::before,#hud #nova::after{content:none}
#hud #nova img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
#hud #nova small{position:absolute;inset:51% 10% auto;font:700 12px/1.5 Georgia,serif;color:#f5dfaf;text-shadow:0 1px 3px #000;pointer-events:none}
#hud #nova:disabled{filter:saturate(.25);opacity:.68}
#hud #nova:disabled small{font-size:18px;top:45%}
#hud #nova.nova-ready{box-shadow:none;filter:drop-shadow(0 0 4px #e8cf8066)}
#hud #nova.nova-casting{box-shadow:none;filter:brightness(1.35)}
#hud #bossbar{top:max(110px,calc(env(safe-area-inset-top) + 100px));width:min(300px,62vw);font:12px/1.4 Georgia,serif;pointer-events:none}
#hud #pickup-notice{top:auto;bottom:max(132px,calc(env(safe-area-inset-bottom) + 125px));left:25%;right:25%;font-size:11px}
#overlay:has(.h5-light-pause){display:grid;place-items:center;padding:12px;background:#030b11a0;backdrop-filter:blur(3px);overflow:hidden}
#overlay[hidden]:has(.h5-light-pause){display:none}
#overlay>.panel:has(.h5-light-pause){box-sizing:border-box;width:min(360px,calc(100vw - 32px));max-width:none;max-height:calc(var(--viewport-height,100dvh) - 24px);height:auto;overflow:hidden;margin:0;padding:22px;background:#0b1b24f5;color:#e8d5ab;border:1px solid #af8d50;border-radius:2px;box-shadow:inset 0 0 0 4px #0d1a22,inset 0 0 0 5px #5b523d,0 15px 55px #000a;text-align:left;animation:none;font:14px/1.5 Georgia,'Songti SC',serif}
.h5-light-pause *{box-sizing:border-box}
.h5-light-pause .battle-dialog-head{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:12px}
.h5-light-pause h2{font-size:25px;line-height:1.2;margin:3px 0 0;font-weight:500;letter-spacing:0;color:#e8d5ab}
.battle-eyebrow{font:10px/1.2 Georgia,serif;color:#b49b6b;letter-spacing:.2em}
.h5-light-pause button{touch-action:manipulation;min-height:44px;border:1px solid #726344;background:#0d1c26;color:#e8d5ab;padding:8px 12px;font:14px/1.2 Georgia,serif;cursor:pointer;letter-spacing:0;box-shadow:none;border-radius:2px}
.h5-light-pause button:focus-visible,#hud button:focus-visible{outline:2px solid #ffe4a4;outline-offset:2px}
.h5-light-pause #battle-close{font:26px/1 system-ui;background:none;border:0;margin:-8px -8px 0 0;width:44px;padding:0;color:#b2a082}
.battle-detail-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid #726344;padding:10px 0;gap:12px}
.battle-detail-stats b{display:block;font:21px/1.3 Georgia,serif;font-variant-numeric:tabular-nums;color:#e8d5ab}
.battle-detail-stats small{font:11px system-ui;color:#adb5ae}
.battle-pause-icons{display:flex;justify-content:center;gap:18px;padding:18px 0}
.battle-equipment-slot{position:relative;display:block;width:48px;height:48px;flex-shrink:0;background:none;padding:0;border:0}
.battle-equipment-slot small{position:absolute;right:0;bottom:-3px;font:11px/1 Georgia,serif;color:#e8d5ab;text-shadow:0 1px 2px #000}
.h5-light-pause .battle-equipment-link{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border-inline:0;border-top:0;border-radius:0}
.battle-pause-actions{display:grid;gap:8px;margin-top:12px}
.h5-light-pause .battle-brass-button{height:48px;border:1px solid #ac8a50;background:linear-gradient(#23343c,#0d1c26);font-weight:700;box-shadow:inset 0 0 0 3px #0d1a22,inset 0 0 0 4px #5b523d}
.h5-light-pause #battle-end,.h5-light-pause #battle-cancel,.h5-light-pause #battle-overview{border:0;background:none;font-size:12px;color:#b8b9ad}
.battle-pause-note{margin:12px 0;color:#adb5ae;font:12px/1.5 system-ui}
.battle-equipment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px;min-height:168px}
.battle-equipment-row{display:flex;align-items:center;gap:7px;min-width:0}
.battle-equipment-row .battle-equipment-slot{width:34px;height:34px}
.battle-equipment-row strong{font:12px/1.25 Georgia,serif;display:block;overflow-wrap:anywhere}
.battle-equipment-row div>small{font:10px/1.4 system-ui;display:block;color:#adb5ae}
.battle-equipment-pager{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:8px;font:12px Georgia,serif}
.h5-light-pause .battle-equipment-pager button{min-width:44px;font-size:24px;padding:0}
.h5-light-pause button:disabled{opacity:.35;cursor:default}
@media(orientation:landscape){#hud{--battle-meters-top:max(36px,calc(env(safe-area-inset-top) + 26px))}#hud .xp,#hud .hp{right:calc(50% + 100px)}#hud #timer{top:0}#hud .stats{left:auto;right:62px;top:7px;display:flex;gap:18px}#hud #pause{right:-62px;top:-7px}#hud #nova{bottom:max(22px,env(safe-area-inset-bottom));width:80px;height:77px}#hud #bossbar{top:65px}#hud #loadout{bottom:max(14px,env(safe-area-inset-bottom))}}
@media(max-height:450px){#overlay>.panel:has(.h5-light-pause){width:350px;padding:14px 20px}.h5-light-pause .battle-dialog-head{margin-bottom:6px}.h5-light-pause h2{font-size:22px}.battle-detail-stats{padding:6px 0}.battle-pause-icons{padding:10px 0}.battle-pause-icons .battle-equipment-slot{width:36px;height:36px}.battle-pause-actions{gap:2px;margin-top:6px}.battle-equipment-grid{min-height:120px;gap:6px}.battle-equipment-pager{margin-top:4px}}
@media(prefers-reduced-motion:reduce){#hud .hp i,#hud #nova{transition:none}}

/* Debug remains reachable without covering Nova or the pause close button. */
body.playing #debug-toggle{inset:auto 12px max(8px,env(safe-area-inset-bottom)) auto!important;padding:6px 9px;min-height:28px;font-size:10px}
@media(orientation:landscape) and (max-height:360px){
 #overlay>.panel:has(.h5-light-pause){width:min(560px,calc(100vw - 32px));padding:12px 20px}
 .battle-equipment-grid{grid-template-columns:repeat(3,minmax(0,1fr));min-height:76px}
 .battle-pause-actions{grid-template-columns:1fr 1fr;gap:10px}
 .battle-pause-icons{padding:8px 0}
}

@media(orientation:landscape){body.playing #debug-toggle{right:110px!important}}

/* The upgrade footer explains Banish in both orientations, including short phones. */
#overlay[data-game-presentation] .upgrade-view .upgrade-help{display:block;font-size:10px;line-height:1.3;margin:4px 0 0}
#overlay[data-game-presentation] .upgrade-view .upgrade-help>span{display:block}
/* Keep the footer visible on short landscape phones without losing controls. */
@media(orientation:landscape) and (max-height:360px){
 #overlay[data-game-presentation]>.panel:has(.upgrade-view){padding:7px}
 #overlay[data-game-presentation] .upgrade-view .eyebrow{font-size:8px;margin:0;line-height:1.2}
 #overlay[data-game-presentation] .upgrade-view h2{font-size:18px;line-height:1.15;margin:0}
 #overlay[data-game-presentation] .upgrade-view>p{font-size:10px;line-height:1.25;margin:2px 0}
 #overlay[data-game-presentation] .upgrade-view .choices{gap:5px;margin:4px 0}
 #overlay[data-game-presentation] .upgrade-view .choice{display:grid;grid-template-columns:28px minmax(0,1fr);gap:0 5px;padding:5px}
 #overlay[data-game-presentation] .upgrade-view .choice .icon{grid-column:1;grid-row:1/4;align-self:center;font-size:22px;margin:0}
 #overlay[data-game-presentation] .upgrade-view .choice small,#overlay[data-game-presentation] .upgrade-view .choice strong,#overlay[data-game-presentation] .upgrade-view .choice p{grid-column:2}
 #overlay[data-game-presentation] .upgrade-view .choice small{font-size:9px;line-height:1.1}
 #overlay[data-game-presentation] .upgrade-view .choice strong{font-size:13px;line-height:1.2;margin:1px 0}
 #overlay[data-game-presentation] .upgrade-view .choice p{font-size:10px;line-height:1.25;margin:1px 0}
 #overlay[data-game-presentation] .upgrade-view .upgrade-tools{margin:2px 0}
 #overlay[data-game-presentation] .upgrade-view .upgrade-tools button{font-size:11px}
 #overlay[data-game-presentation] .upgrade-view .upgrade-stock{font-size:10px;line-height:1.1;margin:1px 0}
 #overlay[data-game-presentation] .upgrade-view .upgrade-help{font-size:10px;line-height:1.3;margin:2px 0 0}
}

/* Live circular cooldown. The static ring baked into the art is cropped away. */
#hud #nova img{clip-path:circle(37% at 48% 50%)}
#hud #nova .nova-meter{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#hud #nova .nova-meter circle{fill:none;stroke-width:5}
#hud #nova .nova-track{stroke:#38454a}
#hud #nova .nova-fill{stroke:#eed580;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:var(--nova-offset,0);transition:stroke-dashoffset .09s linear}
#hud #nova:disabled{filter:none;opacity:1}
#hud #nova:disabled small{color:#c3c8c5}
@media(prefers-reduced-motion:reduce){#hud #nova .nova-fill{transition:none}}
