/* Cards -see docs/strategy/design-system/13-card.md */

.c {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.c-head {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--divider);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--muted);
}

.c-body {
  padding: var(--space-4);
  font-size: var(--font-size-body);
  color: var(--text);
}

.c-body .val {
  font-size: var(--font-size-page-title);
  font-weight: 800;
  letter-spacing: -0.02em;
}

.c-body .meta {
  font-size: var(--font-size-small);
  color: var(--muted);
  margin-top: 4px;
}

.accent-warning { border-left: 4px solid var(--warning); }
.accent-success { border-left: 4px solid var(--success); }
.accent-error   { border-left: 4px solid var(--error); }
.accent-info    { border-left: 4px solid var(--info); }