/* Depth chart page. Scoped under .dc* so it cannot reach the hub styles it
   sits beside. Uses the shared --bx-* tokens plus --m-glow, which the page
   sets from the team's own palette. */
.dcstarters{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.dcstarter{display:flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid var(--bx-line2);border-radius:999px;background:var(--bx-1)}
.dcs-pos{font:700 11px/1 var(--font-mono,ui-monospace,monospace);letter-spacing:.06em;color:var(--m-glow-text,var(--bx-cy));text-transform:uppercase}
.dcstarter a{color:var(--bx-tx);text-decoration:none;font-weight:600;font-size:14px}
.dcstarter a:hover{color:var(--m-glow-text,var(--bx-cy))}
.dcstarter span:not(.dcs-pos){color:var(--bx-tx1);font-size:14px}

.dcform{font-weight:400;font-size:13px;color:var(--bx-tx2);letter-spacing:.02em;margin-left:8px}

.dcgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.dcunit{border:1px solid var(--bx-line2);border-radius:14px;background:var(--bx-1);padding:14px 15px}
.dcpos{display:flex;align-items:baseline;gap:8px;margin-bottom:10px;padding-bottom:9px;border-bottom:1px solid var(--bx-line)}
.dcpos b{font:700 13px/1 var(--font-mono,ui-monospace,monospace);letter-spacing:.05em;color:var(--m-glow-text,var(--bx-cy))}
.dcpos span{font-size:11.5px;color:var(--bx-tx2)}

.dclist{list-style:none;margin:0;padding:0;counter-reset:none}
.dclist li{display:flex;align-items:center;gap:9px;padding:4px 0;font-size:14px;line-height:1.35}
.dclist li+li{border-top:1px solid var(--bx-line)}
.dcrank{flex:0 0 18px;font:600 11px/1 var(--font-mono,ui-monospace,monospace);color:var(--bx-tx2);text-align:right}
.dclist a{color:var(--bx-tx1);text-decoration:none}
.dclist a:hover{color:var(--m-glow-text,var(--bx-cy))}
.dclist .dcplain{color:var(--bx-tx2)}
.dclist li.is-starter a,.dclist li.is-starter .dcplain{color:var(--bx-tx);font-weight:600}
.dclist li.is-starter .dcrank{color:var(--m-glow-text,var(--bx-cy))}

@media(max-width:560px){.dcgrid{grid-template-columns:1fr 1fr;gap:10px}.dcunit{padding:11px 12px}.dclist li{font-size:13px}}
@media(max-width:380px){.dcgrid{grid-template-columns:1fr}}

/* Depth chart hub — 32 team cards. */
.dchub{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.dchubcard{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--bx-line2);border-radius:14px;background:var(--bx-1);text-decoration:none}
.dchubcard:hover{border-color:var(--bx-cy)}
.dchubcard img{flex:0 0 34px;object-fit:contain}
.dchubtext{min-width:0;flex:1}
.dchubtext b{display:block;color:var(--bx-tx);font-size:14.5px;font-weight:650;line-height:1.3}
.dchubtext span{display:block;color:var(--bx-tx2);font-size:12.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dchubdate{flex:0 0 auto;font:500 11px/1 var(--font-mono,ui-monospace,monospace);color:var(--bx-tx2);font-style:normal}
@media(max-width:480px){.dchub{grid-template-columns:1fr}}

/* Skill-position block. Answers "<team> <pos> depth chart" on the team page:
   Ahrefs shows 35 of 40 such queries resolve to the TEAM chart as their parent
   topic, so this is a section here rather than 160 competing pages. */
.dcskill{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dcskillcol{border:1px solid var(--bx-line2);border-radius:16px;background:var(--bx-1);padding:16px 17px;scroll-margin-top:90px}
.dcskillhead{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--bx-line);font-size:13.5px;font-weight:500;color:var(--bx-tx2);line-height:1.35}
.dcskillhead b{color:var(--m-glow-text,var(--bx-cy));font:700 13.5px/1 var(--font-mono,ui-monospace,monospace);letter-spacing:.04em}
.dcskilllist{list-style:none;margin:0;padding:0}
.dcskilllist li{display:grid;grid-template-columns:44px 1fr auto;align-items:baseline;gap:10px;padding:7px 0}
.dcskilllist li+li{border-top:1px solid var(--bx-line)}
.dcsrank{font:600 11px/1 var(--font-mono,ui-monospace,monospace);color:var(--bx-tx2);letter-spacing:.03em}
.dcsname{min-width:0;font-size:14px}
.dcsname a{color:var(--bx-tx1);text-decoration:none}
.dcsname a:hover{color:var(--m-glow-text,var(--bx-cy))}
.dcskilllist li.is-starter .dcsname a,.dcskilllist li.is-starter .dcsname .dcplain{color:var(--bx-tx);font-weight:600}
.dcskilllist li.is-starter .dcsrank{color:var(--m-glow-text,var(--bx-cy))}
.dcsuse{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.dcsuse em{font:500 11.5px/1 var(--font-mono,ui-monospace,monospace);font-style:normal;color:var(--bx-tx2);white-space:nowrap}
.dcskillnote{margin:16px 0 0;font-size:12.5px;line-height:1.6;color:var(--bx-tx2);max-width:78ch}
@media(max-width:560px){.dcskilllist li{grid-template-columns:40px 1fr;row-gap:2px}.dcsuse{grid-column:2;justify-content:flex-start}}
.dcsuse em.dcswith{color:var(--bx-tx2);opacity:.72;font-style:italic}