/* Reset and base */
* { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --brand: #0b3b6f;         /* deep navy - trust */
  --brand-dark: #072548;
  --accent: #f5b301;        /* Arizona gold */
  --ink: #1a1a1a;
  --muted: #6b7280;
  --line: #e5e7eb;
  --bg: #ffffff;
  --bg-soft: #f8fafc;
}

html, body {
  height: 100%;
  background: var(--bg);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* Top bar */
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 32px;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.brand {
  font-size: 20px;
  font-weight: 700;
  color: var(--brand);
  letter-spacing: -0.01em;
}
.tagline {
  font-size: 13px;
  color: var(--muted);
}

/* Hero */
.hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  text-align: center;
}
.headline {
  font-size: 44px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 12px;
  letter-spacing: -0.02em;
}
.subhead {
  font-size: 18px;
  color: var(--muted);
  margin-bottom: 40px;
  max-width: 600px;
}

/* Search input container - holds the new PlaceAutocompleteElement */
.search-wrap {
  display: flex;
  width: 100%;
  max-width: 640px;
  gap: 12px;
  margin-bottom: 16px;
}
.autocomplete-container {
  flex: 1;
  position: relative;
}
/* The new gmp-place-autocomplete is a custom element. We size it here
   and let its internal input inherit our look via its exposed parts. */
gmp-place-autocomplete {
  display: block;
  width: 100%;
  height: 56px;
}
gmp-place-autocomplete::part(input) {
  width: 100%;
  height: 56px;
  padding: 0 20px;
  font-size: 17px;
  color: var(--ink);
  background: var(--bg);
  border: 1.5px solid var(--line);
  border-radius: 12px;
  outline: none;
  font-family: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
gmp-place-autocomplete::part(input):focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 4px rgba(11, 59, 111, 0.1);
}
#submit-btn {
  height: 56px;
  padding: 0 28px;
  font-size: 16px;
  font-weight: 600;
  color: var(--bg);
  background: var(--brand);
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.15s ease;
  white-space: nowrap;
}
#submit-btn:hover:not(:disabled) { background: var(--brand-dark); }
#submit-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* Status message under the search */
.status-msg {
  font-size: 14px;
  color: var(--muted);
  min-height: 20px;
}
.status-msg.error { color: #b91c1c; }
.status-msg.ok { color: #047857; }

/* Google's dropdown - override the default to look native */
.pac-container {
  border-radius: 12px !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  margin-top: 6px;
  font-family: inherit;
}
.pac-item {
  padding: 12px 16px !important;
  font-size: 15px;
  border-top: none;
}
.pac-item:hover { background: var(--bg-soft); }

/* Footer */
.footbar {
  padding: 20px 32px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

/* Mobile */
@media (max-width: 640px) {
  .headline { font-size: 32px; }
  .subhead { font-size: 16px; margin-bottom: 28px; }
  .search-wrap { flex-direction: column; gap: 10px; }
  #submit-btn { width: 100%; }
  .topbar { padding: 16px 20px; }
  .tagline { display: none; }
}

.page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 32px 24px 60px;
  width: 100%;
}

.page-header {
  margin-bottom: 24px;
}
.page-header h1 {
  font-size: 26px;
  font-weight: 700;
  color: var(--ink);
  margin-top: 8px;
  word-break: break-word;
}
.backlink {
  color: var(--brand);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.backlink:hover { text-decoration: underline; }

.topbar .brand a {
  color: inherit;
  text-decoration: none;
}

.card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 24px;
  margin-bottom: 20px;
}
.card h2 {
  font-size: 18px;
  font-weight: 700;
  color: var(--brand);
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.card.highlight {
  background: linear-gradient(0deg, rgba(245,179,1,0.05), rgba(245,179,1,0.05)), var(--bg);
  border-color: rgba(245,179,1,0.4);
}
.card .note {
  font-size: 13px;
  color: var(--muted);
  margin-top: 16px;
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}
.field label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
}
.field .value {
  font-size: 16px;
  color: var(--ink);
  font-weight: 500;
}
.field .value.big {
  font-size: 28px;
  font-weight: 700;
  color: var(--brand);
}
.field input {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  font-size: 15px;
  font-family: inherit;
  color: var(--ink);
  background: var(--bg);
  border: 1.5px solid var(--line);
  border-radius: 8px;
  outline: none;
  transition: border-color 0.15s ease;
}
.field input:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(11, 59, 111, 0.1);
}

.loading {
  text-align: center;
  padding: 60px 20px;
  color: var(--muted);
}
.spinner {
  width: 40px;
  height: 40px;
  border: 3px solid var(--line);
  border-top-color: var(--brand);
  border-radius: 50%;
  margin: 0 auto 16px;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.error-box {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 12px;
  padding: 24px;
  text-align: center;
}
.error-box h3 {
  color: #991b1b;
  margin-bottom: 8px;
}
.error-box p {
  color: #7f1d1d;
  margin-bottom: 16px;
  font-family: monospace;
  font-size: 13px;
  word-break: break-word;
}
.btn {
  display: inline-block;
  padding: 10px 20px;
  background: var(--brand);
  color: white;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
}

.actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
}
#analyze-btn {
  height: 52px;
  padding: 0 32px;
  font-size: 16px;
  font-weight: 600;
  color: white;
  background: var(--brand);
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
#analyze-btn:hover { background: var(--brand-dark); }

/* ARV block with slider */
.arv-block { padding: 8px 0; }
.arv-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 20px;
}
.arv-label {
  font-size: 14px;
  color: var(--muted);
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.05em;
}
.arv-value {
  font-size: 36px;
  font-weight: 700;
  color: var(--brand);
}

