@font-face { font-family: 'Shantell Sans'; font-style: normal; font-weight: 300 800; font-display: swap; src: url('/fonts/shantell-latin.woff2') format('woff2'); }
:root { --ink: #241e4e; --ink-soft: #4a447a; --blueberry: #3540b8; --sun: #ffc531; --paper: #fbfaf6; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--blueberry); color: var(--ink); font-family: 'Shantell Sans', system-ui, sans-serif;
  font-size: 1.05rem; line-height: 1.6; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
.top { max-width: 760px; margin: 0 auto; padding: 20px 16px 8px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 800; font-size: 1.3rem; }
.brand img { border-radius: 10px; }
.doc { max-width: 760px; margin: 8px auto 48px; padding: 28px 22px 32px; background: var(--paper); border-radius: 24px;
  box-shadow: 0 10px 0 rgba(0,0,0,.15); }
@media (min-width: 800px) { .doc { padding: 44px 56px 48px; margin-left: auto; margin-right: auto; } }
@media (max-width: 799px) { .doc { margin-left: 12px; margin-right: 12px; } }
h1 { font-size: clamp(2rem, 6vw, 2.8rem); line-height: 1.1; margin: 0 0 .4em; font-weight: 800; }
h2 { font-size: 1.25rem; line-height: 1.3; margin: 1.8em 0 .4em; font-weight: 800; }
p, li { max-width: 68ch; }
.lede { font-size: 1.2rem; font-weight: 600; }
.meta { color: var(--ink-soft); font-size: .95rem; }
ul { padding-left: 1.2em; }
li { margin: .5em 0; }
a { color: var(--blueberry); font-weight: 700; text-underline-offset: 3px; }
a:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; border-radius: 4px; }