.business-snapshot {
  margin-top: 24px;
}

.snapshot-title-row {
  display: flex;
  align-items: center;
  gap: 7px;
}

.snapshot-info-button {
  width: 23px;
  height: 23px;
  padding: 0 !important;
  display: grid;
  place-items: center;
  border: 1px solid #111 !important;
  border-radius: 50%;
  background: #fff !important;
  font-family: Georgia, serif;
  font-size: 11px !important;
  line-height: 1;
}

.snapshot-info-button:focus-visible {
  outline: 2px solid #111;
  outline-offset: 2px;
}

.business-snapshot-info-sheet > .snapshot-info-lead {
  margin: 17px 0 13px;
  color: #111;
  font-size: 8px;
  font-family:"Vazirmatn Bold",Tahoma,sans-serif;
  line-height: 1.9;
}

.snapshot-info-points {
  display: grid;
  gap: 7px;
}

.snapshot-info-points article {
  min-height: 58px;
  padding: 10px;
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
  border: 1px solid #d0d2d1;
  border-radius: 13px;
  background: #f7f8f7;
}

.snapshot-info-points article > span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #fff;
  background: #111;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.snapshot-info-points article > div {
  display: flex;
  flex-direction: column;
}

.snapshot-info-points strong {
  font-size: 8px;
}

.snapshot-info-points small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6.3px;
  line-height: 1.7;
}

.snapshot-info-position {
  margin-top: 10px;
  padding: 11px 12px;
  border-right: 3px solid #111;
  border-radius: 11px 0 0 11px;
  background: #f0f1f0;
}

.snapshot-info-position strong {
  display: block;
  font-size: 8px;
}

.snapshot-info-position p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 6.5px;
  line-height: 1.8;
}

.business-snapshot-info-sheet > .snapshot-info-disclaimer {
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px dashed #a9adab;
  border-radius: 11px;
  color: var(--muted);
  font-size: 6.2px;
  line-height: 1.75;
}

.business-snapshot-info-sheet > .primary-button {
  margin-top: 14px;
}

.scf-home-info-sheet {
  max-height: 88%;
}

.scf-home-info-sheet > .scf-role-intro {
  margin: 16px 0 11px;
  color: var(--muted);
  font-size: 7px;
  line-height: 1.8;
}

.scf-home-info-sheet .scf-role-map {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr);
  align-items: stretch;
  gap: 7px;
}

.scf-home-info-sheet .scf-role-map article {
  min-width: 0;
  padding: 11px;
  display: flex;
  flex-direction: column;
  border: 1px solid #111;
  border-radius: 14px;
  background: #f7f8f7;
}

.scf-home-info-sheet .scf-role-map article > span {
  width: max-content;
  padding: 2px 6px;
  border-radius: 7px;
  color: #fff;
  background: #111;
  font-size: 5.8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-home-info-sheet .scf-role-map article strong {
  margin-top: 7px;
  font-size: 10px;
}

.scf-home-info-sheet .scf-role-map article small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 6.2px;
  line-height: 1.75;
}

.scf-home-info-sheet .scf-role-map > i {
  display: grid;
  place-items: center;
  font-size: 14px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-role-finance {
  margin-top: 10px;
  padding: 10px 11px;
  border-right: 3px solid #111;
  border-radius: 11px 0 0 11px;
  background: #efefef;
}

.scf-role-finance strong {
  display: block;
  font-size: 8px;
}

.scf-role-finance p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 6.4px;
  line-height: 1.75;
}

.scf-role-steps {
  margin: 11px 0 0;
  padding: 0;
  border: 1px solid #cfd2d0;
  border-radius: 14px;
  list-style: none;
  overflow: hidden;
}

.scf-role-steps li {
  min-height: 58px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  border-bottom: 1px solid #d8dad9;
}

.scf-role-steps li:last-child {
  border-bottom: 0;
}

.scf-role-steps li > i {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: #111;
  font-size: 7px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-role-steps li > span {
  display: flex;
  flex-direction: column;
}

.scf-role-steps strong {
  font-size: 8px;
}

.scf-role-steps small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6.2px;
  line-height: 1.7;
}

.scf-home-info-sheet > .scf-role-note {
  margin: 10px 0 0;
  padding: 9px 10px;
  border: 1px dashed #a9adab;
  border-radius: 11px;
  color: var(--muted);
  font-size: 6.2px;
  line-height: 1.75;
}

.scf-home-info-sheet > .primary-button {
  margin-top: 13px;
}

.smart-fixed-source {
  margin-bottom: 7px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  border-color: #c8cbc9;
  background: #f7f8f7;
}

.smart-fixed-source > i {
  padding: 3px 6px;
  border-radius: 7px;
  color: #17633f;
  background: #e6f4ec;
  font-size: 5.5px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  white-space: nowrap;
}

.smart-source-note {
  margin: 0 2px 12px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  color: var(--muted);
  font-size: 5.8px;
  line-height: 1.7;
}

.smart-source-note svg {
  width: 13px;
  min-width: 13px;
  color: #17633f;
}

.snapshot-card {
  padding: 15px;
  border: 1px solid #111;
  border-radius: 18px;
  background: #fff;
}

.snapshot-net {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 2px 10px;
}

.snapshot-net > span {
  color: var(--muted);
  font-size: 7px;
}

.snapshot-net > strong {
  direction: ltr;
  font-size: 17px;
}

.snapshot-net > small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 6px;
}

.snapshot-bars {
  margin-top: 14px;
  display: grid;
  gap: 8px;
}

.snapshot-bars i {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 45px;
  align-items: center;
  gap: 7px;
  font-style: normal;
}

.snapshot-bars b,
.snapshot-bars em {
  color: var(--muted);
  font-size: 6px;
  font-style: normal;
}

.snapshot-bars em {
  direction: ltr;
  text-align: left;
}

.snapshot-bars span {
  height: 6px;
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  background: #eceeed;
}

.snapshot-bars span::after {
  content: "";
  width: var(--value);
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: #111;
}

.snapshot-bars i:nth-child(2) span::after {
  background: #9ea4a1;
}

.snapshot-card > footer {
  margin: 14px -5px -5px;
  padding-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #e0e2e1;
}

.snapshot-card > footer button {
  min-width: 0;
  padding: 2px 7px;
  display: flex;
  flex-direction: column;
  border: 0;
  border-left: 1px solid #e0e2e1;
  background: transparent;
  text-align: right;
}

.snapshot-card > footer button:last-child {
  border-left: 0;
}

