:root{
  --bg:#F2F4F3;
  --surface:#FFFFFF;
  --surface-2:#EAEDEB;
  --text:#132321;
  --text-muted:#54655F;
  --text-faint:#8B9992;
  --border:#D6DDD8;
  --border-strong:#B9C4BE;
  --accent:#28616F;
  --accent-ink:#173C45;
  --accent-soft:#E1EDEC;
  --red:#A5402B;
  --red-soft:#F4E5E0;
  --amber:#93691C;
  --amber-soft:#F2EAD6;
  --green:#2E6F49;
  --green-soft:#E1EEE5;
  --shadow: 0 1px 2px rgba(19,35,33,0.06), 0 8px 24px rgba(19,35,33,0.05);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#12181A;
    --surface:#181F22;
    --surface-2:#1F2729;
    --text:#E7EEEC;
    --text-muted:#9FB0AB;
    --text-faint:#69786F;
    --border:#2A3437;
    --border-strong:#3A4649;
    --accent:#7BB9C6;
    --accent-ink:#CFEAEF;
    --accent-soft:#1D3136;
    --red:#DE8168;
    --red-soft:#33231E;
    --amber:#D3AE5C;
    --amber-soft:#332A18;
    --green:#7FC49B;
    --green-soft:#1B2E22;
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px rgba(0,0,0,0.35);
  }
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Public Sans', system-ui, -apple-system, sans-serif;
  line-height:1.55;
  padding-inline: max(16px, calc((100vw - 760px)/2));
  padding-block: 40px 64px;
}
h1,h2{
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  letter-spacing:-0.01em;
  text-wrap:balance;
  margin:0;
}
a{color:var(--accent);}
.mono{font-family:'IBM Plex Mono', ui-monospace, monospace;}

.shell{max-width:760px; margin-inline:auto; display:flex; flex-direction:column; gap:24px; padding:0 16px 64px;}
body.mkt .shell{padding-top:24px;}

/* ---- header ---- */
header.top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.brand{display:flex; align-items:flex-start; gap:14px;}
.brand-mark{font-size:2rem; line-height:1;}
.brand h1{font-size:1.6rem;}
.tagline{margin:6px 0 0; color:var(--text-muted); font-size:0.94rem; max-width:44ch;}
.pilot-badge{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.04em;
  color:var(--accent-ink);
  background:var(--accent-soft);
  border:1px solid var(--border);
  border-radius:20px;
  padding:6px 12px;
  white-space:nowrap;
  height:fit-content;
}

/* ---- cards / form ---- */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:var(--shadow);
  padding:24px;
}
.field{display:block; margin-bottom:18px;}
.field-label{
  display:block;
  font-size:0.78rem;
  font-weight:600;
  letter-spacing:0.02em;
  color:var(--text-muted);
  margin-bottom:8px;
}
.input-row{display:flex; gap:8px;}
input[type="text"], select{
  width:100%;
  font-family:'Public Sans', sans-serif;
  font-size:0.96rem;
  color:var(--text);
  background:var(--bg);
  border:1px solid var(--border-strong);
  border-radius:8px;
  padding:11px 13px;
}
input[type="text"]:focus, select:focus{
  outline:2px solid var(--accent);
  outline-offset:1px;
}
.checks{border:none; margin:0; padding:0;}
.checks legend{padding:0; margin-bottom:10px;}
.check{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:0.92rem;
  color:var(--text);
  padding:8px 4px;
  cursor:pointer;
}
.check input{margin-top:3px; width:16px; height:16px; accent-color:var(--accent); flex-shrink:0;}

.field-note{
  font-size:0.82rem;
  color:var(--text-faint);
  margin:8px 0 0;
}

.advanced{
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:18px;
  background:var(--bg);
}
.advanced summary{
  cursor:pointer;
  padding:12px 14px;
  font-size:0.86rem;
  font-weight:600;
  color:var(--text);
  list-style:none;
}
.advanced summary::-webkit-details-marker{display:none;}
.advanced summary::before{
  content:"\25B8";
  display:inline-block;
  margin-right:8px;
  color:var(--text-faint);
  transition:transform 0.15s ease;
}
.advanced[open] summary::before{transform:rotate(90deg);}
.advanced-body{padding:0 14px 14px;}

