/* Shared styling for Skrift's Privacy & Support pages — matches index.html */
:root {
  --bg:#f2ece0; --bg-2:#ebe3d3; --bg-3:#e2d7c2; --surface:#fbf8f1;
  --ink:#2a251e; --ink-dim:#6a6152; --ink-faint:#9b9080;
  --border:#ddd1bb; --border-2:#cabfa7; --accent:#a4711f; --accent-2:#b8823a; --cool:#4a5fca;
  --shadow:0 24px 60px -28px rgba(60,44,20,.45);
}
:root:not([data-theme="light"]){ color-scheme:light; }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  color-scheme:dark; --bg:#17161d; --bg-2:#1e1d26; --bg-3:#262530; --surface:#201f29;
  --ink:#ecebf1; --ink-dim:#a8a5b6; --ink-faint:#6f6c7e; --border:#302e3b; --border-2:#3b3947;
  --accent:#e0a458; --accent-2:#eab979; --cool:#8da2ff; --shadow:0 30px 70px -30px rgba(0,0,0,.7);
}}
:root[data-theme="dark"]{
  color-scheme:dark; --bg:#17161d; --bg-2:#1e1d26; --bg-3:#262530; --surface:#201f29;
  --ink:#ecebf1; --ink-dim:#a8a5b6; --ink-faint:#6f6c7e; --border:#302e3b; --border-2:#3b3947;
  --accent:#e0a458; --accent-2:#eab979; --cool:#8da2ff; --shadow:0 30px 70px -30px rgba(0,0,0,.7);
}
* { box-sizing:border-box; }
body {
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px; line-height:1.68; -webkit-font-smoothing:antialiased;
}
.wrap { width:min(760px,92vw); margin:0 auto; }
a { color:var(--accent); }
h1,h2 { font-family:"Fraunces",Georgia,serif; font-weight:500; text-wrap:balance; margin:0; }

/* header */
header { position:sticky; top:0; z-index:20; backdrop-filter:saturate(140%) blur(14px);
  background:color-mix(in srgb,var(--bg) 80%,transparent); border-bottom:1px solid var(--border); }
.nav { width:min(1120px,92vw); margin:0 auto; display:flex; align-items:center; gap:18px; height:64px; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; margin-right:auto; }
.brand img { width:28px; height:28px; filter:drop-shadow(0 3px 6px rgba(0,0,0,.35)); }
.brand .wm { font-family:"Fraunces",serif; font-weight:600; font-size:23px; color:var(--ink); }
.back { text-decoration:none; color:var(--ink-dim); font-size:15px; font-weight:500; padding:7px 13px; border-radius:8px; }
.back:hover { color:var(--ink); background:var(--bg-3); }
.tt { display:inline-grid; place-items:center; width:36px; height:36px; border:1px solid var(--border);
  border-radius:9px; background:var(--surface); color:var(--ink-dim); cursor:pointer; }
.tt:hover { color:var(--accent); border-color:var(--accent); }
.tt svg { width:17px; height:17px; }
.tt .moon { display:none; }
:root[data-theme="dark"] .tt .moon, :root:not([data-theme="light"]) .tt .moon { display:block; }
:root[data-theme="dark"] .tt .sun, :root:not([data-theme="light"]) .tt .sun { display:none; }
@media (prefers-color-scheme:light){ :root:not([data-theme="dark"]) .tt .moon{display:none;} :root:not([data-theme="dark"]) .tt .sun{display:block;} }

/* article */
main { padding:60px 0 40px; }
.eyebrow { font-size:13px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:var(--accent); }
h1 { font-size:clamp(32px,5vw,46px); line-height:1.08; margin:14px 0 6px; }
.updated { color:var(--ink-faint); font-size:14.5px; margin:0 0 8px; }
.lede { color:var(--ink-dim); font-size:19px; margin:22px 0 0; }
.doc { background:var(--surface); border:1px solid var(--border); border-radius:18px;
  padding:clamp(28px,4vw,46px); margin-top:34px; box-shadow:var(--shadow); }
.doc h2 { font-size:22px; margin:34px 0 10px; color:var(--ink); }
.doc h2:first-child { margin-top:0; }
.doc p { margin:0 0 14px; color:var(--ink-dim); }
.doc p strong { color:var(--ink); }
.doc ul { margin:0 0 14px; padding-left:22px; color:var(--ink-dim); }
.doc li { margin:6px 0; }
.doc a { font-weight:500; }
.callout { background:var(--bg-2); border:1px solid var(--border); border-radius:12px; padding:16px 18px; margin:8px 0 18px; }
.callout .em { font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:15px; color:var(--ink); }
.note { font-size:14.5px; color:var(--ink-faint); margin-top:6px; }

/* footer */
footer { border-top:1px solid var(--border); margin-top:50px; padding:34px 0; }
.foot { width:min(1120px,92vw); margin:0 auto; display:flex; flex-wrap:wrap; gap:14px 24px;
  align-items:center; justify-content:space-between; font-size:14.5px; color:var(--ink-faint); }
.foot a { color:var(--ink-dim); text-decoration:none; margin-right:16px; }
.foot a:hover { color:var(--accent); }