/* Privacy and terms pages: plain reading layout in the KPC Revision look. */
.legal{max-width:720px;padding-bottom:64px}
.legal h1{font-size:40px;letter-spacing:-1.6px;margin:8px 0 6px}
.legal .updated{color:var(--muted);font-size:13px;margin-bottom:28px}
.legal h2{font-size:20px;letter-spacing:-.4px;margin:32px 0 8px}
.legal p,.legal li{font-size:15px;line-height:1.75;margin:0 0 12px}
.legal ul{padding-left:20px;margin:0 0 12px}
.legal a{color:var(--purple);text-decoration:underline}
.legal-foot{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px}
.legal-foot a{color:var(--muted);text-decoration:underline;min-height:24px}
@media(max-width:700px){.legal h1{font-size:30px}.wrap.legal{padding:0 18px 48px}}
/* Footer text on these pages comes from the landing styles at 9-10px: keep it readable. */
body:has(main.legal) .footer-row>span,body:has(main.legal) footer details{font-size:12px}
body:has(main.legal) .footer-row{flex-wrap:wrap;gap:4px 18px}
body:has(main.legal) .legal-foot a,.subjects .legal-foot a{display:inline-flex;align-items:center;min-height:44px}
/* Dark mode for the privacy and terms pages only (index.html also loads this file, so stay scoped). */
@media(prefers-color-scheme:dark){
body:has(main.legal){color-scheme:dark;--purple:#c99bf0;--ink:#eadff2;--muted:#b3a2c1;--line:#3f2f4b;background:#1d1424}
body:has(main.legal) .brand{color:#c99bf0}
body:has(main.legal) .skip{background:#271b31;color:#eadff2}
body:has(main.legal) a:focus-visible{outline-color:#dcbcf7}
body:has(main.legal) .footer-row{border-top-color:#3f2f4b}
body:has(main.legal) .footer-row>span{color:#b3a2c1}
/* The mark PNG has a half-white background: sit it on a white chip so it does not show as a grey box. */
body:has(main.legal) .brand img{background:#fff;border-radius:10px;padding:2px}
}