/* ── Task center (v3) ────────────────────────────────────────────────────
   Visual layer for #tasksPage in the same language as mgmt-home.css:
   neutral surfaces, hairlines, indigo only for "current/primary", colour
   kept for things that need attention (urgent, overdue, waiting on me).
   Behaviour, markup contracts (data-* hooks) and the ≤880px card layout of
   the table stay owned by tasks.js / style.css — table geometry below is
   desktop-only; phones just inherit the palette through --tk-m-* vars. */

#tasksPage{
  --tv-surface:var(--dk-surface);
  --tv-surface-2:var(--dk-surface-2);
  --tv-hover:var(--dk-hover);
  --tv-border:var(--dk-border);
  --tv-text:var(--dk-text);
  --tv-muted:var(--dk-muted);
  --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip);
  --tv-accent:var(--dk-accent);
  --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:var(--dk-danger); --tv-danger-soft:var(--dk-danger-soft);
  --tv-warn:var(--dk-warn);   --tv-warn-soft:var(--dk-warn-soft);
  --tv-ok:var(--dk-ok);     --tv-ok-soft:var(--dk-ok-soft);
  --tv-info:var(--dk-info);   --tv-info-soft:var(--dk-info-soft);
  --tv-violet:var(--dk-violet); --tv-violet-soft:var(--dk-violet-soft);
  --tv-shadow:var(--dk-shadow);
  /* phone card layout (style.css) reads these */
  --tk-m-accent:var(--tv-accent);
  --tk-m-accent-soft:var(--tv-accent-soft);
  --tk-m-text:var(--tv-text);
}
html[data-theme="dark"] #tasksPage{
  --tv-surface:var(--dk-surface);
  --tv-surface-2:var(--dk-surface-2);
  --tv-hover:var(--dk-hover);
  --tv-border:var(--dk-border);
  --tv-text:var(--dk-text);
  --tv-muted:var(--dk-muted);
  --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip);
  --tv-accent:var(--dk-accent);
  --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:var(--dk-danger); --tv-danger-soft:var(--dk-danger-soft);
  --tv-warn:var(--dk-warn);   --tv-warn-soft:var(--dk-warn-soft);
  --tv-ok:var(--dk-ok);     --tv-ok-soft:var(--dk-ok-soft);
  --tv-info:var(--dk-info);   --tv-info-soft:var(--dk-info-soft);
  --tv-violet:var(--dk-violet); --tv-violet-soft:var(--dk-violet-soft);
  --tv-shadow:var(--dk-shadow);
}

#tasksPage .tv-ic{ width:16px; height:16px; flex:0 0 auto; display:inline-block; vertical-align:-3px; }

#tasksPage .tasks-shell{
  max-width:1320px;
  margin:0 auto;
  color:var(--tv-text);
}

/* ── hero ── */
#tasksPage .tv-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  padding:0;
  margin:0 0 18px;
  background:none;
  border:0;
  box-shadow:none;
}
#tasksPage .tv-hero::before,
#tasksPage .tv-hero::after{ content:none; }
#tasksPage .tv-hero h1{
  margin:0;
  font-size:clamp(22px,2.3vw,28px);
  font-weight:800;
  line-height:1.5;
  color:var(--tv-text);
  background:none;
  -webkit-text-fill-color:currentColor;
}
#tasksPage .tv-hero p{ margin:2px 0 0; font-size:14px; color:var(--tv-muted); }
#tasksPage .tv-hero .actions{ display:flex; gap:8px; flex-wrap:wrap; }
#tasksPage .tv-btn{
  display:inline-flex;
  align-items:center;
  gap:7px;
  height:40px;
  margin:0;
  padding:0 16px;
  border-radius:11px;
  font:inherit;
  font-size:13.5px;
  font-weight:700;
  cursor:pointer;
  box-shadow:none;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease;
}
#tasksPage .tv-btn-primary{ background:var(--dk-accent-fill); color:#fff; border:1px solid transparent; }
html[data-theme="dark"] #tasksPage .tv-btn-primary{ background:var(--dk-accent-fill); }
#tasksPage .tv-btn-primary:hover{ filter:brightness(1.08); }
#tasksPage .tv-btn-ghost{ background:var(--tv-surface); color:var(--tv-muted); border:1px solid var(--tv-border); }
#tasksPage .tv-btn-ghost:hover{ color:var(--tv-text); background:var(--tv-hover); }
#tasksPage .tv-btn:disabled{ opacity:.6; cursor:progress; }

/* ── stats ── */
#tasksPage .tasks-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:0 0 18px;
}
@media (max-width:900px){ #tasksPage .tasks-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } }
#tasksPage .tv-stat{
  --tone:var(--tv-accent); --tone-soft:var(--tv-accent-soft);
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:16px;
  background:var(--tv-surface);
  border:1px solid var(--tv-border);
  box-shadow:var(--tv-shadow);
}
#tasksPage .tv-stat[data-tone="mine"]{ --tone:var(--tv-info); --tone-soft:var(--tv-info-soft); }
#tasksPage .tv-stat[data-tone="review"]{ --tone:var(--tv-violet); --tone-soft:var(--tv-violet-soft); }
#tasksPage .tv-stat[data-tone="overdue"]{ --tone:var(--tv-danger); --tone-soft:var(--tv-danger-soft); }
#tasksPage .tv-stat-ico{
  width:40px; height:40px;
  border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tone-soft);
  color:var(--tone);
  flex:0 0 auto;
}
#tasksPage .tv-stat-ico .tv-ic{ width:19px; height:19px; }
#tasksPage .tv-stat-body{ display:flex; flex-direction:column; min-width:0; }
#tasksPage .tv-stat-label{ font-size:12.5px; font-weight:600; color:var(--tv-muted); white-space:nowrap; }
#tasksPage .tv-stat-value{ font-size:24px; font-weight:800; line-height:1.35; color:var(--tv-text); font-variant-numeric:tabular-nums; }
#tasksPage .tv-stat.is-hot .tv-stat-value{ color:var(--tone); }

/* ── tabs: underline rail, scrolls sideways when narrow ── */
#tasksPage .tasks-tabs{
  display:flex;
  gap:2px;
  margin:0 0 16px;
  padding:0;
  border:0;
  border-bottom:1px solid var(--tv-border);
  border-radius:0;
  background:none;
  box-shadow:none;
  overflow-x:auto;
  scrollbar-width:none;
}
#tasksPage .tasks-tabs::-webkit-scrollbar{ display:none; }
#tasksPage .tasks-tab{
  position:relative;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  height:42px;
  margin:0;
  padding:0 12px;
  border:0;
  border-radius:10px 10px 0 0;
  background:none;
  color:var(--tv-muted);
  font:inherit;
  font-size:13.5px;
  font-weight:600;
  white-space:nowrap;
  box-shadow:none;
  cursor:pointer;
  transition:color .15s ease, background-color .15s ease;
}
#tasksPage .tasks-tab:hover{ color:var(--tv-text); background:var(--tv-hover); }
#tasksPage .tasks-tab.is-active{ color:var(--tv-accent); background:none; font-weight:700; }
#tasksPage .tasks-tab.is-active::after{
  content:"";
  position:absolute;
  left:10px; right:10px; bottom:-1px;
  height:2px;
  border-radius:2px;
  background:var(--tv-accent);
}
#tasksPage .tasks-tab-icon{
  display:inline-flex;
  width:auto; height:auto;
  background:none;
  border:0;
  font-size:0;
  color:inherit;
}
#tasksPage .tasks-tab-badge{
  min-width:20px; height:20px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font-size:11.5px;
  font-weight:800;
  box-shadow:none;
  border:0;
}
#tasksPage .tasks-tab-badge.hidden{ display:none !important; }
#tasksPage .tasks-tab.is-active .tasks-tab-badge{ background:var(--tv-accent-soft); color:var(--tv-accent); }
#tasksPage #tasksTabReviewBtn .tasks-tab-badge{ background:var(--tv-violet-soft); color:var(--tv-violet); }

/* ── toolbar ── */
#tasksPage .tasks-pool-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 14px;
  margin:0 0 14px;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
}
#tasksPage .tasks-pool-toolbar.hidden{ display:none !important; }
#tasksPage .tasks-pool-search{
  position:relative;
  flex:1 1 280px;
  max-width:420px;
  display:flex;
  align-items:center;
}
#tasksPage .tasks-pool-search-icon{
  position:absolute;
  inset-inline-start:12px;
  display:inline-flex;
  color:var(--tv-faint);
  font-size:0;
  pointer-events:none;
}
#tasksPage .tasks-pool-search input{
  width:100%;
  height:40px;
  padding:0 38px 0 12px;
  padding-inline-start:38px;
  padding-inline-end:12px;
  border-radius:11px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-text);
  font:inherit;
  font-size:13.5px;
  box-shadow:none;
}
#tasksPage .tasks-pool-search input:focus{ outline:none; border-color:var(--tv-accent); box-shadow:0 0 0 3px var(--tv-accent-soft); }
#tasksPage .tasks-priority-filter,
#tasksPage .tasks-archive-status-filter{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px;
  padding:0;
  background:none;
  border:0;
}
#tasksPage .tasks-archive-status-filter.hidden{ display:none !important; }
#tasksPage .tasks-priority-filter-label,
#tasksPage .tasks-sort-label{ font-size:12.5px; font-weight:600; color:var(--tv-faint); margin-inline-end:4px; }
#tasksPage .tasks-priority-chip,
#tasksPage .tasks-archive-status-chip,
#tasksPage .tasks-pool-tag-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:32px;
  margin:0;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-muted);
  font:inherit;
  font-size:12.5px;
  font-weight:600;
  box-shadow:none;
  cursor:pointer;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease;
}
#tasksPage .tasks-priority-chip:hover,
#tasksPage .tasks-archive-status-chip:hover,
#tasksPage .tasks-pool-tag-chip:hover{ color:var(--tv-text); background:var(--tv-hover); }
#tasksPage .tasks-priority-chip.is-active,
#tasksPage .tasks-archive-status-chip.is-active,
#tasksPage .tasks-pool-tag-chip.is-active{
  background:var(--tv-accent-soft);
  border-color:transparent;
  color:var(--tv-accent);
}
#tasksPage .tv-dot{ width:8px; height:8px; border-radius:50%; background:var(--tv-faint); display:inline-block; }
#tasksPage .tasks-priority-chip-urgent .tv-dot{ background:var(--tv-danger); }
#tasksPage .tasks-priority-chip-medium .tv-dot{ background:#f59e0b; }
#tasksPage .tasks-priority-chip-low .tv-dot{ background:#10b981; }
#tasksPage .tasks-sort-wrap{ display:inline-flex; align-items:center; gap:6px; margin-inline-start:10px; }
#tasksPage .tasks-sort-select{
  height:32px;
  padding:0 10px;
  border-radius:10px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-text);
  font:inherit;
  font-size:12.5px;
}
#tasksPage .tasks-pool-tag-filters{ display:flex; flex-wrap:wrap; gap:6px; width:100%; }
#tasksPage .tasks-pool-tag-filters.hidden{ display:none; }
#tasksPage .tasks-pool-tag-chip.is-dim{ opacity:.5; }
#tasksPage .tasks-pool-tag-count{ font-size:11px; color:var(--tv-faint); font-weight:700; }

/* ── task table (desktop) ── */
@media (min-width:881px){
  #tasksPage .tk-table-wrap{
    border-radius:16px;
    border:1px solid var(--tv-border);
    background:var(--tv-surface);
    box-shadow:var(--tv-shadow);
    overflow:hidden;
  }
  #tasksPage .tk-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    background:none;
  }
  #tasksPage .tk-table thead th,
  #tasksPage .tk-th{
    height:40px;
    padding:0 12px;
    background:var(--tv-surface-2);
    border:0;
    border-bottom:1px solid var(--tv-border);
    color:var(--tv-faint);
    font-size:12px;
    font-weight:700;
    text-align:start;
    white-space:nowrap;
  }
  #tasksPage .tk-row{ cursor:pointer; background:none; transition:background-color .12s ease; }
  #tasksPage .tk-row:hover{ background:var(--tv-hover); }
  #tasksPage .tk-row + .tk-row .tk-cell{ border-top:1px solid var(--tv-border); }
  #tasksPage .tk-cell{
    padding:12px;
    border:0;
    vertical-align:middle;
    background:none;
    color:var(--tv-text);
    font-size:13px;
  }
  /* readable titles: fixed size, wrap to two lines instead of shrinking */
  #tasksPage .tk-row-title{
    font-size:14px !important;
    font-weight:700;
    line-height:1.7;
    color:var(--tv-text);
    white-space:normal;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
}
#tasksPage .tk-row-sub{
  margin-top:2px;
  font-size:12.5px;
  line-height:1.7;
  color:var(--tv-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#tasksPage .tk-row-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px 12px;
  margin-top:4px;
  font-size:11.5px;
  color:var(--tv-faint);
}
#tasksPage .tk-row-meta > span{ display:inline-flex; align-items:center; gap:4px; }
#tasksPage .tk-row-meta .tv-ic{ width:13px; height:13px; }

#tasksPage .tk-id-badge{
  height:24px;
  padding:0 8px;
  border-radius:7px;
  border:0;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font:inherit;
  font-size:12px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  box-shadow:none;
  cursor:copy;
}
#tasksPage .tk-id-badge:hover{ background:var(--tv-accent-soft); color:var(--tv-accent); }

#tasksPage .tk-row-author{
  display:inline-flex;
  align-items:center;
  gap:7px;
  max-width:100%;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
}
#tasksPage .tk-row-author-avatar{
  width:26px; height:26px;
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--chip-c1, var(--tv-accent));
  color:#fff;
  font-size:12px;
  font-weight:800;
  flex:0 0 auto;
  box-shadow:none;
}
#tasksPage .tk-row-author-name{ font-size:12.5px; font-weight:600; color:var(--tv-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#tasksPage .tk-row-owner-stack{ display:flex; flex-direction:column; gap:4px; }
#tasksPage .tk-row-empty-chip,
#tasksPage .tk-row-muted{ font-size:12px; color:var(--tv-faint); background:none; border:0; padding:0; }
#tasksPage .tk-row-mentions{ display:flex; flex-wrap:wrap; gap:4px; }
#tasksPage .tk-row-mention{
  padding:1px 8px;
  border-radius:999px;
  background:var(--tv-info-soft);
  color:var(--tv-info);
  font-size:11.5px;
  font-weight:600;
}

