/* FormyDog v53 · final mobile visual correction
   Keeps v52 booster logic untouched. Fixes native viewport fill and right-aligns level chip. */

@media (max-width:520px){
  html{
    width:100%!important;
    min-height:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    background:#062b57!important;
    overflow-x:hidden!important;
    --fd-ad-space:0px!important;
    --ad-height:0px!important;
    --bottom-ad-height:0px!important;
  }

  html body{
    width:100%!important;
    min-height:100dvh!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    padding-bottom:0!important;
    background:#062b57!important;
    overflow-x:hidden!important;
    --fd-ad-space:0px!important;
    --ad-height:0px!important;
    --bottom-ad-height:0px!important;
  }

  html body .app{
    width:100%!important;
    min-height:100dvh!important;
    height:auto!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:5px 5px max(5px,env(safe-area-inset-bottom))!important;
    padding-bottom:max(5px,env(safe-area-inset-bottom))!important;
    background:
      radial-gradient(circle at 50% 20%,rgba(74,187,235,.22),transparent 35%),
      linear-gradient(180deg,#0a5795 0%,#073c72 49%,#062b57 100%)!important;
  }

  /* The native shell owns advertising. FormyDog never reserves a banner slot. */
  html[data-formydog-native-shell="1"],
  html[data-formydog-native-shell="1"] body,
  html[data-formydog-native-shell="1"] body .app{
    --fd-ad-space:0px!important;
    --ad-height:0px!important;
    --bottom-ad-height:0px!important;
    margin-bottom:0!important;
  }

  html[data-formydog-native-shell="1"] #fdAdDock,
  html[data-formydog-native-shell="1"] .fd-bottom-ad,
  html[data-formydog-native-shell="1"] .fd-ad-slot,
  html[data-formydog-native-shell="1"] .fd-ad-spacer,
  html[data-formydog-native-shell="1"] .ad-spacer,
  html[data-formydog-native-shell="1"] .bottom-ad-spacer,
  html[data-formydog-native-shell="1"] [data-formydog-ad],
  html[data-formydog-native-shell="1"] [data-web-ad],
  html[data-formydog-native-shell="1"] [data-rtk-web-ad]{
    display:none!important;
    visibility:hidden!important;
    position:absolute!important;
    width:0!important;
    height:0!important;
    min-width:0!important;
    min-height:0!important;
    max-width:0!important;
    max-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  /* Header keeps v52 balance, but level is physically pinned to the right edge. */
  html body .app>.topbar{
    position:relative!important;
    grid-template-columns:minmax(0,1fr) max-content!important;
    padding-right:7px!important;
  }

  html body .app>.topbar #fdLevelChip,
  html body .app>.topbar .fd-level-chip{
    position:absolute!important;
    top:5px!important;
    right:7px!important;
    left:auto!important;
    width:62px!important;
    min-width:62px!important;
    max-width:62px!important;
    height:31px!important;
    min-height:31px!important;
    max-height:31px!important;
    margin:0!important;
    z-index:5!important;
  }

  html body .app>.topbar .brand{
    padding-right:70px!important;
  }

  /* Coins and lives remain perfectly matched and aligned. */
  html body .app>.topbar .resources{
    align-self:center!important;
    justify-self:start!important;
    height:36px!important;
  }
  html body .app>.topbar .resources>.resource:nth-child(2),
  html body .app>.topbar .resources>.resource:nth-child(3){
    width:72px!important;
    min-width:72px!important;
    max-width:72px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    padding:3px 7px!important;
    box-sizing:border-box!important;
  }

  html body .app>.topbar .fd-header-tools{
    align-self:center!important;
    justify-self:end!important;
  }

  /* No artificial lower gap after the booster dock. */
  html body .app>.game-layout{
    margin-bottom:0!important;
    padding-bottom:0!important;
  }
  html body .app>.game-layout>.boosters{
    margin-bottom:0!important;
  }
}

@media (max-width:390px){
  html body .app>.topbar .resources{
    grid-template-columns:68px 68px!important;
    gap:4px!important;
  }
  html body .app>.topbar .resources>.resource:nth-child(2),
  html body .app>.topbar .resources>.resource:nth-child(3){
    width:68px!important;
    min-width:68px!important;
    max-width:68px!important;
  }
  html body .app>.topbar .fd-header-tools{
    grid-template-columns:repeat(4,36px)!important;
    gap:4px!important;
  }
  html body .app>.topbar .fd-header-tools button{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
  }
}

@media (max-width:340px){
  html body .app>.topbar .resources{
    grid-template-columns:64px 64px!important;
  }
  html body .app>.topbar .resources>.resource:nth-child(2),
  html body .app>.topbar .resources>.resource:nth-child(3){
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    padding-inline:5px!important;
  }
  html body .app>.topbar .fd-header-tools{
    grid-template-columns:repeat(4,34px)!important;
    gap:3px!important;
  }
  html body .app>.topbar .fd-header-tools button{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
  }
}
