/* Ultra-compact landscape gameplay: keep every primary section visible and unclipped. */

@media (max-width: 740px) and (max-height: 380px) and (orientation: landscape) {
  .device.is-playing {
    grid-template-rows: 42px minmax(0, 1fr) 42px;
  }
}

@media (max-width: 620px) and (max-height: 340px) and (orientation: landscape) {
  #screenRules,
  #screenRecords {
    align-items: center;
    justify-content: center;
    padding: 6px;
    overflow: hidden;
  }

  #screenRules .glass-sheet,
  #screenRecords .glass-sheet {
    width: min(92vw, 520px);
    max-height: calc(100dvh - 12px);
    padding: 8px 12px;
    border-radius: 10px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  #screenRules h2,
  #screenRecords h2 {
    margin-bottom: 2px;
    font-size: 1rem;
    line-height: 1.1;
  }

  #screenRules .rules-body,
  #screenRules .fair {
    margin: 4px 0;
    font-size: 0.56rem;
    line-height: 1.25;
  }

  #screenRecords .records-list {
    width: min(100%, 360px);
    margin: 3px 0 7px;
    font-size: 0.62rem;
  }

  #screenRecords .records-list li {
    padding: 3px 0;
  }

  #screenRules .play-cta.compact,
  #screenRecords .play-cta.compact {
    min-height: 28px;
    padding: 5px 12px;
    border-radius: 8px;
  }

  #screenRules .play-cta-text b,
  #screenRecords .play-cta-text b {
    font-size: 0.68rem;
  }

  .home-screen.is-on {
    grid-template-rows: 42px 48px minmax(0, 1fr) 43px;
  }

  .home-brand {
    min-height: 0;
  }

  .home-crest {
    max-height: 20px;
  }

  .home-title-km {
    font-size: 1.08rem;
    line-height: 0.92;
  }

  .home-title-en {
    margin-top: 0;
    font-size: 0.44rem;
  }

  .home-menu {
    align-self: stretch;
    min-height: 0;
    height: auto;
    grid-template-rows: repeat(5, minmax(0, 1fr));
    gap: 3px;
  }

  .home-menu .menu-row {
    min-height: 0;
    height: auto;
  }

  .device.is-playing {
    grid-template-rows: 42px minmax(0, 1fr) 42px;
  }

  .device.is-playing .playfield {
    min-height: 0;
    grid-template-rows: 40px minmax(0, 1fr) 14px 44px;
    gap: 2px;
    overflow: visible;
  }

  .device.is-playing .game-brand {
    width: 100%;
    height: 40px;
    min-height: 0;
    overflow: visible;
  }

  .device.is-playing .game-brand img {
    width: min(44%, 120px);
    max-height: 20px;
    margin-bottom: -2px;
  }

  .device.is-playing .game-brand strong {
    font-size: clamp(1.05rem, 6vh, 1.22rem);
    line-height: 0.88;
  }

  .device.is-playing .game-brand span {
    margin-top: 0;
    font-size: 0.42rem;
    line-height: 1;
  }

  .device.is-playing .playfield .apong-stage {
    align-self: stretch;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: none;
  }

  .device.is-playing .game-status {
    align-self: center;
    min-height: 0;
    font-size: 0.49rem;
    line-height: 1;
  }

  .device.is-playing .spin-zone {
    align-self: center;
    width: min(84%, 180px);
    max-width: 86%;
  }

  .device.is-playing .btn-spin {
    min-height: 40px;
    aspect-ratio: 420 / 100;
  }

  .device.is-playing .bet-inner {
    grid-template-rows: auto 1px 68px auto 22px 17px 27px;
    align-content: center;
    gap: 1px;
    padding: 4px 5px;
  }

  .device.is-playing .bet-title,
  .device.is-playing .amount-title {
    min-height: 0;
    font-size: 0.48rem;
    line-height: 1;
  }

  .device.is-playing .timer-bar {
    min-height: 1px;
    height: 1px;
  }

  .device.is-playing .faces-row {
    width: 100%;
    height: 68px;
    min-height: 68px;
    max-height: 68px;
    aspect-ratio: auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 2px;
  }

  .device.is-playing .face-bet {
    height: 100%;
    min-height: 0;
    padding: 1px;
    grid-template-rows: minmax(17px, 1fr) auto;
    border-radius: 3px;
  }

  .device.is-playing .face-bet .face-die {
    width: 18px;
    height: 18px;
    max-width: 18px;
    max-height: 18px;
  }

  .device.is-playing .face-meta {
    min-height: 9px;
    font-size: 0.42rem;
    line-height: 0.9;
  }

  .device.is-playing .face-meta b {
    font-size: 0.68rem;
    line-height: 0.8;
  }

  .device.is-playing .face-meta i {
    margin-top: 0;
    font-size: 0.38rem;
    line-height: 1;
  }

  .device.is-playing .amounts {
    height: 22px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 2px;
  }

  .device.is-playing .amounts button {
    width: 100%;
    min-width: 0;
    min-height: 22px;
    height: 22px;
    font-size: 0.45rem;
  }

  .device.is-playing .amounts button .chip-bg {
    width: 22px;
    height: 22px;
  }

  .device.is-playing .bet-total {
    min-height: 17px;
    height: 17px;
    padding: 1px 4px;
    font-size: 0.49rem;
    line-height: 1;
  }

  .device.is-playing .bet-value img {
    width: 10px;
    height: 10px;
  }

  .device.is-playing .actions {
    height: 27px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3px;
  }

  .device.is-playing .btn-place,
  .device.is-playing .btn-clear {
    width: 100%;
    min-width: 0;
    min-height: 27px;
    height: 27px;
    border-radius: 5px;
  }

  .device.is-playing .action-text b {
    font-size: 0.54rem;
    line-height: 1;
  }

  .device.is-playing .action-text small {
    display: none;
  }
}

@media (max-width: 520px) and (max-height: 320px) and (orientation: landscape) {
  .device.is-playing {
    --game-left-col: 90px;
    --game-right-col: 165px;
    --game-gap-final: 4px;
  }

  .device.is-playing .history {
    --hist-pad-x: 4px;
  }

  .device.is-playing .history-slot {
    gap: 2px;
    padding-inline: 1px;
  }

  .device.is-playing .history-slot .hist-time {
    font-size: 0.42rem;
  }
}