.object-graph-section{margin:18px 0 8px}
.object-graph-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 8px}
.object-graph-label .title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#6b7280)}
.object-graph-label .hint,.object-graph-label a{font-size:12px;color:var(--muted,#6b7280)}
.object-graph-search{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.object-graph-search label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#6b7280)}
.object-graph-search input{min-width:15rem;max-width:28rem;flex:1;padding:7px 10px;border:1px solid var(--line,#e7e5e1);border-radius:7px;background:var(--panel,#fff);color:var(--ink,#1c2027);font:12px var(--mono,ui-monospace,monospace)}
.object-graph-search input:focus{border-color:var(--accent,#0ea5b7);outline:2px solid color-mix(in srgb,var(--accent,#0ea5b7) 25%,transparent);outline-offset:1px}
.object-graph-search input:disabled{cursor:wait;opacity:.6}
.object-graph-search output{margin-left:auto;white-space:nowrap;text-align:right;font:12px var(--mono,ui-monospace,monospace);color:var(--muted,#6b7280)}
.object-graph-frame{position:relative;margin:0 0 16px}
.object-graph{display:block;overflow:hidden;width:100%;height:78vh;border:1px solid var(--line,#e7e5e1);border-radius:8px;margin:0;background:var(--panel,#fff);padding:10px;position:relative;min-height:20rem}
.object-graph svg{width:100%!important;height:100%!important;max-width:100%;display:block}
.object-graph:hover{border-color:var(--accent,#0ea5b7);box-shadow:0 0 0 1px var(--accent,#0ea5b7)}
.object-graph:focus-visible{outline:2px solid var(--accent,#0ea5b7);outline-offset:2px}
.object-graph::after{content:"";position:absolute;left:10px;bottom:8px;font-size:14px;line-height:1;color:var(--muted,#6b7280);opacity:.75;pointer-events:none}
.object-graph-zoom{position:absolute;right:10px;bottom:10px;z-index:1;display:flex;gap:6px}
.object-graph-zoom button{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid var(--line,#e7e5e1);border-radius:7px;background:color-mix(in srgb,var(--panel,#fff) 92%,transparent);color:var(--ink,#1c2027);cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.object-graph-zoom button:hover:not(:disabled){border-color:var(--accent,#0ea5b7);color:var(--accent,#0ea5b7)}
.object-graph-zoom button:focus-visible{outline:2px solid var(--accent,#0ea5b7);outline-offset:2px}
.object-graph-zoom button:disabled{cursor:wait;opacity:.5}
.object-graph-zoom svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.object-graph-frame:fullscreen{background:var(--bg,#fff);padding:12px}
.object-graph-frame:fullscreen .object-graph{height:100%!important;min-height:0;border-radius:0}
#object-graph-fullscreen .icon-exit{display:none}
#object-graph-fullscreen.is-active .icon-enter{display:none}
#object-graph-fullscreen.is-active .icon-exit{display:block}
.object-graph g.node{cursor:pointer}
.object-graph.is-focused{cursor:grab;touch-action:none;user-select:none}
.object-graph.is-dragging{cursor:grabbing}
.object-graph.is-focused::after{content:"↺"}
.object-graph:hover::after{color:var(--accent,#0ea5b7);opacity:1}
.object-graph-status{font-size:12px;color:var(--muted,#6b7280);margin:0;padding:12px 4px}
.object-graph .node,.object-graph .edge{transition:opacity .15s ease}
.object-graph .node.is-dimmed{opacity:.22}
.object-graph .edge.is-dimmed{opacity:.12}
.object-graph .node.is-match polygon,.object-graph .node.is-match ellipse,.object-graph .node.is-match path{stroke:var(--accent,#0ea5b7);stroke-width:3}
#view .is-search-hidden{display:none!important}
@media (max-width:600px){.object-graph-label{align-items:flex-start;flex-direction:column;gap:3px}.object-graph-search{align-items:stretch;flex-wrap:wrap}.object-graph-search label{width:100%}.object-graph-search input{min-width:0;width:100%}.object-graph-search output{width:100%;white-space:normal;text-align:left}.object-graph{height:60vh;min-height:18rem}}
