/* Header artwork uses the supplied 1080 x 100 design coordinates. */
main.game-shell>header{--hu: .48148px;position:relative;height:calc(100 * var(--hu))!important;min-height:calc(100 * var(--hu))!important;flex:0 0 calc(100 * var(--hu))!important;padding:0 calc(34 * var(--hu)) 0 calc(160 * var(--hu))!important;background:#f8efda url('assets/ui/header-bg-851.png') center/100% 100% no-repeat!important;border-bottom:1px solid #ddc592!important;box-shadow:0 2px 5px #dfc58a40;overflow:visible;gap:0}
main.game-shell>header:before{content:'⚔️';position:absolute;z-index:4;left:calc(42 * var(--hu));top:0;width:calc(104 * var(--hu));height:calc(132 * var(--hu));padding-top:calc(24 * var(--hu));box-sizing:border-box;text-align:center;font-size:calc(46 * var(--hu));line-height:1;background:url('assets/ui/header-flag-853.png') top center/100% 100% no-repeat;filter:drop-shadow(0 1px 2px #c6a85688);pointer-events:none}
main.game-shell>header .dungeon-header-title{gap:calc(10 * var(--hu));position:relative;padding-left:calc(36 * var(--hu));flex:1;min-width:0}
main.game-shell>header .dungeon-header-title:before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:calc(25 * var(--hu));height:calc(34 * var(--hu));background:#c9b38a;mask:url('assets/ui/header-mark-851.png') center/contain no-repeat}
main.game-shell>header .dungeon-header-title strong{font-size:calc(38 * var(--hu));color:#2b3039;letter-spacing:calc(3 * var(--hu));font-weight:900}
main.game-shell>header .dungeon-header-title small{font-size:calc(23 * var(--hu));color:#b79770;letter-spacing:calc(2 * var(--hu))}
main.game-shell>header .battle-header-wallet{scale:1!important;gap:calc(26 * var(--hu))!important;flex-shrink:0}
main.game-shell>header .battle-header-wallet .growth-coin-wallet,main.game-shell>header .battle-header-wallet .diamond-wallet{width:calc(120 * var(--hu))!important;min-width:calc(120 * var(--hu))!important;height:calc(43 * var(--hu))!important;padding:0 calc(14 * var(--hu)) 0 calc(40 * var(--hu))!important;border-radius:calc(24 * var(--hu));background:#2c405e}
main.game-shell>header .battle-header-wallet .growth-coin-wallet img,main.game-shell>header .battle-header-wallet .diamond-wallet i{width:calc(52 * var(--hu))!important;height:calc(52 * var(--hu))!important;left:calc(-7 * var(--hu))!important;flex-basis:calc(52 * var(--hu))!important}
main.game-shell>header .battle-header-wallet b{font-size:calc(26 * var(--hu))!important;height:auto!important;line-height:1!important}
main.game-shell>header:before{content:'';background-image:url('assets/ui/nav-battle-user.png'),url('assets/ui/header-flag-853.png');background-position:center 24%,top center;background-size:58% auto,100% 100%;background-repeat:no-repeat}
/* Open the adventure battlefield to both screen edges. */
main.game-shell>#battlefield{width:100%!important;margin-left:0!important;margin-right:0!important;border-radius:0!important;border-bottom:2px solid #ddc592;}

/* Stronger header glow and requested battlefield divider. */
main.game-shell>header{box-shadow:0 2px 8px #dfb86e99,0 0 5px #e6c58b88;z-index:4}
main.game-shell>#battlefield{border-bottom:6px solid #f2c789!important}
/* Soft dark shadow; align gate health with the banner's center. */
main.game-shell>header{box-shadow:0 3px 8px #30251b66,0 1px 3px #20180f55}
main.game-shell>header:before{filter:drop-shadow(0 2px 2px #30251b77)}
main.game-shell>#battlefield>.castle{left:8.703704%;top:calc(52 * var(--hu));transform:translateX(-50%)}
/* Area label directly below the upper-right wave bar. */
main.game-shell>#battlefield>.battle-location{left:auto;right:12px;top:51px;height:auto;min-height:0;justify-content:flex-end;text-align:right}
/* Match the right HUD's top edge to gate health, with area copy below. */
main.game-shell>#battlefield>.wave-panel{top:calc(52 * var(--hu));}
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu) + 30px);right:12px;width:118px;justify-content:center;text-align:center}
/* Align area text with the heart row; progress belongs above that row. */
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu));height:32px;align-items:center;}
main.game-shell>#battlefield>.wave-panel{top:calc(52 * var(--hu) - 18px);}
/* Center the bar in the gap from the header edge to the region text. */
main.game-shell>#battlefield>.wave-panel{top:calc(26 * var(--hu) + 3.8px);height:8px;transform:translateY(-50%)}
/* Lower progress slightly and align the area text with its right edge. */
main.game-shell>#battlefield>.wave-panel{top:calc(26 * var(--hu) + 9.8px)}
main.game-shell>#battlefield>.battle-location{justify-content:flex-end;text-align:right}
/* Right-align the wave count inside the progress bar. */
main.game-shell>#battlefield>.wave-panel #waveText{left:auto;right:0;top:50%;transform:translateY(-50%);text-align:right}
/* Center progress between the heart badge and the area label on one row. */
main.game-shell>#battlefield>.wave-panel{left:calc((8.703704% + 26.5px + 100% - 130px) / 2);right:auto;top:calc(52 * var(--hu) + 16px);transform:translate(-50%,-50%)}
/* Center progress on the battlefield's horizontal axis. */
main.game-shell>#battlefield>.wave-panel{left:50%;right:auto;transform:translate(-50%,-50%)}
/* Wave count sits above the center, slightly overlapping the bar. */
main.game-shell>#battlefield>.wave-panel #waveText{left:50%;right:auto;top:0;transform:translate(-50%,-75%);text-align:center;white-space:nowrap}
/* Separate the wave count and center idle rewards above the summon row. */
main.game-shell>#battlefield>.wave-panel #waveText{top:-4px;transform:translate(-50%,-100%)}
main.game-shell>#battlefield>.idle-chest{left:50%!important;right:auto;transform:translateX(-50%)}
#idleChest>.chest-art{background-image:url('assets/ui/idle-chest-865.png');transform:none}
/* Anchor deployment to the current header height, keeping 20px at the scene edge. */
main.game-shell>.controls>[data-panel="battle"]>.hero-cards{top:calc(100 * var(--hu) + var(--scene-height) - 104px)}
main.game-shell>.controls>[data-panel="battle"]>.battle-menu-head{top:calc(100 * var(--hu) + var(--scene-height) - 144px)}
main.game-shell>#battlefield>.idle-chest{bottom:106px!important}
/* Reference layout: area and progress form one right-hand group within the heart row. */
main.game-shell>#battlefield>.battle-location{left:auto;right:12px;top:calc(52 * var(--hu) + 2px);width:118px;height:17px;transform:none;justify-content:center;align-items:center;text-align:center;color:#fff;-webkit-text-stroke:2px #302217;paint-order:stroke fill;text-shadow:none}
main.game-shell>#battlefield>.battle-location span,main.game-shell>#battlefield>.battle-location i,main.game-shell>#battlefield>.battle-location b{font-size:13px;line-height:17px;font-weight:900;color:#fff}
main.game-shell>#battlefield>.wave-panel{left:auto;right:12px;top:calc(52 * var(--hu) + 20px);width:118px;height:8px;transform:none}
main.game-shell>#battlefield>.wave-panel #waveText{left:50%;right:auto;top:50%;transform:translate(-50%,-50%);font-size:12px;line-height:1;text-align:center;white-space:nowrap}
/* Raise both HUD groups together by 10px. */
main.game-shell>#battlefield>.castle{top:calc(52 * var(--hu) - 10px)}
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu) - 8px)}
main.game-shell>#battlefield>.wave-panel{top:calc(52 * var(--hu) + 10px)}
/* Lower both HUD groups 5px from the previous position. */
main.game-shell>#battlefield>.castle{top:calc(52 * var(--hu) - 5px)}
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu) - 3px)}
main.game-shell>#battlefield>.wave-panel{top:calc(52 * var(--hu) + 15px)}
/* Slightly smaller area lettering with a stronger outline. */
main.game-shell>#battlefield>.battle-location{ -webkit-text-stroke:3px #302217;paint-order:stroke fill}
main.game-shell>#battlefield>.battle-location span,main.game-shell>#battlefield>.battle-location i,main.game-shell>#battlefield>.battle-location b{font-size:12px}
/* Boss health shares the heart's center line, without a frame. */
main.game-shell>#battlefield>.elite-battle-hud{top:calc(52 * var(--hu) + 11px);transform:translate(-50%,-50%);padding:0;border:0;box-shadow:none;background:transparent}
main.game-shell>#battlefield>.elite-battle-hud>span{inset:0;border:0;box-shadow:none}
/* Shared progress treatment: flat track, rounded ends and centered labels. */
main.game-shell>#battlefield>.wave-panel,
main.game-shell>#battlefield>.elite-battle-hud{height:8px;padding:0;border:0;border-radius:4px;background:transparent;box-shadow:none}
main.game-shell>#battlefield>.wave-panel>div,
main.game-shell>#battlefield>.elite-battle-hud>span{height:8px;inset:0;margin:0;padding:0;border:0;border-radius:4px;background:#29425d;box-shadow:none}
main.game-shell>#battlefield>.wave-panel #waveBar,
main.game-shell>#battlefield>.elite-battle-hud>span i{height:8px;border:0;border-radius:4px;box-shadow:none}
main.game-shell>#battlefield>.wave-panel #waveBar{background:#ffda68}
main.game-shell>#battlefield>.elite-battle-hud>span i{background:#ed4054}
main.game-shell>#battlefield>.elite-battle-hud>small{left:0;right:0;top:-18px;bottom:auto;transform:none;height:17px;font-size:12px;line-height:17px;text-align:center;color:#fff;-webkit-text-stroke:3px #302217;paint-order:stroke fill;text-shadow:none}
main.game-shell>#battlefield>.elite-battle-hud>em.dungeon-boss-protection,
main.game-shell>#battlefield>.wave-panel #waveText{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);margin:0;font-size:12px;font-weight:900;line-height:1;letter-spacing:0;text-align:center;color:#fff;-webkit-text-stroke:2px #172129;paint-order:stroke fill;text-shadow:none;white-space:nowrap}
/* Preserve the boss captions below opposite ends of its shared-style bar. */
main.game-shell>#battlefield>.elite-battle-hud>em.dungeon-boss-protection{left:6px;right:auto;top:calc(100% + 2px);bottom:auto;transform:none;font-size:12px;line-height:1.2;text-align:left}
main.game-shell>#battlefield>.elite-battle-hud>small{left:auto;right:6px;top:calc(100% + 2px);bottom:auto;transform:none;height:auto;font-size:12px;line-height:1.2;text-align:right;-webkit-text-stroke:2px #172129}
/* Strengthen both boss caption outlines. */
main.game-shell>#battlefield>.elite-battle-hud>em.dungeon-boss-protection,
main.game-shell>#battlefield>.elite-battle-hud>small{-webkit-text-stroke:3px #172129;paint-order:stroke fill}
/* Align boss captions to the bar endpoints and wave progress to heart center. */
main.game-shell>#battlefield>.elite-battle-hud>em.dungeon-boss-protection{display:none}
main.game-shell>#battlefield>.elite-battle-hud>small{left:0;right:0;width:100%;height:auto;text-align:center}
main.game-shell>#battlefield>.wave-panel{top:calc(52 * var(--hu) + 7px)}
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu) - 11px)}
/* Area caption below progress, count above; match boss caption sizing. */
main.game-shell>#battlefield>.battle-location{top:calc(52 * var(--hu) + 17px);height:auto;justify-content:center;text-align:center}
main.game-shell>#battlefield>.battle-location span,main.game-shell>#battlefield>.battle-location i,main.game-shell>#battlefield>.battle-location b{font-size:12px;line-height:1.2}
main.game-shell>#battlefield>.wave-panel #waveText{left:50%;right:auto;top:-4px;bottom:auto;transform:translate(-50%,-100%);text-align:center}
/* Match the wave count outline to the area caption. */
main.game-shell>#battlefield>.wave-panel #waveText{-webkit-text-stroke:3px #302217;paint-order:stroke fill}
/* Restore stage-number accent and shorten the boss health track. */
main.game-shell>#battlefield>.battle-location #regionStage{color:#ffd45c}
main.game-shell>#battlefield>.elite-battle-hud{width:180px}
/* Balance the header symbols and align English to the Korean baseline. */
main.game-shell>header:before{background-size:46% auto,100% 100%;background-position:center 26%,top center}
main.game-shell>header .dungeon-header-title{align-items:baseline;padding-left:calc(44 * var(--hu))}
main.game-shell>header .dungeon-header-title strong{font-size:calc(34 * var(--hu));line-height:1.2}
main.game-shell>header .dungeon-header-title small{line-height:1.2;align-self:baseline}
main.game-shell>header .dungeon-header-title:before{width:calc(38 * var(--hu));height:calc(44 * var(--hu))}
/* Preserve fixed lower sections; let the battlefield absorb header-height changes. */
main.game-shell{--scene-height:calc(var(--game-height,960px) - 406px - 100 * var(--hu))}
main.game-shell>header:before{background-size:52% auto,100% 100%}
/* Keep the header's hanging banner above the defeat backdrop. */
main.game-shell:has(>#battlefield>.dungeon-failure-overlay)>header{z-index:2001}
/* Lower the idle chest by 5px. */
main.game-shell>#battlefield>.idle-chest{bottom:101px!important}
/* Let clicks through the empty center of the deployment HUD to the chest. */
main.game-shell>.controls>[data-panel="battle"]>.battle-menu-head{pointer-events:none}
main.game-shell>.controls>[data-panel="battle"]>.battle-menu-head .battle-deck-heading,
main.game-shell>.controls>[data-panel="battle"]>.battle-menu-head .deployment-wallet,
main.game-shell>.controls>[data-panel="battle"]>.battle-menu-head button{pointer-events:auto}
/* Softer shared header shadow. */
main.game-shell>header{box-shadow:0 2px 5px #30251b33,0 1px 2px #20180f26}
/* All summon portraits share the same bottom-center anchor. */
main.game-shell #heroCards .card .portrait{display:flex;align-items:flex-end;justify-content:center}
main.game-shell #heroCards .card .portrait img{object-position:center bottom;transform-origin:50% 100%;transform:none;translate:0 -4px;margin:0}
/* Reveal the dark track around the fill, like a subtle inner border. */
main.game-shell>#battlefield>.wave-panel #waveBar,
main.game-shell>#battlefield>.elite-battle-hud>span i{clip-path:inset(1px round 3px)}

main.game-shell>header:before{background-image:var(--header-menu-icon,url('assets/ui/nav-battle-user.png')),url('assets/ui/header-flag-853.png')}

/* Boss HUD shares the auto HUD's text and bar rhythm. */
main.game-shell>#battlefield>.elite-battle-hud{left:50%;right:auto;top:var(--battle-hud-top,9px);width:calc(360 * var(--hu));height:calc(78.2 * var(--hu));transform:translateX(-50%);padding:0;border:0;background:none;box-shadow:none;animation:bossHudSoftReveal .5s ease-out}
main.game-shell>#battlefield>.elite-battle-hud>span{position:absolute;inset:auto 0 auto 0;top:calc(43.1 * var(--hu));height:calc(16 * var(--hu));width:100%;border-radius:99px}
main.game-shell>#battlefield>.elite-battle-hud>:is(small,em.dungeon-boss-protection){top:calc(13.1 * var(--hu));bottom:auto;font-size:calc(21 * var(--hu));line-height:1.2;-webkit-text-stroke:1.5px #172129;paint-order:stroke fill;text-shadow:none;transform:none}
main.game-shell>#battlefield>.elite-battle-hud>em.dungeon-boss-protection{left:0}
main.game-shell>#battlefield>.elite-battle-hud>small{right:0}
@keyframes bossHudSoftReveal{from{opacity:0}to{opacity:1}}

main.game-shell>#battlefield>.elite-battle-hud>span i{height:100%}

main.game-shell>#battlefield>.elite-battle-hud>small>.boss-name-title{color:#ffe3a0;font-size:.85em}

main.game-shell>header .battle-header-wallet .growth-coin-wallet,main.game-shell>header .battle-header-wallet .diamond-wallet,main.game-shell>header .battle-header-wallet .header-summon-ticket-wallet{width:calc(150 * var(--hu))!important;min-width:calc(150 * var(--hu))!important}
main.game-shell.summon-mode>header .battle-header-wallet .growth-coin-wallet{display:none!important}



/* Main-screen Korean headings use Jalnan Gothic. */
main.game-shell>header .dungeon-header-title strong{font-family:"Jalnan Gothic",sans-serif;font-weight:400}

/* Slightly larger main headings with matching English typography. */
main.game-shell>header .dungeon-header-title strong{font-size:calc(36 * var(--hu))}
main.game-shell>header .dungeon-header-title small{font-family:"Jalnan Gothic",sans-serif;font-weight:400}
