/* /darts/pub-league.css
   Sky-style broadcast-inspired darts skin.
   No Sky logos/branding used. Palette: midnight navy, electric blue, sports red, warm amber. */

:root{
  color-scheme:dark;

  /* Broadcast palette */
  --sky-bg:#020712;
  --sky-bg-2:#06152b;
  --sky-panel:#071426;
  --sky-panel-2:#0b1f3a;
  --sky-border:rgba(84,180,255,.35);
  --sky-blue:#00a3ff;
  --sky-blue-2:#0066ff;
  --sky-cyan:#7dd3fc;
  --sky-red:#e30613;
  --sky-red-2:#ff2f4b;
  --sky-amber:#ffb000;
  --sky-orange:#ff6a00;
  --sky-white:#f8fafc;
  --sky-muted:#a7b4c8;
  --sky-black:#010409;

  /* Existing app variables used by the display */
  --home:#00a3ff;
  --away:#e30613;
  --gold:#ffb000;
  --bg:var(--sky-bg);
  --panel:var(--sky-panel);
  --muted:var(--sky-muted);
  --text:var(--sky-white);
}

*{box-sizing:border-box}

html,body{min-height:100%;}

body{
  margin:0;
  background:#000;
  color:var(--text);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* =========================
   Broadcast display shell
   ========================= */
.stage{
  min-height:100vh;
  height:100vh;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  position:relative;
  background:
    radial-gradient(circle at 50% -18%,rgba(0,163,255,.28),transparent 34%),
    radial-gradient(circle at 90% 20%,rgba(227,6,19,.20),transparent 32%),
    linear-gradient(180deg,#030b18 0%,#020712 48%,#000 100%);
}

.stage:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,163,255,.18),transparent 26%,transparent 74%,rgba(227,6,19,.18)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 5px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 36px);
  mix-blend-mode:screen;
  opacity:.72;
}

.stage:after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:conic-gradient(from 180deg at 50% 50%,transparent,rgba(0,163,255,.12),transparent,rgba(227,6,19,.10),transparent);
  filter:blur(50px);
  opacity:.55;
  animation:broadcastGlow 8s ease-in-out infinite alternate;
}

@keyframes broadcastGlow{
  from{transform:rotate(-2deg) scale(1)}
  to{transform:rotate(2deg) scale(1.04)}
}

.topbar,.scoreboard,.main,.ticker{position:relative;z-index:1;}

/* =========================
   Top bar
   ========================= */
.topbar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:18px;
  padding:16px 28px 10px;
  background:linear-gradient(180deg,rgba(1,4,9,.76),rgba(1,4,9,0));
}

.brand{
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#eaf6ff;
  font-weight:900;
  text-shadow:0 0 16px rgba(0,163,255,.42);
}

.links,
.links a{
  color:#b8c7db;
  font-size:12px;
}

.links a{text-decoration:none}
.links a:hover{text-decoration:underline;color:#fff}

.live{
  justify-self:center;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(125,211,252,.72);
  color:#fff;
  border-radius:999px;
  padding:7px 17px;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.16em;
  text-transform:uppercase;
  background:linear-gradient(90deg,var(--sky-blue-2),var(--sky-blue),var(--sky-red));
  box-shadow:0 0 25px rgba(0,163,255,.42),0 0 36px rgba(227,6,19,.22);
}

.live:before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-120%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  animation:shine 2.8s linear infinite;
}

@keyframes shine{to{transform:translateX(120%)}}

.venue{
  text-align:right;
  color:#eaf6ff;
  font-weight:800;
  letter-spacing:.04em;
}

/* =========================
   Team score header
   ========================= */
.scoreboard{
  margin:0 28px 16px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid var(--sky-border);
  box-shadow:
    0 30px 100px rgba(0,0,0,.86),
    0 0 0 1px rgba(255,255,255,.05) inset,
    0 0 40px rgba(0,163,255,.16);
}

.teams{
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px minmax(0,1fr);
  align-items:stretch;
  background:linear-gradient(180deg,rgba(10,31,58,.94),rgba(2,7,18,.95));
}

