* {
  box-sizing: border-box
}
html {
  background: #05070d;
  color: #f8fafc;
  font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif
}
body {
  margin: 0;
  min-height: 100vh;
  position: relative;
  background: radial-gradient(circle at top, #182033 0, #05070d 55%)
}
body:before {
  content: "";
  position: fixed;
  inset: 0;
  opacity: .08;
  background-size: cover;
  background-position: center;
  pointer-events: none
}
.app-shell {
  max-width: 1100px;
  margin: 0 auto;
  padding: 14px
}
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  position: sticky;
  top: 0;
  z-index: 5;
  background: rgba(5, 7, 13, .86);
  backdrop-filter: blur(12px)
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: .4px
}
.brand img {
  width: 68px;
  height: 68px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .24))
}
.brand span {
  font-size: clamp(22px, 2.7vw, 30px);
  line-height: 1
}
.topbar nav {
  display: flex;
  gap: 8px
}
.topbar nav a, .text-link {
  color: #dbeafe;
  text-decoration: none;
  font-size: 14px
}
.hero {
  padding: 36px 18px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(125, 95, 255, .22), rgba(246, 185, 59, .12));
  box-shadow: 0 20px 70px rgba(0, 0, 0, .35);
  margin: 14px 0
}
.hero.compact {
  padding: 24px 18px
}
.hero h1 {
  font-size: clamp(34px, 7vw, 70px);
  line-height: .95;
  margin: 0 0 12px
}
.hero p {
  color: #cbd5e1;
  max-width: 760px
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, var(--primary, #f6b93b), #f59e0b);
  color: #121212;
  padding: 12px 16px;
  border-radius: 14px;
  font-weight: 800;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(246, 185, 59, .2)
}
.btn.ghost {
  background: rgba(255, 255, 255, .08);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: none
}
.card, .tier-card, .active-run, .wallet, .match-summary, .result-card, .game-card, .ad-card {
  background: rgba(12, 17, 29, .18);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 22px;
  padding: 18px;
  margin: 14px 0;
  box-shadow: 0 16px 45px rgba(0, 0, 0, .25)
}
.grid {
  display: grid;
  gap: 14px
}
.grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr))
}
.tier-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0
}
.tier-card {
  border-color: color-mix(in srgb, var(--tier) 55%, transparent);
  position: relative;
  overflow: hidden
}
.tier-card:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(150deg, color-mix(in srgb, var(--tier) 25%, transparent), transparent 45%);
  pointer-events: none
}
.tier-card > * {
  position: relative
}
.tier-card h2 {
  margin: 0 0 8px;
  color: var(--tier)
}
.tier-card .big {
  font-size: 28px;
  font-weight: 900;
  margin: 5px 0
}
.wallet, .match-summary, .score-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px
}
.wallet div, .match-summary div, .score-strip div {
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .06)
}
.wallet span, .match-summary span, .score-strip span {
  display: block;
  font-size: 12px;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .06em
}
.wallet strong, .match-summary strong, .score-strip strong {
  font-size: 22px
}
.pill {
  display: inline-flex;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(34, 197, 94, .16);
  color: #bbf7d0;
  font-size: 13px;
  font-weight: 700
}
.form label {
  display: block;
  margin: 12px 0;
  color: #cbd5e1
}
.form input, .form textarea, .form select, input, textarea, select {
  width: 100%;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .15);
  background: #0f172a;
  color: #f8fafc
}
.check {
  display: flex !important;
  align-items: flex-start;
  gap: 10px
}
.check input {
  width: auto;
  margin-top: 4px
}
.challenge-list {
  display: grid;
  gap: 12px
}
.challenge {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px
}
.challenge.done {
  border-color: rgba(34, 197, 94, .5)
}
table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: 16px
}
th, td {
  padding: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  text-align: left
}
th {
  color: #94a3b8;
  font-size: 12px;
  text-transform: uppercase
}
.flash {
  padding: 12px 14px;
  border-radius: 14px;
  margin: 12px 0;
  background: #064e3b;
  color: #d1fae5
}
.flash.error {
  background: #7f1d1d;
  color: #fee2e2
}
.footer {
  color: #64748b;
  text-align: center;
  padding: 30px 0
}
.ad-card a {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #e5e7eb;
  text-decoration: none
}
.ad-card img {
  width: 100%;
  max-width: 220px;
  border-radius: 16px;
  background: #111827
}
.game-head {
  padding: 8px 2px
}
.game-head h1 {
  margin: 0
}
.game-card {
  padding: 12px
}
.score-strip {
  margin-bottom: 12px
}
.board-wrap {
  position: relative;
  display: grid;
  place-items: center
}
.board {
  width: min(100%, 420px);
  height: auto;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, .12)
}
.throw-button {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  width: 150px;
  height: 54px;
  border-radius: 999px;
  border: 0;
  background: linear-gradient(135deg, #facc15, #f97316);
  font-weight: 900;
  color: #111827;
  box-shadow: 0 14px 34px rgba(250, 204, 21, .24);
  touch-action: none
}
.throw-button.charging {
  background: linear-gradient(135deg, #ef4444, #f97316);
  color: #fff
}
.power {
  height: 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  margin: 14px 0;
  overflow: hidden
}
.power div {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #22c55e, #facc15, #ef4444)
}
.throw-log {
  max-height: 180px;
  overflow: auto;
  display: grid;
  gap: 6px;
  color: #cbd5e1
}
.throw-log div {
  background: rgba(255, 255, 255, .05);
  border-radius: 10px;
  padding: 8px
}
.instant-alert {
  background: rgba(250, 204, 21, .18) !important;
  color: #fde68a !important
}
.result-card h1 {
  font-size: 38px
}
.instant-box {
  border: 1px solid rgba(250, 204, 21, .4);
  background: rgba(250, 204, 21, .08);
  padding: 14px;
  border-radius: 16px;
  margin-top: 12px
}
@media(max-width:800px) {
  .tier-grid, .grid.two, .wallet, .match-summary, .score-strip {
    grid-template-columns: 1fr 1fr
  }
  .topbar {
    align-items: flex-start
  }
  .topbar nav {
    flex-wrap: wrap;
    justify-content: flex-end
  }
  .challenge {
    align-items: flex-start;
    flex-direction: column
  }
}
@media(max-width:520px) {
  .app-shell {
    padding: 10px
  }
  .tier-grid, .wallet, .match-summary, .score-strip {
    grid-template-columns: 1fr
  }
  .hero {
    border-radius: 20px
  }
  .card, .tier-card, .active-run, .wallet, .match-summary, .result-card, .game-card, .ad-card {
    border-radius: 18px;
    padding: 14px
  }
  .throw-button {
    bottom: 12px
  }
  .ad-card a {
    flex-direction: column;
    align-items: flex-start
  }
}
/* Enhanced darts play view */
.darts-live {
  display: grid;
  gap: 14px
}
.live-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 4px 2px 12px
}
.live-topline h2 {
  margin: 2px 0 0;
  font-size: clamp(26px, 5vw, 44px);
  line-height: 1
}
.live-topline h2 small {
  display: block;
  color: #94a3b8;
  font-size: 15px;
  margin-top: 6px
}
.eyebrow {
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #facc15;
  font-weight: 900
}
.live-prize {
  text-align: right;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(250, 204, 21, .1);
  border: 1px solid rgba(250, 204, 21, .28)
}
.live-prize span, .score-card span, .metric-row span {
  display: block;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #94a3b8
}
.live-prize strong {
  font-size: 22px;
  color: #fde68a
}
.play-scoreboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px
}
.score-card {
  padding: 13px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .08)
}
.score-card.active {
  border-color: rgba(250, 204, 21, .38);
  background: rgba(250, 204, 21, .09)
}
.score-card strong {
  display: block;
  font-size: clamp(22px, 5vw, 36px);
  line-height: 1.05;
  margin-top: 4px
}
.play-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 14px;
  align-items: stretch
}
.board-panel {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 420px;
  padding: 10px;
  border-radius: 22px;
  background: radial-gradient(circle at center, rgba(30, 41, 59, .75), rgba(2, 6, 23, .84));
  border: 1px solid rgba(255, 255, 255, .09);
  overflow: hidden
}
.dart-board {
  width: min(100%, 560px);
  height: auto;
  display: block;
  border-radius: 50%;
  filter: drop-shadow(0 20px 45px rgba(0, 0, 0, .45));
  touch-action: none
}
.charge-release {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  width: 170px;
  min-height: 64px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .18);
  background: linear-gradient(135deg, #facc15, #f97316);
  color: #111827;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .02em;
  box-shadow: 0 16px 40px rgba(249, 115, 22, .32);
  touch-action: none;
  display: grid;
  gap: 1px
}
.charge-release span {
  font-size: 19px;
  line-height: 1
}
.charge-release small {
  font-size: 10px;
  letter-spacing: .08em
}
.charge-release.charging {
  background: linear-gradient(135deg, #ef4444, #f97316);
  color: #fff;
  transform: translateX(-50%) scale(1.04)
}
.throw-panel {
  display: grid;
  align-content: start;
  gap: 10px
}
.metric-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .055);
  border-radius: 15px;
  padding: 12px
}
.metric-row strong {
  font-size: 20px
}
.charge-meter {
  height: 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .08)
}
.charge-meter div {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #38bdf8, #22c55e, #facc15, #ef4444);
  box-shadow: 0 0 26px rgba(250, 204, 21, .22)
}
.play-continue {
  width: 100%;
  margin-top: 6px
}
.throw-log .hot {
  background: rgba(34, 197, 94, .13);
  color: #bbf7d0
}
.game-help {
  color: #cbd5e1;
  line-height: 1.42;
  margin: 3px 0
}
.throw-log {
  max-height: 230px
}
.throw-log div {
  border: 1px solid rgba(255, 255, 255, .07)
}
@media(max-width:900px) {
  .play-grid {
    grid-template-columns: 1fr
  }
  .throw-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
  .throw-panel .game-help, .throw-panel .throw-log, .throw-panel .charge-meter, .throw-panel .play-continue {
    grid-column: 1/-1
  }
  .board-panel {
    min-height: 360px
  }
}
@media(max-width:560px) {
  .live-topline {
    align-items: flex-start;
    flex-direction: column
  }
  .live-prize {
    text-align: left;
    width: 100%
  }
  .play-scoreboard {
    grid-template-columns: 1fr 1fr
  }
  .throw-panel {
    grid-template-columns: 1fr
  }
  .board-panel {
    min-height: 320px;
    padding: 4px
  }
  .charge-release {
    bottom: 12px;
    width: 150px;
    min-height: 58px
  }
  .dart-board {
    width: 100%;
    max-width: 430px
  }
  .score-card strong {
    font-size: 24px
  }
}
/* Active dart throw upgrade */
.active-throw-ui {
  max-width: 1040px;
  margin: 0 auto
}
.arena-scorebar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: stretch
}
.arena-score, .arena-round {
  border: 1px solid rgba(255, 255, 255, .1);
  background: linear-gradient(180deg, rgba(30, 41, 59, .86), rgba(15, 23, 42, .82));
  border-radius: 20px;
  padding: 14px;
  text-align: center
}
.arena-score.you {
  border-color: rgba(59, 130, 246, .42)
}
.arena-score.opp {
  border-color: rgba(248, 113, 113, .42)
}
.arena-score span, .arena-round span {
  display: block;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #94a3b8
}
.arena-score strong {
  display: block;
  font-size: clamp(34px, 7vw, 58px);
  line-height: .94;
  margin: 5px 0;
  color: #60a5fa
}
.arena-score.opp strong {
  color: #f87171
}
.arena-score small, .arena-round small {
  display: block;
  color: #64748b;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 11px
}
.arena-round strong {
  display: block;
  color: #e5e7eb;
  font-size: 24px;
  margin: 8px 0 2px
}
.active-grid {
  grid-template-columns: minmax(0, 1fr) 310px
}
.active-board-panel {
  min-height: 600px;
  background: radial-gradient(circle at 50% 42%, rgba(30, 41, 59, .85), rgba(2, 6, 23, .95) 70%);
  isolation: isolate
}
.active-board {
  transition: transform .42s cubic-bezier(.2, .8, .2, 1), filter .42s cubic-bezier(.2, .8, .2, 1);
  transform-origin: var(--zoom-x, 50%) var(--zoom-y, 50%)
}
.active-board-panel.zoomed .active-board {
  transform: scale(1.32);
  filter: brightness(1.08) contrast(1.08) drop-shadow(0 24px 54px rgba(0, 0, 0, .55))
}
.target-instruction {
  position: absolute;
  top: 14px;
  left: 14px;
  right: 14px;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 16px;
  background: rgba(2, 6, 23, .72);
  backdrop-filter: blur(10px);
  pointer-events: none
}
.target-instruction span {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: #94a3b8
}
.target-instruction strong {
  color: #4ade80;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .12em
}
.flight-dart {
  position: absolute;
  z-index: 7;
  width: 108px;
  height: 108px;
  object-fit: contain;
  left: 50%;
  top: 88%;
  filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .55));
  transform-origin: 50% 52%;
  pointer-events: none;
  will-change: left, top, transform, opacity
}
.flight-dart.flying {
  filter: drop-shadow(0 22px 28px rgba(0, 0, 0, .7)) blur(.15px)
}
.flight-dart.landed {
  z-index: 9;
  filter: drop-shadow(0 10px 16px rgba(0, 0, 0, .7))
}
.hit-zoom-badge {
  position: absolute;
  z-index: 10;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.9);
  padding: 8px 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, #facc15, #f97316);
  color: #111827;
  font-weight: 1000;
  letter-spacing: .04em;
  box-shadow: 0 16px 36px rgba(250, 204, 21, .28);
  pointer-events: none
}
.active-board-panel.hit-landed .hit-zoom-badge {
  animation: hitBadge 1.05s ease both
}
.active-throw-button {
  z-index: 11
}
.active-throw-button.charging {
  animation: pulseThrow .7s ease-in-out infinite alternate
}
.instant-target-card {
  border: 1px solid rgba(34, 197, 94, .22);
  background: linear-gradient(135deg, rgba(20, 83, 45, .55), rgba(6, 78, 59, .26));
  border-radius: 18px;
  padding: 14px
}
.instant-target-card span {
  display: block;
  color: #86efac;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px
}
.instant-target-card strong {
  display: block;
  color: #4ade80;
  font-size: 22px;
  margin-top: 3px
}
.active-throw-panel .metric-row {
  background: rgba(15, 23, 42, .82)
}
.active-throw-panel .game-help {
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  padding: 12px
}
.active-board {
  cursor: crosshair
}
.active-board:active {
  cursor: grabbing
}
@keyframes hitBadge {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.75)
  }
  18% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.08)
  }
  80% {
    opacity: 1
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.98)
  }
}
@keyframes pulseThrow {
  from {
    box-shadow: 0 16px 40px rgba(249, 115, 22, .32)
  }
  to {
    box-shadow: 0 18px 50px rgba(239, 68, 68, .58)
  }
}
@media(max-width:980px) {
  .active-grid {
    grid-template-columns: 1fr
  }
  .active-board-panel {
    min-height: 540px
  }
  .active-throw-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
  .active-throw-panel .instant-target-card, .active-throw-panel .game-help, .active-throw-panel .throw-log, .active-throw-panel .charge-meter, .active-throw-panel .play-continue {
    grid-column: 1/-1
  }
}
@media(max-width:560px) {
  .arena-scorebar {
    grid-template-columns: 1fr 1fr
  }
  .arena-round {
    grid-column: 1/-1;
    grid-row: 2
  }
  .active-board-panel {
    min-height: 430px
  }
  .flight-dart {
    width: 82px;
    height: 82px
  }
  .target-instruction {
    top: 8px;
    left: 8px;
    right: 8px
  }
  .target-instruction span {
    font-size: 10px
  }
  .active-board-panel.zoomed .active-board {
    transform: scale(1.2)
  }
}
/* Active play hotfix: always-visible power bar + mobile finger aim offset support */
.board-power-hud {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 96px;
  z-index: 10;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(2, 6, 23, .78);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .32);
  backdrop-filter: blur(10px);
  pointer-events: none
}
.board-power-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 7px
}
.board-power-meta span {
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #94a3b8;
  font-weight: 900
}
.board-power-meta strong {
  font-size: 18px;
  color: #f8fafc
}
.board-power-track {
  height: 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .1)
}
.board-power-track div {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #38bdf8, #22c55e, #facc15, #ef4444);
  box-shadow: 0 0 24px rgba(250, 204, 21, .28)
}
.charge-meter {
  display: block !important;
  visibility: visible !important
}
.charge-meter div {
  min-width: 2px
}
.active-board-panel .charge-release {
  bottom: 20px
}
@media(max-width:560px) {
  .board-power-hud {
    left: 10px;
    right: 10px;
    bottom: 82px;
    padding: 8px 10px
  }
  .board-power-track {
    height: 16px
  }
  .board-power-meta strong {
    font-size: 16px
  }
  .active-board-panel .charge-release {
    bottom: 10px
  }
}
/* Previous dart-game play experience replication */
.old-play-experience {
  max-width: 1080px;
  margin: 0 auto
}
.old-play-grid {
  grid-template-columns: minmax(0, 1fr) 310px
}
.old-board-panel {
  min-height: 610px;
  padding: clamp(10px, 2vw, 22px);
  background: radial-gradient(circle at 50% 42%, rgba(30, 41, 59, .86), rgba(2, 6, 23, .96) 70%);
  touch-action: none;
  -ms-touch-action: none;
  overflow: hidden
}
.old-board-panel:before, .old-board-panel:after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(calc(100% - 12px), 690px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(.88);
  pointer-events: none;
  opacity: .65;
  z-index: 1;
  animation: oldBoardPulse 2.35s ease-out infinite;
  background: radial-gradient(circle, transparent 51%, rgba(250, 204, 21, .44) 53%, rgba(250, 204, 21, .18) 56%, transparent 63%)
}
.old-board-panel:after {
  animation-delay: 1.15s;
  background: radial-gradient(circle, transparent 54%, rgba(255, 255, 255, .34) 55%, transparent 60%)
}
.old-board-panel.is-board-charging:before, .old-board-panel.is-board-charging:after {
  animation: none;
  opacity: .2
}
.old-play-canvas {
  position: relative;
  z-index: 3;
  width: min(100%, 660px);
  height: auto;
  border-radius: 0;
  background: transparent;
  filter: none !important;
  box-shadow: none !important;
  touch-action: none !important;
  -ms-touch-action: none !important;
  cursor: crosshair;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none
}
.old-target-instruction {
  z-index: 8
}
.board-control-hint {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 8;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(2, 6, 23, .78);
  backdrop-filter: blur(10px);
  font-size: 12px;
  line-height: 1.35;
  color: #cbd5e1;
  text-align: center;
  font-weight: 800;
  letter-spacing: .02em;
  pointer-events: none
}
.old-power-hud {
  bottom: 72px;
  z-index: 8
}
.old-power-hud .board-power-track, .old-charge-meter {
  position: relative
}
.old-power-hud .board-power-track b, .old-charge-meter b {
  position: absolute;
  top: -5px;
  bottom: -5px;
  left: 62%;
  width: 22%;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .42);
  box-shadow: 0 0 18px rgba(250, 204, 21, .26);
  pointer-events: none
}
.old-play-experience.in-sweet-zone .board-power-meta strong, .old-play-experience.in-sweet-zone [data-charge] {
  color: #4ade80;
  text-shadow: 0 0 14px rgba(74, 222, 128, .42)
}
.old-play-experience.in-sweet-zone .board-power-track, .old-play-experience.in-sweet-zone .charge-meter {
  box-shadow: 0 0 0 2px rgba(74, 222, 128, .22), 0 0 28px rgba(74, 222, 128, .16)
}
.old-throw-panel .game-help {
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  padding: 12px
}
.old-throw-panel .throw-log div {
  border: 1px solid rgba(255, 255, 255, .07);
  background: rgba(255, 255, 255, .04);
  border-radius: 12px;
  padding: 8px 10px;
  margin: 6px 0
}
.old-throw-panel .throw-log .hot {
  background: rgba(250, 204, 21, .12);
  color: #fde68a
}
.old-throw-panel .throw-log .instant-alert {
  background: rgba(34, 197, 94, .14);
  color: #bbf7d0
}
.old-play-experience .play-continue {
  width: 100%;
  margin-top: 6px
}
@keyframes oldBoardPulse {
  0% {
    opacity: .72;
    transform: translate(-50%, -50%) scale(.80)
  }
  70% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.04)
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.08)
  }
}
@media(max-width:980px) {
  .old-play-grid {
    grid-template-columns: 1fr
  }
  .old-board-panel {
    min-height: 560px
  }
  .old-throw-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
  .old-throw-panel .instant-target-card, .old-throw-panel .game-help, .old-throw-panel .throw-log, .old-throw-panel .old-charge-meter, .old-throw-panel .play-continue {
    grid-column: 1/-1
  }
}
@media(max-width:560px) {
  .old-board-panel {
    min-height: 460px;
    padding: 4px
  }
  .old-play-canvas {
    width: 100%;
    max-width: 430px
  }
  .old-power-hud {
    left: 10px;
    right: 10px;
    bottom: 62px;
    padding: 8px 10px
  }
  .board-control-hint {
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 8px 10px;
    font-size: 11px
  }
  .old-target-instruction {
    top: 8px;
    left: 8px;
    right: 8px
  }
  .old-throw-panel {
    grid-template-columns: 1fr
  }
  .old-board-panel:before, .old-board-panel:after {
    width: min(calc(100% - 8px), 440px)
  }
}
/* Scope compliance additions */
.notice.campaign {
  border-color: rgba(250, 204, 21, .45);
  background: rgba(250, 204, 21, .12);
  color: #fde68a
}
.progress {
  height: 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .1);
  margin-top: 12px
}
.progress span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #22c55e, #60a5fa, #facc15);
  border-radius: 999px
}
.progress.slim {
  height: 8px;
  margin: 8px 0
}
.tier-tabs {
  display: flex;
  gap: 8px;
  overflow: auto;
  padding: 6px 0 10px
}
.tier-tab {
  white-space: nowrap;
  color: #e5e7eb;
  text-decoration: none;
  border: 1px solid color-mix(in srgb, var(--tier) 45%, rgba(255, 255, 255, .12));
  background: rgba(255, 255, 255, .05);
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 800
}
.tier-tab.active {
  background: color-mix(in srgb, var(--tier) 26%, rgba(255, 255, 255, .08));
  color: #fff
}
.challenge {
  position: relative
}
.challenge-rank {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(96, 165, 250, .16);
  color: #93c5fd;
  font-weight: 900;
  flex: 0 0 auto
}
.challenge-body {
  flex: 1
}
.challenge.current {
  border-color: rgba(96, 165, 250, .55)
}
.challenge.locked {
  opacity: .64
}
.pill.muted {
  background: rgba(148, 163, 184, .14);
  color: #cbd5e1
}
.card.success {
  border-color: rgba(34, 197, 94, .45);
  background: rgba(5, 46, 22, .36)
}
/* Power bar below dartboard + selectable board style update */
.old-board-panel {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding-top: 58px !important;
  padding-bottom: 14px !important;
}
.old-play-canvas {
  flex: 0 0 auto;
}
.old-power-hud {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: min(100%, 660px);
  margin: 2px auto 0 !important;
  z-index: 8;
  pointer-events: none;
}
.board-control-hint {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: min(100%, 660px);
  margin: 0 auto !important;
  flex: 0 0 auto;
}
.board-render-note {
  font-size: 11px;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .1em;
}
@media(max-width:560px) {
  .old-board-panel {
    padding-top: 54px !important;
    gap: 7px
  }
  .old-power-hud {
    width: 100%;
    padding: 8px 10px !important
  }
  .board-control-hint {
    width: 100%;
    font-size: 11px
  }
}
/* Mock payment confirmation */
.payment-card {
  border-color: rgba(250, 204, 21, .28);
  background: linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(12, 17, 29, .9))
}
.payment-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0
}
.payment-grid div {
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .08)
}
.payment-grid span {
  display: block;
  color: #94a3b8;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 900
}
.payment-grid strong {
  display: block;
  font-size: 22px;
  margin-top: 5px
}
.mock-note {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(250, 204, 21, .1);
  border: 1px solid rgba(250, 204, 21, .24);
  color: #fde68a
}
.payment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 14px
}
@media(max-width:800px) {
  .payment-grid {
    grid-template-columns: 1fr 1fr
  }
}
@media(max-width:520px) {
  .payment-grid {
    grid-template-columns: 1fr
  }
}
/* Lobby play definitions */
.play-guide {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0
}
.play-guide article {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(15, 23, 42, .88);
  border: 1px solid rgba(255, 255, 255, .12);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .22)
}
.play-guide strong {
  min-width: 82px;
  color: var(--primary, #f6b93b);
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .06em
}
.play-guide span {
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.45
}
.action-note {
  font-size: 13px;
  line-height: 1.45;
  color: #cbd5e1;
  margin: 10px 0 12px
}
.practice-link {
  display: block;
  margin-top: 12px;
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(59, 130, 246, .10);
  border: 1px solid rgba(147, 197, 253, .24);
  color: #dbeafe;
  text-decoration: none
}
.practice-link strong {
  display: block;
  font-size: 14px
}
.practice-link span {
  display: block;
  margin-top: 2px;
  color: #93c5fd;
  font-size: 12px;
  line-height: 1.35
}
@media(max-width:720px) {
  .play-guide {
    grid-template-columns: 1fr
  }
  .play-guide article {
    display: block
  }
  .play-guide strong {
    display: block;
    margin-bottom: 6px
  }
}
/* Bigger public logo on lobby/game */
@media(max-width:560px) {
  .brand img {
    width: 56px;
    height: 56px
  }
  .brand span {
    font-size: 22px
  }
}
/* Larger public logo on lobby/game - second size increase */
.brand {
  gap: 16px !important
}
.brand img {
  width: 108px !important;
  height: 108px !important;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .34))
}
.brand span {
  font-size: clamp(28px, 3.4vw, 40px) !important;
  line-height: 1
}
.topbar {
  padding: 16px 0 !important
}
@media(max-width:560px) {
  .brand {
    gap: 10px !important
  }
  .brand img {
    width:110px !important;
    height: 110px !important
  }
  .brand span {
    font-size: 20px !important
  }
  .topbar {
    gap: 8px
  }
}
@media(max-width:390px) {
  .brand img {
    width: 72px !important;
    height: 72px !important
  }
  .brand span {
    font-size: 22px !important
  }
}
/* Public top menu */
.top-menu {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap
}
.top-menu a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .13);
  color: #eef2ff !important;
  text-decoration: none !important;
  font-weight: 850;
  letter-spacing: .01em;
  white-space: nowrap
}
.top-menu a:hover {
  background: rgba(246, 185, 59, .18);
  border-color: rgba(246, 185, 59, .38);
  color: #fff !important
}
@media(max-width:740px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column
  }
  .top-menu {
    justify-content: flex-start;
    width: 100%
  }
  .top-menu a {
    min-height: 36px;
    padding: 8px 11px;
    font-size: 13px
  }
}
@media(max-width:430px) {
  .top-menu {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px
  }
  .top-menu a {
    width: 100%
  }
}
/* Mobile top menu dropdown */
.mobile-menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 42px;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .09);
  color: #fff;
  font-weight: 900;
  letter-spacing: .02em;
  box-shadow: none;
  cursor: pointer
}
.mobile-menu-toggle i, .mobile-menu-toggle i:before, .mobile-menu-toggle i:after {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: #fff;
  content: "";
  transition: .18s ease
}
.mobile-menu-toggle i {
  position: relative
}
.mobile-menu-toggle i:before {
  position: absolute;
  top: -6px;
  left: 0
}
.mobile-menu-toggle i:after {
  position: absolute;
  top: 6px;
  left: 0
}
.mobile-menu-toggle[aria-expanded="true"] i {
  background: transparent
}
.mobile-menu-toggle[aria-expanded="true"] i:before {
  top: 0;
  transform: rotate(45deg)
}
.mobile-menu-toggle[aria-expanded="true"] i:after {
  top: 0;
  transform: rotate(-45deg)
}
@media(max-width:740px) {
  .topbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center !important;
    gap: 10px !important;
    position: sticky;
    top: 0;
    padding: 10px 0 !important;
    flex-direction: initial !important
  }
  .topbar .brand {
    min-width: 0
  }
  .topbar .brand span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
  }
  .mobile-menu-toggle {
    display: inline-flex
  }
  .top-menu {
    grid-column: 1/-1;
    width: 100%;
    display: none !important;
    grid-template-columns: 1fr;
    gap: 8px !important;
    padding: 10px;
    margin-top: 2px;
    border-radius: 20px;
    background: rgba(5, 7, 13, .96);
    border: 1px solid rgba(255, 255, 255, .13);
    box-shadow: 0 20px 54px rgba(0, 0, 0, .42);
    backdrop-filter: blur(16px);
    z-index: 20
  }
  .top-menu.open {
    display: grid !important
  }
  .top-menu a {
    width: 100%;
    min-height: 44px !important;
    justify-content: flex-start !important;
    padding: 11px 14px !important;
    font-size: 14px !important;
    background: rgba(255, 255, 255, .075)
  }
}
@media(max-width:430px) {
  .top-menu.open {
    display: grid !important;
    grid-template-columns: 1fr !important
  }
}
/* Legal popup modals */
.legal-popup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 6px
}
.inline-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: #fde68a;
  text-decoration: underline;
  font: inherit;
  font-weight: 800;
  padding: 0;
  cursor: pointer
}
.modal-open {
  overflow: hidden
}
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(2, 6, 23, .78);
  backdrop-filter: blur(10px)
}
.modal-backdrop[hidden] {
  display: none !important
}
.legal-modal {
  position: relative;
  width: min(92vw, 760px);
  max-height: min(82vh, 760px);
  overflow: auto;
  border-radius: 24px;
  padding: 24px;
  background: #0c111d;
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .55);
  color: #f8fafc
}
.legal-modal h2 {
  margin: 0 46px 14px 0;
  font-size: clamp(24px, 4vw, 36px)
}
.modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .08);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer
}
.modal-content {
  color: #dbeafe;
  line-height: 1.58
}
.modal-content h1, .modal-content h2, .modal-content h3 {
  color: #fff
}
.modal-content a {
  color: #fde68a
}
.modal-content ul, .modal-content ol {
  padding-left: 22px
}
@media(max-width:520px) {
  .legal-popup-actions .btn {
    width: 100%
  }
  .legal-modal {
    width: 94vw;
    max-height: 84vh;
    border-radius: 18px;
    padding: 18px
  }
  .modal-close {
    top: 10px;
    right: 10px
  }
}
/* Lobby/play padding, rounded surfaces, text scale and eye-candy polish */ :root {
  --kd-glow-primary: rgba(246, 185, 59, .46);
  --kd-glow-blue: rgba(96, 165, 250, .28);
  --kd-panel-radius: 28px;
}
.app-shell {
  padding-left: clamp(16px, 3vw, 28px);
  padding-right: clamp(16px, 3vw, 28px);
}
.hero, .card, .tier-card, .active-run, .wallet, .match-summary, .result-card, .game-card, .ad-card, .play-guide article, .board-panel, .old-board-panel, .arena-panel, .arena-stat, .score-card, .metric-row, .live-prize, .instant-box, .payment-card {
  border-radius: var(--kd-panel-radius) !important;
  padding: clamp(18px, 2.4vw, 26px) !important;
  overflow: hidden;
}
.hero, .game-card, .old-board-panel, .board-panel, .tier-card, .card, .result-card {
  border-color: rgba(255, 255, 255, .16) !important;
  box-shadow: 0 20px 70px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.hero {
  margin-top: 18px;
  margin-bottom: 20px;
  background:
    radial-gradient(circle at 18% 10%, rgba(250, 204, 21, .24), transparent 34%), radial-gradient(circle at 86% 18%, rgba(96, 165, 250, .20), transparent 30%), linear-gradient(135deg, rgba(125, 95, 255, .22), rgba(246, 185, 59, .12));
}
.tier-grid, .play-guide, .play-grid, .old-play-grid, .play-scoreboard, .wallet, .match-summary, .score-strip {
  gap: clamp(14px, 2vw, 20px) !important;
}
.brand {
  position: relative;
  isolation: isolate;
}
.brand img {

  transform-origin: center;
  animation: kdLogoFloat 4.8s ease-in-out infinite!important;
}
.brand:after {
  content: "";
  position: absolute;
  inset: -8px -12px;
  z-index: -1;
  border-radius: 20px;
  background: radial-gradient(circle at 22% 44%, rgba(0, 0, 0, 0.20), transparent 52%);
  opacity: .9;
  pointer-events: none;
}
.brand span, .hero h1, .tier-card h2, .game-head h1, .live-topline h2, .result-card h1, .old-target-instruction strong {
  text-shadow: 0 2px 0 rgba(0, 0, 0, .35), 0 0 18px rgba(250, 204, 21, .18), 0 0 30px var(--kd-glow-blue);
}
.hero h1, .game-head h1, .live-topline h2, .result-card h1 {
  background: linear-gradient(180deg, #fff 0%, #fde68a 48%, #f6b93b 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.btn, .top-menu a, .mobile-menu-toggle, .practice-link {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.btn:hover, .top-menu a:hover, .mobile-menu-toggle:hover, .practice-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 36px rgba(246, 185, 59, .20);
}
.hero p, .card p, .tier-card p, .play-guide span, .action-note, .practice-link span, .game-help, .throw-log, .metric-row, .live-topline h2 small, .live-prize span, .score-card span, .wallet span, .match-summary span, .score-strip span, .form label, .notice, .mock-note, .payment-grid span {
  font-size: calc(1em - 2px) !important;
}
.tier-card .big, .wallet strong, .match-summary strong, .score-strip strong, .payment-grid strong, .metric-row strong, .live-prize strong, .score-card strong {
  text-shadow: 0 0 18px rgba(250, 204, 21, .16);
}
@keyframes kdLogoFloat {
  0%, 100% {
    transform: translateY(0) scale(1)
  }
  50% {
    transform: translateY(-2px) scale(1.015)
  }
}
@media(max-width:740px) {
  .app-shell {
    padding-left: 14px;
    padding-right: 14px
  }
  .hero, .card, .tier-card, .active-run, .wallet, .match-summary, .result-card, .game-card, .ad-card, .play-guide article, .board-panel, .old-board-panel, .score-card, .metric-row, .live-prize, .instant-box, .payment-card {
    border-radius: 22px !important;
    padding: 16px !important
  }
}
@media(max-width:520px) {
  .app-shell {
    padding-left: 12px;
    padding-right: 12px
  }
  .hero, .card, .tier-card, .active-run, .wallet, .match-summary, .result-card, .game-card, .ad-card, .play-guide article, .board-panel, .old-board-panel, .score-card, .metric-row, .live-prize, .instant-box, .payment-card {
    border-radius: 20px !important;
    padding: 14px !important
  }
  .brand img {
    animation: none
  }
}
/* Header transparency hotfix: remove black/dark strip behind public lobby/play header */
.topbar {
  background: rgba(0, 0, 0, 0.80) !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 20px;
  backdrop-filter: blur(10px) !important;
}
.topbar:before, .topbar:after {
  display: none !important;
}
/* Keep mobile dropdown readable without restoring a black header bar */
@media(max-width:740px) {
  .topbar {
    background: transparent !important;
    background-color: transparent !important;
  }
  .top-menu {
    background: linear-gradient(135deg, rgba(15, 23, 42, .72), rgba(30, 41, 59, .58)) !important;
    border-color: rgba(255, 255, 255, .16) !important;
  }
}
/* Dartboard instruction panel no-overlap hotfix - applied after attached style.css */
.old-board-panel{
  justify-content:flex-start!important;
  padding-top:14px!important;
}
.old-target-instruction{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  width:min(100%,660px)!important;
  order:0;
  flex:0 0 auto;
  margin:0 auto 8px!important;
  padding:8px 11px!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,rgba(15,23,42,.68),rgba(2,6,23,.42))!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
  pointer-events:none;
}
.old-play-canvas{
  order:1;
  flex:0 1 auto;
  max-height:min(72vh,660px);
}
.old-power-hud{
  order:2;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:min(100%,660px)!important;
  margin:8px auto 0!important;
  flex:0 0 auto;
}
.board-control-hint{
  order:3;
  margin-top:8px!important;
}
@media(max-width:560px){
  .old-board-panel{
    padding-top:10px!important;
    padding-left:8px!important;
    padding-right:8px!important;
    gap:6px!important;
    min-height:auto!important;
  }
  .old-target-instruction{
    width:100%!important;
    padding:7px 9px!important;
    margin-bottom:5px!important;
  }
  .old-target-instruction span{font-size:10px!important;}
  .old-target-instruction strong{font-size:12px!important;}
  .old-play-canvas{max-height:58vh;}
  .old-power-hud{
    width:100%!important;
    margin-top:5px!important;
  }
  .board-control-hint{
    width:100%!important;
    margin-top:5px!important;
  }
}


/* Hide empty play help panel after moving default copy into admin Play instruction setting */
.game-help:empty{display:none!important}


/* Practice play icon */
.practice-play-head {
  display: flex;
  align-items: center;
  gap: 16px;
}
.practice-play-head > div {
  min-width: 0;
}
.practice-play-icon {
  width: 72px;
  height: 72px;
  flex: 0 0 auto;
  object-fit: contain;
  border-radius: 20px;
  filter: drop-shadow(0 14px 24px rgba(0,0,0,.32));
}
.live-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.live-practice-icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
}
@media(max-width:560px) {
  .practice-play-head {
    align-items: flex-start;
    gap: 11px;
  }
  .practice-play-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
  }
  .live-practice-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
  }
}


