/* ══════════════════════════════════════════════════════════════════════
   STUDENT LEASE-UP PLAN  (.fr-leaseup-*)
   ----------------------------------------------------------------------
   Frontier reskin of the student Lease-Up Plan page (Renewals → Pre-Lease
   Tiers → GPR Forecast). Per-unit-type cards + editable tables reuse the
   fr-renewal-* vocabulary; this block adds the plan-level chrome: the
   sticky forecast band, the renewals scoreboard, the tier cells, and the
   GPR forecast table. Scoped under .fr-leaseup-page where it touches
   shared form primitives.
   ══════════════════════════════════════════════════════════════════════ */

.fr-leaseup-page {
    font-family: var(--fr-font-sans);
    color: var(--fr-ink);
    /* Breathing room at the page foot so the floating comment bubble
       (bottom-right) sits clear of the final GPR forecast total row.
       !important is required to beat Bootstrap's `.p-3` (padding: 1rem
       !important) on the same element. */
    padding-bottom: 140px !important;
}
.fr-leaseup-snapshot-info {
    font-family: var(--fr-font-mono);
    font-size: 11px;
    letter-spacing: 0.02em;
    color: var(--fr-ink-3);
    margin: 0 2px 14px;
}

/* Shared form primitives (inputs, addons) */
.fr-leaseup-page .form-control {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    color: var(--fr-ink);
    background: var(--fr-bg);
    border: 1px solid var(--fr-hairline-strong);
    border-radius: var(--fr-r-sm);
    box-shadow: none;
}
.fr-leaseup-page .form-control:focus {
    border-color: var(--fr-accent);
    background: var(--fr-surface);
    box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.10);
}
.fr-leaseup-page .form-control::placeholder { color: var(--fr-ink-3); }
.fr-leaseup-page .input-group-text {
    background: var(--fr-bg);
    border: 1px solid var(--fr-hairline-strong);
    color: var(--fr-ink-3);
    font-family: var(--fr-font-sans);
    font-size: 12px;
    font-weight: 500;
}

/* Eyebrow (uppercase tracked label) */
.fr-leaseup-eyebrow {
    font-family: var(--fr-font-sans);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
}
.fr-leaseup-eyebrow--accent { color: var(--fr-accent); display: block; margin-bottom: 8px; }

/* Sticky forecast band */
.fr-leaseup-sticky {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    box-shadow: 0 1px 2px rgba(20, 24, 29, 0.05);
    padding: 16px 22px 14px;
    margin-bottom: 22px;
}
.fr-leaseup-sticky-grid {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 28px;
}
.fr-leaseup-hero { flex: 1 1 280px; min-width: 240px; }
.fr-leaseup-hero-eyebrow-row { display: flex; align-items: baseline; gap: 12px; margin-bottom: 4px; }
.fr-leaseup-hero-plan {
    font-family: var(--fr-font-mono);
    font-size: 11px;
    color: var(--fr-ink-3);
    letter-spacing: 0.01em;
}
.fr-leaseup-hero-line { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.fr-leaseup-hero-value {
    font-family: var(--fr-font-serif);
    font-size: 40px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.01em;
    color: var(--fr-ink);
    font-variant-numeric: tabular-nums;
}
.fr-leaseup-hero-growth {
    font-family: var(--fr-font-sans);
    font-size: 13px;
    font-weight: 600;
}
.fr-leaseup-hero-growth.is-up   { color: var(--fr-positive); }
.fr-leaseup-hero-growth.is-down { color: var(--fr-negative); }
.fr-leaseup-hero-growth.is-flat { color: var(--fr-ink-3); }

.fr-leaseup-breakdown { display: flex; gap: 26px; align-self: center; flex-wrap: wrap; }
.fr-leaseup-breakdown-stat { display: flex; flex-direction: column; gap: 4px; }
.fr-leaseup-breakdown-label {
    font-family: var(--fr-font-sans);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
}
.fr-leaseup-breakdown-value {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 15px;
    font-weight: 600;
    color: var(--fr-ink);
}

.fr-leaseup-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.fr-leaseup-save-status { min-height: 14px; text-align: right; }
.fr-leaseup-save-msg { font-family: var(--fr-font-mono); font-size: 11px; }
.fr-leaseup-save-msg.is-ok     { color: var(--fr-positive-deep); }
.fr-leaseup-save-msg.is-warn   { color: var(--fr-warning-deep); }
.fr-leaseup-save-msg.is-danger { color: var(--fr-negative-deep); }

.fr-leaseup-jump {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--fr-hairline);
}
.fr-leaseup-jump-label {
    font-family: var(--fr-font-sans);
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
}
.fr-leaseup-jump-link {
    font-family: var(--fr-font-sans);
    font-size: 12px;
    font-weight: 500;
    color: var(--fr-ink-2);
    text-decoration: none;
    transition: color 120ms ease;
}
.fr-leaseup-jump-link:hover { color: var(--fr-accent); }
.fr-leaseup-jump-sep { color: var(--fr-hairline-strong); }

/* Section header (eyebrow + serif title) */
.fr-leaseup-section-header { margin-top: 32px; }
.fr-leaseup-section-header .fr-section-title { margin-bottom: 4px; }

