/* Breakpoints, and only these four:
     600   phone
     760   the shell collapses its routes and controls into the Story Map sheet
     900   tablet compositions
    1024   desktop, wordmark returns
   Adding a fifth needs a reason written down here. */
/* ============================================================================
   rfb-shell.css — ONE header, ONE footer, ONE set of experience controls,
   on all thirteen routes including the homepage.

   Load immediately after rfb-tokens.css and before any page stylesheet.

   Namespace: every selector here starts with .rfb-. Nothing in the legacy
   stylesheets targets that prefix, so this file cannot be fought by them and it
   needs no !important of its own. (Phase 3 then removed 2,078 !important
   declarations from those legacy files; twelve remain site-wide, all of them
   the reduced-motion overrides in rfb-tokens.css, which must beat everything.)

   Two header modes, and only two:
     (default)      immersive — scrim over artwork, content flows beneath
     body.rfb-doc   document  — solid bar, content offset below it

   Established 2026-09-08 (Phase 2 of the repair plan).
   ========================================================================= */

/* --------------------------------------------------------------------------
   1. Skip link
   -------------------------------------------------------------------------- */
.rfb-skip{
  position:fixed; top:var(--rfb-s2); left:var(--rfb-s2);
  z-index:var(--rfb-z-toast);
  transform:translateY(-160%);
  display:inline-flex; align-items:center;
  min-height:var(--rfb-tap); padding:0 var(--rfb-s4);
  background:var(--rfb-paper); color:var(--rfb-ink);
  font:600 var(--rfb-t-label)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  text-decoration:none; border-radius:var(--rfb-r-sm);
  box-shadow:var(--rfb-lift-2);
  transition:transform var(--rfb-fast) var(--rfb-ease);
}
.rfb-skip:focus-visible{ transform:translateY(0); }

/* --------------------------------------------------------------------------
   2. The header
   -------------------------------------------------------------------------- */
.rfb-head{
  position:fixed; inset:0 0 auto 0;
  z-index:var(--rfb-z-head);
  height:var(--rfb-head-h);
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:var(--rfb-s4);
  padding-inline:var(--rfb-gutter);
  background:var(--rfb-scrim-top);
  border-bottom:1px solid transparent;
}
body.rfb-doc .rfb-head{
  background:var(--rfb-shell);
  border-bottom-color:var(--rfb-hairline-soft);
  backdrop-filter:blur(10px);
}
/* Once the visitor has scrolled past the first screen the header earns a
   ground of its own on every page, so nav never sits on busy artwork. */
.rfb-head[data-scrolled="true"]{
  background:var(--rfb-shell);
  border-bottom-color:var(--rfb-hairline-soft);
  backdrop-filter:blur(10px);
}
/* Document pages clear the fixed header on the BODY, not on their content
   container: three later !important rules in the legacy CSS own that
   container's padding, and a rule that can be overridden is not an offset. */
body.rfb-doc{ padding-top:var(--rfb-head-h); }

/* ---- brand seal ---- */
.rfb-seal{
  display:inline-flex; align-items:center; gap:var(--rfb-s3);
  min-height:var(--rfb-tap);
  text-decoration:none; color:var(--rfb-paper);
  border-radius:var(--rfb-r-sm);
}
.rfb-seal img{
  width:44px; height:44px; flex:none; border-radius:var(--rfb-r-round);
  background:var(--rfb-paper);
  box-shadow:0 0 0 1px var(--rfb-hairline), var(--rfb-lift-1);
}
.rfb-seal span{
  font:600 var(--rfb-t-micro)/1.05 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
  white-space:nowrap;
}
.rfb-seal span{ display:none; }
@media (min-width:1024px){ .rfb-seal span{ display:inline; } }