.segmented{
  display:flex;
  border:1px solid var(--border-strong);
  border-radius:8px;
  overflow:hidden;
  width:fit-content;
  margin-top:2px;
}
.seg-opt{
  padding:8px 16px;
  font-size:0.88rem;
  cursor:pointer;
  color:var(--text-muted);
  border-right:1px solid var(--border-strong);
  position:relative;
}
.seg-opt:last-child{border-right:none;}
.seg-opt input{position:absolute; opacity:0; pointer-events:none;}
.seg-opt:has(input:checked){background:var(--accent); color:#fff; font-weight:600;}
.seg-opt:has(input:focus-visible){outline:2px solid var(--accent); outline-offset:-2px;}

.btn-primary, .btn-ghost{
  font-family:'Public Sans', sans-serif;
  font-weight:600;
  font-size:0.92rem;
  border-radius:8px;
  cursor:pointer;
  border:1px solid transparent;
}
.btn-primary{
  background:var(--accent);
  color:#fff;
  padding:12px 22px;
  width:100%;
  border:none;
}
.btn-primary:hover{background:var(--accent-ink);}
.btn-primary:disabled{opacity:0.6; cursor:progress;}
.btn-ghost{
  background:transparent;
  color:var(--accent-ink);
  border-color:var(--border-strong);
  padding:0 14px;
  white-space:nowrap;
}
.btn-ghost:hover{background:var(--surface-2);}
.form-hint{font-size:0.8rem; color:var(--text-faint); margin:14px 0 0;}

/* ---- status ---- */
.status{
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 16px;
  font-size:0.9rem;
  background:var(--surface);
}
.status.loading{color:var(--text-muted);}
.status.error{background:var(--red-soft); border-color:var(--red); color:var(--red);}

/* ---- results ---- */
.results{display:flex; flex-direction:column; gap:22px;}

.summary-banner{
  border-radius:14px;
  padding:20px 22px;
  border:1px solid var(--border);
}
.summary-banner.red{background:var(--red-soft); border-color:var(--red);}
.summary-banner.amber{background:var(--amber-soft); border-color:var(--amber);}
.summary-banner.green{background:var(--green-soft); border-color:var(--green);}
.summary-banner h2{font-size:1.2rem; margin-bottom:6px;}
.summary-banner .matched{font-size:0.85rem; color:var(--text-muted); margin:0 0 10px;}
.summary-counts{display:flex; gap:14px; font-size:0.8rem; font-family:'IBM Plex Mono', monospace;}
.summary-counts span{display:flex; align-items:center; gap:6px;}
.dot{width:8px; height:8px; border-radius:50%; display:inline-block;}
.dot.red{background:var(--red);} .dot.amber{background:var(--amber);} .dot.green{background:var(--green);}

.property-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px 20px;
  box-shadow:var(--shadow);
}
.property-photos{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:16px;
}
.property-photos figure{margin:0;}
.property-photos img{
  width:100%;
  aspect-ratio:1;
  object-fit:cover;
  border-radius:8px;
  border:1px solid var(--border);
  display:block;
  background:var(--surface-2);
}
.property-photos figcaption{
  font-size:0.72rem;
  color:var(--text-faint);
  margin-top:5px;
  text-align:center;
}
.property-facts{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:10px 18px;
  margin:0 0 14px;
}
.property-facts .fact{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:8px 10px;
  background:var(--bg);
  border-radius:8px;
}
.property-facts dt{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.66rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--text-faint);
}
.property-facts dd{margin:0; font-size:0.9rem; color:var(--text); font-weight:500;}
.property-links{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:0.86rem;
  margin-bottom:10px;
}
@media (max-width:480px){
  .property-photos{grid-template-columns:1fr;}
  .property-facts{grid-template-columns:1fr;}
}