/* priority: coloured dot + plain label, no gradients */
#tasksPage .tk-row-prio{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0;
  background:none !important;
  border:0;
  box-shadow:none;
  color:var(--tv-muted);
  font-size:12.5px;
  font-weight:600;
}
#tasksPage .tk-row-prio-dot{ width:8px; height:8px; border-radius:50%; background:var(--tv-faint); display:inline-block; box-shadow:none; }
#tasksPage .tk-row-prio-urgent{ color:var(--tv-danger); font-weight:700; }
#tasksPage .tk-row-prio-urgent .tk-row-prio-dot{ background:var(--tv-danger); box-shadow:0 0 0 3px var(--tv-danger-soft); }
#tasksPage .tk-row-prio-high .tk-row-prio-dot{ background:#f97316; }
#tasksPage .tk-row-prio-medium .tk-row-prio-dot{ background:#f59e0b; }
#tasksPage .tk-row-prio-low .tk-row-prio-dot{ background:#10b981; }

/* status: soft tonal pill */
#tasksPage .tk-row-status{
  --tone:var(--tv-muted); --tone-soft:var(--tv-chip);
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 10px;
  border-radius:999px;
  border:0;
  background:var(--tone-soft) !important;
  color:var(--tone) !important;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  box-shadow:none;
}
#tasksPage .tk-row-status-claimed,
#tasksPage .tk-row-status-in_progress{ --tone:var(--tv-info); --tone-soft:var(--tv-info-soft); }
#tasksPage .tk-row-status-review{ --tone:var(--tv-violet); --tone-soft:var(--tv-violet-soft); }
#tasksPage .tk-row-status-done{ --tone:var(--tv-ok); --tone-soft:var(--tv-ok-soft); }
#tasksPage .tk-row-status-rejected,
#tasksPage .tk-row-status-cancelled{ --tone:var(--tv-danger); --tone-soft:var(--tv-danger-soft); }

#tasksPage .tk-row-deadline{ font-size:12px; color:var(--tv-muted); white-space:nowrap; background:none; padding:0; border:0; }
#tasksPage .tk-row-deadline.is-overdue{ color:var(--tv-danger); font-weight:700; }

#tasksPage .tk-row-cta{
  height:32px;
  padding:0 12px;
  border-radius:9px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-muted);
  font:inherit;
  font-size:12.5px;
  font-weight:700;
  box-shadow:none;
  cursor:pointer;
}
#tasksPage .tk-row:hover .tk-row-cta{ background:var(--dk-accent-fill); border-color:transparent; color:#fff; }
html[data-theme="dark"] #tasksPage .tk-row:hover .tk-row-cta{ background:var(--dk-accent-fill); }

/* ── pager ── */
#tasksPage .tasks-pager{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
  padding:0 4px;
  background:none;
  border:0;
}
#tasksPage .tasks-pager-info{ font-size:12.5px; color:var(--tv-faint); }
#tasksPage .tasks-pager-controls{ display:flex; align-items:center; gap:4px; }
#tasksPage .tasks-pager-btn,
#tasksPage .tasks-pager-num{
  min-width:34px; height:34px;
  padding:0 10px;
  border-radius:9px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-muted);
  font:inherit;
  font-size:12.5px;
  font-weight:700;
  box-shadow:none;
  cursor:pointer;
}
#tasksPage .tasks-pager-num.is-active{ background:var(--tv-accent-soft); border-color:transparent; color:var(--tv-accent); }
#tasksPage .tasks-pager-btn:disabled{ opacity:.45; cursor:default; }

/* ── empty state ── */
#tasksPage .tasks-empty-state{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:48px 20px;
  border-radius:16px;
  border:1px dashed var(--tv-border);
  background:var(--tv-surface-2);
  text-align:center;
}
#tasksPage .tasks-empty-icon{
  width:52px; height:52px;
  border-radius:16px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-accent-soft);
  color:var(--tv-accent);
  font-size:22px;
  margin-bottom:6px;
}
#tasksPage .tasks-empty-icon .tv-ic{ width:24px; height:24px; }
#tasksPage .tasks-empty-title{ margin:0; font-size:15.5px; font-weight:800; color:var(--tv-text); }
#tasksPage .tasks-empty-body{ margin:0; max-width:420px; font-size:13px; line-height:1.9; color:var(--tv-muted); }

/* ── dashboard tab ── */
#tasksPage .tasks-dashboard{ display:flex; flex-direction:column; gap:16px; }
#tasksPage .tasks-dashboard-ai{
  padding:16px 18px;
  border-radius:16px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  box-shadow:var(--tv-shadow);
}
#tasksPage .tasks-dashboard-ai::before,
#tasksPage .tasks-dashboard-ai::after{ content:none; }
#tasksPage .tasks-dashboard-ai-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
#tasksPage .tasks-dashboard-ai-icon{
  width:34px; height:34px;
  border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-accent-soft);
  color:var(--tv-accent);
  font-size:0;
}
#tasksPage .tasks-dashboard-ai-title{ flex:1; font-size:15px; font-weight:800; color:var(--tv-text); }
#tasksPage .tasks-dashboard-ai-refresh{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:34px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-muted);
  font:inherit;
  font-size:12.5px;
  font-weight:700;
  box-shadow:none;
  cursor:pointer;
}
#tasksPage .tasks-dashboard-ai-refresh:hover{ color:var(--tv-accent); background:var(--tv-accent-soft); border-color:transparent; }
#tasksPage .tasks-dashboard-ai-body{ font-size:13.5px; line-height:2; color:var(--tv-text); }
#tasksPage .tasks-dashboard-ai-body p{ margin:0 0 8px; }
#tasksPage .tasks-dashboard-ai-meta{ font-size:11.5px; color:var(--tv-faint); }
#tasksPage .tasks-dashboard-ai-loading,
#tasksPage .tasks-dashboard-ai-empty{ color:var(--tv-muted); font-size:13px; }

#tasksPage .tasks-dashboard-urgent-banner{
  padding:16px 18px;
  border-radius:16px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  box-shadow:var(--tv-shadow);
}
#tasksPage .tasks-dashboard-urgent-banner.hidden{ display:none; }
#tasksPage .tasks-dashboard-urgent-head{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
#tasksPage .tasks-dashboard-urgent-icon{
  width:34px; height:34px;
  border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-danger-soft);
  color:var(--tv-danger);
  font-size:0;
}
#tasksPage .tasks-dashboard-urgent-title-main{ font-size:15px; font-weight:800; color:var(--tv-text); display:flex; align-items:center; gap:8px; }
#tasksPage .tasks-dashboard-urgent-subtitle{ font-size:12.5px; color:var(--tv-muted); }
#tasksPage .tv-count{
  min-width:22px; height:20px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-danger-soft);
  color:var(--tv-danger);
  font-size:12px;
  font-weight:800;
}
#tasksPage .tasks-dashboard-urgent-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:10px;
}
#tasksPage .tasks-dashboard-urgent-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0;
  padding:12px 14px;
  border-radius:13px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface-2);
  color:inherit;
  font:inherit;
  text-align:start;
  box-shadow:none;
  cursor:pointer;
  transition:border-color .15s ease, background-color .15s ease;
}
#tasksPage .tasks-dashboard-urgent-card:hover{ border-color:var(--tv-danger); background:var(--tv-hover); }
#tasksPage .tasks-dashboard-urgent-card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
#tasksPage .tasks-dashboard-urgent-id,
#tasksPage .tasks-dashboard-mini-id{
  padding:1px 7px;
  border-radius:6px;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font-size:11.5px;
  font-weight:700;
}
#tasksPage .tasks-dashboard-urgent-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:1px 8px;
  border-radius:999px;
  background:var(--tv-warn-soft);
  color:var(--tv-warn);
  font-size:11.5px;
  font-weight:700;
}
#tasksPage .tasks-dashboard-urgent-pill.is-overdue{ background:var(--tv-danger-soft); color:var(--tv-danger); }
#tasksPage .tasks-dashboard-urgent-pill .tv-ic{ width:13px; height:13px; }
#tasksPage .tasks-dashboard-urgent-title{ font-size:13.5px; font-weight:700; line-height:1.7; color:var(--tv-text); }
#tasksPage .tasks-dashboard-urgent-meta,
#tasksPage .tasks-dashboard-mini-row-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px 12px;
  font-size:12px;
  color:var(--tv-faint);
}
#tasksPage .tasks-dashboard-urgent-meta > span,
#tasksPage .tasks-dashboard-mini-row-meta > span{ display:inline-flex; align-items:center; gap:4px; }
#tasksPage .tasks-dashboard-urgent-meta .tv-ic,
#tasksPage .tasks-dashboard-mini-row-meta .tv-ic{ width:13px; height:13px; }

#tasksPage .tasks-dashboard-columns{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
@media (max-width:900px){ #tasksPage .tasks-dashboard-columns{ grid-template-columns:1fr; } }
#tasksPage .tasks-dashboard-column{
  padding:14px;
  border-radius:16px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  box-shadow:var(--tv-shadow);
}
#tasksPage .tasks-dashboard-column-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0 0 10px;
  padding:0 4px;
  background:none;
  border:0;
}
#tasksPage .tasks-dashboard-column-title{ display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:800; color:var(--tv-text); }
#tasksPage .tasks-dashboard-column-title .tv-ic{ color:var(--tv-muted); }
#tasksPage .tasks-dashboard-column-count{
  min-width:24px; height:22px;
  padding:0 8px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font-size:12px;
  font-weight:800;
}
#tasksPage .tasks-dashboard-mini-list{ display:flex; flex-direction:column; gap:6px; }
#tasksPage .tasks-dashboard-mini-row{
  display:flex;
  flex-direction:column;
  gap:6px;
  width:100%;
  margin:0;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid transparent;
  background:var(--tv-surface-2);
  color:inherit;
  font:inherit;
  text-align:start;
  box-shadow:none;
  cursor:pointer;
  transition:border-color .15s ease, background-color .15s ease;
}
#tasksPage .tasks-dashboard-mini-row:hover{ border-color:var(--tv-border); background:var(--tv-hover); }
#tasksPage .tasks-dashboard-mini-row-head{ display:flex; align-items:center; gap:8px; min-width:0; }
#tasksPage .tasks-dashboard-mini-title{ font-size:13.5px; font-weight:700; color:var(--tv-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#tasksPage .tasks-dashboard-mini-empty{
  padding:18px;
  border-radius:12px;
  background:var(--tv-surface-2);
  color:var(--tv-muted);
  font-size:13px;
  text-align:center;
}
#tasksPage .task-chip{
  display:inline-flex;
  align-items:center;
  padding:1px 8px;
  border-radius:999px;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font-size:11.5px;
  font-weight:700;
  border:0;
  box-shadow:none;
}
#tasksPage .task-chip-priority-urgent{ background:var(--tv-danger-soft); color:var(--tv-danger); }
#tasksPage .task-chip-priority-medium{ background:var(--tv-warn-soft); color:var(--tv-warn); }
#tasksPage .task-chip-priority-low{ background:var(--tv-ok-soft); color:var(--tv-ok); }

@media (max-width:560px){
  #tasksPage .tv-hero .actions{ width:100%; }
  #tasksPage .tv-hero .tv-btn{ flex:1; justify-content:center; }
  #tasksPage .tv-stat{ padding:12px; }
  #tasksPage .tv-stat-value{ font-size:20px; }
  #tasksPage .tasks-sort-wrap{ margin-inline-start:0; }
}

/* ── overrides for legacy theme-scoped rules (they out-rank plain #tasksPage) ── */
#tasksPage .tasks-pool-toolbar{ flex-direction:row !important; }
#tasksPage .tasks-pool-search{
  flex:1 1 280px !important;
  height:40px;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
}
#tasksPage .tasks-pool-search input{
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
  color:var(--tv-text) !important;
  padding-inline-start:38px !important;
  padding-inline-end:12px !important;
}
#tasksPage .tasks-pool-search-icon{ opacity:1; }

#tasksPage .tasks-tabs{
  flex-wrap:nowrap !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  border-bottom:1px solid var(--tv-border) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
#tasksPage .tasks-tab{ transform:none !important; border:0 !important; }
#tasksPage .tasks-tab:hover{ background:var(--tv-hover) !important; color:var(--tv-text) !important; }
#tasksPage .tasks-tab.is-active,
#tasksPage .tasks-tab.is-active:hover{
  background:none !important;
  color:var(--tv-accent) !important;
  box-shadow:none !important;
  filter:none !important;
}
#tasksPage .tasks-tab.is-active .tasks-tab-icon{ transform:none; }

#tasksPage .tasks-dashboard-ai{ padding:0 !important; overflow:hidden; background:var(--tv-surface) !important; border:1px solid var(--tv-border) !important; }
#tasksPage .tasks-dashboard-ai-head{
  margin:0 !important;
  padding:14px 18px !important;
  background:none !important;
  border-bottom:1px solid var(--tv-border) !important;
  border-radius:0 !important;
}
#tasksPage .tasks-dashboard-ai-icon{ background:var(--tv-accent-soft) !important; color:var(--tv-accent) !important; box-shadow:none !important; }
#tasksPage .tasks-dashboard-ai-title{ color:var(--tv-text) !important; }
#tasksPage .tasks-dashboard-ai-refresh{ background:var(--tv-surface) !important; color:var(--tv-muted) !important; border:1px solid var(--tv-border) !important; box-shadow:none !important; transform:none !important; }
#tasksPage .tasks-dashboard-ai-refresh:hover:not(:disabled){ background:var(--tv-accent-soft) !important; color:var(--tv-accent) !important; border-color:transparent !important; }
#tasksPage .tasks-dashboard-ai-body{ padding:14px 18px 6px !important; color:var(--tv-text) !important; font-size:13.5px !important; }
#tasksPage .tasks-dashboard-ai-body p{
  margin:0 0 10px !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  color:var(--tv-text) !important;
}
#tasksPage .tasks-dashboard-ai-body p strong,
#tasksPage .tasks-dashboard-ai-body p b{ color:var(--tv-accent) !important; background:none !important; }
#tasksPage .tasks-dashboard-ai-meta{ padding:0 18px 14px !important; border:0 !important; }
#tasksPage .tasks-dashboard-ai-meta > span{ background:none !important; border:0 !important; padding:0 !important; color:var(--tv-faint) !important; }
#tasksPage .tasks-tab-badge{ background:var(--tv-chip) !important; color:var(--tv-muted) !important; box-shadow:none !important; border:0 !important; }
#tasksPage .tasks-tab.is-active .tasks-tab-badge{ background:var(--tv-accent-soft) !important; color:var(--tv-accent) !important; }
#tasksPage #tasksTabReviewBtn .tasks-tab-badge{ background:var(--tv-violet-soft) !important; color:var(--tv-violet) !important; }
#tasksPage .tasks-dashboard-urgent-banner{ background:var(--tv-surface) !important; border:1px solid var(--tv-border) !important; box-shadow:var(--tv-shadow) !important; }
#tasksPage .tasks-dashboard-urgent-card{ background:var(--tv-surface-2) !important; border:1px solid var(--tv-border) !important; box-shadow:none !important; }
#tasksPage .tasks-dashboard-urgent-card:hover{ border-color:var(--tv-danger) !important; }
#tasksPage .tasks-dashboard-urgent-title-main{ color:var(--tv-text) !important; }
#tasksPage .tasks-tab{ padding:0 10px; }
#tasksPage .tk-row-author{ background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; }
#tasksPage .tk-row-author-name{ color:var(--tv-text) !important; }

