/* Mipez.app V5.1.7.3.2.2.4.3.3
 * Mobile Event UI Compression & Toast Consolidation
 * Incremental over V5.1.7.3.2.2.4.3.2.
 * No gameplay physics, camera math, Bubble Arsenal or World Director logic changed.
 */

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

/* ------------------------------------------------------------
   SHORT LANDSCAPE EVENT HUD
   The native 440px event card consumes too much of a 740x360
   phone viewport. Keep the event identity, timer and progress,
   but retire the secondary sentence while the player is moving.
   ------------------------------------------------------------ */
@media (orientation:landscape) and (max-height:560px){
  body[data-mipez-game-phase="playing"] #mipez-world-event-card{
    left:calc(10px + var(--mipez-event-safe-left))!important;
    top:44px!important;
    width:min(300px,calc(100vw - 205px))!important;
    max-width:min(300px,calc(100vw - 205px))!important;
    min-width:0!important;
    grid-template-columns:30px minmax(0,1fr) auto!important;
    gap:7px!important;
    padding:6px 8px!important;
    border-radius:12px!important;
    box-shadow:0 8px 22px rgba(0,20,52,.22)!important;
    backdrop-filter:blur(7px)!important;
    -webkit-backdrop-filter:blur(7px)!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-icon{
    width:28px!important;
    height:28px!important;
    border-radius:9px!important;
    font-size:16px!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-title{
    font-size:10.5px!important;
    line-height:1.08!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-subtitle{
    display:none!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-progress{
    height:2px!important;
    margin-top:5px!important;
  }

  body[data-mipez-game-phase="playing"] #mipez-world-event-card .mwd-time{
    min-width:28px!important;
    padding:3px 5px!important;
    border-radius:8px!important;
    font-size:9.5px!important;
  }

  /* The World Director toast only says generic things such as
     "Evento dinámico". The game's native toast already carries
     the useful message, so showing both is redundant on phones. */
  body[data-mipez-game-phase="playing"] #mipez-world-toast{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
  }
}

/* ------------------------------------------------------------
   NATIVE GAME TOASTS (Sonner)
   Convert the large white cards into a compact ocean notification
   and reserve the lower-right corner for Bubble/Turbo controls.
   ------------------------------------------------------------ */
@media (max-width:960px), (max-height:560px), (pointer:coarse){
  body.mipez-game-active [data-sonner-toaster]{
    --width:min(260px,calc(100vw - 190px))!important;
    --offset-right:calc(88px + var(--mipez-event-safe-right))!important;
    --offset-left:calc(88px + var(--mipez-event-safe-left))!important;
    --offset-bottom:calc(10px + var(--mipez-event-safe-bottom))!important;
    --gap:6px!important;
    max-width:min(260px,calc(100vw - 190px))!important;
    z-index:2147483642!important;
  }

  body.mipez-game-active [data-sonner-toast][data-styled="true"]{
    min-height:0!important;
    padding:7px 9px!important;
    gap:5px!important;
    border-radius:11px!important;
    border:1px solid rgba(137,225,255,.32)!important;
    background:rgba(2,31,69,.88)!important;
    color:#f5fdff!important;
    box-shadow:0 8px 22px rgba(0,16,48,.24)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    font-size:10px!important;
    line-height:1.22!important;
  }

  body.mipez-game-active [data-sonner-toast] [data-title]{
    font-size:10px!important;
    line-height:1.22!important;
    font-weight:700!important;
  }

  body.mipez-game-active [data-sonner-toast] [data-description]{
    font-size:9px!important;
    line-height:1.2!important;
    opacity:.88!important;
  }

  body.mipez-game-active [data-sonner-toast] [data-icon]{
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
  }
}

/* In short landscape there is enough horizontal room to keep the toast
   to the right of the player without touching the Bubble control. */
@media (orientation:landscape) and (max-height:560px){
  body.mipez-game-active [data-sonner-toaster][data-x-position="right"]{
    right:calc(86px + var(--mipez-event-safe-right))!important;
    left:auto!important;
  }
  body.mipez-game-active [data-sonner-toaster][data-y-position="bottom"]{
    bottom:calc(9px + var(--mipez-event-safe-bottom))!important;
    top:auto!important;
  }
}

/* Portrait keeps notifications centered above the lower control deck. */
@media (orientation:portrait) and (max-width:620px){
  body.mipez-game-active [data-sonner-toaster]{
    --width:min(270px,calc(100vw - 28px))!important;
    max-width:min(270px,calc(100vw - 28px))!important;
  }
  body.mipez-game-active [data-sonner-toaster][data-x-position="right"],
  body.mipez-game-active [data-sonner-toaster][data-x-position="left"],
  body.mipez-game-active [data-sonner-toaster][data-x-position="center"]{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
  }
  body.mipez-game-active [data-sonner-toaster][data-y-position="bottom"]{
    bottom:calc(92px + var(--mipez-event-safe-bottom))!important;
  }
}

/* Lifecycle cleanup: no transient gameplay notifications or sound badge
   should survive on top of the result card. */
body[data-mipez-game-phase="gameover"] [data-sonner-toaster],
body[data-mipez-game-phase="gameover"] #mipez-native-sound{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