.team{
  position:relative;
  overflow:hidden;
  min-height:152px;
  padding:24px 28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.team:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(120deg,var(--c),transparent 48%),
    radial-gradient(circle at 14% 50%,rgba(255,255,255,.16),transparent 24%);
  opacity:.34;
}

.team.away:before{
  background:
    linear-gradient(240deg,var(--c),transparent 48%),
    radial-gradient(circle at 86% 50%,rgba(255,255,255,.16),transparent 24%);
}

.team:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 38%,rgba(0,0,0,.24));
  pointer-events:none;
}

.team>*{position:relative;z-index:1}

.team-label{
  color:#d9ecff;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-size:11px;
  margin-bottom:8px;
  font-weight:1000;
}

.team-name{
  font-size:clamp(34px,5.3vw,78px);
  line-height:.84;
  font-weight:1000;
  letter-spacing:-.075em;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 5px 26px rgba(0,0,0,.78),0 0 26px color-mix(in srgb,var(--c),transparent 35%);
}

.team.away{text-align:right}

.team-score{
  position:relative;
  display:grid;
  place-items:center;
  min-width:270px;
  color:#fff;
  background:
    linear-gradient(90deg,var(--sky-blue-2),#0f3f87 34%,#481026 66%,var(--sky-red)),
    linear-gradient(180deg,rgba(255,255,255,.26),transparent);
  box-shadow:
    inset 18px 0 32px rgba(0,0,0,.28),
    inset -18px 0 32px rgba(0,0,0,.28),
    inset 0 0 60px rgba(255,255,255,.12);
}

.team-score:before,
.team-score:after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,transparent,#fff,transparent);
  opacity:.38;
}
.team-score:before{left:0}.team-score:after{right:0}

.team-score .score{
  font-size:clamp(56px,9vw,132px);
  font-weight:1000;
  letter-spacing:-.09em;
  line-height:.78;
  text-shadow:0 8px 30px rgba(0,0,0,.75);
}

.team-score .label{
  margin-top:8px;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#eaf6ff;
}

/* =========================
   Main panels
   ========================= */
.main{
  display:grid;
  grid-template-columns:1.18fr .82fr;
  gap:18px;
  margin:0 28px 18px;
  min-height:0;
}

.match-card,.order-card{
  min-height:0;
  overflow:hidden;
  border-radius:24px;
  border:1px solid var(--sky-border);
  background:
    linear-gradient(180deg,rgba(7,20,38,.92),rgba(2,7,18,.94)),
    radial-gradient(circle at 30% 0,rgba(0,163,255,.14),transparent 35%);
  box-shadow:
    0 30px 90px rgba(0,0,0,.72),
    0 0 0 1px rgba(255,255,255,.04) inset;
}

.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 18px;
  border-bottom:1px solid rgba(125,211,252,.18);
  background:
    linear-gradient(90deg,rgba(0,102,255,.42),rgba(0,163,255,.18) 45%,rgba(227,6,19,.28)),
    linear-gradient(180deg,rgba(255,255,255,.08),transparent);
}

.section-title{
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#fff;
}