/* ---- routes ---- */
.rfb-routes{
  display:flex; align-items:center; justify-content:center;
  gap:var(--rfb-s3);
}
.rfb-route{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--rfb-tap); min-width:var(--rfb-tap);
  padding:0 var(--rfb-s4);
  color:var(--rfb-paper); text-decoration:none;
  font:600 var(--rfb-t-label)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  border:1px solid transparent; border-radius:var(--rfb-r-sm);
  transition:border-color var(--rfb-fast) var(--rfb-ease),
             color var(--rfb-fast) var(--rfb-ease);
}
.rfb-route:hover{ border-color:var(--rfb-hairline); color:var(--rfb-brass-lit); }
.rfb-route[aria-current="page"]{
  border-color:var(--rfb-hairline);
  color:var(--rfb-brass-lit);
}
/* Selection is never colour alone. */
.rfb-route[aria-current="page"]::before{
  content:"·"; margin-right:.4em; color:var(--rfb-crimson-lit);
}
.rfb-route--buy{
  border-color:var(--rfb-hairline);
  background:linear-gradient(180deg, rgba(216,180,97,.16), rgba(216,180,97,.05));
  color:var(--rfb-brass-lit);
}
.rfb-route--buy:hover{
  background:linear-gradient(180deg, rgba(216,180,97,.28), rgba(216,180,97,.10));
  border-color:var(--rfb-brass);
}

/* ---- the brass Story Map plaque ---- */
.rfb-plaque{
  display:inline-flex; align-items:center; gap:var(--rfb-s2);
  min-height:var(--rfb-tap); padding:0 var(--rfb-s3);
  border:1px solid var(--rfb-brass-edge);
  border-radius:var(--rfb-r-pill);
  background:
    linear-gradient(180deg, var(--rfb-brass-lit) 0%, var(--rfb-brass) 42%,
                            var(--rfb-brass-deep) 100%);
  color:#241a08;
  font:700 var(--rfb-t-label)/1 var(--rfb-theatre);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), var(--rfb-lift-1);
  transition:filter var(--rfb-fast) var(--rfb-ease);
}
.rfb-plaque:hover{ filter:brightness(1.07); }
.rfb-plaque img{ width:22px; height:22px; flex:none; }
.rfb-plaque-word{ display:none; }
@media (min-width:600px){ .rfb-plaque-word{ display:inline; padding-right:var(--rfb-s1); } }

/* ---- experience controls ---- */
.rfb-controls{ display:flex; align-items:center; gap:var(--rfb-s2); }
.rfb-controls button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--rfb-tap); padding:0 var(--rfb-s4);
  border:1px solid transparent;
  border-radius:var(--rfb-r-pill);
  background:none;
  color:var(--rfb-paper-dim);
  font:600 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  white-space:nowrap; cursor:pointer;
  transition:border-color var(--rfb-fast) var(--rfb-ease),
             background var(--rfb-fast) var(--rfb-ease);
}
.rfb-controls button:hover{ border-color:var(--rfb-hairline); color:var(--rfb-paper); }
.rfb-controls button[aria-pressed="true"]{ color:var(--rfb-paper); }
/* State is carried by a mark, not by colour alone. */
.rfb-controls button::before{
  content:"○"; margin-right:.5em; font-size:1.05em; line-height:1;
  color:var(--rfb-paper-dim);
}
.rfb-controls button[aria-pressed="true"]::before{
  content:"●"; color:var(--rfb-brass-lit);
}

/* Mobile first: routes and controls live in the Story Map sheet until there is
   room for them in the bar. Stated as min-width so no boundary is off by one. */
.rfb-routes{ justify-content:flex-end; }
.rfb-routes .rfb-route,
.rfb-controls{ display:none; }
@media (min-width:760px){
  .rfb-routes{ justify-content:center; }
  .rfb-routes .rfb-route{ display:inline-flex; }
  .rfb-controls{ display:flex; }
}

/* --------------------------------------------------------------------------
   3. The Story Map panel
   -------------------------------------------------------------------------- */
