.left-panel { overflow: auto; }
.trace-section { padding-bottom: 18px; }
.trace-detail { margin: 9px 0 10px; color: var(--subtle); font-size: 10px; line-height: 1.42; }
.trace-list { display: grid; gap: 5px; }
.trace-button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 32px; border: 1px solid var(--line); border-radius: 7px; padding: 6px 8px; color: var(--muted); background: rgba(255,255,255,.02); font-size: 10px; font-weight: 750; text-align: left; }
.trace-button::after { content: "↗"; color: var(--subtle); font-size: 12px; }
.trace-button:hover, .trace-button.is-active { border-color: rgba(230, 160, 76, .68); color: var(--text); background: rgba(230, 160, 76, .08); }
.trace-button.is-active::after { color: var(--amber); }
.clear-trace, .copy-source { border: 1px solid var(--line); border-radius: 6px; padding: 4px 7px; color: var(--muted); background: transparent; font-size: 10px; font-weight: 750; }
.clear-trace:hover, .copy-source:hover { color: var(--text); border-color: rgba(230, 160, 76, .65); }
.map-edges path.is-trace { stroke: var(--amber); stroke-width: 2.25; opacity: 1; }
.map-edges path.is-trace-muted { opacity: .045; }
.map-edges path.is-related:not(.is-trace) { stroke: var(--amber); }
.map-edge-label { fill: #f2c178; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .02em; paint-order: stroke; stroke: #101914; stroke-linejoin: round; stroke-width: 4px; }
.map-node.is-trace-muted { opacity: .28; }
.map-node.is-in-trace { opacity: 1; border-color: rgba(230, 160, 76, .7); }
.panel-resizer { position: absolute; z-index: 8; top: 0; bottom: 0; width: 12px; border: 0; background: transparent; cursor: col-resize; touch-action: none; }
.panel-resizer::before { position: absolute; top: 0; bottom: 0; left: 5px; width: 1px; background: transparent; content: ""; transition: background .14s ease, box-shadow .14s ease; }
.panel-resizer:hover::before, .panel-resizer:focus-visible::before, .panel-resizer.is-active::before { background: var(--amber); box-shadow: 0 0 0 2px rgba(230, 160, 76, .16); }
.panel-resizer:focus-visible { outline: none; }
.panel-resizer-left { left: calc(var(--left-panel-width) - 6px); }
.panel-resizer-right { right: calc(var(--right-panel-width) - 6px); }
body.is-resizing-panel, body.is-resizing-panel * { cursor: col-resize !important; user-select: none !important; }
.inspector { overflow: auto; }
.inspector-card h2 { margin-bottom: 17px; }
.inspector-section { padding: 13px 0; border-top: 1px solid var(--line); }
.inspector-section h3 { margin: 0 0 7px; color: var(--subtle); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.inspector-section p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.46; }
.relationship-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.relationship-list li { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; color: #e1ede3; font-size: 11px; line-height: 1.3; }
.relationship-list em { flex: 0 0 auto; color: var(--amber); font-size: 9px; font-style: normal; text-align: right; }
.connection-list li { align-items: flex-start; }
.connection-list b { display: block; margin-bottom: 2px; color: var(--subtle); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.copy-source { margin-top: 9px; }
.evidence-section { background: rgba(120, 182, 229, .035); }
@media (max-width: 1450px) { .app-layout { grid-template-columns: 224px minmax(0, 1fr); } .inspector { grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; overflow: visible; } .panel-resizer-right { display: none; } .inspector-empty { min-height: 110px; } .inspector-card { max-width: 600px; } .map-viewport { min-height: 620px; } .left-panel { overflow: visible; } }
@media (max-width: 720px) { .trace-section { grid-column: 1 / -1; } .trace-list { grid-template-columns: 1fr 1fr; } }