/* Long in-progress / review lists: the column scrolls (max-height from
   style.css); rows must keep their natural height instead of being
   flex-shrunk, which hid each row's meta line under the next row. */
#tasksPage .tasks-dashboard-mini-list{ max-height:460px; padding-inline-end:2px; }
#tasksPage .tasks-dashboard-mini-row{ flex-shrink:0 !important; overflow:visible !important; min-height:auto !important; height:auto !important; }

/* ═══ task table v3 (.tv-table) ═══════════════════════════════════════════
   Two-line rows: title, then one quiet meta line (order #, age, progress,
   comments, mentions, tags). Fixed, useful columns; whole row opens the
   task. Phones (≤880px) turn each row into a compact card. */
#tasksPage .tv-table-wrap{
  border:1px solid var(--tv-border);
  border-radius:16px;
  background:var(--tv-surface);
  box-shadow:var(--tv-shadow);
  overflow:hidden;
}
#tasksPage .tv-table{
  width:100%;
  table-layout:fixed;
  border-collapse:separate;
  border-spacing:0;
  background:none;
}
#tasksPage .tv-col-id{ width:72px; }
#tasksPage .tv-col-owner{ width:160px; }
#tasksPage .tv-col-prio{ width:92px; }
#tasksPage .tv-col-status{ width:118px; }
#tasksPage .tv-col-when{ width:130px; }
#tasksPage .tv-col-go{ width:40px; }
#tasksPage .tv-table thead th{
  height:38px;
  padding:0 10px;
  background:var(--tv-surface-2);
  border-bottom:1px solid var(--tv-border);
  color:var(--tv-faint);
  font-size:12px;
  font-weight:700;
  text-align:start;
  white-space:nowrap;
}
#tasksPage .tv-table thead th:first-child{ padding-inline-start:16px; }

#tasksPage .tv-tr{ cursor:pointer; background:none !important; transition:background-color .12s ease; }
#tasksPage .tv-tr:hover{ background:var(--tv-hover) !important; }
#tasksPage .tv-tr + .tv-tr .tv-td{ border-top:1px solid var(--tv-border); }
#tasksPage .tv-td{
  height:62px;
  padding:9px 10px;
  vertical-align:middle;
  border:0;
  background:none;
  color:var(--tv-text);
  font-size:13px;
  overflow:hidden;
}
#tasksPage .tv-td-id{ padding-inline-start:16px; position:relative; }
/* overdue marker on the reading-start edge */
#tasksPage .tv-tr.is-overdue .tv-td-id::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:10px; bottom:10px;
  width:3px;
  border-radius:3px 0 0 3px;
  background:var(--tv-danger);
}
#tasksPage .tv-id{
  height:24px;
  padding:0 7px;
  border-radius:7px;
  border:0;
  background:var(--tv-chip);
  color:var(--tv-muted);
  font:inherit;
  font-size:12px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  box-shadow:none;
  cursor:copy;
  direction:ltr;
}
#tasksPage .tv-id:hover{ background:var(--tv-accent-soft); color:var(--tv-accent); }

#tasksPage .tv-title{
  font-size:14px;
  font-weight:700;
  line-height:1.6;
  color:var(--tv-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#tasksPage .tv-meta-line{
  display:flex;
  align-items:center;
  gap:4px 12px;
  margin-top:3px;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  font-size:12px;
  color:var(--tv-faint);
}
#tasksPage .tv-m{ display:inline-flex; align-items:center; gap:4px; flex:0 0 auto; }
#tasksPage .tv-m .tv-ic{ width:13px; height:13px; }
#tasksPage .tv-m-order{ color:var(--tv-muted); font-weight:600; font-variant-numeric:tabular-nums; }
#tasksPage .tv-m-strong{ color:var(--tv-info); font-weight:600; }
#tasksPage .tv-bar{ width:34px; height:4px; border-radius:4px; background:var(--tv-chip); overflow:hidden; display:inline-block; }
#tasksPage .tv-bar > span{ display:block; height:100%; border-radius:4px; background:var(--tv-ok); }
#tasksPage .tv-mention{
  flex:0 0 auto;
  padding:0 7px;
  border-radius:999px;
  background:var(--tv-info-soft);
  color:var(--tv-info);
  font-weight:600;
  line-height:1.8;
}
#tasksPage .tv-tag{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:var(--tv-muted);
  font-weight:600;
}
#tasksPage .tv-tag::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--c); }

#tasksPage .tv-person{ display:inline-flex; align-items:center; gap:8px; min-width:0; max-width:100%; }
#tasksPage .tv-avatar{
  width:26px; height:26px;
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 auto;
  background:color-mix(in srgb, var(--av) 16%, transparent);
  color:var(--av);
  font-size:12px;
  font-weight:800;
}
#tasksPage .tv-person-name{ font-size:13px; font-weight:600; color:var(--tv-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#tasksPage .tv-free{
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 10px;
  border-radius:999px;
  border:1px dashed var(--tv-border);
  color:var(--tv-faint);
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
}

#tasksPage .tv-prio-cell{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--tv-muted); white-space:nowrap; }
#tasksPage .tv-prio-cell i{ width:8px; height:8px; border-radius:50%; background:var(--tv-faint); }
#tasksPage .tv-prio-cell[data-prio="urgent"]{ color:var(--tv-danger); font-weight:700; }
#tasksPage .tv-prio-cell[data-prio="urgent"] i{ background:var(--tv-danger); box-shadow:0 0 0 3px var(--tv-danger-soft); }
#tasksPage .tv-prio-cell[data-prio="high"] i{ background:#f97316; }
#tasksPage .tv-prio-cell[data-prio="medium"] i{ background:#f59e0b; }
#tasksPage .tv-prio-cell[data-prio="low"] i{ background:#10b981; }

#tasksPage .tv-status-pill{
  --tone:var(--tv-muted); --tone-soft:var(--tv-chip);
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 10px;
  border-radius:999px;
  background:var(--tone-soft);
  color:var(--tone);
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
#tasksPage .tv-status-pill[data-status="claimed"],
#tasksPage .tv-status-pill[data-status="in_progress"]{ --tone:var(--tv-info); --tone-soft:var(--tv-info-soft); }
#tasksPage .tv-status-pill[data-status="review"]{ --tone:var(--tv-violet); --tone-soft:var(--tv-violet-soft); }
#tasksPage .tv-status-pill[data-status="done"]{ --tone:var(--tv-ok); --tone-soft:var(--tv-ok-soft); }
#tasksPage .tv-status-pill[data-status="rejected"],
#tasksPage .tv-status-pill[data-status="cancelled"]{ --tone:var(--tv-danger); --tone-soft:var(--tv-danger-soft); }

#tasksPage .tv-when{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:var(--tv-muted); white-space:nowrap; }
#tasksPage .tv-when .tv-ic{ width:14px; height:14px; }
#tasksPage .tv-when.is-overdue{ color:var(--tv-danger); font-weight:700; }
#tasksPage .tv-none{ color:var(--tv-faint); }

#tasksPage .tv-td-go{ color:var(--tv-faint); text-align:center; padding-inline-end:14px; }
#tasksPage .tv-td-go .tv-ic{ width:17px; height:17px; transition:transform .15s ease, color .15s ease; }
#tasksPage .tv-tr:hover .tv-td-go{ color:var(--tv-accent); }
#tasksPage .tv-tr:hover .tv-td-go .tv-ic{ transform:translateX(-3px); }

/* Layout follows the space the list actually gets (sidebar open or not),
   not the viewport: medium → drop priority + arrow, narrow → cards. */
#tasksPage .tasks-section{ container-type:inline-size; }
@container (max-width:900px){
  #tasksPage .tv-col-prio, #tasksPage .tv-td-prio, #tasksPage .tv-table thead th:nth-child(4),
  #tasksPage .tv-col-go, #tasksPage .tv-td-go, #tasksPage .tv-table thead th:nth-child(7){ display:none; }
  #tasksPage .tv-col-owner{ width:130px; }
  #tasksPage .tv-col-status{ width:104px; }
  #tasksPage .tv-col-when{ width:118px; }
}

/* narrow: each row becomes a compact card —
   [#id] title / meta line / status · priority · owner ······ due */
@container (max-width:700px){
  #tasksPage .tv-table-wrap{ border:0; background:none; box-shadow:none; border-radius:0; overflow:visible; }
  #tasksPage .tv-table, #tasksPage .tv-table tbody{ display:block; }
  #tasksPage .tv-table colgroup, #tasksPage .tv-table thead{ display:none; }
  #tasksPage .tv-tr{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px 10px;
    margin-bottom:10px;
    padding:12px 14px;
    border:1px solid var(--tv-border);
    border-radius:14px;
    background:var(--tv-surface) !important;
    box-shadow:var(--tv-shadow);
  }
  #tasksPage .tv-tr.is-overdue{ box-shadow:var(--tv-shadow); border-color:color-mix(in srgb, var(--tv-danger) 30%, var(--tv-border)); }
  #tasksPage .tv-tr + .tv-tr .tv-td{ border-top:0; }
  #tasksPage .tv-td{ display:block; height:auto; padding:0; overflow:visible; }
  #tasksPage .tv-td-id{ order:0; align-self:flex-start; padding:0; }
  #tasksPage .tv-tr.is-overdue .tv-td-id::before{ display:none; }
  #tasksPage .tv-td-title{ order:1; flex:1 1 0; min-width:0; }
  #tasksPage .tv-title{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  #tasksPage .tv-meta-line{ flex-wrap:wrap; white-space:normal; }
  /* force the pill row onto its own line */
  #tasksPage .tv-td-status{ order:2; margin-inline-start:0; }
  #tasksPage .tv-td-title::after{ content:none; }
  #tasksPage .tv-td-status::before{ content:none; }
  #tasksPage .tv-tr::after{ content:""; order:1; flex-basis:100%; height:0; }
  #tasksPage .tv-td-prio{ order:3; }
  #tasksPage .tv-td-owner{ order:4; min-width:0; }
  #tasksPage .tv-td-when{ order:5; margin-inline-start:auto; }
  #tasksPage .tv-td-go{ display:none; }
  #tasksPage .tv-td-when:has(> .tv-none){ display:none; }
}

/* ═══ task detail modal (v3) ═════════════════════════════════════════════
   Visual pass only — the two-column grid, topbar/footer placement and the
   phone single-column layout stay as style.css lays them out. */
#taskDetailModal{
  --tv-surface:var(--dk-surface); --tv-surface-2:var(--dk-surface-2); --tv-hover:var(--dk-hover);
  --tv-border:#e7e9f0; --tv-text:var(--dk-text); --tv-muted:var(--dk-muted); --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip); --tv-accent:var(--dk-accent); --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:#dc2626; --tv-danger-soft:rgba(220,38,38,.08);
  --tv-warn:#b45309; --tv-warn-soft:rgba(217,119,6,.10);
  --tv-ok:#059669; --tv-ok-soft:rgba(5,150,105,.10);
  --tv-info:#2563eb; --tv-info-soft:rgba(37,99,235,.08);
  --tv-violet:#7c3aed; --tv-violet-soft:rgba(124,58,237,.09);
}
html[data-theme="dark"] #taskDetailModal{
  --tv-surface:#111827; --tv-surface-2:#0f172a; --tv-hover:rgba(51,65,85,.40);
  --tv-border:rgba(148,163,184,.14); --tv-text:var(--dk-text); --tv-muted:#94a3b8; --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip); --tv-accent:var(--dk-accent); --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:var(--dk-danger); --tv-danger-soft:rgba(248,113,113,.13);
  --tv-warn:var(--dk-warn); --tv-warn-soft:rgba(251,191,36,.12);
  --tv-ok:var(--dk-ok); --tv-ok-soft:rgba(52,211,153,.12);
  --tv-info:var(--dk-info); --tv-info-soft:rgba(96,165,250,.13);
  --tv-violet:var(--dk-violet); --tv-violet-soft:var(--dk-violet-soft);
}
#taskDetailModal .tv-ic{ width:16px; height:16px; flex:0 0 auto; display:inline-block; vertical-align:-3px; }

#taskDetailModal .task-detail-card{
  background:var(--tv-surface) !important;
  border:1px solid var(--tv-border) !important;
  border-radius:18px !important;
  box-shadow:0 30px 80px -20px rgba(15,23,42,.35) !important;
  color:var(--tv-text);
}

