/* ===== Bàn việc gộp — "Việc của tôi" theo ghế (web/banviec.js, 27/09/2026) =====
   Không viền; mảng phân bằng tông nền; ghế đang chọn là viên tím nhạt, nhóm "Đội của tôi" tách bằng một khoảng. 390px:
   dải ghế cuộn ngang, không xuống dòng (một hàng viên là đọc được "tôi đang ở ghế nào"). */
.bv { display: flex; flex-direction: column; gap: 12px; }
.bv-dau { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.bv-dau h2 { margin: 0; font-size: 20px; }
.bv-ghe { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.bv-ghe::-webkit-scrollbar { display: none; }
.bv-ghe-nut { flex: none; display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; position: relative;
  min-height: 44px; padding: 7px 14px; border: 0; border-radius: 14px; background: var(--nen); color: var(--chu); cursor: pointer;
  text-align: left; font: inherit; }
.bv-ghe-nut b { font-size: 14px; font-weight: 600; white-space: nowrap; }
.bv-ghe-nut small { font-size: 11.5px; color: var(--chu3); white-space: nowrap; }
.bv-ghe-nut.chon { background: var(--nhan-nhat); color: var(--nhan); }
.bv-ghe-nut.chon small { color: var(--nhan); opacity: .8; }
.bv-ghe-nut.doi { margin-left: 8px; }
.bv-ghe-nut .dem { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
  display: inline-grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--canh); color: #fff; }
.bv-than { min-height: 120px; }
.bv-cho { display: flex; flex-direction: column; gap: 14px; }
.bv-cho-nhom h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 14px; color: var(--chu2); }
.bv-cho-nhom h3 .dem { font-size: 11.5px; padding: 1px 8px; border-radius: 999px; background: var(--nen); color: var(--chu2); }
.bv-cho-dong { display: flex; align-items: center; gap: 10px; justify-content: space-between; min-height: 48px; padding: 10px 14px;
  margin-bottom: 6px; border-radius: 12px; background: var(--the); cursor: pointer; }
.bv-cho-dong:hover { background: var(--nhan-nhat); }
.bv-cho-dong b { display: block; font-size: 14px; font-weight: 600; }
.bv-cho-dong small { display: block; font-size: 12.5px; color: var(--chu3); margin-top: 2px; }
.bv-cho-dong.gap { background: color-mix(in srgb, var(--loi) 8%, var(--the)); }
.bv-cho-toi { color: var(--chu3); font-size: 20px; }
@media (max-width: 640px) {
  .bv-dau h2 { font-size: 18px; }
  .bv-ghe-nut { padding: 6px 12px; }
}
/* Hiệu suất của tôi — lưới ô số, không viền; ô nền trắng trên mảng nền */
.hs-toi { margin-bottom: 18px; }
.hs-toi h3 { margin: 0 0 8px; font-size: 15px; }
.hs-toi-luoi { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.hs-toi-o { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 14px; background: var(--the); }
.hs-toi-o b { font-size: 20px; font-weight: 700; }
.hs-toi-phu { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.hs-xu.tot { color: var(--tot); } .hs-xu.xau { color: var(--loi); }
@media (max-width: 640px) { .hs-toi-luoi { grid-template-columns: 1fr 1fr; } }
