/* There must be exactly one visible in-game header.
   Use higher specificity than the historic global header owner so the old
   .app header cannot leave a painted strip behind the authoritative HUD. */
/* V8.337: Beta's real HUD is the body-level #v372TopbarShell. The older
   .app > header must not reserve 15px of flow after the fixed V372 HUD.
   Retire it inside this original V372 visibility owner, not a late CSS patch. */
html body.v8011-beta-unified-headers.v371-game-ui .app > header,
html body .app > header,
body.v371-game-ui .app > header,
#v371TopbarShell,
.v366-topbar,
.v358-global-header,
.v358-subbar,
.v351-topbar{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

html body #v372TopbarShell{
  display:block!important;
  position:sticky!important;
  top:0!important;
  left:0!important;
  z-index:60000!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  background:linear-gradient(180deg,#5a3217 0%,#3f220f 100%)!important;
  border-bottom:1px solid rgba(206,148,67,.62)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.52)!important;
}

html body #v372TopbarShell > .v372-topbar{
  display:grid!important;
  grid-template-columns:46px 108px minmax(82px,1fr) minmax(74px,.9fr) minmax(96px,1.08fr) 42px 42px 42px!important;
  gap:4px!important;
  align-items:center!important;
  box-sizing:border-box!important;
  width:100%!important;
  min-height:60px!important;
  padding:6px 6px!important;
  background:
    repeating-linear-gradient(6deg,rgba(255,255,255,.015) 0 3px,rgba(0,0,0,.018) 3px 7px),
    linear-gradient(180deg,#5a3217 0%,#3b1f0e 100%)!important;
}
.v372-menu{
  width:44px!important;height:46px!important;padding:0!important;
  display:grid!important;place-items:center!important;
  border:1px solid #8b642f!important;border-radius:9px!important;
  background:linear-gradient(180deg,#4a2c15,#24150a)!important;
  color:#f7e6b0!important;font-size:27px!important;font-weight:900!important;
}
.v372-logo{min-width:0!important;line-height:.8!important}
.v372-logo strong{
  display:block!important;font-family:Georgia,serif!important;font-size:18px!important;line-height:.85!important;
  color:#90e249!important;white-space:nowrap!important;text-shadow:0 2px #2b4b17!important
}
.v372-logo span{
  display:block!important;margin:1px 0 0 7px!important;font-family:Georgia,serif!important;
  font-size:9px!important;color:#d5a64d!important;font-weight:900!important
}
.v372-logo em{
  display:block!important;margin:3px 0 0 7px!important;color:#68d7da!important;
  font:900 5.5px/1 system-ui,sans-serif!important;font-style:normal!important
}
.v372-res{
  min-width:0!important;height:42px!important;padding:3px!important;
  display:grid!important;grid-template-columns:16px minmax(0,1fr) 18px!important;gap:2px!important;align-items:center!important;
  box-sizing:border-box!important;border:1px solid #76542b!important;border-radius:8px!important;
  background:linear-gradient(180deg,#35200f,#1b1008)!important
}
.v372-res .ico{font-size:14px!important;text-align:center!important}
.v372-res small{display:block!important;margin-bottom:3px!important;color:#989d93!important;font-size:4.8px!important;line-height:1!important;text-transform:uppercase!important}
.v372-res b{display:block!important;font-size:9px!important;line-height:1!important;color:#fff!important;white-space:nowrap!important;overflow:visible!important}
.v372-plus{
  width:18px!important;height:25px!important;min-width:18px!important;padding:0!important;
  border:1px solid #8c6732!important;border-radius:5px!important;background:#2c1a0e!important;
  color:#a9ee58!important;font-size:16px!important;line-height:1!important
}
.v372-iconbtn{
  width:42px!important;height:42px!important;min-width:42px!important;padding:0!important;
  border:1px solid #76542b!important;border-radius:8px!important;background:linear-gradient(180deg,#35200f,#1b1008)!important;
  color:#e8d7a5!important;font-size:16px!important
}

/* Dropdown physically starts at the viewport's left edge. */
#v032MenuPanel{
  position:fixed!important;top:60px!important;left:2px!important;right:auto!important;
  width:min(280px,calc(100vw - 4px))!important;max-width:calc(100vw - 4px)!important;
  margin:0!important;transform:none!important;z-index:100000!important;pointer-events:auto!important
}
#v032MenuPanel:not(.open):not(.show){
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;
}
#v032MenuPanel *,#v032MenuPanel button,#v032MenuPanel a{pointer-events:auto!important}

@media(max-width:430px){
  html body #v372TopbarShell > .v372-topbar{
    grid-template-columns:38px 66px minmax(0,52px) minmax(0,48px) minmax(0,57px) 36px 36px 36px!important;
    gap:1px!important;
    padding:4px 2px!important;
    min-height:54px!important;
    overflow:hidden!important;
  }
  #v372TopbarShell .v372-menu{width:36px!important;height:40px!important;font-size:22px!important}
  #v372TopbarShell .v372-logo{overflow:hidden!important}
  #v372TopbarShell .v372-logo strong{font-size:13px!important}
  #v372TopbarShell .v372-logo span{font-size:6.5px!important;margin-left:3px!important}
  #v372TopbarShell .v372-logo em{font-size:4.5px!important;margin-left:3px!important}
  #v372TopbarShell .v372-res{
    height:36px!important;
    grid-template-columns:11px minmax(0,1fr) 12px!important;
    gap:0!important;
    padding:1px!important;
  }
  #v372TopbarShell .v372-res .ico{font-size:9px!important}
  #v372TopbarShell .v372-res small{font-size:3.3px!important;margin-bottom:2px!important}
  #v372TopbarShell .v372-res b{font-size:6.5px!important;letter-spacing:-.15px!important}
  #v372TopbarShell .v372-plus{width:12px!important;min-width:12px!important;height:20px!important;font-size:11px!important}
  #v372TopbarShell .v372-iconbtn{width:36px!important;height:36px!important;min-width:36px!important;font-size:14px!important}
  #v032MenuPanel{top:54px!important}
}
@media(max-width:350px){
  html body #v372TopbarShell > .v372-topbar{
    grid-template-columns:34px 52px minmax(0,43px) minmax(0,40px) minmax(0,48px) 32px 32px 32px!important;
    gap:1px!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }
  #v372TopbarShell .v372-menu{width:34px!important;height:38px!important;font-size:20px!important}
  #v372TopbarShell .v372-logo strong{font-size:12px!important}
  #v372TopbarShell .v372-logo span{font-size:6px!important}
  #v372TopbarShell .v372-res b{font-size:6px!important}
  #v372TopbarShell .v372-iconbtn{width:32px!important;min-width:32px!important;height:32px!important;font-size:13px!important}
}