/* [10/11] Tab Kaizen (/kaizen) — hai dải chuỗi + bảng bóc tách. Cấm cuộn ngang: lưới minmax(0,…), dải gói dòng, bảng gập theo @container. Chữ có dấu dùng phông chữ, số dùng phông số.
   Màu: cam = ô đang mở · xanh/hồng đỏ CHỈ ở cột tách hẳn trung bình (lên/xuống) · còn lại trung tính · nét đứt = chưa chín (số là sàn). */
/* [11/11] thanh chọn kỳ + chủ (dời từ CSS màn Tài chính đã khai tử, nguyên kiểu) */
.kz-thanh-chon { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-width: 0; } /* khác .kz-thanh (thanh ngang bảng bóc tách) */
.kz-chon-chu { min-width: 0; max-width: 100%; width: auto; flex: 0 1 240px; }
.kz-ky { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.kz-ky .wow-nut.dang { background: var(--wow-cam-mo); border-color: var(--wow-cam-sang); color: var(--wow-cam-sang); }
@media (max-width: 640px) {
  .kz-ky { margin-left: 0; width: 100%; flex-wrap: nowrap; }
  .kz-ky .wow-nut { flex: 1 1 0; padding-inline: 4px; min-width: 0; }
  .kz-chon-chu { flex: 1 1 100%; }
}
.kz-khung { container-type: inline-size; min-width: 0; display: grid; gap: 12px; }
.kz-nhan { margin: 6px 0 0; font: 600 14px var(--wow-font-chu); color: var(--wow-chu-2); }
.kz-nhan:first-child { margin-top: 0; }
.kz-dai { --kz-n: 5; display: grid; grid-template-columns: repeat(var(--kz-n), minmax(0, 1fr)); gap: 14px; min-width: 0; }
.kz-o { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; gap: 4px 8px; min-width: 0; margin: 0; padding: 10px 12px; text-align: left;
  border: 1px solid var(--wow-vien); border-radius: 10px; background: var(--wow-mat-2); color: var(--wow-chu); font: inherit; }
button.kz-o { cursor: pointer; }
button.kz-o:hover { filter: brightness(1.25); }
.kz-o.kz-mo { border-color: var(--wow-cam-sang); background: var(--wow-cam-mo); }
.kz-o.kz-chua-chin { border-style: dashed; }
.kz-o:not(:first-child)::before { content: "→"; position: absolute; left: -13px; top: 50%; transform: translateY(-50%); width: 12px; text-align: center; color: var(--wow-chu-3); font: 12px var(--wow-font-chu); }
.kz-ten-khau { grid-column: 1 / -1; font: 12.5px/1.3 var(--wow-font-chu); color: var(--wow-chu-2); min-width: 0; overflow-wrap: anywhere; }
.kz-so-lon { grid-column: 1 / -1; font: 400 clamp(22px, 2.4vw, 30px)/1.1 var(--wow-font-so); font-variant-numeric: tabular-nums; min-width: 0; overflow-wrap: anywhere; }
.kz-tm { font: 11.5px var(--wow-font-so); color: var(--wow-chu-3); min-width: 0; overflow-wrap: anywhere; }
.kz-xh { font: 12px var(--wow-font-chu); text-align: right; }
.kz-tang { color: var(--wow-tot); }
.kz-giam { color: var(--wow-xau); }
.kz-phang { color: var(--wow-chu-3); }
.kz-chua-chin .kz-xh { opacity: .45; }
/* bóc tách */
.kz-boc { display: grid; gap: 8px; min-width: 0; padding-top: 4px; border-top: 1px solid var(--wow-vien-nhat); }
.kz-tab { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 10px; }
.kz-tab-nut { padding: 5px 12px; border: 1px solid var(--wow-vien); border-radius: 8px; background: transparent; color: var(--wow-chu-2); cursor: pointer; font: 13px var(--wow-font-chu); }
.kz-tab-nut:hover { filter: brightness(1.25); }
.kz-tab-nut.dang { background: var(--wow-cam-mo); border-color: var(--wow-cam-sang); color: var(--wow-cam-sang); }
.kz-bang { display: grid; min-width: 0; }
.kz-dong { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 3fr) 76px minmax(0, 120px); gap: 4px 12px; align-items: center; padding: 6px 4px; border-top: 1px solid var(--wow-vien-nhat); min-width: 0; }
.kz-dong > * { min-width: 0; }
.kz-it-mau { opacity: .5; }
.kz-nhom { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 13.5px var(--wow-font-chu); }
.kz-thanh { position: relative; display: block; height: 10px; border-radius: 3px; background: rgb(var(--wow-quet-rgb) / .08); }
.kz-day { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: var(--wow-chu-3); opacity: .75; }
.kz-day.kz-len { background: var(--wow-tot); opacity: 1; }
.kz-day.kz-xuong { background: var(--wow-xau); opacity: 1; }
.kz-vach-tb { position: absolute; top: -3px; bottom: -3px; width: 0; border-left: 1px dashed var(--wow-chu); opacity: .8; }
.kz-pt { font: 600 13.5px var(--wow-font-so); text-align: right; white-space: nowrap; }
.kz-dong .kz-tm { text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@container (max-width: 720px) {
  .kz-dai { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .kz-o:not(:first-child)::before { display: none; }
  .kz-o:nth-child(even)::before { display: block; }
  .kz-dong { grid-template-columns: minmax(0, 1fr) auto auto; row-gap: 3px; }
  .kz-thanh { grid-column: 1 / -1; grid-row: 2; }
  .kz-pt { grid-column: 2; grid-row: 1; }
  .kz-dong .kz-tm { grid-column: 3; grid-row: 1; min-width: 70px; }
}
/* [10/11 P0] khối Lỗi theo khâu + Sổ vòng. Cấm cuộn ngang: dòng là lưới minmax(0,…), chip gói dòng, tên cắt "…", gập theo @container. Số dùng phông số, chữ có dấu dùng phông chữ. */
.kz-o.kz-that::after { content: ""; position: absolute; right: 8px; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--wow-cam-sang); }
.kz-loi { display: grid; gap: 8px; min-width: 0; }
.kz-loi-dong { display: grid; grid-template-columns: minmax(0, 1.1fr) 64px minmax(0, 110px) minmax(0, 3fr); gap: 4px 12px; align-items: center; margin: 0; padding: 6px 4px; border: 0; border-top: 1px solid var(--wow-vien-nhat);
  background: transparent; color: var(--wow-chu); text-align: left; font: inherit; min-width: 0; }
button.kz-loi-dong { cursor: pointer; }
button.kz-loi-dong:hover { filter: brightness(1.25); }
.kz-loi-dong > * { min-width: 0; }
.kz-chips { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.kz-chip { display: inline-flex; align-items: baseline; gap: 6px; max-width: 100%; min-width: 0; padding: 2px 8px; border: 1px solid var(--wow-vien); border-radius: 8px; font: 12px var(--wow-font-chu); color: var(--wow-chu-2); }
.kz-chip-ten { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kz-chip b { font: 600 12px var(--wow-font-so); color: var(--wow-chu); }
.kz-chip i { font-style: normal; color: var(--wow-xau); }
.kz-chip-tang { border-color: var(--wow-xau); }
.kz-chip-mo { opacity: .5; border-style: dashed; }
.kz-chip-them { color: var(--wow-chu-3); }
.kz-chua-do { padding-top: 6px; border-top: 1px solid var(--wow-vien-nhat); }
.kz-vong-dong { display: grid; grid-template-columns: 86px minmax(0, 1fr) 20px; gap: 4px 12px; align-items: start; padding: 6px 4px; border-top: 1px solid var(--wow-vien-nhat); min-width: 0; }
.kz-vong-dong > * { min-width: 0; }
.kz-gio { font: 12px var(--wow-font-so); color: var(--wow-chu-3); white-space: nowrap; }
.kz-viec { font: 13px/1.35 var(--wow-font-chu); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
@container (max-width: 720px) {
  .kz-loi-dong { grid-template-columns: minmax(0, 1fr) auto auto; row-gap: 4px; }
  .kz-loi-dong .kz-chips { grid-column: 1 / -1; grid-row: 2; }
  .kz-loi-dong .kz-pt { grid-column: 2; grid-row: 1; }
  .kz-loi-dong .kz-tm { grid-column: 3; grid-row: 1; min-width: 70px; text-align: right; }
}
/* [10/11 P1] khối Thí nghiệm: icon · tên · nhãn · số mẫu — lưới minmax(0,…), tên cắt "…" */
.kz-tn-dong { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto 64px; gap: 4px 12px; align-items: center; padding: 6px 4px; border-top: 1px solid var(--wow-vien-nhat); min-width: 0; }
.kz-tn-dong > * { min-width: 0; }
.kz-tn-dong .kz-tm { text-align: right; }
.kz-chip-tot { border-color: var(--wow-tot); }
@container (max-width: 720px) {
  .kz-tn-dong { grid-template-columns: 20px minmax(0, 1fr) auto; }
  .kz-tn-dong .kz-tm { display: none; }
}
