/* Penny's look for Base's sign-in confirmation and /setup frames:
   the brand palette (src/core/ui/brand/tokens.css), Inter Tight from /fonts and
   the copper penny mark. The action is the landing's ink pill, as on sign-in.
   Ink on paper 15:1, soft text on card 8.6:1, copper text and links 5.2:1,
   paper on ink 15:1, strong line 3.6:1. */
@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/fonts/inter-tight/inter-tight-latin-wght-normal.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: 'Inter Tight Fallback';
  font-style: normal;
  font-weight: 100 450;
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('LiberationSans');
  size-adjust: 96%;
  ascent-override: 101%;
  descent-override: 25%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Inter Tight Fallback';
  font-style: normal;
  font-weight: 451 650;
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('LiberationSans');
  size-adjust: 98.4%;
  ascent-override: 98.6%;
  descent-override: 24.4%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Inter Tight Fallback';
  font-style: normal;
  font-weight: 651 900;
  src: local('Arial Bold'), local('Arial-BoldMT'), local('Liberation Sans Bold'), local('LiberationSans-Bold');
  size-adjust: 98.3%;
  ascent-override: 98.7%;
  descent-override: 24.4%;
  line-gap-override: 0%;
}
:root {
  --rer-font-body: 'Inter Tight', 'Inter Tight Fallback', 'Helvetica Neue', Arial, sans-serif;
  --rer-font-heading: 'Inter Tight', 'Inter Tight Fallback', 'Helvetica Neue', Arial, sans-serif;
  --rer-page: #faf7ef;
  --rer-surface: #fdfbf6;
  --rer-text: #20211f;
  --rer-muted: #474a4e;
  --rer-border: #8f8270;
  --rer-focus: #ad4a1f;
  --rer-accent: #20211f;
  --rer-accent-text: #faf7ef;
  --rer-link: #ad4a1f;
  --rer-radius: 14px;
  --rer-logo: url('/brand/penny-mark.svg');
}
/* Base draws --rer-logo in a 32px square. The mark is the coin alone and fills its drawing, so the square narrows to 32px / 1.2
   (26.7px, which draws the same 25px coin as ever) and keeps its 32px height, which keeps the lockup's height. The margins pull the
   drawing's own 4.25% edge back so the coin sits flush against Base's 12px gap to the name. Higher specificity than Base's inline rule. */
html.rer-themed .rer-brand::before,
html.rer-themed .brand::before {
  width: calc(32px / 1.2);
  margin-inline: calc(32px / 1.2 * -0.0425);
}
/* The setup frame's 18px name sits about 0.9px above the middle of its 32px line, so its coin rises 0.8px to stay centred on it. */
html.rer-themed .rer-brand::before {
  background-position: center calc(50% - 0.8px);
}