/* =========================================================
   DESAFIO DOS PENÁLTIS V3 — CSS ISOLADO
   Carregado DEPOIS do style.css para neutralizar a versão antiga.
   ========================================================= */

.penalties-page-v3 {
  background:
    radial-gradient(circle at 50% -12%, rgba(54, 167, 255, .14), transparent 34%),
    linear-gradient(180deg, #020c16 0%, #03111e 58%, #020a12 100%) !important;
}

.penalties-page-v3 .penalties-main-v3 {
  width: min(1540px, calc(100vw - 32px));
  margin: 0 auto;
  padding: 108px 0 38px !important;
}

.penalties-page-v3 .penalties-titlebar-v3 {
  min-height: 86px !important;
  margin: 0 0 18px !important;
  padding: 0 10px !important;
  align-items: flex-end !important;
  overflow: visible !important;
}

.penalties-page-v3 .penalties-titlebar-v3 h1 {
  margin: 6px 0 0 !important;
  font-size: clamp(34px, 4vw, 58px) !important;
  line-height: 1.02 !important;
  letter-spacing: -2.4px !important;
  white-space: normal !important;
  overflow: visible !important;
}

.penalties-page-v3 .penalties-titlebar-v3 .blackjack-back,
.penalties-page-v3 .penalties-titlebar-v3 .blackjack-eyebrow {
  line-height: 1.2 !important;
}

.penalties-page-v3 .penalties-shell-v3 {
  display: grid !important;
  grid-template-columns: 280px minmax(620px, 1fr) 255px !important;
  gap: 0 !important;
  min-height: 730px !important;
  overflow: hidden !important;
  border: 1px solid rgba(87, 175, 230, .16) !important;
  border-radius: 28px !important;
  background: #041421 !important;
  box-shadow: 0 28px 75px rgba(0, 0, 0, .28) !important;
}

.penalties-page-v3 .penalties-controls-v3,
.penalties-page-v3 .penalties-history-panel-v3 {
  padding: 26px !important;
  background: linear-gradient(180deg, rgba(5, 22, 37, .98), rgba(3, 17, 29, .99)) !important;
}

.penalties-page-v3 .penalties-controls-v3 {
  border-right: 1px solid rgba(90, 177, 230, .12) !important;
}

.penalties-page-v3 .penalties-history-panel-v3 {
  border-left: 1px solid rgba(90, 177, 230, .12) !important;
}

/* ----- Controlo esquerdo ----- */
.penalties-page-v3 .penalties-bet-row {
  grid-template-columns: repeat(4, 1fr) !important;
}

.penalties-page-v3 .penalty-start-btn {
  position: relative !important;
  width: 100% !important;
  min-height: 68px !important;
  margin-top: 14px !important;
  display: grid !important;
  place-content: center !important;
  gap: 2px !important;
  overflow: hidden !important;
  border: 1px solid rgba(117, 213, 255, .34) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #36b9f1, #167cb8) !important;
  color: white !important;
  box-shadow: 0 14px 34px rgba(16, 128, 191, .24) !important;
  cursor: pointer !important;
}

.penalties-page-v3 .penalty-start-btn::before {
  content: "" !important;
  position: absolute !important;
  inset: -35% auto -35% -40% !important;
  width: 35% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.38), transparent) !important;
  transform: rotate(15deg) !important;
  animation: pkButtonSheen 3s ease-in-out infinite !important;
}

@keyframes pkButtonSheen {
  0%, 58% { left: -42%; }
  100% { left: 130%; }
}

.penalties-page-v3 .penalty-start-btn span,
.penalties-page-v3 .penalty-start-btn small {
  position: relative !important;
  z-index: 1 !important;
}

.penalties-page-v3 .penalty-start-btn span {
  font-size: 14px !important;
  font-weight: 950 !important;
  letter-spacing: .7px !important;
}

.penalties-page-v3 .penalty-start-btn small {
  color: rgba(238, 250, 255, .74) !important;
  font-size: 8px !important;
  font-weight: 900 !important;
  letter-spacing: 1.45px !important;
}

.penalties-page-v3 .penalty-start-btn:disabled {
  opacity: .38 !important;
  cursor: not-allowed !important;
}