/* Controls bar actions + ghost button */
.fr-leaseup-controls-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.fr-leaseup-ghost-btn {
    height: 34px;
    padding: 0 16px;
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline-strong);
    border-radius: var(--fr-r-md);
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--fr-ink-2);
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.fr-leaseup-ghost-btn:hover { background: #FBF9F4; color: var(--fr-ink); border-color: #C9C5B8; }
.fr-leaseup-ghost-btn:focus, .fr-leaseup-ghost-btn:active {
    outline: none;
    box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.12);
}

/* Renewals portfolio scoreboard */
.fr-leaseup-scoreboard {
    display: flex;
    flex-wrap: wrap;
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    overflow: hidden;
    margin-bottom: 18px;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}
.fr-leaseup-score {
    flex: 1 1 180px;
    padding: 18px 22px 16px;
    border-right: 1px solid var(--fr-hairline);
}
.fr-leaseup-score:last-child { border-right: 0; }
.fr-leaseup-score-label {
    font-family: var(--fr-font-sans);
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
    margin-bottom: 8px;
}
.fr-leaseup-score-value {
    font-family: var(--fr-font-serif);
    font-size: 30px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.01em;
    color: var(--fr-ink);
    font-variant-numeric: tabular-nums;
}
.fr-leaseup-score-value--pos  { color: var(--fr-positive); }
.fr-leaseup-score-value--neg  { color: var(--fr-negative); }
.fr-leaseup-score-value--gold { color: var(--fr-gold); }

/* Per-unit-type card tweaks (reuses fr-renewal-card). No collapse here,
   so neutralize the head's pointer + hover affordance. */
.fr-leaseup-card-head { cursor: default; }
.fr-leaseup-card-head:hover { background: var(--fr-bg); }

/* Renewals card body: website-price rail + editable table side by side. */
.fr-leaseup-renewal-body {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}
.fr-leaseup-side {
    flex: 0 0 150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-right: 20px;
    border-right: 1px solid var(--fr-hairline);
}
.fr-leaseup-side-label {
    font-family: var(--fr-font-sans);
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
    margin-top: 4px;
}
.fr-leaseup-price-group .form-control { text-align: center; }
.fr-leaseup-variance {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
}
.fr-leaseup-variance.is-up   { color: var(--fr-positive); }
.fr-leaseup-variance.is-down { color: var(--fr-negative); }
.fr-leaseup-table-wrap { flex: 1 1 auto; min-width: 0; }

/* DataTable focus + input refinements that style props cannot express. */
.fr-leaseup-table-wrap .dash-cell.focused {
    box-shadow: inset 0 0 0 2px var(--fr-accent) !important;
    background-color: var(--fr-surface) !important;
}
.fr-leaseup-table-wrap input.dash-cell-value {
    font-family: var(--fr-font-mono) !important;
    color: var(--fr-ink) !important;
}
.fr-leaseup-table-wrap .dash-spreadsheet-container { border-radius: var(--fr-r-md); }

/* Tier controls row */
.fr-leaseup-tier-controls { align-items: flex-end; }
.fr-leaseup-field { display: flex; flex-direction: column; gap: 6px; }
.fr-leaseup-tier-pct-row { display: flex; gap: 6px; }
.fr-leaseup-tier-pct-input.form-control {
    width: 56px;
    text-align: center;
    padding-left: 6px;
    padding-right: 6px;
}

/* Tier cards */
.fr-leaseup-tier-body { padding: 16px 18px 14px; }
.fr-leaseup-tier-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.fr-leaseup-tier {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px;
    background: var(--fr-bg);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-md);
}
.fr-leaseup-tier .form-control { text-align: center; background: var(--fr-surface); }
/* Both addons ($ and beds) sit on the left with matched widths so the
   two input fields align flush down the cell. */
.fr-leaseup-tier .input-group-text {
    min-width: 46px;
    justify-content: center;
}
.fr-leaseup-tier-label {
    font-family: var(--fr-font-sans);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-accent);
    text-align: center;
    margin-bottom: 2px;
}
.fr-leaseup-tier-foot {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--fr-hairline);
}
.fr-leaseup-tier-foot-label {
    font-family: var(--fr-font-sans);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
}
.fr-leaseup-tier-foot-value {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 16px;
    font-weight: 600;
    color: var(--fr-ink);
}

/* Amenity card */
.fr-leaseup-amenity-field { max-width: 320px; }
.fr-leaseup-field-hint {
    font-family: var(--fr-font-serif);
    font-style: italic;
    font-size: 13px;
    color: var(--fr-ink-3);
    margin-top: 2px;
}

