
:root {
  --gold: #ff3d8b;
  --gold-dark: #a3155a;
  --gold-glow: rgba(255, 61, 139, 0.10);
  --border-gold: rgba(255, 61, 139, 0.22);
  --acc-rgb: 255, 61, 139;
  --acc-btn: #a3155a;
  --acc-btn-hi: #c21d6c;
  --accent: #a3155a;
}
body { background-image: radial-gradient(ellipse 80% 40% at 50% 0%, rgba(163, 21, 90, 0.10) 0%, transparent 70%); }
h1, h2, h3, .cp-section-title { text-wrap: balance; }
p, small, .narrative, .cp-hero-pitch, .cp-mode-line, .spot-promo-txt small { text-wrap: pretty; }


.btn:not(.btn-outline):not(.btn-sm), #spinBtn, .pk-start, .fv-popup-btn.primary, .cp-btn-primary {
  background: linear-gradient(135deg, var(--acc-btn), var(--acc-btn-hi)) !important; color: #fff !important;
}
.btn-outline { border-color: var(--gold) !important; color: var(--gold) !important; }


.nrl-field-wrap {
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, .035) 0 9%, transparent 9% 18%),
    radial-gradient(ellipse 70% 60% at 50% 50%, #1f6a36 0%, #185a2c 60%, #134a24 100%) !important;
  height: min(86vw, 420px) !important; 
}
.nrl-field-inner.epl-pitch { border: 2px solid rgba(255, 255, 255, .18); border-radius: 6px; box-sizing: border-box; }
.epl-mark { position: absolute; pointer-events: none; z-index: 0; border: 2px solid rgba(255, 255, 255, .16); }
.epl-half { left: 0; right: 0; top: 50%; height: 0; border-width: 2px 0 0; }
.epl-circle { left: 50%; top: 50%; width: 26%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; }
.epl-box { left: 22%; right: 22%; height: 15%; }
.epl-six { left: 37%; right: 37%; height: 6%; }
.epl-box-top, .epl-six-top { top: -2px; border-top: 0; }
.epl-box-bot, .epl-six-bot { bottom: -2px; border-bottom: 0; }
.nrl-field-inner .fpos { z-index: 2; }
@media (min-width: 900px) { .nrl-field-wrap { height: auto !important; } }


