/* The portrait Q7-Q18 masters use the same desktop copy/image split as Q1-Q6.
 * Scope by the renderer's actual source aspect ratio, not player gender.
 * Landscape masters keep their existing full-bleed layout. */
@media (min-width: 701px) and (min-aspect-ratio: 32/25) {
  body:has(.hvy-saga-canvas:is([data-hvy-composition="question-portrait-desktop"],[data-hvy-composition="question-landscape-desktop"])) .scene-question .question-shell,
  body:has(.hvy-saga-canvas[data-hvy-composition="q16-approved-desktop"]) .scene-question.question-16 .question-shell,
  body:has(.hvy-saga-canvas[data-hvy-composition="q18-approved-desktop"]) .scene-question.question-18 .question-shell,
  body:has(.hvy-saga-canvas[data-hvy-composition="q17-approved-desktop"]) .scene-question.question-17 .question-shell,
  body:has(.hvy-saga-canvas[data-hvy-composition="q15-approved-desktop"]) .scene-question.question-15 .question-shell {
    left: 4.5vw !important;
    right: auto !important;
    width: 44vw !important;
    max-width: 760px !important;
    transform: none !important;
  }
  body:has(.hvy-saga-canvas:is([data-hvy-composition="question-portrait-desktop"],[data-hvy-composition="question-landscape-desktop"])) .scene-question .scene-shade,
  body:has(.hvy-saga-canvas[data-hvy-composition="q18-approved-desktop"]) .scene-question.question-18 .scene-shade,
  body:has(.hvy-saga-canvas[data-hvy-composition="q17-approved-desktop"]) .scene-question.question-17 .scene-shade {
    background: linear-gradient(90deg, rgba(6,8,9,.78), rgba(6,8,9,.64) 38%, transparent 60%), linear-gradient(0deg, rgba(6,8,9,.3), transparent 25%);
  }
}

/* Show a normal still if canvas allocation/decoding fails or Safari evicts it.
 * The src belongs to the nested img, not the .scene-portrait wrapper. */
html:not(.hvy-saga-canvas-ready) .scene-question .scene-image {
  animation: none !important;
  transform: none !important;
}

/* Use Q1-Q6's bottom-anchored, overlaid question shell. Long late-scene
 * copy may scroll, but never receives a separate image-panel layout. */
@media (max-width: 700px) {
  .scene-question:is(.question-7,.question-8,.question-9,.question-10,.question-11,.question-12,.question-13,.question-14,.question-15,.question-16,.question-17,.question-18) .question-shell {
    max-height: 62svh !important;
    padding-top: 14px !important;
  }
}

/* Keep Geira and the steering hands above the Q09 reading area. */
@media (max-width: 700px) {
  .scene-question.question-9 .question-shell { max-height: 58svh !important; }
}