*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --neon-gold:#FFD700;
  --neon-orange:#FF6B00;
  --neon-red:#FF2D55;
  --neon-purple:#9B59B6;
  --dark:#0A0A0F;
  --dark2:#12121A;
  --dark3:#1A1A28;
  --text:#E8E8F0;
  --text-muted:#7878A0;
  --card-bg:rgba(255,255,255,0.04);
  --border:rgba(255,215,0,0.15);
}
html{scroll-behavior:smooth;}
body{background:var(--dark);color:var(--text);font-family:'Inter',sans-serif;overflow-x:hidden;}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--dark);}
::-webkit-scrollbar-thumb{background:var(--neon-gold);border-radius:2px;}

nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:20px 60px;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(10,10,15,0.9);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
}
.logo{font-family:'Orbitron',monospace;font-size:22px;font-weight:900;color:var(--neon-gold);letter-spacing:3px;text-decoration:none;text-shadow:0 0 20px rgba(255,215,0,0.5);}
.logo span{color:var(--neon-orange);}
.nav-links{display:flex;gap:36px;list-style:none;}
.nav-links a{color:var(--text-muted);text-decoration:none;font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;transition:color 0.3s;}
.nav-links a:hover,.nav-links a.active{color:var(--neon-gold);}
.nav-cta{background:var(--neon-gold);color:#000;padding:10px 28px;font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;letter-spacing:2px;text-transform:uppercase;border:none;cursor:pointer;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);transition:all 0.3s;text-decoration:none;}
.nav-cta:hover{background:var(--neon-orange);}

/* HERO */
.page-hero{
  padding:140px 60px 80px;
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#0d0a1e 0%,#1a0a2e 50%,#0A0A0F 100%);
}
.page-hero::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(155,89,182,0.15) 0%,transparent 60%);
}
.breadcrumb{
  display:flex;align-items:center;gap:8px;
  font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;
  letter-spacing:1.5px;text-transform:uppercase;
  color:var(--text-muted);margin-bottom:24px;position:relative;z-index:2;
}
.breadcrumb a{color:var(--neon-gold);text-decoration:none;}
.breadcrumb span{color:var(--text-muted);}
.hero-inner{
  display:grid;grid-template-columns:1fr auto;
  gap:60px;align-items:center;position:relative;z-index:2;
}
.page-hero h1{
  font-family:'Orbitron',monospace;
  font-size:clamp(40px,6vw,80px);
  font-weight:900;color:#fff;
  line-height:1;margin-bottom:20px;
}
.page-hero h1 span{
  display:block;color:transparent;
  -webkit-text-stroke:2px var(--neon-gold);
  text-shadow:0 0 40px rgba(255,215,0,0.2);
}
.hero-tagline{
  font-size:18px;color:var(--text-muted);
  line-height:1.7;max-width:560px;margin-bottom:36px;
}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px;}
.tag{
  background:rgba(255,215,0,0.08);
  border:1px solid rgba(255,215,0,0.2);
  padding:6px 16px;
  font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;
  letter-spacing:1px;text-transform:uppercase;color:var(--neon-gold);
}
.hero-btns{display:flex;gap:16px;}
.btn-primary{background:linear-gradient(135deg,var(--neon-gold),var(--neon-orange));color:#000;padding:16px 36px;font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;border:none;cursor:pointer;clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);transition:all 0.3s;text-decoration:none;display:inline-block;}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(255,215,0,0.3);}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text);padding:16px 36px;font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:600;letter-spacing:2px;text-transform:uppercase;cursor:pointer;clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);transition:all 0.3s;text-decoration:none;display:inline-block;}
.btn-ghost:hover{border-color:var(--neon-gold);color:var(--neon-gold);}
.hero-board{
  width:300px;height:300px;flex-shrink:0;
  display:grid;grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(3,1fr);
  border:2px solid rgba(255,215,0,0.3);
  position:relative;
}
.board-cell{border:1px solid rgba(255,215,0,0.1);display:flex;align-items:center;justify-content:center;position:relative;}
.board-cell.red{background:rgba(255,45,85,0.3);}
.board-cell.blue{background:rgba(59,130,246,0.3);}
.board-cell.green{background:rgba(16,185,129,0.3);}
.board-cell.yellow{background:rgba(255,215,0,0.3);}
.board-cell.center{background:radial-gradient(circle,rgba(255,215,0,0.2) 0%,transparent 70%);}
.board-piece{
  width:24px;height:24px;border-radius:50%;
  border:2px solid rgba(255,255,255,0.5);
  animation:float 3s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}

/* QUICK INFO */
.quick-info{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--border);
  border:1px solid var(--border);
  margin:0 60px;
  transform:translateY(-30px);
  position:relative;z-index:10;
}
.qi-item{
  background:var(--dark2);
  padding:24px 28px;
  text-align:center;
}
.qi-label{font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;}
.qi-val{font-family:'Orbitron',monospace;font-size:22px;font-weight:700;color:var(--neon-gold);}

