/* GoalLive cinematic finishing layer — visual-only overrides */
:root {
  --cinema-lime: #45ffad;
  --cinema-glass: rgba(8, 23, 39, .82);
}
body {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(28, 92, 111, .24), transparent 42%),
    radial-gradient(ellipse at 0% 42%, rgba(37, 229, 138, .055), transparent 35%),
    var(--bg);
}
.header {
  background: rgba(4, 13, 25, .88);
  border-bottom-color: rgba(69, 255, 173, .16);
  box-shadow: 0 10px 35px rgba(0, 0, 0, .16);
}
.logo-ball {
  border-color: rgba(69, 255, 173, .35);
  box-shadow: inset 0 0 22px rgba(37, 229, 138, .12), 0 0 22px rgba(37, 229, 138, .08);
}
.panel {
  background: linear-gradient(145deg, rgba(12, 31, 50, .96), rgba(5, 17, 31, .97));
  border-color: rgba(91, 133, 164, .24);
  box-shadow: 0 16px 42px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255,255,255,.025);
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.panel:hover {
  border-color: rgba(69, 255, 173, .24);
  box-shadow: 0 18px 46px rgba(0, 0, 0, .22), 0 0 24px rgba(37, 229, 138, .035);
}
.hero-card {
  isolation: isolate;
  min-height: 320px;
  border-color: rgba(69, 255, 173, .28);
  background:
    linear-gradient(105deg, rgba(4, 19, 32, .98) 0%, rgba(7, 38, 43, .93) 52%, rgba(5, 18, 33, .98) 100%);
  box-shadow: 0 24px 65px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.045);
}
.hero-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .72;
  background:
    linear-gradient(115deg, transparent 0 30%, rgba(69,255,173,.045) 50%, transparent 72%),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(173, 222, 238, .025) 32px);
}
.hero-bg-glow {
  background: rgba(37, 229, 138, .16);
  filter: blur(22px);
}
.hero-tag {
  box-shadow: inset 0 0 18px rgba(37,229,138,.04), 0 0 24px rgba(37,229,138,.04);
}
.hero-card h1 em {
  text-shadow: 0 0 28px rgba(37, 229, 138, .17);
}
.hero-art {
  opacity: .88;
  filter: drop-shadow(0 0 28px rgba(37, 229, 138, .08));
}
.stadium-ring {
  box-shadow: 0 0 28px rgba(37, 229, 138, .045);
}
.pitch {
  border-color: rgba(69,255,173,.72);
  box-shadow: 0 0 48px rgba(37,229,138,.13), inset 0 0 25px rgba(37,229,138,.09);
}
.hero-football {
  filter: drop-shadow(0 16px 24px rgba(0,0,0,.65)) drop-shadow(0 0 18px rgba(37,229,138,.12));
}
.btn-primary {
  box-shadow: 0 8px 25px rgba(37,229,138,.16), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(37,229,138,.24);
}
.btn-ghost, .round-btn, .date-picker button, .refresh-btn, .favorites-filter {
  transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}
