/* Q-517: the docs and legal pages inside the v4 chrome. Loaded after docs.css, so these rules win: docs.css keeps the
   layout of the guide, this file gives it the v4 colours and type. */
.docs-page { --text-main: var(--text); --text-muted: var(--soft); --text-subtle: var(--muted); --text-secondary: var(--soft); --text-primary: var(--text);
  --border-color: var(--line-2); --border: var(--line-2); --color-primary: var(--blue); --bg-subtle: var(--panel-2); --bg-surface: var(--panel); --bg-card: var(--panel);
  --surface: var(--panel); --bg-page: var(--ink); --bg-primary: var(--ink); --radius-sm: 8px; --radius-md: 12px; --shadow-xl: 0 40px 100px -40px var(--shadow-deep);
  --motion-panel: .25s; --ease-standard: ease; background: var(--ink); color: var(--text); }
.docs-shell { max-width: calc(var(--wrap) + 64px); padding: 40px 32px 90px; }
.docs-hero h1, .legal-article h1 { font-weight: 500; letter-spacing: -.03em; font-size: clamp(32px, 4vw, 48px); }
.docs-content { max-width: none; }
.legal-shell { padding: 56px 0 90px; }
.legal-article { max-width: none; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.legal-copy { max-width: 860px; }
.legal-kicker { color: var(--blue-text); font-family: var(--mono); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; font-weight: 500; }
.docs-page a { color: inherit; }
.docs-page .docs-copy, .docs-page .docs-toc-toggle { color: var(--text); }
.docs-page .docs-search-input { color: var(--text); }
.docs-page .docs-hero h1, .docs-page .legal-article h1 { font-weight: 500; letter-spacing: -.03em; font-size: clamp(32px, 4vw, 48px); color: var(--text); }
.docs-page .legal-shell { width: min(var(--wrap), 100% - 2 * var(--gutter)); margin: 0 auto; }
.docs-page .legal-page, .v4-body.legal-page { background: var(--ink); color: var(--text); }
.docs-page .legal-copy p, .docs-page .legal-copy li, .docs-page .legal-version { color: var(--soft); }
.docs-page .legal-copy h2 { color: var(--text); }
.docs-page .legal-copy strong { color: var(--text); }
/* hit targets of 44 px and 16 px inputs on the guide too (DESIGN.md, mục 8) */
.docs-page .docs-toc-link, .docs-page .docs-toc-section, .docs-page .docs-otp-link { display: flex; align-items: center; min-height: 44px; }
.docs-page .docs-copy, .docs-page .docs-toc-toggle, .docs-page .docs-lightbox-close { min-height: 44px; }
.docs-page .docs-search-input { font-size: 16px; min-height: 44px; }