*{margin:0;padding:0;box-sizing:border-box}
:root{--red:#dc2626;--red-dark:#b91c1c;--gold:#fbbf24;--gold-light:#fde047;--bg-black:#0a0a0a;--bg-dark:#1a1a1a;--bg-medium:#2a2a2a;--text-white:#f5f5f5;--text-gray:#d4d4d4;--text-muted:#a3a3a3}
body{font-family:'DM Sans',sans-serif;background:var(--bg-black);color:var(--text-white);line-height:1.7}
.section-wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.main-header{background:var(--bg-dark);box-shadow:0 4px 20px rgba(220,38,38,0.3);position:sticky;top:0;z-index:1000;border-bottom:2px solid var(--red)}
.header-inner{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 32px}
.site-brand{display:flex;align-items:center;gap:20px}
.site-brand span{font-family:'Syne',sans-serif;font-size:2.6rem;font-weight:800;color:var(--red);letter-spacing:-1px}
.site-nav{display:flex;gap:3.2rem}
.site-nav a{font-family:'Syne',sans-serif;color:var(--text-gray);text-decoration:none;font-weight:600;font-size:1.1rem;transition:color 0.3s;position:relative}
.site-nav a::before{content:'';position:absolute;bottom:-8px;left:0;width:0;height:3px;background:var(--gold);transition:width 0.3s}
.site-nav a:hover{color:var(--gold)}
.site-nav a:hover::before{width:100%}
.nav-toggle{display:none;flex-direction:column;gap:7px;background:transparent;border:none;cursor:pointer}
.nav-toggle span{width:34px;height:3px;background:var(--red);border-radius:3px;transition:all 0.3s}
.intro-hero{background:linear-gradient(135deg,rgba(220,38,38,0.2),rgba(185,28,28,0.1));padding:7rem 32px;text-align:center}
.hero-content h1{font-family:'Syne',sans-serif;font-size:5rem;font-weight:800;color:var(--gold);margin-bottom:2rem;letter-spacing:-2px;text-shadow:0 0 30px rgba(251,191,36,0.4)}
.hero-tagline{font-size:1.8rem;color:var(--text-gray);margin-bottom:4rem;font-weight:300}
.hero-cta{display:inline-block;background:linear-gradient(135deg,var(--red),var(--red-dark));color:white;padding:1.5rem 4rem;font-family:'Syne',sans-serif;font-size:1.4rem;font-weight:700;text-decoration:none;border-radius:50px;transition:all 0.3s;box-shadow:0 8px 30px rgba(220,38,38,0.4)}
.hero-cta:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(220,38,38,0.6)}
.about{padding:6rem 32px;background:var(--bg-dark)}
.about h2{font-family:'Syne',sans-serif;font-size:3.5rem;font-weight:700;color:var(--red);text-align:center;margin-bottom:3.5rem}
.about-text p{font-size:1.2rem;color:var(--text-gray);margin-bottom:2rem;line-height:2.1}
.essentials{padding:6rem 32px}
.essentials h2{font-family:'Syne',sans-serif;font-size:3.5rem;font-weight:700;color:var(--gold);text-align:center;margin-bottom:4.5rem}
.essentials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:3.5rem}
.essential-card{background:var(--bg-medium);padding:4rem;border-radius:24px;transition:transform 0.3s,box-shadow 0.3s;position:relative;overflow:hidden}
.essential-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px}
.essential-card.red::before{background:var(--red)}
.essential-card.gold::before{background:var(--gold)}
.essential-card.dark::before{background:var(--bg-dark)}
.essential-card:hover{transform:translateY(-10px);box-shadow:0 16px 45px rgba(220,38,38,0.3)}
.card-symbol{font-size:5rem;display:block;margin-bottom:2rem;color:var(--gold)}
.essential-card h3{font-family:'Syne',sans-serif;font-size:2rem;font-weight:700;color:var(--text-white);margin-bottom:1.5rem}
.essential-card p{color:var(--text-gray);line-height:2;font-size:1.1rem}
.game-area{padding:6rem 32px;background:var(--bg-dark)}
.game-area h2{font-family:'Syne',sans-serif;font-size:3.5rem;font-weight:700;color:var(--red);text-align:center;margin-bottom:1.5rem}
.game-desc{text-align:center;font-size:1.3rem;color:var(--text-gray);margin-bottom:4rem}
.game-box{max-width:980px;margin:0 auto;background:#000;border-radius:20px;overflow:hidden;box-shadow:0 16px 50px rgba(220,38,38,0.4);border:4px solid var(--gold)}
.game-box iframe{width:100%;height:620px;display:block;border:none}
.highlights{padding:6rem 32px}
.highlights h2{font-family:'Syne',sans-serif;font-size:3.5rem;font-weight:700;color:var(--gold);text-align:center;margin-bottom:4.5rem}
.highlights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:3.5rem}
.highlight-item{background:var(--bg-medium);padding:3.5rem;border-radius:20px;border:1px solid rgba(220,38,38,0.3);transition:transform 0.3s,box-shadow 0.3s}
.highlight-item:hover{transform:translateY(-7px);box-shadow:0 12px 35px rgba(220,38,38,0.25)}
.highlight-item h3{font-family:'Syne',sans-serif;font-size:1.9rem;font-weight:700;color:var(--red);margin-bottom:1.3rem}
.highlight-item p{color:var(--text-gray);line-height:1.9;font-size:1.1rem}
.notice{padding:5rem 32px;background:linear-gradient(135deg,rgba(251,191,36,0.15),rgba(251,191,36,0.08))}
.notice-box h3{font-family:'Syne',sans-serif;font-size:3rem;font-weight:700;color:var(--gold);margin-bottom:2.5rem;text-align:center}
.notice-box p{text-align:center;font-size:1.2rem;color:var(--text-white);max-width:1050px;margin:0 auto;line-height:2.1}
.age-check{display:none;position:fixed;z-index:10000;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.96);backdrop-filter:blur(15px)}
.age-check.active{display:flex;justify-content:center;align-items:center}
.check-card{background:var(--bg-dark);padding:4.5rem;border-radius:30px;max-width:580px;width:90%;text-align:center;box-shadow:0 35px 90px rgba(220,38,38,0.7);border:4px solid var(--red);position:relative}
.card-glow{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(220,38,38,0.15) 0%,transparent 70%);pointer-events:none}
.check-symbol{font-size:7rem;display:block;margin-bottom:2.5rem;color:var(--gold)}
.check-card h2{font-family:'Syne',sans-serif;font-size:3.2rem;font-weight:900;color:var(--red);margin-bottom:2.5rem}
.check-card p{font-size:1.3rem;color:var(--text-gray);margin-bottom:1.5rem}
.check-requirement{font-weight:700;color:var(--text-white)}
.check-note{font-size:1.1rem;color:var(--text-muted);font-style:italic}
.check-actions{display:flex;gap:2rem;margin-top:3.5rem}
.action-yes,.action-no{flex:1;padding:1.5rem;font-family:'Syne',sans-serif;font-size:1.3rem;font-weight:700;border:none;border-radius:15px;cursor:pointer;transition:all 0.3s}
.action-yes{background:linear-gradient(135deg,var(--red),var(--red-dark));color:white}
.action-yes:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(220,38,38,0.5)}
.action-no{background:#404040;color:var(--text-gray)}
.action-no:hover{background:#333}
.play-hero{padding:5.5rem 32px;text-align:center;background:linear-gradient(135deg,rgba(220,38,38,0.15),rgba(251,191,36,0.15))}
.play-hero h1{font-family:'Syne',sans-serif;font-size:4.8rem;font-weight:900;color:var(--gold);margin-bottom:1.5rem}
.play-lead{font-size:1.6rem;color:var(--text-gray)}
.instructions{padding:6rem 32px;background:var(--bg-dark)}
.instructions h2{font-family:'Syne',sans-serif;font-size:3.2rem;font-weight:700;color:var(--text-white);text-align:center;margin-bottom:4rem}
.inst-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:3.5rem}
.inst-box{background:var(--bg-medium);padding:3.5rem;border-radius:20px;text-align:center;border:2px solid rgba(220,38,38,0.3)}
.inst-icon{font-size:4.5rem;display:block;margin-bottom:2rem}
.inst-box h3{font-family:'Syne',sans-serif;font-size:1.8rem;font-weight:700;color:var(--gold);margin-bottom:1.5rem}
.inst-box p{color:var(--text-gray);line-height:1.9;font-size:1.1rem}
.legal-header{padding:5.5rem 32px;text-align:center;background:linear-gradient(135deg,rgba(220,38,38,0.15),rgba(251,191,36,0.15))}
.legal-header h1{font-family:'Syne',sans-serif;font-size:4.8rem;font-weight:900;color:var(--red);margin-bottom:1.2rem}
.legal-meta{font-size:1.15rem;color:var(--text-muted)}
.legal-main{padding:6rem 32px}
.legal-text{max-width:1000px;margin:0 auto;background:var(--bg-dark);padding:5rem;border-radius:24px;box-shadow:0 8px 28px rgba(220,38,38,0.15)}
.legal-text h2{font-family:'Syne',sans-serif;font-size:2.6rem;font-weight:700;color:var(--gold);margin:4rem 0 2rem 0}
.legal-text h2:first-child{margin-top:0}
.legal-text p{color:var(--text-gray);margin-bottom:1.8rem;line-height:2.1;font-size:1.1rem}
.main-footer{background:var(--bg-black);color:var(--text-white);padding:5rem 32px 2.5rem;border-top:2px solid var(--red)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:4rem;margin-bottom:4rem}
.footer-section h4{font-family:'Syne',sans-serif;font-size:1.7rem;font-weight:700;color:var(--gold);margin-bottom:2rem}
.footer-section p{color:var(--text-gray);margin-bottom:1.5rem;line-height:1.9}
.footer-section ul{list-style:none}
.footer-section ul li{margin-bottom:1.2rem}
.footer-section a{color:var(--text-gray);text-decoration:none;transition:color 0.3s}
.footer-section a:hover{color:var(--red)}
.footer-bottom{text-align:center;padding-top:3.5rem;border-top:1px solid rgba(220,38,38,0.3);color:var(--text-muted);font-size:1.05rem}
@media (max-width:768px){
.nav-toggle{display:flex}
.site-nav{position:fixed;left:-100%;top:85px;flex-direction:column;background:var(--bg-dark);width:100%;padding:3.5rem;gap:2.5rem;box-shadow:0 4px 20px rgba(220,38,38,0.3);transition:left 0.3s}
.site-nav.active{left:0}
.hero-content h1{font-size:3.2rem}
.hero-tagline{font-size:1.4rem}
.about h2,.essentials h2,.game-area h2,.highlights h2{font-size:2.6rem}
.essentials-grid,.highlights-grid,.inst-grid{grid-template-columns:1fr}
.game-box iframe{height:480px}
.check-card{padding:3.5rem}
.check-actions{flex-direction:column}
.legal-header h1{font-size:3.2rem}
.legal-text{padding:3.5rem}
.play-hero h1{font-size:3.2rem}
}