/* 게임 플레이 */
.play-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.play-head h1 { font-size: 26px; font-weight: 800; }
.play-head__actions { display: flex; gap: 8px; }
.play-stage { position: relative; width: 100%; max-height: calc(100vh - var(--header-h) - 140px); aspect-ratio: var(--ratio, 16 / 9); margin: 0 auto; border-radius: var(--radius-lg); overflow: hidden; background: var(--c-surface-2); border: 1px solid var(--c-border); }
.play-stage iframe { width: 100%; height: 100%; border: 0; background: var(--c-surface-2); }
.play-stage:fullscreen { max-height: none; border-radius: 0; border: 0; }
.play-stage__exit { display: none; }
.play-stage:fullscreen .play-stage__exit { position: absolute; top: max(8px, env(safe-area-inset-top)); left: 50%; z-index: 2; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 4px; min-height: 36px; padding: 0 12px; border: 1px solid var(--c-border-strong); border-radius: var(--radius-pill); background: var(--c-surface); color: var(--c-text); font: inherit; font-size: 13px; font-weight: 700; opacity: .85; cursor: pointer; }
.play-stage__exit svg { width: 16px; height: 16px; }
.play-hint { margin-top: 12px; font-size: 14px; text-align: center; }
.is-playing .site-footer { margin-top: 40px; }

/* 세로형 게임: 화면 높이에 맞춰 9:16 으로 (가로 틀에 넣으면 게임이 "세로로 돌려주세요"를 띄움) */
.play-stage--portrait { width: auto; height: calc(100vh - var(--header-h) - 140px); height: calc(100dvh - var(--header-h) - 140px); max-width: 100%; max-height: none; min-height: 420px; }

/* 휴대폰: 틀이 화면을 가득 채워 틀의 방향 = 휴대폰 방향 (게임이 실제 방향을 정확히 알게) */
@media (max-width: 720px) {
  .play-stage, .play-stage--portrait {
    aspect-ratio: auto; width: 100%; max-width: none; max-height: none; min-height: 0;
    height: calc(100vh - var(--header-h) - 96px); height: calc(100dvh - var(--header-h) - 96px);
    border-radius: var(--radius-md);
  }
  .play-head { margin-bottom: 10px; }
  .play-head h1 { font-size: 20px; }
}