/* Legal pages (v3): tokens.css and site.css (the v3 component layer) do the branding; this file only adds the reading column and table styles. */
/* Legal pages: one 720px reading column on surface-page. */
.bk-legal { width: 100%; max-width: 720px; margin: 0 auto; padding: var(--space-8) var(--space-5) var(--space-16); }
.bk-legal h1 { margin: 0 0 var(--space-5); font: 700 36px/44px var(--font-sans); letter-spacing: -0.02em; text-wrap: balance; }
.bk-legal h2 { margin: var(--space-10) 0 var(--space-3); font: 700 28px/36px var(--font-sans); letter-spacing: -0.01em; }
.bk-legal h3, .bk-legal h4 { margin: var(--space-6) 0 var(--space-2); font: 700 20px/28px var(--font-sans); }
.bk-legal p, .bk-legal ul { margin: 0 0 var(--space-4); }
.bk-legal ul { padding-inline-start: 1.4em; display: grid; gap: var(--space-2); }
.bk-legal a { color: var(--brand); text-underline-offset: 2px; }
.bk-legal code { font-family: var(--font-mono); font-size: .9em; background: var(--surface-band); padding: 0 4px; border-radius: var(--radius-sm); }
.bk-legal .table-wrap { overflow-x: auto; margin-block: var(--space-5); border: 1px solid var(--border-card); border-radius: var(--radius-lg); background: var(--surface-card); }
.bk-legal .table-wrap:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.bk-legal table { border-collapse: collapse; inline-size: 100%; min-inline-size: 34rem; font-size: 15px; line-height: 22px; }
.bk-legal th, .bk-legal td { padding: var(--space-3) var(--space-4); text-align: start; vertical-align: top; border-bottom: 1px solid var(--border-card); }
.bk-legal tbody tr:last-child td { border-bottom: 0; }
.bk-legal th { background: var(--surface-band); font-weight: 700; }
@media (max-width: 599px) { .bk-legal h1 { font-size: 30px; line-height: 36px; } .bk-legal h2 { font-size: 24px; line-height: 30px; } .bk-legal { font-size: 17px; line-height: 27px; } }
/* 320px: keep the sub-processor table scrolling inside its wrapper (min-width:0 lets a grid/flex parent shrink the column), and let the header's app button shrink and wrap instead of pushing the page wider. */
.bk-legal { min-inline-size: 0; }
.bk-legal .table-wrap { max-inline-size: 100%; }
@media (max-width: 379px) {
  .bk-header__tools { flex: 0 1 auto; min-inline-size: 0; }
  .bk-header__tools .bk-btn--primary { padding-inline: 10px; font-size: 13px; line-height: 16px; white-space: normal; text-align: center; }
}
/* Long URLs and email addresses in the text break instead of widening the page at 320px. */
.bk-legal :is(p, li, h1, h2, h3, h4) { overflow-wrap: anywhere; }
