:root {
  --project-ink: #102847;
  --project-text: #34445b;
  --project-muted: #6d7c91;
  --project-border: #d9e2ed;
  --project-soft: #f5f8fb;
  --project-blue: #356aa8;
  --project-blue-soft: #eaf2fb;
  --project-green: #2c8a68;
  --project-amber: #c98a24;
  --project-orange: #c86632;
  --project-red: #c34d55;
}

.portal-project-focus-band {
  margin-top: 16px;
}

.portal-project-strip {
  overflow: hidden;
  border: 1px solid var(--project-border);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(24, 48, 82, .05);
}

.portal-project-strip > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 18px 12px;
  border-bottom: 1px solid #e8edf3;
}

.portal-project-strip > header span,
.portal-project-strip > header h2 {
  display: block;
  margin: 0;
}

.portal-project-strip > header span {
  color: var(--project-muted);
  font-size: 11px;
}

.portal-project-strip > header h2 {
  margin-top: 3px;
  color: var(--project-ink);
  font-size: 17px;
}

.portal-project-all {
  padding: 7px 10px;
  border: 1px solid #cfd9e5;
  border-radius: 5px;
  background: #fff;
  color: #28598f;
  font-size: 12px;
  font-weight: 700;
}

.portal-project-all:hover {
  border-color: #8eacd0;
  background: #f5f8fc;
}

.portal-project-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid #e8edf3;
}

.portal-project-metrics > button {
  display: grid;
  gap: 4px;
  min-height: 88px;
  padding: 15px 18px;
  border: 0;
  border-right: 1px solid #e8edf3;
  background: #fff;
  text-align: left;
}

.portal-project-metrics > button:last-child {
  border-right: 0;
}

.portal-project-metrics > button:hover {
  background: #f7f9fc;
}

.portal-project-metrics small,
.portal-project-metrics span {
  color: var(--project-muted);
  font-size: 11px;
}

.portal-project-metrics b {
  color: var(--project-ink);
  font-size: 24px;
  line-height: 1;
}

.portal-project-focus {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

.portal-project-focus > button {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  min-height: 58px;
  padding: 11px 18px;
  border: 0;
  border-right: 1px solid #e8edf3;
  background: #fbfcfe;
  text-align: left;
}

.portal-project-focus > button:last-child {
  border-right: 0;
}

.portal-project-focus > button:hover {
  background: #f3f7fb;
}

.portal-project-focus i,
.dmp-project-name i,
.dmp-project-drawer-summary i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--project-blue);
}

.portal-project-focus i.green,
.dmp-project-name i.green,
.dmp-project-drawer-summary i.green { background: var(--project-green); }
.portal-project-focus i.amber,
.dmp-project-name i.amber,
.dmp-project-drawer-summary i.amber { background: var(--project-amber); }
.portal-project-focus i.orange,
.dmp-project-name i.orange,
.dmp-project-drawer-summary i.orange { background: var(--project-orange); }
.portal-project-focus i.red,
.dmp-project-name i.red,
.dmp-project-drawer-summary i.red { background: var(--project-red); }
.portal-project-focus i.blue,
.dmp-project-name i.blue,
.dmp-project-drawer-summary i.blue { background: var(--project-blue); }

.portal-project-focus b,
.portal-project-focus small {
  display: block;
}

