/* Full-width balances first, then a full-width screen title. */
.topbar.screen-header{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;height:auto;min-height:78px;gap:12px;padding:14px 0;margin:0 0 16px;border:none}
.screen-title{position:relative;isolation:isolate;min-width:0;width:100%;box-sizing:border-box;margin:0;padding:12px 18px;font:32px/1.2 Georgia,serif;color:#ffe0a4;white-space:nowrap;text-shadow:0 2px 3px #000}
.screen-title::before{content:"";position:absolute;inset:0;z-index:-1;background:url('/build/79bab3518bc79acd/assets/ink-heading.svg') center/100% 100% no-repeat;pointer-events:none}
.screen-header .resources{flex:0 0 auto;flex-wrap:nowrap;justify-content:space-between;width:100%;box-sizing:border-box;gap:16px;margin:0;padding:6px 8px;background:#102323eb;border:1px solid #8e815844;border-radius:4px;box-shadow:none}
.screen-header .resource{display:flex;align-items:center;gap:5px;font:15px/1.3 'Segoe UI',sans-serif;color:#f0e8cc}
.screen-header .resource img{width:22px;height:22px;object-fit:contain;image-rendering:pixelated}
.screen-header .resources .btn.icon-only{display:flex;align-items:center;justify-content:center;min-width:40px;width:40px;height:40px;min-height:40px;margin:0;padding:8px}
.screen-header .resources .icon{width:22px;height:22px}
.scene-home .screen-title{display:none}
.scene-home .screen-header{justify-content:flex-end}
.scene-expedition .screen-header{display:none}
/* Descriptions remain below; screen names are presented once in the header. */
body:not([data-view="home"]) main>.page-intro .eyebrow,body:not([data-view="home"]) main>.page-intro h2,
.heroes-hub>header .eyebrow,.heroes-hub>header h2,.gear-collection>header .eyebrow,.gear-collection>header h2,
body[data-view="depart"] main>.recruitment>.eyebrow,body[data-view="depart"] main>.recruitment>h2,
body[data-view="arena"] .arena-hall>h2{display:none}
.page-intro{align-items:center;gap:12px;margin-bottom:18px}
.page-intro p{margin:0;font:14px/1.6 'Segoe UI',sans-serif;color:#dfdfcb}
.page-intro .help-pill{flex-shrink:0;min-height:40px}
.recurring-journal>header .eyebrow,.recurring-journal>header h2{display:none}
.trial-journal>header h2{position:relative;isolation:isolate;width:fit-content;padding:10px 16px}
.trial-journal>header h2::before{content:"";position:absolute;inset:0;z-index:-1;background:url('/build/79bab3518bc79acd/assets/ink-heading.svg') center/100% 100% no-repeat}
.recurring-journal>header .btn{margin-top:12px}
/* Six equal destinations, with a clear selected state and comfortable touch areas. */
.sidebar{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;position:fixed;left:50%;bottom:12px;transform:translateX(-50%);width:min(680px,calc(100% - 32px));height:auto;padding:6px;background:#102322f5;border:1px solid #927f5266;border-radius:8px;box-shadow:0 5px 24px #0009;backdrop-filter:blur(8px)}
.sidebar .nav-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;width:100%;min-height:58px;padding:8px 2px;color:#c4d1c9;font:13px/1.2 'Segoe UI',sans-serif;letter-spacing:0;border-radius:5px}
.sidebar .nav-btn .icon{width:23px;height:23px}
.sidebar .nav-btn.active{background:#3b4734;color:#ffe0a4;text-shadow:none;box-shadow:inset 0 2px #e6b96e}
.sidebar .nav-btn:hover{background-color:#30443c}
.sidebar .nav-btn:focus-visible,.screen-header .btn:focus-visible{outline:2px solid #ffe0a4;outline-offset:2px}
.shell{padding-bottom:calc(102px + env(safe-area-inset-bottom,0px))}
@media(max-width:760px){
 .topbar.screen-header{min-height:66px;gap:12px;padding:10px 0;margin-bottom:12px}
 .screen-title{padding:12px 14px;font-size:28px}
 .screen-header .resources{gap:8px;padding:3px 4px}
 .screen-header .resource{font-size:12px;gap:3px}
 .screen-header .resource img{width:17px;height:19px}
 .screen-header .resources .btn.icon-only{min-width:34px;width:34px;height:40px;min-height:40px;padding:6px}
 .screen-header .resources .icon{width:21px;height:21px}
 .sidebar{width:calc(100% - 16px);bottom:calc(8px + env(safe-area-inset-bottom,0px));padding:5px 3px;gap:2px}
 .sidebar .nav-btn{font-size:11px;min-height:58px;gap:6px}
 .sidebar .nav-btn .icon{width:23px;height:23px}
 .page-intro{gap:8px}
 .page-intro .help-pill{font-size:0;padding:8px}
 .page-intro .help-pill .icon{width:20px;height:20px}
}
@media(max-width:480px){
 .screen-header .resource{flex-direction:column;gap:2px;min-width:26px;font-size:12px}
}
@media(max-width:360px){
 .screen-title{font-size:26px;padding-inline:12px}
 .screen-header .resources{gap:4px}
 .screen-header .resource{gap:2px;font-size:11px}
 .screen-header .resource img{width:15px}
 .screen-header .resources .btn.icon-only{min-width:32px;width:32px}
 .sidebar .nav-btn{font-size:10px}
}

/* The journey track participates in header layout, never floats over its title. */
.expedition-world .expedition-top{position:absolute;left:16px;right:16px;top:14px;padding:12px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;background:linear-gradient(110deg,#07171bf2,#07171be8);border:1px solid #b7955366;box-shadow:0 4px 16px #0004}
.expedition-world .expedition-top>.expedition-heading,.arena-review .expedition-top>.expedition-heading{grid-column:1;max-width:none;width:auto;padding:0;background:none;border:0;min-width:0}
.expedition-world .expedition-top h2{max-width:none;font:24px/1.25 Georgia,serif;margin:5px 0 0;overflow-wrap:normal}
.expedition-world .expedition-top .expedition-tools{grid-column:2;width:auto;max-width:none;display:flex;flex-wrap:nowrap;justify-content:flex-end;gap:7px}
.expedition-world .expedition-progress{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding-top:9px;border-top:1px solid #8e815844;color:#dfdfcb;font:12px/1.5 Georgia,serif}
.expedition-world .expedition-top .journey-track{position:static;transform:none;display:flex;flex:0 0 auto;gap:8px;margin:0;padding:0;background:none;max-width:none}
.expedition-world .expedition-top .journey-track.arena-hide{display:none}
@media(max-width:600px){
 .expedition-world .expedition-top{left:10px;right:10px;top:10px;padding:10px 12px;gap:9px;grid-template-columns:minmax(0,1fr)}
 .expedition-world .expedition-top>.expedition-heading{grid-column:1}
 .expedition-world .expedition-top h2{font-size:22px}
 .expedition-world .expedition-top .expedition-tools{grid-column:1;justify-content:flex-start;flex-wrap:wrap;width:100%}
 .expedition-world .expedition-progress{font-size:11px;gap:7px;padding-top:8px}
 .expedition-world .expedition-top .journey-track{gap:8px}
 .expedition-world .expedition-top .journey-track .icon{width:12px;height:12px}
}

/* A constant HUD reservation prevents zoom/pan when routes or loot are shown. */
.expedition-world{--battle-hud-space:220px}
.expedition-world>canvas,.expedition-world.phase-battle>canvas,.expedition-world:not(.phase-battle)>canvas{position:absolute;inset:0 0 var(--battle-hud-space);width:100%;height:calc(100% - var(--battle-hud-space));min-height:0}
.expedition-world>.expedition-hud,.expedition-world.phase-battle>.expedition-hud{position:absolute;left:0;right:0;bottom:0;box-sizing:border-box;height:var(--battle-hud-space);min-height:var(--battle-hud-space);max-height:var(--battle-hud-space);overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;gap:6px;padding:8px 12px}
.expedition-world .party-hud,.expedition-world.phase-battle .party-hud{width:100%;max-width:none;min-width:0;flex:0 0 auto}
.expedition-world .world-loot{position:absolute;left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);box-sizing:border-box;width:min(720px,calc(100% - 32px));max-height:calc(100% - 32px);overflow-y:auto;overscroll-behavior:contain;padding:22px 26px;z-index:8;background:#102421fa;box-shadow:0 12px 40px #0009}
.expedition-world .world-loot .loot-actions{width:100%;max-width:480px;margin:18px auto 0}
.expedition-world .world-loot .loot-targets{gap:18px;flex-wrap:wrap}
@media(max-width:700px){
 .expedition-world{--battle-hud-space:220px}
 .expedition-world .world-loot{width:calc(100% - 24px);max-height:calc(100% - 24px);padding:18px 16px}
 .expedition-world .world-loot .loot-targets{gap:12px}
}

/* Portraits always inspect; the separate ULT control prepares the ability. */
.party-hud .ultimate-trigger{box-sizing:border-box;min-height:24px;padding:3px 4px;border:1px solid #526f73;border-radius:3px;background:#10282a}
.party-hud .ultimate-trigger b{font:10px/1.1 'Segoe UI',sans-serif;margin-top:3px}
.party-hud .ultimate-trigger.ready{background:#393b25;border-color:#cbae67;color:#ffe5a1}
.party-hud .ultimate-trigger.chosen{box-shadow:0 0 0 1px #ffe5a1}
.party-hud .ultimate-trigger:focus-visible{outline:2px solid #ffe5a1;outline-offset:2px}

/* Equipment and statuses share a bounded row; they cannot move the party offscreen. */
.expedition-world .battle-controls{flex:0 0 24px;align-self:stretch;flex-direction:row;margin:0}
.expedition-world .party-hud .member-status{grid-template-rows:auto 5px auto auto;row-gap:3px;min-width:0}
.expedition-world .member-effects{display:flex;align-items:center;gap:4px;min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.expedition-world .member-effects:empty{display:none}
.expedition-world .member-effects .member-relics{display:flex;flex-wrap:nowrap;flex:0 0 auto;gap:2px;min-height:20px}
.expedition-world .member-effects .member-relics>span{display:none}
.expedition-world .member-effects .status-badge{flex:0 0 auto;margin:0;font-size:9px}
.expedition-world .member-effects .status-badge img{width:15px;height:15px}
.expedition-world .party-hud .ultimate-trigger{margin-top:0}

.combat-callout.boss-callout{box-sizing:border-box;width:min(640px,calc(100% - 24px));padding:14px 18px;background:#102421f2;border:1px solid #bf975d;color:#ffe2a8;line-height:1.45;font-size:17px;z-index:6;box-shadow:0 6px 20px #0008}
@media(max-width:700px){.combat-callout.boss-callout{top:170px;font-size:15px;padding:12px}}

.sweep-panel{padding:16px;border:1px solid #7d895166;background:#102522;margin:14px 0}.sweep-panel h4{margin:0 0 8px;color:#efd6a5}.sweep-panel p{font-size:13px;line-height:1.5}.sweep-panel .btn{width:100%}

.expedition-top .combat-callout.boss-callout{position:static;grid-column:1/-1;transform:none;max-width:none;width:100%;margin-top:6px;font-size:15px}
