/* ATLAS · components/detector-chip.css
 * Provenance: AuditHunt v3 · Phase 1.4 · authored 2026-04-25
 * Spec: §XX.3 — 280×160 card, state badge, sub-tree, runtime bar
 */

.det-chip {
  width: 280px; height: 160px;
  background: var(--steel); border: 1px solid var(--line);
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 8px;
  font-family: var(--f-body); color: var(--bone);
  position: relative;
}
.det-chip-head {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 1.6px;
  color: var(--mute); text-transform: uppercase;
}
.det-chip-state {
  display: inline-flex; align-items: center; gap: 6px;
}
.det-chip-state::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--faint);
}
.det-chip[data-state="pending"] .det-chip-state::before { background: var(--faint); }
.det-chip[data-state="running"] .det-chip-state::before {
  background: var(--bronze-hi);
  opacity: calc(0.5 + var(--pulse, 0.5) * 0.5);
}
.det-chip[data-state="complete"] .det-chip-state::before { background: var(--verify); }

.det-chip-title {
  font-family: var(--f-display); font-weight: 400; font-size: 18px;
  letter-spacing: -0.2px; line-height: 1.15;
}
.det-chip-tree {
  font-family: var(--f-mono); font-size: 11px; color: var(--ash);
  line-height: 1.4;
}
.det-chip-stat {
  margin-top: auto; font-family: var(--f-mono); font-size: 10px;
  color: var(--mute); letter-spacing: 1px;
}
.det-chip-bar {
  height: 4px; background: rgba(234, 238, 245, 0.06);
}
.det-chip-bar > i {
  display: block; height: 100%; background: var(--bronze-hi);
  width: var(--progress, 30%);
}

@media (prefers-reduced-motion: reduce) {
  .det-chip[data-state="running"] .det-chip-state::before { opacity: 0.85; }
}