/*
 * PCMS stabilization layer
 *
 * Loaded after styles.css. This file deliberately fixes layout contracts rather
 * than hiding overflow: if a component grows, the document must expose the
 * defect while the component itself remains shrinkable.
 */

/* 1. Width and shrink contracts ------------------------------------------------ */
html,
body,
#app,
.shell,
.entry-bg {
  overflow-x: visible !important;
}

.content,
.topbar,
.topline,
.tabs,
.page-hero,
.card,
.grid,
.two,
.three,
.kpis,
.center-metrics,
.center-cashline,
.center-action-list,
.plan-main-grid,
.system-head-split,
.system-head-kpis,
.system-perspectives,
.system-category-grid,
.system-visuals,
.system-visual-panel,
.monthly-table,
.monthly-columns,
.monthly-group,
.monthly-group > summary,
.monthly-row,
.monthly-assessment,
.monthly-reconcile,
.monthly-bridge-flow,
.review-intelligence,
.review-chart,
.review-history,
.review-month,
.review-bars,
.review-bars > div,
.review-bridge,
.review-bridge > div,
.purpose-capital-panel,
.purpose-workspace,
.purpose-pools,
.purpose-pool-form,
.purpose-fields,
.purpose-choices,
.kpi-timeline,
.kpi-timeline-grid,
.timeline-workspace,
.timeline-layout,
.timeline-chart,
.timeline-breakdown,
.pcms-insight,
.guide-card,
.guide-questions {
  min-width: 0;
  max-width: 100%;
}

:where(.grid, .two, .three, .kpis, .center-metrics, .center-cashline,
  .center-action-list, .plan-main-grid, .system-head-split,
  .system-head-kpis, .system-perspectives, .system-category-grid,
  .system-visuals, .monthly-assessment, .monthly-reconcile,
  .monthly-bridge-flow, .review-intelligence, .review-bridge > div,
  .purpose-pools, .purpose-fields, .purpose-choices, .kpi-timeline,
  .kpi-timeline-grid, .timeline-workspace, .timeline-layout) > * {
  min-width: 0;
}

img,
canvas,
svg {
  max-width: 100%;
}

.content {
  width: 100%;
  overflow-x: visible;
}

/* 2. Interaction contract ------------------------------------------------------ */
:where(button, .btn, .icon-btn, .tab, .segment, [role="button"],
  input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 44px;
}

.toast button {
  min-width: 44px;
  min-height: 44px;
}

.monthly-quality-confirm {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 44px;
  min-height: 44px;
  cursor: pointer;
}

