/* Split 16 site. One stylesheet, no inline styles, so the Content Security Policy can forbid them. */

:root { --bg:#08080a; --card:#121214; --card2:#1b1b1f; --line:#2a2a30; --ink:#f4f4f6; --ink2:#a2a2ad; --ink3:#5e5e68; --accent:#d8ff3f; --run:#c6f04a; --station:#9b8cff; --mint:#3dffa0; }
* { box-sizing:border-box }
html, body { margin:0; background:var(--bg); color:var(--ink); }
body { font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); }
[hidden] { display:none !important; }

/* Home */

.home .wrap { max-width:56rem; margin:0 auto; padding:0 1.25rem; }
.home header { position:relative; overflow:hidden; padding:2rem 0 3rem; }
.home header .wrap { display:flex; flex-direction:column; align-items:flex-start; gap:2.25rem; position:relative; z-index:1; }
.home .bg-mark { position:absolute; right:-14%; top:-42%; width:min(70vw, 620px); opacity:.16; transform:rotate(-14deg); pointer-events:none; }
.home .bg-mark svg { width:100%; height:auto; display:block; }
.home .lockup svg { display:block; max-width:100%; height:auto; }
.home h1 { font-size:clamp(2.4rem, 7vw, 4.2rem); line-height:1.02; letter-spacing:-.02em; margin:0; max-width:14ch; font-weight:800; text-wrap:balance; }
.home .lede { font-size:1.2rem; color:var(--ink2); max-width:38ch; margin:0; }
.home .figures { display:flex; gap:1.5rem; align-items:baseline; }
.home .figures b { font-size:2.6rem; font-weight:800; color:var(--accent); letter-spacing:-.02em; }
.home .figures span { font-size:.85rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); margin-left:.4rem; }
.home .cta { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }
.home .btn { display:inline-flex; align-items:center; justify-content:center; height:56px; padding:0 1.6rem; border-radius:999px; background:var(--accent); color:var(--bg); font-weight:700; text-decoration:none; font-size:1.02rem; }
.home .btn.ghost { background:var(--card2); color:var(--ink); }
.home .note { color:var(--ink3); font-size:.9rem; margin:0; }
.home section { padding:2.5rem 0; }
.home h2 { font-size:.85rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); margin:0 0 1rem; font-weight:700; }
.home .grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr)); gap:.9rem; }
.home .card { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:1.3rem 1.35rem; display:flex; flex-direction:column; gap:.4rem; }
.home .card h3 { margin:0; font-size:1.1rem; }
.home .card p { margin:0; color:var(--ink2); font-size:.98rem; }
.home .dot { width:12px; height:12px; border-radius:999px; display:inline-block; margin-bottom:.35rem; }
.home .bar { display:flex; height:26px; border-radius:999px; overflow:hidden; font-size:.78rem; font-weight:700; color:var(--bg); margin:.5rem 0 0; }
.home .bar span { display:flex; align-items:center; justify-content:center; }
.home footer { border-top:1px solid var(--line); padding:2rem 0 3.5rem; color:var(--ink3); font-size:.92rem; }
.home footer .wrap { display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; align-items:center; justify-content:space-between; }
.home footer nav { display:flex; gap:1.4rem; }
.home footer a { color:var(--ink2); text-decoration:none; }
.home footer a:hover { color:var(--ink); text-decoration:underline; }
@media (prefers-reduced-motion: no-preference) { .home .bg-mark { animation:drift 14s ease-in-out infinite alternate; } @keyframes drift { from { transform:rotate(-14deg) translateY(0) } to { transform:rotate(-10deg) translateY(12px) } } }

/* Notice pages: a shared plan, the Strava return, errors. One card in the middle of the screen. */

body.notice { min-height:100vh; display:grid; place-items:center; line-height:1.55; }
.notice main { width:100%; max-width:26rem; padding:2rem 1.25rem; }
.notice .card { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:1.75rem; }
.notice .logo { display:block; margin:0 0 1.2rem; }
.notice .logo svg { display:block; height:auto; max-width:100%; }
.notice h1 { font-size:1.6rem; line-height:1.2; margin:0 0 .6rem; }
.notice p { color:var(--ink2); margin:.5rem 0 0; }
.notice .button { display:block; margin-top:1.4rem; padding:.95rem 1rem; border-radius:14px; background:var(--accent); color:#08080a; font-weight:700; text-align:center; text-decoration:none; }
.notice .quiet { font-size:.85rem; margin-top:1.2rem; }

/* Privacy policy, rendered from Markdown. */

.privacy main { max-width:44rem; margin:0 auto; padding:3rem 1.25rem 5rem; }
.privacy h1 { font-size:2.2rem; line-height:1.15; margin:0 0 .5rem; }
.privacy h2 { font-size:1.25rem; margin:2.5rem 0 .5rem; }
.privacy p { color:var(--ink2); margin:.6rem 0; }
.privacy .table { overflow-x:auto; margin:1rem 0; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.privacy table { border-collapse:collapse; width:100%; min-width:34rem; font-size:.92rem; }
.privacy th, .privacy td { text-align:left; vertical-align:top; padding:.7rem .9rem; border-bottom:1px solid var(--line); color:var(--ink2); }
.privacy th { color:var(--ink); font-weight:600; }
.privacy tr:last-child td { border-bottom:0; }
.privacy .logo { display:inline-block; margin:0 0 2rem; }
.privacy .logo svg { display:block; height:auto; max-width:100%; }