/* GPR forecast table */
.fr-leaseup-fc-wrap {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}
.fr-leaseup-fc-table {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--fr-font-sans);
    font-size: 13px;
    color: var(--fr-ink);
}
.fr-leaseup-fc-table thead th {
    background: #FBFAF6;
    color: var(--fr-ink-3);
    font-size: 10.5px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    padding: 13px 18px;
    border-bottom: 1px solid var(--fr-hairline-strong);
    white-space: nowrap;
}
.fr-leaseup-fc-table tbody td {
    padding: 11px 18px;
    border-bottom: 1px solid var(--fr-hairline);
    vertical-align: middle;
}
.fr-leaseup-fc-table .is-left  { text-align: left; }
.fr-leaseup-fc-table .is-right { text-align: right; }
.fr-leaseup-fc-table .fr-cell-money,
.fr-leaseup-fc-table .fr-cell-num {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
}
.fr-leaseup-fc-name { font-weight: 500; }
.fr-leaseup-fc-strong { font-weight: 600; }
.fr-leaseup-fc-table tbody tr:nth-of-type(even):not(.fr-leaseup-fc-subtotal):not(.fr-leaseup-fc-amenity):not(.fr-leaseup-fc-total) td {
    background: #FCFBF7;
}
.fr-leaseup-fc-subtotal td {
    background: #FBFAF6;
    font-weight: 600;
    border-top: 1px solid var(--fr-hairline-strong);
}
.fr-leaseup-fc-amenity td { color: var(--fr-ink-2); }
.fr-leaseup-fc-total td {
    background: var(--fr-accent-soft);
    color: var(--fr-accent-strong);
    font-weight: 700;
    font-size: 14px;
    border-top: 1px solid rgba(180, 83, 9, 0.30);
    border-bottom: 0;
}
.fr-leaseup-fc-total .is-left {
    text-transform: uppercase;
    letter-spacing: 0.10em;
    font-size: 11px;
}

/* Empty / info notes */
.fr-leaseup-note {
    font-family: var(--fr-font-serif);
    font-style: italic;
    font-size: 15px;
    padding: 14px 4px;
}
.fr-leaseup-note--muted  { color: var(--fr-ink-3); }
.fr-leaseup-note--warn   { color: var(--fr-warning-deep); }
.fr-leaseup-note--danger { color: var(--fr-negative-deep); }


/* ══════════════════════════════════════════════════════════════════════
   STUDENT LEASE-UP TRACKER  (.fr-tracker-*)
   ----------------------------------------------------------------------
   Read-only live-pace dashboard. Reuses the Lease-Up Plan vocabulary
   (.fr-leaseup-page, .fr-section-*, .fr-renewal-controls, .fr-renewal-seg)
   and adds tracker-specific chrome: editorial header, a pace-summary chip
   row, a chart card, and signed-vs-plan tier-progress cells.
   ══════════════════════════════════════════════════════════════════════ */

.fr-tracker-page { font-family: var(--fr-font-sans); }

/* ── Editorial header (eyebrow + serif title) ──────────────────────── */
.fr-tracker-head {
    display: flex;
    flex-direction: column;
    margin: 6px 2px 6px;
}
.fr-tracker-title { margin: 4px 0 0; }

/* ── Filter bar tweaks ─────────────────────────────────────────────── */
.fr-tracker-controls-row { align-items: flex-end; gap: 22px; }
.fr-tracker-field { min-width: 150px; }
/* Wide enough for the full cycle label, e.g. "2026 Cycle (Oct 2025 – Sep 2026)". */
.fr-tracker-field:first-child  { min-width: 300px; flex: 0 1 320px; }
.fr-tracker-field:nth-child(2) { min-width: 240px; flex: 1 1 240px; }
.fr-tracker-field:last-child   { min-width: 200px; flex: 1 1 200px; }
/* The metric segmented control sits a touch above the dropdown baseline;
   nudge it down so its pill aligns with the dropdown controls. */
.fr-tracker-metric-seg { margin-bottom: 1px; }

/* Cycle / benchmark dropdown menu options on the lease-up pages: keep each
   option on a single line so long cycle labels (e.g. "2026 Cycle (Oct 2025
   – Sep 2026)") don't wrap and collide. Paired with the wider Cycle fields. */
.fr-leaseup-page .fr-renewal-ut-dropdown .Select-menu-outer .Select-option {
    white-space: nowrap;
}

/* ── Pace summary chips (this cycle vs prior, same cycle-week) ──────── */
.fr-tracker-pace-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 2px 2px 14px;
    min-height: 0;
}
.fr-tracker-pace-summary:empty { margin: 0; }
.fr-tracker-pace-chip {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: 100px;
    padding: 7px 15px;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}
.fr-tracker-pace-chip-label {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
}
.fr-tracker-pace-chip-value {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 15px;
    font-weight: 600;
    color: var(--fr-ink);
}
.fr-tracker-pace-chip-delta {
    font-size: 12px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.fr-tracker-pace-chip-delta.is-up   { color: var(--fr-positive); }
.fr-tracker-pace-chip-delta.is-down { color: var(--fr-negative); }
.fr-tracker-pace-chip-delta.is-flat { color: var(--fr-ink-3); }

/* ── Chart card ────────────────────────────────────────────────────── */
.fr-tracker-chart-card {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    padding: 14px 16px 8px;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}

/* Lease-Up Tracker charts (§1 YoY Pace + §3 Lead Demand) — undo the global
   ".js-plotly-plot { height: 500px !important }" force (PLOTLY CHART STYLES,
   ~line 1764) for THESE charts only. That global rule pins every Plotly element
   to 500px and gives it its own border/shadow, so each chart drew its content at
   the figure's real height inside a 500px box (the blank band / slight overflow)
   and stacked a second card inside fr-tracker-chart-card. Scoped to these two
   chart ids so every other page stays untouched. Each graph fills its styled
   height (responsive=True), and the card grows to contain it — one clean box,
   no squish, no overflow. */
#student-tracker-yoy-chart .js-plotly-plot,
#student-tracker-yoy-chart .js-plotly-plot .plotly,
#student-tracker-yoy-chart .js-plotly-plot .svg-container,
#student-tracker-yoy-chart .js-plotly-plot .main-svg,
#student-tracker-demand-chart .js-plotly-plot,
#student-tracker-demand-chart .js-plotly-plot .plotly,
#student-tracker-demand-chart .js-plotly-plot .svg-container,
#student-tracker-demand-chart .js-plotly-plot .main-svg {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
}
#student-tracker-yoy-chart .js-plotly-plot,
#student-tracker-demand-chart .js-plotly-plot {
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}