.portal-project-focus b {
  overflow: hidden;
  color: var(--project-ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-project-focus small {
  margin-top: 3px;
  overflow: hidden;
  color: var(--project-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-project-focus em {
  color: var(--project-text);
  font-size: 10px;
  font-style: normal;
}

.portal-project-clear {
  grid-column: 1 / -1;
  padding: 14px 18px;
  color: var(--project-green);
}

.portal-project-clear b,
.portal-project-clear span {
  display: block;
}

.portal-project-clear span {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 11px;
}

.dmp-project-portfolio {
  display: grid;
  gap: 14px;
  padding: 2px 0 0;
}

.dmp-project-portfolio-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 18px;
  border: 1px solid var(--project-border);
  border-left: 3px solid var(--project-blue);
  border-radius: 6px;
  background: #fff;
}

.dmp-project-portfolio-head span {
  color: #4470a4;
  font-size: 10px;
  font-weight: 700;
}

.dmp-project-portfolio-head h2 {
  margin: 4px 0 0;
  color: var(--project-ink);
  font-size: 18px;
}

.dmp-project-portfolio-head p {
  margin: 5px 0 0;
  color: var(--project-muted);
  font-size: 11px;
  line-height: 1.6;
}

.dmp-project-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--project-border);
  border-radius: 6px;
  background: #fff;
}

.dmp-project-kpis > div {
  min-height: 90px;
  padding: 15px 17px;
  border-right: 1px solid #e7edf3;
}

.dmp-project-kpis > div:last-child {
  border-right: 0;
}

.dmp-project-kpis small,
.dmp-project-kpis b,
.dmp-project-kpis span {
  display: block;
}

.dmp-project-kpis small {
  color: var(--project-muted);
  font-size: 10px;
}

.dmp-project-kpis b {
  margin-top: 8px;
  color: var(--project-ink);
  font-size: 23px;
  line-height: 1;
}

.dmp-project-kpis span {
  margin-top: 7px;
  color: #56667b;
  font-size: 10px;
}

.dmp-project-viz-grid {
  display: grid;
  grid-template-columns: minmax(300px, .8fr) minmax(520px, 1.5fr);
  gap: 14px;
}

.dmp-project-viz,
.dmp-project-list {
  overflow: hidden;
  border: 1px solid var(--project-border);
  border-radius: 6px;
  background: #fff;
}

.dmp-project-viz > header,
.dmp-project-list > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 16px;
  border-bottom: 1px solid #e7edf3;
}

.dmp-project-viz > header small,
.dmp-project-viz > header h3,
.dmp-project-list > header h3,
.dmp-project-list > header span {
  display: block;
  margin: 0;
}

.dmp-project-viz > header small,
.dmp-project-viz > header > span,
.dmp-project-list > header span {
  color: var(--project-muted);
  font-size: 10px;
}

.dmp-project-viz > header h3,
.dmp-project-list > header h3 {
  margin-top: 3px;
  color: var(--project-ink);
  font-size: 14px;
}

.dmp-project-health-list {
  display: grid;
  gap: 11px;
  padding: 16px;
}

.dmp-project-health-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  color: var(--project-text);
  font-size: 10px;
}

.dmp-project-health-row > span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.dmp-project-health-row > span i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--project-blue);
}

.dmp-project-health-row > span i.green { background: var(--project-green); }
.dmp-project-health-row > span i.amber { background: var(--project-amber); }
.dmp-project-health-row > span i.orange { background: var(--project-orange); }
.dmp-project-health-row > span i.red { background: var(--project-red); }

.dmp-project-health-row > div {
  height: 7px;
  overflow: hidden;
  border-radius: 3px;
  background: #edf1f5;
}

.dmp-project-health-row > div b {
  display: block;
  min-width: 2px;
  height: 100%;
  border-radius: 3px;
  background: #789bc5;
}

.dmp-project-health-row strong {
  color: var(--project-ink);
  text-align: right;
}

.dmp-project-compare-list {
  display: grid;
}

.dmp-project-compare-row {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(300px, 1.2fr);
  align-items: center;
  gap: 16px;
  padding: 10px 16px;
  border: 0;
  border-bottom: 1px solid #edf1f5;
  background: #fff;
  text-align: left;
}

.dmp-project-compare-row:last-child {
  border-bottom: 0;
}

.dmp-project-compare-row:hover {
  background: #f7f9fc;
}

.dmp-project-compare-row > span b,
.dmp-project-compare-row > span small {
  display: block;
}

