/* EditorialBridge — structural pacing primitive.
 * Intentionally non-subgrid: decorative full-width spacer whose only
 * children are inline centered atoms (hr, numeral, custom-text). Nothing
 * inside references track lines, so a subgrid declaration would be a
 * no-op and would disturb the existing flex centering.
 * See: 2026-04-21-tome-subgrid-participation-audit.md — subgrid-optional.
 */
.bridge {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(8vh, 12vh, 16vh);
}

/* Height variants */
.height-small { height: clamp(4vh, 8vh, 10vh); }
.height-medium { height: clamp(8vh, 12vh, 16vh); }
.height-large { height: clamp(12vh, 16vh, 20vh); }

/* Mobile: slightly taller for pacing */
@media (max-width: 768px) {
  .height-small { height: clamp(6vh, 10vh, 14vh); }
  .height-medium { height: clamp(12vh, 15vh, 20vh); }
  .height-large { height: clamp(16vh, 20vh, 25vh); }
}

/* Inverted background */
.inverted {
  background-color: var(--tome-color-foreground);
  color: var(--tome-color-background);
}

.inverted .hairline {
  border-color: color-mix(in oklch, var(--tome-color-background) 20%, transparent);
}

.inverted .numeral,
.inverted .customText {
  color: color-mix(in oklch, var(--tome-color-background) 50%, transparent);
}

/* Bridge content */
.hairline {
  width: 4rem;
  border: none;
  border-top: 1px solid var(--tome-color-border);
}

.numeral {
  font-family: var(--tome-type-mono);
  font-size: var(--tome-type-size-micro);
  letter-spacing: var(--tome-type-tracking-widest);
  color: var(--tome-color-on-surface-muted);
  text-transform: uppercase;
}

.customText {
  font-size: var(--tome-type-size-micro);
  letter-spacing: var(--tome-type-tracking-wider);
  text-transform: uppercase;
  color: var(--tome-color-on-surface-muted);
}
Install
