.graph-root,.graph-state,.graph-loading{--graph-paper:#eaf0f6;--graph-ink:oklch(18% .024 75);--graph-muted:oklch(47% .035 70);--graph-accent:#739fb5;--graph-controls-bottom-offset:76px;--graph-mono:"SF Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;width:100%;height:100%;color:var(--graph-ink);background:var(--background);font-family:var(--graph-mono);position:relative;overflow:hidden}.graph-state{background:var(--graph-paper)}.graph-map{contain:strict;position:absolute;inset:0;overflow:hidden}.graph-map:before{z-index:0;background:radial-gradient(circle at 20% 0%, color-mix(in oklch, var(--graph-background-accent,var(--graph-accent)), transparent 82%), transparent 31%), linear-gradient(135deg, color-mix(in oklch, var(--graph-paper), white 6%), var(--graph-paper) 62%);content:"";opacity:var(--graph-background-opacity,1);pointer-events:none;position:absolute;inset:0}.graph-map__canvas{z-index:1;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;position:relative}.graph-map__canvas:active{cursor:grabbing}.graph-map__canvas:focus-visible{outline:2px solid var(--graph-accent);outline-offset:-4px}.graph-map__performance{z-index:3;border:1px solid color-mix(in oklch, var(--graph-ink), transparent 82%);min-width:224px;color:var(--graph-ink);background:color-mix(in oklch, var(--background,white), transparent 8%);box-shadow:0 8px 24px color-mix(in oklch, var(--graph-ink), transparent 90%);font-variant-numeric:tabular-nums;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:12px 14px;font-size:10px;line-height:1.45;position:absolute;top:16px;left:16px}.graph-map__performance strong{letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px;font-size:10px;display:block}.graph-map__performance dl{gap:3px;margin:0;display:grid}.graph-map__performance dl>div{grid-template-columns:minmax(0,1fr) auto;gap:16px;display:grid}.graph-map__performance dt{color:var(--graph-muted)}.graph-map__performance dd{margin:0;font-weight:600}.graph-map__controls{z-index:2;bottom:var(--graph-controls-bottom-offset);transform:translateX(calc(-1 * var(--graph-camera-right-inset,0px)));flex-direction:column;gap:8px;transition:transform .2s cubic-bezier(.22,1,.36,1);display:flex;position:absolute;right:18px}.graph-map__controls>button{border:1px solid color-mix(in oklch, var(--graph-ink), transparent 84%);width:40px;height:40px;color:var(--graph-ink);background:color-mix(in oklch, var(--background,white), white 12%);box-shadow:0 2px 8px color-mix(in oklch, var(--graph-ink), transparent 92%);cursor:pointer;border-radius:999px;place-items:center;transition:border-color .15s,background-color .15s,transform .15s;display:grid}.graph-map__controls>button:hover{border-color:color-mix(in oklch, var(--graph-accent), black 8%);background:color-mix(in oklch, var(--background,white), var(--graph-accent) 8%);transform:translateY(-1px)}.graph-map__controls>button[data-active=true]{border-color:var(--graph-accent);color:var(--graph-accent);background:color-mix(in oklch, var(--background,white), var(--graph-accent) 14%)}.graph-map__controls>button:active{transform:scale(.96)}.graph-map__controls>button svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75px;width:18px;height:18px}.graph-map__controls>button:focus-visible{outline:2px solid var(--graph-accent);outline-offset:2px}.graph-state{color:var(--graph-muted);text-align:center;background:radial-gradient(circle at 20% 0%, color-mix(in oklch, var(--graph-accent), transparent 82%), transparent 31%), var(--graph-paper);flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex}.graph-loading{width:100%;height:100%;color:var(--graph-ink);background:var(--background,white);font-family:var(--graph-mono);place-items:center;display:grid;position:relative;overflow:hidden}.graph-loading:before{background:radial-gradient(circle at 20% 0%, color-mix(in oklch, var(--graph-accent), transparent 82%), transparent 31%), linear-gradient(135deg, color-mix(in oklch, var(--graph-paper), white 6%), var(--graph-paper) 62%);content:"";opacity:.5;position:absolute;inset:0}.graph-loading__content{color:var(--graph-muted);letter-spacing:.01em;flex-direction:column;align-items:center;gap:12px;font-size:12px;display:flex;position:relative}.graph-loading__indicator{border:1px solid color-mix(in oklch, var(--graph-ink), transparent 86%);background:color-mix(in oklch, var(--background,white), white 12%);width:42px;height:42px;box-shadow:0 2px 8px color-mix(in oklch, var(--graph-ink), transparent 92%);border-radius:999px;place-items:center;display:grid;position:relative}.graph-loading__indicator:before,.graph-loading__indicator:after,.graph-loading__indicator>span{background:var(--graph-accent);content:"";border-radius:999px;width:5px;height:5px;animation:1.2s ease-in-out infinite graph-loading-pulse;position:absolute}.graph-loading__indicator:before{transform:translate(-9px)}.graph-loading__indicator>span{animation-delay:.15s}.graph-loading__indicator:after{animation-delay:.3s;transform:translate(9px)}.graph-loading__progress{color:var(--graph-muted);font-variant-numeric:tabular-nums;grid-template-columns:minmax(0,220px) 32px;align-items:center;gap:10px;margin-top:2px;font-size:10px;display:grid}.graph-loading__progress progress{appearance:none;background:color-mix(in oklch, var(--graph-accent), transparent 84%);border:0;border-radius:999px;width:220px;height:5px;overflow:hidden}.graph-loading__progress progress::-webkit-progress-bar{background:color-mix(in oklch, var(--graph-accent), transparent 84%);border-radius:999px}.graph-loading__progress progress::-webkit-progress-value{background:var(--graph-accent);border-radius:999px;transition:width .24s}.graph-loading__progress progress::-moz-progress-bar{background:var(--graph-accent);border-radius:999px}@keyframes graph-loading-pulse{0%,to{opacity:.35;scale:.8}50%{opacity:1;scale:1}}.graph-state__title{color:var(--graph-ink);font-weight:700}.graph-state__icon{border:1px solid color-mix(in oklch, var(--graph-ink), transparent 86%);background:color-mix(in oklch, var(--graph-paper), white 28%);border-radius:50%;place-items:center;width:56px;height:56px;display:grid}.graph-details-sheet{border-color:var(--border);width:min(94vw,32rem);max-width:none;color:var(--foreground);background:color-mix(in oklch, var(--background), var(--muted) 22%);box-shadow:-18px 0 54px color-mix(in oklch, var(--foreground), transparent 90%);font-family:inherit}.graph-details-sheet__scroll{overscroll-behavior:contain;scrollbar-gutter:stable;flex:1;min-height:0;padding:52px 20px 48px;overflow-y:auto}.graph-detail{gap:26px;display:grid}.graph-detail-state{border:1px dashed var(--border);min-height:84px;color:var(--muted-foreground);text-align:center;border-radius:18px;justify-content:center;align-items:center;gap:8px;font-size:12px;display:flex}.graph-detail__memory{border:1px solid color-mix(in oklch, var(--border), var(--foreground) 4%);color:var(--card-foreground);background:var(--card);box-shadow:0 8px 32px color-mix(in oklch, var(--foreground), transparent 95%);border-radius:22px;gap:14px;padding:22px;display:grid}.graph-detail__kind{width:fit-content;color:var(--primary);background:color-mix(in oklch, var(--primary), transparent 91%);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;align-items:center;gap:6px;padding:5px 8px;font-size:10px;font-weight:650;display:inline-flex}.graph-detail__kind svg{width:13px;height:13px}.graph-detail__memory h2{max-width:22ch;color:var(--foreground);font-family:var(--font-heading);letter-spacing:-.035em;margin:0;font-size:clamp(1.35rem,1.1rem + .8vw,1.75rem);font-weight:550;line-height:1.08}.graph-detail__memory p{color:color-mix(in oklch, var(--foreground), var(--muted-foreground) 28%);margin:0;font-size:13px;line-height:1.65}.graph-detail__labels{flex-wrap:wrap;gap:6px;padding-top:2px;display:flex}.graph-detail__labels>span{border:1px solid var(--border);color:var(--muted-foreground);background:color-mix(in oklch, var(--muted), transparent 32%);border-radius:999px;align-items:center;gap:5px;padding:5px 8px;font-size:10px;line-height:1;display:inline-flex}.graph-detail__labels svg{width:11px;height:11px}.graph-detail__section{gap:12px;display:grid}.graph-detail__section-heading{grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding-inline:2px;display:grid}.graph-detail__section-heading h3{color:var(--foreground);letter-spacing:-.01em;margin:0;font-size:12px;font-weight:650}.graph-detail__section-icon{width:25px;height:25px;color:var(--primary);background:color-mix(in oklch, var(--primary), transparent 92%);border-radius:8px;place-items:center;display:grid}.graph-detail__section-icon svg{width:13px;height:13px}.graph-detail__section-count{border:1px solid var(--border);min-width:22px;height:22px;color:var(--muted-foreground);border-radius:999px;place-items:center;font-size:10px;display:grid}.graph-detail__entity-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.graph-detail__entity-card{border:1px solid var(--border);min-width:0;color:inherit;background:var(--card);font:inherit;text-align:left;cursor:pointer;border-radius:16px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;padding:12px;transition:border-color .14s ease-out,transform .14s ease-out;display:grid}.graph-detail__entity-card:hover{border-color:color-mix(in oklch, var(--primary), var(--border) 55%);transform:translateY(-1px)}.graph-detail__entity-card:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.graph-detail__entity-dot{background:var(--primary);width:10px;height:10px;box-shadow:0 0 0 5px color-mix(in oklch, var(--primary), transparent 89%);border-radius:50%}.graph-detail__entity-card>div{gap:4px;min-width:0;display:grid}.graph-detail__entity-card strong{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;overflow:hidden}.graph-detail__entity-card div>span{color:var(--muted-foreground);text-transform:capitalize;align-items:center;gap:4px;font-size:9px;display:flex}.graph-detail__entity-card svg{width:9px;height:9px}.graph-detail__connection-list,.graph-detail__link-list{gap:8px;display:grid}.graph-detail__connection{border:1px solid var(--border);width:100%;color:var(--foreground);background:var(--card);text-align:left;cursor:pointer;border-radius:17px;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:14px;transition:border-color .14s ease-out,transform .14s ease-out;display:grid}.graph-detail__connection:hover{border-color:color-mix(in oklch, var(--primary), var(--border) 55%);transform:translateY(-1px)}.graph-detail__connection:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.graph-detail__connection-kind{width:fit-content;color:var(--muted-foreground);letter-spacing:.05em;text-transform:uppercase;align-items:center;gap:5px;font-size:9px;font-weight:600;display:inline-flex}.graph-detail__connection-kind svg{width:11px;height:11px}.graph-detail__connection strong{grid-column:1/-1;font-size:12px;font-weight:560;line-height:1.45;overflow:hidden}.graph-detail__connection-meta{color:var(--muted-foreground);grid-column:1/-1;align-items:center;gap:4px;font-size:9px;display:inline-flex}.graph-detail__connection-meta svg{width:10px;height:10px}.graph-detail__load-more{border-radius:14px;width:100%}.graph-detail__link{border:1px solid var(--border);background:var(--card);border-radius:16px;padding:13px 14px}.graph-detail__link>span{color:var(--muted-foreground);letter-spacing:.05em;text-transform:uppercase;font-size:9px;font-weight:600}.graph-detail__link p{color:var(--foreground);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;margin:7px 0 0;font-size:10px;line-height:1.4;display:grid}.graph-detail__link svg{width:11px;height:11px;color:var(--muted-foreground)}@media (width<=640px){.graph-root,.graph-state,.graph-loading{--graph-controls-bottom-offset:72px}.graph-map__controls{right:12px}.graph-details-sheet__scroll{padding-inline:16px}.graph-detail__entity-grid{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.graph-loading__indicator:before,.graph-loading__indicator:after,.graph-loading__indicator>span{animation:none}.graph-detail__connection{transition:none}}
