/* "by FotoJock" byline under each mini app's name in its top-left header (owner request, 2026-10-18; see
   dokumenta/tools/FOTOJOCK_CHECKPOINT.md "by FotoJock"). Brand lockup: the same English text in every language, not translated.
   It links to the FotoJock home in the page's language (same tab): the markup says href="/fotojock", the server's composer
   (tools_seo.rs localize_links) makes it /{l}/fotojock, and data-seo="byfj" / "byfj-s" (start screen) lets common/seo-lang.js
   swap in the new language's link after a no-reload language switch.
   Markup (a link can't sit inside the brand's About <button> / <a>, so it follows it in a wrapper; --byfj-in indents it to
   the name, i.e. the mark's width + gap):
     <div class="byfj-g"><button class="brand" …><svg class="mk">…</svg><span>Photo <em>Collage</em></span></button><a class="byfj" href="/fotojock" data-seo="byfj">by FotoJock</a></div>
   Non-interactive brands wrap the name instead:
     <span class="brand"><span class="mk"></span><span class="byfj-w"><span>Photo <em>Collage</em></span><a class="byfj" …>by FotoJock</a></span></span>
   Colour = the app's muted token (--dim); a page can tune --byfj-fs (size), --byfj-ff (font), --byfj-c (colour),
   --byfj-mt (gap above), --byfj-in (indent in .byfj-g). */
.byfj-w, .byfj-g { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; }
.byfj-g > .byfj { margin-left: var(--byfj-in, 32px); }
.byfj {
  display: block; width: max-content; margin: var(--byfj-mt, 2px) 0 0; padding: 0;
  font-family: var(--byfj-ff, var(--ui, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif));
  font-size: var(--byfj-fs, 10px); font-weight: 400; font-style: normal; line-height: 1.15;
  letter-spacing: .03em; text-transform: none; white-space: nowrap;
  color: var(--byfj-c, var(--dim, currentColor)); text-decoration: none; pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}
.byfj-g > .byfj { margin-top: var(--byfj-mt, -3px); }
a.byfj:hover { text-decoration: underline; text-underline-offset: 2px; }
a.byfj:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; border-radius: 2px; }