/* Shared styling for the static pages that sit outside the app: the trust pages
   (about / ratings / privacy / contact) and the per-game and per-week share pages.

   The palette is copied from index.html's :root. It is duplicated deliberately —
   these pages must render even if the app never loads — so if you change a colour
   in index.html, change it here too. Contrast values here are the WCAG-AA-passing
   ones; do not "restore" the older, dimmer greys. */
:root{
  --bg:#0d1117; --bg2:#151c26; --card:#1a2230; --card2:#212b3d;
  --line:#2c3748; --txt:#e8edf4; --dim:#a7b4c6; --faint:#8b98ab;
  --accent:#3fb46c; --accent2:#2dd4bf; --gold:#f5c518; --red:#e5534b;
  --chip:#26334a; --radius:14px;
  font-size:100%;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--bg);color:var(--txt);
  font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.6;
}
a{color:var(--accent2)}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:4px}

header{border-bottom:1px solid var(--line);background:var(--bg2)}
.hwrap{max-width:720px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.15rem;letter-spacing:-.02em;color:var(--txt);text-decoration:none}
.brand .mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#08121c;font-size:.9rem}
.back{margin-left:auto;font-size:.82rem;font-weight:600}

main{max-width:720px;margin:0 auto;padding:34px 20px 20px}
h1{font-size:1.6rem;letter-spacing:-.02em;margin-bottom:6px}
h2{font-size:1.02rem;margin:30px 0 8px;letter-spacing:-.01em}
p{margin:12px 0;font-size:.95rem}
ul{margin:12px 0 12px 22px;font-size:.95rem}
li{margin:6px 0}
.lede{color:var(--dim);font-size:1rem;margin-bottom:4px}
.note{font-size:.85rem;color:var(--faint)}
code{background:var(--card);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:.85em}

footer{max-width:720px;margin:0 auto;padding:26px 20px 46px;border-top:1px solid var(--line);font-size:.78rem;color:var(--faint)}

/* ---- share pages (per game / per week) ---- */
.sgame{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;margin:16px 0}
.steams{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.strow{display:flex;align-items:center;gap:10px}
.sbar{width:5px;height:22px;border-radius:3px;flex:0 0 auto}
.sabbr{font-weight:800;width:46px;flex:0 0 auto}
.sname{color:var(--dim);font-size:.9rem}
.swhen{font-size:.85rem;color:var(--dim)}
.swhere{font-size:.8rem;color:var(--faint)}
.srate{display:flex;align-items:baseline;gap:10px;margin-top:12px;flex-wrap:wrap}
.snum{font-size:1.8rem;font-weight:800;letter-spacing:-.03em}
.sof{font-size:.8rem;color:var(--faint)}
.snv{font-size:.8rem;color:var(--faint)}
.verdict{font-size:.66rem;font-weight:800;letter-spacing:.08em;padding:4px 9px;border-radius:6px;display:inline-block}
.v-must{background:#173d26;color:#5ce68f}.v-great{background:#123a37;color:#3ce0cb}
.v-solid{background:#1c2f4d;color:#9cc9ff}.v-watch{background:#2a3245;color:#b3c0d4}
.v-skip{background:#3a2226;color:#ff9d9f}.v-upc{background:#2a3245;color:#b3c0d4}
.cta{display:inline-block;margin-top:14px;background:var(--accent);color:#07130b;font-weight:700;font-size:.88rem;padding:9px 18px;border-radius:9px;text-decoration:none}
.cta:hover{color:#07130b;filter:brightness(1.08)}
.slist{list-style:none;margin-left:0}
.slist li{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.slist li:last-child{border-bottom:none}
.slist .r{font-weight:800;color:var(--gold);width:44px;flex:0 0 auto}