/* V105 — the first-screen proof strip.
 *
 * Replaces the four zeroed metrics for a visitor with no history. Same grid as
 * .metrics so the page does not jump when the real numbers arrive.
 */

/* `.ial-v030 .home-shell .metrics` in v033.css carries three classes, so a two
   class rule here loses on specificity - measured: the class was applied and
   `matches()` was true, and the row still computed to `display:grid`. The id
   settles it without an !important. */
#home .metrics.v105-metrics-hidden,
.metrics.v105-metrics-hidden { display: none; }

.v105-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 18px;
}

.v105-proof-cell {
  padding: 16px 16px 14px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 14px;
  background: #fff;
}

.v105-proof-value {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ink, #0f172a);
  line-height: 1.1;
}
.v105-proof-label {
  margin-top: 4px;
  font-size: 12px;
  font-weight: 700;
  color: #334155;
}
.v105-proof-sub {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.45;
  color: #64748b;
}

.v105-proof-note {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.55;
  color: #475569;
}

html[data-ial-theme="dark"] .v105-proof-cell {
  background: var(--d-raise, #16233a);
  border-color: rgba(255, 255, 255, .12);
}
html[data-ial-theme="dark"] .v105-proof-value { color: var(--d-ink, #e6edf7); }
html[data-ial-theme="dark"] .v105-proof-label { color: #cbd5e1; }
html[data-ial-theme="dark"] .v105-proof-sub { color: var(--d-muted, #93a4bd); }
html[data-ial-theme="dark"] .v105-proof-note { color: #94a3b8; }

@media (max-width: 900px) {
  .v105-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .v105-proof-value { font-size: 22px; }
}