/* Gameplay compacts by viewport height; media yields before text or controls. */
.quiz-active{min-block-size:100vh;min-block-size:100dvh}
.quiz-active .site-header{padding-block:6px}
.quiz-active .page{max-width:904px;padding-block:8px 12px}
.quiz-active .site-header{position:absolute;inset-block-start:2px;inset-inline:0;z-index:2;justify-content:flex-end;border:0;padding-block:0;pointer-events:none}
.quiz-active .site-header .brand{display:none}.quiz-active .theme-control{pointer-events:auto}
.quiz-active .quiz-meta{padding-inline-end:150px;min-height:44px;flex-wrap:wrap;row-gap:4px}
@media(min-width:768px){.quiz-active .quiz-meta{padding-inline-end:calc(150px + 6rem)}}
.quiz-stage,.quiz-question-flow,.quiz-copy{min-inline-size:0}
.quiz-active .site-footer{display:none}
.quiz-active .question-card h1,.quiz-active .attribution-compact{overflow-wrap:anywhere}
.quiz-active .quiz-meta{margin-bottom:4px;font-size:.9375rem;line-height:1.25}
.quiz-active .progress{height:6px;margin-bottom:8px}.quiz-active .progress span{height:6px}
.quiz-active .question-card{padding:clamp(12px,2vh,20px)}
.quiz-question-flow{display:flex;flex-direction:column;gap:clamp(8px,1.5vh,16px)}
.quiz-heading{margin:0!important}
.quiz-media{margin:0;min-inline-size:0;max-inline-size:100%}
.quiz-image-wrap{position:relative;display:grid;place-items:center;min-inline-size:0;background:var(--surface-subtle);border-radius:12px;padding:8px}
.question-image{display:block;width:auto;height:auto;max-inline-size:100%;max-block-size:var(--quiz-media-max,clamp(260px,48dvh,420px));object-fit:contain;background:#F8FAFC;border-radius:6px}
.image-zoom-trigger{position:absolute;inset-block-start:12px;inset-inline-end:12px;z-index:1;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:2px solid var(--surface);border-radius:999px;background:var(--surface);color:var(--text);box-shadow:0 2px 10px rgba(16,42,67,.2);font-size:1.75rem;line-height:1}
.image-zoom-trigger:hover{background:var(--primary-soft);color:var(--text)}
.attribution-compact{margin:4px 0 0;font-size:0.875rem;line-height:1.3;overflow-wrap:anywhere}
.attribution-compact a{color:inherit;display:inline-flex;align-items:center;min-height:44px}.media-note{display:block;margin-top:2px}
.media-unavailable{margin:0;padding:16px;color:var(--text-muted);font-size:1rem;text-align:center}
.quiz-active .answers{margin-top:0;gap:clamp(6px,1vh,10px)}
.quiz-active .answer{min-height:56px;padding:clamp(10px,1.6vh,14px) 16px;font-size:clamp(1.125rem,2.4vh,1.25rem);line-height:1.3}
.quiz-active .answer{overflow-wrap:anywhere}
.has-image-error .question-image{display:none}
.has-image-error .image-zoom-trigger{display:none}
.has-image-error .media-unavailable{display:block}
.category-badge{display:inline-block;background:var(--surface-subtle);color:var(--text-muted);font-size:1rem;padding:4px 10px;border-radius:6px;margin-bottom:12px}
@media(min-width:768px) and (max-width:1023px){.quiz-active .page{max-width:768px}}
@media(max-height:720px){.quiz-active .brand{min-height:44px}.quiz-active .site-header{padding-block:2px}.quiz-active .page{padding-block:4px 8px}.quiz-active .question-card{padding-block:10px}.quiz-question-flow{gap:8px}.question-image{max-block-size:var(--quiz-media-max,clamp(200px,38dvh,340px))}.attribution-compact a{min-height:36px}.quiz-active .answers{gap:6px}}
@media(max-width:767px){.question-image{max-block-size:var(--quiz-media-max,clamp(160px,30dvh,280px))}}
@media(max-width:620px){.quiz-meta{font-size:.9375rem}.answer{flex-wrap:wrap}.quiz-active .site-header,.quiz-active .page{padding-inline:10px}.quiz-active .question-card{border-radius:14px}}
.quiz-stage.is-answered .progress{display:none}
.quiz-active.is-compact .quiz-stage.is-answered .question-card{padding-block:6px}
.quiz-active.is-compact .quiz-stage.is-answered .quiz-question-flow{gap:4px}
.quiz-active.is-compact .site-header{padding-block:0}.quiz-active.is-compact .page{padding-block:2px 4px}.quiz-active.is-compact .question-card{padding-block:8px}.quiz-active.is-compact .quiz-question-flow{gap:6px}.quiz-active.is-compact .answers{gap:5px}.quiz-active.is-compact .attribution-compact{margin-top:2px;line-height:1.2}
.image-modal{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:16px;overscroll-behavior:contain}
.image-modal[hidden]{display:none}
.image-modal-backdrop{position:absolute;inset:0;background:rgba(3,13,24,.84)}
.image-modal-panel{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:min(100%,1200px);max-height:100%;padding:52px 16px 16px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:0 18px 60px rgba(0,0,0,.35)}
.image-modal-image{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 150px);object-fit:contain;border-radius:8px;background:var(--surface-subtle)}
.image-modal-close{position:absolute;inset-block-start:10px;inset-inline-end:10px;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:2px solid var(--control-border);border-radius:999px;background:var(--surface);color:var(--text);font-size:2rem;line-height:1}
.image-modal-close:hover{background:var(--primary-soft)}
.image-modal-attribution{width:100%;max-width:70rem;margin:0;color:var(--text-muted);font-size:.9375rem;line-height:1.4;overflow-wrap:anywhere}
.image-modal-attribution a{display:inline-flex;align-items:center;min-height:44px}
.image-modal-open{overflow:hidden}