.monthly-quality-confirm input {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.target-chart svg .chart-hit {
  fill: transparent;
  stroke: transparent;
  pointer-events: all;
}

.chart-hit:focus-visible {
  outline: none;
}

.target-chart svg .chart-focus-ring {
  fill: none;
  stroke: transparent;
  stroke-width: 3;
  pointer-events: none;
}

.target-chart svg .chart-hit:focus-visible + .chart-focus-ring {
  stroke: var(--gold);
}

:where(.confirm-row, .check-row, .purpose-choice) {
  min-height: 44px;
}

:where(input[type="checkbox"], input[type="radio"]) {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  margin: 0;
}

/* Match the specificity of compact legacy rules so every active control keeps
 * the 44 px interaction contract after the full cascade has been applied. */
.monthly-confirm-group,
.tier-back,
.onboarding-actions .btn,
.period-row select,
.baseline-row select,
.flow-row select,
.baseline-purpose select,
.baseline-row .money-input input,
.flow-row .money-input input,
.optional-details input[type="date"],
.monthly-group > summary,
.optional-details > summary,
.calculation-details > summary {
  min-height: 44px;
}

/* 3. Stable page-level information hierarchy --------------------------------- */
.pcms-insight {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 20px;
  align-items: center;
  margin: 10px 0;
  padding: 14px 18px;
  border: 1px solid #c9ddd8;
  border-left: 5px solid var(--gold);
  border-radius: 16px;
  background: linear-gradient(120deg, #f2f8f6, #fffaf0);
}

.pcms-insight > div {
  min-width: 0;
}

.pcms-insight h2,
.pcms-insight h3,
.pcms-insight p {
  margin: 0;
}

.pcms-insight h2,
.pcms-insight h3 {
  color: var(--nav);
  font-size: 18px;
}

.pcms-insight p,
.pcms-insight small {
  color: var(--muted);
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.pcms-insight .btn {
  justify-self: end;
  white-space: nowrap;
}

/* All overview grids wrap after four values; a fifth KPI starts a new row. */
:where(.kpis, .center-metrics, .kpi-grid, .timeline-kpis) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* The KPI timeline is intentionally one reading lane. Filters, chart and
   breakdown remain full-width, regardless of how many KPIs are available. */
:where(.kpi-timeline, .timeline-workspace, .timeline-layout) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

:where(.kpi-timeline-grid, .timeline-chart-grid) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

:where(.timeline-chart, .timeline-breakdown) {
  width: 100%;
  overflow: visible;
}

/* 4. Review: the value column is part of the grid, never outside the card. ----- */
.review-intelligence {
  grid-template-columns: minmax(0, 1fr);
}

.review-chart {
  overflow: visible;
}

.review-chart > header > * {
  min-width: 0;
}

.review-line svg,
.review-target-line svg {
  display: block;
  width: 100%;
  overflow: visible;
}

.review-bars > div {
  grid-template-columns:
    minmax(108px, 1.05fr)
    minmax(64px, 1.4fr)
    minmax(68px, max-content)
    minmax(64px, 1.4fr)
    minmax(68px, max-content);
}

.review-bars :where(span, strong),
.review-month :where(span, b, small),
.review-bridge :where(span, b, small) {
  min-width: 0;
  overflow-wrap: anywhere;
}

.review-bars strong {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.review-bridge > div,
.monthly-bridge-flow,
.monthly-reconcile {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* 5. Purpose capital: one full-width workspace with aligned controls. --------- */
.purpose-capital-panel,
.purpose-workspace {
  width: 100%;
  grid-column: 1 / -1;
}

.purpose-capital-panel > header,
.purpose-workspace > header {
  flex-wrap: wrap;
}

.purpose-capital-panel > header > div,
.purpose-workspace > header > div {
  min-width: 0;
  flex: 1 1 520px;
}

.purpose-pools {
  grid-template-columns: minmax(0, 1fr);
}

.purpose-pools > article,
.purpose-pool-form {
  width: 100%;
  min-width: 0;
}

.purpose-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.purpose-fields > label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.purpose-fields :where(input, select, textarea) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.purpose-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 10px 0;
}

.purpose-choice {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fbfdfc;
  cursor: pointer;
}

.purpose-choice > input {
  margin-top: 1px;
  accent-color: var(--teal);
}

.purpose-choice > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.purpose-choice small {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.purpose-choice.disabled {
  color: var(--muted);
  background: #f2f4f3;
  cursor: not-allowed;
}

/* 6. Guide: the panel is always fully reachable, including short iPad screens. */
.guide-modal {
  overflow: hidden;
}

.guide-card {
  height: 100dvh;
  max-height: 100dvh !important;
  padding-top: max(22px, env(safe-area-inset-top));
  padding-right: max(22px, env(safe-area-inset-right));
  padding-bottom: max(22px, env(safe-area-inset-bottom));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.guide-head {
  position: sticky;
  top: calc(0px - max(22px, env(safe-area-inset-top)));
  z-index: 2;
  margin: calc(0px - max(22px, env(safe-area-inset-top)))
    calc(0px - max(22px, env(safe-area-inset-right))) 0 -22px;
  padding: max(22px, env(safe-area-inset-top))
    max(22px, env(safe-area-inset-right)) 12px 22px;
  background: #fff;
}

.guide-questions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.guide-question {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

.guide-answer {
  min-height: 0;
}

/* 7. iPad landscape contracts ------------------------------------------------- */
@media (orientation: landscape) and (min-width: 1101px) and (max-width: 1400px) {
  .content {
    padding-inline: 20px;
  }

  .page-hero {
    gap: 18px;
  }

  .system-visuals,
  .system-head-split {
    grid-template-columns: minmax(0, 1fr);
  }

  .system-head-kpis.flow-head,
  .system-head-kpis.capital-head {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .guide-card {
    width: min(520px, 46vw);
  }
}

@media (orientation: landscape) and (min-width: 1051px) and (max-width: 1100px) {
  .content {
    padding-inline: 18px;
  }

  .system-visuals,
  .system-head-split,
  .plan-main-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .guide-card {
    width: min(520px, 52vw);
  }
}

@media (orientation: landscape) and (min-width: 761px) and (max-width: 1050px) {
  .topbar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .topline {
    display: contents;
  }

  .topline > .brand {
    grid-column: 1;
    grid-row: 1;
    padding-left: 18px;
  }

  .top-actions {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    padding-right: 18px;
  }

  .tabs {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    max-width: none;
  }

  .tab {
    min-height: 44px;
  }

  .content {
    padding: 16px 16px 28px;
  }

  .page-hero,
  .monthly-assessment,
  .system-head-split,
  .system-visuals,
  .plan-main-grid,
  .two,
  .three {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .center-metrics,
  .kpis,
  .kpi-grid,
  .timeline-kpis,
  .system-head-kpis.flow-head,
  .system-head-kpis.capital-head,
  .kpi-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .review-bridge > div,
  .monthly-bridge-flow,
  .monthly-reconcile {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .guide-card {
    width: min(520px, 58vw);
  }
}

@media (max-width: 760px) {
  :where(.kpis, .center-metrics, .kpi-grid, .timeline-kpis,
    .system-head-kpis.flow-head, .system-head-kpis.capital-head,
    .kpi-overview, .purpose-fields, .purpose-choices) {
    grid-template-columns: minmax(0, 1fr);
  }

  .pcms-insight {
    grid-template-columns: minmax(0, 1fr);
  }

  .pcms-insight .btn {
    justify-self: start;
  }

  .review-bars > div {
    grid-template-columns: minmax(88px, 1fr) minmax(54px, 1fr) minmax(64px, max-content);
  }

  .review-bars > div > i.current {
    grid-column: 2;
  }

  .review-bars > div > i.current + strong {
    grid-column: 3;
  }

  .review-bridge > div,
  .monthly-bridge-flow,
  .monthly-reconcile {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* R8.7 Plan master-detail: confirmed snapshot on the left, deliberate targets on the right. */
.plan-r87-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 260px);
  gap: 18px;
  align-items: end;
  margin: 0 0 16px;
  padding: 18px;
  border: 1px solid var(--line, #dcd8ce);
  border-radius: 18px;
  background: var(--surface, #fff);
}
.plan-r87-intro h2,
.plan-r87-intro p { margin: 4px 0; }
.plan-r87-master-detail {
  display: grid;
  grid-template-columns: minmax(300px, .82fr) minmax(0, 1.45fr);
  gap: 18px;
  align-items: start;
}
.plan-ist-master,
.plan-ziel-detail,
.plan-aggregate-goals,
.plan-target-overview,
.plan-position-editor {
  min-width: 0;
}
.plan-ist-master,
.plan-aggregate-goals,
.plan-target-overview,
.plan-position-editor {
  padding: 16px;
  border: 1px solid var(--line, #dcd8ce);
  border-radius: 18px;
  background: var(--surface, #fff);
}
.plan-ziel-detail { display: grid; gap: 14px; }
.plan-ist-master header h2,
.plan-ist-master header p,
.plan-aggregate-goals h2,
.plan-target-overview h2,
.plan-position-editor h2 { margin: 4px 0 8px; }
.plan-master-overview,
.plan-ist-position {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.plan-master-overview { margin: 8px 0; font-weight: 750; }
.plan-master-overview:hover,
.plan-master-overview:focus-visible,
.plan-master-overview.selected,
.plan-ist-position:hover,
.plan-ist-position:focus-visible,
.plan-ist-position.selected {
  border-color: var(--accent, #2d786d);
  background: #eaf5f1;
  outline: none;
}
.plan-ist-position span { display: grid; gap: 2px; min-width: 0; }
.plan-ist-position b,
.plan-ist-position small { overflow-wrap: anywhere; }
.plan-ist-position small,
.plan-ist-area summary small { color: var(--muted, #69675f); }
.plan-ist-area { border-top: 1px solid var(--line, #dcd8ce); }
.plan-ist-area summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
}
.plan-ist-area summary span { display: grid; gap: 2px; }
.plan-secondary-goals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 12px; }
.net-worth-definition {
  display: grid;
  gap: 7px;
  padding: 14px;
  border-left: 4px solid var(--accent, #2d786d);
  background: #f0f7f4;
  border-radius: 10px;
}
.plan-target-aggregation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
  padding: 14px;
  border-radius: 14px;
  background: #f6f4ee;
}
.plan-target-aggregation > div { display: grid; gap: 2px; }
.plan-target-aggregation > div span,
.plan-target-aggregation small { color: var(--muted, #69675f); }
.plan-target-aggregation > strong,
.plan-target-aggregation > small { grid-column: 1 / -1; }
.plan-target-aggregation[data-status="over"] > strong { color: #a44635; }
.plan-target-aggregation[data-status="under"] > strong { color: #8a671f; }

@media (min-width: 761px) and (max-width: 1180px) {
  .plan-r87-master-detail { grid-template-columns: minmax(280px, .9fr) minmax(0, 1.25fr); }
}

@media (max-width: 760px) {
  .plan-r87-intro,
  .plan-r87-master-detail { grid-template-columns: 1fr; }
  .plan-secondary-goals,
  .plan-target-aggregation { grid-template-columns: 1fr; }
  .plan-target-aggregation > strong,
  .plan-target-aggregation > small { grid-column: 1; }
}

/* Basic keeps the same truth, with a denser presentation and fewer simultaneous
   panels. This layer does not remove content; the renderer owns that decision. */
.tier-basic .content {
  max-width: 1180px;
}

.tier-basic :where(.page-hero, .card, .review-chart, .system-visual-panel) {
  padding: 16px 18px;
}

.tier-basic :where(.section, .review-intelligence, .system-visuals,
  .system-perspectives, .purpose-capital-panel) {
  margin-top: 10px;
}

.tier-basic .page-hero h1 {
  font-size: clamp(27px, 3vw, 38px);
}

.tier-basic .review-intelligence,
.tier-basic .kpi-timeline,
.tier-basic .timeline-workspace {
  grid-template-columns: minmax(0, 1fr);
}

/* 8. Active Stability pages ---------------------------------------------------
   These selectors style the contract renderers used by app.js. The layer is
   deliberately conservative: one reading column, compact cards and explicit
   grids that can always shrink without clipping the document. */
.stability-page,
.stability-page > *,
.stability-kpi-strip,
.stability-kpis,
.stability-target-grid,
.stability-finance-visuals,
.center-overview-grid,
.center-development-summary,
.center-flow-summary,
.confirmed-flow-map,
.snapshot-timeline-workspace,
.snapshot-timeline-workspace > *,
.cycle-strip,
.purpose-capital-summary,
.basic-finance-summary,
.basic-development-summary,
.finance-detail-hierarchy,
.finance-domain-panel,
.finance-detail-group,
.guide-period-facts,
.monthly-stage-insight,
.app-release {
  min-width: 0;
  max-width: 100%;
}

.stability-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  width: 100%;
}

.stability-page .stability-hero {
  margin: 0;
}

.stability-period-marker {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  margin: -2px 0 0;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.stability-period-marker strong {
  color: var(--nav);
  font-variant-numeric: tabular-nums;
}

.cycle-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: stretch;
  padding: 11px;
  border: 1px solid #c9ddd8;
  border-radius: 17px;
  background: #eef6f4;
}

.cycle-confirmed,
.cycle-draft {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
  padding: 8px 11px;
  border-radius: 12px;
  background: #fff;
}

.cycle-confirmed > span,
.cycle-draft > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.cycle-confirmed > strong,
.cycle-draft > strong {
  color: var(--nav);
  font-size: 18px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.cycle-draft > small {
  color: var(--muted);
  line-height: 1.35;
}

.cycle-strip > .btn {
  align-self: center;
  white-space: nowrap;
}

.stability-kpi-strip,
.stability-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.stability-kpi {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
  min-height: 92px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
}

.stability-kpi > span,
.stability-kpi > small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.stability-kpi > strong {
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(19px, 2vw, 27px);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.stability-kpi.good {
  border-color: #afd6c6;
  background: #f3faf7;
}

.stability-kpi.attention {
  border-color: #e5c98e;
  background: #fffaf0;
}

.stability-target-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.stability-target {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.stability-target > span {
  color: var(--nav);
  font-weight: 820;
}

.stability-target dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}

.stability-target dl > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 9px;
  border-radius: 10px;
  background: #f3f7f6;
}

.stability-target dt,
.stability-target > small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}

.stability-target dd {
  min-width: 0;
  margin: 0;
  color: var(--nav);
  font-weight: 780;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.plan-target-deviation {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 17px 19px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
}

.plan-target-deviation > header {
  display: grid;
  gap: 3px;
}

.plan-target-deviation h2,
.plan-target-deviation p {
  margin: 0;
}

.plan-target-deviation h2 {
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(20px, 2.2vw, 29px);
}

.plan-target-deviation > header p,
.plan-deviation-blocker p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.plan-deviation-blocker {
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  border-left: 4px solid var(--gold);
  border-radius: 12px;
  background: #fff8ea;
}

.plan-deviation-blocker strong {
  color: var(--nav);
}

.plan-deviation-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.plan-deviation-summary > div {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f7faf9;
}

.plan-deviation-summary dt,
.plan-deviation-summary small,
.plan-deviation-encoding-note {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}

.plan-deviation-summary dd {
  min-width: 0;
  margin: 0;
  color: var(--nav);
  font-size: 17px;
  font-weight: 820;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.plan-deviation-encoding-note {
  padding-left: 10px;
  border-left: 3px solid var(--gold);
}

.plan-deviation-visual,
.plan-deviation-table-wrap {
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.plan-deviation-visual {
  display: grid;
  gap: 7px;
  padding: 10px 12px;
  border-radius: 13px;
  background: #f3f7f6;
}

.plan-deviation-visual[data-encoding="time-only"] {
  background-image: none;
}

.plan-deviation-row,
.plan-deviation-axis {
  display: grid;
  grid-template-columns: 94px minmax(560px, 1fr);
  align-items: center;
  min-width: 674px;
}

.plan-deviation-row > strong {
  color: var(--nav);
  font-size: 12px;
}

.plan-deviation-track,
.plan-deviation-axis {
  grid-template-columns: repeat(var(--period-count), minmax(72px, 1fr));
}

.plan-deviation-track {
  display: grid;
  align-items: center;
  min-height: 58px;
  border-radius: 9px;
  background: linear-gradient(transparent calc(50% - 1px), #b9cbc7 calc(50% - 1px), #b9cbc7 calc(50% + 1px), transparent calc(50% + 1px));
}

.plan-deviation-point {
  display: grid;
  grid-column: var(--point-column);
  grid-row: 1;
  place-items: center;
  align-self: center;
  justify-self: center;
  min-width: 44px;
  min-height: 44px;
  color: var(--nav);
  outline-offset: 2px;
}

.plan-deviation-point i {
  width: 14px;
  height: 14px;
  border: 4px solid #fff;
  border-radius: 50%;
  background: #174b57;
  box-shadow: 0 0 0 2px #174b57;
}

.plan-deviation-point.series-path i {
  background: #4f817d;
  box-shadow: 0 0 0 2px #4f817d;
}

.plan-deviation-point.series-target i {
  background: var(--gold);
  box-shadow: 0 0 0 2px #a97e25;
}

.plan-deviation-point small {
  max-width: 82px;
  color: var(--muted);
  font-size: 9px;
  font-variant-numeric: tabular-nums;
  text-align: center;
  white-space: nowrap;
}

.plan-deviation-axis {
  padding-left: 94px;
  color: var(--muted);
  font-size: 9px;
  text-align: center;
}

.plan-deviation-table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  color: var(--nav);
  font-size: 12px;
}

.plan-deviation-table-details {
  min-width: 0;
  border-top: 1px solid var(--line);
}

.plan-deviation-table-details > summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--teal);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.plan-deviation-table caption {
  padding: 0 0 7px;
  color: var(--muted);
  text-align: left;
}

.plan-deviation-table th,
.plan-deviation-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-variant-numeric: tabular-nums;
}

.plan-deviation-table td:last-child {
  text-align: right;
}

.center-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
  gap: 10px;
}

.center-development-summary,
.center-flow-summary {
  min-width: 0;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
}

.center-development-summary > header,
.center-flow-summary > header {
  display: grid;
  gap: 2px;
  margin-bottom: 10px;
}

.center-development-summary h2,
.center-flow-summary h2 {
  margin: 2px 0;
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
}

.center-development-summary > header small,
.center-flow-summary p {
  color: var(--muted);
}

.center-development-summary > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.center-trend {
  min-width: 0;
  padding: 10px 11px 8px;
  border: 1px solid #e3eae8;
  border-radius: 12px;
  background: #fbfdfc;
}

.center-trend > header {
  display: grid;
  gap: 2px;
}

.center-trend > header span,
.center-trend > footer span {
  color: var(--muted);
  font-size: 10px;
}

.center-trend > header strong {
  color: var(--nav);
  font-size: 17px;
}

.center-trend svg {
  display: block;
  width: 100%;
  height: 48px;
  margin: 2px 0;
  overflow: visible;
}

.center-trend path {
  fill: none;
  stroke: var(--teal);
  stroke-width: 3;
}

.center-trend circle {
  fill: #fff;
  stroke: var(--gold);
  stroke-width: 2.5;
}

.center-trend.debt path {
  stroke: #786358;
}

.center-trend.liquidity path {
  stroke: #2f7770;
}

.center-trend > footer {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 4px;
  align-items: center;
}

.center-trend > footer span:last-child {
  text-align: right;
}

.center-trend > footer b {
  color: var(--teal);
  font-size: 11px;
  white-space: nowrap;
}

.center-flow-summary dl {
  display: grid;
  gap: 0;
  margin: 0;
}

.center-flow-summary dl > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid #e8eeec;
}

.center-flow-summary dt {
  color: var(--muted);
}

.center-flow-summary dd {
  margin: 0;
  color: var(--nav);
  font-weight: 800;
  text-align: right;
}

.stability-finance-visuals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.stability-finance-visuals > article {
  min-width: 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
}

.stability-finance-visuals h2 {
  margin: 3px 0 10px;
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
}

.stability-metric-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  min-width: 0;
  padding: 8px 0;
  border-top: 1px solid #e8eeec;
}

.stability-metric-row > span {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.stability-metric-row > strong {
  color: var(--nav);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.confirmed-flow-map {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid #e8eeec;
}

.confirmed-flow-map > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.confirmed-flow-map > header span {
  color: var(--teal);
  font-size: 10px;
  font-weight: 800;
}

.confirmed-flow-map svg {
  display: block;
  width: 100%;
  height: auto;
  min-height: 180px;
  margin: 7px 0 3px;
  overflow: visible;
}

.confirmed-flow-source {
  fill: var(--nav);
}

.flow-source-label,
.flow-source-value,
.confirmed-flow-band text {
  fill: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 15px;
}

.flow-source-value {
  fill: var(--nav);
  font-size: 17px;
  font-weight: 800;
}

.confirmed-flow-band path {
  fill: none;
  stroke: #aac9c4;
  stroke-linecap: butt;
  opacity: .84;
}

.confirmed-flow-band rect {
  fill: #2f6770;
}

.confirmed-flow-band.debt path,
.confirmed-flow-band.debt rect {
  stroke: #87756a;
  fill: #87756a;
}

.confirmed-flow-band.capital path,
.confirmed-flow-band.capital rect {
  stroke: #4c9481;
  fill: #4c9481;
}

.confirmed-flow-band.purpose path,
.confirmed-flow-band.purpose rect {
  stroke: #b88a31;
  fill: #b88a31;
}

.confirmed-flow-band.open path,
.confirmed-flow-band.open rect,
.confirmed-flow-band.unreviewed path,
.confirmed-flow-band.unreviewed rect {
  stroke: #d7b66a;
  fill: #d7b66a;
}

.confirmed-flow-legend {
  display: grid;
  gap: 5px;
}

.confirmed-flow-legend > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 46px;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 10px;
}

.confirmed-flow-legend span {
  display: flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.confirmed-flow-legend i {
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border-radius: 2px;
  background: #aac9c4;
}

.confirmed-flow-legend i.debt { background: #87756a; }
.confirmed-flow-legend i.capital { background: #4c9481; }
.confirmed-flow-legend i.purpose { background: #b88a31; }
.confirmed-flow-legend i.open,
.confirmed-flow-legend i.unreviewed { background: #d7b66a; }

.confirmed-flow-legend strong {
  color: var(--nav);
  white-space: nowrap;
}

.confirmed-flow-legend small {
  text-align: right;
}

.confirmed-flow-map.unavailable,
.confirmed-flow-empty {
  padding: 12px;
  border-radius: 11px;
  background: #f4f7f6;
  color: var(--muted);
  line-height: 1.45;
}

.purpose-capital-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px 15px;
  border: 1px solid #d8dfe8;
  border-left: 4px solid var(--teal);
  border-radius: 14px;
  background: #f2f5f9;
}

.purpose-capital-summary > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 14px;
  min-width: 0;
}

.purpose-capital-summary span,
.purpose-capital-summary small {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.purpose-capital-summary strong {
  color: var(--nav);
  font-size: 20px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.purpose-capital-summary small {
  grid-column: 1 / -1;
}

.stability-page-action {
  display: flex;
  justify-content: flex-end;
  min-height: 0;
}

/* One compact page-level interpretation. The renderer owns the count; this
   layout keeps its three facts readable without scattering more callouts. */
.stability-page > .pcms-insight,
.basic-finance-summary > .pcms-insight,
.basic-development-summary > .pcms-insight,
.guide-compact-answer .pcms-insight {
  margin: 0;
}

.pcms-insight-title {
  grid-column: 1;
  color: var(--nav);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.pcms-insight-content {
  grid-column: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.pcms-insight-content section {
  min-width: 0;
}

.pcms-insight-content span {
  display: block;
  margin-bottom: 2px;
  color: var(--teal);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pcms-insight-content p {
  color: var(--ink);
  font-size: 12px;
}

.pcms-insight > .btn {
  grid-column: 2;
  grid-row: 1 / span 2;
}

/* 9. Snapshot timeline -------------------------------------------------------- */
.snapshot-timeline-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
  width: 100%;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
  overflow: visible;
}

.snapshot-timeline-workspace > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, .35fr);
  gap: 18px;
  align-items: end;
}

.snapshot-timeline-workspace h2 {
  margin: 3px 0;
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
}

.snapshot-timeline-workspace header p,
.timeline-source-note {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.timeline-kpi-picker {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.timeline-kpi-picker select {
  width: 100%;
  min-height: 44px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 9px 34px 9px 11px;
  background: #fff;
  color: var(--ink);
}

.timeline-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  min-width: 0;
}

.timeline-legend-item {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
}

.timeline-legend-item i {
  width: 18px;
  height: 3px;
  border-radius: 99px;
  background: var(--teal);
}

.timeline-legend-item.series-2 i {
  background: var(--gold);
}

.snapshot-timeline {
  display: block;
  width: 100%;
  height: auto;
  min-height: 250px;
  overflow: visible;
}

.snapshot-timeline-workspace.compact-two-point {
  gap: 7px;
  padding-block: 13px;
}

.snapshot-timeline-workspace.compact-two-point .snapshot-timeline {
  min-height: 170px;
  max-height: 190px;
}

.timeline-grid {
  stroke: #dfe7e4;
  stroke-width: 1;
}

.timeline-axis {
  stroke: #9baaa7;
  stroke-width: 1.2;
}

.timeline-axis-label {
  fill: var(--muted);
  font-size: 10px;
}

.timeline-line {
  fill: none;
  stroke: var(--teal);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.timeline-line.series-2 {
  stroke: var(--gold);
}

.timeline-point {
  fill: #fff;
  stroke: var(--teal);
  stroke-width: 4;
  pointer-events: none;
}

.timeline-point.series-2 {
  stroke: var(--gold);
}

.timeline-hit-target {
  fill: transparent;
  stroke: transparent;
  cursor: pointer;
  pointer-events: all;
}

.timeline-hit-target:focus-visible {
  outline: none;
}

.timeline-focus-ring {
  fill: none;
  stroke: transparent;
  stroke-width: 2;
  pointer-events: none;
}

.timeline-hit-target:focus-visible + .timeline-focus-ring {
  stroke: var(--gold);
}

.timeline-data-details {
  min-width: 0;
  border-top: 1px solid var(--line);
}

.timeline-data-details > summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--teal);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.timeline-data-table-scroll {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.timeline-data-table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  color: var(--ink);
  font-size: 11px;
}

.timeline-data-table caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.timeline-data-table th,
.timeline-data-table td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.timeline-data-table thead th,
.timeline-data-table tbody th {
  color: var(--muted);
  font-weight: 750;
}

.timeline-data-table td strong,
.timeline-data-table td small {
  display: block;
}

.timeline-data-table td small {
  margin-top: 3px;
  color: var(--muted);
}

.timeline-quality {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-top: 5px;
  padding: 2px 7px;
  border-radius: 99px;
  background: var(--soft);
  color: var(--teal);
  font-size: 10px;
  font-weight: 800;
}

.timeline-quality.quality-estimated,
.timeline-quality.quality-carriedForward,
.timeline-quality.quality-consciouslyOpen,
.timeline-quality.quality-unreviewed,
.timeline-quality.quality-missing {
  background: var(--cream);
  color: #775313;
}

[data-testid="review-history"] {
  min-width: 0;
  max-width: 100%;
}

/* 10. Basic summaries --------------------------------------------------------- */
.basic-finance-summary,
.basic-development-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.basic-finance-summary > header,
.basic-development-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-end;
  padding: 15px 18px;
  border-radius: 16px;
  background: var(--nav);
  color: #fff;
}

.basic-finance-summary h1,
.basic-development-head h1 {
  margin: 3px 0 0;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 27px;
}

.basic-development-periods {
  display: grid;
  gap: 2px;
  text-align: right;
}

.basic-development-periods > strong {
  color: #fff;
  font-size: 24px;
}

.basic-development-periods > span {
  color: #cad7df;
  font-size: 11px;
}

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

.basic-flow-status > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
}

.basic-flow-status strong {
  color: var(--nav);
  font-size: 17px;
  overflow-wrap: anywhere;
}

/* 11. Explicit, hierarchical finance details --------------------------------- */
.stability-directory-hero {
  min-width: 0;
  margin-bottom: 12px;
  padding: 18px 21px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.stability-directory-hero > div {
  min-width: 0;
}

.stability-directory-hero h1 {
  margin: 3px 0 5px;
  font-size: clamp(26px, 3vw, 38px);
}

.finance-detail-hierarchy {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.finance-domain-panel {
  display: grid;
  gap: 10px;
  padding: 17px 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.finance-domain-panel > header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  padding: 0 2px 5px;
}

.finance-domain-panel > header h2 {
  margin: 3px 0 0;
  color: var(--nav);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
}

.finance-domain-panel > header > small,
.finance-detail-group small {
  color: var(--muted);
  line-height: 1.35;
}

.flow-domain {
  border-top: 4px solid #2f6770;
}

.capital-domain {
  border-top: 4px solid var(--gold);
}

.finance-detail-groups {
  display: grid;
  gap: 8px;
}

.finance-detail-group {
  overflow: hidden;
  border: 1px solid #dfe7e5;
  border-radius: 13px;
  background: #fbfdfc;
}

.finance-detail-group > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 64px;
  padding: 12px 15px;
  cursor: pointer;
  list-style: none;
}

.finance-detail-group > summary::-webkit-details-marker {
  display: none;
}

.finance-detail-group > summary::before {
  content: "+";
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: 20px;
  color: var(--teal);
  font-size: 20px;
  font-weight: 800;
}

.finance-detail-group[open] > summary::before {
  content: "−";
}

.finance-detail-group > summary > span:first-child {
  grid-column: 1;
  grid-row: 1;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding-left: 28px;
}

.finance-detail-summary {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  gap: 2px;
  text-align: right;
}

.finance-detail-summary strong,
.finance-detail-row > strong,
.purpose-detail-pool > header > strong {
  color: var(--nav);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.finance-detail-body {
  padding: 0 15px 13px;
  border-top: 1px solid #e5ecea;
  background: #fff;
}

.finance-detail-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(150px, .55fr);
  gap: 12px;
  align-items: center;
  min-height: 55px;
  padding: 9px 2px;
  border-bottom: 1px solid #edf1f0;
}

.finance-detail-row > span:first-child,
.purpose-detail-pool > header > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.finance-detail-row > small:last-child {
  text-align: right;
}

.finance-detail-body > footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 11px;
}

.finance-detail-empty {
  padding: 14px 2px;
  color: var(--muted);
}

.purpose-detail-group {
  border-left: 4px solid var(--gold);
  background: #fffbf2;
}

.purpose-detail-pool {
  padding: 10px 2px 2px;
}

.purpose-detail-pool + .purpose-detail-pool {
  border-top: 1px solid var(--line);
}

.purpose-detail-pool > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 2px 2px 8px;
}

/* 12. Guide, workflow insight and release label ------------------------------ */
.stability-guide-answer {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.guide-compact-answer {
  display: grid;
  gap: 11px;
  min-width: 0;
}

.guide-compact-answer > h3,
.guide-compact-answer > p {
  margin: 0;
}

.guide-compact-answer > p {
  color: var(--ink);
  line-height: 1.5;
}

.guide-period-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.guide-period-facts > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #f5f8f7;
  color: var(--muted);
  font-size: 10px;
}

.guide-period-facts strong {
  color: var(--nav);
  font-size: 14px;
  overflow-wrap: anywhere;
}

.guide-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  padding: 5px;
  border-radius: 13px;
  background: #edf1f0;
}

.guide-mode-switch > button {
  min-width: 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
}

.guide-mode-switch > button.active {
  background: #fff;
  color: var(--nav);
  box-shadow: 0 1px 5px #05173314;
  font-weight: 780;
}

.monthly-stage-insight {
  grid-template-columns: minmax(0, 1fr) minmax(220px, .38fr);
  margin: 10px 0;
}

.monthly-stage-insight > article,
.monthly-stage-insight > aside {
  min-width: 0;
}

.monthly-stage-insight h2 {
  margin: 2px 0 7px;
  font-size: 18px;
}

.monthly-stage-insight > aside {
  display: grid;
  align-content: center;
  gap: 3px;
  padding-left: 15px;
  border-left: 1px solid #c9ddd8;
}

.monthly-stage-insight > aside small,
.assessment-facts {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}

.assessment-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
}

.app-release {
  width: 100%;
  padding: 6px 18px max(12px, env(safe-area-inset-bottom));
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
  text-align: center;
}

/* 13. Active renderer breakpoints -------------------------------------------- */
@media (orientation: landscape) and (min-width: 761px) and (max-width: 1100px) {
  .stability-page {
    gap: 10px;
  }

  .stability-page .stability-hero {
    padding: 15px 18px;
  }

  .stability-kpi-strip,
  .stability-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stability-target-grid,
  .stability-finance-visuals,
  .center-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .center-overview-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr);
  }

  .center-development-summary > div {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .plan-deviation-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .plan-deviation-visual,
  .plan-deviation-table-wrap {
    width: 100%;
    max-width: 100%;
  }

  .snapshot-timeline-workspace {
    padding: 13px 15px;
  }

  .monthly-table,
  .monthly-columns,
  .monthly-group,
  .monthly-group > summary,
  .monthly-row,
  .monthly-bridge,
  .monthly-bridge-flow,
  .monthly-reconcile {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .monthly-columns,
  .monthly-group > summary,
  .monthly-row {
    grid-template-columns:
      minmax(150px, 1.25fr)
      minmax(72px, .58fr)
      minmax(104px, .82fr)
      minmax(68px, .54fr)
      minmax(118px, .95fr);
    gap: 6px;
  }

  .monthly-columns > *,
  .monthly-group > summary > *,
  .monthly-row > * {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .monthly-current,
  .monthly-current input,
  .monthly-quality,
  .monthly-quality select {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .monthly-quality {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .monthly-quality-confirm {
    white-space: normal;
  }

  .review-bridge > div,
  .monthly-bridge-flow,
  .monthly-reconcile {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .review-month {
    grid-template-columns: minmax(140px, 1fr) repeat(3, minmax(88px, .72fr)) auto;
    gap: 6px;
  }

  .review-month .btn {
    padding-inline: 10px;
  }
}

@media (max-width: 760px) {
  .stability-page {
    gap: 10px;
  }

  .cycle-strip,
  .snapshot-timeline-workspace > header,
  .stability-target-grid,
  .stability-finance-visuals,
  .center-overview-grid,
  .center-development-summary > div,
  .finance-detail-hierarchy,
  .monthly-stage-insight {
    grid-template-columns: minmax(0, 1fr);
  }

  .finance-domain-panel > header,
  .finance-detail-group > summary,
  .finance-detail-row,
  .purpose-detail-pool > header {
    grid-template-columns: minmax(0, 1fr);
  }

  .finance-domain-panel > header {
    align-items: start;
  }

  .finance-detail-summary {
    grid-column: 1;
    grid-row: 2;
    padding-left: 28px;
    text-align: left;
  }

  .finance-detail-row > small:last-child {
    text-align: left;
  }

  .cycle-strip > .btn,
  .stability-page-action > .btn,
  .purpose-capital-summary > .btn {
    width: 100%;
    white-space: normal;
  }

  .stability-kpi-strip,
  .stability-kpis,
  .basic-flow-status,
  .guide-period-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stability-target dl,
  .pcms-insight-content {
    grid-template-columns: minmax(0, 1fr);
  }

  .purpose-capital-summary,
  .purpose-capital-summary > div,
  .pcms-insight {
    grid-template-columns: minmax(0, 1fr);
  }

  .purpose-capital-summary strong {
    white-space: normal;
  }

  .pcms-insight > .btn {
    grid-column: 1;
    grid-row: auto;
    justify-self: stretch;
  }

  .snapshot-timeline {
    min-height: 210px;
  }

  .snapshot-timeline-workspace.compact-two-point .snapshot-timeline {
    min-height: 160px;
    max-height: 180px;
  }

  .monthly-stage-insight > aside {
    padding: 10px 0 0;
    border-top: 1px solid #c9ddd8;
    border-left: 0;
  }

  .basic-development-periods {
    text-align: left;
  }

  .plan-target-deviation {
    padding: 14px;
  }

  .plan-deviation-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .plan-deviation-visual {
    padding: 9px;
  }
}

@media (max-width: 480px) {
  .stability-kpi-strip,
  .stability-kpis,
  .basic-flow-status,
  .guide-period-facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .stability-target dl {
    grid-template-columns: minmax(0, 1fr);
  }

  .plan-deviation-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .stability-metric-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
  }

  .stability-metric-row > strong {
    white-space: normal;
  }
}

/* R8: compact N-way split and independent purpose-capital editing */
.finance-split-part{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:8px;align-items:end;padding:8px 0;border-bottom:1px solid var(--line)}
.finance-split-part label{display:grid;gap:5px;min-width:0}.finance-split-part .text-action{grid-column:1/-1;min-height:44px;justify-self:end}
.timeline-empty-state{display:grid;gap:6px;padding:18px;border:1px dashed var(--line);border-radius:14px;background:var(--surface-soft,#f6f8f7)}.timeline-empty-state p{margin:0;color:var(--muted);line-height:1.5}
.purpose-independent-pool{display:grid;gap:10px;padding:14px;border:1px solid var(--line);border-radius:15px;background:#fff}
.purpose-independent-pool>header,.purpose-owned-row{display:flex;justify-content:space-between;gap:12px;align-items:center}.purpose-independent-pool>header>div:last-child{display:grid;text-align:right;gap:2px}.purpose-owned-list{display:grid;gap:5px}.purpose-owned-row{padding:8px 10px;border-radius:10px;background:#f5f8f7}.purpose-owned-row span{display:grid;gap:2px}.purpose-owned-row small{color:var(--muted)}
.purpose-position-fields{grid-template-columns:minmax(170px,1fr) minmax(135px,.55fr) minmax(135px,.55fr) minmax(130px,.5fr)}
@media(max-width:900px){.finance-split-part,.purpose-position-fields{grid-template-columns:1fr 1fr}.finance-split-part .text-action{grid-column:1/-1;justify-self:start}}

/* R8.1: data-truth cues, close gate and purpose-capital editing */
.monthly-structure-note{margin:0 14px 7px;padding:8px 10px;border-left:3px solid var(--gold);border-radius:8px;background:#faf7ef;color:var(--muted);font-size:11px;line-height:1.4}
.monthly-final.blocked{border-color:#e3c79e;background:#fffaf1}.monthly-final.ready{border-color:#a9cfc4;background:#f8fcfa}
.monthly-actions .btn.primary:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.55)}
.purpose-independent-pool{gap:14px}
.purpose-subsection{display:grid;gap:9px;padding:12px;border:1px solid var(--line);border-radius:13px;background:#fbfcfb}
.purpose-subsection-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.purpose-subsection-head>div{display:grid;gap:2px}.purpose-subsection-head h4{margin:0;font-size:16px}.purpose-subsection-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.4}.purpose-subsection-head>strong{white-space:nowrap;font-size:16px}
.purpose-edit-record{border:1px solid #e4e9e6;border-radius:11px;background:#fff;overflow:hidden}
.purpose-edit-record>summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:9px 11px;cursor:pointer;list-style:none}.purpose-edit-record>summary::-webkit-details-marker{display:none}.purpose-edit-record>summary span{display:grid;gap:2px;min-width:0}.purpose-edit-record>summary small{color:var(--muted)}.purpose-edit-record>summary strong{white-space:nowrap}.purpose-edit-record>summary em{font-style:normal;font-size:11px;font-weight:800;color:var(--teal)}
.purpose-edit-form{display:grid;gap:10px;padding:11px;border-top:1px solid var(--line);background:#f7f9f8}
.purpose-edit-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.purpose-edit-actions .danger{color:#943e34}
.purpose-create-form{border:1px dashed #bdc9c4;border-radius:11px;background:#fff}.purpose-create-form>summary{padding:9px 11px;cursor:pointer;font-weight:800;color:var(--teal)}.purpose-create-form>form{display:grid;gap:10px;padding:11px;border-top:1px solid var(--line)}
@media(max-width:900px){.purpose-subsection-head{align-items:stretch}.purpose-edit-record>summary{grid-template-columns:minmax(0,1fr) auto}.purpose-edit-record>summary em{grid-column:1/-1}.purpose-edit-actions{align-items:flex-start;flex-direction:column}.monthly-structure-note{margin-inline:8px}}
@media(max-width:620px){.purpose-subsection-head{flex-direction:column}.purpose-edit-record>summary{grid-template-columns:1fr}.purpose-edit-record>summary strong{justify-self:start}}

/* R8.2 – finance system as the complete explanatory workspace ---------------- */
.finance-primary-entry{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;
  padding:16px 18px;border:1px solid #b9d3cd;border-left:5px solid var(--gold);border-radius:17px;
  background:linear-gradient(110deg,#f4faf8,#fffaf2)
}
.finance-primary-entry h2{margin:3px 0 4px;color:var(--nav);font-family:Georgia,"Times New Roman",serif;font-size:24px}
.finance-primary-entry p{margin:0;color:var(--muted);line-height:1.45}
.finance-primary-entry .btn{min-width:210px;min-height:50px;background:var(--nav);color:#fff;border-color:var(--nav);font-weight:800}
.finance-inline-detail{width:100%;margin-top:10px;padding:10px 0 2px;border:0;border-top:1px solid #e4ece9;background:transparent;color:var(--teal);font:inherit;font-weight:800;text-align:left;cursor:pointer}
.finance-flow-article{grid-column:1/-1}

.confirmed-flow-map.detailed{padding-top:14px}
.confirmed-flow-map.detailed>header>div{display:grid;gap:2px}
.confirmed-flow-map.detailed>header small{color:var(--muted);font-size:11px}
.confirmed-flow-map.detailed svg{min-height:320px;margin-top:10px}
.sankey-detail-source path,.confirmed-flow-map.detailed .confirmed-flow-band path{fill:none;stroke:#a9cbc5;stroke-linecap:butt;opacity:.78}
.sankey-detail-source rect{fill:#315f68}.confirmed-flow-map.detailed .confirmed-flow-band rect{fill:#9bbdb6}
.sankey-detail-source text,.confirmed-flow-map.detailed .confirmed-flow-band text,.flow-center-label,.flow-center-value{fill:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:13px}
.sankey-node-value,.flow-center-value{font-weight:800;fill:var(--nav)}
.flow-center-label{font-weight:800;fill:var(--teal)}
.confirmed-flow-legend.detailed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 16px;margin-top:8px}
.confirmed-flow-legend.detailed>div{display:grid;grid-template-columns:minmax(0,1fr) auto 48px;gap:8px;align-items:center;padding:5px 0;border-top:1px solid #eef2f0}
.confirmed-flow-legend.detailed span{display:flex;align-items:center;gap:7px;min-width:0}.confirmed-flow-legend.detailed i{width:9px;height:9px;border-radius:99px;background:#82aaa3;flex:0 0 9px}
.confirmed-flow-legend.detailed strong,.confirmed-flow-legend.detailed small{text-align:right;white-space:nowrap}

.finance-detail-layer{display:grid;gap:7px;padding:11px 0}
.finance-detail-layer+ .finance-detail-layer{border-top:1px solid #dfe7e4}
.finance-detail-layer>header{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:2px 2px 7px}
.finance-detail-layer>header>span{display:grid;gap:2px}.finance-detail-layer>header small{color:var(--muted)}
.finance-detail-layer.confirmed-layer{background:#fff}.finance-detail-layer.draft-layer{margin:5px -8px 0;padding:12px 10px;border-radius:11px;background:#f4f8f7}
.finance-position-drilldown{overflow:hidden;border:1px solid #e3eae7;border-radius:10px;background:#fff}
.finance-position-drilldown>summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;min-height:49px;padding:8px 10px;cursor:pointer;list-style:none}
.finance-position-drilldown>summary::-webkit-details-marker{display:none}.finance-position-drilldown>summary>span{display:grid;gap:2px;min-width:0}.finance-position-drilldown>summary small{color:var(--muted)}
.finance-position-drilldown>summary strong{white-space:nowrap;color:var(--nav)}.finance-position-drilldown>summary em{font-style:normal;color:var(--teal);font-size:11px;font-weight:800}
.finance-position-facts{padding:9px 10px 10px;border-top:1px solid #e6ece9;background:#fafcfb}
.finance-position-facts dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0}.finance-position-facts dl>div{display:grid;gap:2px;min-width:0}.finance-position-facts dt{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.05em}.finance-position-facts dd{margin:0;font-size:12px;font-weight:700;overflow-wrap:anywhere}
.purpose-flow-mini{display:grid;gap:7px;margin-top:8px;padding-top:8px;border-top:1px dashed #d9e1de}.purpose-flow-mini>b{font-size:12px;color:var(--teal)}

/* iPad landscape: keep the monthly-close table readable instead of allowing
 * the first column to collapse into a vertical word stack. */
@media (orientation:landscape) and (min-width:761px) and (max-width:1180px){
  .monthly-table{overflow:visible}
  .monthly-columns,.monthly-group>summary,.monthly-row{
    grid-template-columns:minmax(250px,1.7fr) minmax(105px,.7fr) minmax(135px,.85fr) minmax(92px,.6fr) minmax(165px,1fr)!important;
    gap:8px!important
  }
  .monthly-group>summary>span:first-child,.monthly-name{overflow-wrap:normal!important;word-break:normal!important}
  .monthly-group>summary>span:first-child b,.monthly-name b{white-space:normal}
  .monthly-group>summary{padding-inline:18px}
  .monthly-subrows{padding-inline:18px}
  .monthly-structure-note{margin:8px 18px 9px!important;max-width:none}
  .monthly-quality{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important}
  .finance-primary-entry{grid-template-columns:minmax(0,1fr) auto}
  .confirmed-flow-map.detailed svg{min-height:300px}
  .finance-position-facts dl{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .finance-primary-entry{grid-template-columns:1fr}.finance-primary-entry .btn{width:100%}
  .confirmed-flow-legend.detailed{grid-template-columns:1fr}
  .finance-position-drilldown>summary{grid-template-columns:minmax(0,1fr) auto}.finance-position-drilldown>summary em{grid-column:1/-1}
  .finance-position-facts dl{grid-template-columns:1fr 1fr}
  .finance-detail-layer>header{align-items:flex-start;flex-direction:column}
}
.finance-flow-period-block{margin-top:13px;padding:12px;border:1px solid #e0e8e5;border-radius:13px;background:#fbfdfc}
.finance-flow-period-block.draft{border-left:4px solid var(--gold);background:#fffaf2}
.finance-flow-period-block>header{display:flex;justify-content:space-between;gap:12px;align-items:center}.finance-flow-period-block>header span{color:var(--muted);font-size:11px;font-weight:700}

/* R8.3 – iPad hardening: readable monthly close, collision-free Sankey,
 * direct position editing from the finance drill-down. */
.finance-position-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:10px 0 2px;
  border-top:1px solid #e8eeeb;
}
.finance-position-actions .text-action{font-weight:800;color:var(--teal)}

.confirmed-flow-map.detailed svg{
  display:block;
  width:100%;
  height:auto;
  min-height:0;
  overflow:visible;
}
.sankey-flow-band{fill:none;stroke:#a9cbc5;stroke-linecap:butt;opacity:.78}
.sankey-label-connector{fill:none;stroke:#8aa7a1;stroke-width:1;opacity:.72}
.sankey-node-label{fill:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:13px;font-weight:650}
.sankey-node-value{fill:var(--nav);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:13px;font-weight:850}

/* iPad Landscape gets a deliberate two-level monthly-close layout. The group
 * title occupies its own row; the four facts sit below it. Position rows use
 * the same pattern. This removes any dependency on Safari's fractional-grid
 * shrinking and prevents vertical word stacks at every iPad landscape width. */
@media (orientation:landscape) and (min-width:761px) and (max-width:1600px){
  .monthly-table{
    overflow:visible!important;
    width:100%!important;
    max-width:100%!important;
  }
  .monthly-columns{display:none!important}
  .monthly-group>summary{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    gap:8px 14px!important;
    align-items:start!important;
    padding:13px 18px!important;
  }
  .monthly-group>summary>span:first-child{
    grid-column:1/-1!important;
    padding-left:10px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-group>summary>span:first-child b{
    white-space:normal!important;
    line-height:1.25!important;
  }
  .monthly-group>summary>.monthly-summary-previous,
  .monthly-group>summary>.monthly-summary-current,
  .monthly-group>summary>.monthly-summary-delta,
  .monthly-group>summary>[data-monthly-group-quality]{
    position:relative;
    display:block;
    min-width:0;
    padding-top:17px;
    text-align:left;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-group>summary>.monthly-summary-previous::before,
  .monthly-group>summary>.monthly-summary-current::before,
  .monthly-group>summary>.monthly-summary-delta::before,
  .monthly-group>summary>[data-monthly-group-quality]::before{
    content:attr(data-column-label);
    position:absolute;
    top:0;
    left:0;
    color:var(--muted);
    font-size:9px;
    font-weight:850;
    line-height:1.15;
    letter-spacing:.06em;
    text-transform:uppercase;
    white-space:normal;
  }
  .monthly-group>summary>[data-monthly-group-quality]{
    justify-self:stretch!important;
    width:auto!important;
  }
  .monthly-structure-note{
    display:block!important;
    width:auto!important;
    max-width:none!important;
    margin:8px 18px 10px!important;
    padding:9px 11px!important;
    font-size:11px!important;
    line-height:1.4!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-subrows{padding:0 18px 8px!important}
  .monthly-row{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    gap:8px 14px!important;
    align-items:start!important;
    padding:12px 0!important;
  }
  .monthly-name{
    grid-column:1/-1!important;
    padding-left:0!important;
    min-width:0!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-name b{white-space:normal!important;line-height:1.25}
  .monthly-name small{font-size:10px!important;line-height:1.35!important}
  .monthly-previous,.monthly-delta{
    position:relative;
    min-width:0;
    padding-top:18px;
    font-size:13px!important;
    text-align:left;
  }
  .monthly-previous::before,.monthly-delta::before{
    content:attr(data-column-label)!important;
    position:absolute;
    top:0;
    left:0;
    color:var(--muted);
    font-size:9px;
    font-weight:850;
    line-height:1.15;
    letter-spacing:.06em;
    text-transform:uppercase;
    white-space:normal;
  }
  .monthly-current,.monthly-quality{
    position:relative;
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:18px!important;
  }
  .monthly-current::before{
    content:attr(data-column-label);
    position:absolute;
    top:-18px;
    left:0;
    color:var(--muted);
    font-size:9px;
    font-weight:850;
    line-height:1.15;
    letter-spacing:.06em;
    text-transform:uppercase;
    white-space:normal;
  }
  .monthly-quality::before{
    content:"Status & Qualität";
    position:absolute;
    top:-18px;
    left:0;
    color:var(--muted);
    font-size:9px;
    font-weight:850;
    line-height:1.15;
    letter-spacing:.06em;
    text-transform:uppercase;
    white-space:normal;
  }
  .monthly-current input,.monthly-quality select{min-width:0!important;width:100%!important;max-width:100%!important}
  .monthly-quality{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
    align-items:center!important;
  }
  .monthly-quality-confirm{white-space:nowrap!important}
  .monthly-confirm-group{margin:6px 18px 12px!important}

  .confirmed-flow-map.detailed{padding-inline:10px}
  .confirmed-flow-map.detailed svg{min-height:390px!important}
  .confirmed-flow-map.detailed>header{gap:12px}
  .confirmed-flow-map.detailed>header>span{max-width:260px;text-align:right}
}

@media (orientation:landscape) and (min-width:761px) and (max-width:1050px){
  .monthly-group>summary,.monthly-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .monthly-group>summary>span:first-child,.monthly-name{grid-column:1/-1!important}
}

/* R8.3.1 – surgical iPad hotfix.
 * Do not use Safari fractional grid sizing for monthly-close rows. The title
 * always owns a complete line; facts wrap as stable cards below it. */
.finance-overview-drilldown{
  display:grid;
  gap:8px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid #dfe8e5;
}
.finance-overview-drilldown>header{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:baseline;
}
.finance-overview-drilldown>header small{color:var(--muted);font-size:11px}
.finance-overview-group{
  border:1px solid #dde6e3;
  border-radius:11px;
  background:#fff;
  overflow:hidden;
}
.finance-overview-group>summary{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  min-height:54px;
  padding:10px 14px 10px 34px;
  list-style:none;
  cursor:pointer;
}
.finance-overview-group>summary::-webkit-details-marker{display:none}
.finance-overview-group>summary::before{
  content:"›";
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:var(--teal);
  font-weight:900;
}
.finance-overview-group[open]>summary::before{transform:translateY(-50%) rotate(90deg)}
.finance-overview-group>summary>span{display:grid;gap:2px;min-width:0}
.finance-overview-group>summary>span:last-child{text-align:right;flex:0 0 auto}
.finance-overview-group>summary small{color:var(--muted);font-size:10px;line-height:1.3}
.finance-overview-positions{padding:0 14px 8px;border-top:1px solid #e7edeb}
.finance-overview-position{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-height:52px;
  padding:8px 0;
  border-bottom:1px solid #edf1ef;
}
.finance-overview-position:last-child{border-bottom:0}
.finance-overview-position>span{display:grid;gap:2px;min-width:0}
.finance-overview-position small{color:var(--muted);font-size:10px;line-height:1.3}
.finance-overview-position>strong{white-space:nowrap}
.finance-overview-link{color:var(--teal)!important;font-weight:750}
.finance-overview-empty{padding:12px 0;color:var(--muted);font-size:11px}

@media (orientation:landscape) and (min-width:761px) and (max-width:1600px){
  .monthly-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .monthly-columns{display:none!important}
  .monthly-group{display:block!important;width:100%!important;max-width:100%!important}
  .monthly-group>summary{
    position:relative!important;
    display:flex!important;
    flex-wrap:wrap!important;
    grid-template-columns:none!important;
    grid-auto-flow:unset!important;
    width:100%!important;
    max-width:100%!important;
    gap:10px 14px!important;
    align-items:stretch!important;
    padding:13px 18px!important;
  }
  .monthly-group>summary>span:first-child{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    padding:0 0 2px 10px!important;
    grid-column:auto!important;
  }
  .monthly-group>summary>.monthly-summary-previous,
  .monthly-group>summary>.monthly-summary-current,
  .monthly-group>summary>.monthly-summary-delta,
  .monthly-group>summary>[data-monthly-group-quality]{
    flex:1 1 calc(25% - 14px)!important;
    width:auto!important;
    min-width:150px!important;
    max-width:none!important;
    padding:20px 10px 9px!important;
    margin:0!important;
    border:1px solid #e1e8e5;
    border-radius:9px;
    background:#fff;
    text-align:left!important;
    justify-self:auto!important;
  }
  .monthly-group>summary>[data-monthly-group-quality]{display:block!important}
  .monthly-structure-note{
    display:block!important;
    width:auto!important;
    max-width:none!important;
    margin:8px 18px 10px!important;
    padding:10px 12px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-subrows{display:block!important;width:auto!important;padding:0 18px 8px!important}
  .monthly-row{
    display:flex!important;
    flex-wrap:wrap!important;
    grid-template-columns:none!important;
    grid-auto-flow:unset!important;
    width:100%!important;
    max-width:100%!important;
    gap:10px 14px!important;
    align-items:stretch!important;
    padding:12px 0!important;
  }
  .monthly-name{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    grid-column:auto!important;
    padding:0!important;
  }
  .monthly-previous,.monthly-delta,.monthly-current,.monthly-quality{
    flex:1 1 calc(25% - 14px)!important;
    width:auto!important;
    min-width:150px!important;
    max-width:none!important;
    margin:0!important;
  }
  .monthly-previous,.monthly-delta{
    padding:20px 10px 9px!important;
    border:1px solid #e1e8e5;
    border-radius:9px;
    background:#fafcfb;
  }
  .monthly-current,.monthly-quality{margin-top:18px!important}
  .monthly-current input,.monthly-quality select{width:100%!important;min-width:0!important;max-width:100%!important}
  .monthly-quality{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
    align-items:center!important;
  }
  .monthly-confirm-group{margin:6px 18px 12px!important}
}

@media (orientation:landscape) and (min-width:761px) and (max-width:1050px){
  .monthly-group>summary>.monthly-summary-previous,
  .monthly-group>summary>.monthly-summary-current,
  .monthly-group>summary>.monthly-summary-delta,
  .monthly-group>summary>[data-monthly-group-quality],
  .monthly-previous,.monthly-delta,.monthly-current,.monthly-quality{
    flex-basis:calc(50% - 14px)!important;
    min-width:210px!important;
  }
  .finance-overview-position{grid-template-columns:minmax(0,1fr) auto}
}

/* The finance overview is itself the system view; give the expandable capital
 * structure the full content width instead of leaving an empty second column. */
.stability-finance-visuals>article[data-testid="capital-structure"]{grid-column:1/-1}

/* R8.3.2 – restore the proven wide monthly-close table and make the finance
 * overview a compact, period-aware drill-down. This block intentionally wins
 * over the experimental R8.3/R8.3.1 iPad card overrides above. */
@media (orientation:landscape) and (min-width:761px) and (max-width:1600px){
  .monthly-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .monthly-columns{
    display:grid!important;
    grid-template-columns:minmax(230px,1.7fr) minmax(105px,.68fr) minmax(150px,.9fr) minmax(100px,.65fr) minmax(175px,1fr)!important;
    gap:10px!important;
    align-items:center!important;
    padding:9px 15px!important;
  }
  .monthly-group{display:block!important;width:100%!important;max-width:100%!important}
  .monthly-group>summary,
  .monthly-row{
    display:grid!important;
    grid-template-columns:minmax(230px,1.7fr) minmax(105px,.68fr) minmax(150px,.9fr) minmax(100px,.65fr) minmax(175px,1fr)!important;
    grid-auto-flow:unset!important;
    gap:10px!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
  }
  .monthly-group>summary{
    position:relative!important;
    padding:11px 15px!important;
  }
  .monthly-group>summary>span:first-child,
  .monthly-name{
    display:grid!important;
    grid-column:auto!important;
    flex:none!important;
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    padding-left:14px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-group>summary>span:first-child{padding-left:0!important}
  .monthly-group>summary>.monthly-summary-previous,
  .monthly-group>summary>.monthly-summary-current,
  .monthly-group>summary>.monthly-summary-delta,
  .monthly-group>summary>[data-monthly-group-quality],
  .monthly-previous,.monthly-delta,.monthly-current,.monthly-quality{
    display:initial!important;
    flex:none!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    text-align:inherit!important;
  }
  .monthly-group>summary>[data-monthly-group-quality]{display:inline-flex!important}
  .monthly-subrows{display:block!important;width:auto!important;padding:0 15px!important}
  .monthly-row{padding:8px 0!important;border-top:1px solid #e8edeb!important}
  .monthly-previous,.monthly-delta{font-weight:700!important;font-size:12px!important}
  .monthly-current{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    border:1px solid var(--line)!important;
    border-radius:9px!important;
    background:#fff!important;
    padding-right:8px!important;
  }
  .monthly-current input{width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important}
  .monthly-quality{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:5px!important;
  }
  .monthly-quality select{width:100%!important;min-width:0!important;max-width:100%!important}
  .monthly-quality-confirm{white-space:nowrap!important}
  .monthly-confirm-group{margin:5px 15px 10px!important}
  .monthly-structure-note{display:none!important}
  .monthly-group>summary>.monthly-summary-previous::before,
  .monthly-group>summary>.monthly-summary-current::before,
  .monthly-group>summary>.monthly-summary-delta::before,
  .monthly-group>summary>[data-monthly-group-quality]::before,
  .monthly-previous::before,.monthly-delta::before,.monthly-current::before,.monthly-quality::before{
    content:none!important;
    display:none!important;
  }
}
@media (orientation:landscape) and (min-width:761px) and (max-width:1100px){
  .monthly-columns,.monthly-group>summary,.monthly-row{
    grid-template-columns:minmax(185px,1.3fr) 90px minmax(125px,.8fr) 85px minmax(150px,1fr)!important;
    gap:6px!important;
  }
  .monthly-columns{padding-inline:12px!important}
  .monthly-group>summary{padding-inline:12px!important}
  .monthly-subrows{padding-inline:12px!important}
  .monthly-confirm-group{margin-inline:12px!important}
}

/* Compact finance overview: closed by default, then reveal confirmed and draft
 * structures inside the same domain. No second page is required to understand
 * the system; the separate editor is only for changes. */
.finance-overview-drilldown{gap:10px;margin-top:14px;padding-top:12px}
.finance-overview-drilldown>header{padding:0 2px 3px}
.finance-overview-group{border:1px solid #dbe5e2;border-radius:13px;background:#fff;box-shadow:none}
.finance-overview-group>summary{min-height:64px;padding:11px 16px 11px 38px;gap:18px;background:#fff}
.finance-overview-group>summary::before{left:16px}
.finance-overview-group[open]>summary{background:#f8fbfa;border-bottom:1px solid #e4ebe8}
.finance-overview-group>summary>span:first-child b{font-size:15px;color:var(--ink)}
.finance-overview-group>summary>span:first-child small{margin-top:2px;font-size:10px}
.finance-overview-period-values{
  display:grid!important;
  grid-template-columns:auto auto;
  gap:2px 10px;
  align-items:baseline;
  text-align:right;
  white-space:nowrap;
}
.finance-overview-period-values small{font-size:9px!important;color:var(--muted)}
.finance-overview-period-values strong{font-size:13px;color:var(--nav)}
.finance-overview-period-values.single{grid-template-columns:auto auto}
.finance-overview-periods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:10px;background:#fbfcfb}
.finance-overview-period{overflow:hidden;border:1px solid #e2e9e6;border-radius:10px;background:#fff}
.finance-overview-period.draft{border-color:#dcc79c;background:#fffaf1}
.finance-overview-period>header{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:9px 11px;border-bottom:1px solid #e8eeeb;background:#f7faf9}
.finance-overview-period.draft>header{background:#fff6e6}
.finance-overview-period>header b{font-size:11px;color:var(--teal)}
.finance-overview-period>header small{font-size:9px;color:var(--muted);text-align:right}
.finance-overview-period .finance-overview-position{padding:8px 11px;min-height:47px}
.finance-overview-period .finance-overview-position b{font-size:12px}
.finance-overview-period .finance-overview-position small{font-size:9px}
.finance-overview-period .finance-overview-position strong{font-size:12px}
.finance-purpose-overview-pool{border-top:1px solid #edf1ef}
.finance-purpose-overview-pool:first-child{border-top:0}
.finance-purpose-overview-pool>header{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:9px 11px;background:#fafcfb}
.finance-purpose-overview-pool>header span{display:grid;gap:2px}.finance-purpose-overview-pool>header small{color:var(--muted);font-size:9px}
.finance-purpose-overview-contributions{padding:7px 11px 4px;border-top:1px dashed #d8e2de;background:#f8fbfa}.finance-purpose-overview-contributions>b{font-size:10px;color:var(--teal)}
.finance-sankey-periods{display:grid;gap:10px;margin-top:12px}
.finance-flow-period-block{padding:0!important;overflow:hidden}
.finance-flow-period-block>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;cursor:pointer;list-style:none}
.finance-flow-period-block>summary::-webkit-details-marker{display:none}
.finance-flow-period-block>summary::before{content:"›";color:var(--teal);font-weight:900;margin-right:6px}
.finance-flow-period-block[open]>summary::before{transform:rotate(90deg)}
.finance-flow-period-block>summary b{margin-right:auto}.finance-flow-period-block>summary span{font-size:10px;color:var(--muted)}
.finance-flow-period-block>.confirmed-flow-map{border-top:1px solid #e5ece9;border-radius:0}
.finance-primary-entry{margin-bottom:2px}

@media(max-width:1000px){
  .finance-overview-periods{grid-template-columns:1fr}
  .finance-overview-period-values{white-space:normal}
}

/* R8.3.3 – real iPad Safari breakpoint restoration.
 * Some iPads report a landscape CSS viewport below 761px (page zoom / Safari
 * viewport behavior). In that range styles.css previously switched the
 * monthly close to its phone layout. Keep the proven five-column close table
 * for landscape tablet widths as well. */
@media (orientation:landscape) and (min-width:650px) and (max-width:760px){
  .monthly-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    font-size:11px!important;
  }
  .monthly-columns{
    display:grid!important;
    grid-template-columns:minmax(180px,1.45fr) 76px minmax(108px,.82fr) 70px minmax(145px,1fr)!important;
    gap:5px!important;
    align-items:center!important;
    padding:8px 10px!important;
  }
  .monthly-group{display:block!important;width:100%!important;max-width:100%!important}
  .monthly-group>summary,
  .monthly-row{
    display:grid!important;
    grid-template-columns:minmax(180px,1.45fr) 76px minmax(108px,.82fr) 70px minmax(145px,1fr)!important;
    grid-auto-flow:unset!important;
    gap:5px!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
  }
  .monthly-group>summary{position:relative!important;padding:9px 10px!important}
  .monthly-group>summary>span:first-child,
  .monthly-name{
    display:grid!important;
    grid-column:auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding-left:10px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .monthly-group>summary>span:first-child{padding-left:0!important}
  .monthly-group>summary>strong:first-of-type,
  .monthly-group>summary>strong:nth-of-type(2){display:block!important}
  .monthly-group>summary>.monthly-summary-previous,
  .monthly-group>summary>.monthly-summary-current,
  .monthly-group>summary>.monthly-summary-delta,
  .monthly-group>summary>[data-monthly-group-quality],
  .monthly-previous,.monthly-delta,.monthly-current,.monthly-quality{
    grid-column:auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
  }
  .monthly-subrows{display:block!important;padding:0 10px!important}
  .monthly-row{padding:7px 0!important;border-top:1px solid #e8edeb!important}
  .monthly-name small{font-size:9px!important;line-height:1.2!important}
  .monthly-previous,.monthly-delta{font-size:11px!important;font-weight:700!important}
  .monthly-current{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    border:1px solid var(--line)!important;
    border-radius:8px!important;
    background:#fff!important;
    padding-right:5px!important;
  }
  .monthly-current input{height:34px!important;width:100%!important;min-width:0!important;padding-inline:4px!important}
  .monthly-quality{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:4px!important;
  }
  .monthly-quality select{height:34px!important;width:100%!important;min-width:0!important;padding-inline:4px!important}
  .monthly-quality-confirm{display:flex!important;white-space:nowrap!important;font-size:9px!important}
  .monthly-quality input{width:17px!important;height:17px!important}
  .monthly-confirm-group{margin:5px 10px 9px!important;min-height:36px!important}
  .monthly-structure-note{display:none!important}
  .monthly-group>summary>.monthly-summary-previous::before,
  .monthly-group>summary>.monthly-summary-current::before,
  .monthly-group>summary>.monthly-summary-delta::before,
  .monthly-group>summary>[data-monthly-group-quality]::before,
  .monthly-previous::before,.monthly-delta::before,.monthly-current::before,.monthly-quality::before{
    content:none!important;
    display:none!important;
  }
}

/* R8.3.4 — SINGLE SOURCE OF TRUTH FOR MONTHLY CLOSE TABLE
 * The monthly close is an iPad-first workflow. Previous experimental responsive
 * overrides are intentionally neutralized here. Step 1/2 always use the proven
 * five-column table used by R8; no orientation- or breakpoint-dependent card mode. */
#monthly-close-form .monthly-table{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  font-size:12px!important;
}
#monthly-close-form .monthly-columns,
#monthly-close-form .monthly-group>summary,
#monthly-close-form .monthly-row{
  display:grid!important;
  grid-template-columns:minmax(0,36fr) minmax(0,11fr) minmax(0,17fr) minmax(0,10fr) minmax(0,26fr)!important;
  grid-auto-flow:row!important;
  gap:8px!important;
  align-items:center!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  flex-wrap:nowrap!important;
}
#monthly-close-form .monthly-columns{
  padding:9px 15px!important;
  background:#eef3f1!important;
}
#monthly-close-form .monthly-group{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}
#monthly-close-form .monthly-group>summary{
  position:relative!important;
  padding:10px 15px!important;
  background:#fafcfb!important;
}
#monthly-close-form .monthly-subrows{
  display:block!important;
  width:auto!important;
  max-width:none!important;
  padding:0 15px!important;
}
#monthly-close-form .monthly-row{
  padding:8px 0!important;
  border-top:1px solid #e8edeb!important;
}
#monthly-close-form .monthly-group>summary>span:first-child,
#monthly-close-form .monthly-name{
  display:grid!important;
  grid-column:auto!important;
  flex:none!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding-left:14px!important;
  overflow:visible!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  white-space:normal!important;
}
#monthly-close-form .monthly-group>summary>span:first-child{padding-left:0!important}
#monthly-close-form .monthly-group>summary>span:first-child b,
#monthly-close-form .monthly-name b{
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  line-height:1.25!important;
}
#monthly-close-form .monthly-name small{
  font-size:9px!important;
  line-height:1.25!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
#monthly-close-form .monthly-group>summary>.monthly-summary-previous,
#monthly-close-form .monthly-group>summary>.monthly-summary-current,
#monthly-close-form .monthly-group>summary>.monthly-summary-delta,
#monthly-close-form .monthly-group>summary>[data-monthly-group-quality],
#monthly-close-form .monthly-previous,
#monthly-close-form .monthly-current,
#monthly-close-form .monthly-delta,
#monthly-close-form .monthly-quality{
  display:initial!important;
  grid-column:auto!important;
  flex:none!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  text-align:inherit!important;
  position:static!important;
}
#monthly-close-form .monthly-group>summary>[data-monthly-group-quality]{display:inline-flex!important}
#monthly-close-form .monthly-previous,
#monthly-close-form .monthly-delta{
  font-size:12px!important;
  font-weight:700!important;
}
#monthly-close-form .monthly-current{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  background:#fff!important;
  padding-right:8px!important;
}
#monthly-close-form .monthly-current input{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:38px!important;
  margin:0!important;
  padding:0 5px!important;
}
#monthly-close-form .monthly-quality{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:5px!important;
}
#monthly-close-form .monthly-quality select{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:38px!important;
  margin:0!important;
  padding:0 5px!important;
}
#monthly-close-form .monthly-quality-confirm{
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  white-space:nowrap!important;
  font-size:10px!important;
}
#monthly-close-form .monthly-quality input{width:18px!important;height:18px!important}
#monthly-close-form .monthly-confirm-group{margin:5px 15px 10px!important;min-height:38px!important}
#monthly-close-form .monthly-structure-note{display:none!important}
#monthly-close-form .monthly-group>summary>strong:first-of-type,
#monthly-close-form .monthly-group>summary>strong:nth-of-type(2){display:block!important}
#monthly-close-form .monthly-group>summary>.monthly-summary-previous::before,
#monthly-close-form .monthly-group>summary>.monthly-summary-current::before,
#monthly-close-form .monthly-group>summary>.monthly-summary-delta::before,
#monthly-close-form .monthly-group>summary>[data-monthly-group-quality]::before,
#monthly-close-form .monthly-previous::before,
#monthly-close-form .monthly-current::before,
#monthly-close-form .monthly-delta::before,
#monthly-close-form .monthly-quality::before{
  content:none!important;
  display:none!important;
}

/* Preserve usability if the page is ever genuinely narrow: horizontal scrolling
 * is preferable to destroying the table's information hierarchy. */
@media(max-width:640px){
  #monthly-close-form .monthly-table{overflow-x:auto!important}
  #monthly-close-form .monthly-columns,
  #monthly-close-form .monthly-group>summary,
  #monthly-close-form .monthly-row{min-width:690px!important}
}

/* R8.3.5 — ISOLATED MONTHLY CLOSE PRESENTATION
 * New mc8-* classes are the visual contract. Legacy monthly-* classes remain
 * only for behavior/test selectors and may no longer decide layout. */
#monthly-close-form .mc8-table{
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  border:1px solid var(--line)!important;
  border-radius:17px!important;
  background:#fff!important;
}
#monthly-close-form .mc8-columns,
#monthly-close-form .mc8-summary,
#monthly-close-form .mc8-row{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(280px,2fr) minmax(110px,.72fr) minmax(150px,.95fr) minmax(95px,.62fr) minmax(220px,1.35fr)!important;
  grid-template-rows:auto!important;
  grid-auto-flow:row!important;
  gap:12px!important;
  align-items:center!important;
  width:100%!important;
  min-width:930px!important;
  max-width:none!important;
  margin:0!important;
  transform:none!important;
}
#monthly-close-form .mc8-columns{
  padding:10px 18px!important;
  background:#eef3f1!important;
  color:var(--muted)!important;
  font-size:10px!important;
  font-weight:850!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
#monthly-close-form .mc8-group{
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  min-width:930px!important;
  max-width:none!important;
  margin:0!important;
  border-top:1px solid var(--line)!important;
  background:#fff!important;
}
#monthly-close-form .mc8-group:first-of-type{border-top:0!important}
#monthly-close-form .mc8-summary{
  position:relative!important;
  padding:11px 18px!important;
  background:#fafcfb!important;
  list-style:none!important;
  cursor:pointer!important;
}
#monthly-close-form .mc8-summary::-webkit-details-marker{display:none!important}
#monthly-close-form .mc8-title,
#monthly-close-form .mc8-name{
  box-sizing:border-box!important;
  display:grid!important;
  grid-column:1!important;
  gap:2px!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:0 0 0 14px!important;
  position:static!important;
  transform:none!important;
  text-align:left!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
#monthly-close-form .mc8-title{padding-left:0!important}
#monthly-close-form .mc8-title b,
#monthly-close-form .mc8-name b{
  display:block!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  line-height:1.25!important;
}
#monthly-close-form .mc8-title small,
#monthly-close-form .mc8-name small{
  display:block!important;
  color:var(--muted)!important;
  font-size:10px!important;
  line-height:1.3!important;
  white-space:normal!important;
}
#monthly-close-form .mc8-summary>.monthly-summary-previous,
#monthly-close-form .mc8-summary>.monthly-summary-current,
#monthly-close-form .mc8-summary>.monthly-summary-delta,
#monthly-close-form .mc8-summary>[data-monthly-group-quality],
#monthly-close-form .mc8-previous,
#monthly-close-form .mc8-current,
#monthly-close-form .mc8-delta,
#monthly-close-form .mc8-quality{
  box-sizing:border-box!important;
  grid-column:auto!important;
  grid-row:1!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  position:static!important;
  transform:none!important;
}
#monthly-close-form .mc8-summary>.monthly-summary-previous,
#monthly-close-form .mc8-summary>.monthly-summary-current,
#monthly-close-form .mc8-summary>.monthly-summary-delta{
  display:block!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  font-size:13px!important;
  text-align:left!important;
}
#monthly-close-form .mc8-summary>[data-monthly-group-quality]{
  display:inline-flex!important;
  justify-self:stretch!important;
  padding:4px 9px!important;
  border-radius:99px!important;
  text-align:left!important;
}
#monthly-close-form .mc8-subrows{
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  min-width:930px!important;
  max-width:none!important;
  margin:0!important;
  padding:0 18px!important;
  position:static!important;
  transform:none!important;
}
#monthly-close-form .mc8-row{
  padding:8px 0!important;
  border-top:1px solid #e8edeb!important;
  background:#fff!important;
}
#monthly-close-form .mc8-previous,
#monthly-close-form .mc8-delta{
  display:block!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  font-size:12px!important;
  font-weight:700!important;
  text-align:left!important;
}
#monthly-close-form .mc8-current{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  min-height:38px!important;
  padding:0 8px 0 0!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  background:#fff!important;
}
#monthly-close-form .mc8-current input{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:36px!important;
  margin:0!important;
  padding:0 8px!important;
  border:0!important;
  background:transparent!important;
  text-align:right!important;
}
#monthly-close-form .mc8-quality{
  display:grid!important;
  grid-template-columns:minmax(115px,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
#monthly-close-form .mc8-quality select{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:38px!important;
  margin:0!important;
}
#monthly-close-form .mc8-quality .monthly-quality-confirm{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  white-space:nowrap!important;
  min-width:max-content!important;
}
#monthly-close-form .mc8-columns>*::before,
#monthly-close-form .mc8-summary>*::before,
#monthly-close-form .mc8-row>*::before{content:none!important;display:none!important}
#monthly-close-form .monthly-structure-note{display:none!important}
#monthly-close-form .monthly-confirm-group{margin:6px 18px 11px!important}

@media(max-width:980px){
  #monthly-close-form .mc8-columns,
  #monthly-close-form .mc8-summary,
  #monthly-close-form .mc8-row,
  #monthly-close-form .mc8-group,
  #monthly-close-form .mc8-subrows{min-width:860px!important}
  #monthly-close-form .mc8-columns,
  #monthly-close-form .mc8-summary,
  #monthly-close-form .mc8-row{
    grid-template-columns:minmax(245px,1.8fr) 95px minmax(130px,.9fr) 82px minmax(205px,1.35fr)!important;
    gap:8px!important;
  }
}

#monthly-close-form .mc8-quality-shell{display:block!important;min-width:0!important;grid-column:auto!important;padding:0!important;margin:0!important}
#monthly-close-form .mc8-quality-shell>.monthly-quality{display:grid!important;grid-template-columns:minmax(115px,1fr) auto!important;align-items:center!important;gap:8px!important;width:100%!important;min-width:0!important;padding:0!important;border:0!important;background:transparent!important;grid-column:auto!important}
#monthly-close-form .mc8-quality-shell>.monthly-quality select{width:100%!important;min-width:0!important;max-width:none!important;height:38px!important;margin:0!important}
#monthly-close-form .mc8-quality-shell>.monthly-quality .monthly-quality-confirm{display:inline-flex!important;align-items:center!important;gap:4px!important;white-space:nowrap!important;min-width:max-content!important;grid-column:auto!important}
/* PCMS monthly close visual master — isolated from legacy responsive rules. */
#monthly-close-form .monthly-master-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;background:#f3f7f5;border:1px solid #d7e1de;border-radius:22px;margin:0 0 18px}
#monthly-close-form .monthly-master-table{width:100%;min-width:980px;border-collapse:collapse;table-layout:fixed;color:#132238;background:#f3f7f5}
#monthly-close-form .monthly-master-table col.c-name{width:37%}
#monthly-close-form .monthly-master-table col.c-prev{width:11%}
#monthly-close-form .monthly-master-table col.c-current{width:16%}
#monthly-close-form .monthly-master-table col.c-delta{width:11%}
#monthly-close-form .monthly-master-table col.c-quality{width:25%}
#monthly-close-form .monthly-master-table th{padding:12px 16px;background:#edf3f1;border-bottom:1px solid #dfe7e4;text-align:left;font-size:11px;line-height:1.2;letter-spacing:.13em;text-transform:uppercase;color:#61706f;white-space:nowrap}
#monthly-close-form .monthly-master-table th:not(:first-child){text-align:right}
#monthly-close-form .monthly-master-table td{padding:11px 16px;border-bottom:1px solid #e2e9e6;vertical-align:middle;min-width:0}
#monthly-close-form .monthly-master-summary td{background:#f6f9f8;font-weight:700}
#monthly-close-form .monthly-master-summary td:not(:first-child){text-align:right;white-space:nowrap}
#monthly-close-form .monthly-master-toggle{display:flex;align-items:flex-start;gap:8px;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
#monthly-close-form .monthly-master-toggle b,#monthly-close-form .monthly-name b{display:block;font-size:15px;line-height:1.25;letter-spacing:0;text-transform:none;white-space:normal;word-break:normal;overflow-wrap:normal}
#monthly-close-form .monthly-master-toggle small,#monthly-close-form .monthly-name small{display:block;margin-top:2px;font-size:11px;line-height:1.25;font-weight:400;letter-spacing:0;text-transform:none;color:#687675;white-space:normal}
#monthly-close-form .monthly-master-chevron{flex:0 0 12px;font-size:16px;line-height:1.1;color:#204e59}
#monthly-close-form .monthly-name{padding-left:30px!important}
#monthly-close-form .monthly-master-item td:nth-child(2),#monthly-close-form .monthly-master-item td:nth-child(4){text-align:right;font-weight:700;white-space:nowrap}
#monthly-close-form .monthly-current{display:flex;align-items:center;justify-content:flex-end;gap:5px;min-width:0}
#monthly-close-form .monthly-current input{width:100%;min-width:0;max-width:220px;height:42px;padding:8px 12px;border:1px solid #d2dcda;border-radius:12px;background:white;text-align:right;font:inherit;font-weight:700}
#monthly-close-form .monthly-quality{display:grid;grid-template-columns:minmax(120px,1fr) auto;align-items:center;gap:9px}
#monthly-close-form .monthly-quality select{width:100%;min-width:0;height:42px;padding:7px 10px;border:1px solid #d2dcda;border-radius:10px;background:white;font:inherit}
#monthly-close-form .monthly-quality-confirm{display:flex;align-items:center;justify-content:flex-start;gap:6px;white-space:nowrap;font-size:13px;font-weight:500;min-width:44px;min-height:44px}
#monthly-close-form .monthly-quality-confirm input{width:22px;height:22px;margin:0}
#monthly-close-form .monthly-master-confirm td{padding:8px 16px 14px 30px;border-bottom:1px solid #dfe7e4}
#monthly-close-form .monthly-confirm-group{margin:0;min-height:42px}
#monthly-close-form .monthly-empty{padding-left:30px!important;color:#687675}
#monthly-close-form .quality-pill{display:inline-flex;justify-content:flex-start;min-width:120px;max-width:100%;padding:5px 10px;border-radius:999px;background:#e5f1ee;color:#2b5d5b;font-size:11px;line-height:1.2;white-space:nowrap}
#monthly-close-form .quality-pill.attention{background:#fff0d5;color:#b06f10}
#monthly-close-form .positive{color:#26784a}
#monthly-close-form .negative{color:#b14935}
@media (max-width:1100px){#monthly-close-form .monthly-master-table{min-width:900px}#monthly-close-form .monthly-master-table th,#monthly-close-form .monthly-master-table td{padding-left:12px;padding-right:12px}#monthly-close-form .monthly-name{padding-left:24px!important}}

/* R8.3.7 — native table-cell integrity.
   Legacy .monthly-name { display:grid } must never escape into the native
   monthly-close table. Safari otherwise removes the name TD from the table
   layout and leaves the visible 37% first column empty. */
#monthly-close-form .monthly-master-table{display:table!important;width:100%!important;min-width:0!important;table-layout:fixed!important}
#monthly-close-form .monthly-master-table colgroup{display:table-column-group!important}
#monthly-close-form .monthly-master-table col{display:table-column!important}
#monthly-close-form .monthly-master-table thead{display:table-header-group!important}
#monthly-close-form .monthly-master-table tbody{display:table-row-group!important}
#monthly-close-form .monthly-master-table tr{display:table-row!important}
#monthly-close-form .monthly-master-table th,
#monthly-close-form .monthly-master-table td,
#monthly-close-form .monthly-master-table td.monthly-name{
  display:table-cell!important;
  position:static!important;
  grid-column:auto!important;
  grid-row:auto!important;
  width:auto!important;
  max-width:none!important;
  box-sizing:border-box!important;
}
#monthly-close-form .monthly-master-wrap{width:100%!important;max-width:100%!important;overflow-x:visible!important}
#monthly-close-form .monthly-master-table col.c-name{width:37%!important}
#monthly-close-form .monthly-master-table col.c-prev{width:11%!important}
#monthly-close-form .monthly-master-table col.c-current{width:16%!important}
#monthly-close-form .monthly-master-table col.c-delta{width:11%!important}
#monthly-close-form .monthly-master-table col.c-quality{width:25%!important}
#monthly-close-form .monthly-master-table td.monthly-name{padding-left:30px!important;text-align:left!important}

/* R8.3.8 — isolated monthly-close layout. No legacy monthly-* layout classes inside Step 1/2. */
#monthly-close-form .mcx-wrap{width:100%;max-width:100%;overflow:hidden;background:#f4f8f6;border:1px solid #d7e1de;border-radius:22px;margin:0 0 18px}
#monthly-close-form .mcx-table{width:100%;border-collapse:collapse;table-layout:fixed;color:#132238;background:#f4f8f6}
#monthly-close-form .mcx-table col.mcx-c-name{width:36%}
#monthly-close-form .mcx-table col.mcx-c-prev{width:12%}
#monthly-close-form .mcx-table col.mcx-c-now{width:16%}
#monthly-close-form .mcx-table col.mcx-c-delta{width:11%}
#monthly-close-form .mcx-table col.mcx-c-quality{width:25%}
#monthly-close-form .mcx-table th{padding:12px 18px;background:#edf3f1;border-bottom:1px solid #dfe7e4;text-align:left;font-size:11px;line-height:1.2;letter-spacing:.13em;text-transform:uppercase;color:#61706f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#monthly-close-form .mcx-table td{padding:12px 18px;border-bottom:1px solid #dfe7e4;vertical-align:middle;min-width:0}
#monthly-close-form .mcx-summary{background:#f1f6f4}
#monthly-close-form .mcx-summary td{font-weight:700}
#monthly-close-form .mcx-toggle{appearance:none;border:0;background:transparent;padding:0;margin:0;display:flex;align-items:center;gap:10px;width:100%;text-align:left;color:#14243a;font:inherit;cursor:pointer}
#monthly-close-form .mcx-toggle .mcx-chevron{flex:0 0 12px;color:#19495a;font-weight:800}
#monthly-close-form .mcx-toggle span:last-child{display:flex;flex-direction:column;min-width:0}
#monthly-close-form .mcx-toggle b,#monthly-close-form .mcx-name b{display:block;font-size:15px;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
#monthly-close-form .mcx-toggle small,#monthly-close-form .mcx-name small{display:block;margin-top:2px;font-size:10px;line-height:1.25;color:#687674;font-weight:500;white-space:normal}
#monthly-close-form .mcx-name{padding-left:36px!important}
#monthly-close-form .mcx-prev,#monthly-close-form .mcx-summary-prev,#monthly-close-form .mcx-summary-now,#monthly-close-form .mcx-summary-delta,#monthly-close-form .mcx-delta{font-weight:700;white-space:nowrap;text-align:left}
#monthly-close-form .mcx-delta.positive,#monthly-close-form .mcx-summary-delta.positive{color:#267a4b}
#monthly-close-form .mcx-delta.negative,#monthly-close-form .mcx-summary-delta.negative{color:#b64b30}
#monthly-close-form .mcx-money{display:flex;align-items:center;gap:6px;width:100%;max-width:180px;margin:0}
#monthly-close-form .mcx-money input{width:100%;min-width:0;height:42px;padding:8px 12px;border:1px solid #ced9d6;border-radius:12px;background:#fff;text-align:right;font:700 14px/1.2 inherit;box-sizing:border-box}
#monthly-close-form .mcx-money b{flex:0 0 auto;font-size:14px}
#monthly-close-form .mcx-quality{display:flex;align-items:center;gap:8px;width:100%;min-width:0}
#monthly-close-form .mcx-quality select{flex:1 1 auto;min-width:0;width:100%;height:42px;padding:7px 10px;border:1px solid #ced9d6;border-radius:12px;background:#fff;font-size:13px}
#monthly-close-form .mcx-quality label{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px}
#monthly-close-form .mcx-quality input{width:20px;height:20px;margin:0}
#monthly-close-form .mcx-confirm td{padding:10px 18px 14px}
#monthly-close-form .mcx-confirm .btn{min-height:44px}
#monthly-close-form .mcx-empty{color:#667574;font-size:13px}
@media(max-width:900px){
  #monthly-close-form .mcx-table col.mcx-c-name{width:34%}
  #monthly-close-form .mcx-table col.mcx-c-prev{width:12%}
  #monthly-close-form .mcx-table col.mcx-c-now{width:17%}
  #monthly-close-form .mcx-table col.mcx-c-delta{width:10%}
  #monthly-close-form .mcx-table col.mcx-c-quality{width:27%}
  #monthly-close-form .mcx-table th,#monthly-close-form .mcx-table td{padding-left:12px;padding-right:12px}
  #monthly-close-form .mcx-name{padding-left:28px!important}
  #monthly-close-form .mcx-toggle b,#monthly-close-form .mcx-name b{font-size:14px}
  #monthly-close-form .mcx-quality{gap:5px}
}

#monthly-close-form .mcx-quality-confirm{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;white-space:nowrap!important;min-width:44px!important;min-height:44px!important}
#monthly-close-form .mcx-quality-confirm input{width:22px!important;height:22px!important}

/* R8.6 groundwork – shared master-detail structure. */
.finance-master-detail{display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.45fr);gap:14px;margin-top:12px;align-items:start}
.finance-master-list,.finance-master-editor{min-width:0;border:1px solid var(--line);border-radius:20px;background:#fff;padding:17px}
.finance-master-list{display:grid;gap:12px}.finance-master-list h2{margin:4px 0 0;font-family:Georgia,"Times New Roman",serif}.finance-master-list .section-head{align-items:center}
.finance-master-list .btn.primary{min-height:44px;white-space:nowrap}.finance-master-rows{display:grid;gap:7px}
.finance-master-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name amount" "name action";gap:3px 12px;align-items:center;width:100%;min-height:64px;padding:10px 11px;border:1px solid #dfe8e5;border-radius:12px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.finance-master-row:hover{border-color:#a9c8c1;background:#f8fbfa}.finance-master-row.active{border-color:var(--teal);box-shadow:inset 4px 0 0 var(--teal);background:#f1f8f6}
.finance-master-row>span{grid-area:name;display:grid;gap:3px;min-width:0}.finance-master-row small{color:var(--muted)}.finance-master-row strong{grid-area:amount;color:var(--nav);white-space:nowrap}.finance-master-row em{grid-area:action;justify-self:end;color:var(--teal);font-size:11px;font-style:normal;font-weight:800}
.finance-master-context{display:grid;gap:7px;padding-top:10px;border-top:1px solid var(--line)}.finance-master-context .status{justify-self:start}.finance-master-context p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.finance-master-editor{min-height:390px}.finance-master-editor .finance-editor{gap:15px}.finance-master-editor .editor-head{padding-bottom:11px;border-bottom:1px solid var(--line)}.finance-master-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.finance-master-actions .danger{margin-left:auto}
.finance-master-empty{display:grid;gap:5px;padding:16px;border:1px dashed #bccbc6;border-radius:12px;background:#fafcfb}.finance-master-empty span{color:var(--muted);font-size:12px;line-height:1.45}
@media(max-width:900px){.finance-master-detail{grid-template-columns:minmax(270px,.9fr) minmax(0,1.25fr)}.finance-master-list,.finance-master-editor{padding:13px}.finance-master-list .section-head{align-items:flex-start;flex-direction:column}.finance-master-list .btn.primary{width:100%}.finance-master-editor .finance-editor-grid{grid-template-columns:1fr}.finance-master-actions .danger{margin-left:0}}
@media(max-width:700px){.finance-master-detail{grid-template-columns:1fr}.finance-master-editor{min-height:0}}

/* R8.3.9 — cross-page visual rhythm and reliable monthly accordion affordance. */
:root{
  --pcms-page-gap:16px;
  --pcms-section-radius:18px;
  --pcms-card-border:#d9e3e0;
}
.page-hero{margin-bottom:var(--pcms-page-gap)!important;border-radius:var(--pcms-section-radius)!important}
.card,.review-chart,.system-visual-panel,.monthly-assessment,.monthly-reconcile,.purpose-capital-panel{
  border-radius:var(--pcms-section-radius)!important;
}
#monthly-close-form .mcx-wrap{border-radius:var(--pcms-section-radius)!important}
#monthly-close-form .mcx-summary{cursor:pointer}
#monthly-close-form .mcx-summary td:first-child{padding-left:18px}
#monthly-close-form .mcx-toggle{min-height:52px;padding:4px 0}
#monthly-close-form .mcx-chevron{font-size:18px;line-height:1;transition:transform .15s ease}
#monthly-close-form [data-open="true"] .mcx-chevron{transform:rotate(0deg)}
#monthly-close-form [data-open="false"] .mcx-chevron{transform:rotate(0deg)}
#monthly-close-form .mcx-summary:hover{background:#edf4f1}
#monthly-close-form .mcx-summary:focus-within{outline:2px solid rgba(28,84,91,.18);outline-offset:-2px}

/* Match the stronger finance-system information hierarchy across core pages. */
.center-metrics,.plan-main-grid,.review-intelligence,.system-head-split{gap:12px!important}
.monthly-actions{margin-top:16px!important}
.finance-primary-entry,.pcms-insight,.monthly-assessment,.review-intelligence{box-shadow:none!important}

/* R8.3.9 final — use the finance-system's clearer surface hierarchy across core pages. */
.content{padding-left:max(22px,env(safe-area-inset-left))!important;padding-right:max(22px,env(safe-area-inset-right))!important}
.page-hero{width:100%;box-shadow:none!important}
#monthly-close-form .mcx-summary{cursor:pointer!important;transition:background .12s ease}
#monthly-close-form .mcx-summary:active{background:#eaf2ef!important}
#monthly-close-form .mcx-summary td{pointer-events:auto}
#monthly-close-form .mcx-toggle{cursor:pointer!important}
#monthly-close-form .mcx-toggle::after{content:"";position:absolute;inset:0}
#monthly-close-form .mcx-toggle{position:relative}
@media (orientation:landscape) and (min-width:700px){
  .content{padding-top:18px!important;padding-bottom:30px!important}
  .page-hero{padding:18px 24px!important}
  .page-hero h1{font-size:clamp(30px,3vw,42px)!important}
  #monthly-close-form .mcx-table th{padding-top:11px;padding-bottom:11px}
  #monthly-close-form .mcx-table td{padding-top:10px;padding-bottom:10px}
}

/* R8.4 — final cross-page polish and semantic money-flow language. */
:root{
  --pcms-income:#6ea995;
  --pcms-income-band:#9bc8ba;
  --pcms-external:#b96e62;
  --pcms-external-soft:#c9877c;
  --pcms-build:#3f8776;
  --pcms-build-soft:#6fa493;
  --pcms-open:#c8aa65;
  --pcms-open-soft:#dac89b;
  --pcms-surface-soft:#f5f8f7;
  --pcms-surface-warm:#fffbf4;
  --pcms-panel-gap:12px;
}

/* Shared hierarchy: finance remains the visual reference, while Center/Plan/Review
   inherit the same calmer spacing, surface weight and CTA behavior. */
.stability-page{gap:12px}
.stability-page :where(.stability-kpi,.stability-target,.center-development-summary,.center-flow-summary,.snapshot-timeline-workspace,.plan-target-deviation){box-shadow:none}
.stability-page :where(.stability-kpi,.stability-target,.center-development-summary,.center-flow-summary,.snapshot-timeline-workspace,.plan-target-deviation){border-color:var(--pcms-card-border)}
.stability-page-action{margin-top:0}
.stability-page-action .btn{min-height:48px}
.pcms-insight{margin-top:0!important}

/* Center: do not spend chart-sized space on a single immutable starting point. */
.center-overview-grid.single-point{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}
.center-development-summary.single-point{padding:14px 16px}
.center-development-summary.single-point>header{margin-bottom:8px}
.center-development-summary.single-point>div{gap:7px}
.center-trend.single-point{padding:10px 12px;display:grid;gap:7px;align-content:start;min-height:118px;background:var(--pcms-surface-soft)}
.center-trend.single-point svg{display:none}
.center-trend-baseline{display:grid;gap:2px;padding-top:7px;border-top:1px solid #e1e9e6}
.center-trend-baseline span{color:var(--ink);font-size:11px;font-weight:750}
.center-trend-baseline small{color:var(--muted);font-size:9.5px;line-height:1.35}
.center-trend.single-point>footer{margin-top:auto}
.center-trend.single-point>footer b{color:var(--muted);font-weight:750}

/* Plan: open goals remain honest, but consume less space until they are actionable. */
.stability-target[data-assessable="false"]{gap:7px;padding:13px 15px;background:#fff}
.stability-target[data-assessable="false"] dl{gap:6px}
.stability-target[data-assessable="false"] dl>div{padding:7px 9px;background:var(--pcms-surface-soft)}
.stability-target[data-assessable="false"] .target-current{background:#edf5f2}
.stability-target[data-assessable="false"]>small{min-height:0;margin-top:-1px}
.plan-primary-action{display:flex;justify-content:flex-end;align-items:center;padding:0 0 1px}
.plan-primary-action .btn{min-width:150px}
.plan-target-deviation.blocked{padding:14px 17px;gap:8px}
.plan-target-deviation.blocked>header{gap:1px}
.plan-target-deviation.blocked .plan-deviation-blocker{padding:10px 14px}
.plan-target-deviation.blocked .plan-deviation-blocker p{margin-top:1px}

/* Review: a single snapshot is a baseline, not yet a time series. Keep the full
   component contract in the DOM, but replace the visually empty chart with a
   compact baseline summary until a second confirmed month exists. */
.snapshot-timeline-workspace.single-point{padding:15px 17px;gap:10px}
.snapshot-timeline-workspace.single-point>header{align-items:end}
.snapshot-timeline-workspace.single-point .timeline-legend{display:none}
.snapshot-timeline-workspace.single-point .snapshot-timeline{display:none}
.timeline-single-point{display:grid;grid-template-columns:minmax(230px,.8fr) repeat(3,minmax(0,1fr));gap:8px;padding:10px 0 2px}
.timeline-single-point>div,.timeline-single-point>article{display:grid;gap:3px;min-width:0;padding:11px 12px;border:1px solid #e1e8e6;border-radius:12px;background:var(--pcms-surface-soft)}
.timeline-single-point>div{background:#edf5f2}
.timeline-single-point span,.timeline-single-point small{color:var(--muted);font-size:10px;line-height:1.35}
.timeline-single-point strong{color:var(--nav);font-size:17px;font-weight:820;font-variant-numeric:tabular-nums}
.snapshot-timeline-workspace.single-point .timeline-source-note{margin-top:1px}
.snapshot-timeline-workspace.single-point .timeline-data-details{margin-top:0}
.pro-review>.stability-kpis{max-width:720px;grid-template-columns:repeat(2,minmax(0,1fr))}

/* Sankey semantic language.
   Income = mint positive source; external consumption/debt = warm red;
   controlled wealth building = deeper green; unresolved/open = warm neutral. */
.confirmed-flow-map.detailed .sankey-detail-source.semantic-income .sankey-flow-band{stroke:var(--pcms-income-band)!important;opacity:.8}
.confirmed-flow-map.detailed .sankey-detail-source.semantic-income rect{fill:var(--pcms-income)!important}
.confirmed-flow-map.detailed .confirmed-flow-source{fill:var(--nav)!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-external-outflow .sankey-flow-band{stroke:var(--pcms-external-soft)!important;opacity:.72}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-external-outflow rect{fill:var(--pcms-external)!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-external-outflow.debt .sankey-flow-band{stroke:#a95f55!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-external-outflow.debt rect{fill:#a95f55!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-capital-build .sankey-flow-band{stroke:var(--pcms-build-soft)!important;opacity:.78}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-capital-build rect{fill:var(--pcms-build)!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-capital-build.purpose rect{fill:#5d9484!important}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-open-balance .sankey-flow-band{stroke:var(--pcms-open-soft)!important;opacity:.74}
.confirmed-flow-map.detailed .confirmed-flow-band.semantic-open-balance rect{fill:var(--pcms-open)!important}
.confirmed-flow-map.detailed .sankey-label-connector{stroke:#9baca7!important;opacity:.62}
.confirmed-flow-legend.detailed i.semantic-income{background:var(--pcms-income)!important}
.confirmed-flow-legend.detailed i.semantic-external-outflow{background:var(--pcms-external)!important}
.confirmed-flow-legend.detailed i.semantic-capital-build{background:var(--pcms-build)!important}
.confirmed-flow-legend.detailed i.semantic-open-balance{background:var(--pcms-open)!important}
.confirmed-flow-legend.detailed>div[data-flow-class="external-outflow"] strong{color:#9d584e}
.confirmed-flow-legend.detailed>div[data-flow-class="capital-build"] strong{color:#347663}
.confirmed-flow-legend.detailed>div[data-flow-class="income"] strong{color:#3f806e}
.confirmed-flow-legend.detailed>div[data-flow-class="open-balance"] strong{color:#8c743a}
.finance-flow-period-block.draft{background:var(--pcms-surface-warm)}

/* Small cross-page typography alignment with the Finance System. */
.pro-center .center-development-summary h2,.pro-center .center-flow-summary h2,.pro-plan .plan-target-deviation h2,.pro-review .snapshot-timeline-workspace h2{font-size:clamp(20px,2vw,27px)}
.pro-plan .stability-target>span{font-size:16px}
.pro-review .stability-period-marker,.pro-plan .stability-period-marker{margin-top:-3px}

@media (orientation:landscape) and (min-width:900px){
  .center-overview-grid.single-point{gap:12px}
  .timeline-single-point{grid-template-columns:minmax(230px,.9fr) repeat(3,minmax(0,1fr))}
  .pro-plan .stability-target-grid{gap:12px}
}
@media(max-width:900px){
  .timeline-single-point{grid-template-columns:1fr 1fr}
  .center-overview-grid.single-point{grid-template-columns:1fr}
}
.flow-semantic-key{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:9px;padding:8px 10px;border:1px solid #e4ebe8;border-radius:11px;background:#fbfdfc}
.flow-semantic-key span{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:10px;font-weight:750}
.flow-semantic-key span::before{content:"";width:9px;height:9px;border-radius:99px;background:#999}
.flow-semantic-key .income::before{background:var(--pcms-income)}
.flow-semantic-key .external-outflow::before{background:var(--pcms-external)}
.flow-semantic-key .capital-build::before{background:var(--pcms-build)}
.flow-semantic-key .open-balance::before{background:var(--pcms-open)}
/* R8.5 — Usability simplification: overview is the finance-system home. */
.finance-overview-period.draft > header,
.finance-overview-period.confirmed > header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.finance-overview-period > header > span {display:flex;flex-direction:column;gap:3px;}
.finance-direct-edit {flex:0 0 auto;white-space:nowrap;}
.finance-breadcrumb {font-size:.88rem;color:var(--muted);font-weight:700;letter-spacing:.02em;}
.monthly-resolve-blocker {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.9fr);
  align-items:center;
  gap:18px;
  padding:14px 0;
}
.monthly-resolve-blocker > div:first-child {display:flex;flex-direction:column;gap:4px;}
.monthly-resolve-blocker small {color:var(--muted);}
.monthly-resolve-action {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;}
.monthly-resolve-action select {min-height:48px;width:100%;}
@media (max-width: 760px){
  .monthly-resolve-blocker {grid-template-columns:1fr;}
  .monthly-resolve-action {grid-template-columns:1fr;}
}
.finance-overview-position {grid-template-columns:minmax(0,1fr) auto auto;}
.finance-position-edit {white-space:nowrap;margin-left:8px;}

/* R8.6 – one master-detail interaction for financial positions and flows. */
.finance-master-detail>*{min-width:0}
.finance-master-editor{min-height:0;overflow:hidden}
.finance-master-editor .finance-editor-grid>label,
.purpose-master-form .finance-editor-grid>label{display:grid;gap:6px;align-content:start;min-width:0}
.finance-master-editor .finance-editor-grid>label>small,
.purpose-master-form .finance-editor-grid>label>small{display:block;color:var(--muted);font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.finance-master-editor :where(input,select),.purpose-master-form :where(input,select){width:100%;min-width:0;max-width:100%}
.finance-master-actions{justify-content:flex-start;padding-top:2px}
.finance-master-actions .danger{margin-left:0}
.finance-link-field{grid-column:1/-1;padding:11px 12px;border:1px solid #d9e7e3;border-radius:12px;background:#f5f9f8}
.finance-master-row small{overflow-wrap:anywhere}
.finance-master-row strong{font-variant-numeric:tabular-nums}

.purpose-master-panel{display:grid;gap:14px}
.purpose-master-panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.purpose-master-panel>header h2{margin:4px 0 7px}
.purpose-master-panel>header p{margin:0;color:var(--muted);line-height:1.5}
.purpose-pool-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 1px 5px}
.purpose-pool-tabs button{display:grid;gap:3px;min-width:180px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit;text-align:left}
.purpose-pool-tabs button span{font-weight:800}.purpose-pool-tabs button strong{color:var(--nav);font-size:13px}
.purpose-pool-tabs button.active{border-color:var(--teal);box-shadow:inset 4px 0 0 var(--teal);background:#f1f8f6}
.purpose-section-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.purpose-section-switch button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:#f7f9f8;color:var(--ink);font:inherit;text-align:left}
.purpose-section-switch button span{font-weight:850}.purpose-section-switch button strong{white-space:nowrap;color:var(--nav)}
.purpose-section-switch button.active{border-color:var(--teal);background:#eaf4f1}
.purpose-master-detail{margin-top:0}
.purpose-master-detail .finance-master-list h3{margin:4px 0 0;font-family:Georgia,"Times New Roman",serif;font-size:23px}
.purpose-master-form{display:grid;gap:15px}
.purpose-new-focused{padding:16px;border:1px solid var(--line);border-radius:16px;background:#fbfcfc}

@media(max-width:900px){
  .finance-master-detail{grid-template-columns:minmax(245px,.82fr) minmax(0,1.18fr)}
  .finance-master-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"name" "amount" "action"}
  .finance-master-row strong,.finance-master-row em{justify-self:start}
  .purpose-master-panel>header{flex-direction:column}
  .purpose-section-switch{grid-template-columns:1fr}
}
@media(max-width:700px){
  .finance-master-detail{grid-template-columns:1fr}
  .purpose-master-panel>header>.btn{width:100%}
}

/* R8.8 – initial target setup and first analysis. */
.initial-target-shell{display:grid;gap:16px;min-width:0}
.initial-analysis{display:grid;gap:16px;margin-bottom:18px;padding:20px;border:1px solid #d9e7e3;border-radius:20px;background:linear-gradient(145deg,#f7fbfa,#fff)}
.initial-analysis>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.initial-analysis>header h1{margin:4px 0 7px}
.initial-analysis>header p{max-width:760px;margin:0;color:var(--muted);line-height:1.5}
.initial-analysis-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.initial-analysis-grid article{display:grid;align-content:start;gap:8px;min-width:0;padding:16px;border:1px solid var(--line);border-radius:15px;background:#fff}
.initial-analysis-grid article>span{color:var(--teal);font-size:12px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}
.initial-analysis-grid h2{display:grid;gap:5px;margin:0;font-size:clamp(18px,1.9vw,25px);line-height:1.16}
.initial-analysis-grid h2 span,.initial-analysis-grid p,.initial-analysis-grid small{margin:0;color:var(--muted);font-family:inherit;font-size:12px;font-weight:600;line-height:1.45}
.initial-analysis-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}
.target-setup-status{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 20px;margin-bottom:18px;padding:18px;border:1px solid #e4d7b4;border-radius:18px;background:#fffaf0}
.target-setup-status h2{margin:4px 0 6px}.target-setup-status p{margin:0;color:var(--muted)}
.target-setup-actions{display:flex;align-items:center;gap:9px}
.target-setup-status aside{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding-top:12px;border-top:1px solid #eadfca}
.target-setup-status aside span{flex:1}.target-setup-status aside small{color:var(--muted)}
.initial-month-wait{margin-bottom:14px}
.basic-target-review{max-width:960px;margin-inline:auto}
@media(max-width:900px){
  .initial-analysis-grid{grid-template-columns:1fr}
  .target-setup-status{grid-template-columns:1fr}
  .target-setup-status aside{grid-column:1}
  .target-setup-actions{justify-content:flex-start;flex-wrap:wrap}
}
@media(max-width:700px){
  .initial-analysis>header,.target-setup-status aside{align-items:flex-start;flex-direction:column}
  .initial-analysis-actions{display:grid;grid-template-columns:1fr}
}