/* App/share icon usage on play screens */
.play-icon-head,
.practice-play-head{
  align-items:center;
}
.play-app-icon,
.live-play-app-icon{
  width:64px;
  height:64px;
  object-fit:contain;
  flex:0 0 auto;
  border-radius:18px;
  filter:drop-shadow(0 14px 24px rgba(0,0,0,.38));
}
.live-play-app-icon{
  width:58px;
  height:58px;
  border-radius:16px;
}
.live-title-row{
  align-items:center;
}
@media(max-width:560px){
  .play-app-icon,
  .live-play-app-icon{
    width:48px;
    height:48px;
    border-radius:14px;
  }
}

/* Mobile-readable terms acceptance block */
.terms-accept {
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 16px 0 18px !important;
  padding: 14px 15px !important;
  border-radius: 18px !important;
  background: rgba(15, 23, 42, .92) !important;
  border: 1px solid rgba(246, 185, 59, .28) !important;
  color: #f8fafc !important;
  line-height: 1.45 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 34px rgba(0,0,0,.22) !important;
}
.terms-accept input[type="checkbox"] {
  flex: 0 0 auto !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  margin: 1px 0 0 !important;
  accent-color: #f6b93b;
}
.terms-copy {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  color: #f8fafc !important;
  font-size: 15px !important;
  line-height: 1.48 !important;
  letter-spacing: .005em;
}
.terms-copy .inline-link {
  display: inline !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 2px !important;
  padding: 0 1px !important;
  vertical-align: baseline !important;
  color: #facc15 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  white-space: nowrap !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}
.terms-copy .device-note {
  display: inline;
  color: #cbd5e1 !important;
}
.form .terms-accept,
.form .terms-accept .terms-copy,
.form .terms-accept span,
.form .terms-accept button {
  font-size: 15px !important;
}
@media(max-width:560px) {
  .legal-popup-actions {
    gap: 8px !important;
  }
  .terms-accept {
    padding: 13px 12px !important;
    border-radius: 16px !important;
    gap: 10px !important;
  }
  .terms-copy,
  .form .terms-accept,
  .form .terms-accept .terms-copy,
  .form .terms-accept span,
  .form .terms-accept button {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  .terms-copy .device-note {
    display: block !important;
    margin-top: 5px !important;
  }
}
@media(max-width:360px) {
  .terms-copy,
  .form .terms-accept,
  .form .terms-accept .terms-copy,
  .form .terms-accept span,
  .form .terms-accept button {
    font-size: 13px !important;
  }
}



/* Terms / privacy acceptance mobile formatting - forced v2
   This is deliberately HTML-class based rather than relying on the old label.check layout. */
.legal-accept-card[data-terms-format="v2"]{
  display:block!important;
  margin:16px 0 18px!important;
  padding:14px 15px!important;
  border-radius:18px!important;
  background:rgba(15,23,42,.96)!important;
  border:1px solid rgba(246,185,59,.36)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 36px rgba(0,0,0,.28)!important;
  color:#f8fafc!important;
}
.legal-accept-row{
  display:none!important;
  align-items:flex-start!important;
  gap:11px!important;
  width:100%!important;
}
.form .legal-accept-card input[type="checkbox"],
.legal-accept-card input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:auto!important;
  display:block!important;
  flex:0 0 22px!important;
  width:22px!important;
  min-width:22px!important;
  max-width:22px!important;
  height:22px!important;
  margin:2px 0 0!important;
  padding:0!important;
  accent-color:#f6b93b!important;
}
.legal-accept-copy{
  display:block!important;
  flex:1 1 auto!important;
  min-width:0!important;
  width:auto!important;
  color:#f8fafc!important;
  font-size:15px!important;
  line-height:1.55!important;
  letter-spacing:.005em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.form .legal-accept-label,
.legal-accept-label{
  display:inline!important;
  margin:0!important;
  padding:0!important;
  color:#f8fafc!important;
  font:inherit!important;
  line-height:inherit!important;
  letter-spacing:inherit!important;
}
.legal-accept-copy .legal-link,
.legal-accept-copy .inline-link{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  margin:0!important;
  padding:0 1px!important;
  border:0!important;
  background:transparent!important;
  color:#facc15!important;
  font:inherit!important;
  font-weight:900!important;
  line-height:inherit!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
  text-decoration-thickness:2px!important;
  white-space:nowrap!important;
  vertical-align:baseline!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.legal-device-note{
  display:block!important;
  margin:8px 0 0 33px!important;
  color:#dbeafe!important;
  font-size:13px!important;
  line-height:1.45!important;
  letter-spacing:.01em!important;
}
@media(max-width:560px){
  .legal-popup-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-bottom:10px!important}
  .legal-popup-actions .btn{width:100%!important;min-height:42px!important;padding:10px 11px!important;font-size:13px!important}
  .legal-accept-card[data-terms-format="v2"]{padding:13px 12px!important;border-radius:16px!important;margin:14px 0 16px!important}
  .legal-accept-row{gap:10px!important}
  .legal-accept-copy{font-size:14px!important;line-height:1.55!important}
  .legal-device-note{margin-left:32px!important;margin-top:7px!important;font-size:12.5px!important;line-height:1.45!important}
}
@media(max-width:370px){
  .legal-popup-actions{grid-template-columns:1fr!important}
  .legal-accept-copy{font-size:13.5px!important;line-height:1.6!important}
  .legal-device-note{font-size:12px!important}
}


/* Terms / privacy acceptance mobile formatting - forced v3
   Uses flex-wrapped word/link items so mobile cannot join text such as theTerms. */
.legal-accept-card[data-terms-format="v3"],
.legal-accept-card-v3{
  display:block!important;
  margin:16px 0 18px!important;
  padding:15px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(2,6,23,.98))!important;
  border:1px solid rgba(246,185,59,.42)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 38px rgba(0,0,0,.32)!important;
  color:#f8fafc!important;
  overflow:hidden!important;
}
.legal-accept-card[data-terms-format="v3"] .legal-accept-row,
.legal-accept-card-v3 .legal-accept-row{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  align-items:start!important;
  gap:11px!important;
  width:100%!important;
}
.form .legal-accept-card[data-terms-format="v3"] input[type="checkbox"],
.legal-accept-card[data-terms-format="v3"] input[type="checkbox"],
.form .legal-accept-card-v3 input[type="checkbox"],
.legal-accept-card-v3 input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:auto!important;
  display:block!important;
  width:22px!important;
  min-width:22px!important;
  height:22px!important;
  margin:3px 0 0!important;
  padding:0!important;
  accent-color:#f6b93b!important;
}
.legal-accept-card[data-terms-format="v3"] .legal-accept-copy,
.legal-accept-card-v3 .legal-accept-copy{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:baseline!important;
  gap:2px 6px!important;
  min-width:0!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#f8fafc!important;
  font-size:15px!important;
  font-weight:750!important;
  line-height:1.55!important;
  letter-spacing:.005em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.legal-accept-card[data-terms-format="v3"] .legal-accept-copy span,
.legal-accept-card-v3 .legal-accept-copy span{
  display:inline-block!important;
  color:#f8fafc!important;
  font:inherit!important;
  line-height:inherit!important;
  white-space:normal!important;
}
.legal-accept-card[data-terms-format="v3"] .legal-link,
.legal-accept-card-v3 .legal-link{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:auto!important;
  max-width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:0 2px!important;
  border:0!important;
  background:transparent!important;
  color:#facc15!important;
  font:inherit!important;
  font-weight:950!important;
  line-height:inherit!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
  text-decoration-thickness:2px!important;
  white-space:nowrap!important;
  vertical-align:baseline!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.legal-accept-card[data-terms-format="v3"] .legal-device-note,
.legal-accept-card-v3 .legal-device-note{
  display:block!important;
  margin:9px 0 0 35px!important;
  padding-top:8px!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  color:#dbeafe!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.45!important;
  letter-spacing:.01em!important;
}
@media(max-width:560px){
  .legal-accept-card[data-terms-format="v3"],
  .legal-accept-card-v3{
    padding:14px 12px!important;
    border-radius:16px!important;
    margin:14px 0 16px!important;
  }
  .legal-accept-card[data-terms-format="v3"] .legal-accept-row,
  .legal-accept-card-v3 .legal-accept-row{
    grid-template-columns:24px minmax(0,1fr)!important;
    gap:10px!important;
  }
  .legal-accept-card[data-terms-format="v3"] .legal-accept-copy,
  .legal-accept-card-v3 .legal-accept-copy{
    gap:2px 5px!important;
    font-size:14px!important;
    line-height:1.58!important;
  }
  .legal-accept-card[data-terms-format="v3"] .legal-device-note,
  .legal-accept-card-v3 .legal-device-note{
    margin-left:34px!important;
    margin-top:8px!important;
    font-size:12.5px!important;
    line-height:1.45!important;
  }
}
@media(max-width:370px){
  .legal-accept-card[data-terms-format="v3"] .legal-accept-copy,
  .legal-accept-card-v3 .legal-accept-copy{
    font-size:13px!important;
    line-height:1.62!important;
    gap:1px 4px!important;
  }
  .legal-accept-card[data-terms-format="v3"] .legal-device-note,
  .legal-accept-card-v3 .legal-device-note{
    font-size:12px!important;
  }
}


/* Terms / privacy mobile formatting - forced v4 from screenshot fix
   Keep the sentence as normal inline text so mobile wraps naturally. */
.legal-accept-card[data-terms-format="v4"],
.legal-accept-card-v4{
  display:block!important;
  margin:16px 0 18px!important;
  padding:14px 14px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(2,6,23,.98))!important;
  border:1px solid rgba(246,185,59,.42)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 38px rgba(0,0,0,.32)!important;
  color:#f8fafc!important;
  overflow:hidden!important;
}
.legal-accept-card[data-terms-format="v4"] .legal-accept-row,
.legal-accept-card-v4 .legal-accept-row{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  align-items:start!important;
  column-gap:10px!important;
  width:100%!important;
}
.form .legal-accept-card[data-terms-format="v4"] input[type="checkbox"],
.legal-accept-card[data-terms-format="v4"] input[type="checkbox"],
.form .legal-accept-card-v4 input[type="checkbox"],
.legal-accept-card-v4 input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:auto!important;
  display:block!important;
  width:18px!important;
  min-width:18px!important;
  max-width:18px!important;
  height:18px!important;
  margin:2px 0 0!important;
  padding:0!important;
  accent-color:#f6b93b!important;
}
.legal-accept-card[data-terms-format="v4"] .legal-accept-text,
.legal-accept-card-v4 .legal-accept-text{
  display:block!important;
  min-width:0!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
}
.legal-accept-card[data-terms-format="v4"] .legal-accept-copy,
.legal-accept-card-v4 .legal-accept-copy{
  display:block!important;
  min-width:0!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#f8fafc!important;
  font-size:14px!important;
  font-weight:750!important;
  line-height:1.45!important;
  letter-spacing:0!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.legal-accept-card[data-terms-format="v4"] .legal-link,
.legal-accept-card-v4 .legal-link{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:0!important;
  margin:0 2px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#facc15!important;
  font:inherit!important;
  font-weight:950!important;
  line-height:inherit!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
  text-decoration-thickness:2px!important;
  white-space:normal!important;
  vertical-align:baseline!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.legal-accept-card[data-terms-format="v4"] .legal-device-note,
.legal-accept-card-v4 .legal-device-note{
  display:block!important;
  margin:7px 0 0!important;
  padding-top:7px!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  color:#dbeafe!important;
  font-size:12.5px!important;
  font-weight:700!important;
  line-height:1.42!important;
  letter-spacing:0!important;
}
@media(max-width:560px){
  .legal-accept-card[data-terms-format="v4"],
  .legal-accept-card-v4{
    padding:13px 12px!important;
    border-radius:16px!important;
    margin:14px 0 16px!important;
  }
  .legal-accept-card[data-terms-format="v4"] .legal-accept-row,
  .legal-accept-card-v4 .legal-accept-row{
    grid-template-columns:20px minmax(0,1fr)!important;
    column-gap:9px!important;
  }
  .form .legal-accept-card[data-terms-format="v4"] input[type="checkbox"],
  .legal-accept-card[data-terms-format="v4"] input[type="checkbox"],
  .form .legal-accept-card-v4 input[type="checkbox"],
  .legal-accept-card-v4 input[type="checkbox"]{
    width:16px!important;
    min-width:16px!important;
    max-width:16px!important;
    height:16px!important;
    margin-top:3px!important;
  }
  .legal-accept-card[data-terms-format="v4"] .legal-accept-copy,
  .legal-accept-card-v4 .legal-accept-copy{
    font-size:13.5px!important;
    line-height:1.48!important;
  }
  .legal-accept-card[data-terms-format="v4"] .legal-device-note,
  .legal-accept-card-v4 .legal-device-note{
    font-size:12px!important;
    line-height:1.4!important;
  }
}
@media(max-width:370px){
  .legal-accept-card[data-terms-format="v4"] .legal-accept-copy,
  .legal-accept-card-v4 .legal-accept-copy{
    font-size:13px!important;
    line-height:1.5!important;
  }
  .legal-accept-card[data-terms-format="v4"] .legal-device-note,
  .legal-accept-card-v4 .legal-device-note{
    font-size:11.75px!important;
  }
}

/* Mobile play header width fix - 20260706-play-header-v1 */
@media(max-width:740px){
  .app-shell{
    width:100%!important;
    max-width:100%!important;
    padding-left:5px!important;
    padding-right:5px!important;
    overflow-x:hidden!important;
  }
  .topbar{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:5px!important;
    padding:5px!important;
    margin:0!important;
    overflow:visible!important;
  }
  .topbar .brand{
    min-width:0!important;
    max-width:100%!important;
    gap:8px!important;
  }
  .topbar .brand img{
    width:64px!important;
    height:64px!important;
    flex:0 0 64px!important;
  }
  .topbar .brand span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:20px!important;
  }
  .mobile-menu-toggle{
    min-width:0!important;
    max-width:104px!important;
    padding:8px 10px!important;
  }
  .top-menu{
    width:100%!important;
    max-width:100%!important;
    padding:5px!important;
  }
  .game-head,
  .live-topline{
    width:100%!important;
    max-width:100%!important;
    padding:5px!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow:hidden!important;
  }
  .live-title-row,
  .practice-play-head,
  .play-icon-head{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .live-title-row > div,
  .practice-play-head > div,
  .play-icon-head > div{
    min-width:0!important;
    max-width:100%!important;
  }
  .game-head h1,
  .live-topline h2,
  .live-topline h2 small{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
  }
  .live-prize{
    width:100%!important;
    max-width:100%!important;
    padding:8px 10px!important;
  }
}
@media(max-width:390px){
  .topbar .brand img{
    width:56px!important;
    height:56px!important;
    flex-basis:56px!important;
  }
  .topbar .brand span{
    font-size:18px!important;
  }
  .mobile-menu-toggle{
    max-width:94px!important;
    padding:8px!important;
  }
}

/* Mobile play logo 100px width release - 20260706-play-logo-100-v1 */
@media(max-width:740px){
  .page-route-play-qualification .topbar .brand,
  .page-route-friendly .topbar .brand,
  .page-route-practice .topbar .brand,
  .page-route-match .topbar .brand{
    flex:1 1 auto!important;
  }
  .page-route-play-qualification .mobile-menu-toggle,
  .page-route-friendly .mobile-menu-toggle,
  .page-route-practice .mobile-menu-toggle,
  .page-route-match .mobile-menu-toggle{
    flex:0 0 auto!important;
  }
  .page-route-play-qualification .topbar .brand img,
  .page-route-friendly .topbar .brand img,
  .page-route-practice .topbar .brand img,
  .page-route-match .topbar .brand img{
    width:100px!important;
    height:100px!important;
    flex:0 0 100px!important;
  }
}
@media(max-width:390px){
  .page-route-play-qualification .topbar .brand img,
  .page-route-friendly .topbar .brand img,
  .page-route-practice .topbar .brand img,
  .page-route-match .topbar .brand img{
    width:100px!important;
    height:100px!important;
    flex-basis:100px!important;
  }
}

/* Mobile public/play logo hard override - 20260706-mobile-logo-100-v2
   Previous 100px release missed the qualification play route because its route class is page-route-qualify. */
@media(max-width:740px){
  .public-page .topbar .brand{
    min-width:0!important;
    max-width:100%!important;
    flex:1 1 auto!important;
    gap:8px!important;
  }
  .public-page .topbar .brand img{
    width:100px!important;
    min-width:100px!important;
    max-width:100px!important;
    height:auto!important;
    flex:0 0 100px!important;
    object-fit:contain!important;
  }
  .public-page .topbar .brand span{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .public-page .mobile-menu-toggle{
    flex:0 0 auto!important;
  }
}
@media(max-width:390px){
  .public-page .topbar .brand img{
    width:100px!important;
    min-width:100px!important;
    max-width:100px!important;
    height:auto!important;
    flex-basis:100px!important;
  }
}


/* Active run background image - 20260706-active-run-bg-v1 */
.active-run{
  position:relative;
  min-height:150px;
  background-image:
    linear-gradient(90deg, rgba(12,17,29,.97) 0%, rgba(12,17,29,.90) 54%, rgba(12,17,29,.45) 100%),
    url("../img/darts-target-money.png")!important;
  background-repeat:no-repeat, no-repeat!important;
  background-position:left top, right center!important;
  background-size:100% 100%, auto 92%!important;
  padding-right:clamp(135px, 28vw, 240px)!important;
}
@media(max-width:740px){
  .active-run{
    min-height:135px;
    background-size:100% 100%, auto 118px!important;
    padding-right:118px!important;
  }
}
@media(max-width:390px){
  .active-run{
    background-size:100% 100%, auto 104px!important;
    padding-right:104px!important;
  }
}

/* Gameplay visual polish for public play screens - 20260706-gameplay-visuals-v1 */
body.page-route-qualify,
body.page-route-friendly,
body.page-route-practice,
body.page-route-match{
  background:
    radial-gradient(circle at 50% -8%, rgba(250,204,21,.19), transparent 34%),
    radial-gradient(circle at 12% 16%, rgba(96,165,250,.11), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(248,113,113,.11), transparent 30%),
    linear-gradient(180deg, #05070d 0%, #020617 100%)!important;
}
body.page-route-qualify main,
body.page-route-friendly main,
body.page-route-practice main,
body.page-route-match main{
  position:relative;
}
body.page-route-qualify main:before,
body.page-route-friendly main:before,
body.page-route-practice main:before,
body.page-route-match main:before{
  content:"";
  position:absolute;
  inset:-8px -4px auto;
  height:240px;
  pointer-events:none;
  opacity:.42;
  background:
    linear-gradient(rgba(250,204,21,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(250,204,21,.07) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(180deg, #000, transparent);
}
body.page-route-qualify .game-head,
body.page-route-friendly .game-head,
body.page-route-practice .game-head,
body.page-route-match .game-head{
  position:relative;
  overflow:hidden;
  margin:12px 0 14px;
  padding:18px!important;
  border:1px solid rgba(250,204,21,.24);
  border-radius:24px;
  background:
    linear-gradient(135deg, rgba(250,204,21,.14), rgba(14,21,36,.94) 42%, rgba(2,6,23,.92)),
    radial-gradient(circle at right center, rgba(250,204,21,.18), transparent 44%);
  box-shadow:0 20px 54px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08);
}
body.page-route-qualify .game-head:after,
body.page-route-friendly .game-head:after,
body.page-route-practice .game-head:after,
body.page-route-match .game-head:after{
  content:"";
  position:absolute;
  right:-50px;
  top:50%;
  width:260px;
  aspect-ratio:1;
  transform:translateY(-50%);
  border-radius:50%;
  opacity:.22;
  pointer-events:none;
  background:
    radial-gradient(circle, transparent 0 12%, rgba(250,204,21,.9) 13% 15%, transparent 16% 35%, rgba(250,204,21,.72) 36% 38%, transparent 39% 58%, rgba(255,255,255,.72) 59% 61%, transparent 62% 100%);
}
body.page-route-qualify .game-head > *,
body.page-route-friendly .game-head > *,
body.page-route-practice .game-head > *,
body.page-route-match .game-head > *{
  position:relative;
  z-index:1;
}
body.page-route-qualify .game-head h1,
body.page-route-friendly .game-head h1,
body.page-route-practice .game-head h1,
body.page-route-match .game-head h1{
  font-size:clamp(28px, 5vw, 48px);
  line-height:.98;
  letter-spacing:-.035em;
  text-shadow:0 12px 32px rgba(0,0,0,.45);
}
body.page-route-qualify .game-head p,
body.page-route-friendly .game-head p,
body.page-route-practice .game-head p,
body.page-route-match .game-head p{
  max-width:760px;
  color:#dbeafe;
  font-weight:700;
}
body.page-route-qualify .game-head img,
body.page-route-friendly .game-head img,
body.page-route-practice .game-head img,
body.page-route-match .game-head img{
  border-radius:22px;
  background:rgba(2,6,23,.42);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(0,0,0,.34), 0 0 0 6px rgba(250,204,21,.06);
}
body.page-route-qualify .game-card,
body.page-route-friendly .game-card,
body.page-route-practice .game-card,
body.page-route-match .game-card{
  position:relative;
  overflow:hidden;
  padding:10px;
  border-radius:28px;
  border-color:rgba(250,204,21,.24);
  background:
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.98)),
    radial-gradient(circle at center, rgba(250,204,21,.12), transparent 46%);
  box-shadow:0 24px 74px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.035);
}
body.page-route-qualify .game-card:before,
body.page-route-friendly .game-card:before,
body.page-route-practice .game-card:before,
body.page-route-match .game-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%, rgba(250,204,21,.14), transparent 22%),
    linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent);
  opacity:.8;
}
#dartGame{
  position:relative;
  z-index:1;
}
body.page-route-qualify .darts-live,
body.page-route-friendly .darts-live,
body.page-route-practice .darts-live,
body.page-route-match .darts-live{
  padding:4px;
}
body.page-route-qualify .live-topline,
body.page-route-friendly .live-topline,
body.page-route-practice .live-topline,
body.page-route-match .live-topline{
  padding:12px 12px 14px!important;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:linear-gradient(135deg, rgba(30,41,59,.72), rgba(2,6,23,.7));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
body.page-route-qualify .live-title-row,
body.page-route-friendly .live-title-row,
body.page-route-practice .live-title-row,
body.page-route-match .live-title-row{
  display:flex;
  align-items:center;
  gap:12px;
}
body.page-route-qualify .live-play-app-icon,
body.page-route-friendly .live-play-app-icon,
body.page-route-practice .live-play-app-icon,
body.page-route-match .live-play-app-icon,
body.page-route-qualify .play-app-icon,
body.page-route-friendly .play-app-icon,
body.page-route-practice .play-app-icon,
body.page-route-match .play-app-icon{
  border-radius:18px;
  border:1px solid rgba(250,204,21,.22);
  background:rgba(2,6,23,.56);
  box-shadow:0 14px 30px rgba(0,0,0,.28), 0 0 24px rgba(250,204,21,.12);
}
body.page-route-qualify .eyebrow,
body.page-route-friendly .eyebrow,
body.page-route-practice .eyebrow,
body.page-route-match .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
body.page-route-qualify .eyebrow:before,
body.page-route-friendly .eyebrow:before,
body.page-route-practice .eyebrow:before,
body.page-route-match .eyebrow:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 14px rgba(34,197,94,.75);
}
body.page-route-qualify .arena-scorebar,
body.page-route-friendly .arena-scorebar,
body.page-route-practice .arena-scorebar,
body.page-route-match .arena-scorebar{
  padding:4px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:24px;
  background:rgba(2,6,23,.42);
}
body.page-route-qualify .arena-score,
body.page-route-friendly .arena-score,
body.page-route-practice .arena-score,
body.page-route-match .arena-score,
body.page-route-qualify .arena-round,
body.page-route-friendly .arena-round,
body.page-route-practice .arena-round,
body.page-route-match .arena-round{
  background:linear-gradient(180deg, rgba(30,41,59,.96), rgba(7,13,25,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 12px 28px rgba(0,0,0,.22);
}
body.page-route-qualify .active-board-panel,
body.page-route-friendly .active-board-panel,
body.page-route-practice .active-board-panel,
body.page-route-match .active-board-panel{
  border-color:rgba(250,204,21,.22);
  background:
    radial-gradient(circle at 50% 44%, rgba(30,41,59,.9), rgba(2,6,23,.98) 68%),
    linear-gradient(180deg, rgba(250,204,21,.08), transparent 42%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), inset 0 -28px 90px rgba(0,0,0,.34), 0 24px 60px rgba(0,0,0,.34);
}
body.page-route-qualify .active-board-panel:before,
body.page-route-friendly .active-board-panel:before,
body.page-route-practice .active-board-panel:before,
body.page-route-match .active-board-panel:before{
  opacity:.82;
}
body.page-route-qualify .active-throw-panel .metric-row,
body.page-route-friendly .active-throw-panel .metric-row,
body.page-route-practice .active-throw-panel .metric-row,
body.page-route-match .active-throw-panel .metric-row,
body.page-route-qualify .active-throw-panel .game-help,
body.page-route-friendly .active-throw-panel .game-help,
body.page-route-practice .active-throw-panel .game-help,
body.page-route-match .active-throw-panel .game-help,
body.page-route-qualify .active-throw-panel .throw-log div,
body.page-route-friendly .active-throw-panel .throw-log div,
body.page-route-practice .active-throw-panel .throw-log div,
body.page-route-match .active-throw-panel .throw-log div{
  background:linear-gradient(180deg, rgba(15,23,42,.9), rgba(2,6,23,.78));
  border-color:rgba(255,255,255,.1);
}
body.page-route-qualify .instant-target-card,
body.page-route-friendly .instant-target-card,
body.page-route-practice .instant-target-card,
body.page-route-match .instant-target-card{
  background:linear-gradient(135deg, rgba(20,83,45,.72), rgba(6,78,59,.34));
  box-shadow:0 14px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
}
body.page-route-qualify .board-power-hud,
body.page-route-friendly .board-power-hud,
body.page-route-practice .board-power-hud,
body.page-route-match .board-power-hud{
  border-color:rgba(250,204,21,.22);
  background:rgba(2,6,23,.86);
  box-shadow:0 16px 34px rgba(0,0,0,.38), 0 0 26px rgba(250,204,21,.09);
}
@media(max-width:740px){
  body.page-route-qualify .game-card,
  body.page-route-friendly .game-card,
  body.page-route-practice .game-card,
  body.page-route-match .game-card{
    padding:5px;
    border-radius:22px;
  }
  body.page-route-qualify .game-head,
  body.page-route-friendly .game-head,
  body.page-route-practice .game-head,
  body.page-route-match .game-head{
    padding:14px!important;
    border-radius:20px;
  }
  body.page-route-qualify .game-head:after,
  body.page-route-friendly .game-head:after,
  body.page-route-practice .game-head:after,
  body.page-route-match .game-head:after{
    right:-72px;
    width:210px;
  }
  body.page-route-qualify .live-topline,
  body.page-route-friendly .live-topline,
  body.page-route-practice .live-topline,
  body.page-route-match .live-topline{
    padding:10px!important;
  }
}


/* Uploadable darts play background - 20260706-darts-bg-persist-v1 */
body.page-route-qualify:after,
body.page-route-friendly:after,
body.page-route-practice:after,
body.page-route-match:after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.24;
  background-image:var(--darts-play-bg);
  background-repeat:no-repeat;
  background-position:right center;
  background-size:min(46vw,520px) auto;
  mix-blend-mode:screen;
}
body.page-route-qualify .app-shell,
body.page-route-friendly .app-shell,
body.page-route-practice .app-shell,
body.page-route-match .app-shell{
  position:relative;
  z-index:1;
}
@media(max-width:740px){
  body.page-route-qualify:after,
  body.page-route-friendly:after,
  body.page-route-practice:after,
  body.page-route-match:after{
    opacity:.14;
    background-position:right top 96px;
    background-size:180px auto;
  }
}


/* Uploadable darts play background save/show fix - 20260706-darts-bg-persist-v1 */
body.page-route-qualify:after,
body.page-route-friendly:after,
body.page-route-practice:after,
body.page-route-match:after{
  opacity:.34!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:min(54vw,640px) auto!important;
  mix-blend-mode:normal!important;
  filter:drop-shadow(0 22px 55px rgba(0,0,0,.45));
}
@media(max-width:740px){
  body.page-route-qualify:after,
  body.page-route-friendly:after,
  body.page-route-practice:after,
  body.page-route-match:after{
    opacity:.22!important;
    background-position:right 5px top 98px!important;
    background-size:210px auto!important;
  }
}


/* Uploadable darts play background persistence/render fix - 20260706-darts-bg-persist-v1 */
body.page-route-qualify,
body.page-route-friendly,
body.page-route-practice,
body.page-route-match,
body.page-route-play,
body.page-route-play-qualification{
  background-image:
    radial-gradient(circle at 50% -8%, rgba(250,204,21,.19), transparent 34%),
    var(--darts-play-bg, none),
    linear-gradient(180deg, #05070d 0%, #020617 100%)!important;
  background-repeat:no-repeat,no-repeat,no-repeat!important;
  background-position:center top,right center,center!important;
  background-size:100% 100%,min(54vw,640px) auto,100% 100%!important;
  background-attachment:scroll,fixed,scroll!important;
}
body.page-route-qualify:after,
body.page-route-friendly:after,
body.page-route-practice:after,
body.page-route-match:after,
body.page-route-play:after,
body.page-route-play-qualification:after{
  background-image:var(--darts-play-bg, none)!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:min(54vw,640px) auto!important;
  opacity:.42!important;
}
@media(max-width:740px){
  body.page-route-qualify,
  body.page-route-friendly,
  body.page-route-practice,
  body.page-route-match,
  body.page-route-play,
  body.page-route-play-qualification{
    background-position:center top,right 5px top 98px,center!important;
    background-size:100% 100%,220px auto,100% 100%!important;
    background-attachment:scroll,scroll,scroll!important;
  }
  body.page-route-qualify:after,
  body.page-route-friendly:after,
  body.page-route-practice:after,
  body.page-route-match:after,
  body.page-route-play:after,
  body.page-route-play-qualification:after{
    opacity:.26!important;
    background-position:right 5px top 98px!important;
    background-size:220px auto!important;
  }
}


/* Darts background hard render fix - 20260706-darts-bg-hard-fix */
body.page-route-qualify,
body.page-route-friendly,
body.page-route-practice,
body.page-route-match,
body.page-route-play,
body.page-route-play-qualification{
  background-image:
    radial-gradient(circle at 50% -8%, rgba(250,204,21,.19), transparent 34%),
    var(--darts-play-bg, none),
    linear-gradient(180deg, #05070d 0%, #020617 100%)!important;
  background-repeat:no-repeat,no-repeat,no-repeat!important;
  background-position:center top,right center,center!important;
  background-size:100% 100%,min(62vw,760px) auto,100% 100%!important;
}
body.page-route-qualify:after,
body.page-route-friendly:after,
body.page-route-practice:after,
body.page-route-match:after,
body.page-route-play:after,
body.page-route-play-qualification:after{
  background-image:var(--darts-play-bg, none)!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:min(62vw,760px) auto!important;
  opacity:.5!important;
  mix-blend-mode:normal!important;
}
@media(max-width:740px){
  body.page-route-qualify,
  body.page-route-friendly,
  body.page-route-practice,
  body.page-route-match,
  body.page-route-play,
  body.page-route-play-qualification{
    background-position:center top,right 5px top 98px,center!important;
    background-size:100% 100%,260px auto,100% 100%!important;
  }
  body.page-route-qualify:after,
  body.page-route-friendly:after,
  body.page-route-practice:after,
  body.page-route-match:after,
  body.page-route-play:after,
  body.page-route-play-qualification:after{
    opacity:.34!important;
    background-position:right 5px top 98px!important;
    background-size:260px auto!important;
  }
}


/* Force uploaded darts play background into visible gameplay surfaces - 20260706-darts-bg-play-surface-v1 */
body.page-route-qualify .game-head,
body.page-route-friendly .game-head,
body.page-route-practice .game-head,
body.page-route-match .game-head,
body.page-route-qualify .game-card,
body.page-route-friendly .game-card,
body.page-route-practice .game-card,
body.page-route-match .game-card{
  background-image:
    linear-gradient(90deg, rgba(2,6,23,.94) 0%, rgba(2,6,23,.82) 48%, rgba(2,6,23,.42) 100%),
    var(--darts-play-bg, none),
    linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.98))!important;
  background-repeat:no-repeat,no-repeat,no-repeat!important;
  background-position:center,right center,center!important;
  background-size:cover,min(64vw,820px) auto,cover!important;
}
#dartGame[data-darts-background]{
  --darts-surface-bg:var(--darts-play-bg, none);
}
#dartGame[data-darts-background] .darts-live,
#dartGame[data-darts-background] .darts-live.has-darts-background{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:24px;
  background-image:
    linear-gradient(90deg, rgba(2,6,23,.94) 0%, rgba(2,6,23,.78) 52%, rgba(2,6,23,.34) 100%),
    var(--darts-play-bg, none)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:center,right center!important;
  background-size:cover,min(68vw,860px) auto!important;
}
#dartGame[data-darts-background] .darts-live:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:var(--darts-play-bg, none);
  background-repeat:no-repeat;
  background-position:right center;
  background-size:min(68vw,860px) auto;
  opacity:.72;
  filter:drop-shadow(0 26px 58px rgba(0,0,0,.46));
}
#dartGame[data-darts-background] .active-board-panel,
#dartGame[data-darts-background] .active-throw-panel{
  background-color:rgba(2,6,23,.78)!important;
}
@media(max-width:740px){
  body.page-route-qualify .game-head,
  body.page-route-friendly .game-head,
  body.page-route-practice .game-head,
  body.page-route-match .game-head,
  body.page-route-qualify .game-card,
  body.page-route-friendly .game-card,
  body.page-route-practice .game-card,
  body.page-route-match .game-card,
  #dartGame[data-darts-background] .darts-live,
  #dartGame[data-darts-background] .darts-live.has-darts-background{
    background-position:center,right top 8px,center!important;
    background-size:cover,260px auto,cover!important;
  }
  #dartGame[data-darts-background] .darts-live:before{
    background-position:right top 8px;
    background-size:260px auto;
    opacity:.52;
  }
}


