/* ═══════════════════════════════════════════════════════
   Open House Packet — Niko Hansen · eXp Realty, LLC
   Screen UI + print-first packet styles.

   Design rule for every page in here: ONE idea, one hero
   number, generous white space. If a page needs a second
   read to understand what it is, it goes in the trash.
   ═══════════════════════════════════════════════════════ */

:root {
  /* ── eXp Realty 2026 brand palette ──────────────────────────────────────
     Approved: BLACK #000000 · WHITE #FFFFFF · LIGHT GREY #EEEEEE ·
     MOSS GREY #686672 · FROSTED BLUE #91A3C9.
     Deliberately unused: DARK NAVY #0C0F24, SLATE BLUE #506CAA,
     CHARCOAL BLUE #31303F — Niko's call, Sep 2026. Do not reintroduce them.

     FROSTED BLUE IS NOT A TEXT COLOUR (2.5:1 on white, fails AA at every
     size). It is fills, rules and borders only, and carries BLACK text when
     it is a background. Moss grey on white is 5.6:1 and does the small-label
     work the old gold accent used to do. Do not lighten moss grey with
     opacity for small type — at 82% it drops to 3.8:1 and fails.
     Full note in featuresheet-style.css.
     ──────────────────────────────────────────────────────────────────── */
  --exp-black:        #000000;
  --exp-white:        #FFFFFF;
  --exp-light-grey:   #EEEEEE;
  --exp-moss-grey:    #686672;
  --exp-frosted-blue: #91A3C9;

  --white:        var(--exp-white);
  --off-white:    var(--exp-light-grey);
  --cream:        rgba(145, 163, 201, .16);
  --accent:       var(--exp-frosted-blue);
  --accent-ink:   var(--exp-moss-grey);
  /* Alias, so any fill or border still written as var(--gold) lands on the
     brand accent. Every TEXT use was migrated to --accent-ink or --dark. */
  --gold:         var(--accent);
  --gold-lt:      rgba(145, 163, 201, .22);
  --border:       rgba(104, 102, 114, .26);
  --border-light: rgba(104, 102, 114, .14);
  --dark:         var(--exp-black);
  --mid:          var(--exp-moss-grey);
  --muted:        var(--exp-moss-grey);
  /* No brand green exists, so the confirm/positive states fall back to black
     with a frosted-blue wash behind them. */
  --green:        var(--exp-black);
  --green-bg:     rgba(145, 163, 201, .16);
  /* Screen-only. The brand palette has no alert colour and a warning has to
     read as one; this never reaches a printed sheet. */
  --red:          #B3261E;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  background: var(--off-white);
  color: var(--dark);
  -webkit-font-smoothing: antialiased;
}

/* ═══════════════════════════════════════════════════════
   SCREEN — Upload
   ═══════════════════════════════════════════════════════ */
.upload-screen {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  min-height: 100vh; padding: 48px 20px; gap: 32px;
}
.upload-header { text-align: center; }
.upload-logo { height: 52px; width: auto; object-fit: contain; margin-bottom: 12px; }
.upload-agent-name {
  font-family: var(--font-display);
  font-size: 28px; font-weight: 500; letter-spacing: .4px;
}
.upload-brokerage {
  font-size: 12px; color: var(--muted);
  letter-spacing: .8px; text-transform: uppercase; margin-top: 4px;
}
.upload-card {
  background: var(--white); border: 1px solid var(--border);
  border-radius: 10px; padding: 32px; width: 100%; max-width: 560px;
}
.upload-zone {
  border: 2px dashed var(--border); border-radius: 8px;
  padding: 44px 24px; text-align: center; cursor: pointer;
  transition: border-color .18s, background .18s;
}
.upload-zone:hover, .upload-zone.dragover {
  border-color: var(--gold); background: var(--cream);
}
.upload-arrow { font-size: 30px; color: var(--accent-ink); line-height: 1; }
.upload-title {
  font-family: var(--font-display);
  font-size: 22px; font-weight: 500; margin-top: 10px;
}
.upload-sub { font-size: 13px; color: var(--muted); margin-top: 5px; }
.upload-status { margin-top: 14px; font-size: 13px; text-align: center; color: var(--muted); }
.upload-status.error { color: var(--red); }
.upload-skip { margin-top: 18px; text-align: center; font-size: 13px; }
.upload-skip button {
  background: none; border: none; color: var(--accent-ink);
  font-family: var(--font-body); font-size: 13px;
  text-decoration: underline; cursor: pointer; padding: 0;
}
.upload-back { font-size: 13px; color: var(--muted); text-decoration: none; }
.upload-back:hover { color: var(--dark); }

