* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
  margin: 0;
}

body {
  background: #2c313d;
  color: #f5f7fb;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.pdf-app {
  height: 100vh;
  overflow-y: auto;
  scroll-behavior: smooth;
}

.pdf-toolbar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 36px;
  padding: 8px 12px;
  border-bottom: 1px solid #111827;
  background: #171b25;
  color: #f5f7fb;
  font-size: 12px;
}

.pdf-toolbar span {
  color: #aab3c5;
}

.pdf-toolbar a {
  margin-left: auto;
  color: #ff6f8a;
  text-decoration: none;
}

.pdf-pages {
  display: grid;
  gap: 18px;
  justify-items: center;
  padding: 20px;
}

.pdf-page {
  position: relative;
  width: min(100%, 980px);
  padding: 0;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38);
  scroll-margin-top: 52px;
}

.pdf-page img {
  display: block;
  width: 100%;
  height: auto;
}

.page-label {
  position: absolute;
  right: 8px;
  top: 8px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.76);
  color: #fff;
  font-size: 11px;
}

.eq-circle-marker {
  position: absolute;
  z-index: 4;
  width: 4px;
  height: 4px;
  padding: 0;
  border: 1px solid rgba(34, 197, 94, 0.72);
  border-radius: 50%;
  background: #22c55e;
  box-shadow: none;
  cursor: pointer;
  opacity: 0.72;
  transform: translate(-50%, -50%);
}

.eq-circle-marker:hover,
.eq-circle-marker.active {
  border-color: #ffffff;
  opacity: 1;
}

.doc-leaf-marker {
  pointer-events: none;
  opacity: 0;
}

.pdf-page:hover .doc-leaf-marker.active,
.doc-leaf-marker.active {
  pointer-events: auto;
  opacity: 0.9;
}

/* Scenegraph overlay mode: render docling+huridocs bbox_fraction as colored
   rectangles per segment_type. Source data ships per leaf in
   document-leaf-map.js; this mode just makes the geometry visible. */
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker.scenegraph-bbox {
  pointer-events: auto;
  opacity: 0.55;
  left: var(--bbox-x);
  top: var(--bbox-y);
  width: var(--bbox-w);
  height: var(--bbox-h);
  border-radius: 2px;
  border: 1px solid rgba(148, 163, 184, 0.7);
  background: rgba(148, 163, 184, 0.08);
  transform: none;
  cursor: help;
}

body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker.scenegraph-bbox:hover {
  opacity: 0.85;
  z-index: 4;
}

body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Title"] {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.75);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Section header"] {
  background: rgba(217, 119, 6, 0.20);
  border-color: rgba(217, 119, 6, 0.78);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Text"] {
  background: rgba(59, 130, 246, 0.08);
  border-color: rgba(59, 130, 246, 0.55);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Formula"] {
  background: rgba(168, 85, 247, 0.20);
  border-color: rgba(168, 85, 247, 0.85);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Caption"] {
  background: rgba(6, 182, 212, 0.20);
  border-color: rgba(6, 182, 212, 0.80);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Picture"] {
  background: rgba(132, 204, 22, 0.18);
  border-color: rgba(132, 204, 22, 0.78);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Table"] {
  background: rgba(244, 114, 182, 0.18);
  border-color: rgba(244, 114, 182, 0.78);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="List item"] {
  background: rgba(99, 102, 241, 0.10);
  border-color: rgba(99, 102, 241, 0.6);
}
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Page footer"],
body[data-pdf-overlay-mode="scenegraph"] .doc-leaf-marker[data-segment-type="Page header"] {
  background: rgba(156, 163, 175, 0.08);
  border-color: rgba(156, 163, 175, 0.5);
}

/*
 * In-text citation markers: a tight outlined box pinned over the bracket
 * citation glyphs (e.g. [7], [9-11]) using the per-citation bbox extracted
 * from the PDF text layer. Clicking navigates the parent shell to the cited
 * bibliography Reference node. Bibliography-page labels ([1]..[57] in the
 * references list) are styled more faintly via .citation-bib-label.
 */
