:root{
  --accent-cyan:#47dfe5;
  --accent-blue:#56bee8;
  --accent-violet:#a66bd7;
  --accent-magenta:#d36dbc;
  --accent-flow:linear-gradient(108deg,var(--accent-cyan) 0%,var(--accent-blue) 32%,var(--accent-violet) 72%,var(--accent-magenta) 100%);
  --accent-flow-soft:linear-gradient(112deg,rgba(71,223,229,.23) 0%,rgba(86,190,232,.18) 35%,rgba(166,107,215,.21) 75%,rgba(211,109,188,.13) 100%);
}

body::before{
  position:fixed;
  z-index:0;
  inset:0;
  background:
    radial-gradient(ellipse at 5% 4%,rgba(51,211,224,.13),transparent 33%),
    radial-gradient(ellipse at 95% 10%,rgba(149,91,211,.15),transparent 35%),
    radial-gradient(ellipse at 78% 90%,rgba(205,91,185,.07),transparent 35%);
  content:"";
  pointer-events:none;
}

.brand b,.eyebrow{
  color:var(--accent);
  background-image:var(--accent-flow);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 12px rgba(71,223,229,.12),0 0 16px rgba(166,107,215,.12);
}

.day-weekday{
  color:var(--accent);
  background-image:var(--accent-flow);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:650;
  text-shadow:0 0 12px rgba(71,223,229,.14),0 0 15px rgba(166,107,215,.15);
}

.app-tabs a[aria-current="page"]{
  color:#f0f4ff;
  background:var(--accent-flow-soft);
  box-shadow:inset 0 0 0 1px rgba(160,171,213,.24),0 0 18px rgba(118,112,207,.1);
}

.hero{
  border-color:rgba(132,133,197,.56);
  background-image:
    radial-gradient(ellipse at 0% 0%,rgba(71,223,229,.16),transparent 56%),
    radial-gradient(ellipse at 100% 100%,rgba(166,107,215,.19),transparent 58%),
    linear-gradient(110deg,#142536 0%,#111727 53%,#271a38 100%);
  box-shadow:0 14px 38px rgba(67,43,119,.12),inset 0 1px rgba(105,215,227,.08);
}

.members-banner,#loginPanel{
  border-color:rgba(143,119,194,.48)!important;
  background-image:
    radial-gradient(ellipse at 5% 100%,rgba(71,223,229,.15),transparent 48%),
    radial-gradient(ellipse at 95% 0%,rgba(166,107,215,.19),transparent 50%),
    linear-gradient(145deg,rgba(19,28,49,.97),rgba(11,15,29,.98) 68%)!important;
}

.panel,.card,.player-profile-card,.online-panel,.rsvp-row,.tactics-details,.formcard{
  border-color:rgba(111,132,185,.45);
  background-image:
    radial-gradient(ellipse at 0% 0%,rgba(71,223,229,.065),transparent 54%),
    radial-gradient(ellipse at 100% 100%,rgba(166,107,215,.085),transparent 58%),
    linear-gradient(150deg,var(--panel2),var(--panel));
  box-shadow:0 12px 32px rgba(6,8,20,.22),0 0 20px rgba(106,83,173,.07);
}

.grid .card:nth-child(odd){
  background-image:radial-gradient(ellipse at 0% 0%,rgba(71,223,229,.12),transparent 64%),radial-gradient(ellipse at 100% 100%,rgba(166,107,215,.07),transparent 58%),linear-gradient(150deg,var(--panel2),var(--panel));
}
.grid .card:nth-child(even){
  background-image:radial-gradient(ellipse at 100% 0%,rgba(166,107,215,.13),transparent 64%),radial-gradient(ellipse at 0% 100%,rgba(71,223,229,.065),transparent 58%),linear-gradient(150deg,var(--panel2),var(--panel));
}

.forecast-card{
  border-color:rgba(113,146,198,.62);
  background-image:radial-gradient(ellipse at 0% 0%,rgba(71,223,229,.18),transparent 52%),radial-gradient(ellipse at 100% 100%,rgba(166,107,215,.22),transparent 54%),linear-gradient(115deg,#152b41,#121a2b 62%,#241b37);
  box-shadow:0 12px 30px rgba(6,8,20,.22),0 0 24px rgba(122,91,197,.1);
}

.button:not(.secondary),#loginForm .button:not(.secondary){
  color:#101323;
  background-image:var(--accent-flow);
  box-shadow:0 6px 20px rgba(71,223,229,.13),0 7px 23px rgba(166,107,215,.15);
}
.button:not(.secondary):hover:not(:disabled),#loginForm .button:not(.secondary):hover:not(:disabled){
  filter:brightness(1.08);
  box-shadow:0 8px 24px rgba(71,223,229,.2),0 9px 28px rgba(166,107,215,.2);
}

