/* Keep the SVG grid and endpoint positions in the same mobile coordinate space. */
@media (max-width: 600px) {
  .standings-race .race-canvas {
    min-height: 515px;
    margin-inline: -8px;
  }

  .standings-race .race-canvas svg {
    display: block;
    width: 100%;
    height: 515px;
  }

  .standings-race .race-avatar {
    width: 38px;
    height: 38px;
  }
}

.standings-race .race-grid { stroke: #dccbad; stroke-width: 1; }
.standings-race .race-rank, .standings-race .race-week { fill: #805c20; font: 700 14px Inter, sans-serif; }
.standings-race .race-rank { text-anchor: end; }
.standings-race .race-line.is-selected { opacity: 1; stroke-width: 6; }
.standings-race .race-line:not(.is-selected) { opacity: .16; stroke-width: 3; }
.standings-race .race-avatar.is-selected { box-shadow: 0 0 0 4px #f7e5ae, 0 2px 7px #27190944; }
.standings-race .race-origin circle { fill: #fffaf0; stroke-width: 3; }
.standings-race .race-origin text { fill: #493720; font: 800 12px Inter, sans-serif; }
.standings-race .race-origin:not(.is-selected) { opacity: .62; }


/* The race instruction and selected-manager strip are information, not throwaway
   copy: give both a compact, repeatable card treatment on every screen size. */
.standings-race .race-instruction { align-items:center; background:#fbf3e4; border:1px solid #dfcfad; border-left:4px solid #b27613; border-radius:10px; color:#5e472c; display:flex; gap:10px; margin:14px 0 12px; padding:10px 12px; }
.standings-race .race-instruction-mark { align-items:center; background:#493720; border-radius:50%; color:#fff8e9; display:inline-flex; flex:0 0 26px; font-size:1rem; height:26px; justify-content:center; width:26px; }
.standings-race .race-instruction b,.standings-race .race-instruction em { display:block; }
.standings-race .race-instruction b { color:#76582f; font:800 .76rem var(--font-display); letter-spacing:.05em; text-transform:uppercase; }
.standings-race .race-instruction em { color:#5e472c; font-size:.76rem; font-style:normal; line-height:1.35; margin-top:2px; }
.standings-race .race-detail { background:#fbf3e4; border:1px solid #dfcfad; border-radius:12px; display:grid; gap:10px; margin-top:14px; padding:13px; }
.standings-race .race-detail-head { align-items:baseline; display:flex; flex-wrap:wrap; gap:4px 8px; }
.standings-race .race-detail-head strong { color:#35291e; font:800 1rem var(--font-display); }
.standings-race .race-detail-head span { color:#76582f; font-size:.84rem; font-weight:700; }
.standings-race .race-detail-record { display:flex; flex-wrap:wrap; gap:7px 12px; }
.standings-race .race-detail-record b { color:#35291e; }
.standings-race .race-detail-record span { color:#5e472c; font-size:.84rem; }
.standings-race .race-detail-metrics { border-top:1px solid #dfcfad; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding-top:10px; }
.standings-race .race-detail-metrics>span { min-width:0; padding:0 10px; }
.standings-race .race-detail-metrics>span:first-child { padding-left:0; }
.standings-race .race-detail-metrics>span+span { border-left:1px solid #dfcfad; }
.standings-race .race-detail-metrics small,.standings-race .race-detail-metrics b { display:block; }
.standings-race .race-detail-metrics small { color:#806947; font-size:.63rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.standings-race .race-detail-metrics b { color:#35291e; font-size:.86rem; margin-top:3px; }
.standings-race .race-detail-metrics .is-up b { color:#257f63; }
.standings-race .race-detail-metrics .is-down b { color:#a43838; }
.standings-race .race-detail-metrics .is-even b { color:#737373; }

/* One featured matchup prevents the five-card grid from ending on an empty cell. */
#season-hq .hq-matchup-grid>.hq-matchup.game-of-week { background:#fbf3e4; border:2px solid #b27613; box-shadow:inset 0 0 0 1px rgba(210,166,83,.28); grid-column:1/-1; order:-1; padding:17px; }
#season-hq .hq-matchup-grid>.hq-matchup.game-of-week .hq-kicker { color:#a57212; font:800 .76rem var(--font-display); letter-spacing:.09em; margin-bottom:10px; }
#season-hq .hq-matchup-grid>.hq-matchup.game-of-week span b { font-size:1rem; }
#season-hq .hq-matchup-grid>.hq-matchup.game-of-week strong { font-size:1.18rem; }
#season-hq .hq-matchup-grid>.hq-matchup.game-of-week p { font-size:.78rem; }
@media(max-width:600px){ .standings-race .race-instruction{align-items:flex-start;margin-inline:0}.standings-race .race-detail{padding:12px}.standings-race .race-detail-head strong{font-size:.94rem}.standings-race .race-detail-head span{font-size:.78rem}.standings-race .race-detail-record{gap:5px 9px}.standings-race .race-detail-record span{font-size:.78rem}.standings-race .race-detail-metrics>span{padding:0 7px}#season-hq .hq-matchup-grid>.hq-matchup.game-of-week{padding:14px} }

#season-hq .hq-matchup-grid>.hq-matchup.game-of-week .game-of-week-label{color:#a57212;display:block;font:800 .9rem var(--font-display);letter-spacing:.08em;margin:0 0 12px;text-transform:uppercase}