.finding{
  display:flex;
  gap:14px;
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 16px;
  background:var(--surface);
}
.finding .stripe{width:4px; border-radius:3px; flex-shrink:0;}
.finding.red .stripe{background:var(--red);}
.finding.amber .stripe{background:var(--amber);}
.finding.green .stripe{background:var(--green);}
.finding .body{flex:1; min-width:0;}
.finding .top-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:4px;}
.pill{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.64rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  padding:2px 8px;
  border-radius:20px;
  font-weight:500;
}
.finding.red .pill{background:var(--red-soft); color:var(--red);}
.finding.amber .pill{background:var(--amber-soft); color:var(--amber);}
.finding.green .pill{background:var(--green-soft); color:var(--green);}
.finding .cat{font-size:0.72rem; color:var(--text-faint);}
.finding .title{font-weight:600; font-size:0.94rem;}
.finding .text{font-size:0.88rem; color:var(--text-muted); margin:4px 0 0;}
.finding .cite{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.74rem;
  color:var(--text-faint);
  margin-top:8px;
}
.finding .cite a{color:var(--text-muted);}

.page-footer{
  border-top:1px solid var(--border);
  padding-top:18px;
  font-size:0.78rem;
  color:var(--text-faint);
}

@media (max-width:520px){
  .input-row{flex-direction:column;}
  header.top{flex-direction:column;}
}

/* ---- toolbar / PDF download ---- */
.toolbar{
  display:flex;
  justify-content:flex-end;
}
.print-only{display:none;}
.print-header{
  border-bottom:2px solid var(--text);
  padding-bottom:10px;
  margin-bottom:6px;
}
.print-header h1{font-size:1.3rem; margin-bottom:2px;}
.print-header p{margin:0; font-size:0.85rem; color:var(--text-muted);}

/* ---- print / "download PDF" (browser print dialog -> Save as PDF) ---- */
@page{
  margin: 0.6in 0.55in;
}
@media print{
  :root{
    --bg:#FFFFFF;
    --surface:#FFFFFF;
    --surface-2:#F2F4F3;
    --text:#111;
    --text-muted:#3a3a3a;
    --text-faint:#666;
    --border:#bbb;
    --border-strong:#999;
    --accent-soft:#eef4f3;
    --accent-ink:#173C45;
    --red-soft:#fbe9e5; --amber-soft:#faf3df; --green-soft:#e9f4ee;
  }
  *{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  html, body{ padding:0; margin:0; max-width:100%; height:auto; }
  .no-print, header.top, .form-card, #status{ display:none !important; }
  /* Report panel is embedded inside .mkt-header/.mkt-hero on every marketing
     page (see hero-report) — hide the surrounding chrome, but not
     .mkt-header itself, since the live report renders inside it. */
  .mkt-nav, .mkt-footer, .mkt-atmosphere, .mkt-kicker, .hero-report-eyebrow, .hero-report-note,
  .mkt-main > .mkt-section:not(.report-section){ display:none !important; }
  .print-only{ display:block; }
  /* Flex/grid containers paginate unreliably in print — a child that
     doesn't fit the remaining page height gets clipped instead of flowing
     to the next page. Force plain block flow for print so the browser's
     normal page-break logic (driven by break-inside/break-after below)
     applies to every ancestor of the report content. */
  .shell, .mkt-main, #results{ display:block !important; max-width:100%; }
  .shell > *, .mkt-main > *{ margin-bottom:16px; }
  .card, .finding, .property-card, .summary-banner{ box-shadow:none; }
  /* Chrome's print engine unreliably honors break-inside:avoid on flex
     containers specifically — findings are the most numerous repeated
     element in the report, so this is where clipping shows up first.
     Drop flex entirely for print: the color stripe becomes a border, and
     the pill/category spans stack inline on their own (they're <span>s,
     no flex needed to sit side by side). */
  .finding{ display:block !important; border-left:4px solid var(--border-strong); padding-left:14px; }
  .finding .stripe{ display:none; }
  .finding.red{ border-left-color:var(--red); }
  .finding.amber{ border-left-color:var(--amber); }
  .finding.green{ border-left-color:var(--green); }
  .finding .top-row{ display:block; }
  .finding .body{ display:block; }
  .property-facts .fact{ display:block; }
  .finding, .property-card, .summary-banner, .print-header, .disclaimer-banner{
    break-inside:avoid; page-break-inside:avoid;
    /* Belt-and-suspenders for engines that only honor the legacy props. */
    -webkit-column-break-inside:avoid;
  }
  h1, h2, h3{ break-after:avoid; page-break-after:avoid; }
  .property-photos img{ break-inside:avoid; }
  a{ color:var(--text); text-decoration:underline; }
  .page-footer{ break-inside:avoid; page-break-inside:avoid; }
}