/* =========================================================
   Tag Me Maybe — Annotation 1.2 / Reader-style Macro Rail Interactions
   Visual-only addition to Annotation 1.x.
   Palette, line weights and containment language intentionally mirror
   the current Reader rather than Annotation 2.0.
   ========================================================= */

body.annotation-page:not(.annotation-v2-page) {
  --qa-macro-rail-width: 224px;
}

/* Preserve the original Annotation notebook plane. We only open a real
   corridor between the existing source and annotation columns. */
body.annotation-page:not(.annotation-v2-page) .qa-segment-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--qa-macro-rail-width) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
}

body.annotation-page:not(.annotation-v2-page) .qa-segment-content-column {
  grid-column: 1;
  width: auto !important;
  min-width: 0;
}

body.annotation-page:not(.annotation-v2-page) .qa-annotations-column {
  grid-column: 3;
  width: auto !important;
  min-width: 0;
}

.annotation-reader-macro-layer {
  position: absolute;
  inset: 0 auto auto 0;
  overflow: visible;
  pointer-events: none;
  z-index: 5;
  shape-rendering: geometricPrecision;
}

.annotation-reader-macro-group {
  pointer-events: none;
  opacity: .58; /* exact Reader base macro opacity */
}

.annotation-reader-macro-spine,
.annotation-reader-macro-branch {
  fill: none;
  stroke-width: 1.55; /* exact Reader base line weight */
  vector-effect: non-scaling-stroke;
}

.annotation-reader-macro-spine.is-gap {
  stroke-dasharray: 2.5 5.5;
  opacity: .56;
}

.annotation-reader-macro-spine--single {
  stroke-linecap: round;
}

.annotation-reader-macro-branch {
  opacity: .68;
}

.annotation-reader-macro-member-dot {
  opacity: .82;
}