/* ═══════════════════════════════════════════════════════
   SCREEN — Setup panel
   ═══════════════════════════════════════════════════════ */
.setup-screen { max-width: 940px; margin: 0 auto; padding: 32px 20px 96px; }
.setup-head {
  display: flex; justify-content: space-between;
  align-items: flex-end; flex-wrap: wrap; gap: 14px;
  padding-bottom: 18px; margin-bottom: 26px;
  border-bottom: 1px solid var(--border);
}
.setup-title { font-family: var(--font-display); font-size: 30px; font-weight: 500; }
.setup-sub { font-size: 13px; color: var(--muted); margin-top: 3px; }

.setup-block { margin-bottom: 30px; }
.setup-block-title {
  font-size: 11px; letter-spacing: 1.3px; text-transform: uppercase;
  color: var(--accent-ink); font-weight: 600; margin-bottom: 12px;
}
.field-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px;
}
.field label {
  display: block; font-size: 11px; letter-spacing: .5px;
  text-transform: uppercase; color: var(--muted); margin-bottom: 5px;
}
.field input, .field select {
  width: 100%; padding: 10px 12px; font-family: var(--font-body);
  font-size: 14px; color: var(--dark); background: var(--white);
  border: 1px solid var(--border); border-radius: 6px;
}
.field input:focus, .field select:focus { outline: none; border-color: var(--gold); }
.field-hint { font-size: 11px; color: var(--muted); margin-top: 4px; }

/* Module toggles */
.mod-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 10px; }
.mod {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 13px 14px; background: var(--white);
  border: 1px solid var(--border); border-radius: 7px; cursor: pointer;
}
.mod:hover { border-color: var(--gold); }
.mod input { margin-top: 2px; accent-color: var(--exp-black); flex-shrink: 0; }
.mod-name { font-size: 13.5px; font-weight: 500; }
.mod-why { font-size: 11.5px; color: var(--muted); margin-top: 2px; line-height: 1.4; }
.mod-auto {
  display: inline-block; font-size: 9.5px; letter-spacing: .6px;
  text-transform: uppercase; color: var(--green);
  background: var(--green-bg); border: 1px solid #7abf9a;
  border-radius: 3px; padding: 1px 5px; margin-left: 6px; vertical-align: 1px;
}

/* Sold comps editor */
.comps-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.comps-table th {
  text-align: left; font-size: 10px; letter-spacing: .7px;
  text-transform: uppercase; color: var(--muted);
  font-weight: 600; padding: 0 6px 7px;
}
.comps-table td { padding: 3px; }
.comps-table input {
  width: 100%; padding: 7px 8px; font-family: var(--font-body);
  font-size: 13px; border: 1px solid var(--border-light);
  border-radius: 5px; background: var(--white);
}
.comps-table input:focus { outline: none; border-color: var(--gold); }
.comp-del {
  background: none; border: none; color: var(--muted);
  font-size: 17px; cursor: pointer; padding: 0 4px; line-height: 1;
}
.comp-del:hover { color: var(--red); }
.btn-add-comp {
  margin-top: 9px; background: none; border: 1px dashed var(--border);
  border-radius: 6px; padding: 8px 14px; font-family: var(--font-body);
  font-size: 12.5px; color: var(--muted); cursor: pointer;
}
.btn-add-comp:hover { border-color: var(--gold); color: var(--dark); }

