/* ============================================================================
   Shared styling for the public legal pages (terms, privacy, disclaimer).
   ============================================================================
   Deliberately self-contained rather than pulling in PFF-Format.CSS. These
   pages must load for someone who is NOT signed in, may be on a slow
   connection, and is deciding whether to trust this product with their bank
   credentials. Shipping 210 KB of app stylesheet to render a page of text
   works against all three.

   Tokens mirror the app's palette so the pages still feel like the product,
   and dark mode is supported through the same three-state pattern used
   everywhere else: bare :root for light, a prefers-color-scheme block guarded
   against an explicit light choice, and a [data-theme="dark"] stamp.
   ============================================================================ */

:root {
  --lg-bg:        #f4f6f8;
  --lg-surface:   #ffffff;
  --lg-ink:       #1a2b3c;
  --lg-ink-soft:  #33455c;
  --lg-muted:     #546e7a;
  --lg-rule:      #dbe3ed;
  --lg-accent:    #2e7d32;
  --lg-navy:      #0d253f;
  --lg-warn-bg:   #fdf3e7;
  --lg-warn-br:   #b54708;
  --lg-warn-ink:  #8a4308;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --lg-bg:       #0f1117;
    --lg-surface:  #1a1d27;
    --lg-ink:      #e8eaf6;
    --lg-ink-soft: #c6d0de;
    --lg-muted:    #a5aebf;
    --lg-rule:     #2e3347;
    --lg-accent:   #4caf50;
    --lg-navy:     #e8eaf6;
    --lg-warn-bg:  #2a1f12;
    --lg-warn-br:  #e0a35c;
    --lg-warn-ink: #f0c48a;
  }
}
:root[data-theme="dark"] {
  --lg-bg:       #0f1117;
  --lg-surface:  #1a1d27;
  --lg-ink:      #e8eaf6;
  --lg-ink-soft: #c6d0de;
  --lg-muted:    #a5aebf;
  --lg-rule:     #2e3347;
  --lg-accent:   #4caf50;
  --lg-navy:     #e8eaf6;
  --lg-warn-bg:  #2a1f12;
  --lg-warn-br:  #e0a35c;
  --lg-warn-ink: #f0c48a;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--lg-bg);
  color: var(--lg-ink-soft);
  font-family: Georgia, "Iowan Old Style", "Palatino Linotype", Palatino, serif;
  font-size: 17px;
  line-height: 1.65;
}
.lg-skip {
  position: absolute; left: -9999px;
  background: var(--lg-accent); color: #fff;
  padding: 10px 16px; z-index: 100;
  font-family: system-ui, sans-serif; font-size: .9rem;
}
.lg-skip:focus { left: 0; top: 0; }
:focus-visible { outline: 2px solid var(--lg-accent); outline-offset: 2px; }

.lg-nav {
  background: var(--lg-surface);
  border-bottom: 1px solid var(--lg-rule);
  padding: 14px 24px;
}
.lg-nav-inner {
  max-width: 78ch; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  font-family: system-ui, -apple-system, sans-serif; font-size: .88rem;
}
.lg-nav a { color: var(--lg-ink-soft); text-decoration: none; margin-right: 18px; }
.lg-nav a:hover { color: var(--lg-accent); text-decoration: underline; }
.lg-nav strong { color: var(--lg-ink); }

.lg-wrap { max-width: 78ch; margin: 0 auto; padding: 44px 24px 90px; }

h1 {
  font-size: clamp(1.85rem, 1.4rem + 1.8vw, 2.7rem);
  line-height: 1.12; margin: 0 0 10px; color: var(--lg-ink);
  font-weight: 400; letter-spacing: -.015em; text-wrap: balance;
}
.lg-dates {
  font-family: system-ui, sans-serif; font-size: .85rem;
  color: var(--lg-muted); margin: 0 0 30px;
  padding-bottom: 22px; border-bottom: 2px solid var(--lg-ink);
}
h2 {
  font-size: 1.3rem; color: var(--lg-ink); font-weight: 400;
  margin: 42px 0 12px; padding-bottom: 8px;
  border-bottom: 1px solid var(--lg-rule); text-wrap: balance;
}
h3 {
  font-family: system-ui, sans-serif; font-size: .98rem; font-weight: 700;
  color: var(--lg-ink); margin: 26px 0 8px;
}
p { margin: 0 0 15px; }
ul, ol { padding-left: 24px; margin: 0 0 15px; }
li { margin-bottom: 8px; }
a { color: var(--lg-accent); }
strong { color: var(--lg-ink); }
code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .86em; background: var(--lg-bg);
  border: 1px solid var(--lg-rule); border-radius: 4px; padding: .1em .35em;
}

.lg-notice {
  background: var(--lg-warn-bg);
  border: 1px solid var(--lg-warn-br);
  border-left-width: 4px;
  border-radius: 0 8px 8px 0;
  padding: 16px 20px; margin: 0 0 30px;
  font-family: system-ui, sans-serif; font-size: .9rem;
  color: var(--lg-warn-ink);
}
.lg-notice p { margin: 0; }
.lg-notice p + p { margin-top: 8px; }

.lg-card {
  background: var(--lg-surface);
  border: 1px solid var(--lg-rule);
  border-radius: 10px;
  padding: 18px 22px; margin: 20px 0;
}
.lg-card p:last-child, .lg-card ul:last-child { margin-bottom: 0; }

.lg-tablewrap { overflow-x: auto; border: 1px solid var(--lg-rule); border-radius: 10px; margin: 20px 0; background: var(--lg-surface); }
table { width: 100%; border-collapse: collapse; font-family: system-ui, sans-serif; font-size: .88rem; }
th, td { text-align: left; padding: 11px 15px; border-bottom: 1px solid var(--lg-rule); vertical-align: top; }
thead th {
  background: var(--lg-bg); color: var(--lg-muted);
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700;
}
tbody tr:last-child td { border-bottom: none; }

footer {
  border-top: 1px solid var(--lg-rule);
  margin-top: 50px; padding-top: 22px;
  font-family: system-ui, sans-serif; font-size: .82rem; color: var(--lg-muted);
}
footer a { margin-right: 16px; }

@media print {
  :root { --lg-bg:#fff; --lg-surface:#fff; --lg-ink:#000; --lg-ink-soft:#111; --lg-muted:#444; --lg-rule:#bbb; }
  .lg-nav, .lg-skip { display: none; }
  body { font-size: 10.5pt; }
  h2 { page-break-after: avoid; }
  .lg-card, .lg-notice, .lg-tablewrap { page-break-inside: avoid; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }