#detail-insights-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 12px;
}
#detail-insights-body [data-role="ins-market"] {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ins-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 11px 13px;
  font-size: 12.5px;
}
.ins-eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
  margin-bottom: 8px;
  display: flex;
  align-items: baseline;
  gap: 7px;
  flex-wrap: wrap;
}
.ins-note {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--text-muted);
}
.ins-card-note {
  margin: -2px 0 8px;
  color: var(--text-dim);
  font-size: 11.5px;
  line-height: 1.35;
}
.town-index-link {
  display: inline-block;
  margin: 2px 0 6px;
  font-size: 12px;
  color: var(--accent-fg);
}
.ins-report-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 10px 0 4px;
  padding: 0 12px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--accent-fg);
  background: var(--accent-soft);
  border: 1px solid var(--accent-soft-border);
  border-radius: 8px;
  text-decoration: none;
}
.ins-report-link:hover { background: var(--accent-soft-border); }
.ins-dim {
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.5;
}
.ins-headline {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.ins-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ins-position-hero {
  padding: 9px 10px 10px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--chip), color-mix(in srgb, var(--surface) 92%, var(--accent) 8%));
}
.ins-position-hero .ins-headline {
  margin-bottom: 2px;
  font-size: 16px;
}
.ins-position-meta {
  margin-bottom: 12px;
  color: var(--text-muted);
  font-size: 11px;
}
.ins-position-list {
  display: grid;
  gap: 10px;
}
.ins-position-row {
  padding: 9px 10px 10px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--chip), color-mix(in srgb, var(--surface) 94%, var(--accent) 6%));
}
.ins-position-row-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.ins-position-row-top strong {
  min-width: 0;
  font-size: 14px;
  line-height: 1.2;
}
.ins-position-row .ins-position-meta {
  margin-bottom: 9px;
  line-height: 1.25;
}
.ins-position-row.is-selected {
  border-color: var(--accent-soft-border);
  background: var(--accent-soft);
}
.ins-position-row.is-muted { opacity: .58; }
.ins-pos-basis {
  margin-left: auto;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.ins-position-cohort {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  row-gap: 1px;
  align-items: baseline;
  margin-top: 8px;
  padding: 7px 9px;
  border-left: 3px solid var(--accent);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--accent-soft);
}
.ins-position-cohort span {
  grid-row: 1 / 3;
  color: var(--accent-fg);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.ins-position-cohort strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.15;
}
.ins-position-cohort small {
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.2;
}