/* Action bar */
.action-bar {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--white); border-top: 1px solid var(--border);
  padding: 13px 20px; display: flex; gap: 11px;
  justify-content: center; flex-wrap: wrap; z-index: 40;
}
.btn-primary, .btn-secondary {
  padding: 11px 22px; font-family: var(--font-body); font-size: 13.5px;
  font-weight: 500; border-radius: 6px; cursor: pointer; border: 1px solid;
}
.btn-primary { background: var(--exp-black); color: var(--white); border-color: var(--exp-black); }
.btn-primary:hover { background: var(--exp-moss-grey); }
.btn-secondary { background: var(--white); color: var(--mid); border-color: var(--border); }
.btn-secondary:hover { border-color: var(--gold); color: var(--dark); }

/* ═══════════════════════════════════════════════════════
   PACKET — shared page frame
   One .oh-page == one physical sheet of paper.
   ═══════════════════════════════════════════════════════ */
.packet-screen { padding: 26px 20px 96px; background: var(--off-white); }

.oh-page {
  width: 8.5in; min-height: 11in;
  margin: 0 auto 26px; padding: 0.5in 0.6in;
  background: var(--white);
  border: 1px solid var(--border);
  display: flex; flex-direction: column;
}

/* Page header — thin, identical on every sheet */
.oh-head {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 16px; padding-bottom: 9px; margin-bottom: 26px;
  border-bottom: 1px solid var(--border);
}
.oh-head-name {
  font-family: var(--font-display); font-size: 19px;
  font-weight: 600; letter-spacing: .3px;
}
/* NMAC 16.61.32.8 — brokerage trade name + registered office phone, at no less
   than 33% of the associate broker's name type size. Name is 19px, so the floor
   is 6.27px. 11px here is ~58% — deliberate margin, do not shrink below 8px. */
.oh-head-brok { font-size: 11px; color: var(--mid); letter-spacing: .2px; }

.oh-body { flex: 1; }

.oh-foot {
  margin-top: auto; padding-top: 11px;
  border-top: 1px solid var(--border-light);
  display: flex; justify-content: space-between;
  align-items: baseline; gap: 14px;
}
.oh-foot-contact { font-size: 11px; color: var(--mid); white-space: nowrap; }
.oh-foot-contact strong { font-weight: 600; }
.oh-foot-legal {
  font-size: 8.5px; color: var(--muted);
  text-align: right; line-height: 1.5; max-width: 62%;
}

/* Page title block */
.oh-kicker {
  font-size: 10.5px; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--accent-ink); font-weight: 600; margin-bottom: 7px;
}
.oh-title {
  font-family: var(--font-display);
  font-size: 34px; font-weight: 500; line-height: 1.15;
}
.oh-lede {
  font-size: 13.5px; color: var(--mid); line-height: 1.6;
  margin-top: 11px; max-width: 6.2in;
}

/* Rate / date stamp — makes the sheet credible AND makes it expire,
   which is the reason they call in March instead of guessing again. */
.oh-stamp {
  display: flex; gap: 26px; flex-wrap: wrap;
  background: var(--cream); border-left: 3px solid var(--gold);
  padding: 11px 15px; margin: 22px 0 26px;
}
.oh-stamp-item { font-size: 11.5px; color: var(--mid); }
.oh-stamp-item strong {
  display: block; font-size: 9.5px; letter-spacing: .8px;
  text-transform: uppercase; color: var(--muted);
  font-weight: 600; margin-bottom: 2px;
}

