@font-face { font-family: 'Micro Pixel'; src: url('../assets/fonts/micro-pixel.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
:root {
  --slot-safe-top: env(safe-area-inset-top, 0px);
  --slot-safe-right: env(safe-area-inset-right, 0px);
  --slot-safe-bottom: env(safe-area-inset-bottom, 0px);
  --slot-safe-left: env(safe-area-inset-left, 0px);
}
html[data-slot-orientation] #app { padding: 0; }
html[data-slot-orientation] #gameShell {
  position: fixed;
  left: var(--slot-cabinet-center-x, 50%);
  top: var(--slot-cabinet-center-y, 50%);
  width: var(--slot-cabinet-width);
  height: var(--slot-cabinet-height);
  max-width: none;
  max-height: none;
  transform: translate(-50%, -50%);
  overflow: clip;
}
html[data-slot-orientation="portrait"] #gameShell { aspect-ratio: 9 / 16; background: #080317; }
html[data-slot-orientation="portrait"] #orientationHint { display: none !important; }
html[data-slot-orientation="portrait"] #paytableDialog[open] { visibility: visible; }
html[data-slot-orientation="portrait"] #cabinetBackground,
html[data-slot-orientation="portrait"] #reelCanvas,
html[data-slot-orientation="portrait"] .reelFrameForeground,
html[data-slot-orientation="portrait"] .spinForeground,
html[data-slot-orientation="portrait"] .ambientAnimations,
html[data-slot-orientation="portrait"] .cabinetSignCarousel,
html[data-slot-orientation="portrait"] .draculaSignForeground { visibility: hidden; pointer-events: none; }
#portraitCanvas, #portraitFxCanvas { display: none; }
html[data-slot-orientation="portrait"] #portraitCanvas,
html[data-slot-orientation="portrait"] #portraitFxCanvas { display: block; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
html[data-slot-orientation="portrait"] #portraitCanvas { z-index: 1; }
html[data-slot-orientation="portrait"] #portraitFxCanvas { z-index: 9; }
html[data-slot-orientation="portrait"] .controls { z-index: 12; }
html[data-slot-orientation="portrait"] #devButton { z-index: 15; min-width: 44px; min-height: 44px; }
/* A fitted cabinet is deliberately centered on tall phones; the artwork never stretches. */
@media (orientation: portrait) {
  html:not([data-slot-orientation]) #orientationHint { display: none !important; }
}

html[data-slot-orientation="portrait"] .cabinetMeter,html[data-slot-orientation="portrait"] #bonusHud { font-synthesis:none; }