/* THE ANNA WORDMARK — THE ONE DEFINITION. The product's name, in the one
   treatment, everywhere it appears AS A NAME. This file is the only place
   "Anna" is styled: annaMark.test.ts fails if a second `.anna-mark` rule
   appears anywhere, if any other rule restyles it (a context may set its SIZE
   and nothing else), or if a component renders a bare "Anna" outside
   <AnnaMark/>.

   display: inline-block is LOAD-BEARING (the first product's finding, measured
   in real browsers): the gradient paints across the ELEMENT box, so on a
   full-width block the letters would show only the first sliver of it - a flat
   colour. inline-block shrinks the box to the word, so the gradient always
   spans the word itself. -webkit-text-fill-color backs up color: transparent
   on WebKit. The smoke test checks the computed display in both engines.

   The family is spelled out, not var(--font-sans), so the mark cannot change
   face if a token does. The colours are a deep teal to a violet, chosen to
   read on the light ground; the real brand treatment is Phase 4, and it lands
   HERE. */
.anna-mark {
  font-family: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-weight: 700;
  display: inline-block;
  background: linear-gradient(96deg, #14788F, #1F8FAF 55%, #6A5AD0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