.penalties-page-v3 .penalty-message {
  min-height: 86px !important;
  margin-top: 14px !important;
}

.penalties-page-v3 .penalty-payout-card {
  margin-top: 14px !important;
  padding: 17px !important;
  border: 1px solid rgba(91, 180, 233, .12) !important;
  border-radius: 18px !important;
  background: rgba(5, 21, 35, .78) !important;
}

.penalties-page-v3 .penalty-card-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  margin-bottom: 9px !important;
}

.penalties-page-v3 .penalty-card-head span {
  color: #75d8ff !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 1.5px !important;
}

.penalties-page-v3 .penalty-card-head strong {
  color: #f0f8ff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}

.penalties-page-v3 .penalty-payout-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 39px !important;
  padding: 0 11px !important;
  margin-top: 6px !important;
  border: 1px solid rgba(86, 176, 230, .09) !important;
  border-radius: 10px !important;
  background: rgba(7, 30, 47, .72) !important;
}

.penalties-page-v3 .penalty-payout-row span {
  color: #9ebfd2 !important;
  font-size: 9px !important;
  font-weight: 900 !important;
}

.penalties-page-v3 .penalty-payout-row strong {
  color: #70dcff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
}

.penalties-page-v3 .penalty-payout-row.is-loss strong {
  color: #788e9e !important;
}

.penalties-page-v3 .penalty-payout-card > small {
  display: block !important;
  margin-top: 11px !important;
  color: #617f93 !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
}

/* =========================================================
   JOGO CENTRAL — deliberadamente simples como a referência.
   ========================================================= */
.penalties-page-v3 .pk-stage {
  position: relative !important;
  min-width: 0 !important;
  min-height: 730px !important;
  padding: 22px 22px 24px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(49, 130, 194, .11), transparent 31%),
    linear-gradient(180deg, #061827 0%, #04131f 100%) !important;
}

.penalties-page-v3 .pk-stage::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background-image:
    radial-gradient(circle, rgba(96, 184, 236, .18) 0 1px, transparent 1.5px) !important;
  background-size: 112px 112px !important;
  opacity: .26 !important;
}

.penalties-page-v3 .pk-stage > * {
  position: relative;
  z-index: 1;
}

.penalties-page-v3 .pk-hud {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  min-height: 78px !important;
  padding: 14px 18px !important;
  border: 1px solid rgba(101, 193, 248, .15) !important;
  border-radius: 20px !important;
  background: rgba(6, 25, 42, .82) !important;
}

.penalties-page-v3 .pk-brand {
  display: grid !important;
  gap: 4px !important;
}

.penalties-page-v3 .pk-brand span {
  color: #9ce4ff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: 2.2px !important;
}

.penalties-page-v3 .pk-brand small {
  color: #5d8298 !important;
  font-size: 7px !important;
  font-weight: 900 !important;
  letter-spacing: 1.3px !important;
}

.penalties-page-v3 .pk-score {
  display: grid !important;
  justify-items: center !important;
  gap: 1px !important;
  min-width: 116px !important;
}

.penalties-page-v3 .pk-score > span {
  color: #8bb5ce !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 1.65px !important;
  white-space: nowrap !important;
}

.penalties-page-v3 .pk-score strong {
  display: inline-flex !important;
  align-items: flex-end !important;
  gap: 4px !important;
  color: #fff !important;
  font-size: 42px !important;
  font-weight: 950 !important;
  line-height: .9 !important;
  white-space: nowrap !important;
  text-shadow: 0 0 20px rgba(116, 213, 255, .2) !important;
}

.penalties-page-v3 .pk-score strong small {
  color: #759cb4 !important;
  font-size: 16px !important;
  line-height: 1.05 !important;
}

.penalties-page-v3 .pk-status {
  justify-self: end !important;
  padding: 9px 13px !important;
  border: 1px solid rgba(113, 210, 255, .18) !important;
  border-radius: 999px !important;
  background: rgba(12, 53, 77, .52) !important;
  color: #a5e9ff !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 1px !important;
  white-space: nowrap !important;
}

.penalties-page-v3 .pk-progress-wrap {
  display: flex !important;
  justify-content: center !important;
  margin-top: 15px !important;
}

