.matrix-card { border: 1px solid #e6e6e6; border-radius: 6px; padding: 16px; margin-bottom: 16px; background: #fff; }
.matrix-card h3, .matrix-card h4 { margin-top: 0; }
.matrix-muted { color: #667085; font-size: 13px; }
.matrix-tree-node { border: 1px solid #d9e2ec; border-radius: 6px; padding: 10px 12px; margin: 8px 0; background: #f8fafc; }
.matrix-slot-open { background: #f4f6f8; color: #667085; }
.matrix-slot-filled { background: #fff; }
.matrix-tree-children { margin-left: 18px; }
.matrix-actions a, .matrix-actions button { margin-right: 6px; margin-bottom: 6px; }
.matrix-chart { display: flex; align-items: flex-end; gap: 8px; height: 140px; }
.matrix-chart span { display: block; width: 28px; background: #3862f5; border-radius: 4px 4px 0 0; }
@media (max-width: 767px) {
  .matrix-tree-children { margin-left: 8px; }
  .matrix-card { padding: 12px; }
}