.dmp-project-compare-row > span b {
  overflow: hidden;
  color: var(--project-ink);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmp-project-compare-row > span small {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-compare-row > div {
  display: grid;
  gap: 6px;
}

.dmp-project-compare-row label {
  display: grid;
  grid-template-columns: 55px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 7px;
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-compare-row label i {
  height: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: #edf1f5;
}

.dmp-project-compare-row label em {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--project-blue);
}

.dmp-project-compare-row label + label em {
  background: var(--project-green);
}

.dmp-project-compare-row label strong {
  color: var(--project-text);
  text-align: right;
}

.dmp-project-list > header {
  padding: 14px 16px 11px;
}

.dmp-project-search input {
  width: 360px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid #cfd9e5;
  border-radius: 5px;
  background: #fff;
  color: var(--project-text);
  font-size: 10px;
}

.dmp-project-search input:focus {
  border-color: #7fa3cf;
  outline: 2px solid rgba(53, 106, 168, .1);
}

.dmp-project-filters {
  display: flex;
  gap: 7px;
  padding: 10px 16px;
  border-bottom: 1px solid #e7edf3;
  background: #fafbfd;
}

.dmp-project-filters button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid #d5dee9;
  border-radius: 4px;
  background: #fff;
  color: #52637a;
  font-size: 10px;
}

.dmp-project-filters button.active {
  border-color: #86a9d3;
  background: var(--project-blue-soft);
  color: #285b94;
  font-weight: 700;
}

.dmp-project-filters span {
  min-width: 15px;
  padding: 1px 4px;
  border-radius: 8px;
  background: #edf2f7;
  text-align: center;
}

.dmp-project-table {
  min-width: 1240px;
}

.dmp-project-table th {
  background: #f7f9fc;
}

.dmp-project-name,
.dmp-project-relation,
.dmp-project-owner,
.dmp-project-value,
.dmp-project-decision {
  min-width: 0;
}

.dmp-project-name span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-name b,
.dmp-project-name small,
.dmp-project-relation b,
.dmp-project-relation span,
.dmp-project-relation small,
.dmp-project-owner b,
.dmp-project-owner span,
.dmp-project-owner small,
.dmp-project-value b,
.dmp-project-value span,
.dmp-project-value small,
.dmp-project-decision b,
.dmp-project-decision span {
  display: block;
}

.dmp-project-name b,
.dmp-project-relation b,
.dmp-project-owner b,
.dmp-project-value b,
.dmp-project-decision b {
  margin-top: 4px;
  color: var(--project-ink);
  font-size: 10px;
  line-height: 1.45;
}

.dmp-project-name small,
.dmp-project-relation span,
.dmp-project-relation small,
.dmp-project-owner span,
.dmp-project-owner small,
.dmp-project-value span,
.dmp-project-value small,
.dmp-project-decision span {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 9px;
  line-height: 1.45;
}

.dmp-project-progress {
  min-width: 100px;
}

.dmp-project-progress > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.dmp-project-progress b {
  color: var(--project-ink);
  font-size: 12px;
}

.dmp-project-progress small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-progress > span {
  display: block;
  height: 5px;
  margin-top: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: #e9eef4;
}

.dmp-project-progress > span i {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--project-blue);
}

.dmp-project-progress em {
  display: block;
  margin-top: 4px;
  color: var(--project-green);
  font-size: 8px;
  font-style: normal;
}

.dmp-project-progress em.negative {
  color: var(--project-red);
}

.dmp-project-empty {
  display: grid;
  place-items: center;
  gap: 7px;
  min-height: 180px;
  padding: 30px;
  text-align: center;
}

.dmp-project-empty b {
  color: var(--project-ink);
}

.dmp-project-empty span {
  color: var(--project-muted);
  font-size: 10px;
}

.dmp-project-empty button {
  margin-top: 5px;
  padding: 7px 11px;
  border: 1px solid #cfd9e5;
  border-radius: 4px;
  background: #fff;
  color: #285b94;
}

#dmpDrawerHost .dmp-drawer {
  width: min(1180px, 90vw);
}

.dmp-project-drawer-summary {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid var(--project-border);
  border-radius: 5px;
  background: var(--project-soft);
}

.dmp-project-drawer-summary > span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--project-text);
  font-size: 10px;
}