.penalties-page-v3 .pk-progress {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.penalties-page-v3 .pk-progress i {
  width: 36px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(83, 125, 153, .22) !important;
  box-shadow: inset 0 0 0 1px rgba(110, 192, 233, .1) !important;
}

.penalties-page-v3 .pk-progress i.is-goal {
  background: #4ee5a1 !important;
  box-shadow: 0 0 14px rgba(78, 229, 161, .45) !important;
}

.penalties-page-v3 .pk-progress i.is-miss {
  background: #f05d78 !important;
  box-shadow: 0 0 12px rgba(240, 93, 120, .35) !important;
}

.penalties-page-v3 .pk-game {
  position: relative !important;
  min-height: 555px !important;
  margin-top: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(86, 173, 228, .09) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% 23%, rgba(77, 146, 194, .08), transparent 27%),
    linear-gradient(180deg, rgba(4, 17, 28, .88), rgba(3, 12, 21, .96)) !important;
}

.penalties-page-v3 .pk-goal-wrap {
  position: absolute !important;
  left: 50% !important;
  top: 72px !important;
  width: min(86%, 680px) !important;
  transform: translateX(-50%) !important;
}

.penalties-page-v3 .pk-goal {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 2.7 / 1 !important;
  transform: none !important;
  overflow: hidden !important;
  border: 5px solid #f2f5f7 !important;
  border-radius: 8px !important;
  background: #07101b !important;
  box-shadow:
    0 0 0 5px rgba(0,0,0,.14),
    0 0 28px rgba(131, 216, 255, .08) !important;
}

.penalties-page-v3 .pk-goal::before,
.penalties-page-v3 .pk-goal::after {
  content: "" !important;
  position: absolute !important;
  z-index: 4 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 4px !important;
  height: auto !important;
  background: rgba(245, 248, 250, .92) !important;
  box-shadow: none !important;
}

.penalties-page-v3 .pk-goal::before { left: 33.333% !important; }
.penalties-page-v3 .pk-goal::after { right: 33.333% !important; }

.penalties-page-v3 .pk-net {
  position: absolute !important;
  z-index: 1 !important;
  inset: 0 !important;
  background:
    linear-gradient(rgba(255,255,255,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.10) 1px, transparent 1px) !important;
  background-size: 13px 13px !important;
  opacity: .38 !important;
  pointer-events: none !important;
}

.penalties-page-v3 .pk-goal.is-net-hit .pk-net {
  animation: pkNetHit .64s ease-out !important;
}

@keyframes pkNetHit {
  0% { transform: scale(1); filter: brightness(1); }
  24% { transform: scaleX(1.035) scaleY(.92); filter: brightness(1.7); }
  52% { transform: scaleX(.99) scaleY(1.02); }
  100% { transform: scale(1); filter: brightness(1); }
}

/* Keeper: SVG inteiro, sem peças CSS antigas. */
.penalties-page-v3 .pk-keeper {
  position: absolute !important;
  z-index: 7 !important;
  left: calc(50% - 58px) !important;
  bottom: 5px !important;
  top: auto !important;
  width: 116px !important;
  height: 158px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translate(0, 0);
  transform-origin: 50% 82% !important;
  filter: drop-shadow(0 0 18px rgba(58, 171, 255, .22)) !important;
  pointer-events: none !important;
}

.penalties-page-v3 .pk-keeper svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}

.penalties-page-v3 .pk-keeper.is-saving {
  filter: drop-shadow(0 0 24px rgba(145, 235, 255, .8)) brightness(1.18) !important;
}

/* Alvos */
.penalties-page-v3 .pk-target {
  position: absolute !important;
  z-index: 12 !important;
  display: block !important;
  width: 84px !important;
  height: 76px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  transform: none !important;
  cursor: pointer !important;
  transition: opacity .18s ease, filter .18s ease !important;
}

.penalties-page-v3 .pk-target span {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 50px !important;
  height: 50px !important;
  transform: translate(-50%, -50%) !important;
  border: 2px solid rgba(155, 83, 255, .9) !important;
  border-radius: 50% !important;
  background: rgba(91, 41, 145, .04) !important;
  box-shadow: 0 0 18px rgba(155, 83, 255, .22) !important;
  animation: pkTargetPulse 1.25s ease-in-out infinite !important;
}