/* topbar: breadcrumb + quiet icon buttons */
#taskDetailModal .tkd2-topbar{
  padding:12px 16px 12px 12px !important;
  background:var(--tv-surface) !important;
  border-bottom:1px solid var(--tv-border) !important;
  border-radius:18px 18px 0 0 !important;
  box-shadow:none !important;
}
#taskDetailModal .tkd2-topbar::before,
#taskDetailModal .tkd2-topbar::after{ content:none !important; }
#taskDetailModal .tkd2-breadcrumb{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--tv-muted) !important; }
#taskDetailModal .tkd2-bc-sep{ color:var(--tv-faint); }
#taskDetailModal .tkd2-bc-id{
  padding:2px 8px;
  border-radius:7px;
  background:var(--tv-chip) !important;
  color:var(--tv-muted) !important;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  direction:ltr;
  cursor:copy;
  border:0 !important;
}
#taskDetailModal .tkd2-tb-r{ display:flex; gap:2px; }
#taskDetailModal .tkd2-ib{
  width:36px !important; height:36px !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  border-radius:10px !important;
  border:0 !important;
  background:transparent !important;
  color:var(--tv-muted) !important;
  box-shadow:none !important;
  font-size:0 !important;
  cursor:pointer;
}
#taskDetailModal .tkd2-ib .tv-ic{ width:18px; height:18px; }
#taskDetailModal .tkd2-ib:hover{ background:var(--tv-hover) !important; color:var(--tv-text) !important; }
#taskDetailModal .tkd2-ib-close:hover{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }

/* main column */
#taskDetailModal .tkd2-main{ padding:22px 24px !important; background:var(--tv-surface) !important; }
#taskDetailModal .tkd2-title{
  font-size:21px !important;
  font-weight:800 !important;
  line-height:1.6 !important;
  color:var(--tv-text) !important;
  margin:0 0 10px !important;
}
#taskDetailModal .tkd2-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
#taskDetailModal .tkd2-chip{
  display:inline-flex !important;
  align-items:center;
  gap:6px;
  height:26px;
  padding:0 10px !important;
  border-radius:999px !important;
  border:0 !important;
  background:var(--tv-chip) !important;
  color:var(--tv-muted) !important;
  font-size:12.5px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}
#taskDetailModal .tkd2-chip .tv-ic{ width:14px; height:14px; }
#taskDetailModal .tkd2-chip-dot{ width:7px !important; height:7px !important; }
#taskDetailModal .tkd2-chip-prio-urgent{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }
#taskDetailModal .tkd2-chip-prio-high,
#taskDetailModal .tkd2-chip-prio-medium{ background:var(--tv-warn-soft) !important; color:var(--tv-warn) !important; }
#taskDetailModal .tkd2-chip-prio-low{ background:var(--tv-ok-soft) !important; color:var(--tv-ok) !important; }
#taskDetailModal [class*="tkd2-chip-status-claimed"],
#taskDetailModal [class*="tkd2-chip-status-in_progress"]{ background:var(--tv-info-soft) !important; color:var(--tv-info) !important; }
#taskDetailModal [class*="tkd2-chip-status-review"]{ background:var(--tv-violet-soft) !important; color:var(--tv-violet) !important; }
#taskDetailModal [class*="tkd2-chip-status-done"]{ background:var(--tv-ok-soft) !important; color:var(--tv-ok) !important; }
#taskDetailModal [class*="tkd2-chip-status-rejected"],
#taskDetailModal [class*="tkd2-chip-status-cancelled"]{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }

#taskDetailModal .tkd2-sec-label{
  display:block !important;
  margin:20px 0 8px !important;
  font-size:12.5px !important;
  font-weight:700 !important;
  color:var(--tv-faint) !important;
  letter-spacing:0;
}
#taskDetailModal .tkd2-desc{
  padding:14px 16px !important;
  border-radius:12px !important;
  border:0 !important;
  background:var(--tv-surface-2) !important;
  color:var(--tv-text) !important;
  font-size:14px !important;
  line-height:2 !important;
  box-shadow:none !important;
}

/* attachments: a quiet drop target */
#taskDetailModal .task-btn-attach{
  display:inline-flex !important;
  align-items:center;
  height:38px;
  padding:0 14px !important;
  border-radius:10px !important;
  border:1px dashed var(--tv-border) !important;
  background:transparent !important;
  color:var(--tv-muted) !important;
  font-size:13px !important;
  font-weight:600 !important;
  box-shadow:none !important;
}
#taskDetailModal .task-btn-attach > span{ display:inline-flex; align-items:center; gap:7px; }
#taskDetailModal .task-btn-attach kbd{
  padding:1px 6px;
  border-radius:5px;
  background:var(--tv-chip);
  color:var(--tv-faint);
  font:inherit;
  font-size:11px;
  direction:ltr;
}
#taskDetailModal .task-btn-attach:hover{ border-color:var(--tv-accent) !important; color:var(--tv-accent) !important; background:var(--tv-accent-soft) !important; }

/* checklist bar */
#taskDetailModal .tkd2-cl-bar{ height:6px !important; border-radius:6px !important; background:var(--tv-chip) !important; }
#taskDetailModal .tkd2-cl-fill{ background:var(--tv-ok) !important; border-radius:6px !important; }
#taskDetailModal .tkd2-cl-txt{ color:var(--tv-muted) !important; font-size:12px !important; }

/* comments: plain cards, author + time on top */
#taskDetailModal .task-comment{
  display:flex !important;
  flex-direction:column !important;
  gap:6px;
  padding:12px 14px !important;
  border-radius:12px !important;
  border:1px solid var(--tv-border) !important;
  border-inline-start:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
  box-shadow:none !important;
}
#taskDetailModal .task-comment::before{ content:none !important; }
#taskDetailModal .task-comment.is-mine{ background:var(--tv-surface-2) !important; }
#taskDetailModal .task-comment.mentions-me{ border-color:var(--tv-accent) !important; background:var(--tv-accent-soft) !important; }
#taskDetailModal .task-comment-head{
  order:-1;
  display:flex !important;
  align-items:center;
  gap:8px;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
#taskDetailModal .task-comment-author-chip{ display:inline-flex !important; align-items:center; gap:7px; background:none !important; padding:0 !important; border:0 !important; }
#taskDetailModal .task-comment-author-avatar{
  width:24px !important; height:24px !important;
  border-radius:50% !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--chip-c1, var(--tv-accent)) 16%, transparent) !important;
  color:var(--chip-c1, var(--tv-accent)) !important;
  font-size:11.5px !important;
  font-weight:800 !important;
  box-shadow:none !important;
}
#taskDetailModal .task-comment-author-name{ font-size:13px !important; font-weight:700 !important; color:var(--tv-text) !important; }
#taskDetailModal .task-comment-time{ font-size:11.5px !important; color:var(--tv-faint) !important; margin-inline-start:auto; }
#taskDetailModal .task-comment-mentions-me-tag{
  padding:1px 8px;
  border-radius:999px;
  background:var(--tv-accent-soft) !important;
  color:var(--tv-accent) !important;
  font-size:11px;
  font-weight:700;
}
#taskDetailModal .task-comment-body{ font-size:13.5px !important; line-height:1.95 !important; color:var(--tv-text) !important; }
#taskDetailModal .task-comment-empty{ color:var(--tv-faint) !important; font-size:13px; padding:10px 0; }
#taskDetailModal .task-comment-group-toggle{
  border-radius:9px !important;
  border:0 !important;
  background:var(--tv-chip) !important;
  color:var(--tv-muted) !important;
  font-size:12px !important;
  box-shadow:none !important;
}

/* sidebar: underline tabs + key/value rows */
#taskDetailModal .tkd2-sidebar{
  background:var(--tv-surface-2) !important;
  border-inline-start:1px solid var(--tv-border) !important;
  box-shadow:none !important;
}
#taskDetailModal .tkd2-tabs{
  display:flex !important;
  gap:0 !important;
  padding:0 12px !important;
  background:none !important;
  border:0 !important;
  border-bottom:1px solid var(--tv-border) !important;
  border-radius:0 !important;
}
#taskDetailModal .tkd2-tab{
  position:relative;
  flex:1 1 0;
  height:46px;
  padding:0 8px !important;
  border:0 !important;
  border-radius:0 !important;
  background:none !important;
  color:var(--tv-muted) !important;
  font:inherit;
  font-size:13px !important;
  font-weight:600 !important;
  box-shadow:none !important;
  cursor:pointer;
}
#taskDetailModal .tkd2-tab:hover{ color:var(--tv-text) !important; }
#taskDetailModal .tkd2-tab.is-active{ color:var(--tv-accent) !important; font-weight:700 !important; }
#taskDetailModal .tkd2-tab.is-active::after{
  content:"";
  position:absolute;
  left:12px; right:12px; bottom:-1px;
  height:2px;
  border-radius:2px;
  background:var(--tv-accent);
}
#taskDetailModal .tkd2-tab-content{ padding:6px 16px 16px !important; }
#taskDetailModal .tkd2-mrow{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:44px;
  padding:6px 0 !important;
  border-bottom:1px solid var(--tv-border) !important;
}
#taskDetailModal .tkd2-mkey{
  display:inline-flex !important;
  align-items:center;
  gap:7px;
  flex:0 0 auto;
  font-size:12.5px !important;
  font-weight:600 !important;
  color:var(--tv-muted) !important;
}
#taskDetailModal .tkd2-mkey .tv-ic{ width:15px; height:15px; color:var(--tv-faint); }
#taskDetailModal .tkd2-mval{
  display:flex !important;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  min-width:0;
  font-size:13px !important;
  font-weight:600 !important;
  color:var(--tv-text) !important;
  text-align:end;
}
#taskDetailModal .tkd2-divider{ display:none !important; }
#taskDetailModal .task-chip-order{
  height:26px;
  padding:0 10px !important;
  border-radius:8px !important;
  border:0 !important;
  background:var(--tv-chip) !important;
  color:var(--tv-text) !important;
  font:inherit;
  font-size:12.5px !important;
  font-weight:700 !important;
  font-variant-numeric:tabular-nums;
  box-shadow:none !important;
  cursor:copy;
}
#taskDetailModal .task-chip-order:hover{ background:var(--tv-accent-soft) !important; color:var(--tv-accent) !important; }
#taskDetailModal .task-detail-mention-chip,
#taskDetailModal .tasks-recipient-chip{
  padding:2px 9px !important;
  border-radius:999px !important;
  border:0 !important;
  background:var(--tv-info-soft) !important;
  color:var(--tv-info) !important;
  font-size:12px !important;
  font-weight:600 !important;
  box-shadow:none !important;
}
#taskDetailModal [data-detail-manage-labels]{
  width:28px; height:28px;
  padding:0 !important;
  border-radius:8px !important;
  border:1px dashed var(--tv-border) !important;
  background:transparent !important;
  color:var(--tv-muted) !important;
  box-shadow:none !important;
}

/* activity timeline + AI panel */
#taskDetailModal .tkd2-tl-item{ gap:10px; padding:8px 0; }
#taskDetailModal .tkd2-tl-dot{ background:var(--tv-chip) !important; color:var(--tv-muted) !important; box-shadow:none !important; border:0 !important; }
#taskDetailModal .tkd2-tl-action{ font-size:12.5px !important; color:var(--tv-text) !important; }
#taskDetailModal .tkd2-tl-time{ font-size:11px !important; color:var(--tv-faint) !important; }
#taskDetailModal .tkd2-ai-refresh{
  display:inline-flex !important; align-items:center; justify-content:center; gap:6px;
  width:100%;
  height:36px;
  margin-top:10px;
  border-radius:10px !important;
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
  color:var(--tv-muted) !important;
  font:inherit;
  font-size:12.5px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}
#taskDetailModal .tkd2-ai-refresh:hover{ color:var(--tv-accent) !important; background:var(--tv-accent-soft) !important; }

/* footer: one clean composer row */
#taskDetailModal .tkd2-footer-wrap{
  background:var(--tv-surface) !important;
  border-top:1px solid var(--tv-border) !important;
}
#taskDetailModal .tkd2-footer{
  display:flex !important;
  align-items:center;
  gap:8px !important;
  padding:12px 16px !important;
  background:none !important;
  border:0 !important;
}
#taskDetailModal .tkd2-comment-in{
  flex:1 1 auto;
  min-width:0;
  height:42px !important;
  padding:0 14px !important;
  border-radius:12px !important;
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface-2) !important;
  color:var(--tv-text) !important;
  font:inherit;
  font-size:13.5px !important;
  box-shadow:none !important;
}
#taskDetailModal .tkd2-comment-in:focus{ outline:none; border-color:var(--tv-accent) !important; background:var(--tv-surface) !important; box-shadow:0 0 0 3px var(--tv-accent-soft) !important; }
#taskDetailModal .tcred-add-btn,
#taskDetailModal .tkd2-send-btn,
#taskDetailModal .tkd2-cta{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex:0 0 auto;
  height:42px !important;
  padding:0 16px !important;
  border-radius:12px !important;
  font:inherit;
  font-size:13.5px !important;
  font-weight:700 !important;
  white-space:nowrap;
  box-shadow:none !important;
  transform:none !important;
  cursor:pointer;
}
#taskDetailModal .tcred-add-btn{ border:1px solid var(--tv-border) !important; background:var(--tv-surface) !important; color:var(--tv-muted) !important; }
#taskDetailModal .tcred-add-btn:hover{ color:var(--tv-accent) !important; border-color:var(--tv-accent) !important; }
#taskDetailModal .tkd2-send-btn{ border:0 !important; background:var(--tv-accent-soft) !important; color:var(--tv-accent) !important; }
#taskDetailModal .tkd2-send-btn:hover{ background:var(--dk-accent-fill) !important; color:#fff !important; }
#taskDetailModal .tkd2-cta{ border:0 !important; }
#taskDetailModal .tkd2-cta-primary{ background:var(--dk-accent-fill) !important; color:#fff !important; }
#taskDetailModal .tkd2-cta-primary:hover{ filter:brightness(1.08); }
#taskDetailModal .tkd2-cta-info{ background:var(--tv-info-soft) !important; color:var(--tv-info) !important; }
#taskDetailModal .tkd2-cta-danger{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }
@media (max-width:560px){
  #taskDetailModal .tkd2-footer{ flex-wrap:wrap; }
  #taskDetailModal .tkd2-comment-in{ flex-basis:100%; }
  #taskDetailModal .tkd2-cta{ flex:1 1 auto; }
}
/* author + time above the text (style.css pushed the head below with order:2) */
#taskDetailModal .tkd2-main .task-comment-head{ order:0 !important; margin:0 !important; padding:0 !important; border:0 !important; font-size:12px !important; }
#taskDetailModal .tkd2-main .task-comment-body{ order:1 !important; }
/* single frame: no inner padding around the shell */
#taskDetailModal .task-detail-card{ padding:0 !important; overflow:hidden !important; }
#taskDetailModal .tk-detail-shell-v2{ border:0 !important; border-radius:0 !important; box-shadow:none !important; background:var(--tv-surface) !important; }

