/* The report document. Its styles apply to any element with class "rp-scope": the hidden #report that gets printed,
   and the blurred preview a free visitor sees when they click Report. */
.rp-scope {
  --ink: #14130f; --ink-2: #4b4a46; --muted: #8a8883; --line: #e3e1da; --soft: #f6f5f1; --brand: #b5482f;
  --good: #0b8a0b; --bad: #c43434; --blue: #2a78d6; --orange: #eb6834;
  font-family: "Instrument Sans", system-ui, sans-serif; font-size: 9.5pt; line-height: 1.45; color: var(--ink);
}
.rp-scope h1, .rp-scope h2 { font-family: "Fraunces", Georgia, serif; font-weight: 600; letter-spacing: -0.01em; margin: 0; }
.rp-scope h3 { margin: 18px 0 8px; font-size: 7.5pt; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-family: "Instrument Sans", sans-serif; }
.rp-scope p { margin: 0; }
.rp-page { break-after: page; }
.rp-page:last-child, .rp-page.rp-cont { break-after: auto; }   /* rp-cont: the next section follows straight on */
.rp-cont + .rp-page .rp-head { margin-top: 26px; }
.rp-page table:not(.rp-sched), .rp-tile, .rp-insight, .rp-verdict, .rp-chart { break-inside: avoid; }
/* the year-by-year table may run over several pages: rows stay whole, and the column headings repeat on every page */
table.rp-sched { break-inside: auto; }
table.rp-sched tr { break-inside: avoid; }
table.rp-sched thead { display: table-header-group; }
.rp-head, .rp-scope h3 { break-after: avoid; }

/* page heading */
.rp-head { padding-bottom: 8px; border-bottom: 2px solid var(--brand); margin-bottom: 10px; }
.rp-kicker { font-size: 7.5pt; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--brand); }
.rp-head h2 { font-size: 24pt; line-height: 1.1; }
.rp-lede { color: var(--ink-2); max-width: 70ch; margin: 2px 0 4px; }