/* ── Tier-progress cells (signed vs plan) ──────────────────────────── */
.fr-tracker-progress-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}
.fr-tracker-progress-cell {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    padding: 18px 20px 16px;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}
.fr-tracker-cell-group {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fr-ink-3);
    margin-bottom: 10px;
}
.fr-tracker-cell-count { display: flex; align-items: baseline; gap: 7px; margin-bottom: 12px; }
.fr-tracker-cell-signed {
    font-family: var(--fr-font-serif);
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.01em;
    color: var(--fr-ink);
    font-variant-numeric: tabular-nums;
}
.fr-tracker-cell-target {
    font-family: var(--fr-font-mono);
    font-size: 14px;
    color: var(--fr-ink-3);
    font-variant-numeric: tabular-nums;
}
.fr-tracker-cell-bar {
    height: 7px;
    border-radius: 100px;
    background: var(--fr-hairline);
    overflow: hidden;
    margin-bottom: 8px;
}
.fr-tracker-cell-bar-fill {
    height: 100%;
    border-radius: 100px;
    background: var(--fr-accent);
    transition: width 240ms ease;
}
.fr-tracker-cell-bar-fill.is-ahead  { background: var(--fr-positive); }
.fr-tracker-cell-bar-fill.is-on     { background: var(--fr-accent); }
.fr-tracker-cell-bar-fill.is-behind { background: var(--fr-warning); }
.fr-tracker-cell-bar-fill.is-risk   { background: var(--fr-negative); }
.fr-tracker-cell-bar-fill.is-none   { background: var(--fr-hairline-strong); width: 0 !important; }
.fr-tracker-cell-status {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 500;
    color: var(--fr-ink-3);
}
.fr-tracker-cell-status.is-ahead  { color: var(--fr-positive-deep); }
.fr-tracker-cell-status.is-behind { color: var(--fr-warning-deep); }
.fr-tracker-cell-status.is-risk   { color: var(--fr-negative-deep); }

/* Empty / loading note */
.fr-tracker-empty {
    font-family: var(--fr-font-serif);
    font-style: italic;
    font-size: 15px;
    color: var(--fr-ink-3);
    padding: 14px 4px;
}


/* ══════════════════════════════════════════════════════════════════════
   STUDENT RATE MANAGER  (.fr-rate-mgr-* / .fr-rm-*)
   ----------------------------------------------------------------------
   In-season pricing cockpit. Shares the editorial header / controls /
   section headers / scoreboard with the Tracker + Plan pages, and adds a
   data-table vocabulary (.fr-rm-table) for the live rate board, the modal
   change preview, and the audit log — mirroring the .fr-leaseup-fc-table
   look so all the lease-up surfaces feel like one ledger.
   ══════════════════════════════════════════════════════════════════════ */

.fr-rate-mgr-page { font-family: var(--fr-font-sans); }

/* ── Filter bar ────────────────────────────────────────────────────── */
/* Top-align so the Cycle label/input lines up with the Benchmark
   label/input even though Benchmark carries a hint line beneath it. */
.fr-rate-mgr-controls-row { align-items: flex-start; gap: 22px; }
/* Wide enough for the full cycle label, e.g. "2026 Cycle (Oct 2025 – Sep 2026)". */
.fr-rate-mgr-field:first-child { min-width: 300px; flex: 0 1 320px; }
.fr-rate-mgr-field:nth-child(2) { min-width: 280px; flex: 1 1 320px; }

/* ── Summary scoreboard wrap + per-score sub-line ──────────────────── */
.fr-rate-mgr-summary-wrap { margin: 2px 0 4px; }
.fr-rm-score-sub {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    color: var(--fr-ink-3);
    margin-top: 7px;
}