.snapshot-card > footer span {
  font-size: 10px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.snapshot-card > footer small {
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted);
  font-size: 5.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

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

.finance-tool-grid > button {
  min-width: 0;
  min-height: 112px;
  padding: 12px 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #c8cbc9;
  border-radius: 16px;
  background: #fff;
  text-align: right;
}

.finance-tool-grid > button:first-child {
  color: #fff;
  border-color: #111;
  background: #111;
}

.finance-tool-grid > button > span {
  width: 30px;
  height: 30px;
  margin-bottom: 10px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #111;
  background: #f0f1f0;
  font-size: 10px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.finance-tool-grid strong {
  font-size: 8px;
}

.finance-tool-grid small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 5.5px;
  line-height: 1.6;
}

.finance-tool-grid > button:first-child small {
  color: #bbb;
}

.finance-tool-grid i {
  margin-top: auto;
  padding: 2px 5px;
  border-radius: 6px;
  color: #6e4a1c;
  background: #f7ead7;
  font-size: 5px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.finance-tool-grid i.good {
  color: #17633f;
  background: #e6f4ec;
}

.scf-home-card {
  width: 100%;
  min-height: 135px;
  padding: 16px;
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  border: 1px solid #111;
  border-radius: 19px;
  color: #fff;
  background: #111;
  text-align: right;
}

.scf-home-mark {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  border: 1px solid #666;
  border-radius: 13px;
  color: #111;
  background: #fff;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-home-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.scf-home-copy small {
  color: #b8b8b8;
  font-size: 6.5px;
}

.scf-home-copy strong {
  margin: 3px 0 2px;
  direction: ltr;
  font-size: 18px;
}

.scf-home-copy i {
  color: #b8b8b8;
  font-size: 5.8px;
  font-style: normal;
  line-height: 1.6;
}

.scf-home-action {
  grid-column: 1 / -1;
  padding-top: 11px;
  border-top: 1px solid #3c3c3c;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.business-connector-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.connector-card {
  min-height: 139px;
  padding: 13px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #c8cbc9;
  border-radius: 17px;
  background: #fff;
  text-align: right;
}

.connector-card header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.connector-icon {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #f0f1f0;
  font-size: 14px;
}

.connector-icon svg {
  width: 18px;
}

.connector-card header i {
  padding: 2px 5px;
  border-radius: 6px;
  color: #17633f;
  background: #e6f4ec;
  font-size: 5px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.connector-card.alert header i,
.connector-card.disconnected header i {
  color: #7b4d18;
  background: #faecd9;
}

.connector-card > strong {
  margin-top: 11px;
  font-size: 9px;
}

.connector-card > small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.6;
}

.connector-card > footer {
  margin-top: auto;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.connector-consent {
  margin: 9px 0 0;
  padding: 8px 9px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  border-radius: 10px;
  color: var(--muted);
  background: #f5f6f5;
  font-size: 5.5px;
  line-height: 1.8;
}

.connector-consent svg {
  width: 13px;
  min-width: 13px;
  color: #111;
}

.business-service-screen {
  padding-bottom: 28px;
}

.service-summary-hero,
.cashflow-forecast,
.scf-eligibility-hero,
.scf-quote-card {
  margin-top: 19px;
  border: 1px solid #111;
  border-radius: 19px;
  overflow: hidden;
  background: #111;
  color: #fff;
}

.service-summary-hero > div {
  padding: 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 4px 10px;
}

.service-summary-hero > div span {
  color: #bbb;
  font-size: 7px;
}

.service-summary-hero > div strong {
  direction: ltr;
  font-size: 20px;
}

.service-summary-hero > div small {
  grid-column: 2;
  color: #aaa;
  font-size: 6px;
}

.service-summary-hero footer {
  padding: 12px 18px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid #3d3d3d;
}

.service-summary-hero footer span {
  color: #bbb;
  font-size: 6px;
}

.service-summary-hero footer b {
  margin-left: 3px;
  color: #fff;
  font-size: 9px;
}

.business-primary-action {
  width: 100%;
  min-height: 65px;
  margin-top: 13px;
  padding: 11px 13px;
  display: grid;
  grid-template-columns: 36px 1fr;
  align-items: center;
  gap: 9px;
  border: 1px dashed #111;
  border-radius: 15px;
  background: #f6f7f6;
  text-align: right;
}

.business-primary-action > span {
  width: 34px;
  height: 34px;
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: #111;
  font-size: 15px;
}

.business-primary-action strong {
  font-size: 9px;
}

.business-primary-action small {
  color: var(--muted);
  font-size: 6px;
}

.receive-identity-card {
  margin-top: 19px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  color: #fff;
  background: #111;
}

.receive-identity-card > small {
  color: #aaa;
  font-size: 6px;
}

.receive-identity-card > strong {
  margin-top: 3px;
  font-size: 12px;
}

.receive-identity-card > span {
  margin: 12px 0;
  font-size: 10px;
  letter-spacing: .03em;
  text-align: left;
}

.receive-identity-card > button {
  min-height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: 10px;
  color: #111;
  background: #fff;
  font: inherit;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.receive-identity-card svg {
  width: 14px;
}

.receive-method-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.receive-method-grid > button {
  min-height: 95px;
  padding: 12px;
  display: grid;
  grid-template-columns: 34px 1fr;
  align-content: center;
  align-items: center;
  gap: 2px 9px;
  border: 1px solid #c8cbc9;
  border-radius: 15px;
  background: #fff;
  text-align: right;
}

.receive-method-grid > button > span {
  width: 33px;
  height: 33px;
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #f0f1f0;
  font-size: 9px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.legacy-receive-glyph,
.legacy-energy-glyph {
  font-style: normal;
}

.modern-receive-icon,
.modern-energy-icon {
  display: none;
}

.receive-method-grid strong {
  font-size: 8px;
}

.receive-method-grid small {
  color: var(--muted);
  font-size: 5.5px;
}

.service-list-section {
  margin-top: 23px;
}

.service-list-section > header {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.service-list-section > header h2 {
  margin: 0;
  font-size: 14px;
}

.service-list-section > header button,
.service-list-section > header small {
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: 6.5px;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
}

.business-row-list {
  border-top: 1px solid #111;
  border-bottom: 1px solid #111;
}

.business-row-list > button {
  width: 100%;
  min-height: 69px;
  padding: 9px 1px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid #ddd;
  background: #fff;
  text-align: right;
}

.business-row-list > button:last-child {
  border-bottom: 0;
}

.row-symbol {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #f0f1f0;
  font-size: 10px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.row-symbol.approved {
  color: #17633f;
  background: #e6f4ec;
}

.row-symbol.waiting {
  color: #7b4d18;
  background: #faecd9;
}

.business-row-list > button > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.business-row-list small,
.business-row-list i {
  overflow: hidden;
  color: var(--muted);
  font-size: 5.8px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-row-list strong {
  margin: 1px 0;
  font-size: 8.5px;
}

.business-row-list > button > b {
  direction: ltr;
  font-size: 7px;
  white-space: nowrap;
}

.expense-status-grid {
  margin-top: 19px;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 9px;
}

.expense-status-grid article {
  min-height: 93px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  border: 1px solid #111;
  border-radius: 16px;
}

.expense-status-grid article.attention {
  border-style: dashed;
  background: #f8f3eb;
}

.expense-status-grid span,
.expense-status-grid small {
  color: var(--muted);
  font-size: 6px;
}

.expense-status-grid strong {
  margin: 8px 0 2px;
  direction: ltr;
  font-size: 18px;
}

.cashflow-forecast {
  padding: 17px;
}

.cashflow-forecast header {
  display: flex;
  flex-direction: column;
}

.cashflow-forecast header span,
.cashflow-forecast header small {
  color: #bbb;
  font-size: 6.5px;
}

.cashflow-forecast header strong {
  margin: 3px 0;
  direction: ltr;
  font-size: 19px;
}

.cashflow-forecast header small {
  color: #a9d0b9;
}

.cashflow-chart {
  height: 92px;
  margin-top: 18px;
  display: flex;
  align-items: end;
  gap: 7px;
  border-bottom: 1px solid #555;
}

.cashflow-chart i {
  height: var(--h);
  flex: 1;
  border-radius: 4px 4px 0 0;
  background: #fff;
}

.cashflow-forecast footer {
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
  color: #aaa;
  font-size: 5.5px;
}

.cashflow-detail-summary {
  margin-top: 19px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  border: 1px solid #2B5484;
  border-radius: 19px;
  background: linear-gradient(145deg, #f5f5f5, #fff 70%);
}

.cashflow-detail-summary > span {
  color: #666;
  font-size: 7px;
}

.cashflow-detail-summary > div {
  margin-top: 3px;
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 6px;
  direction: ltr;
}

.cashflow-detail-summary strong {
  color: #2B5484;
  font-size: 22px;
  letter-spacing: -.025em;
}

.cashflow-detail-summary small {
  color: #666;
  font-size: 7px;
}

.cashflow-detail-summary p {
  width: max-content;
  margin: 7px 0 0;
  padding: 4px 7px;
  border-radius: 8px;
  color: #2B5484;
  background: #f5f5f5;
  font-size: 7px;
}

.cashflow-calculation {
  margin-top: 13px;
  padding: 14px;
  border: 1px solid #d4d4d4;
  border-radius: 18px;
  background: #fff;
}

.cashflow-calculation > header {
  padding-bottom: 11px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #d4d4d4;
}

.cashflow-calculation > header h2 {
  margin: 0;
  font-size: 12px;
}

.cashflow-calculation > header p {
  margin: 2px 0 0;
  color: #666;
  font-size: 6px;
}

.cashflow-calculation > header > span {
  padding: 4px 7px;
  border-radius: 8px;
  color: #2B5484;
  background: #f5f5f5;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  white-space: nowrap;
}

.cashflow-calculation-note {
  margin: 11px 0 0;
  padding-top: 10px;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  border-top: 1px solid #d4d4d4;
  color: #666;
  font-size: 6px;
  line-height: 1.8;
}

.cashflow-calculation-note svg {
  width: 13px;
  min-width: 13px;
  color: #2B5484;
}

.connection-chip {
  padding: 3px 7px;
  border-radius: 8px;
  color: #0056F5;
  background: #f5f5f5;
  font-size: 6px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.energy-hero {
  margin-top: 18px;
  padding: 17px;
  display: grid;
  grid-template-columns: 49px 1fr;
  align-items: center;
  gap: 12px;
  border-radius: 18px;
  color: #fff;
  background: #111;
}

.energy-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #111;
  background: #fff;
  font-size: 20px;
}

.energy-hero div {
  display: flex;
  flex-direction: column;
}

.energy-hero small {
  color: #bbb;
  font-size: 6px;
}

.energy-hero strong {
  margin: 3px 0;
  font-size: 18px;
}

.energy-hero strong i {
  font-size: 7px;
  font-style: normal;
}

.energy-hero p {
  margin: 0;
  color: #bbb;
  font-size: 6px;
}

.energy-hero p b {
  color: #a9d0b9;
}

.energy-meter {
  margin-top: 13px;
  padding: 14px;
  border: 1px solid #ccc;
  border-radius: 16px;
}

.energy-meter header,
.energy-meter p {
  margin: 0;
  display: flex;
  justify-content: space-between;
}

.energy-meter header span {
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.energy-meter header small,
.energy-meter p {
  color: var(--muted);
  font-size: 5.5px;
}

.energy-meter > div {
  height: 77px;
  margin: 10px 0 6px;
  display: flex;
  align-items: end;
  gap: 6px;
  border-bottom: 1px solid #ddd;
}

.energy-meter > div i {
  height: var(--h);
  flex: 1;
  border-radius: 4px 4px 0 0;
  background: #111;
}

.energy-auto-pay {
  min-height: 61px;
  margin-top: 17px;
  padding: 11px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #bbb;
  border-radius: 14px;
}

.energy-auto-pay > span {
  display: flex;
  flex-direction: column;
}

.energy-auto-pay strong {
  font-size: 8px;
}

.energy-auto-pay small {
  color: var(--muted);
  font-size: 5.7px;
}

.energy-auto-pay input {
  width: 31px;
  height: 18px;
  accent-color: #111;
}

.scf-eligibility-hero {
  padding: 18px;
  display: flex;
  flex-direction: column;
}

.scf-eligibility-hero > span,
.scf-eligibility-hero > small {
  color: #bbb;
  font-size: 6.5px;
}

.scf-eligibility-hero > strong {
  margin: 3px 0;
  direction: ltr;
  font-size: 22px;
}

.scf-eligibility-hero > strong i {
  font-size: 7px;
  font-style: normal;
}

.scf-explainer {
  margin-top: 13px;
  padding: 12px;
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 10px;
  border: 1px dashed #111;
  border-radius: 14px;
  background: #f6f7f6;
}

.scf-explainer > div {
  min-width: 0;
}

.scf-explainer > span {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: #111;
  font-size: 6px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-explainer strong {
  font-size: 8px;
}

.scf-explainer p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 5.8px;
  line-height: 1.8;
}

.scf-explainer .scf-role-map {
  margin: 8px 0 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
}

.scf-explainer .scf-role-map div {
  padding: 7px 8px;
  border-right: 2px solid #111;
  border-radius: 0 8px 8px 0;
  background: #fff;
}

.scf-explainer .scf-role-map dt {
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-explainer .scf-role-map dd {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 5.6px;
  line-height: 1.7;
}

.scf-explainer > div > small {
  margin-top: 7px;
  display: block;
  color: #4e5351;
  font-size: 5.5px;
  line-height: 1.7;
}

.scf-invoice-list {
  margin-bottom: 16px;
}

.scf-invoice {
  width: 100%;
  min-height: 75px;
  padding: 10px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 1px solid #ccc;
  border-radius: 14px;
  background: #fff;
  text-align: right;
}

.scf-invoice + .scf-invoice {
  margin-top: 8px;
}

.scf-invoice.selected {
  border-color: #111;
  box-shadow: inset 0 0 0 1px #111;
}

.scf-invoice > i {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: #111;
  font-size: 8px;
  font-style: normal;
}

.scf-invoice > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.scf-invoice small,
.scf-invoice em {
  overflow: hidden;
  color: var(--muted);
  font-size: 5.7px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.scf-invoice strong {
  margin: 2px 0;
  font-size: 8.5px;
}

.scf-invoice > b {
  padding: 3px 6px;
  border-radius: 7px;
  color: #17633f;
  background: #e6f4ec;
  font-size: 5.5px;
}

.scf-invoice.disabled {
  opacity: .62;
}

.scf-legal-note,
.scf-confirmation {
  margin: 11px 0 0;
  padding: 10px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  border: 1px solid #ccc;
  border-radius: 12px;
  color: var(--muted);
  font-size: 5.7px;
  line-height: 1.8;
}

.scf-legal-note svg {
  width: 14px;
  min-width: 14px;
  color: #111;
}

.scf-quote-card {
  color: #111;
  background: #fff;
}

.scf-quote-card header {
  padding: 17px;
  display: flex;
  flex-direction: column;
  color: #fff;
  background: #111;
}

.scf-quote-card header span {
  color: #bbb;
  font-size: 6px;
}

.scf-quote-card header strong {
  margin-top: 3px;
  direction: ltr;
  font-size: 21px;
}

.scf-quote-card header strong i {
  font-size: 7px;
  font-style: normal;
}

.scf-quote-card header small {
  margin-top: 5px;
  color: #aaa;
  font-size: 6px;
}

.scf-money-flow {
  padding: 11px 13px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  border-bottom: 1px solid #e3e4e3;
  background: #f5f6f5;
}

.scf-money-flow > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.scf-money-flow small {
  color: var(--muted);
  font-size: 5.3px;
}

.scf-money-flow b {
  font-size: 6px;
  line-height: 1.5;
}

.scf-money-flow > i {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
}

.scf-money-flow .result {
  padding: 6px;
  border-radius: 8px;
  color: #fff;
  background: #111;
}

.scf-money-flow .result small {
  color: #bbb;
}

.scf-quote-card dl,
.scf-funded-details {
  margin: 0;
  padding: 7px 15px;
}

.scf-quote-card dl div,
.scf-funded-details div {
  min-height: 35px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e3e4e3;
  font-size: 6.5px;
}

.scf-quote-card dl div:last-child,
.scf-funded-details div:last-child {
  border-bottom: 0;
}

.scf-quote-card dt,
.scf-funded-details dt {
  color: var(--muted);
}

.scf-quote-card dd,
.scf-funded-details dd {
  margin: 0;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-confirmation {
  align-items: center;
  color: #111;
}

.scf-confirmation input {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  accent-color: #111;
}

.scf-confirmation span {
  display: flex;
  flex-direction: column;
}

.scf-confirmation strong {
  font-size: 7px;
}

.scf-confirmation small {
  color: var(--muted);
  font-size: 5.5px;
}

.scf-error {
  margin: 7px 2px 0;
  color: #9a2f2f;
  font-size: 6px;
}

.scf-status-card {
  margin-top: 19px;
  padding: 16px;
  display: grid;
  grid-template-columns: 46px 1fr;
  align-items: center;
  gap: 12px;
  border: 1px solid #111;
  border-radius: 18px;
}

.scf-status-card > span {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: #111;
  font-size: 15px;
}

.scf-status-card small,
.scf-status-card p {
  color: var(--muted);
  font-size: 6px;
}

.scf-status-card h2 {
  margin: 2px 0;
  font-size: 14px;
}

.scf-status-card p {
  margin: 0;
}

.scf-status-card.funded {
  color: #fff;
  background: #111;
}

.scf-status-card.funded > span {
  color: #111;
  background: #fff;
}

.scf-status-card.funded small,
.scf-status-card.funded p {
  color: #bbb;
}

.scf-status-card.needs-info,
.scf-status-card.declined {
  border-color: #d9b26d;
  background: #fff8eb;
}

.scf-status-card.needs-info > span,
.scf-status-card.declined > span {
  color: #6e4b0b;
  background: #f4d492;
}

.scf-status-card.approved {
  border-color: #aacbbb;
  background: #edf8f2;
}

.scf-status-card.approved > span {
  background: #17633f;
}

.scf-status-card.settled {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}

.scf-requested-evidence {
  margin: 13px 0;
  padding: 13px;
  border: 1px solid #d9b26d;
  border-radius: 14px;
  background: #fffdf8;
}

.scf-requested-evidence strong {
  font-size: 8px;
}

.scf-requested-evidence p,
.scf-requested-evidence small {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.8;
}

.scf-requested-evidence small {
  padding-top: 7px;
  border-top: 1px solid #eadfc9;
}

.scf-timeline {
  margin: 18px 0;
  padding: 0;
  list-style: none;
}

.scf-timeline li {
  min-height: 55px;
  position: relative;
  display: grid;
  grid-template-columns: 25px 1fr;
  gap: 9px;
}

.scf-timeline li:not(:last-child)::after {
  content: "";
  width: 1px;
  position: absolute;
  top: 24px;
  right: 12px;
  bottom: 0;
  background: #ccc;
}

.scf-timeline li > i {
  width: 25px;
  height: 25px;
  z-index: 1;
  display: grid;
  place-items: center;
  border: 1px solid #bbb;
  border-radius: 50%;
  background: #fff;
  font-size: 7px;
  font-style: normal;
}

.scf-timeline li.done > i,
.scf-timeline li.active > i {
  color: #fff;
  border-color: #111;
  background: #111;
}

.scf-timeline li.active > i::after {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #fff;
}

.scf-timeline span {
  display: flex;
  flex-direction: column;
}

.scf-timeline strong {
  font-size: 8px;
}

.scf-timeline small {
  color: var(--muted);
  font-size: 5.7px;
}

.scf-funded-details {
  margin-top: 13px;
  border: 1px solid #ccc;
  border-radius: 14px;
}

.scf-requirements {
  margin-top: 14px;
  border: 1px solid #ccc;
  border-radius: 15px;
  overflow: hidden;
}

.scf-requirements header {
  padding: 13px;
  display: flex;
  flex-direction: column;
  background: #f4f5f4;
}

.scf-requirements header strong {
  font-size: 8px;
}

.scf-requirements header small {
  color: var(--muted);
  font-size: 5.5px;
}

.scf-requirements ul {
  margin: 0;
  padding: 6px 13px;
  list-style: none;
}

.scf-requirements li {
  min-height: 37px;
  display: grid;
  grid-template-columns: 21px 1fr;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid #eee;
  color: var(--muted);
  font-size: 6.5px;
}

.scf-requirements li:last-child {
  border-bottom: 0;
}

.scf-requirements li i {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid #bbb;
  border-radius: 7px;
  font-size: 6px;
  font-style: normal;
}

.scf-requirements li.done {
  color: #111;
}

.scf-requirements li.done i {
  color: #fff;
  border-color: #111;
  background: #111;
}

.business-service-scenarios {
  margin-top: 4px;
}

.focused-header > button.focused-header-help {
  width: auto;
  max-width: none;
  height: auto;
  min-height: 32px;
  padding: 4px 0;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #111;
  font: inherit;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  line-height: 1.7;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  white-space: nowrap;
}

.focused-header > button.focused-header-help:focus-visible {
  outline: 2px solid #111;
  outline-offset: 4px;
}

.invoice-definition-note,
.invoice-plain-note {
  margin-top: 16px;
  padding: 12px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  border: 1px solid #c8cbc9;
  border-radius: 16px;
  background: #f6f7f6;
}

.invoice-definition-note > span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  background: #111;
  font-size: 11px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-definition-note > div,
.invoice-explainer > header > div,
.invoice-explainer li > span,
.invoice-status-timeline li > span,
.invoice-review-confirm > span > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.invoice-definition-note strong {
  font-size: 8.5px;
}

.invoice-definition-note p {
  margin: 3px 0 6px;
  color: var(--muted);
  font-size: 6.3px;
  line-height: 1.8;
}

.invoice-definition-note button {
  width: max-content;
  padding: 0 0 2px;
  border: 0;
  border-bottom: 1px solid #111;
  background: transparent;
  font: inherit;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-explainer {
  margin-top: 19px;
  overflow: hidden;
  border: 1px solid #111;
  border-radius: 18px;
  background: #fff;
}

.invoice-explainer > header {
  padding: 13px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  color: #fff;
  background: #111;
}

.invoice-explainer > header > span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #111;
  background: #fff;
  font-size: 11px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-explainer header small,
.invoice-comparison span,
.invoice-decision article > span {
  color: var(--muted);
  font-size: 6px;
}

.invoice-explainer header strong {
  font-size: 8px;
}

.invoice-explainer ol,
.invoice-status-timeline {
  margin: 0;
  padding: 4px 13px;
  list-style: none;
}

.invoice-explainer li,
.invoice-status-timeline li {
  min-height: 52px;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid #ddd;
}

.invoice-explainer li:last-child,
.invoice-status-timeline li:last-child {
  border-bottom: 0;
}

.invoice-explainer li > i,
.invoice-status-timeline li > i {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid #aaa;
  border-radius: 50%;
  background: #fff;
  font-size: 6.5px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-explainer li strong,
.invoice-status-timeline li strong {
  font-size: 7.5px;
}

.invoice-explainer li small,
.invoice-status-timeline li small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.65;
}

.invoice-comparison {
  margin: 12px 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.invoice-comparison article {
  min-height: 128px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  border: 1px solid #c8cbc9;
  border-radius: 16px;
  background: #fff;
}

.invoice-comparison article.emphasis,
.invoice-decision article.emphasis {
  color: #fff;
  border-color: #111;
  background: #111;
}

.invoice-comparison strong {
  margin-top: 8px;
  font-size: 8px;
  line-height: 1.65;
}

.invoice-comparison p,
.invoice-decision article > p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.75;
}

.invoice-comparison .emphasis span,
.invoice-comparison .emphasis p,
.invoice-decision article.emphasis > span,
.invoice-decision article.emphasis > p {
  color: #bbb;
}

.invoice-plain-note {
  margin: 11px 0 15px;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 7px;
  border: 0;
  border-radius: 12px;
  color: var(--muted);
  background: #f1f2f1;
  font-size: 6.2px;
  line-height: 1.75;
}

.invoice-plain-note svg {
  width: 15px;
}

.invoice-progress {
  margin: 3px 0 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.invoice-progress > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.invoice-progress b {
  font-size: 7px;
}

.invoice-progress small {
  color: var(--muted);
  font-size: 6.5px;
}

.invoice-progress > i {
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: #e0e2e1;
}

.invoice-progress > i > b {
  height: 100%;
  display: block;
  border-radius: inherit;
  background: #111;
}

.invoice-flow-intro {
  margin-bottom: 20px;
}

.invoice-form {
  margin-bottom: 18px;
}

.invoice-field {
  display: block;
  margin-bottom: 13px;
}

.invoice-field > span {
  display: block;
  margin: 0 2px 6px;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-field > div {
  min-height: 49px;
  padding: 0 11px;
  display: flex;
  align-items: center;
  border: 1px solid #111;
  border-radius: 13px;
  background: #fff;
}

.invoice-field input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 8px;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
  text-align: right;
}

.invoice-field input[type="number"] {
  direction: ltr;
  text-align: left;
}

.invoice-field > small {
  display: block;
  margin: 5px 2px 0;
  color: var(--muted);
  font-size: 5.8px;
  line-height: 1.65;
}

.invoice-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.invoice-party-card,
.invoice-total-card,
.invoice-collection-card {
  padding: 12px;
  display: flex;
  flex-direction: column;
  border: 1px dashed #999;
  border-radius: 14px;
  background: #f5f6f5;
}

.invoice-party-card span,
.invoice-total-card span,
.invoice-collection-card small,
.invoice-party-card small,
.invoice-total-card small {
  color: var(--muted);
  font-size: 6px;
}

.invoice-party-card strong {
  margin-top: 3px;
  font-size: 9px;
}

.invoice-total-card strong {
  margin: 4px 0;
  direction: ltr;
  font-size: 16px;
}

.invoice-document,
.invoice-payment-receipt {
  overflow: hidden;
  border: 1px solid #111;
  border-radius: 18px;
  background: #fff;
}

.invoice-document > header,
.invoice-payment-receipt > header {
  padding: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  background: #111;
}

.invoice-document > header > span,
.invoice-payment-receipt > header {
  display: flex;
  flex-direction: column;
}

.invoice-document header small,
.invoice-payment-receipt header span {
  color: #aaa;
  font-size: 5.5px;
}

.invoice-document header strong {
  font-size: 9px;
}

.invoice-document header b {
  padding: 4px 7px;
  border: 1px solid #666;
  border-radius: 7px;
  font-size: 6px;
}

.invoice-document dl,
.invoice-payment-receipt dl {
  margin: 0;
  padding: 3px 13px;
}

.invoice-document dl > div,
.invoice-payment-receipt dl > div {
  min-height: 39px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #ddd;
  font-size: 6.5px;
}

.invoice-document dl > div:last-child,
.invoice-payment-receipt dl > div:last-child {
  border-bottom: 0;
}

.invoice-document dt,
.invoice-payment-receipt dt {
  color: var(--muted);
}

.invoice-document dd,
.invoice-payment-receipt dd {
  margin: 0;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  text-align: left;
}

.invoice-document > footer {
  padding: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #111;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-document footer strong {
  direction: ltr;
  font-size: 13px;
}

.invoice-review-confirm {
  display: block;
  margin: 13px 0;
  cursor: pointer;
}

.invoice-review-confirm > input {
  position: absolute;
  opacity: 0;
}

.invoice-review-confirm > span {
  min-height: 58px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border: 1px solid #bbb;
  border-radius: 14px;
}

.invoice-review-confirm b {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid #111;
  border-radius: 7px;
}

.invoice-review-confirm b svg {
  width: 12px;
  opacity: 0;
}

.invoice-review-confirm input:checked + span {
  border-color: #111;
  background: #f4f4f4;
}

.invoice-review-confirm input:checked + span b {
  color: #fff;
  background: #111;
}

.invoice-review-confirm input:checked + span b svg {
  opacity: 1;
}

.invoice-review-confirm strong {
  font-size: 7.5px;
}

.invoice-review-confirm small {
  color: var(--muted);
  font-size: 6px;
  line-height: 1.65;
}

.invoice-state-hero {
  margin: 38px 0 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.invoice-state-hero > span {
  width: 74px;
  height: 74px;
  margin-bottom: 18px;
  display: grid;
  place-items: center;
  border: 1px solid #111;
  border-radius: 24px;
  color: #fff;
  background: #111;
  font-size: 22px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-state-hero.compact {
  margin-top: 25px;
}

.invoice-state-hero.compact > span {
  width: 58px;
  height: 58px;
  margin-bottom: 13px;
  border-radius: 18px;
  font-size: 17px;
}

.invoice-state-hero > p {
  margin: 0 0 4px;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-state-hero h1 {
  margin: 0;
  font-size: 22px;
}

.invoice-state-hero small {
  max-width: 330px;
  margin-top: 7px;
  color: var(--muted);
  font-size: 6.5px;
  line-height: 1.8;
}

.invoice-link-card {
  margin-bottom: 13px;
  padding: 13px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 10px;
  border: 1px solid #111;
  border-radius: 15px;
  background: #f5f6f5;
}

.invoice-link-card small {
  color: var(--muted);
  font-size: 6px;
}

.invoice-link-card strong {
  grid-column: 1;
  font-size: 8px;
  text-align: right;
}

.invoice-link-card button {
  min-height: 34px;
  padding: 0 10px;
  grid-column: 2;
  grid-row: 1 / 3;
  border: 1px solid #111;
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-status-timeline {
  margin: 0 0 15px;
  overflow: hidden;
  border: 1px solid #ccc;
  border-radius: 15px;
  background: #fff;
}

.invoice-status-timeline li.done > i {
  color: #fff;
  border-color: #111;
  background: #111;
}

.invoice-status-timeline li.active > i {
  border: 6px solid #ddd;
  box-shadow: inset 0 0 0 2px #111;
}

.invoice-decision {
  overflow: hidden;
  border: 1px solid #111;
  border-radius: 18px;
}

.invoice-decision > header {
  padding: 12px 13px;
  border-bottom: 1px solid #111;
  background: #f4f5f4;
}

.invoice-decision header small {
  color: var(--muted);
  font-size: 6px;
}

.invoice-decision header h2 {
  margin: 2px 0 0;
  font-size: 12px;
}

.invoice-decision article {
  padding: 13px;
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #ddd;
}

.invoice-decision article:last-child {
  border-bottom: 0;
}

.invoice-decision article > strong {
  margin-top: 4px;
  font-size: 10px;
}

.invoice-decision article > p {
  margin-bottom: 10px;
}

.invoice-decision article > button {
  min-height: 39px;
  border: 1px solid #111;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-decision article.emphasis > button {
  border-color: #fff;
}

.invoice-collection-card {
  margin: 18px 0 14px;
  align-items: center;
  border-style: solid;
  border-color: #111;
  text-align: center;
}

.invoice-collection-card strong {
  margin: 5px 0;
  direction: ltr;
  font-size: 20px;
}

.invoice-collection-card span {
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.invoice-payment-receipt {
  margin-bottom: 16px;
}

.invoice-payment-receipt > header {
  align-items: flex-start;
}

.invoice-payment-receipt header strong {
  margin-top: 4px;
  direction: ltr;
  font-size: 17px;
}

.receive-choice-note {
  margin: 12px 0 0;
  padding: 10px 11px;
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  background: #f1f2f1;
}

.receive-choice-note strong {
  font-size: 7px;
}

.receive-choice-note span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.75;
}

.receive-method-guide {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid #111;
  border-radius: 17px;
  background: #fff;
}

.receive-method-guide article,
.receive-facts article {
  min-height: 62px;
  padding: 9px 11px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid #ddd;
}

.receive-method-guide article:last-child,
.receive-facts article:last-child {
  border-bottom: 0;
}

.receive-method-guide i,
.receive-facts article > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #fff;
  background: #111;
  font-size: 8px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.receive-method-guide article > span,
.receive-facts article > div {
  display: flex;
  flex-direction: column;
}

.receive-method-guide strong,
.receive-facts strong {
  font-size: 7.5px;
}

.receive-method-guide small,
.receive-facts small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.65;
}

.receive-iban-card {
  margin-top: 19px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  border-radius: 19px;
  color: #fff;
  background: #111;
}

.receive-iban-card > small {
  color: #aaa;
  font-size: 6px;
}

.receive-iban-card > strong {
  margin-top: 3px;
  font-size: 11px;
}

.receive-iban-card > span {
  margin: 15px 0;
  font-size: 10px;
  letter-spacing: .03em;
  text-align: left;
}

.receive-iban-card > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.receive-iban-card button {
  min-height: 39px;
  border: 1px solid #fff;
  border-radius: 10px;
  color: #111;
  background: #fff;
  font: inherit;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.receive-iban-card button:last-child {
  color: #fff;
  background: transparent;
}

.receive-facts {
  margin: 13px 0;
  overflow: hidden;
  border: 1px solid #ccc;
  border-radius: 16px;
  background: #fff;
}

.receive-use-case {
  margin: 2px 0 14px;
  padding: 11px 12px;
  display: flex;
  flex-direction: column;
  border: 1px dashed #999;
  border-radius: 14px;
  background: #f5f6f5;
}

.receive-use-case > span {
  color: var(--muted);
  font-size: 6px;
}

.receive-use-case > strong {
  margin-top: 3px;
  font-size: 8px;
}

.receive-use-case > p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 6px;
  line-height: 1.7;
}

.pos-type-options {
  margin: 18px 0 13px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pos-type-options > button {
  width: 100%;
  min-height: 72px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 35px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 9px;
  border: 1px solid #bbb;
  border-radius: 15px;
  background: #fff;
  text-align: right;
}

.pos-type-options > button.selected {
  border-color: #111;
  background: #f3f4f3;
  box-shadow: inset 0 0 0 1px #111;
}

.pos-type-options button > span {
  width: 33px;
  height: 33px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: #111;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.pos-type-options button > div {
  display: flex;
  flex-direction: column;
}

.pos-type-options strong {
  font-size: 8px;
}

.pos-type-options small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 6px;
}

.pos-type-options i {
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  border: 1px solid #aaa;
  border-radius: 50%;
  color: transparent;
  font-size: 7px;
  font-style: normal;
}

.pos-type-options button.selected i {
  color: #fff;
  border-color: #111;
  background: #111;
}

.hub-scenario-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.hub-scenario-buttons button {
  min-height: 39px;
  padding: 5px 6px;
  border: 1px solid #ccc;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 7px;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
}

.hub-scenario-buttons button.active {
  color: #fff;
  border-color: #111;
  background: #111;
}

.connected-scenario-buttons {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 390px) {
  .finance-tool-grid {
    gap: 6px;
  }

  .finance-tool-grid > button {
    padding: 10px 8px;
  }

  .invoice-comparison {
    grid-template-columns: 1fr;
  }
}

/* Home concept switcher: the current home remains untouched in its own layout. */
.home-layout[hidden],
.bottom-nav[hidden] {
  display: none !important;
}

.home-variant-control {
  padding: 11px;
  display: grid;
  gap: 8px;
  border: 1px solid #c9c9c9;
  border-radius: 14px;
  background: #f5f5f5;
}

.home-variant-tabs {
  padding: 3px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  border: 1px solid #111;
  border-radius: 11px;
  background: #fff;
}

.home-variant-tabs button {
  min-height: 38px !important;
  border: 0 !important;
  border-radius: 8px !important;
}

.home-variant-tabs button.active {
  color: #fff;
  background: #0056F5;
}

.home-variant-control > p {
  margin: 0;
  color: var(--muted);
  font-size: 6.5px;
  line-height: 1.8;
}

.bottom-nav-next {
  height: 82px;
  right: 10px;
  bottom: max(15px, env(safe-area-inset-bottom));
  left: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 7px 8px 8px;
  overflow: visible;
  border: 1px solid rgba(17, 17, 17, .12);
  border-radius: 64px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 14px 34px rgba(17, 17, 17, .14), 0 3px 9px rgba(17, 17, 17, .07);
  -webkit-backdrop-filter: blur(32px) saturate(155%);
  backdrop-filter: blur(32px) saturate(155%);
  transform-origin: center bottom;
  will-change: right, left, height, padding, border-radius;
  transition: right .32s cubic-bezier(.22, 1, .36, 1), left .32s cubic-bezier(.22, 1, .36, 1), height .32s cubic-bezier(.22, 1, .36, 1), padding .32s cubic-bezier(.22, 1, .36, 1), border-radius .32s cubic-bezier(.22, 1, .36, 1), background-color .24s ease, box-shadow .24s ease;
}

.bottom-nav-next button {
  min-width: 0;
  min-height: 64px;
  padding: 4px 0 2px;
  gap: 5px;
  position: relative;
  border-radius: 16px;
  color: #666;
  background: transparent;
  font-family:"Vazirmatn SemiBold",Tahoma,sans-serif;
  -webkit-tap-highlight-color: transparent;
  transition: color .18s ease, transform .18s ease, min-height .32s cubic-bezier(.22, 1, .36, 1), padding .24s ease, gap .24s ease;
}

.bottom-nav-next button.active {
  color: #0056F5;
  background: transparent;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.bottom-nav-next button.active::after {
  display: none;
}

.bottom-nav-next .bottom-nav-icon {
  width: 40px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: transparent;
  transition: width .28s cubic-bezier(.22, 1, .36, 1), height .28s cubic-bezier(.22, 1, .36, 1), background-color .18s ease, transform .18s ease;
}

.bottom-nav-next button.active .bottom-nav-icon {
  color: #0056F5;
  background: transparent;
  transform: translateY(-.5px) scale(1.04);
}

.bottom-nav-next svg {
  width: 24px;
  height: 24px;
  display: block;
  stroke-width: 1.85;
  transition: stroke-width .18s ease, transform .18s ease;
}

.bottom-nav-next button.active svg {
  stroke-width: 2.15;
  filter: none;
}

.bottom-nav-next button > span:last-child {
  max-height: 14px;
  overflow: hidden;
  opacity: 1;
  line-height: 1.2 !important;
  letter-spacing: -.01em;
  white-space: nowrap;
  transform: translateY(0) scale(1);
  transform-origin: center top;
  transition: max-height .24s cubic-bezier(.22, 1, .36, 1), opacity .14s ease, transform .24s cubic-bezier(.22, 1, .36, 1);
}

.bottom-nav-next.is-compact {
  height: 54px;
  right: 70px;
  left: 70px;
  padding: 4px 10px;
  border-radius: 28px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 10px 26px rgba(17, 17, 17, .13), 0 2px 7px rgba(17, 17, 17, .06);
}

.bottom-nav-next.is-compact button {
  min-height: 44px;
  padding: 0;
  gap: 0;
}

.bottom-nav-next.is-compact .bottom-nav-icon {
  width: 36px;
  height: 36px;
}

.bottom-nav-next.is-compact button > span:last-child {
  max-height: 0;
  opacity: 0;
  transform: translateY(5px) scale(.88);
}

.bottom-nav-next.is-compact button.active .bottom-nav-icon {
  transform: scale(1.08);
}

.bottom-nav-next button:active {
  transform: scale(.96);
}

.bottom-nav-next button:active .bottom-nav-icon {
  transform: scale(.94);
}

.bottom-nav-next button:focus-visible {
  outline-color: #0056F5;
  outline-offset: -2px;
}

.home-variant-next .app-screen:not(.focused-screen) {
  padding-bottom: 116px;
}

.home-variant-next #screen-home,
.home-variant-next #screen-business {
  padding-bottom: 148px;
}

@media (prefers-reduced-motion: reduce) {
  .bottom-nav-next,
  .bottom-nav-next button,
  .bottom-nav-next .bottom-nav-icon,
  .bottom-nav-next svg,
  .bottom-nav-next button > span:last-child {
    transition: none;
  }
}

.app-shell:not(.home-variant-next) .next-header-card-shortcut {
  display: none;
}

.header-actions .next-header-card-shortcut {
  position: relative;
  color: #2B5484;
  border-color: #c9c9c9;
  background: #fff;
}

.header-actions .next-header-card-shortcut::after {
  content: "";
  width: 9px;
  height: 9px;
  position: absolute;
  top: -3px;
  left: -3px;
  box-sizing: border-box;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #0E84FF;
}

.header-actions .next-header-card-shortcut.is-frozen::after {
  background: #a96648;
}

.header-actions .next-header-card-shortcut.is-empty::after,
.header-actions .next-header-card-shortcut.is-pending::after {
  width: 17px;
  height: 17px;
  top: -6px;
  left: -6px;
  display: grid;
  place-items: center;
  border-width: 2px;
  color: #fff;
  background: #0056F5;
  font-size: 11px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  line-height: 1;
}

.header-actions .next-header-card-shortcut.is-empty::after {
  content: "+";
}

.header-actions .next-header-card-shortcut.is-pending::after {
  content: "…";
  padding-bottom: 5px;
  color: #70472f;
  background: #f1dfd4;
}

.home-variant-next,
.home-layout-next,
.next-top-level-screen {
  --next-app-background: #f5f6f8;
  --next-accent: #2B5484;
  --next-brand: #0056F5;
  --next-brand-bright: #0E84FF;
  --next-accent-soft: #f5f5f5;
  --next-surface: #f5f5f5;
  --next-line: #d4d4d4;
}

.app-shell.home-variant-next,
.home-variant-next .app-header,
.home-variant-next .screen-stack,
.home-variant-next .app-screen {
  background: var(--next-app-background);
}

.home-variant-next .app-header {
  border-bottom-color: #e0e1e4;
}

.next-home-account {
  padding: 15px;
  border: 1px solid #c9c9c9;
  border-radius: 22px;
  background: linear-gradient(145deg, #fff 0%, #f5f5f5 100%);
  box-shadow: 0 8px 24px rgba(17, 17, 17, .06);
}

.next-home-account > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.next-home-account > header > span,
.next-home-balance,
.next-home-section-header > div {
  display: flex;
  flex-direction: column;
}

.next-home-account > header small,
.next-home-section-header > div > span {
  color: #666;
  font-size: 6.5px;
  font-family:"Vazirmatn Bold",Tahoma,sans-serif;
}

.next-home-account > header strong {
  margin-top: 2px;
  font-size: 10px;
}

.next-home-account > header button,
.next-home-section-header > button {
  padding: 0;
  display: flex;
  align-items: center;
  gap: 3px;
  border: 0;
  background: transparent;
  color: var(--next-accent);
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-home-account > header button svg {
  width: 13px;
}

.next-home-balance {
  margin-top: 20px;
}

.next-home-balance > span {
  color: #666;
  font-size: 7px;
}

.next-home-balance > div {
  margin-top: 2px;
  display: flex;
  align-items: baseline;
  gap: 6px;
  direction: ltr;
  justify-content: flex-end;
}

.next-home-balance > div strong {
  color: #2B5484;
  font-size: 29px;
  letter-spacing: -.04em;
}

.next-home-balance > div small {
  color: #666;
}

.next-home-balance > p {
  margin: 3px 0 0;
  color: #666;
  font-size: 6.5px;
}

.next-home-account-actions {
  margin-top: 18px;
  padding-top: 14px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  border-top: 1px solid var(--next-line);
}

.next-home-account-actions button {
  min-width: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  border: 0;
  background: transparent;
}

.next-home-account-actions button > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #c9c9c9;
  border-radius: 13px;
  color: var(--next-accent);
  background: #fff;
}

.next-home-account-actions svg {
  width: 18px;
}

.next-home-account-actions strong {
  max-width: 100%;
  overflow: hidden;
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-home-section {
  margin-top: 28px;
}

.next-home-section-header {
  margin-bottom: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.next-home-section-header h2 {
  margin: 1px 0 0;
  font-size: 17px;
}

.next-home-title-row {
  margin-top: 1px;
  display: flex;
  align-items: center;
  gap: 7px;
}

.next-home-title-row h2 {
  margin: 0;
}

.next-home-title-row .next-home-info-button {
  width: 23px;
  min-width: 23px;
  height: 23px;
  min-height: 23px;
  flex: 0 0 23px;
  color: var(--next-accent);
  border-color: #2B5484 !important;
  background: #fff !important;
}

.next-home-section-header > b {
  padding: 4px 7px;
  border-radius: 8px;
  color: var(--next-accent);
  background: var(--next-accent-soft);
  font-size: 7px;
}

.next-home-task-list {
  overflow: hidden;
  border: 1px solid var(--next-line);
  border-radius: 17px;
  background: #fff;
}

.next-home-task-list > button {
  width: 100%;
  min-height: 76px;
  padding: 10px 11px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid var(--next-line);
  background: #fff;
  text-align: right;
}

.next-home-task-list > button:last-child {
  border-bottom: 0;
}

.next-home-task-list > button.urgent .next-home-line-icon {
  color: #7b422c;
  border-color: #d5b6a8;
  background: #faf3ef;
}

.next-home-task-list > button.waiting .next-home-line-icon {
  color: #735d2e;
  border-color: #d4c7a7;
  background: #faf7ef;
}

.next-home-line-icon {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border: 1px solid #c9c9c9;
  border-radius: 12px;
  color: var(--next-accent);
  background: var(--next-surface);
}

.next-home-line-icon svg {
  width: 18px;
}

.next-home-task-list button > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-home-task-list small,
.next-home-task-list i {
  color: #666;
  font-size: 6.5px;
  font-style: normal;
}

.next-home-task-list strong {
  margin: 1px 0;
  font-size: 9px;
}

.next-home-task-list em {
  padding: 5px 7px;
  border: 1px solid var(--next-accent);
  border-radius: 9px;
  color: var(--next-accent);
  font-size: 6.5px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  white-space: nowrap;
}

.next-home-feature-list {
  display: flex;
  gap: 9px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.next-home-feature-list::-webkit-scrollbar {
  display: none;
}

.next-home-feature-list > button {
  min-width: 0;
  min-height: 150px;
  padding: 14px;
  flex: 0 0 86%;
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  align-items: start;
  gap: 11px;
  border: 1px solid #c9c9c9;
  border-radius: 18px;
  color: #2B5484;
  background: linear-gradient(145deg, #fff, #f5f5f5);
  text-align: right;
  scroll-snap-align: start;
}

.next-home-feature-list > button:only-child {
  flex-basis: 100%;
}

.next-home-feature-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #2B5484;
  border-radius: 13px;
  color: var(--next-accent);
  background: #fff;
}

.next-home-feature-icon svg {
  width: 19px;
}

.next-home-feature-list button > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-home-feature-list small,
.next-home-feature-list i {
  color: #666;
  font-size: 6.5px;
  font-style: normal;
}

.next-home-feature-list strong {
  margin: 3px 0;
  font-size: 10px;
}

.next-home-feature-list i {
  line-height: 1.8;
}

.next-home-feature-list b {
  width: max-content;
  margin-top: 10px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--next-accent);
  font-size: 7px;
}

.next-home-scf-card {
  width: 100%;
  min-height: 202px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  border: 1px solid #2B5484;
  border-radius: 21px;
  color: #2B5484;
  background: linear-gradient(145deg, #fff 0%, #f5f5f5 100%);
  text-align: right;
  box-shadow: 0 10px 28px rgba(17, 17, 17, .08);
}

.next-home-scf-card > header,
.next-home-scf-card > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.next-home-scf-card > header > span {
  min-width: 45px;
  min-height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--next-accent);
  border-radius: 9px;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  letter-spacing: .08em;
}

.next-home-scf-card > header > i {
  font-size: 7px;
  font-style: normal;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
}

.next-home-scf-card > div {
  margin: 27px 0 24px;
  display: flex;
  flex-direction: column;
}

.next-home-scf-card > div small {
  color: #2B5484;
}

.next-home-scf-card > div strong {
  margin: 3px 0;
  font-size: 27px;
  letter-spacing: -.035em;
}

.next-home-scf-card > div span {
  color: #2B5484;
  font-size: 7px;
}

.next-home-scf-card > footer {
  margin-top: auto;
  padding-top: 11px;
  border-top: 1px solid #d4d4d4;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-home-scf-card > footer svg {
  width: 15px;
}

.next-home-cashflow-summary {
  width: 100%;
  min-height: 220px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--next-line);
  border-radius: 18px;
  background: #fff;
  text-align: right;
}

.next-home-cashflow-summary-main {
  display: flex;
  flex-direction: column;
}

.next-home-cashflow-summary-main > span {
  margin-top: 3px;
  display: flex;
  align-items: baseline;
  gap: 6px;
  direction: ltr;
  justify-content: flex-end;
}

.next-home-cashflow-summary-main small,
.next-home-cashflow-summary-main i {
  color: #666;
  font-size: 6.5px;
  font-style: normal;
}

.next-home-cashflow-summary-main strong {
  color: var(--next-accent);
  font-size: 22px;
  letter-spacing: -.025em;
}

.next-home-cashflow-summary-main > b {
  width: max-content;
  margin-top: 5px;
  padding: 4px 7px;
  border-radius: 8px;
  color: var(--next-accent);
  background: var(--next-accent-soft);
  font-size: 7px;
}

.next-home-cashflow-summary-metrics {
  margin-top: 14px;
  padding: 11px 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--next-line);
  border-bottom: 1px solid var(--next-line);
}

.next-home-cashflow-summary-metrics > span {
  min-width: 0;
  padding: 0 10px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--next-line);
}

.next-home-cashflow-summary-metrics > span:first-child {
  padding-right: 0;
}

.next-home-cashflow-summary-metrics > span:last-child {
  padding-left: 0;
  border-left: 0;
}

.next-home-cashflow-summary-metrics small,
.next-home-cashflow-summary-metrics i {
  color: #666;
  font-size: 6px;
  font-style: normal;
}

.next-home-cashflow-summary-metrics strong {
  margin: 2px 0;
  font-size: 8px;
}

.next-home-cashflow-summary-action {
  margin-top: 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.next-home-cashflow-summary-action > span {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #666;
  font-size: 6px;
}

.next-home-cashflow-summary-action > span svg,
.next-home-cashflow-summary-action > b svg {
  width: 13px;
}

.next-home-cashflow-summary-action > b {
  display: flex;
  align-items: center;
  gap: 3px;
  color: var(--next-accent);
  font-size: 7px;
  white-space: nowrap;
}

.next-home-cashflow-breakdown {
  margin: 13px 0;
  display: grid;
}

.next-home-cashflow-breakdown > span {
  min-height: 51px;
  position: relative;
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.next-home-cashflow-breakdown > span:not(:last-child)::after {
  content: "";
  width: 1px;
  position: absolute;
  top: 31px;
  right: 5px;
  bottom: -20px;
  background: #d4d4d4;
}

.next-home-cashflow-breakdown > span > i {
  width: 11px;
  height: 11px;
  z-index: 1;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #666;
  box-shadow: 0 0 0 1px #999;
}

.next-home-cashflow-breakdown > span.in > i {
  background: var(--next-accent);
  box-shadow: 0 0 0 1px var(--next-accent);
}

.next-home-cashflow-breakdown > span.out > i {
  background: #a56b52;
  box-shadow: 0 0 0 1px #a56b52;
}

.next-home-cashflow-breakdown > span.estimated > i {
  background: #fff;
}

.next-home-cashflow-breakdown > span > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-home-cashflow-breakdown small {
  color: #666;
  font-size: 6px;
}

.next-home-cashflow-breakdown strong {
  margin-top: 1px;
  font-size: 8px;
}

.next-home-cashflow-breakdown > span > b {
  color: #555;
  font-size: 8px;
  white-space: nowrap;
}

.next-home-cashflow-breakdown > span.in > b {
  color: var(--next-accent);
}

.next-home-cashflow-breakdown > span.out > b {
  color: #87513a;
}

.next-home-cashflow-equation {
  min-height: 42px;
  margin: -1px 0 12px;
  padding: 7px 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--next-line);
  border-radius: 11px;
  background: var(--next-surface);
}

.next-home-cashflow-equation b {
  color: #444;
  font-size: 8px;
  white-space: nowrap;
}

.next-home-cashflow-equation small {
  color: #666;
  font-size: 6px;
  white-space: nowrap;
}

.next-home-cashflow-low {
  min-height: 55px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border: 1px solid #d8c5bb;
  border-radius: 13px;
  color: #6e432f;
  background: #faf5f2;
}

.next-home-cashflow-low > svg {
  width: 18px;
}

.next-home-cashflow-low > span {
  display: flex;
  flex-direction: column;
}

.next-home-cashflow-low small {
  color: #805d4b;
  font-size: 6px;
}

.next-home-cashflow-low strong {
  margin-top: 1px;
  font-size: 8px;
}

.next-home-tool-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.next-home-tool-grid > button {
  min-height: 119px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid var(--next-line);
  border-radius: 17px;
  background: #fff;
  text-align: right;
}

.next-home-tool-grid button > span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid #c9c9c9;
  border-radius: 11px;
  color: var(--next-accent);
  background: var(--next-surface);
}

.next-home-tool-grid svg {
  width: 17px;
}

.next-home-tool-grid strong {
  margin-top: 10px;
  font-size: 9px;
}

.next-home-tool-grid small {
  margin-top: 2px;
  color: #666;
  font-size: 6.5px;
}

.next-home-activity {
  padding: 15px 14px 5px;
  overflow: hidden;
  border: 1px solid var(--next-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(17, 17, 17, .05);
}

.next-home-activity .next-home-section-header {
  margin-bottom: 9px;
}

.next-home-activity-list {
  overflow: hidden;
  border-top: 1px solid #c9c9c9;
  border-bottom: 0;
}

.next-home-activity-list > button {
  width: 100%;
  min-height: 69px;
  padding: 9px 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto 14px;
  align-items: center;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid var(--next-line);
  background: transparent;
  text-align: right;
}

.next-home-activity-list > button:last-child {
  border-bottom: 0;
}

.next-home-activity-list button > span:first-child {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: var(--next-accent);
  background: var(--next-surface);
}

.next-home-activity-list button > span:first-child svg {
  width: 17px;
}

.next-home-activity-list button > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-home-activity-list small {
  overflow: hidden;
  color: #666;
  font-size: 6.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-home-activity-list strong {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-home-activity-list b {
  max-width: 104px;
  font-size: 7px;
  text-align: left;
  white-space: nowrap;
}

.next-home-activity-list > button > svg {
  width: 13px;
  color: #666;
}

.next-home-promo {
  min-height: 205px;
  margin: 31px 0 4px;
  padding: 16px;
  position: relative;
  display: grid;
  grid-template-columns: 49px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  overflow: hidden;
  border: 1px solid #c9c9c9;
  border-radius: 20px;
  background: #fbfcfd;
}

.next-home-promo::after {
  content: "";
  width: 130px;
  height: 130px;
  position: absolute;
  bottom: -76px;
  left: -42px;
  border: 24px solid #e2e6eb;
  border-radius: 50%;
  pointer-events: none;
}

.next-home-promo-dismiss {
  width: 31px;
  min-height: 31px;
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  color: #666;
  background: #fff;
}

.next-home-promo-dismiss svg {
  width: 14px;
}

.next-home-promo-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid #2B5484;
  border-radius: 14px;
  color: var(--next-accent);
  background: #fff;
}

.next-home-promo-mark svg {
  width: 22px;
}

.next-home-promo > div {
  min-width: 0;
  padding-left: 30px;
}

.next-home-promo > div small {
  color: var(--next-accent);
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-home-promo h2 {
  margin: 4px 0 5px;
  font-size: 16px;
  line-height: 1.55;
}

.next-home-promo p {
  margin: 0;
  color: #666;
  font-size: 7px;
  line-height: 1.9;
}

.next-home-promo-action {
  min-height: 40px;
  padding: 0;
  grid-column: 1 / -1;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 4px;
  border: 0;
  color: var(--next-accent);
  background: transparent;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-home-promo-action svg {
  width: 14px;
}

.next-page-intro {
  margin: 5px 0 25px;
}

.next-page-intro > span {
  color: var(--next-accent);
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-page-intro h1 {
  margin: 2px 0 3px;
  font-size: 25px;
}

.next-page-intro p,
.next-destination-section > header p {
  margin: 0;
  color: #666;
  font-size: 7px;
}

.next-business-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid #c9c9c9;
  border-radius: 17px;
  background: var(--next-surface);
}

.next-business-summary article {
  min-width: 0;
  padding: 12px 9px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--next-line);
}

.next-business-summary article:last-child {
  border-left: 0;
}

.next-business-summary small,
.next-business-summary span {
  color: #666;
  font-size: 6px;
}

.next-business-summary strong {
  margin: 6px 0 1px;
  color: var(--next-accent);
  font-size: 12px;
}

.next-destination-section,
.next-more-group {
  margin-top: 27px;
}

.next-destination-section > header,
.next-more-group > header {
  margin-bottom: 10px;
}

.next-destination-section h2,
.next-more-group h2 {
  margin: 0;
  font-size: 17px;
}

.next-business-destination-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.next-business-destination-grid > button {
  min-height: 135px;
  padding: 13px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid var(--next-line);
  border-radius: 17px;
  background: #fff;
  text-align: right;
}

.next-business-destination-grid button > span,
.next-more-group button > span:first-child {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border: 1px solid #c9c9c9;
  border-radius: 12px;
  color: var(--next-accent);
  background: var(--next-surface);
}

.next-business-destination-grid svg,
.next-more-group button > span:first-child svg {
  width: 18px;
}

.next-business-destination-grid strong {
  margin-top: 12px;
  font-size: 9px;
}

.next-business-destination-grid small {
  margin-top: 3px;
  color: #666;
  font-size: 6.5px;
}

.next-business-scf-entry {
  width: 100%;
  min-height: 105px;
  margin-top: 25px;
  padding: 13px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 15px;
  align-items: center;
  gap: 11px;
  border: 1px solid #2B5484;
  border-radius: 18px;
  color: #2B5484;
  background: var(--next-accent-soft);
  text-align: right;
}

.next-payment-primary {
  width: 100%;
  min-height: 112px;
  padding: 14px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 15px;
  align-items: center;
  gap: 11px;
  border: 1px solid #2B5484;
  border-radius: 19px;
  color: #2B5484;
  background: linear-gradient(145deg, #fff, #f5f5f5);
  text-align: right;
  box-shadow: 0 8px 24px rgba(17, 17, 17, .07);
}

.next-payment-primary > span:first-child {
  width: 47px;
  height: 47px;
  display: grid;
  place-items: center;
  border: 1px solid var(--next-accent);
  border-radius: 14px;
  background: #fff;
}

.next-payment-primary > span:first-child svg {
  width: 21px;
}

.next-payment-primary > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-payment-primary small,
.next-payment-primary i {
  color: #2B5484;
  font-size: 6.5px;
  font-style: normal;
}

.next-payment-primary strong {
  margin: 2px 0;
  font-size: 11px;
}

.next-payment-primary > svg {
  width: 14px;
}

.next-payment-upcoming {
  min-height: 82px;
  margin-top: 24px;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px dashed #c9c9c9;
  border-radius: 16px;
  background: var(--next-surface);
}

.next-payment-upcoming > header {
  display: flex;
  flex-direction: column;
}

.next-payment-upcoming span,
.next-payment-upcoming small {
  color: #666;
  font-size: 6.5px;
}

.next-payment-upcoming button {
  min-height: 36px;
  padding: 0 9px;
  border: 1px solid var(--next-accent);
  border-radius: 10px;
  color: var(--next-accent);
  background: #fff;
  font-size: 7px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
  white-space: nowrap;
}

.next-business-scf-entry > span:first-child {
  height: 39px;
  display: grid;
  place-items: center;
  border: 1px solid var(--next-accent);
  border-radius: 11px;
  font-size: 8px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-business-scf-entry > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-business-scf-entry small,
.next-business-scf-entry i {
  color: #2B5484;
  font-size: 6.5px;
  font-style: normal;
}

.next-business-scf-entry > svg {
  width: 14px;
}

.next-connected-links,
.next-more-group > div {
  overflow: hidden;
  border: 1px solid var(--next-line);
  border-radius: 17px;
  background: #fff;
}

.next-connected-links > button,
.next-more-group button {
  width: 100%;
  min-height: 72px;
  padding: 9px 11px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid var(--next-line);
  background: #fff;
  text-align: right;
}

.next-connected-links > button:last-child,
.next-more-group button:last-child {
  border-bottom: 0;
}

.next-connected-links > button > svg {
  width: 19px;
  color: var(--next-accent);
}

.next-connected-links button > span,
.next-more-group button > span:nth-child(2) {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.next-connected-links small,
.next-more-group small {
  color: #666;
  font-size: 6.5px;
}

.next-connected-links em {
  padding: 4px 6px;
  border-radius: 7px;
  color: var(--next-accent);
  background: var(--next-accent-soft);
  font-size: 6px;
  font-style: normal;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.next-more-group button {
  grid-template-columns: 40px minmax(0, 1fr) 14px;
}

.next-more-group button > svg {
  width: 14px;
  color: #666;
}

@media (max-width: 390px) {
  .next-home-account {
    padding: 13px;
  }

  .next-home-account-actions {
    gap: 3px;
  }

  .next-home-account-actions button > span {
    width: 39px;
    height: 39px;
  }

  .next-business-summary article {
    padding-right: 6px;
    padding-left: 6px;
  }
}

/* SCF case workspace: list first, then one clearly selected case. */
.scf-list-intro > span {
  display: block;
  max-width: 300px;
  margin-top: 4px;
  line-height: 1.7;
}

.scf-case-summary {
  margin-top: 18px;
  padding: 5px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  border: 1px solid #d3d7dc;
  border-radius: 17px;
  background: #f7f8fa;
}

.scf-case-summary article {
  min-width: 0;
  min-height: 65px;
  padding: 10px 7px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 12px;
  background: #fff;
}

.scf-case-summary article.action {
  color: #6e4b0b;
  background: #fff5df;
}

.scf-case-summary strong {
  font-size: 17px;
  line-height: 1;
}

.scf-case-summary span {
  margin-top: 5px;
  color: #646b73;
  font-size: 6px;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
}

.scf-case-summary article.action span {
  color: #6e4b0b;
}

.scf-case-filters {
  margin-top: 14px;
  padding-bottom: 5px;
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.scf-case-filters::-webkit-scrollbar {
  display: none;
}

.scf-case-filters button {
  min-height: 34px;
  padding: 6px 9px;
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  border: 1px solid #cfd4da;
  border-radius: 10px;
  color: #59616a;
  background: #fff;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-case-filters button span {
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  background: #edf0f3;
  font-size: 5.5px;
}

.scf-case-filters button.active {
  color: #fff;
  border-color: #2b5484;
  background: #2b5484;
}

.scf-case-filters button.active span {
  color: #2b5484;
  background: #fff;
}

.scf-case-list {
  margin-top: 7px;
  display: grid;
  gap: 9px;
}

.scf-case-row {
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d1d5d9;
  border-radius: 16px;
  background: #fff;
  text-align: right;
}

.scf-case-row > header {
  min-height: 31px;
  padding: 7px 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  border-bottom: 1px solid #eceef0;
  background: #f7f8fa;
}

.scf-case-row > header span {
  padding: 3px 7px;
  border-radius: 7px;
  color: #2b5484;
  background: #eaf0f7;
  font-size: 6px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-case-row.needs-info > header span,
.scf-case-row.ready > header span {
  color: #6e4b0b;
  background: #fff0cb;
}

.scf-case-row.settled > header span {
  color: #17633f;
  background: #e6f4ec;
}

.scf-case-row > header small {
  color: #777f87;
  font-size: 5.5px;
}

.scf-case-row-main {
  padding: 12px 11px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.scf-case-row-main > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.scf-case-row-main small {
  color: #737a82;
  font-size: 5.7px;
}

.scf-case-row-main strong {
  margin-top: 2px;
  font-size: 9px;
}

.scf-case-row-main i {
  margin-top: 3px;
  overflow: hidden;
  color: #737a82;
  font-size: 5.5px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.scf-case-row-main > b {
  color: #2b5484;
  font-size: 8px;
  white-space: nowrap;
}

.scf-case-row > footer {
  min-height: 34px;
  padding: 7px 11px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  border-top: 1px solid #eceef0;
  color: #2b5484;
  font-size: 6.5px;
  font-family:"Vazirmatn Black",Tahoma,sans-serif;
}

.scf-case-row > footer svg {
  width: 12px;
}

.scf-case-empty {
  min-height: 120px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px dashed #cfd4da;
  border-radius: 16px;
  color: #646b73;
  text-align: center;
}

.scf-case-empty strong {
  color: #111;
  font-size: 9px;
}

.scf-case-empty small {
  margin-top: 4px;
  font-size: 6px;
}

/* Card detail — branded presentation for the new home experience only. */
.home-variant-next #screen-card-detail .physical-card {
  width: min(100%, 400px);
  margin: 20px auto 22px;
  padding: 20px 22px;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  color: #fff;
  background: #2B5484;
  box-shadow: 0 14px 30px rgba(20, 30, 43, 0.16);
}

.home-variant-next #screen-card-detail .physical-card::before,
.home-variant-next #screen-card-detail .physical-card::after {
  display: none;
}

.home-variant-next #screen-card-detail .physical-card > .card-top {
  position: relative;
  z-index: 1;
}

.home-variant-next #screen-card-detail .physical-card > .card-top > span {
  font-size: 9.5px;
  font-family:"Vazirmatn ExtraBold",Tahoma,sans-serif;
  letter-spacing: -0.01em;
}

.home-variant-next #screen-card-detail .physical-card > .card-top > i {
  padding: 4px 8px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: none;
  font-size: 6px;
}

.home-variant-next #screen-card-detail .physical-card.frozen > .card-top > i {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
}

.home-variant-next #screen-card-detail .physical-card > .card-hardware {
  margin-top: 20px;
  position: relative;
  z-index: 1;
  gap: 11px;
}

.home-variant-next #screen-card-detail .physical-card .chip {
  width: 41px;
  height: 30px;
  border-color: rgba(255, 255, 255, 0.7);
  background: #dfe3e7;
  box-shadow: none;
}

.home-variant-next #screen-card-detail .physical-card .chip::before {
  background: #80858b;
}

.home-variant-next #screen-card-detail .physical-card .chip::after {
  border-color: #80858b;
}

.home-variant-next #screen-card-detail .physical-card > .card-hardware > svg {
  color: #fff;
  filter: none;
}

.home-variant-next #screen-card-detail .physical-card > #card-detail-number {
  margin-top: 17px;
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
  text-shadow: none;
}

.home-variant-next #screen-card-detail .physical-card > footer {
  position: relative;
  z-index: 1;
}

.home-variant-next #screen-card-detail .physical-card .card-holder {
  gap: 2px;
}

.home-variant-next #screen-card-detail .physical-card .card-holder small {
  color: rgba(255, 255, 255, 0.7);
  font-size: 5.8px;
}

.home-variant-next #screen-card-detail .physical-card .card-holder strong,
.home-variant-next #screen-card-detail .physical-card .card-brand {
  color: #fff;
  font-size: 8.5px;
}

.home-variant-next #screen-card-detail .physical-card .card-brand {
  gap: 7px;
}

.home-variant-next #screen-card-detail .physical-card .card-brand > em::before,
.home-variant-next #screen-card-detail .physical-card .card-brand > em::after {
  background: #0E84FF;
}

@media (max-width: 390px) {
  .home-variant-next #screen-card-detail .physical-card {
    margin-top: 17px;
    padding: 18px 19px;
    border-radius: 22px;
  }

  .home-variant-next #screen-card-detail .physical-card > .card-hardware {
    margin-top: 15px;
  }

  .home-variant-next #screen-card-detail .physical-card > #card-detail-number {
    margin-top: 13px;
    font-size: 12.5px;
  }
}
.profile > span > svg {
  width: 20px;
  height: 20px;
}

/* Demo presentation mode and responsive control-center launcher. */
body,
.prototype-stage {
  transition: background-color 240ms ease;
}

body.demo-mode,
body.demo-mode .prototype-stage {
  background: #15191f;
}

.demo-mode-setting {
  min-height: 76px;
  padding: 11px 10px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 1px solid #d9dcdf;
  border-radius: 13px;
  background: #f7f8fa;
  cursor: pointer;
  transition: border-color 180ms ease, background-color 180ms ease;
}

.demo-mode-setting.is-active {
  border-color: #9ebce0;
  background: #f1f6fc;
}

.demo-mode-setting-icon {
  width: 33px;
  height: 33px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #2f5f97;
  background: #e8eef5;
}

.demo-mode-setting-icon svg {
  width: 16px;
  height: 16px;
}

.demo-mode-setting-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.demo-mode-setting-copy strong {
  font-size: 8px;
}

.demo-mode-setting-copy small {
  color: var(--muted);
  font-size: 6.3px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

.demo-control-launcher {
  display: none;
}

@media (max-width: 1199px) {
  body.demo-mode.mobile-scenario-open {
    overflow: hidden;
  }

  body.demo-mode .demo-control-launcher {
    width: 54px;
    height: 54px;
    padding: 0;
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
    z-index: 990;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 18px;
    color: #fff;
    background: #25588f;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
    transition: transform 180ms ease, background-color 180ms ease, opacity 180ms ease;
  }

  body.demo-mode .demo-control-launcher:hover {
    background: #1f4c7d;
    transform: translateY(-2px);
  }

  body.demo-mode .demo-control-launcher:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.9);
    outline-offset: 3px;
  }

  body.demo-mode .demo-control-launcher svg {
    width: 23px;
    height: 23px;
  }

  body.demo-mode.mobile-scenario-open .demo-control-launcher {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px) scale(0.88);
  }

  body.demo-mode .scenario-control.mobile-visible {
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: none;
    padding: 0;
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: block;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #f5f6f8;
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-desktop-header {
    display: none;
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-panel {
    width: 100%;
    max-width: 640px;
    height: 100%;
    margin: 0 auto;
    padding: 0 18px max(24px, env(safe-area-inset-bottom));
    display: flex;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-mobile-header {
    min-height: 76px;
    margin: 0 -18px 6px;
    padding: max(14px, env(safe-area-inset-top)) 18px 12px;
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #dde1e5;
    background: rgba(245, 246, 248, 0.96);
    backdrop-filter: blur(16px);
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-mobile-header strong {
    font-size: 15px;
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-mobile-header small {
    color: var(--muted);
    font-size: 10px;
  }

  body.demo-mode .scenario-control.mobile-visible .scenario-mobile-header > button {
    width: 42px;
    min-height: 42px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid #d6dade;
    border-radius: 13px;
    background: #fff;
    font-size: 22px;
    line-height: 1;
  }

  body.demo-mode .scenario-control.mobile-visible .demo-mode-setting {
    min-height: 84px;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    border-radius: 16px;
  }

  body.demo-mode .scenario-control.mobile-visible .demo-mode-setting-icon {
    width: 41px;
    height: 41px;
    border-radius: 13px;
  }

  body.demo-mode .scenario-control.mobile-visible .demo-mode-setting-copy strong {
    font-size: 13px;
  }

  body.demo-mode .scenario-control.mobile-visible .demo-mode-setting-copy small {
    font-size: 9px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body,
  .prototype-stage,
  .demo-control-launcher {
    transition: none !important;
  }
}