#page-domain-plan .finance-cashflow-board,
#page-domain-plan .finance-repayment-roadmap {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--ds-brand) 18%, var(--ds-border));
  background: var(--ds-surface, #fff);
}

#page-domain-plan .finance-cashflow-head,
#page-domain-plan .finance-repayment-roadmap > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--ds-border, #e4e7ef);
}

#page-domain-plan .finance-cashflow-head h2,
#page-domain-plan .finance-repayment-roadmap > header h2 {
  margin: 4px 0 6px;
  font-size: clamp(22px, 2.4vw, 30px);
  letter-spacing: -0.03em;
}

#page-domain-plan .finance-cashflow-head p,
#page-domain-plan .finance-repayment-roadmap > header p {
  max-width: 680px;
  margin: 0;
  color: var(--ds-text-muted, #667085);
  line-height: 1.65;
}

#page-domain-plan .finance-income-lockup,
#page-domain-plan .finance-repayment-roadmap > header > div:last-child {
  min-width: 230px;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--ds-brand) 20%, var(--ds-border));
  border-radius: 14px;
  background: color-mix(in srgb, var(--ds-brand) 5%, #fff);
}

#page-domain-plan .finance-income-lockup span,
#page-domain-plan .finance-income-lockup small,
#page-domain-plan .finance-repayment-roadmap > header > div:last-child span,
#page-domain-plan .finance-repayment-roadmap > header > div:last-child small {
  display: block;
  color: var(--ds-text-muted, #667085);
  font-size: 12px;
}

#page-domain-plan .finance-income-lockup strong,
#page-domain-plan .finance-repayment-roadmap > header > div:last-child strong {
  display: block;
  margin: 3px 0 4px;
  color: var(--ds-text, #182230);
  font-size: 25px;
  font-variant-numeric: tabular-nums;
}

#page-domain-plan .finance-cashflow-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.8fr);
  gap: 16px;
  margin-top: 20px;
}

#page-domain-plan .finance-monthly-ledger,
#page-domain-plan .finance-weekly-envelope,
#page-domain-plan .finance-one-time-funds {
  border: 1px solid var(--ds-border, #e4e7ef);
  border-radius: 14px;
  background: color-mix(in srgb, var(--ds-surface, #fff) 92%, #f5f7fb);
}

#page-domain-plan .finance-monthly-ledger > header,
#page-domain-plan .finance-weekly-envelope > header,
#page-domain-plan .finance-one-time-funds > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ds-border, #e4e7ef);
}

#page-domain-plan .finance-monthly-ledger > header span,
#page-domain-plan .finance-weekly-envelope > header span,
#page-domain-plan .finance-one-time-funds > header span {
  color: var(--ds-text-muted, #667085);
  font-size: 12px;
}

#page-domain-plan .finance-monthly-ledger > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#page-domain-plan .finance-monthly-ledger > div > span,
#page-domain-plan .finance-weekly-envelope > div > span {
  position: relative;
  min-width: 0;
  padding: 13px 14px;
  border-right: 1px solid var(--ds-border, #e4e7ef);
  border-bottom: 1px solid var(--ds-border, #e4e7ef);
}

#page-domain-plan .finance-monthly-ledger > div > span:nth-child(4n),
#page-domain-plan .finance-weekly-envelope > div > span:nth-child(2n) {
  border-right: 0;
}

#page-domain-plan .finance-monthly-ledger small,
#page-domain-plan .finance-weekly-envelope small {
  display: block;
  color: var(--ds-text-muted, #667085);
  font-size: 12px;
}

#page-domain-plan .finance-monthly-ledger strong,
#page-domain-plan .finance-weekly-envelope strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}

#page-domain-plan .finance-monthly-ledger i,
#page-domain-plan .finance-weekly-envelope i {
  display: block;
  min-height: 18px;
  margin-top: 5px;
  color: #7b8190;
  font-size: 11px;
  font-style: normal;
  line-height: 1.45;
}

#page-domain-plan .finance-monthly-ledger footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  background: color-mix(in srgb, var(--ds-brand) 4%, transparent);
  font-size: 13px;
}

#page-domain-plan .finance-weekly-envelope > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#page-domain-plan .finance-one-time-funds {
  margin-top: 16px;
}

#page-domain-plan .finance-one-time-funds > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#page-domain-plan .finance-one-time-funds article {
  min-width: 0;
  padding: 14px 16px;
  border-right: 1px solid var(--ds-border, #e4e7ef);
}

#page-domain-plan .finance-one-time-funds article:last-child {
  border-right: 0;
}