/* Phones: the grid gave the main column (title/description/comments) a
   ~40px scroll box under the sidebar — the task itself was unreadable.
   Stack everything and let the whole sheet scroll: topbar (sticky) → task →
   details panel → composer (sticky). */
@media (max-width:880px){
  #taskDetailModal .tk-detail-shell-v2{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
  }
  #taskDetailModal .tkd2-topbar{ position:sticky; top:0; z-index:3; flex:0 0 auto; border-radius:0 !important; }
  #taskDetailModal .tkd2-main{ flex:0 0 auto !important; height:auto !important; max-height:none !important; overflow:visible !important; padding:16px !important; }
  #taskDetailModal .tkd2-sidebar{ flex:0 0 auto !important; height:auto !important; overflow:visible !important; border-inline-start:0 !important; border-top:1px solid var(--tv-border) !important; }
  #taskDetailModal .tkd2-footer-wrap{ position:sticky; bottom:0; z-index:3; flex:0 0 auto; margin-top:auto; }
  #taskDetailModal .tkd2-title{ font-size:17px !important; }
}

/* ═══ readability pass (light theme) ═════════════════════════════════════
   slate-400 secondary text measured ~2.6:1 on white — too faint for dates
   and captions read all day. Muted → slate-600, faint → slate-500 (≥4.5:1). */
#tasksPage,
#taskDetailModal{
  --tv-muted:var(--dk-muted);
  --tv-faint:var(--dk-faint);
  --tv-border:var(--dk-border);
}
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal{
  --tv-muted:var(--dk-muted);
  --tv-faint:var(--dk-faint);
  --tv-border:var(--dk-border);
}
#tasksPage .tv-meta-line,
#tasksPage .tk-row-meta{ color:var(--tv-muted); }
#tasksPage .tv-when{ color:var(--tv-muted); font-weight:600; }
#tasksPage .tasks-dashboard-urgent-meta,
#tasksPage .tasks-dashboard-mini-row-meta,
#tasksPage .tasks-pager-info{ color:var(--tv-muted); }
#tasksPage .tv-table thead th{ color:var(--tv-muted); }
#taskDetailModal .task-comment-time{ color:var(--tv-muted) !important; font-weight:600; }
#taskDetailModal .tkd2-tl-time{ color:var(--tv-muted) !important; }
#taskDetailModal .tkd2-mkey{ color:var(--tv-muted) !important; }
#taskDetailModal .tkd2-mkey .tv-ic{ color:var(--tv-faint); }
#taskDetailModal .tkd2-mval{ font-size:13px !important; line-height:1.7; }
#taskDetailModal .task-comment-body,
#taskDetailModal .tkd2-desc{ color:var(--tv-text) !important; }

/* modal title: its own card, tinted and marked by priority */
#taskDetailModal .tkd2-head-card{
  --pc:var(--tv-accent); --pc-soft:var(--tv-accent-soft);
  position:relative;
  margin:0 0 6px;
  padding:16px 20px 14px;
  border-radius:14px;
  border:1px solid color-mix(in srgb, var(--pc) 22%, var(--tv-border));
  background:linear-gradient(180deg, var(--pc-soft), transparent 140%), var(--tv-surface);
}
#taskDetailModal .tkd2-head-card::before{
  content:"";
  position:absolute;
  inset-inline-start:-1px;
  top:14px; bottom:14px;
  width:4px;
  border-radius:0 4px 4px 0;
  background:var(--pc);
}
#taskDetailModal .tkd2-head-card[data-prio="urgent"]{ --pc:var(--tv-danger); --pc-soft:var(--tv-danger-soft); }
#taskDetailModal .tkd2-head-card[data-prio="high"],
#taskDetailModal .tkd2-head-card[data-prio="medium"]{ --pc:#d97706; --pc-soft:var(--tv-warn-soft); }
#taskDetailModal .tkd2-head-card[data-prio="low"]{ --pc:var(--tv-ok); --pc-soft:var(--tv-ok-soft); }
#taskDetailModal .tkd2-head-card .tkd2-title{ margin:0 0 10px !important; }
#taskDetailModal .tkd2-head-card .tkd2-chips{ margin:0 !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip{ background:var(--tv-surface) !important; border:1px solid var(--tv-border) !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-urgent{ color:var(--tv-danger) !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-medium,
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-high{ color:var(--tv-warn) !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-low{ color:var(--tv-ok) !important; }

/* section headings: clear, with an icon and a hairline */
#taskDetailModal .tkd2-sec-label{
  display:flex !important;
  align-items:center;
  gap:7px;
  margin:22px 0 10px !important;
  font-size:13.5px !important;
  font-weight:800 !important;
  color:var(--tv-text) !important;
}
#taskDetailModal .tkd2-sec-label .tv-ic{ width:16px; height:16px; color:var(--tv-accent); }
#taskDetailModal .tkd2-sec-label::after{ content:""; flex:1; height:1px; background:var(--tv-border); margin-inline-start:6px; }
html[data-theme="dark"] #taskDetailModal{ --tv-surface-2:#1a2436; }

/* ═══ critique pass (2026-09-30) ═════════════════════════════════════════
   From the dual review: density above the fold, no decorative side stripes,
   one colour meaning per state, visible keyboard focus, readable meta text,
   and the compose sheet brought into the same system. */

/* text never uses the icon-only grey */
#tasksPage, #taskDetailModal, #tasksComposeModal{ --tv-subtle:var(--dk-subtle); }
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal,
html[data-theme="dark"] #tasksComposeModal{ --tv-subtle:var(--dk-subtle); }
#tasksPage .tv-meta-line,
#tasksPage .tasks-dashboard-urgent-meta,
#tasksPage .tasks-dashboard-mini-row-meta,
#tasksPage .tasks-dashboard-ai-meta > span,
#tasksPage .tasks-priority-filter-label,
#tasksPage .tasks-sort-label,
#taskDetailModal .task-comment-time{ color:var(--tv-subtle) !important; font-size:12.5px !important; }
#tasksPage .tv-m .tv-ic, #tasksPage .tv-when .tv-ic{ color:var(--tv-faint); }
#tasksPage .tv-when.is-overdue .tv-ic{ color:inherit; }

/* hero: fixed type scale, no dead space above */
#tasksPage .tv-hero{ margin:0 0 12px !important; padding-top:0 !important; }
#tasksPage .tv-hero h1{ font-size:22px !important; line-height:1.5 !important; }
#tasksPage .tv-hero p{ font-size:13.5px; color:var(--tv-muted); }

/* summary strip replaces the four stat cards */
#tasksPage .tasks-stats{
  display:flex !important;
  flex-wrap:wrap;
  gap:8px !important;
  grid-template-columns:none !important;
  margin:0 0 14px !important;
}
#tasksPage .tv-sum{
  --tone:var(--tv-text); --tone-soft:var(--tv-chip);
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  height:34px;
  align-items:center;
  margin:0;
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-muted);
  font:inherit;
  font-size:13px;
  font-weight:600;
  box-shadow:none;
  cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease;
}
#tasksPage .tv-sum b{ font-size:15px; font-weight:800; color:var(--tone); font-variant-numeric:tabular-nums; }
#tasksPage .tv-sum:hover{ background:var(--tv-hover); border-color:color-mix(in srgb, var(--tone) 30%, var(--tv-border)); }
#tasksPage .tv-sum.is-zero b{ color:var(--tv-subtle); font-weight:700; }
#tasksPage .tv-sum.is-hot[data-tone="info"]{ --tone:var(--tv-info); }
#tasksPage .tv-sum.is-hot[data-tone="violet"]{ --tone:var(--tv-violet); background:var(--tv-violet-soft); border-color:transparent; }
#tasksPage .tv-sum.is-hot[data-tone="danger"]{ --tone:var(--tv-danger); background:var(--tv-danger-soft); border-color:transparent; }

/* tab rail: fade the overflow end instead of clipping */
#tasksPage .tasks-tabs{
  -webkit-mask-image:linear-gradient(to left, transparent 0, #000 28px);
          mask-image:linear-gradient(to left, transparent 0, #000 28px);
  padding-left:28px !important;
}

/* chips: active = solid soft fill, never a glow */
#tasksPage .tasks-priority-chip,
#tasksPage .tasks-archive-status-chip,
#tasksPage .tasks-pool-tag-chip{ box-shadow:none !important; }
#tasksPage .tasks-priority-chip.is-active,
#tasksPage .tasks-archive-status-chip.is-active,
#tasksPage .tasks-pool-tag-chip.is-active{
  background:var(--tv-accent-soft) !important;
  border-color:transparent !important;
  color:var(--tv-accent) !important;
  font-weight:700;
}

/* overdue = red deadline text + faint row tint; no side stripes anywhere */
#tasksPage .tv-tr.is-overdue .tv-td-id::before{ content:none !important; }
#tasksPage .tv-tr.is-overdue{ background:color-mix(in srgb, var(--tv-danger) 4%, transparent) !important; }
#tasksPage .tv-tr.is-overdue:hover{ background:color-mix(in srgb, var(--tv-danger) 7%, transparent) !important; }
#tasksPage .tasks-dashboard-mini-row.is-overdue{ box-shadow:none !important; background:color-mix(in srgb, var(--tv-danger) 5%, var(--tv-surface-2)) !important; }
#tasksPage .tasks-dashboard-stat::before{ content:none !important; }

/* keyboard focus, everywhere in the task surfaces */
#tasksPage :is(button, a, input, select, textarea, .tv-tr):focus-visible,
#taskDetailModal :is(button, a, input, select, textarea):focus-visible,
#tasksComposeModal :is(button, a, input, select, textarea, summary):focus-visible{
  outline:2px solid var(--tv-accent) !important;
  outline-offset:2px;
}
#tasksPage .tv-tr:focus-visible{ outline-offset:-2px; }

/* dashboard: one red for urgent, names readable, no empty grid column */
#tasksPage .tasks-dashboard-urgent-grid{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important; }
#tasksPage .tasks-dashboard-urgent-pill{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }
#tasksPage .tasks-dashboard-mini-claimer{ color:var(--tv-text) !important; font-weight:600; }
#tasksPage .tasks-dashboard-column{ background:var(--tv-surface) !important; border:1px solid var(--tv-border) !important; }
#tasksPage .tasks-dashboard-mini-row{ background:var(--tv-surface-2) !important; }
#tasksPage .task-chip-priority-urgent{ background:var(--tv-danger-soft) !important; color:var(--tv-danger) !important; }

/* empty-state CTA uses the primary, not green */
#tasksPage .tasks-empty-state .task-btn-primary{
  height:40px;
  padding:0 18px !important;
  border-radius:11px !important;
  border:0 !important;
  background:var(--tv-accent-soft) !important;
  color:var(--tv-accent) !important;
  font-weight:700 !important;
  box-shadow:none !important;
}
#tasksPage .tasks-empty-state .task-btn-primary:hover{ background:var(--dk-accent-fill) !important; color:#fff !important; }

/* detail modal: plain title surface, no stripe, no tinted gradient */
#taskDetailModal .tkd2-head-card{ background:var(--tv-surface) !important; border:0 !important; padding:4px 0 6px !important; }
#taskDetailModal .tkd2-head-card::before{ content:none !important; }
#taskDetailModal .tkd2-head-card .tkd2-title{ font-size:20px !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip{ background:var(--tv-chip) !important; border:0 !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-urgent{ background:var(--tv-danger-soft) !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-medium,
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-high{ background:var(--tv-warn-soft) !important; }
#taskDetailModal .tkd2-head-card .tkd2-chip-prio-low{ background:var(--tv-ok-soft) !important; }
#taskDetailModal .tkd2-head-card [class*="tkd2-chip-status-claimed"],
#taskDetailModal .tkd2-head-card [class*="tkd2-chip-status-in_progress"]{ background:var(--tv-info-soft) !important; }
#taskDetailModal .tkd2-head-card [class*="tkd2-chip-status-review"]{ background:var(--tv-violet-soft) !important; }
#taskDetailModal .tkd2-head-card [class*="tkd2-chip-status-done"]{ background:var(--tv-ok-soft) !important; }
#taskDetailModal .tasks-label-chip.is-small{ font-size:12px !important; padding:2px 9px !important; }
/* send looks inactive until there is something to send */
#taskDetailModal .tkd2-comment-in:placeholder-shown ~ .tkd2-send-btn{ opacity:.55; pointer-events:none; }

/* phones: room for the floating "new task" button, lighter refresh */
@media (max-width:880px){
  #tasksPage .tasks-section{ padding-bottom:88px; }
  #tasksPage .tv-hero #tasksHeroRefreshBtn span{ display:none; }
  #tasksPage .tv-hero #tasksHeroRefreshBtn{ width:40px; padding:0; justify-content:center; flex:0 0 auto !important; }
  #tasksPage .tasks-pool-tag-filters,
  #tasksPage .tasks-priority-filter{ flex-wrap:nowrap !important; overflow-x:auto; scrollbar-width:none; padding-inline:2px; }
}

