:root{
  --color-primary-rgb:0 166 81;
  --color-accent-rgb:255 221 0;
  --gradient-primary:linear-gradient(135deg,#00a651 0%,#ffdd00 50%,#009cde 100%);
}
html.dark{
  --color-primary-rgb:0 166 81;
  --color-accent-rgb:255 221 0;
  --gradient-primary:linear-gradient(135deg,#00a651 0%,#ffdd00 50%,#009cde 100%);
}
html,body{
  color-scheme:dark;
  background:#064e2a!important;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(60% 40% at 20% 10%,rgba(34,197,94,.18),rgba(0,0,0,0) 60%),
    radial-gradient(50% 35% at 80% 0%,rgba(255,221,0,.16),rgba(0,0,0,0) 60%),
    radial-gradient(55% 40% at 70% 90%,rgba(0,166,81,.24),rgba(0,0,0,0) 60%),
    linear-gradient(180deg,rgba(11,95,45,.94) 0%,rgba(6,78,42,.97) 58%,rgba(3,52,28,1) 100%);
}
#root{
  position:relative;
  z-index:1;
}
.bg-background{
  background-color:#064e2a!important;
}
.bg-card{
  background-color:rgba(5,54,30,.82)!important;
}
.bg-card\/50{
  background-color:rgba(9,77,39,.62)!important;
}
.bg-muted{
  background-color:rgba(12,96,48,.52)!important;
}
.border-border{
  border-color:rgba(110,231,183,.16)!important;
}
.text-muted-foreground{
  color:rgba(220,252,231,.76)!important;
}
.worldcup-confetti{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:45;
  contain:layout paint style;
}
.worldcup-confetti span{
  position:absolute;
  top:-12vh;
  left:var(--x);
  width:var(--size);
  height:var(--size);
  background:var(--c);
  opacity:var(--o);
  transform:translate3d(0,-12vh,0) rotate(0deg);
  animation:wc-fall var(--dur) linear infinite;
  animation-delay:var(--delay);
  filter:drop-shadow(0 0 6px rgba(0,0,0,.25));
}
.worldcup-confetti.is-paused span{
  animation-play-state:paused;
}
.worldcup-confetti span.wc-circle{
  border-radius:9999px;
}
.worldcup-confetti span.wc-ribbon{
  width:calc(var(--size) * .55);
  height:calc(var(--size) * 1.6);
  border-radius:6px;
}
@keyframes wc-fall{
  0%{transform:translate3d(0,-12vh,0) rotate(0deg)}
  100%{transform:translate3d(var(--drift),112vh,0) rotate(720deg)}
}
@media (prefers-reduced-motion:reduce){
  .worldcup-confetti{display:none}
}
@media (max-width:767px){
  body::before{
    background:linear-gradient(180deg,rgba(11,95,45,.96) 0%,rgba(6,78,42,.98) 60%,rgba(3,52,28,1) 100%);
  }
  .worldcup-confetti{
    display:none!important;
  }
}

:root {
  --color-lane: linear-gradient(to top, rgba(0,166,81,0.2), rgba(0,0,0,0.4)) !important;
  --color-lane-alt: linear-gradient(to top, rgba(255,221,0,0.1), rgba(0,0,0,0.3)) !important;
  --color-lane-divider: rgba(255,255,255,0.1) !important;
  --gradient-track: linear-gradient(to top, #03301a, #01140b) !important;
  --gradient-tile: linear-gradient(180deg, #ffdd00 0%, #00a651 100%) !important;
  --shadow-tile: 0 0 15px rgba(0,166,81,0.5) !important;
  --shadow-glow: 0 0 20px rgba(255,221,0,0.3) !important;
}

html.dark {
  --color-lane: linear-gradient(to top, rgba(0,166,81,0.2), rgba(0,0,0,0.4)) !important;
  --color-lane-alt: linear-gradient(to top, rgba(255,221,0,0.1), rgba(0,0,0,0.3)) !important;
  --color-lane-divider: rgba(255,255,255,0.1) !important;
  --gradient-track: linear-gradient(to top, #03301a, #01140b) !important;
  --gradient-tile: linear-gradient(180deg, #ffdd00 0%, #00a651 100%) !important;
  --shadow-tile: 0 0 15px rgba(0,166,81,0.5) !important;
  --shadow-glow: 0 0 20px rgba(255,221,0,0.3) !important;
}

:root, html.dark {
  --background: #064e2a !important;
  --card: #05361e !important;
  --muted: #0c6030 !important;
  --border: rgba(110,231,183,0.16) !important;
}