.legal-dialog { width: min(800px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 48px); padding: 0; border: 0; border-radius: 24px; background: var(--paper); color: var(--ink); font: 16px/1.65 var(--text); box-shadow: 0 24px 96px #09174460; overflow: hidden; }
.legal-dialog::backdrop { background: #091744b3; }
.legal-document { min-width: 0; }
.legal-dialog .legal-document { display: flex; flex-direction: column; max-height: calc(100dvh - 48px); }
.legal-heading { flex: 0 0 auto; padding: 28px 32px 20px; border-bottom: 1px solid var(--line); }
.legal-heading h1 { max-width: 28ch; padding-right: 32px; font: 700 clamp(21px, 4vw, 28px)/1.25 var(--display); letter-spacing: -.035em; overflow-wrap: anywhere; }
.legal-revision { margin-top: 10px !important; color: var(--muted); font-size: 13px; }
.legal-text { padding: 24px 32px 32px; overflow-wrap: anywhere; }
.legal-dialog .legal-text { overflow-y: auto; overscroll-behavior: contain; min-height: 0; scrollbar-gutter: stable; }
.legal-text:focus-visible { outline: 2px solid var(--blue); outline-offset: -5px; }
.legal-text h2 { margin: 28px 0 12px; font: 700 19px/1.35 var(--display); }
.legal-text p + p { margin-top: 14px; }
.legal-text ul { padding-left: 24px; margin: 14px 0; }
.legal-text li + li { margin-top: 8px; }
.legal-text a { text-underline-offset: 3px; }
.legal-draft { border-left: 3px solid var(--blue); padding: 12px 16px; background: #e7ecff; font-size: 14px; }
.legal-close { position: absolute; right: 16px; top: 16px; display: grid; place-items: center; width: 44px; height: 44px; padding: 10px; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); }
.legal-close:hover { background: #e7ecff; }
.legal-close svg { width: 20px; height: 20px; }
.legal-page { padding: 40px max(16px, env(safe-area-inset-left)) max(32px, env(safe-area-inset-bottom)); }
.legal-page-card { max-width: 800px; margin-inline: auto; background: var(--paper); border-radius: 24px; }
.legal-brand { display: inline-block; margin: 28px 32px 0; }
@media (max-width: 480px) {
  .legal-dialog { max-height: calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius: 20px; }
  .legal-dialog .legal-document { max-height: calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .legal-heading { padding: 24px 22px 18px; }
  .legal-heading h1 { padding-right: 36px; }
  .legal-text { padding: 20px 22px 28px; }
  .legal-close { top: 12px; right: 12px; }
  .legal-page { padding-top: 16px; }
  .legal-brand { margin: 24px 22px 0; }
}