:root{--xanh:#1b4a82;--xanh2:#2563a8;--cam:#e56b26;--nen:#f5f7fb;--the:#fff;--chu:#1f2a37;--mo:#64748b;--vien:#e3e8f0;--ok:#16a34a;--bo:14px}
*{box-sizing:border-box}
html,body{margin:0;background:var(--nen);color:var(--chu);font:16px/1.55 "Be Vietnam Pro",system-ui,sans-serif}
a{color:var(--xanh2)}
button{font:inherit;cursor:pointer}
.dau{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--vien);display:flex;align-items:center;gap:12px;padding:10px 16px}
.dau img{height:34px}
.dau .ten{font-weight:800;color:var(--xanh);line-height:1.15;font-size:15px}
.dau .ten small{display:block;color:var(--mo);font-weight:600;font-size:12px}
.dau .phai{margin-left:auto;display:flex;gap:8px;align-items:center}
.nut{border:0;border-radius:10px;padding:10px 16px;font-weight:700;background:var(--xanh);color:#fff}
.nut.cam{background:var(--cam)}.nut.nhat{background:#eef3fa;color:var(--xanh)}.nut.ok{background:var(--ok)}
.nut:disabled{opacity:.5;cursor:default}
.nut.to{font-size:18px;padding:14px 22px;border-radius:14px}
main{max-width:980px;margin:0 auto;padding:16px}
.the{background:var(--the);border:1px solid var(--vien);border-radius:var(--bo);padding:18px;margin:14px 0}
h1{font-size:24px;margin:.2em 0;color:var(--xanh)}h2{font-size:19px;margin:.1em 0 .6em;color:var(--xanh)}h3{font-size:16px;margin:.6em 0 .3em}
.mo{color:var(--mo)}
.vao{max-width:440px;margin:30px auto}
.vao label{display:block;font-weight:600;margin:10px 0 4px}
input,select,textarea{width:100%;font:inherit;padding:11px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff}
.tab2{display:flex;gap:6px;margin-bottom:10px}.tab2 button{flex:1;padding:10px;border:1px solid var(--vien);background:#fff;border-radius:10px;font-weight:700;color:var(--mo)}
.tab2 button.on{background:var(--xanh);color:#fff;border-color:var(--xanh)}
.baoloi{color:#b91c1c;font-weight:600;min-height:1.4em;margin-top:8px}
.tien{height:12px;background:#e7edf5;border-radius:99px;overflow:hidden}.tien i{display:block;height:100%;background:linear-gradient(90deg,var(--cam),#f59e0b);border-radius:99px}
.chao{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.chao .so{font-size:34px;font-weight:800;color:var(--cam)}
.cap{border-left:6px solid var(--m);}
.cap .dauc{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cap .huy{background:var(--m);color:#fff;border-radius:10px;padding:4px 12px;font-weight:800}
.ds-bai{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px;margin-top:12px}
.o-bai{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;background:#fafcff;border:1px solid var(--vien);border-radius:12px;padding:10px}
.o-bai:hover{border-color:var(--m)}
.o-bai img{width:46px;height:62px;object-fit:cover;border-radius:6px;border:1px solid var(--vien);background:#eee}
.o-bai .t{flex:1;font-size:14px;line-height:1.3}.o-bai .t b{display:block;color:var(--m)}
.tick{width:26px;height:26px;border-radius:50%;border:2px solid #cbd5e1;display:grid;place-items:center;flex:none;font-size:14px;color:#fff}
.tick.on{background:var(--ok);border-color:var(--ok)}
.bai-dau{border-top:6px solid var(--m)}
.nhan{display:inline-block;background:var(--m);color:#fff;border-radius:8px;padding:2px 10px;font-weight:800;font-size:13px}
.muc{list-style:none;padding:0;margin:0}.muc li{padding:6px 0 6px 30px;position:relative}.muc li:before{content:"🎯";position:absolute;left:0}
.ct{font-size:22px;font-weight:800;color:var(--cam);background:#fff6ef;border:2px dashed #f4b58f;border-radius:12px;padding:10px 14px;text-align:center;margin:8px 0}
.video{position:relative;padding-top:56.25%;border-radius:12px;overflow:hidden;background:#000}.video>*{position:absolute;inset:0;width:100%;height:100%}
.btd{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.btd button{border:1px solid var(--vien);background:#fff;border-radius:99px;padding:6px 14px;font-weight:700;color:var(--xanh)}.btd button.on{background:var(--xanh);color:#fff}
.bt{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:16px;align-items:start}
.bt-phep{grid-column:1/-1;font-size:24px;font-weight:800;text-align:center;color:var(--xanh)}
.bt-ve svg{width:100%;max-height:330px}
.bt-chu{background:#f8fafc;border-radius:12px;padding:12px;min-height:110px}
.bt-nut{grid-column:1/-1;display:flex;justify-content:center;align-items:center;gap:14px}
.bt-nut button{border:0;border-radius:10px;padding:10px 18px;font-weight:800;background:var(--xanh);color:#fff}.bt-nut button:disabled{opacity:.35}
.tien-trinh{counter-reset:b;list-style:none;padding:0;margin:0}
.tien-trinh li{counter-increment:b;position:relative;padding:8px 0 8px 46px;border-bottom:1px dashed var(--vien)}
.tien-trinh li:before{content:counter(b);position:absolute;left:0;top:8px;width:32px;height:32px;border-radius:50%;background:var(--m,var(--xanh));color:#fff;display:grid;place-items:center;font-weight:800}
.loi{width:100%;border-collapse:collapse}.loi td{border-top:1px solid var(--vien);padding:8px;vertical-align:top}.loi td:first-child{width:42%;font-weight:600;color:#b45309}
.trang{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.trang button{border:1px solid var(--vien);background:#fff;border-radius:10px;padding:4px}.trang img{width:100%;display:block;border-radius:6px}
.trang span{font-size:12px;color:var(--mo)}
.xem-to{position:fixed;inset:0;background:rgba(10,20,40,.92);z-index:50;display:flex;flex-direction:column}
.xem-to .anh{flex:1;overflow:auto;display:flex;justify-content:center;align-items:flex-start;padding:10px}
.xem-to img{max-width:min(100%,900px)}
.xem-to .thanh{display:flex;gap:10px;justify-content:center;padding:10px}
.bang{border-collapse:collapse;width:100%;font-size:15px;text-align:center}
.bang th,.bang td{border:1px solid #cbd5e1;padding:5px 2px}
.bang th{background:var(--m,var(--xanh));color:#fff}
.bang td.kq{height:30px;background:#fffbea}
.bang .da{color:var(--ok);font-weight:800}
.chan{position:sticky;bottom:0;background:linear-gradient(transparent,var(--nen) 30%);padding:18px 0 10px;display:flex;gap:10px;justify-content:space-between;align-items:center}
.phieu-ds li{list-style:none;padding:6px 0;border-bottom:1px solid var(--vien);display:flex;gap:10px;align-items:center}
.phieu-ds{padding:0;margin:0}
.luoi2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
canvas.cn{width:100%;height:auto;border-radius:8px;box-shadow:0 4px 18px rgba(0,0,0,.12)}
.an{display:none!important}
.chu-nho{font-size:13px}
@media (max-width:640px){.bt{grid-template-columns:1fr}.bt-ve svg{max-height:260px}.luoi2{grid-template-columns:1fr}h1{font-size:21px}.dau .ten small{display:none}.bang{font-size:13px}}
@media print{body *{visibility:hidden}.in-duoc,.in-duoc *{visibility:visible}.in-duoc{position:absolute;left:0;top:0;width:100%;border:0}.in-duoc .nut,.in-duoc .btd{display:none}}