/* ── Lead Demand pill (property-level, summary band) ───────────────── */
.fr-rm-demand-pill {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.fr-rm-demand-pill.is-hot    { color: var(--fr-positive); }
.fr-rm-demand-pill.is-normal { color: var(--fr-ink-2); }
.fr-rm-demand-pill.is-cold   { color: var(--fr-negative); }
.fr-rm-demand-pill.is-none   { color: var(--fr-ink-3); }
.fr-rm-demand-detail { margin-top: 4px; }

/* ── Detail pop-out modals: expand affordance + modal body ─────────── */
/* Summary-score header holds the title + (optional) expand icon inline. */
.fr-rm-score-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
/* A context-zone figure + its expand icon (board group-header cells). The
   figure grows to fill the cell so the icon sits right beside it (top-right),
   not stranded at the far edge. */
.fr-rm-zone-cell {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.fr-rm-zone-cell > :first-child {
    flex: 1 1 auto;
    min-width: 0;
}
/* The expand icon — a small bordered button beside the figure. Quiet by
   default, accent on hover, so the board stays calm but the figure clearly
   signals "there's more behind this." */
.fr-rm-expand-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--fr-hairline);
    background: var(--fr-paper, #FFFFFF);
    color: var(--fr-ink-2);
    font-size: 14px;
    line-height: 1;
    border-radius: 6px;
    cursor: pointer;
    opacity: 0.85;
    transition: opacity 0.12s ease, color 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
.fr-rm-expand-btn:hover {
    opacity: 1;
    color: var(--fr-accent, #B45309);
    background: var(--fr-accent-soft, #FEF3C7);
    border-color: var(--fr-accent, #B45309);
}
.fr-rm-expand-btn:focus-visible {
    outline: 2px solid var(--fr-accent, #B45309);
    outline-offset: 1px;
    opacity: 1;
}

/* Detail modal body: intro/footnote text + the one-line numeric read. */
.fr-rm-detail-modal .modal-body { padding-top: 8px; }
.fr-rm-modal-intro {
    font-family: var(--fr-font-sans);
    font-size: 12.5px;
    color: var(--fr-ink-2);
    margin: 0 0 10px;
    max-width: 70ch;
}
.fr-rm-modal-foot {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    color: var(--fr-ink-3);
    margin: 8px 0 0;
    max-width: 80ch;
}
.fr-rm-modal-read {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 8px;
}
.fr-rm-modal-read-text {
    font-family: var(--fr-font-sans);
    font-size: 13px;
    color: var(--fr-ink);
    font-weight: 500;
}

/* ── Benchmark save/reset controls (pace comparison set) ───────────── */
.fr-rate-mgr-benchmark-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}
.fr-rate-mgr-benchmark-btn {
    font-size: 11px;
    padding: 4px 10px;
}
.fr-rate-mgr-benchmark-status {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    margin-left: 2px;
}

/* ── Push controls ─────────────────────────────────────────────────── */
.fr-rate-mgr-push-bar { margin-top: 16px; }
.fr-rate-mgr-modal-note {
    font-family: var(--fr-font-sans);
    font-size: 11.5px;
    color: var(--fr-ink-3);
    margin-top: 10px;
    line-height: 1.5;
}

/* ── Data table (rate board / modal preview / audit log) ───────────── */
.fr-rm-table-wrap {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-lg);
    overflow-x: auto;
    box-shadow: 0 1px 0 rgba(20, 24, 29, 0.02);
}
.fr-rm-table {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--fr-font-sans);
    font-size: 13px;
    color: var(--fr-ink);
}
.fr-rm-table thead th {
    background: #FBFAF6;
    color: var(--fr-ink-3);
    font-size: 10.5px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    text-align: left;
    padding: 13px 16px;
    border-bottom: 1px solid var(--fr-hairline-strong);
    white-space: nowrap;
}
.fr-rm-table tbody td {
    padding: 11px 16px;
    border-bottom: 1px solid var(--fr-hairline);
    vertical-align: middle;
}
.fr-rm-table--compact thead th { padding: 10px 14px; }
.fr-rm-table--compact tbody td { padding: 9px 14px; }
.fr-rm-table .is-right { text-align: right; }
.fr-rm-table .fr-cell-money {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
}

/* Option B column model: the pricing zone (name + rate cluster) is pinned to
   fixed widths so the rates hug the floor-plan name; the context zone
   (Pre-Lease Pace · Renewal Pace · Comp) absorbs the remaining width, leaving
   room for the planned pace/comp modals. */
.fr-rm-table th.fr-rm-col-name { width: 220px; }
.fr-rm-table th.fr-rm-col-rate { width: 250px; }

/* Hairline divider between the pricing zone and the context zone. Lives on the
   first context column (Pre-Lease Pace) in both head and body so it runs as one
   continuous rule down the table. */
.fr-rm-table th.fr-rm-zone,
.fr-rm-table td.fr-rm-zone { border-left: 1px solid var(--fr-hairline); }

/* Unit-type group header row — warm tint + accent top rule delineate groups */
.fr-rm-group-row td {
    background: #FBF6EC;
    border-top: 2px solid rgba(180, 83, 9, 0.28);
    border-bottom: 1px solid var(--fr-hairline-strong);
}
.fr-rm-group-row:first-child td { border-top: 0; }
.fr-rm-group-name { font-weight: 600; color: var(--fr-ink); }
.fr-rm-strong { font-weight: 600; color: var(--fr-ink); }

/* Space-option sub-row cell */
.fr-rm-so-cell { display: flex; align-items: center; padding-left: 14px; }
.fr-rm-so-label { color: var(--fr-ink-2); }
.fr-rm-check { display: inline-block; margin-right: 9px; vertical-align: middle; }

/* Editable new-rate input (inherits .fr-leaseup-page .form-control base) */
.fr-rm-input.form-control {
    width: 104px;
    height: 32px;
    padding: 4px 10px;
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
}

/* Tight pricing cluster: current → [input] [inline Δ], hugging the name. */
.fr-rm-rate-cell {
    display: flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}
.fr-rm-cur {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    color: var(--fr-ink-2);
}
.fr-rm-arrow { color: var(--fr-ink-3); }
.fr-rm-delta-inline {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 11.5px;
    font-weight: 600;
}

/* Context row: "rates as of …" info + the demoted Refresh link, inline. */
.fr-rate-mgr-context-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}
/* Demoted "Refresh from Entrata" — quiet accent text-link, not a button. */
.fr-rm-refresh-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 2px 6px;
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--fr-accent);
    border-radius: var(--fr-r-sm);
    transition: background 0.12s ease, color 0.12s ease;
}
.fr-rm-refresh-link:hover { background: var(--fr-accent-soft); color: var(--fr-accent-strong); }
.fr-rm-refresh-link:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.12); }
.fr-rm-refresh-ico { font-size: 13px; line-height: 1; }