/* ═══ compose sheet ("تسک جدید") ═══ */
#tasksComposeModal{
  --tv-surface:var(--dk-surface); --tv-surface-2:var(--dk-surface-2); --tv-hover:var(--dk-hover);
  --tv-border:var(--dk-border); --tv-text:var(--dk-text); --tv-muted:var(--dk-muted); --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip); --tv-accent:var(--dk-accent); --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:#dc2626;
}
html[data-theme="dark"] #tasksComposeModal{
  --tv-surface:#111827; --tv-surface-2:#1a2436; --tv-hover:rgba(51,65,85,.40);
  --tv-border:var(--dk-border); --tv-text:var(--dk-text); --tv-muted:var(--dk-muted); --tv-faint:var(--dk-faint);
  --tv-chip:var(--dk-chip); --tv-accent:var(--dk-accent); --tv-accent-soft:var(--dk-accent-soft);
  --tv-danger:var(--dk-danger);
}
#tasksComposeModal .tv-ic{ width:16px; height:16px; flex:0 0 auto; display:inline-block; vertical-align:-3px; }
#tasksComposeModal .tasks-compose-card{
  width:min(720px, calc(100vw - 24px)) !important;
  max-height:calc(100vh - 32px) !important;
  display:flex !important;
  flex-direction:column;
  padding:0 !important;
  overflow:hidden;
  border-radius:18px !important;
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
  color:var(--tv-text);
  box-shadow:0 30px 80px -20px rgba(15,23,42,.35) !important;
}
#tasksComposeModal .tasks-compose-head{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  flex:0 0 auto;
  margin:0 !important;
  padding:14px 16px 14px 12px !important;
  border:0 !important;
  border-bottom:1px solid var(--tv-border) !important;
  border-radius:0 !important;
  background:var(--tv-surface) !important;
}
#tasksComposeModal .tasks-compose-head::before,
#tasksComposeModal .tasks-compose-head::after{ content:none !important; }
#tasksComposeModal .tasks-compose-title{ margin:0 !important; font-size:18px !important; font-weight:800 !important; color:var(--tv-text) !important; background:none !important; -webkit-text-fill-color:currentColor; }
#tasksComposeModal .tasks-compose-close{
  width:36px !important; height:36px !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  border-radius:10px !important; border:0 !important;
  background:transparent !important; color:var(--tv-muted) !important;
  box-shadow:none !important; font-size:0 !important; cursor:pointer;
}
#tasksComposeModal .tasks-compose-close .tv-ic{ width:18px; height:18px; }
#tasksComposeModal .tasks-compose-close:hover{ background:var(--tv-hover) !important; color:var(--tv-text) !important; }
#tasksComposeModal .tasks-compose-body{
  flex:1 1 auto;
  overflow-y:auto;
  display:flex !important;
  flex-direction:column;
  gap:16px !important;
  padding:18px 20px 20px !important;
  background:var(--tv-surface) !important;
}
#tasksComposeModal .tv-field{ display:flex !important; flex-direction:column; gap:6px !important; margin:0 !important; }
#tasksComposeModal .tv-label{
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px !important; font-weight:700 !important; color:var(--tv-text) !important;
}
#tasksComposeModal .tv-label .tv-ic{ color:var(--tv-faint); }
#tasksComposeModal .tv-req{ color:var(--tv-danger); font-weight:800; }
#tasksComposeModal .tv-opt{ font-style:normal; font-size:12px; font-weight:500; color:var(--tv-faint); }
#tasksComposeModal input[type="text"],
#tasksComposeModal input[type="datetime-local"],
#tasksComposeModal select,
#tasksComposeModal textarea{
  width:100%;
  min-height:42px;
  padding:9px 12px !important;
  border-radius:11px !important;
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface-2) !important;
  color:var(--tv-text) !important;
  font:inherit;
  font-size:13.5px !important;
  box-shadow:none !important;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
#tasksComposeModal textarea{ min-height:84px; line-height:1.9; resize:vertical; }
#tasksComposeModal input::placeholder,
#tasksComposeModal textarea::placeholder{ color:var(--tv-faint); opacity:1; }
#tasksComposeModal :is(input, select, textarea):focus{ outline:none; border-color:var(--tv-accent) !important; background:var(--tv-surface) !important; box-shadow:0 0 0 3px var(--tv-accent-soft) !important; }
#tasksComposeModal .tv-grid-3{ display:grid !important; grid-template-columns:1fr 1.5fr 1.2fr; gap:12px !important; }
@media (max-width:640px){ #tasksComposeModal .tv-grid-3{ grid-template-columns:1fr; } }

/* switch rows: short bold label + one muted line */
#tasksComposeModal .tasks-compose-switch{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px !important;
  border-radius:12px !important;
  border:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
  cursor:pointer;
}
#tasksComposeModal .tasks-compose-switch:hover{ background:var(--tv-hover) !important; }
#tasksComposeModal .tasks-compose-switch input[type="checkbox"]{ width:18px; height:18px; margin:2px 0 0; flex:0 0 auto; accent-color:var(--dk-accent-fill); }
#tasksComposeModal .tv-switch-text{ display:flex; flex-direction:column; gap:2px; }
#tasksComposeModal .tv-switch-text strong{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--tv-text); }
#tasksComposeModal .tv-switch-text small{ font-size:12px; line-height:1.8; color:var(--tv-muted); }
#tasksComposeModal .tv-switch-row{ display:block !important; margin:0 !important; }

#tasksComposeModal .task-btn-attach{
  display:inline-flex !important; align-items:center; align-self:flex-start;
  height:38px; padding:0 14px !important;
  border-radius:10px !important; border:1px dashed var(--tv-border) !important;
  background:transparent !important; color:var(--tv-muted) !important;
  font-size:13px !important; font-weight:600 !important; box-shadow:none !important;
}
#tasksComposeModal .task-btn-attach > span{ display:inline-flex; align-items:center; gap:7px; }
#tasksComposeModal .task-btn-attach kbd{ padding:1px 6px; border-radius:5px; background:var(--tv-chip); color:var(--tv-muted); font:inherit; font-size:11.5px; direction:ltr; }
#tasksComposeModal .task-btn-attach:hover{ border-color:var(--tv-accent) !important; color:var(--tv-accent) !important; background:var(--tv-accent-soft) !important; }

#tasksComposeModal .tasks-compose-items-head{ display:flex !important; align-items:flex-end; justify-content:space-between; gap:12px; margin:0 !important; padding:0 !important; border:0 !important; background:none !important; }
#tasksComposeModal .tasks-compose-items-head-text{ display:flex; flex-direction:column; gap:2px; }
#tasksComposeModal .tasks-compose-items-hint,
#tasksComposeModal .tasks-compose-audience-hint,
#tasksComposeModal .tasks-compose-tags-hint{ font-size:12px !important; color:var(--tv-muted) !important; line-height:1.8; }
#tasksComposeModal #tasksComposeAddItem{
  display:inline-flex !important; align-items:center; gap:6px; flex:0 0 auto;
  height:34px; padding:0 12px !important; border-radius:10px !important;
  border:1px solid var(--tv-border) !important; background:var(--tv-surface) !important;
  color:var(--tv-accent) !important; font-size:12.5px !important; font-weight:700 !important; box-shadow:none !important;
}

/* progressive disclosure */
#tasksComposeModal .tv-more{
  border:1px solid var(--tv-border);
  border-radius:12px;
  background:var(--tv-surface-2);
}
#tasksComposeModal .tv-more > summary{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  list-style:none;
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  color:var(--tv-text);
  border-radius:12px;
}
#tasksComposeModal .tv-more > summary::-webkit-details-marker{ display:none; }
#tasksComposeModal .tv-more > summary .tv-ic{ color:var(--tv-muted); transition:transform .18s ease; }
#tasksComposeModal .tv-more[open] > summary .tv-ic{ transform:rotate(180deg); }
#tasksComposeModal .tv-more > summary small{ margin-inline-start:auto; font-size:12px; font-weight:500; color:var(--tv-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
#tasksComposeModal .tv-more > summary:hover{ background:var(--tv-hover); }
#tasksComposeModal .tv-more-body{ display:flex; flex-direction:column; gap:16px; padding:4px 14px 16px; }
#tasksComposeModal .tasks-compose-audience-block,
#tasksComposeModal .tasks-compose-tags-block,
#tasksComposeModal .tasks-compose-creds-block{
  display:flex !important; flex-direction:column; gap:8px;
  margin:0 !important; padding:0 !important;
  border:0 !important; background:none !important; box-shadow:none !important;
}
#tasksComposeModal .tasks-compose-audience-head,
#tasksComposeModal .tasks-compose-tags-head{ display:flex; flex-direction:column; gap:2px; }
#tasksComposeModal .tasks-compose-audience-list{
  max-height:180px; overflow:auto;
  border:1px solid var(--tv-border) !important; border-radius:11px !important;
  background:var(--tv-surface) !important;
}
#tasksComposeModal .tasks-compose-audience-options{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
@media (max-width:640px){ #tasksComposeModal .tasks-compose-audience-options{ grid-template-columns:1fr; } }
#tasksComposeModal .tasks-compose-tags-create{ display:flex; gap:8px; align-items:center; }
#tasksComposeModal .tasks-compose-new-tag-color{ width:42px; height:42px; padding:3px; border-radius:10px; border:1px solid var(--tv-border); background:var(--tv-surface); flex:0 0 auto; }
#tasksComposeModal #tasksComposeCreateTagBtn{ height:42px; padding:0 14px !important; border-radius:11px !important; white-space:nowrap; flex:0 0 auto; }
#tasksComposeModal .tasks-compose-creds-fields:not(.hidden){ display:grid !important; grid-template-columns:1fr 1fr; gap:10px; }
#tasksComposeModal .tasks-compose-creds-fields > :last-child{ grid-column:1 / -1; }

#tasksComposeModal .tasks-compose-footer{
  flex:0 0 auto;
  display:flex !important;
  justify-content:flex-start;
  gap:8px;
  padding:12px 20px !important;
  border-top:1px solid var(--tv-border) !important;
  background:var(--tv-surface) !important;
}
#tasksComposeModal #tasksComposeSubmit{
  height:42px; padding:0 22px !important;
  border-radius:12px !important; border:0 !important;
  background:var(--dk-accent-fill) !important; color:#fff !important;
  font-size:14px !important; font-weight:700 !important;
  box-shadow:none !important; transform:none !important;
}
#tasksComposeModal #tasksComposeSubmit:hover{ filter:brightness(1.08); }
#tasksComposeModal #tasksComposeSubmit:disabled{ opacity:.6; cursor:progress; }
#tasksComposeModal .tv-date-fa{ min-height:1em; font-size:12px; font-weight:600; color:var(--tv-accent); }
#tasksComposeModal .tv-date-fa:empty{ display:none; }
/* order number: plain value like the other rows (copy-on-click kept) */
#taskDetailModal .task-chip-order{ height:auto !important; padding:0 !important; background:none !important; color:var(--tv-text) !important; font-size:13px !important; }
#taskDetailModal .task-chip-order:hover{ background:none !important; color:var(--tv-accent) !important; text-decoration:underline; text-underline-offset:3px; }

/* ═══ measured-contrast fixes (rendered colour vs rendered background) ═══ */
/* light: state text one step darker so it clears 4.5:1 on its own tint */
#tasksPage, #taskDetailModal, #tasksComposeModal{
  --tv-danger:var(--dk-danger);
  --tv-warn:var(--dk-warn);
  --tv-info:var(--dk-info);
}
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal,
html[data-theme="dark"] #tasksComposeModal{
  --tv-danger:var(--dk-danger);
  --tv-warn:var(--dk-warn);
  --tv-info:var(--dk-info);
}
/* avatars: letter is a darker (light) / lighter (dark) shade of the person's hue */
#tasksPage .tv-avatar{ color:color-mix(in srgb, var(--av) 62%, #000); }
html[data-theme="dark"] #tasksPage .tv-avatar{ color:color-mix(in srgb, var(--av) 55%, #fff); background:color-mix(in srgb, var(--av) 24%, transparent); }
#taskDetailModal .task-comment-author-avatar{ color:color-mix(in srgb, var(--chip-c1, #4f46e5) 62%, #000) !important; }
html[data-theme="dark"] #taskDetailModal .task-comment-author-avatar{ color:color-mix(in srgb, var(--chip-c1, #818cf8) 55%, #fff) !important; }
/* user-defined tag colours: keep the colour in the tint/border/dot, text stays ink */
#taskDetailModal .tasks-label-chip,
#tasksComposeModal .tasks-compose-tag-chip,
#tasksPage .tasks-label-chip{ color:var(--tv-text) !important; }
#tasksPage .tasks-pool-tag-count{ font-size:12px !important; color:var(--tv-muted) !important; }
#taskDetailModal .task-btn-attach kbd,
#tasksComposeModal .task-btn-attach kbd{ font-size:11.5px; color:var(--tv-muted) !important; }
#tasksComposeModal .tasks-compose-audience-empty{ color:var(--tv-muted) !important; }
/* dark: primary buttons keep the deeper indigo so white text clears 4.5:1 */
html[data-theme="dark"] #tasksPage .tv-btn-primary,
html[data-theme="dark"] #tasksComposeModal #tasksComposeSubmit,
html[data-theme="dark"] #taskDetailModal .tkd2-cta-primary{ background:var(--dk-accent-fill) !important; }

/* ═══════════════════════════════════════════════════════════════════════
   v4 — action feed · list · board, detail docked beside the work
   Direction contract: .impeccable/surfaces/index-html.md (seed 612165a4).
   Status colour is the page's language: slate open, blue in progress,
   violet review, green done, red overdue/urgent — always dot + label,
   never colour alone.
   ═══════════════════════════════════════════════════════════════════════ */
#tasksPage, #taskDetailModal{
  --st-open:#64748b;   --st-open-soft:rgba(100,116,139,.12);
  --st-prog:#2563eb;   --st-prog-soft:rgba(37,99,235,.10);
  --st-review:#7c3aed; --st-review-soft:rgba(124,58,237,.10);
  --st-done:#059669;   --st-done-soft:rgba(5,150,105,.11);
  --st-late:#dc2626;   --st-late-soft:rgba(220,38,38,.09);
  --tv-radius:14px;
  --tv-dock-w:clamp(420px, 36vw, 560px);
}
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal{
  --st-open:#94a3b8;   --st-open-soft:rgba(148,163,184,.14);
  --st-prog:#60a5fa;   --st-prog-soft:rgba(96,165,250,.14);
  --st-review:#a78bfa; --st-review-soft:rgba(167,139,250,.15);
  --st-done:#34d399;   --st-done-soft:rgba(52,211,153,.13);
  --st-late:#f87171;   --st-late-soft:rgba(248,113,113,.14);
}

/* ── view switcher: a real segmented control, the page's primary nav ── */
#tasksPage .tv-views{
  display:inline-flex;
  gap:2px;
  padding:3px;
  margin:0 0 14px;
  border-radius:12px;
  background:var(--tv-chip);
  border:1px solid var(--tv-border);
}
#tasksPage .tv-view{
  display:inline-flex;
  align-items:center;
  gap:7px;
  height:36px;
  padding:0 16px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--tv-muted);
  font:inherit;
  font-size:13.5px;
  font-weight:700;
  cursor:pointer;
  transition:background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
