/* Legal Pages form: the live document preview. Everything else uses onboarding.css. */
.lp-preview { margin: 0 0 32px; border: 1px solid var(--border-hover); border-radius: var(--radius); background: var(--bg-card); overflow: hidden; }
.lp-tabs { display: flex; gap: 4px; padding: 6px; border-bottom: 1px solid var(--border); background: var(--bg-elevated); }
.lp-tab { flex: 1; font: 600 14px/1.2 var(--font); color: var(--text-secondary); background: transparent; border: 0; border-radius: var(--radius-sm); padding: 11px 10px; cursor: pointer; transition: var(--transition-fast); }
.lp-tab:hover { color: var(--text-primary); background: var(--bg-glass-hover); }
.lp-tab.active { color: var(--text-primary); background: var(--orange-glow-strong); }
.lp-tab:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
.lp-missing { display: none; margin: 12px 12px 0; padding: 10px 14px; border-radius: var(--radius-sm); background: var(--orange-glow); border: 1px solid var(--border-orange); color: var(--orange-light); font-size: 13px; line-height: 1.5; }
.lp-missing.visible { display: block; }

/* the document itself reads like paper, so it's easy to proofread */
.lp-doc { margin: 12px; padding: 28px 28px 32px; max-height: 460px; overflow-y: auto; border-radius: var(--radius-sm); background: #FBF8F5; color: #2B2622; font: 400 14.5px/1.75 var(--font); }
.lp-doc:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
/* the site sheet sets tight letter-spacing on headings and grey body text; reset both here */
.lp-doc h2, .lp-doc h3 { letter-spacing: normal; line-height: 1.35; text-transform: none; }
.lp-doc p, .lp-doc li { color: #2B2622; font-size: inherit; line-height: inherit; }
.lp-doc h2 { font-size: 16px; font-weight: 700; color: #1D1815; margin: 26px 0 8px; }
.lp-doc h3 { font-size: 14.5px; font-weight: 700; color: #3A332D; margin: 16px 0 4px; }
.lp-doc p { margin: 0 0 12px; }
.lp-doc ul { margin: 0 0 12px; padding-left: 20px; }
.lp-doc li { margin-bottom: 5px; }
.lp-doc a { color: #B4501A; }
.lp-doc .updated { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: #8A7F76; }
.lp-doc mark { background: #FFE3CF; color: #8A3410; border-radius: 4px; padding: 0 4px; font-weight: 600; }

@media (max-width: 600px) {
  .lp-doc { margin: 8px; padding: 20px 16px 24px; max-height: 400px; font-size: 14px; }
  .lp-tab { font-size: 13px; }
}