.ptag-G { background: #78350f; color: #fcd34d; }
.ptag-D { background: #1e3a8a; color: #93c5fd; }
.ptag-M { background: #14532d; color: #86efac; }
.ptag-F { background: #7f1d1d; color: #fca5a5; }
.pos-option .slot-badge.ptag-G, .pos-option .slot-badge.ptag-D, .pos-option .slot-badge.ptag-M, .pos-option .slot-badge.ptag-F { border-radius: 6px; padding: 3px 8px; font-weight: 900; }


.fm-pick { position: fixed; inset: 0; z-index: 9500; background: rgba(4, 4, 10, .82); display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; }
.fm-sheet { width: 100%; max-width: 440px; background: linear-gradient(180deg, #17101a, #0c0c14); border: 1px solid rgba(var(--acc-rgb), .35); border-radius: 18px; padding: 20px 16px 18px; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); }
.fm-kicker { font: 900 11px/1 Inter, system-ui, sans-serif; letter-spacing: 2.5px; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.fm-sheet h2 { margin: 0 0 6px; font: 900 24px/1.15 Inter, system-ui, sans-serif; color: #fff; text-wrap: balance; }
.fm-sheet p { margin: 0 auto 16px; max-width: 340px; font-size: 13px; line-height: 1.45; color: #a0a0b8; text-wrap: pretty; }
.fm-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fm-card { appearance: none; border: 1.5px solid rgba(var(--acc-rgb), .3); background: #12121f; border-radius: 14px; padding: 8px 6px 10px; color: #fff; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 4px; animation: fmIn .35s ease both; touch-action: manipulation; font-family: Inter, system-ui, sans-serif; }
.fm-card:hover, .fm-card:focus-visible { border-color: var(--gold); outline: none; transform: translateY(-2px); }
.fm-card b { font-size: 19px; font-weight: 900; letter-spacing: .5px; }
.fm-card small { font-size: 10.5px; line-height: 1.25; color: #a0a0b8; font-weight: 700; text-wrap: balance; min-height: 26px; }
.fm-pitch { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; border-radius: 8px; background: repeating-linear-gradient(180deg, #1b6531 0 12.5%, #18592b 12.5% 25%); border: 1.5px solid rgba(255, 255, 255, .2); overflow: hidden; }
.fm-pitch::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1.5px solid rgba(255, 255, 255, .18); }
.fm-pitch i { position: absolute; width: 11%; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 1px 3px rgba(0, 0, 0, .5); z-index: 1; }
.fm-pitch i.ln-G { background: #fcd34d; }
.fm-pitch i.ln-D { background: #93c5fd; }
.fm-pitch i.ln-M { background: #86efac; }
.fm-pitch i.ln-F { background: #fca5a5; }
@keyframes fmIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fm-card { animation: none; } }


.game-row.draw { border-left-color: #a2a2b8 !important; }
.game-score.draw { color: #d4d4e0 !important; }
.game-result-badge.badge-draw { background: #3a3a4e; color: #fff; }
.game-row .game-scorers + .game-scorers { margin-top: 1px; }


body[data-mode="hard"] { --mode: #fb923c; --mode-rgb: 251, 146, 60; }
body[data-mode="hard"] .cp-skin-strip { background: linear-gradient(90deg, #7c2d12, #ea580c 50%, #7c2d12); }
body[data-mode="hard"] #spinBtn { background: linear-gradient(135deg, #c2410c, #fb923c) !important; color: #fff !important; box-shadow: 0 4px 20px rgba(234, 88, 12, .4) !important; }
.cp-mode-mini.is-hard { --mm: #fb923c; }


.cp-mode-card.cp-mode-main .cp-mode-go { background: linear-gradient(135deg, var(--acc-btn), var(--acc-btn-hi)) !important; color: #fff !important; }
@media (hover: hover) { .cp-mode-main:hover .cp-mode-go { background: linear-gradient(135deg, var(--acc-btn-hi), var(--gold)) !important; } }


@media (max-width: 480px) {
  .fixture-grid .game-opp-name { font-size: 10px; }
  .fixture-grid .game-score { font-size: 9.5px; padding: 0 1px; }
  .fixture-grid .game-club-badge { width: 24px; min-width: 24px; font-size: 7px; }
}


.result-meta-row.is-three .result-badge { padding: 14px 6px; min-width: 0; }
.result-meta-row.is-three .result-badge.rb-wide { flex: 1.55; }
.result-meta-row.is-three .result-badge-label { letter-spacing: 1.2px; white-space: nowrap; }
.result-meta-row.is-three .result-badge-val.rb-ladder { font-size: 28px; font-variant-numeric: tabular-nums; }
.result-meta-row.is-three .result-badge-val.rb-result { font-size: 14px; white-space: nowrap; }
@media (max-width: 360px) { .result-meta-row.is-three .result-badge-val.rb-result { font-size: 12px; } }


.season-record-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:34px;gap:4px 8px;align-items:center;padding:6px 14px;flex-wrap:nowrap}
.season-record-bar>*{min-width:0;height:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}
.season-record-bar>.srb-sep{display:none}
.season-record-bar .srb-record{font-size:18px;line-height:20px;min-width:0;width:100%;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.season-record-bar .srb-val,.season-record-bar .srb-pos{display:block;width:100%;line-height:18px;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.season-record-bar .srb-label{display:block;width:100%;line-height:12px;text-align:center;white-space:nowrap}
@media (min-width:600px){.season-record-bar{grid-template-columns:repeat(6,minmax(0,1fr))}}


.epl-tbl-wrap{width:100%}
.epl-tbl{width:100%;border-collapse:collapse;table-layout:fixed;font-size:11px;font-variant-numeric:tabular-nums}
.epl-tbl th{color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;padding:4px 0;text-align:center}
.epl-tbl td{padding:5px 0;text-align:center;border-top:1px solid rgba(255,255,255,.06);white-space:nowrap}
.epl-tbl th:nth-child(n+3),.epl-tbl td:nth-child(n+3){width:20px}
.epl-tbl .t-pos{width:24px;position:relative;font-weight:700;color:var(--muted)}
.epl-tbl td.t-pos::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:2px;background:transparent}
.epl-tbl td.z-ucl::before{background:#22c55e}.epl-tbl td.z-uel::before{background:#3b82f6}.epl-tbl td.z-rel::before{background:#ef4444}
.epl-tbl .t-team{text-align:left;padding-left:4px;overflow:hidden;text-overflow:ellipsis}
.epl-tbl td.t-team{display:table-cell}

.epl-tbl .cb-team{gap:4px}.epl-tbl .cb-mini{width:22px;height:16px}
.epl-tbl .t-nm{font-weight:500}
.epl-tbl th.t-gfa,.epl-tbl td.t-gfa{width:42px}
.epl-tbl th.t-gd,.epl-tbl td.t-gd{width:34px}
.epl-tbl th.t-pts,.epl-tbl td.t-pts{width:28px;font-weight:800}
.epl-tbl td.t-pts{color:var(--gold)}
.epl-tbl tr.is-me td{background:rgba(var(--acc-rgb),.16)}
.epl-tbl tr.is-me .t-nm{font-weight:800;color:var(--text)}
.epl-tbl-key{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:10px;color:var(--muted)}
.epl-tbl-key span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.epl-tbl-key i{display:inline-block;width:3px;height:11px;border-radius:2px}
.epl-tbl-key .z-ucl{background:#22c55e}.epl-tbl-key .z-uel{background:#3b82f6}.epl-tbl-key .z-rel{background:#ef4444}
@media (max-width:370px){.epl-tbl{font-size:10.5px}.epl-tbl th.t-gfa,.epl-tbl td.t-gfa{width:44px}.epl-tbl th.t-gd,.epl-tbl td.t-gd{width:32px}}

.season-controls .btn{height:34px;line-height:16px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}


.spin-slots > .spin-slot { flex: 1 1 0; min-width: 0; box-sizing: border-box; }
.spin-slots > .spin-slot .spin-slot-val { min-width: 0; text-wrap: balance; overflow-wrap: break-word;  }

@media (max-width: 370px) { .epl-tbl th.t-gfa, .epl-tbl td.t-gfa { width: 38px; } .epl-tbl th.t-gd, .epl-tbl td.t-gd { width: 28px; } }


.ca-spot-src { padding: 2px 4px; letter-spacing: 0; text-overflow: clip; }
@supports (font-size: 1cqw) { .ca-pitch .ca-spot .ca-spot-src { font-size: min(9px, calc((100cqw - 8px) / 6.4)); } }