/* ── pills / chips ──────────────────────────────────────────────── */
.ins-chip {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.ins-chip-ft {
  background: var(--accent-soft);
  color: var(--accent-fg);
  border-color: var(--accent-soft-border);
  min-width: 54px;
  justify-content: center;
}
.ins-chip-meta { background: var(--chip); color: var(--text-dim); border-color: var(--border-soft); }
/* CPF coverage status — factual (data colours, literal hex). */
.ins-status-ok   { background: color-mix(in srgb, #16a34a 16%, transparent); color: #15803d; border-color: color-mix(in srgb, #16a34a 35%, transparent); }
.ins-status-warn { background: var(--warn-soft); color: var(--warn-fg); border-color: color-mix(in srgb, var(--warn-fg) 30%, transparent); }
.ins-status-bad  { background: color-mix(in srgb, #dc2626 15%, transparent); color: #b91c1c; border-color: color-mix(in srgb, #dc2626 35%, transparent); }
[data-theme="dark"] .ins-status-ok  { color: #4ade80; }
[data-theme="dark"] .ins-status-bad { color: #f87171; }

/* ── aligned per-flat-type data rows (price guide, yield) ───────── */
.ins-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 8px 0;
}
.ins-row + .ins-row { border-top: 1px solid var(--border-soft); }
.ins-row-main { min-width: 0; }
.ins-row-val {
  display: block;
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ins-row-sub { display: block; font-size: 11px; color: var(--text-muted); margin-top: 1px; }
.ins-row-proof {
  display: grid;
  justify-items: end;
  gap: 1px;
  min-width: 76px;
  color: var(--text-dim);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.ins-row-proof strong {
  color: var(--text);
  font-size: 12px;
  line-height: 1.1;
  white-space: nowrap;
}
.ins-row-proof small {
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.15;
}
.ins-foot {
  margin-top: 8px;
  padding-top: 7px;
  border-top: 1px solid var(--border-soft);
  font-size: 11.5px;
  font-weight: 600;
  color: var(--text-dim);
}
.ins-foot-link {
  cursor: pointer;
  color: var(--accent-fg);
}
.ins-foot-link::after { content: " ›"; font-weight: 700; }
.ins-foot-link:hover, .ins-foot-link:focus-visible { text-decoration: underline; outline: none; }

/* ── fair-value estimate card (M4) ──────────────────────────────── */
.ins-est-row { padding: 9px 0; }
.ins-est-row + .ins-est-row { border-top: 1px solid var(--border-soft); }
.ins-est-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
}
.ins-est-main { min-width: 0; }
.ins-est-main strong {
  display: block;
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.ins-est-main small { display: block; font-size: 11px; color: var(--text-muted); margin-top: 1px; }
.ins-est-main .ins-est-basis { color: var(--text-dim); margin-top: 3px; }
/* Room-type selector: sits where the flat-type chip did, styled to match it but interactive.
   Narrow so the price detail to its right gets the room (the head's minmax(0,1fr) column absorbs it). */
.ins-est-type-sel {
  align-self: center;
  max-width: 7.5rem;
  padding: 7px 8px;
  border-radius: var(--radius);
  border: 1px solid var(--accent-soft-border);
  background: var(--accent-soft);
  color: var(--accent-fg);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
/* Amber the limited-data options in the open list (desktop Chrome/Firefox; iOS/Safari ignore it,
   hence the " · limited" text marker carries the signal everywhere). */
.ins-est-type-sel .opt-limited { color: var(--warn-fg); }
/* Stacks the "Limited data" tag directly under the selector in the head's left column. */
.ins-est-type-wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.ins-est-limited-tag {
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--warn-fg) 30%, transparent);
  background: var(--warn-soft);
  color: var(--warn-fg);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.ins-est-row-unpriced .ins-est-head { grid-template-columns: auto; }
/* Caution under a hedged estimate for a rare layout: amber, distinct from the neutral card note. */
.ins-est-caution {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: var(--radius);
  border: 1px solid color-mix(in srgb, var(--warn-fg) 30%, transparent);
  background: var(--warn-soft);
  color: var(--warn-fg);
  font-size: 12px;
  line-height: 1.45;
}
.ins-est-caution strong { font-weight: 700; }
.ins-est-btn {
  min-height: 44px;
  padding: 0 14px;
  border-radius: var(--radius);
  border: none;
  background: var(--accent);
  color: var(--text-on-primary);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.ins-est-btn:hover, .ins-est-btn:focus-visible { background: var(--accent-hov); outline: none; }
.ins-est-btn[aria-expanded="true"] { background: var(--chip-active); color: var(--text); }
.ins-est-form {
  margin-top: 9px;
  padding: 12px;
  border-radius: var(--radius);
  background: var(--chip);
  border: 1px solid var(--border-soft);
}
.ins-est-fields { display: flex; flex-direction: column; gap: 16px; }
.ins-est-field { display: flex; flex-direction: column; gap: 6px; }
.ins-est-label { font-size: 12px; color: var(--text); font-weight: 700; }
.ins-est-help {
  margin-top: -3px;
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.3;
}
.ins-est-field select, .ins-est-area-input {
  min-height: 44px;
  padding: 0 10px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
/* Storey position reveals only the relevant ranges. Recorded floor areas remain the first
   choice, while exact entry is visibly separate so the controls do not look duplicated. */
.ins-est-floor, .ins-est-size-options { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ins-est-floor [data-est-level] { flex: 1 1 90px; min-width: 84px; }
.ins-est-size-options [data-est-size-sel] { flex: 1 1 210px; min-width: 180px; }
.ins-est-custom-size {
  display: grid;
  grid-template-columns: auto minmax(100px, 140px) auto minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.ins-est-custom-label, .ins-est-unit {
  color: var(--text-dim);
  font-size: 11px;
  font-weight: 600;
}
.ins-est-custom-size .ins-est-area-input { width: 100%; min-width: 0; }
.ins-est-floor-btn {
  min-height: 44px;
  min-width: 60px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-dim);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.ins-est-floor-btn[aria-pressed="true"] {
  background: var(--accent-soft);
  color: var(--accent-fg);
  border-color: var(--accent-soft-border);
}
.ins-est-pick {
  min-height: 44px;
  min-width: 48px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-dim);
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.ins-est-pick span { color: var(--text-muted); font-size: 10px; font-weight: 500; }
.ins-est-pick[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-fg); border-color: var(--accent-soft-border); }
.ins-est-sqft { font-size: 11px; color: var(--text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ins-est-calc {
  align-self: flex-start;
  min-width: 150px;
  min-height: 44px;
  padding: 0 28px;
  border-radius: var(--radius);
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.ins-est-calc:disabled { opacity: 0.45; cursor: default; }
.ins-est-result {
  display: grid;
  gap: 2px;
  margin-top: 12px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--accent-soft);
  font-size: 13px;
  color: var(--text);
  line-height: 1.45;
}
.ins-est-result:empty { display: none; }
.ins-est-result-label { color: var(--accent-fg); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.ins-est-result strong { font-size: 20px; font-variant-numeric: tabular-nums; }

.ins-sale-note-deal {
  padding: 7px 8px;
  border: 1px solid;
  border-radius: var(--radius);
  border-color: color-mix(in srgb, #16a34a 35%, var(--border-soft));
  background: color-mix(in srgb, #16a34a 8%, var(--chip));
}
.ins-sale-note .ins-deal-badge {
  display: block;
  width: fit-content;
  padding: 3px 7px;
  border: 1px solid color-mix(in srgb, #16a34a 40%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, #16a34a 12%, transparent);
  color: #15803d;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: none;
}
.ins-sale-note-deal small {
  display: block;
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.35;
}
[data-theme="dark"] .ins-sale-note .ins-deal-badge { color: #4ade80; }