/* ========================================================================
   BOMBARERA V66 — SHARED SITE SHELL
   One global header/footer language for menu + all meta sections.
   Gameplay keeps its dedicated HUD shell.
   ======================================================================== */
:root{
  --shell65-bg:#08111e;
  --shell65-panel:#0d1928;
  --shell65-panel-2:#111f31;
  --shell65-line:rgba(125,190,238,.18);
  --shell65-text:#f5f9ff;
  --shell65-muted:#9eb0c6;
  --shell65-cyan:#63ddff;
  --shell65-gold:#ffd166;
  --shell65-footer-h:36px;
  --shell65-header-h:76px;
}

/* Global header is the same product header on every non-game screen. */
body:not(:has(#screenGame:not(.hidden))) > .header{
  display:flex!important;
  position:relative!important;
  inset:auto!important;
  flex:0 0 var(--shell65-header-h)!important;
  width:100%!important;
  height:var(--shell65-header-h)!important;
  min-height:var(--shell65-header-h)!important;
  margin:0!important;
  padding:12px 24px!important;
  border:0!important;
  border-bottom:1px solid var(--shell65-line)!important;
  border-radius:0!important;
  background:rgba(7,16,29,.96)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(18px) saturate(120%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(120%)!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__mark{
  width:38px!important;height:38px!important;border-radius:11px!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__word{
  font:900 22px/1 var(--font-body)!important;letter-spacing:-.02em!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .header__right{gap:8px!important}
body:not(:has(#screenGame:not(.hidden))) > .header :is(.coins,.stars,.header-language,.icon-btn){
  min-height:44px!important;height:44px!important;border-radius:10px!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .icon-btn{width:44px!important;min-width:44px!important}
body:not(:has(#screenGame:not(.hidden))) > .header .coins{min-width:100px!important;justify-content:center!important}
body:not(:has(#screenGame:not(.hidden))) > .header .header-context{
  display:flex!important;align-items:center!important;gap:9px!important;margin-left:14px!important;padding-left:14px!important;
  border-left:1px solid rgba(255,255,255,.10)!important;
}
body[data-ui-context="menu"] > .header .header-context{display:none!important}
body:not(:has(#screenGame:not(.hidden))) > .header .header-context__dot{
  width:7px!important;height:7px!important;border-radius:50%!important;background:var(--context-accent,#63ddff)!important;
  box-shadow:0 0 12px var(--context-accent,#63ddff)!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .header-context small{
  display:block;color:#8095ad!important;font:800 9px/1.1 var(--font-body)!important;letter-spacing:.09em!important;
}
body:not(:has(#screenGame:not(.hidden))) > .header .header-context strong{
  display:block;margin-top:3px;color:#f6f9ff!important;font:800 13px/1.1 var(--font-body)!important;
}

/* App occupies the space between the shared header and footer. */
body:not(:has(#screenGame:not(.hidden))) > .app{
  flex:1 1 auto!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;
  margin:0!important;padding:0!important;overflow:hidden!important;
}
body:not(:has(#screenGame:not(.hidden))) > .app > .screen:not(.hidden){
  width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;
}

/* Shared route subbar: same geometry for Story / Survival / Achievements. */
body[data-ui-context]:not([data-ui-context="menu"]) :is(#screenCampaign,#screenSurvival,#screenAchievements) > .campaign-header{
  position:relative!important;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;
  min-height:54px!important;height:54px!important;margin:0!important;padding:7px 24px!important;gap:16px!important;
  border:0!important;border-bottom:1px solid rgba(126,185,230,.13)!important;border-radius:0!important;
  background:#0d1827!important;box-shadow:none!important;
}
body[data-ui-context]:not([data-ui-context="menu"]) :is(#screenCampaign,#screenSurvival,#screenAchievements) > .campaign-header::after{display:none!important}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header > .btn{
  min-width:92px!important;height:38px!important;min-height:38px!important;padding:0 13px!important;border-radius:9px!important;
  border:1px solid rgba(139,193,234,.22)!important;background:#142235!important;color:#f4f8ff!important;
  font:750 13px/1 var(--font-body)!important;
}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__identity{
  justify-content:flex-start!important;min-width:0!important;gap:10px!important;
}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header .brand-lockup--section,
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__divider{display:none!important}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__title{
  margin:0!important;color:#f7faff!important;font:850 17px/1.2 var(--font-body)!important;letter-spacing:0!important;
}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__title [data-ui-icon]{font-size:18px!important}
body[data-ui-context]:not([data-ui-context="menu"]) .mode-header__meta{
  color:#8095ad!important;font:700 10px/1.2 var(--font-body)!important;letter-spacing:.06em!important;
}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__spacer{display:block!important;width:92px!important}

/* Skins keeps its route controls, but no longer duplicates the global brand/currency header. */
body[data-ui-context="skins"] .skins-ref-v12__topbar{
  min-height:54px!important;height:54px!important;margin:0!important;padding:7px 24px!important;border-radius:0!important;
  border:0!important;border-bottom:1px solid rgba(126,185,230,.13)!important;background:#0d1827!important;box-shadow:none!important;
}
body[data-ui-context="skins"] .skins-ref-v12__brand .brand-lockup--skins,
body[data-ui-context="skins"] .skins-ref-v12__brand-divider,
body[data-ui-context="skins"] .skins-ref-v12__top-stat--coins{display:none!important}
body[data-ui-context="skins"] .skins-ref-v12__back{min-height:38px!important;height:38px!important;border-radius:9px!important}
body[data-ui-context="skins"] .skins-ref-v12__section-copy b{font:850 17px/1.1 var(--font-body)!important;letter-spacing:0!important}
body[data-ui-context="skins"] .skins-ref-v12__section-copy small{font:700 10px/1.1 var(--font-body)!important;letter-spacing:.04em!important}
body[data-ui-context="skins"] .skins-ref-v12__top-stat--opened{min-height:38px!important;height:38px!important;border-radius:9px!important}

/* One footer on every non-game page. */
.site-footer-v65{
  position:relative;z-index:80;flex:0 0 var(--shell65-footer-h);height:var(--shell65-footer-h);min-height:var(--shell65-footer-h);
  display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:0 24px;
  border-top:1px solid rgba(124,178,220,.13);background:#08111e;color:#7f92aa;font:600 11px/1 var(--font-body);
}
.site-footer-v65 strong{color:#aab9ca;font-weight:800}.site-footer-v65__motto{color:#91a3b8}
body:has(#screenGame:not(.hidden)) > .site-footer-v65,
body.phone-blocked > .site-footer-v65{display:none!important}
.home-footer-v45{display:none!important}

/* Keep long pages on a single intentional scroll surface. */
body[data-ui-context="story"] .campaign-content,
body[data-ui-context="survival"] .survival-content,
body[data-ui-context="achievements"] .achievements-content,
body[data-ui-context="skins"] .skins-ref-v12__layout{
  min-height:0!important;
}

@media (max-width:1050px){
  body:not(:has(#screenGame:not(.hidden))) > .header{padding-inline:16px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .header-context{display:none!important}
  body[data-ui-context]:not([data-ui-context="menu"]) :is(#screenCampaign,#screenSurvival,#screenAchievements) > .campaign-header,
  body[data-ui-context="skins"] .skins-ref-v12__topbar{padding-inline:16px!important}
}
@media (max-width:760px){
  :root{--shell65-header-h:64px;--shell65-footer-h:34px}
  body:not(:has(#screenGame:not(.hidden))) > .header{padding:9px 12px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__mark{width:34px!important;height:34px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__word{font-size:18px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header :is(.coins,.stars,.header-language,.icon-btn){height:40px!important;min-height:40px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .icon-btn{width:40px!important;min-width:40px!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .stars{display:none!important}
  body[data-ui-context]:not([data-ui-context="menu"]) :is(#screenCampaign,#screenSurvival,#screenAchievements) > .campaign-header{padding:6px 12px!important;gap:10px!important}
  body[data-ui-context]:not([data-ui-context="menu"]) .mode-header__meta{display:none!important}
  body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__spacer{display:none!important}
  .site-footer-v65{padding-inline:12px;font-size:10px}.site-footer-v65__motto{display:none}
}
@media (max-width:560px){
  body:not(:has(#screenGame:not(.hidden))) > .header .header-language{display:none!important}
  body:not(:has(#screenGame:not(.hidden))) > .header .coins{min-width:76px!important}
}
body[data-ui-context]:not([data-ui-context="menu"]) .campaign-header__identity{display:flex!important;grid-template-columns:none!important}
body[data-ui-context="skins"] #screenSkins .skins-locker-v7.skins-ref-v12{grid-template-rows:54px minmax(0,1fr)!important;gap:10px!important}
body:not(:has(#screenGame:not(.hidden))) :is(.header button,.header a,.campaign-header button,.campaign-header a,.site-footer-v65 a):focus-visible{outline:3px solid rgba(99,221,255,.48)!important;outline-offset:2px!important}
/* Stars are not a global header currency in the current product shell. */
body:not(:has(#screenGame:not(.hidden))) > .header .stars{display:none!important}

/* ========================================================================
   V66 — GLOBAL HEADER PARITY
   Home is the product-shell reference. Meta routes intentionally use the
   same brand/header controls; route identity stays in the secondary subbar.
   ======================================================================== */
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header{
  position:relative!important;inset:auto!important;z-index:170!important;
  width:100%!important;height:auto!important;min-height:76px!important;flex:0 0 76px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  margin:0!important;padding:16px max(24px,calc((100vw - 1320px)/2))!important;
  border:0!important;border-bottom:1px solid var(--v45-border)!important;border-radius:0!important;
  background:rgba(10,16,24,.90)!important;box-shadow:none!important;
  backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;pointer-events:auto!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header__brand{
  display:flex!important;align-items:center!important;gap:14px!important;min-width:0!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header-context{display:none!important}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__word{
  font:900 22px/1 var(--font-body)!important;letter-spacing:0!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__mark{
  width:38px!important;height:38px!important;border-radius:11px!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header__right{
  position:static!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;
  width:auto!important;max-width:none!important;height:auto!important;margin:0!important;padding:0!important;gap:8px!important;
  border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header__right>*{
  position:relative!important;inset:auto!important;transform:none!important;margin:0!important;float:none!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .menu-utility{
  height:44px!important;min-height:44px!important;border-radius:8px!important;background:#202b39!important;
  border-color:var(--v45-border)!important;box-shadow:none!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .menu-utility--icon{
  width:44px!important;min-width:44px!important;padding:8px!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .menu-utility--coins{
  display:flex!important;min-width:100px!important;padding:0 12px!important;justify-content:center!important;align-items:center!important;gap:8px!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .menu-utility__icon{width:28px!important;height:28px!important}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header #btnMenuSettings{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header #btnMenuSettings .menu-utility__icon>.ui-icon{
  width:25px!important;height:25px!important;min-width:25px!important;min-height:25px!important;max-width:25px!important;max-height:25px!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header-currency-icon--coins{
  display:grid!important;place-items:center!important;width:22px!important;height:22px!important;flex:0 0 22px!important;margin:0!important;padding:0!important;line-height:1!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header-currency-icon--coins>.ui-icon{
  width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;max-width:22px!important;max-height:22px!important;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .coins__value{
  display:flex!important;align-items:center!important;justify-content:center!important;min-height:22px!important;margin:0!important;line-height:1!important;font-variant-numeric:tabular-nums;
}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .stars{display:none!important}
body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .site-footer-v65{
  position:relative!important;inset:auto!important;z-index:80!important;
}
@media (max-width:1180px){
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header{padding-left:18px!important;padding-right:18px!important}
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .header__right{gap:6px!important}
}
@media (max-width:840px){
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header{padding-left:12px!important;padding-right:12px!important}
}
@media (max-width:760px){
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header{min-height:64px!important;flex-basis:64px!important;padding-top:9px!important;padding-bottom:9px!important}
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__mark{width:34px!important;height:34px!important}
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .brand-lockup__word{font-size:18px!important}
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header :is(.coins,.header-language,.icon-btn){height:40px!important;min-height:40px!important}
  body.ui-v45[data-ui-context]:not([data-ui-context="menu"]):not(:has(#screenGame:not(.hidden))) > .header .icon-btn{width:40px!important;min-width:40px!important}
}