/* cover */
.rp-brand { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; border-bottom: 2px solid var(--brand); margin-bottom: 26px; }
.rp-brand .logo svg { width: 26px; height: 26px; display: block; }
.rp-brand .name { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 17pt; }
.rp-brand .doc { margin-left: auto; text-align: right; font-size: 8.5pt; color: var(--ink-2); line-height: 1.35; }
.rp-brand .doc em { font-style: normal; color: var(--muted); }
.rp-first h1 { font-size: 30pt; line-height: 1.08; }
.rp-sub { color: var(--ink-2); font-size: 11pt; margin-top: 4px; }
.rp-verdict { margin: 22px 0 10px; padding: 16px 20px; border-radius: 10px; border: 1px solid var(--line); border-left: 5px solid var(--blue); background: var(--soft); }
.rp-verdict.mkt { border-left-color: var(--orange); }
.rp-verdict .q { font-size: 8pt; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.rp-verdict .a { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 25pt; line-height: 1.15; margin: 3px 0 6px; color: var(--blue); }
.rp-verdict.mkt .a { color: var(--orange); }
.rp-verdict .d { color: var(--ink-2); max-width: 75ch; }
.rp-verdict .d b { color: var(--ink); }
.rp-note { font-size: 8.5pt; color: var(--ink-2); margin: 2px 0 12px; font-style: italic; }
.rp-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 14px 0 6px; }
.rp-tile { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.rp-tile .l { font-size: 7.5pt; color: var(--ink-2); }
.rp-tile .v { font-family: "IBM Plex Mono", ui-monospace, monospace; font-weight: 600; font-size: 14pt; margin: 2px 0; }
.rp-tile .v.pos { color: var(--good); } .rp-tile .v.neg { color: var(--bad); }
.rp-tile .s { font-size: 7pt; color: var(--muted); }
.rp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 26px; }
table.rp-kv { width: 100%; border-collapse: collapse; }
table.rp-kv th, table.rp-kv td { padding: 5px 0; border-bottom: 1px solid var(--line); text-align: left; font-weight: 400; }
table.rp-kv th { color: var(--ink-2); }
table.rp-kv td { text-align: right; font-family: "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; }
table.rp-kv tr.total th, table.rp-kv tr.total td { font-weight: 700; border-bottom: none; padding-top: 7px; color: var(--ink); }
table.rp-kv tr.total.pos td { color: var(--good); } table.rp-kv tr.total.neg td { color: var(--bad); }

/* statements */
table.rp-stmt { width: 100%; border-collapse: collapse; }
table.rp-stmt th, table.rp-stmt td { padding: 5px 6px; border-bottom: 1px solid var(--line); text-align: left; font-weight: 400; vertical-align: top; }
table.rp-stmt thead th { font-size: 7pt; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; border-bottom: 1px solid #c9c7be; }
table.rp-stmt .n { text-align: right; white-space: nowrap; font-family: "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; }
table.rp-stmt tbody th span { display: block; font-size: 7.5pt; color: var(--muted); }
table.rp-stmt tr.sec th { padding-top: 11px; font-size: 7pt; letter-spacing: .14em; text-transform: uppercase; color: var(--brand); font-weight: 600; }
table.rp-stmt tr.sub th, table.rp-stmt tr.sub td { font-weight: 700; }
table.rp-stmt tr.total th, table.rp-stmt tr.total td { font-weight: 700; font-size: 11pt; background: var(--soft); border-bottom: none; }
table.rp-stmt tr.total.pos td { color: var(--good); } table.rp-stmt tr.total.neg td { color: var(--bad); }
table.rp-stmt tr.info th, table.rp-stmt tr.info td { color: var(--ink-2); }
table.rp-stmt td.pos { color: var(--good); font-weight: 600; } table.rp-stmt td.neg { color: var(--bad); font-weight: 600; }
table.compact th, table.compact td { padding: 4px 6px; }

/* where the rent goes */
.rp-bar { display: flex; height: 16px; border-radius: 4px; overflow: hidden; margin-top: 2px; }
.rp-bar span { display: block; height: 100%; }
.rp-legend { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 7px; font-size: 8pt; color: var(--ink-2); }
.rp-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.rp-legend b { color: var(--ink); font-weight: 600; }

/* investment */
.rp-chart { margin-top: 8px; }
.rp-chart svg.chart { width: 100%; height: auto; display: block; }
.rp-chart svg.chart text { font-size: 10.5px; }
.rp-insights { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.rp-insight { border: 1px solid var(--line); border-left: 3px solid #c9c7be; border-radius: 6px; padding: 8px 11px; }
.rp-insight.property { border-left-color: var(--blue); } .rp-insight.market { border-left-color: var(--orange); }
.rp-insight .tag { font-size: 6.5pt; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.rp-insight h4 { font-family: "Fraunces", Georgia, serif; font-size: 10.5pt; margin: 2px 0 4px; font-weight: 600; }
.rp-insight .body { font-size: 8pt; line-height: 1.5; color: var(--ink-2); }
.rp-insight .body strong { color: var(--ink); font-weight: 600; }

/* appendix */
table.rp-sched { width: 100%; border-collapse: collapse; font-size: 6.6pt; }
table.rp-sched th, table.rp-sched td { padding: 3px 4px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; font-weight: 400; }
table.rp-sched th:first-child { text-align: left; font-weight: 600; }
table.rp-sched thead th { white-space: normal; vertical-align: bottom; font-size: 6pt; color: var(--muted); font-weight: 600; border-bottom: 1px solid #c9c7be; }
table.rp-sched td { font-family: "IBM Plex Mono", ui-monospace, monospace; }
.rp-inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
.rp-inputs h4 { margin: 0 0 4px; font-size: 7pt; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-family: "Instrument Sans", sans-serif; }
.rp-inputs dl { margin: 0; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; font-size: 8pt; }
.rp-inputs dt { color: var(--ink-2); } .rp-inputs dd { margin: 0; text-align: right; font-weight: 600; }
.rp-scope ul { margin: 0; padding-left: 1.1em; display: grid; gap: 5px; font-size: 8.5pt; color: var(--ink-2); }
.rp-scope ul b { color: var(--ink); }
.rp-disclaimer { margin-top: 10px; font-size: 8pt; color: var(--muted); max-width: 80ch; }

/* Printing: hide the whole app and print only the report (Report button -> Save as PDF). */
.rp-scope.print-only { display: none; }
@media print {
  @page {
    margin: 16mm 15mm 18mm;
    @bottom-left  { content: "Brixyield \00B7  Rental investment report"; font: 8pt "Instrument Sans", sans-serif; color: #8a8883; }
    @bottom-right { content: "Page " counter(page) " of " counter(pages); font: 8pt "Instrument Sans", sans-serif; color: #8a8883; }
  }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html, body { background: #fff !important; }
  .app > :not(#report) { display: none !important; }
  .app { background: #fff; min-height: 0; }
  #report { display: block !important; }
}

/* advanced-analysis pages */
.rp-scope table.rp-sens td.n span.sub { display: block; font-size: 7.5pt; color: var(--muted); font-family: "Instrument Sans", sans-serif; }
.rp-scope table.rp-sens td.swing { width: 28%; white-space: nowrap; }
.rp-scope table.rp-sens td.swing b { margin-left: 8px; font-family: "IBM Plex Mono", ui-monospace, monospace; font-weight: 600; font-size: 8pt; }
.rp-swing { display: inline-block; width: 90px; height: 8px; background: var(--soft); border-radius: 4px; vertical-align: middle; overflow: hidden; }
.rp-swing i { display: block; height: 100%; background: var(--blue); border-radius: 4px; }
.rp-scope ul.rp-points { margin: 10px 0 0; }
.rp-scope .rp-note { margin-top: 8px; }
.rp-scope table.rp-stmt td.n > span { display: block; font-size: 7.5pt; color: var(--muted); font-family: "Instrument Sans", sans-serif; }

/* the sample report: a diagonal SAMPLE mark on every page */
.rp-scope.rp-sample::after { content: "SAMPLE"; position: fixed; left: 0; right: 0; top: 38%; text-align: center; font-family: "Fraunces", Georgia, serif; font-weight: 600;
  font-size: 120pt; letter-spacing: .08em; color: rgba(181, 72, 47, .09); transform: rotate(-28deg); pointer-events: none; z-index: 5; }
