/* Terms / Privacy — the app's look (redesign 2026-10-08): deep ground with the
   glow of the coach you're with, Fraunces + Manrope (self-hosted), light text
   only. Coach colour: html[data-coach] set by /legal/legal.js. */
@import url('/fonts/redesign-fonts.css');

:root { --bg:#0b0d12; --fg:#ece9e2; --soft:#c9c5bd; --muted:#a7a39b; --rule:rgba(255,255,255,.09); --c:143,199,154; --cd:34,68,43; }
html[data-coach="compass"] { --c:143,199,154; --cd:34,68,43; }
html[data-coach="flora"]   { --c:226,180,110; --cd:79,55,20; }
html[data-coach="alethea"] { --c:179,166,238; --cd:53,43,99; }
html[data-coach="eirene"]  { --c:127,189,224; --cd:23,58,80; }
html[data-coach="socius"]  { --c:238,154,108; --cd:90,42,18; }
html[data-coach="echo"]    { --c:127,209,195; --cd:23,74,67; }
html[data-coach="muse"]    { --c:240,143,176; --cd:92,31,53; }

* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; min-height: 100vh; background: radial-gradient(110% 50% at 50% -10%, rgba(var(--c), .2) 0%, rgba(11,13,18,0) 65%) no-repeat, var(--bg);
  color: var(--fg); font: 16px/1.65 'Manrope', system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; }
main { max-width: 720px; margin: 0 auto; padding: calc(20px + env(safe-area-inset-top, 0px)) 16px 72px; }

nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 28px; font-size: .9rem; color: transparent; }   /* hides the " · " between links */
nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; text-decoration: none; font-weight: 700;
  color: #fff; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.24); }
nav a + a { background: transparent; border-color: var(--rule); color: var(--soft); font-weight: 600; }
nav a:hover { background: rgba(255,255,255,.18); color: #fff; }
nav a:focus-visible, a:focus-visible { outline: 2px solid var(--fg); outline-offset: 2px; }

h1 { font-family: 'Fraunces', Georgia, serif; font-weight: 400; font-size: 2.2rem; line-height: 1.1; margin: 0 0 6px; color: var(--fg); }
h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 400; font-size: 1.3rem; line-height: 1.25; color: var(--fg);
  margin: 34px 0 8px; padding-top: 18px; border-top: 1px solid var(--rule); }
h3 { font-size: 1rem; margin: 20px 0 6px; color: var(--fg); }
p, li { color: var(--soft); }
strong { color: var(--fg); }
.updated { color: var(--muted); margin: 0 0 22px; font-size: .88rem; }
.box { border-radius: 22px; padding: 16px 18px; margin: 18px 0; color: var(--fg);
  background: linear-gradient(160deg, rgba(var(--c), .16), rgba(255,255,255,.03) 70%); border: 1px solid rgba(var(--c), .32); }
.box, .box p { color: var(--fg); }
a { color: rgb(var(--c)); text-underline-offset: 3px; }
a:hover { color: #fff; }
ul { padding-left: 22px; }
li { margin: 4px 0; }
li::marker { color: rgb(var(--c)); }