.dmp-project-drawer-summary > b {
  padding-left: 14px;
  border-left: 1px solid #d7e0ea;
  color: var(--project-ink);
  font-size: 11px;
}

.dmp-project-drawer-summary > small {
  overflow: hidden;
  color: var(--project-muted);
  font-size: 10px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmp-project-drawer-tabs {
  display: flex;
  gap: 2px;
  margin-top: 12px;
  padding: 0;
  border-bottom: 1px solid var(--project-border);
}

.dmp-project-drawer-tabs button {
  padding: 9px 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--project-muted);
  font-size: 11px;
  font-weight: 700;
}

.dmp-project-drawer-tabs button.active {
  border-bottom-color: var(--project-blue);
  color: #285b94;
}

.dmp-project-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(260px, .7fr);
  gap: 14px;
  margin-top: 14px;
}

.dmp-project-detail-main,
.dmp-project-detail-stack {
  display: grid;
  gap: 14px;
}

.dmp-project-detail-block,
.dmp-project-detail-side {
  padding: 14px;
  border: 1px solid var(--project-border);
  border-radius: 5px;
  background: #fff;
}

.dmp-project-detail-block h3,
.dmp-project-detail-side h3 {
  margin: 0 0 11px;
  color: var(--project-ink);
  font-size: 12px;
}

.dmp-project-detail-main .dmp-callout b {
  color: var(--project-ink);
}

.dmp-project-detail-main .dmp-callout p {
  margin: 4px 0 0;
}

.dmp-project-workflow-strip {
  display: grid;
  grid-template-columns: minmax(0, .9fr) auto minmax(0, .9fr) auto minmax(0, 1.4fr);
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #cddbea;
  border-left: 3px solid var(--project-blue);
  border-radius: 5px;
  background: #f4f8fc;
}

.dmp-project-workflow-strip small,
.dmp-project-workflow-strip b {
  display: block;
}

.dmp-project-workflow-strip small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-workflow-strip b {
  margin-top: 4px;
  color: var(--project-ink);
  font-size: 10px;
  line-height: 1.45;
}

.dmp-project-workflow-strip > i {
  color: #8d9aad;
  font-style: normal;
}

.dmp-project-baselines {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dmp-project-baselines > span {
  padding: 9px 10px;
  border: 1px solid #e0e7ef;
  border-radius: 4px;
  background: #fafbfd;
}

.dmp-project-baselines > span.active {
  border-color: #9eb8d7;
  background: #f2f7fc;
}

.dmp-project-baselines b,
.dmp-project-baselines small {
  display: block;
}

.dmp-project-baselines b { color: var(--project-ink); font-size: 10px; }
.dmp-project-baselines small { margin-top: 4px; color: var(--project-muted); font-size: 8px; line-height: 1.4; }

.dmp-project-decision-list {
  display: grid;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.dmp-project-decision-list li {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 9px;
  padding: 8px 0;
  border-top: 1px solid #edf1f5;
}

.dmp-project-decision-list li > i {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--project-blue);
}

.dmp-project-decision-list b,
.dmp-project-decision-list span { display: block; }
.dmp-project-decision-list b { color: var(--project-ink); font-size: 9px; }
.dmp-project-decision-list span,
.dmp-project-decision-list time { margin-top: 3px; color: var(--project-muted); font-size: 8px; line-height: 1.4; }

.dmp-project-linkage {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr) auto);
  align-items: center;
  gap: 8px;
}

.dmp-project-linkage span {
  min-height: 66px;
  padding: 10px;
  border: 1px solid #dde5ee;
  border-radius: 4px;
  background: #f8fafc;
}

.dmp-project-linkage small,
.dmp-project-linkage b {
  display: block;
}

.dmp-project-linkage small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-linkage b {
  margin-top: 5px;
  color: var(--project-ink);
  font-size: 10px;
  line-height: 1.45;
}

.dmp-project-linkage i {
  color: #8d9aad;
  font-style: normal;
}

.dmp-project-definition {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border: 1px solid #e1e7ef;
}

.dmp-project-definition > div {
  padding: 10px 11px;
  border-right: 1px solid #e1e7ef;
  border-bottom: 1px solid #e1e7ef;
}