.citation-marker {
  position: absolute;
  left: var(--bbox-x, 0%);
  top: var(--bbox-y, 0%);
  width: var(--bbox-w, 1%);
  height: var(--bbox-h, 1%);
  min-width: 6px;
  min-height: 8px;
  padding: 0;
  margin: 0;
  appearance: none;
  background: rgba(56, 189, 248, 0.16);
  border: 1px solid rgba(56, 189, 248, 0.85);
  border-radius: 2px;
  cursor: pointer;
  z-index: 6;
  box-sizing: border-box;
  transition: background 120ms ease, box-shadow 120ms ease;
}
.citation-marker:hover {
  background: rgba(56, 189, 248, 0.34);
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.35);
}
.citation-marker.active {
  background: rgba(250, 204, 21, 0.34);
  border-color: rgba(250, 204, 21, 0.95);
  box-shadow: 0 0 0 2px rgba(250, 204, 21, 0.4);
}
.citation-marker.citation-bib-label {
  background: rgba(56, 189, 248, 0.08);
  border-color: rgba(56, 189, 248, 0.5);
}

/*
 * graph-entity-anchor cluster hide is OPT-IN (disabled by default). Inline
 * MathObject anchors now render at their OWN document positions, so the old
 * bottom-right bundling around a shared parent leaf no longer happens and there
 * is nothing to hide. This rule remains available only if something explicitly
 * adds body.entity-cluster-hidden; geometry is then preserved (opacity:0 +
 * pointer-events:none) so PDF documentgraph-edge endpoints still resolve.
 */
body.entity-cluster-hidden .graph-entity-anchor[data-cluster-member="true"] {
  opacity: 0;
  pointer-events: none;
}

.graph-entity-anchor {
  appearance: none;
  position: absolute;
  z-index: 5;
  width: 5px;
  height: 5px;
  padding: 0;
  border: 1px solid rgba(34, 197, 94, 0.78);
  border-radius: 50%;
  background: #22c55e;
  color: transparent;
  cursor: pointer;
  font-size: 0;
  line-height: 0;
  opacity: 0.76;
  box-shadow: none;
  transform: translate(
    calc(-50% + var(--entity-offset-x, 0px)),
    calc(-50% + var(--entity-offset-y, 0px))
  );
}

.graph-entity-anchor.thoughtstep,
.graph-entity-anchor.documentgraphleaf {
  z-index: 5;
  width: 4px;
  height: 4px;
  border-color: rgba(34, 197, 94, 0.52);
  background: transparent;
  box-shadow: none;
  opacity: 0.54;
}

.graph-entity-anchor.concept,
.graph-entity-anchor.reference,
.graph-entity-anchor.mathobject,
.graph-entity-anchor.figure,
.graph-entity-anchor.organization,
.graph-entity-anchor.section {
  z-index: 7;
}

.graph-entity-anchor.person {
  z-index: 9;
  width: 5px;
  height: 5px;
  background: #22c55e;
  opacity: 0.82;
}

.graph-entity-anchor.mathobject,
.graph-entity-anchor.variable {
  z-index: 13;
  width: 5px;
  height: 5px;
  border-color: rgba(34, 197, 94, 0.78);
  background: #22c55e;
  opacity: 0.82;
  box-shadow: none;
}

.graph-entity-anchor.inlinemathobject {
  z-index: 13;
  width: 4px;
  min-width: 0;
  height: 4px;
  border: 1px solid rgba(34, 197, 94, 0.78);
  border-radius: 50%;
  background: #22c55e;
  opacity: 0.82;
  box-shadow: none;
  transform: translate(
    calc(-50% + var(--entity-offset-x, 0px)),
    calc(-50% + var(--entity-offset-y, 0px))
  );
}

.graph-entity-anchor.textspan,
.graph-entity-anchor.equation,
.graph-entity-anchor.equationlabel {
  z-index: 12;
  width: var(--textspan-anchor-width, 8%);
  min-width: 14px;
  height: 8px;
  border: 0;
  border-bottom: 1px solid rgba(34, 197, 94, 0.88);
  border-radius: 0;
  background: transparent;
  opacity: 0.9;
  box-shadow: none;
  transform: translateY(calc(-50% + var(--entity-offset-y, 0px)));
}

.graph-entity-anchor.textspan.author,
.graph-entity-anchor.textspan.person {
  z-index: 14;
}