/* ── Payment sheet columns ───────────────────────────── */
.pay-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 10px; margin-top: 4px;
}
.pay-col {
  border: 1px solid var(--border); border-radius: 7px;
  overflow: hidden; display: flex; flex-direction: column;
}
.pay-col.feature { border-color: var(--gold); border-width: 1.5px; }
.pay-col-head {
  background: var(--cream); padding: 10px 8px; text-align: center;
  border-bottom: 1px solid var(--border);
}
.pay-col.feature .pay-col-head { background: var(--gold-lt); }
.pay-pct { font-family: var(--font-display); font-size: 25px; font-weight: 600; line-height: 1; }
.pay-prog {
  font-size: 9.5px; letter-spacing: .8px; text-transform: uppercase;
  color: var(--muted); font-weight: 600; margin-top: 3px;
}
.pay-down {
  padding: 9px 8px; text-align: center;
  border-bottom: 1px solid var(--border-light);
}
.pay-down-val { font-size: 14px; font-weight: 600; }
.pay-down-lbl {
  font-size: 9px; letter-spacing: .6px; text-transform: uppercase;
  color: var(--muted); margin-top: 1px;
}
/* The hero number. This is the whole reason the sheet gets kept. */
.pay-mo { padding: 15px 8px 13px; text-align: center; }
.pay-mo-val {
  font-family: var(--font-display); font-size: 33px;
  font-weight: 600; line-height: 1; letter-spacing: -.5px;
}
.pay-mo-lbl {
  font-size: 9.5px; letter-spacing: .7px; text-transform: uppercase;
  color: var(--muted); margin-top: 4px;
}
.pay-break {
  border-top: 1px solid var(--border-light);
  padding: 9px 10px; background: var(--off-white); margin-top: auto;
}
.pay-break-row {
  display: flex; justify-content: space-between;
  font-size: 10.5px; color: var(--mid); padding: 2.5px 0;
}
.pay-break-row.total {
  border-top: 1px solid var(--border);
  margin-top: 4px; padding-top: 5px; font-weight: 600; color: var(--dark);
}
.pay-note {
  margin-top: 20px; font-size: 11px; color: var(--muted);
  line-height: 1.6; padding-left: 13px; border-left: 2px solid var(--border);
}

/* ── Program cards (down payment help) ───────────────── */
.prog-stack { display: flex; flex-direction: column; gap: 13px; margin-top: 6px; }
.prog-card {
  border: 1px solid var(--border); border-radius: 8px;
  padding: 17px 19px; display: flex; gap: 20px; align-items: center;
}
.prog-amt {
  font-family: var(--font-display); font-size: 31px; font-weight: 600;
  color: var(--accent-ink); line-height: 1; flex-shrink: 0;
  min-width: 1.5in; text-align: center;
}
.prog-amt small {
  display: block; font-family: var(--font-body); font-size: 9.5px;
  letter-spacing: .7px; text-transform: uppercase;
  color: var(--muted); font-weight: 600; margin-top: 5px;
}
.prog-name { font-size: 15px; font-weight: 600; }
.prog-desc { font-size: 12px; color: var(--mid); line-height: 1.55; margin-top: 4px; }

/* ── Comps table ─────────────────────────────────────── */
.sold-table { width: 100%; border-collapse: collapse; margin-top: 6px; }
.sold-table th {
  text-align: left; font-size: 9.5px; letter-spacing: .8px;
  text-transform: uppercase; color: var(--muted); font-weight: 600;
  padding: 0 9px 8px; border-bottom: 1px solid var(--border);
}
.sold-table th.num, .sold-table td.num { text-align: right; }
.sold-table td {
  padding: 10px 9px; font-size: 12.5px;
  border-bottom: 1px solid var(--border-light);
}
.sold-table td.addr { font-weight: 500; }
.sold-median {
  display: flex; gap: 40px; margin-top: 22px;
  padding: 15px 19px; background: var(--cream); border-radius: 7px;
}
.sold-median-item strong {
  display: block; font-size: 9.5px; letter-spacing: .8px;
  text-transform: uppercase; color: var(--muted);
  font-weight: 600; margin-bottom: 3px;
}
.sold-median-val { font-family: var(--font-display); font-size: 24px; font-weight: 600; }

/* The neighbor hook — the listing-lead capture */
.hook {
  margin-top: 24px; border: 1.5px solid var(--gold);
  border-radius: 8px; padding: 18px 21px;
  display: flex; align-items: center; gap: 20px;
}
.hook-text { flex: 1; }
.hook-title { font-family: var(--font-display); font-size: 20px; font-weight: 600; }
.hook-body { font-size: 12px; color: var(--mid); line-height: 1.55; margin-top: 5px; }
.hook-qr {
  width: 0.95in; height: 0.95in; flex-shrink: 0;
  border: 1px solid var(--border); border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  font-size: 8px; color: var(--muted); text-align: center;
  padding: 5px; background: var(--off-white);
}
.hook-qr img { width: 100%; height: 100%; object-fit: contain; }