/* Direct rendered darts play background image - 20260706-darts-bg-direct-img-v1
   Uses a real <img> in the play card/live UI so the uploaded background is visible even when CSS body backgrounds are covered. */
body.page-route-qualify .game-card,
body.page-route-friendly .game-card,
body.page-route-practice .game-card,
body.page-route-match .game-card,
body.page-route-play-qualification .game-card{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate;
}
.darts-play-bg-image{
  display:block!important;
  position:absolute!important;
  top:50%!important;
  right:0!important;
  transform:translateY(-50%)!important;
  width:min(52vw,680px)!important;
  max-width:72%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:right center!important;
  opacity:.52!important;
  z-index:1!important;
  pointer-events:none!important;
  filter:drop-shadow(0 28px 64px rgba(0,0,0,.58));
}
.game-card > #dartGame{
  position:relative!important;
  z-index:3!important;
}
#dartGame[data-darts-background] .darts-live{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.darts-live-bg-img{
  display:block!important;
  position:absolute!important;
  top:50%!important;
  right:0!important;
  transform:translateY(-50%)!important;
  width:min(52vw,720px)!important;
  max-width:74%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:right center!important;
  opacity:.46!important;
  z-index:0!important;
  pointer-events:none!important;
  filter:drop-shadow(0 28px 64px rgba(0,0,0,.58));
}
#dartGame[data-darts-background] .darts-live > :not(.darts-live-bg-img){
  position:relative;
  z-index:1;
}
#dartGame[data-darts-background] .live-topline,
#dartGame[data-darts-background] .arena-scorebar,
#dartGame[data-darts-background] .active-board-panel,
#dartGame[data-darts-background] .active-throw-panel{
  background-color:rgba(2,6,23,.68)!important;
  backdrop-filter:blur(5px);
}
@media(max-width:740px){
  .darts-play-bg-image,
  .darts-live-bg-img{
    top:8px!important;
    right:5px!important;
    transform:none!important;
    width:270px!important;
    max-width:76%!important;
    max-height:44%!important;
    opacity:.4!important;
  }
}


/* Active board-only uploaded darts background - 20260706-active-board-bg-v1
   The uploaded darts background belongs inside the .active-board-panel behind the dartboard, not behind the wider play section. */
body.page-route-qualify,
body.page-route-friendly,
body.page-route-practice,
body.page-route-match,
body.page-route-play,
body.page-route-play-qualification{
  background-image:
    radial-gradient(circle at 50% -8%, rgba(250,204,21,.19), transparent 34%),
    linear-gradient(180deg, #05070d 0%, #020617 100%)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:center top,center!important;
  background-size:100% 100%,100% 100%!important;
}
body.page-route-qualify:after,
body.page-route-friendly:after,
body.page-route-practice:after,
body.page-route-match:after,
body.page-route-play:after,
body.page-route-play-qualification:after{
  content:none!important;
  display:none!important;
  background-image:none!important;
}
body.page-route-qualify .game-head,
body.page-route-friendly .game-head,
body.page-route-practice .game-head,
body.page-route-match .game-head,
body.page-route-qualify .game-card,
body.page-route-friendly .game-card,
body.page-route-practice .game-card,
body.page-route-match .game-card{
  background-image:linear-gradient(180deg, rgba(15,23,42,.94), rgba(2,6,23,.98))!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:cover!important;
}
#dartGame[data-darts-background] .darts-live,
#dartGame[data-darts-background] .darts-live.has-darts-background{
  background-image:none!important;
}
#dartGame[data-darts-background] .darts-live:before{
  content:none!important;
  display:none!important;
  background-image:none!important;
}
.darts-play-bg-image,
.darts-live-bg-img{
  display:none!important;
}
#dartGame[data-darts-background] .active-board-panel{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 44%, rgba(15,23,42,.34), rgba(2,6,23,.88) 72%),
    linear-gradient(180deg, rgba(250,204,21,.08), transparent 42%)!important;
  background-color:rgba(2,6,23,.9)!important;
}
.active-board-bg-img{
  display:block!important;
  position:absolute!important;
  left:0;
  top:0;
  width:0;
  height:0;
  object-fit:contain!important;
  object-position:center center!important;
  border-radius:0!important;
  opacity:.98!important;
  z-index:0!important;
  pointer-events:none!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:saturate(1.02) contrast(1.02) brightness(.96);
}
#dartGame[data-darts-background] .active-board-panel .target-instruction,
#dartGame[data-darts-background] .active-board-panel .active-board,
#dartGame[data-darts-background] .active-board-panel .board-power-hud,
#dartGame[data-darts-background] .active-board-panel .board-control-hint{
  position:relative;
  z-index:3;
}
#dartGame[data-darts-background] .active-board-panel:before,
#dartGame[data-darts-background] .active-board-panel:after{
  z-index:2!important;
}
#dartGame[data-darts-background] .active-board{
  position:relative!important;
  z-index:4!important;
}
#dartGame[data-darts-background] .target-instruction,
#dartGame[data-darts-background] .board-power-hud,
#dartGame[data-darts-background] .board-control-hint{
  position:relative;
  z-index:6!important;
}
#dartGame[data-darts-background] .flight-dart,
#dartGame[data-darts-background] .hit-zoom-badge{
  z-index:7!important;
}
#dartGame[data-darts-background] .flight-dart.landed{
  z-index:9!important;
}
@media(max-width:740px){
  .active-board-bg-img{
    object-position:center center!important;
    opacity:.96!important;
  }
}

/* Play HUD scan highlight - 20260707-mobile-no-zoom-v1 */
body.page-route-qualify .old-target-instruction,
body.page-route-friendly .old-target-instruction,
body.page-route-practice .old-target-instruction,
body.page-route-match .old-target-instruction,
body.page-route-play .old-target-instruction,
body.page-route-play-qualification .old-target-instruction,
#dartGame .old-target-instruction{
  overflow:hidden!important;
  isolation:isolate;
  border-color:rgba(56,189,248,.18)!important;
  box-shadow:
    0 10px 28px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 22px rgba(56,189,248,.06)!important;
}
body.page-route-qualify .old-target-instruction:before,
body.page-route-friendly .old-target-instruction:before,
body.page-route-practice .old-target-instruction:before,
body.page-route-match .old-target-instruction:before,
body.page-route-play .old-target-instruction:before,
body.page-route-play-qualification .old-target-instruction:before,
#dartGame .old-target-instruction:before{
  content:'';
  position:absolute;
  inset:-2px -45%;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(110deg,
      transparent 0%,
      transparent 36%,
      rgba(56,189,248,.00) 43%,
      rgba(56,189,248,.22) 48%,
      rgba(250,204,21,.18) 51%,
      rgba(255,255,255,.28) 53%,
      rgba(56,189,248,.12) 57%,
      transparent 64%,
      transparent 100%);
  transform:translateX(-42%);
  animation:kdHudScan 3.6s linear infinite;
  mix-blend-mode:screen;
}
body.page-route-qualify .old-target-instruction:after,
body.page-route-friendly .old-target-instruction:after,
body.page-route-practice .old-target-instruction:after,
body.page-route-match .old-target-instruction:after,
body.page-route-play .old-target-instruction:after,
body.page-route-play-qualification .old-target-instruction:after,
#dartGame .old-target-instruction:after{
  content:'';
  position:absolute;
  left:10px;
  right:10px;
  bottom:3px;
  height:1px;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.55),rgba(250,204,21,.36),transparent);
  opacity:.55;
}
#dartGame .old-target-instruction > span,
#dartGame .old-target-instruction > strong{
  position:relative;
  z-index:1;
}
#dartGame .old-target-instruction span{
  text-shadow:0 0 8px rgba(148,163,184,.22);
}
#dartGame .old-target-instruction strong{
  text-shadow:0 0 12px rgba(74,222,128,.35);
}
@keyframes kdHudScan{
  0%{transform:translateX(-44%);opacity:.14;}
  10%{opacity:.45;}
  50%{opacity:.8;}
  90%{opacity:.45;}
  100%{transform:translateX(44%);opacity:.14;}
}
@media (prefers-reduced-motion: reduce){
  #dartGame .old-target-instruction:before{
    animation:none!important;
    opacity:.18;
    transform:translateX(0);
  }
}


/* Play header title eye-candy - 20260707-play-header-title-eye-v1 */
body.page-route-qualify .game-head > div,
body.page-route-friendly .game-head > div,
body.page-route-practice .game-head > div,
body.page-route-match .game-head > div,
#dartGame .live-title-row > div{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-width:0;
  padding:10px 14px 10px 17px;
  border-left:3px solid rgba(250,204,21,.9);
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(15,23,42,.82),rgba(2,6,23,.52)),
    radial-gradient(circle at 0% 35%,rgba(250,204,21,.18),transparent 48%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.1),
    0 0 0 1px rgba(250,204,21,.08),
    0 14px 32px rgba(0,0,0,.22),
    -10px 0 24px rgba(250,204,21,.08);
}
body.page-route-qualify .game-head > div:before,
body.page-route-friendly .game-head > div:before,
body.page-route-practice .game-head > div:before,
body.page-route-match .game-head > div:before,
#dartGame .live-title-row > div:before{
  content:'';
  position:absolute;
  inset:-40% -30%;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0%,transparent 36%,rgba(250,204,21,.16) 43%,rgba(255,255,255,.18) 48%,rgba(56,189,248,.14) 54%,transparent 64%,transparent 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 9px);
  transform:translateX(-34%) rotate(-2deg);
  animation:kdHeaderTextSheen 4.4s ease-in-out infinite;
  mix-blend-mode:screen;
}
body.page-route-qualify .game-head > div:after,
body.page-route-friendly .game-head > div:after,
body.page-route-practice .game-head > div:after,
body.page-route-match .game-head > div:after,
#dartGame .live-title-row > div:after{
  content:'';
  position:absolute;
  left:14px;
  right:14px;
  bottom:5px;
  height:2px;
  border-radius:999px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(250,204,21,.9),rgba(56,189,248,.6),transparent);
  box-shadow:0 0 14px rgba(250,204,21,.25);
  opacity:.72;
}
body.page-route-qualify .game-head h1,
body.page-route-friendly .game-head h1,
body.page-route-practice .game-head h1,
body.page-route-match .game-head h1,
#dartGame .live-topline h2{
  display:inline-block;
  margin-bottom:4px;
  max-width:100%;
  background:linear-gradient(92deg,#ffffff 0%,#fff3b0 22%,#facc15 44%,#38bdf8 68%,#ffffff 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
  letter-spacing:.015em;
  text-shadow:none!important;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.4)) drop-shadow(0 0 12px rgba(250,204,21,.24));
  animation:kdHeaderTitleGlow 5.2s linear infinite;
}
body.page-route-qualify .game-head p,
body.page-route-friendly .game-head p,
body.page-route-practice .game-head p,
body.page-route-match .game-head p,
#dartGame .live-topline h2 small{
  color:#dbeafe!important;
  font-weight:800;
  letter-spacing:.015em;
  text-shadow:0 0 12px rgba(56,189,248,.24),0 1px 0 rgba(0,0,0,.55);
}
#dartGame .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  max-width:100%;
  margin-bottom:3px;
  padding:4px 9px;
  border-radius:999px;
  border:1px solid rgba(250,204,21,.26);
  background:linear-gradient(135deg,rgba(250,204,21,.14),rgba(249,115,22,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 18px rgba(250,204,21,.08);
  color:#fde68a!important;
  text-shadow:0 0 10px rgba(250,204,21,.28);
}
#dartGame .eyebrow:before{
  content:'';
  width:7px;
  height:7px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.13),0 0 14px rgba(34,197,94,.62);
  animation:kdHeaderDotPulse 1.6s ease-in-out infinite;
}
#dartGame .live-topline h2 small{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-top:7px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.18);
  background:rgba(14,165,233,.08);
}
@keyframes kdHeaderTextSheen{
  0%{transform:translateX(-36%) rotate(-2deg);opacity:.38;}
  45%,55%{opacity:.9;}
  100%{transform:translateX(36%) rotate(-2deg);opacity:.38;}
}
@keyframes kdHeaderTitleGlow{
  0%{background-position:0% 50%;filter:drop-shadow(0 2px 0 rgba(0,0,0,.4)) drop-shadow(0 0 10px rgba(250,204,21,.18));}
  50%{background-position:100% 50%;filter:drop-shadow(0 2px 0 rgba(0,0,0,.4)) drop-shadow(0 0 18px rgba(56,189,248,.22));}
  100%{background-position:0% 50%;filter:drop-shadow(0 2px 0 rgba(0,0,0,.4)) drop-shadow(0 0 10px rgba(250,204,21,.18));}
}
@keyframes kdHeaderDotPulse{
  0%,100%{transform:scale(.88);opacity:.78;}
  50%{transform:scale(1.12);opacity:1;}
}
@media(max-width:560px){
  body.page-route-qualify .game-head > div,
  body.page-route-friendly .game-head > div,
  body.page-route-practice .game-head > div,
  body.page-route-match .game-head > div,
  #dartGame .live-title-row > div{
    padding:8px 10px 8px 13px;
    border-radius:14px;
    border-left-width:2px;
  }
  #dartGame .eyebrow{
    padding:3px 7px;
    gap:6px;
    font-size:10px;
    letter-spacing:.12em;
  }
  body.page-route-qualify .game-head h1,
  body.page-route-friendly .game-head h1,
  body.page-route-practice .game-head h1,
  body.page-route-match .game-head h1,
  #dartGame .live-topline h2{
    line-height:1.03;
  }
  body.page-route-qualify .game-head p,
  body.page-route-friendly .game-head p,
  body.page-route-practice .game-head p,
  body.page-route-match .game-head p,
  #dartGame .live-topline h2 small{
    font-size:12px!important;
    line-height:1.25;
  }
}
@media (prefers-reduced-motion: reduce){
  body.page-route-qualify .game-head > div:before,
  body.page-route-friendly .game-head > div:before,
  body.page-route-practice .game-head > div:before,
  body.page-route-match .game-head > div:before,
  #dartGame .live-title-row > div:before,
  body.page-route-qualify .game-head h1,
  body.page-route-friendly .game-head h1,
  body.page-route-practice .game-head h1,
  body.page-route-match .game-head h1,
  #dartGame .live-topline h2,
  #dartGame .eyebrow:before{
    animation:none!important;
  }
}


