/* validation.css — 기술 검증 대시보드 */

.val-layout { max-width: 1200px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 16px; }
.run-controls { display: flex; align-items: center; gap: 12px; }
.run-controls label { font-size: 12px; display: flex; align-items: center; gap: 6px; }
.run-controls select { width: auto; margin: 0; }
.run-controls .btn { padding: 9px 16px; }

.kpi-row.four { grid-template-columns: repeat(4, 1fr); }
.kpi b.good { color: var(--stair); }
.kpi b.warn { color: var(--warn); }
.kpi b.bad { color: var(--danger); }

.run-status {
  margin-top: 12px; font-size: 12.5px; color: var(--muted);
  background: #0e1826; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px;
  font-family: "Consolas", monospace;
}
.run-status.running { color: var(--warn); }
.run-status.done { color: var(--stair); }

.invariant-list { display: flex; flex-direction: column; gap: 6px; }
.inv-item {
  display: flex; align-items: center; gap: 10px; font-size: 12.5px;
  background: #0e1826; border: 1px solid var(--line); border-radius: 8px; padding: 9px 12px;
}
.inv-item .ic { width: 20px; text-align: center; }
.inv-item .cnt { margin-left: auto; color: var(--muted); font-family: "Consolas", monospace; font-size: 11.5px; }
.inv-pass { color: var(--text); }
.inv-pass .ic { color: var(--stair); }
.inv-fail { border-color: rgba(255,107,107,0.5); }
.inv-fail .ic { color: var(--danger); }

.table-wrap { overflow-x: auto; }
.val-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.val-table th, .val-table td { padding: 9px 10px; text-align: center; border-bottom: 1px solid var(--line); }
.val-table th { color: var(--muted); font-weight: 600; font-size: 11.5px; }
.val-table td:first-child, .val-table th:first-child { text-align: left; }
.val-table .pass { color: var(--stair); font-weight: 700; }
.val-table .fail { color: var(--danger); font-weight: 700; }
.badge-v {
  display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600;
}
.badge-v.stair, .badge-v.stair-strong { background: rgba(46,204,150,0.2); color: var(--stair); }
.badge-v.elevator { background: rgba(245,166,35,0.2); color: var(--warn); }
.badge-v.neutral { background: rgba(139,163,189,0.15); color: var(--muted); }

.hist { display: flex; align-items: flex-end; gap: 2px; height: 140px; padding: 8px; background: #0a1220; border-radius: 8px; border: 1px solid var(--line); }
.hist-bar { flex: 1; background: linear-gradient(180deg, var(--accent), #2b4a72); border-radius: 2px 2px 0 0; min-height: 1px; transition: height .3s; }
.hist-axis { display: flex; justify-content: space-between; font-size: 10.5px; color: var(--muted); margin-top: 4px; }