.depth-chart-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.depth-chart-card { min-width: 0; border: 1px solid var(--line); background: var(--surface); }
.depth-chart-card header { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; padding: .9rem 1rem; border-bottom: 1px solid var(--line); }
.depth-chart-card header h3 { margin: .2rem 0 0; font-size: 1.1rem; }
.depth-chart-card header span { flex: 0 0 auto; color: var(--muted); font: .62rem 'DM Mono', monospace; text-transform: uppercase; }
.depth-chart-list { list-style: none; margin: 0; padding: 0; }
.depth-chart-row { display: grid; grid-template-columns: 2.4rem 2.15rem minmax(0, 1fr); gap: .65rem; align-items: center; min-width: 0; padding: .65rem 1rem; border-bottom: 1px solid var(--line); }
.depth-chart-row:last-child { border-bottom: 0; }
.depth-chart-row.is-selected { background: color-mix(in srgb, var(--accent, #c56a2d) 12%, var(--surface)); box-shadow: inset 3px 0 var(--accent, #c56a2d); }
.depth-chart-rank { color: var(--muted); font: .65rem 'DM Mono', monospace; }
.depth-chart-row img, .depth-chart-image-placeholder { display: grid; place-items: center; width: 2.15rem; height: 2.15rem; object-fit: contain; border-radius: 50%; background: var(--soft-green); color: var(--green); font: .65rem 'Space Grotesk', sans-serif; }
.depth-chart-player { display: grid; gap: .15rem; min-width: 0; }
.depth-chart-player strong { min-width: 0; overflow-wrap: anywhere; font: 600 .82rem 'Space Grotesk', sans-serif; }
.depth-chart-player span { color: var(--muted); font: .6rem 'DM Mono', monospace; text-transform: uppercase; }
.detail-depth-chart { padding-bottom: .25rem; }
.detail-depth-chart h4 { margin-bottom: .85rem; }
.detail-depth-chart .depth-chart-row { padding-right: 1.25rem; padding-left: 1.25rem; }
@media (max-width: 800px) {
  .depth-chart-grid { grid-template-columns: 1fr; }
  .depth-chart-row { grid-template-columns: 2.2rem 2rem minmax(0, 1fr); gap: .55rem; padding: .6rem .85rem; }
  .depth-chart-card header { padding-right: .85rem; padding-left: .85rem; }
}