/* Broadcast graphics share their accent with the arena media surfaces. */
.kings-enabled { --kb-accent: #f3c46b; --kb-font: Impact, "Arial Narrow", "Roboto Condensed", sans-serif; }
/* Scoreboard, broadcast style: one bar, clock under the centre, per-team flags and events. */
.kings-enabled { --kb-card: #3fe0a4; --kb-pres: #34a9ff; --kb-yellow: #f4e53a; --kb-red: #e4262f; }
.scoreboard.kings-enabled { top: 20px; height: 40px; width: 300px; padding: 0 9px; border: 0; border-radius: 0; background: #050609; backdrop-filter: none; box-shadow: 0 3px 12px #0008; display: grid; grid-template-columns: 1fr 108px 1fr; gap: 1px; transform: translateX(-50%) skew(-3deg); }
.scoreboard.kings-enabled::before { content: none; }
.scoreboard.kings-enabled::after { content: ""; position: absolute; height: 3px; left: 0; right: 0; bottom: 0; background: linear-gradient(90deg, #2e9ee9 0 32%, transparent 32% 68%, #e5e8ee 68%); }
.scoreboard.kings-enabled .score-team { font: 21px/.9 var(--kb-font); letter-spacing: .15px; gap: 7px; justify-content: center; transform: skew(3deg); }
.scoreboard.kings-enabled .score-team-home { flex-direction: row-reverse; }
.scoreboard.kings-enabled .score-team-away { flex-direction: row-reverse; }
.scoreboard.kings-enabled .score-team img { width: 30px; height: 30px; object-fit: contain; filter: drop-shadow(0 1px 1px #000); }
.scoreboard.kings-enabled .score-numbers { margin: 0; gap: 12px; justify-content: center; font: 35px/1 var(--kb-font); letter-spacing: -.3px; transform: skew(3deg); }
.scoreboard.kings-enabled .score-divider { color: #e4c57e; width: 23px; height: 25px; font-size: inherit; transform: none; flex: 0 0 23px; }
.scoreboard.kings-enabled .score-divider svg { width: 100%; height: 100%; fill: currentColor; }
.scoreboard.kings-enabled .match-clock { position: absolute; margin: 0; padding: 5px 6px 4px; border: 0; width: 86px; left: calc(50% - 43px); top: 40px; background: #242529; color: #f5f5f5; text-align: center; font: 19px/1 var(--kb-font); letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.kb-side { position: absolute; top: 0; height: 40px; display: flex; align-items: center; gap: 5px; }
.kb-side-home { right: calc(100% + 5px); flex-direction: row-reverse; }
.kb-side-away { left: calc(100% + 5px); }
.kb-flags { display: flex; gap: 4px; }
.kb-side-home .kb-flags { flex-direction: row-reverse; }
.kb-flag { display: block; width: 13px; height: 28px; box-shadow: 0 2px 6px #0007; }
.kb-flag[hidden] { display: none; }
.kb-flag-card { background: var(--kb-card); }
.kb-flag-president { background: var(--kb-pres); }
.kb-team-events { display: flex; gap: 5px; }
.kb-side-home .kb-team-events { flex-direction: row-reverse; }
.kb-team-event { display: flex; align-items: center; gap: 9px; height: 30px; max-width: 230px; padding: 0 12px; color: #08090b; background: #e9ecf1; font: 18px/1 var(--kb-font); letter-spacing: .3px; white-space: nowrap; box-shadow: 0 2px 8px #0006; }
.kb-team-event > span { transform: skew(3deg); }
.kb-ev-label { overflow: hidden; text-overflow: ellipsis; }
.kb-ev-timer { font-variant-numeric: tabular-nums; }
.kb-ev-timer[hidden] { display: none; }
.kb-team-event[data-kind="yellow"] { background: var(--kb-yellow); }
.kb-team-event[data-kind="red"] { background: var(--kb-red); color: #fff; }
.kb-team-event[data-kind="card"] { background: var(--kb-card); }
.kb-team-event[data-kind="president"] { background: var(--kb-pres); color: #04121e; }
.kb-format { position: absolute; top: 66px; left: 50%; transform: translateX(-50%) skew(3deg); padding: 5px 11px 4px; background: var(--kb-accent); color: #0b0d12; font: 14px/1 var(--kb-font); letter-spacing: .6px; white-space: nowrap; box-shadow: 0 2px 8px #0006; }
.kb-format[hidden] { display: none; }
.kb-enter { animation: kb-enter .38s cubic-bezier(.2,.8,.2,1) both; }
@keyframes kb-enter { from { clip-path: inset(0 100% 0 0); opacity: .4; } to { clip-path: inset(0 0 0 0); opacity: 1; } }
/* M14: troca de goleiro (discreto, na cor neutra do placar) e contagem antes da bola liberada */
.kb-team-event[data-kind="sub"] { background: #e9ecf1; color: #08090b; }
.kb-team-event[data-kind="sub"]::before { content: "⇄"; font: 15px/1 system-ui, sans-serif; margin-right: -2px; }
.kb-countdown { position: absolute; left: 50%; top: 60%; transform: translateX(-50%); pointer-events: none; }   /* 7ª rodada: abaixo do centro; em cima cobria a gaiola e a bola caindo */
.kb-count { display: block; min-width: 1.3em; padding: 4px 22px 0; background: #07090cdf; color: var(--kb-accent); border-bottom: 3px solid var(--kb-accent); font: clamp(48px, 7.2vw, 96px)/1 var(--kb-font); letter-spacing: -1px; text-align: center; font-variant-numeric: tabular-nums; transform: skew(3deg); box-shadow: 0 6px 22px #0008; }
.kb-countdown[data-go="true"] .kb-count { font-size: clamp(34px, 5.2vw, 70px); padding: 10px 24px 6px; color: #081014; background: var(--kb-accent); }
.kb-count-pop { animation: kb-count-pop .32s cubic-bezier(.25, 1, .5, 1); }
@keyframes kb-count-pop { from { opacity: .2; transform: skew(3deg) scale(1.35); } to { opacity: 1; transform: skew(3deg) scale(1); } }
/* M15: o placar pulsa na explosão da torcida do gol (instante medido do goal.mp3) */
.kb-goal-pulse { animation: kb-goal-pulse .9s cubic-bezier(.2, .9, .3, 1.1); transform-origin: 50% 55%; }
@keyframes kb-goal-pulse { 0% { transform: scale(1); } 16% { transform: scale(1.3); color: var(--kb-accent, #ffd166); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .kb-enter, .kb-count-pop, .kb-goal-pulse { animation: none; } }
.kings-enabled .broadcast-label { top: 29px; font-size: 11px; letter-spacing: .6px; }
.kings-broadcast { position: absolute; inset: 0; z-index: 4; pointer-events: none; overflow: hidden; user-select: none; }
.kb-event-title { position: absolute; left: 4.2%; bottom: 15.5%; display: flex; flex-direction: column; align-items: flex-start; gap: 0; max-width: 66%; opacity: 0; filter: drop-shadow(0 3px 12px #0008); }
.kb-event-kicker { display: flex; align-items: center; gap: 7px; padding: 6px 10px 6px 8px; background: #080a10ed; color: #f1f3f5; font: 13px/1 var(--kb-font); letter-spacing: .6px; }
.kb-mini-crown { color: var(--kb-accent); width: 14px; height: 14px; }
.kb-mini-crown svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.kb-speed { border-left: 1px solid #ffffff3d; padding-left: 8px; color: var(--kb-accent); letter-spacing: 0; }
.kb-title { display: block; max-width: 100%; margin-left: 0; padding: 9px 18px 6px 14px; background: var(--kb-accent); color: #081014; font: clamp(25px, 3.7vw, 55px)/1 var(--kb-font); letter-spacing: -.35px; text-transform: uppercase; overflow-wrap: break-word; }
.kb-subtitle { display: block; background: #080a10ed; color: #fff; padding: 8px 13px; font: clamp(12px, 1.4vw, 19px)/1.08 var(--kb-font); letter-spacing: .35px; }
.kb-title-line { width: 44px; height: 3px; background: var(--kb-accent); margin-top: 4px; }
.kb-card-fan { position: absolute; right: 13%; bottom: 17%; width: 100px; height: 148px; opacity: 0; color: var(--kb-accent); filter: drop-shadow(0 6px 9px #000a); }
.kb-fan-card { position: absolute; inset: 0; transform-origin: center bottom; }
.kb-fan-card svg { width: 100%; height: 100%; overflow: visible; }
.kb-card-face { fill: #0b171b; stroke: currentColor; stroke-width: 2; }
.kb-card-inset { fill: none; stroke: currentColor; stroke-width: .6; opacity: .6; }
.kb-card-back { fill: currentColor; opacity: .8; }
.kb-card-front { display: none; }
.kb-fan-center { z-index: 2; }
.kb-fan-center .kb-card-back { display: none; }
.kb-fan-center .kb-card-front { display: block; }
.kb-card-label { position: absolute; top: 22px; left: 8px; right: 8px; color: #d6fff5; text-align: center; font: 12px/1 var(--kb-font); }
.kb-replay-frame { position: absolute; inset: 7px; border: 2px solid #eb233e; box-shadow: inset 0 0 0 1px #090608; }
.kb-replay-frame > span { position: absolute; left: 16px; bottom: 16px; background: linear-gradient(110deg,#0b090e 76%,#b8142a 76%); font: 24px/1 var(--kb-font); color: #fff; padding: 9px 38px 9px 14px; }
.kb-replay-frame i { color: #fff; font-family: system-ui, sans-serif; font-style: normal; padding-left: 8px; }
.kb-matchball { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 44px 20px; min-width: 38%; max-width: 88%; color: #fff; text-align: center; background: linear-gradient(180deg, #120a1ef2, #07050cf2); border-top: 3px solid var(--kb-accent); border-bottom: 3px solid var(--kb-accent); box-shadow: 0 0 0 1px #b071ff33, 0 10px 40px #000c; }
.kb-matchball[hidden] { display: none; }
.kb-mb-kicker { display: flex; align-items: center; gap: 7px; color: var(--kb-accent); font: 14px/1 var(--kb-font); letter-spacing: 1.6px; }
.kb-mb-kicker svg { width: 16px; height: 15px; fill: currentColor; }
.kb-matchball strong { font: clamp(40px, 7.4vw, 104px)/.95 var(--kb-font); letter-spacing: -.5px; }
.kb-mb-target { background: var(--kb-accent); color: #140a22; padding: 7px 16px 6px; font: clamp(18px, 2.4vw, 30px)/1 var(--kb-font); letter-spacing: .3px; }
.kb-mb-score { color: #e9ddff; font: clamp(15px, 1.7vw, 22px)/1 var(--kb-font); letter-spacing: .8px; white-space: nowrap; }
.kb-final { position: absolute; left: 50%; bottom: 14%; transform: translateX(-50%); min-width: 44%; max-width: 85%; display: flex; align-items: center; flex-direction: column; gap: 5px; padding: 12px 36px 16px; color: #fff; background: #07090cef; border-top: 2px solid var(--kb-accent); box-shadow: 0 5px 20px #0007; text-align: center; }
.kb-final > span { color: var(--kb-accent); font: 14px/1 var(--kb-font); letter-spacing: 1.5px; }
.kb-final-result { white-space: nowrap; font: clamp(23px, 4vw, 53px)/1.2 var(--kb-font); }
.kb-final-detail { color: #dfded9; font: 15px/1.1 var(--kb-font); letter-spacing: .6px; }
@media (max-width: 1100px) {
  .scoreboard.kings-enabled { width: 280px; grid-template-columns: 1fr 96px 1fr; }
  .scoreboard.kings-enabled .score-team { font-size: 19px; gap: 5px; }
  .scoreboard.kings-enabled .score-team img { width: 27px; height: 27px; }
  .scoreboard.kings-enabled .score-numbers { font-size: 32px; gap: 10px; }
  .kb-team-event { height: 27px; font-size: 16px; padding: 0 10px; max-width: 180px; }
  .kings-enabled .broadcast-label { top: 88px; }
}
@media (max-width: 720px) {
  .scoreboard.kings-enabled { top: 14px; width: 256px; grid-template-columns: 1fr 88px 1fr; height: 36px; padding: 0 7px; }
  .scoreboard.kings-enabled .score-team { font-size: 17px; gap: 4px; }
  .scoreboard.kings-enabled .score-team img { width: 24px; height: 24px; }
  .scoreboard.kings-enabled .score-numbers { font-size: 29px; gap: 8px; }
  .scoreboard.kings-enabled .score-divider { width: 19px; height: 21px; flex-basis: 19px; }
  .scoreboard.kings-enabled .match-clock { top: 36px; width: 76px; left: calc(50% - 38px); font-size: 17px; padding: 4px 5px 3px; }
  /* Phones: the flags stay at the ends of the bar; each team's events hang under its half. */
  .kb-side { height: 36px; }
  .kb-side-home { right: calc(100% + 4px); }
  .kb-side-away { left: calc(100% + 4px); }
  .kb-flags { gap: 3px; }
  .kb-flag { width: 8px; height: 24px; }
  .kb-team-events { position: absolute; top: 64px; flex-direction: column; gap: 4px; }
  .kb-side-home .kb-team-events { left: calc(100% + 4px); flex-direction: column; align-items: flex-start; }
  .kb-side-away .kb-team-events { right: calc(100% + 4px); align-items: flex-end; }
  .scoreboard.kb-has-center .kb-team-events { top: 88px; }
  .kb-team-event { height: 24px; font-size: 13px; padding: 0 8px; gap: 6px; max-width: 150px; }
  .kb-format { top: 60px; font-size: 12px; padding: 4px 9px 3px; }
  .kings-enabled .broadcast-label { top: 123px; font-size: 11px; left: 13px; }
  .kings-enabled .performance { top: 123px; }
  .kb-event-title { left: 5%; bottom: 16%; max-width: 86%; }
  .kb-event-kicker { font-size: 11px; }
  .kb-title { font-size: clamp(24px, 7.1vw, 37px); padding: 8px 12px; }
  .kb-subtitle { font-size: 12px; padding: 7px 10px; }
  .kb-card-fan { right: 13%; bottom: 39%; width: 72px; height: 105px; }
  .kb-card-label { top: 15px; font-size: 11px; }
  .kb-final { bottom: 18%; padding: 11px 15px; min-width: 75%; }
  .kb-matchball { padding: 14px 18px 16px; min-width: 78%; }
  .kb-mb-kicker { font-size: 12px; }
  .kb-final-detail { font-size: 12px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .scoreboard.kings-enabled { top: 9px; transform: translateX(-50%) skew(-3deg) scale(.82); transform-origin: top center; }
  .kings-enabled .broadcast-label { top: 20px; }
  .kb-event-title { bottom: 17%; }
  .kb-title { font-size: 28px; }
  .kb-event-kicker { font-size: 11px; padding: 4px 8px; }
  .kb-subtitle { padding: 5px 10px; font-size: 12px; }
  .kb-card-fan { width: 65px; height: 96px; }
  .kb-card-label { top: 14px; font-size: 11px; }
}
