/* Legal and privacy screens share the application typography and controls. */
:root { color-scheme: light; color: var(--ui-text, #17212b); background: var(--ui-bg, #f4f6f8); }
body { min-height: 100dvh; background: var(--ui-bg, #f4f6f8); font-family: var(--ui-font, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif); font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
a { color: #006eb6; text-underline-offset: 3px; }
:where(a, button, input, select, textarea):focus-visible { outline: 3px solid rgb(0 110 182 / 38%); outline-offset: 3px; }
.legal-shell { width: min(960px, calc(100% - 64px)); margin: 48px auto; }
.legal-card { padding: clamp(28px, 5vw, 64px); border-color: #dce3e9; border-radius: 16px; background: #fff; box-shadow: 0 4px 24px rgb(23 33 43 / 4%); }
.legal-kicker { margin-bottom: 16px; color: #526171; font-size: 12px; font-weight: 600; letter-spacing: .075em; }
h1 { max-width: 22ch; margin-bottom: 24px; font-size: clamp(28px, 4vw, 42px); font-weight: 650; line-height: 1.15; letter-spacing: -.04em; overflow-wrap: normal; }
h2 { margin: 40px 0 16px; font-size: 20px; font-weight: 650; line-height: 1.35; letter-spacing: -.025em; }
p, li, dd { line-height: 1.7; overflow-wrap: anywhere; }
p { margin-block: 16px; }
ul { padding-left: 24px; }
li + li { margin-top: 8px; }
dt { margin-top: 20px; color: #526171; font-size: 12px; font-weight: 600; }
dd { margin-top: 4px; }
.legal-meta, .legal-notice { padding: 18px 20px; border: 1px solid #dce3e9; border-radius: 10px; color: #526171; background: #f4f6f8; font-size: 14px; line-height: 1.65; }
.legal-notice.is-error { color: #922333; border-color: #e9b9bf; background: #fff3f4; }
.legal-actions { gap: 10px; margin-top: 40px; padding-top: 24px; border-top: 1px solid #dce3e9; }
.legal-button { min-height: 44px; gap: 8px; padding: 11px 16px; border-color: #c6d0d9; border-radius: 8px; color: #17212b; background: #fff; font-size: 14px; font-weight: 600; line-height: 1.4; text-align: center; touch-action: manipulation; }
.legal-button.is-primary { border-color: #006eb6; color: #fff; background: #006eb6; }
.legal-button:disabled { color: #607080; border-color: #dce3e9; background: #e9eef2; opacity: 1; }
.privacy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 32px; align-items: start; }
.privacy-grid[hidden] { display: none; }
.privacy-panel { min-width: 0; padding: 24px; border-color: #dce3e9; border-radius: 12px; background: #f8fafb; }
.privacy-panel:last-child { grid-column: 1 / -1; }
.privacy-panel h2 { margin-bottom: 24px; font-size: 19px; }
.privacy-form { gap: 20px; }
.privacy-form label { gap: 8px; color: #526171; font-size: 13px; font-weight: 600; }
.privacy-form input, .privacy-form select, .privacy-form textarea { min-height: 46px; padding: 11px 12px; border-color: var(--ui-input-border, #8795a3); border-radius: 8px; color: #17212b; background: #fff; font-size: 16px; font-weight: 400; line-height: 1.5; }
.privacy-form textarea { resize: vertical; }
.privacy-form :is(input, select, textarea):focus { border-color: #006eb6; box-shadow: 0 0 0 3px rgb(0 110 182 / 12%); }
.privacy-form :is(input, select, textarea):user-invalid { border-color: #b42332; }
.privacy-form :is(input, select, textarea):disabled { color: #607080; background: #f0f3f6; }
#privacyExportButton { width: 100%; margin-top: 12px; }
.privacy-list { margin-bottom: 0; padding-left: 20px; font-size: 14px; }
.privacy-muted { color: #526171; }
@media (hover: hover) {
  .legal-button:hover:not(:disabled) { background: #f4f7f9; border-color: #9cabb9; }
  .legal-button.is-primary:hover:not(:disabled) { background: #005b98; border-color: #005b98; }
  a:not(.legal-button):hover { color: #005b98; }
}
@media (max-width: 760px) {
  .legal-shell { width: calc(100% - 32px); margin: 24px auto; }
  .legal-card { padding: 28px; }
  .privacy-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .legal-shell { width: calc(100% - 24px); margin: 12px auto max(20px, env(safe-area-inset-bottom)); }
  .legal-card { padding: 26px 20px; border-radius: 12px; }
  h1 { font-size: 28px; line-height: 1.2; margin-bottom: 20px; }
  h2 { margin-top: 32px; font-size: 19px; }
  .legal-meta, .legal-notice { padding: 16px; }
  .legal-actions { flex-direction: column; margin-top: 32px; }
  .legal-button { width: 100%; }
  .privacy-panel { padding: 18px; }
}
@media print {
  body { color: #000; background: #fff; }
  .legal-shell { width: 100%; margin: 0; }
  .legal-card { padding: 0; border: 0; box-shadow: none; }
  .legal-actions { display: none; }
  h2 { break-after: avoid; }
  .legal-meta, .legal-notice { break-inside: avoid; }
}
