/* THE WORDMARK. One rule, three pages.
 *
 * Until 2026-11-04 this lived three times — coming-soon.html, access.html and
 * login.html — and the three had quietly drifted apart. Two set the italic
 * half in Fraunces; login.html set it in Instrument Sans, which it loaded
 * without an italic axis, so the browser sheared the roman and the brand's
 * wordmark on its own sign-in page was a synthesised slant. The same week,
 * fixing the kerning meant editing the identical declaration in two files and
 * then discovering the third was not identical at all.
 *
 * They agreed only as long as somebody remembered all three. This file is so
 * that nobody has to.
 *
 * SERVED FROM server/public, which express.static mounts at / before any gate,
 * so all three reach it as /wordmark.css — including login.html, which lives
 * at the repo root. It needs no ROOT_PUBLIC entry; that allowlist governs root
 * files, not this directory.
 *
 * MARKUP CONTRACT. Two spans inside the container, in this order:
 *
 *   <span class="logo-text">
 *     <span class="logo-main">lumah</span><span class="logo-script">flow</span>
 *   </span>
 *
 * login.html used to write a bare text node plus a nested .flow span. It was
 * converted, because one rule cannot serve two shapes — that is how the drift
 * started.
 *
 * TOKENS. --font-display, --font-serif, --text and --accent must exist on the
 * page. login.html names its accent --gold, so it aliases rather than copying
 * the hex: --accent:var(--gold). The alias is live, which is what lets
 * skinCafeFlo() repaint the wordmark by setting one variable.
 */

.logo-text{
  /* The whole lockup scales from here. A page that wants a different size
     sets --wm and touches nothing else. */
  --wm:1.2rem;
  display:flex;
  align-items:baseline;
  /* Kerning, not decoration: at the old gap:1px the acute on café's é fouled
     the ascender of flo's f. .08em is the smallest value that clears it at
     every size — below .06em they touch again. In em of --wm, so it holds
     from a 19px header to a 157px social asset. */
  gap:.08em;
  line-height:1;
  font-size:var(--wm);
}

.logo-main{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1em;
  letter-spacing:-.02em;
  color:var(--text);
}

.logo-script{
  font-family:var(--font-serif);
  font-style:italic;
  /* Explicit, because the container's weight would otherwise inherit.
     Fraunces at 700 is a different logo. */
  font-weight:500;
  /* 1.3 / 1.2 — the ratio the splash has always carried. Set flat, Fraunces
     reads small beside Bricolage. */
  font-size:1.0833em;
  color:var(--accent);
}