/* Legal pages and the legal modal, in the /camera language. Legal body copy is the one
   deliberate sentence-case exception: caps at 15px for two thousand words is unreadable. */
.legal-page { position: relative; z-index: 2; max-width: 720px; margin: 0 auto; padding: 120px 24px 140px; }
.legal-page .eyebrow, .legal-modal .eyebrow { color: var(--accent); font-size: 11px; letter-spacing: .22em; font-weight: 400; margin-bottom: 14px; }
.legal-page h1, .legal-modal h1 { font-weight: 900; font-size: clamp(28px, 5vw, 44px); letter-spacing: .05em; line-height: 1.05; color: var(--bright); margin-bottom: 8px; }
.legal-page .updated, .legal-modal .updated { color: var(--dim); font-size: 11px; letter-spacing: .12em; margin-bottom: 34px; }
.legal-page h2, .legal-modal h2 { font-weight: 400; font-size: 12px; letter-spacing: .18em; color: var(--accent); margin: 30px 0 10px; }
.legal-page p, .legal-page li, .legal-modal p, .legal-modal li { text-transform: none; letter-spacing: .01em; font-weight: 300; font-size: 15px; line-height: 1.65; color: var(--text); }
.legal-page p, .legal-modal p { margin: 0 0 12px; }
.legal-page ul, .legal-modal ul { padding-left: 20px; margin: 0 0 12px; }
.legal-page li, .legal-modal li { margin: 4px 0; }
.legal-page a, .legal-modal a { color: var(--accent); text-decoration: none; text-transform: none; letter-spacing: .01em; border-bottom: 1px solid rgba(246,194,59,.35); }
.legal-page .tldr, .legal-modal .tldr { background: var(--glass); border: 1px solid var(--line); border-radius: 18px; padding: 16px 18px; margin: 0 0 22px; }
.legal-page .back { position: fixed; top: 26px; right: 24px; z-index: 90; }
/* the modal */
.legal-modal { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(5,5,6,.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.legal-modal.open { display: flex; }
.legal-modal .panel { position: relative; width: min(760px, 100%); max-height: min(84vh, 900px); overflow: auto; background: rgba(12,12,14,.92); border: 1px solid var(--line); border-radius: 28px; padding: 40px 36px 44px; box-shadow: 0 40px 120px rgba(0,0,0,.7); -webkit-overflow-scrolling: touch; }
.legal-modal .close { position: sticky; top: 0; float: right; margin: -8px -8px 0 0; height: 36px; padding: 0 16px; display: inline-flex; align-items: center; font-size: 11px; font-weight: 400; color: var(--dim); background: rgba(20,20,22,.9); border: 1px solid var(--line); border-radius: var(--pill); cursor: pointer; }
.legal-modal .close:hover { color: var(--bright); background: var(--glass-hi); }
.legal-modal .panel::-webkit-scrollbar { width: 6px; } .legal-modal .panel::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12); border-radius: 3px; }
@media (max-width: 640px) { .legal-modal { padding: 12px; } .legal-modal .panel { padding: 28px 20px 32px; border-radius: 22px; max-height: 88vh; } .legal-page { padding: 100px 18px 120px; } }
