/* Goku CRM V5.1 · projects – Dự án → Epic → User Story → Task, màu theo cấp, nút chuyển trạng thái */
:root{
  --lv-dash:#64748b;--lv-dash-bg:#f1f4f8;
  --lv-project:#4f46e5;--lv-project-bg:#eef0ff;
  --lv-epic:#0284c7;--lv-epic-bg:#e8f5fd;
  --lv-us:#9333ea;--lv-us-bg:#f5edff;
  --lv-task:#059669;--lv-task-bg:#e7f8f1;
  --v51-l:#e4e9f2;--v51-m:#6b7890;--v51-t:#1b2740;--v51-navy:#18213d
}
/* ---------- nhãn cấp ---------- */
.v51-badge{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:20px;padding:0 6px;border-radius:6px;font-size:10.5px;font-weight:800;letter-spacing:.4px;flex-shrink:0;line-height:1}
.v51-badge.k-epic{background:var(--lv-epic-bg);color:var(--lv-epic)}.v51-badge.k-us{background:var(--lv-us-bg);color:var(--lv-us)}.v51-badge.k-task{background:var(--lv-task-bg);color:var(--lv-task)}.v51-badge.k-project{background:var(--lv-project-bg);color:var(--lv-project)}
/* ---------- đầu trang + thanh cấp ---------- */
.v51pm .v51-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.v51-eyebrow{font-size:11px;font-weight:800;letter-spacing:1.2px;color:var(--lv-project);margin-bottom:4px}
.v51pm .v51-head .title{font-size:26px;letter-spacing:-.3px;overflow-wrap:anywhere}
.v51-headbtn{display:flex;gap:8px;flex-wrap:wrap}
.v51-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--lv-project);background:var(--lv-project);color:#fff;font-weight:700;padding:9px 14px;border-radius:10px;cursor:pointer;font-size:13.5px;white-space:nowrap}
.v51-btn:hover{filter:brightness(1.06)}
.v51-btn.ghost{background:#fff;color:#33415c;border-color:var(--v51-l)}.v51-btn.ghost:hover{background:#f6f8fc;filter:none}
.v51-btn.wide{width:100%;margin-top:10px}
.v51-btn.lv-us{background:var(--lv-us);border-color:var(--lv-us)}
.v51-nav{display:flex;gap:4px;margin:16px 0 14px;padding:5px;background:#fff;border:1px solid var(--v51-l);border-radius:14px;overflow-x:auto;scrollbar-width:none}
.v51-nav::-webkit-scrollbar{display:none}
.v51-nav button{--c:var(--lv-dash);--cb:var(--lv-dash-bg);display:flex;align-items:center;gap:7px;border:0;background:transparent;padding:9px 13px;border-radius:10px;font-weight:700;color:#3d4a63;cursor:pointer;white-space:nowrap;font-size:14px;position:relative}
.v51-nav button .pm47-ic{color:var(--c)}
.v51-nav button:hover{background:var(--cb)}
.v51-nav button.on{background:var(--c);color:#fff;box-shadow:0 4px 12px -6px var(--c)}
.v51-nav button.on .pm47-ic{color:#fff}
.v51-nav em{font-style:normal;font-size:11px;font-weight:800;background:var(--cb);color:var(--c);border-radius:999px;padding:1px 7px}
.v51-nav button.on em{background:rgba(255,255,255,.22);color:#fff}
.v51-nav .lv-project{--c:var(--lv-project);--cb:var(--lv-project-bg)}.v51-nav .lv-epic{--c:var(--lv-epic);--cb:var(--lv-epic-bg)}.v51-nav .lv-us{--c:var(--lv-us);--cb:var(--lv-us-bg)}.v51-nav .lv-task{--c:var(--lv-task);--cb:var(--lv-task-bg)}
.v51-nav .lv-sprint,.v51-nav .lv-people{--c:#334155;--cb:#f1f4f8}
/* ---------- thẻ, công cụ ---------- */
.v51-card{background:#fff;border:1px solid var(--v51-l);border-radius:16px;padding:16px;box-shadow:0 1px 8px rgba(20,40,80,.035);min-width:0}
.v51-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.v51-search{flex:1 1 260px;display:flex;align-items:center;gap:8px;border:1px solid var(--v51-l);border-radius:10px;padding:0 12px;background:#fff;min-width:0;color:var(--v51-m)}
.v51-search input{border:0;outline:0;padding:10px 0;flex:1;min-width:0;background:transparent;color:var(--v51-t)}
.v51-search:focus-within{border-color:var(--lv-project);box-shadow:0 0 0 3px var(--lv-project-bg)}
.v51-select{border:1px solid var(--v51-l);border-radius:10px;padding:10px 12px;background:#fff;color:var(--v51-t);min-width:0;max-width:100%}
.v51-seg{display:inline-flex;border:1px solid var(--v51-l);border-radius:10px;padding:3px;background:#fff;gap:2px}
.v51-seg button{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;border-radius:7px;padding:6px 11px;font-weight:700;color:#55627a;cursor:pointer}
.v51-seg button.on{background:var(--lv-project-bg);color:var(--lv-project)}
.v51-foot{font-size:12px;color:var(--v51-m);margin-top:10px}
.v51-empty{padding:34px 16px;text-align:center;color:var(--v51-m);border:1px dashed var(--v51-l);border-radius:12px}
.v51-bar{display:inline-block;width:120px;max-width:100%;height:7px;border-radius:9px;background:#e9eef7;overflow:hidden;vertical-align:middle}
.v51-bar i{display:block;height:100%;border-radius:9px;background:var(--lv-project)}
.v51-bar.late i{background:#e5484d}
.v51-due.late{color:#c4320a;font-weight:700}.v51-due.soon{color:#b54708;font-weight:700}
.v51pm .v51-st{font-size:12px;font-weight:700;white-space:nowrap}
/* ---------- bảng danh sách dự án ---------- */
.v51-ptable,.v51-utable{border:1px solid var(--v51-l);border-radius:12px;overflow:hidden}
.v51-prow{display:grid;grid-template-columns:minmax(200px,2.1fr) minmax(110px,1.1fr) minmax(120px,1.2fr) minmax(110px,1fr) minmax(130px,1.1fr) minmax(130px,1.1fr) minmax(96px,.8fr);gap:12px;align-items:center;padding:13px 14px;border-top:1px solid #edf0f5;cursor:pointer;font-size:13.5px}
.v51-prow:hover{background:#fafbff}.v51-prow:focus-visible{outline:2px solid var(--lv-project);outline-offset:-2px}
.v51-prow>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.v51-phead{background:#f5f7fb;border-top:0;font-size:12px;font-weight:700;color:var(--v51-m);cursor:default;padding:11px 14px}
.v51-phead:hover{background:#f5f7fb}
.v51-pname{display:flex;flex-direction:column;gap:2px}
.v51-pname b{font-weight:700;color:var(--v51-t);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v51-pname small,.v51-pg small{color:var(--v51-m);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v51-pg{display:flex;flex-direction:column;gap:4px}
.v51-prod{display:inline-block;background:var(--lv-project-bg);color:var(--lv-project);font-weight:700;font-size:12px;border-radius:999px;padding:3px 10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
.v51-blk{display:block;color:#b54708;font-size:11.5px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* thẻ dự án */
.v51-pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.v51-pcard{border:1px solid var(--v51-l);border-top:3px solid var(--lv-project);border-radius:14px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:10px;background:#fff;min-width:0}
.v51-pcard:hover{box-shadow:0 6px 20px -10px rgba(40,60,120,.35)}
.v51-pc-h{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.v51-pc-h>div{min-width:0}.v51-pc-h b{display:block;font-size:15px}.v51-pc-h small{color:var(--v51-m);font-size:12px}
.v51-pc-pg{display:flex;align-items:center;gap:8px}.v51-pc-pg .v51-bar{flex:1;width:auto}
.v51-pc-m{display:flex;gap:10px;flex-wrap:wrap;font-size:12.5px;font-weight:700;color:#3d4a63}
.v51-pc-m span{display:inline-flex;align-items:center;gap:5px}
.v51-pc-d{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;border-top:1px solid #eef1f6;padding-top:10px}
.v51-pc-d dt{font-size:11px;color:var(--v51-m)}.v51-pc-d dd{margin:2px 0 0;font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ---------- chi tiết dự án ---------- */
.v51-crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--v51-m);margin:0 0 12px}
.v51-crumb button{display:inline-flex;align-items:center;gap:3px;border:0;background:transparent;color:var(--lv-project);font-weight:700;cursor:pointer;padding:4px 0}
.v51-crumb b{color:var(--v51-t)}.v51-crumb em{font-style:normal}
.v51-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.v51-kpi{background:#fff;border:1px solid var(--v51-l);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:3px;border-left:4px solid var(--c,#cbd5e1);min-width:0}
.v51-kpi small{color:var(--v51-m);font-size:12.5px}.v51-kpi strong{font-size:26px;letter-spacing:-.5px;line-height:1.2;overflow-wrap:anywhere}.v51-kpi em{font-style:normal;font-size:12px;color:var(--v51-m)}
.v51-kpi .v51-bar{width:100%;margin:3px 0}
.v51-kpi.k-project{--c:var(--lv-project)}.v51-kpi.k-epic{--c:var(--lv-epic)}.v51-kpi.k-us{--c:var(--lv-us)}.v51-kpi.k-accept{--c:#d97706}
.v51-detail{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:14px;align-items:start}
.v51-dtabs{display:flex;gap:4px;border-bottom:1px solid var(--v51-l);margin:-4px 0 14px;overflow-x:auto;scrollbar-width:none}
.v51-dtabs button{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;padding:10px 12px;font-weight:700;color:#55627a;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;white-space:nowrap}
.v51-dtabs button.on{color:var(--lv-project);border-bottom-color:var(--lv-project)}
.v51-ttools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.v51-legend{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--v51-m);flex-wrap:wrap}
.v51-legend .v51-badge{margin-left:6px}
/* cây công việc */
.v51-tree{border:1px solid var(--v51-l);border-radius:12px;overflow:hidden}
.v51-tr{display:grid;grid-template-columns:minmax(0,1fr) 108px 132px 108px 52px 88px;gap:8px;align-items:center;padding:10px 12px;border-top:1px solid #edf0f5;font-size:13.5px;border-left:3px solid transparent}
.v51-th{background:#f5f7fb;border-top:0;font-size:12px;font-weight:700;color:var(--v51-m);padding:11px 12px}
.v51-tr.lv-epic{background:#f4faff;border-left-color:var(--lv-epic)}
.v51-tr.lv-us{background:#fbf8ff;border-left-color:#c9a6f5}
.v51-tr.lv-task{background:#fff;border-left-color:#a7e3cc}
.v51-tr.is-late .v51-nm{color:#b42318}
.v51-tn{display:flex;align-items:center;gap:8px;min-width:0}
.v51-tn b{font-weight:700;overflow:hidden;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;overflow-wrap:anywhere}
.v51-tn.d1{padding-left:22px}.v51-tn.d2{padding-left:46px}
.v51-lv-task .v51-tn.d1{padding-left:22px}
.v51-nm{overflow:hidden;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;overflow-wrap:anywhere}
.v51-tw{width:24px;height:24px;border-radius:7px;border:1px solid var(--v51-l);background:#fff;display:inline-grid;place-items:center;cursor:pointer;color:#55627a;flex-shrink:0;padding:0}
.v51-tw .pm47-ic{transition:transform .15s}.v51-tw.open .pm47-ic{transform:rotate(90deg)}
.v51-tw-sp{width:24px;flex-shrink:0}
.v51-el{color:#a3adbf;width:14px;flex-shrink:0;text-align:center}
.v51-tc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#3d4a63}
.v51-pct b{font-weight:800}
.v51-who{display:flex;flex-direction:column;line-height:1.3;min-width:0}.v51-who>span:first-child{overflow:hidden;text-overflow:ellipsis}.v51-who .v51-due{font-size:11.5px;color:var(--v51-m)}.v51-who .v51-due.late{color:#c4320a}.v51-who .v51-due.soon{color:#b54708}
.v51-det{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--v51-l);background:#fff;border-radius:9px;padding:6px 10px;font-weight:700;font-size:12.5px;color:#33415c;cursor:pointer;white-space:nowrap}
.v51-det:hover{border-color:var(--lv-project);color:var(--lv-project)}
.v51-qadd{display:none;gap:4px;margin-left:auto;flex-shrink:0}
.v51-tr:hover .v51-qadd,.v51-qadd:focus-within{display:inline-flex}
.v51-qadd button{border:1px dashed #b9c3d6;background:#fff;border-radius:6px;font-size:11px;font-weight:700;padding:2px 6px;color:#55627a;cursor:pointer}
.v51-qadd button:hover{border-style:solid;color:var(--lv-project);border-color:var(--lv-project)}
.v51-note{margin:12px 0 0;background:var(--lv-project-bg);border:1px solid #d9dcff;color:#3a3f8f;border-radius:10px;padding:10px 12px;font-size:12.5px}
/* cột thông tin */
.v51-info h3{margin:0 0 10px;font-size:16px}
.v51-info dl{margin:0}
.v51-irow{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #eff2f6;font-size:13.5px}
.v51-irow dt{color:var(--v51-m)}.v51-irow dd{margin:0;font-weight:700;text-align:right;min-width:0;overflow-wrap:anywhere}
.v51-blk2{color:#b54708}
.v51-hint{margin:12px 0 0;background:#f2f6ff;border:1px solid #dfe7fb;border-radius:10px;padding:10px 12px;font-size:12.5px;color:#3d4a75}
/* tài liệu & duyệt, trao đổi */
.v51-docs h4,.v51-h4{margin:16px 0 8px;font-size:14px}.v51-docs h4:first-child{margin-top:0}
.v51-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.v51-lk{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--v51-l);border-radius:10px;padding:10px;min-width:0}
.v51-lk>div{min-width:0;display:flex;flex-direction:column;gap:2px;overflow:hidden}.v51-lk small{color:var(--v51-m);font-size:12px}
.v51-lk a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v51-lk.muted{background:#fafbfd}
.v51-deliv{border:1px solid var(--v51-l);border-radius:10px;padding:10px 12px;font-size:13.5px;overflow-wrap:anywhere}
.v51-res{display:flex;flex-direction:column;gap:6px}
.v51-ri{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--v51-l);border-radius:10px;padding:9px 10px;cursor:pointer;min-width:0}
.v51-ri>div{min-width:0;display:flex;flex-direction:column;gap:3px}.v51-ri small{overflow:hidden;text-overflow:ellipsis}
.v51-wait{display:flex;flex-direction:column;gap:6px;margin-top:10px}.v51-wait>small{color:var(--v51-m)}
.v51-wi{display:flex;align-items:center;gap:8px;border:1px solid #eadcfd;background:#fbf8ff;border-radius:10px;padding:8px 10px;cursor:pointer;text-align:left;font-weight:600}
.v51-wi em{margin-left:auto;font-style:normal;font-weight:400;font-size:12px}
.v51-chat{display:flex;gap:12px;align-items:center;border:1px solid #d9e4fb;background:#f4f8ff;border-radius:12px;padding:14px;flex-wrap:wrap}
.v51-chat>.pm47-ic{width:28px;height:28px;color:var(--lv-project);flex-shrink:0}
.v51-chat>div{flex:1 1 220px;display:flex;flex-direction:column;gap:3px;min-width:0}.v51-chat small{color:var(--v51-m)}
.v51-chat.off{background:#fafbfd;border-color:var(--v51-l)}.v51-chat.off>.pm47-ic{color:#94a3b8}
.v51-cbox{display:flex;gap:8px;margin-top:12px;align-items:flex-start}.v51-cbox textarea{flex:1;min-width:0;resize:vertical}
.v51-feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.v51-feed li{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #f0f2f6;font-size:13px}
.v51-feed li>i{width:9px;height:9px;border-radius:50%;margin-top:5px;flex-shrink:0;background:#94a3b8}
.v51-feed li.k-project>i{background:var(--lv-project)}.v51-feed li.k-epic>i{background:var(--lv-epic)}.v51-feed li.k-us>i{background:var(--lv-us)}.v51-feed li.k-task>i{background:var(--lv-task)}.v51-feed li.k-note>i{background:#d97706}
.v51-feed p{margin:2px 0 0;overflow-wrap:anywhere}.v51-feed small{color:var(--v51-m)}
/* bảng User Story */
.v51-urow{display:grid;grid-template-columns:minmax(220px,2.2fr) minmax(120px,1.2fr) minmax(110px,1fr) 100px minmax(120px,1fr) 120px;gap:12px;align-items:center;padding:12px 14px;border-top:1px solid #edf0f5;cursor:pointer;font-size:13.5px;border-left:3px solid transparent}
.v51-urow:not(.v51-phead):hover{background:#fbf8ff;border-left-color:var(--lv-us)}
.v51-urow>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v51-urow .v51-pname{flex-direction:row;align-items:center;gap:8px}.v51-urow .v51-pname>span{display:flex;flex-direction:column;min-width:0}
.v51-urow.is-late .v51-pname b{color:#b42318}
.v51-epicref{color:var(--lv-epic);font-weight:600}
/* ---------- hộp chuyển trạng thái (ngăn chi tiết) ---------- */
.v51-trans{border:1px solid #dfe6f3;background:#fbfcff;border-radius:14px;padding:12px 14px;margin-top:16px;box-shadow:0 -6px 18px -14px rgba(20,40,80,.4)}
.drawer .v51-trans:not(.inline){position:sticky;bottom:0;z-index:2;background:#fff}
.v51-trans.k-project{border-top:3px solid var(--lv-project)}.v51-trans.k-epic{border-top:3px solid var(--lv-epic)}.v51-trans.k-us{border-top:3px solid var(--lv-us)}.v51-trans.k-task{border-top:3px solid var(--lv-task)}
.v51-tx-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.v51-tx-l{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.v51-tx-l small{color:var(--v51-m);font-size:12px;margin-right:2px;width:100%}.v51-tx-l i{color:#94a3b8;display:inline-flex}
.v51-tx-end{color:var(--v51-m);font-size:12.5px}
.v51-trans .v51-next{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:10px;padding:10px 14px;font-weight:800;color:#fff;cursor:pointer;background:#4f46e5;white-space:nowrap}
.v51-trans .v51-next.c-gray{background:#475467}.v51-trans .v51-next.c-blue{background:#2563eb}.v51-trans .v51-next.c-purple{background:#7c3aed}.v51-trans .v51-next.c-gold{background:#c27c0e}.v51-trans .v51-next.c-green{background:#079455}.v51-trans .v51-next.c-red{background:#d92d20}.v51-trans .v51-next.c-teal{background:#0e9384}.v51-trans .v51-next.c-pink{background:#c11574}.v51-trans .v51-next.c-orange{background:#e04f16}
.v51-trans .v51-next:disabled,.v51-trans .v51-next[class*='c-']:disabled{background:#cfd6e3;color:#f8fafc;cursor:not-allowed;opacity:1}
.v51-miss{margin-top:8px;font-size:12.5px;color:#7a2e0e;background:#fff6ed;border:1px solid #fde4c8;border-radius:10px;padding:8px 10px}
.v51-miss ul{margin:4px 0 0;padding-left:18px;display:flex;flex-wrap:wrap;gap:2px 18px}
.v51-ok{margin-top:8px;font-size:12.5px;color:#067647}
.v51-info .v51-trans{margin-top:12px}
.v51-info .v51-tx-row{flex-direction:column;align-items:stretch}.v51-info .v51-trans .v51-next{justify-content:center}
/* thêm Epic / US / Task */
.v51-addgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:14px 0}
.v51-addc{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1px solid var(--v51-l);border-top:3px solid var(--c);background:#fff;border-radius:12px;padding:12px;cursor:pointer}
.v51-addc:hover:not(:disabled){background:var(--cb)}
.v51-addc small{color:var(--v51-m);font-size:12px;line-height:1.4}
.v51-addc.k-epic{--c:var(--lv-epic);--cb:var(--lv-epic-bg)}.v51-addc.k-us{--c:var(--lv-us);--cb:var(--lv-us-bg)}.v51-addc.k-task{--c:var(--lv-task);--cb:var(--lv-task-bg)}
.v51-addc:disabled{opacity:.5;cursor:not-allowed}
/* ngăn chi tiết task / US: màu trạng thái mới + nhãn cấp */
.v38-drawer .c-teal,.v51-trans .c-teal{background:#e3f7f5;color:#0e7c74}.v38-drawer .c-pink,.v51-trans .c-pink{background:#fdeaf4;color:#b8226f}
.v38-drawer .c-gray,.v51-trans .c-gray{background:#f2f4f7;color:#475467}.v38-drawer .c-blue,.v51-trans .c-blue{background:#e8f0ff;color:#1f5fd0}.v38-drawer .c-green,.v51-trans .c-green{background:#e6f8ee;color:#067647}.v38-drawer .c-red,.v51-trans .c-red{background:#feeceb;color:#b42318}.v38-drawer .c-gold,.v51-trans .c-gold{background:#fff5df;color:#935600}.v38-drawer .c-purple,.v51-trans .c-purple{background:#f1efff;color:#5925dc}
.v51-trans .pm47-chip{display:inline-flex;align-items:center;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}
.v38-drawer.v51-kind-us{border-top:4px solid var(--lv-us)}.v38-drawer.v51-kind-task{border-top:4px solid var(--lv-task)}
.pm47-drawer{border-top:4px solid var(--lv-project)}
/* ---------- màn hình vừa / nhỏ ---------- */
@media (max-width:1280px){
  .v51-detail{grid-template-columns:1fr}
  .v51-info dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
}
@media (max-width:1100px){
  .v51-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v51-prow{grid-template-columns:minmax(180px,2fr) minmax(110px,1fr) minmax(110px,1fr) minmax(120px,1fr) minmax(110px,1fr)}
  .v51-prow>span:nth-child(4),.v51-prow>span:nth-child(7){display:none}
}
@media (max-width:1000px){
  .v51-tree{border:0;display:flex;flex-direction:column;gap:6px;overflow:visible}
  .v51-tr.v51-th{display:none}
  .v51-tr{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:8px;border:1px solid var(--v51-l);border-left-width:4px;border-radius:10px;padding:10px}
  .v51-tr>.v51-tc{display:inline-flex}
  .v51-tr>.v51-tn{flex:1 1 100%}
  .v51-tr>.v51-tc:not(.v51-act){font-size:12.5px}
  .v51-tr>.v51-tc[data-l="Phòng thực hiện"]{color:var(--v51-m)}
  .v51-tr>.v51-act{margin-left:auto}
  .v51-tn.d1{padding-left:12px}.v51-tn.d2{padding-left:24px}
  .v51-tr.lv-us{margin-left:8px}.v51-tr.lv-task{margin-left:16px}
  .v51-who{flex-direction:row;gap:6px}
  .v51-qadd{display:inline-flex}
  .v51-legend{margin-left:0;width:100%}
  /* danh sách dự án → thẻ */
  .v51-ptable,.v51-utable{border:0;display:flex;flex-direction:column;gap:8px;overflow:visible}
  .v51-phead{display:none!important}
  .v51-prow,.v51-urow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--v51-l);border-radius:12px;gap:8px 12px;padding:12px}
  .v51-prow>span,.v51-urow>span{display:block!important;white-space:normal}
  .v51-prow>span[data-l]::before,.v51-urow>span[data-l]::before{content:attr(data-l);display:block;font-size:11px;color:var(--v51-m);font-weight:600;margin-bottom:2px}
  .v51-prow>.v51-pname,.v51-urow>.v51-pname{grid-column:1/-1}
  .v51-prow>.v51-pname::before,.v51-urow>.v51-pname::before{display:none!important}
  .v51-urow .v51-pname{display:flex!important}
  .v51-prow>.v51-pname{display:flex!important;flex-direction:column}
}
@media (max-width:760px){
  .v51pm .v51-head .title{font-size:22px}
  .v51-headbtn .v51-btn span{display:none}
  .v51-headbtn .v51-btn.lv-project span{display:inline}
  .v51-nav button{padding:9px 10px}
  .v51-nav button span{display:none}
  .v51-nav button.on span{display:inline}
  .v51-kpi{padding:12px}.v51-kpi strong{font-size:21px}
  .v51-kpis{gap:8px}
  .v51-card{padding:12px;border-radius:14px}
  .v51-info dl{grid-template-columns:1fr}
  .v51-tools>.v51-select{flex:1 1 140px}
  .v51-seg button span{display:none}
  .v51-pc-d{grid-template-columns:1fr 1fr}
  .v51-cbox{flex-direction:column;align-items:stretch}
  .v51-tx-row{flex-direction:column;align-items:stretch}.v51-trans .v51-next{justify-content:center}
}