
  :root { color-scheme: light dark; --paper:#f8f1e8; --card:#fff; --ink:#1a1614;
          --muted:#5d5550; --line:#e4ddd5; --accent:#7f1023; --ok:#46692a; }
  @media (prefers-color-scheme: dark) {
    :root { --paper:#141110; --card:#1c1917; --ink:#f2ede9; --muted:#b5aca6;
            --line:#332e2b; --accent:#f0a5af; --ok:#a2b86a; }
  }
  * { box-sizing:border-box }
  body { margin:0; padding:32px 20px 64px; background:var(--paper); color:var(--ink);
         font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; }
  main { max-width:720px; margin:0 auto }
  h1 { font-size:clamp(28px,5vw,38px); line-height:1.15; margin:0 0 8px; letter-spacing:-.02em }
  .lede { color:var(--muted); font-size:19px; margin:0 0 36px }
  h2 { font-size:21px; margin:40px 0 12px; letter-spacing:-.01em }
  p { margin:0 0 16px }
  .headline { display:flex; gap:20px; flex-wrap:wrap; margin:28px 0 }
  .fig { flex:1; min-width:200px; background:var(--card); border:1px solid var(--line);
         border-radius:14px; padding:20px }
  .fig b { display:block; font-size:38px; line-height:1.1; letter-spacing:-.03em }
  .fig .who { color:var(--muted); font-size:15px; margin-top:6px }
  .fig.zero b { color:var(--ok) }
  .fig.fee b { color:var(--accent) }
  table { width:100%; border-collapse:collapse; margin:12px 0 8px; font-size:16px }
  td { padding:9px 0; border-bottom:1px solid var(--line) }
  td { vertical-align:top }
  /* Figures to the right and on one line, in the money tables only. This
     was every table's last cell, so the privacy page's explanations each
     ran on as one line 5,800 px wide, off the page, and the page scrolled
     sideways by 4,852 px. */
  table.money td:last-child { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap }
  tr.total td { font-weight:700; border-bottom:none; padding-top:14px }
  tr.rule td { border-bottom:2px solid var(--line) }
  /* What a policy holds, a name and its explanation: side by side where
     there is room, the name over its words on a phone. */
  table.prose td { padding:10px 0; overflow-wrap:anywhere }
  table.prose td:first-child { width:32%; padding-right:16px }
  @media (max-width:560px) {
    table.prose, table.prose tbody, table.prose tr, table.prose td { display:block; width:auto }
    table.prose td:first-child { padding:12px 0 2px; border-bottom:0 }
    table.prose td:last-child { padding-top:0 }
  }
  .ex { background:var(--card); border:1px solid var(--line); border-radius:14px;
        padding:20px 22px; margin-bottom:16px }
  .ex h3 { margin:0 0 4px; font-size:17px }
  .ex .sub { color:var(--muted); font-size:14px; margin:0 0 8px }
  ol { padding-left:22px } ol li { margin-bottom:14px }
  .note { color:var(--muted); font-size:15px }
  footer { margin-top:48px; padding-top:20px; border-top:1px solid var(--line);
           color:var(--muted); font-size:14px }
  a { color:var(--accent) }
  a.home { display:inline-flex; align-items:center; gap:10px; margin:0 0 20px; font-weight:700; text-decoration:none }
  a.home svg { width:36px; height:34px; flex-shrink:0 }

 .scroll { overflow-x:auto }
 table.cal { min-width:560px }
 table.cal td, table.cal th { font-size:14px; text-align:start; padding:8px 12px 8px 0; vertical-align:top; white-space:normal; font-variant-numeric:tabular-nums }
 table.cal td:first-child { white-space:nowrap }
 .soft { color:#6b625c }
