/* ==========================================================================
   Styling for the standalone policy pages. They share the app's palette via
   app.css but not its layout: these are documents meant to be read on a
   phone, scrolled normally, and printed if anyone ever wants to.
   ========================================================================== */

body.doc{
  background:var(--bg);
  color:var(--txt);
  font-family:var(--ff);
  line-height:1.62;
  padding:0 20px env(safe-area-inset-bottom, 24px);
  -webkit-text-size-adjust:100%;
}

body.doc main{
  max-width:46rem;
  margin:0 auto;
  padding:28px 0 72px;
}

body.doc h1{
  font-size:30px; font-weight:800; letter-spacing:-.02em;
  margin:6px 0 4px;
}
body.doc h2{
  font-size:17.5px; font-weight:750; letter-spacing:-.01em;
  margin:34px 0 10px; color:var(--txt);
}
body.doc p{ margin:0 0 14px; color:var(--dim); font-size:15px; }
body.doc strong{ color:var(--txt); font-weight:680; }
body.doc em{ color:var(--txt); font-style:italic; }

body.doc ul{ margin:0 0 16px; padding-left:20px; }
body.doc li{ margin-bottom:8px; color:var(--dim); font-size:15px; }

body.doc code{
  font-family:var(--ff-mono); font-size:13px;
  background:var(--surface-2); border:1px solid var(--line-soft);
  border-radius:6px; padding:1px 6px; color:var(--txt);
}

body.doc a{ color:var(--red); text-decoration:underline; text-underline-offset:3px; }
/* Visible focus ring: these pages are keyboard-navigable and the default
   outline disappears against a dark background. */
body.doc a:focus-visible{
  outline:2px solid var(--red); outline-offset:3px; border-radius:3px;
}

.doc-date{ font-size:13px; color:var(--faint); margin-bottom:26px; }

.doc-back{ font-size:14px; margin:0 0 18px; }

/* Set apart from the body text: the caveats a reader should not skim past. */
.doc-note{
  margin:22px 0 14px; padding:13px 15px;
  border:1px solid var(--line); border-left:3px solid var(--red);
  border-radius:var(--r-sm, 10px);
  background:var(--surface-2);
  font-size:14px; color:var(--dim);
}
