/* ============================================================
   illi document pages — terms, privacy, acceptable use, 404
   Same palette as the landing page now that the landing page is
   deep space: light type on a near-black navy, set for reading
   rather than for display. Headings keep the rounded brand face,
   body copy drops to Nunito 400 because a bold rounded face is
   unreadable over a page of policy.
   ============================================================ */

@font-face{
  font-family:'Boldonse';
  src:url('/assets/fonts/boldonse-latin.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2122,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Nunito';
  src:url('/assets/fonts/nunito-400-latin.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Nunito';
  src:url('/assets/fonts/nunito-800-latin.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap;
}

:root{
  --ground:#080A14;
  --paper:#F1EFEA;
  --sky:#7FB2FF;

  --muted:rgba(241,239,234,.74);
  --faint:rgba(241,239,234,.56);
  --rule:rgba(241,239,234,.14);
  --card:rgba(241,239,234,.05);

  --display:'Boldonse',"Arial Rounded MT Bold",system-ui,sans-serif;
  --rounded:"Arial Rounded MT Bold","Helvetica Rounded",ui-rounded,'Nunito',system-ui,sans-serif;
  --body:'Nunito',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{background:var(--ground)}
body{
  background:var(--ground);color:var(--paper);
  /* a breath of the same violet and blue the sky carries, so arriving
     here from the landing page does not feel like leaving the site */
  background-image:
    radial-gradient(70% 46% at 18% 0%, rgba(58,34,116,.34), rgba(58,34,116,0) 68%),
    radial-gradient(64% 40% at 92% 8%, rgba(18,52,124,.30), rgba(18,52,124,0) 66%);
  background-repeat:no-repeat;
  background-attachment:fixed;
  font-family:var(--body);line-height:1.66;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  padding:0 24px calc(80px + env(safe-area-inset-bottom));
}

.doc{max-width:680px;margin:0 auto}

header{padding:44px 0 30px;border-bottom:1px solid var(--rule);margin-bottom:38px}
.home{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--paper)}
.home svg{width:30px;height:30px;display:block;fill:currentColor}
.home span{font-family:var(--rounded);font-size:13px;color:var(--muted);letter-spacing:.02em}
.home:hover span{color:var(--paper)}
.home:focus-visible{outline:2px solid var(--sky);outline-offset:4px;border-radius:3px}

h1{
  font-family:var(--display);font-weight:400;
  font-size:clamp(27px,5.2vw,38px);line-height:1.16;letter-spacing:-.005em;
  color:var(--paper);margin:30px 0 12px;
}
.stamp{font-family:var(--rounded);font-size:12.5px;color:var(--faint);letter-spacing:.02em}

h2{
  font-family:var(--rounded);font-weight:400;
  font-size:18px;line-height:1.35;letter-spacing:.005em;
  color:var(--paper);margin:40px 0 12px;scroll-margin-top:24px;
}
h3{
  font-family:var(--rounded);font-weight:400;
  font-size:15.5px;color:var(--paper);margin:26px 0 8px;
}

p{font-size:15.5px;color:var(--muted);margin-bottom:14px}
ul{margin:0 0 16px 22px}
li{font-size:15.5px;color:var(--muted);margin-bottom:9px}
li::marker{color:var(--faint)}
strong{color:var(--paper);font-weight:800}

a{color:var(--paper);text-decoration:underline;text-decoration-color:var(--sky);
  text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--paper)}
a:focus-visible{outline:2px solid var(--sky);outline-offset:2px;border-radius:2px}

.lead{font-size:17px;color:var(--paper)}

.card{
  border:1px solid var(--rule);border-radius:14px;padding:18px 20px;
  margin:22px 0;background:var(--card);
}
.card p:last-child,.card ul:last-child{margin-bottom:0}

footer{
  margin-top:56px;padding-top:26px;border-top:1px solid var(--rule);
  font-family:var(--rounded);font-size:13px;color:var(--faint);
}
footer a{
  color:var(--muted);text-decoration:none;
  display:inline-block;white-space:nowrap;margin:0 18px 8px 0;
}
footer a:hover{color:var(--paper);text-decoration:underline;text-decoration-color:var(--sky)}
.foot-legal{font-family:var(--rounded);font-size:12.5px;color:var(--faint);margin-top:12px}

/* ---------- 404 ---------- */
body.is-404{padding-bottom:0}
.lost{
  min-height:100dvh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:40px 0 calc(40px + env(safe-area-inset-bottom));
}
.lost .mark{width:58px;height:58px;color:var(--paper);display:block}
.lost .mark svg{width:100%;height:100%;display:block;fill:currentColor}
.lost .thread{width:min(380px,78vw);height:auto;display:block;margin:44px 0 18px}
.lost h1{
  font-family:var(--display);font-size:clamp(30px,7vw,52px);
  line-height:1.1;margin:0 0 18px;color:var(--paper);
}
.lost p{font-size:16px;color:var(--muted);margin-bottom:38px;max-width:34ch}
.lost .back{
  font-family:var(--rounded);font-size:16px;
  display:inline-flex;align-items:center;
  background:var(--paper);color:var(--ground);
  padding:14px 30px;border-radius:999px;text-decoration:none;
}
.lost .back:hover{filter:brightness(1.06)}
.lost .back:focus-visible{outline:2px solid var(--sky);outline-offset:3px}