/* Shared by the legal pages. Tokens match index.html, which copies them
   from the app's lib/core/theme/app_colors.dart (blue trial). */
@font-face { font-family: "Space Grotesk"; src: url("fonts/SpaceGrotesk-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/SpaceGrotesk-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/SpaceGrotesk-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/SpaceGrotesk-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("fonts/JetBrainsMonoNL-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }

:root {
  --brand: #1E3A8A; --on-brand: #FFFFFF; --brand-ink: #13285E;
  --brand-surface: #E8EEFA; --brand-border: #BCCDEE;
  --ink: #1C1A17; --ink-muted: #5F5A52; --surface: #FFFFFF; --canvas: #F6F5F2; --border: #E3E0D9;
  --todo-bg: #FFF1B8; --todo-ink: #5C4400;
  --font-sans: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brand-ink: #8FB0FF; --brand-surface: #16213D; --brand-border: #2E4680;
    --ink: #F3F1EC; --ink-muted: #B5AFA4; --surface: #1C1A17; --canvas: #121110; --border: #3A362F;
    --todo-bg: #4A3A06; --todo-ink: #FFE58A;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --brand-ink: #8FB0FF; --brand-surface: #16213D; --brand-border: #2E4680;
  --ink: #F3F1EC; --ink-muted: #B5AFA4; --surface: #1C1A17; --canvas: #121110; --border: #3A362F;
  --todo-bg: #4A3A06; --todo-ink: #FFE58A;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--canvas); color: var(--ink); font-family: var(--font-sans); font-size: 1.0625rem; line-height: 1.65; -webkit-font-smoothing: antialiased; }
a { color: var(--brand-ink); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--brand-ink); outline-offset: 3px; border-radius: 4px; }
.wrap { max-width: 760px; margin-inline: auto; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }

.top { background: var(--brand); color: var(--on-brand); }
.top .wrap { max-width: 1120px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: max(16px, env(safe-area-inset-top, 0px)) 16px; }
.top img { height: 48px; width: auto; display: block; }
.top nav { display: flex; gap: 24px; font-weight: 500; }
.top nav a { color: var(--on-brand); text-decoration: none; opacity: .88; }
.top nav a:hover, .top nav a[aria-current="page"] { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }

main { padding-block: 56px 80px; }
h1 { font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem); line-height: 1.1; letter-spacing: -.02em; margin: 0 0 12px; text-wrap: balance; }
h2 { font-size: 1.375rem; line-height: 1.25; letter-spacing: -.01em; margin: 48px 0 12px; padding-top: 24px; border-top: 1px solid var(--border); text-wrap: balance; scroll-margin-top: 24px; }
h3 { font-size: 1.0625rem; margin: 24px 0 6px; }
p, ul, ol { margin: 0 0 14px; }
ul, ol { padding-left: 1.3em; }
li { margin-bottom: 6px; }
.meta { color: var(--ink-muted); font-family: var(--font-mono); font-size: .875rem; }
.summary { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 16px; padding: 20px 24px; margin: 32px 0 8px; }
.summary h2 { margin: 0 0 8px; padding: 0; border: 0; font-size: 1.0625rem; }
.summary ul { margin: 0; }
.toc { columns: 2 16rem; column-gap: 32px; padding-left: 1.3em; margin-top: 24px; }
.table-scroll { overflow-x: auto; margin: 0 0 16px; }
table { border-collapse: collapse; width: 100%; min-width: 520px; font-size: .9375rem; }
th, td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--border); }
th { font-weight: 600; background: var(--surface); }
.mono { font-family: var(--font-mono); font-weight: 500; font-variant-numeric: tabular-nums; }
/* Facts only the company can supply. Every one must be filled before this goes live. */
.todo { background: var(--todo-bg); color: var(--todo-ink); border-radius: 4px; padding: 0 4px; font-weight: 600; }

footer { border-top: 1px solid var(--border); padding-block: 28px max(28px, env(safe-area-inset-bottom, 0px)); color: var(--ink-muted); font-size: .875rem; }
footer .wrap { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }
footer nav { display: flex; gap: 20px; }
@media (max-width: 560px) { .top nav { gap: 16px; font-size: .9375rem; } .top img { height: 44px; } }