.rfb-map{
  position:fixed; z-index:var(--rfb-z-panel);
  top:var(--rfb-head-h); left:0; right:0;
  max-height:calc(100svh - var(--rfb-head-h));
  overflow-y:auto; overscroll-behavior:contain;
  background:var(--rfb-shell-solid);
  border-bottom:1px solid var(--rfb-hairline);
  box-shadow:var(--rfb-lift-3);
  padding:var(--rfb-s5) var(--rfb-gutter) var(--rfb-s6);
}
.rfb-map[hidden]{ display:none; }
@media (min-width:760px){
  .rfb-map{
    left:auto; right:var(--rfb-gutter);
    width:min(360px, calc(100vw - var(--rfb-gutter) * 2));
    border:1px solid var(--rfb-hairline);
    border-radius:var(--rfb-r-md);
    top:calc(var(--rfb-head-h) - var(--rfb-s2));
  }
}
.rfb-map h2{
  margin:0 0 var(--rfb-s3);
  font:600 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
  color:var(--rfb-brass);
}
.rfb-map h2 + h2{ margin-top:var(--rfb-s5); }
.rfb-map ul{ list-style:none; margin:0; padding:0; }
.rfb-map a,
.rfb-map .rfb-map-btn{
  display:flex; align-items:center; gap:var(--rfb-s3);
  width:100%; min-height:var(--rfb-tap-lg);
  padding:0 var(--rfb-s3);
  border:0; border-top:1px solid var(--rfb-hairline-soft);
  background:none; text-align:left;
  color:var(--rfb-paper); text-decoration:none;
  font:500 var(--rfb-t-body)/1.25 var(--rfb-display);
  cursor:pointer;
}
.rfb-map li:last-child a,
.rfb-map li:last-child .rfb-map-btn{ border-bottom:1px solid var(--rfb-hairline-soft); }
.rfb-map a:hover,
.rfb-map .rfb-map-btn:hover{ background:rgba(216,180,97,.09); color:var(--rfb-brass-lit); }
.rfb-map a[aria-current="page"]{ color:var(--rfb-brass-lit); }
.rfb-map a[aria-current="page"]::after{
  content:"you are here"; margin-left:auto;
  font:600 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  color:var(--rfb-paper-dim);
}
.rfb-map .rfb-map-btn[aria-pressed]::before{
  content:"○"; color:var(--rfb-paper-dim);
}
.rfb-map .rfb-map-btn[aria-pressed="true"]::before{
  content:"●"; color:var(--rfb-brass-lit);
}
/* The sheet carries the controls only where the header cannot. */
@media (min-width:760px){ .rfb-map-controls{ display:none; } }

/* --------------------------------------------------------------------------
   4. The footer
   -------------------------------------------------------------------------- */
.rfb-foot{
  background:var(--rfb-shell-solid);
  border-top:1px solid var(--rfb-hairline-soft);
  padding:var(--rfb-s7) var(--rfb-gutter) var(--rfb-s6);
  color:var(--rfb-paper-dim);
  font:400 var(--rfb-t-label)/1.6 var(--rfb-ui);
}
.rfb-foot-inner{
  max-width:1180px; margin-inline:auto;
  display:grid; gap:var(--rfb-s6);
  grid-template-columns:1fr;
}
@media (min-width:760px){
  .rfb-foot-inner{ grid-template-columns:auto 1fr; align-items:start; gap:var(--rfb-s8); }
}
.rfb-foot-mark{ display:flex; align-items:center; gap:var(--rfb-s3); }
.rfb-foot-mark img{ width:44px; height:44px; border-radius:var(--rfb-r-round); background:var(--rfb-paper); }
.rfb-foot-mark span{
  font:600 var(--rfb-t-micro)/1.4 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
  color:var(--rfb-paper);
}
.rfb-foot-nav{
  display:grid; gap:var(--rfb-s5);
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
}
.rfb-foot-nav h2{
  margin:0 0 var(--rfb-s2);
  font:600 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  color:var(--rfb-brass);
}
.rfb-foot-nav ul{ list-style:none; margin:0; padding:0; }
.rfb-foot-nav a{
  display:inline-flex; align-items:center;
  min-height:var(--rfb-tap);
  color:var(--rfb-paper-dim); text-decoration:none;
  font:400 var(--rfb-t-label)/1.4 var(--rfb-ui);
  letter-spacing:.02em;
}
.rfb-foot-nav a:hover{ color:var(--rfb-brass-lit); text-decoration:underline; text-underline-offset:.28em; }
.rfb-foot-legal{
  max-width:1180px; margin:var(--rfb-s6) auto 0;
  padding-top:var(--rfb-s4);
  border-top:1px solid var(--rfb-hairline-soft);
  font:400 var(--rfb-t-micro)/1.7 var(--rfb-ui); color:var(--rfb-paper-dim);
}
/* An inline link inside a sentence is exempt from the target-size floor
   (WCAG 2.5.8), but it still has to be obviously a link. */
.rfb-foot-legal a{
  color:var(--rfb-brass-lit); text-decoration:underline;
  text-underline-offset:.28em; text-decoration-thickness:1px;
}

