/* Source-registered portrait controls. All measurements are on the1000×1777.778 cabinet. */
#portraitTurboButton { display: none; }
html[data-slot-orientation="portrait"] #gameStage .controls { z-index: 20; }
html[data-slot-orientation="portrait"] #gameStage .controls .artHit {
  display: block; left: var(--portrait-x); top: var(--portrait-y);
  right: auto; bottom: auto;
  width: max(44px, var(--portrait-face-width)); height: max(44px, var(--portrait-face-height));
  min-width: 44px; min-height: 44px; aspect-ratio: auto;
  margin: 0; padding: 0; border: 0; border-radius: 18%;
  background: none; opacity: 1; filter: none;
  transform: translate(-50%, -50%); transition: none; animation: none;
  touch-action: manipulation;
}
html[data-slot-orientation="portrait"] #gameStage .controls .artHit::before {
  content: ""; position: absolute; z-index: 1;
  inset: auto; left: 50%; top: 50%;
  width: var(--portrait-face-width); height: var(--portrait-face-height);
  background: var(--portrait-face) center / contain no-repeat;
  opacity: 1; border: 0; border-radius: 0;
  transform: translate3d(-50%, -50%, 0); filter: none;
  transition: none; animation: none; pointer-events: none;
}
html[data-slot-orientation="portrait"] #gameStage .controls .artHit::after { display: none; content: none; }
html[data-slot-orientation="portrait"] #gameStage .controls .artHit:active { transform: translate(-50%, -50%); }
html[data-slot-orientation="portrait"] #gameStage .controls .artHit:focus-visible { outline: 2px solid #aafaff; outline-offset: 3px; }
html[data-slot-orientation="portrait"] #gameStage #portraitTurboButton {
  --portrait-x: 16.77175%; --portrait-y: 73.59546%;
  --portrait-face-width: 15.6cqw; --portrait-face-height: 9.140625cqw;
  --portrait-face: url('../assets/art/mobile/portrait-turbo-off.webp');
}
/* A stable dedicated face layer avoids transient atlas/image resampling when reels start. */
html[data-slot-orientation="portrait"] #gameStage #portraitTurboButton::before { will-change: transform; transform: translate3d(-50%, -50%, 0); }
html[data-slot-orientation="portrait"] #gameStage #portraitTurboButton[aria-pressed="true"] { --portrait-face: url('../assets/art/mobile/portrait-turbo-on.webp'); }
html[data-slot-orientation="portrait"] #gameStage #betDownButton {
  --portrait-x: 31.4628%; --portrait-y: 73.59546%;
  --portrait-face-width: 8.12cqw; --portrait-face-height: 8.12cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-minus.webp');
}
html[data-slot-orientation="portrait"] #gameStage #betUpButton {
  --portrait-x: 68.6633%; --portrait-y: 73.59546%;
  --portrait-face-width: 8.12cqw; --portrait-face-height: 8.12cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-plus.webp');
}
html[data-slot-orientation="portrait"] #gameStage #maxBetButton {
  --portrait-x: 83.54351%; --portrait-y: 73.59546%;
  --portrait-face-width: 15.6cqw; --portrait-face-height: 9.122807cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-max.webp');
}
html[data-slot-orientation="portrait"] #gameStage #menuButton {
  --portrait-x: 19.73518%; --portrait-y: 87.072383%;
  --portrait-face-width: 14.9cqw; --portrait-face-height: 14.9cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-menu.webp');
}
html[data-slot-orientation="portrait"] #gameStage #autoButton {
  --portrait-x: 80.39092%; --portrait-y: 87.072383%;
  --portrait-face-width: 14.9cqw; --portrait-face-height: 14.9cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-auto.webp');
}
html[data-slot-orientation="portrait"] #gameStage #spinButton {
  --portrait-x: 50.06305%; --portrait-y: 85.263445%;
  --portrait-face-width: 22.5cqw; --portrait-face-height: 22.5cqw;
  --portrait-face: url('../assets/art/mobile/portrait-face-spin.webp');
}
html[data-slot-orientation="portrait"] #gameStage.isSpinning #spinButton,
html[data-slot-orientation="portrait"] #gameStage #spinButton.autoplayRunning {
  --portrait-face: url('../assets/art/spin-stop-button.webp');
}
html[data-slot-orientation="portrait"] #gameStage #spinAutoplayCount {
  left: 50%; top: 50%; width: 42%; font-size: 5.6cqw; line-height: 1;
  color: #271703; text-shadow: 0 1px 0 #ffe894;
  opacity: 1; transform: translate(-50%, -50%); transition: none;
}
html[data-slot-orientation="portrait"] #gameStage #spinButton.autoplayLargeCount #spinAutoplayCount { font-size: 4.7cqw; }
html[data-slot-orientation="portrait"] #gameStage .meter {
  display: flex; flex-direction: column; justify-content: center; gap: .4cqw;
  top: 46.0125%; bottom: auto; height: 4.58%; width: 36.8%;
  transform: translate(-50%, -50%);
}
html[data-slot-orientation="portrait"] #gameStage .balanceMeter { left: 27.658%; }
html[data-slot-orientation="portrait"] #gameStage .winMeter { left: 72.342%; }
html[data-slot-orientation="portrait"] #gameStage .betMeter {
  left: 50.06305%; top: 73.59546%; width: 20%; height: 4.62%;
}
html[data-slot-orientation="portrait"] #gameStage .meter > span {
  position: static !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important;
  overflow: visible !important; clip: auto !important; clip-path: none !important; border: 0 !important;
  font: 700 2.65cqw/1 'Trebuchet MS', Arial, sans-serif;
  letter-spacing: .11em; text-transform: uppercase; color: #d9bb72;
}
html[data-slot-orientation="portrait"] #gameStage .meter strong {
  font-size: 4.55cqw; line-height: 1; letter-spacing: -.015em;
  color: #fff1c6; text-shadow: 0 1px 3px #000;
  max-width: 100%; overflow: hidden; text-overflow: clip;
}
html[data-slot-orientation="portrait"] #gameStage .betMeter > span { font-size: 2.4cqw; }
html[data-slot-orientation="portrait"] #gameStage .betMeter strong { font-size: 4.15cqw; }




/* New upper cabinet: native1392x1130 at designy100, black wells y853..966.
   A67-unit label/value group has equal7.45-unit clear margins in the81.9-unit well. */
html[data-slot-orientation="portrait"] #gameStage :is(.balanceMeter, .winMeter) {
  top: 42.377625%; height: 8.19cqw; gap: .3cqw;
  align-items: center; justify-content: center; box-sizing: border-box;
  margin: 0; padding: 0;
}
html[data-slot-orientation="portrait"] #gameStage :is(.balanceMeter, .winMeter) > span {
  flex: 0 0 auto; font-size: 2.3cqw; line-height: 1;
}
html[data-slot-orientation="portrait"] #gameStage :is(.balanceMeter, .winMeter) > strong {
  position: static; inset: auto; flex: 0 0 auto;
  margin: 0; padding: 0; transform: none;
  font-size: 4.1cqw; line-height: 1;
  text-align: center;
}
