/* Native pinch zoom stays available; a magnified question can pan both ways. */
.qq-page, .qq-stage, .qq-card { touch-action: pan-x pan-y pinch-zoom; }
/* Keep the image's available width unchanged when a card starts scrolling. */
.qq-stage, .qq-card { scrollbar-gutter:stable; }

/* Single-pointer drawing remains controlled by the canvas; two pointers belong
   to the native zoom gesture. The cancelled draft is discarded in the module. */
.qw-canvas { touch-action: pinch-zoom; }

/* Keep image dimensions independent from old viewport-height containment. */
.qi-viewer { width:100%; min-width:0; color:#26334a; background:#fff; }
.qi-viewport { width:100%; overflow:auto; scrollbar-gutter:stable; touch-action:none; overscroll-behavior:contain; cursor:grab; scrollbar-width:thin; }
.qi-viewport:active { cursor:grabbing; }
.qi-viewport:focus-visible { outline:2px solid #5668cc; outline-offset:-3px; }
.qi-viewport .qq-question-image { display:block; width:100%; max-width:none; height:auto; max-height:none; object-fit:initial; user-select:none; }
.cg-question[data-image-fit] .qi-viewport .qq-question-image { margin-inline:auto; }
.cg-question[data-image-fit] .qi-viewport { scrollbar-gutter:auto; }
.cg-question[data-image-fit] .qi-viewer[data-zoomed=false] .qi-viewport { overscroll-behavior:auto; }
.cg-question[data-image-fit] .qq-question-media { align-content:center; }

/* A tablet question is a page to fit, not a width-first crop. Keep its source
   image intact while existing answers and writing tools stay within reach. */
@media (min-width:540px) and (orientation:landscape) {
  body.dd-pro .cg-page.cg-session-active .qq-header { min-height:60px; padding-top:max(6px,env(safe-area-inset-top)); padding-bottom:6px; }
  body.dd-pro .cg-page.cg-session-active .qq-stage { padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left)); }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] {
    display:grid; grid-template-columns:minmax(0,1fr) minmax(100px,130px) minmax(100px,130px);
    grid-template-rows:repeat(7,max-content);
    width:min(100%,1120px); height:100%; min-height:0; padding:10px; column-gap:12px; row-gap:4px;
    align-content:start; align-items:start; scrollbar-gutter:stable;
  }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] > * { min-width:0; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-question-media {
    grid-column:1; grid-row:1 / 7; align-self:start; display:grid; place-items:center;
    height:var(--question-fit-height); min-height:0; padding:0; overflow:hidden; border-radius:8px;
  }
  .cg-question[data-image-fit=wide] .qi-viewer { min-height:0; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-question-head { grid-column:2 / 4; grid-row:1; padding-bottom:0; min-height:44px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-blank-note { grid-column:2 / 4; grid-row:2; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-paper { grid-column:2 / 4; grid-row:3; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-choices { grid-column:2 / 4; grid-row:4; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-result { grid-column:2 / 4; grid-row:5; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qs-inline { grid-column:2 / 4; grid-row:6; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-report-question { grid-column:1; grid-row:7; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-hide-question { grid-column:2 / 4; grid-row:7; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] :is(.cg-report-question,.cg-hide-question) { margin:0; padding:4px 0; min-height:44px; text-align:left; color:var(--muted); background:none; border:0; font-size:13px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-choice { min-height:44px; padding:4px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-choice b { width:26px; height:26px; flex-basis:26px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .qq-tools.cg-writing-action button { min-width:44px; padding:4px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-question-head .cg-question-meta>span:first-child { font-size:13px; }
  body.dd-pro .cg-page .cg-question[data-image-fit=wide] .cg-question-head .cg-question-meta>span:last-child { font-size:11px; }
  body.dd-pro .cg-page.cg-session-active .cg-session-nav { padding-top:6px; padding-bottom:max(6px,env(safe-area-inset-bottom)); }
  body.dd-pro .cg-page.cg-session-active .cg-session-nav .qq-next-hint { min-height:44px; }
}
.qi-error:not([hidden]) { display:block; padding:12px; font-size:14px; }
/* Reserve a separate toolbar row: no controls float above the photo. */
.fullscreenQuestionModal { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto minmax(0,1fr); align-items:stretch; justify-content:normal; padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); gap:8px; }
.fullscreenQuestionModal .fsqImgWrap { position:relative; inset:auto; grid-column:1 / -1; grid-row:2; min-width:0; min-height:0; }
.fullscreenQuestionModal .fsqDrawToolbar { position:static; inset:auto; transform:none; grid-column:1; grid-row:1; z-index:auto; min-width:0; flex-wrap:wrap; padding:0; border:0; border-radius:0; box-shadow:none; backdrop-filter:none; background:transparent; }
.fullscreenQuestionModal .fullscreenQuestionClose { position:static; grid-column:2; grid-row:1; align-self:start; width:44px; height:44px; }
.fullscreenQuestionModal .fsqImgWrap:focus-visible { outline:2px solid #aab1ff; outline-offset:-2px; }
body.dd-pro .cg-page .qq-question-media:has(.qi-viewer) { display:block; min-height:0; overflow:hidden; }
body.dd-pro .cg-page .qq-header { min-height:72px; height:auto; padding-bottom:12px; gap:14px; }
body.dd-pro .cg-page .qq-brand { display:flex; flex-direction:row; flex:1; align-items:center; gap:10px; }
body.dd-pro .cg-page .qq-brand strong { font-size:21px; letter-spacing:-.7px; text-shadow:none; }
.cg-brand-mark { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; color:var(--brand); background:color-mix(in srgb,var(--brand) 14%,transparent); }
body.dd-pro .cg-page .cg-progress { display:block; white-space:nowrap; padding:10px 13px; border:1px solid var(--stroke); border-radius:12px; background:var(--panel); font-size:21px; }
body.dd-pro .cg-page .qq-tools { justify-content:flex-end; }
body.dd-pro .cg-page .qq-tools button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; }
body.dd-pro .cg-page .qq-stage { justify-content:flex-start; }
body.dd-pro .cg-page .qq-card { min-height:0; flex-shrink:1; }
.cg-result-home { margin-top:18px; min-height:48px; }
@media (min-width:700px) {
  body.dd-pro .cg-page .qq-card { width:min(100%,900px); }
  body.dd-pro .cg-page .qq-header { max-width:940px; }
  body.dd-pro .cg-page .cg-progress-track { margin-left:max(20px,calc((100vw - 900px)/2)); margin-right:max(20px,calc((100vw - 900px)/2)); }
}
