/* The public pages (2026-10-30): landing, terms, privacy, refunds. Same type
   and colors as the app. */
@font-face{font-family:Fraunces;src:url(/f/fraunces.woff2) format("woff2-variations");font-weight:300 900;font-display:swap}
@font-face{font-family:Figtree;src:url(/f/figtree.woff2) format("woff2-variations");font-weight:300 900;font-display:swap}
:root{--logo-line:#27643c;--logo-lw:7px;--logo-shadow:#27643c;--logo-word:#27643c;--bg:#f4f2ea;--surface:#fffefa;--fg:#1c1a15;--muted:#6a6558;--line:#ddd7c8;--accent:#27643c;--on-accent:#fffefa;--warn:#9b5a1a}
@media (prefers-color-scheme:dark){:root{--bg:#13140f;--surface:#1b1d16;--fg:#ece9de;--muted:#9d998a;--line:#2e3127;--accent:#8cc07e;--on-accent:#101409;--warn:#e0a060;--logo-line:none;--logo-lw:0;--logo-shadow:#2f5a3c;--logo-word:#f8f6ee;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.6 Figtree,system-ui,sans-serif}
/* Below the status bar and the Dynamic Island in the iPhone app, which draws
   the page under them (2026-11-04: "Sign in" up top was hard to tap). */
.wrap{max-width:44rem;margin:0 auto;padding:calc(28px + env(safe-area-inset-top,0px)) 20px calc(48px + env(safe-area-inset-bottom,0px))}
h1,h2,h3{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 40;letter-spacing:-.012em;line-height:1.2}
h1{font-size:clamp(34px,8vw,52px);font-weight:650;margin:10px 0 12px}
h2{font-size:26px;font-weight:600;margin:40px 0 10px}
h3{font-size:19px;font-weight:600;margin:24px 0 6px}
p,li{color:var(--fg)}
.lede{font-size:19px;color:var(--muted);margin:0 0 24px}
.muted{color:var(--muted)}
a{color:var(--accent)}
.cta{display:inline-block;background:var(--accent);color:var(--on-accent);text-decoration:none;font-weight:700;
  border-radius:12px;padding:14px 22px;min-height:50px}
.cta.ghost{background:var(--surface);color:var(--fg);border:1px solid var(--line);font-weight:600}
.ctarow{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 8px}
.brand{display:inline-flex;align-items:center;gap:8px;font-family:Fraunces,Georgia,serif;font-weight:650;font-variation-settings:"SOFT" 60,"opsz" 144;font-size:26px;letter-spacing:-.01em;text-decoration:none;color:var(--logo-word)}
.brandmark{width:38px;height:38px;overflow:visible}
.lbody{fill:#fbe5c3;stroke:var(--logo-line);stroke-width:var(--logo-lw);stroke-linejoin:round}
.lshadow{fill:var(--logo-shadow)}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.top a.signin{font-weight:600;text-decoration:none}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin-top:10px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.card h3{margin-top:0}
.card p{margin:0;color:var(--muted)}
.price{background:var(--surface);border:2px solid var(--accent);border-radius:16px;padding:20px 22px}
.price .amt{font-family:Fraunces,Georgia,serif;font-size:34px;font-weight:650}
.price .alt{font-size:18px;font-weight:600;margin:2px 0 10px}
footer{margin-top:48px;padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
footer a{margin-right:16px}
.legal h2{font-size:22px;margin-top:30px}
.legal li{margin-bottom:6px}
.legal .agent{border-left:3px solid var(--line,#ccc);padding:2px 0 2px 14px;line-height:1.5}
/* Screenshots of the app (2026-11-03): a row that scrolls sideways on its own,
   edge to edge on a phone, so the page itself never does. */
.shots{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 20px;margin:28px -20px 0;padding:4px 20px 12px;-webkit-overflow-scrolling:touch}
.shots figure{flex:0 0 auto;width:min(60vw,210px);margin:0;scroll-snap-align:start}
.shots img{display:block;width:100%;height:auto;border-radius:20px;border:1px solid var(--line);background:var(--surface);box-shadow:0 6px 18px rgba(28,26,21,.08)}
.shots figcaption{font-size:15px;line-height:1.35;color:var(--muted);margin-top:8px;text-align:center}
.shots:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Wide enough for all five: out of the text column, centred, no scrolling. */
@media (min-width:1140px){.shots{width:1100px;margin-left:calc(50% - 550px);justify-content:center;overflow:visible;padding:4px 0 12px}}
