/* V1.28Beta: entrance plaque should not expose the generic rectangular button layer. */
body:not(.maintenance-mode) #enterFatedDuel.enter-gate {
  appearance: none !important;
  -webkit-appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  overflow: visible !important;
  background-color: transparent !important;
  background: var(--enter-gate-art) center / contain no-repeat !important;
  box-shadow: none !important;
  isolation: auto !important;
  filter:
    drop-shadow(0 16px 30px rgba(16, 58, 88, 0.18))
    drop-shadow(0 0 20px rgba(255, 246, 204, 0.2)) !important;
}

body:not(.maintenance-mode) #enterFatedDuel.enter-gate:hover,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate:active,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus-visible,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate[disabled]:hover,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate[disabled]:focus-visible {
  border: 0 !important;
  outline: 0 !important;
  background-color: transparent !important;
  background: var(--enter-gate-art) center / contain no-repeat !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 18px 32px rgba(16, 58, 88, 0.2))
    drop-shadow(0 0 22px rgba(255, 246, 204, 0.22)) !important;
}

body:not(.maintenance-mode) #enterFatedDuel.enter-gate:hover,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus-visible {
  transform: translateY(calc(-1vh - 2px)) scale(1.01) !important;
}

body:not(.maintenance-mode) #enterFatedDuel.enter-gate:active {
  transform: translateY(-1vh) scale(1.004) !important;
}

body:not(.maintenance-mode) #enterFatedDuel.enter-gate::before,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate::after,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate > strong::before,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate > strong::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body:not(.maintenance-mode) #enterFatedDuel.enter-gate > strong,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate > span,
body:not(.maintenance-mode) #enterFatedDuel.enter-gate > small {
  background-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 640px) {
  body:not(.maintenance-mode) #enterFatedDuel.enter-gate:hover,
  body:not(.maintenance-mode) #enterFatedDuel.enter-gate:active,
  body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus,
  body:not(.maintenance-mode) #enterFatedDuel.enter-gate:focus-visible {
    transform: translateY(-1vh) !important;
  }
}