/* Presentation only. Fullscreen geometry and rotation remain in cinema.css. */
.cinema-dialog h2 { font-family: var(--serif); font-weight: 400; }
.cinema-topline .eyebrow { color: #d7bc87; font-size: 13px; line-height: 1.7; letter-spacing: .04em; }
.cinema-counter { color: #b1a68f; font-size: 12px; letter-spacing: .12em; }
.cinema-placeholder > span { display: flex; filter: none; }
.cinema-placeholder > span svg { display: block; width: 48px; height: 48px; }
.cinema-placeholder h2 { font-size: 30px; line-height: 1.65; letter-spacing: .025em; }
.cinema-placeholder p { color: #aebccd; font-size: 15px; line-height: 1.9; letter-spacing: 0; text-align: center; }
.cinema-progress { color: #9cabc0; font-size: 11px; letter-spacing: .04em; }
.cinema-progress .complete { color: #c5baa4; }
.cinema-progress .orientation-hint { color: #a4b2c7; }
.cinema-feedback .media-hint { color: #b9c7d8; font-size: 13px; }
.cinema-feedback .primary-button { font-size: 14px; }
.preview-end-button { background: #17263a; border-color: #c3a46d70; color: #dccaab; font-size: 12px; }
.preview-end-button:hover { background: #22344c; }
.wheel-copy h2 { font-size: 32px; line-height: 1.6; letter-spacing: .025em; margin: 0 0 16px; }
.wheel-copy > p:not(.eyebrow):not(.wheel-winner) { color: #b3bfd0; font-size: 15px; line-height: 1.9; letter-spacing: 0; max-width: 25em; }
.wheel-copy > p.wheel-caption:not(.eyebrow):not(.wheel-winner) { color: #b3a487; font: 11px/1.8 Georgia, serif; letter-spacing: .1em; margin-top: 18px; }
.wheel-copy .primary-button { font-size: 14px; letter-spacing: .03em; margin-top: 25px; }
.wheel-winner { font-size: 15px; letter-spacing: .08em; }
.wheel-center svg { display: block; width: 48%; height: 48%; }
.countdown-section .prepare-button { min-height: 54px; font-size: 14px; }
.countdown-section .arm-hint { color: var(--muted); font-size: 12px; line-height: 1.9; letter-spacing: 0; margin-top: 18px; }

/* A portrait phone becomes a short landscape canvas during the ceremony. */
@media (orientation: portrait) and (max-width: 900px), (orientation: landscape) and (max-height: 600px) {
  .cinema-topline .eyebrow { font-size: 12px; letter-spacing: .025em; }
  .cinema-counter { font-size: 11px; }
  .cinema-placeholder { gap: 8px; }
  .cinema-placeholder > span svg { width: 28px; height: 28px; }
  .cinema-placeholder h2 { font-size: 23px; line-height: 1.5; letter-spacing: .015em; }
  .cinema-placeholder p { font-size: 12px; line-height: 1.7; }
  .cinema-progress { font-size: 11px; gap: 10px; letter-spacing: 0; }
  .cinema-progress .orientation-hint { font-size: 11px; letter-spacing: 0; margin-left: 8px; }
  .cinema-feedback .media-hint { font-size: 12px; line-height: 1.6; }
  .cinema-feedback .primary-button { font-size: 13px; }
  .preview-end-button { font-size: 11px; }
  .wheel-copy h2 { font-size: 23px; line-height: 1.5; letter-spacing: .015em; margin: 0 0 9px; }
  .wheel-copy > p:not(.eyebrow):not(.wheel-winner) { font-size: 12px; line-height: 1.7; }
  .wheel-copy > p.wheel-caption:not(.eyebrow):not(.wheel-winner) { font-size: 11px; line-height: 1.5; letter-spacing: .05em; margin-top: 10px; }
  .wheel-copy .primary-button { min-height: 44px; padding: 8px 17px; font-size: 13px; letter-spacing: 0; margin-top: 14px; gap: 16px; }
  .wheel-winner { font-size: 12px; line-height: 1.5; letter-spacing: .04em; margin-top: 5px; }
}

@media (orientation: portrait) and (max-width: 380px), (orientation: landscape) and (max-height: 380px) {
  .cinema-topline .eyebrow { font-size: 11px; }
  .cinema-placeholder h2 { font-size: 21px; }
  .cinema-placeholder p { font-size: 11px; }
  .cinema-placeholder > span svg { width: 24px; height: 24px; }
  .wheel-copy h2 { font-size: 21px; line-height: 1.4; margin-bottom: 7px; }
  .wheel-copy > p:not(.eyebrow):not(.wheel-winner) { font-size: 11px; line-height: 1.6; }
  .wheel-copy > p.wheel-caption:not(.eyebrow):not(.wheel-winner) { font-size: 11px; margin-top: 6px; }
  .wheel-copy .primary-button { margin-top: 10px; font-size: 12px; }
  .cinema-progress { font-size: 11px; gap: 8px; }
  .cinema-progress .orientation-hint { font-size: 11px; margin-left: 3px; }
}