.penalties-page-v3 .pk-target span::before {
  content: "" !important;
  position: absolute !important;
  inset: 10px !important;
  border: 1px solid rgba(218, 193, 255, .72) !important;
  border-radius: 50% !important;
}

.penalties-page-v3 .pk-target span::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 9px !important;
  height: 9px !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 50% !important;
  background: #a757ff !important;
  box-shadow: 0 0 14px rgba(167, 87, 255, .82) !important;
}

@keyframes pkTargetPulse {
  50% { transform: translate(-50%, -50%) scale(1.09); }
}

.penalties-page-v3 .pk-stage.is-ready-to-shoot .pk-target {
  opacity: .86 !important;
}

.penalties-page-v3 .pk-target:hover:not(:disabled) {
  opacity: 1 !important;
  filter: brightness(1.35) !important;
}

.penalties-page-v3 .pk-target:disabled {
  pointer-events: none !important;
}

.penalties-page-v3 .pk-tl { left: 7% !important; top: 8% !important; }
.penalties-page-v3 .pk-tr { right: 7% !important; top: 8% !important; }
.penalties-page-v3 .pk-c  { left: calc(50% - 42px) !important; top: 24% !important; }
.penalties-page-v3 .pk-bl { left: 7% !important; bottom: 6% !important; }
.penalties-page-v3 .pk-br { right: 7% !important; bottom: 6% !important; }

/* Bola: sem pedestal e sem ícones estranhos. */
.penalties-page-v3 .pk-ball {
  position: absolute !important;
  z-index: 15 !important;
  left: 50% !important;
  top: auto !important;
  bottom: 92px !important;
  width: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translate(-50%, -50%) scale(1) rotate(0deg);
  filter: drop-shadow(0 10px 12px rgba(0, 0, 0, .36));
}

.penalties-page-v3 .pk-ball::before,
.penalties-page-v3 .pk-ball::after {
  content: none !important;
  display: none !important;
}

.penalties-page-v3 .pk-ball img,
.penalties-page-v3 .pk-ball .pk-football-svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  pointer-events: none !important;
}

.penalties-page-v3 .pk-prompt {
  position: absolute !important;
  z-index: 10 !important;
  left: 50% !important;
  bottom: 18px !important;
  top: auto !important;
  width: min(400px, calc(100% - 32px)) !important;
  min-width: 0 !important;
  min-height: 64px !important;
  padding: 12px 18px !important;
  display: grid !important;
  place-content: center !important;
  gap: 3px !important;
  transform: translateX(-50%) !important;
  border: 1px solid rgba(91, 178, 229, .11) !important;
  border-radius: 14px !important;
  background: rgba(6, 22, 36, .78) !important;
  opacity: .55 !important;
  text-align: center !important;
}

.penalties-page-v3 .pk-prompt.is-active {
  opacity: 1 !important;
  border-color: rgba(109, 201, 249, .18) !important;
}

.penalties-page-v3 .pk-prompt strong {
  color: #f2f8fc !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: 1px !important;
}

.penalties-page-v3 .pk-prompt span {
  color: #6f93aa !important;
  font-size: 9px !important;
  font-weight: 700 !important;
}

/* GOAL / FALHOU no meio da baliza, como a referência. */
.penalties-page-v3 .pk-result {
  position: absolute !important;
  z-index: 30 !important;
  left: 50% !important;
  top: 17% !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) scale(.8) !important;
  color: #9a35ff !important;
  font-size: clamp(48px, 6vw, 84px) !important;
  font-weight: 950 !important;
  font-style: italic !important;
  line-height: 1 !important;
  letter-spacing: -3px !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: 0 8px 26px rgba(0,0,0,.42) !important;
  pointer-events: none !important;
}

.penalties-page-v3 .pk-result.is-visible {
  opacity: 1 !important;
  transform: translateX(-50%) scale(1) !important;
  animation: pkResultPop .42s cubic-bezier(.18,.9,.2,1.28) !important;
}

