/* FLC TOEFL MasterBook · extra controls for the PTE question types (on top of engine.css). */
.px-q .px-body { padding: 10px 16px 4px; }
.px-q .player { margin: 8px 16px 0; }
.px-passage { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; margin: 0 16px 10px; font: 400 16px/1.65 var(--serif); }
.ex > .px-passage { margin: 0 0 14px; }
.px-text { font: 400 16px/2.1 var(--serif); }
.px-sel, .px-in { font: 600 15px/1.3 var(--sans); color: var(--accent-deep); background: var(--tint); border: 0; border-bottom: 2px solid var(--accent); border-radius: 4px 4px 0 0; padding: 2px 6px; margin: 0 2px; max-width: 100%; }
.px-in { width: 9.5em; }
.px-in.px-wide { width: 100%; font: 500 16px/1.5 var(--sans); padding: 8px 10px; border: 1.5px solid var(--line); border-radius: 10px; }
.px-sel.ok, .px-in.ok { background: var(--ok-tint); border-color: var(--ok); color: var(--ok); }
.px-sel.bad, .px-in.bad { background: var(--bad-tint); border-color: var(--bad); color: var(--bad); }
.px-text .px-ans { font: 700 12.5px/1 var(--sans); color: var(--ok); background: var(--ok-tint); border-radius: 6px; padding: 2px 6px; margin-right: 4px; }
p.px-ans { font: 600 14.5px/1.5 var(--sans); color: var(--ok); margin: 8px 0 0; }
.px-order { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.px-order li { display: flex; gap: 10px; align-items: flex-start; border: 1.5px solid var(--line); border-radius: 12px; background: var(--paper); padding: 10px 12px; }
.px-order .l { flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--soft); font: 700 13px/1 var(--sans); color: var(--accent-deep); }
.px-order .t { flex: 1; font: 400 15px/1.5 var(--sans); }
.px-order .mv { display: flex; flex-direction: column; gap: 4px; }
.px-order .icon-btn { width: 32px; height: 28px; padding: 0; display: grid; place-items: center; }
.px-order .icon-btn svg { width: 18px; height: 18px; }
.px-hiw { font: 400 16px/2.2 var(--serif); margin: 0; }
.px-w { font: inherit; color: var(--ink); background: none; border: 0; border-radius: 4px; padding: 0 2px; cursor: pointer; }
.px-w:hover { background: var(--tint); }
.px-w[aria-pressed="true"] { background: #ffe58a; color: #3d2f00; }
.q.revealed .px-w.bad { box-shadow: inset 0 -2px 0 var(--ok); }
.q.revealed .px-w.bad[aria-pressed="true"] { background: var(--ok-tint); color: var(--ok); }
.q.revealed .px-w[aria-pressed="true"]:not(.bad) { background: var(--bad-tint); color: var(--bad); }
.px-said { font: 700 12px/1 var(--sans); color: var(--ok); background: var(--ok-tint); border-radius: 6px; padding: 2px 5px; }
.px-q .transcript { margin: 4px 16px 10px; }
.px-q .answer { margin: 0; }
.px-q .modelwrap { margin-top: 10px; }
.stask audio, .taskcard audio { display: block; width: 100%; max-width: 520px; margin: 8px 0; }
.taskcard .playonce { font: 600 12.5px/1.3 var(--sans); color: var(--mute); margin: 0; }
@media (max-width: 640px) { .px-passage { margin: 0 10px 10px; padding: 10px 12px; } .px-q .px-body { padding: 8px 10px 4px; } }