.annotation-reader-macro-label rect {
  fill: color-mix(in oklab, var(--tmm-surface, #fff) 94%, transparent);
  stroke: color-mix(in oklab, currentColor 32%, var(--tmm-border, #d7dee8));
  stroke-width: 1;
  filter: drop-shadow(0 1px 2px rgba(15,23,42,.07));
}

.annotation-reader-macro-label text {
  font-family: Inter, system-ui, sans-serif;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: -.01em;
}

/* Reader 0.6B2 containment language — copied intentionally. */
.annotation-reader-macro-containment-group {
  opacity: .98;
}

.annotation-reader-macro-containment-bracket,
.annotation-reader-macro-containment-tooth {
  fill: none;
  stroke-width: 2.45;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  opacity: .96;
  filter: drop-shadow(0 1px 1px rgba(72, 53, 24, .10));
}

.annotation-reader-macro-containment-bracket {
  stroke-width: 2.7;
}

.annotation-reader-macro-containment-tooth {
  opacity: .9;
}

.annotation-reader-macro-containment-node {
  fill: var(--tmm-surface, #fff);
  stroke-width: 2;
}

.annotation-reader-macro-containment-glyph {
  pointer-events: none;
  opacity: .9;
}

.annotation-reader-macro-containment-glyph rect {
  fill: color-mix(in oklab, var(--tmm-surface, #fff) 94%, currentColor 6%);
  stroke: color-mix(in oklab, currentColor 48%, var(--tmm-border, #d7dee8));
  stroke-width: .8;
}

.annotation-reader-macro-containment-glyph text {
  font-family: Inter, system-ui, sans-serif;
  font-size: 9px;
  font-weight: 850;
  fill: currentColor;
}

@media (min-width: 1121px) and (max-width: 1320px) {
  body.annotation-page:not(.annotation-v2-page) {
    --qa-macro-rail-width: 176px;
  }
}

@media (min-width: 901px) and (max-width: 1120px) {
  body.annotation-page:not(.annotation-v2-page) {
    --qa-macro-rail-width: 96px;
  }
}

@media (max-width: 900px) {
  body.annotation-page:not(.annotation-v2-page) {
    --qa-macro-rail-width: 0px;
  }
  body.annotation-page:not(.annotation-v2-page) .qa-segment-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  body.annotation-page:not(.annotation-v2-page) .qa-segment-content-column { grid-column: 1; }
  body.annotation-page:not(.annotation-v2-page) .qa-annotations-column { grid-column: 2; }
  .annotation-reader-macro-layer { display: none; }
}


/* =========================================================
   Annotation 1.2 — Reader macro interactions
   These selectors intentionally mirror Reader 0.3 / 0.8C rather than the
   experimental Annotation 2.0 interaction language.
   ========================================================= */
.annotation-reader-macro-layer {
  pointer-events: none;
}

.annotation-reader-macro-group {
  transition: opacity .12s ease;
}
.annotation-reader-macro-group.is-dimmed {
  opacity: .28;
}

.annotation-reader-macro-label {
  pointer-events: all;
  cursor: pointer;
}
.annotation-reader-macro-hit {
  fill: none;
  stroke: transparent;
  stroke-width: 14;
  pointer-events: stroke;
  cursor: pointer;
}

.annotation-reader-macro-group.is-active {
  opacity: 1;
}
.annotation-reader-macro-group.is-active .annotation-reader-macro-spine,
.annotation-reader-macro-group.is-active .annotation-reader-macro-branch {
  stroke-width: 2.2;
}
.annotation-reader-macro-group.is-active .annotation-reader-macro-label rect {
  stroke-width: 1.5;
}

.annotation-reader-macro-id-label {
  transition: opacity .12s ease;
}
.annotation-reader-macro-name-label {
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
}
.annotation-reader-macro-name-label rect {
  fill: color-mix(in oklab, var(--tmm-surface, #fff) 97%, currentColor 3%);
  stroke: color-mix(in oklab, currentColor 48%, var(--tmm-border, #d7dee8));
  stroke-width: 1.15;
  filter: drop-shadow(0 2px 5px rgba(15,23,42,.10));
}
.annotation-reader-macro-name-label text {
  font-family: Inter, system-ui, sans-serif;
  font-size: 11.5px;
  font-weight: 820;
  letter-spacing: -.012em;
}
.annotation-reader-macro-group.is-direct-active .annotation-reader-macro-name-label {
  opacity: 1;
  pointer-events: all;
}
.annotation-reader-macro-group.is-direct-active .annotation-reader-macro-id-label {
  opacity: 0;
}
.annotation-reader-macro-group.is-pinned .annotation-reader-macro-name-label rect {
  stroke-width: 1.7;
  fill: color-mix(in oklab, var(--tmm-surface, #fff) 93%, currentColor 7%);
}

/* Same lightweight member cue as Reader: the annotation remains fully
   readable and no global focus/dimming mode is activated. */
body.annotation-page:not(.annotation-v2-page) .qa-ann.annotation-reader-macro-member {
  border-radius: 8px;
  background: color-mix(in oklab, var(--tmm-theme-accent-soft, #edf3ff) 38%, transparent);
  box-shadow: inset 3px 0 0 color-mix(in oklab, var(--tmm-theme-accent-ink, #2563eb) 36%, transparent);
}

@media (max-width: 1120px) and (min-width: 901px) {
  .annotation-reader-macro-name-label text { font-size: 10.5px; }
}


/* =========================================================
   Annotation 1.2A — Reader fidelity fix
   1) remove native SVG focus rectangle / browser tooltip artefacts;
   2) copy Reader annotation left-edge language 1:1.
   ========================================================= */

/* SVG <g tabindex> can receive a browser-native black focus outline.
   Annotation uses its own visual active state, so suppress only the native ring. */
.annotation-reader-macro-group,
.annotation-reader-macro-group:focus,
.annotation-reader-macro-group:focus-visible {
  outline: none !important;
}

/* Reader 0.4B / 0.8C annotation left edge — same width, colour and left radius.
   Apply it to qa-ann-inner (the visual annotation card), not qa-ann itself,
   so the line stays perfectly straight instead of following Annotation's
   rounded outer box / bottom spacing. */
body.annotation-page:not(.annotation-v2-page) .qa-ann > .qa-ann-inner {
  border-left: 2px solid color-mix(in oklab, var(--tmm-border-strong, #cbd5e1) 78%, transparent);
  border-radius: 0 7px 7px 0;
  padding-left: 11px;
}

/* Exact Reader macro-member cue: same background and 3px inset line. */
body.annotation-page:not(.annotation-v2-page) .qa-ann.annotation-reader-macro-member {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.annotation-page:not(.annotation-v2-page) .qa-ann.annotation-reader-macro-member > .qa-ann-inner {
  background: color-mix(in oklab, var(--tmm-theme-accent-soft, #edf3ff) 38%, var(--tmm-surface, #fff));
  border-left-color: color-mix(in oklab, var(--tmm-theme-accent-ink, #2563eb) 36%, var(--tmm-border-strong, #cbd5e1));
  box-shadow: inset 3px 0 0 color-mix(in oklab, var(--tmm-theme-accent-ink, #2563eb) 36%, transparent);
}

/* Existing Annotation hover/focus keeps priority, but retains the straight edge. */
body.annotation-page:not(.annotation-v2-page) .qa-ann.is-ann-hovered > .qa-ann-inner,
body.annotation-page:not(.annotation-v2-page) .qa-ann.is-ann-span-hovered > .qa-ann-inner,
body.annotation-page:not(.annotation-v2-page) .qa-ann.is-ann-focused > .qa-ann-inner,
body.annotation-page:not(.annotation-v2-page) .qa-ann.is-rel-endpoint > .qa-ann-inner {
  border-radius: 0 7px 7px 0;
}

/* =========================================================
   Annotation 1.3A — Macro corridor parity + M–M relations
   The middle M corridor uses exactly the same quiet tint as Annotation's
   existing right-hand R corridor. Discourse relations between macros reuse
   the Reader visual language (colour mapping, curves, labels, arrowheads).
   ========================================================= */

/* Same corridor shade as the tag-relation rail in annotation.css. The grid
   remains visible through the deliberately low-alpha wash. */
body.annotation-page:not(.annotation-v2-page) .qa-segment-row::before {
  content: "";
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  justify-self: stretch;
  min-width: 0;
  pointer-events: none;
  background: rgba(100, 116, 139, 0.018);
  box-shadow:
    inset 1px 0 0 rgba(100, 116, 139, 0.13),
    inset -1px 0 0 rgba(100, 116, 139, 0.13);
  z-index: 0;
}

body.bg-paper.annotation-page:not(.annotation-v2-page) .qa-segment-row::before {
  background: rgba(128, 96, 52, 0.018);
  box-shadow:
    inset 1px 0 0 rgba(126, 99, 62, 0.13),
    inset -1px 0 0 rgba(126, 99, 62, 0.13);
}

/* Keep the source and annotation columns above the corridor wash. */
body.annotation-page:not(.annotation-v2-page) .qa-segment-content-column,
body.annotation-page:not(.annotation-v2-page) .qa-annotations-column {
  position: relative;
  z-index: 1;
}

.annotation-reader-macro-relation-layer {
  pointer-events: none;
}

.annotation-reader-macro-relation-group {
  pointer-events: none;
  opacity: .52;
  transition: opacity .12s ease;
}

.annotation-reader-macro-relation-group.is-active,
.annotation-reader-macro-relation-group.is-pinned {
  opacity: 1;
}

.annotation-reader-macro-relation-group.is-dimmed {
  opacity: .10;
}

.annotation-reader-macro-relation-path {
  fill: none;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  opacity: .76;
}

.annotation-reader-macro-relation-hit {
  fill: none;
  stroke: transparent;
  stroke-width: 15;
  pointer-events: stroke;
  cursor: pointer;
}

.annotation-reader-macro-relation-label {
  pointer-events: all;
  cursor: pointer;
  outline: none !important;
}

.annotation-reader-macro-relation-label rect {
  fill: color-mix(in oklab, var(--tmm-surface, #fff) 97%, transparent);
  stroke-width: 1.15;
  filter: drop-shadow(0 1px 3px rgba(15,23,42,.09));
}

.annotation-reader-macro-relation-label text {
  font-family: Inter, system-ui, sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: -.008em;
}

.annotation-reader-macro-relation-group.is-active .annotation-reader-macro-relation-path,
.annotation-reader-macro-relation-group.is-pinned .annotation-reader-macro-relation-path {
  stroke-width: 3;
  opacity: .95;
}

.annotation-reader-macro-relation-group.is-active .annotation-reader-macro-relation-label rect,
.annotation-reader-macro-relation-group.is-pinned .annotation-reader-macro-relation-label rect {
  stroke-width: 1.8;
}

/* When a macro relation itself is selected, only its two M endpoints receive
   the Reader's light contextual emphasis. */
.annotation-reader-macro-group.is-relation-endpoint {
  opacity: 1;
}
.annotation-reader-macro-group.is-relation-endpoint .annotation-reader-macro-spine,
.annotation-reader-macro-group.is-relation-endpoint .annotation-reader-macro-branch {
  stroke-width: 2.2;
}
.annotation-reader-macro-group.is-relation-endpoint .annotation-reader-macro-label rect {
  stroke-width: 1.5;
}

@media (max-width: 1120px) and (min-width: 901px) {
  .annotation-reader-macro-relation-label text { font-size: 9.5px; }
}

@media (max-width: 900px) {
  body.annotation-page:not(.annotation-v2-page) .qa-segment-row::before,
  .annotation-reader-macro-relation-layer { display: none; }
}


/* =========================================================
   Annotation 1.3B — Macro corridor width alignment
   The M corridor now has exactly the same width as the existing right-hand
   R corridor. The source/segment column keeps its previous width; all space
   recovered by narrowing the M corridor is assigned to the annotation side.
   ========================================================= */
body.annotation-page:not(.annotation-v2-page) {
  /* Half of the PRE-1.3B macro corridor. Keeping this value lets the source
     column stay optically and mathematically where it was before the change. */
  --qa-macro-legacy-half: 112px;
}

body.annotation-page:not(.annotation-v2-page) .qa-segment-row {
  /* --qa-relation-corridor-width is defined on #qaPairsPanel and inherited by
     every row. This guarantees M corridor == R corridor at each breakpoint. */
  grid-template-columns:
    minmax(0, calc(50% - var(--qa-macro-legacy-half)))
    var(--qa-relation-corridor-width, 152px)
    minmax(0, 1fr);
}

@media (min-width: 1121px) and (max-width: 1320px) {
  body.annotation-page:not(.annotation-v2-page) {
    --qa-macro-legacy-half: 88px; /* old 176px M corridor / 2 */
  }
}

@media (min-width: 901px) and (max-width: 1120px) {
  body.annotation-page:not(.annotation-v2-page) {
    --qa-macro-legacy-half: 48px; /* old 96px M corridor / 2 */
  }
}

@media (max-width: 900px) {
  body.annotation-page:not(.annotation-v2-page) .qa-segment-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

/* =========================================================
   Annotation 1.3C — Horizontal overflow regression guard
   The Reader-style M canvas must behave like an overlay, never like intrinsic
   page content. Keep the live Annotation workspace shrinkable and cap the
   overlay to the current panel width. Geometry remains visible inside M/R
   corridors; this does not change their proportions.
   ========================================================= */
body.annotation-page:not(.annotation-v2-page) #qaPairsPanel,
body.annotation-page:not(.annotation-v2-page) #qaPairsOutput,
body.annotation-page:not(.annotation-v2-page) .qa-segment-row,
body.annotation-page:not(.annotation-v2-page) .qa-segment-content-column,
body.annotation-page:not(.annotation-v2-page) .qa-annotations-column {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

body.annotation-page:not(.annotation-v2-page) #qaPairsPanel,
body.annotation-page:not(.annotation-v2-page) #qaPairsOutput,
body.annotation-page:not(.annotation-v2-page) .qa-segment-row {
  width: 100%;
}

body.annotation-page:not(.annotation-v2-page) .annotation-reader-macro-layer {
  width: 100% !important;
  max-width: 100% !important;
}