.btn-ghost:hover, .round-btn:hover, .date-picker button:hover, .refresh-btn:hover, .favorites-filter:hover {
  border-color: rgba(69,255,173,.48);
  color: var(--cinema-lime);
}
.match-card {
  background: linear-gradient(110deg, rgba(12, 32, 51, .98), rgba(6, 21, 36, .98));
  border-color: rgba(74, 111, 142, .28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
}
.match-card:hover {
  border-color: rgba(69,255,173,.46);
  box-shadow: 0 8px 24px rgba(0,0,0,.16), 0 0 22px rgba(37,229,138,.045);
  transform: translateY(-2px);
}
.team-crest {
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.18));
}
.tab.active {
  box-shadow: inset 0 0 16px rgba(37,229,138,.07);
}
.live-badge {
  box-shadow: inset 0 0 16px rgba(255,86,103,.055);
}
.news-card {
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.news-card:hover {
  transform: translateY(-3px);
  border-color: rgba(69,255,173,.28);
  box-shadow: 0 16px 34px rgba(0,0,0,.18);
}
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid var(--cinema-lime);
  outline-offset: 3px;
}
@media (max-width: 760px) {
  .hero-card { min-height: 300px; }
  .hero-card::before { opacity: .42; }
  .hero-art { opacity: .34; }
  .hero-content { max-width: 78%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* High-impact cinematic pass: make the new art direction unmistakable */
html { background: #030913; }
body {
  background:
    radial-gradient(ellipse at 50% -12%, rgba(26, 102, 93, .30), transparent 48%),
    radial-gradient(ellipse at 95% 35%, rgba(25, 91, 143, .14), transparent 28%),
    #030913;
}
.topline {
  background: linear-gradient(90deg, #04100f, #071522 48%, #04100f);
  border-bottom-color: rgba(69,255,173,.18);
  letter-spacing: .15px;
}
.header {
  max-width: none;
  padding-inline: max(28px, calc((100vw - 1544px) / 2));
  background: rgba(3, 10, 20, .92);
  border-bottom: 1px solid rgba(69,255,173,.2);
}
.logo { letter-spacing: -.6px; }
.logo-ball {
  background: linear-gradient(145deg, #123c39, #0a1c2b 72%);
  border-radius: 15px;
}
.main-nav a.selected::after {
  height: 3px;
  box-shadow: 0 0 15px rgba(69,255,173,.6);
}
.layout { gap: 20px; }
.panel {
  border-radius: 17px;
  backdrop-filter: blur(12px);
  overflow: hidden;
}
.panel-title { padding: 20px 20px 15px; }
.panel-title h2, .section-head h2 { letter-spacing: -.35px; }
.hero-card {
  min-height: 360px;
  padding: 36px 32px;
  border-radius: 21px;
  border-color: rgba(69,255,173,.34);
  background:
    radial-gradient(ellipse at 77% 50%, rgba(25, 120, 91, .20), transparent 38%),
    linear-gradient(115deg, #061422 0%, #082a2b 54%, #061322 100%);
  box-shadow: 0 28px 75px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.06);
}
.hero-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .55;
  background: radial-gradient(ellipse at 78% 55%, transparent 0 18%, rgba(69,255,173,.045) 18.2% 18.5%, transparent 18.7% 28%, rgba(69,255,173,.035) 28.2% 28.5%, transparent 28.7%);
}
.hero-content { max-width: 61%; }
.hero-tag {
  border-radius: 999px;
  padding: 7px 12px;
  background: rgba(69,255,173,.08);
  border-color: rgba(69,255,173,.22);
}
.hero-card h1 { font-size: clamp(36px, 4vw, 54px); line-height: 1.2; margin-top: 18px; }
.hero-content > p { font-size: 13px; line-height: 2; }
.btn-primary, .btn-ghost { border-radius: 11px; padding: 12px 16px; font-size: 11px; }
.btn-primary { color: #03130c; background: linear-gradient(135deg, #65ffc0, #27e58d); }
.hero-art { width: 50%; left: -1%; }
.pitch { width: 255px; height: 136px; }
.hero-football { font-size: 104px; }
.hero-footnote { color: #8aa7b9; }
.league-row, .table-link, .broadcaster, .upcoming-item { transition: background .2s ease, padding .2s ease; }
.league-row:hover, .table-link:hover, .broadcaster:hover, .upcoming-item:hover {
  background: rgba(69,255,173,.045);
}
.league-badge, .table-crest, .club-symbol {
  border: 1px solid rgba(116,157,185,.12);
  background: linear-gradient(145deg, #163047, #0b1c2d);
}
.match-tools { padding-inline: 17px; }
.match-search-wrap {
  border-radius: 10px !important;
  border-color: rgba(102,145,174,.25) !important;
  background: rgba(3,13,24,.7) !important;
}
.fixture-tabs { scrollbar-width: thin; scrollbar-color: #275443 transparent; }
.tab { border-radius: 9px; }
.tab.active { background: rgba(37,229,138,.13); border-color: rgba(69,255,173,.25); }
.match-card {
  border-radius: 13px;
  padding: 14px 15px;
  background: linear-gradient(115deg, rgba(12,31,49,.98), rgba(5,17,30,.98));
}
.match-body { padding-block: 15px; }
.team { font-size: 12px; }
.team-crest, .crest-placeholder { width: 32px; height: 32px; }
.score { font-size: 21px; }
.match-status.live { box-shadow: 0 0 18px rgba(255,86,103,.1); }
.live-badge { border: 1px solid rgba(255,86,103,.15); }
.news-card {
  border-radius: 15px;
  border: 1px solid rgba(91,133,164,.22);
  background: linear-gradient(145deg, rgba(12,31,50,.96), rgba(5,17,31,.97));
  overflow: hidden;
}
.news-art { min-height: 150px; }
.footer {
  border-top: 1px solid rgba(69,255,173,.13);
  background: rgba(3,10,19,.65);
}
:where(a, button, input) { -webkit-tap-highlight-color: transparent; }
@media (min-width: 1200px) {
  .layout { padding-top: 30px; }
  .center-column { gap: 22px; }
}
@media (max-width: 1000px) {
  .hero-card { min-height: 320px; }
  .hero-content { max-width: 66%; }
}
@media (max-width: 760px) {
  .header { padding-inline: 16px; }
  .layout { padding: 16px 14px 30px; gap: 14px; }
  .hero-card { min-height: 290px; padding: 25px 20px; border-radius: 17px; }
  .hero-content { max-width: 88%; }
  .hero-card h1 { font-size: clamp(32px, 8vw, 42px); }
  .hero-art { left: -12%; width: 58%; opacity: .23; }
  .hero-footnote { right: 17px; bottom: 10px; font-size: 8px; }
  .panel-title { padding: 17px 16px 12px; }
  .match-card { padding: 12px; }
}


/* CR-inspired stadium art direction — preserves all existing app behavior */
:root {
  --cinema-lime: #64ffb7;
  --cr-panel: rgba(7, 18, 31, .92);
}
body {
  background:
    radial-gradient(ellipse at 50% 12%, rgba(19, 75, 75, .24), transparent 42%),
    radial-gradient(ellipse at 88% 38%, rgba(24, 75, 125, .12), transparent 26%),
    #030812;
}
.topline { color:#9ab5c7; }
.header { border-bottom-color:rgba(100,255,183,.22); }
.layout { max-width:1720px; gap:22px; }
.hero-card {
  min-height:430px;
  padding:40px 36px;
  border-radius:24px;
  border:1px solid rgba(100,255,183,.34);
  background:
    linear-gradient(90deg, rgba(3,10,19,.98) 0%, rgba(3,13,22,.92) 40%, rgba(4,22,30,.42) 72%, rgba(3,10,19,.18) 100%),
    radial-gradient(ellipse at 73% 48%, rgba(48,255,177,.18), transparent 35%),
    linear-gradient(145deg,#071522,#09282b 55%,#050c17);
  box-shadow:0 30px 90px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.07);
}
.hero-card::before {
  content:"";
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0 46%,rgba(100,255,183,.09) 46.2%,transparent 46.7%),
    linear-gradient(125deg,transparent 0 61%,rgba(100,180,255,.07) 61.2%,transparent 61.8%),
    repeating-linear-gradient(90deg,transparent 0 47px,rgba(191,231,255,.025) 48px,transparent 49px);
}
.hero-card::after {
  content:"CR7";
  position:absolute;
  z-index:1;
  pointer-events:none;
  left:3%; top:50%; transform:translateY(-53%) skew(-8deg);
  font-family:Arial,sans-serif;
  font-size:clamp(120px,18vw,250px);
  font-weight:1000;
  font-style:italic;
  letter-spacing:-.12em;
  line-height:1;
  color:rgba(224,255,244,.055);
  -webkit-text-stroke:1px rgba(100,255,183,.16);
  text-shadow:0 0 70px rgba(51,255,173,.10);
}
.hero-content { max-width:57%; z-index:3; }
.hero-tag {
  color:#75ffc2; background:rgba(100,255,183,.08);
  border:1px solid rgba(100,255,183,.25); border-radius:99px;
  padding:8px 13px; font-size:9px; letter-spacing:1.2px;
}
.hero-kicker {
  margin-top:25px; color:#a5c2d2; font:800 10px/1.5 Arial,sans-serif;
  letter-spacing:4px; text-shadow:0 0 18px rgba(100,255,183,.18);
}
.hero-card h1 {
  font-size:clamp(38px,4.4vw,62px); line-height:1.2;
  margin:12px 0 14px; letter-spacing:-1.5px;
  text-shadow:0 6px 32px rgba(0,0,0,.4);
}
.hero-card h1 em { color:#6bffc0; }
.hero-content>p { max-width:390px; font-size:13px; line-height:2.1; color:#b2c7d5; }
.hero-art {
  z-index:2; left:0; width:52%; opacity:.96;
  filter:drop-shadow(0 0 42px rgba(49,255,174,.12));
}
.stadium-ring { width:330px; height:330px; border-color:rgba(100,255,183,.25); }
.ring-b { width:390px; height:390px; border-color:rgba(100,180,255,.18); }
.pitch {
  width:290px; height:158px; transform:rotate(-17deg);
  border:1px solid rgba(100,255,183,.7);
  background:linear-gradient(135deg,rgba(21,121,78,.56),rgba(4,37,37,.72));
  box-shadow:0 0 70px rgba(43,255,173,.16),inset 0 0 38px rgba(100,255,183,.12);
}
.hero-football {
  font-size:112px;
  filter:drop-shadow(0 22px 28px rgba(0,0,0,.8)) drop-shadow(0 0 28px rgba(100,255,183,.16));
}
.spark { text-shadow:0 0 20px rgba(100,255,183,.55); }
.hero-footnote { z-index:4; color:#8ba8ba; }
.hero-buttons { gap:11px; }
.btn-primary { background:linear-gradient(135deg,#8affce,#36e99a); }
.panel { border-radius:18px; background:linear-gradient(145deg,rgba(10,27,43,.97),rgba(4,14,26,.98)); }
.panel-title { padding:21px 20px 15px; }
.match-card { border-radius:14px; }
.news-art { position:relative; overflow:hidden; }
.news-art::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg,transparent 35%,rgba(100,255,183,.14),transparent 72%);
}
@media (min-width:1200px) {
  .layout { padding-top:32px; }
  .hero-card { min-height:450px; }
}
@media (max-width:760px) {
  .hero-card { min-height:350px; padding:26px 20px; }
  .hero-content { max-width:92%; }
  .hero-kicker { margin-top:18px; font-size:8px; letter-spacing:2.5px; }
  .hero-card h1 { font-size:clamp(34px,9vw,46px); }
  .hero-card::after { font-size:145px; left:-4%; top:62%; opacity:.8; }
  .hero-art { width:66%; left:-17%; top:15%; opacity:.3; }
  .hero-footnote { font-size:8px; }
}

/* v2 visual polish */
.hero-card{border-radius:24px}

/* GoalLive cinematic refinement */
:root{--cinema-lime:#b6ff45}
body{background:radial-gradient(ellipse at 70% 0%,rgba(126,178,61,.12),transparent 34%),#05080d}
.header{background:rgba(5,8,13,.92);border-bottom:1px solid rgba(182,255,69,.15);backdrop-filter:blur(18px)}
.panel,.news-card,.mini-ad{background:linear-gradient(145deg,rgba(15,23,33,.97),rgba(8,13,20,.97));border-color:rgba(255,255,255,.075)}
.hero-card{border-radius:24px;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.32)}
.hero-content h1 em{color:var(--cinema-lime);font-style:normal}
.hero-kicker{color:var(--cinema-lime);letter-spacing:2px}
.hero-buttons .btn-primary{color:#10170a;background:var(--cinema-lime);border-color:var(--cinema-lime)}
.main-nav a.selected,.main-nav a:hover{color:var(--cinema-lime)}
.fixture-tabs .tab.active,.favorites-filter[aria-pressed=true]{color:#10170a;background:var(--cinema-lime)}
@media(max-width:720px){.hero-card{border-radius:18px}.hero-content{padding-inline:20px}.hero-content h1{font-size:clamp(32px,9vw,43px)}}

/* Stadium photography layer */
.hero-card{background-image:linear-gradient(90deg,rgba(3,8,13,.98) 0%,rgba(3,8,13,.88) 40%,rgba(3,8,13,.34) 76%,rgba(3,8,13,.2) 100%),linear-gradient(0deg,rgba(3,8,13,.65),transparent 58%),url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=1800&q=85");background-size:cover;background-position:center 45%}
.hero-card::after{color:rgba(224,255,244,.08);-webkit-text-stroke-color:rgba(182,255,69,.2)}
.hero-card h1 em{color:#b6ff45}
@media(max-width:760px){.hero-card{background-position:58% center}.hero-card::before{background:linear-gradient(0deg,rgba(3,8,13,.96),rgba(3,8,13,.42) 65%,rgba(3,8,13,.12))}}

/* Reference layout pass: dark editorial football dashboard */
:root{--cinema-lime:#b8ff3b}
body{background:#07090d;color:#f5f7f8}
.topline{background:#090c11;color:#8d9aa6}
.header{background:rgba(7,10,14,.94);border-bottom:1px solid #1d252c}
.layout{max-width:1540px;grid-template-columns:minmax(210px,.78fr) minmax(440px,1.75fr) minmax(220px,.82fr);gap:18px}
.hero-card.hero-cinematic{min-height:420px;padding:0;border-radius:22px;background:#10151a;position:relative;isolation:isolate;overflow:hidden}
.hero-card.hero-cinematic:before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(4,7,10,.97) 0%,rgba(4,7,10,.78) 43%,rgba(4,7,10,.18) 100%),linear-gradient(0deg,rgba(4,7,10,.76),transparent 62%)}
.hero-photo{position:absolute;inset:0;z-index:-1;background-image:url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=1800&q=85");background-size:cover;background-position:center 45%;filter:brightness(.8) saturate(.8)}
.hero-content{max-width:66%;padding:54px 34px 58px;position:relative;z-index:3}
.hero-tag{color:#e2e9df;border-color:#b8ff3b55;background:#090d0dbd}
.hero-kicker{color:#b8ff3b;letter-spacing:2px}
.hero-card h1{font-size:clamp(36px,4vw,58px);line-height:1.2}
.hero-card h1 em{color:#b8ff3b}
.hero-content>p{color:#d0d4d6;max-width:390px}
.hero-buttons .btn-primary{background:#b8ff3b;border-color:#b8ff3b;color:#10150b;border-radius:9px}
.hero-buttons .btn-ghost{border-radius:9px;background:#0a0e12a8;border-color:#ffffff38}
.hero-art{display:none!important}
.hero-card:after{color:#ffffff0b;-webkit-text-stroke:1px #b8ff3b18}
.hero-live-card{position:absolute;z-index:4;top:20px;left:20px;width:195px;padding:16px;display:flex;flex-direction:column;gap:9px;border:1px solid #ffffff22;border-radius:15px;background:#080d12d9;backdrop-filter:blur(14px)}
.hero-live-card b{font-size:15px}.hero-live-card small{color:#b3bdc4;line-height:1.7}.hero-live-card a{color:#b8ff3b;font-size:12px;font-weight:800}
.panel,.news-card,.mini-ad{background:#0d1117;border:1px solid #202832;border-radius:16px;box-shadow:none}
.panel-title h2,.section-head h2{color:#f5f7f8}
.league-row,.table-link,.broadcaster{border-color:#202832}
.fixture-tabs .tab.active,.favorites-filter[aria-pressed=true]{background:#b8ff3b;color:#10150b}
.tiny-pulse,.live-badge i{background:#b8ff3b}
.main-nav a.selected,.main-nav a:hover,.text-link{color:#b8ff3b}
@media(max-width:1100px){.layout{grid-template-columns:minmax(180px,.7fr) minmax(380px,1.5fr)}.right-column{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.hero-card.hero-cinematic{min-height:390px}}
@media(max-width:760px){.layout{display:flex;flex-direction:column}.hero-card.hero-cinematic{min-height:480px}.hero-card.hero-cinematic:before{background:linear-gradient(0deg,rgba(4,7,10,.98) 0%,rgba(4,7,10,.7) 48%,rgba(4,7,10,.12) 100%)}.hero-content{max-width:100%;padding:225px 20px 34px}.hero-live-card{top:14px;left:14px;width:175px;padding:12px}.hero-card h1{font-size:clamp(34px,9vw,46px)}.right-column{display:flex}.hero-footnote{font-size:9px;padding-inline:18px}}

.league-pills{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:15px 0 18px;padding:0 2px}
.league-pills a{display:inline-flex;align-items:center;justify-content:center;padding:9px 15px;border:1px solid #252d35;border-radius:999px;background:#0d1117;color:#c8d0d5;font-size:12px;font-weight:800;white-space:nowrap;transition:.18s ease}
.league-pills a:hover,.league-pills a.active{background:#b8ff3b;border-color:#b8ff3b;color:#10150b}
@media(max-width:760px){.league-pills{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px;scrollbar-width:none}.league-pills::-webkit-scrollbar{display:none}.league-pills a{flex:0 0 auto}}


/* Premium finishing pass: precise sizing, depth, motion, accessibility */
:root{
  --cinema-lime:#b8ff3b;
  --surface:rgba(14,18,24,.94);
  --surface-line:rgba(255,255,255,.085);
}
html{scroll-behavior:smooth;scroll-padding-top:105px}
body{
  color:#f5f7f8;
  background:
    radial-gradient(ellipse at 48% -15%,rgba(184,255,59,.075),transparent 38%),
    #07090d;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.topline{min-height:29px;font-size:10px;letter-spacing:.2px}
.header{
  height:74px;
  padding-inline:max(20px,calc((100vw - 1480px)/2));
  background:rgba(7,9,13,.88);
  backdrop-filter:blur(20px) saturate(145%);
}
.layout{
  width:100%;max-width:1480px;
  padding:26px 24px 64px;
  grid-template-columns:minmax(210px,.82fr) minmax(0,2.1fr) minmax(230px,.9fr);
  gap:20px;
}
.left-column,.right-column,.center-column{gap:20px}
.panel,.news-card,.mini-ad{
  border:1px solid var(--surface-line);
  border-radius:18px;
  box-shadow:0 18px 44px rgba(0,0,0,.19),inset 0 1px rgba(255,255,255,.025);
}
.panel-title{padding:19px 19px 14px}
.panel-title h2,.section-head h2{font-size:16px}
.hero-card{
  min-height:clamp(410px,35vw,500px);
  padding:clamp(26px,3.1vw,44px);
  border-radius:24px;
  border:1px solid rgba(184,255,59,.22);
  background-color:#10151a;
  background-image:
    linear-gradient(270deg,rgba(5,8,12,.02) 0%,rgba(5,8,12,.24) 30%,rgba(5,8,12,.77) 62%,rgba(5,8,12,.96) 100%),
    linear-gradient(0deg,rgba(5,8,12,.7),transparent 42%),
    url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=2000&q=90");
  background-size:cover;
  background-position:center 48%;
  box-shadow:0 28px 80px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.07);
  transform:translateZ(0);
}
.hero-card::before{
  opacity:.42;
  background:linear-gradient(115deg,transparent 0 44%,rgba(184,255,59,.06) 50%,transparent 57%);
  background-size:220% 100%;
  animation:hero-sheen 12s ease-in-out infinite;
}
.hero-card::after{font-size:clamp(130px,16vw,230px);color:rgba(255,255,255,.045);-webkit-text-stroke:1px rgba(184,255,59,.12)}
.hero-content{max-width:64%;z-index:3}
.hero-tag{font-size:9px;letter-spacing:1.1px;backdrop-filter:blur(10px)}
.hero-kicker{font-size:10px;letter-spacing:2.5px}
.hero-card h1{font-size:clamp(38px,4.1vw,60px);line-height:1.18;letter-spacing:-1.2px}
.hero-content>p{max-width:420px;color:#c3cbd1;font-size:13px;line-height:2}
.hero-buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.btn-primary,.btn-ghost{min-height:44px;padding:12px 17px;border-radius:12px;font-weight:800}
.btn-primary{box-shadow:0 8px 28px rgba(184,255,59,.16)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(184,255,59,.25)}
.btn-ghost{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px)}
.hero-live-card{backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.15);box-shadow:0 14px 40px rgba(0,0,0,.28)}
.league-pills{display:flex;gap:9px;overflow-x:auto;padding:3px 1px 7px;scrollbar-width:thin;scrollbar-color:rgba(184,255,59,.3) transparent}
.league-pills a,.league-pills button{
  flex:0 0 auto;white-space:nowrap;border-radius:999px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(17,21,27,.92);color:#d7dce0;
  padding:9px 14px;font-size:11px;font-weight:800;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease;
}
.league-pills a:hover,.league-pills button:hover{transform:translateY(-2px);border-color:rgba(184,255,59,.5);color:var(--cinema-lime)}
.match-card{
  border-radius:15px;
  border-color:rgba(255,255,255,.085);
  box-shadow:0 7px 22px rgba(0,0,0,.12),inset 0 1px rgba(255,255,255,.025);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.match-card:hover{transform:translateY(-3px);border-color:rgba(184,255,59,.34);box-shadow:0 14px 28px rgba(0,0,0,.22)}
.match-tools{gap:10px}
.match-search-wrap:focus-within{border-color:rgba(184,255,59,.58)!important;box-shadow:0 0 0 3px rgba(184,255,59,.07)}
.tab,.favorites-filter{transition:all .18s ease}
.tab:hover{color:var(--cinema-lime)}
.league-row,.upcoming-item,.table-link,.broadcaster{min-height:48px}
.league-row:hover{padding-inline:20px}
.text-link{font-weight:800}
.news-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,.28)}
.footer{padding-block:26px}
a,button,input{outline-offset:4px}
button{cursor:pointer}
::selection{background:rgba(184,255,59,.28);color:#fff}
@keyframes hero-sheen{
  0%,65%,100%{background-position:180% 0}
  78%{background-position:-20% 0}
}
@media(min-width:1500px){
  .layout{padding-top:34px}
  .hero-card{min-height:500px}
}
@media(max-width:1120px){
  .layout{grid-template-columns:minmax(190px,.72fr) minmax(0,1.8fr);max-width:1050px}
  .right-column{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .hero-card{min-height:400px}
}
@media(max-width:760px){
  .topline{font-size:9px}
  .header{height:64px;padding-inline:14px;gap:12px}
  .logo{font-size:21px}
  .logo-ball{width:37px;height:37px}
  .main-nav{gap:14px}
  .layout{display:flex;flex-direction:column;padding:14px 12px 38px;gap:14px}
  .center-column,.left-column,.right-column{width:100%;gap:14px}
  .center-column{order:0}
  .left-column{order:1}
  .right-column{order:2;display:flex}
  .hero-card{
    width:100%;min-height:410px;padding:25px 20px 28px;
    border-radius:19px;background-position:58% center;
    background-image:
      linear-gradient(0deg,rgba(5,8,12,.97) 0%,rgba(5,8,12,.77) 42%,rgba(5,8,12,.15) 100%),
      linear-gradient(90deg,rgba(5,8,12,.45),transparent),
      url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=1200&q=85");
  }
  .hero-content{max-width:100%;align-self:flex-end;margin-top:auto}
  .hero-kicker{margin-top:18px;letter-spacing:1.8px;font-size:8px}
  .hero-card h1{font-size:clamp(34px,9vw,45px);margin:10px 0}
  .hero-content>p{font-size:12px;max-width:340px}
  .hero-buttons{margin-top:17px}
  .hero-live-card{top:14px;right:14px;left:auto;max-width:48%}
  .hero-footnote{display:none}
  .league-pills{margin-inline:-1px}
  .match-card{padding:12px}
  .panel-title{padding:16px 15px 12px}
}
@media(max-width:420px){
  .hero-card{min-height:390px;padding:20px 16px}
  .hero-tag{font-size:8px;padding:6px 9px}
  .hero-card h1{font-size:34px}
  .hero-buttons .btn-primary,.hero-buttons .btn-ghost{font-size:10px;padding:11px 12px}
}
@media(prefers-reduced-motion:reduce){
  .hero-card::before{animation:none}
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
}


/* GoalLive visual polish v2 — cinematic hero, clearer hierarchy, responsive finishing */
:root{
  --gl-ink:#080b10;
  --gl-panel:#10151c;
  --gl-line:rgba(255,255,255,.09);
  --gl-muted:#9ca8b2;
  --gl-lime:#b8ff3b;
}
body{
  background-image:
    radial-gradient(ellipse at 82% 8%,rgba(184,255,59,.055),transparent 28%),
    radial-gradient(ellipse at 12% 38%,rgba(30,110,130,.07),transparent 32%),
    linear-gradient(180deg,#080b10 0%,#07090d 60%,#090d12 100%);
}
.header{border-bottom:1px solid rgba(255,255,255,.055)}
.logo{transition:transform .2s ease}
.logo:hover{transform:translateY(-1px)}
.main-nav a{transition:color .18s ease,background .18s ease}
.main-nav a:hover{color:var(--gl-lime)}
.hero-card{
  isolation:isolate;
  overflow:hidden;
  background-image:
    linear-gradient(270deg,rgba(5,8,12,.97) 0%,rgba(5,8,12,.87) 28%,rgba(5,8,12,.43) 56%,rgba(5,8,12,.10) 100%),
    linear-gradient(0deg,rgba(5,8,12,.74) 0%,transparent 48%),
    url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");
  background-position:center,center,left center;
  background-size:cover,cover,auto 125%;
  background-repeat:no-repeat;
}
.hero-card::after{pointer-events:none}
.hero-bg-glow{pointer-events:none}
.hero-content{position:relative}
.hero-card h1{max-width:620px;text-wrap:balance}
.hero-card h1 em{color:var(--gl-lime);font-style:normal;text-shadow:0 0 34px rgba(184,255,59,.13)}
.hero-content>p{max-width:390px}
.hero-live-card{
  background:linear-gradient(145deg,rgba(16,22,29,.84),rgba(8,12,17,.72));
  border-color:rgba(255,255,255,.16);
}
.hero-live-card a{transition:gap .18s ease,color .18s ease}
.hero-live-card a:hover{color:var(--gl-lime)}
.panel,.news-card,.mini-ad{
  background-color:rgba(14,18,24,.88);
  backdrop-filter:blur(12px);
}
.panel-title{border-bottom:1px solid rgba(255,255,255,.035)}
.league-row,.upcoming-item,.broadcaster,.table-link{
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.league-row:hover,.upcoming-item:hover,.broadcaster:hover,.table-link:hover{
  background:rgba(255,255,255,.035);
}
.league-pills a:focus-visible,.btn-primary:focus-visible,.btn-ghost:focus-visible,
.main-nav a:focus-visible,.league-row:focus-visible{
  outline:2px solid var(--gl-lime);
  outline-offset:3px;
}
.match-card{background:linear-gradient(145deg,rgba(19,25,33,.98),rgba(12,16,22,.98))}
.match-card:focus-within{border-color:rgba(184,255,59,.4)}
.tab[aria-selected="true"],.tab.active,.favorites-filter.active{
  box-shadow:0 4px 16px rgba(184,255,59,.09);
}
.section-head{gap:12px}
.footer{border-top:1px solid rgba(255,255,255,.07);color:#8f9aa4}
@media(min-width:1121px){
  .layout{align-items:start}
  .left-column,.right-column{position:relative}
  .hero-card{min-height:clamp(430px,36vw,510px)}
}
@media(max-width:1120px){
  .hero-card{background-size:cover,cover,auto 115%;background-position:center,center,left center}
}
@media(max-width:760px){
  .hero-card{
    background-image:
      linear-gradient(0deg,rgba(5,8,12,.98) 0%,rgba(5,8,12,.87) 39%,rgba(5,8,12,.35) 70%,rgba(5,8,12,.12) 100%),
      linear-gradient(90deg,rgba(5,8,12,.2),rgba(5,8,12,.05)),
      url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");
    background-size:cover,cover,auto 108%;
    background-position:center,center,left top;
  }
  .hero-content{padding-top:230px}
  .hero-live-card{max-width:46%}
  .panel,.news-card,.mini-ad{border-radius:16px}
  .match-card:hover,.news-card:hover{transform:none}
}
@media(max-width:390px){
  .hero-card{background-size:cover,cover,auto 92%;background-position:center,center,left top}
  .hero-content{padding-top:210px}
  .hero-live-card{font-size:11px;padding:10px}
}


/* Verified hero override: target the actual .hero-card.hero-cinematic element. */
.hero-card.hero-cinematic {
  background-image:
    linear-gradient(90deg, rgba(3, 8, 13, .97) 0%, rgba(3, 8, 13, .84) 38%, rgba(3, 8, 13, .30) 72%, rgba(3, 8, 13, .12) 100%),
    linear-gradient(0deg, rgba(3, 8, 13, .68), transparent 62%),
    url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");
  background-repeat: no-repeat;
  background-size: cover, cover, auto 125%;
  background-position: center, center, left center;
}
@media (max-width: 760px) {
  .hero-card.hero-cinematic {
    background-image:
      linear-gradient(0deg, rgba(3, 8, 13, .98) 0%, rgba(3, 8, 13, .74) 47%, rgba(3, 8, 13, .20) 100%),
      linear-gradient(90deg, rgba(3, 8, 13, .20), transparent),
      url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");
    background-size: cover, cover, auto 100%;
    background-position: center, center, left top;
  }
}
@media (max-width: 390px) {
  .hero-card.hero-cinematic { background-size: cover, cover, auto 88%; }
}


/* GoalLive Premium UI pass — layout, imagery, motion and accessibility */
:root{
  --gl-lime:#b8ff45;
  --gl-mint:#46f5b2;
  --gl-surface:rgba(8,22,37,.9);
  --gl-stroke:rgba(151,188,213,.16);
  --gl-soft-shadow:0 22px 58px rgba(0,0,0,.24);
}
html{scroll-behavior:smooth;scroll-padding-top:105px}
body{
  background:
    radial-gradient(ellipse at 52% -18%,rgba(25,99,133,.27),transparent 48%),
    radial-gradient(ellipse at 2% 42%,rgba(184,255,69,.055),transparent 28%),
    #050d18;
  overflow-x:hidden;
}
body:before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.12;
  background-image:radial-gradient(rgba(190,225,242,.22) .65px,transparent .65px);
  background-size:22px 22px;
}
.topline{height:32px;font-size:10px;letter-spacing:.25px}
.header{max-width:1680px;padding-inline:clamp(16px,2.4vw,38px);gap:clamp(18px,2.2vw,38px)}
.logo{transition:transform .22s ease}
.logo:hover{transform:translateY(-1px)}
.logo-ball{border-radius:15px;background:linear-gradient(145deg,#173a4c,#081c2e)}
.main-nav a{transition:color .2s ease}
.round-btn,.date-picker button,.favorites-filter,.tab,.refresh-btn{
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.round-btn:hover,.date-picker button:hover,.favorites-filter:hover,.tab:hover,.refresh-btn:hover{transform:translateY(-2px);border-color:rgba(184,255,69,.55);box-shadow:0 8px 22px rgba(0,0,0,.18)}
.layout{max-width:1680px;padding:clamp(16px,2.2vw,34px);gap:clamp(14px,1.35vw,22px);grid-template-columns:minmax(220px,.78fr) minmax(420px,2.05fr) minmax(260px,.92fr)}
.left-column,.right-column,.center-column{gap:20px}
.panel{
  border-radius:20px;
  background:linear-gradient(150deg,rgba(12,31,50,.97),rgba(5,15,28,.97));
  border:1px solid var(--gl-stroke);
  box-shadow:0 14px 40px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.025);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.panel:hover{transform:translateY(-2px);border-color:rgba(184,255,69,.24);box-shadow:0 22px 48px rgba(0,0,0,.22),0 0 0 1px rgba(184,255,69,.025)}
.panel-title{gap:12px}
.panel-title h2,.section-head h2{letter-spacing:-.35px}
.mini-label{color:#9bb3c7;letter-spacing:1.15px}
.title-icon{border:1px solid rgba(184,255,69,.14);background:rgba(184,255,69,.06);border-radius:12px}
.hero-card.hero-cinematic{
  min-height:clamp(410px,34vw,520px);
  border-radius:26px;
  border:1px solid rgba(184,255,69,.28);
  box-shadow:0 28px 75px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08);
  background-image:
    linear-gradient(90deg,rgba(3,8,13,.98) 0%,rgba(3,8,13,.88) 34%,rgba(3,8,13,.38) 65%,rgba(3,8,13,.12) 100%),
    linear-gradient(0deg,rgba(3,8,13,.68),transparent 62%),
    url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");
  background-repeat:no-repeat;
  background-size:cover,cover,auto 125%;
  background-position:center,center,left center;
  animation:glHeroReveal .8s cubic-bezier(.2,.7,.2,1) both;
}
.hero-card.hero-cinematic:before{
  opacity:.5;
  background:linear-gradient(115deg,transparent 0 28%,rgba(184,255,69,.07) 48%,transparent 70%),repeating-linear-gradient(0deg,transparent 0 34px,rgba(190,225,242,.025) 35px);
}
.hero-card.hero-cinematic:after{font-size:clamp(140px,18vw,250px);color:rgba(255,255,255,.035);-webkit-text-stroke:1px rgba(184,255,69,.13)}
.hero-photo{background-image:none!important;pointer-events:none}
.hero-content{max-width:66%;padding:clamp(28px,3.2vw,48px);position:relative;z-index:2}
.hero-tag{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid rgba(184,255,69,.22);border-radius:999px;background:rgba(3,12,21,.55);backdrop-filter:blur(12px);font-size:10px;letter-spacing:1.1px}
.hero-kicker{font-size:clamp(10px,.85vw,12px);letter-spacing:2px;color:var(--gl-lime);font-weight:800;margin-top:20px}
.hero-card h1{font-size:clamp(39px,4.2vw,64px);line-height:1.18;letter-spacing:-1.2px;margin:12px 0 14px;text-wrap:balance}
.hero-card h1 em{color:var(--gl-lime);text-shadow:0 0 35px rgba(184,255,69,.17)}
.hero-card p{max-width:500px;color:#c1d0dc;font-size:clamp(12px,1vw,14px);line-height:1.95}
.hero-buttons{gap:10px;margin-top:24px}
.btn-primary{background:linear-gradient(115deg,#c8ff64,#8fe92c);color:#0a1720;border:1px solid rgba(240,255,210,.7);border-radius:13px;box-shadow:0 12px 28px rgba(151,231,54,.17);font-weight:900;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.btn-primary:hover{transform:translateY(-3px);filter:saturate(1.08);box-shadow:0 17px 35px rgba(151,231,54,.25)}
.btn-ghost{border-radius:13px;border:1px solid rgba(214,234,245,.2);background:rgba(4,14,25,.48);backdrop-filter:blur(8px);transition:background .2s ease,border-color .2s ease}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.38)}
.hero-live-card{border:1px solid rgba(184,255,69,.23);border-radius:18px;background:linear-gradient(145deg,rgba(6,18,30,.84),rgba(6,18,30,.58));backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(0,0,0,.2);animation:glFloat 5.5s ease-in-out infinite}
.live-badge{border-radius:999px;letter-spacing:.65px}
.hero-footnote{border-top:1px solid rgba(255,255,255,.09);color:#9bb0c2}
.league-pills{gap:9px;padding:3px 1px 5px}
.league-pills a{border:1px solid rgba(133,168,194,.17);background:rgba(10,26,43,.78);border-radius:999px;padding:9px 15px;white-space:nowrap;transition:transform .2s ease,border-color .2s ease,color .2s ease,background .2s ease}
.league-pills a:hover{transform:translateY(-2px);border-color:rgba(184,255,69,.42);color:#eaffc8}
.league-pills a.active{background:rgba(184,255,69,.1);border-color:rgba(184,255,69,.4);color:var(--gl-lime);box-shadow:inset 0 0 18px rgba(184,255,69,.035)}
.league-row,.table-link,.broadcaster,.upcoming-item{border-radius:13px;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.league-row:hover,.table-link:hover,.broadcaster:hover,.upcoming-item:hover{transform:translateX(-3px);background:rgba(184,255,69,.055);border-color:rgba(184,255,69,.2)}
.league-badge,.table-crest{box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 5px 12px rgba(0,0,0,.12)}
.league-badge.purple{background:linear-gradient(145deg,#5b46a5,#2b2754)}
.league-badge.rainbow{background:linear-gradient(145deg,#f4a7ca,#7148a0 55%,#f4c74d)}
.league-badge.blue{background:linear-gradient(145deg,#1c9be0,#174e9b)}
.league-badge.red{background:linear-gradient(145deg,#ef5151,#982c3c)}
.league-badge.gold{background:linear-gradient(145deg,#f2d48a,#9b742d)}
.fixtures-panel{overflow:hidden}
.fixture-heading{align-items:center}
.date-picker{display:flex;gap:6px;align-items:center}
.date-picker button{border-radius:10px;min-width:35px;min-height:35px}
.match-tools{gap:10px}
.match-search-wrap{border-radius:13px;border:1px solid rgba(133,168,194,.18);background:rgba(3,12,22,.62);transition:border-color .2s ease,box-shadow .2s ease}
.match-search-wrap:focus-within{border-color:rgba(184,255,69,.55);box-shadow:0 0 0 3px rgba(184,255,69,.07)}
.match-search-wrap input{color:#f4f8fc}
.favorites-filter{border-radius:12px}
.fixture-tabs{gap:7px;flex-wrap:wrap}
.fixture-tabs .tab{border-radius:10px;padding:8px 12px}
.fixture-tabs .tab.active{background:rgba(184,255,69,.1);border-color:rgba(184,255,69,.28);color:var(--gl-lime)}
.refresh-btn{border-radius:10px}
.status-message{border-radius:12px}
.matches-list{gap:10px}
.match-card,.match-item,.fixture-card,.match-row{border-radius:15px;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}
.match-card:hover,.match-item:hover,.fixture-card:hover,.match-row:hover{transform:translateY(-2px);border-color:rgba(184,255,69,.24);box-shadow:0 14px 28px rgba(0,0,0,.16)}
.news-grid{gap:13px}
.news-card{border:1px solid rgba(133,168,194,.15);border-radius:17px;overflow:hidden;background:linear-gradient(150deg,rgba(13,31,49,.96),rgba(6,17,30,.98));transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.news-card:hover{transform:translateY(-4px);border-color:rgba(184,255,69,.26);box-shadow:0 18px 40px rgba(0,0,0,.2)}
.news-art{min-height:132px;position:relative;overflow:hidden}
.news-art:before{content:"";position:absolute;inset:0;opacity:.22;background:repeating-linear-gradient(135deg,transparent 0 16px,rgba(255,255,255,.18) 17px,transparent 18px)}
.news-art span{filter:drop-shadow(0 12px 18px rgba(0,0,0,.25))}
.news-art i{letter-spacing:3px;font-weight:900}
.live-placeholder{border-radius:14px}
.channel-logo{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 7px 16px rgba(0,0,0,.15)}
.footer{border-top:1px solid rgba(133,168,194,.13)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gl-lime);outline-offset:3px}
@keyframes glHeroReveal{from{opacity:0;transform:translateY(9px) scale(.995)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes glFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:1180px){
 .layout{grid-template-columns:minmax(190px,.75fr) minmax(380px,1.6fr)}
 .right-column{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
 .hero-card.hero-cinematic{min-height:440px}
}
@media(max-width:850px){
 .header{height:68px;gap:12px}
 .main-nav{gap:13px;font-size:11px}
 .layout{padding:16px;grid-template-columns:minmax(0,1fr);gap:16px}
 .center-column{order:1}.left-column{order:2}.right-column{order:3;grid-column:auto}
 .left-column,.right-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
 .hero-card.hero-cinematic{min-height:470px;background-size:cover,cover,auto 100%;background-position:center,center,left top}
 .hero-content{max-width:78%;padding:28px}
 .hero-live-card{top:14px;left:14px}
}
@media(max-width:640px){
 .topline{font-size:9px}
 .header{padding-inline:13px}
 .logo{font-size:21px;gap:8px}
 .logo-ball{width:38px;height:38px}
 .main-nav{display:none}
 .mobile-only{display:inline-grid;place-items:center}
 .layout{padding:12px;gap:14px}
 .left-column,.right-column{display:flex}
 .center-column{gap:14px}
 .panel{border-radius:17px;padding:16px}
 .hero-card.hero-cinematic{min-height:500px;border-radius:21px;background-image:linear-gradient(0deg,rgba(3,8,13,.98) 0%,rgba(3,8,13,.77) 46%,rgba(3,8,13,.18) 100%),linear-gradient(90deg,rgba(3,8,13,.18),transparent),url("https://wallpapers.com/images/hd/cr7-ronaldo-back-dibc9onjmkdaf0be.jpg");background-size:cover,cover,auto 92%;background-position:center,center,left top}
 .hero-content{max-width:100%;padding:255px 19px 38px}
 .hero-tag{font-size:8px;padding:7px 10px}
 .hero-kicker{margin-top:14px;font-size:9px;letter-spacing:1.5px}
 .hero-card h1{font-size:clamp(34px,9vw,47px);margin:9px 0 12px}
 .hero-card p{font-size:12px;max-width:100%}
 .hero-buttons{display:flex;flex-wrap:wrap;margin-top:18px}
 .btn-primary,.btn-ghost{padding:11px 13px;font-size:11px}
 .hero-live-card{top:12px;left:12px;width:155px;padding:11px}
 .hero-live-card b{font-size:12px}
 .hero-live-card small{font-size:9px}
 .hero-footnote{font-size:9px;padding-inline:16px}
 .league-pills{overflow-x:auto;padding-bottom:7px;scrollbar-width:thin}
 .league-pills a{flex:0 0 auto;font-size:11px;padding:8px 12px}
 .fixture-heading{align-items:flex-start;gap:10px}
 .fixture-heading h2{font-size:19px}
 .match-tools{flex-wrap:wrap}
 .match-search-wrap{min-width:0;flex:1 1 100%}
 .favorites-filter{width:100%;justify-content:center}
 .fixture-tabs{display:flex;overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px;scrollbar-width:thin}
 .fixture-tabs>*{flex:0 0 auto}
 .news-grid{grid-template-columns:1fr}
 .news-art{min-height:116px}
 .right-column{gap:14px}
 .footer{padding:24px 16px}
}
@media(max-width:390px){
 .hero-card.hero-cinematic{min-height:470px;background-size:cover,cover,auto 82%}
 .hero-content{padding:228px 16px 30px}
 .hero-card h1{font-size:33px}
 .hero-live-card{width:144px}
 .date-picker button{min-width:30px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* Match watch CTA + clearer contrast pass */
:root { --watch-green: #b8ff3b; }
.panel, .news-card, .match-card, .league-row, .table-link, .broadcaster {
  background-color: #101720;
}
.panel {
  background: linear-gradient(145deg, #111923 0%, #0b1119 100%);
  border-color: #2a3541;
}
.panel-description, .news-copy p, .hero-content > p { color: #d5dce2; }
.league-row, .table-link, .broadcaster {
  background: linear-gradient(100deg, #121b25, #0d141d);
  border-color: #293541;
}
.match-card {
  background: linear-gradient(110deg, #142131 0%, #0d1723 100%);
  border-color: #354555;
}
.match-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.watch-match-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid rgba(184,255,59,.7);
  border-radius: 8px;
  background: linear-gradient(135deg, #c6ff63, #a6ef26);
  color: #10170a !important;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 900;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(184,255,59,.12);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.watch-match-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 8px 22px rgba(184,255,59,.2);
}
.watch-match-btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.match-bottom { gap: 9px; flex-wrap: wrap; }
.match-bottom .match-time { color: #c5d0da; }
.official-link { color: #d0dce6; }
.hero-card.hero-cinematic { background-color: #101820; }
.hero-card.hero-cinematic:before {
  background:
    linear-gradient(90deg, rgba(3,7,11,.94) 0%, rgba(3,7,11,.74) 42%, rgba(3,7,11,.16) 100%),
    linear-gradient(0deg, rgba(3,7,11,.55), transparent 72%);
}
.hero-live-card { display: none !important; }
#phase-live-strip { display: none !important; }
#phase-date-banner {
  background: linear-gradient(100deg, #162431, #101a25);
  border-color: #354654;
}
.live-panel, .table-panel, .watch-panel { background: linear-gradient(145deg, #111a24, #0b121a); }
@media (max-width: 520px) {
  .match-actions { width: 100%; justify-content: stretch; }
  .match-actions .watch-match-btn { flex: 1 1 100%; }
  .match-actions .official-link { flex: 1; text-align: center; }
}


/* Faster path to official streaming platforms */
.watch-secondary-btn {
 display:inline-flex;align-items:center;justify-content:center;
 padding:8px 10px;border:1px solid #3b5367;border-radius:8px;
 background:#182737;color:#e4edf5!important;font-size:10px;font-weight:800;
 white-space:nowrap;transition:background .18s,border-color .18s,transform .18s;
}
.watch-secondary-btn:hover {background:#20384b;border-color:#65849d;transform:translateY(-1px)}
.match-actions {gap:7px}
.match-actions .official-link {font-size:9px}
@media(max-width:520px) {
 .match-actions .watch-match-btn,.match-actions .watch-secondary-btn {flex:1 1 100%}
}


/* GoalLive hero refresh: replace the Ronaldo wallpaper with an immersive stadium scene. */
.hero-card.hero-cinematic{background-image:linear-gradient(90deg,rgba(3,8,13,.94) 0%,rgba(3,8,13,.72) 42%,rgba(3,8,13,.18) 100%),linear-gradient(0deg,rgba(3,8,13,.76),transparent 65%),url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=2000&q=90")!important;background-size:cover,cover,cover!important;background-position:center,center,center 48%!important;}
.hero-card.hero-cinematic:before{background:linear-gradient(90deg,rgba(3,8,13,.72),rgba(3,8,13,.12) 88%),linear-gradient(0deg,rgba(3,8,13,.5),transparent 70%)!important;}
@media(max-width:760px){.hero-card.hero-cinematic{background-image:linear-gradient(0deg,rgba(3,8,13,.98) 0%,rgba(3,8,13,.65) 53%,rgba(3,8,13,.12) 100%),url("https://images.unsplash.com/photo-1522778119026-d647f0596c20?auto=format&fit=crop&w=1200&q=85")!important;background-size:cover,cover!important;background-position:center,center!important;}}


/* GoalLive hero refresh: cinematic Ronaldo portrait, stadium lights, clean text-safe gradient. */
.hero-card.hero-cinematic{background-image:linear-gradient(90deg,rgba(3,8,14,.98) 0%,rgba(3,8,14,.88) 38%,rgba(3,8,14,.34) 67%,rgba(3,8,14,.12) 100%),linear-gradient(0deg,rgba(3,8,14,.62),transparent 68%),url("https://www.ronaldothefilm.com/wp-content/uploads/2024/08/what-religion-is-cristiano-ronaldo-Gw.jpeg")!important;background-size:cover,cover,auto 155%!important;background-repeat:no-repeat!important;background-position:center,center,right 25%!important;}
.hero-card.hero-cinematic:before{background:linear-gradient(90deg,rgba(3,8,14,.45),rgba(3,8,14,.04) 85%),linear-gradient(0deg,rgba(3,8,14,.32),transparent 72%)!important;}
@media(max-width:760px){.hero-card.hero-cinematic{background-image:linear-gradient(0deg,rgba(3,8,14,.98) 0%,rgba(3,8,14,.78) 52%,rgba(3,8,14,.12) 100%),url("https://www.ronaldothefilm.com/wp-content/uploads/2024/08/what-religion-is-cristiano-ronaldo-Gw.jpeg")!important;background-size:cover,auto 78%!important;background-position:center,right top!important;}}

/* Final visual repair: real Ronaldo hero photo, layered above the card background */
.hero-card.hero-cinematic{isolation:isolate;position:relative;overflow:hidden;background-color:#04101c!important;background-image:linear-gradient(90deg,rgba(3,9,17,.96) 0%,rgba(3,9,17,.84) 36%,rgba(3,9,17,.42) 64%,rgba(3,9,17,.18) 100%),linear-gradient(0deg,rgba(3,9,17,.84) 0%,transparent 72%),url("https://commons.wikimedia.org/wiki/Special:FilePath/Cristiano_Ronaldo_Croatia_v_Portugal_2_July_2026-070.jpg?width=1400")!important;background-repeat:no-repeat!important;background-size:cover,cover,cover!important;background-position:center,center,center 32%!important;box-shadow:0 28px 70px rgba(0,0,0,.38),inset 0 0 0 1px rgba(120,255,205,.13)!important}
.hero-card.hero-cinematic::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(115deg,rgba(2,9,17,.22),transparent 55%),radial-gradient(ellipse at 80% 20%,rgba(66,213,171,.12),transparent 35%)}
.hero-card.hero-cinematic::after{z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(2,8,15,.65),transparent 38%),linear-gradient(90deg,rgba(2,8,15,.12),transparent 72%)!important}
.hero-card.hero-cinematic .hero-photo{display:none!important}.hero-card.hero-cinematic .hero-bg-glow{z-index:1;pointer-events:none;opacity:.6}.hero-card.hero-cinematic .hero-content{z-index:3;position:relative;max-width:66%;text-shadow:0 2px 15px rgba(0,0,0,.32)}.hero-card.hero-cinematic .hero-footnote{z-index:3;color:#c2d4df}
.league-badge img{z-index:2;background:transparent;object-fit:contain}.league-badge{isolation:isolate}.league-badge img+*{position:relative;z-index:1}.league-badge img{background:transparent!important}.competition-crest{width:18px;height:18px;padding:1px;object-fit:contain;border-radius:4px;background:rgba(255,255,255,.05)}.team-crest{width:34px;height:34px;padding:3px;object-fit:contain;border-radius:9px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));filter:drop-shadow(0 3px 6px rgba(0,0,0,.25));}
.match-card{border-color:rgba(110,155,184,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 7px 22px rgba(0,0,0,.10)}.match-card:hover{border-color:rgba(69,255,173,.45);box-shadow:0 12px 30px rgba(0,0,0,.20),0 0 22px rgba(69,255,173,.045)}.panel{box-shadow:0 16px 44px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.025)}.header{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.match-card,.panel,.hero-card,.league-row,.table-link,.broadcaster{transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
@media(max-width:760px){.hero-card.hero-cinematic{min-height:390px;background-image:linear-gradient(0deg,rgba(3,9,17,.96) 0%,rgba(3,9,17,.76) 45%,rgba(3,9,17,.20) 100%),url("https://commons.wikimedia.org/wiki/Special:FilePath/Cristiano_Ronaldo_Croatia_v_Portugal_2_July_2026-070.jpg?width=1000")!important;background-size:cover,cover!important;background-position:center,58% 25%!important}.hero-card.hero-cinematic .hero-content{max-width:100%;text-shadow:0 2px 18px rgba(0,0,0,.5)}.hero-card.hero-cinematic .hero-footnote{left:14px;right:14px;text-align:center}.team-crest{width:29px;height:29px;padding:2px}}
@media(prefers-reduced-motion:reduce){.match-card,.panel,.hero-card,.league-row,.table-link,.broadcaster{transition:none!important}}