/* [PAID-ONLY] Added 2026-05-29 (Surface A, single-page PSDA). Strip from free tool before
   re-release. See .claude/PSDA_WATERFALL_REDESIGN_MASTER_PLAN.md §6.

   RE-TOKENIZED to the real design system: brand blue via var(--primary-color, #1565C0)
   (Office-theme-driven at runtime), Roboto inherited from the app, NO hard-coded #0d6efd.
   The single-page is a layout shell over the existing wizard markup — the relocated cards/
   editors carry their own styles; this file only styles the shell (strip, nav, sections)
   and hides the wizard chrome the single-page replaces. */

/* ── Hide the wizard chrome the single-page replaces ───────────────────────────
   Both the main tab nav + the _Assumptions sub-tab nav share these ids (the partial
   re-declares them). display:none hides the leftover panes too — every input/editor the
   single-page needs has already been relocated out into #psdaOnePage by psda-onepage.js. */
.psda-onepage-mode #dealAssumpTabs,
.psda-onepage-mode #dealAssumpTabsContent {
    display: none !important;
}
/* The big green wizard Calculate button is replaced by live recompute + the status pill;
   keep it in the DOM (share-hydration clicks it) but hide it on the single page. */
.psda-onepage-mode #btnFullCalculateDebtAndGetReport,
.psda-onepage-mode #purchaseSaleNextBtn,
.psda-onepage-mode #purchaseSaleCalculateBtn {
    display: none !important;
}
/* The Deal Metrics report's original 6 saturated-blue KPI cards (.dm-kpi-grid) now duplicate
   the quiet returns strip AND re-introduce the hero-metric-card-grid anti-pattern the redesign
   moved away from (master-plan §4 / decision #13: re-skin these into the strip). The quiet strip
   IS that re-skin, so hide the blue grid on the single page. */
.psda-onepage-mode .dm-kpi-grid { display: none !important; }
/* The report's own Export PDF / Share / Push-to-Waterfall buttons duplicate the download-icon
   export menu in the metrics-view head. Hide them on screen (kept in the DOM — the menu forwards
   clicks to them); #dm-shareResult stays visible so the copyable share URL still shows. */
.psda-onepage-mode #dm-exportPdf,
.psda-onepage-mode #dm-shareLink,
.psda-onepage-mode #dm-pushWaterfall { display: none !important; }

/* ── Page shell ────────────────────────────────────────────────────────────────
   The shell itself is full-width (the sticky strip + view-nav span the page); the
   per-view width is set on the views below: the Assumptions input scroll is capped +
   centered, the Deal Metrics report runs full-width so its 10-year cash flow fits with
   no horizontal scroll (§1.5 app-shell). */
.psda-onepage {
    margin: 0 auto;
    padding: 0 8px 96px;
}

/* View container + per-view width. */
.psda-op-view { display: block; }
.psda-op-view[hidden] { display: none; }
/* Assumptions: capped + centered, comfortable for input forms (§6.1 / IMAGE4 gutters). */
.psda-op-view-capped { max-width: 1280px; margin: 0 auto; }
/* Deal Metrics report: full width so the 10-yr CF fits edge-to-edge without scrolling. */
.psda-op-view-wide { width: 100%; }

/* Deal Metrics view head: title + on-demand Run sensitivity. */
/* [2026-06-09] .psda-op-metrics-head / -actions removed — the report actions now live in the view-nav
   row (.psda-op-nav-actions) and the "Deal Metrics" header was dropped. */

/* ── Acquisition multi-card layout ─────────────────────────────────────────────
   [2026-06-10] Grid areas: Purchase Assumptions (original IMAGE2 size) top-left with
   Reserves at Close directly to its RIGHT; Closing Costs and Other Costs
   side-by-side BELOW. */
.psda-op-acq-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    grid-template-areas:
        "purchase reserves"
        "closing  other";
    gap: 16px;
    align-items: start;
}
/* [2026-06-11 item 6] BOTH top-row cards stretch to the row height so Purchase and
   Reserves-at-Close read as one aligned band (whichever is taller sets it). The purchase
   slot hosts the relocated Bootstrap .card — flex it so the card fills, and drop its mb-3
   (the grid gap owns the spacing). */
.psda-op-acq-purchase { grid-area: purchase; min-width: 0; align-self: stretch; display: flex; flex-direction: column; }
.psda-op-acq-purchase > .card { flex: 1 1 auto; margin-bottom: 0 !important; }
.psda-op-acq-reserves { grid-area: reserves; min-width: 0; align-self: stretch; }
.psda-op-acq-closing  { grid-area: closing;  min-width: 0; }
.psda-op-acq-other    { grid-area: other;    min-width: 0; }
/* Simple mode hides the three advanced cards — collapse to a single centered column so the
   Purchase card doesn't strand beside an empty right column. */
#psdaOnePage[data-detail="simple"] .psda-op-acq-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "purchase";
}
.psda-op-card {
    background: #ffffff;
    border: 1px solid #e6e8eb;
    border-radius: 8px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.04);
    overflow: hidden;
}
.psda-op-card-head {
    padding: 10px 16px;
    border-bottom: 1px solid #f0f1f3;
    background: #f8f9fa;
    font-weight: 600;
    font-size: 13px;
    color: #1f2328;
}
.psda-op-card-body { padding: 14px 16px; }
/* The relocated cost field rows show only their input (the card head is the title); the row's
   own left-label would be redundant, so hide it and let the input span the card. */
.psda-op-card-body > .psda-field-row {
    margin: 0;
    min-height: 0;
}
/* Visually hide the row's redundant left-label (the card head is the title) but keep it in the
   accessibility tree so the input retains its name (WCAG 1.3.1) — NOT display:none. */
