/* Shared shell for the standing pages: terms, privacy, refunds, contact,
   roadmap. Same tokens as the landing page, none of its layout: these are
   documents, so they get one column and a comfortable measure.
   The landing page keeps its styles inline because it is one file with a
   playground in it. Five documents sharing a shell is the case for a file. */
:root{
  --ground:#f7f7f4; --card:#fff; --ink:#1a2e12; --text-2:#4a5546; --muted:#8b9287;
  --green-dark:#2f5d1e; --hairline:rgba(20,40,10,.1); --r-pill:999px;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--ground);color:var(--ink);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;line-height:1.65}
.wrap{max-width:720px;margin:0 auto;padding:0 22px}

/* Header: the mark is the way back. */
header{padding:26px 0 0}
.home{display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  color:var(--ink);font-weight:700;font-size:16.5px;letter-spacing:-.02em}
.home img{width:26px;height:26px}

main{padding:44px 0 72px}
h1{font-size:clamp(30px,5.5vw,42px);font-weight:800;letter-spacing:-.035em;line-height:1.08}
.updated{margin-top:12px;font-size:13.5px;color:var(--muted)}
.lede{margin-top:20px;font-size:17px;color:var(--text-2)}
h2{margin:38px 0 12px;font-size:19px;font-weight:700;letter-spacing:-.02em}
h3{margin:24px 0 8px;font-size:15.5px;font-weight:650}
p,li{font-size:15px;color:var(--text-2)}
p+p{margin-top:13px}
ul,ol{margin:12px 0 0 20px;display:flex;flex-direction:column;gap:7px}
b,strong{color:var(--ink);font-weight:650}
a{color:var(--green-dark)}
code{font-family:var(--mono);font-size:13.5px;background:rgba(20,40,10,.05);
  padding:2px 5px;border-radius:5px;color:var(--ink)}
hr{border:0;border-top:1px solid var(--hairline);margin:34px 0}

/* A boxed answer, for the one thing on the page people came to read. */
.note{margin-top:22px;background:var(--card);border:1px solid var(--hairline);
  border-radius:14px;padding:18px 20px}
.note p{color:var(--ink)}


/* Roadmap columns. Three states, no dates, so a card is enough. */
.lanes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
@media(max-width:760px){.lanes{grid-template-columns:1fr}}
.lane{background:var(--card);border:1px solid var(--hairline);border-radius:14px;padding:18px}
.lane h2{margin:0 0 4px;font-size:13px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--green-dark)}
.lane ul{margin:12px 0 0;list-style:none;gap:11px}
.lane li{font-size:14px;padding-left:16px;position:relative}
.lane li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  border-radius:50%;background:var(--hairline)}
.lane.now li::before{background:var(--green-dark)}

/* The footer is the landing page's, styled by the generated assets/footer.css. */