:root{
  --bg:#ffffff; --surface:#f6f7f9; --border:#e3e6ea;
  --text:#15181d; --muted:#5b6472; --accent:#c8452b; --accent-soft:#fdeeea;
  --radius:14px; --maxw:56rem;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0f1114; --surface:#171a1f; --border:#282d34;
    --text:#e8eaed; --muted:#9aa3b0; --accent:#ff7a5c; --accent-soft:#2a1712;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  display:flex; flex-direction:column; min-height:100vh;
}
.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 1.25rem}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

header{border-bottom:1px solid var(--border); padding:1.1rem 0}
header .wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap}
.brand{font-weight:700; letter-spacing:-.02em; font-size:1.05rem; color:var(--text)}
.brand:hover{text-decoration:none; color:var(--accent)}
nav{display:flex; gap:1.25rem; font-size:.94rem}
nav a{color:var(--muted)}

main{flex:1; padding:3rem 0 4rem}
h1{font-size:2rem; line-height:1.2; letter-spacing:-.025em; margin:0 0 .6rem}
h2{font-size:1.2rem; letter-spacing:-.01em; margin:2.5rem 0 .75rem}
h3{font-size:1rem; margin:1.75rem 0 .5rem}
.lede{font-size:1.1rem; color:var(--muted); margin:0 0 2.5rem; max-width:42rem}
p{margin:0 0 1rem}

.games{display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(15rem,1fr)); padding:0; list-style:none; margin:0}
.card{
  display:block; padding:1.4rem; background:var(--surface);
  border:1px solid var(--border); border-radius:var(--radius); color:inherit;
}
.card:hover{text-decoration:none; border-color:var(--accent)}
.card h3{margin:0 0 .35rem; font-size:1.05rem}
.card p{margin:0; color:var(--muted); font-size:.92rem}
.tag{
  display:inline-block; margin-top:.9rem; padding:.2rem .55rem; font-size:.75rem;
  border-radius:999px; background:var(--accent-soft); color:var(--accent); font-weight:600;
}

.legal-links{display:flex; gap:1.25rem; flex-wrap:wrap; font-size:.94rem; margin-top:.5rem}

footer{border-top:1px solid var(--border); padding:2rem 0; font-size:.86rem; color:var(--muted)}
footer p{margin:0 0 .35rem}
footer a{color:var(--muted); text-decoration:underline}

/* generated legal documents */
.doc h1{margin-bottom:.25rem}
.doc .updated{color:var(--muted); font-size:.9rem; margin-bottom:2.5rem}
.doc h2{border-top:1px solid var(--border); padding-top:1.75rem}
.doc ul,.doc ol{padding-left:1.35rem; margin:0 0 1rem}
.doc li{margin-bottom:.4rem}
.doc code{background:var(--surface); padding:.12em .38em; border-radius:5px; font-size:.9em}
.doc table{width:100%; border-collapse:collapse; margin:0 0 1.25rem; font-size:.94rem}
.doc th,.doc td{border:1px solid var(--border); padding:.55rem .7rem; text-align:left; vertical-align:top}
.doc th{background:var(--surface)}
.doc blockquote{margin:0 0 1rem; padding:.6rem 1rem; border-left:3px solid var(--border); color:var(--muted)}
.table-scroll{overflow-x:auto}
