/* BLACKSAW2081 LAB v2.8.38
   1) Tło komunikatów mieści się wyłącznie wewnątrz ramy.
   2) Panel rzutu kością bez sztucznego obramowania/maski.
   3) Pasek czasu nie zasłania wyniku rzutu.
*/

/* ===== KOMUNIKATY FAZ ===== */
.phase-toast{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  min-width:430px !important;
  max-width:min(86vw,620px) !important;
}

/* Właściwe tło jest teraz wyłącznie wewnątrz ramki. */
.phase-toast > .blacksaw-frame-content{
  position:relative !important;
  z-index:3 !important;
  margin:22px 30px !important;
  padding:18px 34px 24px !important;
  border-radius:10px !important;
  overflow:hidden !important;
  background:
    linear-gradient(145deg,rgba(42,27,25,.98),rgba(9,10,13,.98) 42%,rgba(29,9,13,.98)) !important;
  border:1px solid rgba(238,20,71,.34) !important;
  box-shadow:
    inset 0 0 28px rgba(238,20,71,.10),
    0 12px 28px rgba(0,0,0,.48) !important;
}

/* Pasek pozostaje w środku ramki, nie poza nią. */
.phase-toast > .message-progress{
  position:absolute !important;
  left:84px !important;
  right:84px !important;
  bottom:24px !important;
  z-index:5 !important;
  margin:0 !important;
}

/* ===== PANEL RZUTU KOŚCIĄ ===== */
.combat-roll-panel{
  border:0 !important;
  outline:0 !important;
  clip-path:none !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;
}

/* Tło tylko pod treścią, bez prostokątnej maski/obramowania wokół ramy. */
.combat-roll-panel > .blacksaw-frame-content{
  position:relative !important;
  z-index:3 !important;
  min-width:min(390px,88vw) !important;
  margin:28px 36px 30px !important;
  padding:24px 38px 42px !important;
  overflow:hidden !important;
  border-radius:10px !important;
  background:
    linear-gradient(180deg,rgba(16,10,10,.94),rgba(5,6,8,.96)),
    url('../images/ui/frame_background.png') center/cover no-repeat !important;
  border:0 !important;
  box-shadow:
    inset 0 0 34px rgba(0,0,0,.42),
    0 18px 42px rgba(0,0,0,.64) !important;
}

/* Wyłączamy stare pseudo-obramowania panelu. */
.combat-roll-panel::before,
.combat-roll-panel::after{
  content:none !important;
  display:none !important;
}

/* Pasek czasu wędruje na sam dół panelu i nie nachodzi na wynik. */
.combat-roll-panel .message-progress{
  position:absolute !important;
  left:76px !important;
  right:76px !important;
  bottom:26px !important;
  top:auto !important;
  z-index:6 !important;
  margin:0 !important;
}

/* Dodatkowy odstęp pod wynikiem. */
.combat-roll-result{
  position:relative !important;
  z-index:7 !important;
  margin-top:8px !important;
  margin-bottom:18px !important;
}

/* Narożniki pozostają nad tłem, ale bez prostokątnej ramki dookoła. */
.combat-roll-panel > .blacksaw-frame-corner{
  z-index:8 !important;
}

@media(max-width:720px){
  .phase-toast{
    min-width:min(92vw,430px) !important;
  }
  .phase-toast > .blacksaw-frame-content{
    margin:18px 22px !important;
    padding:16px 22px 22px !important;
  }
  .phase-toast > .message-progress{
    left:58px !important;
    right:58px !important;
    bottom:20px !important;
  }

  .combat-roll-panel > .blacksaw-frame-content{
    min-width:min(330px,90vw) !important;
    margin:22px 26px 24px !important;
    padding:20px 26px 38px !important;
  }
  .combat-roll-panel .message-progress{
    left:54px !important;
    right:54px !important;
    bottom:22px !important;
  }
}