/* ============================================================
   EverLull — legal pages (privacy, terms)
   Self-contained: same tokens + self-hosted fonts as the app,
   but a calm long-form reading layout instead of the console.
   ============================================================ */
@font-face{ font-family:"Instrument Sans"; font-style:normal; font-weight:400 700; font-display:swap; src:url("fonts/instrument-sans-var.woff2") format("woff2"); }
@font-face{ font-family:"Instrument Sans"; font-style:italic; font-weight:400 700; font-display:swap; src:url("fonts/instrument-sans-var-italic.woff2") format("woff2"); }
@font-face{ font-family:"Instrument Serif"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/instrument-serif.woff2") format("woff2"); }
@font-face{ font-family:"Instrument Serif"; font-style:italic; font-weight:400; font-display:swap; src:url("fonts/instrument-serif-italic.woff2") format("woff2"); }
@font-face{ font-family:"Space Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/space-mono-400.woff2") format("woff2"); }

:root{
  --ink:#060811; --ink-2:#0a0f1e; --sea:#0f1730;
  --hair:rgba(232,200,154,0.14); --hair-cool:rgba(180,200,255,0.10);
  --moon:#ecca97; --moon-hi:#f6e2bd; --star:#eef2fc;
  --mist:#93a0bf; --mist-2:#63708f; --ease:cubic-bezier(.22,1,.36,1);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--ink); color:var(--star);
  font-family:"Instrument Sans",system-ui,-apple-system,sans-serif;
  font-size:16.5px; line-height:1.7; letter-spacing:-0.01em;
  -webkit-font-smoothing:antialiased;
}
body::before{ /* the same faint film grain as the app, for continuity */
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  mix-blend-mode:screen;
}
a{ color:var(--moon); text-decoration:none; transition:color .2s; }
a:hover{ color:var(--moon-hi); }

.legal-nav{
  position:sticky; top:0; z-index:5; backdrop-filter:blur(10px);
  background:rgba(6,8,17,.72); border-bottom:1px solid var(--hair-cool);
}
.legal-nav .wrap{ display:flex; align-items:center; justify-content:space-between; padding:16px 26px; }
.brand{ display:flex; align-items:center; gap:11px; font-family:"Instrument Serif",serif; font-size:22px; color:var(--star); }
.brand svg{ width:26px; height:26px; }
.legal-nav a.back{ font-family:"Space Mono",monospace; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--mist); }

.wrap{ max-width:760px; margin:0 auto; padding:0 26px; position:relative; z-index:1; }
main.wrap{ padding-top:54px; padding-bottom:100px; }

.eyebrow{ font-family:"Space Mono",monospace; font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--moon); }
h1{ font-family:"Instrument Serif",serif; font-weight:400; font-size:clamp(40px,7vw,68px); line-height:1.02; letter-spacing:-.02em; margin:14px 0 10px; }
h1 .serif-i{ font-style:italic; color:var(--moon); }
.updated{ font-family:"Space Mono",monospace; font-size:12.5px; color:var(--mist-2); margin-bottom:8px; }
.lede{ font-size:19px; color:var(--mist); max-width:60ch; margin:22px 0 40px; }

h2{ font-family:"Instrument Serif",serif; font-weight:400; font-size:29px; letter-spacing:-.01em; margin:52px 0 6px; scroll-margin-top:80px; }
h2 .num{ color:var(--moon); font-size:.7em; margin-right:12px; }
h3{ font-size:17px; font-weight:600; margin:26px 0 4px; color:var(--star); }
p{ margin:12px 0; color:#c3ccdf; }
strong{ color:var(--star); }
ul{ margin:12px 0; padding-left:22px; }
li{ margin:8px 0; color:#c3ccdf; }
li::marker{ color:var(--moon); }

.callout{
  border:1px solid var(--hair); border-radius:14px; padding:20px 24px; margin:30px 0;
  background:linear-gradient(160deg,rgba(236,202,151,.05),rgba(15,23,48,.3));
}
.callout strong{ color:var(--moon-hi); }
.note{ font-size:13.5px; color:var(--mist-2); }
.placeholder{ color:var(--moon); font-style:italic; }

.toc{ border:1px solid var(--hair-cool); border-radius:14px; padding:20px 24px; margin:0 0 44px; background:rgba(10,15,30,.4); }
.toc-title{ font-family:"Space Mono",monospace; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--mist-2); margin-bottom:12px; }
.toc ol{ margin:0; padding-left:20px; columns:2; column-gap:34px; }
.toc li{ margin:5px 0; }
.toc a{ color:var(--mist); }
.toc a:hover{ color:var(--moon); }
@media (max-width:560px){ .toc ol{ columns:1; } }

.legal-foot{ border-top:1px solid var(--hair-cool); margin-top:70px; padding:34px 0 0; }
.legal-foot .wrap{ display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; }
.legal-foot span, .legal-foot a{ font-family:"Space Mono",monospace; font-size:12px; letter-spacing:.05em; color:var(--mist-2); }
.legal-foot a{ color:var(--mist); }
