/* /privacy, /terms and the sign-in error pages (functions/_shared/account.js). Loads after tokens.css + site.css. */
body.legal { background: var(--site-bg); }
.legal a { color: var(--mint-ink); font-weight: 600; text-decoration: none; }
.legal a:hover { text-decoration: underline; }
.legal a.btn:hover { text-decoration: none; }
.legal a.btn-ink { color: #F4F6F3; }
.legal-nav { height: 68px; display: flex; align-items: center; gap: 28px; padding: 0 max(24px, calc((100vw - 1040px) / 2)); }
.legal-nav .brand { display: flex; align-items: center; gap: 10px; font: 800 22px/1 var(--f-ui); letter-spacing: -0.02em; color: var(--ink); text-decoration: none; }
.legal-nav .brand img { width: 28px; height: 28px; }
.legal-nav nav { margin-left: auto; display: flex; gap: 20px; }
.legal-nav nav a { font: 550 15px/1 var(--f-ui); color: var(--ink-2); }
.legal-main { max-width: 720px; margin: 0 auto; padding: 56px 24px 96px; }
.legal-main h1 { font-size: clamp(40px, 6vw, 64px); line-height: 1.04; }
.legal-main .lede { font: 450 19px/1.55 var(--f-ui); color: var(--ink-2); margin: 22px 0 8px; max-width: 54ch; }
.legal-main .updated { font: 500 14px/1 var(--f-ui); color: var(--ink-3); margin: 0 0 40px; }
.legal-main h2 { font: 400 28px/1.15 var(--f-display); font-variation-settings: var(--axes); letter-spacing: -0.01em; margin: 44px 0 12px; }
.legal-main h2 em { font-style: italic; font-variation-settings: var(--axes-italic); }
.legal-main p, .legal-main li { font-size: 16.5px; line-height: 1.65; color: var(--ink); }
.legal-main ul { padding-left: 22px; margin: 10px 0; }
.legal-main li { margin: 6px 0; }
.legal-main li::marker { color: var(--mint-ink); }
.legal-main .box { border: 1.5px solid var(--ink); border-radius: 18px; padding: 18px 22px; background: #FBFCFA; margin: 18px 0; }
.legal-main .box p { margin: 0; }
.legal-main .small { font-size: 14px; color: var(--ink-3); }
.legal-foot { max-width: 720px; margin: 0 auto; padding: 0 24px 48px; font: 450 13px/1.5 var(--f-ui); color: var(--ink-3); display: flex; gap: 18px; flex-wrap: wrap; }
.oops .legal-main { padding-top: 12vh; }
.oops-actions { margin: 28px 0 16px; }