.projects-dashboard-root {
  --projects-red: var(--red);
  --projects-blue: var(--blue);
  --projects-ink: var(--ink);
  --projects-muted: var(--muted);
  --projects-line: var(--line);
  color: var(--projects-ink);
}

.projects-dashboard-root .projects-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}

.projects-dashboard-root .projects-intro h1 {
  margin: 6px 0 7px;
  font-size: 34px;
  line-height: 1.1;
}

.projects-dashboard-root .projects-intro p {
  max-width: 760px;
  margin: 0;
  color: var(--projects-muted);
}

.projects-dashboard-root .projects-context {
  padding: 9px 13px;
  border: 1px solid var(--projects-line);
  border-radius: 6px;
  background: #fff;
  color: var(--projects-muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.projects-dashboard-root .projects-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 22px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--projects-line);
}

.projects-dashboard-root .projects-tab {
  min-height: 42px;
  padding: 9px 13px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--projects-muted);
  font-weight: 700;
}

.projects-dashboard-root .projects-tab:hover,
.projects-dashboard-root .projects-tab:focus-visible {
  border-color: var(--projects-blue);
  background: #fff;
  color: var(--projects-blue);
}

.projects-dashboard-root .projects-tab[aria-selected="true"] {
  border-color: var(--projects-red);
  background: var(--projects-red);
  color: #fff;
}

.projects-dashboard-root .projects-view[hidden] { display: none; }
.projects-dashboard-root .projects-stack { display: grid; gap: 18px; }
.projects-dashboard-root .projects-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.projects-dashboard-root .projects-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.projects-dashboard-root .projects-span { grid-column: 1 / -1; }
.projects-dashboard-root .projects-panel { min-width: 0; }
.projects-dashboard-root .projects-panel h2 { margin: 0 0 14px; }
.projects-dashboard-root .projects-panel h3 { margin: 0 0 10px; font-size: 15px; }
.projects-dashboard-root .projects-panel p { line-height: 1.5; }
.projects-dashboard-root .projects-subtle { color: var(--projects-muted); font-size: 13px; }
.projects-dashboard-root .projects-multiline { white-space: pre-wrap; }
.projects-dashboard-root .projects-note { margin: 5px 0 0; color: var(--projects-muted); font-size: 12px; }

.projects-dashboard-root .projects-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.projects-dashboard-root .projects-kpi {
  padding: 16px;
  border: 1px solid var(--projects-line);
  border-top: 3px solid var(--projects-red);
  border-radius: 7px;
  background: #fff;
  box-shadow: var(--shadow);
}

.projects-dashboard-root .projects-kpi:nth-child(even) { border-top-color: var(--projects-blue); }
.projects-dashboard-root .projects-kpi span { display: block; color: var(--projects-muted); font-size: 12px; font-weight: 700; }
.projects-dashboard-root .projects-kpi strong { display: block; margin-top: 8px; font-size: 27px; line-height: 1.1; }

.projects-dashboard-root .projects-form { display: grid; gap: 12px; }
.projects-dashboard-root .projects-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.projects-dashboard-root .projects-fields.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.projects-dashboard-root .projects-fields.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.projects-dashboard-root .projects-fields.four[data-projects-weekly-item] { grid-template-columns: 145px minmax(180px, 2fr) minmax(150px, 1fr) 145px minmax(140px, 1fr); }
.projects-dashboard-root [data-projects-weekly-item] > .projects-actions { grid-column: 1 / -1; justify-content: flex-end; }
.projects-dashboard-root .projects-form label,
.projects-dashboard-root .projects-filter label {
  display: grid;
  align-content: start;
  gap: 6px;
  color: #555b60;
  font-size: 12px;
  font-weight: 700;
}

.projects-dashboard-root input,
.projects-dashboard-root select,
.projects-dashboard-root textarea {
  width: 100%;
  min-height: 39px;
  padding: 9px 10px;
  border: 1px solid #ccd1d6;
  border-radius: 5px;
  background: #fff;
  color: var(--projects-ink);
}

