:root{
  --navy:#071a36;--navy2:#0d2850;--blue:#2563eb;--blue2:#60a5fa;--grey:#64748b;--grey2:#cbd5e1;
  --cream:#eef2f7;--white:#fff;--ink:#152033;--muted:#697386;--line:#e7e2da;
  --shadow:0 18px 50px rgba(7,26,54,.12);--radius:20px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;background:radial-gradient(circle at 12% 8%,#2563eb55 0,transparent 30%),radial-gradient(circle at 88% 18%,#f9731644 0,transparent 28%),linear-gradient(135deg,#050b1c,#101f46 48%,#24152a);color:var(--ink);background-attachment:fixed}
a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}
.topbar{height:76px;background:linear-gradient(90deg,#0b1228,#1d4ed8 48%,#64748b);color:white;display:flex;align-items:center;padding:0 5%;gap:28px;position:sticky;top:0;z-index:20;box-shadow:0 5px 25px #0002}
.brand{display:flex;align-items:center;gap:10px;font-family:"Orbitron",sans-serif;font-weight:900;font-size:1.2rem;letter-spacing:.04em;white-space:nowrap}.brand-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#bfdbfe,#2563eb 55%,#475569);font-size:.8rem}
nav{display:flex;gap:24px;margin:auto;font-size:.92rem;color:#dbe6f5}nav a:hover{color:white}
.join-btn,.primary-btn{border:1px solid #bfdbfe;background:linear-gradient(135deg,#2563eb,#60a5fa 55%,#64748b);color:white;padding:12px 18px;border-radius:10px;font-weight:800;cursor:pointer;box-shadow:0 8px 20px #2563eb30}.join-btn:hover,.primary-btn:hover{background:var(--blue2);transform:translateY(-1px)}
.secondary-btn,.outline-btn{border:1px solid #ffffff55;background:transparent;color:inherit;padding:12px 18px;border-radius:10px;font-weight:800;cursor:pointer}.outline-btn{border-color:#c9c4bc;color:var(--ink);background:white}.outline-btn:hover{border-color:var(--blue);color:var(--blue)}
.menu-toggle{display:none;background:none;color:white;border:0;font-size:1.5rem}
.hero{min-height:520px;padding:70px 8%;display:grid;grid-template-columns:1.35fr .65fr;gap:50px;align-items:center;background:radial-gradient(circle at 75% 35%,#a9c6d655,transparent 27%),linear-gradient(125deg,#17222e,#46677f 52%,#7c8389);position:relative;isolation:isolate;color:white;overflow:hidden}
.eyebrow{font-size:.72rem;font-weight:900;letter-spacing:.16em;color:var(--blue);display:block;margin-bottom:12px}.hero h1{font-family:"Orbitron",sans-serif;text-shadow:0 0 22px #93c5fd66;font-size:clamp(2.8rem,6vw,5.8rem);line-height:.95;margin:0 0 24px;letter-spacing:-.06em}.hero h1 span{color:var(--blue)}.hero p{max-width:650px;color:#c7d3e4;font-size:1.1rem;line-height:1.7}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.hero-card{background:linear-gradient(145deg,#ffffff25,#94a3b825);border:1px solid #bfdbfe66;border-radius:28px;padding:40px;text-align:center;backdrop-filter:blur(10px);box-shadow:var(--shadow);transform:rotate(3deg)}.orbit-placeholder{width:130px;height:130px;margin:auto auto 22px;border-radius:50%;display:grid;place-items:center;font-size:4rem;color:white;background:linear-gradient(145deg,var(--blue),var(--grey));border:7px solid #fff3;box-shadow:inset 0 0 0 8px #0002}.hero-card p{font-size:.75rem;letter-spacing:.2em;color:#f7a365;margin:0 0 5px}.hero-card strong{font-size:1.15rem}
.stats{display:grid;grid-template-columns:repeat(4,1fr);background:white;padding:25px 8%;border-bottom:1px solid var(--line)}.stats div{padding:10px 25px;border-right:1px solid var(--line)}.stats div:last-child{border:0}.stats strong,.stats span{display:block}.stats strong{font-size:1.7rem;color:var(--navy)}.stats span{font-size:.8rem;color:var(--muted);margin-top:3px}
.section{padding:85px 8%;max-width:1500px;margin:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}.section-heading h2{font-family:"Orbitron",sans-serif;font-size:2.4rem;margin:0;letter-spacing:-.04em}.section-note{color:var(--muted)}.feed-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:25px}.feed{display:grid;gap:20px}.post-card,.side-card,.chat-box,.collection-card{background:linear-gradient(145deg,#101d3bea,#172554e8);border:1px solid #ffffffcc;border-radius:var(--radius);box-shadow:0 12px 35px #1e3a8a22, inset 0 1px 0 #fff;backdrop-filter:blur(12px)}.post-card{padding:22px}.post-head{display:flex;align-items:center;gap:12px}.avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:white;font-weight:900}.avatar.alt{background:var(--blue)}.avatar.small{width:34px;height:34px;font-size:.7rem}.post-head div:nth-child(2){display:flex;flex-direction:column;gap:3px}.post-head span{font-size:.75rem;color:var(--muted)}.more{margin-left:auto;border:0;background:none;color:#8a93a2;cursor:pointer}.post-text{font-size:1rem;line-height:1.6;margin:18px 0}.post-image{height:260px;border-radius:15px;display:grid;place-items:center;overflow:hidden;position:relative}.stadium-art{background:radial-gradient(circle at 50% 10%,#fca15a,transparent 15%),linear-gradient(#112e56 0 38%,#df7a29 39% 48%,#315f42 49%);color:white}.memorabilia-art{background:linear-gradient(135deg,#f2e2c7,#c6925b);color:#39250e}.post-image span{font-size:1.5rem;font-weight:1000;letter-spacing:.08em;text-shadow:0 2px 10px #0008}.post-actions{display:flex;gap:8px;padding-top:13px}.post-actions button{border:0;background:transparent;padding:8px 10px;color:var(--muted);cursor:pointer;border-radius:8px}.post-actions button:hover{background:#f4f1eb;color:var(--navy)}.like-btn.liked{color:var(--blue)}
.sidebar{display:grid;gap:20px;align-content:start}.side-card{padding:22px}.side-card h3{margin-top:0}.side-card a{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line);font-weight:800}.side-card a:last-of-type{border:0}.side-card a span{font-weight:500;color:var(--muted);font-size:.78rem}.side-card p{color:var(--muted);line-height:1.6}
.dark-section{max-width:none;background:var(--navy);color:white}.dark-section .section-heading{max-width:1280px;margin-left:auto;margin-right:auto}.dark-section>.road-grid{max-width:1280px;margin:auto}.road-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.road-card{min-height:270px;border-radius:20px;border:1px solid #ffffff55;padding:22px;display:flex;flex-direction:column;justify-content:end;position:relative;overflow:hidden;background:linear-gradient(145deg,#1e3a8a,#64748b)}.road-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,#fff3,transparent 25%)}.road-card span,.road-card strong{position:relative}.road-card span{color:#ffd2ae;font-size:.8rem;font-weight:800;margin-bottom:7px}.road-card strong{font-size:1.4rem}.road-2{background:linear-gradient(145deg,#334155,#93c5fd)}.road-3{background:linear-gradient(145deg,#475569,#cbd5e1)}
.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.collection-card{padding:15px}.item-art{height:190px;border-radius:14px;display:grid;place-items:center;font-size:4.5rem;margin-bottom:15px}.ball{background:#e8dcc7}.jersey{background:#d8e4f0}.card{background:#e7cfae}.bat{background:#dfd5ca}.collection-card strong,.collection-card span{display:block}.collection-card span{font-size:.8rem;color:var(--muted);margin-top:4px}
.chat-section{background:#eee9e1;max-width:none}.chat-section>*{max-width:900px;margin-left:auto;margin-right:auto}.live{color:#14864a;font-size:.85rem;font-weight:800}.live i{display:inline-block;width:8px;height:8px;background:#1bb76e;border-radius:50%;margin-right:6px}.chat-box{overflow:hidden}.messages{padding:25px;display:grid;gap:18px;min-height:250px}.message{display:flex;gap:10px;align-items:flex-start}.message p{margin:0;background:#f5f2ed;padding:11px 14px;border-radius:0 13px 13px 13px;line-height:1.45}.message p strong{font-size:.8rem}.chat-form{border-top:1px solid var(--line);display:flex;gap:10px;padding:15px}.chat-form input{flex:1;border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff;outline:none}.chat-form input:focus{border-color:var(--blue)}
.join-section{display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(120deg,#0b1630,#1e3a8a 55%,#9a3412)}.join-section h2{margin:0;font-size:2.2rem}.join-section p{color:var(--muted)}
footer{background:linear-gradient(90deg,#080f26,#1e3a8a,#475569);color:#aebbd0;padding:30px 8%;display:flex;justify-content:space-between;gap:20px;font-size:.75rem}footer div{display:flex;flex-direction:column;gap:6px}footer strong{color:white;font-size:1rem}
dialog{border:0;border-radius:22px;padding:0;box-shadow:0 30px 90px #0007;width:min(500px,92vw)}dialog::backdrop{background:#041329aa;backdrop-filter:blur(4px)}.modal{padding:32px;display:grid;gap:14px;position:relative}.modal h2{margin:0 0 10px}.modal input,.modal textarea,.modal select{border:1px solid var(--line);border-radius:10px;padding:13px;outline:none;background:white}.modal textarea{min-height:130px;resize:vertical}.modal-close{position:absolute;right:18px;top:15px;border:0;background:none;font-size:1.7rem;cursor:pointer;color:var(--muted)}
.toast{position:fixed;right:25px;bottom:25px;background:var(--navy);color:white;padding:14px 18px;border-radius:10px;box-shadow:var(--shadow);transform:translateY(120px);opacity:0;transition:.25s;z-index:50}.toast.show{transform:none;opacity:1}
@media(max-width:850px){.topbar{padding:0 5%;}.menu-toggle{display:block;margin-left:auto}nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--navy);padding:18px 5%;flex-direction:column}nav.open{display:flex}.join-btn{display:none}.hero{grid-template-columns:1fr;padding:60px 7%}.hero-card{max-width:360px}.stats{grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2){border-right:0}.stats div:nth-child(-n+2){border-bottom:1px solid var(--line)}.feed-layout{grid-template-columns:1fr}.sidebar{grid-template-columns:1fr 1fr}.road-grid,.collection-grid{grid-template-columns:repeat(2,1fr)}.section{padding:65px 6%}.join-section{flex-direction:column;align-items:flex-start}}
@media(max-width:560px){.hero h1{font-family:"Orbitron",sans-serif;text-shadow:0 0 22px #93c5fd66;font-size:3.2rem}.section-heading{align-items:flex-start;flex-direction:column}.sidebar,.road-grid,.collection-grid{grid-template-columns:1fr}.stats{padding:18px 4%}.stats div{padding:10px 12px}.post-image{height:210px}.chat-form{flex-direction:column}footer{flex-direction:column}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions a,.hero-actions button{text-align:center}}

/* Y2K chrome + digital-glow effects */
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.16;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,#ffffff 4px);mix-blend-mode:overlay}
a,button{transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}
button:hover,.primary-btn:hover,.join-btn:hover{filter:saturate(1.35) brightness(1.08);box-shadow:0 0 22px #60a5fa88,0 8px 24px #1e3a8a33}
.eyebrow{font-family:"Orbitron",sans-serif;text-shadow:0 0 12px #60a5fa88}
.hero h1 span{background:linear-gradient(90deg,#d6e0e5,#8eafc1,#e7eaec);-webkit-background-clip:text;background-clip:text;color:transparent}
.stats{background:linear-gradient(90deg,#0b1630ee,#1e3a8aee,#7c2d12dd);box-shadow:0 8px 25px #1e3a8a12}
.avatar{background:linear-gradient(145deg,#1e40af,#2563eb,#f97316);box-shadow:0 0 0 3px #bfdbfe55}
.item-art{background:linear-gradient(145deg,#1e3a8a,#2563eb 45%,#f97316);box-shadow:inset 0 0 25px #ffffff99}
.chat-section{background:linear-gradient(135deg,#0b1630,#1e3a8a 50%,#7c2d12)}

body{color:#e5edf9}
.section-heading h2,.side-card h3,.collection-card strong,.join-section h2{color:#f8fafc}
.post-card,.side-card,.chat-box,.collection-card{color:#e5edf9}
.post-head span,.collection-card span,.section-note,.side-card p,.stats span{color:#b8c7e3}
.post-text{color:#e5edf9}
.side-card a{border-color:#ffffff22}
.chat-form{border-color:#ffffff22}
.chat-form input,.modal input,.modal textarea,.modal select{background:#0b1630;color:#e5edf9;border-color:#ffffff33}
.outline-btn{background:linear-gradient(135deg,#1e3a8a,#f97316);color:white;border-color:#60a5fa}

/* Explore the Fan Feed button */
.fan-feed-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.fan-feed-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(50, 110, 180, 0.25);
}

.fan-feed-btn:active {
  transform: translateY(0);
}


/* Same-page My Account profile editor */
.account-header h3{margin:4px 0 3px;color:#fff;font-size:1.35rem}
.account-header p{margin:0;color:#b8c7d5;font-size:.85rem}
.profile-editor{display:grid;gap:10px;margin-top:4px}
.profile-editor>label{font-size:.82rem;font-weight:800;color:#dbe6f5}
.profile-editor input[type="text"]{width:100%}
.profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:3px}
.profile-actions button{flex:1;min-width:150px}
#profileMessage{margin:0}


/* Account persistence notice */
.auth-storage-note{
  margin:0;
  color:#94a3b8;
  font-size:.72rem;
  line-height:1.45;
  text-align:center;
}