#tasksPage .tv-view:hover{ color:var(--tv-text); }
#tasksPage .tv-view.is-active{
  background:var(--tv-surface);
  color:var(--tv-text);
  box-shadow:0 1px 2px rgba(15,23,42,.08), 0 2px 8px -4px rgba(15,23,42,.18);
}
html[data-theme="dark"] #tasksPage .tv-view.is-active{ background:#1e293b; box-shadow:0 1px 2px rgba(0,0,0,.4); }
#tasksPage .tv-view.is-active .tv-ic{ color:var(--tv-accent); }
#tasksPage .tv-view-count{
  min-width:20px; height:20px; padding:0 6px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--st-late);
  color:#fff;
  font-size:11.5px;
  font-weight:800;
}
#tasksPage .tv-view-count[hidden]{ display:none; }

/* hero sits on one line with the switcher on wide screens */
@media (min-width:1100px){
  #tasksPage .tasks-shell{ display:grid; grid-template-columns:1fr auto; align-items:end; column-gap:16px; }
  #tasksPage .tasks-shell > *{ grid-column:1 / -1; }
  #tasksPage .tasks-shell > .tv-hero{ grid-column:1; margin-bottom:14px !important; }
  #tasksPage .tasks-shell > .tv-views{ grid-column:2; grid-row:1; align-self:end; margin-bottom:14px; }
}

/* the scope row (old tabs) is a list/board filter, not needed in the feed */
#tasksPage[data-tv-view="feed"] .tasks-tabs{ display:none !important; }
#tasksPage #tasksTabDashboardBtn{ display:none !important; }
#tasksPage[data-tv-view="board"] #tasksTabLookupBtn{ display:none !important; }

/* ── action feed ── */
#tasksPage .tv-feed{ display:flex; flex-direction:column; gap:22px; }
#tasksPage .tv-feed-section{ display:grid; grid-template-columns:minmax(0,1fr); gap:22px; }
@media (min-width:1280px){
  #tasksPage .tv-feed-section:not(.hidden){ grid-template-columns:minmax(0,1fr) 340px; align-items:start; }
  #tasksPage .tv-feed-section > .tasks-dashboard-ai{ position:sticky; top:calc(var(--gtop-h, 64px) + 16px); }
}
body.tv-docked #tasksPage .tv-feed-section:not(.hidden){ grid-template-columns:minmax(0,1fr) !important; }
body.tv-docked #tasksPage .tv-feed-section > .tasks-dashboard-ai{ display:none; }

#tasksPage .tv-feed-group{ display:flex; flex-direction:column; gap:8px; }
#tasksPage .tv-feed-head{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; padding:0 2px; }
#tasksPage .tv-feed-head h2{
  display:inline-flex; align-items:center; gap:8px;
  margin:0;
  font-size:16px; font-weight:800; line-height:1.6;
  color:var(--tv-text);
}
#tasksPage .tv-feed-count{
  min-width:22px; height:22px; padding:0 7px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tv-chip); color:var(--tv-muted);
  font-size:12px; font-weight:800;
}
#tasksPage [data-group="need"] .tv-feed-count{ background:var(--st-late); color:#fff; }
#tasksPage .tv-feed-head p{ margin:0; font-size:12.5px; color:var(--tv-subtle, var(--tv-muted)); }
#tasksPage .tv-feed-more{
  margin-inline-start:auto;
  display:inline-flex; align-items:center; gap:5px;
  border:0; background:none; padding:4px 6px; border-radius:8px;
  color:var(--tv-accent); font:inherit; font-size:13px; font-weight:700; cursor:pointer;
}
#tasksPage .tv-feed-more:hover{ background:var(--tv-accent-soft); }
#tasksPage .tv-feed-rows{
  display:flex; flex-direction:column;
  border:1px solid var(--tv-border);
  border-radius:var(--tv-radius);
  background:var(--tv-surface);
  box-shadow:var(--tv-shadow);
  overflow:hidden;
}
#tasksPage .tv-feed-rest{
  align-self:flex-start;
  border:0; background:none; padding:4px 8px; border-radius:8px;
  color:var(--tv-muted); font:inherit; font-size:12.5px; font-weight:700; cursor:pointer;
}
#tasksPage .tv-feed-rest:hover{ color:var(--tv-accent); background:var(--tv-accent-soft); }

#tasksPage .tv-ev{
  --tone:var(--st-open); --tone-soft:var(--st-open-soft);
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  cursor:pointer;
  transition:background-color .12s ease;
}
#tasksPage .tv-ev + .tv-ev{ border-top:1px solid var(--tv-border); }
#tasksPage .tv-ev:hover{ background:var(--tv-hover); }
#tasksPage .tv-ev.is-selected{ background:var(--tv-accent-soft); }
#tasksPage .tv-ev:focus-visible{ outline:2px solid var(--tv-accent); outline-offset:-2px; }
#tasksPage .tv-ev[data-tone="violet"]{ --tone:var(--st-review); --tone-soft:var(--st-review-soft); }
#tasksPage .tv-ev[data-tone="danger"]{ --tone:var(--st-late); --tone-soft:var(--st-late-soft); }
#tasksPage .tv-ev[data-tone="info"]{ --tone:var(--st-prog); --tone-soft:var(--st-prog-soft); }
#tasksPage .tv-ev[data-tone="accent"]{ --tone:var(--tv-accent); --tone-soft:var(--tv-accent-soft); }
#tasksPage .tv-ev-ico{
  width:38px; height:38px;
  border-radius:11px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tone-soft); color:var(--tone);
  align-self:start;
}
#tasksPage .tv-ev-ico .tv-ic{ width:18px; height:18px; }
#tasksPage .tv-ev-main{ min-width:0; display:flex; flex-direction:column; gap:3px; }
#tasksPage .tv-ev-line{ display:flex; align-items:baseline; gap:10px; font-size:12.5px; font-weight:700; color:var(--tone); }
#tasksPage .tv-ev-line time{ font-weight:600; color:var(--tv-subtle, var(--tv-muted)); margin-inline-start:auto; white-space:nowrap; }
#tasksPage .tv-ev-title{
  display:flex; align-items:baseline; gap:8px;
  font-size:14.5px; font-weight:700; line-height:1.7; color:var(--tv-text);
  min-width:0;
}
#tasksPage .tv-ev-title > :last-child{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#tasksPage .tv-ev-id{
  flex:0 0 auto;
  font-size:12px; font-weight:700;
  color:var(--tv-muted);
  font-variant-numeric:tabular-nums;
  direction:ltr;
}
#tasksPage .tv-ev-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; margin-top:2px; }
#tasksPage .tv-ev-due, #tasksPage .tv-ev-who{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:var(--tv-muted); }
#tasksPage .tv-ev-due .tv-ic{ width:14px; height:14px; }
#tasksPage .tv-ev-due.is-overdue{ color:var(--st-late); font-weight:700; }
#tasksPage .tv-avatar-xs{ width:20px !important; height:20px !important; font-size:10.5px !important; }
#tasksPage .tv-avatar-sm{ width:24px !important; height:24px !important; font-size:11.5px !important; }
#tasksPage .tv-ev-actions{ display:flex; gap:6px; align-self:center; }

/* in-place action buttons */
#tasksPage .tv-act{
  display:inline-flex; align-items:center; gap:6px;
  height:34px; padding:0 12px;
  border-radius:10px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-text);
  font:inherit; font-size:13px; font-weight:700;
  white-space:nowrap; cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease;
}
#tasksPage .tv-act .tv-ic{ width:15px; height:15px; }
#tasksPage .tv-act:hover{ background:var(--tv-hover); border-color:color-mix(in srgb, var(--tv-text) 18%, var(--tv-border)); }
#tasksPage .tv-act.is-primary{ background:var(--dk-accent-fill); border-color:transparent; color:#fff; }
#tasksPage .tv-act.is-primary:hover{ filter:brightness(1.08); background:var(--dk-accent-fill); }
#tasksPage .tv-act:disabled{ opacity:.55; cursor:progress; }

#tasksPage .tv-feed-clear{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:22px;
  border-radius:var(--tv-radius);
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
}
#tasksPage .tv-feed-clear > div{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:200px; }
#tasksPage .tv-feed-clear strong{ font-size:15px; font-weight:800; color:var(--tv-text); }
#tasksPage .tv-feed-clear span{ font-size:13px; color:var(--tv-muted); }
#tasksPage .tv-feed-clear-ico{
  width:44px; height:44px; border-radius:50%;
  display:inline-flex !important; align-items:center; justify-content:center;
  background:var(--st-done-soft); color:var(--st-done) !important;
}

/* ── board ── */
#tasksPage .tv-board{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(270px, 1fr);
  gap:14px;
  overflow-x:auto;
  padding-bottom:6px;
  align-items:start;
}
#tasksPage .tv-col{
  --tone:var(--st-open); --tone-soft:var(--st-open-soft);
  display:flex; flex-direction:column;
  min-height:220px;
  max-height:calc(100vh - var(--gtop-h, 64px) - 250px);
  border-radius:var(--tv-radius);
  background:var(--tv-surface-2);
  border:1px solid var(--tv-border);
}
html[data-theme="dark"] #tasksPage .tv-col{ background:rgba(15,23,42,.55); }
#tasksPage .tv-col[data-tone="info"]{ --tone:var(--st-prog); --tone-soft:var(--st-prog-soft); }
#tasksPage .tv-col[data-tone="violet"]{ --tone:var(--st-review); --tone-soft:var(--st-review-soft); }
#tasksPage .tv-col[data-tone="ok"]{ --tone:var(--st-done); --tone-soft:var(--st-done-soft); }
#tasksPage .tv-col[data-tone="danger"]{ --tone:var(--st-late); --tone-soft:var(--st-late-soft); }
#tasksPage .tv-col-head{
  display:flex; align-items:center; gap:8px;
  padding:12px 14px 10px;
  position:sticky; top:0;
}
#tasksPage .tv-col-head i{ width:10px; height:10px; border-radius:50%; background:var(--tone); box-shadow:0 0 0 3px var(--tone-soft); }
#tasksPage .tv-col-head h3{ margin:0; font-size:14px; font-weight:800; color:var(--tv-text); }
#tasksPage .tv-col-head span{
  margin-inline-start:auto;
  min-width:24px; height:22px; padding:0 8px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tone-soft); color:var(--tone);
  font-size:12px; font-weight:800;
}
#tasksPage .tv-col-body{ display:flex; flex-direction:column; gap:8px; padding:4px 10px 12px; overflow-y:auto; }
#tasksPage .tv-col-empty{ padding:16px; text-align:center; font-size:12.5px; color:var(--tv-subtle, var(--tv-muted)); border:1px dashed var(--tv-border); border-radius:11px; }
#tasksPage .tv-card{
  display:flex; flex-direction:column; gap:8px;
  padding:12px 13px;
  border-radius:12px;
  background:var(--tv-surface);
  border:1px solid var(--tv-border);
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
html[data-theme="dark"] #tasksPage .tv-card{ background:#172033; }
#tasksPage .tv-card:hover{ border-color:color-mix(in srgb, var(--tone) 45%, var(--tv-border)); box-shadow:0 6px 18px -10px rgba(15,23,42,.35); transform:translateY(-1px); }
#tasksPage .tv-card:focus-visible{ outline:2px solid var(--tv-accent); outline-offset:2px; }
#tasksPage .tv-card.is-selected{ border-color:var(--tv-accent); box-shadow:0 0 0 3px var(--tv-accent-soft); }
#tasksPage .tv-card.is-overdue{ border-color:color-mix(in srgb, var(--st-late) 40%, var(--tv-border)); }
#tasksPage .tv-card-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
#tasksPage .tv-card-title{
  font-size:14px; font-weight:700; line-height:1.75; color:var(--tv-text);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
#tasksPage .tv-card-tags{ display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; }
#tasksPage .tv-card-progress{ display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:var(--tv-muted); }
#tasksPage .tv-card-progress .tv-bar{ flex:1; width:auto; }
#tasksPage .tv-card-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:26px; }
#tasksPage .tv-card-foot-end{ display:inline-flex; align-items:center; gap:10px; }
#tasksPage .tv-free-sm{ height:22px; padding:0 8px; font-size:11.5px; }
@media (prefers-reduced-motion:reduce){ #tasksPage .tv-card:hover{ transform:none; } }

/* status palette for pills used everywhere in v4 */
#tasksPage .tv-status-pill{ --tone:var(--st-open); --tone-soft:var(--st-open-soft); }
#tasksPage .tv-status-pill[data-status="claimed"],
#tasksPage .tv-status-pill[data-status="in_progress"]{ --tone:var(--st-prog); --tone-soft:var(--st-prog-soft); }
#tasksPage .tv-status-pill[data-status="review"]{ --tone:var(--st-review); --tone-soft:var(--st-review-soft); }
#tasksPage .tv-status-pill[data-status="done"]{ --tone:var(--st-done); --tone-soft:var(--st-done-soft); }
#tasksPage .tv-status-pill[data-status="rejected"],
#tasksPage .tv-status-pill[data-status="cancelled"]{ --tone:var(--st-late); --tone-soft:var(--st-late-soft); }
#tasksPage .tv-status-pill::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; margin-inline-end:6px; }
#tasksPage .tv-tr.is-selected{ background:var(--tv-accent-soft) !important; }

/* ── detail docked beside the work (wide screens) ── */
@media (min-width:1200px){
  body.tv-docked #taskDetailModal{ pointer-events:none; background:transparent !important; }
  body.tv-docked #taskDetailModal .modal-overlay{ display:none !important; }
  body.tv-docked #taskDetailModal .task-detail-card{
    pointer-events:auto;
    position:fixed !important;
    top:calc(var(--gtop-h, 64px) + 12px) !important;
    bottom:12px !important;
    left:12px !important;
    right:auto !important;
    width:var(--tv-dock-w) !important;
    max-width:none !important;
    height:auto !important;
    max-height:none !important;
    margin:0 !important;
    transform:none !important;
    border-radius:16px !important;
    box-shadow:0 24px 60px -24px rgba(15,23,42,.45), 0 0 0 1px var(--tv-border) !important;
    animation:tv-dock-in .2s cubic-bezier(.2,.8,.2,1) both;
  }
  @keyframes tv-dock-in{ from{ opacity:0; transform:translateX(-14px); } to{ opacity:1; transform:none; } }
  body.tv-docked{ overflow:auto !important; }
  body.tv-docked #tasksPage .tasks-shell{ margin-left:calc(var(--tv-dock-w) + 12px) !important; max-width:none; }
  /* narrow sheet: one column — task, then its details, composer pinned */
  body.tv-docked #taskDetailModal .tk-detail-shell-v2{
    display:flex !important; flex-direction:column !important;
    height:100% !important; overflow-y:auto !important;
  }
  body.tv-docked #taskDetailModal .tkd2-topbar{ position:sticky; top:0; z-index:3; flex:0 0 auto; }
  body.tv-docked #taskDetailModal .tkd2-main{ flex:0 0 auto !important; height:auto !important; max-height:none !important; overflow:visible !important; }
  body.tv-docked #taskDetailModal .tkd2-sidebar{ flex:0 0 auto !important; height:auto !important; overflow:visible !important; border-inline-start:0 !important; border-top:1px solid var(--tv-border) !important; }
  body.tv-docked #taskDetailModal .tkd2-footer-wrap{ position:sticky; bottom:0; z-index:3; flex:0 0 auto; margin-top:auto; }
  @media (prefers-reduced-motion:reduce){ body.tv-docked #taskDetailModal .task-detail-card{ animation:none; } }
}

