.the-bai { display: flex; flex-direction: column; gap: 8px; min-height: 170px; position: relative; overflow: hidden; }
.the-bai .so { font-family: var(--font-tieu-de); font-size: 2.3rem; color: var(--do); line-height: 1; font-weight: 700; }
.the-bai .ten { font-weight: 600; color: var(--navy); flex: 1; }
.the-bai.khoa { opacity: .62; }
.the-bai::after { content: ""; position: absolute; right: -20px; top: -20px; width: 90px; height: 90px; border: 2px solid rgba(140,42,51,.15); border-radius: 50%; }

.muc { border: 1px solid var(--vien); border-radius: var(--bo); background: var(--giay); margin-bottom: 12px; overflow: hidden; }
.muc > summary { list-style: none; cursor: pointer; padding: 14px 18px; display: flex; gap: 12px; align-items: center; font-weight: 600; color: var(--navy); }
.muc > summary::-webkit-details-marker { display: none; }
.muc > summary .ma { font-family: var(--font-tieu-de); color: var(--do); min-width: 52px; }
.muc > summary .dem { margin-left: auto; }
.muc[open] > summary { border-bottom: 1px solid var(--vien); background: var(--kem-2); }
.muc .ds-tu-lieu { padding: 14px 18px; display: grid; gap: 18px; }
.tu-lieu { border-left: 3px solid var(--vien); padding-left: 14px; }
.tu-lieu .da-xem { margin-top: 8px; display: flex; gap: 8px; align-items: center; font-weight: 500; }
.tu-lieu .da-xem input { width: 22px; height: 22px; min-height: 0; }
.nhom-muc { font-family: var(--font-tieu-de); color: var(--navy); margin: 22px 0 10px; font-size: 1.15rem; border-bottom: 2px solid var(--do); padding-bottom: 4px; }

.nhiem-vu { border: 1px solid var(--vien); border-radius: var(--bo); padding: 16px; background: #fff; margin-bottom: 14px; }
.nhiem-vu dl { margin: 0 0 10px; display: grid; grid-template-columns: 110px 1fr; gap: 6px 12px; }
.nhiem-vu dt { font-weight: 700; color: var(--do); }
.nhiem-vu dd { margin: 0; }
@media (max-width: 640px) { .nhiem-vu dl { grid-template-columns: 1fr; } }

/* ----- màn làm bài tự kiểm tra ----- */
#kiem-tra { position: fixed; inset: 0; z-index: 40; background: var(--kem); overflow: auto; -webkit-user-select: none; user-select: none; }
.kt-dau { position: sticky; top: 0; display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--navy); color: #fff; z-index: 2; flex-wrap: wrap; }
.kt-dau .dong-ho { margin-left: auto; font-family: var(--font-tieu-de); font-size: 1.5rem; font-weight: 700; background: rgba(255,255,255,.12); padding: 2px 12px; border-radius: 8px; }
.kt-dau .dong-ho.gap { background: var(--do); }
.kt-than { max-width: 860px; margin: 0 auto; padding: 18px 14px 40px; }
.kt-so-cau { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.kt-so-cau button { min-width: 44px; padding: 4px; background: #fff; color: var(--navy); }
.kt-so-cau button.da-lam { background: #E7EBD5; border-color: var(--olive); }
.kt-so-cau button.dang { background: var(--navy); color: #fff; }
.cau { font-size: 1.08rem; }
.cau .than { font-weight: 600; margin-bottom: 12px; }
.lua-chon { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 2px solid var(--vien); border-radius: 10px; background: #fff; margin-bottom: 10px; cursor: pointer; }
.lua-chon input { width: 24px; height: 24px; min-height: 0; flex: none; margin-top: 2px; }
.lua-chon .chu { font-weight: 700; color: var(--do); min-width: 22px; }
.lua-chon.chon { border-color: var(--navy); background: #EEF2F8; }
.nhan-dinh { border: 2px solid var(--vien); border-radius: 10px; background: #fff; padding: 12px 14px; margin-bottom: 10px; }
.nhan-dinh .chon-ds { display: flex; gap: 10px; margin-top: 10px; }
.nhan-dinh .chon-ds button { flex: 1; background: #fff; color: var(--navy); }
.nhan-dinh .chon-ds button.chon { background: var(--navy); color: #fff; }
.kt-dieu-huong { display: flex; gap: 10px; justify-content: space-between; margin-top: 18px; flex-wrap: wrap; }
.ket-qua-cau { border-left: 5px solid var(--olive); }
.ket-qua-cau.sai { border-left-color: var(--do); }
.dap-an-dung { color: #4B5520; font-weight: 700; }