@layer harner.pages {
.legal { max-width: 1060px; }
.legal-head { padding: 48px 0 28px; max-width: 44em; }
.legal-kicker { font-size: var(--fs-sm); color: var(--text-3); margin-bottom: var(--space-2); }
.legal-head h1 { font-size: 36px; line-height: 1.1; letter-spacing: -.03em; text-wrap: balance; }
.legal-meta { margin-top: var(--space-3); font-size: var(--fs-sm); color: var(--text-3);
              font-variant-numeric: tabular-nums; }
.legal-grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--space-12);
              align-items: start; }
.legal-toc { position: sticky; top: var(--space-6); max-height: calc(100vh - 48px);
             overflow-y: auto; font-size: var(--fs-sm); }
.legal-toc-title { font-size: var(--fs-xs); color: var(--text-3); text-transform: uppercase;
                   letter-spacing: .06em; margin-bottom: var(--space-2); }
.legal-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px;
                counter-reset: toc; }
.legal-toc li { counter-increment: toc; }
.legal-toc a { display: flex; gap: var(--space-2); padding: var(--space-1) 0;
               color: var(--text-2); text-decoration: none; line-height: var(--lh-snug); }
.legal-toc a::before { content: counter(toc); min-width: 1.5em; color: var(--text-3);
                       font-variant-numeric: tabular-nums; }
.legal-toc a:hover { color: var(--text); }
.legal-doc { max-width: 68ch; font-size: var(--fs-base); line-height: 1.65; color: var(--text);
             counter-reset: sec; }
.legal-doc > * + * { margin-top: var(--space-4); }
.legal-doc h2 { counter-increment: sec; margin-top: 44px; font-size: var(--fs-2xl);
                letter-spacing: -.02em; line-height: var(--lh-tight);
                scroll-margin-top: var(--space-6); }
.legal-doc h2::before { content: counter(sec) ". "; color: var(--text-3); }
.legal-doc h3 { margin-top: var(--space-6); font-size: var(--fs-lg); font-weight: 600; }
.legal-doc p, .legal-doc li { color: var(--text-2); overflow-wrap: anywhere; }
.legal-doc strong { color: var(--text); font-weight: 600; }
.legal-doc ul, .legal-doc ol { padding-left: 1.3em; display: grid; gap: var(--space-2); }
.legal-doc a { color: var(--accent-text); text-underline-offset: 2px; }
.legal-doc code { font-family: var(--mono);
                  font-size: .9em; }
.legal-summary { padding: var(--space-5); background: var(--surface);
                 border: 1px solid var(--border); border-radius: var(--radius); }
.legal-summary > p:first-child { font-weight: 600; color: var(--text); }
.legal-summary ul { margin-top: var(--space-3); }
.legal-table { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); }
.legal-table table { width: 100%; border-collapse: collapse; font-size: var(--fs-md); }
.legal-table th, .legal-table td { padding: var(--space-3); text-align: left; vertical-align: top;
                                   border-bottom: 1px solid var(--border-soft); }
.legal-table tr:last-child td { border-bottom: 0; }
.legal-table th { font-weight: 600; color: var(--text); background: var(--bg-subtle); }
.legal-table td { color: var(--text-2); min-width: 9em; }
.legal-foot a[aria-current="page"] { color: var(--text); }
@media (max-width: 860px) {
  .legal-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .legal-toc { position: static; max-height: none; padding: var(--space-4);
               border: 1px solid var(--border); border-radius: var(--radius);
               background: var(--surface); }
}
@media (max-width: 520px) {
  .legal-head { padding: 32px 0 20px; }
  .legal-head h1 { font-size: 30px; }
  .legal-doc { font-size: var(--fs-md); }
  .legal-doc h2 { margin-top: 36px; font-size: var(--fs-xl); }
}
}
