/* Release 72.5 — Non-destructive cinematic HUD and scene integration.
   Images are decorative; the inventory and gameplay remain live DOM controls. */
:root{--mh75-gold:#ffc15c;--mh75-shadow:0 12px 26px #020912aa}
/* Keep the player's identity and task controls visible while making room for the game. */
#player-hud26{min-height:57px!important;padding:5px 14px!important;gap:9px!important}
#player-hud26 .mh57-single-portrait.hud-face26{width:43px!important;height:43px!important;min-width:43px!important;max-width:43px!important}
#player-hud26 .hud-person26{min-height:45px!important}
#player-hud26 .hud-money26{gap:0!important}
#player-sticky26 #global-task24{min-height:43px!important;padding:5px 13px!important;gap:10px!important}
#global-task24 .now-label24 span{font-size:12px!important}
#global-task24 button{min-height:30px!important}
/* Consolidate weather, search, level and currency into two compact rows. */
.main>.topbar{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(250px,.74fr)!important;gap:7px 12px!important;padding:8px 17px!important;align-items:center!important}
.main>.topbar .breadcrumb{min-width:0!important;grid-column:1!important;grid-row:1!important}
.main>.topbar .command-row{display:flex;align-items:center;gap:8px!important;min-height:42px!important}
.main>.topbar .global-search{min-width:0!important;flex:1 1 auto!important}
.main>.topbar .global-search input{height:40px!important;min-height:40px!important}
.main>.topbar .weather-clock{grid-column:2!important;grid-row:1!important;width:auto!important;min-width:0!important;min-height:43px!important;align-items:center!important;gap:5px 12px!important;padding:6px 10px!important;line-height:1.1!important;font-size:12px!important}
.main>.topbar .wallets{grid-column:1 / -1!important;grid-row:2!important;display:grid!important;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)!important;gap:8px!important;min-width:0!important}
.main>.topbar .wallets>*{min-height:51px!important;height:auto!important;min-width:0!important;padding:6px 11px!important}
.main>.topbar .empire-emblem{gap:7px!important}
.main>.topbar .empire-emblem>.hud-icon{width:39px!important;height:39px!important}
.main>.topbar .empire-emblem .progress{height:7px!important;margin-top:3px!important}
.main>.topbar .empire-progress-tab{display:flex!important;gap:9px!important;align-items:center!important;justify-content:center!important}
.main>.topbar .empire-progress-tab small{display:none!important}
.main>.topbar .wallet{display:flex!important;gap:6px!important;align-items:center!important}
.main>.topbar .wallet small{font-size:10px!important}
.main>.topbar .wallet .money{font-size:18px!important}
/* True scene art, no UI baked into the image. The labels here are live text. */
.mh75-hero{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:center;
 min-height:120px;margin:0 0 15px;padding:16px clamp(15px,3vw,28px);overflow:hidden;
 border:1px solid #4e6a77;border-left:4px solid var(--mh73-accent,var(--mh75-gold));border-radius:14px;
 box-shadow:var(--mh75-shadow);background:#102938}
.mh75-hero:before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--mh73-scene);background-size:cover;background-position:center 48%;opacity:.97}
.mh75-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#04101df2 0%,#061726dc 33%,#06172644 68%,#06131f40 100%)}
.mh75-hero .mh75-overline{font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;color:#ffca71!important;font-weight:800;text-shadow:0 1px 5px #000}
.mh75-hero h1{font-family:Impact,'Arial Narrow',system-ui,sans-serif!important;font-size:clamp(29px,3vw,43px)!important;letter-spacing:.045em!important;text-transform:uppercase;max-width:780px;line-height:1.05;margin:5px 0!important;color:#fff2df!important;text-shadow:0 3px 12px #000e}
.mh75-hero p{font-size:clamp(12px,1.1vw,14px);max-width:68ch;color:#e2e9ed!important;text-shadow:0 2px 5px #000e}
/* Usability: no item thumbnails stretched and no mysterious hover jumps. */
.content .mh722-gear-tile>img,.content .mh64-equipment-art img,.content .mh51-gallery-card img,.content .mh46-store-item img{object-fit:contain!important;object-position:center!important;transition:none!important}
.content .mh722-crew-portrait img,.content .mh59-species img{object-fit:cover!important;object-position:center 35%!important}
.content :is(button,select,input,a):focus-visible{outline:2px solid #ffcc76!important;outline-offset:3px!important}
@media(max-width:1100px){
 .main>.topbar{grid-template-columns:minmax(0,1fr)!important}
 .main>.topbar .breadcrumb,.main>.topbar .weather-clock,.main>.topbar .wallets{grid-column:1!important;grid-row:auto!important}
 .main>.topbar .weather-clock{min-height:30px!important}
 .main>.topbar .wallets{grid-template-columns:repeat(4,minmax(0,1fr))!important}
 .main>.topbar .wallets>*{padding:5px 7px!important;min-height:48px!important}
 .main>.topbar .empire-emblem>.hud-icon{display:none!important}
}
@media(max-width:760px){
 .main>.topbar{padding:8px 10px!important;gap:5px!important}
 .main>.topbar .command-row{flex-wrap:wrap}
 .main>.topbar .wallets{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
 .main>.topbar .wallets>*{min-width:0!important;min-height:40px!important;font-size:12px!important}
 .main>.topbar .wallet .money{font-size:16px!important}
 .main>.topbar .empire-progress-tab{justify-content:start!important}
 .mh75-hero{min-height:102px;padding:13px 14px;margin-bottom:12px}
 .mh75-hero h1{font-size:29px!important}
 .mh75-hero:after{background:linear-gradient(90deg,#04101df5 0%,#061626d8 68%,#06131f70)}
}
@media(prefers-reduced-motion:reduce){.mh75-hero{scroll-behavior:auto!important}}

/* Crops and progress markers remain real SVG content over a non-stretched painting. */
.content .mh722-garden svg{max-width:860px!important;max-height:none!important;filter:drop-shadow(0 8px 18px #0007)}
.content .mh722-garden{border-color:#526d66!important}
/* Phone polish: surface the activity, not four lines of duplicated dashboard chrome. */
@media(max-width:600px){
 #player-hud26{gap:5px!important;padding:5px 10px!important}
 #player-hud26 .hud-person26{min-height:42px!important;gap:6px!important}
 #player-hud26 .hud-person26 strong{font-size:13px!important}
 #player-hud26 .hud-money26{font-size:12px!important}
 #player-hud26 .mh-fidelity-hud-meters{display:flex!important;flex-basis:100%!important;min-width:0!important;max-width:100%!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;flex-wrap:nowrap!important;margin:0!important;gap:5px!important;scroll-snap-type:x proximity;scrollbar-width:thin}
 #player-hud26 .mh-fidelity-hud-meter{min-width:111px!important;max-width:135px!important;flex:0 0 111px!important;padding:6px 7px!important;scroll-snap-align:start}
 .main>.topbar .command-row{min-height:38px!important;flex-wrap:nowrap!important;gap:6px!important}
 .main>.topbar .command-row .map-shortcut,.main>.topbar .command-row [data-action="page:settings"]{display:none!important}
 .main>.topbar .command-row .global-search{flex:1 1 auto!important;min-width:0!important}
 .main>.topbar .command-row .global-search input{height:36px!important;min-height:36px!important;width:100%!important}
 .main>.topbar .weather-clock{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;min-height:29px!important;padding:5px 8px!important;gap:8px!important;font-size:10px!important;line-height:1.2!important}
 .main>.topbar .weather-clock>span{white-space:nowrap!important}
 .main>.topbar .weather-clock small{display:none!important}
 .main>.topbar .wallets{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
 .main>.topbar .wallets>.wallet{display:none!important} /* Same cash and status remain visible in the sticky character HUD. */
 .main>.topbar .wallets>.empire-emblem,.main>.topbar .wallets>.empire-progress-tab{min-height:39px!important;height:39px!important;padding:3px 8px!important}
 .main>.topbar .empire-emblem .progress{height:6px!important}
 .main>.topbar .empire-emblem strong{font-size:10px!important}
 .main>.topbar .empire-progress-tab strong{font-size:11px!important}
 .main>.topbar{padding:6px 9px!important;gap:4px!important}
}