/* The look of the two public pages — privacy.html and support.html.
 *
 * A stylesheet rather than two copies of it, because these are the only pages
 * on the app a stranger reads and they must not drift apart. The tokens are the
 * shelf's own (games/index.html); the type is narrower, because this is prose
 * to be read once rather than a wall of cards to be scanned.
 *
 * Public by design: server/index.js exempts both pages and this file from the
 * sign-in gate. An App Store reviewer opens the privacy URL without an account,
 * and a 302 to a sign-in form is a rejection.
 */
:root{
  --bg:#0d0f13; --bg2:#141821; --ink:#e9ecf2; --dim:#98a1b2; --faint:#5d6675;
  --line:#242a36; --radius:16px;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:
    radial-gradient(1100px 620px at 12% -8%, #1b2333 0%, transparent 60%),
    radial-gradient(900px 520px at 92% 4%, #201a2b 0%, transparent 58%),
    var(--bg);
  background-attachment:fixed;
  color:var(--ink);
  font:16px/1.65 ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.wrap{max-width:74ch; margin:0 auto; padding:56px 24px 96px}
a{color:#8fd0dd}
a:hover{color:#b9e3eb}

.kicker{
  font:600 12px/1 var(--mono); letter-spacing:.18em;
  text-transform:uppercase; color:var(--faint); margin:0 0 14px;
}
h1{
  margin:0 0 8px; font-size:clamp(30px,4.4vw,44px); line-height:1.05;
  letter-spacing:-.025em; font-weight:680;
}
.updated{margin:0 0 40px; color:var(--faint); font-size:13px; font-family:var(--mono)}
h2{
  margin:44px 0 12px; font-size:20px; letter-spacing:-.012em; font-weight:640;
  padding-top:22px; border-top:1px solid var(--line);
}
h3{margin:26px 0 8px; font-size:16px; font-weight:640; color:var(--ink)}
p{margin:0 0 14px; color:#cfd6e2}
p.lede{color:var(--dim); font-size:17px; margin-bottom:26px}
ul{margin:0 0 16px; padding-left:22px; color:#cfd6e2}
li{margin:0 0 8px}
li strong{color:var(--ink)}
code{font-family:var(--mono); font-size:.88em; color:#b9e3eb;
  background:#181d27; border:1px solid var(--line); border-radius:5px; padding:1px 5px}

/* A statement of what the app does NOT do carries more weight boxed than in a
   sentence, and these are the three questions a school asks first. */
.card{
  background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 22px; margin:0 0 22px;
}
.card p:last-child, .card ul:last-child{margin-bottom:0}
.card .h{font:600 12px/1 var(--mono); letter-spacing:.14em; text-transform:uppercase;
  color:var(--faint); margin:0 0 12px}

footer{margin-top:56px; padding-top:22px; border-top:1px solid var(--line);
  color:var(--faint); font-size:13px}
footer a{margin-right:18px}