/* ── Inline status / delta / comp colorings ────────────────────────── */
.fr-rm-subtle {
    font-family: var(--fr-font-sans);
    font-size: 11.5px;
    color: var(--fr-ink-3);
}
/* ── Pace cell (Variant D): leased % headline + surfaced gap + mini bar ─────
   leased % is the headline (labeled "leased"); the gap ("▼ 16% behind") is
   colored and sits beside it; a mini progress bar fills to leased % with a dark
   tick at the ideal — "how far behind" reads as a visible distance. Mirrors the
   New Leases percentile-bar idiom. */
.fr-rm-pace { line-height: 1.3; min-width: 132px; }
.fr-rm-pace-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
.fr-rm-pace-leased {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: 16px;
    color: var(--fr-ink);
    white-space: nowrap;
}
.fr-rm-pace-lab {
    font-family: var(--fr-font-sans);
    font-weight: 500;
    font-size: 11px;
    color: var(--fr-ink-3);
    margin-left: 3px;
}
.fr-rm-pace-gap {
    font-family: var(--fr-font-sans);
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
}
.fr-rm-pace-gap.dir-ahead  { color: var(--fr-positive); }
.fr-rm-pace-gap.dir-behind { color: var(--fr-negative); }
.fr-rm-pace-gap.dir-on     { color: var(--fr-ink-2); }
.fr-rm-pace-gap.dir-none   { color: var(--fr-ink-3); font-weight: 500; }
.fr-rm-pacebar {
    position: relative;
    height: 8px;
    border-radius: 5px;
    background: var(--fr-hairline);
    margin-top: 7px;
}
.fr-rm-pacebar-fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 5px;
    transition: width 0.25s ease-out;
}
.fr-rm-pacebar-fill.is-ahead  { background: var(--fr-positive); }
.fr-rm-pacebar-fill.is-behind { background: var(--fr-negative); }
.fr-rm-pacebar-fill.is-on     { background: var(--fr-accent); }
.fr-rm-pacebar-fill.is-none   { background: var(--fr-hairline-strong); }
/* Ideal tick — a dark vertical line that pokes just beyond the track. */
.fr-rm-pacebar-mark {
    position: absolute;
    top: -3px;
    bottom: -3px;
    width: 2px;
    background: var(--fr-ink);
    border-radius: 1px;
}
.fr-rm-pace-ideal {
    font-size: 11px;
    color: var(--fr-ink-3);
    margin-top: 5px;
}
/* Count-fallback primary (capacity unknown — no bar). */
.fr-rm-pace-primary {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    margin-right: 8px;
    color: var(--fr-ink);
}
.fr-rm-status { font-weight: 600; font-size: 12px; }
.fr-rm-status.is-ahead  { color: var(--fr-positive); }
.fr-rm-status.is-on     { color: var(--fr-ink-2); }
.fr-rm-status.is-behind { color: var(--fr-negative); }
.fr-rm-status.is-none   { color: var(--fr-ink-3); }
.fr-rm-delta {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}
.fr-rm-delta.is-up   { color: var(--fr-positive); }
.fr-rm-delta.is-down { color: var(--fr-negative); }
.fr-rm-delta.is-flat { color: var(--fr-ink-3); }
.fr-rm-comp { font-weight: 600; font-variant-numeric: tabular-nums; }
.fr-rm-comp.is-strong { color: var(--fr-positive); }
.fr-rm-comp.is-mid    { color: var(--fr-warning); }
.fr-rm-comp.is-weak   { color: var(--fr-negative); }
.fr-rm-comp.is-none   { color: var(--fr-ink-3); }

/* ── Comp cell: market-position dot-line (ported from the New Leases card) ───
   A line spanning the market best-price min→max, a hollow dot per competitor,
   and a filled strength-colored "You" dot (with a caret) marking our rate. */
