/* Focus mode — global rules.
   Lives outside Blazor scoped CSS because .ProseMirror (rendered by the bundled TipTap)
   carries no component scope attribute, and the dim effect must reach its text nodes.

   Paragraph dimming: when .focus-dim-on is set on .long-doc-content (by focusModeInterop.js),
   everything fades to the muted ink and only the block holding the caret (.focus-active-block,
   also set by the interop) stays at full ink. Subtle mention underlines are already ink3, so
   they fade with the text; vivid markers (a class-level color) are overridden to the muted ink
   on dimmed blocks and to full ink on the active block — calm by design. */

.long-doc-content.focus-dim-on .ProseMirror,
.long-doc-content.focus-dim-on .ProseMirror *,
.long-doc-content.focus-dim-on .long-doc-heading,
.long-doc-content.focus-dim-on .long-doc-separator {
    color: var(--focus-dim-ink, var(--ink3));
    transition: color 200ms ease;
}

.long-doc-content.focus-dim-on .focus-active-block,
.long-doc-content.focus-dim-on .focus-active-block * {
    color: var(--focus-active-ink, var(--ink));
}

/* Vivid mention markers keep their per-entity hue even while dimmed — the color coding is
   the whole point of Vivid. (Subtle markers carry no color of their own, so they ride the
   dim.) Listed last, and with a selector that outranks both the dim and active-block rules,
   so the hue wins in either state. */
.long-doc-content.focus-dim-on .entity-mention-vivid,
.long-doc-content.focus-dim-on .focus-active-block .entity-mention-vivid {
    color: hsl(var(--mention-hue, 200) 50% var(--mention-vivid-lightness, 38%));
}