:root{--navy:#12365d;--blue:#1475e8;--sky:#edf7ff;--line:#d7e5f3;--text:#16375d;--muted:#6e86a4;--gold:#d68c00;--green:#16835b;--red:#d84646}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f5f9fd;color:var(--text)}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}.loading{padding:60px;text-align:center;color:var(--muted)}.landing{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 5% 5%,#d9f8fa 0 15%,transparent 15%),radial-gradient(circle at 94% 93%,#fff2c9 0 14%,transparent 14%)}.landing-card{width:min(870px,92vw);background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px 70px 52px;text-align:center}.brand-logo{width:120px;height:120px;object-fit:contain}.landing h1,.page-title{font-size:34px;margin:12px 0 5px}.subtitle{color:var(--muted);margin:0 0 30px}.roles{display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:left}.role{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff}.role.active{border:2px solid var(--blue);background:#f7fbff}.role h2{margin:8px 0}.icon{color:var(--blue);font-size:27px}.field{display:grid;gap:7px;margin:11px 0;font-weight:650}.field input,.field select,.field textarea,.score{border:1px solid #bfd5eb;border-radius:9px;padding:11px;background:#fff;color:var(--text);width:100%}.btn{padding:12px 18px;border-radius:9px;background:var(--blue);color:#fff;font-weight:700}.btn.secondary{background:#e9f2fb;color:var(--text)}.btn.gold{background:#fff;border:1px solid #e8a400;color:#ad7000}.btn.danger{background:var(--red)}.shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.side{background:#064574;color:#eaf6ff;padding:20px 14px;display:flex;flex-direction:column}.side .brand{display:grid;place-items:center;background:#fff;border-radius:17px;padding:8px;margin:0 10px 22px}.side .brand img{width:132px;height:115px;object-fit:contain}.nav{display:grid;gap:8px}.nav button{padding:14px;text-align:left;background:transparent;color:#d9edff;border-radius:10px;font-weight:700}.nav button.on{background:#087fd1;color:#fff}.side .logout{margin-top:auto;border-top:1px solid #4c7da1;padding-top:16px}.main{padding:28px 32px;max-width:1450px;width:100%;margin:auto}.top{display:flex;justify-content:space-between;gap:16px;align-items:center}.filters{display:flex;gap:10px;flex-wrap:wrap}.filters select{padding:10px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--text)}.tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin:20px 0}.tabs button{padding:12px 2px;background:transparent;color:var(--muted);font-weight:700}.tabs button.on{color:var(--blue);border-bottom:3px solid var(--blue)}.stats{display:grid;grid-template-columns:repeat(3,200px) 1fr;gap:18px}.stat,.panel,.hero{background:#fff;border:1px solid var(--line);border-radius:14px}.stat{padding:20px}.stat b{display:block;font-size:34px}.stat span{color:var(--muted);font-weight:700}.star{padding:22px;background:#fffdf7;border-color:#f0c65d}.star strong{display:block;color:#916108;font-size:18px;margin-bottom:9px}.star .medal{font-size:30px;margin-right:10px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;margin-top:18px}.panel-title{padding:17px 21px;font-weight:800;font-size:19px;border-bottom:1px solid var(--line)}table{width:100%;border-collapse:collapse;background:#fff}th{background:#eef7ff;text-align:left;font-size:14px;padding:13px 12px}td{padding:16px 12px;border-top:1px solid var(--line);vertical-align:middle}.badge{display:inline-block;padding:7px 11px;border-radius:30px;font-weight:750;font-size:13px}.badge.blue{color:var(--blue);background:#e7f1ff}.badge.green{color:var(--green);background:#e1f6ec}.badge.gold{color:#a86b00;background:#fff5d6}.badge.red{color:var(--red);background:#fde6e6}.chart{padding:20px}.chart svg{width:100%;height:180px}.form-header{padding:18px;background:#eafaff;border:1px solid #ccecf2;border-radius:13px;display:grid;grid-template-columns:1fr 1fr 180px;gap:18px;align-items:end;margin:20px 0}.evaluation th:nth-child(2){width:27%}.evaluation th:last-child{width:38%}.evaluation td:nth-child(3),.evaluation td:nth-child(4),.evaluation td:nth-child(5){text-align:center}.score{max-width:100px;text-align:center;font-weight:750}.guidance{color:var(--muted);line-height:1.45;font-size:14px}.footerbar{display:flex;align-items:center;justify-content:space-between;background:#eaf7ff;border-radius:12px;padding:16px 18px;margin-top:18px}.total{background:#fff7df;border:1px solid #f3d68d;border-radius:10px;padding:11px 22px;text-align:center;color:#a36900}.total b{display:block;font-size:24px}.notice{color:#2870a9}.hidden{display:none!important}.toast{position:fixed;right:22px;bottom:22px;background:#183e66;color:#fff;padding:14px 20px;border-radius:10px;box-shadow:0 6px 25px #001b3b44}.drawer{position:fixed;inset:0;display:flex;justify-content:flex-end;background:#00152c45;z-index:3}.drawer-content{width:min(480px,100%);overflow:auto;background:#fff;padding:24px;box-shadow:-10px 0 30px #00152c22}.drawer-head{display:flex;justify-content:space-between;align-items:center}.drawer-head button{background:transparent;font-size:28px;color:var(--muted)}.type-switch{display:flex;gap:10px}.type-switch button{flex:1;padding:12px;border:1px solid var(--line);border-radius:9px;font-weight:800;background:#fff}.type-switch .reward{color:var(--gold);border-color:#f0b336}.type-switch .violation{color:var(--red);border-color:#f3b4b4}.record-actions{display:flex;gap:8px}.print-sheet{max-width:850px;margin:20px auto;background:#fff;padding:50px;border:1px solid var(--line)}.print-sheet h2{text-align:center}.preview-grid{display:grid;gap:20px;margin-top:30px}.preview-grid p{line-height:1.6;border-bottom:1px solid #d9e3ec;padding-bottom:12px}.empty{padding:35px;text-align:center;color:var(--muted)}@media(max-width:950px){.shell{display:block}.side{position:sticky;top:0;z-index:2;display:flex;flex-direction:row;align-items:center;overflow:auto;padding:8px}.side .brand{margin:0;padding:2px}.side .brand img{width:68px;height:48px}.nav{display:flex}.nav button{white-space:nowrap;padding:10px}.side .logout{margin:0 0 0 auto;border:0;padding:0}.main{padding:18px}.top,.footerbar{align-items:flex-start;flex-direction:column}.stats,.layout{grid-template-columns:1fr}.form-header{grid-template-columns:1fr}.evaluation{display:block;overflow-x:auto}.landing-card{padding:25px}.roles{grid-template-columns:1fr}}@media print{.side,.top,.tabs,.btn,.footerbar{display:none!important}.main{padding:0}.print-sheet{border:0;margin:0;max-width:none}.shell{display:block}}
.guidance{text-align:left!important}.field input,.field select,.field textarea{font-weight:400!important;color:#111!important}.side .logout button{width:100%;padding:11px 14px;border-radius:9px;background:#fff;color:#12365d;font-weight:750;text-align:left}.drawer{align-items:center;justify-content:center;padding:24px}.drawer-content{width:min(760px,100%);max-height:calc(100vh - 48px);border-radius:16px;box-shadow:0 16px 48px #00152c44}.modal-note{background:#f1f8ff;border-radius:8px;padding:12px;color:#426985}

/* Màn hình tự đánh giá: giữ vùng đầu trang gọn và dồn phần cuộn vào bảng. */
.side .logout{position:fixed;left:14px;bottom:18px;width:232px;margin:0;border:0;padding:0;z-index:4}
.self-evaluation-page{height:100vh;overflow:hidden;padding-top:18px;padding-bottom:18px;display:flex;flex-direction:column}
.self-evaluation-page>.top{min-height:68px;flex:0 0 68px;align-items:center}
.self-evaluation-page .page-title{font-size:30px;margin:0 0 2px}
.self-evaluation-page .subtitle{margin:0}
.self-evaluation-page .form-header{margin:10px 0;padding:12px 20px;min-height:68px;flex:0 0 auto}
.self-evaluation-page #selfForm{min-height:0;display:flex;flex:1;flex-direction:column}
.self-evaluation-page .eval-scroll{min-height:0;flex:1;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff}
.self-evaluation-page .evaluation thead th{position:sticky;top:0;z-index:2;box-shadow:0 1px 0 var(--line)}
.self-evaluation-page .footerbar{flex:0 0 auto;margin-top:10px;padding:10px 16px}
.self-score-header{margin-left:auto;padding:8px 18px;border-radius:13px;background:#edf8ff}
.self-score-header .total{padding:7px 18px;font-size:12px}
.self-score-header .total b{font-size:25px}
.self-evaluation-page .footerbar>.total{display:none}
@media(max-width:950px){.side .logout{position:static;width:auto;margin-left:auto}.self-evaluation-page{height:auto;min-height:100vh;overflow:visible}.self-evaluation-page>.top{min-height:0;flex-basis:auto}.self-score-header{margin:8px 0 0}.self-evaluation-page .eval-scroll{overflow:auto;max-height:55vh}.self-evaluation-page .form-header{min-height:0}}

/* Pop-up đánh giá và bảng thành tích. */
.drawer-content{overflow:hidden}
/* Hộp thoại thường (tạo/sửa ghi nhận, nhân sự, nhập Excel) phải cuộn được.
   Dòng overflow:hidden ngay trên chỉ dành cho hai hộp thoại tự lo phần cuộn
   bên trong là Chấm đánh giá và Biên bản vi phạm. */
.drawer-content:not(:has(#assessForm)):not(:has(.minute-dialog)){overflow:auto}
.drawer-content:has(#assessForm){display:flex;flex-direction:column}
.drawer-content:has(#assessForm) #assessForm{overflow:auto;min-height:0;padding-right:4px}
.drawer-content:has(#assessForm) .eval-scroll{overflow:visible;border:0}
.drawer-content:has(#assessForm) input[type=number]{appearance:textfield;-moz-appearance:textfield}
.drawer-content:has(#assessForm) input[type=number]::-webkit-inner-spin-button,.drawer-content:has(#assessForm) input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.record-actions{align-items:center;justify-content:flex-end}
.record-action{width:116px;min-width:116px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center}
.record-edit{width:42px;min-width:42px;height:48px;border:0;border-radius:9px;background:#e9f2fb;color:var(--text);font-size:17px;font-weight:800}

/* Giữ nguyên PNG logo gốc; chỉ mở rộng vùng hiển thị theo đúng tỷ lệ ảnh. */
.side{background:#3d4a5c}
.nav button{color:#edf2f7}
.nav button.on{background:#607080;color:#fff}
.side .brand{margin:0 4px 26px;padding:10px;background:#fff;border-radius:18px}
.side .brand img{width:210px;height:155px;object-fit:contain;display:block}
.side .logout{border-top-color:#667587}
.side .logout button{color:#344354}
@media(max-width:950px){.side .brand img{width:100px;height:64px}.side .brand{margin:0;padding:4px}}

/* Trình bày logo trực tiếp trên sidebar, giữ nguyên PNG gốc. */
.shell{grid-template-columns:280px 1fr}
.side{padding:14px 13px}
.side .brand{height:214px;margin:0 0 16px;padding:0;background:transparent;border-radius:0}
.side .brand img{width:254px;height:214px;max-width:100%;object-fit:contain}
.side .logout{width:254px;left:13px}
@media(max-width:950px){.shell{display:block}.side .brand{height:auto;margin:0;padding:0}.side .brand img{width:100px;height:64px}.side .logout{width:auto;left:auto}}

/* Nền sáng: ưu tiên làm nổi logo vàng - xanh ngọc. */
body{background:#faf8f4}
.side{background:#e5f2f5;color:#183b57;border-right:1px solid #c9e1e6}
.nav button{color:#25435d}
.nav button:hover{background:#d4e9ed;color:#123b5a}
.nav button.on{background:#fff;color:#124c66;box-shadow:0 2px 8px #3974851a}
.side .logout{border-top-color:#c8dfe5}
.side .logout button{background:#fff;color:#21435d;box-shadow:0 1px 4px #39748518}
.main{background:#faf8f4}
.stat,.panel,.hero{background:#fffdfa}
.star{background:#fffaf0}

/* Đảo cấu trúc nền: sidebar trắng ngà, nội dung xanh băng nhạt. */
body{background:#edf7fa}
.side{background:#fffaf0;color:#26445c;border-right:1px solid #eadfca}
.nav button{color:#36526a}
.nav button:hover{background:#f2eadb;color:#173e5d}
.nav button.on{background:#e5f2f5;color:#124c66;box-shadow:none}
.side .logout{border-top-color:#eadfca}
.side .logout button{background:#3d596f;color:#fff;box-shadow:none}
.main{background:#edf7fa}
.stat,.panel,.hero{background:#fff}
.star{background:#fffcf5}

/* Nội dung trắng trơn, các thành phần phân tầng bằng viền nhẹ. */
body{background:#fff}
.main{background:#fff}
.self-evaluation-page{background:#fff}
.form-header{background:#f4fbfd}
.footerbar{background:#f5fbfc}

/* Nhân viên chỉ có một màn hình nên không hiển thị sidebar điều hướng. */
.shell:has(.self-evaluation-page){display:block}
.shell:has(.self-evaluation-page) .side{display:contents}
.shell:has(.self-evaluation-page) .side .brand,.shell:has(.self-evaluation-page) .side .nav{display:none}
.shell:has(.self-evaluation-page) .main{max-width:none;width:100%;padding:24px 46px}
.shell:has(.self-evaluation-page) .side .logout{position:fixed;left:auto;right:24px;bottom:22px;width:172px;border:0;z-index:6}
.shell:has(.self-evaluation-page) .side .logout button{background:#254d68;color:#fff;text-align:center;border-radius:10px}
@media(max-width:950px){.shell:has(.self-evaluation-page) .main{padding:18px}.shell:has(.self-evaluation-page) .side .logout{right:18px;bottom:18px;width:auto}.shell:has(.self-evaluation-page) .side .logout button{padding:10px 15px}}

/* Nhận xét và đăng xuất ở màn nhân viên gọn, không kéo ngang toàn trang. */
.self-evaluation-page #selfForm>label.field{width:min(680px,100%);align-self:flex-start;margin:14px 0 0}
.self-evaluation-page #selfForm>label.field textarea{min-height:72px;resize:vertical}
.shell:has(.self-evaluation-page) .side .logout{right:30px;bottom:24px;width:164px;padding:0;border-radius:10px;background:#254d68;box-shadow:0 5px 16px #17364b22}
.shell:has(.self-evaluation-page) .side .logout button{width:164px;min-height:46px;padding:10px 14px}

/* Tăng phân vùng ở trang tự đánh giá. */
.self-evaluation-page .form-header{background:#e9f6fb;border-color:#b9deea}
.self-evaluation-page .evaluation thead th{background:#d9ecf6;color:#123c63;border-bottom:1px solid #b7d7e7}
.self-evaluation-page #selfForm>label.field{width:min(1120px,100%)}
.shell:has(.self-evaluation-page) .side .logout{bottom:72px}
@media(max-width:950px){.shell:has(.self-evaluation-page) .side .logout{bottom:64px}.self-evaluation-page #selfForm>label.field{width:100%}}

/* Trạng thái đã gửi đã thể hiện trong khung thông tin phía trên. */
.self-evaluation-page>.notice{display:none}

/* Nhãn và nội dung nhận xét nằm trên cùng một hàng. */
.self-evaluation-page #selfForm>label.field{display:flex;align-items:center;gap:14px;white-space:nowrap}
.self-evaluation-page #selfForm>label.field textarea{flex:1;min-width:0}
@media(max-width:950px){.self-evaluation-page #selfForm>label.field{align-items:flex-start;flex-direction:column;gap:7px;white-space:normal}.self-evaluation-page #selfForm>label.field textarea{width:100%}}

/* Ô điểm gọn và tiêu đề cột thẳng với dữ liệu. */
.self-evaluation-page .selfScore{appearance:textfield;-moz-appearance:textfield}
.self-evaluation-page .selfScore::-webkit-inner-spin-button,.self-evaluation-page .selfScore::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.self-evaluation-page .evaluation thead th:nth-child(3),.self-evaluation-page .evaluation thead th:nth-child(4),.self-evaluation-page .evaluation thead th:nth-child(5){text-align:center}

/* Đồng bộ Admin với giao diện Nhân viên. */
body,.main{background:#fff}
th{background:#d9ecf6;color:#123c63;border-bottom:1px solid #b7d7e7}
.side{background:#243a50;color:#eef6fb;border-right-color:#1c3043}
.nav button{color:#eaf3f8}
.nav button:hover{background:#35536c;color:#fff}
.nav button.on{background:#4b6b83;color:#fff}
.side .logout{border-top-color:#496176}
.side .logout button{background:#fff;color:#25455e}

/* Sidebar navy đậm hơn để logo nổi rõ. */
.side{background:#172d43;border-right-color:#102338}
.nav button:hover{background:#2d4b64}
.nav button.on{background:#40627c}
.side .logout{border-top-color:#35516a}

/* Navy gần đen cho độ tương phản logo cao nhất. */
.side{background:#101b28;border-right-color:#09121c}
.nav button:hover{background:#263b4e}
.nav button.on{background:#34536b}
.side .logout{border-top-color:#2b4052}

/* Tông than theo mẫu tham chiếu. */
.side{background:#191919;border-right-color:#111111}
.nav button:hover{background:#303030}
.nav button.on{background:#454545}
.side .logout{border-top-color:#3a3a3a}

/* Thành tích / Vi phạm: bám đầu trang và ưu tiên thông tin nhận diện. */
.main:not(.self-evaluation-page){margin:0 auto}
.records-table{table-layout:fixed}
.records-table th:nth-child(1),.records-table td:nth-child(1){width:106px}
.records-table th:nth-child(2),.records-table td:nth-child(2){width:300px}
.records-table th:nth-child(3),.records-table td:nth-child(3){width:130px}
.records-table th:nth-child(5),.records-table td:nth-child(5){width:190px}
.records-table th:nth-child(6),.records-table td:nth-child(6){width:170px}
.records-table th:last-child,.records-table td:last-child{width:180px}
.record-period{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--text)}
.record-period select{padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text)}

/* Cột thao tác gọn, ưu tiên diện tích cho nội dung ghi nhận. */
.records-table th:last-child,.records-table td:last-child{width:142px}
.record-actions{gap:6px}
.record-action{width:88px;min-width:88px;min-height:42px;padding:8px;font-size:14px;font-weight:500}
.record-edit{width:36px;min-width:36px;height:42px;padding:0;font-size:15px;font-weight:600}
.record-delete{width:36px;min-width:36px;height:42px;padding:0;font-size:18px;font-weight:700;color:#c93c3c;background:#fde9e9}

/* Khung bảng bo góc kín và bộ lọc / sắp xếp ghi nhận. */
.records-panel{overflow:hidden}
.records-table{border-radius:14px}
.record-sort{display:inline-grid;place-items:center;width:25px;height:25px;margin-left:5px;padding:0;border:1px solid #9cc8dc;border-radius:6px;background:#fff;color:#174d70;font-size:16px;font-weight:800;line-height:1;vertical-align:middle}

/* Bo góc khép kín cho mọi khung chứa bảng. */
.panel{overflow:hidden}
.panel>table{border-radius:inherit}

/* Thẻ nhân viên xuất sắc: tên và điểm được tách rõ hai phía. */
.main:not(.self-evaluation-page) .star{flex-direction:row;align-items:center;justify-content:space-between;padding:12px 26px}
.star-copy{display:flex;flex-direction:column;gap:5px}
.star-copy strong{margin:0}
.star-copy b{font-size:20px;color:#123c63}
.star-score{color:#ef2532;font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;font-size:44px;font-weight:800;line-height:1;letter-spacing:.02em;white-space:nowrap}
.star-score span{font-size:30px}

/* Pop-up chấm đánh giá: rộng, thấp gọn; nội dung dài cuộn bên trong. */
.drawer-content:has(#assessForm){width:min(1020px,calc(100vw - 48px))!important;max-height:78vh}
.drawer-content:has(#assessForm) .guidance{color:#1b1b1b;font-size:13px;line-height:1.4}
.drawer-content:has(#assessForm) .evaluation td:nth-child(2) b{font-size:15px;line-height:1.32}

/* Bảng Đánh giá gọn theo chiều dọc. */
.report-table td{padding:10px 12px}
.report-table .assess{min-height:36px;padding:8px 14px;font-size:14px;line-height:1.2}

/* Ma trận Tổng quan: tháng mới tự xuất hiện theo dữ liệu kỳ đánh giá. */
.overview-matrix table{table-layout:fixed}
.overview-matrix th:first-child,.overview-matrix td:first-child{width:42%;text-align:left}
.overview-matrix th:not(:first-child),.overview-matrix td:not(:first-child){width:112px;text-align:center}
.overview-matrix td{padding:12px}

/* Bộ icon nét mảnh, đồng nhất cho menu. */
.nav button{display:flex;align-items:center;gap:11px}
.nav-icon{width:18px;height:18px;flex:0 0 18px;display:inline-block;background:currentColor;opacity:.96}
.icon-home{mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 10.7 12 3l9 7.7v9.8a1.5 1.5 0 0 1-1.5 1.5h-15A1.5 1.5 0 0 1 3 20.5zM9 22v-7h6v7z'/%3E%3C/svg%3E") center/contain no-repeat}
.icon-chart{mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 20h16v2H2V2h2zm3-3H5v-6h2zm5 0h-2V5h2zm5 0h-2V9h2z'/%3E%3C/svg%3E") center/contain no-repeat}
.icon-users{mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8m0 2c4.4 0 8 2 8 4.5V21H0v-2.5C0 16 3.6 14 8 14m9-1a3 3 0 1 0 0-6v2a1 1 0 1 1 0 2zm1 3c2.8.2 5 1.6 5 3.5V21h-5z'/%3E%3C/svg%3E") center/contain no-repeat}
.icon-award{mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 2h12v8a6 6 0 0 1-4 5.65V22l-2-1.2L10 22v-6.35A6 6 0 0 1 6 10zm2 2v6a4 4 0 0 0 8 0V4zM2 5h2v5a8 8 0 0 0 3 6.25v2.47A10 10 0 0 1 2 10zm18 0h2v5a10 10 0 0 1-5 8.72v-2.47A8 8 0 0 0 20 10z'/%3E%3C/svg%3E") center/contain no-repeat}
.icon-check{mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m9 16.2-3.5-3.5L4 14.2l5 5L20 8l-1.5-1.5z'/%3E%3C/svg%3E") center/contain no-repeat}

/* Bảng Tổng quan / Đánh giá không cần Mã NV; các cột điểm được căn tuyệt đối. */
.report-table{table-layout:fixed}
.report-table th:nth-child(1),.report-table td:nth-child(1){width:29%}
.report-table th:nth-child(2),.report-table td:nth-child(2){width:28%}
.report-table th:nth-child(3),.report-table td:nth-child(3),.report-table th:nth-child(4),.report-table td:nth-child(4){width:130px;text-align:center}
.report-table th:nth-child(5),.report-table td:nth-child(5){width:160px;text-align:center}
.report-table th:last-child,.report-table td:last-child{text-align:center}

/* Giảm khoảng trống đầu trang Admin và căn giữa các số liệu tổng quan. */
.main:not(.self-evaluation-page){padding-top:14px}
.main:not(.self-evaluation-page) .page-title{margin:0 0 3px}
.main:not(.self-evaluation-page) .subtitle{margin-bottom:16px}
.main:not(.self-evaluation-page) .stats{gap:14px}
.main:not(.self-evaluation-page) .stat{display:flex;min-height:126px;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.main:not(.self-evaluation-page) .star{padding:16px 22px}
.main:not(.self-evaluation-page) .panel[style]{margin-top:14px!important}

/* Hàng số liệu gọn hơn; thẻ nhân viên xuất sắc có điểm nhấn rõ. */
.main:not(.self-evaluation-page) .stat{min-height:88px;padding:10px}
.main:not(.self-evaluation-page) .star{min-height:88px;padding:10px 22px;display:flex;flex-direction:column;justify-content:center;background:#fff1c7;border:1px solid #efc75b}

/* Tổng quan: chọn tháng cạnh tiêu đề, không lặp tiêu đề bảng. */
.overview-heading{display:flex;align-items:center;gap:16px}
.overview-heading .page-title{margin:0!important}
.overview-heading select{padding:7px 10px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:#fff}
.main:not(.self-evaluation-page) .overview-heading+.subtitle{margin:4px 0 14px;font-size:16px;font-weight:800;color:#4e7697;letter-spacing:.02em}
.main:not(.self-evaluation-page) .star{border:0;border-radius:14px}

/* Tổng quan: ba khung chính theo thứ tự quản lý cần theo dõi. */
.overview-top{margin-bottom:14px}
.overview-top .overview-heading{gap:14px}
.overview-top .page-title{font-size:34px}
.overview-stats{grid-template-columns:220px 220px minmax(360px,1fr)}
.overview-stats .stat{min-height:112px}
.overview-stats .star{min-height:112px;padding:14px 28px;flex-direction:row;align-items:center;justify-content:space-between}
.overview-stats .star-copy strong{font-size:18px}
.overview-stats .star-copy b{font-size:21px}
@media(max-width:950px){.overview-stats{grid-template-columns:1fr}.overview-stats .star{min-height:100px}}

/* Phân quyền: hai thẻ cấu hình tương ứng hai tài khoản hệ thống. */
.access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px}
.access-body{padding:18px 20px}.access-body p{min-height:42px;margin:0 0 14px;line-height:1.45;color:var(--muted)}
.access-body small{font-weight:400;color:var(--muted)}.access-actions{display:flex;justify-content:flex-end;margin-top:16px}
@media(max-width:950px){.access-grid{grid-template-columns:1fr}}

/* Hành động mật khẩu trong quản lý nhân sự. */
.employee-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.employee-password{display:inline-block;min-width:76px;padding:5px 8px;border-radius:6px;background:#f1f7fb;color:#174d70;font-weight:700;letter-spacing:.04em;text-align:center}
.self-evaluation-page #changeOwnPassword{margin-left:0}
@media(max-width:950px){.employee-actions{width:100%}}

/* Bảng Nhân sự gọn theo chiều dọc. */
.panel:has(.employee-password) td{padding:8px 12px}
.panel:has(.employee-password) .btn.secondary{min-height:36px;padding:8px 14px}
.panel:has(.employee-password) .badge{padding:6px 10px}

/* Chọn quyền cho Admin là nhân viên. */
.permission-panel{max-width:760px}.permission-note{color:var(--muted);line-height:1.5}
.permission-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.permission-list label{display:flex;gap:9px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:9px;background:#f8fbfd;font-weight:600}.permission-list input{width:auto}
@media(max-width:700px){.permission-list{grid-template-columns:1fr}}

/* Hai hành động đối xứng trong cùng thanh cuối trang. */
.self-evaluation-page .footerbar>.logout{position:static!important;width:164px!important;margin-left:auto!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.self-evaluation-page .footerbar>.logout button{width:164px!important;min-height:46px;background:#254d68!important;color:#fff!important;text-align:center!important;border-radius:10px!important;box-shadow:none!important}

/* Danh sách phân quyền linh hoạt. */
.permission-panel-wide{max-width:1040px}.permission-table td{padding:12px 16px}.permission-table .badge{margin:2px 4px 2px 0}.permission-actions{display:flex;gap:8px;align-items:center}.permission-actions .btn{min-height:34px;padding:6px 12px}.permission-actions .more{width:34px;height:34px;border:0;border-radius:8px;background:#fff0f0;color:#c53b3b;font-size:18px}.permission-panel-wide .permission-list{margin:14px 0}
.permission-matrix{margin:16px 0;border:1px solid var(--line);border-radius:10px;overflow:hidden}.permission-matrix-head,.permission-menu-row{display:grid;grid-template-columns:230px 1fr;gap:16px;padding:12px 16px}.permission-matrix-head{background:#d9edf8;color:#12365d}.permission-menu-row{border-top:1px solid var(--line);align-items:center}.permission-menu-row>div{display:flex;flex-wrap:wrap;gap:10px 18px}.permission-menu-row label{display:flex;align-items:center;gap:7px;font-weight:600}.permission-menu-row input{width:auto}@media(max-width:700px){.permission-matrix-head{display:none}.permission-menu-row{grid-template-columns:1fr;gap:8px}}

/* Đăng nhập: hai nhóm người dùng phân biệt rõ ràng. */
.roles .role{padding:28px;text-align:left}.roles .role h2{text-align:center;margin:0 0 8px}.roles .role>.subtitle{text-align:center;min-height:24px;margin:0 0 22px;white-space:nowrap}.roles .role-employee{background:#f3fbf7;border-color:#bfe5d3}.roles .role-manager{background:#f2f8ff;border:2px solid #7db5f1}.roles .role-manager .btn{background:#155fae}.roles .role-employee .btn{background:#13835e}@media(max-width:700px){.roles .role>.subtitle{white-space:normal}}
.login-method{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 0 14px}.login-method button{padding:8px;border:1px solid #a6d8c2;border-radius:8px;background:#fff;color:#2c6f58;font-weight:700}.login-method button.on{background:#13835e;border-color:#13835e;color:#fff}
.role-manager .login-method button{border-color:#a9cbed;color:#225f9d}.role-manager .login-method button.on{background:#155fae;border-color:#155fae}.login-method.compact{margin-top:-2px}

/* Bảng Thành tích / Vi phạm: cột thao tác không bị chèn hoặc tràn. */
.records-table th:nth-child(1),.records-table td:nth-child(1){width:108px;text-align:left}
.records-table th:nth-child(2),.records-table td:nth-child(2){width:285px;text-align:left}
.records-table th:nth-child(3),.records-table td:nth-child(3){width:140px;text-align:center}
.records-table th:nth-child(5),.records-table td:nth-child(5){width:170px;text-align:left}
.records-table th:nth-child(6),.records-table td:nth-child(6){width:160px;text-align:center;white-space:nowrap}
.records-table th:last-child,.records-table td:last-child{width:200px;text-align:center}
.records-table .record-actions{justify-content:center;gap:7px;white-space:nowrap}
.records-table .record-action{width:100px;min-width:100px;background:#e9f2fb;color:var(--text);font-weight:700}

/* Hành động Nhân sự dùng cùng hệ màu, kích thước và căn giữa. */
.panel:has(.employee-password) th:last-child,.panel:has(.employee-password) td:last-child{width:150px;text-align:center;white-space:nowrap}
.panel:has(.employee-password) td:last-child .editEmployee{vertical-align:middle}
.employee-delete{display:inline-grid;place-items:center;width:36px;height:36px;margin-left:8px;padding:0;vertical-align:middle;border:0;border-radius:8px;background:#fde9e9;color:#c93c3c;font-size:18px;font-weight:700}
.employee-delete:hover,.record-delete:hover{background:#f9d4d4}

/* Records: fit eight business columns while keeping long notes readable. */
.records-table th,.records-table td{font-size:14px;overflow-wrap:anywhere}.records-table th{font-size:13.5px;line-height:1.25}
.records-table th:nth-child(1),.records-table td:nth-child(1){width:100px;text-align:left;white-space:nowrap}.records-table th:nth-child(2),.records-table td:nth-child(2){width:190px;text-align:left}.records-table th:nth-child(3),.records-table td:nth-child(3){width:115px;text-align:center}.records-table th:nth-child(4),.records-table td:nth-child(4){width:280px}.records-table th:nth-child(5),.records-table td:nth-child(5){width:230px}.records-table th:nth-child(6),.records-table td:nth-child(6){width:125px}.records-table th:nth-child(7),.records-table td:nth-child(7){width:110px;text-align:right}.records-table th:nth-child(8),.records-table td:nth-child(8){width:210px;text-align:center}
.records-table .record-actions{justify-content:center;gap:7px;white-space:nowrap;min-width:190px}.records-table .record-action{width:92px;min-width:92px;padding:10px 6px;font-size:12.5px}.records-table .more{width:36px;height:36px;padding:0;font-size:16px;flex:0 0 36px}.record-excel-button{padding:10px 12px;font-size:13px}
.inline-toggle{transition:filter .15s,transform .15s}.inline-toggle:hover{filter:brightness(.96);transform:translateY(-1px)}.inline-toggle:focus-visible{outline:2px solid var(--blue);outline-offset:2px}.inline-toggle:disabled{cursor:wait;opacity:.65}
.employee-excellence{font-size:21px;padding:10px}.employee-excellence span{font-size:25px}.employee-excellence small{font-size:18px}

/* Biên bản nhân viên vừa phản hồi: nhận diện vừa đủ ngay trong danh sách. */
.records-table tr.record-has-response td{background:#fff8dc}
.records-table tr.record-has-response td:first-child{box-shadow:inset 3px 0 0 #e9bc42}
.criterion-context{margin-top:8px;color:var(--muted);font-size:13px;font-weight:400;line-height:1.42}.criterion-context summary{cursor:pointer;color:#2870a9;font-weight:700}.criterion-context p{margin:7px 0;white-space:pre-wrap}.self-review-hint{margin:0 0 10px;padding:10px 12px;border-radius:9px;background:#f4f9fe;color:#53708f;font-size:13px}.evaluation-employee th:nth-child(1),.evaluation-employee td:nth-child(1){width:4%}.evaluation-employee th:nth-child(2),.evaluation-employee td:nth-child(2){width:25%}.evaluation-employee th:nth-child(3),.evaluation-employee td:nth-child(3){width:6%}.evaluation-employee th:nth-child(4),.evaluation-employee td:nth-child(4){width:9%}.evaluation-employee th:nth-child(5),.evaluation-employee td:nth-child(5){width:28%}.evaluation-employee th:nth-child(6),.evaluation-employee td:nth-child(6){width:28%}.evaluation-employee.is-finalized th:nth-child(5),.evaluation-employee.is-finalized td:nth-child(5){width:10%}.evaluation-employee.is-finalized th:nth-child(6),.evaluation-employee.is-finalized td:nth-child(6){width:46%}.evaluation-admin th:nth-child(1),.evaluation-admin td:nth-child(1){width:4%}.evaluation-admin th:nth-child(2),.evaluation-admin td:nth-child(2){width:35%}.evaluation-admin th:nth-child(3),.evaluation-admin td:nth-child(3){width:7%}.evaluation-admin th:nth-child(4),.evaluation-admin td:nth-child(4){width:9%}.evaluation-admin th:nth-child(5),.evaluation-admin td:nth-child(5){width:11%}.evaluation-admin th:nth-child(6),.evaluation-admin td:nth-child(6){width:34%}.evaluation-employee .selfEvidence,.evaluation-employee .improvementPlan{width:100%;min-height:78px;resize:vertical;border:1px solid #bfd5eb;border-radius:8px;padding:9px;color:var(--text);line-height:1.4}.reflection-form{margin-top:16px;padding:18px;border:1px solid var(--line);border-radius:12px;background:#fbfdff}.reflection-form h2{font-size:17px;margin:0 0 5px}.reflection-form .subtitle{margin-bottom:10px;font-size:13px}.reflection-form textarea{min-height:72px}.reflection-readonly{margin-top:16px;padding:14px 16px;border:1px solid var(--line);border-radius:11px;background:#fbfdff}.reflection-readonly summary{cursor:pointer;font-weight:800;color:#1a558c}.reflection-readonly p{line-height:1.45;white-space:pre-wrap}.modal-note{font-size:13px;line-height:1.4}.drawer-content:has(#assessForm){width:min(1180px,100%)}.drawer-content:has(#assessForm) .eval-scroll{overflow:auto;border:1px solid var(--line);border-radius:10px}.drawer-content:has(#assessForm) .evaluation-admin{min-width:950px}@media(max-width:1000px){.evaluation-employee{min-width:1080px}.evaluation-employee.is-finalized{min-width:860px}}
.self-evaluation-page{height:auto;min-height:100vh;overflow:visible;display:block}.self-evaluation-page #selfForm{display:block;min-height:auto}.self-evaluation-page .eval-scroll{display:block;min-height:440px;max-height:58vh;overflow:auto;margin:0 0 16px}.self-evaluation-page .reflection-form,.self-evaluation-page .reflection-readonly{margin-top:16px}.self-evaluation-page .footerbar{margin-top:16px}@media(max-width:950px){.self-evaluation-page .eval-scroll{min-height:360px;max-height:55vh}}
.evaluation-employee:not(.is-finalized){table-layout:fixed}.evaluation-employee:not(.is-finalized) th:nth-child(5),.evaluation-employee:not(.is-finalized) td:nth-child(5),.evaluation-employee:not(.is-finalized) th:nth-child(6),.evaluation-employee:not(.is-finalized) td:nth-child(6){width:28%!important}.criteria-guide-intro{display:flex;gap:12px;align-items:center;margin:14px 0;padding:12px 15px;border:1px solid #cfe3f3;border-radius:11px;background:#f4faff;color:#426985}.criteria-guide-intro b{color:#163e67}.criteria-guide-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid var(--line)}.criteria-guide-toolbar label{display:flex;align-items:center;gap:10px;font-weight:750}.criteria-guide-toolbar select{padding:9px 10px;border:1px solid #bfd5eb;border-radius:8px;background:#fff;color:var(--text)}.criteria-guide-total{padding:9px 14px;border:1px solid #efd38a;border-radius:9px;background:#fff8e5;color:#996400;font-size:13px}.criteria-guide-total b{margin-left:5px;font-size:16px}.criteria-guide-scroll{overflow:auto}.criteria-guide-table{min-width:980px;table-layout:fixed}.criteria-guide-table th:nth-child(1),.criteria-guide-table td:nth-child(1){width:5%;text-align:center}.criteria-guide-table th:nth-child(2),.criteria-guide-table td:nth-child(2){width:25%}.criteria-guide-table th:nth-child(3),.criteria-guide-table td:nth-child(3){width:7%;text-align:center}.criteria-guide-table th:nth-child(4),.criteria-guide-table td:nth-child(4){width:63%}.criteria-guide-table input,.criteria-guide-table textarea{width:100%;border:1px solid #bfd5eb;border-radius:8px;padding:9px;color:var(--text);background:#fff}.criteria-guide-table input[type=number]{max-width:74px;text-align:center}.criteria-guide-table textarea{min-height:98px;resize:vertical;line-height:1.4}.excellence-principles{margin:0 0 14px;padding:14px 16px;border:1px solid #ead08c;border-radius:10px;background:#fff8e5;color:#684f18}.excellence-principles h3{margin:0 0 8px;color:#7c5602;font-size:16px}.excellence-principles ol{margin:0;padding-left:20px;display:grid;gap:6px;font-size:13px;line-height:1.42}@media(max-width:850px){.criteria-guide-intro,.criteria-guide-toolbar{align-items:flex-start;flex-direction:column}.criteria-guide-table{min-width:900px}}
.employee-final-row{grid-template-columns:minmax(0,68%) minmax(360px,32%)}.employee-excellence{font-size:18px;line-height:1.2;padding:6px 10px;white-space:nowrap}.employee-excellence span{font-size:21px}.employee-excellence small{font-size:17px}@media(max-width:1000px){.employee-final-row{grid-template-columns:1fr}.employee-excellence{white-space:normal}}
.employee-notifications{margin:14px 0;border:1px solid #f0d49a;border-radius:12px;background:#fff9e9;padding:14px}.employee-notifications h2{margin:0 0 10px;color:#74500a;font-size:16px}.notification-card{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #f0ddb1;padding:12px 0}.notification-card:first-of-type{border-top:0;padding-top:0}.notification-card b{color:#173c66}.notification-card p{margin:4px 0;color:#405875}.notification-card small{color:#a26900;font-weight:700}.notification-card.acknowledged small{color:#087d5e}.notification-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.notification-actions .btn{white-space:nowrap}@media(max-width:700px){.notification-card{align-items:flex-start;flex-direction:column}.notification-actions{justify-content:flex-start}}
.employee-final-row{grid-template-columns:minmax(0,70%) minmax(300px,30%)}.employee-excellence{font-size:17px;line-height:1.2;padding:8px 14px}.employee-excellence span{font-size:22px}.employee-excellence small{font-size:17px}.employee-violation-summary{display:flex;align-items:center;gap:16px}.violation-summary-copy{display:grid;gap:4px;flex:1}.violation-summary-copy span{color:var(--muted);font-size:13px}.workflow-status{display:inline-flex;align-items:center;border-radius:999px;background:#fff0c7;color:#8c6500;padding:9px 13px;font-weight:800}.workflow-status.responded{background:#e7f1ff;color:#215d9a}.workflow-status.confirmed{background:#ddf5e9;color:#087d5e}.workflow-review{margin:16px 0 0;padding:14px 16px;border:1px solid #cfe0f1;border-radius:10px;background:#f7fbff}.workflow-review h3{margin:0 0 7px;color:#173c66;font-size:15px}.workflow-review p{margin:0 0 13px;line-height:1.48;white-space:pre-wrap}.workflow-review .field{margin:0}.nav-response-badge{display:inline-flex;min-width:20px;height:20px;align-items:center;justify-content:center;margin-left:auto;border-radius:999px;background:#f4b300;color:#173c66;font-size:12px;font-weight:900}.workflow-admin-notice{margin:10px 0;padding:11px 14px;border:1px solid #b9e3cf;border-radius:10px;background:#effbf4;color:#087d5e;font-weight:700}@media(max-width:1000px){.employee-final-row{grid-template-columns:1fr}.employee-violation-summary{align-items:flex-start;flex-direction:column}}
.evaluation-summary{display:grid;grid-template-columns:190px 190px minmax(320px,1fr);gap:16px;margin:18px 0}.summary-stat,.excellence-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:17px}.summary-stat b{display:block;font-size:28px}.summary-stat span{color:var(--muted);font-weight:700;font-size:13px}.danger-number{color:var(--red)}.excellence-card{display:flex;justify-content:space-between;gap:16px;align-items:center;background:#fff5cf;border-color:#f4dda0}.excellence-card .eyebrow{display:block;color:#9c6800;font-weight:800;font-size:13px}.excellence-card b{display:block;font-size:20px}.excellence-card strong{color:#df3535;font-size:23px}.excellence-reason{display:block;max-width:540px;margin-top:5px;color:#6b5c35;font-size:13px;line-height:1.35}.excellence-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.excellence-actions code{font-weight:800;color:#8d5c00}.score-crown{color:#c48a00;font-size:18px;margin-left:3px}.evaluation-admin th:nth-child(1),.evaluation-admin td:nth-child(1){width:4%}.evaluation-admin th:nth-child(2),.evaluation-admin td:nth-child(2){width:18%}.evaluation-admin th:nth-child(3),.evaluation-admin td:nth-child(3){width:6%}.evaluation-admin th:nth-child(4),.evaluation-admin td:nth-child(4){width:8%}.evaluation-admin th:nth-child(5),.evaluation-admin td:nth-child(5){width:9%}.evaluation-admin th:nth-child(6),.evaluation-admin td:nth-child(6){width:24%}.evaluation-admin th:nth-child(7),.evaluation-admin td:nth-child(7){width:31%}.evaluation-admin .adminNote{width:100%;min-height:74px;resize:vertical;border:1px solid #bfd5eb;border-radius:8px;padding:9px;color:var(--text)}.evaluation-employee th:nth-child(1),.evaluation-employee td:nth-child(1){width:4%}.evaluation-employee th:nth-child(2),.evaluation-employee td:nth-child(2){width:23%}.evaluation-employee th:nth-child(3),.evaluation-employee td:nth-child(3){width:6%}.evaluation-employee th:nth-child(4),.evaluation-employee td:nth-child(4){width:9%}.evaluation-employee th:nth-child(5),.evaluation-employee td:nth-child(5){width:9%}.evaluation-employee th:nth-child(6),.evaluation-employee td:nth-child(6){width:49%}.manager-note{line-height:1.45;white-space:pre-wrap}.employee-final-row{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:center;margin-top:16px}.employee-final-row .field{margin:0}.employee-excellence{text-align:center;color:#ed3038;font-family:cursive;font-size:30px;line-height:1.08;font-style:italic;padding:14px}.employee-excellence span{display:block;color:#d59a00;font-family:Georgia,serif;font-size:32px;font-style:normal}.employee-excellence small{font-size:28px}.award-rule{background:#fff7dc;border:1px solid #edd58c;border-radius:9px;padding:12px;line-height:1.55;color:#74500a}.award-rule small{color:#80652d}.reward-person{margin-top:0}@media(max-width:1000px){.evaluation-summary{grid-template-columns:1fr}.excellence-card{align-items:flex-start;flex-direction:column}.excellence-actions{justify-content:flex-start}.employee-final-row{grid-template-columns:1fr}.evaluation-admin,.evaluation-employee{min-width:1100px}}
.records-table th:nth-child(6),.records-table td:nth-child(6),.records-table th:nth-child(7),.records-table td:nth-child(7){white-space:normal;overflow-wrap:anywhere;word-break:break-word}.records-table td:nth-child(6){line-height:1.4}.records-table td:nth-child(7){font-variant-numeric:tabular-nums}
.import-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.import-summary{margin:14px 0;padding:12px;background:#eef7ff;border-radius:9px}.import-errors{margin:14px 0;padding:12px;border:1px solid #f1b9b9;background:#fff4f4;color:#8e3030;border-radius:9px}.import-errors ul{margin:8px 0 0;padding-left:20px}.import-table-wrap{max-height:380px;overflow:auto;border:1px solid var(--line);margin:14px 0}.import-table{font-size:13px}.import-table th{position:sticky;top:0}.import-table td{padding:9px}
@media(max-width:1100px){.records-panel{overflow-x:auto}.records-table{min-width:1400px}}

/* Biên bản vi phạm: phần nội dung cuộn riêng, thanh lệnh luôn nằm trong khung nhìn. */
.drawer-content:has(.minute-dialog){width:min(820px,calc(100vw - 40px));height:min(760px,calc(100vh - 40px));max-height:calc(100vh - 40px);display:flex;flex-direction:column;padding:22px 26px}
.minute-dialog{display:flex;flex:1;min-height:0;flex-direction:column}.minute-scroll{flex:1;min-height:0;overflow:auto;padding:2px 8px 2px 2px}.minute-preview{max-width:none;margin:0;padding:22px 38px;border-color:#cdddeb;box-shadow:none}.minute-preview .minute-company{margin:0 0 18px;text-align:center;font-size:12px;font-weight:800;color:#12365d}.minute-preview h2{margin:0 0 24px;color:#12365d;font-size:22px;line-height:1.3}.minute-preview h3{margin:18px 0 6px;color:#12365d;font-size:15px}.minute-preview p{margin:0;line-height:1.45}.minute-preview .minute-meta{margin-bottom:18px;line-height:1.65}.minute-preview textarea{min-height:76px;max-height:130px;resize:vertical}.minute-template-link{margin-bottom:0}.minute-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 0 0;background:#fff;border-top:1px solid var(--line);flex:0 0 auto}.minute-actions .btn{min-width:132px}
@media(max-width:700px){.drawer{padding:12px}.drawer-content:has(.minute-dialog){width:100%;height:calc(100vh - 24px);max-height:calc(100vh - 24px);padding:16px}.minute-preview{padding:18px}.minute-preview h2{font-size:19px}.minute-actions .btn{min-width:0;flex:1}}
.employee-excellence{font-size:21px;padding:10px}.employee-excellence span{font-size:25px}.employee-excellence small{font-size:18px}

/* Các lệnh trong popup và khối thông báo cần có vùng chạm, viền và phản hồi bấm rõ ràng. */
.drawer-head{gap:16px;padding-right:2px}.drawer-head h2{margin:0;flex:1}.drawer-close{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;min-width:46px;padding:0;border:1px solid #9fbfdf!important;border-radius:12px;background:linear-gradient(180deg,#fff 0%,#edf5fd 100%)!important;color:#12365d!important;font-size:31px!important;font-weight:700;line-height:1;box-shadow:0 2px 0 #bdd3e9,0 6px 14px #0d375724;touch-action:manipulation;transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease}.drawer-close:hover{border-color:#1475e8!important;background:#f5faff!important;color:#0d63bd!important;box-shadow:0 2px 0 #9ec8f3,0 8px 18px #0d375730;transform:translateY(-1px)}.drawer-close:active{box-shadow:0 1px 0 #9ec8f3,0 2px 6px #0d375728;transform:translateY(1px)}.drawer-close:focus-visible{outline:3px solid #87c5ff;outline-offset:3px}
.employee-notifications .btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border:1px solid #0d62bd!important;border-radius:9px;box-shadow:0 2px 0 #0e5fad,0 5px 12px #0d37571f;transition:transform .14s ease,background .14s ease,box-shadow .14s ease}.employee-notifications .btn.secondary{background:#fff!important;color:#12365d!important;border-color:#a8c7e5!important;box-shadow:0 2px 0 #c4d9ec,0 5px 12px #0d375718}.employee-notifications .btn:hover{background:#0d67c8!important;box-shadow:0 2px 0 #0b55a1,0 7px 15px #0d375729;transform:translateY(-1px)}.employee-notifications .btn.secondary:hover{background:#f3f8fe!important;color:#0d63bd!important;border-color:#6ea8df!important;box-shadow:0 2px 0 #a9cce9,0 7px 15px #0d37571f}.employee-notifications .btn:active{box-shadow:0 1px 0 #0b55a1,0 2px 5px #0d375724;transform:translateY(1px)}.employee-notifications .btn.secondary:active{box-shadow:0 1px 0 #a9cce9,0 2px 5px #0d37571c}.employee-notifications .btn:focus-visible{outline:3px solid #78b8f2;outline-offset:3px}

/* Hệ nút lệnh thống nhất: primary, secondary, nguy hiểm và icon action. */
button:focus-visible{outline:3px solid #78b8f2;outline-offset:3px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid #0e61ba!important;border-radius:9px;background:linear-gradient(180deg,#2181ed 0%,#126bcc 100%)!important;color:#fff!important;font-weight:750;line-height:1.2;box-shadow:0 2px 0 #0c57a8,0 5px 12px #0d375724;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}.btn.secondary{background:linear-gradient(180deg,#fff 0%,#f0f6fc 100%)!important;color:#12365d!important;border-color:#abc8e4!important;box-shadow:0 2px 0 #c2d8eb,0 5px 12px #0d375718}.btn.gold{background:linear-gradient(180deg,#fffdf5 0%,#fff3c7 100%)!important;color:#916108!important;border-color:#e5b844!important;box-shadow:0 2px 0 #e2c36f,0 5px 12px #7251111c}.btn.danger{background:linear-gradient(180deg,#ed6666 0%,#cf3f3f 100%)!important;color:#fff!important;border-color:#bb3131!important;box-shadow:0 2px 0 #aa2e2e,0 5px 12px #70202024}.btn:hover{filter:brightness(1.04);box-shadow:0 2px 0 #0b55a1,0 7px 15px #0d37572c;transform:translateY(-1px)}.btn.secondary:hover{filter:none;background:#f7fbff!important;color:#0d63bd!important;border-color:#72a9dc!important;box-shadow:0 2px 0 #a6cbe9,0 7px 15px #0d375720}.btn.danger:hover{box-shadow:0 2px 0 #a52b2b,0 7px 15px #7020202d}.btn:active{box-shadow:0 1px 0 #0b55a1,0 2px 5px #0d375724;transform:translateY(1px)}.btn.secondary:active{box-shadow:0 1px 0 #a6cbe9,0 2px 5px #0d37571c}.btn:disabled,.more:disabled{cursor:not-allowed;opacity:.58;box-shadow:none;transform:none}.more{display:inline-grid;place-items:center;width:38px;height:38px;min-width:38px;padding:0;border:1px solid #b8cfe4!important;border-radius:9px;background:linear-gradient(180deg,#fff 0%,#f0f6fc 100%)!important;color:#173d65!important;font-size:17px;font-weight:800;line-height:1;box-shadow:0 2px 0 #c5d9ea,0 4px 10px #0d375718;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.more:hover{border-color:#6fa9dc!important;color:#0d63bd!important;box-shadow:0 2px 0 #a5c9e7,0 6px 13px #0d375721;transform:translateY(-1px)}.more:active{box-shadow:0 1px 0 #a5c9e7,0 2px 5px #0d37571d;transform:translateY(1px)}.more.record-delete,.more.permission-delete,.employee-delete{border-color:#edb2b2!important;background:linear-gradient(180deg,#fffafa 0%,#fde8e8 100%)!important;color:#b73333!important;box-shadow:0 2px 0 #e8bbbb,0 4px 10px #70202018}.more.record-delete:hover,.more.permission-delete:hover,.employee-delete:hover{border-color:#dd7f7f!important;background:#fff2f2!important;color:#a92626!important}.record-sort{width:30px;height:30px;border-color:#a9c8e3!important;border-radius:8px;box-shadow:0 2px 0 #c5d9ea,0 3px 8px #0d375716;transition:transform .14s ease,box-shadow .14s ease}.record-sort:hover{color:#0d63bd;background:#f6fbff;box-shadow:0 2px 0 #abcde7,0 5px 10px #0d37571d;transform:translateY(-1px)}.type-switch button,.login-method button{box-shadow:0 2px 0 #c2d8eb,0 4px 10px #0d375716;transition:transform .14s ease,box-shadow .14s ease}.type-switch button:hover,.login-method button:hover{box-shadow:0 2px 0 #aacbe6,0 6px 12px #0d375720;transform:translateY(-1px)}.side .logout button{border:1px solid #9ebedb!important;box-shadow:0 2px 0 #bdd4e8,0 5px 12px #0d375721!important}.roles .role-employee .btn{background:linear-gradient(180deg,#20a272 0%,#13835e 100%)!important;border-color:#0f704f!important;box-shadow:0 2px 0 #0b6547,0 5px 12px #0b5e4124}.roles .role-manager .btn{background:linear-gradient(180deg,#2176c5 0%,#155fae 100%)!important;border-color:#0f579e!important;box-shadow:0 2px 0 #0c4d8d,0 5px 12px #0b4f9024}


/* pw-footer-split: tach nut Doi mat khau khoi nut Luu tu danh gia */
.self-evaluation-page .footerbar{gap:24px}
.self-evaluation-page .footerbar>#changeOwnPassword{margin-right:auto}

/* ============================================================
   kn-reflection-2x2 — khối "Tự nhìn nhận cuối kỳ" xếp 2 cột
   Cột trái : Ba kết quả tự hào  +  Ba mục tiêu kỳ tiếp theo
   Cột phải : Một việc chưa làm tốt  +  Hỗ trợ cần từ công ty
   Đổi vị trí bằng thuộc tính order, không sửa markup, nên dữ
   liệu vẫn lưu đúng ô như cũ.
   ============================================================ */
.reflection-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;align-items:start}
.reflection-form>h2{grid-column:1 / -1;margin:0}
.reflection-form>.subtitle{grid-column:1 / -1;margin:0 0 6px}
.reflection-form>label.field{margin:0;display:flex;flex-direction:column;gap:6px;white-space:normal}
.reflection-form>label.field textarea{width:100%;min-height:72px;resize:vertical}
.reflection-form>label.field:nth-of-type(3){order:2}
.reflection-form>label.field:nth-of-type(4){order:1}
@media(max-width:950px){
  .reflection-form{grid-template-columns:1fr}
  .reflection-form>label.field:nth-of-type(3),
  .reflection-form>label.field:nth-of-type(4){order:0}
}

/* ==========================================================================
   Bảng Thành tích / Vi phạm — khối này phải nằm CUỐI file.
   Các quy tắc .records-table cũ nằm rải rác phía trên và có cùng độ ưu tiên,
   nên đặt ở giữa file thì cái sau vẫn đè lên: đó là lý do lần trước cột không
   đổi bề ngang và nút thao tác tràn ra ngoài ô.
   Tổng bề ngang các cột là 1384px, trình duyệt tự giãn theo đúng tỉ lệ này.
   ========================================================================== */
.records-table{min-width:1320px}
.records-table th,.records-table td{font-size:13px;line-height:1.5;word-break:normal;overflow-wrap:break-word}
.records-table td{padding:12px 10px;vertical-align:top}
.records-table th{padding:11px 10px;font-size:12px;white-space:nowrap}
.records-table th:nth-child(1),.records-table td:nth-child(1){width:90px;text-align:left;white-space:nowrap}
.records-table th:nth-child(2),.records-table td:nth-child(2){width:140px}
.records-table th:nth-child(3),.records-table td:nth-child(3){width:126px;text-align:center}
.records-table th:nth-child(4),.records-table td:nth-child(4){width:372px}
.records-table th:nth-child(5),.records-table td:nth-child(5){width:194px}
.records-table th:nth-child(6),.records-table td:nth-child(6){width:116px;text-align:center;white-space:nowrap}
.records-table th:nth-child(7),.records-table td:nth-child(7){width:246px;text-align:right;white-space:normal}
.records-table th:last-child,.records-table td:last-child{width:100px;padding-left:4px;padding-right:4px;vertical-align:middle}
.records-table td:nth-child(1){color:#5b7186}
/* Nhãn KHEN THƯỞNG dài hơn ô nên phải thu nhỏ lại, nếu không sẽ tràn sang cột bên. */
.records-table td:nth-child(3) .badge{white-space:nowrap;font-size:11px;padding:4px 9px}

/* Cột Thao tác xếp hai hàng: nút chính ở trên, sửa/xóa ở dưới, hai hàng cách
   nhau 9px cho thoáng. Ô rộng 100px, đệm hai bên 4px nên cụm nút được 92px;
   nhãn dài nhất là "Chúc mừng" (có emoji) đo được 89px ở cỡ chữ 11px nên vừa. */
.records-table .record-actions{min-width:0;column-gap:6px;row-gap:9px;flex-wrap:wrap;justify-content:center}
.records-table .record-actions>.btn{flex:0 0 100%}
.records-table .more{width:28px;height:28px;flex:0 0 28px;font-size:13px}
.records-table .record-actions .btn{padding:4px 5px;font-size:11px;min-height:28px;min-width:0}

/* Dòng chẵn nền nhạt cho dễ dò ngang; dòng biên bản vừa có phản hồi giữ nền vàng riêng. */
.records-table tbody tr:nth-child(even):not(.record-has-response) td{background:#f7fbfe}

/* Màn hình hẹp: cuộn ngang trong khung bảng thay vì cắt mất cột Thao tác. */
.records-panel{overflow-x:auto}

/* Nút lọc: ô vuông nhỏ cùng dòng với tiêu đề cột, cùng cỡ với nút sắp xếp ở
   cột Ngày. Thẻ select trong suốt phủ kín ô nên bấm vào là trình duyệt tự mở
   danh sách chọn. Ô đổi nền đậm khi cột đó đang lọc. */
.record-filter-chip{position:relative;display:inline-grid;place-items:center;width:30px;height:30px;margin-left:5px;border:1px solid #a9c8e3;border-radius:8px;background:#fff;color:#174d70;font-size:12px;font-weight:800;line-height:1;vertical-align:middle;box-shadow:0 2px 0 #c5d9ea,0 3px 8px #0d375716}
.record-filter-chip.is-active{background:#174d70;border-color:#174d70;color:#fff}
.record-filter-chip .record-filter{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;cursor:pointer;appearance:none}

/* ==========================================================================
   Cửa sổ "Đánh giá: <tên nhân viên>" — khối này phải nằm CUỐI file, vì các
   quy tắc .evaluation cũ nằm phía trên và có cùng độ ưu tiên.
   Cột Tiêu chí chứa nhiều chữ nhất nên chiếm một nửa bảng.
   ========================================================================== */
.drawer-content:has(#assessForm) .evaluation-admin{table-layout:fixed}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(1),.drawer-content:has(#assessForm) .evaluation-admin td:nth-child(1){width:4%;text-align:center}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(2),.drawer-content:has(#assessForm) .evaluation-admin td:nth-child(2){width:50%}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(3),.drawer-content:has(#assessForm) .evaluation-admin td:nth-child(3){width:6%;text-align:center}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(4),.drawer-content:has(#assessForm) .evaluation-admin td:nth-child(4){width:8%;text-align:center}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(5),.drawer-content:has(#assessForm) .evaluation-admin td:nth-child(5){width:10%;text-align:center}
.drawer-content:has(#assessForm) .evaluation-admin th:last-child,.drawer-content:has(#assessForm) .evaluation-admin td:last-child{width:22%}
.drawer-content:has(#assessForm) .evaluation-admin td:last-child textarea{width:100%;min-height:86px}
.drawer-content:has(#assessForm) .evaluation-admin .score{width:100%;max-width:76px}

/* Phân biệt hai loại nội dung trong ô Tiêu chí:
     đoạn 1 + 2 = nhân viên tự viết (minh chứng, kế hoạch cải thiện) -> nền xanh nhạt
     đoạn 3     = gợi ý chấm điểm của hệ thống                       -> nền xám, chữ nghiêng
   Dùng :nth-of-type nên không phải sửa markup ở excellence-rewards.js. */
.drawer-content:has(#assessForm) .criterion-context>summary{color:#0f5b93;font-weight:700;cursor:pointer}
.drawer-content:has(#assessForm) .criterion-context p{margin:6px 0;padding:8px 11px;border-radius:0 9px 9px 0;line-height:1.5}
.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(1),.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(2){background:#eef7fe;border-left:3px solid #7cb6e2;color:#16375a}
.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(1) b,.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(2) b{color:#0f5b93}
.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(3){background:#f5f5f1;border-left:3px solid #d0cfc4;color:#63635a;font-style:italic}
.drawer-content:has(#assessForm) .criterion-context p:nth-of-type(3) b{color:#6f6f63;font-style:normal}

/* Cửa sổ chấm đánh giá rộng thêm 200px: 1020px -> 1220px. Tỉ lệ các cột giữ
   nguyên nên cột Tiêu chí vẫn chiếm một nửa, đo được 476px -> 576px. */
.drawer-content:has(#assessForm){width:min(1220px,calc(100vw - 48px))!important}

/* Trang tự đánh giá: ô chọn kỳ nằm ngay trong câu tiêu đề — "Tự đánh giá kết
   quả làm việc tháng [09/2026]" — thay vì đứng lẻ ở góc phải, nơi nhân viên dễ
   nhìn nhầm thành nhãn trang trí.
   .top-tail là ô rỗng ẩn giữ chỗ cuối hàng: app-v2.js chèn khối TỔNG ĐIỂM bằng
   insertBefore(scoreHeader, top.lastElementChild), nên hàng đầu trang phải luôn
   còn một phần tử cuối để khối đó rơi đúng vào bên phải. */
.page-title .title-period select{font-size:22px;font-weight:800;color:#0f5b93;padding:2px 8px;border:1px solid #a9c8e3;border-radius:8px;background:#fff;vertical-align:2px;cursor:pointer}
.page-title .title-period select:hover{border-color:#7cb6e2}
.top-tail{display:none}

/* Cửa sổ chấm đánh giá: phần "Tự nhìn nhận cuối kỳ" do nhân viên viết, đặt
   ngay trên ô Nhận xét tổng hợp. Nền xanh nhạt và vạch xanh bên trái — cùng
   quy ước với các đoạn nhân viên viết ở cột Tiêu chí — để người chấm phân biệt
   ngay đâu là chữ của nhân viên, đâu là chỗ mình nhập. */
.reflection-review{margin:16px 0 4px}
.reflection-review>h3{margin:0 0 8px;font-size:14px;color:#0f5b93}
.reflection-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.reflection-review-grid article{padding:10px 12px;border-left:3px solid #7cb6e2;border-radius:0 9px 9px 0;background:#eef7fe}
.reflection-review-grid b{display:block;margin-bottom:4px;font-size:12.5px;color:#0f5b93}
.reflection-review-grid p{margin:0;font-size:13px;line-height:1.5;color:#16375a;white-space:pre-wrap}
.reflection-review-grid p.empty{color:#8aa0b4;font-style:italic}
@media (max-width:900px){.reflection-review-grid{grid-template-columns:1fr}}

/* Tiêu đề của MỌI bảng canh giữa. Không thể chỉ viết một dòng `th{text-align:center}`:
   các quy tắc th:nth-child(...) ở phía trên có độ ưu tiên cao hơn `th`, nên phải
   ghi đè đúng tên từng cái. */
th{text-align:center}
.records-table th:nth-child(1),.records-table th:nth-child(7){text-align:center}
.drawer-content:has(#assessForm) .evaluation-admin th:nth-child(2){text-align:center}

/* Cột Mức thưởng / phạt chứa cả câu chữ chứ không chỉ con số, nên nội dung canh
   trái cho dễ đọc; riêng tiêu đề vẫn canh giữa như các cột khác. */
.records-table td:nth-child(7){text-align:left}

/* Khối Tự nhìn nhận: mỗi ô cao theo nội dung của chính nó. Ô chưa điền thu gọn
   lại, và ô ngắn không bị kéo cao bằng ô dài nhất cùng hàng.
   Trước đó tôi đặt nhầm tên class là "empty" — tên này đã có sẵn trong hệ thống
   cho dòng trống của bảng, kèm padding 35px và canh giữa, nên ô chưa điền bị
   đội cao gấp đôi. Đổi sang "is-blank" cho khỏi giẫm chân nhau. */
.reflection-review-grid{align-items:start}
.reflection-review-grid p.is-blank{color:#8aa0b4;font-style:italic}

/* Nút đóng cửa sổ nhỏ lại còn 80%: 46px -> 37px, cỡ chữ 31px -> 25px.
   Phải đặt ở CUỐI file: style.css có nhiều khối .drawer-close cùng độ ưu tiên,
   khối nào đứng sau thì thắng. */
.drawer-close{flex:0 0 37px;width:37px;height:37px;min-width:37px;border-radius:10px;font-size:25px!important}
