/* Shared by the thank-you, download and policy pages. */
:root {
  --bg: #07070b; --panel: #0e0e15; --line: rgba(255,255,255,.08); --line2: rgba(255,255,255,.14);
  --text: #f3f2ee; --muted: #9b9aa6; --dim: #6b6a78;
  --green: 56,219,117; --teal: 64,219,173; --red: 255,51,61; --amber: 255,189,56; --violet: 160,120,255; --cyan: 72,200,255;
  --edge: var(--violet);
  --serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans: "Geist", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); line-height: 1.6; -webkit-font-smoothing: antialiased; min-height: 100vh; display: flex; flex-direction: column; }
a { color: inherit; }
.page-edge { position: fixed; inset: 0; z-index: 50; pointer-events: none;
  box-shadow: inset 0 0 0 1.5px rgba(var(--edge), .55), inset 0 0 26px rgba(var(--edge), .3), inset 0 0 110px rgba(var(--edge), .1); }
.page-edge.arrive { animation: arrive 2.4s ease-out both; }
@keyframes arrive {
  0% { box-shadow: inset 0 0 0 1.5px rgba(var(--edge), 0), inset 0 0 0 rgba(var(--edge), 0), inset 0 0 0 rgba(var(--edge), 0); }
  35% { box-shadow: inset 0 0 0 2px rgba(var(--edge), 1), inset 0 0 60px rgba(var(--edge), .7), inset 0 0 200px rgba(var(--edge), .3); }
}
.wrap { max-width: 720px; margin: 0 auto; padding: 0 20px; }
nav { padding: 26px 0; }
nav .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
nav .back { color: var(--muted); font-size: 14px; text-decoration: none; }
nav .back:hover { color: var(--text); }
.logo { display: inline-flex; align-items: center; gap: 11px; font-weight: 600; font-size: 17px; letter-spacing: -.02em; text-decoration: none; }
.mark { width: 27px; height: 19px; border-radius: 6px; border: 2.5px solid rgb(var(--edge)); box-shadow: 0 0 12px rgba(var(--edge), .6); }
main { padding: 40px 0 80px; flex: 1; }
.tag { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; color: var(--muted); border: 1px solid var(--line); padding: 7px 15px; border-radius: 999px; margin-bottom: 26px; }
.tag i { width: 7px; height: 7px; border-radius: 50%; background: rgb(var(--edge)); box-shadow: 0 0 10px rgb(var(--edge)); }
h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(42px, 8vw, 68px); line-height: 1; letter-spacing: -.03em; text-wrap: balance; }
h1 em { color: rgb(var(--edge)); }
.lede { color: var(--muted); font-size: 18px; margin: 20px 0 32px; max-width: 56ch; }
.lede strong { color: var(--text); font-weight: 500; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 28px; border-radius: 999px; font: 600 16px/1 var(--sans); letter-spacing: -.01em; text-decoration: none; background: var(--text); color: #08080c; border: 0; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 10px 40px rgba(var(--edge), .45); }
.btn:active { transform: scale(.97); }
.btn-line { background: transparent; color: var(--text); border: 1px solid var(--line2); }
.meta { color: var(--dim); font-size: 13.5px; margin-top: 12px; }
.key { margin: 30px 0 0; background: var(--panel); border: 1px solid var(--line2); border-radius: 16px; padding: 18px 20px; }
.key label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.key .row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.key code { font-family: var(--mono); font-size: 15px; word-break: break-all; flex: 1; min-width: 0; }
.key button { font: 500 13px var(--sans); background: transparent; color: var(--text); border: 1px solid var(--line2); border-radius: 999px; padding: 7px 14px; cursor: pointer; }
ol.steps { list-style: none; counter-reset: s; margin-top: 52px; border-top: 1px solid var(--line); }
ol.steps li { counter-increment: s; display: grid; grid-template-columns: 44px 1fr; gap: 6px; padding: 22px 0; border-bottom: 1px solid var(--line); }
ol.steps li::before { content: counter(s); font-family: var(--mono); font-size: 13px; color: rgb(var(--edge)); padding-top: 4px; }
ol.steps h2 { font-size: 18px; font-weight: 500; letter-spacing: -.015em; }
ol.steps p { color: var(--muted); font-size: 15.5px; margin-top: 4px; }
kbd { font-family: var(--mono); font-size: 13px; background: var(--panel); border: 1px solid var(--line2); border-radius: 6px; padding: 1px 7px; color: var(--text); }
.box { margin-top: 40px; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 22px 24px; }
.box h2 { font-size: 16px; font-weight: 600; margin-bottom: 6px; }
.box p { color: var(--muted); font-size: 15px; }
.box p + p { margin-top: 8px; }
.box a { color: var(--text); }
form.inline { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
form.inline input { flex: 1; min-width: 220px; font: 16px var(--sans); color: var(--text); background: var(--bg); border: 1px solid var(--line2); border-radius: 999px; padding: 14px 20px; }
form.inline input:focus { outline: 2px solid rgba(var(--edge), .7); outline-offset: 1px; }
.notice { border-left: 2px solid rgb(var(--edge)); padding: 4px 0 4px 16px; color: var(--muted); margin: 0 0 26px; }
/* Policy pages */
.prose { max-width: 66ch; }
.prose .updated { color: var(--dim); font-size: 14px; margin: 14px 0 36px; }
.prose h2 { font-size: 20px; font-weight: 600; letter-spacing: -.015em; margin: 38px 0 10px; }
.prose p, .prose li { color: #c9c8d0; font-size: 16px; }
.prose p + p { margin-top: 12px; }
.prose ul { margin: 10px 0 0 20px; }
.prose li + li { margin-top: 6px; }
.prose a { color: var(--text); }
.prose strong { color: var(--text); font-weight: 500; }
.summary { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 18px 22px; margin: 0 0 8px; }
.summary p { color: var(--text) !important; }
footer { color: var(--dim); font-size: 13.5px; padding: 30px 0 40px; border-top: 1px solid var(--line); }
footer .wrap { display: flex; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; }
footer nav { padding: 0; display: flex; gap: 8px 18px; flex-wrap: wrap; }
footer a { text-decoration: none; }
footer a:hover { color: var(--text); }
@media (prefers-reduced-motion: reduce) { .page-edge.arrive { animation: none; } .btn { transition: none; } }
.prose a.btn { color: #08080c; text-decoration: none; }