/* --------------------------------------------------------------------------
   5. Focus. Never remove this.
   -------------------------------------------------------------------------- */
.rfb-head :focus-visible,
.rfb-map :focus-visible,
.rfb-foot :focus-visible,
.rfb-skip:focus-visible{
  outline:3px solid var(--rfb-focus);
  outline-offset:2px;
  border-radius:var(--rfb-r-sm);
}

/* Nothing to retire: site-system.js no longer creates floating controls, and no
   page ships .site-controls or .global-motion markup any more. */

/* --------------------------------------------------------------------------
   7. The newsletter, injected by rfb-shell's sibling script on story pages.
      Moved here 2026-09-08: it lived in site-system-v6.css, which the
      homepage does not load, so its consent checkbox was 13px there.
   -------------------------------------------------------------------------- */
/* One quiet row, not a landing page. Mobile-first; the copy and the field sit
   side by side from 760 up. The band was 566px on a phone (67% of a screen)
   and sat directly under the $3.00 purchase shelf on book pages; it is now a
   footer-weight invitation, and site-system.js no longer mounts it on book
   pages at all -- a page with a live checkout is a transaction. */
.rfb-newsletter{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--rfb-s4);align-items:center;padding:var(--rfb-s6) var(--rfb-gutter);background:radial-gradient(circle at 12% 30%,#7e263f3d,transparent 42%),var(--rfb-night);color:var(--rfb-paper);border-block:1px solid var(--rfb-hairline-soft)}
.rfb-newsletter>*{min-width:0}
.rfb-newsletter p{margin:0;color:var(--rfb-brass);font:700 var(--rfb-t-micro) Montserrat,Arial,sans-serif;letter-spacing:var(--rfb-track-word)}
.rfb-newsletter h2{margin:.35rem 0 0;font:600 var(--rfb-t-h3)/1.05 Cormorant,Georgia,serif}
.rfb-newsletter span{display:block;margin-top:.3rem;color:#cabd9f;font-size:var(--rfb-t-label);line-height:1.5}
.rfb-newsletter form>label:first-child{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.rfb-newsletter form>div{display:grid;gap:var(--rfb-s2)}
.rfb-newsletter input[type=email]{min-width:0;flex:1;min-height:var(--rfb-tap);padding:.7rem .9rem;border:1px solid var(--rfb-brass);background:#fffaf0;color:#16110d;font:inherit}
.rfb-newsletter button{min-height:var(--rfb-tap);padding:.7rem 1.15rem;border:1px solid var(--rfb-brass);background:#a51f36;color:#fff;font-weight:800;white-space:nowrap;cursor:pointer}
.rfb-newsletter button:disabled{opacity:.65}
.rfb-newsletter .rfb-consent{display:flex;align-items:center;gap:var(--rfb-s3);min-height:var(--rfb-tap);margin-top:var(--rfb-s2);color:#c3b79f;font-size:var(--rfb-t-micro);line-height:1.35;cursor:pointer}
.rfb-newsletter .rfb-consent input[type=checkbox]{flex:none;width:22px;height:22px;accent-color:var(--rfb-crimson);cursor:pointer}
.rfb-consent{display:flex;gap:.6rem;align-items:flex-start;margin-top:1rem;color:#ded3bc;font-size:var(--rfb-t-label);line-height:1.5}
.rfb-consent input{margin-top:.2rem}
.rfb-hp{position:absolute;left:-10000px}
.rfb-newsletter [role=status]{min-height:1.3em;margin-top:.5rem;letter-spacing:0;color:#f2d48d;font-size:var(--rfb-t-micro)}
@media (min-width:600px){
  .rfb-newsletter form>div{display:flex;gap:0}
}
@media (min-width:760px){
  .rfb-newsletter{grid-template-columns:minmax(0,1fr) minmax(0,430px);gap:clamp(2rem,5vw,4.5rem);padding:var(--rfb-s6) var(--rfb-gutter)}
}
.rfb-consent-dialog{width:min(650px,calc(100% - 2rem));padding:0;border:1px solid var(--rfb-brass);background:var(--rfb-ink);color:var(--rfb-paper);box-shadow:0 2rem 8rem #000;font-family:inherit}
.rfb-consent-dialog::backdrop{background:#05070bd9;backdrop-filter:blur(8px)}
.rfb-consent-dialog form{position:relative;padding:clamp(1.5rem,5vw,3rem)}
.rfb-consent-dialog h2{margin:.25rem 0 1rem;font-size:clamp(2rem,6vw,3.75rem);line-height:.95}
.rfb-consent-kicker{color:var(--rfb-brass);font-weight:900;letter-spacing:var(--rfb-track-label)}
.rfb-consent-dialog label{display:flex;gap:.85rem;margin:1.5rem 0;padding:1rem;border:1px solid color-mix(in srgb, var(--rfb-brass) 40%, transparent);background:#24170f;line-height:1.55}
.rfb-consent-dialog input{inline-size:1.25rem;block-size:1.25rem;flex:none;margin-top:.2rem;accent-color:#a51f36}
.rfb-consent-dialog a{color:#f1d58a}
.rfb-consent-dialog form>div{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.75rem;margin-top:1.5rem}
.rfb-consent-dialog button{padding:.8rem 1rem;border:1px solid var(--rfb-brass);background:#21170e;color:var(--rfb-paper);font:inherit;font-weight:800}
.rfb-consent-dialog .rfb-consent-continue{background:#a51f36;color:#fff}
.rfb-consent-dialog button:disabled{opacity:.45;cursor:not-allowed}
.rfb-consent-dialog .rfb-consent-close{position:absolute;right:.75rem;top:.75rem;border:0;background:transparent;font-size:1.7rem}

/* --------------------------------------------------------------------------
   8. Document-page cards. The shell owns these three pages, so it owns the
      constraint that keeps them inside the viewport: a flex item with
      min-width:auto will grow past its declared width for a long unbreakable
      string, which is how a support email address pushed the newsletter card
      135px off the left edge at 820.
   -------------------------------------------------------------------------- */
body.rfb-doc .delivery-card,
body.rfb-doc .policy-card{
  min-width:0;
  max-width:min(680px, 100%);
  overflow-wrap:anywhere;
}
body.rfb-doc .policy-card{ max-width:min(760px, 100%); }

/* The seal at the top of a document card. Only delivery.html carried this in a
   page <style>, so on newsletter.html the logo rendered at its intrinsic 1040px
   and pushed the page 315px wide. */
body.rfb-doc .delivery-card>img,
body.rfb-doc .policy-card>img{
  width:84px; height:auto; margin-inline:auto;
}
body.rfb-doc img{ max-width:100%; height:auto; }

/* ============================================================================
   9. The operational pages — delivery, newsletter preferences, refund policy.

   These are the screens a paying customer actually ends on, and they were the
   only part of the site with no storyworld in them at all: a bordered dark box
   on a flat ground. They stay functional-first, but they now belong to the
   same world as everything else.

   Two treatments, chosen by what the page is:
     .delivery-card   a receipt — dark, lamplit, the download as a brass plate
     .policy-card     a document — printed on parchment, because 2,000px of
                      light text on near-black is a genuinely hard read
   ========================================================================= */
body.rfb-doc{
  background:
    radial-gradient(120% 90% at 50% -10%,
      color-mix(in srgb, var(--rfb-crimson-deep) 22%, transparent), transparent 62%),
    var(--rfb-night);
}

/* ---- the receipt ---- */
body.rfb-doc .delivery-card{
  border:1px solid color-mix(in srgb, var(--rfb-brass) 46%, transparent);
  border-radius:var(--rfb-r-sm);
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--rfb-brass) 9%, transparent) 0%,
      transparent 30%),
    color-mix(in srgb, var(--rfb-ink) 95%, transparent);
  box-shadow:var(--rfb-lift-3);
  color:var(--rfb-paper);
}
body.rfb-doc .delivery-card>p:first-of-type{
  color:var(--rfb-brass);
  font:700 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
}
body.rfb-doc .delivery-card h1{
  font:600 var(--rfb-t-h2)/1.02 var(--rfb-display);
  color:var(--rfb-paper); text-wrap:balance;
}
body.rfb-doc .delivery-card p{
  font:400 var(--rfb-t-body)/1.65 var(--rfb-ui);
  color:var(--rfb-paper-dim);
}
/* The payoff button is the same brass plate the buyer pressed to purchase. */
body.rfb-doc .delivery-button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--rfb-tap-lg); margin:var(--rfb-s5) 0 var(--rfb-s3);
  padding:0 var(--rfb-s7);
  border:1px solid var(--rfb-brass); border-radius:var(--rfb-r-sm);
  background:linear-gradient(180deg, var(--rfb-brass-lit), var(--rfb-brass) 60%, var(--rfb-brass-deep));
  color:var(--rfb-ink); text-decoration:none;
  font:700 var(--rfb-t-label)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), var(--rfb-lift-2);
  transition:filter var(--rfb-fast) var(--rfb-ease), transform var(--rfb-fast) var(--rfb-ease);
}
body.rfb-doc .delivery-button:hover{ filter:brightness(1.07); transform:translateY(-2px); }
body.rfb-doc .device-help{
  margin-top:var(--rfb-s6); padding-top:var(--rfb-s5);
  border-top:1px solid var(--rfb-hairline-soft); text-align:left;
}
body.rfb-doc .device-help>summary{
  color:var(--rfb-brass-lit);
  font:600 var(--rfb-t-label)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
}
body.rfb-doc .device-help li{ font:400 var(--rfb-t-body)/1.6 var(--rfb-ui); color:var(--rfb-paper-dim); }
body.rfb-doc .device-help b{ color:var(--rfb-paper); }

/* ---- the printed document ---- */
body.rfb-doc .policy-card{
  border:1px solid color-mix(in srgb, var(--rfb-brass-edge) 60%, transparent);
  border-radius:var(--rfb-r-sm);
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--rfb-paper-warm) 55%, var(--rfb-paper)) 0%,
      var(--rfb-paper) 22%);
  box-shadow:var(--rfb-lift-3);
  color:var(--rfb-ink);
  padding:clamp(1.75rem, 4vw, 3.5rem) clamp(1.5rem, 4vw, 4rem) clamp(2rem, 5vw, 4rem);
}
body.rfb-doc .policy-card .policy-version{
  margin:0 0 var(--rfb-s5); padding-bottom:var(--rfb-s3);
  border-bottom:1px solid color-mix(in srgb, var(--rfb-brass-edge) 40%, transparent);
  color:var(--rfb-brass-edge);
  font:700 var(--rfb-t-micro)/1.5 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
}
body.rfb-doc .policy-card h1{
  margin:0 0 var(--rfb-s5);
  font:600 var(--rfb-t-h2)/1.04 var(--rfb-display); color:var(--rfb-ink);
  text-wrap:balance;
}
body.rfb-doc .policy-card h2{
  margin:var(--rfb-s7) 0 var(--rfb-s2);
  font:600 var(--rfb-t-h3)/1.2 var(--rfb-display); color:var(--rfb-ink);
}
body.rfb-doc .policy-card p,
body.rfb-doc .policy-card li{
  max-width:64ch;
  font:400 var(--rfb-t-body)/1.7 var(--rfb-ui);
  color:color-mix(in srgb, var(--rfb-ink) 88%, var(--rfb-paper));
}
body.rfb-doc .policy-card li{ margin:var(--rfb-s2) 0; }
body.rfb-doc .policy-card a{
  color:var(--rfb-crimson-deep); text-decoration:underline;
  text-underline-offset:.24em; font-weight:600;
}
body.rfb-doc .policy-card a:hover{ color:var(--rfb-crimson); }
body.rfb-doc .policy-card>p:last-child{
  margin-top:var(--rfb-s7); padding-top:var(--rfb-s4);
  border-top:1px solid color-mix(in srgb, var(--rfb-brass-edge) 40%, transparent);
}
body.rfb-doc .policy-card>p:last-child>a{
  display:inline-flex; align-items:center; min-height:var(--rfb-tap);
}

/* Measure. The legal line ran 151 characters at 1440px - roughly twice a
   comfortable line - on every route. Body copy reads best at 45-75. */
.rfb-foot-legal{max-width:62ch;margin-left:auto;margin-right:auto}
/* WCAG 2.2 AA target size is 24x24 CSS px. The consent checkbox rendered at
   22x22 on a phone, which is under it. Inline links inside a sentence are
   exempt from that rule; a standalone form control is not. */
.rfb-consent input[type="checkbox"]{min-width:24px;min-height:24px}