.members-banner .members-accent{width:48px;height:4px;background:var(--accent-flow);box-shadow:0 0 16px rgba(71,223,229,.24),0 0 20px rgba(166,107,215,.2)}
.members-banner h1,.hero h1{
  background-image:linear-gradient(105deg,#bdf8f5 0%,#f3f8ff 34%,#f1e9fb 62%,#c89ae8 100%);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 20px rgba(71,223,229,.12),0 0 26px rgba(166,107,215,.16);
}
.members-banner p{
  background-image:linear-gradient(100deg,#a8f1f1 0%,#f3f8ff 35%,#e6d5f6 68%,#d596dd 100%)!important;
  text-shadow:0 0 12px rgba(71,223,229,.15),0 0 14px rgba(166,107,215,.15);
}

.online-panel{
  border-color:rgba(135,111,194,.43);
  box-shadow:inset 3px 0 0 rgba(71,223,229,.55),0 0 22px rgba(166,107,215,.1);
}
.online-dot{background:var(--accent-flow);box-shadow:0 0 10px rgba(71,223,229,.55),0 0 16px rgba(166,107,215,.45)}
.profile-tag,.online-count{
  background-image:var(--accent-flow);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 14px rgba(71,223,229,.13),0 0 18px rgba(166,107,215,.15);
}
.online-tags li{border-color:rgba(117,131,186,.48);background:linear-gradient(110deg,rgba(71,223,229,.09),rgba(166,107,215,.12))}

.field input:focus,.field select:focus,.input-with-icon:focus-within{
  border-color:rgba(126,157,218,.9)!important;
  box-shadow:0 0 0 3px rgba(71,223,229,.12),0 0 20px rgba(166,107,215,.13)!important;
}
.account-icon{box-shadow:0 0 14px rgba(71,223,229,.1),0 0 18px rgba(166,107,215,.13)}
.hero h1#clubName{
  background-image:linear-gradient(105deg,#a8f2f2 0%,#f3f8ff 31%,#f1e9fb 61%,#bd8ce0 100%);
  text-shadow:0 0 21px rgba(71,223,229,.16),0 0 30px rgba(166,107,215,.22);
}

.members-banner{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:rgba(111,151,202,.62);
  box-shadow:0 16px 38px rgba(10,9,30,.3),0 0 24px rgba(71,223,229,.08),0 0 30px rgba(166,107,215,.13);
}
.members-banner::before{
  position:absolute;
  z-index:0;
  inset:0;
  background:linear-gradient(112deg,transparent 10%,rgba(255,255,255,.045) 39%,rgba(71,223,229,.11) 49%,rgba(166,107,215,.08) 60%,transparent 76%);
  content:"";
  pointer-events:none;
}
.members-banner>*{position:relative;z-index:1}
.members-banner h1#membersOnlyTitle{
  background-image:linear-gradient(100deg,#8beaf0 0%,#f1f8ff 34%,#f3edfb 62%,#c18ce7 100%);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 16px rgba(71,223,229,.2),0 0 26px rgba(166,107,215,.24);
}
.members-banner p{
  background-image:linear-gradient(100deg,#8cecf0 0%,#f3f8ff 35%,#eee3fb 66%,#d99ae9 100%)!important;
  text-shadow:0 0 12px rgba(71,223,229,.26),0 0 20px rgba(166,107,215,.24);
}
.members-banner .members-accent{
  width:54px;
  height:4px;
  box-shadow:0 0 12px rgba(71,223,229,.45),0 0 22px rgba(166,107,215,.36);
}

#loginPanel{
  box-shadow:0 20px 48px rgba(5,8,20,.36),0 0 24px rgba(71,223,229,.07),0 0 32px rgba(166,107,215,.1);
}
#loginPanel::before{
  position:absolute;
  z-index:0;
  top:0;
  right:20px;
  left:20px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(71,223,229,.85),rgba(166,107,215,.85),transparent);
  box-shadow:0 0 12px rgba(119,173,230,.28);
  content:"";
  pointer-events:none;
}
.input-with-icon{
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 0 16px rgba(71,223,229,.035),0 0 20px rgba(166,107,215,.045);
}
#loginForm .button:not(.secondary){
  border:1px solid rgba(255,255,255,.25);
  background-image:linear-gradient(180deg,rgba(255,255,255,.22),transparent 52%),var(--accent-flow);
  box-shadow:0 7px 22px rgba(71,223,229,.2),0 8px 25px rgba(166,107,215,.2);
}
#loginForm .button:focus-visible{outline:2px solid var(--accent-cyan);outline-offset:3px}