/* Visible brand/play title eye-candy hard override - 20260707-mobile-no-zoom-v1
   This targets the actual text beside the logo in the sticky public topbar as well as the gameplay live title. */
.public-page .topbar .brand{
  position:relative!important;
  isolation:isolate!important;
  align-items:center!important;
}
.public-page .topbar .brand span{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:36px!important;
  max-width:min(52vw,440px)!important;
  padding:8px 14px 9px 15px!important;
  border-radius:16px!important;
  border:1px solid rgba(250,204,21,.34)!important;
  background:
    linear-gradient(135deg,rgba(15,23,42,.86),rgba(2,6,23,.66)) padding-box,
    linear-gradient(135deg,rgba(250,204,21,.88),rgba(56,189,248,.58),rgba(248,113,113,.42)) border-box!important;
  color:#fff7c2!important;
  -webkit-text-fill-color:transparent!important;
  background-clip:padding-box,border-box!important;
  -webkit-background-clip:text,border-box!important;
  background-image:
    linear-gradient(92deg,#ffffff 0%,#fff7c2 18%,#facc15 38%,#38bdf8 62%,#ffffff 100%),
    linear-gradient(135deg,rgba(15,23,42,.86),rgba(2,6,23,.66))!important;
  background-size:220% 100%,100% 100%!important;
  text-transform:uppercase!important;
  letter-spacing:.065em!important;
  line-height:1.02!important;
  font-weight:1000!important;
  text-shadow:none!important;
  filter:drop-shadow(0 3px 0 rgba(0,0,0,.42)) drop-shadow(0 0 18px rgba(250,204,21,.38))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 0 1px rgba(250,204,21,.08),
    0 12px 32px rgba(0,0,0,.28),
    0 0 26px rgba(250,204,21,.14)!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  animation:kdBrandTitleGradient 4.8s linear infinite!important;
}
.public-page .topbar .brand span:before{
  content:'';
  position:absolute;
  inset:-45% -32%;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0%,transparent 36%,rgba(250,204,21,.20) 43%,rgba(255,255,255,.25) 48%,rgba(56,189,248,.18) 54%,transparent 66%,transparent 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px 8px)!important;
  transform:translateX(-34%) rotate(-3deg);
  animation:kdBrandTitleSweep 3.8s ease-in-out infinite!important;
  mix-blend-mode:screen;
}
.public-page .topbar .brand span:after{
  content:'';
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(250,204,21,.95),rgba(56,189,248,.72),transparent)!important;
  box-shadow:0 0 16px rgba(250,204,21,.42)!important;
  pointer-events:none;
}
#dartGame .live-title-row > div,
body.page-route-play-qualification .game-head > div,
body.page-route-qualify .game-head > div,
body.page-route-friendly .game-head > div,
body.page-route-practice .game-head > div,
body.page-route-match .game-head > div{
  border:1px solid rgba(250,204,21,.28)!important;
  border-left:4px solid rgba(250,204,21,.96)!important;
  background:
    radial-gradient(circle at 0% 50%,rgba(250,204,21,.22),transparent 44%),
    linear-gradient(135deg,rgba(15,23,42,.92),rgba(2,6,23,.68))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 16px 36px rgba(0,0,0,.3),
    -10px 0 28px rgba(250,204,21,.12)!important;
}
#dartGame .live-topline h2,
body.page-route-play-qualification .game-head h1,
body.page-route-qualify .game-head h1,
body.page-route-friendly .game-head h1,
body.page-route-practice .game-head h1,
body.page-route-match .game-head h1{
  color:#fff7c2!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(92deg,#ffffff 0%,#fff7c2 20%,#facc15 42%,#38bdf8 70%,#ffffff 100%)!important;
  background-size:220% 100%!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.48)) drop-shadow(0 0 18px rgba(250,204,21,.34))!important;
  animation:kdBrandTitleGradient 4.8s linear infinite!important;
}
@keyframes kdBrandTitleGradient{
  0%{background-position:0% 50%,0 0;}
  50%{background-position:100% 50%,0 0;}
  100%{background-position:0% 50%,0 0;}
}
@keyframes kdBrandTitleSweep{
  0%{transform:translateX(-38%) rotate(-3deg);opacity:.32;}
  50%{opacity:.95;}
  100%{transform:translateX(38%) rotate(-3deg);opacity:.32;}
}
@media(max-width:740px){
  .public-page .topbar .brand span{
    max-width:calc(100vw - 132px)!important;
    min-height:32px!important;
    padding:7px 9px 8px 10px!important;
    border-radius:13px!important;
    font-size:clamp(15px,4.4vw,20px)!important;
    letter-spacing:.035em!important;
  }
}
@media(max-width:390px){
  .public-page .topbar .brand span{
    max-width:calc(100vw - 126px)!important;
    font-size:16px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
}
@media (prefers-reduced-motion: reduce){
  .public-page .topbar .brand span,
  .public-page .topbar .brand span:before,
  #dartGame .live-topline h2{
    animation:none!important;
  }
}


/* Mobile browser default/zoom prevention - 20260707-mobile-no-zoom-v1
   Keeps the dartboard play surface in app/game mode on touch devices. */
