/* Fill the desktop preview column; it no longer moves independently of the quiz. */
@media(min-width:901px){
 .quiz-preview,.quiz-dialog-live .quiz-preview{position:relative;top:auto;align-self:stretch;aspect-ratio:auto;height:auto;min-height:0}
 .preview-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%}
 .quiz-layout{align-items:stretch}
}
.preview-photo{background:#25302c}
.quiz-preview .wood-visual{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}
.quiz-preview.is-wood-preview .preview-photo{visibility:hidden}
.wood-visual[hidden]{display:none}
.is-wood-preview:before{background:linear-gradient(180deg,rgba(12,21,18,.48),transparent 22%,transparent 65%,rgba(9,18,15,.85))}
.is-wood-preview .preview-note,.is-wood-preview .preview-finish{display:none}
@media(max-width:900px) and (min-width:601px){.quiz-preview,.quiz-dialog-live .quiz-preview{height:380px;min-height:380px}.quiz-shell,.quiz-dialog-live .quiz-shell{scroll-margin-top:396px}}
@media(max-width:600px){
 :root{--quiz-photo-height:clamp(220px,32svh,290px)}
 .quiz-preview,.quiz-dialog-live .quiz-preview{height:var(--quiz-photo-height);min-height:var(--quiz-photo-height)}
 .preview-photo{object-fit:cover;object-position:50% 63%}
 .preview-caption{bottom:16px;gap:5px}
 .preview-caption>strong{font-size:18px}
 .preview-header{top:15px}
 .preview-header>img{width:100px;height:23px}
 .quiz-shell,.quiz-dialog-live .quiz-shell{scroll-margin-top:calc(var(--quiz-photo-height) + env(safe-area-inset-top,0px))}
 .quiz-dialog-live{scroll-padding-top:var(--quiz-photo-height)}
 .quiz-dialog-live .quiz-shell{scroll-margin-top:0}
 .quiz-preview .wood-visual{object-position:50% 50%}
 .is-wood-preview .preview-caption{bottom:12px}
}
@media(max-width:600px) and (max-height:650px){:root{--quiz-photo-height:190px}.preview-caption>strong{font-size:16px}}