.penalties-page-v3 .pk-result.is-goal {
  color: #9839ff !important;
}

.penalties-page-v3 .pk-result.is-miss {
  color: #ff5d79 !important;
}

@keyframes pkResultPop {
  0% { transform: translateX(-50%) scale(.55) rotate(-4deg); opacity: 0; }
  70% { transform: translateX(-50%) scale(1.08) rotate(1deg); opacity: 1; }
  100% { transform: translateX(-50%) scale(1); opacity: 1; }
}

.penalties-page-v3 .pk-fx {
  position: absolute !important;
  z-index: 20 !important;
  inset: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.penalties-page-v3 .penalty-confetti {
  position: absolute !important;
  left: var(--x) !important;
  top: 22% !important;
  width: var(--size) !important;
  height: calc(var(--size) * 1.45) !important;
  border-radius: 2px !important;
  background: linear-gradient(180deg, #a43dff, #64d7ff) !important;
  animation: pkConfetti var(--duration) cubic-bezier(.2,.62,.18,1) var(--delay) forwards !important;
}

@keyframes pkConfetti {
  from { transform: translate3d(0,-10px,0) rotate(0deg); opacity: 0; }
  8% { opacity: 1; }
  to { transform: translate3d(var(--drift),340px,0) rotate(var(--rot)); opacity: 0; }
}

.penalties-page-v3 .pk-final {
  position: absolute !important;
  z-index: 40 !important;
  inset: 0 !important;
  display: grid !important;
  place-content: center !important;
  gap: 15px !important;
  padding: 28px !important;
  text-align: center !important;
  background: rgba(3, 14, 24, .94) !important;
  backdrop-filter: blur(7px) !important;
}

.penalties-page-v3 .pk-final[hidden] {
  display: none !important;
}

.penalties-page-v3 .pk-final > span {
  color: #7bd7ff !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 2px !important;
}

.penalties-page-v3 .pk-final h2 {
  margin: 0 !important;
  color: white !important;
  font-size: clamp(28px, 3.5vw, 46px) !important;
  font-weight: 950 !important;
}

.penalties-page-v3 .penalty-final-score strong {
  color: #84ddff !important;
  font-size: 70px !important;
  font-weight: 950 !important;
  line-height: .9 !important;
}

.penalties-page-v3 .penalty-final-score small {
  display: block !important;
  margin-top: 5px !important;
  color: #7196ad !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 1.4px !important;
}

.penalties-page-v3 .penalty-final-return {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(145px, 190px)) !important;
  justify-content: center !important;
  gap: 10px !important;
}

.penalties-page-v3 .penalty-final-return > div {
  padding: 13px !important;
  border: 1px solid rgba(91, 179, 233, .12) !important;
  border-radius: 14px !important;
  background: rgba(8, 30, 47, .75) !important;
}

.penalties-page-v3 .penalty-final-return span {
  color: #6f95ac !important;
  font-size: 8px !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
}

.penalties-page-v3 .penalty-final-return strong {
  display: block !important;
  margin-top: 5px !important;
  color: white !important;
  font-size: 24px !important;
  font-weight: 950 !important;
}

.penalties-page-v3 #penaltyPlayAgain {
  min-width: 250px !important;
  min-height: 52px !important;
  justify-self: center !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #e2f4ff !important;
  color: #061824 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.penalties-page-v3 .pk-stage.is-goal::after,
.penalties-page-v3 .pk-stage.is-save::after,
.penalties-page-v3 .pk-stage.is-miss::after {
  content: "" !important;
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  pointer-events: none !important;
  animation: pkStageFlash .65s ease-out !important;
}

.penalties-page-v3 .pk-stage.is-goal::after {
  background: radial-gradient(circle at 50% 42%, rgba(146, 55, 255, .16), transparent 36%) !important;
}

.penalties-page-v3 .pk-stage.is-save::after,
.penalties-page-v3 .pk-stage.is-miss::after {
  background: radial-gradient(circle at 50% 42%, rgba(255, 83, 119, .11), transparent 36%) !important;
}

@keyframes pkStageFlash {
  0% { opacity: 0; }
  20% { opacity: 1; }
  100% { opacity: 0; }
}

.penalties-page-v3 .penalties-history-panel-v3 .bj-history-list {
  max-height: 610px !important;
}

@media (max-width: 1280px) {
  .penalties-page-v3 .penalties-shell-v3 {
    grid-template-columns: 250px minmax(560px, 1fr) 225px !important;
  }

  .penalties-page-v3 .penalties-controls-v3,
  .penalties-page-v3 .penalties-history-panel-v3 {
    padding: 20px !important;
  }
}

@media (max-width: 1060px) {
  .penalties-page-v3 .penalties-shell-v3 {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }

  .penalties-page-v3 .penalties-controls-v3,
  .penalties-page-v3 .penalties-history-panel-v3 {
    border: 0 !important;
    border-bottom: 1px solid rgba(90, 177, 230, .12) !important;
  }

  .penalties-page-v3 .pk-stage {
    min-height: 710px !important;
  }
}

@media (max-width: 720px) {
  .penalties-page-v3 .penalties-main-v3 {
    width: calc(100vw - 14px) !important;
    padding-top: 96px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 h1 {
    font-size: 34px !important;
  }

  .penalties-page-v3 .pk-stage {
    min-height: 640px !important;
    padding: 12px !important;
  }

  .penalties-page-v3 .pk-hud {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
  }

  .penalties-page-v3 .pk-status {
    justify-self: center !important;
  }

  .penalties-page-v3 .pk-game {
    min-height: 470px !important;
  }

  .penalties-page-v3 .pk-goal-wrap {
    top: 66px !important;
    width: calc(100% - 18px) !important;
  }

  .penalties-page-v3 .pk-keeper {
    left: calc(50% - 48px) !important;
    width: 96px !important;
    height: 132px !important;
  }

  .penalties-page-v3 .pk-target {
    width: 66px !important;
    height: 62px !important;
  }

  .penalties-page-v3 .pk-target span {
    width: 42px !important;
    height: 42px !important;
  }

  .penalties-page-v3 .pk-tl { left: 3% !important; }
  .penalties-page-v3 .pk-tr { right: 3% !important; }
  .penalties-page-v3 .pk-bl { left: 3% !important; }
  .penalties-page-v3 .pk-br { right: 3% !important; }
  .penalties-page-v3 .pk-c { left: calc(50% - 33px) !important; }
}


/* =========================================================
   V4 FIXES — bola normal + final overlay isolado
   ========================================================= */
.penalties-page-v3 .pk-football-svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
  filter: drop-shadow(0 3px 5px rgba(0,0,0,.36)) !important;
}

/* Neutraliza por completo as regras antigas de .penalty-final-overlay do style.css. */
.penalties-page-v3 .pk-final {
  position: absolute !important;
  z-index: 50 !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 34px !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-content: center !important;
  place-items: center !important;
  gap: 14px !important;
  background:
    radial-gradient(circle at 50% 34%, rgba(62,166,230,.13), transparent 31%),
    rgba(3,14,24,.965) !important;
  backdrop-filter: blur(9px) !important;
  -webkit-backdrop-filter: blur(9px) !important;
  box-shadow: none !important;
  text-align: center !important;
}

.penalties-page-v3 .pk-final[hidden] {
  display: none !important;
}

.penalties-page-v3 .pk-final > span,
.penalties-page-v3 .pk-final h2,
.penalties-page-v3 .pk-final .penalty-final-score,
.penalties-page-v3 .pk-final .penalty-final-return,
.penalties-page-v3 .pk-final #penaltyPlayAgain {
  position: static !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.penalties-page-v3 .pk-final .penalty-final-score {
  display: grid !important;
  justify-items: center !important;
  gap: 4px !important;
}

.penalties-page-v3 .pk-final .penalty-final-return {
  width: min(410px, 100%) !important;
}

.penalties-page-v3 .pk-final #penaltyPlayAgain {
  width: min(290px, 100%) !important;
}

