[hidden] { display: none !important; }

/* TUYỂN DỤNG */
.luoi-vi-tri { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); align-items: start; }
.vt-dau { display: flex; align-items: center; gap: 10px; min-width: 0; margin-bottom: 8px; }
.vt-ten { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.ds-ung-vien { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ung-vien {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ten diem" "chay chay" "nx nx"; gap: 8px 10px; align-items: center;
  padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .025); border: 1px solid var(--vien);
}
.ung-vien.da-nhan { border-color: rgba(111, 227, 164, .35); }
.ung-vien.khong-dat { opacity: .8; }
.uv-ten { grid-area: ten; display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.uv-diem { grid-area: diem; }
.uv-nhan-xet { grid-area: nx; }
.dong-chay { grid-area: chay; display: flex; align-items: center; min-width: 0; }
.tram { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; border: 1px solid var(--vien); background: var(--ink-700); color: var(--mist-500); }
.tram.xong { color: var(--ok); background: rgba(111, 227, 164, .12); border-color: rgba(111, 227, 164, .3); }
.tram.cho { color: var(--warn); background: rgba(242, 180, 106, .12); border-color: rgba(242, 180, 106, .35); }
.tram.loi { color: var(--bad); background: rgba(255, 138, 122, .12); border-color: rgba(255, 138, 122, .35); }
.tram.nhan { color: #1a1205; background: var(--gold); border-color: transparent; }
.tram .bieu-tuong { width: 15px; height: 15px; }
.noi { flex: 1; height: 2px; min-width: 12px; background: var(--ink-600); margin: 0 4px; border-radius: 2px; }
.noi.xong { background: var(--ok); opacity: .7; }
@media (min-width: 640px) {
  .ung-vien { grid-template-columns: minmax(0, 1fr) 170px auto; grid-template-areas: "ten chay diem" "nx nx nx"; }
}

/* ĐÁNH GIÁ */
.lich { display: flex; align-items: center; gap: 12px; width: fit-content; max-width: 100%; padding-right: 22px; }
.lich-icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(124, 196, 214, .12); color: var(--signal-strong); flex: none; }
.lich-icon .bieu-tuong { width: 22px; height: 22px; }
.lich > div { display: flex; flex-direction: column; min-width: 0; }
.lich-gio { font-size: 18px; }
.trong-lich { color: var(--mist-500); gap: 10px; }
.bang-diem { list-style: none; margin: 0; padding: 6px 10px; display: grid; }
.hang-bao { border-bottom: 1px solid var(--vien); }
.hang-bao:last-child { border-bottom: 0; }
.hang-diem {
  display: grid; align-items: center; gap: 10px; width: 100%; min-height: 52px; padding: 8px 2px; background: none; border: 0; text-align: left;
  grid-template-columns: 30px minmax(0, 1fr) 24px 26px 24px;
  grid-template-areas: "av ten dk dh hd" "av thanh thanh thanh thanh";
}
.hang-diem > .avatar { grid-area: av; }
.hang-diem > .hd-ten { grid-area: ten; font-weight: 600; }
.hang-diem > .thanh-diem { grid-area: thanh; }
.hang-diem > .diem { grid-area: dh; }
.hang-diem > .dat-khong { grid-area: dk; }
.hang-diem > .huy-hieu { grid-area: hd; }
.hang-diem > .diem { align-self: center; }
.hang-diem:hover { background: rgba(255, 255, 255, .02); }
.hang-diem.khong-dat .hd-ten { color: var(--warn); }
@media (min-width: 640px) {
  .hang-diem { grid-template-columns: 30px minmax(110px, 200px) minmax(0, 1fr) 36px 24px 24px; grid-template-areas: "av ten thanh dh dk hd"; }
}
.hang-chi-tiet { padding: 4px 4px 12px 40px; display: grid; gap: 6px; }
.hm { display: grid; grid-template-columns: minmax(0, 1fr) 90px 44px; gap: 8px; align-items: center; font-size: 12.5px; color: var(--mist-300); }
.hm-thanh { height: 5px; border-radius: 5px; background: var(--ink-700); overflow: hidden; }
.hm-thanh i { display: block; height: 100%; background: var(--signal); border-radius: 5px; }
.hm-nx { grid-column: 1 / -1; }
.cac-dot { display: grid; gap: 10px; }
.dot { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 10px; align-items: center; }
.dot .dai { display: flex; height: 10px; border-radius: 6px; overflow: hidden; background: var(--ink-700); gap: 2px; }
.dot .dai i { display: block; height: 100%; }
.dot .dai .d { background: var(--ok); } .dot .dai .k { background: var(--warn); }
.dot b { text-align: right; }
.barem-dau { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.barem-dau b { flex: 1; min-width: 80px; }
.dai-trong-so { display: flex; gap: 2px; height: 8px; border-radius: 6px; overflow: hidden; margin-bottom: 10px; }
.dai-trong-so i { display: block; height: 100%; background: hsl(calc(190 + var(--i) * 38) 55% 62%); }
.tieu-chi { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tieu-chi li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 13px; }
.tieu-chi .khuon { width: 10px; height: 10px; border-radius: 3px; background: hsl(calc(190 + var(--i) * 38) 55% 62%); }