#page-domain-plan .finance-one-time-funds time,
#page-domain-plan .finance-one-time-funds small {
  display: block;
  color: var(--ds-text-muted, #667085);
  font-size: 11px;
}

#page-domain-plan .finance-one-time-funds article strong,
#page-domain-plan .finance-one-time-funds article b {
  display: block;
  margin-top: 5px;
}

#page-domain-plan .finance-one-time-funds article b {
  color: var(--ds-brand, #5b5ce2);
  font-size: 17px;
  font-variant-numeric: tabular-nums;
}

#page-domain-plan .finance-repayment-roadmap > ol {
  margin: 0;
  padding: 10px 0 0;
  list-style: none;
}

#page-domain-plan .finance-repayment-roadmap > ol > li {
  display: grid;
  grid-template-columns: 34px 104px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 4px;
  border-bottom: 1px solid var(--ds-border, #e4e7ef);
}

#page-domain-plan .finance-repayment-roadmap > ol > li > span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--ds-brand) 28%, var(--ds-border));
  border-radius: 50%;
  color: var(--ds-brand, #5b5ce2);
  background: color-mix(in srgb, var(--ds-brand) 6%, #fff);
  font-size: 11px;
  font-weight: 800;
}

#page-domain-plan .finance-repayment-roadmap time {
  color: var(--ds-text-muted, #667085);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

#page-domain-plan .finance-repayment-roadmap li > div {
  min-width: 0;
}

#page-domain-plan .finance-repayment-roadmap li > div strong,
#page-domain-plan .finance-repayment-roadmap li > div small {
  display: block;
}

#page-domain-plan .finance-repayment-roadmap li > div small {
  margin-top: 3px;
  color: var(--ds-text-muted, #667085);
  line-height: 1.5;
}

#page-domain-plan .finance-repayment-roadmap li > b {
  color: var(--ds-text, #182230);
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

#page-domain-plan .finance-repayment-roadmap li.is-past {
  opacity: 0.68;
}

#page-domain-plan .finance-repayment-roadmap > footer {
  display: flex;
  gap: 12px 20px;
  align-items: baseline;
  justify-content: space-between;
  margin-top: 14px;
  padding: 15px 17px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--ds-brand) 6%, #f7f8fc);
}

#page-domain-plan .finance-repayment-roadmap > footer span {
  color: var(--ds-text-muted, #667085);
  line-height: 1.55;
}

@media (max-width: 980px) {
  #page-domain-plan .finance-cashflow-layout,
  #page-domain-plan .finance-cashflow-head,
  #page-domain-plan .finance-repayment-roadmap > header {
    grid-template-columns: 1fr;
  }

  #page-domain-plan .finance-income-lockup,
  #page-domain-plan .finance-repayment-roadmap > header > div:last-child {
    min-width: 0;
  }

  #page-domain-plan .finance-one-time-funds > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #page-domain-plan .finance-one-time-funds article:nth-child(2) {
    border-right: 0;
  }

  #page-domain-plan .finance-one-time-funds article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--ds-border, #e4e7ef);
  }
}

@media (max-width: 640px) {
  #page-domain-plan .finance-monthly-ledger > div,
  #page-domain-plan .finance-weekly-envelope > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #page-domain-plan .finance-monthly-ledger > div > span:nth-child(4n) {
    border-right: 1px solid var(--ds-border, #e4e7ef);
  }

  #page-domain-plan .finance-monthly-ledger > div > span:nth-child(2n) {
    border-right: 0;
  }

  #page-domain-plan .finance-repayment-roadmap > ol > li {
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: 10px;
  }

  #page-domain-plan .finance-repayment-roadmap time {
    grid-column: 2 / 4;
    grid-row: 1;
    align-self: start;
  }

  #page-domain-plan .finance-repayment-roadmap li > span {
    grid-row: 1 / 3;
  }

  #page-domain-plan .finance-repayment-roadmap li > div {
    grid-column: 2;
  }

  #page-domain-plan .finance-repayment-roadmap li > b {
    grid-column: 3;
  }

  #page-domain-plan .finance-repayment-roadmap > footer {
    display: block;
  }

  #page-domain-plan .finance-repayment-roadmap > footer span {
    display: block;
    margin-top: 5px;
  }
}

@media (max-width: 430px) {
  #page-domain-plan .finance-one-time-funds > div {
    grid-template-columns: 1fr;
  }

  #page-domain-plan .finance-one-time-funds article,
  #page-domain-plan .finance-one-time-funds article:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--ds-border, #e4e7ef);
  }

  #page-domain-plan .finance-one-time-funds article:last-child {
    border-bottom: 0;
  }
}