/* ── Half-sheet cards (ABQ modules, 2-up per page) ─────
   Keeps a 4-module house at 2 sheets instead of 4. The packet
   staying thin is what keeps it out of the trash. */
.half-wrap { display: flex; flex-direction: column; flex: 1; }
.half { flex: 1; padding: 4px 0 24px; display: flex; flex-direction: column; }
.half + .half { border-top: 1px dashed var(--border); padding-top: 26px; }
.half-kicker {
  font-size: 10px; letter-spacing: 1.3px; text-transform: uppercase;
  color: var(--accent-ink); font-weight: 600;
}
.half-title {
  font-family: var(--font-display); font-size: 25px;
  font-weight: 500; line-height: 1.2; margin-top: 5px;
}
.half-body { font-size: 12.5px; color: var(--mid); line-height: 1.65; margin-top: 9px; max-width: 6.4in; }
.half-body p + p { margin-top: 8px; }
.half-body strong { color: var(--dark); font-weight: 600; }

/* One number per card, big enough to read from across a kitchen */
.half-figs { display: flex; gap: 34px; margin-top: 14px; flex-wrap: wrap; }
.half-fig strong {
  display: block; font-size: 9.5px; letter-spacing: .8px;
  text-transform: uppercase; color: var(--muted);
  font-weight: 600; margin-bottom: 3px;
}
.half-fig-val {
  font-family: var(--font-display); font-size: 23px; font-weight: 600; line-height: 1;
}
.half-fig-val.tbd {
  color: var(--red); font-family: var(--font-body);
  font-size: 13px; font-weight: 500;
}

/* ── Cost-to-fix list ────────────────────────────────── */
.cost-list { margin-top: 10px; }
.cost-row {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--border-light);
}
.cost-item { font-size: 13px; font-weight: 500; }
.cost-note { font-size: 11px; color: var(--muted); margin-top: 1px; }
.cost-val { font-size: 14px; font-weight: 600; white-space: nowrap; }
.cost-val.tbd { color: var(--red); font-size: 12px; font-weight: 500; }

/* ── Seller prep tiers (neighbor packet) ─────────────────
   Numbers-forward. The tier head carries the judgment so the rows
   themselves can stay pure data. */
.tier { margin-top: 16px; }
.tier:first-of-type { margin-top: 6px; }
.tier-head {
  display: flex; align-items: baseline; gap: 11px; flex-wrap: wrap;
  padding: 7px 12px; border-radius: 5px 5px 0 0;
  border-left: 3px solid var(--muted);
}
.tier-head.good { background: var(--green-bg); border-left-color: var(--green); }
.tier-head.mid  { background: var(--cream);    border-left-color: var(--gold); }
.tier-head.low  { background: var(--off-white); border-left-color: var(--muted); }
.tier-title { font-size: 13px; font-weight: 600; }
.tier-sub { font-size: 11px; color: var(--muted); }

.prep-table { width: 100%; border-collapse: collapse; }
.prep-table th {
  text-align: left; font-size: 9px; letter-spacing: .7px;
  text-transform: uppercase; color: var(--muted); font-weight: 600;
  padding: 7px 10px 5px; border-bottom: 1px solid var(--border-light);
}
.prep-table th.num, .prep-table td.num { text-align: right; }
.prep-table td {
  padding: 7px 10px; font-size: 12px; vertical-align: top;
  border-bottom: 1px solid var(--border-light);
}
.prep-table td.num { font-weight: 600; white-space: nowrap; font-size: 12.5px; }
.prep-table td.num.tbd { color: var(--red); font-weight: 500; font-size: 11px; }
.prep-item { font-weight: 500; }
.prep-note { font-size: 10.5px; color: var(--muted); margin-top: 1px; }

