/* ============================================================
   Decision Detail (RESULTS) — layout styles for the finance
   results screen. Dense widgets carry their own fin-* styles;
   this is the page scaffold. Tokens only.
   ============================================================ */
.ddx { display: flex; flex-direction: column; gap: var(--space-5); width: 100%; }

/* header */
.ddx-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-5); flex-wrap: wrap;
  padding-bottom: var(--space-3); border-bottom: 2px solid var(--fin-navy);
}
.ddx-head__crumbs { display: flex; align-items: center; gap: var(--space-2); font-size: 12px; color: var(--ink-tertiary); white-space: nowrap; }
.ddx-crumb { color: var(--info-link); text-decoration: none; }
.ddx-crumb:hover { text-decoration: underline; }
.ddx-sep { color: var(--ink-disabled); }
.ddx-head__sel { font-family: var(--font-mono); color: var(--ink-secondary); }
.ddx-head__title { margin: var(--space-1) 0 var(--space-1); font-size: 22px; font-weight: 700; color: var(--ink-primary); }
.ddx-head__meta { margin: 0; font-size: 13px; color: var(--ink-secondary); }
.ddx-head__scn { color: var(--accent-data); font-weight: 600; }
.ddx-recpill { display: inline-block; white-space: nowrap; background: var(--accent-primary); color: var(--surface-raised); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 1px 6px; border-radius: 999px; vertical-align: middle; }
.ddx-models { display: flex; flex-direction: column; gap: 2px; min-width: 160px; }
.ddx-models__lbl { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-tertiary); }
.ddx-models__val { font-family: var(--fin-num); font-size: 18px; font-weight: 700; color: var(--fin-green); }
.ddx-models__bar { height: 5px; background: var(--surface-sunk); border-radius: 3px; overflow: hidden; }
.ddx-models__bar span { display: block; height: 100%; background: var(--fin-green); }

/* sections (legacy — kept harmless; detail now composes BiTiles) */
.ddx-section { scroll-margin-top: var(--space-4); }
.ddx-section__titler { display: flex; align-items: baseline; gap: var(--space-3); }

/* dense-grid tiles use BiTile `flush` (padding 0 + own scroll); this wrapper
   restores Workspace-equivalent breathing room while keeping the horizontal
   scroll for wide finance grids. Works in unified + standalone (no ws-pad dep). */
.ddx-tilepad { padding: var(--space-4); overflow: auto; }

/* locale toggle in toolbar */
.ddx-locale { display: inline-flex; gap: 4px; background: var(--surface-raised); border: 1px solid var(--line-default); border-radius: var(--radius-sm); padding: 3px var(--space-2); cursor: pointer; color: var(--ink-tertiary); font: inherit; font-size: 12px; font-weight: 600; }
.ddx-locale .is-on { color: var(--accent-primary); }

/* embedded sensitivity grid */
.ddx-sens { margin-top: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); }
.ddx-sens__hd { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink-secondary); }

/* provenance footer */
.ddx-prov { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; padding: var(--space-3) var(--space-4); background: var(--surface-sunk); border-radius: var(--fin-radius); border: 1px solid var(--fin-rule); }
.ddx-prov__txt { font-size: 12px; color: var(--ink-secondary); max-width: 80ch; text-wrap: pretty; }

/* print: drop chrome, stack grids */
@media print {
  .fin-toolbar, .ddx-locale, .appshell__topbar { display: none !important; }
  .ddx { gap: var(--space-4); }
  .fin-grid { max-height: none !important; overflow: visible !important; }
}
