/* ===== Trắc nghiệm nhiều dạng ===== */
.qpic{text-align:center;line-height:1.2}
.qpic__emoji{font-size:4.5rem}
.qpic__img{max-width:min(100%,320px);max-height:200px;border-radius:16px}

/* tranh gồm vài hình xếp hàng ngang */
.qscene{display:flex;align-items:flex-end;justify-content:center;gap:clamp(10px,4vw,40px);margin:10px 0 18px;padding:18px 10px 10px;background:linear-gradient(#e9fbe4 72%,#7ed957 72%);border:var(--line);border-radius:20px}
.qscene__item{display:flex;flex-direction:column;align-items:center;gap:2px}
.qscene__img{font-size:4rem;line-height:1.1}
.qscene__pic{max-width:26vw;max-height:120px;object-fit:contain}
.qscene__label{font-weight:800}

/* đáp án có hình ảnh / âm thanh / chữ */
.choice-wrap{position:relative}
.choice-wrap .choice{position:relative;width:100%;height:100%}
.choice__pic{max-width:100%;max-height:110px;object-fit:contain}
.choice__badge{position:absolute;top:8px;left:10px;display:grid;place-items:center;width:34px;height:34px;font-size:1.2rem;font-weight:800;color:#fff;background:var(--grape);border:3px solid var(--ink);border-radius:50%}
.choice-say{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:38px;height:38px;font:inherit;background:var(--sun);border:3px solid var(--ink);border-radius:50%;cursor:pointer}

/* kéo thả */
.dnd{display:flex;align-items:center;justify-content:center;gap:clamp(8px,3vw,30px);margin:10px 0;padding:18px 8px;background:linear-gradient(#e9fbe4 72%,#7ed957 72%);border:var(--line);border-radius:20px}
.dnd__zone{display:grid;place-items:center;min-width:100px;min-height:120px;padding:4px;font:inherit;background:rgba(255,255,255,.6);border:4px dashed var(--ink);border-radius:20px;cursor:pointer}
.dnd__hint{font-size:2rem;opacity:.6}
.dnd__zone--ok{background:#d8f8e1;border-style:solid}
.dnd__zone--ok .dnd__hint{display:none}
.dnd__zone--wrong{background:#ffd3d3;animation:shake .4s}
.dnd__ref{display:flex;flex-direction:column;align-items:center}
.dnd__pic{font-size:4rem;line-height:1.1}
.dnd__img{max-width:26vw;max-height:110px;object-fit:contain}
.dnd__name{font-weight:800}
.dnd__tray{display:flex;justify-content:center;min-height:140px;margin-bottom:6px}
.dnd__mover{display:flex;flex-direction:column;align-items:center;align-self:center;padding:8px 18px;font:inherit;color:inherit;background:#fff;border:var(--line);border-radius:20px;box-shadow:4px 4px 0 var(--ink);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.dnd__mover--on{outline:5px solid var(--pink);outline-offset:3px}
.dnd__mover--drag{position:relative;z-index:30;cursor:grabbing;box-shadow:8px 10px 0 var(--ink)}
.dnd__mover--ok{box-shadow:none;cursor:default}
.dnd__mover--wrong{animation:shake .4s}