/*
 * The one stylesheet both legal pages use.
 *
 * Shared rather than inlined twice: the two documents are read side by side and
 * cross-link to each other, so a heading that is 19px on one and 20px on the
 * other is visible the moment somebody follows the link. One file is also the
 * only way a later revision cannot restyle the terms and forget the privacy
 * policy.
 *
 * No build step, no CDN, no webfont. These pages are opened from inside the app
 * (expo-web-browser) on a phone that has just been asked to trust us with a
 * card and a camera roll — a blank page because a font host is blocked is the
 * worst possible first impression, and the system stack renders identically to
 * the app's own chrome anyway.
 */
:root{
  --bg:#ffffff; --ink:#0d1117; --dim:#4b5563; --faint:#8b95a5;
  --line:#e5e7eb; --teal:#0f9e9b; --panel:#f6f8fa;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0b0f14; --ink:#e6edf5; --dim:#9aa8bb; --faint:#67748a;
         --line:#1f2a37; --teal:#3ddad7; --panel:#121821; }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:17px/1.65 ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
/* viewport-fit=cover + these insets: opened in the in-app browser the page runs
   under the home indicator, and the last paragraph sat beneath it. */
main{
  max-width:720px; margin:0 auto;
  padding:28px max(20px,env(safe-area-inset-left)) calc(56px + env(safe-area-inset-bottom));
}
a{color:var(--teal)}
h1{font-size:30px; line-height:1.2; letter-spacing:-.02em; margin:0 0 6px}
h2{font-size:20px; line-height:1.3; letter-spacing:-.01em; margin:34px 0 8px}
h3{font-size:17px; margin:22px 0 6px}
p,li{color:var(--dim)}
p{margin:0 0 14px}
ul{margin:0 0 14px; padding-left:22px}
li{margin:0 0 7px}
strong{color:var(--ink); font-weight:600}
.brand{display:flex; align-items:center; gap:9px; margin-bottom:26px}
.brand .dot{width:11px; height:11px; border-radius:3px; background:var(--teal)}
.brand span{font-size:15px; font-weight:600; letter-spacing:-.01em}
/* The version block. Deliberately the first thing under the title: these
   documents are revised, and "which one did I agree to" is answered by a
   version and a date, never by the prose. */
.meta{
  background:var(--panel); border:1px solid var(--line); border-radius:12px;
  padding:12px 14px; margin:0 0 26px;
  font-size:14px; line-height:1.5; color:var(--dim);
}
.meta b{color:var(--ink); font-weight:600}
footer{margin-top:44px; padding-top:18px; border-top:1px solid var(--line);
  font-size:14px; color:var(--faint)}
footer a{margin-right:16px}
/* The one-sentence summary a mandate opens with, on the seller tax page. A
   document somebody is being asked to ACCEPT has to state its bargain before
   its reasoning; `.meta` is the version block and cannot also be that, since
   the two would then sit on top of each other saying different things. */
.key{
  border-left:3px solid var(--teal); background:var(--panel);
  border-radius:0 12px 12px 0; padding:12px 14px; margin:0 0 26px;
}