:root{
    --bg:        #0a0710;
    --bg-alt:    #120c1c;
    --panel:     #17101f;
    --line:      #2b2038;
    --purple:    #7c3aed;
    --purple-hi: #a875ff;
    --purple-dim:#4c2a8c;
    --white:     #f4f2f8;
    --muted:     #9b93b0;
    --live:      #ff4d6d;
    --gold:      #e8c368;
    --font-display: 'Bangers', cursive;
    --font-body: 'Comic Neue', cursive;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{background:var(--bg);color:var(--white);font-family:var(--font-body);line-height:1.6;overflow-x:hidden;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  img{max-width:100%;display:block;}
  ::selection{background:var(--purple);color:var(--white);}
  :focus-visible{outline:2px solid var(--purple-hi);outline-offset:3px;}

  .bg-grid{
    position:fixed;inset:0;
    background-image:linear-gradient(var(--line) 1px, transparent 1px),linear-gradient(90deg, var(--line) 1px, transparent 1px);
    background-size:64px 64px;opacity:0.18;pointer-events:none;z-index:0;
    mask-image:radial-gradient(ellipse 80% 60% at 50% 0%, #000 40%, transparent 100%);
  }
  .glow-orb{position:fixed;width:600px;height:600px;background:radial-gradient(circle, rgba(124,58,237,0.35), transparent 70%);border-radius:50%;filter:blur(10px);top:-200px;right:-200px;pointer-events:none;z-index:0;}

  .wrap{max-width:1120px;margin:0 auto;padding:0 24px;position:relative;z-index:1;}
  .page{display:none;padding:140px 0 100px;min-height:100vh;}
  .page.active{display:block;}
  #page-home{padding-top:0;}

  .eyebrow{font-family:var(--font-body);text-transform:uppercase;letter-spacing:0.25em;font-size:13px;color:var(--purple-hi);display:flex;align-items:center;gap:10px;margin-bottom:18px;}
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--purple-hi);display:inline-block;}
  h1,h2,h3{font-family:var(--font-body);font-weight:700;letter-spacing:0.01em;}
  h2{font-size:clamp(28px,4vw,42px);margin-bottom:16px;}
  .lead{color:var(--muted);max-width:560px;font-size:16px;}

  .hud{position:relative;border:1px solid var(--line);background:var(--panel);}
  .hud::before,.hud::after{content:"";position:absolute;width:18px;height:18px;border:2px solid var(--purple-hi);}
  .hud::before{top:-1px;left:-1px;border-right:none;border-bottom:none;}
  .hud::after{bottom:-1px;right:-1px;border-left:none;border-top:none;}

  /* ---------- Modern rounded cards (Socials & Setup) ---------- */
  .modern-card{
    position:relative;
    border-radius:18px;
    border:1px solid var(--line);
    background:var(--panel);
    overflow:hidden;
    transition:transform .25s, border-color .25s, box-shadow .25s;
  }
  .modern-card::before{
    content:"";
    position:absolute;
    top:0;left:0;right:0;
    height:3px;
    background:linear-gradient(90deg, var(--purple), var(--purple-hi));
    opacity:0.9;
  }
  .modern-card:hover{
    transform:translateY(-6px);
    border-color:var(--purple-dim);
    box-shadow:0 16px 40px -14px rgba(124,58,237,0.45);
  }

  /* ---------- Nav ---------- */
  header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(10,7,16,0.75);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
  nav{max-width:1120px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;}
  .logo{font-family:var(--font-body);font-weight:700;font-size:20px;letter-spacing:0.05em;display:flex;align-items:center;gap:10px;cursor:pointer;background:none;border:none;color:var(--white);}
  .logo .dot{width:9px;height:9px;background:var(--purple-hi);display:inline-block;transform:rotate(45deg);}
  .navlinks{display:flex;gap:8px;font-family:var(--font-body);font-weight:600;font-size:14px;letter-spacing:0.03em;}
  .navlinks button{background:none;border:none;color:var(--muted);cursor:pointer;padding:8px 12px;font:inherit;letter-spacing:inherit;position:relative;transition:color .2s;}
  .navlinks button:hover,.navlinks button.active{color:var(--white);}
  .navlinks button.active::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;background:var(--purple-hi);}
  .btn{font-family:var(--font-body);font-weight:700;letter-spacing:0.04em;font-size:14px;padding:10px 22px;background:var(--purple);color:var(--white);border:none;cursor:pointer;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:background .2s, transform .2s;display:inline-block;}
  .btn:hover{background:var(--purple-hi);transform:translateY(-2px);}
  .btn-outline{background:transparent;border:1px solid var(--purple-dim);color:var(--white);}
  .btn-outline:hover{border-color:var(--purple-hi);background:rgba(124,58,237,0.1);}
  .burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;}
  .burger span{width:24px;height:2px;background:var(--white);}

  @media (max-width:900px){
    .navlinks{position:fixed;top:64px;left:0;right:0;background:var(--bg-alt);flex-direction:column;padding:16px 24px;gap:6px;border-bottom:1px solid var(--line);transform:translateY(-150%);transition:transform .3s ease;}
    .navlinks.open{transform:translateY(0);}
    .navlinks button{text-align:left;padding:12px 4px;}
    .burger{display:flex;}
    .nav-cta{display:none;}
  }

  /* ---------- Home / Hero ---------- */
  .hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding-top:120px;position:relative;}
  .status-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-body);font-weight:600;font-size:13px;letter-spacing:0.15em;text-transform:uppercase;padding:6px 14px;border:1px solid var(--line);color:var(--muted);margin-bottom:28px;}
  .status-dot{width:8px;height:8px;border-radius:50%;background:var(--muted);}
  .hero h1{font-family:var(--font-display);font-size:clamp(52px,10vw,110px);line-height:0.95;text-transform:uppercase;color:var(--white);-webkit-text-stroke:2px var(--purple-hi);paint-order:stroke fill;}
  .hero .lead{margin:24px 0 36px;font-size:18px;max-width:520px;}
  .hero-actions{display:flex;gap:16px;flex-wrap:wrap;}
  .hero-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:48px;}
  .tag{font-family:var(--font-body);font-size:13px;font-weight:600;letter-spacing:0.05em;padding:6px 14px;border:1px solid var(--line);color:var(--muted);}

  .quicklinks{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:100px;}
  @media (max-width:900px){.quicklinks{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.quicklinks{grid-template-columns:1fr;}}
  .qlink{display:block;padding:24px 20px;cursor:pointer;transition:transform .2s;}
  .qlink:hover{transform:translateY(-4px);}
  .qlink:visited{color:inherit;text-decoration:none;}
  .qlink h3{font-size:16px;margin-bottom:6px;}
  .qlink p{font-size:13px;color:var(--muted);}

  /* ---------- Generic grids/cards ---------- */
  .about-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center;}
  @media (max-width:800px){.about-grid{grid-template-columns:1fr;}}
  .about-card{padding:32px;}
  .stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:32px;}
  .stat{background:var(--bg-alt);padding:22px 18px;text-align:center;}
  .stat b{display:block;font-family:var(--font-body);font-size:22px;color:var(--purple-hi);}
  .stat span{font-size:12px;color:var(--muted);letter-spacing:0.05em;}

  .setup-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px;}
  @media (max-width:900px){.setup-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.setup-grid{grid-template-columns:1fr;}}
  .setup-card{padding:26px 22px;}
  .setup-card .stag{display:inline-block;font-family:var(--font-body);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--purple-hi);background:rgba(124,58,237,0.12);border-radius:20px;padding:4px 12px;margin-bottom:14px;}
  .setup-card h3{font-size:16px;margin-bottom:6px;}
  .setup-card p{font-size:13px;color:var(--muted);}

  .social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  @media (max-width:900px){.social-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.social-grid{grid-template-columns:1fr;}}
  .social-card{padding:28px 22px;display:flex;flex-direction:column;gap:14px;transition:transform .2s;}
  .social-card:hover{transform:translateY(-4px);}
  .social-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:rgba(124,58,237,0.08);}
  .social-icon svg{width:20px;height:20px;fill:var(--purple-hi);}
  .social-card h3{font-size:17px;}
  .social-card p{font-size:13px;color:var(--muted);}
  .social-card .go{margin-top:auto;font-family:var(--font-body);font-weight:600;font-size:13px;letter-spacing:0.05em;color:var(--purple-hi);}

  .section-block{margin-bottom:90px;}
  .section-block:last-child{margin-bottom:0;}

  /* ---------- Support / Partner / Hall of Fame ---------- */
  .support-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
  @media (max-width:800px){.support-grid{grid-template-columns:1fr;}}
  .support-card{padding:30px;display:flex;flex-direction:column;gap:14px;}
  .support-card h3{font-size:19px;}
  .support-card p{font-size:14px;color:var(--muted);}

  .partner-card{padding:26px;display:flex;align-items:center;gap:20px;}
  .partner-avatar{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--bg-alt));flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-body);font-weight:700;font-size:20px;}
  .partner-info h3{font-size:17px;margin-bottom:4px;}
  .partner-info p{font-size:13px;color:var(--muted);}

  .hof-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px;}
  @media (max-width:800px){.hof-grid{grid-template-columns:1fr;}}
  .hof-card{padding:30px;text-align:center;position:relative;}
  .hof-crown{font-size:28px;margin-bottom:10px;}
  .hof-card .hlabel{font-family:var(--font-body);text-transform:uppercase;letter-spacing:0.12em;font-size:12px;color:var(--muted);margin-bottom:14px;}
  .hof-name{font-family:var(--font-body);font-size:26px;font-weight:700;color:var(--gold);}
  .hof-sub{font-size:13px;color:var(--muted);margin-top:6px;}

  /* ---------- Videos page ---------- */
  .video-tabs{display:flex;gap:0;border:1px solid var(--line);width:fit-content;margin-bottom:36px;}
  .video-tabs button{font-family:var(--font-body);font-weight:700;letter-spacing:0.05em;font-size:14px;padding:12px 28px;background:transparent;border:none;color:var(--muted);cursor:pointer;transition:background .2s,color .2s;}
  .video-tabs button:not(:last-child){border-right:1px solid var(--line);}
  .video-tabs button.active{background:var(--purple);color:var(--white);}
  .video-panel{display:none;}
  .video-panel.active{display:block;}

  .vod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  @media (max-width:900px){.vod-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:600px){.vod-grid{grid-template-columns:1fr;}}
  .vod-card{overflow:hidden;}
  .vod-thumb{aspect-ratio:16/9;background:linear-gradient(135deg, var(--purple-dim), var(--bg-alt));position:relative;display:flex;align-items:center;justify-content:center;}
  .vod-thumb .play{width:52px;height:52px;border-radius:50%;border:2px solid var(--white);display:flex;align-items:center;justify-content:center;transition:background .2s;}
  .vod-thumb .play::before{content:"";border-left:14px solid var(--white);border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:4px;}
  .vod-card:hover .play{background:var(--purple);}
  .vod-info{padding:16px 18px;}
  .vod-info .vgame{font-family:var(--font-body);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--purple-hi);margin-bottom:6px;}
  .vod-info h3{font-size:15px;font-weight:600;font-family:var(--font-body);}
  .vod-info .vmeta{font-size:12px;color:var(--muted);margin-top:6px;}
  .vod-note{margin-top:28px;font-size:13px;color:var(--muted);border-left:2px solid var(--purple-dim);padding-left:14px;}

  /* ---------- Schedule (used on About/Home) ---------- */
  .schedule{display:grid;grid-template-columns:repeat(7,1fr);border:1px solid var(--line);border-left:none;margin-top:20px;}
  @media (max-width:900px){.schedule{grid-template-columns:1fr;border-left:1px solid var(--line);}}
  .day{border-left:1px solid var(--line);padding:20px 14px;background:var(--panel);min-height:130px;}
  @media (max-width:900px){.day{display:flex;justify-content:space-between;align-items:center;min-height:auto;}}
  .day.today{background:linear-gradient(180deg, rgba(124,58,237,0.18), transparent 60%);box-shadow:inset 0 2px 0 var(--purple-hi);}
  .day .dname{font-family:var(--font-body);font-weight:700;letter-spacing:0.05em;font-size:13px;color:var(--muted);text-transform:uppercase;margin-bottom:12px;}
  .day.today .dname{color:var(--purple-hi);}
  .day .dgame{font-weight:600;font-size:14px;}
  .day .dtime{font-size:12px;color:var(--muted);margin-top:6px;}
  .day .doff{color:var(--muted);font-size:13px;}

  footer{border-top:1px solid var(--line);padding:48px 0;text-align:center;color:var(--muted);font-size:13px;}
  footer .logo{justify-content:center;margin-bottom:16px;cursor:default;}
  footer .fsocials{display:flex;justify-content:center;gap:18px;margin-bottom:20px;flex-wrap:wrap;}
  footer .fsocials a{color:var(--muted);transition:color .2s;}
  footer .fsocials a:hover{color:var(--purple-hi);}

  @media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}}
  .twitch-status {
      font-weight: bold;
      color: #888;
  }
  .twitch-status.live {
      color: #22c55e;
  }