/* ── Model Detail Page ────────────────────────────────────── */

.model-header {
  padding: 32px 0 24px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 28px;
}
.back-link {
  font-size: 0.82rem;
  color: var(--text-muted);
}
.back-link:hover { color: var(--accent); text-decoration: none; }
.model-header h1 {
  font-family: var(--font-mono);
  font-size: 1.6rem;
  font-weight: 700;
  margin: 8px 0 8px;
  letter-spacing: -0.02em;
}
.model-header .provider-badge {
  font-size: 0.75rem;
  padding: 2px 10px;
}

/* ── Stats Row ───────────────────────────────────────────── */
.model-stats {
  display: flex;
  gap: 20px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.stat-card {
  flex: 1;
  min-width: 120px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-card);
}
.stat-card .stat-value {
  font-family: var(--font-mono);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text);
}
.stat-card .stat-value.high { color: var(--green); }
.stat-card .stat-value.medium { color: var(--yellow); }
.stat-card .stat-value.low { color: var(--text-muted); }
.stat-card .stat-label {
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 2px;
}

/* ── Filters ─────────────────────────────────────────────── */
.model-filters {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

/* ── Result icons ────────────────────────────────────────── */
.result-col { width: 32px; text-align: center; }
td.result-cell { text-align: center; font-size: 0.9rem; }
td.result-cell.solved { color: var(--green); }
td.result-cell.failed { color: var(--red); }

/* ── Puzzle link ─────────────────────────────────────────── */
.puzzle-link {
  color: var(--accent);
  text-decoration: none;
}
.puzzle-link:hover { text-decoration: underline; }

/* Replay link */
.replay-link {
  display: inline-block;
  margin-left: 6px;
  font-size: 0.7rem;
  color: var(--text-muted);
  text-decoration: none;
  opacity: 0.6;
}
.replay-link:hover { opacity: 1; color: var(--accent); text-decoration: none; }

/* Turns cell */
.turns-cell {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  color: var(--text-dim);
}

/* Strategy pill */
.strategy-pill {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 3px;
  font-size: 0.72rem;
  font-weight: 600;
}
.strategy-pill.direct {
  background: #dbeafe;
  color: #1e40af;
}
.strategy-pill.agentic {
  background: #ede9fe;
  color: #5b21b6;
}
@media (prefers-color-scheme: dark) {
  .strategy-pill.direct { background: #1e3a5f; color: #93c5fd; }
  .strategy-pill.agentic { background: #3b1f6e; color: #c4b5fd; }
}

/* ── Summary line ────────────────────────────────────────── */
.runs-summary {
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-bottom: 12px;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .model-header h1 { font-size: 1.2rem; }
  .model-stats { gap: 8px; }
  .stat-card { min-width: 90px; padding: 10px; }
  .stat-card .stat-value { font-size: 1rem; }
  .model-filters { flex-direction: column; align-items: flex-start; }
  .section-header { flex-direction: column; gap: 8px; }
}