.fr-rm-comp-cell { min-width: 150px; }
.fr-rm-comp-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 12.5px;
}
.fr-rm-comp-you-rate {
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--fr-ink-2);
}
.fr-rm-comp-n { color: var(--fr-ink-3); font-size: 11px; }
.fr-rm-comp-line {
    position: relative;
    height: 6px;
    border-radius: 100px;
    background: var(--fr-hairline);
    box-shadow: inset 0 0 0 1px var(--fr-hairline-strong);
    margin: 16px 0 6px;   /* top room for the You caret */
}
.fr-rm-comp-track { position: absolute; inset: 0; border-radius: 100px; }
.fr-rm-comp-dot {
    position: absolute;
    top: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--fr-paper, #FFFFFF);
    border: 1px solid rgba(20, 24, 29, 0.35);
    transform: translate(-50%, -50%);
    z-index: 3;
}
.fr-rm-comp-you {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--fr-ink);
    border: 2px solid var(--fr-paper, #FFFFFF);
    box-shadow: 0 0 0 1px var(--fr-ink);
    transform: translate(-50%, -50%);
    z-index: 5;
}
.fr-rm-comp-you.is-strong { background: var(--fr-positive); box-shadow: 0 0 0 1px var(--fr-positive); }
.fr-rm-comp-you.is-mid    { background: var(--fr-warning);  box-shadow: 0 0 0 1px var(--fr-warning); }
.fr-rm-comp-you.is-weak   { background: var(--fr-negative); box-shadow: 0 0 0 1px var(--fr-negative); }
.fr-rm-comp-you-caret {
    position: absolute;
    bottom: 100%;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid var(--fr-ink);
    transform: translate(-50%, -3px);
    z-index: 6;
}
.fr-rm-comp-you-caret.is-strong { border-top-color: var(--fr-positive); }
.fr-rm-comp-you-caret.is-mid    { border-top-color: var(--fr-warning); }
.fr-rm-comp-you-caret.is-weak   { border-top-color: var(--fr-negative); }
.fr-rm-comp-ends {
    display: flex;
    justify-content: space-between;
    font-family: var(--fr-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: 11px;
    color: var(--fr-ink-3);
}

/* Audit-log specifics */
.fr-rm-notes { color: var(--fr-ink-2); font-size: 12px; }
.fr-rm-flag {
    font-family: var(--fr-font-sans);
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fr-warning-deep);
    background: var(--fr-warning-tint);
    padding: 2px 6px;
    border-radius: 4px;
    margin-left: 6px;
}

/* Error / warning context-line states */
.fr-rm-error { color: var(--fr-negative-deep); font-family: var(--fr-font-mono); font-size: 11px; }
.fr-rm-warn  { color: var(--fr-warning-deep); font-family: var(--fr-font-mono); font-size: 11px; }

/* Empty / loading note */
.fr-rate-mgr-empty {
    font-family: var(--fr-font-serif);
    font-style: italic;
    font-size: 15px;
    color: var(--fr-ink-3);
    padding: 14px 4px;
}

/* ─────────────────────────────────────────────────────────────────────
   Eviction Watch panel (app/layouts/eviction_watch.py)
   Read-only delinquency → eviction risk forecast. Scoped under .fr-evw-page.
   ───────────────────────────────────────────────────────────────────── */
.fr-evw-page { max-width: 1280px; }

/* Portfolio summary tiles */
.fr-evw-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 4px 0 18px;
}
.fr-evw-stat {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-md);
    padding: 16px 18px;
}
.fr-evw-stat-value {
    font-family: var(--fr-font-serif);
    font-size: 30px;
    line-height: 1.1;
    color: var(--fr-ink);
}
.fr-evw-stat-value--accent { color: var(--fr-accent); }
.fr-evw-stat-label {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--fr-ink-3);
    margin-top: 6px;
}

/* Portfolio horizon row */
.fr-evw-horizon-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-md);
    padding: 12px 16px;
    margin-bottom: 20px;
}
.fr-evw-horizon-title {
    font-family: var(--fr-font-sans);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--fr-ink-3);
    margin-right: 8px;
}
.fr-evw-hz-cell {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding: 2px 12px;
    border-left: 1px solid var(--fr-hairline);
}
.fr-evw-hz-num { font-family: var(--fr-font-serif); font-size: 20px; color: var(--fr-ink); }
.fr-evw-hz-label { font-size: 12px; color: var(--fr-ink-2); }

/* Risk chips */
.fr-evw-chip {
    font-family: var(--fr-font-sans);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
}
.fr-evw-chip--critical { color: #fff;                 background: var(--fr-negative); }
.fr-evw-chip--high     { color: var(--fr-negative-deep); background: var(--fr-negative-tint); }
.fr-evw-chip--elevated { color: var(--fr-warning-deep);  background: var(--fr-warning-tint); }
.fr-evw-chip--watch    { color: var(--fr-ink-2);         background: var(--fr-hairline); }
.fr-evw-chip--low      { color: var(--fr-ink-3);         background: var(--fr-hairline); }

/* Per-property collapsible sections */
.fr-evw-props { display: flex; flex-direction: column; gap: 10px; }
.fr-evw-prop {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-md);
    overflow: hidden;
}
.fr-evw-prop > summary {
    cursor: pointer;
    list-style: none;
    padding: 14px 18px;
}
.fr-evw-prop > summary::-webkit-details-marker { display: none; }
.fr-evw-prop[open] > summary { border-bottom: 1px solid var(--fr-hairline); }
.fr-evw-prop-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.fr-evw-prop-id { display: flex; align-items: baseline; gap: 10px; }
.fr-evw-prop-name { font-family: var(--fr-font-serif); font-size: 19px; color: var(--fr-ink); }
.fr-evw-prop-state {
    font-family: var(--fr-font-mono);
    font-size: 11px;
    color: var(--fr-ink-3);
    border: 1px solid var(--fr-hairline-strong);
    border-radius: 4px;
    padding: 1px 5px;
}
.fr-evw-prop-metrics { display: flex; gap: 18px; flex-wrap: wrap; }
.fr-evw-prop-metric { font-size: 13px; color: var(--fr-ink-2); }
.fr-evw-prop-metric strong { color: var(--fr-ink); font-weight: 600; }
.fr-evw-prop-metric--accent strong { color: var(--fr-accent); }
.fr-evw-horizon-strip { display: flex; gap: 12px; flex-wrap: wrap; }
.fr-evw-horizon-bit { font-size: 12px; color: var(--fr-ink-3); }
.fr-evw-horizon-bit strong { color: var(--fr-ink-2); }

