/* seo-page.css — the arcade's static pages (/games/<id>/, /games/, /nl/), written by scripts/seo-pages.js.
   Warm beige and the pixel face for headings; plain system type for reading. Not used by the app itself. */
@font-face{font-family:"Silkscreen";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/silkscreen-400.woff2) format("woff2")}
:root{--bg:#f6ebd3;--card:#fffaf0;--ink:#3b2a14;--soft:#6e5a3c;--line:#e2d0a8;--amber:#d9a441;--amber-d:#8a5a10;--pix:"Silkscreen","VT323",ui-monospace,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:1.05rem/1.65 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--amber-d)}
a:hover{color:var(--ink)}
.top{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;align-items:center;justify-content:space-between;max-width:60rem;margin:0 auto;padding:1rem 1.25rem}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--pix);color:var(--ink);text-decoration:none;font-size:1.05rem}
.brand b{color:var(--amber-d);font-weight:400}
.top nav{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;align-items:center;font-size:.95rem}
.top nav a{color:var(--soft);text-decoration:none}
.top nav a.go{background:var(--amber);color:var(--ink);padding:.4rem .9rem;border-radius:.4rem;font-weight:600}
.wrap{max-width:60rem;margin:0 auto;padding:0 1.25rem 3rem}
.crumbs{font-size:.85rem;color:var(--soft);margin:.5rem 0 1rem}
h1,h2{font-family:var(--pix);font-weight:400;line-height:1.25;letter-spacing:.01em}
h1{font-size:clamp(1.5rem,5vw,2.4rem);margin:.4rem 0 .8rem}
h1 small{font-size:.5em;color:var(--soft)}
h2{font-size:1.15rem;margin:2.2rem 0 .7rem;color:var(--amber-d)}
.lead{font-size:1.15rem;max-width:42rem}
.poster{display:block;width:100%;max-width:640px;height:auto;border:3px solid var(--ink);border-radius:.5rem;margin:1.2rem 0;background:#222}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin:1.2rem 0}
.cta span{color:var(--soft);font-size:.9rem}
.btn{display:inline-block;background:var(--ink);color:var(--bg);padding:.75rem 1.4rem;border-radius:.5rem;text-decoration:none;font-family:var(--pix);font-size:.95rem;box-shadow:0 4px 0 var(--amber-d)}
.btn:hover{color:#fff;transform:translateY(1px)}
.facts{display:grid;grid-template-columns:max-content 1fr;gap:.5rem 1.2rem;background:var(--card);border:1px solid var(--line);border-radius:.6rem;padding:1rem 1.2rem}
.facts dt{font-weight:700}.facts dd{margin:0}
@media(max-width:34rem){.facts{grid-template-columns:1fr}.facts dd{margin-bottom:.4rem}}
ol,ul{padding-left:1.3rem}li{margin:.35rem 0}
.chips,.cards{list-style:none;padding:0;display:grid;gap:.7rem}
.chips{grid-template-columns:repeat(auto-fill,minmax(10rem,1fr))}
.cards{grid-template-columns:repeat(auto-fill,minmax(16rem,1fr))}
.chips a,.cards a{display:block;height:100%;background:var(--card);border:1px solid var(--line);border-radius:.6rem;padding:.7rem .9rem;text-decoration:none;color:var(--ink)}
.chips a:hover,.cards a:hover{border-color:var(--amber)}
.cards b{display:block;font-family:var(--pix);font-weight:400;font-size:.95rem}
.cards span{display:block;font-size:.88rem;color:var(--soft);margin:.2rem 0}
.cards i{font-size:.8rem;color:var(--amber-d);font-style:normal}
.faq dt{font-weight:700;margin-top:1rem}.faq dd{margin:.2rem 0 0}
.more{margin-top:2rem}
.foot{max-width:60rem;margin:0 auto;padding:1rem 1.25rem 2.5rem;font-size:.85rem;color:var(--soft);border-top:1px solid var(--line)}