html{
  overscroll-behavior-x:none;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body.page-route-qualify,
body.page-route-friendly,
body.page-route-practice,
body.page-route-match,
body.page-route-play,
body.page-route-play-qualification{
  overscroll-behavior:none;
}
@media (pointer:coarse){
  body.page-route-qualify,
  body.page-route-friendly,
  body.page-route-practice,
  body.page-route-match,
  body.page-route-play,
  body.page-route-play-qualification{
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
  }
  body.page-route-qualify #dartGame,
  body.page-route-friendly #dartGame,
  body.page-route-practice #dartGame,
  body.page-route-match #dartGame,
  body.page-route-play #dartGame,
  body.page-route-play-qualification #dartGame,
  body.page-route-qualify .darts-live,
  body.page-route-friendly .darts-live,
  body.page-route-practice .darts-live,
  body.page-route-match .darts-live,
  body.page-route-play .darts-live,
  body.page-route-play-qualification .darts-live,
  body.page-route-qualify .active-board-panel,
  body.page-route-friendly .active-board-panel,
  body.page-route-practice .active-board-panel,
  body.page-route-match .active-board-panel,
  body.page-route-play .active-board-panel,
  body.page-route-play-qualification .active-board-panel,
  body.page-route-qualify .active-board,
  body.page-route-friendly .active-board,
  body.page-route-practice .active-board,
  body.page-route-match .active-board,
  body.page-route-play .active-board,
  body.page-route-play-qualification .active-board,
  body.page-route-qualify .old-play-canvas,
  body.page-route-friendly .old-play-canvas,
  body.page-route-practice .old-play-canvas,
  body.page-route-match .old-play-canvas,
  body.page-route-play .old-play-canvas,
  body.page-route-play-qualification .old-play-canvas,
  body.page-route-qualify canvas,
  body.page-route-friendly canvas,
  body.page-route-practice canvas,
  body.page-route-match canvas,
  body.page-route-play canvas,
  body.page-route-play-qualification canvas{
    touch-action:none!important;
    -ms-touch-action:none!important;
    -webkit-user-select:none!important;
    user-select:none!important;
    -webkit-touch-callout:none!important;
    -webkit-user-drag:none!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  body.page-route-qualify a,
  body.page-route-friendly a,
  body.page-route-practice a,
  body.page-route-match a,
  body.page-route-play a,
  body.page-route-play-qualification a,
  body.page-route-qualify button,
  body.page-route-friendly button,
  body.page-route-practice button,
  body.page-route-match button,
  body.page-route-play button,
  body.page-route-play-qualification button,
  body.page-route-qualify .btn,
  body.page-route-friendly .btn,
  body.page-route-practice .btn,
  body.page-route-match .btn,
  body.page-route-play .btn,
  body.page-route-play-qualification .btn{
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }
  input,
  textarea,
  select,
  [contenteditable="true"]{
    -webkit-user-select:text!important;
    user-select:text!important;
    -webkit-touch-callout:default!important;
    touch-action:auto!important;
  }
}

/* Lobby stage progression polish - 20260709-lobby-stages-v1 */
.active-run.tournament-run-card{
  --tier:#f6b93b;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:16px!important;
  overflow:hidden!important;
  border-color:color-mix(in srgb, var(--tier) 62%, rgba(255,255,255,.16))!important;
  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--tier) 28%, transparent), transparent 34%),
    linear-gradient(130deg, rgba(15,23,42,.98) 0%, rgba(12,17,29,.94) 54%, rgba(2,6,23,.88) 100%),
    url("../img/darts-target-money.png") right center / auto 92% no-repeat!important;
  padding:20px!important;
  min-height:0!important;
}
.active-run.tournament-run-card:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg, color-mix(in srgb, var(--tier) 18%, transparent), transparent 44%);
  pointer-events:none;
}
.active-run.tournament-run-card > *{
  position:relative;
  z-index:1;
}
.run-hero-content{
  max-width:720px;
}
.run-kicker,
.tier-state-badge,
.stage-live-badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.run-kicker{
  color:color-mix(in srgb, var(--tier) 82%, #fff);
  margin-bottom:6px;
}
.tournament-run-card h2{
  margin:0 0 8px!important;
  font-size:clamp(26px, 4vw, 42px);
  line-height:1.02;
}
.tournament-run-card .run-tier-name{
  position:relative;
  display:inline-block;
  color:var(--tier);
  font-weight:950;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--tier) 72%, transparent),
    0 0 20px color-mix(in srgb, var(--tier) 42%, transparent);
  animation:kd-active-tier-glow 1.8s ease-in-out infinite;
}
.tournament-run-card .run-tier-name:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-4px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, var(--tier), #fff, var(--tier), transparent);
  background-size:220% 100%;
  box-shadow:0 0 10px color-mix(in srgb, var(--tier) 66%, transparent);
  animation:kd-active-tier-scan 2.2s linear infinite;
}
@keyframes kd-active-tier-glow{
  0%,100%{filter:brightness(1); transform:translateY(0)}
  50%{filter:brightness(1.28); transform:translateY(-1px)}
}
@keyframes kd-active-tier-scan{
  from{background-position:220% 0}
  to{background-position:-20% 0}
}
.run-status-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:10px 0 8px;
}
.run-status-row strong{
  color:#fff;
  font-size:17px;
}
.run-status-row > span:not(.stage-live-badge){
  color:#cbd5e1;
  font-weight:800;
}
.stage-live-badge{
  padding:7px 10px;
  color:#111827;
  background:linear-gradient(135deg, #facc15, #fb923c);
  box-shadow:0 0 0 1px rgba(255,255,255,.18), 0 0 22px rgba(250,204,21,.34);
  animation:kd-live-stage-pulse 1.9s ease-in-out infinite;
}
.lobby-stage-progress{
  position:relative;
  height:8px;
  max-width:520px;
  margin:14px 0 16px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.lobby-stage-progress span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, color-mix(in srgb, var(--tier) 78%, #fff), #facc15);
  box-shadow:0 0 18px color-mix(in srgb, var(--tier) 52%, transparent);
}
.lobby-stage-route{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(86px, 1fr));
  gap:8px;
  margin:14px 0 16px;
}
.lobby-stage-chip{
  position:relative;
  display:grid;
  gap:2px;
  min-height:76px;
  padding:10px 9px;
  border-radius:16px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  overflow:hidden;
}
.lobby-stage-chip:before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.22;
  background:linear-gradient(135deg, transparent, rgba(255,255,255,.18));
  pointer-events:none;
}
.lobby-stage-chip strong,
.lobby-stage-chip span,
.lobby-stage-chip em{
  position:relative;
  z-index:1;
}
.lobby-stage-chip strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:30px;
  border-radius:11px;
  color:#fff;
  background:rgba(255,255,255,.12);
  font-size:12px;
  letter-spacing:.03em;
}
.lobby-stage-chip span{
  color:#fff;
  font-size:12px;
  font-weight:900;
  line-height:1.08;
}
.lobby-stage-chip em{
  color:#94a3b8;
  font-size:10px;
  font-style:normal;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.lobby-stage-chip.is-current{
  border-color:color-mix(in srgb, var(--tier) 82%, #facc15);
  background:linear-gradient(145deg, color-mix(in srgb, var(--tier) 30%, rgba(255,255,255,.08)), rgba(255,255,255,.07));
  box-shadow:0 0 0 1px color-mix(in srgb, var(--tier) 42%, transparent), 0 16px 34px color-mix(in srgb, var(--tier) 20%, transparent);
}
.lobby-stage-chip.is-current strong{
  color:#111827;
  background:linear-gradient(135deg, #facc15, color-mix(in srgb, var(--tier) 70%, #fff));
}
.lobby-stage-chip.is-current em{
  color:#fde68a;
}
.lobby-stage-chip.is-complete{
  border-color:rgba(34,197,94,.48);
  background:linear-gradient(145deg, rgba(34,197,94,.19), rgba(255,255,255,.055));
}
.lobby-stage-chip.is-complete strong{
  background:rgba(34,197,94,.22);
  box-shadow:inset 0 0 0 1px rgba(34,197,94,.38);
}
.lobby-stage-chip.is-complete strong:after{
  content:"✓";
  margin-left:3px;
  font-size:10px;
}
.lobby-stage-chip.is-complete em{
  color:#86efac;
}
.lobby-stage-chip.is-ready{
  border-color:rgba(59,130,246,.62);
  background:linear-gradient(145deg, rgba(59,130,246,.22), rgba(255,255,255,.065));
  box-shadow:0 0 0 1px rgba(59,130,246,.14), 0 0 18px rgba(59,130,246,.18);
  animation:kd-ready-stage-pulse 2.15s ease-in-out infinite;
}
.lobby-stage-chip.is-ready strong{
  background:linear-gradient(135deg, rgba(147,197,253,.95), rgba(59,130,246,.72));
  color:#061426;
  box-shadow:0 0 16px rgba(96,165,250,.22);
}
.lobby-stage-chip.is-ready em{
  color:#bfdbfe;
}
.tier-card-v2.tier-is-ready{
  border-color:color-mix(in srgb, var(--tier) 44%, rgba(59,130,246,.36));
  box-shadow:0 20px 42px rgba(2,6,23,.28), 0 0 0 1px rgba(59,130,246,.12);
}
.tier-state-badge.is-ready{
  color:#dbeafe;
  background:linear-gradient(135deg, rgba(59,130,246,.28), rgba(14,165,233,.12));
  border-color:rgba(147,197,253,.40);
  box-shadow:0 0 18px rgba(59,130,246,.20);
  animation:kd-ready-badge-pulse 2.15s ease-in-out infinite;
}
.lobby-stage-chip.is-locked{
  opacity:.62;
  filter:saturate(.55);
}
.lobby-stage-chip.is-locked strong:after{
  content:"\1F512";
  margin-left:3px;
  font-size:9px;
}
.tier-card-v2{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.tier-title-row{
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.tier-card-v2 h2{
  margin:0!important;
}
.tier-state-badge{
  flex:0 0 auto;
  padding:6px 8px;
  color:#e5e7eb;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
}
.tier-meta-grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px;
}
.tier-meta-grid span{
  display:block;
  border-radius:14px;
  padding:10px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}
.tier-meta-grid strong,
.tier-meta-grid small{
  display:block;
}
.tier-meta-grid strong{
  color:#fff;
  font-size:16px;
  font-weight:900;
}
.tier-meta-grid small{
  color:#94a3b8;
  margin-top:2px;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
}
.tier-card-v2 .lobby-stage-route{
  grid-template-columns:repeat(3, minmax(0,1fr));
  margin:4px 0 6px;
  gap:6px;
}
.tier-card-v2 .lobby-stage-chip{
  min-height:58px;
  border-radius:13px;
  padding:7px;
}
.tier-card-v2 .lobby-stage-chip strong{
  width:auto;
  height:24px;
  padding:0 6px;
  border-radius:9px;
  justify-self:start;
}
.tier-card-v2 .lobby-stage-chip span{
  display:none;
}
.tier-card-v2 .lobby-stage-chip em{
  font-size:9px;
}
@keyframes kd-live-stage-pulse{
  0%,100%{transform:translateY(0); box-shadow:0 0 0 1px rgba(255,255,255,.18), 0 0 18px rgba(250,204,21,.24)}
  50%{transform:translateY(-1px); box-shadow:0 0 0 1px rgba(255,255,255,.26), 0 0 28px rgba(250,204,21,.44)}
}
@keyframes kd-ready-stage-pulse{
  0%,100%{transform:translateY(0) scale(1); box-shadow:0 0 0 1px rgba(59,130,246,.14), 0 0 16px rgba(59,130,246,.16)}
  50%{transform:translateY(-1px) scale(1.015); box-shadow:0 0 0 1px rgba(147,197,253,.36), 0 0 30px rgba(59,130,246,.34)}
}
@keyframes kd-ready-badge-pulse{
  0%,100%{transform:translateY(0); box-shadow:0 0 12px rgba(59,130,246,.14)}
  50%{transform:translateY(-1px); box-shadow:0 0 25px rgba(59,130,246,.34)}
}
@media (prefers-reduced-motion: reduce){
  .lobby-stage-chip.is-ready,
  .tier-state-badge.is-ready,
  .tournament-run-card .run-tier-name,
  .tournament-run-card .run-tier-name:after{
    animation:none;
  }
}
@media(max-width:980px){
  .active-run.tournament-run-card{
    background:
      radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--tier) 26%, transparent), transparent 32%),
      linear-gradient(145deg, rgba(15,23,42,.98), rgba(2,6,23,.94))!important;
  }
  .tier-card-v2 .lobby-stage-route{
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
}
@media(max-width:740px){
  .active-run.tournament-run-card{
    padding:16px!important;
  }
  .lobby-stage-route{
    display:flex;
    overflow-x:auto;
    padding-bottom:4px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .lobby-stage-chip{
    flex:0 0 108px;
    scroll-snap-align:start;
  }
  .tier-card-v2 .lobby-stage-route{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    overflow:visible;
    padding-bottom:0;
  }
  .tier-card-v2 .lobby-stage-chip{
    flex:auto;
  }
  .run-status-row{
    align-items:flex-start;
  }
}
@media(max-width:430px){
  .tier-card-v2 .lobby-stage-route{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .tier-title-row{
    flex-direction:column;
  }
  .tournament-run-card h2{
    font-size:26px;
  }
}

/* Lobby badge width fix - 20260709-qualification-required-wrap */
.tier-grid{
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.tier-title-row{
  flex-wrap:wrap;
  min-width:0;
}
.tier-card-v2 h2{
  min-width:0;
  overflow-wrap:anywhere;
}
.tier-state-badge{
  width:auto;
  max-width:100%;
  min-width:0;
  white-space:normal;
  line-height:1.12;
  text-align:center;
  justify-content:center;
  overflow-wrap:normal;
}
.tier-state-badge.is-locked{
  flex-basis:auto;
}
@media(max-width:1100px) and (min-width:801px){
  .tier-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(max-width:520px){
  .tier-grid{
    grid-template-columns:1fr;
  }
}


/* Lobby background hard render fix - 20260709-lobby-bg-visible-v1 */
body.has-lobby-background{
  background-image:
    linear-gradient(180deg, rgba(5,7,13,.50), rgba(5,7,13,.68)),
    radial-gradient(circle at top, rgba(24,32,51,.20) 0, rgba(5,7,13,.38) 58%),
    var(--lobby-bg);
  background-repeat:no-repeat,no-repeat,no-repeat;
  background-position:center,center,center;
  background-size:cover,cover,cover;
  background-attachment:fixed,fixed,fixed;
}
body.has-lobby-background:before{
  opacity:.34;
  background-image:var(--lobby-bg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  z-index:0;
}
body.has-lobby-background .app-shell{
  position:relative;
  z-index:1;
}
body.has-lobby-background .hero,
body.has-lobby-background .tier-card,
body.has-lobby-background .game-card,
body.has-lobby-background .panel{
  backdrop-filter:blur(10px);
}
@media (max-width:820px){
  body.has-lobby-background{
    background-attachment:scroll,scroll,scroll;
  }
}

/* Direct lobby background layer - 20260709-lobby-bg-strong-v1
   Uses a real DOM image so the lobby background remains visible even if pseudo/background CSS is cached or overridden. */
body.has-lobby-background > .lobby-bg-image{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  opacity:.72;
  pointer-events:none;
  user-select:none;
}
body.has-lobby-background > .lobby-bg-shade{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(5,7,13,.22), rgba(5,7,13,.52)),
    radial-gradient(circle at top, rgba(24,32,51,.08), rgba(5,7,13,.20) 58%);
}
body.has-lobby-background > .app-shell{
  position:relative;
  z-index:1;
}

/* Mobile lobby background fixed hardening - 20260709-lobby-bg-mobile-fixed-v1
   Uses viewport units that behave better on mobile browser chrome changes. */
@media (max-width: 768px){
  html,
  body.has-lobby-background{
    min-height:100%;
  }
  body.has-lobby-background > .lobby-bg-image{
    position:fixed;
    top:0;
    right:0;
    bottom:auto;
    left:0;
    width:100vw;
    height:100vh;
    height:100svh;
    min-height:100dvh;
    object-fit:cover;
    object-position:center top;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
  }
  body.has-lobby-background > .lobby-bg-shade{
    position:fixed;
    top:0;
    right:0;
    bottom:auto;
    left:0;
    width:100vw;
    height:100vh;
    height:100svh;
    min-height:100dvh;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
  }
}

/* Public mobile menu bars-only release - 20260709-mobile-menu-bars-only-v1 */
@media(max-width:740px){
  .public-page .mobile-menu-toggle{
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    gap:0!important;
    border-radius:999px!important;
  }
  .public-page .mobile-menu-toggle span{
    display:none!important;
  }
  .public-page .mobile-menu-toggle i{
    margin:0!important;
  }
}

/* Lobby tier card accent emphasis - 20260709-tier-panels-accent-v1
   Makes Bronze/Silver/Gold/etc. cards read as premium tier panels using each tier accent colour. */
.tier-card-v2{
  border-color:color-mix(in srgb, var(--tier) 72%, rgba(255,255,255,.16))!important;
  background:
    radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--tier) 34%, transparent), transparent 34%),
    linear-gradient(155deg, color-mix(in srgb, var(--tier) 16%, rgba(15,23,42,.96)) 0%, rgba(12,17,29,.94) 48%, color-mix(in srgb, var(--tier) 11%, rgba(2,6,23,.96)) 100%)!important;
  box-shadow:
    0 24px 56px rgba(0,0,0,.36),
    0 0 0 1px color-mix(in srgb, var(--tier) 32%, transparent),
    0 0 34px color-mix(in srgb, var(--tier) 22%, transparent)!important;
  transform:translateZ(0);
}
.tier-card-v2:before{
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--tier) 30%, transparent), transparent 42%),
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--tier) 22%, transparent), transparent 34%)!important;
  opacity:.95;
}
.tier-card-v2:after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:0;
  height:4px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg, transparent, var(--tier), color-mix(in srgb, var(--tier) 62%, #fff), transparent);
  box-shadow:0 0 24px color-mix(in srgb, var(--tier) 42%, transparent);
  opacity:.98;
  pointer-events:none;
}
.tier-card-v2 h2{
  color:var(--tier)!important;
  text-shadow:0 2px 0 rgba(0,0,0,.42), 0 0 18px color-mix(in srgb, var(--tier) 38%, transparent);
}
.tier-card-v2 .big{
  color:#fff;
  text-shadow:0 0 20px color-mix(in srgb, var(--tier) 36%, transparent), 0 2px 0 rgba(0,0,0,.38);
}
.tier-card-v2 .tier-meta-grid span{
  background:linear-gradient(145deg, color-mix(in srgb, var(--tier) 16%, rgba(255,255,255,.075)), rgba(255,255,255,.045));
  border-color:color-mix(in srgb, var(--tier) 38%, rgba(255,255,255,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.tier-card-v2 .tier-meta-grid strong{
  color:color-mix(in srgb, var(--tier) 36%, #fff);
}
.tier-card-v2 .tier-state-badge{
  border-color:color-mix(in srgb, var(--tier) 52%, rgba(255,255,255,.16));
  background:linear-gradient(135deg, color-mix(in srgb, var(--tier) 28%, rgba(255,255,255,.08)), rgba(255,255,255,.055));
  box-shadow:0 0 18px color-mix(in srgb, var(--tier) 20%, transparent);
}
.tier-card-v2 .btn:not(.ghost){
  background:linear-gradient(135deg, var(--tier), color-mix(in srgb, var(--tier) 58%, #fff));
  color:#07111f;
  box-shadow:0 14px 30px color-mix(in srgb, var(--tier) 28%, transparent);
}
.tier-card-v2 .btn.ghost{
  border-color:color-mix(in srgb, var(--tier) 44%, rgba(255,255,255,.16));
  background:linear-gradient(135deg, color-mix(in srgb, var(--tier) 16%, rgba(255,255,255,.08)), rgba(255,255,255,.055));
  color:color-mix(in srgb, var(--tier) 36%, #fff);
}
.tier-card-v2 .practice-link{
  border-color:color-mix(in srgb, var(--tier) 40%, rgba(147,197,253,.18));
  background:linear-gradient(135deg, color-mix(in srgb, var(--tier) 14%, rgba(59,130,246,.10)), rgba(255,255,255,.045));
}
.tier-card-v2 .practice-link strong{
  color:color-mix(in srgb, var(--tier) 35%, #fff);
}
.tier-card-v2:hover{
  border-color:color-mix(in srgb, var(--tier) 88%, rgba(255,255,255,.22))!important;
  box-shadow:
    0 28px 62px rgba(0,0,0,.40),
    0 0 0 1px color-mix(in srgb, var(--tier) 48%, transparent),
    0 0 44px color-mix(in srgb, var(--tier) 34%, transparent)!important;
}
.tier-card-v2.tier-is-locked{
  filter:none;
}
.tier-card-v2.tier-is-locked .tier-state-badge{
  color:color-mix(in srgb, var(--tier) 28%, #e5e7eb);
}
@media (hover:hover){
  .tier-card-v2{
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
  }
  .tier-card-v2:hover{
    transform:translateY(-2px);
  }
}
@media (prefers-reduced-motion: reduce){
  .tier-card-v2{
    transition:none;
  }
  .tier-card-v2:hover{
    transform:none;
  }
}


/* PWA install action - 20260709-pwa-app-v1 */
.top-menu-install {
  appearance: none;
  border: 1px solid rgba(246,185,59,.42);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(246,185,59,.22), rgba(125,95,255,.16));
  color: #fff;
  padding: 9px 14px;
  font: inherit;
  font-weight: 900;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(246,185,59,.16);
}
.top-menu-install:hover,
.top-menu-install:focus-visible {
  border-color: rgba(246,185,59,.72);
  box-shadow: 0 0 0 3px rgba(246,185,59,.12), 0 18px 38px rgba(246,185,59,.22);
  outline: none;
}
.top-menu-install[hidden] {
  display: none !important;
}
@media (max-width: 768px) {
  .top-menu-install {
    width: 100%;
    text-align: center;
    justify-content: center;
  }
}

/* iOS Add to Home Screen guide - 20260709-ios-a2hs-guide-v1 */
.ios-a2hs-button{
  border-color:rgba(125,95,255,.46);
  background:linear-gradient(135deg, rgba(125,95,255,.22), rgba(246,185,59,.16));
}
.ios-a2hs-modal{
  width:min(92vw, 620px);
}
.ios-a2hs-kicker{
  display:inline-flex;
  margin:0 0 10px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(246,185,59,.28);
  background:rgba(246,185,59,.10);
  color:#fde68a;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ios-a2hs-intro,
.ios-a2hs-note{
  color:#dbeafe;
  line-height:1.55;
}
.ios-a2hs-steps{
  display:grid;
  gap:12px;
  margin:18px 0;
  padding:0;
  list-style:none;
  counter-reset:a2hs-step;
}
.ios-a2hs-steps li{
  counter-increment:a2hs-step;
  position:relative;
  min-height:58px;
  padding:13px 14px 13px 66px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.13);
  background:linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.045));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.ios-a2hs-steps li:before{
  content:counter(a2hs-step);
  position:absolute;
  left:14px;
  top:50%;
  width:38px;
  height:38px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  border-radius:999px;
  background:linear-gradient(135deg, var(--primary), var(--secondary));
  color:#05070d;
  font-weight:950;
  box-shadow:0 12px 24px rgba(0,0,0,.28);
}
.ios-a2hs-steps strong{
  display:block;
  color:#fff;
  font-size:16px;
  margin-bottom:3px;
}
.ios-a2hs-steps span{
  display:block;
  color:#cbd5e1;
  font-size:14px;
  line-height:1.4;
}
.ios-a2hs-close{
  width:100%;
  margin-top:6px;
}
@media(max-width:520px){
  .ios-a2hs-modal{
    width:94vw;
  }
  .ios-a2hs-steps li{
    padding:12px 12px 12px 58px;
  }
  .ios-a2hs-steps li:before{
    left:12px;
    width:34px;
    height:34px;
  }
}



/* Mobile app-mode top spacing for lobby and all play/public screens - 20260709-app-mode-all-screens-padding-v1 */
@media(max-width:768px){
  @media(display-mode:standalone){
    body.public-page .app-shell{
      padding-top:calc(20px + env(safe-area-inset-top, 0px))!important;
    }
  }
  body.kd-standalone-app.public-page .app-shell{
    padding-top:calc(20px + env(safe-area-inset-top, 0px))!important;
  }
}

/* Header brand red highlight + mobile portrait guard - 20260709-red-brand-portrait-lock-v1
   Replaces yellow highlight on the KNOCKOUT DARTS header lozenge and blocks mobile landscape play. */
.public-page .topbar .brand span{
  border-color:rgba(239,68,68,.44)!important;
  color:#ffe4e6!important;
  background-image:
    linear-gradient(92deg,#ffffff 0%,#fee2e2 18%,#ef4444 38%,#dc2626 52%,#38bdf8 74%,#ffffff 100%),
    linear-gradient(135deg,rgba(15,23,42,.88),rgba(2,6,23,.68))!important;
  filter:drop-shadow(0 3px 0 rgba(0,0,0,.42)) drop-shadow(0 0 18px rgba(239,68,68,.42))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 0 1px rgba(239,68,68,.12),
    0 12px 32px rgba(0,0,0,.28),
    0 0 28px rgba(239,68,68,.18)!important;
}
.public-page .topbar .brand span:before{
  background:
    linear-gradient(115deg,transparent 0%,transparent 36%,rgba(239,68,68,.22) 43%,rgba(255,255,255,.25) 48%,rgba(220,38,38,.20) 54%,transparent 66%,transparent 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px 8px)!important;
}
.public-page .topbar .brand span:after{
  background:linear-gradient(90deg,rgba(239,68,68,.98),rgba(220,38,38,.82),rgba(56,189,248,.42),transparent)!important;
  box-shadow:0 0 16px rgba(239,68,68,.48)!important;
}

.kd-orientation-lock{
  display:none;
  position:fixed;
  inset:0;
  z-index:2147483000;
  padding:22px;
  place-items:center;
  text-align:center;
  color:#fff;
  background:
    radial-gradient(circle at top,rgba(239,68,68,.24),transparent 46%),
    linear-gradient(155deg,rgba(2,6,23,.98),rgba(10,14,24,.98));
}
.kd-orientation-lock__card{
  width:min(460px,92vw);
  border:1px solid rgba(239,68,68,.42);
  border-radius:24px;
  padding:24px 20px;
  background:linear-gradient(145deg,rgba(15,23,42,.96),rgba(2,6,23,.86));
  box-shadow:0 28px 70px rgba(0,0,0,.42),0 0 38px rgba(239,68,68,.22);
}
.kd-orientation-lock__icon{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin:0 auto 14px;
  border-radius:20px;
  border:1px solid rgba(239,68,68,.42);
  background:rgba(239,68,68,.14);
  font-size:30px;
  line-height:1;
}
.kd-orientation-lock h2{
  margin:0 0 8px;
  font-size:22px;
  letter-spacing:.02em;
}
.kd-orientation-lock p{
  margin:0;
  color:#cbd5e1;
  line-height:1.45;
}
body.kd-mobile-landscape{
  overflow:hidden!important;
  touch-action:none;
}
body.kd-mobile-landscape .kd-orientation-lock{
  display:grid!important;
}
body.kd-mobile-landscape .app-shell{
  pointer-events:none!important;
  user-select:none!important;
  filter:blur(2px) saturate(.7);
}
@media(max-width:940px) and (orientation:landscape) and (pointer:coarse){
  body.public-page .kd-orientation-lock{
    display:grid;
  }
  body.public-page{
    overflow:hidden!important;
  }
  body.public-page .app-shell{
    pointer-events:none!important;
    user-select:none!important;
    filter:blur(2px) saturate(.7);
  }
}

/* Leaderboard tournament styling */
.leaderboard-hero{
  position:relative;
  overflow:hidden;
  border-color:rgba(239,68,68,.28);
  background:
    radial-gradient(circle at top left,rgba(239,68,68,.24),transparent 36%),
    linear-gradient(135deg,rgba(15,23,42,.94),rgba(12,17,29,.82));
}

.leaderboard-title{
  position:relative;
  display:inline-block;
  margin:2px 0 8px;
  color:#fff;
  font-weight:1000;
  letter-spacing:.055em;
  text-transform:uppercase;
  text-shadow:
    0 2px 0 #7f1d1d,
    0 4px 0 #450a0a,
    0 0 10px rgba(248,113,113,.9),
    0 0 28px rgba(239,68,68,.62);
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.48));
  animation:leaderboard-title-pulse 2.8s ease-in-out infinite;
  isolation:isolate;
}
.leaderboard-title:before{
  content:attr(data-text);
  position:absolute;
  inset:0;
  z-index:-1;
  color:transparent;
  -webkit-text-stroke:7px rgba(239,68,68,.18);
  text-shadow:0 0 24px rgba(239,68,68,.75);
  animation:leaderboard-title-aura 2.8s ease-in-out infinite;
}
.leaderboard-title:after{
  content:"";
  position:absolute;
  left:-3%;
  right:-3%;
  bottom:-7px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#ef4444 18%,#fff 50%,#ef4444 82%,transparent);
  box-shadow:0 0 9px #ef4444,0 0 22px rgba(239,68,68,.85);
  transform-origin:center;
  animation:leaderboard-title-scan 2.2s ease-in-out infinite;
}
@keyframes leaderboard-title-pulse{
  0%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 8px 12px rgba(0,0,0,.48)) brightness(1)}
  50%{transform:translateY(-1px) scale(1.015);filter:drop-shadow(0 10px 16px rgba(0,0,0,.55)) brightness(1.14)}
}
@keyframes leaderboard-title-aura{
  0%,100%{opacity:.48;transform:scale(1)}
  50%{opacity:.9;transform:scale(1.035)}
}
@keyframes leaderboard-title-scan{
  0%,100%{opacity:.5;transform:scaleX(.72)}
  50%{opacity:1;transform:scaleX(1)}
}
@media (prefers-reduced-motion:reduce){
  .leaderboard-title,
  .leaderboard-title:before,
  .leaderboard-title:after{animation:none!important}
}
.leaderboard-hero:after{
  content:"";
  position:absolute;
  inset:auto -20% 0 -20%;
  height:4px;
  background:linear-gradient(90deg,transparent,rgba(239,68,68,.95),rgba(255,255,255,.48),transparent);
  box-shadow:0 0 28px rgba(239,68,68,.38);
}
.leaderboard-kicker,
.leaderboard-tier-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 8px;
  color:#fecaca;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.leaderboard-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  max-width:640px;
  margin-top:18px;
}
.leaderboard-summary span{
  display:block;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(239,68,68,.22);
  background:rgba(255,255,255,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.leaderboard-summary strong{
  display:block;
  color:#fff;
  font-size:clamp(24px,5vw,36px);
  line-height:1;
}
.leaderboard-summary small{
  display:block;
  margin-top:5px;
  color:#cbd5e1;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.leaderboard-card{
  position:relative;
  overflow:hidden;
  margin:16px 0;
  padding:18px;
  border-radius:24px;
  border:1px solid color-mix(in srgb,var(--tier,#ef4444) 52%,transparent);
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--tier,#ef4444) 18%,transparent),rgba(12,17,29,.91) 36%,rgba(2,6,23,.88)),
    rgba(12,17,29,.9);
  box-shadow:
    0 22px 58px rgba(0,0,0,.34),
    0 0 36px color-mix(in srgb,var(--tier,#ef4444) 22%,transparent);
}
.leaderboard-card:before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:5px;
  background:linear-gradient(90deg,var(--tier,#ef4444),rgba(255,255,255,.52),var(--tier,#ef4444));
  opacity:.9;
}
.leaderboard-card:after{
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  top:-120px;
  right:-90px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--tier,#ef4444) 42%,transparent),transparent 68%);
  pointer-events:none;
}
.leaderboard-card > *{
  position:relative;
  z-index:1;
}
.leaderboard-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.leaderboard-card h2{
  margin:0;
  color:#fff;
  font-size:clamp(26px,4.5vw,42px);
  line-height:1;
  text-shadow:0 0 20px color-mix(in srgb,var(--tier,#ef4444) 38%,transparent);
}
.leaderboard-tier-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.leaderboard-tier-meta span{
  min-width:112px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid color-mix(in srgb,var(--tier,#ef4444) 34%,transparent);
  background:rgba(255,255,255,.07);
  text-align:right;
}
.leaderboard-tier-meta strong,
.leaderboard-tier-meta small{
  display:block;
}
.leaderboard-tier-meta strong{
  color:#fff;
  font-size:18px;
}
.leaderboard-tier-meta small{
  margin-top:3px;
  color:#94a3b8;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.leaderboard-table-wrap{
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(2,6,23,.38);
}
.leaderboard-table{
  margin:0;
  border-radius:0;
}
.leaderboard-table thead{
  background:linear-gradient(90deg,color-mix(in srgb,var(--tier,#ef4444) 18%,rgba(15,23,42,.96)),rgba(15,23,42,.94));
}
.leaderboard-table th{
  color:#e2e8f0;
  font-size:11px;
  letter-spacing:.1em;
  border-bottom:1px solid color-mix(in srgb,var(--tier,#ef4444) 26%,rgba(255,255,255,.08));
}
.leaderboard-table td{
  vertical-align:middle;
  background:rgba(15,23,42,.18);
}
.leaderboard-row{
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
}
.leaderboard-row:hover{
  background:color-mix(in srgb,var(--tier,#ef4444) 10%,transparent);
  transform:translateY(-1px);
}
.leader-rank{
  display:inline-grid;
  place-items:center;
  min-width:44px;
  height:34px;
  padding:0 10px;
  border-radius:999px;
  color:#e2e8f0;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-weight:950;
}
.leaderboard-row.is-podium .leader-rank{
  color:#111827;
  border-color:rgba(255,255,255,.42);
  background:linear-gradient(135deg,var(--tier,#ef4444),#fff);
  box-shadow:0 0 18px color-mix(in srgb,var(--tier,#ef4444) 38%,transparent);
}
.leader-player{
  display:block;
  color:#fff;
  font-size:16px;
}
.leader-stage{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);
}
.leader-stage strong{
  color:#fff;
}
.leader-stage small{
  color:#94a3b8;
  font-weight:800;
}
.leader-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:88px;
  padding:8px 10px;
  border-radius:999px;
  color:#e5e7eb;
  background:rgba(148,163,184,.16);
  border:1px solid rgba(148,163,184,.24);
  font-size:12px;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.leader-status.status-won{
  color:#bbf7d0;
  background:rgba(34,197,94,.18);
  border-color:rgba(34,197,94,.34);
  box-shadow:0 0 18px rgba(34,197,94,.16);
}
.leader-status.status-active{
  color:#fecaca;
  background:rgba(239,68,68,.18);
  border-color:rgba(239,68,68,.36);
  box-shadow:0 0 18px rgba(239,68,68,.16);
}
.leader-status.status-lost,
.leader-status.status-eliminated{
  color:#fed7aa;
  background:rgba(249,115,22,.15);
  border-color:rgba(249,115,22,.3);
}
.leader-score{
  display:inline-block;
  min-width:58px;
  color:#fff;
  font-size:24px;
  line-height:1;
  text-align:right;
  text-shadow:0 0 16px color-mix(in srgb,var(--tier,#ef4444) 40%,transparent);
}
.leaderboard-empty-row td{
  padding:0;
}
.leaderboard-empty{
  padding:22px;
  text-align:center;
  color:#cbd5e1;
}
.leaderboard-empty strong,
.leaderboard-empty span{
  display:block;
}
.leaderboard-empty strong{
  color:#fff;
  font-size:18px;
  margin-bottom:5px;
}
@media(max-width:720px){
  .leaderboard-summary{
    grid-template-columns:1fr;
  }
  .leaderboard-card{
    padding:14px;
    border-radius:20px;
  }
  .leaderboard-card-head{
    display:grid;
  }
  .leaderboard-tier-meta{
    justify-content:stretch;
  }
  .leaderboard-tier-meta span{
    flex:1 1 130px;
    text-align:left;
  }
  .leaderboard-table-wrap{
    border:0;
    background:transparent;
    overflow:visible;
  }
  .leaderboard-table,
  .leaderboard-table thead,
  .leaderboard-table tbody,
  .leaderboard-table tr,
  .leaderboard-table th,
  .leaderboard-table td{
    display:block;
  }
  .leaderboard-table thead{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
  }
  .leaderboard-table tr{
    margin:10px 0;
    padding:12px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.1);
    background:rgba(2,6,23,.46);
  }
  .leaderboard-table tr.is-podium{
    border-color:color-mix(in srgb,var(--tier,#ef4444) 38%,rgba(255,255,255,.1));
    background:linear-gradient(140deg,color-mix(in srgb,var(--tier,#ef4444) 16%,transparent),rgba(2,6,23,.5));
  }
  .leaderboard-table td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:9px 0;
    border:0;
    background:transparent;
  }
  .leaderboard-table td:before{
    content:attr(data-label);
    color:#94a3b8;
    font-size:11px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .leaderboard-empty-row td{
    display:block;
  }
  .leaderboard-empty-row td:before{
    display:none;
  }
  .leader-score{
    text-align:right;
  }
}
@media(prefers-reduced-motion:reduce){
  .leaderboard-row{
    transition:none!important;
  }
  .leaderboard-row:hover{
    transform:none!important;
  }
}


/* Header logo/brand restore - 20260709-logo-brand-fix-v1
   Ensures the Knockout Darts logo remains visible and prevents the old TeamDarts fallback label. */
.public-page .topbar .brand img{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  object-fit:contain!important;
  object-position:center!important;
}
.public-page .topbar .brand span{
  text-transform:uppercase!important;
}
@media(max-width:740px){
  .public-page .topbar .brand img{
    width:100px!important;
    min-width:110px!important;
    max-width:110px!important;
    height:auto!important;
    flex:0 0 110px!important;
  }
}
@media(max-width:390px){
  .public-page .topbar .brand img{
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    flex-basis:78px!important;
  }
}


/* 2026-07-10: safe practice-tier button styling. Uses CSS-only icon so tier-card markup stays untouched. */
.practice-link{
  position:relative;
  display:block;
  margin-top:12px;
  padding:13px 72px 13px 14px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#c8ffc1 0%,#9bf19c 52%,#74da70 100%)!important;
  border:1px solid rgba(210,255,211,.88)!important;
  color:#14321b!important;
  text-decoration:none;
  box-shadow:0 16px 30px rgba(86,182,91,.28), inset 0 1px 0 rgba(255,255,255,.52)!important;
  overflow:hidden;
}
.practice-link::after{
  content:"";
  position:absolute;
  top:7px;
  right:9px;
  width:50px;
  height:50px;
  background:url("../img/practice-tier-button-icon.png?v=20260710-practice-tier-icon-v1") center/contain no-repeat;
  filter:drop-shadow(0 5px 10px rgba(0,0,0,.28));
  pointer-events:none;
  z-index:0;
}
.practice-link strong{
  position:relative;
  z-index:1;
  color:#14321b!important;
}
.practice-link > span{
  position:relative;
  z-index:1;
  color:rgba(20,50,27,.82)!important;
}
.practice-link:hover,
.practice-link:focus-visible{
  border-color:rgba(233,255,234,.98)!important;
  box-shadow:0 18px 34px rgba(86,182,91,.34), inset 0 1px 0 rgba(255,255,255,.58)!important;
  transform:translateY(-1px);
}
.practice-link:focus-visible{
  outline:2px solid rgba(235,255,235,.95);
  outline-offset:2px;
}
@media (max-width:640px){
  .practice-link{
    padding-right:66px!important;
  }
  .practice-link::after{
    top:9px;
    right:9px;
    width:44px;
    height:44px;
  }
}


/* Arcade-style lobby header/info boxes */
.lobby-wallet {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.lobby-wallet .arcade-box,
.arcade-guide .arcade-panel {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.lobby-wallet .arcade-box {
  min-height: 110px;
  padding: 18px 18px 18px 76px !important;
  border-radius: 24px;
  border: 2px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 34px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.12), 0 0 20px rgba(246,185,59,.08);
}
.lobby-wallet .arcade-box::before,
.arcade-guide .arcade-panel::before {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  letter-spacing: .04em;
  text-shadow: 0 2px 6px rgba(0,0,0,.38);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 10px 18px rgba(0,0,0,.22);
  z-index: 1;
}
.lobby-wallet .arcade-box::after,
.arcade-guide .arcade-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,.16), transparent 26%, transparent 68%, rgba(255,255,255,.08));
  opacity: .85;
  pointer-events: none;
}
.lobby-wallet .arcade-balance {
  background: linear-gradient(135deg, rgba(15, 67, 37, .98), rgba(25, 106, 67, .92) 52%, rgba(83, 189, 123, .88));
  border-color: rgba(126, 255, 162, .55);
}
.lobby-wallet .arcade-balance::before {
  content: "£";
  background: linear-gradient(180deg, #67f59b 0%, #27c468 100%);
}
.lobby-wallet .arcade-player {
  background: linear-gradient(135deg, rgba(73, 15, 15, .98), rgba(125, 22, 22, .94) 48%, rgba(214, 64, 64, .88));
  border-color: rgba(255, 120, 120, .55);
}
.lobby-wallet .arcade-player::before {
  content: "★";
  background: linear-gradient(180deg, #ff6c6c 0%, #d83232 100%);
}
.lobby-wallet span {
  color: rgba(255,255,255,.82) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.28);
}
.lobby-wallet strong {
  font-size: clamp(24px, 2.2vw, 31px) !important;
  color: #fff;
  text-shadow: 0 3px 14px rgba(0,0,0,.22), 0 0 22px rgba(255,255,255,.10);
}
.arcade-guide .arcade-panel {
  min-height: 132px;
  padding: 18px 18px 18px 76px !important;
  border-radius: 24px !important;
  border: 2px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.arcade-guide .arcade-qualify {
  background: linear-gradient(135deg, rgba(39, 29, 85, .98), rgba(88, 61, 198, .92) 58%, rgba(123, 90, 255, .88)) !important;
  border-color: rgba(168, 146, 255, .60) !important;
}
.arcade-guide .arcade-qualify::before {
  content: "Q";
  background: linear-gradient(180deg, #9d8dff 0%, #7158ff 100%);
}
.arcade-guide .arcade-practice {
  background: linear-gradient(135deg, rgba(96, 54, 5, .98), rgba(180, 105, 10, .92) 54%, rgba(246, 185, 59, .88)) !important;
  border-color: rgba(255, 207, 96, .62) !important;
}
.arcade-guide .arcade-practice::before {
  content: "P";
  background: linear-gradient(180deg, #ffd66c 0%, #f6b93b 100%);
  color: #3c2400;
  text-shadow: none;
}
.arcade-guide strong {
  display: block;
  min-width: 0;
  margin-bottom: 6px;
  color: #fff !important;
  font-size: 18px !important;
  letter-spacing: .08em;
  text-shadow: 0 2px 0 rgba(0,0,0,.26), 0 0 16px rgba(255,255,255,.08);
}
.arcade-guide span {
  color: rgba(255,255,255,.90) !important;
  font-size: 13px !important;
  line-height: 1.48;
  text-shadow: 0 1px 0 rgba(0,0,0,.18);
}
@media (max-width: 820px) {
  .lobby-wallet {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .arcade-guide .arcade-panel,
  .lobby-wallet .arcade-box {
    min-height: 0;
    padding: 16px 16px 16px 68px !important;
  }
  .lobby-wallet .arcade-box::before,
  .arcade-guide .arcade-panel::before {
    left: 14px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    font-size: 17px;
  }
  .arcade-guide strong {
    margin-bottom: 4px;
  }
}


/* Fix arcade play-guide box title/body layout */
.arcade-guide {
  align-items: stretch;
}
.arcade-guide .arcade-panel {
  display: flex !important;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  min-height: 148px;
}
.arcade-guide .arcade-panel strong {
  display: block;
  width: 100%;
  margin: 0 0 8px 0;
  line-height: 1.05;
}
.arcade-guide .arcade-panel span {
  display: block;
  width: 100%;
  margin: 0;
}
@media (max-width: 720px) {
  .arcade-guide .arcade-panel {
    min-height: 0;
  }
}

/* Compact mobile leaderboard delivery - 20260710-mobile-leaderboard-compact-v1 */
@media(max-width:720px){
  .leaderboard-hero{
    padding:14px!important;
    margin:10px 0!important;
  }
  .leaderboard-hero h1{
    font-size:clamp(28px,9vw,38px)!important;
    margin-bottom:6px!important;
  }
  .leaderboard-hero p{
    margin:6px 0!important;
    line-height:1.35!important;
  }
  .leaderboard-summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    margin-top:10px!important;
  }
  .leaderboard-summary span{
    padding:8px 6px!important;
    border-radius:12px!important;
    text-align:center;
  }
  .leaderboard-summary strong{
    font-size:22px!important;
  }
  .leaderboard-summary small{
    margin-top:3px!important;
    font-size:9px!important;
    line-height:1.1!important;
  }
  .leaderboard-card{
    margin:10px 0!important;
    padding:11px!important;
    border-radius:17px!important;
  }
  .leaderboard-card-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    margin-bottom:8px!important;
  }
  .leaderboard-card h2{
    font-size:25px!important;
  }
  .leaderboard-tier-label{
    margin-bottom:3px!important;
    font-size:9px!important;
  }
  .leaderboard-tier-meta{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
    width:min(56%,220px)!important;
  }
  .leaderboard-tier-meta span{
    min-width:0!important;
    padding:6px 7px!important;
    border-radius:11px!important;
    text-align:center!important;
  }
  .leaderboard-tier-meta strong{
    font-size:14px!important;
    line-height:1!important;
  }
  .leaderboard-tier-meta small{
    margin-top:2px!important;
    font-size:8px!important;
    line-height:1.05!important;
  }
  .leaderboard-table tbody{
    display:grid!important;
    gap:6px!important;
  }
  .leaderboard-table tr{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    grid-template-areas:
      "rank player score"
      "rank stage status"!important;
    align-items:center!important;
    column-gap:8px!important;
    row-gap:5px!important;
    margin:0!important;
    padding:8px 9px!important;
    border-radius:13px!important;
  }
  .leaderboard-table td{
    display:block!important;
    padding:0!important;
    min-width:0!important;
  }
  .leaderboard-table td:before{
    display:none!important;
  }
  .leaderboard-table td:nth-child(1){grid-area:rank;}
  .leaderboard-table td:nth-child(2){grid-area:player;}
  .leaderboard-table td:nth-child(3){grid-area:stage;}
  .leaderboard-table td:nth-child(4){grid-area:status;justify-self:end;}
  .leaderboard-table td:nth-child(5){grid-area:score;justify-self:end;}
  .leader-rank{
    min-width:36px!important;
    height:30px!important;
    padding:0 7px!important;
    font-size:12px!important;
  }
  .leader-player{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:14px!important;
  }
  .leader-stage{
    gap:5px!important;
    padding:4px 7px!important;
    font-size:11px!important;
  }
  .leader-stage small{
    font-size:9px!important;
  }
  .leader-status{
    min-width:0!important;
    padding:5px 7px!important;
    font-size:9px!important;
  }
  .leader-score{
    min-width:0!important;
    font-size:19px!important;
  }
  .leaderboard-empty{
    padding:14px 10px!important;
  }
}
@media(max-width:390px){
  .leaderboard-card-head{
    align-items:flex-start!important;
  }
  .leaderboard-tier-meta{
    width:54%!important;
  }
  .leaderboard-card h2{
    font-size:22px!important;
  }
  .leaderboard-table tr{
    grid-template-columns:34px minmax(0,1fr) auto!important;
    column-gap:6px!important;
    padding:7px!important;
  }
}


/* Mobile play menu icons and overlay positioning - 20260710-play-menu-icons-overlay-v1 */
.top-menu-item{
  display:inline-flex;
  align-items:center;
  gap:9px;
}
.top-menu-icon{
  display:inline-grid;
  place-items:center;
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.06));
  color:#fff;
  font-size:15px;
  line-height:1;
  text-shadow:0 1px 3px rgba(0,0,0,.45);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 6px 14px rgba(0,0,0,.18);
}
.top-menu-lobby .top-menu-icon{color:#86efac;background:linear-gradient(145deg,rgba(34,197,94,.28),rgba(21,128,61,.16));}
.top-menu-leaderboard .top-menu-icon{color:#fde68a;background:linear-gradient(145deg,rgba(250,204,21,.30),rgba(245,158,11,.16));}
.top-menu-enter .top-menu-icon{color:#bfdbfe;background:linear-gradient(145deg,rgba(59,130,246,.30),rgba(37,99,235,.16));}
.top-menu-logout .top-menu-icon{color:#fecaca;background:linear-gradient(145deg,rgba(239,68,68,.28),rgba(185,28,28,.16));}
.top-menu-install .top-menu-icon{color:#e9d5ff;background:linear-gradient(145deg,rgba(139,92,246,.30),rgba(109,40,217,.16));}
@media(max-width:740px){
  .public-page .topbar{
    position:sticky!important;
    overflow:visible!important;
    z-index:120!important;
  }
  .public-page .top-menu{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    right:0!important;
    left:auto!important;
    grid-column:auto!important;
    width:min(330px,calc(100vw - 20px))!important;
    max-width:calc(100vw - 20px)!important;
    margin:0!important;
    padding:10px!important;
    z-index:500!important;
    border-radius:18px!important;
    background:linear-gradient(150deg,rgba(15,23,42,.98),rgba(2,6,23,.97))!important;
    border:1px solid rgba(255,255,255,.18)!important;
    box-shadow:0 24px 68px rgba(0,0,0,.58),0 0 0 1px rgba(250,204,21,.06)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  .public-page .top-menu.open{
    display:grid!important;
  }
  .public-page .top-menu a,
  .public-page .top-menu button{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    width:100%!important;
    min-height:48px!important;
    padding:9px 11px!important;
    border-radius:13px!important;
    text-align:left!important;
  }
  .public-page .top-menu-install{
    border:1px solid rgba(246,185,59,.25)!important;
  }
  .public-page .top-menu-icon{
    flex-basis:30px;
    width:30px;
    height:30px;
  }
}


/* Larger ad artwork on public play screens - 20260711-play-ad-image-large-v1 */
body.page-route-qualify .ad-card img,
body.page-route-friendly .ad-card img,
body.page-route-practice .ad-card img,
body.page-route-match .ad-card img,
body.page-route-play .ad-card img,
body.page-route-play-qualification .ad-card img {
  width: min(100%, 460px);
  max-width: 460px;
  max-height: 320px;
  object-fit: contain;
  object-position: center;
  flex: 0 1 460px;
  border-radius: 20px;
}
body.page-route-qualify .ad-card a,
body.page-route-friendly .ad-card a,
body.page-route-practice .ad-card a,
body.page-route-match .ad-card a,
body.page-route-play .ad-card a,
body.page-route-play-qualification .ad-card a {
  align-items: center;
  justify-content: center;
  gap: 20px;
}
@media(max-width:740px) {
  body.page-route-qualify .ad-card,
  body.page-route-friendly .ad-card,
  body.page-route-practice .ad-card,
  body.page-route-match .ad-card,
  body.page-route-play .ad-card,
  body.page-route-play-qualification .ad-card {
    padding: 10px !important;
  }
  body.page-route-qualify .ad-card a,
  body.page-route-friendly .ad-card a,
  body.page-route-practice .ad-card a,
  body.page-route-match .ad-card a,
  body.page-route-play .ad-card a,
  body.page-route-play-qualification .ad-card a {
    flex-direction: column;
    align-items: stretch;
    gap: 9px;
  }
  body.page-route-qualify .ad-card img,
  body.page-route-friendly .ad-card img,
  body.page-route-practice .ad-card img,
  body.page-route-match .ad-card img,
  body.page-route-play .ad-card img,
  body.page-route-play-qualification .ad-card img {
    width: 100%;
    max-width: none;
    max-height: 300px;
    flex: none;
    border-radius: 16px;
  }
  body.page-route-qualify .ad-card span,
  body.page-route-friendly .ad-card span,
  body.page-route-practice .ad-card span,
  body.page-route-match .ad-card span,
  body.page-route-play .ad-card span,
  body.page-route-play-qualification .ad-card span {
    padding: 0 4px 2px;
    font-size: 13px;
  }
}

/* Play ad image sizing hard override - 20260711-play-ad-image-large-v2
   Targets the actual placement classes emitted by render_ad() so the artwork fills the play ad card. */
.ad-card.ad-placement-qualification a,
.ad-card.ad-placement-practice a,
.ad-card.ad-placement-pre_match a,
.ad-card.ad-placement-gameplay a,
.ad-card.ad-placement-result a{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  justify-items:center!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
}
.ad-card.ad-placement-qualification img,
.ad-card.ad-placement-practice img,
.ad-card.ad-placement-pre_match img,
.ad-card.ad-placement-gameplay img,
.ad-card.ad-placement-result img{
  display:block!important;
  width:min(100%,760px)!important;
  max-width:760px!important;
  height:auto!important;
  max-height:none!important;
  margin:0 auto!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:20px!important;
  flex:none!important;
}
.ad-card.ad-placement-qualification span,
.ad-card.ad-placement-practice span,
.ad-card.ad-placement-pre_match span,
.ad-card.ad-placement-gameplay span,
.ad-card.ad-placement-result span{
  display:block!important;
  width:100%!important;
  text-align:center!important;
}
@media(max-width:740px){
  .ad-card.ad-placement-qualification,
  .ad-card.ad-placement-practice,
  .ad-card.ad-placement-pre_match,
  .ad-card.ad-placement-gameplay,
  .ad-card.ad-placement-result{
    padding:6px!important;
  }
  .ad-card.ad-placement-qualification img,
  .ad-card.ad-placement-practice img,
  .ad-card.ad-placement-pre_match img,
  .ad-card.ad-placement-gameplay img,
  .ad-card.ad-placement-result img{
    width:100%!important;
    max-width:100%!important;
    border-radius:14px!important;
  }
}


/* Play ad full-width rendering hard fix - 20260714-venue-phase1-v1 */
.play-ad-card{
  width:100%!important;
  max-width:none!important;
  padding:10px!important;
}
.play-ad-card > a{
  width:100%!important;
  max-width:none!important;
}
.play-ad-card > a > img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
}
.play-ad-card > a > span{
  display:block!important;
  width:100%!important;
  text-align:center!important;
}
@media(max-width:740px){
  .play-ad-card{padding:4px!important;}
  .play-ad-card > a{gap:6px!important;}
}

/* Public mobile ad artwork full-width fix - 20260714-venue-phase1-v1
   The screenshot showed a lobby/public ad still constrained by the original 220px rule.
   Apply full-width artwork to every public ad placement on mobile, including lobby. */
@media(max-width:740px){
  body.public-page .ad-card{
    width:100%!important;
    max-width:none!important;
    padding:8px!important;
  }
  body.public-page .ad-card > a{
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:8px!important;
  }
  body.public-page .ad-card > a > img{
    display:block!important;
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:center!important;
    flex:none!important;
    border-radius:16px!important;
  }
  body.public-page .ad-card > a > span{
    display:block!important;
    width:100%!important;
    padding:2px 4px 0!important;
    text-align:left!important;
  }
}

/* iOS/PWA install menu visibility hard fix - 20260714-venue-phase1-v1
   Mobile overlay button rules use display:flex!important, so hidden buttons need a later, equally specific override. */
.public-page .top-menu [hidden],
.public-page .top-menu button[hidden],
.public-page .top-menu .top-menu-install[hidden]{
  display:none!important;
}

/* Mobile leaderboard empty-state full-width fix - 20260714-venue-phase1-v1 */
@media(max-width:720px){
  .leaderboard-table tbody .leaderboard-empty-row{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  .leaderboard-table tbody .leaderboard-empty-row td{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    grid-area:auto!important;
    justify-self:stretch!important;
    padding:0!important;
  }
  .leaderboard-table tbody .leaderboard-empty-row td:before{
    display:none!important;
    content:none!important;
  }
  .leaderboard-empty{
    display:block!important;
    width:100%!important;
    min-height:116px!important;
    padding:18px 16px!important;
    border-radius:16px!important;
    text-align:center!important;
    background:rgba(2,6,23,.48)!important;
    border:1px solid rgba(255,255,255,.10)!important;
  }
  .leaderboard-empty strong,
  .leaderboard-empty span{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    text-align:center!important;
  }
  .leaderboard-empty strong{
    margin:0 0 6px!important;
    font-size:17px!important;
    line-height:1.2!important;
  }
  .leaderboard-empty span{
    font-size:13px!important;
    line-height:1.4!important;
  }
}

/* Focused mobile Play Mode - 20260711-mobile-play-mode-v2 */
.kd-mobile-play-gate,
.kd-play-mode-exit{display:none}
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-ready{touch-action:pan-y!important;-ms-touch-action:pan-y!important}
  #dartGame.kd-play-mode-ready .darts-live,
  #dartGame.kd-play-mode-ready .active-board-panel,
  #dartGame.kd-play-mode-ready .active-board,
  #dartGame.kd-play-mode-ready canvas{touch-action:pan-y!important;-ms-touch-action:pan-y!important}
  .kd-mobile-play-gate{
    display:grid;
    gap:7px;
    position:relative;
    z-index:30;
    margin:4px 4px 14px;
    padding:18px;
    border:1px solid rgba(239,68,68,.44);
    border-radius:20px;
    text-align:center;
    background:linear-gradient(145deg,rgba(127,29,29,.94),rgba(15,23,42,.98));
    box-shadow:0 18px 42px rgba(0,0,0,.34),0 0 28px rgba(239,68,68,.15)
  }
  .kd-mobile-play-gate[hidden]{display:none!important}
  .kd-mobile-play-gate span{color:#fecaca;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
  .kd-mobile-play-gate strong{color:#fff;font-size:21px;line-height:1.1}
  .kd-enter-play-mode{width:100%;margin-top:8px;min-height:50px;background:linear-gradient(135deg,#ef4444,#f97316)!important;color:#fff!important}
  body.kd-play-mode-open{overflow:hidden!important;overscroll-behavior:none!important;touch-action:none!important}
  body.kd-play-mode-open .kd-orientation-lock{z-index:2147483647}
  .game-card.kd-play-mode-card{
    position:fixed!important;
    inset:0!important;
    z-index:2147482000!important;
    width:100vw!important;
    max-width:none!important;
    height:100vh!important;
    height:100dvh!important;
    min-height:100dvh!important;
    margin:0!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 8px calc(8px + env(safe-area-inset-bottom,0px))!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#020617!important;
    box-shadow:none!important
  }
  .kd-play-mode-card>.darts-play-bg-image{display:none!important}
  #dartGame.kd-play-mode-active{height:100%;min-height:0;overflow:hidden;touch-action:none!important}
  #dartGame.kd-play-mode-active .darts-live{
    height:100%;
    min-height:0;
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr);
    gap:6px;
    padding:0!important;
    overflow:hidden!important;
    border-radius:0!important
  }
  #dartGame.kd-play-mode-active .live-topline{
    min-height:48px;
    padding:4px 48px 4px 4px!important;
    gap:6px!important;
    border-radius:14px!important
  }
  #dartGame.kd-play-mode-active .live-play-app-icon{width:38px!important;height:38px!important;border-radius:11px!important}
  #dartGame.kd-play-mode-active .live-title-row{gap:7px!important}
  #dartGame.kd-play-mode-active .live-title-row>div{padding:4px 7px!important;border-radius:10px!important}
  #dartGame.kd-play-mode-active .eyebrow{display:none!important}
  #dartGame.kd-play-mode-active .live-topline h2{font-size:18px!important;margin:0!important;line-height:1!important}
  #dartGame.kd-play-mode-active .live-topline h2 small{display:inline!important;margin:0 0 0 5px!important;padding:0!important;border:0!important;background:none!important;font-size:10px!important}
  #dartGame.kd-play-mode-active .live-prize{width:auto!important;min-width:78px;padding:6px 8px!important;border-radius:11px!important;text-align:right!important}
  #dartGame.kd-play-mode-active .live-prize span{font-size:8px!important}
  #dartGame.kd-play-mode-active .live-prize strong{font-size:14px!important}
  #dartGame.kd-play-mode-active .arena-scorebar{grid-template-columns:1fr auto 1fr!important;gap:5px!important;padding:3px!important;border-radius:13px!important}
  #dartGame.kd-play-mode-active .arena-score,
  #dartGame.kd-play-mode-active .arena-round{padding:5px 7px!important;border-radius:10px!important}
  #dartGame.kd-play-mode-active .arena-score span,
  #dartGame.kd-play-mode-active .arena-round span,
  #dartGame.kd-play-mode-active .arena-score small,
  #dartGame.kd-play-mode-active .arena-round small{font-size:8px!important}
  #dartGame.kd-play-mode-active .arena-score strong{font-size:24px!important;margin:2px 0!important}
  #dartGame.kd-play-mode-active .arena-round strong{font-size:15px!important;margin:3px 0 1px!important}
  #dartGame.kd-play-mode-active .play-grid{display:block!important;min-height:0!important;height:100%!important;margin:0!important}
  #dartGame.kd-play-mode-active .active-board-panel{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    padding:4px!important;
    gap:3px!important;
    border-radius:14px!important;
    justify-content:flex-start!important;
    overflow:hidden!important
  }
  #dartGame.kd-play-mode-active .old-target-instruction{width:100%!important;margin:0!important;padding:5px 8px!important;border-radius:10px!important;min-height:28px}
  #dartGame.kd-play-mode-active .old-play-canvas{
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    max-height:calc(100dvh - 244px)!important;
    flex:1 1 auto!important;
    min-height:0!important;
    object-fit:contain!important
  }
  #dartGame.kd-play-mode-active .old-power-hud{width:100%!important;margin:2px 0 0!important;padding:5px 8px!important;border-radius:10px!important}
  #dartGame.kd-play-mode-active .board-power-meta{margin-bottom:3px!important}
  #dartGame.kd-play-mode-active .board-power-track{height:13px!important}
  #dartGame.kd-play-mode-active .board-control-hint{width:100%!important;margin:2px 0 0!important;padding:5px 7px!important;font-size:10px!important;border-radius:9px!important}
  #dartGame.kd-play-mode-active .throw-panel{display:none!important}
  #dartGame.kd-play-mode-active .play-continue{
    position:absolute;
    left:8px;
    right:8px;
    bottom:calc(8px + env(safe-area-inset-bottom,0px));
    z-index:40;
    width:auto!important;
    min-height:48px;
    margin:0!important
  }
  .kd-play-mode-exit{
    display:none;
    position:absolute;
    top:calc(10px + env(safe-area-inset-top,0px));
    right:10px;
    z-index:60;
    min-width:40px;
    height:40px;
    padding:0 9px;
    align-items:center;
    justify-content:center;
    gap:4px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;
    background:rgba(2,6,23,.9);
    color:#fff;
    font-weight:900;
    box-shadow:0 10px 24px rgba(0,0,0,.32)
  }
  #dartGame.kd-play-mode-active>.kd-play-mode-exit{display:inline-flex}
  .kd-play-mode-exit span{font-size:24px;line-height:1}
  .kd-play-mode-exit b{font-size:10px;text-transform:uppercase;letter-spacing:.06em}
}

/* Hide the dartboard until focused Play Mode starts - 20260711-mobile-play-mode-v2 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-ready > .darts-live{
    display:none!important;
  }
  #dartGame.kd-play-mode-active > .darts-live{
    display:grid!important;
  }
}

/* Focused mobile Play Mode viewport refinement - 20260711-mobile-play-mode-v3 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .darts-live{
    grid-template-rows:auto minmax(0,1fr)!important;
    gap:4px!important;
  }
  #dartGame.kd-play-mode-active .live-topline{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .arena-scorebar{
    min-height:50px!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    padding:2px!important;
    gap:3px!important;
  }
  #dartGame.kd-play-mode-active .old-target-instruction{
    flex:0 0 auto!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    display:block!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:1 / 1!important;
    object-fit:contain!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud,
  #dartGame.kd-play-mode-active .board-control-hint{
    flex:0 0 auto!important;
  }
}

/* Focused mobile Play Mode: board-first viewport - 20260711-mobile-play-mode-v4 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .live-topline,
  #dartGame.kd-play-mode-active .arena-scorebar{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .darts-live{
    display:block!important;
    height:100%!important;
    min-height:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:2px!important;
    gap:2px!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .old-target-instruction{
    order:0!important;
    flex:0 0 26px!important;
    min-height:26px!important;
    margin:0!important;
    padding:4px 7px!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    order:1!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:1/1!important;
    flex:0 0 auto!important;
    margin:0!important;
    object-fit:contain!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    order:2!important;
    flex:0 0 auto!important;
    width:100%!important;
    margin:2px 0 0!important;
    padding:5px 8px!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    order:3!important;
    flex:0 0 auto!important;
    width:100%!important;
    margin:2px 0 0!important;
    padding:4px 7px!important;
    line-height:1.2!important;
  }
}

/* Focused mobile Play Mode: floating score, no top panel - 20260711-mobile-play-mode-v6 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active{
    position:relative!important;
  }
  #dartGame.kd-play-mode-active .darts-live{
    position:relative!important;
    display:block!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .live-topline,
  #dartGame.kd-play-mode-active .old-target-instruction{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .arena-scorebar{
    display:grid!important;
    position:absolute!important;
    top:calc(6px + env(safe-area-inset-top,0px))!important;
    left:8px!important;
    right:56px!important;
    z-index:55!important;
    grid-template-columns:1fr auto 1fr!important;
    gap:4px!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    pointer-events:none!important;
  }
  #dartGame.kd-play-mode-active .arena-score,
  #dartGame.kd-play-mode-active .arena-round{
    min-width:0!important;
    padding:4px 7px!important;
    border-radius:10px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    background:rgba(2,6,23,.78)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    box-shadow:0 8px 18px rgba(0,0,0,.24)!important;
  }
  #dartGame.kd-play-mode-active .arena-score span,
  #dartGame.kd-play-mode-active .arena-round span,
  #dartGame.kd-play-mode-active .arena-score small,
  #dartGame.kd-play-mode-active .arena-round small{
    font-size:7px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .arena-score strong{
    font-size:20px!important;
    line-height:1!important;
    margin:1px 0!important;
  }
  #dartGame.kd-play-mode-active .arena-round strong{
    font-size:12px!important;
    line-height:1!important;
    margin:2px 0 1px!important;
  }
  #dartGame.kd-play-mode-active .play-grid,
  #dartGame.kd-play-mode-active .active-board-panel{
    height:100%!important;
    min-height:0!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    padding:0 2px 2px!important;
    gap:2px!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:calc(100dvh - 96px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    aspect-ratio:1/1!important;
    object-fit:contain!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    order:2!important;
    margin:1px 0 0!important;
    padding:4px 7px!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    order:3!important;
    margin:1px 0 0!important;
    padding:3px 6px!important;
    font-size:9px!important;
    line-height:1.15!important;
  }
}

/* Focused mobile Play Mode: slim score row above board - 20260711-mobile-play-mode-v6 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .live-topline,
  #dartGame.kd-play-mode-active .old-target-instruction,
  #dartGame.kd-play-mode-active .target-instruction{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .darts-live{
    display:grid!important;
    grid-template-rows:36px minmax(0,1fr)!important;
    gap:3px!important;
    height:100%!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .arena-scorebar{
    position:relative!important;
    inset:auto!important;
    z-index:20!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:3px 48px 3px 4px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    pointer-events:none!important;
  }
  #dartGame.kd-play-mode-active .arena-score.you{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    min-width:0!important;
    height:30px!important;
    padding:3px 9px!important;
    border-radius:10px!important;
    background:rgba(15,23,42,.96)!important;
    border:1px solid rgba(59,130,246,.42)!important;
  }
  #dartGame.kd-play-mode-active .arena-score.you span{
    display:inline!important;
    font-size:10px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .arena-score.you strong{
    display:inline!important;
    margin:0!important;
    font-size:22px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .arena-score.you small{
    display:inline!important;
    margin-left:auto!important;
    font-size:8px!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .arena-round{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    height:30px!important;
    padding:3px 8px!important;
    border-radius:10px!important;
    background:rgba(15,23,42,.96)!important;
    border:1px solid rgba(255,255,255,.13)!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .arena-round span,
  #dartGame.kd-play-mode-active .arena-round small{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .arena-round strong{
    margin:0!important;
    font-size:12px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .arena-score.opp{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:block!important;
    min-height:0!important;
    height:100%!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-height:0!important;
    height:100%!important;
    padding:0 2px 2px!important;
    gap:3px!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    order:1!important;
    display:block!important;
    width:min(calc(100vw - 12px), calc(100dvh - 142px))!important;
    max-width:100%!important;
    height:auto!important;
    max-height:calc(100dvh - 142px)!important;
    aspect-ratio:1/1!important;
    flex:0 1 auto!important;
    margin:0 auto!important;
    object-fit:contain!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    order:2!important;
    width:100%!important;
    flex:0 0 43px!important;
    min-height:43px!important;
    margin:0!important;
    padding:5px 8px!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    order:3!important;
    width:100%!important;
    flex:0 0 27px!important;
    min-height:27px!important;
    margin:0!important;
    padding:4px 7px!important;
    font-size:10px!important;
    line-height:1.15!important;
  }
}

/* Focused mobile Play Mode structural fix - 20260711-mobile-play-mode-v7
   Score row is moved into normal flow above the board; title/instruction panels are hidden at source. */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .darts-live{
    display:block!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .live-topline,
  #dartGame.kd-play-mode-active .target-instruction,
  #dartGame.kd-play-mode-active .old-target-instruction{
    display:none!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    gap:3px!important;
    margin:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row{
    position:static!important;
    inset:auto!important;
    order:0!important;
    flex:0 0 34px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    width:100%!important;
    height:34px!important;
    min-height:34px!important;
    margin:0!important;
    padding:2px 48px 2px 2px!important;
    gap:5px!important;
    background:#020617!important;
    border:0!important;
    box-shadow:none!important;
    pointer-events:none!important;
    z-index:2!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    display:flex!important;
    align-items:center!important;
    height:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:3px 8px!important;
    border-radius:9px!important;
    background:#0f172a!important;
    box-shadow:none!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you{
    justify-content:flex-start!important;
    gap:7px!important;
    border:1px solid rgba(59,130,246,.42)!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you span{
    display:inline!important;
    font-size:9px!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you strong{
    display:inline!important;
    margin:0!important;
    font-size:21px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you small{
    display:inline!important;
    margin-left:auto!important;
    font-size:8px!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    gap:4px!important;
    border:1px solid rgba(255,255,255,.13)!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round span,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round small,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.opp{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round strong{
    margin:0!important;
    font-size:11px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    order:1!important;
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0 2px 2px!important;
    gap:3px!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    order:0!important;
    flex:1 1 auto!important;
    display:block!important;
    width:min(calc(100vw - 12px), calc(100dvh - 112px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)))!important;
    max-width:100%!important;
    height:auto!important;
    max-height:calc(100dvh - 112px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    aspect-ratio:1/1!important;
    margin:0 auto!important;
    object-fit:contain!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    order:1!important;
    flex:0 0 40px!important;
    width:100%!important;
    min-height:40px!important;
    margin:0!important;
    padding:4px 8px!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    order:2!important;
    flex:0 0 25px!important;
    width:100%!important;
    min-height:25px!important;
    margin:0!important;
    padding:3px 7px!important;
    font-size:9px!important;
    line-height:1.15!important;
  }
}


/* Focused mobile Play Mode definitive viewport layout - 20260711-mobile-play-mode-v10
   The game card is portalled to body by game.js, so no page header or pre-play panel can remain above it. */
@media (max-width:900px) and (pointer:coarse){
  body.kd-play-mode-open > .game-card.kd-play-mode-card{
    position:fixed!important;
    inset:0!important;
    z-index:2147482000!important;
    width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    margin:0!important;
    padding:calc(4px + env(safe-area-inset-top,0px)) 4px calc(4px + env(safe-area-inset-bottom,0px))!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:#020617!important;
  }
  body.kd-play-mode-open > .game-card.kd-play-mode-card > #dartGame{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .live-topline,
  #dartGame.kd-play-mode-active .target-instruction,
  #dartGame.kd-play-mode-active .old-target-instruction{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .darts-live{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    gap:2px!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row{
    order:0!important;
    flex:0 0 34px!important;
    height:34px!important;
    min-height:34px!important;
    position:static!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    order:1!important;
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:2px!important;
    padding:0!important;
    overflow:hidden!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    order:0!important;
    flex:0 0 auto!important;
    display:block!important;
    width:calc(100vw - 8px)!important;
    height:calc(100vw - 8px)!important;
    max-width:calc(100vw - 8px)!important;
    max-height:calc(100vw - 8px)!important;
    min-height:0!important;
    aspect-ratio:1/1!important;
    object-fit:contain!important;
    margin:0!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    order:1!important;
    flex:0 0 40px!important;
    min-height:40px!important;
    width:100%!important;
    margin:0!important;
    padding:4px 8px!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    order:2!important;
    flex:0 0 25px!important;
    min-height:25px!important;
    width:100%!important;
    margin:0!important;
    padding:3px 7px!important;
  }
}

/* Focused mobile Play Mode: non-overlapping score/header and compact board stack - 20260711-mobile-play-mode-v10 */
@media (max-width:900px) and (pointer:coarse){
  body.kd-play-mode-open > .game-card.kd-play-mode-card{
    overflow-y:auto!important;
    overscroll-behavior:none!important;
  }
  #dartGame.kd-play-mode-active .play-grid{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    min-height:100%!important;
    gap:6px!important;
    overflow:visible!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row{
    order:0!important;
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    flex:0 0 42px!important;
    margin:0 0 6px!important;
    padding:4px 72px 4px 6px!important;
    gap:6px!important;
    border:1px solid rgba(96,165,250,.30)!important;
    border-radius:12px!important;
    background:linear-gradient(90deg,rgba(15,23,42,.98),rgba(2,6,23,.96))!important;
    box-shadow:0 6px 18px rgba(0,0,0,.28)!important;
    z-index:20!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    min-width:0!important;
    height:32px!important;
    padding:3px 8px!important;
    border-radius:9px!important;
    background:rgba(15,23,42,.72)!important;
    border:1px solid rgba(255,255,255,.08)!important;
    text-align:left!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.opp{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row span,
  #dartGame.kd-play-mode-active .kd-focused-score-row small{
    display:inline!important;
    margin:0!important;
    font-size:9px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row strong{
    display:inline!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round strong{
    font-size:13px!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you small,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round small{
    display:none!important;
  }
  #dartGame.kd-play-mode-active > .kd-play-mode-exit{
    top:calc(7px + env(safe-area-inset-top,0px))!important;
    right:8px!important;
    height:34px!important;
    min-width:58px!important;
    padding:0 8px!important;
    z-index:80!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    order:1!important;
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    gap:4px!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel:before,
  #dartGame.kd-play-mode-active .active-board-panel:after{
    display:none!important;
  }
  #dartGame.kd-play-mode-active .old-play-canvas{
    display:block!important;
    width:calc(100vw - 12px)!important;
    height:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    max-height:calc(100vw - 12px)!important;
    margin:0 auto!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    z-index:4!important;
  }
  #dartGame.kd-play-mode-active .old-power-hud{
    position:relative!important;
    flex:0 0 auto!important;
    width:calc(100% - 8px)!important;
    min-height:42px!important;
    margin:0 auto!important;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    position:relative!important;
    flex:0 0 auto!important;
    width:calc(100% - 8px)!important;
    min-height:26px!important;
    margin:0 auto 4px!important;
  }
}

/* Focused mobile Play Mode: add breathing room above dartboard - 20260711-mobile-play-mode-v10 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .active-board-panel{
    padding-top:10px!important;
  }
}

/* Focused mobile Play Mode compact single-row HUD - 20260711-admin-ads-layout-v1 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .play-grid{
    gap:4px!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row{
    order:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    align-items:center!important;
    width:100%!important;
    height:38px!important;
    min-height:38px!important;
    flex:0 0 38px!important;
    margin:0!important;
    padding:3px 72px 3px 4px!important;
    gap:4px!important;
    border:1px solid rgba(56,189,248,.42)!important;
    border-radius:13px!important;
    background:linear-gradient(90deg,rgba(15,23,42,.99),rgba(2,6,23,.97))!important;
    box-shadow:0 5px 16px rgba(0,0,0,.3)!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    width:100%!important;
    height:30px!important;
    min-height:30px!important;
    padding:2px 7px!important;
    margin:0!important;
    border:0!important;
    border-radius:9px!important;
    background:rgba(15,23,42,.56)!important;
    box-shadow:none!important;
    text-align:center!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you{
    justify-content:flex-start!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you span,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round span{
    display:inline!important;
    margin:0!important;
    color:#cbd5e1!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you strong{
    display:inline!important;
    margin:0!important;
    color:#60a5fa!important;
    font-size:20px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round strong{
    display:inline!important;
    margin:0!important;
    color:#fff!important;
    font-size:16px!important;
    line-height:1!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you small,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round small,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.opp{
    display:none!important;
  }
  #dartGame.kd-play-mode-active > .kd-play-mode-exit{
    top:calc(6px + env(safe-area-inset-top,0px))!important;
    right:7px!important;
    height:32px!important;
    min-width:60px!important;
    padding:0 8px!important;
    border-radius:999px!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    padding-top:14px!important;
  }
}

/* Focused mobile Play Mode definitive single-row HUD - 20260711-admin-ads-layout-v1
   Resets the legacy mobile arena-round row rule so score and throw stay on one line. */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .play-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-content:start!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row{
    grid-column:1 / -1!important;
    grid-row:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(96px,.72fr)!important;
    width:100%!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:4px 70px 4px 4px!important;
    gap:5px!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-score.you,
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    grid-column:auto!important;
    grid-row:auto!important;
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    align-items:center!important;
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:3px 8px!important;
  }
  #dartGame.kd-play-mode-active .kd-focused-score-row .arena-round{
    justify-content:center!important;
  }
  #dartGame.kd-play-mode-active .active-board-panel{
    grid-column:1 / -1!important;
    grid-row:auto!important;
    margin-top:14px!important;
    padding-top:0!important;
  }
}

/* Focused mobile Play Mode subtle brand watermark - 20260711-admin-ads-layout-v1 */
.kd-focused-brand-watermark{
  display:none;
}
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark{
    display:flex!important;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:138px;
    margin:16px auto 0;
    padding:4px 0 calc(8px + env(safe-area-inset-bottom,0px));
    flex:0 0 auto;
    pointer-events:none;
    overflow:hidden;
  }
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark img{
    display:block;
    width:clamp(135px,39vw,180px);
    height:auto;
    max-height:129px;
    object-fit:contain;
    opacity:.24;
    filter:grayscale(.08) drop-shadow(0 0 18px rgba(239,68,68,.24));
  }
}
@media (max-width:900px) and (pointer:coarse) and (max-height:760px){
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark{
    min-height:96px;
    margin-top:10px;
    padding-bottom:4px;
  }
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark img{
    width:123px;
    max-height:87px;
    opacity:.20;
  }
}
@media (max-width:900px) and (pointer:coarse) and (max-height:620px){
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark{
    display:none!important;
  }
}

/* Focused mobile Play Mode logo order fix - 20260711-admin-ads-layout-v1
   The board panel is a flex container with explicit child order values. Keep the brand after power and guidance. */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .kd-focused-brand-watermark{
    display:none!important;
    order:4!important;
    margin-top:16px!important;
  }
}

/* Focused mobile Play Mode instruction readability - 20260711-admin-ads-layout-v1 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active .board-control-hint{
    font-size:14px!important;
    line-height:1.42!important;
    font-weight:800!important;
    padding:9px 11px!important;
    margin-top:7px!important;
    letter-spacing:.01em!important;
  }
}
@media (max-width:900px) and (pointer:coarse) and (max-height:680px){
  #dartGame.kd-play-mode-active .board-control-hint{
    font-size:13px!important;
    line-height:1.35!important;
    padding:7px 9px!important;
    margin-top:5px!important;
  }
}

/* Focused mobile Play Mode colour emphasis - 20260711-admin-ads-layout-v1 */
@media (max-width:900px) and (pointer:coarse){
  #dartGame.kd-play-mode-active > .kd-play-mode-exit{
    background:linear-gradient(135deg,#dc2626,#991b1b)!important;
    border-color:rgba(254,202,202,.72)!important;
    color:#fff!important;
    box-shadow:0 10px 24px rgba(127,29,29,.44),inset 0 1px 0 rgba(255,255,255,.20)!important;
  }
  #dartGame.kd-play-mode-active > .kd-play-mode-exit:hover,
  #dartGame.kd-play-mode-active > .kd-play-mode-exit:focus-visible{
    background:linear-gradient(135deg,#ef4444,#b91c1c)!important;
    outline:2px solid rgba(254,202,202,.88);
    outline-offset:2px;
  }
  #dartGame.kd-play-mode-active .board-control-hint{
    background:linear-gradient(135deg,rgba(20,83,45,.98),rgba(21,128,61,.94))!important;
    border-color:rgba(134,239,172,.62)!important;
    color:#f0fdf4!important;
    box-shadow:0 12px 26px rgba(5,46,22,.34),inset 0 1px 0 rgba(255,255,255,.16)!important;
    text-shadow:0 1px 0 rgba(0,0,0,.30)!important;
  }
}

/* 2026-07-12: Phase 1 practice coaching feedback */
.practice-feedback,
.practice-session-summary {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(111, 255, 145, .35);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(9, 39, 20, .96), rgba(5, 22, 13, .96));
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}
.practice-feedback-head,
.practice-session-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.practice-feedback-head span,
.practice-session-summary-head span {
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #86ff9f;
}
.practice-feedback-head strong,
.practice-session-summary-head strong {
  font-size: .8rem;
  color: #fff;
}
.practice-feedback-grid,
.practice-session-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.practice-feedback-grid > div,
.practice-session-summary-grid > div {
  padding: 9px 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .07);
}
.practice-feedback-grid span,
.practice-session-summary-grid span {
  display: block;
  margin-bottom: 3px;
  font-size: .72rem;
  color: rgba(255, 255, 255, .68);
}
.practice-feedback-grid strong,
.practice-session-summary-grid strong {
  display: block;
  font-size: .9rem;
  color: #fff;
}
.practice-feedback p,
.practice-session-summary p {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, .88);
  line-height: 1.45;
}
.practice-session-summary {
  width: min(760px, calc(100% - 24px));
  margin: 16px auto;
}
@media (max-width: 900px) {
  .kd-play-mode-active .practice-feedback {
    margin-top: 8px;
    padding: 10px;
  }
  .kd-play-mode-active .practice-feedback-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
  }
  .kd-play-mode-active .practice-feedback-grid > div {
    padding: 6px;
    text-align: center;
  }
  .kd-play-mode-active .practice-feedback-grid span {
    font-size: .58rem;
  }
  .kd-play-mode-active .practice-feedback-grid strong {
    font-size: .72rem;
  }
  .kd-play-mode-active .practice-feedback p {
    font-size: .75rem;
    margin-top: 7px;
  }
}
@media (max-width: 520px) {
  .practice-session-summary-grid {
    grid-template-columns: 1fr;
  }
}

/* 2026-07-12: Keep the completed practice summary visible above focused mobile play. */
.practice-summary-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483600;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(16px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
  overflow-y: auto;
  background: rgba(2, 8, 18, .88);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.practice-summary-modal .practice-session-summary {
  width: min(620px, 100%);
  max-height: calc(100dvh - 32px);
  margin: auto;
  overflow-y: auto;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .58);
}
.practice-summary-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}
.practice-summary-actions .btn {
  width: 100%;
  text-align: center;
}
body.practice-summary-open {
  overflow: hidden !important;
  overscroll-behavior: none;
}
@media (max-width: 520px) {
  .practice-summary-modal {
    align-items: flex-start;
  }
  .practice-summary-modal .practice-session-summary {
    margin-top: auto;
    margin-bottom: auto;
    padding: 16px;
  }
  .practice-summary-actions {
    grid-template-columns: 1fr;
  }
}

/* Compact game-style lobby status HUD - 20260712-lobby-status-hud-v1 */
.lobby-wallet{
  gap:12px;
  margin:12px 0 16px;
}
.lobby-wallet .arcade-box{
  min-height:76px;
  padding:11px 14px 11px 58px!important;
  border-radius:15px;
  border-width:1px;
  box-shadow:0 9px 20px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14),inset 0 -3px 0 rgba(0,0,0,.18);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
}
.lobby-wallet .arcade-box::before{
  left:12px;
  width:34px;
  height:34px;
  border-radius:9px;
  font-size:15px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 5px 10px rgba(0,0,0,.24);
}
.lobby-wallet span{
  font-size:10px!important;
  line-height:1;
  font-weight:900!important;
  letter-spacing:.16em;
  text-transform:uppercase;
  opacity:.88;
}
.lobby-wallet strong{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:clamp(19px,2vw,25px)!important;
  line-height:1.08;
  letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
  text-shadow:0 2px 0 rgba(0,0,0,.32),0 0 12px rgba(255,255,255,.10);
}
.lobby-wallet .arcade-balance{
  background:linear-gradient(180deg,rgba(25,116,66,.98),rgba(12,72,39,.98));
}
.lobby-wallet .arcade-player{
  background:linear-gradient(180deg,rgba(166,38,38,.98),rgba(91,15,15,.98));
}
@media(max-width:820px){
  .lobby-wallet{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin:8px 0 12px;
  }
  .lobby-wallet .arcade-box{
    min-height:62px;
    padding:8px 8px 8px 43px!important;
    border-radius:12px;
  }
  .lobby-wallet .arcade-box::before{
    left:8px;
    width:27px;
    height:27px;
    border-radius:8px;
    font-size:13px;
  }
  .lobby-wallet span{
    font-size:8px!important;
    letter-spacing:.11em;
  }
  .lobby-wallet strong{
    font-size:clamp(14px,4.2vw,19px)!important;
  }
}
@media(max-width:370px){
  .lobby-wallet .arcade-box{
    padding-left:39px!important;
  }
  .lobby-wallet .arcade-box::before{
    left:7px;
    width:25px;
    height:25px;
  }
  .lobby-wallet strong{
    font-size:13px!important;
  }
}


/* Collapsible lobby Qualify and Practice panels - closed by default */
.collapsible-play-guide .lobby-info-panel {
  display: block !important;
  min-height: 0 !important;
  padding: 0 !important;
}
.collapsible-play-guide .lobby-info-panel summary {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 74px;
  padding: 18px 18px 18px 76px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.collapsible-play-guide .lobby-info-panel summary::-webkit-details-marker {
  display: none;
}
.collapsible-play-guide .lobby-info-panel summary::marker {
  content: "";
}
.collapsible-play-guide .lobby-info-panel summary strong {
  margin: 0 !important;
}
.collapsible-play-guide .panel-toggle-icon {
  flex: 0 0 auto;
  width: 34px !important;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.34);
  background: rgba(0,0,0,.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
  position: relative;
}
.collapsible-play-guide .panel-toggle-icon::before,
.collapsible-play-guide .panel-toggle-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 13px;
  height: 2px;
  border-radius: 2px;
  background: #fff;
  transform: translate(-50%,-50%);
  transition: transform .2s ease, opacity .2s ease;
}
.collapsible-play-guide .panel-toggle-icon::after {
  transform: translate(-50%,-50%) rotate(90deg);
}
.collapsible-play-guide .lobby-info-panel[open] .panel-toggle-icon::after {
  opacity: 0;
  transform: translate(-50%,-50%) rotate(0deg);
}
.collapsible-play-guide .lobby-info-panel-body {
  position: relative;
  z-index: 2;
  padding: 0 18px 18px 76px;
}
.collapsible-play-guide .lobby-info-panel:not([open]) .lobby-info-panel-body {
  display: none;
}
.collapsible-play-guide .lobby-info-panel summary:hover {
  background: rgba(255,255,255,.06);
}
.collapsible-play-guide .lobby-info-panel summary:focus-visible {
  outline: 3px solid rgba(255,255,255,.92);
  outline-offset: -4px;
  border-radius: 22px;
}
@media (max-width:720px) {
  .collapsible-play-guide .lobby-info-panel summary {
    min-height: 66px;
    padding: 14px 14px 14px 68px;
  }
  .collapsible-play-guide .lobby-info-panel-body {
    padding: 0 14px 15px 68px;
  }
  .collapsible-play-guide .panel-toggle-icon {
    width: 30px !important;
    height: 30px;
  }
}
/* 2026-07-12: Keep post-play practice actions visible on short mobile screens. */
@media (max-width: 520px) {
  .practice-summary-modal {
    padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  }
  .practice-summary-modal .practice-session-summary {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)));
    margin: 0;
    padding: 12px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .practice-summary-modal .practice-session-summary-head {
    flex: 0 0 auto;
    margin-bottom: 8px;
  }
  .practice-summary-modal .practice-session-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  .practice-summary-modal .practice-session-summary-grid > div {
    padding: 7px 8px;
  }
  .practice-summary-modal .practice-session-summary p {
    margin-top: 8px;
    font-size: .82rem;
    line-height: 1.35;
  }
  .practice-summary-modal .practice-summary-actions {
    position: sticky;
    bottom: 0;
    z-index: 3;
    flex: 0 0 auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 10px -12px -12px;
    padding: 10px 12px max(10px, env(safe-area-inset-bottom));
    background: linear-gradient(180deg, rgba(5,22,13,.18), rgba(5,22,13,.98) 24%);
    border-top: 1px solid rgba(111,255,145,.24);
  }
  .practice-summary-modal .practice-summary-actions .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 8px;
  }
}

@media (max-width: 360px), (max-height: 620px) {
  .practice-summary-modal .practice-session-summary-grid > div {
    padding: 6px;
  }
  .practice-summary-modal .practice-session-summary-grid span {
    font-size: .65rem;
  }
  .practice-summary-modal .practice-session-summary-grid strong {
    font-size: .8rem;
  }
}

/* Knockout Darts Venues - Phase 1 */
.venue-event-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:24px;border:1px solid color-mix(in srgb,var(--primary) 50%,transparent);border-radius:22px;background:linear-gradient(135deg,rgba(15,23,42,.96),rgba(15,23,42,.78));box-shadow:0 22px 60px rgba(0,0,0,.34)}
.venue-event-hero h1{margin:.2rem 0 .5rem;font-size:clamp(1.8rem,5vw,3.4rem)}.venue-event-hero .venue-code{display:inline-flex;padding:10px 14px;border-radius:12px;background:var(--primary);color:#111827;font-weight:900;letter-spacing:.12em}.venue-event-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.venue-event-meta span{padding:8px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(15,23,42,.55)}
.venue-status-card{margin-top:18px;padding:22px;border-radius:20px;background:rgba(15,23,42,.92);border:1px solid rgba(255,255,255,.12)}.venue-status-card h2{margin-top:0}.venue-player-score{font-size:clamp(2.6rem,12vw,5rem);font-weight:1000;line-height:1;color:var(--primary)}.venue-player-opponent{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin:18px 0}.venue-player-opponent>div{padding:14px;border-radius:16px;background:rgba(255,255,255,.06);text-align:center}.venue-player-opponent strong{display:block;font-size:1.4rem}.venue-player-opponent>span{font-weight:1000;color:var(--primary)}
.venue-lobby-card{margin:18px 0;padding:18px;border-radius:18px;border:1px solid color-mix(in srgb,var(--primary) 45%,transparent);background:linear-gradient(135deg,rgba(246,185,59,.16),rgba(125,95,255,.12))}.venue-lobby-card h2{margin:.2rem 0}.venue-lobby-card .btn{margin-top:10px}
body.venue-screen-page{--venue-screen-bg:none;margin:0;min-height:100vh;overflow:hidden;position:relative;isolation:isolate;background-color:#060914;background-image:var(--venue-screen-bg);background-size:cover;background-position:center;background-repeat:no-repeat;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body.venue-screen-page:before{content:"";position:fixed;inset:0;background:linear-gradient(180deg,rgba(3,6,15,.48),rgba(3,6,15,.84)),radial-gradient(circle at 18% 0,color-mix(in srgb,var(--venue-primary) 25%,transparent),transparent 42%),radial-gradient(circle at 90% 80%,color-mix(in srgb,var(--venue-secondary) 20%,transparent),transparent 40%);pointer-events:none;z-index:2}body.venue-screen-page:after{content:"";position:fixed;inset:0;background:linear-gradient(90deg,rgba(2,6,23,.28),transparent 35%,transparent 65%,rgba(2,6,23,.28));pointer-events:none;z-index:2}.venue-screen-video-background{position:fixed;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;transform:scale(1.015);transition:opacity .55s ease;background:#060914}.has-custom-venue-background .venue-screen-video-background,.venue-video-failed .venue-screen-video-background{opacity:0}.venue-video-autoplay-blocked .venue-screen-video-background{opacity:1}.venue-screen-video-shade{position:fixed;inset:0;z-index:1;background:rgba(0,0,0,.6);pointer-events:none}.has-custom-venue-background .venue-screen-video-shade,.venue-video-failed .venue-screen-video-shade{display:none}
.venue-screen{position:relative;z-index:4;min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(20px,2.4vw,44px);box-sizing:border-box}.venue-screen-header{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.16)}.venue-screen-brand{display:flex;align-items:center;gap:18px}.venue-screen-brand img{width:clamp(70px,7vw,118px);height:clamp(70px,7vw,118px);object-fit:contain}.venue-screen-brand span,.venue-screen-kicker{color:var(--venue-primary);font-weight:900;letter-spacing:.12em;text-transform:uppercase}.venue-screen-brand h1{margin:.15rem 0 0;font-size:clamp(2rem,4vw,4.4rem);line-height:1}.venue-screen-status{display:grid;justify-items:end;gap:10px;text-align:right;min-width:250px}.venue-screen-status-tools{display:flex;align-items:center;justify-content:flex-end;gap:14px}.venue-screen-fullscreen-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(5,10,24,.72);color:#fff;font:inherit;font-size:.75rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.2);backdrop-filter:blur(8px);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.venue-screen-fullscreen-toggle span{font-size:1.15rem;line-height:1;color:var(--venue-primary)}.venue-screen-fullscreen-toggle:hover,.venue-screen-fullscreen-toggle:focus-visible{transform:translateY(-1px);border-color:var(--venue-primary);background:rgba(10,18,36,.92);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--venue-primary) 20%,transparent),0 10px 28px rgba(0,0,0,.28)}.venue-screen-fullscreen-toggle.is-active{border-color:var(--venue-primary);background:color-mix(in srgb,var(--venue-primary) 18%,rgba(5,10,24,.88))}.venue-screen-fullscreen-toggle.has-error{animation:venueFullscreenError .32s ease 2;border-color:#ef4444}@keyframes venueFullscreenError{50%{transform:translateX(5px)}}.venue-screen-clock{display:grid;justify-items:end;line-height:1}.venue-screen-clock strong{font-size:clamp(2.1rem,4vw,4.4rem);font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 0 24px rgba(255,255,255,.18)}.venue-screen-clock small{margin-top:7px;color:var(--venue-primary);font-weight:800;letter-spacing:.08em;text-transform:uppercase}.venue-screen-status-row{display:flex;align-items:center;justify-content:flex-end;gap:16px}.venue-screen-status-row span{display:block;text-transform:uppercase;letter-spacing:.12em;color:#cbd5e1}.venue-screen-status-row b{font-size:clamp(1.7rem,3vw,3.2rem);color:var(--venue-primary);font-variant-numeric:tabular-nums}.venue-screen-status-row b small{font-size:.45em;color:#cbd5e1}.venue-screen main{display:flex;flex-direction:column;justify-content:center;min-height:0;padding:22px 0}.venue-screen-checkin{display:grid;grid-template-columns:minmax(360px,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,72px);align-items:center}.venue-screen-callout{text-align:center;padding:28px;border-radius:28px;background:rgba(5,10,24,.88);border:2px solid var(--venue-primary);box-shadow:0 28px 80px rgba(0,0,0,.42)}.venue-screen-callout>span{font-size:clamp(1.2rem,2vw,2rem);font-weight:900;text-transform:uppercase;letter-spacing:.14em;color:var(--venue-primary)}.venue-screen-callout h2{font-size:clamp(2rem,3.5vw,4rem);margin:.5rem 0 1rem}.venue-screen-qr{width:min(32vh,360px);aspect-ratio:1;margin:0 auto 16px;padding:12px;background:#fff;border-radius:20px;box-sizing:border-box}.venue-screen-qr svg{display:block;width:100%;height:100%}.venue-screen-qr.is-small{width:min(24vh,260px);margin-top:18px}.venue-screen-code{display:inline-block;font-size:clamp(1.1rem,2vw,2rem);letter-spacing:.14em}.venue-screen-roster h3,.venue-screen-bracket h3{font-size:clamp(1.5rem,2.5vw,2.6rem);margin:0 0 14px}.venue-screen-roster ol,.venue-screen-leader-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.venue-screen-roster li,.venue-screen-leader-list li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 16px;border-radius:14px;background:rgba(15,23,42,.88);border:1px solid rgba(255,255,255,.12);font-size:clamp(1rem,1.4vw,1.55rem)}.venue-screen-roster li b,.venue-screen-leader-list li b{color:var(--venue-primary)}.venue-screen-roster li em,.venue-screen-leader-list li em{font-style:normal;font-weight:800}.venue-screen-qualifying{display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center}.venue-screen-qualifying h2,.venue-screen-ready h2,.venue-screen-live-head h2{font-size:clamp(2.4rem,5vw,5.5rem);margin:.2rem 0 1rem}.venue-screen-qualifying aside{text-align:center}.venue-screen-qualifying aside>strong{display:block;font-size:clamp(4rem,9vw,9rem);line-height:1;color:var(--venue-primary)}.venue-screen-qualifying aside>span{text-transform:uppercase;letter-spacing:.14em}.venue-screen-live-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.venue-screen-countdown{text-align:right}.venue-screen-countdown span{display:block;color:#cbd5e1;text-transform:uppercase;letter-spacing:.12em}.venue-screen-countdown strong{font-size:clamp(3rem,7vw,7rem);line-height:.9;color:var(--venue-primary);font-variant-numeric:tabular-nums}.venue-screen-match-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.venue-screen-match{position:relative;padding:14px;border-radius:18px;background:rgba(8,14,28,.9);border:1px solid rgba(255,255,255,.14)}.venue-screen-match.is-active{border-color:var(--venue-primary);box-shadow:0 0 28px color-mix(in srgb,var(--venue-primary) 20%,transparent)}.venue-screen-match header{display:flex;justify-content:space-between;color:#94a3b8;text-transform:uppercase;font-size:.82rem;letter-spacing:.1em}.venue-screen-match header b{color:var(--venue-primary)}.venue-screen-player{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05)}.venue-screen-player span{font-weight:900;font-size:clamp(1.05rem,1.5vw,1.45rem)}.venue-screen-player strong{font-size:clamp(1.5rem,2.4vw,2.5rem)}.venue-screen-player small{color:#94a3b8}.venue-screen-player.is-winner{background:color-mix(in srgb,var(--venue-primary) 24%,rgba(255,255,255,.05));outline:1px solid var(--venue-primary)}.venue-screen-match>i{display:block;text-align:center;font-style:normal;font-size:.72rem;color:#64748b;margin:-2px 0}.venue-screen-ready{text-align:center}.venue-screen-ready>span,.venue-screen-champion>span{text-transform:uppercase;letter-spacing:.16em;color:var(--venue-primary);font-weight:900}.venue-screen-ready p{font-size:clamp(1.2rem,2vw,2rem)}.venue-screen-bracket{display:flex;gap:18px;overflow:hidden}.venue-screen-bracket>section{min-width:min(36vw,520px);flex:1}.venue-screen-champion{text-align:center;padding:30px}.venue-screen-champion h2{font-size:clamp(5rem,13vw,13rem);line-height:.9;margin:.3rem 0;color:var(--venue-primary);text-shadow:0 0 50px color-mix(in srgb,var(--venue-primary) 45%,transparent)}.venue-screen-champion>strong{font-size:clamp(1.5rem,3vw,3rem)}.venue-screen-confetti{font-size:clamp(2rem,5vw,5rem);color:var(--venue-secondary);letter-spacing:.3em;margin-top:18px}.venue-screen footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}.venue-screen-activity{display:flex;gap:12px;min-width:0;overflow:hidden}.venue-screen-activity span{white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.08);color:#cbd5e1}.venue-screen footer>strong{white-space:nowrap;color:var(--venue-primary)}.venue-screen-error{display:grid;place-content:center;min-height:100vh;text-align:center}
@media(max-width:900px){.venue-screen-fullscreen-toggle b{display:none}.venue-screen-fullscreen-toggle{width:40px;padding:8px}.venue-event-hero{grid-template-columns:1fr}.venue-screen{padding:18px}.venue-screen-checkin{grid-template-columns:1fr}.venue-screen-roster{display:none}.venue-screen-brand h1{font-size:2rem}.venue-screen-status{min-width:190px}.venue-screen-clock strong{font-size:2rem}.venue-screen-clock small{font-size:.68rem}.venue-screen-status-row{gap:8px}.venue-screen-status-row span{font-size:.72rem}.venue-screen-status-row b{font-size:1.65rem}.venue-screen-match-grid{grid-template-columns:1fr 1fr}.venue-screen footer{display:none}}

.venue-screen-match-grid.is-spotlight{grid-template-columns:minmax(520px,980px);justify-content:center}.venue-screen-match-grid.is-spotlight .venue-screen-match{padding:clamp(22px,3vw,42px);border-width:2px;box-shadow:0 30px 90px rgba(0,0,0,.42),0 0 50px color-mix(in srgb,var(--venue-primary) 22%,transparent)}.venue-screen-match-grid.is-spotlight .venue-screen-player{padding:clamp(16px,2vw,28px)}.venue-screen-match-grid.is-spotlight .venue-screen-player span{font-size:clamp(1.8rem,3.5vw,4rem)}.venue-screen-match-grid.is-spotlight .venue-screen-player strong{font-size:clamp(3rem,6vw,7rem);color:var(--venue-primary)}.venue-screen-match-grid.is-spotlight .venue-screen-match>i{font-size:1.1rem;margin:4px 0}
@media(max-width:900px){.venue-screen-match-grid.is-spotlight{grid-template-columns:1fr}.venue-screen-match-grid.is-spotlight .venue-screen-player span{font-size:1.25rem}.venue-screen-match-grid.is-spotlight .venue-screen-player strong{font-size:2.1rem}}

/* Venue-only home entry */
.venue-only-home{max-width:900px;margin-inline:auto;text-align:center}
.venue-only-home .eyebrow{display:block;margin-bottom:.65rem}
.venue-code-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.85rem;align-items:end;max-width:680px;margin:1.5rem auto 0;text-align:left}
.venue-code-form label{margin:0}
.venue-code-form input{text-transform:uppercase;letter-spacing:.12em;font-weight:900;font-size:1.05rem}
.venue-code-form .btn{min-height:48px;white-space:nowrap}
@media(max-width:640px){.venue-code-form{grid-template-columns:1fr}.venue-code-form .btn{width:100%}}

/* Venue winner and runner-up rewards v5 */
.venue-screen-runner-up{display:grid;gap:5px;margin:20px auto 0;padding:14px 24px;max-width:560px;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(15,23,42,.72)}
.venue-screen-runner-up span{font-size:clamp(.9rem,1.4vw,1.2rem);letter-spacing:.12em;text-transform:uppercase;color:#cbd5e1}
.venue-screen-runner-up b{font-size:clamp(1.5rem,2.5vw,2.6rem)}
.venue-screen-runner-up em{font-style:normal;color:var(--venue-primary);font-weight:900}

/* Venue live-screen presentation upgrade v7 */
.venue-screen-atmosphere{
  position:fixed;
  inset:0;
  z-index:3;
  overflow:hidden;
  pointer-events:none;
  perspective:1000px;
}
.venue-screen-atmosphere::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(180deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 5px),
    linear-gradient(90deg,transparent 0,rgba(255,255,255,.025) 50%,transparent 100%);
  mix-blend-mode:screen;
  opacity:.5;
}
.venue-screen-atmosphere::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:conic-gradient(from 25deg at 50% 50%,transparent 0 17%,color-mix(in srgb,var(--venue-primary) 9%,transparent) 23%,transparent 29% 62%,color-mix(in srgb,var(--venue-secondary) 8%,transparent) 68%,transparent 74%);
  animation:venueScreenAmbientSpin 34s linear infinite;
  opacity:.8;
}
.venue-screen-beam{
  position:absolute;
  top:-28vh;
  width:32vw;
  height:150vh;
  border-radius:50%;
  transform-origin:50% 0;
  filter:blur(24px);
  opacity:.13;
  mix-blend-mode:screen;
}
.venue-screen-beam-a{
  left:4vw;
  background:linear-gradient(180deg,color-mix(in srgb,var(--venue-primary) 76%,white),transparent 74%);
  transform:rotate(-19deg);
  animation:venueScreenBeamA 12s ease-in-out infinite alternate;
}
.venue-screen-beam-b{
  right:4vw;
  background:linear-gradient(180deg,color-mix(in srgb,var(--venue-secondary) 76%,white),transparent 74%);
  transform:rotate(19deg);
  animation:venueScreenBeamB 14s ease-in-out infinite alternate;
}
.venue-screen-orbit{
  position:absolute;
  width:min(64vw,1050px);
  aspect-ratio:1;
  border:1px solid color-mix(in srgb,var(--venue-primary) 28%,transparent);
  border-radius:50%;
  box-shadow:0 0 80px color-mix(in srgb,var(--venue-primary) 8%,transparent),inset 0 0 80px color-mix(in srgb,var(--venue-secondary) 6%,transparent);
  opacity:.42;
}
.venue-screen-orbit::before,.venue-screen-orbit::after{
  content:"";
  position:absolute;
  inset:9%;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:inherit;
}
.venue-screen-orbit::after{inset:22%;border-style:solid;border-color:color-mix(in srgb,var(--venue-secondary) 18%,transparent)}
.venue-screen-orbit-a{left:-28vw;bottom:-52vh;animation:venueScreenOrbit 28s linear infinite}
.venue-screen-orbit-b{right:-32vw;top:-52vh;animation:venueScreenOrbitReverse 36s linear infinite}
.venue-screen-spark{
  --spark-size:6px;
  position:absolute;
  width:var(--spark-size);
  height:var(--spark-size);
  border-radius:50%;
  background:var(--venue-primary);
  box-shadow:0 0 18px 5px color-mix(in srgb,var(--venue-primary) 55%,transparent);
  opacity:.3;
  animation:venueScreenSpark 7s ease-in-out infinite;
}
.venue-screen-spark-1{left:8%;top:21%;animation-delay:-1s}
.venue-screen-spark-2{left:18%;top:76%;--spark-size:4px;animation-delay:-5.2s}
.venue-screen-spark-3{left:37%;top:13%;--spark-size:5px;animation-delay:-3.8s}
.venue-screen-spark-4{left:48%;top:84%;--spark-size:7px;animation-delay:-2.4s}
.venue-screen-spark-5{left:64%;top:24%;--spark-size:4px;animation-delay:-6.1s}
.venue-screen-spark-6{left:78%;top:73%;--spark-size:6px;animation-delay:-.8s}
.venue-screen-spark-7{left:91%;top:17%;--spark-size:5px;animation-delay:-4.6s}
.venue-screen-spark-8{left:87%;top:51%;--spark-size:3px;animation-delay:-2.9s}
.venue-screen{
  z-index:3;
  isolation:isolate;
}
.venue-screen::before{
  content:"";
  position:absolute;
  inset:clamp(10px,1.2vw,22px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:clamp(20px,2vw,34px);
  pointer-events:none;
  z-index:-1;
  box-shadow:inset 0 0 80px rgba(0,0,0,.18);
}
.venue-screen-header{
  position:relative;
  padding:clamp(12px,1.3vw,22px) clamp(16px,1.7vw,30px) clamp(16px,1.7vw,26px);
  border:1px solid rgba(255,255,255,.16);
  border-radius:clamp(20px,2vw,32px);
  background:linear-gradient(135deg,rgba(8,14,30,.86),rgba(8,14,30,.56));
  -webkit-backdrop-filter:blur(18px) saturate(135%);
  backdrop-filter:blur(18px) saturate(135%);
  box-shadow:0 24px 70px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.1);
  overflow:hidden;
}
.venue-screen-header::before{
  content:"";
  position:absolute;
  left:4%;
  right:4%;
  top:0;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--venue-primary),var(--venue-secondary),transparent);
  opacity:.85;
}
.venue-screen-brand{gap:clamp(20px,2.2vw,38px);min-width:0}
.venue-screen-logo-frame{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:clamp(118px,10vw,190px);
  height:clamp(104px,8.7vw,164px);
  padding:clamp(8px,.8vw,14px);
  border-radius:clamp(20px,2vw,32px);
  background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 14px 38px rgba(0,0,0,.3),0 0 34px color-mix(in srgb,var(--venue-primary) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.18);
  overflow:hidden;
}
.venue-screen-logo-frame::before{
  content:"";
  position:absolute;
  inset:-55%;
  background:conic-gradient(transparent 0 32%,color-mix(in srgb,var(--venue-primary) 55%,white) 39%,transparent 46% 78%,color-mix(in srgb,var(--venue-secondary) 45%,white) 84%,transparent 91%);
  animation:venueScreenLogoSheen 9s linear infinite;
  opacity:.36;
}
.venue-screen-logo-frame::after{
  content:"";
  position:absolute;
  inset:2px;
  border-radius:inherit;
  background:rgba(5,9,20,.72);
  z-index:0;
}
.venue-screen-brand img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.45));
  animation:venueScreenLogoFloat 5s ease-in-out infinite;
}
.venue-screen-logo-fallback{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  color:var(--venue-primary);
  font-size:clamp(3rem,5vw,6rem);
  text-shadow:0 0 24px color-mix(in srgb,var(--venue-primary) 65%,transparent);
}
.venue-screen-brand-copy{min-width:0}
.venue-screen-brand-copy>span{display:flex;align-items:center;gap:10px}
.venue-screen-brand-copy>span::before{
  content:"";
  width:30px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--venue-primary),var(--venue-secondary));
  box-shadow:0 0 12px color-mix(in srgb,var(--venue-primary) 60%,transparent);
}
.venue-screen-brand h1{
  text-wrap:balance;
  text-shadow:0 4px 22px rgba(0,0,0,.5);
}
.venue-screen-status{
  min-width:clamp(180px,17vw,300px);
  padding:14px 18px;
  border-radius:20px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.11);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.venue-screen-status span{display:flex;justify-content:flex-end;align-items:center;gap:10px}
.venue-screen-status span i,.venue-screen-match header b i{
  display:inline-block;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--venue-primary);
  box-shadow:0 0 14px color-mix(in srgb,var(--venue-primary) 80%,transparent);
}
.venue-screen-status strong{display:block;line-height:.95;text-shadow:0 0 26px color-mix(in srgb,var(--venue-primary) 35%,transparent)}
.venue-screen-status strong small{font-size:.42em;color:#dbe4f0;font-weight:800}
.venue-screen main{position:relative}
.venue-screen-callout{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(6,11,25,.94),rgba(14,23,42,.77));
  border-color:color-mix(in srgb,var(--venue-primary) 74%,white);
  box-shadow:0 32px 90px rgba(0,0,0,.5),0 0 54px color-mix(in srgb,var(--venue-primary) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.12);
}
.venue-screen-callout::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:conic-gradient(from 0deg,transparent 0 27%,color-mix(in srgb,var(--venue-primary) 30%,transparent) 33%,transparent 39% 72%,color-mix(in srgb,var(--venue-secondary) 24%,transparent) 78%,transparent 84%);
  animation:venueScreenAmbientSpin 18s linear infinite;
  pointer-events:none;
}
.venue-screen-callout>*{position:relative;z-index:1}
.venue-screen-qr{
  position:relative;
  border:8px solid rgba(255,255,255,.92);
  box-shadow:0 18px 50px rgba(0,0,0,.38),0 0 34px color-mix(in srgb,var(--venue-primary) 28%,transparent);
  animation:venueScreenQrPulse 3.5s ease-in-out infinite;
}
.venue-screen-code{
  padding:10px 18px;
  border-radius:999px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--venue-primary) 22%,transparent),color-mix(in srgb,var(--venue-secondary) 18%,transparent));
  border:1px solid color-mix(in srgb,var(--venue-primary) 45%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}
.venue-screen-roster li,.venue-screen-leader-list li{
  position:relative;
  overflow:hidden;
  background:linear-gradient(100deg,rgba(12,20,39,.92),rgba(17,28,51,.78));
  box-shadow:0 10px 24px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.06);
  animation:venueScreenListIn .45s cubic-bezier(.2,.7,.2,1) both;
}
.venue-screen-roster li::before,.venue-screen-leader-list li::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,var(--venue-primary),var(--venue-secondary));
}
.venue-screen-roster li:nth-child(2n),.venue-screen-leader-list li:nth-child(2n){animation-delay:.06s}
.venue-screen-roster li:nth-child(3n),.venue-screen-leader-list li:nth-child(3n){animation-delay:.12s}
.venue-screen-live-head{
  padding:10px 20px 18px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.venue-screen-countdown{
  min-width:clamp(190px,18vw,330px);
  padding:12px 18px;
  border-radius:20px;
  background:rgba(7,13,27,.72);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.22);
}
.venue-screen-countdown.is-urgent{
  border-color:#ff506b;
  box-shadow:0 0 34px rgba(255,80,107,.25),inset 0 1px 0 rgba(255,255,255,.1);
  animation:venueScreenUrgent 1s ease-in-out infinite;
}
.venue-screen-countdown.is-urgent strong{color:#ff6d83;text-shadow:0 0 28px rgba(255,80,107,.55)}
.venue-screen-match-grid{gap:clamp(14px,1.4vw,24px)}
.venue-screen-match{
  overflow:hidden;
  border-radius:24px;
  background:linear-gradient(145deg,rgba(8,14,28,.96),rgba(14,24,45,.83));
  box-shadow:0 18px 42px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.07);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.venue-screen-match::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:linear-gradient(90deg,transparent,var(--venue-secondary),var(--venue-primary),transparent);
  opacity:.55;
}
.venue-screen-match::after{
  content:"";
  position:absolute;
  width:55%;
  height:180%;
  left:-75%;
  top:-45%;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.075),transparent);
  pointer-events:none;
}
.venue-screen-match.is-active{
  transform:translateY(-3px);
  box-shadow:0 22px 54px rgba(0,0,0,.38),0 0 42px color-mix(in srgb,var(--venue-primary) 24%,transparent),inset 0 1px 0 rgba(255,255,255,.1);
}
.venue-screen-match.is-active::after{animation:venueScreenCardSweep 3.6s ease-in-out infinite}
.venue-screen-match.is-active header b i{animation:venueScreenLiveDot 1.2s ease-in-out infinite}
.venue-screen-match header b{display:flex;align-items:center;gap:8px}
.venue-screen-player{
  position:relative;
  border:1px solid rgba(255,255,255,.065);
  background:linear-gradient(90deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.venue-screen-player.is-winner{
  background:linear-gradient(90deg,color-mix(in srgb,var(--venue-primary) 29%,rgba(255,255,255,.06)),color-mix(in srgb,var(--venue-secondary) 12%,rgba(255,255,255,.03)));
  box-shadow:0 0 25px color-mix(in srgb,var(--venue-primary) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.14);
}
.venue-screen-versus{
  position:relative;
  z-index:2;
  width:38px;
  height:38px;
  display:grid!important;
  place-items:center;
  margin:-5px auto!important;
  border-radius:50%;
  color:#fff!important;
  background:linear-gradient(145deg,var(--venue-secondary),var(--venue-primary));
  box-shadow:0 6px 18px rgba(0,0,0,.34),0 0 18px color-mix(in srgb,var(--venue-primary) 28%,transparent);
  font-weight:950;
  letter-spacing:.03em;
}
.venue-screen-ready{
  position:relative;
  max-width:1100px;
  margin-inline:auto;
  padding:clamp(28px,4vw,64px);
  border-radius:34px;
  background:linear-gradient(145deg,rgba(8,14,29,.76),rgba(13,23,43,.5));
  border:1px solid rgba(255,255,255,.13);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 30px 85px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.08);
}
.venue-screen-ready h2{text-shadow:0 8px 30px rgba(0,0,0,.48)}
.venue-screen-bracket>section{
  padding:16px;
  border-radius:24px;
  background:rgba(8,14,28,.54);
  border:1px solid rgba(255,255,255,.09);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.venue-screen-champion{
  position:relative;
  max-width:1200px;
  margin-inline:auto;
  padding:clamp(34px,4vw,72px);
  border-radius:44px;
  background:radial-gradient(circle at 50% 15%,color-mix(in srgb,var(--venue-primary) 22%,transparent),transparent 42%),linear-gradient(145deg,rgba(6,11,24,.91),rgba(14,23,42,.75));
  border:1px solid color-mix(in srgb,var(--venue-primary) 45%,rgba(255,255,255,.16));
  box-shadow:0 40px 110px rgba(0,0,0,.45),0 0 90px color-mix(in srgb,var(--venue-primary) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.12);
  overflow:hidden;
}
.venue-screen-champion::before,.venue-screen-champion::after{
  content:"";
  position:absolute;
  width:34%;
  height:130%;
  top:-15%;
  background:linear-gradient(180deg,color-mix(in srgb,var(--venue-primary) 24%,transparent),transparent 75%);
  filter:blur(18px);
  opacity:.65;
}
.venue-screen-champion::before{left:-12%;transform:rotate(-18deg)}
.venue-screen-champion::after{right:-12%;transform:rotate(18deg);background:linear-gradient(180deg,color-mix(in srgb,var(--venue-secondary) 24%,transparent),transparent 75%)}
.venue-screen-champion>*{position:relative;z-index:2}
.venue-screen-champion-halo{
  position:relative;
  width:clamp(110px,9vw,170px);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--venue-primary) 32%,transparent),transparent 68%);
  filter:drop-shadow(0 0 24px color-mix(in srgb,var(--venue-primary) 35%,transparent));
}
.venue-screen-champion-halo i{
  position:absolute;
  inset:7%;
  border:2px dashed color-mix(in srgb,var(--venue-primary) 56%,white);
  border-radius:50%;
  animation:venueScreenOrbit 12s linear infinite;
}
.venue-screen-champion-halo b{
  font-size:clamp(4rem,6vw,7rem);
  line-height:1;
  color:var(--venue-primary);
  text-shadow:0 0 34px color-mix(in srgb,var(--venue-primary) 65%,transparent);
  animation:venueScreenCrown 2.8s ease-in-out infinite;
}
.venue-screen-champion h2{
  background:linear-gradient(180deg,#fff 5%,color-mix(in srgb,var(--venue-primary) 68%,white) 55%,var(--venue-primary) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 12px 24px rgba(0,0,0,.32));
}
.venue-screen-winner-reward{
  display:inline-block;
  padding:12px 24px;
  border-radius:999px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--venue-primary) 22%,transparent),color-mix(in srgb,var(--venue-secondary) 20%,transparent));
  border:1px solid color-mix(in srgb,var(--venue-primary) 42%,transparent);
}
.venue-screen-confetti{display:flex;justify-content:center;gap:clamp(18px,3vw,50px)}
.venue-screen-confetti i{font-style:normal;display:inline-block;animation:venueScreenConfetti 2.8s ease-in-out infinite}
.venue-screen-confetti i:nth-child(2){animation-delay:-.5s;color:var(--venue-primary)}
.venue-screen-confetti i:nth-child(3){animation-delay:-1s}
.venue-screen-confetti i:nth-child(4){animation-delay:-1.5s;color:var(--venue-primary)}
.venue-screen-confetti i:nth-child(5){animation-delay:-2s}
.venue-screen-runner-up{
  box-shadow:0 16px 38px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.09);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.venue-screen footer{
  padding:14px 18px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  background:rgba(5,10,22,.58);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  box-shadow:0 16px 34px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.06);
}
.venue-screen-activity span{
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
body[data-screen-state="live"] .venue-screen-beam{opacity:.22}
body[data-screen-state="live"] .venue-screen-spark{opacity:.5;animation-duration:4.5s}
body[data-screen-state="complete"] .venue-screen-atmosphere::after{opacity:1;animation-duration:14s}
body[data-screen-state="complete"] .venue-screen-beam{opacity:.32;filter:blur(18px)}
body[data-screen-state="complete"] .venue-screen-spark{
  opacity:.95;
  animation-name:venueScreenCelebrationSpark;
  animation-duration:3.5s;
  background:var(--venue-secondary);
}
body[data-screen-state="paused"] .venue-screen-atmosphere{filter:saturate(.55)}
body[data-screen-state="cancelled"] .venue-screen-atmosphere{filter:grayscale(.7)}
body.venue-screen-transition .venue-screen-header{animation:venueScreenHeaderIn .8s cubic-bezier(.16,.8,.22,1) both}
body.venue-screen-transition .venue-screen main{animation:venueScreenStateIn .9s cubic-bezier(.16,.8,.22,1) both}

@keyframes venueScreenAmbientSpin{to{transform:rotate(360deg)}}
@keyframes venueScreenBeamA{0%{transform:rotate(-24deg) translateX(-3vw)}100%{transform:rotate(-10deg) translateX(5vw)}}
@keyframes venueScreenBeamB{0%{transform:rotate(24deg) translateX(3vw)}100%{transform:rotate(10deg) translateX(-5vw)}}
@keyframes venueScreenOrbit{to{transform:rotate(360deg)}}
@keyframes venueScreenOrbitReverse{to{transform:rotate(-360deg)}}
@keyframes venueScreenSpark{0%,100%{transform:translate3d(0,0,0) scale(.65);opacity:.14}45%{transform:translate3d(12px,-28px,0) scale(1.25);opacity:.58}}
@keyframes venueScreenCelebrationSpark{0%{transform:translate3d(0,18vh,0) rotate(0deg) scale(.55);opacity:0}20%{opacity:1}100%{transform:translate3d(2vw,-34vh,0) rotate(240deg) scale(1.4);opacity:0}}
@keyframes venueScreenLogoSheen{to{transform:rotate(360deg)}}
@keyframes venueScreenLogoFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.018)}}
@keyframes venueScreenMainIn{from{opacity:.55;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes venueScreenHeaderIn{from{opacity:.2;transform:translateY(-18px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes venueScreenStateIn{from{opacity:0;transform:translateY(28px) scale(.975);filter:blur(6px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes venueScreenQrPulse{0%,100%{transform:scale(1);box-shadow:0 18px 50px rgba(0,0,0,.38),0 0 30px color-mix(in srgb,var(--venue-primary) 22%,transparent)}50%{transform:scale(1.012);box-shadow:0 20px 56px rgba(0,0,0,.42),0 0 46px color-mix(in srgb,var(--venue-primary) 40%,transparent)}}
@keyframes venueScreenListIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@keyframes venueScreenUrgent{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@keyframes venueScreenCardSweep{0%,30%{left:-75%}70%,100%{left:125%}}
@keyframes venueScreenLiveDot{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1.25)}}
@keyframes venueScreenCrown{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.08)}}
@keyframes venueScreenConfetti{0%,100%{transform:translateY(0) rotate(-8deg);opacity:.55}50%{transform:translateY(-13px) rotate(10deg);opacity:1}}

@media(max-width:1100px){
  .venue-screen-logo-frame{width:clamp(100px,12vw,145px);height:clamp(92px,10.5vw,132px)}
  .venue-screen-status{min-width:170px}
}
@media(max-width:900px){
  .venue-screen-header{padding:10px 12px 14px;border-radius:20px}
  .venue-screen-brand{gap:12px}
  .venue-screen-logo-frame{width:86px;height:78px;padding:7px;border-radius:16px}
  .venue-screen-brand-copy>span{font-size:.72rem}
  .venue-screen-brand-copy>span::before{width:16px}
  .venue-screen-status{min-width:118px;padding:10px 12px}
  .venue-screen-status span{font-size:.64rem}
  .venue-screen-status strong{font-size:2rem}
  .venue-screen::before{display:none}
  .venue-screen-beam{width:45vw}
}
@media(prefers-reduced-motion:reduce){
  .venue-screen-atmosphere::after,.venue-screen-beam,.venue-screen-orbit,.venue-screen-spark,.venue-screen-logo-frame::before,.venue-screen-brand img,.venue-screen-qr,.venue-screen-roster li,.venue-screen-leader-list li,.venue-screen-countdown.is-urgent,.venue-screen-match.is-active::after,.venue-screen-match.is-active header b i,.venue-screen-champion-halo i,.venue-screen-champion-halo b,.venue-screen-confetti i,.venue-screen-header,.venue-screen main{animation:none!important}
}

/* Asynchronous player tournament status v13 */
[data-venue-player-live] .venue-status-card .btn{margin-top:12px}
[data-venue-player-live][aria-busy="true"]{opacity:.9}

/* Pre-tournament venue practice v14 */
.venue-practice-ready-card{border-color:color-mix(in srgb,var(--primary) 52%,rgba(255,255,255,.12));background:linear-gradient(145deg,rgba(15,23,42,.96),color-mix(in srgb,var(--primary) 10%,rgba(15,23,42,.94)))}
.venue-practice-copy{max-width:680px;color:#dbe4f0}
.venue-practice-start-form{margin-top:14px}
.venue-practice-result{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:16px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--primary) 45%,transparent);border-radius:16px;background:rgba(255,255,255,.06)}
.venue-practice-result span{font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--primary)}
.venue-practice-result strong{font-size:1.35rem}
.venue-practice-result small{color:#aebdd0}
.venue-practice-hero{align-items:center}
@media(max-width:640px){.venue-practice-result{grid-template-columns:1fr}.venue-practice-hero>.btn{width:100%}}


/* Venue Live completed-throw spotlight v21 */
.venue-live-display-mode{display:block;margin-top:.45rem;color:#cbd5e1;font-size:clamp(.8rem,1vw,1.05rem);font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.venue-screen-live-stage{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);gap:clamp(16px,2vw,30px);min-height:0;align-items:stretch}
.venue-live-feature{position:relative;min-height:0;padding:clamp(16px,2vw,28px);border:2px solid color-mix(in srgb,var(--venue-primary) 72%,rgba(255,255,255,.2));border-radius:28px;background:linear-gradient(145deg,rgba(4,9,21,.94),rgba(12,20,39,.86));box-shadow:0 28px 90px rgba(0,0,0,.48),0 0 48px color-mix(in srgb,var(--venue-primary) 16%,transparent);overflow:hidden}
.venue-live-feature::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 38%,rgba(255,255,255,.05) 48%,transparent 58%);transform:translateX(-120%);animation:venueLiveFeatureSweep 8s ease-in-out infinite;pointer-events:none}
.venue-live-feature>header{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:14px}
.venue-live-feature>header h3{margin:.15rem 0 0;font-size:clamp(1.5rem,2.2vw,2.7rem)}
.venue-live-feature>header>b{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(239,68,68,.17);color:#fecaca;text-transform:uppercase;letter-spacing:.12em}
.venue-live-feature>header>b i{width:10px;height:10px;border-radius:50%;background:#ef4444;box-shadow:0 0 15px #ef4444;animation:venueScreenLivePulse 1.1s ease-in-out infinite}
.venue-live-feature-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(180px,.48fr) minmax(330px,1fr) minmax(190px,.5fr);gap:clamp(14px,1.8vw,26px);align-items:center;min-height:0}
.venue-live-feature-score{display:grid;gap:12px;align-content:center}
.venue-live-feature-score>em{font-style:normal;text-align:center;color:var(--venue-primary);font-size:1.1rem;font-weight:1000;letter-spacing:.2em}
.venue-live-feature-player{display:grid;grid-template-columns:1fr auto;gap:5px 12px;align-items:center;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.venue-live-feature-player span{font-size:clamp(1rem,1.45vw,1.55rem);font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.venue-live-feature-player strong{grid-row:1/3;grid-column:2;font-size:clamp(2.4rem,4vw,5rem);line-height:.9;color:var(--venue-primary);font-variant-numeric:tabular-nums}
.venue-live-feature-player small{color:#cbd5e1;font-weight:800}
.venue-live-feature-board{position:relative;width:min(49vh,100%);aspect-ratio:1;margin:auto;filter:drop-shadow(0 24px 34px rgba(0,0,0,.55))}
.venue-live-feature-board>img{display:block;width:100%;height:100%;object-fit:contain;border-radius:50%}
.venue-live-board-centre{position:absolute;left:50%;top:50%;width:9px;height:9px;border:2px solid rgba(255,255,255,.75);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 16px rgba(255,255,255,.8);pointer-events:none}
.venue-live-dart-marker{position:absolute;width:22px;height:22px;transform:translate(-50%,-50%);z-index:3;pointer-events:none}
.venue-live-dart-marker i{position:absolute;left:50%;top:50%;width:4px;height:38px;border-radius:4px;background:linear-gradient(#f8fafc,#64748b 70%,#111827);transform:translate(-50%,-6%) rotate(32deg);transform-origin:50% 0;box-shadow:2px 4px 7px rgba(0,0,0,.55)}
.venue-live-dart-marker b{position:absolute;left:50%;top:50%;display:grid;place-items:center;min-width:22px;height:22px;padding:0 4px;border-radius:999px;transform:translate(-50%,-50%);background:#111827;border:2px solid #fff;color:#fff;font-size:.7rem;box-shadow:0 0 0 3px rgba(0,0,0,.28)}
.venue-live-dart-marker.is-latest b{background:var(--venue-primary);color:#111827;box-shadow:0 0 0 4px rgba(255,255,255,.25),0 0 24px var(--venue-primary)}
.venue-live-dart-marker.is-new{animation:venueLiveDartImpact .75s cubic-bezier(.2,.8,.2,1)}
.venue-live-feature aside{align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-width:0}
.venue-live-feature aside h4{margin:0 0 10px;color:#cbd5e1;text-transform:uppercase;letter-spacing:.12em;font-size:.9rem}
.venue-live-feature aside ol{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.venue-live-feature aside li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.venue-live-feature aside li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800}
.venue-live-feature aside li b{color:var(--venue-primary)}
.venue-live-feature aside li strong{font-size:1.2rem}
.venue-live-feature aside li.is-empty{display:block;color:#94a3b8}
.venue-live-feature aside p{margin:14px 0 0;color:#cbd5e1;line-height:1.45}
.venue-live-match-overview{min-height:0;overflow:hidden;padding:14px;border-radius:24px;background:rgba(4,9,21,.76);border:1px solid rgba(255,255,255,.12)}
.venue-live-match-overview>h3{margin:0 0 10px;font-size:1.15rem;color:#cbd5e1;text-transform:uppercase;letter-spacing:.1em}
.venue-live-match-overview .venue-screen-match-grid{grid-template-columns:1fr;gap:8px;max-height:56vh;overflow:auto;padding-right:4px}
.venue-live-match-overview .venue-screen-match{padding:10px;border-radius:14px}
.venue-live-match-overview .venue-screen-player{padding:7px 9px;margin-top:6px}
.venue-live-match-overview .venue-screen-player span{font-size:1rem}
.venue-live-match-overview .venue-screen-player strong{font-size:1.35rem}
@keyframes venueLiveDartImpact{0%{opacity:0;transform:translate(-50%,-50%) scale(3.4) rotate(-12deg);filter:blur(3px)}55%{opacity:1;transform:translate(-50%,-50%) scale(.82) rotate(3deg)}100%{transform:translate(-50%,-50%) scale(1) rotate(0)}}
@keyframes venueLiveFeatureSweep{0%,60%{transform:translateX(-120%)}78%,100%{transform:translateX(120%)}}
@media(max-width:1180px){.venue-screen-live-stage{grid-template-columns:1fr}.venue-live-match-overview{display:none}.venue-live-feature-grid{grid-template-columns:minmax(160px,.48fr) minmax(300px,1fr) minmax(170px,.5fr)}}
@media(max-width:820px){.venue-live-feature-grid{grid-template-columns:1fr}.venue-live-feature-score{grid-template-columns:1fr auto 1fr;align-items:center}.venue-live-feature-score>em{font-size:.8rem}.venue-live-feature-board{width:min(42vh,88vw)}.venue-live-feature aside{display:none}}
@media(prefers-reduced-motion:reduce){.venue-live-feature::before,.venue-live-dart-marker.is-new,.venue-live-feature>header>b i{animation:none!important}}