.field-topline {padding: 17px 24px; border-bottom: 1px solid var(--rule); display: flex; justify-content: space-between; gap: 15px; flex-wrap: wrap; align-items: center;}
.field-topline p {margin: 0; font-size: 12px;}
.field-levels {display: flex; align-items: center; gap: 8px; font-size: 12px;}
.field-levels button {min-height: 38px; padding: 7px 12px; font-size: 12px;}
.field-stops {display: flex; gap: 7px; padding: 16px 24px; border-bottom: 1px solid var(--rule);}
.field-stops .lab-button {flex: 1; text-align: left;}
.field-stops small {display: block; font: 10px/1.8 var(--mono); text-transform: uppercase; letter-spacing: .04em;}
.field-layout {display: grid; grid-template-columns: 1fr 1fr;}
.field-scene {margin: 0; padding: 20px; background: #eee7dc; display: flex; flex-direction: column; justify-content: center;}
.field-image-stage {position: relative; height: 490px;}
.field-image-stage img {display: block; width: 100%; height: 100%; object-fit: contain;}
.field-image-stage svg {position: absolute; inset: 0; width: 100%; height: 100%; font-family: var(--sans); pointer-events: none;}
.field-scene figcaption {font-size: 12px; line-height: 1.65; color: var(--ink-2); padding: 16px 7px 0;}
.field-scene figcaption a {white-space: nowrap;}
.field-question {padding: 26px 32px; min-width: 0;}
.field-question h3 {font: 500 30px/1.2 var(--serif); margin: 12px 0 24px;}
.field-options {border: 0; padding: 0; margin: 0 0 18px;}
.field-options label {display: flex; align-items: start; gap: 12px; border: 1px solid var(--rule-2); margin: 9px 0; padding: 13px 14px; font-size: 14px; cursor: pointer; line-height: 1.5; background: var(--card);}
.field-options label:has(input:checked) {border-color: var(--forest); background: #e8ecdf;}
.field-options input {margin: 2px 0 0;}
.field-feedback {padding: 18px; border-left: 3px solid var(--forest); background: #e9e9dc; margin: 20px 0;}
.field-feedback h4 {margin: 0 0 8px; font: 600 14px/1.4 var(--sans);}
.field-feedback p {font-size: 13px; margin-bottom: 10px;}
.field-feedback p:last-child {margin: 0;}
.field-clue {font-size: 13px; color: var(--ink-2); margin-top: 13px; padding-left: 13px; border-left: 2px solid var(--clay);}
.field-actions {display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin-top: 17px;}
.field-notebook {padding: 20px 24px; border-top: 1px solid var(--rule);}
.field-notebook label {font: 500 18px var(--serif); display: block; margin-bottom: 10px;}
.field-notebook textarea {display: block; width: 100%; min-height: 90px; resize: vertical; border: 1px solid #8d9186; background: var(--paper); font: 14px/1.6 var(--sans); padding: 12px; color: var(--ink); border-radius: 3px;}
.field-notebook p {margin: 7px 0 0; font-size: 11px; color: var(--ink-2);}
.field-summary {padding: 28px 32px; border-top: 1px solid var(--rule);}
.field-summary h3 {font: 500 26px/1.25 var(--serif); margin-bottom: 16px;}
.field-summary ol {padding-left: 18px; font-size: 14px;}
.field-summary li {padding-bottom: 12px;}
.field-reading-stop {display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 25px; border-bottom: 1px solid var(--rule); padding-bottom: 26px;}
.field-reading-stop img {width: 130px; max-height: 185px; object-fit: contain; background: #eee7dc;}
.field-reading-stop h4 {font-size: 14px; font-weight: 600; margin: 18px 0 8px;}
.field-reading-stop ul {padding-left: 18px; font-size: 14px; color: var(--ink-2);}
.field-image-error {padding: 35px; font-size: 15px;}
@media (max-width: 850px) {.field-layout {grid-template-columns: 1fr;} .field-image-stage {height: 340px;} .field-scene {padding: 16px;} .field-question {padding: 24px;} .field-question h3 {font-size: 28px;} .field-stops {padding: 15px;}}
@media (max-width: 500px) {.field-stops {flex-wrap: wrap; gap: 5px;} .field-stops .lab-button {min-width: 90px; padding: 8px; font-size: 11px;} .field-topline {padding: 16px;} .field-image-stage {height: 310px;} .field-question {padding: 20px;} .field-question h3 {font-size: 25px;} .field-options label {font-size: 13px;} .field-reading-stop {grid-template-columns: 1fr; gap: 15px;} .field-reading-stop img {width: 100%; max-height: 230px;} .field-levels {flex-wrap: wrap;} .field-summary {padding: 24px 20px;}}
@media print {.field-reading-stop {break-inside: avoid; grid-template-columns: 100px 1fr;} .field-reading-stop img {width: 100px;} }
