*{margin:0;padding:0;box-sizing:border-box}
:root{--emerald:#10b981;--emerald-light:#34d399;--bg-black:#0d1117;--bg-dark:#161b22;--bg-card:#21262d;--text-white:#f0fdf4;--text-gray:#9ca3af}
html{scroll-behavior:smooth}
body{font-family:'Open Sans',sans-serif;background:var(--bg-black);color:var(--text-white);line-height:1.7}
h1,h2,h3,h4{font-family:'Mate SC',serif;font-weight:400}

.gate-layer{position:fixed;inset:0;background:rgba(13,17,23,0.98);display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}
.gate-layer.hidden{display:none}
.gate-box{background:var(--bg-dark);border:2px solid var(--emerald);padding:55px 45px;max-width:480px;text-align:center;box-shadow:0 0 60px rgba(16,185,129,0.2)}
.gate-rune{font-size:56px;color:var(--emerald);margin-bottom:20px}
.gate-box h2{font-size:1.9rem;margin-bottom:20px;color:var(--emerald)}
.gate-box p{color:var(--text-gray);margin-bottom:12px}
.gate-question{color:var(--text-white)!important;font-weight:600;margin-top:25px!important}
.gate-buttons{display:flex;flex-direction:column;gap:12px;margin-top:30px}
.gate-buttons button{padding:15px 30px;border:none;font-family:'Mate SC',serif;font-size:1.05rem;cursor:pointer;transition:all 0.3s}
.gate-buttons button:first-child{background:var(--emerald);color:var(--bg-black)}
.gate-buttons button:first-child:hover{background:var(--emerald-light);box-shadow:0 5px 30px rgba(16,185,129,0.4)}
.gate-buttons button:last-child{background:transparent;border:1px solid var(--text-gray);color:var(--text-gray)}
.gate-buttons button:last-child:hover{border-color:#ef4444;color:#ef4444}

.top-header{position:fixed;top:0;width:100%;background:rgba(13,17,23,0.95);backdrop-filter:blur(12px);z-index:1000;border-bottom:1px solid rgba(16,185,129,0.2)}
.header-inner{max-width:1500px;margin:0 auto;padding:18px 40px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-white)}
.logo-rune{color:var(--emerald);font-size:1.5rem}
.logo-text{font-family:'Mate SC',serif;font-size:1.6rem}
.nav-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:5px}
.nav-btn span{width:26px;height:2px;background:var(--emerald);transition:0.3s}
.nav-links{display:flex;gap:35px}
.nav-links a{color:var(--text-gray);text-decoration:none;font-weight:500;transition:color 0.3s}
.nav-links a:hover,.nav-links a.active{color:var(--emerald)}

.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:130px 40px 80px;background:radial-gradient(ellipse at 50% 40%,rgba(16,185,129,0.1) 0%,transparent 55%),var(--bg-black);text-align:center}
.hero-inner{max-width:800px}
.hero-label{display:inline-block;border:1px solid var(--emerald);color:var(--emerald);padding:8px 20px;font-size:0.85rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:25px}
.hero h1{font-size:clamp(2.2rem,5vw,3.5rem);line-height:1.2;margin-bottom:25px}
.hero p{font-size:1.15rem;color:var(--text-gray);margin-bottom:40px;line-height:1.8}
.hero-btn{display:inline-block;padding:16px 45px;background:var(--emerald);color:var(--bg-black);text-decoration:none;font-family:'Mate SC',serif;font-size:1.1rem;transition:all 0.3s}
.hero-btn:hover{background:var(--emerald-light);transform:translateY(-2px);box-shadow:0 10px 35px rgba(16,185,129,0.35)}

.tenets{padding:80px 40px;background:var(--bg-dark)}
.tenets-row{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.tenet{background:var(--bg-card);border-top:3px solid var(--emerald);padding:40px 30px;text-align:center}
.tenet-icon{font-size:44px;display:block;margin-bottom:18px}
.tenet h3{font-size:1.4rem;margin-bottom:12px}
.tenet p{color:var(--text-gray)}

.featured{padding:100px 40px;background:var(--bg-black)}
.featured-inner{max-width:1400px;margin:0 auto}
.featured-header{text-align:center;max-width:700px;margin:0 auto 50px}
.featured-tag{display:inline-block;color:var(--emerald);font-size:0.85rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:15px}
.featured-header h2{font-size:2.4rem;margin-bottom:18px}
.featured-header p{color:var(--text-gray);font-size:1.05rem}
.game-area{background:var(--bg-dark);border:2px solid rgba(16,185,129,0.2)}
.game-area iframe{width:100%;height:620px;border:none;display:block}
.game-note{text-align:center;margin-top:25px;color:var(--text-gray)}

.lore{padding:100px 40px;background:var(--bg-dark)}
.lore-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr;gap:70px;align-items:center}
.lore-text h2{font-size:2.4rem;margin-bottom:25px}
.lore-text p{color:var(--text-gray);margin-bottom:18px;line-height:1.85}
.lore-stats{display:grid;gap:20px}
.stat{background:var(--bg-black);border-left:4px solid var(--emerald);padding:30px}
.stat-val{display:block;font-family:'Mate SC',serif;font-size:2.5rem;color:var(--emerald)}
.stat-text{color:var(--text-gray);margin-top:5px}

.blessings{padding:100px 40px;background:var(--bg-black)}
.blessings h2{text-align:center;font-size:2.4rem;margin-bottom:55px}
.blessings-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
.blessing{background:var(--bg-card);padding:40px 28px;text-align:center;transition:transform 0.3s}
.blessing:hover{transform:translateY(-5px)}
.bl-icon{font-size:40px;margin-bottom:18px;display:block}
.blessing h3{font-size:1.2rem;margin-bottom:10px}
.blessing p{color:var(--text-gray);font-size:0.9rem}

.site-footer{background:var(--bg-dark);border-top:1px solid rgba(16,185,129,0.15);padding:55px 40px 25px}
.footer-inner{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:55px}
.footer-logo{font-family:'Mate SC',serif;font-size:1.4rem;color:var(--emerald);margin-bottom:12px}
.footer-brand p{color:var(--text-gray)}
.footer-links h4,.footer-help h4{font-size:1rem;margin-bottom:18px}
.footer-links a,.footer-help a{display:block;color:var(--text-gray);text-decoration:none;margin-bottom:10px;transition:color 0.3s}
.footer-links a:hover,.footer-help a:hover{color:var(--emerald)}
.footer-bottom{max-width:1400px;margin:40px auto 0;padding-top:22px;border-top:1px solid rgba(16,185,129,0.1);text-align:center;color:var(--text-gray);font-size:0.9rem}

@media(max-width:1100px){.tenets-row,.blessings-grid{grid-template-columns:1fr}.lore-grid{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr;text-align:center}}
@media(max-width:768px){.nav-btn{display:flex}.nav-links{position:fixed;top:70px;left:0;right:0;background:rgba(13,17,23,0.98);flex-direction:column;padding:30px;gap:20px;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all 0.3s}.nav-links.open{transform:translateY(0);opacity:1;visibility:visible}.header-inner{padding:15px 20px}.hero{padding:100px 25px 60px}.tenets,.featured,.lore,.blessings{padding:60px 25px}.game-area iframe{height:420px}.gate-box{padding:40px 25px}}
