/* TASKS-V3-2026-10-21: View "Công việc" kiểu ClickUp — scope :is(#view-tasks, #tv3-embed), token UI v2 */
:is(#view-tasks, #tv3-embed) { --tv3-side: 16.5rem; }
:is(#view-tasks, #tv3-embed) .tv3 { display: grid; grid-template-columns: var(--tv3-side) minmax(0, 1fr); gap: var(--s-4); align-items: start; }
:is(#view-tasks, #tv3-embed) .tv3-scrim { display: none; }
:is(#view-tasks, #tv3-embed) .tv3-muted { color: var(--fg-muted); font-weight: 400; }
:is(#view-tasks, #tv3-embed) .tv3-pad { padding: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-empty { padding: var(--s-6); text-align: center; color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .tv3-card { background: var(--surface-glass); border: 1px solid var(--border-subtle); border-radius: var(--r-md); }

/* ---- sidebar ---- */
:is(#view-tasks, #tv3-embed) .tv3-side {
  position: sticky; top: var(--s-3); max-height: calc(100vh - 7rem); overflow-y: auto;
  background: var(--surface-1); border: 1px solid var(--border-subtle); border-radius: var(--r-md);
  padding: var(--s-3); display: flex; flex-direction: column; gap: var(--s-2);
}
:is(#view-tasks, #tv3-embed) .tv3-search { display: flex; align-items: center; gap: var(--s-2); background: var(--surface-glass-2); border: 1px solid var(--border-subtle); border-radius: var(--r-sm); padding: 0 var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-search input { flex: 1; min-width: 0; background: none; border: 0; color: var(--fg-primary); min-height: 38px; font: inherit; outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-search kbd { font-size: 0.7rem; color: var(--fg-muted); border: 1px solid var(--border-default); border-radius: var(--r-xs); padding: 1px 5px; }
:is(#view-tasks, #tv3-embed) .tv3-navs { display: flex; flex-direction: column; gap: 2px; padding-bottom: var(--s-2); border-bottom: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-nav, :is(#view-tasks, #tv3-embed) .tv3-proj, :is(#view-tasks, #tv3-embed) .tv3-cat-h {
  display: flex; align-items: center; gap: var(--s-2); width: 100%; min-height: 36px; padding: 0 var(--s-2);
  background: none; border: 0; border-radius: var(--r-sm); color: var(--fg-secondary); font: inherit; text-align: left; cursor: pointer;
}
:is(#view-tasks, #tv3-embed) .tv3-nav:hover, :is(#view-tasks, #tv3-embed) .tv3-proj:hover, :is(#view-tasks, #tv3-embed) .tv3-cat-h:hover { background: var(--surface-glass-2); color: var(--fg-primary); }
:is(#view-tasks, #tv3-embed) .tv3-nav.on, :is(#view-tasks, #tv3-embed) .tv3-proj.on { background: var(--brand-primary-soft); color: var(--fg-primary); font-weight: 600; }
:is(#view-tasks, #tv3-embed) .tv3-nav-ic { width: 1.1rem; text-align: center; color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .tv3-nav-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(#view-tasks, #tv3-embed) .tv3-count { font-size: 0.75rem; color: var(--fg-muted); background: var(--surface-glass-2); border-radius: var(--r-pill); padding: 1px 7px; }
:is(#view-tasks, #tv3-embed) .tv3-count.hot { background: var(--brand-danger); color: #fff; }
:is(#view-tasks, #tv3-embed) .tv3-sec-h { display: flex; align-items: center; justify-content: space-between; font-size: 0.72rem; letter-spacing: 0.08em; color: var(--fg-muted); padding: var(--s-1) var(--s-2) 0; }
:is(#view-tasks, #tv3-embed) .tv3-chip-btn { font-size: 0.72rem; background: var(--surface-glass-2); border: 1px solid var(--border-subtle); color: var(--fg-secondary); border-radius: var(--r-pill); padding: 2px 8px; cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-cat-h { font-weight: 600; color: var(--fg-primary); }
:is(#view-tasks, #tv3-embed) .tv3-cat-badge { width: 1.35rem; height: 1.35rem; border-radius: 0.4rem; display: grid; place-items: center; font-size: 0.72rem; font-weight: 800; color: #fff; flex: none; }
:is(#view-tasks, #tv3-embed) .tv3-caret { color: var(--fg-muted); font-size: 0.8rem; }
:is(#view-tasks, #tv3-embed) .tv3-proj { padding-left: 1.6rem; font-size: 0.93rem; }
:is(#view-tasks, #tv3-embed) .tv3-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; opacity: 0.85; }

/* ---- header ---- */
:is(#view-tasks, #tv3-embed) .tv3-main { min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-head { display: flex; align-items: flex-start; gap: var(--s-3); flex-wrap: wrap; margin-bottom: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-head-main { flex: 1; min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-crumb { color: var(--fg-muted); font-size: 0.82rem; margin-bottom: 2px; }
:is(#view-tasks, #tv3-embed) .tv3-title-row { display: flex; align-items: center; gap: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-title-row h2 { margin: 0; font-size: 1.45rem; line-height: 1.2; overflow-wrap: anywhere; }
:is(#view-tasks, #tv3-embed) .tv3-title-ic { width: 2rem; height: 2rem; border-radius: 0.6rem; display: grid; place-items: center; flex: none; font-weight: 800; color: var(--ic); background: color-mix(in oklch, var(--ic) 20%, transparent); }
:is(#view-tasks, #tv3-embed) .tv3-sub { color: var(--fg-muted); font-size: 0.85rem; margin-top: 2px; }
:is(#view-tasks, #tv3-embed) .tv3-head-act { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
:is(#view-tasks, #tv3-embed) .tv3-faces { display: flex; }
:is(#view-tasks, #tv3-embed) .tv3-faces .tv3-av { margin-left: -6px; box-shadow: 0 0 0 2px var(--surface-0); }
:is(#view-tasks, #tv3-embed) .tv3-burger { display: none; }
:is(#view-tasks, #tv3-embed) .tv3-btn {
  min-height: 36px; padding: 0 var(--s-3); border-radius: var(--r-sm); font: inherit; font-weight: 600; cursor: pointer;
  border: 1px solid var(--border-default); background: var(--surface-glass-2); color: var(--fg-primary);
}
:is(#view-tasks, #tv3-embed) .tv3-btn.primary { background: var(--brand-primary); border-color: transparent; color: #fff; }
:is(#view-tasks, #tv3-embed) .tv3-btn.primary:hover { background: var(--brand-primary-hover); }
:is(#view-tasks, #tv3-embed) .tv3-btn.danger { color: var(--brand-danger); border-color: var(--brand-danger-soft); background: none; }
:is(#view-tasks, #tv3-embed) .tv3-btn.ghost:hover { background: var(--surface-3); }
:is(#view-tasks, #tv3-embed) .tv3-btn.sm { min-height: 28px; font-size: 0.8rem; padding: 0 var(--s-2); }

/* ---- tabs + toolbar ---- */
:is(#view-tasks, #tv3-embed) .tv3-tabs { display: flex; gap: var(--s-1); border-bottom: 1px solid var(--border-subtle); margin-bottom: var(--s-2); overflow-x: auto; }
:is(#view-tasks, #tv3-embed) .tv3-tab { background: none; border: 0; border-bottom: 2px solid transparent; color: var(--fg-secondary); font: inherit; font-weight: 600; padding: var(--s-2) var(--s-3); min-height: 40px; cursor: pointer; white-space: nowrap; }
:is(#view-tasks, #tv3-embed) .tv3-tab.on { color: var(--fg-primary); border-bottom-color: var(--brand-primary); }
:is(#view-tasks, #tv3-embed) .tv3-tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); margin-bottom: var(--s-3); font-size: 0.88rem; color: var(--fg-secondary); }
:is(#view-tasks, #tv3-embed) .tv3-field { display: flex; flex-direction: row; align-items: center; margin: 0; white-space: nowrap; gap: var(--s-1); }
:is(#view-tasks, #tv3-embed) .tv3-field select, :is(#view-tasks, #tv3-embed) .tv3-props select, :is(#view-tasks, #tv3-embed) .tv3-props input {
  background: var(--surface-2); color: var(--fg-primary); border: 1px solid var(--border-default); border-radius: var(--r-xs); min-height: 32px; font: inherit; padding: 0 var(--s-2); max-width: 100%;
}
:is(#view-tasks, #tv3-embed) .tv3-check { display: flex; flex-direction: row; align-items: center; margin: 0; gap: var(--s-1); cursor: pointer; white-space: nowrap; }
:is(#view-tasks, #tv3-embed) .tv3-check input { width: 18px; height: 18px; margin: 0; flex: none; accent-color: var(--brand-primary); }

/* ---- pill / prio / avatar ---- */
:is(#view-tasks, #tv3-embed) .tv3-pill { display: inline-block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; padding: 3px 8px; border-radius: var(--r-xs); white-space: nowrap; color: #fff; }
:is(#view-tasks, #tv3-embed) .st-todo { --st: oklch(0.6 0.02 270); }
:is(#view-tasks, #tv3-embed) .st-doing { --st: oklch(0.64 0.16 240); }
:is(#view-tasks, #tv3-embed) .st-review { --st: oklch(0.62 0.19 300); }
:is(#view-tasks, #tv3-embed) .st-revise { --st: oklch(0.68 0.19 40); }
:is(#view-tasks, #tv3-embed) .st-approved { --st: oklch(0.66 0.13 190); }
:is(#view-tasks, #tv3-embed) .st-done { --st: oklch(0.62 0.17 150); }
:is(#view-tasks, #tv3-embed) .tv3-pill { background: var(--st); }
:is(#view-tasks, #tv3-embed) .tv3-prio { font-size: 0.82rem; font-weight: 600; color: var(--pr); }
:is(#view-tasks, #tv3-embed) .tv3-prio::before { content: '⚑ '; }
:is(#view-tasks, #tv3-embed) .pr-urgent { --pr: oklch(0.62 0.23 25); }
:is(#view-tasks, #tv3-embed) .pr-high { --pr: oklch(0.72 0.18 50); }
:is(#view-tasks, #tv3-embed) .pr-normal { --pr: oklch(0.68 0.14 240); }
:is(#view-tasks, #tv3-embed) .pr-low { --pr: oklch(0.66 0.16 150); }
:is(#view-tasks, #tv3-embed) .tv3-av {
  --av-h: 150; width: 28px; height: 28px; border-radius: 50%; display: inline-grid; place-items: center; flex: none; overflow: hidden;
  font-size: 0.7rem; font-weight: 800; color: #fff; background: linear-gradient(135deg, oklch(0.62 0.16 var(--av-h)), oklch(0.5 0.16 calc(var(--av-h) + 40)));
}
:is(#view-tasks, #tv3-embed) .tv3-av.sm { width: 24px; height: 24px; font-size: 0.62rem; }
:is(#view-tasks, #tv3-embed) .tv3-av img { width: 100%; height: 100%; object-fit: cover; }
:is(#view-tasks, #tv3-embed) .tv3-av-empty { background: none; border: 1px dashed var(--border-strong); color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .due-late { color: var(--brand-danger) !important; font-weight: 600; }
:is(#view-tasks, #tv3-embed) .due-hot { color: oklch(0.7 0.19 35); font-weight: 600; }
:is(#view-tasks, #tv3-embed) .due-warm { color: var(--brand-warning); }

/* ---- Danh sách (bảng ClickUp) ---- */
:is(#view-tasks, #tv3-embed) .tv3-table-wrap { overflow-x: auto; }
:is(#view-tasks, #tv3-embed) .tv3-table { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
:is(#view-tasks, #tv3-embed) .tv3-table th { text-align: left; font-weight: 600; font-size: 0.78rem; color: var(--fg-muted); padding: var(--s-2) var(--s-3); border-bottom: 1px solid var(--border-default); white-space: nowrap; }
:is(#view-tasks, #tv3-embed) .tv3-table td { text-align: left; padding: 0 var(--s-3); height: 44px; border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
:is(#view-tasks, #tv3-embed) .tv3-table th + th, :is(#view-tasks, #tv3-embed) .tv3-table td + td { border-left: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-row { cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-row:hover, :is(#view-tasks, #tv3-embed) .tv3-row:focus-visible { background: var(--surface-glass-2); outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-row.done .tv3-t { color: var(--fg-muted); text-decoration: line-through; }
:is(#view-tasks, #tv3-embed) .tv3-table .c-n { width: 2.5rem; color: var(--fg-muted); text-align: center; font-size: 0.8rem; }
:is(#view-tasks, #tv3-embed) .c-title { min-width: 14rem; }
:is(#view-tasks, #tv3-embed) .tv3-title-cell { display: flex; align-items: center; gap: var(--s-2); color: var(--fg-primary); }
:is(#view-tasks, #tv3-embed) .tv3-row.sub .tv3-title-cell { padding-left: 1.2rem; color: var(--fg-secondary); }
:is(#view-tasks, #tv3-embed) .tv3-sub-ic { color: var(--fg-muted); margin-right: 4px; }
:is(#view-tasks, #tv3-embed) .tv3-row-proj { display: block; font-size: 0.75rem; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22rem; }
:is(#view-tasks, #tv3-embed) .tv3-mini { font-size: 0.72rem; color: var(--fg-muted); border: 1px solid var(--border-subtle); border-radius: var(--r-xs); padding: 0 4px; }
:is(#view-tasks, #tv3-embed) .c-st, :is(#view-tasks, #tv3-embed) .c-due, :is(#view-tasks, #tv3-embed) .c-pr, :is(#view-tasks, #tv3-embed) .c-rem { white-space: nowrap; }
:is(#view-tasks, #tv3-embed) .tv3-group-h td { height: auto; padding: var(--s-3) var(--s-2) var(--s-1); border-bottom: 0; }
:is(#view-tasks, #tv3-embed) .tv3-group-h button { display: flex; align-items: center; gap: var(--s-2); background: none; border: 0; color: var(--fg-primary); font: inherit; font-weight: 700; cursor: pointer; min-height: 32px; }
:is(#view-tasks, #tv3-embed) .tv3-gl { padding: 2px 8px; border-radius: var(--r-xs); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; background: var(--st, var(--surface-3)); color: #fff; }
:is(#view-tasks, #tv3-embed) .tv3-gl.pr-urgent, :is(#view-tasks, #tv3-embed) .tv3-gl.pr-high, :is(#view-tasks, #tv3-embed) .tv3-gl.pr-normal, :is(#view-tasks, #tv3-embed) .tv3-gl.pr-low { background: var(--pr); }
:is(#view-tasks, #tv3-embed) .tv3-gl.g-hot { background: var(--brand-danger); }
:is(#view-tasks, #tv3-embed) .tv3-inline-add { width: 100%; background: none; border: 0; color: var(--fg-primary); font: inherit; min-height: 40px; outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-inline-add::placeholder { color: var(--fg-muted); }

/* ---- Bảng (kanban) ---- */
:is(#view-tasks, #tv3-embed) .tv3-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 1fr); gap: var(--s-3); overflow-x: auto; padding-bottom: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-col { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-col-h { display: flex; flex-direction: column; padding-left: var(--s-2); border-left: 3px solid var(--st); }
:is(#view-tasks, #tv3-embed) .tv3-col-t { font-weight: 800; text-transform: uppercase; letter-spacing: 0.03em; font-size: 0.88rem; }
:is(#view-tasks, #tv3-embed) .tv3-col-h .tv3-muted { font-size: 0.78rem; }
:is(#view-tasks, #tv3-embed) .tv3-col-body { display: flex; flex-direction: column; gap: var(--s-2); min-height: 6rem; border-radius: var(--r-md); padding: 2px; transition: background 0.15s; }
:is(#view-tasks, #tv3-embed) .tv3-col-body.drop-on, :is(#view-tasks, #tv3-embed) .tv3-day.drop-on { background: var(--brand-primary-soft); outline: 1px dashed var(--border-brand); }
:is(#view-tasks, #tv3-embed) .tv3-kcard { background: var(--surface-2); border: 1px solid var(--border-subtle); border-radius: var(--r-md); overflow: hidden; cursor: pointer; box-shadow: var(--shadow-xs); }
:is(#view-tasks, #tv3-embed) .tv3-kcard:hover, :is(#view-tasks, #tv3-embed) .tv3-kcard:focus-visible { border-color: var(--border-strong); outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-kcard.dragging { opacity: 0.45; }
:is(#view-tasks, #tv3-embed) .tv3-band { text-align: center; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.08em; color: #fff; padding: 3px 0; background: var(--pr); }
:is(#view-tasks, #tv3-embed) .tv3-kbody { padding: var(--s-3); display: flex; flex-direction: column; gap: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-ktitle { font-weight: 700; color: var(--fg-primary); overflow-wrap: anywhere; }
:is(#view-tasks, #tv3-embed) .tv3-kdesc { font-size: 0.82rem; color: var(--fg-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
:is(#view-tasks, #tv3-embed) .tv3-krow { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-kfoot { display: flex; align-items: center; gap: var(--s-3); font-size: 0.78rem; color: var(--fg-muted); border-top: 1px solid var(--border-subtle); padding-top: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-kdue { margin-left: auto; }
:is(#view-tasks, #tv3-embed) .tv3-col-add { background: none; border: 1px dashed var(--border-default); color: var(--fg-muted); border-radius: var(--r-md); min-height: 40px; font: inherit; cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-col-add:hover { color: var(--fg-primary); border-color: var(--border-strong); }

/* ---- Lịch ---- */
:is(#view-tasks, #tv3-embed) .tv3-cal { padding: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-cal-h { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; margin-bottom: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-cal-h strong { min-width: 9rem; text-align: center; }
:is(#view-tasks, #tv3-embed) .tv3-cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--border-subtle); border-left: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-dow { font-size: 0.75rem; color: var(--fg-muted); padding: var(--s-1) var(--s-2); border-right: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-day { min-height: 6.5rem; padding: var(--s-1); border-right: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); display: flex; flex-direction: column; gap: 3px; min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-day.out { background: oklch(0 0 0 / 0.15); }
:is(#view-tasks, #tv3-embed) .tv3-day.out .tv3-day-n { color: var(--fg-disabled); }
:is(#view-tasks, #tv3-embed) .tv3-day-n { font-size: 0.78rem; color: var(--fg-secondary); align-self: flex-end; width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: 50%; }
:is(#view-tasks, #tv3-embed) .tv3-day.today .tv3-day-n { background: var(--brand-primary); color: #fff; font-weight: 700; }
:is(#view-tasks, #tv3-embed) .tv3-ev { display: block; width: 100%; text-align: left; font: inherit; font-size: 0.75rem; color: var(--fg-primary); background: color-mix(in oklch, var(--st) 28%, transparent); border: 0; border-left: 3px solid var(--st); border-radius: var(--r-xs); padding: 2px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-more { font-size: 0.72rem; color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .tv3-nodue { display: flex; flex-wrap: wrap; gap: var(--s-1); align-items: center; margin-top: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-nodue .tv3-ev { width: auto; max-width: 14rem; }

/* ---- Gantt ---- */
:is(#view-tasks, #tv3-embed) .tv3-gantt { overflow-x: auto; padding: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-gantt .gantt .bar { fill: oklch(0.64 0.16 240); }
:is(#view-tasks, #tv3-embed) .tv3-gantt .tv3g-done .bar { fill: oklch(0.62 0.17 150); }
:is(#view-tasks, #tv3-embed) .tv3-gantt .tv3g-revise .bar { fill: oklch(0.68 0.19 40); }
:is(#view-tasks, #tv3-embed) .tv3-gantt .tv3g-review .bar { fill: oklch(0.62 0.19 300); }

/* ---- Khối lượng ---- */
:is(#view-tasks, #tv3-embed) #tv3-workload { padding: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-wl td { text-align: center; }
:is(#view-tasks, #tv3-embed) .tv3-wl td b { display: block; font-size: 0.85rem; }
:is(#view-tasks, #tv3-embed) .tv3-wl td small { color: var(--fg-muted); font-size: 0.72rem; }
:is(#view-tasks, #tv3-embed) .tv3-wl td.wl-name { text-align: left; white-space: nowrap; display: flex; align-items: center; gap: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-wl td.wl-over { background: var(--brand-danger-soft); }

/* ---- ngăn chi tiết ---- */
:is(#view-tasks, #tv3-embed) .tv3-drawer-wrap { position: fixed; inset: 0; z-index: 900; pointer-events: none; visibility: hidden; }
:is(#view-tasks, #tv3-embed) .tv3-drawer-wrap.open { pointer-events: auto; visibility: visible; }
:is(#view-tasks, #tv3-embed) .tv3-drawer-scrim { position: absolute; inset: 0; background: oklch(0 0 0 / 0.45); opacity: 0; transition: opacity 0.2s; }
:is(#view-tasks, #tv3-embed) .tv3-drawer-wrap.open .tv3-drawer-scrim { opacity: 1; }
:is(#view-tasks, #tv3-embed) .tv3-drawer {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(36rem, 100vw); display: flex; flex-direction: column;
  background: var(--surface-1); border-left: 1px solid var(--border-default); box-shadow: var(--shadow-xl);
  transform: translateX(100%); transition: transform 0.22s ease;
}
:is(#view-tasks, #tv3-embed) .tv3-drawer-wrap.open .tv3-drawer { transform: none; }
:is(#view-tasks, #tv3-embed) .tv3-dr-h { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-dr-h .tv3-crumb { flex: 1; margin: 0; }
:is(#view-tasks, #tv3-embed) .tv3-x { background: none; border: 0; color: var(--fg-muted); font-size: 1.1rem; min-width: 44px; min-height: 44px; cursor: pointer; border-radius: var(--r-sm); }
:is(#view-tasks, #tv3-embed) .tv3-x:hover { background: var(--surface-glass-2); color: var(--fg-primary); }
:is(#view-tasks, #tv3-embed) .tv3-x.sm { min-width: 32px; min-height: 32px; font-size: 0.85rem; margin-left: auto; }
:is(#view-tasks, #tv3-embed) .tv3-dr-body { flex: 1; overflow-y: auto; padding: var(--s-3); display: flex; flex-direction: column; gap: var(--s-1); }
:is(#view-tasks, #tv3-embed) .tv3-dr-body h4 { margin: var(--s-2) 0 0; font-size: 0.72rem; color: var(--fg-secondary); text-transform: uppercase; letter-spacing: 0.05em; }
:is(#view-tasks, #tv3-embed) .tv3-dr-title { font: inherit; font-size: 1.1rem; font-weight: 700; color: var(--fg-primary); background: none; border: 1px solid transparent; border-radius: var(--r-sm); padding: var(--s-1); resize: none; field-sizing: content; }
:is(#view-tasks, #tv3-embed) .tv3-dr-title:focus, :is(#view-tasks, #tv3-embed) .tv3-desc:focus { border-color: var(--border-brand); outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-props { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px var(--s-3); font-size: 0.82rem; }
:is(#view-tasks, #tv3-embed) .tv3-prop { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); align-items: center; gap: var(--s-2); min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-props label { color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:is(#view-tasks, #tv3-embed) .tv3-props select, :is(#view-tasks, #tv3-embed) .tv3-props input { min-height: 30px; height: 30px; width: 100%; font-size: 0.82rem; }
:is(#view-tasks, #tv3-embed) .tv3-tracked { display: flex; align-items: center; gap: var(--s-2); min-height: 30px; }
:is(#view-tasks, #tv3-embed) .tv3-desc { width: 100%; font: inherit; color: var(--fg-primary); background: var(--surface-glass); border: 1px solid var(--border-subtle); border-radius: var(--r-sm); padding: var(--s-2); resize: vertical; }
:is(#view-tasks, #tv3-embed) .tv3-sub-row { display: flex; align-items: center; gap: var(--s-2); min-height: 32px; font-size: 0.88rem; border-bottom: 1px solid var(--border-subtle); }
:is(#view-tasks, #tv3-embed) .tv3-sub-row input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--brand-primary); flex: none; }
:is(#view-tasks, #tv3-embed) .tv3-link { flex: 1; text-align: left; background: none; border: 0; color: var(--fg-primary); font: inherit; cursor: pointer; padding: 0; min-height: 36px; }
:is(#view-tasks, #tv3-embed) .tv3-link:hover { text-decoration: underline; }
:is(#view-tasks, #tv3-embed) .tv3-strike { text-decoration: line-through; color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .tv3-add-sub, :is(#view-tasks, #tv3-embed) .tv3-add-chk { width: 100%; background: none; border: 0; border-bottom: 1px dashed var(--border-subtle); color: var(--fg-primary); font: inherit; min-height: 32px; outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-comments { display: flex; flex-direction: column; gap: var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-cmt { display: flex; gap: var(--s-2); align-items: flex-start; }
:is(#view-tasks, #tv3-embed) .tv3-cmt-h { font-size: 0.85rem; }
:is(#view-tasks, #tv3-embed) .tv3-cmt-b { color: var(--fg-secondary); overflow-wrap: anywhere; }
:is(#view-tasks, #tv3-embed) .tv3-cmt-new { display: flex; gap: var(--s-2); align-items: flex-end; margin-top: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-cmt-new textarea { flex: 1; font: inherit; color: var(--fg-primary); background: var(--surface-glass); border: 1px solid var(--border-default); border-radius: var(--r-sm); padding: var(--s-2); resize: vertical; }
:is(#view-tasks, #tv3-embed) .tv3-dr-f { display: flex; justify-content: space-between; gap: var(--s-2); padding: var(--s-3) var(--s-4); border-top: 1px solid var(--border-subtle); }

/* ---- mobile ---- */
@media (max-width: 899px) {
  :is(#view-tasks, #tv3-embed) .tv3 { grid-template-columns: minmax(0, 1fr); }
  :is(#view-tasks, #tv3-embed) .tv3-side {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 880; width: min(19rem, 86vw); max-height: none; border-radius: 0;
    transform: translateX(-105%); transition: transform 0.2s ease;
  }
  :is(#view-tasks, #tv3-embed) .tv3.side-open .tv3-side { transform: none; }
  :is(#view-tasks, #tv3-embed) .tv3.side-open .tv3-scrim { display: block; position: fixed; inset: 0; z-index: 870; background: oklch(0 0 0 / 0.45); }
  :is(#view-tasks, #tv3-embed) .tv3-burger { display: grid; place-items: center; min-width: 44px; min-height: 44px; background: var(--surface-glass-2); border: 1px solid var(--border-subtle); border-radius: var(--r-sm); color: var(--fg-primary); font-size: 1.1rem; cursor: pointer; }
  :is(#view-tasks, #tv3-embed) .tv3-head-act { width: 100%; }
  :is(#view-tasks, #tv3-embed) .tv3-head-act .tv3-btn { min-height: 44px; flex: 1; }
  :is(#view-tasks, #tv3-embed) .tv3-tab { min-height: 44px; }
  :is(#view-tasks, #tv3-embed) .tv3-nav, :is(#view-tasks, #tv3-embed) .tv3-proj, :is(#view-tasks, #tv3-embed) .tv3-cat-h { min-height: 44px; }
  :is(#view-tasks, #tv3-embed) .tv3-table thead { display: none; }
  :is(#view-tasks, #tv3-embed) .tv3-table, :is(#view-tasks, #tv3-embed) .tv3-table tbody { display: block; }
  :is(#view-tasks, #tv3-embed) .tv3-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px var(--s-2); padding: var(--s-2) var(--s-3); border-bottom: 1px solid var(--border-subtle); }
  :is(#view-tasks, #tv3-embed) .tv3-row td { height: auto; padding: 0; border: 0 !important; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-n, :is(#view-tasks, #tv3-embed) .tv3-row .c-rem { display: none; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-title { grid-column: 1 / -1; min-width: 0; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-st { grid-column: 1; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-who { grid-column: 2; grid-row: 2; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-due, :is(#view-tasks, #tv3-embed) .tv3-row .c-pr { font-size: 0.82rem; grid-column: 1; }
  :is(#view-tasks, #tv3-embed) .tv3-row .c-act { grid-column: 2; grid-row: 3; justify-self: end; }
  :is(#view-tasks, #tv3-embed) .tv3-group-h, :is(#view-tasks, #tv3-embed) .tv3-add-row { display: block; }
  :is(#view-tasks, #tv3-embed) .tv3-group-h td, :is(#view-tasks, #tv3-embed) .tv3-add-row td { display: block; }
  :is(#view-tasks, #tv3-embed) .tv3-add-row td:first-child { display: none; }
  :is(#view-tasks, #tv3-embed) .tv3-board { grid-auto-columns: 82vw; scroll-snap-type: x mandatory; }
  :is(#view-tasks, #tv3-embed) .tv3-col { scroll-snap-align: start; }
  :is(#view-tasks, #tv3-embed) .tv3-day { min-height: 4.5rem; }
  :is(#view-tasks, #tv3-embed) .tv3-ev { font-size: 0.66rem; padding: 1px 3px; }
  :is(#view-tasks, #tv3-embed) .tv3-prop { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  :is(#view-tasks, #tv3-embed) .tv3-props label { font-size: 0.72rem; }
  :is(#view-tasks, #tv3-embed) .tv3-props select, :is(#view-tasks, #tv3-embed) .tv3-props input { min-height: 40px; height: 40px; font-size: 16px; }
  :is(#view-tasks, #tv3-embed) .tv3-drawer { width: 100vw; }
  :is(#view-tasks, #tv3-embed) .tv3-dr-body { padding: var(--s-3); }
}

/* ---- việc: nút xong + bắt giờ (cả 2 nơi) ---- */
:is(#view-tasks, #tv3-embed) .tv3-t { min-width: 0; }
:is(#view-tasks, #tv3-embed) .tv3-done {
  flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--border-strong); background: none;
  color: #fff; font-size: 0.72rem; line-height: 1; display: grid; place-items: center; cursor: pointer; padding: 0;
}
:is(#view-tasks, #tv3-embed) .tv3-done:hover:not(:disabled) { border-color: var(--brand-success); }
:is(#view-tasks, #tv3-embed) .tv3-done.on { background: var(--brand-success); border-color: var(--brand-success); }
:is(#view-tasks, #tv3-embed) .tv3-done:disabled { opacity: 0.45; cursor: default; }
:is(#view-tasks, #tv3-embed) .tv3-table .c-act { width: 3rem; text-align: center; padding: 0 var(--s-1); }
:is(#view-tasks, #tv3-embed) .tv3-track {
  width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--border-default); background: var(--surface-glass-2);
  color: var(--brand-success); font-size: 0.75rem; display: inline-grid; place-items: center; cursor: pointer; padding: 0;
}
:is(#view-tasks, #tv3-embed) .tv3-track:hover { border-color: var(--brand-success); }
:is(#view-tasks, #tv3-embed) .tv3-track.on { color: #fff; background: var(--brand-danger); border-color: var(--brand-danger); }
:is(#view-tasks, #tv3-embed) .tv3-krow .tv3-track { margin-left: auto; }
:is(#view-tasks, #tv3-embed) .tv3-row.tracking { box-shadow: inset 3px 0 0 var(--brand-danger); }
:is(#view-tasks, #tv3-embed) .tv3-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- nhúng trong chi tiết dự án: tab "Công việc" thay khối Task cũ ---- */
#tv3-embed .tv3.tv3-embedded { grid-template-columns: minmax(0, 1fr); }
#tv3-embed .tv3-head-embed { align-items: center; justify-content: space-between; }
#tv3-embed .tv3-head-embed .tv3-head-act { margin-left: auto; width: auto; }
#project-detail-modal .acc[data-acc="tasks"], #project-detail-modal .info-tasks { display: none; }

/* NAV-MERGE-2026-10-22: Danh sách dự án trong Công việc, HR + Cài đặt (bánh răng) dùng chung #view-admin */
#view-tasks .tv3-main-projects #tv3-projects-host > .admin-section,
#view-tasks .tv3-main-projects #tv3-projects-host > .panel-card { max-width: none; margin: 0; }
#view-tasks .tv3-main-projects #tv3-projects-host > .admin-section > .panel-card { margin: 0; }
#view-admin.is-settings .admin-subnav { display: none; }
.topbar-gear {
  display: inline-grid; place-items: center; width: 40px; height: 40px; flex: none; cursor: pointer;
  border-radius: var(--r-sm); border: 1px solid var(--border-subtle); background: var(--surface-glass-2); color: var(--fg-secondary); font-size: 1.05rem;
}
.topbar-gear:hover, .topbar-gear.is-active { color: var(--fg-primary); background: var(--brand-primary-soft); border-color: transparent; }
.topbar-gear[hidden] { display: none; }

/* NAS-LINK-2026-10-22: chuông thông báo + file của việc */
.nb { position: relative; }
.nb[hidden] { display: none; }
.nb-btn { position: relative; }
.nb-count {
  position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--r-pill);
  background: var(--brand-danger); color: #fff; font-size: 0.68rem; font-weight: 700; line-height: 18px; text-align: center;
}
.nb-count[hidden] { display: none; }
.nb-dd {
  position: absolute; right: 0; top: calc(100% + 8px); width: min(22rem, calc(100vw - 24px)); max-height: min(70vh, 32rem);
  display: flex; flex-direction: column; background: var(--popover, var(--surface-1)); border: 1px solid var(--border-subtle);
  border-radius: var(--r-md); box-shadow: var(--shadow-lg); backdrop-filter: blur(20px) saturate(140%); z-index: 60;
}
.nb-dd[hidden] { display: none; }
.nb-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); padding: var(--s-3); border-bottom: 1px solid var(--border-subtle); }
.nb-readall { background: none; border: 0; color: var(--brand-primary); font: inherit; font-size: 0.8rem; cursor: pointer; padding: 4px; }
.nb-list { overflow-y: auto; padding: var(--s-1); }
.nb-item {
  display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left; padding: var(--s-2) var(--s-3); border: 0; border-radius: var(--r-sm);
  background: none; color: var(--fg-secondary); font: inherit; font-size: 0.86rem; cursor: pointer;
}
.nb-item:hover { background: var(--surface-glass-2); }
.nb-item.unread { color: var(--fg-primary); background: var(--brand-primary-soft); }
.nb-item b { font-weight: 600; }
.nb-body { color: var(--fg-secondary); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.nb-meta { color: var(--fg-muted); font-size: 0.75rem; }
.nb-empty { padding: var(--s-4); text-align: center; color: var(--fg-muted); }
:is(#view-tasks, #tv3-embed) .tv3-file-up { display: inline-flex; align-items: center; margin-left: auto; cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-files { display: flex; flex-direction: column; gap: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-fdate { font-size: 0.75rem; color: var(--fg-muted); margin-bottom: 2px; overflow-wrap: anywhere; }
:is(#view-tasks, #tv3-embed) .tv3-file {
  display: flex; align-items: center; gap: var(--s-2); min-height: 34px; padding: 0 var(--s-2); border-radius: var(--r-sm);
  color: var(--fg-primary); text-decoration: none; border: 1px solid var(--border-subtle); background: var(--surface-glass);
}
:is(#view-tasks, #tv3-embed) .tv3-file + .tv3-file { margin-top: 4px; }
:is(#view-tasks, #tv3-embed) .tv3-file:hover { background: var(--surface-glass-2); }
:is(#view-tasks, #tv3-embed) .tv3-fext { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; color: var(--brand-primary); width: 2.4rem; flex: none; }
:is(#view-tasks, #tv3-embed) .tv3-dr-body h4:has(.tv3-file-up) { display: flex; align-items: center; gap: var(--s-2); }

/* NAS-UI-2026-10-22 */
.nas-link-actions { display: flex; gap: 8px; justify-content: center; margin-top: 12px; flex-wrap: wrap; }
.nas-name-hint { display: block; margin-top: 4px; font-size: 12px; color: var(--text-muted, #8a9a90); }
.nas-name-hint[hidden] { display: none; }
#project-name[readonly] { opacity: .75; cursor: not-allowed; }
.proj-group-pill.status-missing { background: rgba(229, 72, 77, .14); color: #e5484d; }
.proj-nas-lost { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #e5484d; min-width: 0; }
.proj-relink { border: 1px solid currentColor; background: none; color: inherit; border-radius: 4px; padding: 1px 6px; font-size: 11px; cursor: pointer; }
.nas-relink { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center; padding: 16px; }
.nas-relink-scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.nas-relink-box { position: relative; width: min(560px, 100%); max-height: min(640px, calc(100vh - 32px)); display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 12px; background: var(--surface-1, #141a17); border: 1px solid var(--border, rgba(255,255,255,.08)); box-shadow: var(--shadow-lg, 0 20px 50px rgba(0,0,0,.4)); }
.nas-relink-box header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.nas-relink-box header small { display: block; font-size: 12px; color: var(--text-muted, #8a9a90); margin-top: 2px; overflow-wrap: anywhere; }
.nas-relink-x { background: none; border: 0; color: inherit; font-size: 16px; cursor: pointer; min-width: 32px; min-height: 32px; }
.nas-relink-q { width: 100%; box-sizing: border-box; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--border, rgba(255,255,255,.12)); background: var(--surface-2, rgba(255,255,255,.04)); color: inherit; font-size: 14px; }
.nas-relink-list { overflow: auto; display: flex; flex-direction: column; gap: 2px; min-height: 120px; }
.nas-relink-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; text-align: left; padding: 8px 10px; border: 0; border-radius: 6px; background: none; color: inherit; cursor: pointer; font-size: 13px; }
.nas-relink-row:hover:not([disabled]) { background: var(--brand-primary-soft, rgba(52,199,120,.12)); }
.nas-relink-row.is-current { opacity: .55; cursor: default; }
.nas-relink-name { min-width: 0; overflow-wrap: anywhere; }
.nas-relink-tag { flex: none; font-size: 11px; color: var(--text-muted, #8a9a90); max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nas-relink-empty { padding: 20px; text-align: center; color: var(--text-muted, #8a9a90); font-size: 13px; }
.nas-relink-note { margin: 0; font-size: 11.5px; color: var(--text-muted, #8a9a90); }

/* POLISH-2026-10-22: nhịp chữ + màu kiểu ClickUp, bớt khối màu to */
:is(#view-tasks, #tv3-embed) .tv3-table { font-size: 0.875rem; }
:is(#view-tasks, #tv3-embed) .tv3-table th { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; padding: 6px var(--s-3); }
:is(#view-tasks, #tv3-embed) .tv3-table td { height: 38px; }
:is(#view-tasks, #tv3-embed) .tv3-table th + th, :is(#view-tasks, #tv3-embed) .tv3-table td + td { border-left: 0; }
:is(#view-tasks, #tv3-embed) .tv3-row .tv3-t { font-weight: 500; }
:is(#view-tasks, #tv3-embed) .tv3-row .tv3-pill { background: none; color: var(--fg-secondary); text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 0.8rem; padding: 0; display: inline-flex; align-items: center; gap: 6px; }
:is(#view-tasks, #tv3-embed) .tv3-row .tv3-pill::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--st); flex: none; }
:is(#view-tasks, #tv3-embed) .tv3-gl { font-size: 0.68rem; font-weight: 700; padding: 2px 7px; border-radius: 4px; }
:is(#view-tasks, #tv3-embed) .tv3-group-h td { padding-top: var(--s-4); }
:is(#view-tasks, #tv3-embed) .tv3-add-row td { height: 32px; }
:is(#view-tasks, #tv3-embed) .tv3-inline-add { min-height: 32px; font-size: 0.82rem; }
:is(#view-tasks, #tv3-embed) .tv3-inline-add:not(:focus)::placeholder { color: var(--fg-disabled, var(--fg-muted)); }
:is(#view-tasks, #tv3-embed) .tv3-add-row:hover .tv3-inline-add::placeholder { color: var(--fg-secondary); }

:is(#view-tasks, #tv3-embed) .tv3-field select { background: none; border-color: transparent; color: var(--fg-primary); font-weight: 500; cursor: pointer; }
:is(#view-tasks, #tv3-embed) .tv3-field select:hover, :is(#view-tasks, #tv3-embed) .tv3-field select:focus-visible { background: var(--surface-glass-2); border-color: var(--border-subtle); outline: none; }
:is(#view-tasks, #tv3-embed) .tv3-tools { font-size: 0.82rem; }

:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-todo) { --st: oklch(0.6 0.02 270); }
:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-doing) { --st: oklch(0.64 0.16 240); }
:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-review) { --st: oklch(0.62 0.19 300); }
:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-revise) { --st: oklch(0.68 0.19 40); }
:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-approved) { --st: oklch(0.66 0.13 190); }
:is(#view-tasks, #tv3-embed) .tv3-col:has(> .st-done) { --st: oklch(0.62 0.17 150); }
:is(#view-tasks, #tv3-embed) .tv3-col { gap: 0; border-radius: 10px; background: color-mix(in oklch, var(--st) 6%, transparent); padding: var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-col-h { flex-direction: row; align-items: center; gap: var(--s-2); border-left: 0; padding: 2px 2px var(--s-2); }
:is(#view-tasks, #tv3-embed) .tv3-col-t { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em; color: #fff; background: var(--st); padding: 2px 7px; border-radius: 4px; }
:is(#view-tasks, #tv3-embed) .tv3-col-h .tv3-muted { font-size: 0.75rem; }
:is(#view-tasks, #tv3-embed) .tv3-col-body { gap: 6px; min-height: 3rem; }
:is(#view-tasks, #tv3-embed) .tv3-kcard { border-radius: 8px; box-shadow: 0 1px 2px oklch(0 0 0 / 0.25); transition: border-color 0.12s, transform 0.12s; }
:is(#view-tasks, #tv3-embed) .tv3-kcard:hover { transform: translateY(-1px); }
:is(#view-tasks, #tv3-embed) .tv3-band { text-align: left; background: none; color: var(--pr); font-size: 0.64rem; font-weight: 700; letter-spacing: 0.05em; padding: 8px 10px 0; }
:is(#view-tasks, #tv3-embed) .tv3-band::before { content: '⚑ '; }
:is(#view-tasks, #tv3-embed) .tv3-kbody { padding: 6px 10px 10px; gap: 6px; }
:is(#view-tasks, #tv3-embed) .tv3-ktitle { font-weight: 500; font-size: 0.875rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
:is(#view-tasks, #tv3-embed) .tv3-kcard .tv3-pill { display: none; }
:is(#view-tasks, #tv3-embed) .tv3-kfoot { border-top: 0; padding-top: 0; font-size: 0.75rem; }
:is(#view-tasks, #tv3-embed) .tv3-col-add { border: 0; text-align: left; min-height: 32px; padding: 0 var(--s-2); font-size: 0.82rem; border-radius: 6px; }
:is(#view-tasks, #tv3-embed) .tv3-col-add:hover { background: var(--surface-glass-2); }

/* Danh sách dự án (khối cũ) mặc giao diện Công việc */
#tv3-projects-host .panel-card { background: none; border: 0; box-shadow: none; padding: 0; }
#tv3-projects-host .panel-head > div:first-child { display: none; }
#tv3-projects-host .panel-head { justify-content: flex-end; margin-bottom: var(--s-2); }
#tv3-projects-host .proj-list-col-head { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; }
#tv3-projects-host .proj-row { min-height: 40px; font-size: 0.875rem; }
#tv3-projects-host .proj-name-text { font-weight: 500; }
#tv3-projects-host .proj-group-pill { font-size: 0.68rem; padding: 2px 7px; border-radius: 4px; }