.slider-block { margin-bottom: 24px; }
.slider-range-labels {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  font-size: 14px;
  color: var(--muted);
}
.range-midlabel {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}
#arv-slider {
  width: 100%;
  height: 8px;
  -webkit-appearance: none;
  appearance: none;
  background: linear-gradient(to right, #ef4444 0%, #f5b301 50%, #10b981 100%);
  border-radius: 4px;
  outline: none;
}
#arv-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  background: var(--brand);
  border: 3px solid white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  border-radius: 50%;
  cursor: pointer;
}
#arv-slider::-moz-range-thumb {
  width: 24px;
  height: 24px;
  background: var(--brand);
  border: 3px solid white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  border-radius: 50%;
  cursor: pointer;
}
.slider-position-label {
  text-align: center;
  font-size: 13px;
  color: var(--muted);
  margin-top: 10px;
}
.slider-position-label span {
  font-weight: 700;
  color: var(--brand);
}

.arv-override {
  border-top: 1px solid var(--line);
  padding-top: 20px;
  margin-top: 12px;
}
.arv-override label {
  display: block;
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 8px;
}
.override-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.override-row input {
  flex: 1;
  min-width: 180px;
  height: 40px;
  padding: 0 12px;
  font-size: 15px;
  border: 1.5px solid var(--line);
  border-radius: 8px;
  font-family: inherit;
  outline: none;
}
.override-row input:focus { border-color: var(--brand); }
.override-row button {
  height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  background: var(--brand);
  color: white;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}
.override-row button.secondary {
  background: var(--bg);
  color: var(--muted);
  border: 1.5px solid var(--line);
}
.override-row button:hover:not(.secondary) { background: var(--brand-dark); }
.override-row button.secondary:hover { background: var(--bg-soft); }

