@font-face{font-family:Fredoka;font-weight:600;font-display:swap;src:url(/pages/fonts/fredoka-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Fredoka;font-weight:700;font-display:swap;src:url(/pages/fonts/fredoka-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Nunito;font-weight:400;font-display:swap;src:url(/pages/fonts/nunito-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Nunito;font-weight:700;font-display:swap;src:url(/pages/fonts/nunito-latin-700-normal.woff2) format("woff2")}
:root{color-scheme:dark;--bg:#1b1f3a;--panel:#232850;--panel2:#141830;--fg:#eef0ff;--muted:#b4b9dc;--gold:#ffd65c;--sky:#8fd8ff;--leaf:#7be08a;--line:#2d335f}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.6 Nunito,system-ui,sans-serif}
a{color:var(--sky)}
.top{position:sticky;top:0;z-index:5;background:rgb(20 24 48/92%);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.bar{max-width:68rem;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap}
.brand{font:700 22px Fredoka,Nunito,sans-serif;color:var(--gold);text-decoration:none}
.main{display:flex;gap:6px 14px;flex-wrap:wrap;font-weight:700;font-size:15px}
.main a{color:var(--fg);text-decoration:none;opacity:.8}
.main a[aria-current]{opacity:1;color:var(--gold)}
.play{margin-left:auto;background:var(--leaf);color:#0d2a12;font:700 16px Fredoka,Nunito,sans-serif;padding:8px 16px;border-radius:999px;text-decoration:none;white-space:nowrap}
.langs{max-width:68rem;margin:0 auto;padding:0 16px 8px;display:flex;gap:4px 12px;flex-wrap:wrap;font-size:13px}
.langs a{color:var(--muted);text-decoration:none}
.langs a[aria-current]{color:var(--fg);font-weight:700}
.hero{max-width:52rem;margin:20px auto 0;padding:0 16px}
.hero img{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:18px}
main{max-width:68rem;margin:0 auto;padding:8px 16px 48px}
h1{font:700 clamp(30px,5vw,44px)/1.1 Fredoka,Nunito,sans-serif;color:var(--gold);margin:24px 0 8px;text-wrap:balance}
.lead{color:var(--muted);max-width:44rem;margin:0 0 16px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px;padding:0;list-style:none}
.chips a{display:block;background:var(--panel);color:var(--fg);text-decoration:none;padding:6px 12px;border-radius:999px;font-size:14px;font-weight:700}
h2{font:600 26px Fredoka,Nunito,sans-serif;color:var(--sky);margin:36px 0 4px}
.kind>p{color:var(--muted);margin:0 0 14px}
.games,.maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:18px}
.game,.map{background:var(--panel);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.game img,.map img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px}
h3{font:600 22px Fredoka,Nunito,sans-serif;margin:0}
.goal{font-weight:700;margin:0}
.rules{margin:0;padding-left:1.1rem;color:#d9dcf5;font-size:15.5px}
.ctrl{margin:0;font-size:14px;color:var(--muted)}
.ctrl kbd{background:var(--panel2);color:var(--fg);padding:1px 7px;border-radius:6px;font:700 13px Nunito,system-ui,sans-serif}
.howto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:18px;align-items:center;background:var(--panel);border-radius:16px;padding:16px;margin:0 0 16px}
.howto img{display:block;width:100%;height:auto;border-radius:12px}
.howto h2{margin:0 0 6px}
.howto p{margin:0 0 6px}
.howto.plain{grid-template-columns:1fr}
.faq dt{font:600 20px Fredoka,Nunito,sans-serif;color:var(--fg);margin:22px 0 4px}
.faq dd{margin:0;color:#d9dcf5}
.about{max-width:44rem}
.cta{margin:40px 0 0;background:linear-gradient(135deg,#2f5f2a,#1f3f6a);border-radius:18px;padding:26px;text-align:center}
.cta h2{font:700 28px Fredoka,Nunito,sans-serif;margin:0 0 6px;color:var(--gold)}
.cta p{margin:0 0 16px}
.cta .play{margin:0;display:inline-block}
footer{max-width:68rem;margin:0 auto;padding:20px 16px 40px;color:var(--muted);font-size:14px;display:flex;gap:8px 14px;flex-wrap:wrap;border-top:1px solid var(--line)}
@media (max-width:640px){.howto{grid-template-columns:1fr}.play{margin-left:0}}