/* Open graph: geometry carries the relationships; labels stay at reading size. */
.page-shell:has(.mindmap-report) .page-heading { margin-bottom: 1rem; padding-bottom: 1rem; }
.page-shell:has(.mindmap-report) .page-heading h1 { font-size: clamp(2rem, 3vw, 2.8rem); }
.mindmap-report { --graph-ink:#203d43; --graph-line:#d9e2df; color:var(--graph-ink); }
.mindmap-report button, .mindmap-report input { font:inherit; }
.mindmap-report button { border:0; background:transparent; color:#315f60; padding:.45rem .65rem; cursor:pointer; border-radius:4px; min-height:40px; }
.mindmap-report button:hover { background:#eff5f2; }
.mindmap-report button:disabled { opacity:.4; cursor:default; }
.mindmap-report :focus-visible { outline:2px solid #337f9a; outline-offset:3px; }
.mindmap-report [hidden] { display:none!important; }
.graph-search-row { display:flex; align-items:end; gap:1rem; margin-bottom:.8rem; }
.graph-search { flex:1; min-width:0; position:relative; z-index:5; }
.graph-search label { display:block; font-size:1rem; margin-bottom:.35rem; }
.graph-search-field { display:flex; border-bottom:1px solid #7d9991; align-items:center; }
.graph-search-field input { border:0; padding:.65rem .1rem; background:#fff; flex:1; min-width:0; color:#203d43; font-size:1.05rem; }
#graph-clear { font-size:1.4rem; }
#graph-all { border:1px solid var(--graph-line); white-space:nowrap; }
#graph-results { list-style:none; position:absolute; top:100%; left:0; right:0; margin:0; padding:.4rem; background:#fff; border:1px solid var(--graph-line); box-shadow:0 8px 22px #233e4212; max-height:22rem; overflow:auto; }
#graph-results button { display:block; width:100%; text-align:left; }
#graph-results button[aria-selected=true] { background:#edf4f1; }
#graph-results span { display:block; font-size:1rem; color:#5d7072; overflow-wrap:anywhere; }
.graph-tools { display:flex; flex-wrap:wrap; align-items:center; gap:.15rem .35rem; border-bottom:1px solid var(--graph-line); padding-bottom:.5rem; position:sticky; top:0; background:#fff; z-index:4; }
.graph-scale { display:flex; align-items:center; border-right:1px solid var(--graph-line); padding-right:.45rem; }
.graph-wheel-control { display:flex; align-items:center; gap:.4rem; padding:.5rem; font-size:1rem; cursor:pointer; }
.graph-wheel-control input { accent-color:#367c78; width:16px; height:16px; }
.graph-scale button { font-size:1.4rem; min-width:38px; }
#graph-scale { width:3.5rem; text-align:center; font-size:1rem; color:#4e6769; }
.graph-types { display:flex; flex-wrap:wrap; gap:.55rem 1.05rem; padding:.9rem 0; font-size:1rem; }
.graph-types label { display:flex; gap:.4rem; align-items:center; cursor:pointer; }
.graph-types input { accent-color:var(--graph-color); width:16px; height:16px; }
.graph-layout { display:grid; grid-template-columns:minmax(0,1fr) 255px; gap:1.7rem; align-items:start; }
.graph-main { min-width:0; }
.graph-canvas { background:#fff; position:relative; height:clamp(520px,65vh,760px); touch-action:none; cursor:grab; overflow:hidden; scroll-margin-top:110px; }
.graph-canvas:focus-visible { outline:0; box-shadow:inset 0 -2px #79a6a3; }
.graph-canvas:active { cursor:grabbing; }
#mindmap-svg { width:100%; height:100%; display:block; overflow:hidden; }
.graph-edge { stroke:#829b9c; stroke-width:1; opacity:.25; pointer-events:none; }
.graph-edge.is-neighbor { opacity:.7; stroke-width:1.5; }
.graph-node { cursor:pointer; }
.graph-node .graph-dot { stroke:#fff; stroke-width:1.8; }
.graph-node .graph-hit { fill:transparent; stroke:none; }
.graph-node:focus-visible { outline:none; }
.graph-node:focus-visible .graph-dot { stroke:#173f56; stroke-width:3; }
.graph-node .graph-halo { fill:none; stroke-width:1.5; opacity:.7; }
.graph-label { font:500 18px var(--font-sans, sans-serif); fill:#29444a; paint-order:stroke; stroke:#fff; stroke-width:5px; stroke-linejoin:round; pointer-events:none; }
.graph-label.is-selected { font-weight:700; fill:#123b3c; }
#graph-empty { position:absolute; inset:40% 2rem auto; text-align:center; color:#5d7072; }
.graph-foot { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; border-top:1px solid var(--graph-line); padding-top:.75rem; font-size:1rem; color:#566c6d; }
.graph-foot label { display:flex; align-items:center; gap:.4rem; }
.graph-help { margin:.55rem 0 1rem; font-size:1rem; color:#627577; }
.graph-detail { border-left:1px solid var(--graph-line); padding-left:1.4rem; }
.graph-detail-kind { color:#5b7775; font-size:1rem; margin:0 0 .65rem; }
.graph-detail h2 { font:500 1.65rem/1.25 var(--font-display,Georgia,serif); color:#203d43; margin:.3rem 0 .8rem; overflow-wrap:anywhere; }
.graph-detail p { font-size:1rem; line-height:1.65; overflow-wrap:anywhere; }
#graph-detail-link { display:block; border-bottom:1px solid var(--graph-line); padding:.6rem 0 1.2rem; font-size:1rem; }
#graph-molecular-link { display:block; padding:.7rem 0; font-size:1rem; }
#graph-status { min-height:1.65em; font-size:1rem; overflow-wrap:anywhere; }
#graph-related h3 { font-size:1.1rem; margin:1.4rem 0 .7rem; }
#graph-related label { display:block; font-size:1rem; margin-bottom:.5rem; }
#graph-neighbor-search { width:100%; padding:.5rem; border:1px solid var(--graph-line); }
#graph-neighbors { list-style:none; padding:0; margin:.6rem 0; }
#graph-neighbors button { display:block; width:100%; text-align:left; border-bottom:1px solid #edf0ef; font-size:1rem; line-height:1.4; overflow-wrap:anywhere; }
#graph-neighbors span { display:block; color:#637574; font-size:1rem; margin-top:.2rem; }
.graph-outline { margin-top:1rem; border-block:1px solid var(--graph-line); padding:1rem 0; }
.graph-outline>ul { columns:3; padding-left:1.2rem; }
.graph-outline li { margin:.55rem 0; break-inside:avoid; }
.graph-sr-only { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
@media(max-width:1060px) { .graph-layout { grid-template-columns:1fr; } .graph-detail { border-left:0; border-top:1px solid var(--graph-line); padding:1.1rem 0 0; } .graph-detail h2 { max-width:50ch; } }
@media(max-width:620px) { .graph-canvas { height:560px; } .graph-search-row { gap:.35rem; } .graph-types { gap:.55rem .85rem; } .graph-outline>ul { columns:2; } .graph-tools { gap:0; } .graph-tools button { padding-inline:.5rem; } }
@media print { .graph-search-row,.graph-tools,.graph-types,.graph-foot label,.graph-help,#graph-related { display:none; } .graph-canvas { height:650px; } .graph-detail { border:0; } }