.pill{
  border:1px solid rgba(255,176,0,.75);
  color:#111827;
  background:linear-gradient(180deg,#ffd36a,var(--sky-amber));
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  text-transform:uppercase;
  font-weight:1000;
  box-shadow:0 0 22px rgba(255,176,0,.22);
}

.players{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:24px 24px 18px;
  gap:20px;
}

.player{text-align:left}.player.away{text-align:right}

.player-name{
  font-size:clamp(36px,5.2vw,84px);
  font-weight:1000;
  letter-spacing:-.065em;
  line-height:.88;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 6px 28px rgba(0,0,0,.82);
}

.remaining{
  font-size:clamp(76px,12vw,188px);
  font-weight:1000;
  letter-spacing:-.095em;
  line-height:.78;
}

.remaining.home{
  color:#d9f4ff;
  text-shadow:0 0 32px rgba(0,163,255,.65),0 8px 30px rgba(0,0,0,.72);
}

.remaining.away{
  color:#ffd9df;
  text-shadow:0 0 32px rgba(227,6,19,.62),0 8px 30px rgba(0,0,0,.72);
}

.vs{
  display:grid;
  place-items:center;
  width:92px;
  height:92px;
  border-radius:50%;
  color:#fff;
  font-weight:1000;
  background:
    radial-gradient(circle,#0b1f3a 0 52%,#010409 53%),
    linear-gradient(135deg,var(--sky-blue),var(--sky-red));
  border:2px solid var(--sky-amber);
  box-shadow:0 0 30px rgba(255,176,0,.36),0 0 44px rgba(0,163,255,.22);
}

.statline{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  padding:0 20px 20px;
}

.stat{
  border:1px solid rgba(125,211,252,.20);
  background:linear-gradient(180deg,rgba(11,31,58,.9),rgba(2,7,18,.92));
  border-radius:16px;
  padding:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.stat small{
  display:block;
  color:#9eb6d4;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:10px;
  font-weight:900;
}

.stat b{font-size:22px;color:#fff}

/* =========================
   Running order
   ========================= */
.order-list{
  padding:12px;
  overflow:auto;
  height:100%;
}

.row{
  display:grid;
  grid-template-columns:48px 1fr auto 1fr 82px;
  gap:10px;
  align-items:center;
  margin-bottom:8px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(125,211,252,.18);
  background:linear-gradient(180deg,rgba(11,31,58,.88),rgba(7,20,38,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.row.live-row{
  border-color:rgba(0,163,255,.75);
  box-shadow:0 0 26px rgba(0,163,255,.24),inset 0 0 24px rgba(0,163,255,.08);
}

.row.finished{
  opacity:.92;
  border-color:rgba(255,176,0,.32);
}

.num{
  color:#d9ecff;
  font-weight:1000;
  opacity:.8;
}

.name{
  font-weight:1000;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#fff;
}

.away-name{text-align:right}

.result{
  min-width:58px;
  text-align:center;
  border-radius:999px;
  padding:5px 8px;
  font-size:11px;
  font-weight:1000;
  letter-spacing:.08em;
  background:#010409;
  color:#d9ecff;
  border:1px solid rgba(125,211,252,.2);
}

.live-row .result{
  background:linear-gradient(90deg,var(--sky-blue-2),var(--sky-blue));
  color:#fff;
  border-color:rgba(255,255,255,.2);
}

.finished .result{
  background:linear-gradient(90deg,#7a1118,var(--sky-red));
  color:#fff;
}

.leg-score{
  text-align:center;
  border-radius:999px;
  padding:6px 8px;
  color:#fff;
  font-size:18px;
  font-weight:1000;
  letter-spacing:.04em;
  background:linear-gradient(180deg,#09192f,#010409);
  border:1px solid rgba(125,211,252,.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.live-row .leg-score{
  border-color:rgba(255,176,0,.78);
  color:#fff4cc;
  box-shadow:0 0 20px rgba(255,176,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
}

.finished .leg-score{
  border-color:rgba(227,6,19,.55);
  color:#ffd9df;
}

/* =========================
   Ticker / sponsor strip
   ========================= */
.ticker{
  height:60px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  background:
    linear-gradient(90deg,#010409,#071426 24%,#0b1f3a 50%,#071426 76%,#010409),
    linear-gradient(180deg,rgba(255,255,255,.08),transparent);
  border-top:1px solid rgba(125,211,252,.22);
  box-shadow:0 -16px 50px rgba(0,0,0,.72);
}

.sponsor{
  height:100%;
  display:grid;
  place-items:center;
  padding:0 24px;
  background:linear-gradient(90deg,var(--sky-amber),var(--sky-orange));
  color:#111827;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.06em;
  box-shadow:10px 0 28px rgba(255,106,0,.18);
}

.marquee{
  overflow:hidden;
  white-space:nowrap;
  color:#fff;
  font-weight:900;
  letter-spacing:.02em;
}

.marquee span{
  display:inline-block;
  padding-left:100%;
  animation:marq 28s linear infinite;
}

@keyframes marq{to{transform:translateX(-100%)}}

.qr{
  padding:0 20px;
  color:#b8c7db;
  font-size:12px;
  text-align:right;
}

.qr a{color:#7dd3fc;text-decoration:none}.qr a:hover{text-decoration:underline}

.loading{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at top,rgba(0,163,255,.18),#020712 46%,#000 100%);
  z-index:5;
  color:#d9ecff;
  font-weight:900;
  letter-spacing:.08em;
}

.fullscreen-btn{
  position:absolute;
  right:24px;
  bottom:78px;
  z-index:4;
  opacity:0;
  transform:translateY(8px);
  transition:.18s ease;
  border:1px solid rgba(125,211,252,.55);
  border-radius:999px;
  background:rgba(1,4,9,.72);
  color:#fff;
  padding:9px 14px;
  font-weight:900;
  cursor:pointer;
}

.stage:hover .fullscreen-btn{opacity:1;transform:translateY(0)}

/* =========================
   Setup / shared form styles
   ========================= */
.league-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at 20% -10%,rgba(0,163,255,.24),transparent 36%),
    radial-gradient(circle at 88% 10%,rgba(227,6,19,.18),transparent 36%),
    linear-gradient(180deg,#030b18,#020712 55%,#000);
  color:var(--sky-white);
}

.broadcast-card{
  border:1px solid var(--sky-border);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(7,20,38,.92),rgba(2,7,18,.95));
  box-shadow:0 30px 90px rgba(0,0,0,.62);
}

.btn-broadcast,
button.btn-broadcast{
  border:0;
  border-radius:999px;
  padding:11px 18px;
  font-weight:1000;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:#fff;
  background:linear-gradient(90deg,var(--sky-blue-2),var(--sky-blue));
  box-shadow:0 0 26px rgba(0,163,255,.28);
  cursor:pointer;
}

.btn-broadcast.alt,
button.btn-broadcast.alt{
  color:#111827;
  background:linear-gradient(90deg,var(--sky-amber),var(--sky-orange));
  box-shadow:0 0 26px rgba(255,176,0,.22);
}

input,textarea,select{
  background:#020712;
  color:#fff;
  border:1px solid rgba(125,211,252,.26);
  border-radius:12px;
}

input:focus,textarea:focus,select:focus{
  outline:0;
  border-color:var(--sky-blue);
  box-shadow:0 0 0 2px rgba(0,163,255,.22);
}

/* =========================
   Mobile / small screen
   ========================= */
@media(max-width:900px){
  body{overflow:auto}
  .stage{height:auto;min-height:100vh;grid-template-rows:auto auto auto auto}
  .topbar,.teams,.main{grid-template-columns:1fr}
  .topbar{padding:14px 16px}.venue{text-align:left}
  .scoreboard,.main{margin-left:14px;margin-right:14px}
  .team{min-height:110px}.team.away{text-align:left}
  .team.away:before{background:linear-gradient(120deg,var(--c),transparent 48%)}
  .team-score{min-width:0;padding:18px}
  .players{grid-template-columns:1fr;gap:12px}.player.away{text-align:left}
  .vs{width:64px;height:64px}
  .statline{grid-template-columns:1fr 1fr}
  .row{grid-template-columns:34px 1fr 58px 1fr 72px;gap:7px;padding:9px}
  .away-name{text-align:right}
  .ticker{grid-template-columns:1fr;height:auto}.sponsor,.qr{padding:12px}.qr{text-align:left}
}

@media(max-width:560px){
  .row{grid-template-columns:30px 1fr 56px;}
  .away-name{grid-column:2;text-align:left}
  .leg-score{grid-column:3;grid-row:1 / span 2}
}


/* ===== Compatibility + shared page skin additions ===== */
.broadcast-stage{
  min-height:100vh;
  height:100vh;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  position:relative;
  background:
    radial-gradient(circle at 50% -18%,rgba(0,163,255,.28),transparent 34%),
    radial-gradient(circle at 90% 20%,rgba(227,6,19,.20),transparent 32%),
    linear-gradient(180deg,#030b18 0%,#020712 48%,#000 100%);
}
.broadcast-stage:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,163,255,.18),transparent 26%,transparent 74%,rgba(227,6,19,.18)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 5px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 36px);
  mix-blend-mode:screen;
  opacity:.72;
}
.broadcast-stage:after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:conic-gradient(from 180deg at 50% 50%,transparent,rgba(0,163,255,.12),transparent,rgba(227,6,19,.10),transparent);
  filter:blur(50px);
  opacity:.55;
  animation:broadcastGlow 8s ease-in-out infinite alternate;
}
.broadcast-stage:hover .fullscreen-btn{opacity:1;transform:translateY(0)}
.tv-panel{
  min-height:0;
  overflow:hidden;
  border-radius:24px;
  border:1px solid var(--sky-border);
  background:
    linear-gradient(180deg,rgba(7,20,38,.92),rgba(2,7,18,.94)),
    radial-gradient(circle at 30% 0,rgba(0,163,255,.14),transparent 35%);
  box-shadow:0 30px 90px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.04) inset;
}
.tv-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 18px;
  border-bottom:1px solid rgba(125,211,252,.18);
  background:linear-gradient(90deg,rgba(0,102,255,.42),rgba(0,163,255,.18) 45%,rgba(227,6,19,.28)),linear-gradient(180deg,rgba(255,255,255,.08),transparent);
}
.tv-title{
  margin:0;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#fff;
  font-size:clamp(1rem,1.4vw,1.35rem);
}
.tv-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,176,0,.75);
  color:#111827;
  background:linear-gradient(180deg,#ffd36a,var(--sky-amber));
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  text-transform:uppercase;
  font-weight:1000;
  box-shadow:0 0 22px rgba(255,176,0,.22);
}
.tv-live-pill{
  justify-self:center;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(125,211,252,.72);
  color:#fff;
  border-radius:999px;
  padding:7px 17px;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.16em;
  text-transform:uppercase;
  background:linear-gradient(90deg,var(--sky-blue-2),var(--sky-blue),var(--sky-red));
  box-shadow:0 0 25px rgba(0,163,255,.42),0 0 36px rgba(227,6,19,.22);
}
.tv-live-pill:before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-120%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  animation:shine 2.8s linear infinite;
}
.tv-action,
.league-control .btn,
.scorer-console .btn,
.stats-desk .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  border-radius:999px;
  padding:.72rem 1rem;
  border:1px solid rgba(125,211,252,.42);
  background:linear-gradient(180deg,rgba(11,31,58,.92),rgba(2,7,18,.94));
  color:#eaf6ff;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.32);
}
.league-control .btn-primary,
.scorer-console .btn-primary{
  border-color:rgba(255,176,0,.9);
  background:linear-gradient(180deg,#ffd36a,var(--sky-amber));
  color:#111827;
}
.league-control .btn-secondary,
.scorer-console .btn-secondary{
  border-color:rgba(0,163,255,.72);
  background:linear-gradient(90deg,var(--sky-blue-2),var(--sky-blue));
  color:#fff;
}
.scorer-console .btn-danger{
  border-color:rgba(255,47,75,.72);
  background:linear-gradient(90deg,#7f1d1d,var(--sky-red));
  color:#fff;
}
@media(max-width:900px){
  .broadcast-stage{height:auto;min-height:100vh;overflow:visible;grid-template-rows:auto auto auto auto}
}

/* Phase 5: fixture player stats + night highlights */
.night-highlights{
  margin:0 12px 12px;
  padding:12px;
  border-top:1px solid rgba(125,211,252,.18);
  background:linear-gradient(180deg,rgba(1,4,9,.1),rgba(1,4,9,.38));
}
.highlight-title{
  margin-bottom:8px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#ffcf4a;
  font-weight:1000;
}
.highlight-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.highlight-card{
  min-width:0;
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  padding:9px 10px;
  background:linear-gradient(180deg,rgba(15,23,42,.7),rgba(2,6,23,.82));
}
.highlight-card small{
  display:block;
  color:#a7b4c8;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.highlight-card b{
  display:block;
  margin-top:2px;
  color:#fff;
  font-size:16px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.highlight-card span{
  display:block;
  margin-top:1px;
  color:#ffcf4a;
  font-size:12px;
  font-weight:900;
}
@media(max-width:900px){
  .highlight-grid{grid-template-columns:1fr}
}


/* =========================
   Fixture scorer PIN overlay
   ========================= */
.pin-lock-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:24px;
  background:radial-gradient(circle at 50% 0,rgba(0,163,255,.28),transparent 34%),rgba(1,4,9,.86);
  backdrop-filter:blur(12px);
}
.pin-lock-overlay[hidden]{display:none!important}
.pin-lock-card{
  width:min(520px,100%);
  border:1px solid var(--sky-border);
  border-radius:26px;
  padding:26px;
  background:linear-gradient(180deg,rgba(7,20,38,.96),rgba(2,7,18,.98));
  box-shadow:0 34px 110px rgba(0,0,0,.82),0 0 40px rgba(0,163,255,.18);
  text-align:center;
}
.pin-lock-eyebrow{
  display:inline-flex;
  border:1px solid rgba(255,176,0,.75);
  background:linear-gradient(180deg,#ffd36a,var(--sky-amber));
  color:#111827;
  border-radius:999px;
  padding:.38rem .7rem;
  font-size:.72rem;
  font-weight:1000;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.pin-lock-card h1{
  margin:16px 0 8px;
  font-size:clamp(2rem,5vw,3.2rem);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
}
.pin-lock-card p{color:#d9ecff;margin:.5rem 0 1rem}
#fixturePinForm{display:flex;gap:.65rem;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:1rem}
.pin-lock-input{
  width:150px;
  text-align:center;
  font-size:2rem;
  font-weight:1000;
  letter-spacing:.25em;
  border:1px solid rgba(125,211,252,.42);
  background:#010409;
  color:#fff;
  border-radius:16px;
  padding:.55rem .6rem;
  outline:none;
}
.pin-lock-input:focus{border-color:var(--sky-blue);box-shadow:0 0 0 3px rgba(0,163,255,.18),0 0 28px rgba(0,163,255,.22)}
.pin-lock-error{min-height:1.2em;margin-top:.75rem;color:#fecaca;font-weight:900}
.pin-lock-small{font-size:.85rem;color:var(--sky-muted)!important}


/* Phase 6 hotfix: scorer page layout + PIN overlay cache-bust styles */
body.scorer-console.broadcast-stage{
  display:block;
  height:auto;
  min-height:100vh;
  overflow:auto;
}
body.scorer-console.broadcast-stage:before,
body.scorer-console.broadcast-stage:after{
  position:fixed;
}
body.scorer-console .wrapper{
  width:100%;
  max-width:1600px;
  margin:0 auto;
  position:relative;
  z-index:1;
}
body.scorer-console .board{
  width:100%;
}
body.scorer-console .pin-lock-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:grid!important;
  place-items:center!important;
  padding:24px!important;
  background:radial-gradient(circle at 50% 0,rgba(0,163,255,.28),transparent 34%),rgba(1,4,9,.88)!important;
  backdrop-filter:blur(12px);
}
body.scorer-console .pin-lock-overlay[hidden]{
  display:none!important;
}
body.scorer-console .pin-lock-card{
  width:min(540px,100%)!important;
  border:1px solid var(--sky-border)!important;
  border-radius:26px!important;
  padding:26px!important;
  background:linear-gradient(180deg,rgba(7,20,38,.97),rgba(2,7,18,.99))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.82),0 0 40px rgba(0,163,255,.18)!important;
  text-align:center!important;
}
@media(max-width:900px){
  body.scorer-console .board{grid-template-columns:1fr!important}
}