.graph-entity-anchor.author {
  z-index: 10;
}

.graph-entity-anchor.originaldocument {
  z-index: 16;
  width: 5px;
  height: 5px;
}

.graph-entity-anchor.originaldocument.textspan {
  width: var(--textspan-anchor-width, 8%);
  height: 8px;
}

.graph-entity-anchor.thoughtchain {
  z-index: 15;
  width: 5px;
  height: 5px;
}

.graph-entity-anchor:hover,
.graph-entity-anchor.active {
  outline: 1px solid rgba(34, 197, 94, 0.7);
  outline-offset: 1px;
  border-color: #ffffff;
  background: #22c55e;
  opacity: 1;
  box-shadow: none;
}

.graph-entity-anchor.thoughtstep:hover,
.graph-entity-anchor.documentgraphleaf:hover,
.graph-entity-anchor.thoughtstep.active,
.graph-entity-anchor.documentgraphleaf.active {
  border-color: #ffffff;
  background: transparent;
  opacity: 0.85;
}

.graph-entity-anchor.mathobject:hover,
.graph-entity-anchor.variable:hover,
.graph-entity-anchor.mathobject.active,
.graph-entity-anchor.variable.active {
  background: #22c55e;
  box-shadow: none;
}

.graph-entity-anchor.inlinemathobject:hover,
.graph-entity-anchor.inlinemathobject.active {
  outline: 1px solid rgba(34, 197, 94, 0.7);
  outline-offset: 1px;
  background: #22c55e;
  box-shadow: none;
}

.graph-entity-anchor.textspan:hover,
.graph-entity-anchor.equation:hover,
.graph-entity-anchor.equationlabel:hover,
.graph-entity-anchor.textspan.active,
.graph-entity-anchor.equation.active,
.graph-entity-anchor.equationlabel.active {
  outline: 1px solid rgba(34, 197, 94, 0.5);
  outline-offset: 2px;
  border-bottom-color: #16a34a;
  background: transparent;
  box-shadow: none;
}

.graph-entity-anchor.graph-neighbor-visible {
  outline: 1px solid rgba(20, 184, 166, 0.56);
  outline-offset: 1px;
  border-color: #ffffff;
  background: #14b8a6;
  opacity: 1;
  box-shadow: none;
}

.graph-entity-anchor.thoughtstep.graph-neighbor-visible,
.graph-entity-anchor.documentgraphleaf.graph-neighbor-visible {
  border-color: #14b8a6;
  background: transparent;
}

.graph-entity-anchor.graph-neighbor-visible[data-graph-depth="2"] {
  outline: 1px dashed rgba(20, 184, 166, 0.46);
  background: transparent;
  opacity: 0.82;
}

.graph-entity-anchor span {
  display: none;
}

.graph-entity-anchor.inlinemathobject span.inline-math-dot {
  display: none;
}

.graph-entity-anchor.textspan span.textspan-anchor-dot,
.graph-entity-anchor.equation span.textspan-anchor-dot,
.graph-entity-anchor.equationlabel span.textspan-anchor-dot {
  display: block;
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 4px;
  height: 4px;
  border: 1px solid rgba(34, 197, 94, 0.78);
  border-radius: 50%;
  background: #22c55e;
  box-shadow: none;
}

.graph-entity-anchor.inlinemathobject.graph-neighbor-visible {
  outline: 1px solid rgba(20, 184, 166, 0.56);
  background: #14b8a6;
  box-shadow: none;
}

/* SP3: in-text citation anchors reuse the textspan underline + end-dot visual. */
.graph-entity-anchor.textspan.reference {
  z-index: 12;
  width: var(--textspan-anchor-width, 8%);
  min-width: 14px;
  height: 8px;
  border: 0;
  border-bottom: 1px solid rgba(34, 197, 94, 0.88);
  background: transparent;
}
.graph-entity-anchor.textspan.reference span.textspan-anchor-dot {
  display: block;
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 4px;
  height: 4px;
  border: 1px solid rgba(34, 197, 94, 0.78);
  border-radius: 50%;
  background: #22c55e;
}
.graph-entity-anchor.textspan.reference:hover,
.graph-entity-anchor.textspan.reference.active {
  outline: 1px solid rgba(34, 197, 94, 0.5);
  outline-offset: 2px;
  border-bottom-color: #16a34a;
}