/* CONTENT */
.content-layout{
  display:grid;grid-template-columns:1fr 300px;
  gap:40px;padding:20px 60px 80px;
}
.main-content{display:flex;flex-direction:column;gap:60px;}
.sidebar{display:flex;flex-direction:column;gap:24px;}

/* CONTENT SECTIONS */
.content-block{
  background:var(--card-bg);
  border:1px solid var(--border);
  padding:40px;
}
.block-header{
  display:flex;align-items:center;gap:16px;
  margin-bottom:32px;
  padding-bottom:20px;
  border-bottom:1px solid var(--border);
}
.block-num{
  font-family:'Orbitron',monospace;font-size:32px;font-weight:900;
  color:transparent;-webkit-text-stroke:1px var(--neon-gold);
  line-height:1;
}
.block-title{
  font-family:'Orbitron',monospace;font-size:22px;font-weight:700;color:#fff;
}
.block-title span{color:var(--neon-gold);}
.content-block p{
  font-size:15px;color:var(--text-muted);line-height:1.8;margin-bottom:16px;
}
.content-block p:last-child{margin-bottom:0;}

/* RULES */
.rules-grid{display:flex;flex-direction:column;gap:16px;}
.rule-item{
  display:flex;gap:20px;
  padding:20px;
  background:rgba(255,255,255,0.02);
  border-left:3px solid var(--neon-gold);
  transition:all 0.3s;
}
.rule-item:hover{background:rgba(255,215,0,0.04);transform:translateX(4px);}
.rule-num{
  font-family:'Orbitron',monospace;font-size:28px;font-weight:900;
  color:rgba(255,215,0,0.2);line-height:1;flex-shrink:0;width:32px;
}
.rule-text h4{font-family:'Rajdhani',sans-serif;font-size:16px;font-weight:700;color:#fff;margin-bottom:6px;letter-spacing:1px;}
.rule-text p{font-size:14px;color:var(--text-muted);line-height:1.6;}

/* STRATEGIES */
.strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.strat-card{
  padding:24px;
  background:rgba(255,255,255,0.02);
  border:1px solid var(--border);
  position:relative;overflow:hidden;
  transition:all 0.3s;
}
.strat-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--neon-gold),transparent);
}
.strat-card:hover{border-color:rgba(255,215,0,0.3);background:rgba(255,215,0,0.03);}
.strat-level{
  font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:2px;text-transform:uppercase;color:var(--neon-orange);
  margin-bottom:10px;
}
.strat-title{font-family:'Rajdhani',sans-serif;font-size:18px;font-weight:700;color:#fff;margin-bottom:8px;letter-spacing:1px;}
.strat-desc{font-size:14px;color:var(--text-muted);line-height:1.6;}

/* VARIANTS */
.variants-list{display:flex;flex-direction:column;gap:16px;}
.variant-item{
  display:grid;grid-template-columns:120px 1fr auto;
  align-items:center;gap:20px;
  padding:20px 24px;
  background:rgba(255,255,255,0.02);
  border:1px solid var(--border);
  transition:all 0.3s;
}
.variant-item:hover{border-color:rgba(255,215,0,0.3);}
.variant-name{font-family:'Orbitron',monospace;font-size:14px;font-weight:700;color:var(--neon-gold);}
.variant-desc{font-size:14px;color:var(--text-muted);line-height:1.5;}
.variant-badge{
  padding:4px 12px;
  font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;
  white-space:nowrap;
}
.badge-easy{background:rgba(16,185,129,0.15);color:#10B981;border:1px solid rgba(16,185,129,0.3);}
.badge-med{background:rgba(255,215,0,0.15);color:var(--neon-gold);border:1px solid rgba(255,215,0,0.3);}
.badge-hard{background:rgba(255,45,85,0.15);color:var(--neon-red);border:1px solid rgba(255,45,85,0.3);}

/* SIDEBAR */
.sidebar-card{
  background:var(--card-bg);border:1px solid var(--border);padding:24px;
}
.sidebar-title{
  font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;
  letter-spacing:2px;text-transform:uppercase;color:var(--neon-gold);
  margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);
}
.sidebar-stat{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 0;border-bottom:1px solid rgba(255,215,0,0.05);
}
.sidebar-stat:last-child{border-bottom:none;}
.ss-label{font-size:13px;color:var(--text-muted);}
.ss-val{font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;color:var(--neon-gold);}

.tips-list{display:flex;flex-direction:column;gap:12px;}
.tip-item{
  display:flex;gap:12px;
  padding:12px;background:rgba(255,255,255,0.02);
  border-left:2px solid var(--neon-orange);
}
.tip-icon{color:var(--neon-orange);font-weight:700;flex-shrink:0;font-family:'Orbitron',monospace;font-size:12px;}
.tip-text{font-size:13px;color:var(--text-muted);line-height:1.5;}

/* TOURNAMENT */
.tournament-card{
  background:linear-gradient(135deg,rgba(255,215,0,0.05),rgba(255,107,0,0.05));
  border:1px solid rgba(255,215,0,0.3);
  padding:32px;text-align:center;margin-top:0;
}
.tc-badge{
  display:inline-block;background:var(--neon-gold);color:#000;
  padding:4px 16px;font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:700;
  letter-spacing:2px;text-transform:uppercase;margin-bottom:20px;
}
.tc-title{font-family:'Orbitron',monospace;font-size:22px;font-weight:900;color:#fff;margin-bottom:8px;}
.tc-prize{font-family:'Orbitron',monospace;font-size:36px;font-weight:900;color:var(--neon-gold);text-shadow:0 0 20px rgba(255,215,0,0.4);margin-bottom:8px;}
.tc-desc{font-size:14px;color:var(--text-muted);margin-bottom:24px;}

/* FOOTER */
footer{background:var(--dark2);border-top:1px solid var(--border);padding:40px 60px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;}
.footer-bottom p{font-size:13px;color:var(--text-muted);}

@media(max-width:1024px){
  .content-layout{grid-template-columns:1fr;}
  .sidebar{display:none;}
  .strategy-grid{grid-template-columns:1fr;}
}
@media(max-width:768px){
  nav{padding:16px 24px;}.nav-links{display:none;}
  .page-hero{padding:100px 24px 60px;}
  .hero-inner{grid-template-columns:1fr;}.hero-board{display:none;}
  .quick-info{grid-template-columns:repeat(2,1fr);margin:0 24px;}
  .content-layout{padding:20px 24px 60px;}
  .content-block{padding:24px;}
  .variant-item{grid-template-columns:1fr;gap:8px;}
  footer{padding:24px;}
}
