/* Self-hosted fonts (SIL Open Font License 1.1): Fraunces, Newsreader, IBM Plex Mono.
   Latin subset. Served locally so the installed app works offline. */

@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/fraunces-italic-400-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/fraunces-normal-400-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-500.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/ibm-plex-mono-normal-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/newsreader-italic-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(fonts/newsreader-normal-400-600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Metric-matched fallbacks: hold the line box and text width close to the
   web fonts while they load, so the font-display:swap does not shift layout.
   Values follow the capsize/fontaine method (xWidthAvg, ascent, descent). */
@font-face {
  font-family: 'Fraunces Fallback';
  src: local('Noto Serif'), local('NotoSerif'), local('NotoSerif-Regular'), local('Droid Serif'), local('DroidSerif');
  size-adjust: 97.51%; ascent-override: 100.30%; descent-override: 26.15%; line-gap-override: 0%;
}
@font-face {
  font-family: 'Fraunces Fallback G';
  src: local('Georgia');
  size-adjust: 105.20%; ascent-override: 92.96%; descent-override: 24.24%; line-gap-override: 0%;
}
@font-face {
  font-family: 'Newsreader Fallback';
  src: local('Noto Serif'), local('NotoSerif'), local('NotoSerif-Regular'), local('Droid Serif'), local('DroidSerif');
  size-adjust: 89.09%; ascent-override: 82.51%; descent-override: 29.75%; line-gap-override: 0%;
}
@font-face {
  font-family: 'Newsreader Fallback G';
  src: local('Georgia');
  size-adjust: 96.12%; ascent-override: 76.47%; descent-override: 27.57%; line-gap-override: 0%;
}

/* ===================================================================
   R1 VOUCH theme — one source of truth for the site, legal pages and app.
   Light "paper" by default. Follows the device setting unless the
   viewer picks Light or Dark (html[data-theme], saved as r1vouch.theme).
   =================================================================== */

:root {
  --paper: #f6f1e6;
  --paper-2: #ede5d4;
  --sheet: #fdfaf3;
  --ink: #1b1813;
  --ink-2: #4e473a;
  --ink-3: #6b6250;
  --rule: #d9cfba;
  --rule-strong: #1b1813;
  --stamp: #0f7a55;
  --stamp-ink: #0b5c40;
  --stamp-soft: #dcefe3;
  --flag: #b23a2a;
  --flag-soft: #f6e0d9;
  --amber: #8a5608;
  --amber-soft: #f5e7c8;
  --shadow-color: 40, 30, 15;
  --grain-opacity: .055;

  /* R9 -> R1 */
  --r9: #a8321f; --r8: #c2412d; --r7: #cf5a2a; --r6: #d97a26; --r5: #c98f1c;
  --r4: #93a62b; --r3: #5a9a3c; --r2: #2f8a4c; --r1: #0f7a55;
  /* R colours used as text: R3-R6 darkened to pass contrast on paper/sheet. Fills keep --rN. */
  --r9-text: var(--r9); --r8-text: var(--r8); --r7-text: var(--r7);
  --r6-text: #b8661c; --r5-text: #9c6d10; --r4-text: #6b7a1e; --r3-text: #4a8231;
  --r2-text: var(--r2); --r1-text: var(--r1);

  --display: "Fraunces", "Fraunces Fallback", "Fraunces Fallback G", "Iowan Old Style", Georgia, serif;
  --body: "Newsreader", "Newsreader Fallback", "Newsreader Fallback G", "Iowan Old Style", Georgia, serif;
  --mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  color-scheme: light;
}

/* Dark: a warm graphite, deliberately not near-black. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #2a2620; --paper-2: #322d26; --sheet: #35302a;
    --ink: #f3ecdd; --ink-2: #d2c8b4; --ink-3: #aca189;
    --rule: #4b443a; --rule-strong: #f3ecdd;
    --stamp: #4cc595; --stamp-ink: #6fd6ab; --stamp-soft: #2c4439;
    --flag: #f08a73; --flag-soft: #4a322b;
    --amber: #e8b45a; --amber-soft: #4a3d26;
    --shadow-color: 0, 0, 0;
    --grain-opacity: .07;
    --r9: #ea7a62; --r8: #ec8a58; --r7: #ec9c4c; --r6: #e8a944; --r5: #e0ae42;
    --r4: #b8c84e; --r3: #86c262; --r2: #5cc07e; --r1: #4cc595;
    --r6-text: var(--r6); --r5-text: var(--r5); --r4-text: var(--r4); --r3-text: var(--r3);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #2a2620; --paper-2: #322d26; --sheet: #35302a;
  --ink: #f3ecdd; --ink-2: #d2c8b4; --ink-3: #aca189;
  --rule: #4b443a; --rule-strong: #f3ecdd;
  --stamp: #4cc595; --stamp-ink: #6fd6ab; --stamp-soft: #2c4439;
  --flag: #f08a73; --flag-soft: #4a322b;
  --amber: #e8b45a; --amber-soft: #4a3d26;
  --shadow-color: 0, 0, 0;
  --grain-opacity: .07;
  --r9: #ea7a62; --r8: #ec8a58; --r7: #ec9c4c; --r6: #e8a944; --r5: #e0ae42;
  --r4: #b8c84e; --r3: #86c262; --r2: #5cc07e; --r1: #4cc595;
  --r6-text: var(--r6); --r5-text: var(--r5); --r4-text: var(--r4); --r3-text: var(--r3);
  color-scheme: dark;
}

/* Paper grain. Add class="grain" to <body>. */
.grain::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Theme switch (Auto / Light / Dark). Markup: <button class="theme-switch" data-theme-switch></button> */
.theme-switch {
  position: relative;
  display: inline-flex; align-items: center; gap: 7px;
  height: 32px; padding: 0 11px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--sheet);
  color: var(--ink-2);
  font: 500 .72rem/1 var(--mono);
  letter-spacing: .1em; text-transform: uppercase;
  cursor: pointer;
  transition: border-color .15s, color .15s;
}
.theme-switch:hover { color: var(--ink); border-color: var(--ink-3); }
.theme-switch:focus-visible { outline: 2px solid var(--stamp); outline-offset: 2px; }
.theme-switch svg { width: 14px; height: 14px; flex: none; }
/* Extends the 32px pill to a 44px-tall tap target without changing its look.
   Offsets are from the padding box, so 1px is added for the border. */
.theme-switch::after { content: ""; position: absolute; inset: -7px -4px; }

/* Visually hidden, still read by screen readers (live regions, labels). */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}