.graph-entity-anchor.inlinemathobject.graph-neighbor-visible span.inline-math-dot {
  background: #14b8a6;
}

.graph-entity-anchor.textspan.graph-neighbor-visible,
.graph-entity-anchor.equation.graph-neighbor-visible,
.graph-entity-anchor.equationlabel.graph-neighbor-visible {
  outline: 1px solid rgba(20, 184, 166, 0.56);
  border-bottom-color: rgba(20, 184, 166, 0.9);
  background: transparent;
  box-shadow: none;
}

.graph-entity-anchor.textspan.graph-neighbor-visible span.textspan-anchor-dot,
.graph-entity-anchor.equation.graph-neighbor-visible span.textspan-anchor-dot,
.graph-entity-anchor.equationlabel.graph-neighbor-visible span.textspan-anchor-dot {
  background: #14b8a6;
}

.neo4j-neighbor-graph {
  position: fixed;
  inset: 0;
  z-index: 14;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}

.neo4j-neighbor-graph[hidden] {
  display: none;
}

.neo4j-neighbor-edge {
  fill: none;
  stroke-linecap: round;
  stroke-width: 1.2;
  opacity: 0.42;
  pointer-events: stroke;
  cursor: pointer;
  transition: opacity 0.15s ease, stroke-width 0.15s ease, filter 0.15s ease;
}

.neo4j-neighbor-edge:hover,
.neo4j-neighbor-edge.active {
  opacity: 0.95;
  stroke-width: 2.5;
  filter: drop-shadow(0 0 3px currentColor);
}

.documentgraph-neighbor-edge {
  fill: none;
  stroke-linecap: round;
  stroke-width: 1.1;
  opacity: 0.46;
  pointer-events: stroke;
  cursor: pointer;
}

.documentgraph-neighbor-edge[data-graph-depth="2"] {
  opacity: 0.28;
}

/*
 * Documentgraph edges whose target is a Concept node — same semantic
 * bucket as the gutter unified-tree's data-resolution-status="unresolved"
 * rule. Amber-warn stroke + tight dash so dangling-concept mentions read
 * distinctly from the resolved (typed) backbone of the neighborhood.
 */
.documentgraph-neighbor-edge[data-resolution-status="unresolved"] {
  stroke: rgba(240, 184, 76, 0.7);
  stroke-dasharray: 2 4;
  opacity: 0.55;
}

.documentgraph-neighbor-edge:hover,
.documentgraph-neighbor-edge.active {
  opacity: 0.88;
  stroke-width: 2.2;
}

.neo4j-neighbor-node {
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1.4;
  opacity: 0.62;
  pointer-events: all;
  cursor: pointer;
  transition: r 0.15s ease, opacity 0.15s ease, filter 0.15s ease;
}

.neo4j-neighbor-node:hover,
.neo4j-neighbor-node.active {
  opacity: 0.96;
  filter: drop-shadow(0 0 5px currentColor);
}

.neo4j-neighbor-node.expanded {
  fill: currentColor;
  opacity: 0.82;
  stroke-width: 1.2;
}

.neo4j-edge-tooltip {
  position: fixed;
  z-index: 21;
  max-width: min(280px, calc(100vw - 24px));
  padding: 7px 9px;
  border: 1px solid rgba(148, 163, 184, 0.5);
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.98);
  color: #e5e7eb;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
  font-size: 11px;
  line-height: 1.35;
  pointer-events: none;
}

.neo4j-edge-tooltip[hidden] {
  display: none;
}

.neo4j-edge-tooltip strong {
  display: block;
  margin-bottom: 3px;
  color: #ffffff;
  font-size: 12px;
}

.neo4j-edge-tooltip .edge-type {
  color: #a7f3d0;
}

.loading {
  padding: 24px;
  color: #cbd5e1;
}

/* Auto-on figure subgraph overlay: the focal figure's Figure->FigurePanel->FigureLeaf
   bbox anchors drawn hierarchically on the original. */
