/* Mipez.app V5.1.7.3.2.2.4.3.2
 * Mobile Control Deck, Directional Camera & HUD Collision Guard
 * Incremental over V5.1.7.3.2.2.4.3.1. No gameplay physics are changed.
 */

:root{
  --mipez-safe-bottom:env(safe-area-inset-bottom,0px);
  --mipez-safe-left:env(safe-area-inset-left,0px);
  --mipez-safe-right:env(safe-area-inset-right,0px);
}

body.mipez-game-active #mipez-native-joystick,
body.mipez-game-active #mipez-native-turbo,
body.mipez-game-active #mipez-native-sound,
body.mipez-game-active #mipez-v512-fire{
  transition:opacity .16s ease,transform .16s ease,filter .16s ease!important;
}

/* Lifecycle authority: no gameplay controls/events over menu or game-over. */
body[data-mipez-game-phase]:not([data-mipez-game-phase="playing"]) #mipez-native-joystick,
body[data-mipez-game-phase]:not([data-mipez-game-phase="playing"]) #mipez-native-turbo,
body[data-mipez-game-phase]:not([data-mipez-game-phase="playing"]) #mipez-v512-fire,
body[data-mipez-game-phase]:not([data-mipez-game-phase="playing"]) #mipez-world-event-card,
body[data-mipez-game-phase]:not([data-mipez-game-phase="playing"]) #mipez-world-toast{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Mobile/touch control deck. */
@media (pointer:coarse), (max-width:700px){
  body.mipez-game-active #mipez-native-joystick{
    left:calc(14px + var(--mipez-safe-left))!important;
    bottom:calc(18px + var(--mipez-safe-bottom))!important;
    width:108px!important;
    height:108px!important;
  }
  body.mipez-game-active #mipez-native-joystick>div{
    width:50px!important;
    height:50px!important;
  }

  body.mipez-game-active #mipez-native-turbo{
    right:calc(16px + var(--mipez-safe-right))!important;
    bottom:calc(112px + var(--mipez-safe-bottom))!important;
    width:68px!important;
    height:68px!important;
    font-size:11px!important;
    line-height:1.05!important;
  }

  body.mipez-game-active #mipez-v512-fire{
    right:calc(16px + var(--mipez-safe-right))!important;
    bottom:calc(18px + var(--mipez-safe-bottom))!important;
    width:66px!important;
    height:66px!important;
    font-size:10px!important;
    box-shadow:0 0 0 5px rgba(34,211,238,.09),0 10px 28px rgba(2,74,138,.38)!important;
  }
  body.mipez-game-active #mipez-v512-fire .v512-icon{font-size:22px!important}

  body.mipez-game-active #mipez-native-sound{
    left:calc(18px + var(--mipez-safe-left))!important;
    bottom:calc(136px + var(--mipez-safe-bottom))!important;
    right:auto!important;
    padding:6px 9px!important;
    min-height:31px!important;
    border-radius:999px!important;
    font-size:10px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
}

/* Portrait HUD stack: native stats -> Bubble HUD -> dynamic event. */
@media (orientation:portrait) and (max-width:620px){
  body.mipez-game-active #mipez-v512-hud{
    top:44px!important;
    right:8px!important;
    transform:scale(.9)!important;
    transform-origin:top right!important;
  }
  body.mipez-game-active #mipez-v512-hud .v512-mini{
    padding:5px 7px!important;
    gap:6px!important;
  }
  body.mipez-game-active #mipez-v512-hud .v512-b{
    width:14px!important;
    height:14px!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card{
    top:92px!important;
    left:8px!important;
    width:calc(100vw - 16px)!important;
    max-width:none!important;
    padding:7px 8px!important;
    grid-template-columns:32px minmax(0,1fr) auto!important;
    gap:7px!important;
    border-radius:12px!important;
  }
  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-icon{
    width:30px!important;height:30px!important;border-radius:9px!important;font-size:17px!important;
  }
  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-title{font-size:11px!important}
  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-subtitle{font-size:9px!important;margin-top:2px!important}
  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-progress{margin-top:5px!important}
  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-time{font-size:10px!important;min-width:29px!important;padding:3px 5px!important}
}

/* Short landscape: smaller corner controls preserve lateral field of view. */
@media (orientation:landscape) and (max-height:560px){
  body.mipez-game-active #mipez-native-joystick{
    left:calc(12px + var(--mipez-safe-left))!important;
    bottom:calc(10px + var(--mipez-safe-bottom))!important;
    width:90px!important;
    height:90px!important;
  }
  body.mipez-game-active #mipez-native-joystick>div{width:42px!important;height:42px!important}

  body.mipez-game-active #mipez-native-sound{
    left:calc(14px + var(--mipez-safe-left))!important;
    bottom:calc(108px + var(--mipez-safe-bottom))!important;
    padding:5px 8px!important;
    font-size:9px!important;
  }

  body.mipez-game-active #mipez-native-turbo{
    right:calc(14px + var(--mipez-safe-right))!important;
    bottom:calc(84px + var(--mipez-safe-bottom))!important;
    width:60px!important;
    height:60px!important;
    font-size:10px!important;
  }

  body.mipez-game-active #mipez-v512-fire{
    right:calc(14px + var(--mipez-safe-right))!important;
    bottom:calc(12px + var(--mipez-safe-bottom))!important;
    width:60px!important;
    height:60px!important;
  }
  body.mipez-game-active #mipez-v512-fire .v512-icon{font-size:20px!important}

  body.mipez-game-active #mipez-v512-hud{
    top:48px!important;
    right:10px!important;
    transform:scale(.9)!important;
    transform-origin:top right!important;
  }
}

/* Extra-tight phones, e.g. 360x740. */
@media (orientation:portrait) and (max-width:380px){
  body.mipez-game-active #mipez-native-joystick{width:98px!important;height:98px!important;left:10px!important;bottom:14px!important}
  body.mipez-game-active #mipez-native-joystick>div{width:46px!important;height:46px!important}
  body.mipez-game-active #mipez-native-sound{left:12px!important;bottom:122px!important;font-size:9px!important}
  body.mipez-game-active #mipez-native-turbo{right:12px!important;bottom:102px!important;width:62px!important;height:62px!important}
  body.mipez-game-active #mipez-v512-fire{right:12px!important;bottom:14px!important;width:62px!important;height:62px!important}
}