.nav-subitem{margin:-4px 0 2px 38px;padding:10px 12px;border:0;border-radius:12px;background:transparent;color:var(--muted);font-size:13px;font-weight:700;text-align:left;cursor:pointer}.nav-subitem:hover,.nav-subitem.is-active{background:var(--panel2);color:var(--ink)}
.app-shell:has(.graph-page){height:100vh;overflow:hidden}.app-shell:has(.graph-page) .sidebar{height:100vh;overflow:auto}.app-shell:has(.graph-page) .content-shell{height:100vh;min-height:0;overflow:hidden;display:flex;flex-direction:column}.app-shell:has(.graph-page) .topbar{flex:0 0 auto}.app-shell:has(.graph-page) .graph-page{flex:1;min-height:0}.graph-page+.footer-line{display:none}
.graph-page{padding:30px;display:flex;flex-direction:column;overflow:hidden}.graph-header{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:18px;flex:0 0 auto}.graph-summary{display:grid;grid-template-columns:auto auto;gap:2px 10px;align-items:baseline;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--panel2)}.graph-summary strong{font-size:22px;letter-spacing:-.04em}.graph-summary span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.graph-controls{display:grid;grid-template-columns:minmax(220px,1fr) auto auto auto;gap:10px;margin-bottom:14px;flex:0 0 auto}.graph-controls input,.graph-controls select,.graph-controls button{height:44px;border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:0 14px;outline:none}.graph-controls button{font-weight:750;cursor:pointer}.graph-search{position:relative}.graph-search span{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted)}.graph-search input{width:100%;padding-left:38px}
.graph-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;flex:1;min-height:0;height:100%}.graph-stage{position:relative;height:100%;min-height:0;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle at 50% 45%,#fff 0,#f8f8f7 55%,#f1f1ef 100%)}#graphCanvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none}.graph-help{position:absolute;left:14px;bottom:13px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid var(--line);font-size:11px;color:var(--muted);pointer-events:none}.graph-legend{position:absolute;top:12px;left:12px;right:12px;display:flex;flex-wrap:wrap;gap:7px;pointer-events:none}.graph-legend span{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.9);font-size:10px;color:var(--muted)}.graph-legend i{width:7px;height:7px;border-radius:999px}.graph-detail{height:100%;min-height:0;overflow:auto;border:1px solid var(--line);border-radius:22px;background:var(--panel)}.graph-detail-empty{min-height:100%;display:grid;place-content:center;text-align:center;padding:30px;color:var(--muted)}.graph-detail-empty span{font-size:28px}.graph-detail-empty h3{margin:12px 0 6px;color:var(--ink)}.graph-detail-empty p{margin:0;line-height:1.5}.graph-detail-content{padding:18px}.graph-detail-image{width:100%;height:160px;object-fit:cover;border-radius:17px;background:var(--panel2);margin-bottom:16px}.graph-detail-cluster{margin:0 0 6px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.11em;font-weight:800}.graph-detail-content h2{margin:0 0 10px;font-size:30px;letter-spacing:-.06em}.graph-detail-description{margin:0;color:var(--muted);line-height:1.55}.graph-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0}.graph-meta div{padding:11px;border:1px solid var(--line);border-radius:13px;background:var(--panel2)}.graph-meta dt{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.graph-meta dd{margin:4px 0 0;font-size:13px;font-weight:750;word-break:break-word}.graph-tags h4,.connections-title{margin:15px 0 7px;font-size:12px;text-transform:uppercase;letter-spacing:.09em}.graph-tags p{display:flex;flex-wrap:wrap;gap:6px;margin:0}.graph-tags span{padding:6px 8px;border-radius:999px;background:var(--panel2);font-size:11px}.graph-open-core{display:flex;justify-content:space-between;margin:18px 0 8px;padding:12px 14px;border-radius:14px;background:var(--ink);color:#fff;text-decoration:none;font-weight:750}.connection-list{display:grid;gap:7px}.connection-row{display:grid;grid-template-columns:8px 1fr auto;gap:10px;align-items:center;width:100%;padding:10px;border:1px solid var(--line);border-radius:13px;background:var(--panel);text-align:left;cursor:pointer}.connection-row:hover{background:var(--panel2)}.connection-row i{width:8px;height:8px;border-radius:50%}.connection-row span{display:grid;gap:2px}.connection-row b{font-size:12px}.connection-row small{font-size:10px;color:var(--muted)}.connection-row em{font-style:normal;color:var(--muted)}
@media(max-width:1180px){.app-shell:has(.graph-page){height:auto;min-height:100vh;overflow:visible}.app-shell:has(.graph-page) .sidebar{height:auto}.app-shell:has(.graph-page) .content-shell{height:auto;overflow:visible;display:block}.app-shell:has(.graph-page) .graph-page{display:block;overflow:visible}.graph-page+.footer-line{display:flex}.graph-layout{grid-template-columns:1fr;height:auto}.graph-detail{height:auto;max-height:none}.graph-stage{height:620px}.graph-controls{grid-template-columns:1fr 1fr}.graph-controls .graph-search{grid-column:1/-1}}
@media(max-width:700px){.graph-page{padding:20px 14px}.graph-header{display:grid}.graph-summary{justify-self:start}.graph-controls{grid-template-columns:1fr}.graph-controls .graph-search{grid-column:auto}.graph-stage{height:560px}.graph-legend{display:none}.graph-help{font-size:9px}}