/* =========================================================
   V6 — correções finais de estado + bola clássica
   ========================================================= */
.penalties-page-v3 .penalty-start-btn[hidden] {
  display: none !important;
}

.penalties-page-v3 .pk-ball {
  width: 48px !important;
  height: 48px !important;
  filter: drop-shadow(0 8px 10px rgba(0,0,0,.38)) !important;
}

.penalties-page-v3 .pk-football-svg-v5 {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: visible !important;
}

.penalties-page-v3 .pk-ball.is-post-hit {
  filter:
    drop-shadow(0 8px 10px rgba(0,0,0,.38))
    drop-shadow(0 0 10px rgba(255,255,255,.18)) !important;
}

/* =========================================================
   PENÁLTIS — VIEWPORT FIT 22/08/2026
   ========================================================= */
@media (min-width: 1061px) and (max-height: 900px) {
  .penalties-page-v3 .penalties-main-v3 {
    padding-top: 72px !important;
    padding-bottom: 20px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 {
    min-height: 52px !important;
    margin-bottom: 10px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 h1 {
    font-size: clamp(30px, 3vw, 40px) !important;
  }

  .penalties-page-v3 .penalties-shell-v3 {
    height: calc(100vh - 142px) !important;
    min-height: 520px !important;
    max-height: 748px !important;
  }

  .penalties-page-v3 .penalties-controls-v3,
  .penalties-page-v3 .penalties-history-panel-v3 {
    padding: 16px !important;
    overflow-y: auto !important;
    scrollbar-width: thin;
  }

  .penalties-page-v3 .pk-stage {
    height: 100% !important;
    min-height: 0 !important;
    padding: 14px 16px 16px !important;
  }

  .penalties-page-v3 .pk-hud {
    min-height: 58px !important;
    padding: 9px 13px !important;
  }

  .penalties-page-v3 .pk-score strong { font-size: 32px !important; }
  .penalties-page-v3 .pk-progress-wrap { margin-top: 8px !important; }

  .penalties-page-v3 .pk-game {
    min-height: 0 !important;
    height: calc(100% - 82px) !important;
    margin-top: 9px !important;
  }

  .penalties-page-v3 .pk-goal-wrap {
    top: 42px !important;
    width: min(80%, 590px) !important;
  }

  .penalties-page-v3 .pk-keeper {
    left: calc(50% - 50px) !important;
    width: 100px !important;
    height: 138px !important;
  }

  .penalties-page-v3 .pk-target {
    width: 72px !important;
    height: 66px !important;
  }

  .penalties-page-v3 .pk-target span {
    width: 46px !important;
    height: 46px !important;
  }

  .penalties-page-v3 .penalty-message { min-height: 56px !important; }
  .penalties-page-v3 .penalty-payout-card { padding: 12px !important; }
  .penalties-page-v3 .penalty-payout-row { min-height: 31px !important; }
  .penalties-page-v3 .penalties-history-panel-v3 .bj-history-list { max-height: none !important; }
}

@media (min-width: 1061px) and (max-height: 760px) {
  .penalties-page-v3 .penalties-main-v3 {
    padding-top: 62px !important;
    padding-bottom: 10px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 {
    min-height: 42px !important;
    margin-bottom: 7px !important;
  }

  .penalties-page-v3 .penalties-shell-v3 {
    height: calc(100vh - 118px) !important;
    min-height: 470px !important;
  }

  .penalties-page-v3 .penalties-controls-v3,
  .penalties-page-v3 .penalties-history-panel-v3 { padding: 12px !important; }

  .penalties-page-v3 .pk-stage { padding: 10px 12px 12px !important; }
  .penalties-page-v3 .pk-hud { min-height: 48px !important; padding: 7px 10px !important; }
  .penalties-page-v3 .pk-brand small { display: none !important; }
  .penalties-page-v3 .pk-score strong { font-size: 28px !important; }
  .penalties-page-v3 .pk-status { padding: 6px 9px !important; font-size: 8px !important; }
  .penalties-page-v3 .pk-progress-wrap { margin-top: 5px !important; }
  .penalties-page-v3 .pk-game { height: calc(100% - 64px) !important; margin-top: 6px !important; }
  .penalties-page-v3 .pk-goal-wrap { top: 28px !important; width: min(75%, 520px) !important; }
  .penalties-page-v3 .pk-keeper { left: calc(50% - 43px) !important; width: 86px !important; height: 118px !important; }
  .penalties-page-v3 .pk-target { width: 62px !important; height: 56px !important; }
  .penalties-page-v3 .pk-target span { width: 40px !important; height: 40px !important; }
  .penalties-page-v3 .penalty-start-btn { min-height: 50px !important; margin-top: 8px !important; }
  .penalties-page-v3 .penalty-message { min-height: 42px !important; margin-top: 8px !important; }
  .penalties-page-v3 .penalty-payout-card { margin-top: 8px !important; padding: 9px !important; }
  .penalties-page-v3 .penalty-payout-row { min-height: 27px !important; margin-top: 4px !important; }
}

/* =========================================================
   PENÁLTIS — MOBILE V2 (<=768px)
   Só altera telemóveis/tablets pequenos; desktop intacto.
   ========================================================= */
@media (max-width: 768px) {
  .penalties-page-v3 .penalties-main-v3 {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    padding-top: 82px !important;
    padding-bottom: 84px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: end !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  .penalties-page-v3 .penalties-titlebar-v3 h1 {
    font-size: clamp(29px,9vw,38px) !important;
    letter-spacing: -1.4px !important;
  }

  .penalties-page-v3 .penalties-shell-v3 {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    border-radius: 16px !important;
  }

  .penalties-page-v3 .penalties-controls-v3 {
    padding: 13px !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(90,177,230,.12) !important;
  }

  .penalties-page-v3 .pk-stage {
    height: 500px !important;
    min-height: 500px !important;
    padding: 10px !important;
    overflow: hidden !important;
  }

  .penalties-page-v3 .pk-hud {
    min-height: 70px !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    text-align: left !important;
  }

  .penalties-page-v3 .pk-brand small { display: none !important; }
  .penalties-page-v3 .pk-score strong { font-size: 27px !important; }
  .penalties-page-v3 .pk-status {
    justify-self: end !important;
    padding: 6px 8px !important;
    font-size: 7px !important;
  }

  .penalties-page-v3 .pk-progress-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin-top: 1px !important;
  }

  .penalties-page-v3 .pk-game {
    height: 405px !important;
    min-height: 405px !important;
    margin-top: 7px !important;
  }

  .penalties-page-v3 .pk-goal-wrap {
    top: 38px !important;
    width: calc(100% - 12px) !important;
    max-width: 470px !important;
  }

  .penalties-page-v3 .pk-keeper {
    left: calc(50% - 41px) !important;
    width: 82px !important;
    height: 112px !important;
  }

  .penalties-page-v3 .pk-target {
    width: 58px !important;
    height: 54px !important;
  }

  .penalties-page-v3 .pk-target span {
    width: 37px !important;
    height: 37px !important;
  }

  .penalties-page-v3 .pk-tl { left: 2% !important; }
  .penalties-page-v3 .pk-tr { right: 2% !important; }
  .penalties-page-v3 .pk-bl { left: 2% !important; }
  .penalties-page-v3 .pk-br { right: 2% !important; }

  .penalties-page-v3 .penalty-message { min-height: 52px !important; margin-top: 9px !important; }
  .penalties-page-v3 .penalty-payout-card { margin-top: 9px !important; padding: 10px !important; }
  .penalties-page-v3 .penalty-payout-row { min-height: 30px !important; }

  .penalties-page-v3 .penalties-history-panel-v3 {
    padding: 13px !important;
    overflow: visible !important;
    border: 0 !important;
    border-top: 1px solid rgba(90,177,230,.12) !important;
  }
  .penalties-page-v3 .penalties-history-panel-v3 .bj-history-list { max-height: none !important; }
}

@media (max-width: 480px) {
  .penalties-page-v3 .penalties-titlebar-v3 { grid-template-columns: minmax(0,1fr) 84px !important; }
  .penalties-page-v3 .pk-stage { height: 460px !important; min-height: 460px !important; }
  .penalties-page-v3 .pk-game { height: 365px !important; min-height: 365px !important; }
  .penalties-page-v3 .pk-goal-wrap { top: 32px !important; }
  .penalties-page-v3 .pk-target { width: 52px !important; height: 49px !important; }
  .penalties-page-v3 .pk-target span { width: 34px !important; height: 34px !important; }
}