/* aptis.css — Aptis
   (tách từ index.html; thứ tự nạp các file CSS phải giữ như trong index.html) */
/* ---------- Aptis practice ---------- */
#aptis{height:100%;overflow:auto;background:var(--soft)}
.ap-hero{background:linear-gradient(135deg,#2b2d6e,#4a3f9a)}
.ap-secs{grid-template-columns:repeat(5,1fr)}
.ap-exam .ap-bar{background:#2b2d6e}
.ap-strip{background:#ecebf7;border-color:#d7d4ee;color:#2b2d6e}
.ap-main{padding-bottom:90px}
.ap-foot{position:sticky;bottom:0;display:flex;align-items:center;gap:10px;background:#fff;border-top:1px solid #d7d4ee;padding:10px 14px}
.ap-btn{border:1px solid #2b2d6e;background:#fff;color:#2b2d6e;font-weight:700;border-radius:4px;padding:8px 16px;cursor:pointer;font-size:14px}
.ap-btn.pri{background:#2b2d6e;color:#fff}
.ap-btn[disabled]{opacity:.4;cursor:default}
.ap-dots{flex:1;display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.ap-dot{min-width:28px;height:28px;border:1px solid #c9c5e6;background:#fff;border-radius:4px;font-size:12px;cursor:pointer;color:#555}
.ap-dot.done{background:#d9d5f3;border-color:#9c94d6;color:#2b2d6e}
.ap-dot.cur{outline:2px solid #2b2d6e;font-weight:700}
.ap-box{max-width:860px;margin:0 auto}
.ap-box h3{margin:0 0 12px}
.ap-num{font-weight:700;color:#2b2d6e;margin:0}
.ap-gap{display:inline-block;min-width:70px;border-bottom:2px solid #2b2d6e;color:transparent}
.ap-sel{font:inherit;padding:4px 8px;border:1px solid #9c94d6;border-radius:4px;background:#fff;max-width:100%}
.ap-vt{border-collapse:collapse;width:100%}
.ap-vt td{padding:8px 6px;border-bottom:1px solid #eee}
.ap-w{font-weight:700;width:40%}
.ap-letter{background:#fff;border:1px solid #ddd;border-radius:8px;padding:18px 22px;line-height:2.3}
.ap-ex{display:inline-block;border:1px solid #9c94d6;background:#ecebf7;border-radius:4px;padding:0 8px;font-weight:700}
.ap-order{padding-left:26px;display:grid;gap:8px}
.ap-order li.fixed{background:#ecebf7;border-radius:6px;padding:8px 12px}
.ap-order li.empty{border:1px dashed #9c94d6;border-radius:6px;padding:8px 12px;color:#aaa}
.ap-chip{font:inherit;text-align:left;width:100%;border:1px solid #9c94d6;background:#fff;border-radius:6px;padding:8px 12px;cursor:pointer}
.ap-chip.on{background:#f5f4fc}
.ap-pool{display:grid;gap:8px;margin-top:10px}
.ap-person{border-left:3px solid #9c94d6;padding:4px 0 4px 12px;margin-bottom:14px}
.ap-person p{margin:4px 0 0}
.ap-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 0;border-bottom:1px solid #eee;flex-wrap:wrap}
.ap-row>span{flex:1;min-width:220px}
.ap-long .ap-para{margin-bottom:18px}
.ap-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:700;color:#2b2d6e}
.ap-player{display:flex;align-items:center;gap:12px;background:#f5f4fc;border:1px solid #d7d4ee;border-radius:10px;padding:10px 14px;margin:6px 0 14px;min-width:240px}
.ap-row .ap-player{margin:0}
.ap-player small{display:block;color:var(--muted)}
.ap-play{width:44px;height:44px;border-radius:50%;border:0;background:#2b2d6e;color:#fff;font-size:18px;cursor:pointer}
.ap-play.on{background:#b3261e}
.ap-play[disabled]{background:#b9b5d9;cursor:default}
.ap-in{font:inherit;padding:6px 10px;border:1px solid #b9c6d3;border-radius:4px;width:240px;max-width:100%}
.ap-ta{min-height:0}
.tf-wc.over{color:#b3261e;font-weight:700}
.ap-chat{margin-bottom:16px}
.ap-chat .tf-bubble{margin-bottom:8px}
.ap-speak{max-width:760px;margin:0 auto;text-align:center}
.ap-img{margin:0 auto 14px;max-width:420px}
.ap-img svg{width:100%;height:auto;border-radius:8px;display:block}
.ap-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ap-two .ap-img{max-width:none}
.ap-say{font-size:1.05em}
.ap-p4q{text-align:left;max-width:560px;margin:0 auto 10px}
.ap-prep{font-size:20px;color:#2b2d6e;margin:16px 0 4px}
@media (max-width:760px){.ap-secs{grid-template-columns:1fr 1fr}.ap-two{grid-template-columns:1fr}.ap-dots{display:none}}