/* feed: the summary strip repeats what the groups already say */
#tasksPage[data-tv-view="feed"] .tasks-stats{ display:none !important; }
/* docked: the header stacks instead of sharing a row with the switcher */
body.tv-docked #tasksPage .tasks-shell{ display:block !important; }
body.tv-docked #tasksPage .tv-hero p{ display:none; }
/* narrow feed (docked panel, tablets): actions drop under the text */
@container (max-width:640px){
  #tasksPage .tv-ev{ grid-template-columns:auto minmax(0,1fr); }
  #tasksPage .tv-ev-actions{ grid-column:2; justify-content:flex-start; }
  #tasksPage .tv-ev-title > :last-child{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
}
/* phones: feed rows and board columns */
@media (max-width:640px){
  #tasksPage .tv-views{ display:flex; width:100%; }
  #tasksPage .tv-view{ flex:1; justify-content:center; padding:0 8px; }
  #tasksPage .tv-ev{ padding:12px; gap:10px; }
  #tasksPage .tv-ev-ico{ width:32px; height:32px; border-radius:9px; }
  #tasksPage .tv-board{ grid-auto-columns:minmax(82vw, 1fr); scroll-snap-type:x mandatory; }
  #tasksPage .tv-col{ scroll-snap-align:start; max-height:none; }
}
/* measured: status text one step deeper in light; count badges keep a deep red in dark */
#tasksPage, #taskDetailModal{
  --st-open:#475569; --st-prog:#1d4ed8; --st-review:#6d28d9; --st-done:#047857; --st-late:#b91c1c;
}
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal{
  --st-open:#94a3b8; --st-prog:#60a5fa; --st-review:#c4b5fd; --st-done:#34d399; --st-late:#f87171;
}
html[data-theme="dark"] #tasksPage .tv-view-count,
html[data-theme="dark"] #tasksPage [data-group="need"] .tv-feed-count{ background:#dc2626; }

/* ═══ finish-review fixes (disposition: fix) ═══════════════════════════ */
/* header: switcher lives in the title row's actions; nothing reflows when the panel docks */
#tasksPage .tasks-shell{ display:block !important; }
#tasksPage .tv-hero{ align-items:center !important; }
#tasksPage .tv-hero .actions{ align-items:center; }
#tasksPage .tv-hero .tv-views{ margin:0; }
body.tv-docked #tasksPage #tasksHeroRefreshBtn span{ display:none; }
body.tv-docked #tasksPage #tasksHeroRefreshBtn{ width:40px; padding:0; justify-content:center; }
body.tv-docked #tasksPage .tv-view{ padding:0 12px; }
@media (max-width:640px){
  #tasksPage .tv-hero .actions{ width:100%; }
  #tasksPage .tv-hero .tv-views{ order:3; flex:1 1 100%; }
}

/* one scope control instead of eight tabs + a stat row */
#tasksPage .tasks-stats,
#tasksPage .tasks-tabs{ display:none !important; }
#tasksPage .tv-scope{ display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; }
#tasksPage .tv-scope-label{ font-size:12.5px; font-weight:700; color:var(--tv-subtle, var(--tv-muted)); }
#tasksPage #tasksScopeSelect{
  height:40px;
  min-width:210px;
  padding:0 12px;
  border-radius:11px;
  border:1px solid var(--tv-border);
  background:var(--tv-surface);
  color:var(--tv-text);
  font:inherit; font-size:13.5px; font-weight:700;
  cursor:pointer;
}
#tasksPage #tasksScopeSelect:focus-visible{ outline:2px solid var(--tv-accent); outline-offset:2px; }
#tasksPage #tasksListToolbar.is-lookup .tasks-pool-search,
#tasksPage #tasksListToolbar.is-lookup .tasks-pool-tag-filters{ display:none !important; }

/* status is the page's colour: review moves off the indigo accent */
#tasksPage, #taskDetailModal{ --st-review:#a21caf; --st-review-soft:rgba(162,28,175,.10); }
html[data-theme="dark"] #tasksPage,
html[data-theme="dark"] #taskDetailModal{ --st-review:#f0abfc; --st-review-soft:rgba(240,171,252,.14); }
#tasksPage .tv-ev[data-tone="slate"]{ --tone:var(--st-open); --tone-soft:var(--st-open-soft); }
#tasksPage .tv-ev[data-tone="ok"]{ --tone:var(--st-done); --tone-soft:var(--st-done-soft); }
#tasksPage .tv-ev-chip{ padding:1px 9px; border-radius:999px; background:var(--tv-chip); color:var(--tv-muted); font-size:12px; font-weight:700; }
#tasksPage .tv-ev-prog{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; color:var(--tv-muted); }
#tasksPage .tv-ev-age{ margin-inline-start:auto; font-size:12.5px; font-weight:600; color:var(--tv-subtle, var(--tv-muted)); }
/* board: every column carries its state as a tinted header band and ground */
#tasksPage .tv-col{ background:color-mix(in srgb, var(--tone) 5%, var(--tv-surface-2)) !important; border-color:color-mix(in srgb, var(--tone) 18%, var(--tv-border)) !important; overflow:hidden; }
#tasksPage .tv-col-head{
  margin:0;
  padding:12px 14px !important;
  background:var(--tone-soft);
  border-bottom:1px solid color-mix(in srgb, var(--tone) 22%, transparent);
}
#tasksPage .tv-col-head h3{ color:var(--tone) !important; }
#tasksPage .tv-col-head span{ background:var(--tv-surface); }
#tasksPage .tv-col-body{ padding-top:10px !important; }

/* quiet secondary action for the long claimable list */
#tasksPage .tv-act.is-soft{ background:var(--tv-accent-soft); border-color:transparent; color:var(--tv-accent); }
#tasksPage .tv-act.is-soft:hover{ background:var(--dk-accent-fill); color:#fff; }

/* assistant: a one-line strip above the feed, opened on demand */
#tasksPage .tv-feed-section:not(.hidden){ display:flex !important; flex-direction:column; gap:18px; }
#tasksPage .tv-feed-section > .tasks-dashboard-ai{ position:static !important; order:-1; }
#tasksPage .tasks-dashboard-ai .tasks-dashboard-ai-head{ padding:10px 14px !important; border-bottom:0 !important; }
#tasksPage .tasks-dashboard-ai.is-open .tasks-dashboard-ai-head{ border-bottom:1px solid var(--tv-border) !important; }
#tasksPage .tasks-dashboard-ai:not(.is-open) .tasks-dashboard-ai-body,
#tasksPage .tasks-dashboard-ai:not(.is-open) .tasks-dashboard-ai-meta{ display:none !important; }
#tasksPage .tv-ai-toggle{
  flex:1; display:inline-flex; align-items:center; gap:8px;
  border:0; background:none; padding:0; margin:0;
  font:inherit; color:inherit; cursor:pointer; text-align:start;
}
#tasksPage .tv-ai-toggle .tasks-dashboard-ai-title{ flex:0 1 auto; font-size:14px !important; }
#tasksPage .tv-ai-chev{ color:var(--tv-muted); transition:transform .18s ease; }
#tasksPage .tasks-dashboard-ai.is-open .tv-ai-chev{ transform:rotate(180deg); }
#tasksPage .tv-ai-toggle:focus-visible{ outline:2px solid var(--tv-accent); outline-offset:3px; border-radius:6px; }

/* the handled row leaves the feed */
#tasksPage .tv-ev.is-resolved{ opacity:0; transform:translateX(-16px); transition:opacity .2s ease, transform .2s cubic-bezier(.2,.8,.2,1); pointer-events:none; }

/* docked / phone sheet: title → details tabs → content */
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-head-card{ flex:0 0 auto; padding:18px 20px 12px !important; margin:0 !important; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-sidebar{ order:0; border-top:1px solid var(--tv-border) !important; border-bottom:1px solid var(--tv-border) !important; background:var(--tv-surface-2) !important; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-main{ padding-top:6px !important; }

/* browser surfaces, themed */
#tasksPage ::selection, #taskDetailModal ::selection, #tasksComposeModal ::selection{ background:color-mix(in srgb, var(--dk-accent-fill) 26%, transparent); color:inherit; }
#tasksPage .tv-board, #tasksPage .tv-col-body,
#taskDetailModal .tk-detail-shell-v2, #taskDetailModal .task-detail-card{
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, var(--tv-muted) 45%, transparent) transparent;
}
#tasksPage .tv-col-body::-webkit-scrollbar,
#tasksPage .tv-board::-webkit-scrollbar,
#taskDetailModal .tk-detail-shell-v2::-webkit-scrollbar{ width:8px; height:8px; }
#tasksPage .tv-col-body::-webkit-scrollbar-thumb,
#tasksPage .tv-board::-webkit-scrollbar-thumb,
#taskDetailModal .tk-detail-shell-v2::-webkit-scrollbar-thumb{ background:color-mix(in srgb, var(--tv-muted) 40%, transparent); border-radius:8px; }
/* sheet order: topbar → title → details tabs → content → composer */
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-topbar{ order:0; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-head-card{ order:1; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-sidebar{ order:2; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-main{ order:3; }
#taskDetailModal .tk-detail-shell-v2.tv-sheet > .tkd2-footer-wrap{ order:4; }
/* docked: header keeps one row — icon-only secondary/primary buttons */
body.tv-docked #tasksPage .tv-hero{ flex-wrap:nowrap !important; }
body.tv-docked #tasksPage .tv-hero .actions{ flex-wrap:nowrap; }
body.tv-docked #tasksPage #tasksOpenComposeBtn span{ display:none; }
body.tv-docked #tasksPage #tasksOpenComposeBtn{ width:40px; padding:0; justify-content:center; }
body.tv-docked #tasksPage .tv-hero h1{ white-space:nowrap; }

/* loading skeletons for feed and board (never show "empty" before data) */
#tasksPage .tv-sk{ display:block; height:11px; margin:7px 0; border-radius:6px; background:linear-gradient(90deg, var(--tv-chip) 0%, color-mix(in srgb, var(--tv-chip) 40%, var(--tv-surface)) 50%, var(--tv-chip) 100%); background-size:200% 100%; animation:tv-sk 1.2s ease-in-out infinite; }
#tasksPage .tv-sk-row{ display:grid; grid-template-columns:auto 1fr; gap:14px; padding:16px; }
#tasksPage .tv-sk-row + .tv-sk-row{ border-top:1px solid var(--tv-border); }
#tasksPage .tv-sk-ico{ width:38px; height:38px; margin:0; border-radius:11px; }
#tasksPage .tv-sk-card{ padding:12px 13px; border-radius:12px; background:var(--tv-surface); border:1px solid var(--tv-border); }
@keyframes tv-sk{ from{ background-position:100% 0; } to{ background-position:-100% 0; } }
@media (prefers-reduced-motion:reduce){ #tasksPage .tv-sk{ animation:none; } }
#tasksPage .tv-load-error{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; padding:22px; border-radius:var(--tv-radius); border:1px solid var(--tv-border); background:var(--tv-surface); color:var(--tv-muted); font-size:13.5px; grid-column:1 / -1; }
/* empty columns stay compact so a narrow scope doesn't read as an empty board */
#tasksPage .tv-col:has(> .tv-col-body > .tv-col-empty:only-child){ min-height:0; align-self:start; }
#tasksPage .tv-col-empty{ padding:10px !important; font-size:12.5px; border-style:dashed; }
/* mobile FAB: legacy --tk-m-accent is a light indigo in dark → white text fails */
html body #tasksPage #tasksOpenComposeBtn{ background:var(--dk-accent-fill) !important; }

/* ── status stripe on every row (reading-start edge) ─────────────────────
   colour order: overdue › urgent › high › status. Lets the eye find what
   needs attention without reading the chips. */
#tasksPage .tv-tr .tv-td-id::before{
  content:""; position:absolute; inset-inline-start:0; top:10px; bottom:10px;
  width:3px; border-radius:3px; background:var(--dk-border-strong);
}
#tasksPage .tv-tr[data-status="in_progress"] .tv-td-id::before{ background:var(--dk-info); }
#tasksPage .tv-tr[data-status="review"] .tv-td-id::before{ background:var(--dk-violet); }
#tasksPage .tv-tr:is([data-status="done"],[data-status="verified"]) .tv-td-id::before{ background:var(--dk-ok-mark); }
#tasksPage .tv-tr:is([data-status="rejected"],[data-status="cancelled"]) .tv-td-id::before{ background:var(--dk-faint); }
#tasksPage .tv-tr.tv-p-high .tv-td-id::before{ background:var(--dk-warn-mark, var(--dk-warn)); }
#tasksPage .tv-tr.tv-p-urgent .tv-td-id::before,
#tasksPage .tv-tr.is-overdue .tv-td-id::before{ background:var(--dk-danger-mark); width:4px; }