/* Deal input rows */
.dollar-input, .pct-input {
  position: relative;
  display: flex;
  align-items: center;
}
.dollar-prefix {
  position: absolute;
  left: 14px;
  color: var(--muted);
  font-size: 15px;
  font-weight: 500;
  pointer-events: none;
}
.dollar-input input {
  padding-left: 26px;
}
.pct-suffix {
  position: absolute;
  right: 14px;
  color: var(--muted);
  font-size: 15px;
  font-weight: 500;
  pointer-events: none;
}
.pct-input input {
  padding-right: 26px;
}
.hint {
  font-size: 12px;
  color: var(--muted);
  margin-top: 6px;
  font-style: italic;
}

/* Offer cards */
.offer-card {
  border-left: 4px solid var(--brand);
}
.offer-card.cash {
  border-left-color: #10b981;
  background: linear-gradient(0deg, rgba(16,185,129,0.03), rgba(16,185,129,0.03)), var(--bg);
}
.offer-card.subto {
  border-left-color: #3b82f6;
  background: linear-gradient(0deg, rgba(59,130,246,0.03), rgba(59,130,246,0.03)), var(--bg);
}

.offer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.offer-header h2 {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 18px;
}
.offer-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--brand);
  white-space: nowrap;
}
.offer-card.cash .offer-value { color: #047857; }
.offer-card.subto .offer-value { color: #1e40af; }

.offer-breakdown {
  margin-top: 8px;
}
.breakdown-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 15px;
  border-bottom: 1px solid var(--bg-soft);
}
.breakdown-row:last-child { border-bottom: none; }
.breakdown-row.total {
  font-weight: 700;
  font-size: 16px;
  border-top: 2px solid var(--line);
  border-bottom: none;
  padding-top: 12px;
  margin-top: 8px;
}
.breakdown-row span:first-child { color: var(--muted); }
.breakdown-row span:last-child { color: var(--ink); font-weight: 600; }

.offer-terms {
  background: var(--bg-soft);
  border-radius: 10px;
  padding: 16px;
  margin-top: 16px;
}
.offer-terms h4 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin: 0 0 12px 0;
}
.grid.grid-3 {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
}
.term label {
  display: block;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
}
.term span {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
}

.offer-note {
  font-size: 13px;
  color: var(--muted);
  font-style: italic;
  margin-top: 14px;
  padding: 10px 14px;
  background: var(--bg-soft);
  border-radius: 8px;
}

.actions.bottom {
  gap: 12px;
  margin: 32px 0;
}
.actions button.primary {
  height: 52px;
  padding: 0 32px;
  font-size: 16px;
  font-weight: 600;
  color: white;
  background: var(--brand);
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
.actions button.primary:hover { background: var(--brand-dark); }
.actions button.secondary {
  height: 52px;
  padding: 0 24px;
  font-size: 15px;
  font-weight: 600;
  color: var(--brand);
  background: var(--bg);
  border: 1.5px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
}
.actions button.secondary:hover { background: var(--bg-soft); }

/* Property snapshot at bottom */
.card.compact { padding: 20px; }
.card.compact h2 { font-size: 15px; margin-bottom: 14px; }
.snapshot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px 24px;
}
.snap-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 13px;
  border-bottom: 1px dotted var(--line);
}
.snap-k { color: var(--muted); }
.snap-v { color: var(--ink); font-weight: 500; text-align: right; }

/* ============================================================
   Screen 3 Dashboard Layout (v1.1)
   Overrides the earlier Screen 3 styles for the dashboard view.
   ============================================================ */

.page.dashboard {
  max-width: 1400px;
  padding: 20px 24px 40px;
}

.page-header.compact {
  margin-bottom: 16px;
}
.page-header.compact h1 {
  font-size: 22px;
  margin-top: 4px;
}

.dash-row {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
}

.top-row {
  grid-template-columns: 3fr 2fr;
}

.offer-row {
  grid-template-columns: repeat(4, 1fr);
}

.compact-card {
  padding: 18px 20px;
  margin-bottom: 0;
}
.compact-card h2 {
  font-size: 14px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ARV compact */
.arv-block.compact { padding: 0; }
.arv-value-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 14px;
}
.arv-value-row .arv-value {
  font-size: 32px;
  font-weight: 700;
  color: var(--brand);
}
.arv-position {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--brand);
  padding: 4px 10px;
  background: rgba(11, 59, 111, 0.08);
  border-radius: 20px;
}

