/* Battlefield: a broadcast-style scoreboard. One loud element (your scoreboard),
 * everything else compact. Scoped to the Battlefield view only. */

.live-score-view { --sb-gold: #ffcf4a; --sb-silver: #d9e0ea; --sb-bronze: #e09a5a; }
.live-score-view .num, .live-score-view .my-battle-stats strong, .live-score-view .spectator-entry > summary span,
.live-score-view .live-game-team strong, .live-score-view .my-battle-position strong, .live-score-view .live-position em { font-variant-numeric: tabular-nums; }

/* Header: the banner shrinks to a title line; the contest switcher sticks. */
.live-score-view .battle-intro { margin-bottom: 10px; }
.live-score-view .battle-intro > summary { min-height: 0; padding: 10px 14px; }
.live-score-view .battle-intro > summary h2 { font-size: clamp(20px, 2.6vw, 28px); }
.live-score-view .battle-intro > summary img { width: 30px; height: 30px; }
.live-score-view > .battle-contest-nav { position: sticky; top: 0; z-index: 30; margin: 0 0 14px; padding: 8px; border-radius: 14px;
  background: rgba(10, 10, 18, .92); backdrop-filter: blur(14px); box-shadow: 0 10px 24px rgba(0, 0, 0, .35); }
.live-score-view > .battle-contest-nav .battle-contest-nav-heading { display: none; }
.live-score-view > .battle-contest-nav .battle-contest-links { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.live-score-view > .battle-contest-nav .battle-contest-links::-webkit-scrollbar { display: none; }
.live-score-view > .battle-contest-nav .battle-contest-links button { flex: 1 0 auto; min-height: 44px; padding: 6px 14px; border-width: 1px; border-radius: 10px; text-align: center; white-space: nowrap; }
.live-score-view > .battle-contest-nav .battle-contest-links button::before { content: none; }
.live-score-view > .battle-contest-nav .battle-contest-links button[aria-current=location] { box-shadow: inset 0 -3px #6ef1ff, 0 0 18px #35d4ff33; }
.live-score-view > .battle-contest-nav .battle-contest-links button small,
.live-score-view > .battle-contest-nav .battle-contest-links button [data-battle-caption] { display: none; }

/* Your scoreboard: the one big moment on the page. */
.live-score-view #myBattle > summary { padding-block: 6px; }
.live-score-view #myBattle > summary h3, .live-score-view #myBattle > summary h2 { font-size: clamp(18px, 2.2vw, 24px); }
.live-score-view .my-battle-card { position: relative; overflow: hidden; padding: 18px 20px; border-radius: 18px;
  border: 1px solid rgba(97, 255, 137, .35);
  background: radial-gradient(120% 140% at 0% 0%, rgba(155, 77, 255, .28), transparent 55%), radial-gradient(90% 120% at 100% 0%, rgba(53, 212, 255, .16), transparent 60%), #0d0d17; }
.live-score-view .my-battle-card header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.live-score-view .my-battle-card header h3 { margin: 2px 0 0; font-size: 18px; }
.live-score-view .my-battle-stats { display: grid; grid-template-columns: auto 1fr; gap: 6px 28px; align-items: end; margin: 12px 0 6px; }
.live-score-view .my-battle-stats > div { display: grid; gap: 0; }
.live-score-view .my-battle-stats span { color: var(--muted); font-size: 13px; }
.live-score-view .my-battle-stats strong { font-family: var(--heading); font-size: clamp(48px, 7vw, 76px); line-height: .95; letter-spacing: -.02em; color: var(--green);
  text-shadow: 0 0 28px rgba(97, 255, 137, .35); }
.live-score-view .my-battle-stats > div:first-child strong { color: var(--text); text-shadow: 0 0 28px rgba(155, 77, 255, .5); }
.live-score-view .my-battle-stats small { color: var(--cyan); font-weight: 700; }
.live-score-view .my-battle-change { margin: 4px 0; color: var(--amber); font-weight: 700; }
.live-score-view .my-battle-card .microcopy { margin: 2px 0 12px; font-size: 12px; opacity: .7; }
/* Lineup as a compact grid of position tiles instead of a tall list. */
.live-score-view .my-battle-positions { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.live-score-view .my-battle-position { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 0; padding: 8px 10px;
  border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, .03); }
.live-score-view .my-battle-position > div { display: grid; min-width: 0; }
.live-score-view .my-battle-position > div strong { font-size: 13px; white-space: nowrap; }
.live-score-view .my-battle-position > div small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.live-score-view .my-battle-position > strong { font-family: var(--heading); font-size: 20px; color: var(--green); }
.live-score-view .result-chip { position: relative; padding-left: 18px; }
.live-score-view .result-chip::before { content: ""; position: absolute; left: 7px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%;
  background: var(--green); box-shadow: 0 0 0 0 rgba(97, 255, 137, .7); animation: sb-live 1.6s ease-out infinite; }

/* Games: one swipeable strip instead of a tall grid. */
.live-score-view .battlefield-score-panel > summary { padding-block: 6px; }
.live-score-view .battlefield-score-panel > summary h3, .live-score-view .battlefield-score-panel > summary h2 { font-size: clamp(18px, 2.2vw, 24px); }
.live-score-view #liveScoreGames { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(176px, 200px);
  gap: 8px; overflow-x: auto; padding: 2px 2px 10px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.live-score-view #liveScoreGames > * { scroll-snap-align: start; min-width: 0; }
.live-score-view #liveScoreGames .battle-game-with-gain:has(details[open]) { grid-column: span 2; }
.live-score-view #liveScoreGames .live-game { padding: 10px 12px; gap: 4px; border-radius: 12px; }
.live-score-view #liveScoreGames .live-game-status small { display: none; }
.live-score-view #liveScoreGames .live-game-team strong { font-family: var(--heading); font-size: 22px; }
.live-score-view #liveScoreGames .live-game-clock { font-size: 18px; }
.live-score-view #liveScoreGames .battle-game-hint { font-size: 11px; opacity: .75; }
.live-score-view #liveScoreGames .game-gain-ribbon.is-waiting { display: none; }
.live-score-view .live-game.is-live { border-color: rgba(97, 255, 137, .6); box-shadow: inset 0 0 0 1px rgba(97, 255, 137, .18), 0 0 22px rgba(97, 255, 137, .12); }
.live-score-view .live-game.is-live .live-game-period::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%;
  vertical-align: middle; background: var(--green); animation: sb-live 1.6s ease-out infinite; }

/* Standings: one tight line per knight, medals for the podium, your row lit. */
.live-score-view .spectator-standings { display: grid; gap: 4px; }
.live-score-view .spectator-entry { border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, .02); }
.live-score-view .spectator-entry > summary { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px;
  min-height: 44px; padding: 6px 12px; cursor: pointer; list-style: none; }
.live-score-view .spectator-entry > summary::-webkit-details-marker { display: none; }
.live-score-view .spectator-entry > summary b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px;
  background: rgba(255, 255, 255, .06); color: var(--text); font-family: var(--heading); font-size: 15px; }
.live-score-view .spectator-entry > summary strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.live-score-view .spectator-entry > summary span { color: var(--cyan); font-family: var(--heading); font-size: 17px; white-space: nowrap; }
.live-score-view .spectator-standings > .spectator-entry:nth-child(1) > summary b { background: var(--sb-gold); color: #241800; }
.live-score-view .spectator-standings > .spectator-entry:nth-child(2) > summary b { background: var(--sb-silver); color: #15181e; }
.live-score-view .spectator-standings > .spectator-entry:nth-child(3) > summary b { background: var(--sb-bronze); color: #2a1404; }
.live-score-view .spectator-entry.is-you { border-color: rgba(155, 77, 255, .8); background: linear-gradient(90deg, rgba(155, 77, 255, .22), rgba(155, 77, 255, .04));
  box-shadow: 0 0 24px rgba(155, 77, 255, .22); }
.live-score-view .spectator-entry .spectator-lineup { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; padding: 0 12px 12px; }
.live-score-view .spectator-entry .live-position { display: grid; grid-template-columns: 1fr auto; gap: 0 6px; padding: 6px 8px; border-radius: 8px; background: rgba(255, 255, 255, .04); }
.live-score-view .spectator-entry .live-position small { grid-column: 1; color: var(--muted); font-size: 11px; }
.live-score-view .spectator-entry .live-position em { grid-row: 1 / span 2; grid-column: 2; align-self: center; font-style: normal; font-weight: 800; color: var(--green); }

/* Points landing: a quick flash where the score actually changed. */
.live-score-view .live-position.is-updated, .live-score-view .carnage-score-updated { animation: sb-flash 1.4s ease-out 1; }
.live-score-view .live-position-delta { margin-left: 4px; color: var(--green); font-style: normal; font-weight: 800; animation: sb-pop .5s cubic-bezier(.2, 1.6, .4, 1) 1; }
@keyframes sb-live { 0% { box-shadow: 0 0 0 0 rgba(97, 255, 137, .65); } 100% { box-shadow: 0 0 0 9px rgba(97, 255, 137, 0); } }
@keyframes sb-flash { 0% { background: rgba(97, 255, 137, .45); box-shadow: 0 0 22px rgba(97, 255, 137, .55); } 100% { background: rgba(255, 255, 255, .04); box-shadow: none; } }
@keyframes sb-pop { from { opacity: 0; transform: translateY(6px) scale(.7); } }

/* Section headings stay short; their explanations recede. */
.live-score-view #myBattle > summary p, .live-score-view .battlefield-score-panel > summary p { margin: 2px 0 0; font-size: 12px; opacity: .65; }
@media (max-width: 700px) { .live-score-view #myBattle > summary p, .live-score-view .battlefield-score-panel > summary p { display: none; } }

/* Prime-Time Joust: the night game as a marquee matchup. */
.live-score-view .primetime-joust > summary { padding-block: 6px; }
.live-score-view .primetime-joust > summary h3, .live-score-view .primetime-joust > summary h2 { font-size: clamp(18px, 2.2vw, 24px); }
.live-score-view .primetime-game-grid .live-game { display: grid; grid-template-columns: 1fr auto 1fr; grid-template-areas: "status status status" "away clock home";
  align-items: center; gap: 6px 14px; padding: 16px 18px; border-radius: 16px; text-align: center;
  background: radial-gradient(90% 120% at 50% 0%, rgba(255, 191, 55, .2), transparent 60%), #0d0d17; border: 1px solid rgba(255, 191, 55, .45); }
.live-score-view .primetime-game-grid .live-game-status { grid-area: status; display: flex; justify-content: center; gap: 10px; align-items: baseline; }
.live-score-view .primetime-game-grid .live-game-period { color: var(--amber); font-family: var(--heading); font-size: 22px; }
.live-score-view .primetime-game-grid .live-game-team { display: grid; justify-items: center; gap: 2px; }
.live-score-view .primetime-game-grid .live-game-team:nth-of-type(2) { grid-area: away; }
.live-score-view .primetime-game-grid .live-game-team:nth-of-type(3) { grid-area: home; }
.live-score-view .primetime-game-grid .live-game-team span { font-family: var(--heading); font-size: clamp(34px, 5vw, 48px); letter-spacing: .02em; line-height: 1; }
.live-score-view .primetime-game-grid .live-game-team strong { font-family: var(--heading); font-size: 28px; color: var(--green); }
.live-score-view .primetime-game-grid .live-game::after { content: "at"; grid-area: clock; color: var(--muted); font-size: 14px; }
.live-score-view .primetime-game-grid .live-game.is-live::after { content: none; }
.live-score-view .primetime-game-grid .battle-game-hint { grid-column: 1 / -1; }
.live-score-view .primetime-joust .joust-position-list .joust-position-row { padding-block: 3px; }

/* Curated Carnage: each showdown opens with its matchup, then the picks. */
.live-score-view #curatedCarnage .carnage-admin-tournament { margin: 0 0 12px; overflow: hidden; border: 1px solid rgba(255, 85, 184, .45); border-radius: 16px;
  background: radial-gradient(110% 140% at 100% 0%, rgba(255, 85, 184, .16), transparent 55%), #0d0d17; }
.live-score-view #curatedCarnage .carnage-matchup { display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "teams pot state" "meta meta meta" "ticket ticket ticket";
  align-items: center; gap: 4px 16px; padding: 14px 16px; cursor: pointer; list-style: none; }
.live-score-view #curatedCarnage .carnage-matchup::-webkit-details-marker { display: none; }
.live-score-view #curatedCarnage .carnage-matchup-teams { grid-area: teams; display: flex; align-items: baseline; gap: 10px; }
.live-score-view #curatedCarnage .carnage-matchup-teams b { font-family: var(--heading); font-size: clamp(28px, 4.4vw, 40px); line-height: 1; color: var(--text); }
.live-score-view #curatedCarnage .carnage-matchup-teams i { color: var(--muted); font-size: 14px; font-style: normal; }
.live-score-view #curatedCarnage .carnage-matchup-meta { grid-area: meta; color: var(--muted); font-size: 13px; }
.live-score-view #curatedCarnage .carnage-matchup-pot { grid-area: pot; justify-self: end; color: var(--amber); font-weight: 800; text-align: right; }
.live-score-view #curatedCarnage .carnage-matchup-state { grid-area: state; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.live-score-view #curatedCarnage .carnage-matchup-state.is-open { background: rgba(53, 212, 255, .15); color: var(--cyan); }
.live-score-view #curatedCarnage .carnage-matchup-state.is-live { background: rgba(97, 255, 137, .16); color: var(--green); }
.live-score-view #curatedCarnage .carnage-matchup-state.is-live::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%;
  vertical-align: middle; background: var(--green); animation: sb-live 1.6s ease-out infinite; }
.live-score-view #curatedCarnage .carnage-matchup-state.is-final { background: rgba(255, 255, 255, .06); color: var(--muted); }
.live-score-view #curatedCarnage .carnage-admin-tournament > p { margin: 0 16px 8px; color: var(--muted); font-size: 12px; }
.live-score-view #curatedCarnage .carnage-entry { margin: 0 16px 16px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .02); }
.live-score-view #curatedCarnage .carnage-entry h4 { margin: 0 0 10px; font-size: 18px; }
.live-score-view #curatedCarnage .carnage-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; align-items: end; }
.live-score-view #curatedCarnage .carnage-fields > label { display: grid; gap: 4px; font-size: 12px; font-weight: 800; color: var(--muted); }
.live-score-view #curatedCarnage .carnage-fields > label:first-child { color: var(--amber); }
.live-score-view #curatedCarnage .carnage-fields > label:first-child select { border-color: rgba(255, 191, 55, .7); box-shadow: 0 0 14px rgba(255, 191, 55, .18); }
.live-score-view #curatedCarnage .carnage-live-hero strong { font-family: var(--heading); font-size: clamp(36px, 6vw, 56px); line-height: 1; color: var(--green); }
.live-score-view #curatedCarnage .carnage-create { margin-top: 6px; border: 1px dashed var(--line-strong); border-radius: 12px; }
.live-score-view #curatedCarnage .carnage-create > summary { padding: 12px 16px; color: var(--muted); font-weight: 800; cursor: pointer; }

@media (max-width: 700px) {
  .live-score-view #curatedCarnage .carnage-matchup { grid-template-columns: 1fr auto; grid-template-areas: "teams state" "pot pot" "meta meta" "ticket ticket"; }
  .live-score-view #curatedCarnage .carnage-matchup-pot { justify-self: start; text-align: left; }
  .live-score-view .battle-intro > summary h2 { font-size: 20px; white-space: nowrap; }
  .live-score-view #myBattle, .live-score-view .battlefield-score-panel { padding: 10px; }
  .live-score-view .my-battle-card { padding: 14px; }
  .live-score-view .my-battle-positions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .live-score-view .my-battle-position { padding: 7px 8px; }
  .live-score-view .my-battle-position > strong { font-size: 17px; }
  .live-score-view .my-battle-stats { gap: 4px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .live-score-view *, .live-score-view *::before { animation: none !important; }
}
/* Before kickoff, the marquee shows the matchup, not empty score dashes. */
.live-score-view .primetime-game-grid .live-game.is-scheduled .live-game-team strong { display: none; }

/* Curated Carnage: Golden Ticket emphasis */
.live-score-view #curatedCarnage .carnage-ticket-ribbon { grid-area: ticket; justify-self: start; padding: 3px 10px; border: 1px solid rgba(255, 191, 55, .55); border-radius: 999px; background: rgba(255, 191, 55, .1); color: #ffd76b; font-size: 12px; font-weight: 800; }
