/* Projects and their shared task board form one vertically scrolling page. */
#healthView {
  --workspace-gap: 18px;
  display: block;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 28px clamp(20px, 2.4vw, 48px) 48px;
  background: #f3f6f4;
  scrollbar-gutter: stable;
  scroll-padding-block: 24px;
}
#healthProjectsHost, #healthView > #tasksView {
  width: 100%;
  max-width: 1800px;
  margin-inline: auto;
}
#healthView .health-page-head { margin: 0 0 18px; padding: 0; gap: 14px; }
#healthView .health-page-head h1, #healthView .taskboard-header h2 {
  display: block;
  margin: 0;
  color: var(--deep);
  font: 600 30px/1.25 var(--font-sans);
  letter-spacing: -.025em;
}
#healthView .health-board {
  position: relative;
  flex: none;
  min-height: 0;
  gap: var(--workspace-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  overflow: visible;
  padding: 0;
  margin: 0;
}
#healthView .direction-lane { height: auto; max-height: none; border: 1px solid #e0e8e2; border-radius: 14px; }
#healthView .project-list { overflow: visible; scrollbar-gutter: auto; }
#healthView .direction-head { min-height: 52px; }
#healthView .direction-head h2 { font-size: 17px; }
#healthView .project-card-title { font-size: 18px; line-height: 1.4; }
#healthView .project-card { min-height: 50px; }
#healthView > #tasksView {
  overflow: visible;
  margin-top: 32px;
  padding: 26px 0 0;
  border-top: 1px solid #dce5df;
  scroll-margin-top: 24px;
}
#healthView .taskboard-page { height: auto; max-width: none; padding: 0; background: transparent; }
#healthView .taskboard-header { padding: 0 0 18px; gap: 16px; }
#healthView .taskboard-header p { margin-top: 6px; max-width: none; font-size: 14px; color: #718079; }
#healthView .taskboard-columns { flex: none; overflow: visible; gap: var(--workspace-gap); padding: 0; }
#healthView .taskboard-column { height: auto; min-height: 220px; padding: 10px; border-radius: 14px; }
#healthView .taskboard-column > header { min-height: 42px; padding: 0 6px 12px; }
#healthView .taskboard-column h3 { display: flex; align-items: center; gap: 9px; margin: 0; color: #34463e; font-size: 17px; font-weight: 600; }
#healthView .taskboard-column h3::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--column-accent); }
#healthView .taskboard-card-list { overflow: visible; gap: 10px; }
#healthView .taskboard-card { padding: 15px; }
#healthView .taskboard-card-title { font-size: 18px; }
#healthView .taskboard-project { font-size: 13px; }
#healthView .taskboard-add-card { font-size: 15px; }
#healthView .taskboard-card-footer { margin-top: 12px; }
@media (min-width: 901px) {
  .workspace:has(> #healthView:not(.hidden)) > .topbar { display: none; }
}
@media (max-width: 900px) {
  #healthView { padding: 16px 14px 30px; scrollbar-gutter: auto; --workspace-gap: 12px; }
  #healthView .health-page-head { min-height: 44px; margin-bottom: 12px; }
  #healthView .health-page-head h1, #healthView .taskboard-header h2 { font-size: 25px; }
  #healthView .mobile-health-kicker { display: none; }
  #healthView .mobile-health-tabs { margin: 0 0 12px; }
  #healthView .health-board, #healthView .taskboard-columns {
    display: flex;
    align-items: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 12px;
    padding: 2px 2px 10px;
    scroll-padding-left: 2px;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
  }
  #healthView .direction-lane, #healthView .taskboard-column { flex: 0 0 calc(100% - 22px); min-width: 0; scroll-snap-align: start; scroll-snap-stop: normal; }
  #healthView .taskboard-columns { align-items: stretch; }
  #healthView > #tasksView { margin-top: 24px; padding-top: 22px; }
  #healthView .taskboard-header { align-items: flex-start; flex-wrap: nowrap; gap: 12px; padding-bottom: 14px; }
  #healthView .taskboard-header-actions { flex-shrink: 0; }
  #healthView .taskboard-header-actions > button { min-height: 42px; padding-inline: 12px; font-size: 13px; }
  #healthView .taskboard-header p { max-width: 150px; font-size: 13px; line-height: 1.4; }
  #healthView .taskboard-card-title, #healthView .project-card-title { font-size: 17px; }
}
@media (pointer: coarse) {
  #healthView .taskboard-card { padding-left: 36px; }
}