.slider-block.compact {
  margin-bottom: 12px;
}
.slider-block.compact .slider-range-labels {
  margin-bottom: 6px;
  font-size: 12px;
}
.slider-block.compact .range-midlabel {
  font-size: 10px;
}

.arv-override.compact {
  border-top: 1px solid var(--line);
  padding-top: 12px;
  margin-top: 8px;
}
.arv-override.compact .override-row input {
  height: 36px;
  font-size: 13px;
}
.arv-override.compact .override-row button {
  height: 36px;
  font-size: 13px;
  padding: 0 12px;
}

/* Deal inputs compact grid */
.input-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
}
.field.compact label {
  font-size: 11px;
  margin-bottom: 4px;
}
.field.compact input {
  height: 36px;
  font-size: 14px;
}
.field.compact.full-width {
  grid-column: 1 / -1;
}

/* Offer cards - compact horizontal layout */
.offer-row .offer-card {
  padding: 16px;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
}

.offer-header-compact {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.offer-header-compact h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--brand);
  margin: 0;
}
.offer-card.cash .offer-header-compact h3 { color: #047857; }
.offer-card.subto .offer-header-compact h3 { color: #1e40af; }

.offer-header-compact .offer-value {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
}

.offer-sub-title {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: -8px;
  margin-bottom: 12px;
  font-weight: 600;
}

.offer-breakdown.compact .breakdown-row {
  padding: 5px 0;
  font-size: 12px;
}
.offer-breakdown.compact .breakdown-row.total {
  padding-top: 8px;
  margin-top: 4px;
  font-size: 13px;
}

/* Dashboard actions */
.dash-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 20px 0;
}
.dash-actions button.primary {
  height: 44px;
  padding: 0 24px;
  font-size: 14px;
  font-weight: 600;
  color: white;
  background: var(--brand);
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.dash-actions button.primary:hover { background: var(--brand-dark); }
.dash-actions button.secondary {
  height: 44px;
  padding: 0 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--brand);
  background: var(--bg);
  border: 1.5px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
}
.dash-actions button.secondary:hover { background: var(--bg-soft); }

/* Responsive breakpoints - stack on smaller screens */
@media (max-width: 1200px) {
  .offer-row {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 900px) {
  .top-row {
    grid-template-columns: 1fr;
  }
  .offer-row {
    grid-template-columns: 1fr;
  }
  .input-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Screen 3 v1.2 - Triangulation UI
   ============================================================ */

.tri-card {
  padding: 24px;
  margin-bottom: 16px;
}

.tri-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.tri-header h2 {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.tri-summary {
  display: flex;
  gap: 32px;
  align-items: center;
}
.tri-summary-item {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.tri-summary-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  font-weight: 600;
}
.tri-summary-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--brand);
}

.spread-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 4px;
}
.spread-badge.green { background: #d1fae5; color: #065f46; }
.spread-badge.yellow { background: #fef3c7; color: #92400e; }
.spread-badge.red { background: #fee2e2; color: #991b1b; }
.spread-badge.neutral { background: var(--bg-soft); color: var(--muted); }

.tri-section-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--muted);
  margin: 16px 0 10px;
}

.tri-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-bottom: 8px;
}

.tri-source {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1.5px solid var(--line);
  background: var(--bg);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tri-source.auto {
  border-color: rgba(11, 59, 111, 0.25);
  background: rgba(11, 59, 111, 0.02);
}
.tri-source-label {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 600;
}
.tri-source-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
}
.tri-source-note {
  font-size: 11px;
  color: var(--muted);
  font-style: italic;
}

/* Manual source input row */
.tri-manual-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 16px;
}
.manual-source {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  border-radius: 10px;
  border: 1.5px dashed var(--line);
  background: var(--bg-soft);
}
.manual-source-select,
.manual-source-custom {
  height: 34px;
  padding: 0 10px;
  font-size: 13px;
  font-family: inherit;
  border: 1.5px solid var(--line);
  border-radius: 6px;
  background: var(--bg);
  outline: none;
}
.manual-source .dollar-input input.manual-source-value {
  height: 34px;
  font-size: 13px;
}

