/* Eyebrow — Vyzora Primitive
 * ----------------------------------------------------------------------------
 * The universal mono-eyebrow opener that precedes section headings across all
 * surface modes. Encodes the "section / category / instrument" register —
 * never decorative, always informational.
 *
 * Anti-pattern: never used for body copy, button labels, or pull-quotes.
 * Eyebrows label what comes next. They do not stand alone.
 *
 * Composes from existing tokens — no new primitives introduced.
 * ============================================================================
 */

.eyebrow {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--type-11);
  letter-spacing: var(--eyebrow-tracking);
  text-transform: uppercase;
  color: var(--text-secondary);
  line-height: var(--lh-tight);
  font-feature-settings: "tnum";  /* JuliaMono is tabular by default; explicit for safety */
}

/* Bordered variant — when the eyebrow needs frame weight (e.g. metadata chip,
 * status pill, run-id stamp). Used 60+ times in the Replit reference; one
 * primitive replaces the inline border + padding repetition. */
.eyebrow--bordered {
  border: var(--border-hair) solid var(--border-hairline);
  padding: 2px var(--space-2);
  border-radius: var(--radius-1);
}

/* Inverted variant — when the eyebrow sits on a darker surface (mode-bridge
 * transition strip, footer band, terminus marker). */
.eyebrow--inverted {
  color: var(--bg-primary);
  border-color: var(--bg-primary);
}

/* Anchor variant — extremely rare; for the ONE eyebrow per page that needs
 * memorability force (e.g. the masthead "VYZORA" stamp on cover-anchor
 * compositions). Uses --accent-trace not --action-primary to avoid
 * conflicting with the page's primary CTA register. */
.eyebrow--anchor {
  color: var(--accent-trace);
}

/* Marginalia variant — 9px floor for right-margin governance notation.
 * NEVER used as a section opener; only as inline metadata in dense surfaces. */
.eyebrow--margin {
  font-size: 9px;
  letter-spacing: 0.06em;
}