.figure-subgraph-box {
  position: absolute;
  pointer-events: none;
  box-sizing: border-box;
  border-radius: 2px;
}
.figure-subgraph-box.panel {
  border: 1.5px solid rgba(31, 111, 235, 0.85);
  background: rgba(31, 111, 235, 0.06);
  z-index: 3;
}
.figure-subgraph-box.leaf {
  border: 1px dashed rgba(180, 71, 29, 0.82);
  background: rgba(248, 113, 73, 0.05);
  z-index: 4;
}
/* v45 unified anchor-pair overlay: generic display-item segments are QUIET —
   hairline outline only, so the hierarchy reads without shouting over the page.
   (The tinted boxes above stay reserved for figure panel/leaf drill-ins.) */
.figure-subgraph-box.segment {
  border: 1px solid rgba(100, 116, 139, 0.28);
  background: transparent;
  z-index: 2;
}
.figure-subgraph-box.segment:hover {
  border-color: rgba(100, 116, 139, 0.55);
}
/* A paired segment routes to its replica on the RHS: clickable, with a small
   corner chip (a real child element — pseudo-element decorations are banned
   by the split-viewer contract) — teal when the pair is a verified replica
   edge, violet when it is display routing only (MIRRORED_IN_DIGITAL_TWIN /
   REPRODUCED_BY). */
.figure-subgraph-box.paired {
  pointer-events: auto;
  cursor: pointer;
}
.figure-subgraph-box .pair-chip {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(124, 58, 237, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.9);
  pointer-events: none;
}
.figure-subgraph-box.paired[data-pair-verified="true"] .pair-chip {
  background: rgba(13, 148, 136, 0.9);
}
/* Lazy drill-down: a box with children is clickable to zoom further down the tree. */
.figure-subgraph-box.expandable {
  pointer-events: auto;
  cursor: zoom-in;
}
.figure-subgraph-box.expandable:hover {
  background: rgba(31, 111, 235, 0.16);
}
.figure-subgraph-box.expanded {
  cursor: zoom-out;
  border-style: solid;
}

/* v44: anchor hover hit-targets + console-inject chip. Affordance via outline only. */
.anchor-hit-target {
  position: absolute;
  z-index: 1;
  background: transparent;
  pointer-events: auto;
}
.anchor-hit-target:hover {
  outline: 1px dashed rgba(37, 99, 235, 0.55);
  outline-offset: -1px;
}
.console-inject-chip {
  position: fixed;
  display: none;
  z-index: 60;
  padding: 2px 8px;
  font: 600 10px/1.5 ui-sans-serif, system-ui, sans-serif;
  color: #1e3a8a;
  background: #eff6ff;
  border: 1px solid #93c5fd;
  border-radius: 9px;
  cursor: pointer;
}
.console-inject-chip.visible {
  display: inline-block;
}

/* v15 ablation (owner 2026-06-12): 1,941 always-on entity dots were the
   dominant page noise. Same policy the doc-leaf markers already use: hidden
   while reading, revealed on page hover, focal/active always visible, and a
   toolbar toggle pins them on. Geometry is preserved (opacity, not display)
   so gutter/edge endpoints still resolve. */
body:not([data-entity-dots="on"]) .pdf-page:not(:hover) .graph-entity-anchor:not(.active):not(.graph-neighbor-visible) {
  opacity: 0;
  pointer-events: none;
}
#entity-dots-toggle {
  margin-left: 8px;
  padding: 1px 8px;
  border: 1px solid #3b4254;
  border-radius: 999px;
  background: transparent;
  color: #aab3c5;
  font-size: 11px;
  cursor: pointer;
}
body[data-entity-dots="on"] #entity-dots-toggle {
  border-color: rgba(34, 197, 94, 0.7);
  color: #4ade80;
}

/* 2026-06-26 declutter (supersedes v16 ablation round 2): the generic top-level
   segment hairlines are hover-scoped on EVERY page (.text-page is applied to all of
   them) so the pinned reading view shows only the figure panel/leaf hierarchy. Hover
   a page or toggle "overlays: pinned" (data-entity-dots="on") to reveal them all. */
body:not([data-entity-dots="on"]) .pdf-page:not(:hover) .figure-subgraph-box.top-level.text-page {
  opacity: 0;
  pointer-events: none;
}