/* Working ARV row */
.working-arv-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  margin-top: 8px;
}
.working-arv-label {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}
.working-arv-value {
  font-size: 26px;
  font-weight: 700;
  color: var(--brand);
  text-transform: none;
  letter-spacing: normal;
}
.working-arv-mode {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 3px 8px;
  border-radius: 10px;
  font-weight: 700;
}
.working-arv-mode.blended { background: #dbeafe; color: #1e40af; }
.working-arv-mode.override { background: #fef3c7; color: #92400e; }
.working-arv-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}
.override-inline {
  position: relative;
  display: flex;
  align-items: center;
}
.override-inline .dollar-prefix {
  position: absolute;
  left: 12px;
  color: var(--muted);
  font-size: 14px;
  pointer-events: none;
}
.override-inline input {
  height: 36px;
  padding: 0 12px 0 24px;
  font-size: 13px;
  border: 1.5px solid var(--line);
  border-radius: 6px;
  width: 130px;
  font-family: inherit;
  outline: none;
}
.override-inline input:focus { border-color: var(--brand); }
.working-arv-controls button {
  height: 36px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  background: var(--brand);
  color: white;
}
.working-arv-controls button.secondary {
  background: var(--bg);
  color: var(--brand);
  border: 1.5px solid var(--line);
}
.working-arv-controls button:hover:not(.secondary) { background: var(--brand-dark); }
.working-arv-controls button.secondary:hover { background: var(--bg-soft); }

/* Deal inputs inline (5 columns instead of 2) */
.input-grid.inline-inputs {
  grid-template-columns: repeat(5, 1fr);
}

/* Comps table */
.comps-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.comps-table th,
.comps-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.comps-table th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  font-weight: 700;
  background: var(--bg-soft);
}
.comps-table td.num,
.comps-table th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.comps-table tbody tr:hover {
  background: var(--bg-soft);
}

/* Responsive - stack on smaller screens */
@media (max-width: 1200px) {
  .tri-manual-grid { grid-template-columns: 1fr 1fr; }
  .input-grid.inline-inputs { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .tri-header { flex-direction: column; align-items: flex-start; }
  .tri-summary { flex-wrap: wrap; gap: 16px; }
  .tri-manual-grid { grid-template-columns: 1fr; }
  .input-grid.inline-inputs { grid-template-columns: 1fr 1fr; }
  .working-arv-row { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   v1.3 additions: outlier detection + smart sub-to gating
   ============================================================ */

/* Outlier states on auto (RentCast) source cards */
.tri-source.excluded {
  opacity: 0.45;
}
.tri-source.excluded .tri-source-value {
  text-decoration: line-through;
}

/* Manual source rows with warning */
.manual-source.outlier-warn {
  position: relative;
}

/* Outlier badges */
.outlier-badge {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 3px 6px;
  border-radius: 4px;
  margin-top: 6px;
  display: inline-block;
}
.outlier-badge.excluded {
  background: #fee;
  color: #c00;
  border: 1px solid #fcc;
}
.outlier-badge.warn {
  background: #fff8e6;
  color: #a86500;
  border: 1px solid #ffd88a;
}

/* Sub-to gating (free-and-clear property) */
.offer-card.subto.gated {
  opacity: 0.4;
  position: relative;
}
.offer-card.subto.gated .gated-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.85);
  color: #fff;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 500;
  z-index: 2;
  white-space: nowrap;
  text-align: center;
}