/* Roster page layout — tokens and type come from site.css */

.wrap--wide .top{padding:34px 0 20px;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.crest-lockup{flex:0 0 auto}
.crest-lockup svg{display:block;width:76px;height:82px;color:var(--gold)}
.titles{flex:1 1 auto;min-width:200px}
.titles h1{
  font-family:var(--display);font-weight:700;letter-spacing:.01em;
  font-size:clamp(34px,7vw,66px);line-height:.88;margin:0;text-transform:uppercase;
}
.titles h1 span{display:block;color:var(--gold)}
.roster-eyebrow{
  font-family:var(--mono);text-transform:uppercase;letter-spacing:.22em;
  font-size:11px;color:var(--gold);margin:0 0 6px
}
.subhead{
  font-family:var(--display);font-weight:500;font-size:16px;
  color:rgba(244,238,230,.62);letter-spacing:.06em;margin:8px 0 0;text-transform:uppercase
}
.pagenav{display:flex;gap:10px;flex:0 0 auto}
.pagenav a{
  font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.14em;
  font-size:12px;color:var(--gold-lt);text-decoration:none;
  border:1px solid var(--rule-strong);padding:8px 14px;
  transition:border-color .15s,color .15s,background .15s;
}
.pagenav a:hover{border-color:var(--gold);color:var(--gold);background:rgba(224,179,60,.08)}
.yard{height:10px;margin:18px 0 26px;border-top:2px solid var(--gold);
  background:repeating-linear-gradient(90deg,var(--gold) 0 2px,transparent 2px 28px);opacity:.55}

.teams{display:flex;gap:0;border:1px solid var(--rule-strong);overflow:hidden;width:max-content;max-width:100%}
.teams button{
  appearance:none;border:0;background:transparent;color:var(--bone);cursor:pointer;
  font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.16em;
  font-size:14px;padding:11px 22px;border-right:1px solid var(--rule-strong);white-space:nowrap
}
.teams button:last-child{border-right:0}
.teams button[aria-pressed="true"]{background:var(--gold);color:var(--ink)}

.stats{display:flex;flex-wrap:wrap;gap:26px 40px;margin:26px 0 4px;padding:18px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.stat .k{font-family:var(--display);font-weight:700;font-size:34px;line-height:1;color:var(--gold-lt)}
.stat .l{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:rgba(244,238,230,.62);margin-top:4px}

.controls{margin:24px 0 6px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.search{flex:1 1 240px;min-width:200px;position:relative}
.search input{
  width:100%;background:rgba(0,0,0,.22);border:1px solid var(--rule-strong);color:var(--bone);
  font-family:var(--body);font-size:15px;padding:11px 13px 11px 36px
}
.search input::placeholder{color:rgba(244,238,230,.42)}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:2}
select{
  background:rgba(0,0,0,.22);border:1px solid var(--rule-strong);color:var(--bone);
  font-family:var(--display);font-size:14px;letter-spacing:.08em;text-transform:uppercase;padding:11px 12px
}
.viewtoggle{display:flex;border:1px solid var(--rule-strong);overflow:hidden}
.viewtoggle button{appearance:none;border:0;border-right:1px solid var(--rule-strong);background:transparent;color:var(--bone);
  font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;font-size:13px;padding:11px 16px;cursor:pointer}
.viewtoggle button:last-child{border-right:0}
.viewtoggle button[aria-pressed="true"]{background:var(--gold);color:var(--ink)}
.chipsrow{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline;margin-top:16px}
.chipslabel{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--gold);flex:0 0 auto}

.count{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:12px;color:rgba(244,238,230,.62);margin:22px 0 12px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:12px}
.card{
  position:relative;border:1px solid var(--rule-strong);overflow:hidden;
  background:linear-gradient(160deg,rgba(107,27,45,.55),rgba(0,0,0,.25));
  padding:14px 14px 12px;transition:transform .16s ease,border-color .16s ease,background .16s ease
}
.card:hover{transform:translateY(-3px);border-color:var(--gold);background:linear-gradient(160deg,rgba(107,27,45,.8),rgba(0,0,0,.3))}
.card .num{
  font-family:var(--display);font-weight:700;font-size:76px;line-height:.8;color:var(--gold);
  letter-spacing:-.02em;display:block;
  -webkit-text-stroke:1px rgba(246,223,160,.35)
}
.card .nm{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:20px;margin-top:8px;line-height:1.1}
.card .pos{font-family:var(--mono);font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:12px;color:var(--gold-lt);margin-top:5px}
.card .meta{display:flex;gap:14px;margin-top:9px;padding-top:9px;border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:rgba(244,238,230,.62);font-variant-numeric:tabular-nums}
.card .yr{position:absolute;top:12px;right:12px;font-family:var(--display);font-weight:600;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);background:var(--gold-lt);padding:3px 8px;border-radius:999px}
.card.mgr .num{color:var(--bone);-webkit-text-stroke:1px rgba(244,238,230,.3)}

.tablewrap{overflow-x:auto;border:1px solid var(--rule-strong)}
table{border-collapse:collapse;width:100%;min-width:560px}
th{
  font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--gold);
  text-align:left;padding:12px 14px;background:rgba(0,0,0,.3);border-bottom:1px solid var(--rule);white-space:nowrap
}
td{padding:11px 14px;border-bottom:1px solid var(--rule);font-family:var(--body);font-size:16px;letter-spacing:.03em;white-space:nowrap}
tbody tr:hover{background:rgba(224,179,60,.09)}
td.num{font-family:var(--display);font-weight:700;font-size:22px;color:var(--gold);width:56px}
td.nm{font-weight:600;font-family:var(--display);text-transform:uppercase;white-space:normal}
td.dim{color:rgba(244,238,230,.62);font-variant-numeric:tabular-nums}

.roster-empty{padding:44px 10px;text-align:center;font-family:var(--display);letter-spacing:.1em;text-transform:uppercase;color:rgba(244,238,230,.62)}
.roster-empty button{margin-top:14px}

.staff{margin-top:56px;border-top:1px solid var(--rule);padding-top:8px}
.staff h2{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:30px;letter-spacing:.02em;margin:24px 0 2px}
.staffgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:16px}
.block{border:1px solid var(--rule-strong);padding:16px 16px 14px;background:rgba(0,0,0,.18)}
.block h3{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--gold);margin:0 0 10px}
.block p{margin:0 0 9px;font-size:15px;line-height:1.4}
.block p:last-child{margin-bottom:0}
.block b{font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;font-size:13px;color:var(--gold-lt);display:block;font-weight:600}

.wrap--wide footer{
  margin-top:44px;padding-top:16px;border-top:1px solid var(--rule);max-width:none;
  font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:12px;color:rgba(244,238,230,.62);
  display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between
}

@media (max-width:560px){
  .wrap--wide .top{gap:14px}
  .crest-lockup svg{width:56px;height:60px}
  .card .num{font-size:60px}
  .stats{gap:18px 28px}
}