.dmp-project-definition > div:nth-child(2n) {
  border-right: 0;
}

.dmp-project-definition > div:nth-last-child(-n+2) {
  border-bottom: 0;
}

.dmp-project-definition dt {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-definition dd {
  margin: 5px 0 0;
  color: var(--project-text);
  font-size: 10px;
  line-height: 1.55;
}

.dmp-project-detail-side {
  align-content: start;
  display: grid;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.dmp-project-detail-side > div {
  padding: 12px 13px;
  border-bottom: 1px solid #e7edf3;
}

.dmp-project-detail-side > div:last-child {
  border-bottom: 0;
}

.dmp-project-detail-side small,
.dmp-project-detail-side b,
.dmp-project-detail-side span {
  display: block;
}

.dmp-project-detail-side small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-detail-side b {
  margin-top: 4px;
  color: var(--project-ink);
  font-size: 10px;
  line-height: 1.5;
}

.dmp-project-detail-side span {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 9px;
  line-height: 1.45;
}

.dmp-project-detail-side .decision {
  border-left: 3px solid var(--project-amber);
  background: #fffaf0;
}

.dmp-project-detail-side.evidence {
  padding: 14px;
}

.dmp-project-detail-side.evidence ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dmp-project-detail-side.evidence li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  padding: 9px;
  border: 1px solid #e1e7ef;
  border-radius: 4px;
}

.dmp-project-detail-side.evidence li i {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #edf1f5;
  color: var(--project-muted);
  font-style: normal;
}

.dmp-project-detail-side.evidence li.complete i {
  background: #e6f4ee;
  color: var(--project-green);
}

.dmp-project-detail-side.evidence li b,
.dmp-project-detail-side.evidence li small {
  display: block;
}

.dmp-project-detail-side.evidence li b {
  color: var(--project-ink);
  font-size: 9px;
}

.dmp-project-detail-side.evidence li small {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.dmp-project-block-head span {
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-scurve {
  display: grid;
  gap: 11px;
}

.dmp-project-metric-bar > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.dmp-project-metric-bar span,
.dmp-project-metric-bar b,
.dmp-project-metric-bar small {
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-metric-bar b {
  color: var(--project-text);
}

.dmp-project-metric-bar > i {
  display: block;
  height: 7px;
  margin: 6px 0 4px;
  overflow: hidden;
  border-radius: 3px;
  background: #e9eef4;
}

.dmp-project-metric-bar > i em {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--project-blue);
}

.dmp-project-metric-bar > i em.actual { background: var(--project-green); }
.dmp-project-metric-bar > i em.forecast { background: #7d8ea5; }
.dmp-project-metric-bar > i em.risk { background: var(--project-red); }

.dmp-project-milestones {
  display: grid;
  gap: 8px;
}

.dmp-project-milestone {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid #e1e7ef;
  border-left: 3px solid #a8b5c5;
  border-radius: 4px;
}

.dmp-project-milestone.done { border-left-color: var(--project-green); }
.dmp-project-milestone.risk { border-left-color: var(--project-red); }

.dmp-project-milestone > i {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #edf1f5;
  color: var(--project-text);
  font-size: 9px;
  font-style: normal;
}

.dmp-project-milestone b,
.dmp-project-milestone span {
  display: block;
}

.dmp-project-milestone b {
  color: var(--project-ink);
  font-size: 10px;
}

.dmp-project-milestone span {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-milestone em {
  color: var(--project-muted);
  font-size: 9px;
  font-style: normal;
}

.dmp-project-milestone > button,
.dmp-inline-action {
  padding: 5px 8px;
  border: 1px solid #b8cbe0;
  border-radius: 4px;
  background: #fff;
  color: #315f91;
  font-size: 8px;
  font-weight: 700;
}

.dmp-inline-action {
  margin-left: 8px;
}

.dmp-project-finance-grid,
.dmp-project-benefit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--project-border);
  border-radius: 5px;
  background: #fff;
}

.dmp-project-benefit-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dmp-project-finance-grid > div,
.dmp-project-benefit-grid > div {
  padding: 13px;
  border-right: 1px solid #e7edf3;
}

.dmp-project-finance-grid > div:last-child,
.dmp-project-benefit-grid > div:last-child {
  border-right: 0;
}

.dmp-project-finance-grid small,
.dmp-project-finance-grid b,
.dmp-project-finance-grid span,
.dmp-project-benefit-grid small,
.dmp-project-benefit-grid b,
.dmp-project-benefit-grid span {
  display: block;
}

.dmp-project-finance-grid small,
.dmp-project-benefit-grid small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-finance-grid b,
.dmp-project-benefit-grid b {
  margin-top: 6px;
  color: var(--project-ink);
  font-size: 13px;
}

.dmp-project-finance-grid span,
.dmp-project-benefit-grid span {
  margin-top: 5px;
  color: var(--project-muted);
  font-size: 9px;
  line-height: 1.45;
}

.dmp-project-finance-grid span.risk {
  color: var(--project-red);
}

.dmp-project-risk-level {
  display: inline-flex;
  padding: 2px 6px;
  border-radius: 8px;
  background: #fff4df;
  color: #9a6416;
  font-size: 9px;
}

.dmp-project-risk-level.high {
  background: #fff0f1;
  color: #ad3743;
}

.dmp-project-acceptance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dmp-project-acceptance-item {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid #e0e7ef;
  border-radius: 4px;
  background: #fafbfd;
  text-align: left;
}

.dmp-project-acceptance-item.ready {
  border-color: #b9d9c9;
  background: #f5faf7;
}

.dmp-project-acceptance-item > i {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #edf1f5;
  color: var(--project-muted);
  font-style: normal;
}

.dmp-project-acceptance-item.ready > i { background: #e4f3ec; color: var(--project-green); }
.dmp-project-acceptance-item b,
.dmp-project-acceptance-item small { display: block; }
.dmp-project-acceptance-item b { color: var(--project-ink); font-size: 9px; }
.dmp-project-acceptance-item small,
.dmp-project-acceptance-item em { margin-top: 3px; color: var(--project-muted); font-size: 8px; font-style: normal; }

.dmp-project-closure {
  display: grid;
  grid-template-columns: minmax(220px, .7fr) minmax(0, 1.6fr);
  gap: 14px;
  padding: 14px;
  border: 1px solid #d8e2ec;
  border-radius: 5px;
  background: #f8fafc;
}

.dmp-project-closure h3 { margin: 0; color: var(--project-ink); font-size: 12px; }
.dmp-project-closure p { margin: 6px 0 0; color: var(--project-muted); font-size: 9px; line-height: 1.55; }
.dmp-project-closure ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.dmp-project-closure li { display: flex; align-items: center; gap: 7px; color: #9b4950; font-size: 8px; }
.dmp-project-closure li i { display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: #fff0f1; font-style: normal; }
.dmp-project-closure li.passed { color: var(--project-green); }
.dmp-project-closure li.passed i { background: #e4f3ec; }

.dmp-project-evidence-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.dmp-project-evidence-list button {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 1px solid #e1e7ef;
  border-radius: 4px;
  background: #fafbfd;
  text-align: left;
}

.dmp-project-evidence-list button.ready {
  background: #f6faf8;
}

.dmp-project-evidence-list i {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: #edf1f5;
  color: var(--project-muted);
  font-style: normal;
}

.dmp-project-evidence-list .ready i {
  background: #e4f3ec;
  color: var(--project-green);
}

.dmp-project-evidence-list b,
.dmp-project-evidence-list small {
  display: block;
}

.dmp-project-evidence-list b {
  color: var(--project-ink);
  font-size: 9px;
}

.dmp-project-evidence-list small,
.dmp-project-evidence-list em {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 8px;
  font-style: normal;
}

.dmp-project-form {
  width: min(760px, calc(100vw - 48px));
}

.dmp-related-projects {
  margin-top: 14px;
}

.dmp-related-project-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.dmp-related-project-grid > button {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 72px;
  padding: 11px;
  border: 1px solid var(--project-border);
  border-radius: 5px;
  background: #fff;
  text-align: left;
}

.dmp-related-project-grid > button:hover {
  border-color: #9bb6d6;
  background: #f7f9fc;
}

.dmp-related-project-grid > button > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--project-blue);
}

.dmp-related-project-grid > button > i.green { background: var(--project-green); }
.dmp-related-project-grid > button > i.amber { background: var(--project-amber); }
.dmp-related-project-grid > button > i.orange { background: var(--project-orange); }
.dmp-related-project-grid > button > i.red { background: var(--project-red); }

.dmp-related-project-grid small,
.dmp-related-project-grid b,
.dmp-related-project-grid em {
  display: block;
}

.dmp-related-project-grid small {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-related-project-grid b {
  margin-top: 4px;
  color: var(--project-ink);
  font-size: 10px;
  line-height: 1.4;
}

.dmp-related-project-grid em {
  margin-top: 4px;
  overflow: hidden;
  color: var(--project-muted);
  font-size: 8px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmp-related-project-grid strong {
  color: var(--project-ink);
  font-size: 13px;
}

@media (max-width: 1280px) {
  .dmp-project-viz-grid {
    grid-template-columns: 1fr;
  }
  .dmp-project-search input {
    width: 280px;
  }
}

/* Project workspace: task-first layout */
.dmp-project-portfolio {
  gap: 12px;
}

.dmp-project-list > header {
  align-items: flex-start;
  min-height: 70px;
  padding: 14px 16px;
}

.dmp-project-list > header > div {
  min-width: 0;
}

.dmp-project-list > header > div > span {
  color: #4470a4;
  font-size: 9px;
  font-weight: 700;
}

.dmp-project-list > header h2 {
  margin: 3px 0 0;
  color: var(--project-ink);
  font-size: 16px;
  letter-spacing: 0;
}

.dmp-project-list > header p {
  margin: 5px 0 0;
  color: var(--project-muted);
  font-size: 10px;
  line-height: 1.5;
}

.dmp-project-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid #e7edf3;
  background: #fafbfd;
}

.dmp-project-toolbar .dmp-project-search {
  flex: 1 1 330px;
  min-width: 220px;
}

.dmp-project-toolbar .dmp-project-search input {
  width: min(440px, 100%);
}

.dmp-project-toolbar .dmp-project-filters {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.dmp-project-list-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 16px;
  border-bottom: 1px solid #edf1f5;
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-list-context b {
  color: var(--project-ink);
  font-size: 11px;
}

.dmp-project-rows {
  display: grid;
}

.dmp-project-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(250px, 1.55fr) minmax(140px, .82fr) minmax(130px, .68fr) minmax(190px, 1.05fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 94px;
  padding: 12px 14px 12px 16px;
  border-bottom: 1px solid #e8edf3;
  background: #fff;
}

.dmp-project-row::before {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 0 2px 2px 0;
  background: var(--project-blue);
  content: "";
}

.dmp-project-row[data-project-health="green"]::before { background: var(--project-green); }
.dmp-project-row[data-project-health="amber"]::before { background: var(--project-amber); }
.dmp-project-row[data-project-health="orange"]::before { background: var(--project-orange); }
.dmp-project-row[data-project-health="red"]::before { background: var(--project-red); }
.dmp-project-row:last-child { border-bottom: 0; }
.dmp-project-row:hover { background: #f9fbfd; }

.dmp-project-row > div {
  min-width: 0;
}

.dmp-project-row .dmp-project-name span {
  gap: 6px;
}

.dmp-project-row .dmp-project-name span em {
  margin-left: 3px;
  padding: 1px 5px;
  border: 1px solid #d8e2ed;
  border-radius: 3px;
  background: #f7f9fc;
  color: #557089;
  font-size: 8px;
  font-style: normal;
}

.dmp-project-row .dmp-project-name b {
  overflow: hidden;
  margin-top: 5px;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmp-project-row .dmp-project-name small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmp-project-row .dmp-project-owner > small:first-child,
.dmp-project-status > small:first-child,
.dmp-project-row .dmp-project-decision > small:first-child {
  margin: 0 0 4px;
  color: #8290a3;
  font-size: 8px;
}

.dmp-project-row .dmp-project-owner b,
.dmp-project-row .dmp-project-decision b {
  margin-top: 0;
}

.dmp-project-row .dmp-project-status > span {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-status > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--project-blue);
}

.dmp-project-status > span i.green { background: var(--project-green); }
.dmp-project-status > span i.amber { background: var(--project-amber); }
.dmp-project-status > span i.orange { background: var(--project-orange); }
.dmp-project-status > span i.red { background: var(--project-red); }

.dmp-project-row-action {
  min-width: 68px;
  white-space: nowrap;
}

.dmp-project-analysis,
.dmp-project-lifecycle-details {
  overflow: hidden;
  border: 1px solid var(--project-border);
  border-radius: 6px;
  background: #fff;
}

.dmp-project-analysis > summary,
.dmp-project-lifecycle-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding: 9px 15px;
  background: #fafbfd;
  cursor: pointer;
  list-style: none;
}

.dmp-project-analysis > summary::-webkit-details-marker,
.dmp-project-lifecycle-details > summary::-webkit-details-marker {
  display: none;
}

.dmp-project-analysis > summary::after,
.dmp-project-lifecycle-details > summary::after {
  flex: 0 0 auto;
  color: #5d7590;
  font-size: 15px;
  content: "⌄";
}

.dmp-project-analysis[open] > summary::after,
.dmp-project-lifecycle-details[open] > summary::after {
  transform: rotate(180deg);
}

.dmp-project-analysis > summary > span b,
.dmp-project-analysis > summary > span small {
  display: block;
}

.dmp-project-analysis > summary > span b {
  color: var(--project-ink);
  font-size: 12px;
}

.dmp-project-analysis > summary > span small,
.dmp-project-lifecycle-details > summary small {
  margin-top: 3px;
  color: var(--project-muted);
  font-size: 9px;
}

.dmp-project-analysis > summary dl {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0 14px 0 auto;
}

.dmp-project-analysis > summary dl > div {
  display: flex;
  align-items: baseline;
  gap: 5px;
  min-width: 76px;
  padding: 0 12px;
  border-left: 1px solid #e0e7ef;
}

.dmp-project-analysis > summary dt {
  color: var(--project-muted);
  font-size: 8px;
}

.dmp-project-analysis > summary dd {
  margin: 0;
  color: var(--project-ink);
  font-size: 12px;
  font-weight: 700;
}

.dmp-project-analysis-body {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-top: 1px solid #e7edf3;
  background: #f7f9fc;
}

.dmp-project-lifecycle-details {
  margin-top: 0;
}

.dmp-project-lifecycle-details > summary span {
  color: var(--project-ink);
  font-size: 11px;
  font-weight: 700;
}

.dmp-project-lifecycle-details > .dmp-five-module-shell {
  padding: 12px;
  border-top: 1px solid #e7edf3;
  background: #f7f9fc;
}

.dmp-project-form .dmp-form-grid select {
  width: 100%;
}

@media (max-width: 1450px) {
  .dmp-project-row {
    grid-template-columns: minmax(220px, 1.45fr) minmax(125px, .75fr) minmax(120px, .68fr) minmax(170px, 1fr) auto;
    gap: 10px;
  }

  .dmp-project-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .dmp-project-toolbar .dmp-project-search {
    width: 100%;
  }

  .dmp-project-toolbar .dmp-project-search input {
    width: 100%;
  }
}

@media (max-width: 1080px) {
  .dmp-project-row {
    grid-template-columns: minmax(260px, 1.5fr) minmax(160px, .8fr) minmax(210px, 1fr) auto;
  }

  .dmp-project-row .dmp-project-status {
    grid-column: 2;
  }

  .dmp-project-row .dmp-project-decision {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .dmp-project-analysis > summary dl {
    display: none;
  }
}