/* ── Vendor list — three per trade ───────────────────── */
.vend-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.vend { border: 1px solid var(--border-light); border-radius: 6px; padding: 10px 12px; }
.vend-role {
  font-size: 9.5px; letter-spacing: .8px; text-transform: uppercase;
  color: var(--accent-ink); font-weight: 600; margin-bottom: 5px;
}
.vend-pick {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 8px; padding: 3.5px 0;
}
.vend-pick + .vend-pick { border-top: 1px solid var(--border-light); }
.vend-pick-name { font-size: 12.5px; font-weight: 500; }
.vend-pick-meta { font-size: 10.5px; color: var(--muted); text-align: right; }
.vend-tbd { font-size: 11.5px; color: var(--red); }

/* The line that keeps the list from reading as a steer. */
.vend-agents {
  margin-top: 14px; padding: 11px 14px;
  border: 1px solid var(--border); border-radius: 6px;
  font-size: 12px; color: var(--mid); line-height: 1.6;
}
.vend-agents strong { color: var(--dark); font-weight: 600; }

/* ── Fridge card — the contact block on the vendor sheet ─
   Name + number alone is not recall six months later. A face is. */
.fridge {
  margin-top: 15px; padding: 13px 16px;
  background: var(--cream); border-radius: 7px;
  display: flex; align-items: center; gap: 15px;
}
.fridge-photo {
  width: 0.72in; height: 0.72in; flex-shrink: 0;
  border-radius: 50%; object-fit: cover;
  border: 1.5px solid var(--white);
}
.fridge-text { flex: 1; }
.fridge-name { font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.1; }
/* NMAC 33% floor against the 20px name above is 6.6px — 10.5px is ~53%. */
.fridge-role { font-size: 10.5px; color: var(--mid); margin-top: 2px; }
.fridge-contact { font-size: 11px; font-weight: 700; color: var(--ink, #1a1a1a); margin-top: 4px; }
.fridge-brok { font-size: 11px; font-weight: 400; color: var(--mid); margin-top: 2px; }
.fridge .hook-qr { width: 0.72in; height: 0.72in; background: var(--white); }

/* ── Steps (sequencing / due-diligence timelines) ────── */
.steps { margin-top: 12px; }
.step {
  display: flex; gap: 13px; padding: 9px 0;
  border-bottom: 1px solid var(--border-light);
}
.step-n {
  flex-shrink: 0; width: 21px; height: 21px; border-radius: 50%;
  background: var(--cream); border: 1px solid var(--border);
  font-size: 11px; font-weight: 600; color: var(--accent-ink);
  display: flex; align-items: center; justify-content: center;
}
.step-t { font-size: 13px; font-weight: 500; }
.step-d { font-size: 11.5px; color: var(--muted); line-height: 1.5; margin-top: 2px; }

/* TODO badge — visible on screen, hidden in print, so a half-filled
   packet can still be previewed without printing placeholder chrome. */
.todo-flag {
  display: inline-block; background: #fdecea; color: var(--red);
  border: 1px solid #f3b8b2; border-radius: 3px;
  font-size: 9px; letter-spacing: .5px; text-transform: uppercase;
  font-weight: 600; padding: 1.5px 5px; margin-left: 6px;
}

/* ═══════════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════════ */
@media print {
  @page { size: letter portrait; margin: 0; }

  body { background: var(--white); }
  .action-bar, .setup-screen, .upload-screen, .no-print { display: none !important; }
  .packet-screen { padding: 0; background: var(--white); }
  .todo-flag { display: none !important; }

  .oh-page {
    width: 100%; min-height: 0; height: 10.6in;
    margin: 0; border: none;
    padding: 0.45in 0.55in;
    page-break-after: always; break-after: page;
  }
  .oh-page:last-child { page-break-after: auto; break-after: auto; }

  /* Keep every card whole — a payment column split across a page break
     is worse than handing out no sheet at all. */
  .pay-col, .prog-card, .half, .hook, .vend, .sold-median, .fridge,
  .tier, .vend-agents {
    page-break-inside: avoid; break-inside: avoid;
  }
  .sold-table tr, .prep-table tr { page-break-inside: avoid; break-inside: avoid; }

  /* Gold accents and tinted panels carry the hierarchy — without this most
     browsers drop them and every page prints as flat grey text. */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}