/* Styles for onlyread's text pages (today only /privacy/). The home page keeps styles.css. */
:root { --pink:#db2777; --ink:#261a24; --muted:#756b73; --quiet:#7d6474; --line:#e9dfe5; --display:"Manrope",sans-serif; --body:"DM Sans",sans-serif; }
* { box-sizing:border-box; }
html { accent-color:var(--pink); scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; color:var(--ink); font:16px/1.65 var(--body); background:#fff; -webkit-text-size-adjust:100%; }
a { color:var(--pink); text-underline-offset:3px; }
a:focus-visible { outline:3px solid var(--pink); outline-offset:3px; border-radius:3px; }
::selection { background:#fbcfe2; color:var(--ink); }
img { max-width:100%; height:auto; }
.wrap { width:min(760px,100% - 32px); margin-inline:auto; }
.skip-link { position:absolute; left:-999px; top:8px; padding:8px 12px; background:#fff; color:var(--pink); border-radius:8px; z-index:10; }
.skip-link:focus { left:16px; }
header.site { display:flex; align-items:center; justify-content:space-between; gap:12px 16px; padding-block:24px; flex-wrap:wrap; }
header.site .brand img { display:block; width:132px; height:auto; }
header.site nav { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
header.site nav a { color:var(--muted); font-size:14px; text-decoration:none; }
header.site nav a:hover { color:var(--pink); }
main { padding-block:16px 72px; }
.crumbs { margin:0 0 24px; font-size:13px; color:var(--muted); }
.crumbs a { color:var(--muted); text-decoration:none; }
.crumbs a:hover { color:var(--pink); }
.crumbs span { margin-inline:6px; }
.kicker { margin:0; color:var(--pink); font-weight:600; font-size:14px; }
h1 { margin:6px 0 10px; font:800 clamp(34px,5.6vw,52px)/1.06 var(--display); letter-spacing:-.04em; }
.updated { margin:0; color:var(--muted); font-size:14px; }
h2 { margin:44px 0 10px; font:750 24px/1.2 var(--display); letter-spacing:-.02em; }
h3 { margin:26px 0 6px; font:700 17px/1.3 var(--display); }
p, li { color:#4a3d47; }
main p, main li { max-width:72ch; }
li + li { margin-top:6px; }
strong { color:var(--ink); }
code, kbd { font:.92em ui-monospace,SFMono-Regular,Menlo,monospace; background:#f6eff3; padding:1px 5px; border-radius:5px; color:var(--ink); }
.table-wrap { overflow-x:auto; margin-top:12px; }
table { width:100%; border-collapse:collapse; font-size:15px; }
th, td { padding:10px 12px 10px 0; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { font-weight:600; color:var(--ink); }
td:last-child, th:last-child { padding-right:0; }
footer.site { padding-block:28px 40px; border-top:1px solid var(--line); color:var(--quiet); font-size:13px; }
footer.site nav { display:flex; flex-wrap:wrap; gap:8px 20px; margin-bottom:10px; }
footer.site nav a { color:#816b79; text-decoration:none; }
footer.site nav a:hover { color:var(--pink); }
footer.site .legal { display:block; margin-top:10px; line-height:1.6; }
@media(max-width:640px) {
  header.site nav { gap:14px; }
}
@media(max-width:560px) {
  table.stack thead { display:none; }
  table.stack tr { display:block; padding:10px 0; border-bottom:1px solid var(--line); }
  table.stack th, table.stack td { display:block; padding:3px 0; border:0; }
  table.stack td::before { content:attr(data-label); display:block; font-size:12px; color:var(--muted); }
}