/* Brand signature: use .mk-eyebrow in marketing, .fl-identifier in the app.
   Both underline segments share the same bottom edge. Never use a pill here. */
.mk-page .mk-eyebrow,
.fl-identifier {
  position: relative;
  display: inline-flex;
  width: fit-content;
  padding: 0 0 10px;
  margin-bottom: 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--fl-identifier-color, #000);
}
.mk-page .mk-eyebrow::before,
.fl-identifier::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--fl-identifier-track-width, 200%);
  height: 1px;
  background: var(--fl-identifier-track, #555);
}
.mk-page .mk-eyebrow::after,
.fl-identifier::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--fl-identifier-color, #000);
}
.fl-identifier {
  font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.mk-page .fl-agent-brand-identifier { --fl-identifier-track-width: 150%; }
