/* ===== NAM VIỆT – giao diện v8 (dịu mắt) · thiết kế & phát triển: VINATA TECH ===== */
:root{--bg:#f3f5f8;--card:#fff;--tx:#1f2a37;--mu:#677489;--bd:#e3e8ef;--soft:#f7f9fb;--soft2:#eef2f6;--track:#e6eaf0;--hover:#f3f6fa;--th:#f6f8fa;
--blue:#2f62c9;--blue2:#2753ad;--navy:#1d2b44;--ok:#15803d;--warn:#b45309;--err:#c0392b;
--ok-bg:#ecf8f0;--warn-bg:#fdf6e7;--err-bg:#fcefee;--info-bg:#eef4fd;
--side:#fbfcfd;--side-tx:#3d4a5c;--side-h:#8a96a8;--side-hover:#eff3f8;--side-on:#e6eefc;--side-on-tx:#1f4fb4;--shadow:0 1px 2px rgba(16,24,40,.04);
--fs:14px;color-scheme:light}
:root[data-theme=soft]{--bg:#efebe2;--card:#faf7f0;--tx:#3a3631;--mu:#7a7266;--bd:#e0d9ca;--soft:#f5f1e8;--soft2:#ebe5d8;--track:#e3dccd;--hover:#f2ede2;--th:#f2ede3;
--blue:#3b6a8a;--blue2:#315a76;--navy:#3b4a55;--ok:#3f7a4a;--warn:#9a6a1f;--err:#a5453a;--ok-bg:#e9f0e2;--warn-bg:#f6eedb;--err-bg:#f5e4df;--info-bg:#e6edf0;
--side:#f6f2e9;--side-tx:#4a443b;--side-h:#9a907f;--side-hover:#ede7da;--side-on:#e1e9ec;--side-on-tx:#2e5873}
:root[data-theme=dark]{--bg:#11151b;--card:#181d25;--tx:#d4d9e0;--mu:#8792a2;--bd:#2a313c;--soft:#1c222b;--soft2:#222933;--track:#2a313c;--hover:#1f262f;--th:#1c222b;
--blue:#5b8dee;--blue2:#4a7bdb;--navy:#0e1218;--ok:#4ead6c;--warn:#d9a34a;--err:#e0736a;--ok-bg:#16291e;--warn-bg:#2d2414;--err-bg:#301b1a;--info-bg:#17243a;
--side:#141920;--side-tx:#b5bdc9;--side-h:#6c7787;--side-hover:#1d232c;--side-on:#1d2c47;--side-on-tx:#a9c4f5;--shadow:none;color-scheme:dark}
:root[data-fs="1"]{--fs:15.5px}:root[data-fs="2"]{--fs:17px}
*{box-sizing:border-box}html{font-size:var(--fs)}body{margin:0;font:1rem/1.55 "Segoe UI",Inter,system-ui,-apple-system,Arial,sans-serif;color:var(--tx);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
/* ---- thanh bên ---- */
.side{position:fixed;inset:0 auto 0 0;width:258px;background:var(--side);border-right:1px solid var(--bd);color:var(--side-tx);overflow:auto;padding:12px 10px 16px;z-index:20;display:flex;flex-direction:column}
.logo{display:flex;gap:10px;align-items:center;padding:6px 8px 14px;margin-bottom:6px;border-bottom:1px solid var(--bd);color:var(--tx);font-weight:800;letter-spacing:.4px;font-size:17px}
.logo .mk{width:34px;height:34px;border-radius:9px;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:17px;flex:none}
.logo small{display:block;font-size:9.5px;font-weight:600;color:var(--mu);letter-spacing:1.4px}
.side .grp{margin:2px 0}.side summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:9px 10px 5px;font-size:11px;letter-spacing:.9px;text-transform:uppercase;color:var(--side-h);font-weight:600;border-radius:6px;user-select:none}
.side summary::-webkit-details-marker{display:none}.side summary:after{content:"›";font-size:15px;transition:transform .15s;opacity:.7}.side details[open] summary:after{transform:rotate(90deg)}
.side summary:hover{color:var(--side-tx)}
.side a{display:flex;gap:10px;align-items:center;color:var(--side-tx);padding:6px 10px;border-radius:7px;font-size:.93rem;line-height:1.35}
.side a .ic{width:20px;text-align:center;flex:none;filter:grayscale(1);opacity:.6;font-size:.95em}
.side a:hover{background:var(--side-hover);text-decoration:none}.side a.on{background:var(--side-on);color:var(--side-on-tx);font-weight:600}.side a.on .ic{filter:none;opacity:1}
.side .new{margin-left:auto;font-size:9.5px;font-weight:700;background:var(--blue);color:#fff;border-radius:99px;padding:0 6px;letter-spacing:.4px}
.side .credit{margin-top:auto;padding:14px 8px 2px;font-size:11px;color:var(--side-h);display:flex;gap:8px;align-items:center}.side .credit img{width:30px;height:26px;border-radius:5px;background:#1d1f24;object-fit:contain}
/* ---- khung chính ---- */
.main{margin-left:258px;min-height:100vh;display:flex;flex-direction:column}
.top{background:var(--card);border-bottom:1px solid var(--bd);padding:8px 24px;display:flex;justify-content:space-between;align-items:center;gap:12px;position:sticky;top:0;z-index:10}
.top .u{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.top .u a{color:var(--mu)}.top .u a:hover{color:var(--blue)}
.badge{background:var(--soft2);color:var(--mu);border-radius:99px;padding:2px 10px;font-size:12px}
.seg{display:inline-flex;border:1px solid var(--bd);border-radius:8px;overflow:hidden}.seg button{border:0;background:var(--card);color:var(--mu);padding:4px 9px;cursor:pointer;font:inherit;font-size:12px}
.seg button+button{border-left:1px solid var(--bd)}.seg button.on{background:var(--soft2);color:var(--tx);font-weight:600}
.burger{display:none;border:1px solid var(--bd);background:var(--card);color:var(--tx);border-radius:8px;padding:4px 10px;font-size:18px;cursor:pointer}
.wrap{padding:22px 26px 40px;max-width:1520px;width:100%;flex:1}
.foot{border-top:1px solid var(--bd);padding:12px 26px;display:flex;align-items:center;gap:12px;color:var(--mu);font-size:12px;flex-wrap:wrap}
.foot img{height:30px;width:auto;border-radius:6px;background:#1d1f24}.foot b{color:var(--tx)}
h1{font-size:1.45rem;margin:0 0 4px;font-weight:650;letter-spacing:-.2px}h2{font-size:1.08rem;margin:0 0 12px;font-weight:650}.sub{color:var(--mu);margin-bottom:18px}
.grid{display:grid;gap:16px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:1.6fr 1fr 1fr}.g2{grid-template-columns:1fr 1fr}.g21{grid-template-columns:2fr 1fr}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:16px 18px;min-width:0;box-shadow:var(--shadow)}
.kpi .l{color:var(--mu);font-size:12px;letter-spacing:.3px}.kpi .v{font-size:1.75rem;font-weight:650;margin-top:2px;font-variant-numeric:tabular-nums}.kpi .s{color:var(--mu);font-size:12px}
.pos{color:var(--ok)}.neg{color:var(--err)}
table{width:100%;border-collapse:collapse}th,td{padding:8px 10px;border-bottom:1px solid var(--bd);text-align:left;vertical-align:top}
th{font-size:12px;letter-spacing:.2px;color:var(--mu);background:var(--th);white-space:nowrap;font-weight:600}td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}
tbody tr:hover{background:var(--hover)}
.btn{display:inline-block;border:1px solid var(--bd);background:var(--card);color:var(--tx);padding:6px 14px;border-radius:8px;cursor:pointer;font:inherit;line-height:1.4}
.btn:hover{background:var(--hover);text-decoration:none}.btn.p{background:var(--blue);border-color:var(--blue);color:#fff}.btn.p:hover{background:var(--blue2)}
.btn.d{color:var(--err)}.btn.s{padding:3px 10px;font-size:12px}.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}.btn[disabled]{opacity:.5;cursor:not-allowed}
input,select,textarea{font:inherit;padding:7px 10px;border:1px solid var(--bd);border-radius:8px;width:100%;background:var(--card);color:var(--tx)}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--blue) 25%,transparent);border-color:var(--blue)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--blue)}
.bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;align-items:center}.bar input,.bar select{width:auto;min-width:200px}.sp{flex:1}
.form{max-width:760px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.form .full{grid-column:1/-1}label{display:block;font-weight:600;margin-bottom:4px;font-size:13px}.req{color:var(--err)}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:14px;border:1px solid transparent}.flash.ok{background:var(--ok-bg);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 20%,transparent)}.flash.err{background:var(--err-bg);color:var(--err);border-color:color-mix(in srgb,var(--err) 20%,transparent)}
.pill{display:inline-block;padding:1px 9px;border-radius:99px;font-size:12px;background:var(--soft2);color:var(--mu)}.pill.g{background:var(--ok-bg);color:var(--ok)}.pill.y{background:var(--warn-bg);color:var(--warn)}.pill.r{background:var(--err-bg);color:var(--err)}.pill.b{background:var(--info-bg);color:var(--blue)}
.chart{width:100%;height:260px}.legend{display:flex;gap:14px;font-size:12px;color:var(--mu);margin-bottom:6px}.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px}
.hb{display:flex;align-items:center;gap:10px;margin:9px 0}.hb .n{width:36%;min-width:90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hb .t{flex:1;background:var(--track);border-radius:6px;height:9px}.hb .t b{display:block;height:9px;border-radius:6px;background:var(--blue)}.hb .vv{width:100px;text-align:right;font-variant-numeric:tabular-nums}
.login{max-width:400px;margin:8vh auto;padding:0 16px}.empty{color:var(--mu);padding:14px 0}
.login .brand{display:flex;align-items:center;gap:10px;justify-content:center;margin-top:18px;color:var(--mu);font-size:12px}.login .brand img{height:44px;border-radius:8px;background:#1d1f24}
@media(max-width:1000px){.side{transform:translateX(-100%);transition:transform .2s;box-shadow:0 0 40px rgba(0,0,0,.2)}body.nav-open .side{transform:none}.main{margin:0}.burger{display:inline-block}
 .g4,.g3,.g2,.g21,.form{grid-template-columns:1fr}.top{padding:8px 12px}.top .sub{display:none}.wrap{padding:14px 12px 40px}}
@media print{.side,.top,.bar,.btn,.foot,.tabs{display:none!important}.main{margin:0}body{background:#fff;color:#000}.card{border:0;box-shadow:none}}
/* biểu đồ SVG: tô lại lưới / chữ theo chủ đề */
svg line[stroke="#e5e7eb"]{stroke:var(--track)}svg text[fill="#6b7280"]{fill:var(--mu)}svg line[stroke="#94a3b8"]{stroke:var(--mu)}
:root[data-theme=dark] img.ph-img,:root[data-theme=dark] .ph img{filter:brightness(.92)}
@media print{.side,.top,.bar,.btn{display:none!important}.main{margin:0}}
/* ---- AI chat & kho ảnh ---- */
.chat{display:flex;flex-direction:column;height:calc(100vh - 150px);min-height:480px}
.msgs{flex:1;overflow:auto;padding:6px 4px 14px;display:flex;flex-direction:column;gap:10px}
.m{max-width:78%;padding:10px 14px;border-radius:14px;line-height:1.5;word-wrap:break-word}
.m.user{align-self:flex-end;background:var(--blue);color:#fff;border-bottom-right-radius:4px}
.m.assistant{align-self:flex-start;background:var(--card);border:1px solid var(--bd);border-bottom-left-radius:4px}
.m.note{align-self:center;background:var(--soft2);color:var(--mu);font-size:12px;max-width:90%}
.m.tool{align-self:flex-start;background:none;color:var(--mu);font-size:12px;padding:0 6px}
.m.err{align-self:center;background:#fee2e2;color:#991b1b}
.act{align-self:flex-start;max-width:640px;width:100%;border:2px solid #fbbf24;background:var(--warn-bg);border-radius:12px;padding:12px 14px}
.act.done{border-color:#86efac;background:var(--ok-bg)}.act.cancelled,.act.expired{border-color:#d1d5db;background:var(--soft)}.act.failed{border-color:#fca5a5;background:var(--err-bg)}
.act table th{background:none;text-transform:none;font-size:13px;color:var(--mu);width:34%;padding:4px 8px}.act table td{padding:4px 8px}
.act .row{display:flex;gap:8px;margin-top:10px}
.cin{display:flex;gap:8px;padding-top:10px;border-top:1px solid var(--bd)}.cin textarea{resize:none;height:46px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.chips button{border:1px solid var(--bd);background:var(--card);border-radius:99px;padding:4px 12px;cursor:pointer;font:inherit;font-size:12px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.ph{background:var(--card);border:1px solid var(--bd);border-radius:10px;overflow:hidden;position:relative}
.ph img{width:100%;height:130px;object-fit:cover;display:block;background:var(--track)}
.ph .i{padding:6px 8px;font-size:12px}.ph .c{position:absolute;top:6px;left:6px;background:rgba(15,42,92,.85);color:#fff;border-radius:6px;padding:1px 7px;font-size:11px}
.ph .k{position:absolute;top:6px;right:6px;background:var(--card);border-radius:6px;padding:0 5px}
.ph input[type=checkbox]{position:absolute;bottom:50px;right:8px;width:18px;height:18px}
.pdet{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:18px}.pdet img.big{width:100%;border-radius:10px;border:1px solid var(--bd)}
.rep img{max-width:100%}
@media(max-width:1000px){.pdet{grid-template-columns:1fr}.m{max-width:94%}}

.chips .btn.s{border-radius:99px}.chips .btn.p{color:#fff}

.worker .main{margin-left:0}.worker .wrap{padding:12px}

/* ---- Chi phí & Tiến độ ---- */
.pb{position:relative;height:10px;background:var(--track);border-radius:99px;margin:8px 0 6px;overflow:visible}
.pb b{display:block;height:10px;border-radius:99px;background:var(--blue)}.pb b.ok{background:var(--ok)}.pb b.warn{background:var(--warn)}.pb b.bad{background:var(--err)}
.pb i{position:absolute;top:-4px;width:3px;height:18px;background:#0f172a;border-radius:2px}
.al{display:flex;gap:10px;align-items:flex-start;padding:8px 12px;border-radius:8px;margin:6px 0;font-size:13.5px}
.al.r{background:#fee2e2;color:#991b1b}.al.y{background:#fef3c7;color:#92400e}.al.b{background:#dbeafe;color:#1e40af}.al a{margin-left:auto;white-space:nowrap;font-weight:600}
.kpi .v.sm{font-size:21px}.kpi .v small{font-size:13px;font-weight:500;color:var(--mu)}
tr.off td{color:#9ca3af;background:#fafafa}tr.today td{background:var(--info-bg)}
td.lock{white-space:nowrap}.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}.tabs a{padding:8px 16px;border-radius:99px;border:1px solid var(--bd);background:var(--card);color:var(--tx);font-weight:600}
.tabs a.on{background:var(--blue);border-color:var(--blue);color:#fff;text-decoration:none}
.dz{border:2px dashed #94a3b8;border-radius:12px;padding:22px;text-align:center;cursor:pointer;background:var(--soft);display:block;font-weight:500}
.tbl-in input,.tbl-in select{padding:6px 8px;min-width:0}.tbl-in td{padding:5px 6px}.tbl-in input.r{text-align:right}
.chart[data-ct]{height:270px}.note{color:var(--mu);font-size:12.5px}
@media(max-width:700px){.wrap{padding:14px 12px 50px}.kpi .v{font-size:22px}.tbl-in{font-size:13px}.chart[data-ct]{height:230px}}

.cin .mic{width:46px;padding:0;font-size:20px;flex:none}.cin .mic.rec{background:#dc2626;color:#fff;border-color:#dc2626;animation:pulse 1.2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(220,38,38,.25)}}
.vbar{display:flex;align-items:center;gap:10px;padding:8px 12px;margin:6px 0;border:1px solid var(--bd);border-radius:10px;background:var(--err-bg);font-size:13px}.vbar[hidden]{display:none}
#vauto{background:var(--info-bg)}.vdot{width:10px;height:10px;border-radius:50%;background:#dc2626;animation:pulse 1.2s infinite}
.vlev{flex:1;max-width:160px;height:6px;background:var(--track);border-radius:3px;overflow:hidden}.vlev i{display:block;height:100%;width:0;background:#16a34a;transition:width .08s}
.vopt{display:flex;gap:14px;align-items:center;margin:4px 0;font-size:13px}.vopt label{margin:0;font-weight:400}
.al.r{background:var(--err-bg);color:var(--err)}.al.y{background:var(--warn-bg);color:var(--warn)}.al.b{background:var(--info-bg);color:var(--blue)}
.tabs a{font-weight:500;color:var(--mu)}.tabs a.on{font-weight:600}
/* ---- Bóc tách & dự toán ---- */
.steps{display:flex;gap:0;margin:0 0 16px;border:1px solid var(--bd);border-radius:12px;overflow:hidden;background:var(--card);flex-wrap:wrap}
.steps a{flex:1;min-width:150px;padding:10px 14px;color:var(--mu);display:flex;gap:10px;align-items:center;border-right:1px solid var(--bd)}.steps a:last-child{border-right:0}
.steps a b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--soft2);color:var(--mu);font-size:12px;flex:none}
.steps a.on{background:var(--side-on);color:var(--side-on-tx);font-weight:600}.steps a.on b{background:var(--blue);color:#fff}.steps a:hover{text-decoration:none;background:var(--hover)}
.steps a small{display:block;font-weight:400;font-size:11px;color:var(--mu)}
.prog{height:8px;background:var(--track);border-radius:99px;overflow:hidden}.prog i{display:block;height:100%;background:var(--blue);transition:width .4s}
.log{font:12px/1.5 ui-monospace,Consolas,monospace;background:var(--soft);border:1px solid var(--bd);border-radius:8px;padding:8px 10px;max-height:190px;overflow:auto;white-space:pre-wrap;color:var(--mu)}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.thumbs a{border:1px solid var(--bd);border-radius:8px;overflow:hidden;background:var(--soft);display:block;color:var(--tx);font-size:12px}
.thumbs a img{width:100%;height:110px;object-fit:contain;background:#fff;display:block}.thumbs a span{display:block;padding:4px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thumbs a:hover{text-decoration:none;border-color:var(--blue)}
table.boq{font-size:.88rem}table.boq td{padding:3px 4px;vertical-align:middle}table.boq input,table.boq select,table.boq textarea{padding:4px 6px;border-radius:6px;border-color:transparent;background:transparent;min-width:0}
table.boq input:hover,table.boq select:hover,table.boq textarea:hover{border-color:var(--bd)}table.boq input:focus,table.boq textarea:focus{background:var(--card)}
table.boq tr.h td{background:var(--soft2);font-weight:650}table.boq tr.h2 td{background:var(--soft);font-weight:600}table.boq tr.h3 td{font-style:italic;font-weight:600;color:var(--mu)}
table.boq input.r{text-align:right;font-variant-numeric:tabular-nums}table.boq td.stt{color:var(--mu);white-space:nowrap;font-size:12px}
tr.low td{background:var(--warn-bg)}tr.del td{opacity:.4;text-decoration:line-through}
.cf{display:inline-block;min-width:34px;text-align:center;border-radius:99px;font-size:11px;padding:0 6px}.cf.h{background:var(--ok-bg);color:var(--ok)}.cf.m{background:var(--warn-bg);color:var(--warn)}.cf.l{background:var(--err-bg);color:var(--err)}
.chk{font-size:11.5px;color:var(--warn);line-height:1.35}.src{font-size:11px;color:var(--mu)}
.res td{font-size:.86rem;padding:3px 6px}.res tr.it td{background:var(--soft);font-weight:600;border-top:2px solid var(--bd)}
.cols-hide .cx{display:none}
.sum td{padding:7px 10px}.sum tr.b td{font-weight:700}.sum tr.big td{font-size:1.08rem;font-weight:750;background:var(--info-bg)}
.tip{background:var(--info-bg);color:var(--tx);border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:14px;border:1px solid color-mix(in srgb,var(--blue) 15%,transparent)}
dialog{border:1px solid var(--bd);border-radius:12px;background:var(--card);color:var(--tx);padding:18px;max-width:640px;width:94vw}dialog::backdrop{background:rgba(0,0,0,.35)}
.bar input[type=checkbox],.bar input[type=radio]{min-width:0;width:auto}
table.boq td.meta{min-width:170px;max-width:260px}table.boq td.meta .chk,table.boq td.meta .src{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
table.boq td.meta:hover .chk,table.boq td.meta:hover .src{-webkit-line-clamp:unset}
table.boq textarea{height:30px;min-height:30px;line-height:1.35}
/* ===== v8.2: thanh menu trái – 3 màu (xanh nhạt / xanh / tối), đầu mục rõ, nhóm mở nền trắng ===== */
:root{--sb:#e3eefb;--sb-bd:#c9dcf3;--sb-tx:#14386a;--sb-mu:#4f6f96;--sb-hover:#d2e3f7;--sb-logo:#14386a}
:root[data-side=blue]{--sb:#1f5aa6;--sb-bd:#1a4d8f;--sb-tx:#fff;--sb-mu:#c6daf5;--sb-hover:rgba(255,255,255,.13);--sb-logo:#fff}
:root[data-side=dark]{--sb:#1b2029;--sb-bd:#2a313c;--sb-tx:#e8ecf1;--sb-mu:#9aa5b4;--sb-hover:rgba(255,255,255,.07);--sb-logo:#fff}
.side{background:var(--sb);border-right-color:var(--sb-bd);padding:12px 10px 14px}
.side .logo{color:var(--sb-logo);border-bottom-color:var(--sb-bd)}.side .logo small{color:var(--sb-mu)}
:root[data-side=blue] .side .logo .mk{background:#fff;color:#1f5aa6}
.side>a{color:var(--sb-tx);font-weight:600;font-size:.98rem;padding:9px 12px}.side>a .ic{filter:none;opacity:1}.side>a:hover{background:var(--sb-hover)}
.side>a.on{background:#fff;color:#1f4fb4;box-shadow:0 1px 3px rgba(16,24,40,.12)}
.side .grp{margin:3px 0;border-radius:10px;border:1px solid transparent;transition:background .15s}
.side summary{font-size:1rem;font-weight:700;text-transform:none;letter-spacing:.1px;color:var(--sb-tx);padding:10px 12px;border-radius:10px;gap:10px;justify-content:flex-start}
.side summary .gi{width:22px;text-align:center;font-size:1.05em;flex:none}
.side summary:after{margin-left:auto;font-size:18px;opacity:.75;font-weight:400}
.side summary:hover{background:var(--sb-hover);color:var(--sb-tx)}
.side details[open]{background:#fff;border-color:var(--sb-bd);box-shadow:0 1px 4px rgba(16,24,40,.10);padding-bottom:6px}
.side details[open] summary{color:#0f2f5c;border-bottom:1px solid #e6ecf3;border-radius:10px 10px 0 0;margin-bottom:4px;background:#f3f7fc}
.side details[open] a{color:#1f2a37;font-size:.95rem;padding:7px 12px 7px 16px;margin:1px 6px}
.side details[open] a .ic{filter:none;opacity:.85}
.side details[open] a:hover{background:#eef4fc;text-decoration:none}
.side details[open] a.on{background:#e1ecfb;color:#1a4fb0;font-weight:700;box-shadow:inset 3px 0 0 #2f62c9}
.side .new{background:#2f62c9}
.side .credit{color:var(--sb-mu)}.side .credit b{color:var(--sb-tx)}
.sbpick{display:flex;align-items:center;gap:7px;padding:12px 10px 0;margin-top:auto;font-size:12px;color:var(--sb-mu)}.sbpick span{flex:1}
.sbpick button{width:22px;height:22px;border-radius:50%;border:2px solid var(--sb-bd);cursor:pointer;padding:0}.sbpick button.on{outline:2px solid var(--sb-tx);outline-offset:2px}
.side .credit{margin-top:6px}

/* v9: biểu tượng nét mảnh (SVG), menu theo phòng ban */
svg.ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;filter:none!important}
.side a svg.ic{opacity:.65}.side a.on svg.ic,.side>a svg.ic{opacity:1}
.side summary{font-size:.95rem;font-weight:650}
.side .sh{font-size:10.5px;letter-spacing:.7px;text-transform:uppercase;color:#8a96a8;padding:9px 18px 3px;font-weight:600}
.side details[open] .sh{color:#7b8797}
.tabs a svg.ic{margin-right:4px}
.rolegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 22px;margin-top:4px}
/* ===== v13: giám sát (biểu đồ S, gạch đầu dòng, thanh tiến độ), dự toán ===== */
.sc-wrap{height:380px}
.sc-tip{position:absolute;z-index:5;background:var(--card);border:1px solid var(--bd);border-radius:8px;padding:8px 10px;font-size:12.5px;box-shadow:0 4px 14px rgba(0,0,0,.12);pointer-events:none;min-width:170px}
.sc-tip div{margin-top:3px;white-space:nowrap}.sc-tip i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.sc-big{display:flex;gap:28px;flex-wrap:wrap;margin:2px 0 10px}.sc-big>div{display:flex;flex-direction:column}.sc-big .n{font-size:1.65rem;font-weight:700;line-height:1.15;font-variant-numeric:tabular-nums}
.sc-big .t{font-size:12px;color:var(--mu);display:flex;align-items:center;gap:6px}.sc-big .t i{display:inline-block;width:18px;height:3px;border-radius:2px}
.sc-big .t i.d{background:repeating-linear-gradient(90deg,#94a3b8 0 5px,transparent 5px 8px)!important}
.brief{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--bd);display:grid;grid-template-columns:1fr 1fr;gap:8px 28px}
.brief li{display:flex;gap:10px;align-items:flex-start;line-height:1.5}.brief .dot{flex:none;width:10px;height:10px;border-radius:50%;margin-top:6px}
.brief .dot.g{background:var(--ok)}.brief .dot.y{background:#f59e0b}.brief .dot.r{background:var(--err)}.brief .dot.b{background:var(--blue)}
.brief .h{font-weight:650;min-width:112px;flex:none;color:var(--tx)}.brief .x{color:var(--tx)}.brief .x b{font-weight:700}
@media(max-width:900px){.brief{grid-template-columns:1fr}.brief .h{min-width:96px}}
.mbar{position:relative;height:9px;background:var(--track);border-radius:99px;min-width:110px;margin:5px 0 3px}
.mbar b{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--ok)}.mbar b.y{background:#f59e0b}.mbar b.r{background:var(--err)}.mbar b.o{background:#f97316}
.mbar i{position:absolute;top:-4px;width:3px;height:17px;background:var(--tx);border-radius:2px;margin-left:-1px}
.mbar-t{font-size:12px;color:var(--mu);white-space:nowrap}.mbar-t b{color:var(--tx)}
details.more>summary{cursor:pointer;font-weight:650;padding:4px 0;list-style:none}details.more>summary::before{content:"▸ ";color:var(--mu)}details.more[open]>summary::before{content:"▾ "}
.lockrow td{opacity:.62}
/* v19.1 bảng chọn ngày công */
.dpk{position:fixed;z-index:80;display:none;width:min(430px,94vw);padding:10px 12px;box-shadow:0 12px 32px rgba(0,0,0,.28)}
.dpk-h{display:flex;align-items:center;margin-bottom:8px}.dpk-h b{flex:1;font-size:13.5px}.dpk-x{all:unset;cursor:pointer;padding:2px 6px;color:var(--mu)}
.dpk-b{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.dpk-b button{border:1px solid var(--bd);background:var(--card);color:var(--tx);border-radius:8px;padding:8px 2px;font-size:12.5px;font-weight:650;cursor:pointer;line-height:1.2}
.dpk-b button.on{outline:2px solid var(--blue)}.dpk-x1{color:#15803d!important}.dpk-h1{color:#b45309!important}.dpk-p1{color:#2f62c9!important}.dpk-k1{color:#b91c1c!important}.dpk-c1{color:var(--mu)!important}
.dpk-f{display:flex;gap:8px;margin-top:8px}.dpk-f label{margin:0;font-size:12px}.dpk-f .dpk-ot{width:90px}.dpk-nl{flex:1}.dpk-s{display:flex;align-items:center;gap:8px;margin-top:8px}.dpk-s .note{flex:1;font-size:11.5px}
td.dpk-on{outline:2px solid var(--blue);outline-offset:-2px}
@media(max-width:520px){.dpk-b{grid-template-columns:repeat(3,1fr)}}