.projects-dashboard-root textarea { min-height: 80px; resize: vertical; }
.projects-dashboard-root .projects-check { display: flex; align-items: center; gap: 8px; }
.projects-dashboard-root .projects-check input { width: auto; min-height: auto; }
.projects-dashboard-root .projects-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.projects-dashboard-root .projects-actions button { min-height: 39px; }
.projects-dashboard-root .projects-filter { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-bottom: 16px; }
.projects-dashboard-root .projects-filter label { min-width: 170px; }
.projects-dashboard-root .projects-empty { padding: 18px; border: 1px dashed var(--projects-line); border-radius: 6px; color: var(--projects-muted); background: #fafbfc; }
.projects-dashboard-root .projects-table-wrap { width: 100%; overflow-x: auto; }
.projects-dashboard-root .projects-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.projects-dashboard-root .projects-table th { padding: 10px; border-bottom: 2px solid var(--projects-line); color: var(--projects-muted); text-align: left; font-size: 11px; }
.projects-dashboard-root .projects-table td { padding: 10px; border-bottom: 1px solid var(--projects-line); vertical-align: top; }
.projects-dashboard-root .projects-table td:last-child { white-space: nowrap; }
.projects-dashboard-root .projects-table button { margin: 2px; }
.projects-dashboard-root .projects-offboard-contact { display: grid; gap: 8px; min-width: 230px; max-width: 320px; margin-top: 10px; }
.projects-dashboard-root .projects-offboard-contact label { display: grid; gap: 5px; color: #555b60; font-size: 12px; font-weight: 700; }
.projects-dashboard-root .projects-offboard-contact button { justify-self: start; }
.projects-dashboard-root .projects-status { display: inline-block; padding: 4px 8px; border-radius: 20px; background: #eef1f4; color: #4e5962; font-size: 11px; font-weight: 700; }
.projects-dashboard-root .projects-status.good { background: #e4f4e9; color: #17683b; }
.projects-dashboard-root .projects-status.warn { background: #fff2d9; color: #835300; }
.projects-dashboard-root .projects-status.alert { background: #fce8ec; color: #a3132d; }
.projects-dashboard-root .projects-section-title { margin: 4px 0 0; padding-left: 12px; border-left: 3px solid var(--projects-red); }
.projects-dashboard-root .projects-project-card { padding: 15px; border: 1px solid var(--projects-line); border-left: 4px solid var(--projects-red); border-radius: 6px; background: #fff; }
.projects-dashboard-root .projects-project-card strong { display: block; }
.projects-dashboard-root .projects-project-card small { display: block; margin-top: 5px; color: var(--projects-muted); }
.projects-dashboard-root .projects-project-card button { margin-top: 12px; }
.projects-dashboard-root .projects-two-sums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.projects-dashboard-root .projects-preview { display: grid; gap: 13px; padding: 14px; border: 1px solid #b9ddef; border-radius: 6px; background: #f7fbfe; }
.projects-dashboard-root .projects-payout-field { display: grid; gap: 6px; max-width: 360px; color: #555b60; font-size: 12px; font-weight: 700; }
.projects-dashboard-root .projects-preview h3 { margin: 0; }
.projects-dashboard-root .projects-preview p { margin: 0; }
.projects-dashboard-root .projects-plan-form {
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #b9ddef;
  border-radius: 6px;
  background: #f7fbfe;
}
.projects-dashboard-root .projects-entry-editor {
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #b9ddef;
  border-radius: 6px;
  background: #f7fbfe;
}
.projects-dashboard-root .projects-revisions {
  max-width: 330px;
  margin-top: 8px;
  padding: 8px;
  border-left: 3px solid var(--projects-blue);
  background: #f7fbfe;
  overflow-wrap: anywhere;
  white-space: normal;
}
.projects-dashboard-root .projects-revisions p {
  margin: 0 0 8px;
  font-size: 11px;
}
.projects-dashboard-root .projects-weekly-history {
  max-width: none;
  width: 100%;
}
.projects-dashboard-root .projects-weekly-history summary {
  cursor: pointer;
  font-weight: 600;
}
.projects-dashboard-root .projects-weekly-history p {
  font-size: 14px;
}
.projects-dashboard-root .projects-weekly-history > .projects-stack {
  margin-top: 12px;
}
.projects-dashboard-root .projects-entry-archive { margin-top: 14px; }
.projects-dashboard-root .projects-entry-archive summary { cursor: pointer; font-weight: 600; }
.projects-dashboard-root .projects-entry-archive .projects-table-wrap { margin-top: 10px; }
.projects-dashboard-root .projects-entry-history { max-width: none; width: 100%; margin-top: 14px; }
.projects-dashboard-root .projects-entry-history h3 { margin: 0 0 10px; }
.projects-dashboard-root .projects-entry-history p { font-size: 13px; }
.projects-dashboard-root .projects-entry-history-item { padding: 9px 0; border-top: 1px solid var(--projects-line); }
.projects-dashboard-root .projects-entry-history-item ul { margin: 8px 0; padding-left: 20px; }
.projects-dashboard-root .projects-entry-history-item li { margin: 4px 0; }
.projects-dashboard-root .projects-client-draft {
  border-top: 3px solid var(--projects-blue);
}
.projects-dashboard-root .projects-client-draft h3 {
  margin-top: 18px;
}
.projects-dashboard-root .projects-sum { padding: 13px; border: 1px solid var(--projects-line); border-radius: 6px; background: #fafbfc; }
.projects-dashboard-root .projects-sum small { display: block; color: var(--projects-muted); }
.projects-dashboard-root .projects-sum strong { display: block; margin-top: 6px; font-size: 19px; }
.projects-dashboard-root .projects-error { padding: 12px 14px; border: 1px solid #f2b8c3; border-radius: 6px; color: #97152c; background: #fff3f5; }

@media (max-width: 1050px) {
  .projects-dashboard-root .projects-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .projects-dashboard-root .projects-grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .projects-dashboard-root .projects-fields.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .projects-dashboard-root .projects-fields.four[data-projects-weekly-item] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .projects-dashboard-root .projects-intro { display: block; }
  .projects-dashboard-root .projects-intro h1 { font-size: 29px; }
  .projects-dashboard-root .projects-context { display: inline-block; margin-top: 12px; }
  .projects-dashboard-root .projects-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .projects-dashboard-root .projects-tab { min-width: 0; min-height: 52px; padding: 8px; line-height: 1.25; text-align: center; white-space: normal; }
  .projects-dashboard-root .projects-tab:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .projects-dashboard-root .projects-grid,
  .projects-dashboard-root .projects-grid.three,
  .projects-dashboard-root .projects-fields,
  .projects-dashboard-root .projects-fields.three,
  .projects-dashboard-root .projects-fields.four { grid-template-columns: 1fr; }
  .projects-dashboard-root .projects-fields.four[data-projects-weekly-item] { grid-template-columns: 1fr; }
  .projects-dashboard-root .projects-kpis { gap: 8px; }
  .projects-dashboard-root .projects-kpi { padding: 12px; }
  .projects-dashboard-root .projects-kpi strong { font-size: 22px; }
  .projects-dashboard-root .projects-two-sums { grid-template-columns: 1fr; }
}