.psda-op-card-body > .psda-field-row > label {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.psda-op-card-body > .psda-field-row > .psda-field-input { flex: 1 1 100%; }
/* The Reserves-at-Close card hosts the full editor (its own h5, relabeled by JS); trim the
   editor's wizard padding so it sits flush in the card. */
.psda-op-card-body > #psdaReservesEditor { padding: 0 !important; margin: 0; }
.psda-op-card-body > #psdaReservesEditor > h5 { font-size: 13px; margin-bottom: 8px; }

/* ── [2026-06-11] Itemized cost line items (Closing/Other cost cards) ────────────
   Real, editable rows (name + amount + remove); the base $ input becomes the computed
   total ([readonly] grey-fill) while rows exist. Replaces the locked Pro teaser. */
.psda-op-lineitems { margin-top: 10px; border-top: 1px dashed #e6e8eb; padding-top: 10px; }
.psda-op-lineitem-row {
    display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
    gap: 8px; align-items: center; margin-bottom: 8px;
}
.psda-op-lineitem-row .form-control { font-size: 0.85rem; }
.psda-op-lineitem-del {
    border: none; background: transparent; color: #8a929b; cursor: pointer;
    padding: 6px 8px; border-radius: 6px; line-height: 1;
}
.psda-op-lineitem-del:hover { color: #c62828; background: #fdf3f3; }
.psda-op-lineitem-del:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; }
.psda-op-lineitem-add {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px dashed #ccd2d8; background: transparent; border-radius: 6px;
    padding: 5px 12px; font-size: 12px; font-weight: 600; color: var(--primary-color, #1565C0);
    cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease;
}
.psda-op-lineitem-add:hover { border-color: var(--primary-color, #1565C0); background: #f4f8fd; }
.psda-op-lineitem-add:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; }

@media (max-width: 991px) {
    .psda-op-acq-grid {
        grid-template-columns: 1fr;
        grid-template-areas: "purchase" "reserves" "closing" "other";
    }
}

/* ── Non-blocking sanity warnings (§6.10 / §6.12) ──────────────────────────────
   Amber, quiet — informational, never blocking. */
.psda-op-warnings {
    margin: 0 0 16px;
    border: 1px solid #f5d77a;
    background: #fff8e6;
    border-radius: 8px;
    padding: 8px 12px;
}
.psda-op-warnings[hidden] { display: none; }
.psda-op-warning {
    font-size: 12.5px;
    color: #8a6d1b;
    line-height: 1.6;
}
.psda-op-warning i { color: #b8860b; margin-right: 4px; }

/* ── First-run "Load a sample deal" affordance (§6.10) ─────────────────────────── */
.psda-op-sample {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
    font-size: 13px;
    color: #6c757d;
}
.psda-op-sample-btn {
    border: 1px dashed #c9ced4;
    background: #ffffff;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--primary-color, #1565C0);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.psda-op-sample-btn:hover { border-color: var(--primary-color, #1565C0); background: #f4f8fd; }

/* ── Scenario compare (decision #14) ───────────────────────────────────────────── */
.psda-op-scenarios { margin: 0 0 20px; }
.psda-op-scenarios-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.psda-op-scenarios-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6c757d;
    font-weight: 700;
    margin-right: 4px;
}
.psda-op-scenario-btn {
    border: 1px solid #d7dbe0;
    background: #ffffff;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--primary-color, #1565C0);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.psda-op-scenario-btn:hover { border-color: var(--primary-color, #1565C0); background: #f4f8fd; }
.psda-op-scenarios-clear {
    margin-left: 4px;
    border: none;
    background: transparent;
    font-size: 12px;
    color: #6c757d;
    cursor: pointer;
    text-decoration: underline;
}
.psda-op-scenarios-clear:hover { color: #c62828; }
.psda-op-scenarios-empty { font-size: 13px; color: #6c757d; }
/* [2026-06-12 critique] Scenarios are localStorage-only; say so where they're saved. */
.psda-op-scenarios-hint { font-size: 11.5px; color: #8a929b; margin-left: 6px; }
.psda-op-scenarios-table {
    border-collapse: collapse;
    max-width: 620px;
    width: 100%;
}
.psda-op-scenarios-table th,
.psda-op-scenarios-table td {
    border: 1px solid #e6e8eb;
    padding: 7px 12px;
    font-size: 13px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.psda-op-scenarios-table thead th {
    background: #f8f9fa;
    color: #1f2328;
    font-weight: 700;
    text-align: right;
}
.psda-op-scenarios-table thead th:first-child,
.psda-op-scenarios-table tbody th {
    text-align: left;
    color: #495057;
    font-weight: 600;
    background: #fcfcfd;
}

/* ── Sale-NOI window hint (§6.3) ───────────────────────────────────────────────── */
.psda-op-sale-window {
    font-size: 11.5px;
    color: #5c636a;   /* [audit M1] was #6c757d (4.44:1 on the #f8f9fa band) — fails AA; #5c636a ≈ 5.7:1 */
    line-height: 1.5;
    margin-top: 8px;
    padding: 8px 10px;
    background: #f8f9fa;
    border-radius: 6px;
}
.psda-op-sale-window:empty { display: none; }

/* ── Per-field inline validation (§6.10) ───────────────────────────────────────── */
.psda-op-field-invalid,
.psda-op-field-invalid:focus {
    border-color: #c62828 !important;
    box-shadow: 0 0 0 1px #c62828 !important;
}
.psda-op-field-msg {
    font-size: 11.5px;
    color: #c62828;
    margin: 2px 0 6px;
    line-height: 1.4;
}

/* ── Sources & Uses (§6.12) — base styles moved to psda-shared.css (P2 §9.3) so the rail's
   Purchase & Sale tab and the single page share one source. The trace-only hover rules below
   stay here (click-to-trace is a single-page feature). ─────────────────────────────────────── */

/* ── Click-to-trace formula transparency (§6.11) ───────────────────────────────
   Traceable computed values get a subtle dotted underline + help cursor; clicking opens a
   popover with the formula + source-input links; the target field pulses when jumped to. */
.psda-op-traceable { cursor: help; }
.psda-op-su-row[data-trace] { cursor: help; }
.psda-op-su-row[data-trace]:hover .psda-op-su-value,
.psda-op-traceable:hover .psda-op-stat-value {
    text-decoration: underline dotted;
    text-underline-offset: 3px;
}
.psda-op-trace-pop {
    position: fixed;
    z-index: 400;
    background: #ffffff;
    border: 1px solid #e6e8eb;
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.14);
    padding: 12px 14px;
    max-width: 320px;
    font-size: 13px;
}
.psda-op-trace-pop[hidden] { display: none; }
.psda-op-trace-title { font-weight: 700; color: #1f2328; margin-bottom: 4px; }
.psda-op-trace-formula { color: #495057; line-height: 1.5; }
.psda-op-trace-lead {
    font-size: 10px; text-transform: uppercase; letter-spacing: 0.07em;
    color: #6c757d; font-weight: 600; margin: 10px 0 6px;
}
.psda-op-trace-inputs { display: flex; flex-wrap: wrap; gap: 6px; }
.psda-op-trace-input {
    border: 1px solid #d7dbe0;
    background: #f8f9fa;
    border-radius: 12px;
    padding: 3px 10px;
    font-size: 12px;
    color: var(--primary-color, #1565C0);
    cursor: pointer;
}
.psda-op-trace-input:hover { border-color: var(--primary-color, #1565C0); background: #f4f8fd; }

/* Pulse the field a trace link jumps to. */
.psda-op-trace-hi {
    animation: psdaOpTraceHi 1.5s cubic-bezier(0.25, 1, 0.5, 1);
    border-radius: 6px;
}
@keyframes psdaOpTraceHi {
    0%   { box-shadow: 0 0 0 0 rgba(21, 101, 192, 0); }
    18%  { box-shadow: 0 0 0 4px rgba(21, 101, 192, 0.28); }
    100% { box-shadow: 0 0 0 0 rgba(21, 101, 192, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .psda-op-trace-hi { animation: none; box-shadow: 0 0 0 2px rgba(21, 101, 192, 0.4); }
}

/* [2026-06-04] The Operating Financials table now shares the rail's ledger formatting
   (re-scoped to .psda-dm-report in psda-rail.css, which applies on both surfaces). The earlier
   onepage-only cell padding/font override was REMOVED — it out-specified the rail rules and was
   the cause of the onepage table not matching the rail. Keep only the fit helper (full-width view
   has more room than the rail canvas, so the rail's 13px ledger fits without a scrollbar). */
.psda-op-view-wide #dm-operatingTable .table { table-layout: auto; width: 100%; }

/* [2026-06-08] On the onepage, the Sale Summary renders as a clean ~760px .psda-op-su box
   (#psdaDmSaleSummary, built by buildSaleSummary) matching Sources & Uses — so hide the wide
   Bootstrap #dm-saleSummaryRow card the engine still populates. The rail keeps its own card. */
.psda-onepage-mode #dm-saleSummaryRow { display: none !important; }

/* [2026-06-10] Purchase & Sale tab layout: Sources & Uses (purchase side) and Sale Assumptions
   side-by-side; the All-In-Cost-vs-Gross-Sale bars span the full width beneath them. Stacks on
   narrow canvases via auto-fit. Hidden children ([hidden]/inline display:none) stay out of the grid. */
.psda-onepage-mode .psda-dm-panel[data-dm-panel="purchsale"]:not([hidden]) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 16px;
    /* [2026-06-12 user] stretch (was start): the Purchase and Sale Assumptions cards share a
       row and must read at the SAME height. Each card is a flex column whose highlighted
       total pins to the bottom (margin-top:auto), so the slack lands quietly above the total
       band instead of leaving the shorter card ragged. */
    align-items: stretch;
}
.psda-onepage-mode .psda-dm-panel[data-dm-panel="purchsale"] > .psda-dm-acqsale { grid-column: 1 / -1; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="purchsale"] > .psda-op-su { margin-bottom: 0; max-width: none; }
.psda-onepage-mode #psdaDmPurchaseSummary,
.psda-onepage-mode #psdaDmSaleSummary { display: flex; flex-direction: column; }
.psda-onepage-mode #psdaDmPurchaseSummary[hidden],
.psda-onepage-mode #psdaDmSaleSummary[hidden] { display: none; }
.psda-onepage-mode #psdaDmPurchaseSummary .psda-op-sa-total,
.psda-onepage-mode #psdaDmSaleSummary .psda-op-sa-total { margin-top: auto; }
/* The waterfall block keeps its 12px rhythm above the pinned total. */
.psda-onepage-mode #psdaDmPurchaseSummary .psda-op-sa-waterfall,
.psda-onepage-mode #psdaDmSaleSummary .psda-op-sa-waterfall { margin-bottom: 12px; }
/* [2026-06-12 user] Financing Summary (all loans + refis) spans the full width below the
   Purchase / Sale pair. */
.psda-onepage-mode .psda-dm-panel[data-dm-panel="purchsale"] > #psdaDmLoanSummary { grid-column: 1 / -1; }

/* ── [2026-06-12 user /impeccable:delight] Financing Summary debt timeline ──────────
   For layered structures (2+ loans or a refinance): one proportional track per loan across
   the hold — the bar spans the months the loan is outstanding (origination → refi payoff /
   maturity / exit). Quiet grey rails, brand-blue bars; a refinanced-away loan reads lighter.
   Institutional gantt restraint — no gradients, no animation. */
.psda-fin-timeline { margin-top: 14px; padding-top: 12px; border-top: 1px solid #eef0f2; }
.psda-fin-tl-track {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.psda-fin-tl-lbl { font-size: 11px; font-weight: 600; color: #6c757d; white-space: nowrap; }
.psda-fin-tl-rail { position: relative; height: 24px; background: #f5f6f8; border-radius: 4px; min-width: 0; }
.psda-fin-tl-bar {
    position: absolute; top: 0; bottom: 0;
    background: var(--primary-color, #1565C0);
    border-radius: 4px;
    display: flex; align-items: center;
    padding: 0 8px;
    overflow: hidden;
    white-space: nowrap;
}
/* A loan that gets refinanced away reads lighter — the successor carries the live debt. */
.psda-fin-tl-bar.is-refied { background: #7aa3d4; }
.psda-fin-tl-bartxt { font-size: 10.5px; font-weight: 600; color: #ffffff; font-variant-numeric: tabular-nums; }
/* Slim-bar label rendered beside the bar (inside the rail) when the bar can't hold it. */
.psda-fin-tl-outtxt {
    position: absolute; top: 0; bottom: 0;
    display: inline-flex; align-items: center;
    padding: 0 8px;
    font-size: 10.5px; font-weight: 600; color: #3d4750;
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
.psda-fin-tl-axis {
    display: flex; justify-content: space-between;
    position: relative;
    margin-left: 74px;   /* clears the 64px label column + 10px gap so the axis aligns with the rails */
    font-size: 10px; color: #8a929b; font-variant-numeric: tabular-nums;
}
/* Refi handoff: a dashed tick threading through every rail at the refinance month, named on
   the axis — the payoff → origination moment reads as one event. */
.psda-fin-tl-mark {
    position: absolute; top: -3px; bottom: -3px; width: 0;
    border-left: 1px dashed #aab2ba;
}
.psda-fin-tl-axis-refi {
    position: absolute; transform: translateX(-50%);
    color: #5c636a; font-weight: 600; white-space: nowrap;
}

/* [2026-06-12 user] Sources & Uses tab: Acquisition S&U and Sale S&U sit SIDE BY SIDE
   (stacking below ~800px via auto-fit); the Annual Sources & Uses ledger spans the full
   width beneath them and scrolls horizontally INSIDE its own box instead of overflowing
   the card edge. */
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sourcesuses"]:not([hidden]) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 16px;
    align-items: stretch;
}
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sourcesuses"] > .psda-op-su {
    margin: 0;
    max-width: none;
}
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sourcesuses"] > #psdaDmAnnualSU {
    grid-column: 1 / -1;
    overflow-x: auto;
    overflow-y: hidden;   /* pin overflow-y so horizontal scroll can't spawn a stray vertical scrollbar */
    min-width: 0;
}

/* [2026-06-12 /impeccable:layout] Sensitivity matrices STACK VERTICALLY at full content width
   (was two 524px side-by-side cards — the "IRR / multiple" cell pairs wrapped onto two lines,
   defeating the matrices' scan-down-a-column read). Order puts the primary exhibit first:
   Cap Rate (the standard CRE sensitivity) → Hold Period → LTV × Rate. No companion chart —
   the 6-tier variance-hued numbers already carry the at-a-glance shape, and a chart would
   restate the matrices with less precision (Design Principle #1: numbers tell the story).
   The Bootstrap .row/.col wrappers flatten so the cards fill the column. */
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"]:not([hidden]) {
    display: flex;
    flex-direction: column;
}
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > .psda-dm-sens-hint { order: 0; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > #dm-sensitivitySection { order: 1; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > #dm-holdSensSection { order: 2; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > #psdaDmLtvSensSection { order: 3; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > .row { display: block; margin-left: 0; margin-right: 0; min-width: 0; }
.psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] > .row > .col { padding-left: 0; padding-right: 0; max-width: 100%; }

/* [2026-06-04 / C] The 4 report tabs are promoted into the top view-nav, so the report's own
   inner tab strip is redundant on the onepage — hide it (the panels are still driven by
   PsdaReport.activateDmTab from the top nav). */
.psda-onepage-mode .psda-dm-tabs { display: none !important; }

/* ── [2026-06-04 / D] Editing rail beside the report ──────────────────────────────
   On a report tab the .psda-op-views container reflows to two columns: the Assumptions
   inputs become a sticky, scrollable editing RAIL on the left (so the user can modify the
   deal and watch the report recompute live), and the report fills the right. JS adds
   .op-report-mode + sets --op-header-h (measured sticky-header height) so the rail pins
   just under the header. */
/* [layout 2026-06-08] Report mode KEEPS the onepage's non-rail dimensions and just ADDS the editing
   rail on the left, shifting the banner + report right to make room — it must NOT widen the KPI
   banner or stretch the report (that was the earlier full-bleed mistake). The page breaks out of the
   BS .container only to create the rail's left gutter; the banner + report stay capped at the
   non-rail content width (--op-content-w) so they read identically to the no-rail view. JS adds
   .op-report-active to #psdaOnePage on report views; Basic Info keeps the centered capped column. */
/* [layout 2026-06-09] #psdaOnePage itself becomes the 2-col grid (rail | content). The editing rail
   (#psdaOpView-assumptions, hoisted to a direct child by setActiveView) takes the LEFT column and
   SPANS ALL ROWS, so it reaches the TOP of the page beside the returns strip + nav — filling the
   previously-empty top-left gutter. The header / warnings / report stack in the right column, capped
   at the non-rail content width so the KPI banner keeps its size and reads like the no-rail view. */
#psdaOnePage.op-report-active {
    --op-rail-w: 380px;
    --op-rail-gap: 1.5rem;
    --op-content-w: 1064px;   /* the non-rail .container strip width at >=1200px viewports */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 0 clamp(0.75rem, 2vw, 1.5rem);
    box-sizing: border-box;
    display: grid;
    grid-template-columns: var(--op-rail-w) minmax(0, var(--op-content-w));
    /* Explicit rows for the right column (header / warnings / report) so the rail's grid-row: 1 / -1
       actually spans the full height — `-1` resolves to the EXPLICIT grid's last line, so without
       declared rows it would collapse to a single auto row and the rail would sit mid-page. */
    grid-template-rows: auto auto auto;
    column-gap: var(--op-rail-gap);
    align-items: start;
    /* [2026-06-11 user] Tracks anchor LEFT again — the rail (and its Hide-inputs header)
       must sit flush at the page's left edge. The strip still centers at the viewport: the
       header item below is forced to the grid's full content width, so its centering is
       independent of how wide the tracks are. */
    justify-content: start;
}
/* [2026-06-12 user] The rail reaches the TOP of the page: the header (strip + nav + toolbar)
   lives in the CONTENT column only (row 1, column 2), and the rail spans every row of column 1
   — a true full-height app-shell sidebar. The strip centers within the content column, so it
   aligns with the report below it (the 2026-06-11 "header spans both columns" layout left a
   tall empty gutter above the rail — the rail read as starting ~40% down the viewport). */
#psdaOnePage.op-report-active > .psda-op-header { grid-column: 2; grid-row: 1; }
#psdaOnePage.op-report-active > #psdaOpWarnings,
#psdaOnePage.op-report-active > .psda-op-views { grid-column: 2; }
.op-report-active .psda-op-strip,
.op-report-active .psda-op-nav,
.op-report-active .psda-op-subnav {
    max-width: var(--op-content-w);
    margin-left: auto; margin-right: auto;
}
.op-report-active #psdaOpWarnings { max-width: var(--op-content-w); }
/* Editing rail → left column, ALL rows (1 / -1 = the explicit grid's full height), sticky at
   the viewport top. Independent of --op-header-h: the header no longer sits above the rail. */
#psdaOnePage.op-report-active > #psdaOpView-assumptions {
    grid-column: 1;
    grid-row: 1 / -1;
    width: auto; max-width: none;
    position: sticky; top: 8px;
    max-height: calc(100vh - 16px);
    overflow-y: auto; overflow-x: hidden;
    margin: 0; padding: 8px 12px 0 0; border-right: 1px solid #e6e8eb;   /* the rail's divider */
    transition: opacity .18s ease;
}
/* [2026-06-11 item 12] One vertical rhythm on report tabs: 14px from the nav row to the
   first content card on every tab (was 0–8px depending on the tab). */
.op-report-active .psda-op-views { margin-top: 14px; }
.psda-onepage-mode .psda-dm-summary { margin-top: 0; }   /* its 8px extra broke the rhythm */
/* The report column is now single-flow (the rail no longer lives inside .psda-op-views). */
.psda-op-views.op-report-mode { display: block; }
.op-report-mode #psdaOpView-metrics.psda-op-view { min-width: 0; width: auto; }
/* [2026-06-08] The NOI-by-year ribbon is redundant in the editing rail — the report already shows
   NOI by year in the Annual Cash Flow table. Keep it on the full Basic Info view; hide it in the rail.
   [2026-06-09] Re-gated from .op-report-mode (on .psda-op-views) to .op-report-active (on #psdaOnePage):
   the rail is hoisted OUT of .psda-op-views in report mode, so these rail-descendant rules must key off
   the page-level class to still match. */
.op-report-active #psdaOpCfRibbon { display: none; }
/* The rail is narrow → stack the Acquisition grid into one column (areas in reading order). */
.op-report-active #psdaOpView-assumptions .psda-op-acq-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "purchase" "reserves" "closing" "other";
    gap: 12px;
}
.op-report-active #psdaOpView-assumptions .psda-op-section { margin-bottom: 0.9rem; }
/* In the editing rail, hide the bulky Cash Flows paste box (NOI is confirmed in Basic Info; the rail
   is for tweaking levers). CapEx visibility is governed by the Simple/Advanced toggle (item 2). */
.op-report-active #psdaOpSec-cashflows { display: none; }

/* ── [2026-06-10] Editing-rail container reflow ───────────────────────────────────
   The rail is ~380px on a DESKTOP viewport, so Bootstrap's viewport-keyed col-md-* grids
   (Property Information's address/city/state/zip, the CapEx 3-up row) render as slivers
   inside it. Inside the rail every col stacks at full width; the few clusters that should
   stay side-by-side are re-gridded explicitly below. */
.op-report-active #psdaOpView-assumptions .row { margin-left: 0; margin-right: 0; }
.op-report-active #psdaOpView-assumptions .row > [class*="col-"] {
    flex: 0 0 100%; width: 100%; max-width: 100%;
    padding-left: 0; padding-right: 0;
}
/* Property Information: street address takes the full first line; City/State/Zip share the
   second so the cluster still reads as one address. */
.op-report-active #psdaOpView-assumptions .psda-pi-row {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 0.7fr) minmax(0, 1fr);
    column-gap: 8px;
}
.op-report-active #psdaOpView-assumptions .psda-pi-row > .psda-pi-addr { grid-column: 1 / -1; }
/* Sale NOI (Forward 12 / Trailing 12): stack the field row (label above) so the two figures
   get the full rail width — at 44%-label/56%-value split they wrapped mid-number. */
.op-report-active #psdaOpView-assumptions .psda-sale-noi-row {
    flex-direction: column; align-items: stretch; gap: 4px; min-height: 0;
}
.op-report-active #psdaOpView-assumptions .psda-sale-noi-row > label { flex: 0 0 auto; }
.op-report-active #psdaOpView-assumptions .psda-sale-noi-pair > .col-6 {
    flex: 0 0 50%; width: 50%; max-width: 50%;
}
.op-report-active #psdaOpView-assumptions #saleNoiF12Display,
.op-report-active #psdaOpView-assumptions #saleNoiT12Display { white-space: nowrap; }
/* CapEx card header ("Capital Expenditure Inputs…" + the Override Mode toggle): let the long
   title wrap as its own line instead of squeezing the toggle into a sliver. */
.op-report-active #psdaOpView-assumptions #advancedCapexSection .card-header {
    flex-wrap: wrap; gap: 4px 10px;
}
.op-report-active #psdaOpView-assumptions #advancedCapexSection .card-header > div { white-space: nowrap; }
/* Stacked CapEx fields breathe a little. */
.op-report-active #psdaOpView-assumptions #capexOverrideSection .row > [class*="col-"],
.op-report-active #psdaOpView-assumptions #capexPasteSection .row > [class*="col-"] { margin-bottom: 0.5rem; }

/* ── [2026-06-10] Year-by-year NOI entry ──────────────────────────────────────
   The visible front for the (hidden) NOI paste textarea: one "Year N NOI" input that
   advances per entry; a multi-value paste into it fills the whole series. The raw
   textarea (+ its label) stays in the DOM as the canonical store. */
.psda-op-noi-rawbox { display: none; }
.psda-op-noi-entry-lbl { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.psda-op-noi-entry-line { display: flex; gap: 8px; align-items: stretch; max-width: 440px; }
.psda-op-noi-entry-group { flex: 1 1 auto; }
.psda-op-noi-entry-add {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid #d7dbe0; background: #ffffff; border-radius: 6px;
    padding: 0 14px; font-size: 13px; font-weight: 600;
    color: var(--primary-color, #1565C0); cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.psda-op-noi-entry-add:hover { border-color: var(--primary-color, #1565C0); background: #f4f8fd; }
.psda-op-noi-entry-add:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; }
.psda-op-noi-entry-hint { display: block; margin-top: 6px; }

/* [item 2] Simple/Advanced gating + toggle. Simple hides .psda-rail-advanced everywhere on the
   onepage (Basic Info + the editing rail). */
#psdaOnePage[data-detail="simple"] .psda-rail-advanced { display: none; }
.psda-op-detail { display: inline-flex; align-items: center; gap: 0; margin: 0 0 14px; }
.psda-op-detail-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: #6c757d; font-weight: 600; margin-right: 8px; }
.psda-op-detail-btn { font-size: 12px; font-weight: 600; padding: 5px 14px; border: 1px solid #d7dbe0; background: #fff; color: #5c636a; cursor: pointer; }
.psda-op-detail-btn:nth-of-type(1) { border-radius: 6px 0 0 6px; }
.psda-op-detail-btn:nth-of-type(2) { border-radius: 0 6px 6px 0; border-left: 0; }
.psda-op-detail-btn[aria-pressed="true"] { background: var(--primary-color, #1565C0); color: #fff; border-color: var(--primary-color, #1565C0); }
.psda-op-detail-btn:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; }

/* [2026-06-08] Collapsible Cash Flows section (rail parity). The header toggles; collapsed hides the
   body (paste box + verify) and shows an "imported" badge — the 10-yr ribbon above keeps the values. */
/* The toggle is a <button> nested in the .psda-op-section-head <h2>; reset it to inherit the
   heading's typography and span the full width so the whole header row is the click target. */
.psda-op-cf-head {
    cursor: pointer; display: flex; align-items: center; gap: 10px;
    width: 100%; background: none; border: 0; padding: 0; margin: 0;
    font: inherit; color: inherit; text-align: left;
}
.psda-op-cf-chevron { font-size: 0.62em; color: #6c757d; transition: transform .15s ease; }
.psda-op-section.cf-collapsed .psda-op-cf-chevron { transform: rotate(-90deg); }
.psda-op-cf-status {
    margin-left: auto; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
    color: #1b5e20; font-weight: 700;
}
.psda-op-cf-status:empty { display: none; }
.psda-op-section.cf-collapsed > :not(.psda-op-section-head) { display: none; }
.psda-op-cf-head:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { .psda-op-cf-chevron { transition: none; } }

/* [item 1] Dismissable rail. "Hide inputs" is a header at the TOP of the editing rail (part of the
   rail, not floating); only shown in report mode (in Basic Info the rail IS the full input form). */
.psda-op-rail-toggle { display: none; }
.op-report-active .psda-op-rail-toggle {
    display: inline-flex; align-items: center; gap: 6px;
    width: 100%; justify-content: flex-start;
    margin: 0 0 12px; padding: 6px 10px;
    font-size: 12px; font-weight: 600; color: var(--primary-color, #1565C0);
    background: #f4f8fd; border: 1px solid #cfe0f3; border-radius: 6px;
    cursor: pointer; transition: background .12s ease;
}
.op-report-active .psda-op-rail-toggle:hover { background: #e8f1fb; }
/* [2026-06-10] "Assumptions" — a slim vertical handle pinned to the page's LEFT edge (where the
   rail pops out from), shown ONLY when the rail is collapsed on a report view. The chevron nudges
   outward on hover — the door cracking open. Quiet white/hairline chrome, brand-blue text. */
.psda-op-rail-reopen { display: none; }
.op-report-active.rail-collapsed .psda-op-rail-reopen {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    /* [2026-06-11 item 15] ~3/4 up the page (was mid-page) — easier to spot. */
    position: fixed; left: 0; top: 25%; z-index: 240;
    padding: 12px 7px 14px;
    background: #ffffff;
    border: 1px solid #d7dbe0; border-left: none;
    border-radius: 0 8px 8px 0;
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.07);
    font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--primary-color, #1565C0);
    cursor: pointer;
    transition: transform 0.15s cubic-bezier(0.25, 1, 0.5, 1), background 0.15s ease, border-color 0.15s ease;
}
.op-report-active.rail-collapsed .psda-op-rail-reopen:hover {
    transform: translateX(2px);
    background: #f4f8fd;
    border-color: var(--primary-color, #1565C0);
}
.op-report-active.rail-collapsed .psda-op-rail-reopen:focus-visible {
    outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px;
}
.psda-op-rail-reopen .fa-chevron-right { font-size: 10px; transition: transform 0.15s cubic-bezier(0.25, 1, 0.5, 1); }
.op-report-active.rail-collapsed .psda-op-rail-reopen:hover .fa-chevron-right { transform: translateX(2px); }
/* Vertical label reading upward (standard sideways-tab pattern). */
.psda-op-rail-handle-txt { writing-mode: vertical-rl; transform: rotate(180deg); line-height: 1; }
/* One-shot slide-in when the rail opens from the handle (suppressed under reduced motion —
   the JS also gates it, this is belt-and-suspenders). */
@keyframes psdaOpRailEnter {
    from { transform: translateX(-14px); opacity: 0.55; }
    to   { transform: translateX(0);     opacity: 1; }
}
#psdaOnePage.op-report-active > #psdaOpView-assumptions.psda-op-rail-enter {
    animation: psdaOpRailEnter 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
@media (prefers-reduced-motion: reduce) {
    .op-report-active.rail-collapsed .psda-op-rail-reopen,
    .psda-op-rail-reopen .fa-chevron-right { transition: none; }
    #psdaOnePage.op-report-active > #psdaOpView-assumptions.psda-op-rail-enter { animation: none; }
}
/* Collapsed ("Hide inputs"): hide the rail and RETURN the report to the non-rail centered layout
   (revert the full-bleed) — NOT slammed to the far left. rail-collapsed is set on BOTH #psdaOnePage
   (so the header + page can react) and .psda-op-views. The report keeps its non-rail width, centered
   exactly like the no-rail view. */
#psdaOnePage.op-report-active.rail-collapsed {
    display: block;                                  /* undo the 2-col grid */
    width: auto; margin-left: 0; margin-right: 0; padding: 0;
}
.op-report-active.rail-collapsed #psdaOpWarnings { margin-left: 0; }
.psda-op-views.op-report-mode.rail-collapsed { display: block; }
/* The rail is now a direct child of #psdaOnePage — hide it (collapsed) via the page-level class. */
#psdaOnePage.op-report-active.rail-collapsed > #psdaOpView-assumptions { display: none; }
@media (prefers-reduced-motion: reduce) {
    .op-report-active #psdaOpView-assumptions { transition: none; }
}

/* [audit H1] The side rail needs rail (380) + report (--op-content-w 1064) + gap ≈ 1480px. Below
   that, stack the rail above the report instead of squeezing two columns into a too-narrow viewport
   (which scrolled the page sideways at ~1280px laptops). Revert the full-bleed/offset here. */
@media (max-width: 1479.98px) {
    #psdaOnePage.op-report-active { display: block; width: auto; margin: 0; padding: 0; }
    .op-report-active .psda-op-strip,
    .op-report-active .psda-op-nav,
    .op-report-active .psda-op-subnav { max-width: none; }
    .op-report-active #psdaOpWarnings { max-width: none; }
    .psda-op-views.op-report-mode { display: block; }
    /* Rail (direct child of #psdaOnePage) drops to a full-width static block above the report. */
    #psdaOnePage.op-report-active > #psdaOpView-assumptions {
        position: static; grid-column: auto; grid-row: auto;
        width: auto; max-width: none; max-height: none; overflow: visible;
        margin-bottom: 1.5rem; border-right: 0; padding: 0;
    }
}

/* ── Sticky app-shell header (strip + view-nav + section sub-nav as one block) ──
   Stuck together so the whole chrome stays put while you scroll; sections clear it via
   scroll-margin-top. The strip is always visible at the top (per user). */
.psda-op-header {
    position: sticky;
    top: 0;
    z-index: 200;
    background: #fafbfc;
    padding-top: 8px;
}

/* ── Quiet returns strip (§4) ──────────────────────────────────────────────────
   Quiet white surface, hairline border, thin brand-blue top rule as accent (NOT a fill),
   numbers as the hero (bold near-black, tabular). */
.psda-op-strip {
    background: #ffffff;
    border: 1px solid #e6e8eb;
    border-top: 2px solid var(--primary-color, #1565C0);
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    margin: 0 0 8px;
    padding: 14px 16px;
}
.psda-op-strip-inner {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}
.psda-op-stat {
    min-width: 0;
}
/* A subtle divider before the structure metrics (Total Acq / Equity / Debt). */
.psda-op-stat-divider {
    border-left: 1px solid #eef0f2;
    padding-left: 16px;
}
.psda-op-stat-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #6c757d;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.psda-op-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #1f2328;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.psda-op-stat-value.placeholder {
    color: #6c757d;
    font-weight: 600;
}
.psda-op-stat-delta {
    font-size: 11px;
    color: #6c757d;
    margin-top: 2px;
    font-variant-numeric: tabular-nums;
    min-height: 14px;
}
.psda-op-stat-delta.is-up { color: #2e7d32; }
.psda-op-stat-delta.is-down { color: #c62828; }

/* Small, quiet status chip in the corner of the view-nav row (per user — not a big pill).
   Icon + short label; subtle dot colors by state. */
.psda-op-status {
    margin-left: auto;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid transparent;
    background: transparent;
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
    color: #6c757d;
    cursor: default;
    white-space: nowrap;
    line-height: 1.6;
}
.psda-op-status .psda-op-status-icon { font-size: 10px; }
.psda-op-status[data-state="needed"] { color: #6c757d; cursor: pointer; }
.psda-op-status[data-state="busy"] { color: var(--primary-color, #1565C0); }
.psda-op-status[data-state="busy"] .psda-op-status-icon { animation: psdaOpSpin 0.8s linear infinite; }
.psda-op-status[data-state="ok"] { color: #2e7d32; }
.psda-op-status[data-state="err"] { color: #c62828; cursor: pointer; }
@keyframes psdaOpSpin { to { transform: rotate(360deg); } }

/* [2026-06-09] Calc status relocated into the KPI ribbon's lower-right corner — a quiet "as of" stamp,
   absolutely positioned so the ribbon's height is unchanged. The structure stats on the right (Debt
   Yield, DSCR) carry no delta line, so the bottom-right corner is free. */
.psda-op-strip { position: relative; }
.psda-op-status-ribbon {
    position: absolute; right: 14px; bottom: 7px;
    margin: 0; align-self: auto;
    padding: 1px 6px; line-height: 1.4;
    background: rgba(255, 255, 255, 0.9); border-radius: 10px;
}
@media print { .psda-op-status-ribbon { display: none; } }

/* [2026-06-09] Report toolbar on the view-nav row (standard tabs-left / actions-right). Shown only on
   report views (the tablist's flex:1 pushes these to the right edge); hidden on Basic Info + in print. */
.psda-op-nav-actions { display: none; align-items: center; gap: 8px; flex: 0 0 auto; }
.op-report-active .psda-op-nav-actions { display: flex; }
/* Narrow fold: under ~1200px the row can't hold standalone Run sensitivity + Share, so hide them and
   surface them inside the Export ▾ menu (those menu items are hidden at wide widths). */
.psda-op-export-menu .psda-op-export-narrow { display: none; }
@media (max-width: 1199.98px) {
    .op-report-active #psdaOpRunSensitivity,
    .op-report-active #psdaOpShareBtn { display: none; }
    .psda-op-export-menu .psda-op-export-narrow { display: flex; }
}

/* Export-menu styles moved to psda-shared.css (§9.2 single source; the menu lives in the Deal
   Metrics view head on the single page and in the canvas toolbar on the rail). */

/* ── Top view-nav (§1.5 app-shell) ────────────────────────────────────────────
   Switches between views (Assumptions / Deal Metrics / future reports). Quiet
   underline-on-active, brand accent. Lives inside the sticky header. The small status
   chip rides at the far right of this row. */
.psda-op-nav {
    display: flex;
    align-items: stretch;
    gap: 2px;
    flex-wrap: nowrap;
    border-bottom: 1px solid #e6e8eb;
    margin: 0;
    padding: 2px 0 0;
}
/* [audit H2] On narrow viewports the 6 view tabs are wider than the row; let them scroll
   horizontally inside the nav instead of widening the whole page. The status chip stays put.
   [2026-06-09] overflow-y: hidden is REQUIRED — when overflow-x is auto/scroll, CSS computes the
   other axis's `visible` as `auto`, so a sub-pixel content overflow spawns a stray vertical
   scrollbar (the little ▲▼ that appeared next to the status chip). Pin overflow-y so only the
   intended horizontal scroll can ever show. */
.psda-op-tablist { display: flex; gap: 2px; flex: 1 1 0; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.psda-op-tablist::-webkit-scrollbar { height: 4px; }
.psda-op-tablist::-webkit-scrollbar-thumb { background: #ccd2d8; border-radius: 2px; }
.psda-op-nav-btn {
    padding: 9px 16px;
    color: #6c757d;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.2s cubic-bezier(0.25, 1, 0.5, 1);
    margin-bottom: -1px;
    white-space: nowrap;
}
.psda-op-nav-btn:hover { color: #1f2328; }
.psda-op-nav-btn.active {
    /* [2026-06-15] Use the fixed brand-blue selection color (--cre-blue), not the Office theme's
       --primary-color, which can resolve to a near-black on dark themes — the active tab read as a
       black underline instead of matching the rest of the blue selection chrome. */
    color: var(--cre-blue, #1565C0);
    border-bottom-color: var(--cre-blue, #1565C0);
    font-weight: 600;
}

/* ── Section sub-nav (Assumptions view): click-to-jump + scrollspy highlight ──── */
.psda-op-subnav {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    padding: 8px 0 10px;
}
.psda-op-subnav[hidden] { display: none; }
.psda-op-subnav-btn {
    border: 1px solid #e2e6ea;
    background: #ffffff;
    border-radius: 14px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    white-space: nowrap;
}
.psda-op-subnav-btn:hover { color: #1f2328; border-color: #ced4da; }
.psda-op-subnav-btn.active {
    color: var(--primary-color, #1565C0);
    border-color: var(--primary-color, #1565C0);
    background: #f4f8fd;
    font-weight: 600;
}

/* ── Sections ─────────────────────────────────────────────────────────────────
   Hairline dividers + spacing instead of heavy shaded boxes (IMAGE2 "remove excess
   box shading"). scroll-margin-top keeps the section heading clear of the sticky nav. */
.psda-op-section {
    scroll-margin-top: 172px; /* clears the sticky header (strip + view-nav + section sub-nav) */
    padding: 8px 0 28px;
    border-top: 1px solid #eef0f2;
}
.psda-op-section:first-of-type { border-top: none; }
.psda-op-section-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6c757d;
    font-weight: 700;
    margin: 4px 0 14px;
}
.psda-op-section-sub {
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    font-size: 12px;
    color: #6c757d;
}
.psda-op-run-sens {
    text-transform: none;
    letter-spacing: 0;
    border: 1px solid #d7dbe0;
    background: #ffffff;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    color: #495057;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.psda-op-run-sens:hover { color: var(--primary-color, #1565C0); border-color: var(--primary-color, #1565C0); }
.psda-op-run-sens:disabled { opacity: 0.6; cursor: default; }

/* Stale sensitivity matrix dim (shared visual w/ rail's psda-sens-stale). */
.psda-sens-stale { opacity: 0.45; transition: opacity 0.2s ease; }

/* ── [2026-06-12 H10] In-context help ────────────────────────────────────────────
   Inline help anchors (exhibit values / tiles / waterfall rows carrying data-trace) get the
   same dotted-underline-on-hover language as the strip metrics; the small "?" dot opens the
   how-is-this-computed popover on card titles. */
/* Keyed off [data-trace] (helpAttrs can't emit a class — the host markup already opens
   one and duplicate attributes are parser-dropped). */
.psda-op-sa-term[data-trace],
.psda-op-sa-wf-row[data-trace],
.psda-op-sa-total[data-trace] { cursor: help; }
.psda-op-sa-term[data-trace]:hover .psda-op-sa-term-val,
.psda-op-sa-wf-row[data-trace]:hover .psda-op-sa-wf-val,
.psda-op-sa-total[data-trace]:hover .psda-op-sa-total-val {
    text-decoration: underline dotted;
    text-underline-offset: 3px;
}
.psda-op-sa-term[data-trace]:focus-visible,
.psda-op-sa-wf-row[data-trace]:focus-visible,
.psda-op-sa-total[data-trace]:focus-visible {
    outline: 2px solid var(--primary-color, #1565C0);
    outline-offset: 2px;
    border-radius: 4px;
}
.psda-help-dot {
    display: inline-flex; align-items: center; justify-content: center;
    width: 16px; height: 16px;
    margin-left: 4px; padding: 0;
    border: 1px solid #c2c9d0; border-radius: 50%;
    background: #ffffff; color: #5c636a;
    font-size: 10px; font-weight: 700; line-height: 1;
    cursor: help; vertical-align: 2px;
}
.psda-help-dot:hover { color: var(--primary-color, #1565C0); border-color: var(--primary-color, #1565C0); }
.psda-help-dot:focus-visible { outline: 2px solid var(--primary-color, #1565C0); outline-offset: 2px; }

/* ── [2026-06-12 H1] Whole-report stale signal ──────────────────────────────────
   While inputs have changed and the recompute hasn't settled, the BUILT exhibits (which keep
   their last-calc numbers) dim — same language as the sensitivity stale state. */
.psda-onepage-mode #psdaDmReport.psda-report-stale .psda-dm-panel {
    opacity: 0.55;
    transition: opacity 0.2s ease;
}
@media (prefers-reduced-motion: reduce) {
    .psda-onepage-mode #psdaDmReport.psda-report-stale .psda-dm-panel { transition: none; }
}

/* ── [2026-06-12] Click-to-apply sensitivity cells + undo toast ────────────────
   A computed cell applies its scenario to the live inputs (LTV×Rate → loan1Amount/IR;
   Hold×ExitCap → monthOfSale/saleCapRate); the toast offers one-click Undo. */
.psda-onepage-mode td.psda-sens-apply { cursor: pointer; }
.psda-onepage-mode td.psda-sens-apply:hover { box-shadow: inset 0 0 0 2px var(--primary-color, #1565C0); }
.psda-onepage-mode td.psda-sens-apply:focus-visible {
    outline: 2px solid var(--primary-color, #1565C0);
    outline-offset: -2px;
}
.psda-op-apply-toast {
    /* [2026-06-15] Top-right, matching the web app's standard notification position
       (_Layout #toastAlert sits top/right). Was bottom-center. */
    position: fixed; top: 16px; right: 16px;
    z-index: 500;
    display: flex; align-items: center; gap: 14px;
    background: #1f2328; color: #ffffff;
    border-radius: 8px; padding: 10px 16px;
    font-size: 13px; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
}
.psda-op-apply-toast[hidden] { display: none; }
.psda-op-apply-undo {
    border: 1px solid rgba(255, 255, 255, 0.5); background: transparent; color: #ffffff;
    border-radius: 6px; padding: 3px 14px; font-size: 12.5px; font-weight: 700; cursor: pointer;
}
.psda-op-apply-undo:hover { background: rgba(255, 255, 255, 0.12); }
.psda-op-apply-undo:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; }
@media print { .psda-op-apply-toast { display: none !important; } }

/* Subtle settle pulse on the metrics canvas when a calc completes. */
.psda-canvas-updated { animation: psdaOpSettle 0.4s ease; }
@keyframes psdaOpSettle {
    0% { opacity: 0.7; }
    100% { opacity: 1; }
}

/* ── Responsive ───────────────────────────────────────────────────────────────
   The 7-metric strip reflows on narrow screens; the export chrome wraps below. */
@media (max-width: 1100px) {
    .psda-op-strip-inner { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .psda-op-stat-divider { border-left: none; padding-left: 0; }
    .psda-op-section { scroll-margin-top: 220px; } /* strip wraps to 2 rows → taller header */
}
@media (max-width: 575px) {
    .psda-op-strip-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .psda-op-nav-btn,
    .psda-op-status[data-state="busy"] .psda-op-status-icon,
    .psda-canvas-updated { transition: none; animation: none; }
}

/* ── Print: strip + sections print clean; nav/chrome drop out (Design Principle #4) ── */
/* ── Tear sheet: print = the Deal Metrics report as a clean one-pager (decision #14) ── */
.psda-op-tear-head { display: none; }
@media print {
    /* [2026-06-15] Orientation (landscape for the report) is forced at print time by a <style>
       appended LAST to the document in printReport() — a static @page here lost the cascade to
       print.css's global `@page { size: portrait !important }`. */
    /* The report is a clean DOCUMENT: drop the tab nav and flow EVERY tab as a report section
       (printReport() pre-renders each so charts are populated; print un-hides the hidden panels). */
    .psda-onepage-mode .psda-dm-tabs { display: none !important; }
    .psda-onepage-mode .psda-dm-panel[hidden] { display: block !important; }
    /* Chrome + working affordances drop out. */
    .psda-op-nav,
    .psda-op-subnav,
    .psda-op-status,
    .psda-op-export,
    .psda-op-run-sens,
    .psda-op-scenarios-bar,
    .psda-op-sample,
    .psda-op-warnings,
    .psda-onepage-mode #dm-exportPdf,
    .psda-onepage-mode #dm-shareLink,
    .psda-onepage-mode #dm-pushWaterfall,
    .psda-onepage-mode #dm-shareResult,
    .psda-onepage-mode #dm-cfScaleToggle,
    /* [2026-06-12 /impeccable:polish] interactive help affordances are screen-only */
    .psda-help-dot { display: none !important; }
    .psda-op-header { position: static; }
    .psda-op-strip { box-shadow: none; border: 1px solid #ccc; }
    /* The tear-sheet is the report: show the Deal Metrics view, drop the input scroll entirely. */
    .psda-op-view-capped { display: none !important; }
    .psda-op-view-wide { display: block !important; }
    .psda-op-tear-head {
        display: block !important;
        margin: 0 0 12px;
        padding-bottom: 8px;
        border-bottom: 2px solid var(--primary-color, #1565C0);
    }
    .psda-op-tear-title { font-size: 18px; font-weight: 700; color: #1f2328; }
    .psda-op-tear-sub { font-size: 12px; color: #6c757d; margin-top: 2px; }

    /* [2026-06-09] The Summary fills page 1; the rest of the report follows. */
    .psda-onepage-mode .psda-dm-panel[data-dm-panel="summary"] { break-after: page; }
    .psda-onepage-mode .psda-dm-panel[data-dm-panel="proforma"],
    .psda-onepage-mode .psda-dm-panel[data-dm-panel="purchsale"],
    .psda-onepage-mode .psda-dm-panel[data-dm-panel="sensitivity"] { break-before: page; }
    /* [2026-06-11 run3 A12] Map now participates in print (see A12 block at end of file).
       Scenario tools are still interactive — drop them. */
    .psda-onepage-mode .psda-op-scenarios { display: none !important; }
    /* [2026-06-15] Print mirrors the screen dashboard: the combined cash-flow exhibit (chart + table
       in one card, grid-area cfx) spans the top, then the left|right columns. Must match the screen
       grid (areas changed when the chart + table were merged) or the cfx card auto-places into an
       implicit track and the tear-sheet lays out wrong. */
    .psda-onepage-mode .psda-dm-summary {
        grid-template-areas:
            "cfx  cfx"
            "left right";
        grid-template-rows: auto auto;
    }
    /* [2026-06-15] Keep charts inside the printable page — scale the Highcharts SVG down to the
       content width instead of letting its screen-pixel width bleed off the page edge. Wide data
       tables also stay within the page. */
    .psda-onepage-mode #psdaDmSumCharts,
    .psda-onepage-mode .psda-dm-chart { max-width: 100% !important; overflow: hidden; }
    .psda-onepage-mode .psda-dm-chart svg,
    .psda-onepage-mode .highcharts-root { max-width: 100% !important; height: auto !important; }
    /* [2026-06-15] No scroll containers in print — every report scroll wrapper shows its full
       content (the on-screen overflow-x:auto would otherwise clip wide tables at the page edge and
       bake a scrollbar into the PDF). Covers the Summary annual table, the Annual Sources & Uses
       ledger, the 10-Year Pro Forma operating table, and any table-responsive. */
    .psda-onepage-mode #psdaDmSumByYear,
    .psda-onepage-mode #psdaDmAnnualSU,
    .psda-onepage-mode .psda-dm-sum-byyear,
    .psda-onepage-mode #dm-operatingTable,
    .psda-onepage-mode .table-responsive,
    .psda-onepage-mode .psda-op-su { overflow: visible !important; }
    /* Fit the wide report tables to the (landscape) page WITHOUT breaking numbers. A previous pass
       used table-layout:fixed + word-break, which (a) forced equal columns so the chart no longer
       lined up with the table, and (b) wrapped "$2,583,553" onto a second line, bleeding into the
       next row. Instead: keep auto layout (natural columns the chart aligns to), shrink the font,
       tighten padding, and KEEP NUMERIC CELLS ON ONE LINE (no wrap). Landscape + the smaller font
       gives the 10–12 column tables room. */
    .psda-onepage-mode #dealMetricsResults table,
    .psda-onepage-mode .psda-dm-byyear-table {
        width: 100% !important; max-width: 100% !important; font-size: 9px !important;
    }
    .psda-onepage-mode #dealMetricsResults th,
    .psda-onepage-mode #dealMetricsResults td,
    .psda-onepage-mode .psda-dm-byyear-table th,
    .psda-onepage-mode .psda-dm-byyear-table td {
        padding: 2px 4px !important; white-space: nowrap;
    }
    /* Only the leftmost row-label column may wrap (long line names), never the numeric data cells. */
    .psda-onepage-mode #dealMetricsResults th[scope="row"],
    .psda-onepage-mode .psda-dm-byyear-table th[scope="row"],
    .psda-onepage-mode #dealMetricsResults td:first-child,
    .psda-onepage-mode #dealMetricsResults th:first-child { white-space: normal; }
}

/* ── Accessibility: visible focus rings on custom controls (WCAG 2.4.7) ─────────
   Explicit so the controls keep a clear indicator even if a global outline reset exists. */
.psda-op-nav-btn:focus-visible,
.psda-op-subnav-btn:focus-visible,
.psda-op-status:focus-visible,
.psda-op-export-btn:focus-visible,
.psda-op-export-menu button:focus-visible,
.psda-op-scenario-btn:focus-visible,
.psda-op-scenarios-clear:focus-visible,
.psda-op-trace-input:focus-visible,
.psda-op-sample-btn:focus-visible,
.psda-op-run-sens:focus-visible,
.psda-op-traceable:focus-visible,
.psda-op-su-row[data-trace]:focus-visible {
    outline: 2px solid var(--primary-color, #1565C0);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ── Touch targets ≥ 44px on coarse pointers (WCAG 2.5.5 / design system) ──────── */
@media (pointer: coarse) {
    .psda-op-nav-btn,
    .psda-op-subnav-btn,
    .psda-op-status,
    .psda-op-export-btn,
    .psda-op-export-menu button,
    .psda-op-scenario-btn,
    .psda-op-sample-btn,
    .psda-op-run-sens,
    .psda-op-trace-input,
    /* [audit M3] controls added later that also need a 44px touch target on coarse pointers */
    .psda-cf-units-btn,
    .psda-op-detail-btn,
    .psda-op-cf-head,
    /* [2026-06-10 audit H1] second sweep: NOI year-entry Add, CapEx Advanced/collapse headers,
       click-to-trace links, loan-editor buttons. (Every control here is flex/inline-flex when
       visible, so the display override is safe — the rail toggles below are the exception.) */
    .psda-op-noi-entry-add,
    #advancedCapexToggleBtn,
    .property-info-toggle,
    #addLoanBtn,
    .refi-this-loan-btn {
        min-height: 44px;
        /* [2026-06-13 critique P2] min-height clamps height up (beats the 28px account-btn height),
           but icon-only buttons (Save/Undo/Redo) are only ~34px WIDE — min-width completes the
           44×44 target; labeled buttons already exceed it, so this is a no-op for them. */
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    /* The click-to-trace links sit INSIDE a small formula line — grow the tap area with
       invisible padding (negative margin cancels the layout shift) instead of min-height,
       which would blow up the line box. */
    .cap-rate-anchor { padding: 14px 4px; margin: -14px -4px; }
    /* The CapEx Override checkbox: grow the hit area without distorting the box. */
    #capexOverrideToggle { min-width: 24px; min-height: 24px; }
    /* [2026-06-10 review] The two rail toggles default to display:none and only show in their
       own states — an unscoped display:inline-flex here forced them VISIBLE on touch devices
       (the left-edge handle rendered with the rail open). Bump only the size, only when shown. */
    .op-report-active .psda-op-rail-toggle { min-height: 44px; }
    .op-report-active.rail-collapsed .psda-op-rail-reopen { min-height: 44px; }
}

/* [audit H3] Keep wide report tables from widening the whole page on narrow viewports — contain
   their overflow to their own horizontal scroll. min-width:0 lets the report column actually shrink
   below the tables' intrinsic width (otherwise the table-responsive can't scroll and the page does). */
.psda-onepage-mode #psdaOpView-metrics,
.psda-onepage-mode .psda-dm-report,
.psda-onepage-mode .psda-dm-panel,
.psda-onepage-mode #dm-operatingRow,
.psda-onepage-mode #dm-operatingRow > .col,
.psda-onepage-mode #dm-operatingRow .card,
.psda-onepage-mode #dm-operatingRow .card-body { min-width: 0; }
.psda-onepage-mode #psdaDmSumByYear { overflow-x: auto; overflow-y: hidden; }  /* pin overflow-y so the H2 horizontal scroll can't spawn a stray vertical scrollbar */

/* ── [2026-06-09] Summary tab dashboard (onepage only) — one screen / one PDF page ──────
   [2026-06-11 run3 A13] Charts row moves ABOVE the per-year table (user ask: NOI chart above
   the cash flow table). New order: charts (full-width) → table (full-width) → su/map/sor.
   Gated on .psda-onepage-mode — the rail keeps its flat single-column summary.
   (Markup stays flat; grid-template-areas control visual order.) */
.psda-onepage-mode .psda-dm-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* [2026-06-12 user] The lower dashboard is two INDEPENDENT columns (markup wrappers
       #psdaDmSumLeft / #psdaDmSumRight): left = Acquisition S&U over the sale exhibit, right =
       Sources of Return over the map. Only the column TOTALS match (one grid row, stretch);
       cards inside size to content — no more dead white space inside the shorter card. The
       map flexes to absorb the right column's slack (taller map, per user). */
    grid-template-areas:
        "cfx  cfx"
        "left right";
    grid-template-rows: auto auto;
    /* [2026-06-12 /impeccable:layout] 16px both axes — one gap rhythm with the other report
       tabs (purchsale / sourcesuses panels also run 16px). */
    gap: 16px;
    align-items: stretch;
}
/* The display overrides below would otherwise defeat the shared [hidden] rule (equal specificity,
   later source order) and show an empty grid shell before a calc — re-assert hide on the onepage. */
.psda-onepage-mode .psda-dm-summary[hidden] { display: none; }
.psda-onepage-mode .psda-dm-sum-left  { grid-area: left; }
.psda-onepage-mode .psda-dm-sum-right { grid-area: right; }
.psda-onepage-mode .psda-dm-sum-col { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.psda-onepage-mode #psdaDmSumSU  { margin: 0; max-width: none; }
.psda-onepage-mode #psdaDmSumSale { margin: 0; max-width: none; }

/* ── [2026-06-15 user] Combined NOI-vs-LevCF chart + Annual Cash Flow table = ONE card ──────
   The two used to be separate cards (chart row above table row). Now they share a single
   bordered card and a single year axis: the chart sits on top, the per-year table directly
   below with NO gap, so each year's bars read as "dropping into" its column of numbers.
   buildSummaryCharts sizes the chart's plot area to the table's data-column block, so the
   bars land over their year columns. The table must NOT independently h-scroll inside the card
   (that would slide the columns out from under the bars) — it shares the card's width. */
.psda-onepage-mode .psda-dm-cfexhibit {
    grid-area: cfx;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--tertiary-color, #e0e0e0);
    border-radius: 8px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14);
    padding: 14px 16px 4px;
    min-width: 0;
}
.psda-onepage-mode .psda-dm-cfexhibit-head { margin-bottom: 4px; }
.psda-onepage-mode .psda-dm-cfexhibit .psda-dm-sum-charts { grid-template-columns: 1fr; height: auto; margin: 0; }
/* Flatten the inner card chrome that psda-rail.css gives the chart + table (it loads on the onepage
   too): inside the combined exhibit they are ONE card, not nested cards. Zeroing their horizontal
   padding also aligns the chart host's left edge with the table's, so the plot-to-column margin math
   lands exactly (the host and table now share the card's content-left). */
.psda-onepage-mode .psda-dm-cfexhibit .psda-dm-chart {
    background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0;
}
/* The table butts directly against the chart (no inner card, no gap) — just a hairline divider. */
.psda-onepage-mode .psda-dm-cfexhibit #psdaDmSumByYear {
    background: transparent; border: 0; border-radius: 0; box-shadow: none;
    margin: 6px 0 0; padding: 8px 0 0; border-top: 1px solid var(--tertiary-color, #e0e0e0);
    overflow-x: visible;   /* share the card width; don't spawn an independent scroll that breaks bar↔column alignment */
}
/* Map fills the remaining right-column height (the map area is permanent — placeholder when
   no address) so the left/right column totals stay equal; the map itself is the stretcher. */
.psda-onepage-mode .psda-dm-sum-map { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 220px; }
.psda-onepage-mode .psda-dm-sum-map > .psda-dm-map { flex: 1 1 auto; height: auto; min-height: 200px; }
/* Slim Sources of Return on the Summary (secondary to Sources & Uses). */
.psda-onepage-mode #psdaDmRetMix { padding: 10px 14px; }
.psda-onepage-mode #psdaDmRetMix .psda-dm-retmix-title { margin-bottom: 6px; }
.psda-onepage-mode #psdaDmRetMix .psda-dm-retmix-legend { margin-top: 6px; font-size: 12px; }
.psda-onepage-mode #psdaDmRetMix .psda-dm-retmix-insight { margin-top: 5px; font-size: 12px; }
/* Narrow viewports: collapse the dashboard to a single flowing column. */
@media (max-width: 991.98px) {
    .psda-onepage-mode .psda-dm-summary { display: flex; flex-direction: column; }
    .psda-onepage-mode #psdaDmSumCharts { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); height: auto; }
    .psda-onepage-mode .psda-dm-sum-map { height: auto; }
}

/* [2026-06-09] The Summary map placeholder + ArcGIS address-autocomplete styles moved to
   psda-shared.css (loaded on BOTH the onepage and rail surfaces) — psda-report.js builds that
   dropdown on both, so the styles must live with the shared component, not this onepage-only sheet. */

/* ── [item 9] 10-year cash-flow ribbon ─────────────────────────────────────────
   Quiet tabular strip at the top of the Basic Info view, shown after the user confirms NOI.
   Deliberately mirrors the rail capital strip's restraint — white card, brand-quiet, NOT a
   saturated KPI band (Design Context §4 returns-strip ruling). */
.psda-op-cf-ribbon {
    display: flex;
    /* [2026-06-11 item 5] Single row ALWAYS — long holds slide horizontally instead of
       wrapping into a second line (thin scrollbar = the slider). */
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    align-items: baseline;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 10px;
    padding: 10px 4px;
    margin: 0 0 1rem;
    font-variant-numeric: tabular-nums;
    font-size: 13px;
}
.psda-op-cf-ribbon::-webkit-scrollbar { height: 6px; }
.psda-op-cf-ribbon::-webkit-scrollbar-thumb { background: #ccd2d8; border-radius: 3px; }
.psda-op-cf-lead {
    padding: 2px 14px 2px 8px;
    border-right: 1px solid #eef0f2;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 11px;
    white-space: nowrap;
}
.psda-op-cf-seg {
    display: flex;
    flex-direction: column;
    padding: 2px 14px;
    border-right: 1px solid #eef0f2;
    white-space: nowrap;
}
.psda-op-cf-seg:last-child { border-right: 0; }
.psda-op-cf-label { color: #6c757d; font-size: 11px; }
.psda-op-cf-value { color: #1f2328; font-weight: 600; }
/* [2026-06-12 user] Overflow reflow (class set by buildCfRibbon when the single row would
   scroll): "NOI BY YEAR" becomes a header line; the year values move to a fresh full-width
   row and wrap instead of sliding behind a scrollbar. */
.psda-op-cf-ribbon-2row { flex-wrap: wrap; overflow-x: visible; row-gap: 6px; }
.psda-op-cf-ribbon-2row .psda-op-cf-lead {
    flex: 1 1 100%;
    border-right: 0;
    border-bottom: 1px solid #eef0f2;
    padding-bottom: 6px;
}
@media (max-width: 760px) {
    .psda-op-cf-seg { border-right: 0; padding: 2px 12px 2px 2px; }
}
@media print {
    .psda-op-cf-ribbon { page-break-inside: avoid; }
}

/* ── [2026-06-11 items 2+3] Account: Save / My deals / presets ──────────────────
   Compact toolbar buttons (always visible in the nav row), the My-deals menu, the
   anchored account popover, and the Debt-section preset bar. Quiet chrome family. */
.psda-op-account { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; margin-left: 8px; }
.psda-op-account-btn { height: 28px; padding: 0 10px; font-size: 12px; }
.psda-op-mydeals-menu { min-width: 260px; max-height: 320px; overflow-y: auto; }
/* [2026-06-11 run3 C1] The shared .psda-op-export-menu button rule sets width:100%, which breaks
   the two-button (open+delete) flex row. Override: buttons in the mydeals menu are auto-width;
   only the open button expands via flex:1. */
.psda-op-mydeals-menu button { width: auto; }
.psda-op-mydeals-row { display: flex; align-items: stretch; }
.psda-op-mydeals-open {
    display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
    flex: 1 1 auto; min-width: 0;
    border: none; background: transparent; padding: 8px 10px; border-radius: 6px;
    font-size: 13px; color: #1f2328; text-align: left; cursor: pointer;
}
.psda-op-mydeals-open:hover { background: #f4f8fd; color: var(--primary-color, #1565C0); }
.psda-op-mydeals-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.psda-op-mydeals-date { flex: 0 0 auto; font-size: 11px; color: #8a929b; font-variant-numeric: tabular-nums; }
.psda-op-mydeals-del {
    flex: 0 0 auto; border: none; background: transparent; color: #8a929b;
    padding: 0 10px; cursor: pointer; border-radius: 6px;
}
.psda-op-mydeals-del:hover { color: #c62828; background: #fdf3f3; }
.psda-op-mydeals-empty { padding: 10px 12px; font-size: 12.5px; color: #6c757d; }
.psda-account-pop {
    z-index: 1100; width: 320px; max-width: calc(100vw - 24px);
    background: #ffffff; border: 1px solid #e6e8eb; border-radius: 8px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.16); padding: 14px;
}
.psda-account-pop-title {
    font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em;
    color: #6c757d; font-weight: 700; margin-bottom: 10px;
}
.psda-account-pop-text { font-size: 13px; color: #3d4750; margin: 0 0 12px; line-height: 1.45; }
.psda-account-pop-row { display: flex; gap: 8px; align-items: center; }
.psda-account-pop-input { flex: 1 1 auto; min-width: 0; height: 34px; font-size: 13px; }
.psda-account-pop-actions { display: flex; gap: 12px; align-items: center; }
.psda-account-pop-primary {
    display: inline-flex; align-items: center; height: 34px; padding: 0 16px;
    border: 1px solid var(--primary-color, #1565C0); border-radius: 6px;
    background: var(--primary-color, #1565C0); color: #fff !important;
    font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none;
}
.psda-account-pop-primary:hover { background: var(--primary-color-dark, #0d47a1); text-decoration: none; }
.psda-account-pop-link { font-size: 13px; font-weight: 600; color: var(--primary-color, #1565C0); }
.psda-account-pop-hint { display: block; margin-top: 8px; font-size: 11.5px; color: #8a929b; }

/* ── [2026-06-11 run3] Phase A CSS additions ───────────────────────────────── */

/* A2: Toolbar row (Save/My deals + report actions) sits below the tab row.
   Account group is always flex; nav-actions visibility unchanged (.op-report-active). */
.psda-op-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    justify-content: flex-end;
    border-bottom: 1px solid #eef0f2;
}
/* Move account margin-left into toolbar context (was nav-row margin). */
.psda-op-toolbar .psda-op-account { margin-left: 0; }

/* [2026-06-12 critique H8] The report-tab promo banner was removed (marketing above
   IC-grade output); its CSS went with it. */

/* A14: View-only chip is defined in psda-shared.css (display:inline-flex, no report-active gate).
   It is naturally visible on all tabs. No additional rule needed here. */

/* A6: Prevent scrollbar from shifting the page when navigating between views. */
html { scrollbar-gutter: stable; }

/* A7: KPI ribbon band background consistent across all tabs. The header already has
   background:#fafbfc (set on .psda-op-header); ensure it's not overridden. */
#psdaOnePage.op-report-active .psda-op-header { background: #fafbfc; }

/* A8: NOI vs Levered CF chart title — uppercase treatment matching card titles. */
.psda-dm-chart .highcharts-title tspan,
.psda-dm-chart .highcharts-title { text-transform: uppercase !important; letter-spacing: 0.04em !important; }

/* [2026-06-11 run3 A9] Grey total bar edges align with the breakdown rows above it
   (both at the card's content width) — no full-bleed, no inset. */

/* A10: Units chips left-aligned at the start of the year-column block (not pushed right). */
#dm-cfScaleToggle { margin-left: 0; margin-right: auto; }

/* A11: Year header row grey background (matching S&U section-band treatment). */
.psda-dm-byyear-table thead th { background: #f5f6f8; }

/* A12: Map card participates in print (try canvas; if blank, card+address still shows).
   [2026-06-12] The stale print-grid override here was removed — the main print block now
   mirrors the screen layout (charts / table / left|right wrappers). */
@media print {
    .psda-onepage-mode #psdaDmSumMap { display: flex !important; }
    .psda-onepage-mode .psda-dm-map { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
.psda-account-pop-check { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; font-size: 12.5px; color: #3d4750; }
.psda-op-preset-bar {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin: 0 0 12px; padding: 8px 10px;
    background: #fbfcfd; border: 1px solid #eef0f2; border-radius: 8px;
}
.psda-op-preset-lbl {
    margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
    color: #6c757d; font-weight: 700; white-space: nowrap;
}
.psda-op-preset-sel { width: auto; max-width: 220px; height: 30px; font-size: 12.5px; padding: 2px 8px; }
.psda-op-preset-note { font-size: 12px; color: #2e7d32; font-weight: 600; }
