@-webkit-keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  @-webkit-keyframes pulse {
    50% {
      background: rgb(12, 15, 226);
    }
  }
  @keyframes pulse {
    50% {
      background: rgb(12, 15, 226);
    }
  }

  .rz-dialog {
    position: fixed !important;
  }
  
  .rz-dialog-wrapper {
    --rz-dialog-mask-background-color: transparent;
  }
  div.rz-dialog-wrapper {
    position: absolute;
    width: -webkit-fill-available;
  }

  @media (max-width: 768px) {
   
    div.rz-dialog:not(.rz-dialog-confirm):not(.rz-dialog-alert) {
      /* top: auto !important; */
      width: fit-content !important;
      inset-block-start: 45% !important;
    }
  }

  .loading-pulse {
    position: absolute;
    top: 40%;
    left: 50%;
    width: 6px;
    height: 24px;
    -webkit-animation: pulse 750ms infinite;
            animation: pulse 750ms infinite;
    -webkit-animation-delay: 250ms;
            animation-delay: 250ms;
  }
  .loading-pulse:before, .loading-pulse:after {
    content: "";
    position: absolute;
    display: block;
    height: 16px;
    width: 6px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-animation: pulse 750ms infinite;
            animation: pulse 750ms infinite;
  }
  .loading-pulse:before {
    left: -12px;
  }
  .loading-pulse:after {
    left: 12px;
    -webkit-animation-delay: 500ms;
            animation-delay: 500ms;
  }

.game-journal-container {
  height: 40svh;      /* or whatever fits your layout */
  overflow-y: auto;   /* scrolling happens inside this box */
}

.sticky-header {
  position: sticky;
  top: 0;
  z-index: 5;
  background-color: white; /* keeps header background solid */
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}