:root{color-scheme:light dark;--bg:#ffffff;--ink:#17203a;--muted:#5b6478;--line:#e3e6ee;--link:#2a5bd7;--red:#e5484d;--blue:#3b8ef0;--yellow:#f2b705;--green:#30a46c}
@media (prefers-color-scheme:dark){:root{--bg:#0f1420;--ink:#e8ebf3;--muted:#a2abbd;--line:#263049;--link:#8fb0ff}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
main,header,footer{max-width:42rem;margin:0 auto;padding:0 1.25rem}
header{display:flex;align-items:center;gap:.75rem;padding-top:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--line)}
header a{color:var(--ink);text-decoration:none;font-weight:700;font-size:1.15rem}
.mark{display:grid;grid-template-columns:1fr 1fr;gap:3px;width:26px;height:26px}
.mark i{display:block;border-radius:3px}
.mark i:nth-child(1){background:var(--red)}
.mark i:nth-child(2){background:var(--blue)}
.mark i:nth-child(3){background:var(--yellow)}
.mark i:nth-child(4){background:var(--green)}
h1{font-size:2rem;line-height:1.2;margin:2rem 0 .5rem}
h2{font-size:1.2rem;margin:2rem 0 .5rem}
p,ul,ol{margin:.6rem 0}
li{margin:.3rem 0}
a{color:var(--link)}
.meta{color:var(--muted);font-size:.9rem}
.lang{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--line)}
.go{display:inline-block;margin:1rem 0;padding:.7rem 1.1rem;border-radius:8px;background:var(--link);color:var(--bg);font-weight:600;text-decoration:none}
footer{padding-top:2rem;padding-bottom:3rem;color:var(--muted);font-size:.9rem}
footer a{margin-right:1rem}
:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.games{list-style:none;padding:0;margin:1.5rem 0;display:grid;gap:.9rem}
.games li{margin:0}
.games a{display:block;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:10px;color:var(--ink);text-decoration:none}
.games a:hover{border-color:var(--link)}
.games strong{display:block;font-size:1.1rem}
.games span{display:block;color:var(--muted);font-size:.95rem}