.attention-strip{display:flex;align-items:center;gap:18px;padding:14px 17px;margin-bottom:12px;border:1px solid #ded9c9;border-radius:15px;background:#fffdf6;box-shadow:0 4px 18px #173b250a}.attention-title{display:flex;align-items:center;gap:9px;flex:0 0 auto;padding-right:17px;border-right:1px solid #e7e1d2}.attention-title>span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#f3e5a9;color:#735f1f;font-weight:900}.attention-title strong,.attention-title small{display:block}.attention-title strong{font-size:12px}.attention-title small{font-size:9px;color:var(--muted)}.attention-items{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;width:100%}.attention-item{padding:7px 10px;border-left:3px solid #d8c87d}.attention-item.bench{border-color:#9bbba7}.attention-item.deadline{border-color:#9fb7c6}.attention-item.clear{border-color:#78a38e}.attention-item strong,.attention-item span{display:block}.attention-item strong{font-size:10px;line-height:1.25}.attention-item span{font-size:9px;color:var(--muted);margin-top:2px}.scoreboard small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.win-meter{grid-column:1/-1}.win-meter>div:first-child{display:flex;justify-content:space-between;margin-bottom:4px}.win-meter>div:first-child span{font-size:9px;letter-spacing:0;text-transform:none}.win-track{height:5px;background:#d9e5dc;border-radius:99px;overflow:hidden}.win-track i{display:block;height:100%;background:#8ca7c0;border-radius:99px}.game-cell{display:block;white-space:nowrap}.game-cell small{display:block;margin-top:1px;color:var(--muted);font-size:8px}.updated-tab{flex:0 0 auto;padding:5px 7px;border-radius:6px;background:var(--soft);color:var(--muted);font-size:8px;font-weight:800;white-space:nowrap}@media(max-width:800px){.attention-strip{align-items:flex-start;flex-direction:column}.attention-title{width:100%;padding:0 0 10px;border-right:0;border-bottom:1px solid #e7e1d2}.attention-items{grid-template-columns:1fr 1fr 1fr}}@media(max-width:560px){.attention-items{grid-template-columns:1fr}.attention-item{padding-top:4px;padding-bottom:4px}.game-cell small{font-size:7px}}

/* The matchup is the dashboard's visual anchor. */
.scoreboard {
  padding: 22px 25px 20px;
  margin: 18px 0 18px;
  border: 1px solid #2d5c49;
  border-top: 4px solid var(--lime);
  border-radius: 19px;
  background:
    radial-gradient(circle at 50% -30%, #347054 0, transparent 42%),
    linear-gradient(145deg, #102d23, #174c37);
  color: white;
  box-shadow: 0 16px 34px #173b2526, 0 3px 8px #173b2520;
  gap: 24px;
}

.scoreboard::before {
  content: "WEEKLY MATCHUP";
  grid-column: 1 / -1;
  color: var(--lime);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .18em;
  text-align: center;
}

.scoreboard div > span {
  color: #9fb9ad;
}

.scoreboard div > strong {
  display: block;
  max-width: 280px;
  color: white;
  font-size: 15px;
  line-height: 1.2;
}

.scoreboard > b {
  min-width: 86px;
  color: white;
  font-size: 42px;
  line-height: 1;
  text-align: center;
  letter-spacing: -.035em;
}

.scoreboard > i {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid #ffffff22;
  border-radius: 50%;
  background: #ffffff0c;
  color: #bad0c5;
  font-size: 9px;
  font-style: normal;
  text-transform: uppercase;
}

.scoreboard small {
  margin-top: 6px;
  color: #b8cbc2;
  font-size: 10px;
  font-weight: 700;
}

.scoreboard .win-meter {
  padding-top: 13px;
  border-top: 1px solid #ffffff18;
}

.scoreboard .win-meter > div:first-child span {
  color: #dce8e2;
  font-size: 10px;
  font-weight: 800;
}

.scoreboard .win-track {
  height: 7px;
  background: #82ab9444;
  box-shadow: inset 0 1px 2px #00000030;
}

.scoreboard .win-track i {
  background: linear-gradient(90deg, #8db4d0, #b5d0df);
  box-shadow: 1px 0 0 #ffffff88;
}

.scoreboard .preseason-note {
  margin: 5px -25px -20px;
  padding: 10px 25px;
  border-top: 1px solid #ffffff12;
  border-radius: 0 0 18px 18px;
  background: #071f1740;
  color: #b8cbc2;
}

@media (max-width: 680px) {
  .scoreboard {
    gap: 9px;
    padding: 18px 14px 17px;
  }

  .scoreboard > b {
    min-width: 54px;
    font-size: 29px;
  }

  .scoreboard > i {
    width: 23px;
    height: 23px;
    font-size: 7px;
  }

  .scoreboard div > strong {
    font-size: 11px;
  }

  .scoreboard small {
    font-size: 8px;
  }

  .scoreboard .preseason-note {
    margin-right: -14px;
    margin-left: -14px;
  }
}

/* Light broadcast treatment: prominent without becoming a dark visual block. */
.scoreboard {
  border: 1px solid #cddbd2;
  border-top: 4px solid var(--green);
  background:
    radial-gradient(circle at 50% -40%, #dfeee5 0, transparent 46%),
    linear-gradient(145deg, #fffefa, #f4f8f4);
  color: var(--ink);
  box-shadow: 0 16px 34px #173b2518, 0 3px 8px #173b2510;
}

.scoreboard::before {
  content: none;
}

.scoreboard-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 11px;
  border-bottom: 1px solid #dbe4de;
}

.scoreboard .scoreboard-heading > span {
  color: var(--green);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .18em;
}

.matchup-state {
  color: #6f7e76;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}

.live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ba3e37;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

.live-indicator i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d64d45;
  box-shadow: 0 0 0 4px #d64d4518;
}

.scoreboard div > span,
.scoreboard small {
  color: #738078;
}

.scoreboard div > strong,
.scoreboard > b {
  color: var(--ink);
}

.scoreboard > i {
  border-color: #cfdad3;
  background: white;
  color: #75837b;
}

.scoreboard .win-meter {
  border-top-color: #dbe4de;
}

.scoreboard .win-meter > div:first-child span {
  color: #52635a;
}

.scoreboard .win-track {
  background: #d8e5dc;
  box-shadow: inset 0 1px 2px #173b2518;
}

.scoreboard .win-track i {
  background: linear-gradient(90deg, #88acc5, #b4cedd);
}

.scoreboard .preseason-note {
  border-top-color: #dbe4de;
  background: #eaf3ed;
  color: #617168;
}
