/*
 * The marks, and the footer that carries one of them.
 *
 * One stylesheet for both because every page needs both, and because the
 * sign-in page carries its own palette and loads nothing else shared — a rule
 * that lives only in app.css is a rule that page does not get.
 *
 * ---------------------------------------------------------------- the wordmark
 *
 * FlagmanPay, set in the interface's own typeface, with "Pay" in gold. Type
 * rather than artwork so it stays sharp at any size, recolours with the theme,
 * and can be selected and read by a screen reader.
 */
.fp-mark{font-weight:700;letter-spacing:-.02em;font-size:22px;color:var(--fg);
  white-space:nowrap;line-height:1.15}
/*
 * One fixed amber, not the theme's --gold.
 *
 * A logo does not change colour with the lights. --gold is deliberately darker
 * on the light theme (#A16207) so that gold TEXT stays readable on white, and
 * that darker value reads brown — wrong for the mark. Bright amber is fine here
 * and only here: WCAG exempts logotypes from contrast, and it exempts nothing
 * else, so buttons and badges keep using --gold.
 */
.fp-mark span{color:#FFB81C}
/* Under the mark: what this thing is, in small caps. */
.fp-mark-sub{font-size:11px;color:var(--muted-2);letter-spacing:.08em;text-transform:uppercase;
  margin-top:2px}

/* The sidebar is dark whatever the theme says, so it does not follow --fg or
   --gold — both would go dark-on-dark under the light theme. */
.sb .fp-mark{color:#F1F5F9;font-size:19px}
.sb .fp-mark-sub{color:#64748B;font-size:10.5px}

/*
 * The site footer, on every page that has one.
 *
 * Its own file rather than part of app.css, because the sign-in page carries its
 * own palette and does not load app.css — and a footer that is invisible on one
 * page out of six is worse than no footer, since nobody looks.
 *
 * The theme variables it uses are defined by whichever stylesheet the page does
 * load; every one of them defines --muted and --border.
 */
/* Site footer, shared by the app shell and the public pages. In the shell it is
   pinned in the sidebar rather than at the bottom of the scrolling body, where a
   long register would push it out of reach.

   The lockup is supplied as white artwork on transparency. On the light public
   pages it has to be darkened to be visible at all; in the sidebar, which is
   dark in both themes, it is left exactly as drawn. */
.site-foot{text-align:center}
.powered-mark{height:22px;aspect-ratio:1169/261;margin:0 auto 7px;
  background:url("/assets/powered.png") center/contain no-repeat;
  filter:brightness(0);opacity:.5}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .powered-mark{filter:none;opacity:.7}
}
:root[data-theme="dark"] .powered-mark{filter:none;opacity:.7}
.foot-line{color:var(--muted);font-size:11px;line-height:1.5}
.foot-line + .foot-line{margin-top:3px}

/* In the sidebar: always dark behind it, whatever the theme says. */
.sb .site-foot{margin-top:12px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.sb .powered-mark{filter:none;opacity:.75}
.sb .foot-line{color:#7C8DA6;font-size:10.5px}