/* Flagged-lease table */
.fr-evw-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fr-evw-table thead th {
    font-family: var(--fr-font-sans);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fr-ink-3);
    text-align: left;
    padding: 10px 14px;
    border-bottom: 1px solid var(--fr-hairline);
}
.fr-evw-table tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--fr-hairline);
    color: var(--fr-ink-2);
    vertical-align: top;
}
.fr-evw-table tbody tr:last-child td { border-bottom: none; }
.fr-evw-table tbody tr:nth-child(even) { background: var(--fr-bg); }
.fr-evw-td-unit { font-family: var(--fr-font-mono); color: var(--fr-ink); white-space: nowrap; }
.fr-evw-td-num { font-family: var(--fr-font-mono); white-space: nowrap; }
.fr-evw-td-why { color: var(--fr-ink-3); font-size: 12px; max-width: 320px; }

/* Excluded benign-tail footnote — reconciles the visible list with the full
   delinquency count without alarming the reader. */
.fr-evw-minor-note {
    margin: 8px 0 2px;
    padding: 8px 14px 0;
    font-family: var(--fr-font-sans);
    font-size: 12px;
    color: var(--fr-ink-3);
    border-top: 1px dashed var(--fr-hairline);
}
.fr-evw-nl-minor { color: var(--fr-ink-3); }

/* Note + empty/error states */
.fr-evw-note {
    margin-top: 18px;
    font-family: var(--fr-font-sans);
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--fr-ink-3);
}
/* Workman page — keep the lede legible sans, not the editorial italic serif. */
.fr-evw-page .fr-page-lede {
    font-family: var(--fr-font-sans);
    font-style: normal;
    font-size: 15px;
    color: var(--fr-ink-2);
}
/* Unit Type column */
.fr-evw-td-utype {
    font-family: var(--fr-font-mono);
    font-size: 12px;
    color: var(--fr-ink);
    white-space: nowrap;
}
.fr-evw-empty {
    background: var(--fr-surface);
    border: 1px solid var(--fr-hairline);
    border-radius: var(--fr-r-md);
    padding: 40px 28px;
    text-align: center;
}
.fr-evw-empty-title { font-family: var(--fr-font-serif); font-size: 20px; color: var(--fr-ink); margin-bottom: 6px; }
.fr-evw-empty-sub { font-size: 14px; color: var(--fr-ink-3); }

@media (max-width: 900px) {
    .fr-evw-stats { grid-template-columns: repeat(2, 1fr); }
}

/* Eviction Watch — New Leases surfacing (subtle property-scoped strip) */
.fr-evw-nl {
    margin: 0 0 18px;
    background: var(--fr-warning-tint);
    border: 1px solid var(--fr-hairline);
    border-left: 3px solid var(--fr-warning);
    border-radius: var(--fr-r-md);
    overflow: hidden;
}
.fr-evw-nl > summary {
    cursor: pointer;
    list-style: none;
    padding: 11px 16px;
}
.fr-evw-nl > summary::-webkit-details-marker { display: none; }
.fr-evw-nl-headline {
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 13px;
    color: var(--fr-ink-2);
}
.fr-evw-nl-mark { color: var(--fr-warning); font-size: 14px; }
.fr-evw-nl-title {
    font-family: var(--fr-font-sans);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--fr-warning-deep);
}
.fr-evw-nl-dash { color: var(--fr-ink-3); }
.fr-evw-nl-stat strong { color: var(--fr-ink); font-weight: 600; }
.fr-evw-nl-stat--accent strong { color: var(--fr-accent); }
.fr-evw-nl-chev { margin-left: auto; color: var(--fr-ink-3); transition: transform 0.15s ease; }
.fr-evw-nl[open] .fr-evw-nl-chev { transform: rotate(90deg); }
.fr-evw-nl-body {
    padding: 4px 8px 10px;
    background: var(--fr-surface);
    border-top: 1px solid var(--fr-hairline);
}
.fr-evw-nl-note {
    margin: 8px 8px 2px;
    font-family: var(--fr-font-sans);
    font-size: 12px;
    line-height: 1.5;
    color: var(--fr-ink-3);
}