/* Shared style for the Terms and Privacy pages, matching the game's paper-and-ink look. */
:root {
  --paper: #fbf6ea;
  --kraft: #e9dcc0;
  --ink: #2b2a26;
  --muted: #6b6252;
  --lake: #2f6f8f;
  --sun: #f2c14e;
  --font-marker: "Permanent Marker", "Comic Sans MS", "Marker Felt", cursive;
  --font-hand: "Shantell Sans", "Comic Sans MS", "Segoe Print", system-ui, sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--kraft);
  color: var(--ink);
  font: 400 17px/1.6 var(--font-hand);
}

main {
  max-width: 760px;
  margin: 32px auto;
  padding: 28px 32px 40px;
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 14px;
  box-shadow: 3px 3px 0 var(--ink);
}

h1, h2 { font-family: var(--font-marker); font-weight: 400; line-height: 1.2; }
h1 { font-size: 2.2rem; margin: .2em 0 .1em; }
h2 { font-size: 1.35rem; margin: 1.6em 0 .4em; }

a { color: var(--lake); }
ul { padding-inline-start: 1.3em; }
li { margin: .35em 0; }

.muted { color: var(--muted); margin-top: 0; }
.back { margin: 0 0 .5em; font-size: .95rem; }
.note { color: var(--muted); font-style: italic; }
mark { background: rgb(242 193 78 / .55); color: inherit; padding: 0 .2em; border-radius: 3px; }

@media (max-width: 640px) {
  main { margin: 0; padding: 20px 16px 32px; border: 0; border-radius: 0; box-shadow: none; }
  h1 { font-size: 1.8rem; }
}