/* pWhois Maps · graph renderer (PWMaps.graph) — nightwire tokens only.
   Node / edge paint comes from the style object as inline attributes (so getSVG() exports faithfully);
   this file only carries interaction states, motion and the legend / hover card chrome. */

.pwm-graph{display:block;width:100%;height:100%;min-height:420px;background:var(--bg,#08070d);
  cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;outline:none}
.pwm-graph:active{cursor:grabbing}
.pwm-graph.pwm-layout-busy{cursor:progress}
.pwm-graph .pwm-node{cursor:pointer;transition:opacity .18s ease}
.pwm-graph .pwm-node:focus{outline:none}
.pwm-graph .pwm-node:focus-visible .pwm-glyph{filter:drop-shadow(0 0 5px var(--purple-hi,#b6aaff))}
.pwm-graph .pwm-label,.pwm-graph .pwm-lab{pointer-events:none}
/* label declutter (screen-space pass): first line only, or hidden until hover / focus */
/* label placement levels: ASN + org (core), first line only, or hidden until hover / focus */
.pwm-graph .pwm-node.lab-core .pwm-x,.pwm-graph .pwm-node.lab-l1 .pwm-sub,.pwm-graph .pwm-node.lab-none .pwm-lab{display:none}
.pwm-graph .pwm-node.is-focus .pwm-lab,.pwm-graph .pwm-node.is-focus .pwm-sub,
.pwm-graph .pwm-node:hover .pwm-lab,.pwm-graph .pwm-node:hover .pwm-sub,
.pwm-graph .pwm-node.is-focus .pwm-x,.pwm-graph .pwm-node:hover .pwm-x{display:inline}
.pwm-graph .pwm-lead{pointer-events:none}
/* radial / layered: clustered satellites hide their own edges; one leader line per cluster */
.pwm-graph .pwm-edge.is-clustered{display:none}
.pwm-graph .pwm-leader{pointer-events:none;transition:opacity .18s ease}
/* collector peers (edge kind 'peer'): a compact, muted group */
.pwm-graph .pwm-node.is-collector .pwm-glyph{opacity:.72}
/* single-family edge tags ("v4" / "v6" pill at the edge midpoint) */
.pwm-graph .pwm-etag{pointer-events:none;transition:opacity .18s ease}
/* Flow rank bands (behind the edges) */
.pwm-graph .pwm-band{pointer-events:none}
.pwm-graph .pwm-band-h text{text-transform:uppercase}
.pwm-graph .pwm-edge{transition:opacity .18s ease}
.pwm-graph .pwm-flow{pointer-events:none;animation:pwm-flow 1.3s linear infinite;transition:opacity .18s ease}

/* hover: incident paths glow, everything else dims */
.pwm-graph .is-dim{opacity:.12}
.pwm-graph .pwm-edge.is-lit{filter:drop-shadow(0 0 3px currentColor)}
.pwm-graph .pwm-node.is-focus .pwm-glyph,
.pwm-graph .pwm-node.is-lit .pwm-glyph{filter:drop-shadow(0 0 6px currentColor)}
.pwm-graph .pwm-node:hover .pwm-body{stroke-width:2.2}
.pwm-graph .pwm-selring{animation:pwm-rot 9s linear infinite}

/* busy node: ripple + ring spinner + three orbiting dots */
.pwm-graph .pwm-busy{pointer-events:none}
.pwm-graph .pwm-ripple{animation:pwm-ripple 1.6s cubic-bezier(.2,.6,.3,1) infinite}
.pwm-graph .pwm-ripple2{animation-delay:.8s}
.pwm-graph .pwm-spin{animation:pwm-rot 1.1s linear infinite}
.pwm-graph .pwm-orbit{animation:pwm-rot 1.8s linear infinite}

/* bloom-in for nodes merged from an expansion (delay set per node via --pwm-delay) */
.pwm-graph .pwm-bloom>.pwm-glyph{animation:pwm-bloom .75s cubic-bezier(.2,1.45,.4,1) both;animation-delay:var(--pwm-delay,0ms)}
/* the label group carries its own (counter-scale) transform, so it only fades */
.pwm-graph .pwm-bloom>.pwm-lab{animation:pwm-fade .75s ease both;animation-delay:var(--pwm-delay,0ms)}
.pwm-graph .pwm-fadein{animation:pwm-fade .6s ease both}

@keyframes pwm-flow{to{stroke-dashoffset:-20}}
@keyframes pwm-rot{to{transform:rotate(360deg)}}
@keyframes pwm-ripple{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.3);opacity:0}}
@keyframes pwm-bloom{0%{transform:scale(0);opacity:0}55%{opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes pwm-fade{from{opacity:0}}

/* export snapshot: computed styles must be final values */
.pwm-graph.pwm-exporting,.pwm-graph.pwm-exporting *{transition:none!important;animation:none!important}

/* reduced motion: instant states, spinners stay but do not spin */
@media (prefers-reduced-motion:reduce){
  .pwm-graph,.pwm-graph *,.pwm-hover,.pwm-lg *,.pwm-zoomctl{transition:none!important;animation:none!important}
  .pwm-graph .pwm-ripple2,.pwm-graph .pwm-flow{display:none}
}
html.reduced-motion .pwm-graph,html.reduced-motion .pwm-graph *,
html.reduced-motion .pwm-hover,html.reduced-motion .pwm-lg *{transition:none!important;animation:none!important}
html.reduced-motion .pwm-graph .pwm-ripple2,html.reduced-motion .pwm-graph .pwm-flow{display:none}

/* hover card */
.pwm-hover{position:fixed;left:0;top:0;z-index:60;pointer-events:none;max-width:min(420px,calc(100vw - 16px));
  padding:8px 11px;background:rgba(23,20,48,.96);border:1px solid var(--line2,rgba(148,135,216,.34));border-radius:var(--r,6px);
  box-shadow:0 10px 30px rgba(8,7,13,.55),0 0 0 1px rgba(8,7,13,.4);font:11.5px/1.5 var(--pwm-font,'Nunito Sans',system-ui,sans-serif);
  color:var(--txt,#e7e3f7);opacity:0;transform:translateY(3px);transition:opacity .12s ease,transform .12s ease;visibility:hidden}
.pwm-hover.is-on{opacity:1;transform:none;visibility:visible}
.pwm-hover-row{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwm-hover-k{color:var(--purple-hi,#b6aaff)}
.pwm-hover-v{color:var(--txt,#e7e3f7)}
.pwm-hover.is-brief .pwm-hover-row:first-child .pwm-hover-v{color:var(--teal,#4fd8c0);font-weight:600}

/* on-canvas zoom controls (bottom-right): Fit · + · − · 1:1 */
.pwm-zoomctl{position:absolute;right:12px;bottom:12px;z-index:8;display:flex;gap:4px;padding:4px;border-radius:var(--r,6px);
  background:rgba(18,16,29,.88);border:1px solid var(--line2,rgba(148,135,216,.34));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 14px 30px -18px rgba(8,7,13,.9);transition:right .26s cubic-bezier(.2,.8,.2,1),bottom .26s cubic-bezier(.2,.8,.2,1)}
.pwm-zc{min-width:30px;height:28px;padding:0 8px;border-radius:4px;border:1px solid var(--line,rgba(148,135,216,.18));background:none;cursor:pointer;
  font:600 12px/1 var(--mono,'JetBrains Mono',ui-monospace,monospace);color:var(--txt2,#cfc9ea);transition:border-color .15s,background .15s,color .15s}
.pwm-zc-in,.pwm-zc-out{font-size:15px;font-weight:400}
.pwm-zc:hover{border-color:var(--purple,#9487d8);color:var(--purple-hi,#b6aaff);background:rgba(148,135,216,.1)}
.pwm-zc:focus-visible{outline:2px solid var(--purple-hi,#b6aaff);outline-offset:1px}
.pwm-zc-fit{color:var(--teal,#4fd8c0);letter-spacing:.06em}
.pwm-canvaswrap:has(.pwm-drawer.open) .pwm-zoomctl{right:calc(min(380px,100%) + 12px)}
@media(max-width:760px){.pwm-canvaswrap:has(.pwm-drawer.open) .pwm-zoomctl{right:12px;bottom:calc(68% + 12px)}}

/* light map styles (Paper): overlays take the style's own background and text (vars set by the renderer) */
.pwm-light .pwm-lg,.pwm-light .pwm-zoomctl,.pwm-hover.pwm-light{background:var(--pwm-ov-bg);border-color:var(--pwm-ov-line);color:var(--pwm-ov-txt);
  box-shadow:0 10px 26px -14px rgba(36,29,80,.35)}
.pwm-light .pwm-lg>summary,.pwm-light .pwm-lg-btn,.pwm-light .pwm-zc-fit,.pwm-hover.pwm-light .pwm-hover-k{color:var(--pwm-ov-acc2)}
.pwm-light .pwm-lg-h,.pwm-light .pwm-lg-kv .pwm-lg-k,.pwm-light .pwm-lg-note{color:var(--pwm-ov-mute)}
.pwm-light .pwm-zc{color:var(--pwm-ov-txt);border-color:var(--pwm-ov-line)}
.pwm-light .pwm-zc:hover,.pwm-light .pwm-lg-btn:hover{background:rgba(36,29,80,.06);border-color:var(--pwm-ov-acc2)}
.pwm-light .pwm-lg-btn{border-color:var(--pwm-ov-line)}
.pwm-hover.pwm-light .pwm-hover-v{color:var(--pwm-ov-txt)}
.pwm-hover.pwm-light.is-brief .pwm-hover-row:first-child .pwm-hover-v{color:var(--pwm-ov-acc)}
.pwm-light .pwm-term{background:var(--pwm-ov-bg);border-color:var(--pwm-ov-line);box-shadow:0 18px 40px -26px rgba(36,29,80,.4)}
.pwm-light .pwm-term .nw-term-top{border-color:var(--pwm-ov-line)}
.pwm-light .pwm-term .nw-term-top span,.pwm-light .pwm-term .c,.pwm-light .pwm-term-x{color:var(--pwm-ov-mute)}
.pwm-light .pwm-term-x{border-color:var(--pwm-ov-line)}
.pwm-light .pwm-term pre,.pwm-light .pwm-term .k{color:var(--pwm-ov-txt)}
.pwm-light .pwm-term .v,.pwm-light .pwm-term-sum{color:var(--pwm-ov-acc)}
.pwm-light .pwm-term .nw-cur{background:var(--pwm-ov-acc2)}

/* legend (rendered into #pwm-legend when present) */
.pwm-lg{font:11px/1.45 var(--pwm-font,'Nunito Sans',system-ui,sans-serif);color:var(--txt2,#cfc9ea);
  background:rgba(18,16,29,.88);border:1px solid var(--line2,rgba(148,135,216,.34));border-radius:var(--r,6px);
  padding:6px 10px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);max-width:300px}
.pwm-lg>summary{cursor:pointer;color:var(--purple-hi,#b6aaff);letter-spacing:.08em;text-transform:uppercase;font-size:10.5px;list-style:none}
.pwm-lg>summary::-webkit-details-marker{display:none}
.pwm-lg>summary::before{content:'\25B8';display:inline-block;margin-right:6px;transition:transform .15s}
.pwm-lg[open]>summary::before{transform:rotate(90deg)}
.pwm-lg-body{margin-top:6px;display:grid;gap:7px}
.pwm-lg-h{color:var(--mute,#8b85a8);font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:2px}
.pwm-lg-row{display:flex;align-items:center;gap:7px;min-height:17px}
.pwm-lg-row svg{flex:0 0 28px}
.pwm-lg-kv .pwm-lg-k{flex:0 0 48px;color:var(--mute,#8b85a8)}
.pwm-lg-note{color:var(--dim,#6f6a8c);font-size:10.5px;line-height:1.4;margin-top:3px;max-width:250px}
.pwm-lg-btn{margin-top:4px;font:inherit;font-size:10.5px;color:var(--teal,#4fd8c0);background:transparent;
  border:1px solid var(--line2,rgba(148,135,216,.34));border-radius:var(--r,6px);padding:2px 9px;cursor:pointer}
.pwm-lg-btn:hover,.pwm-lg-btn:focus-visible{border-color:var(--teal,#4fd8c0);outline:none;background:rgba(79,216,192,.08)}

/* ---- full screen (task 8): the canvas frame fills the window; the legend, build log, drawer and style panel overlay it as usual ---- */
/* the toggle: its own 32 px icon button in the canvas's top-right corner (below the floating toolbar), clear of the drawer */
.pwm-fsbtn{position:absolute;top:10px;right:12px;z-index:8;width:32px;height:32px;padding:0;display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--r,6px);border:1px solid var(--line2,rgba(148,135,216,.34));background:rgba(18,16,29,.9);color:var(--txt2,#cfc9ea);cursor:pointer;
  box-shadow:0 10px 30px rgba(8,7,13,.55);backdrop-filter:blur(4px);transition:border-color .15s,background .15s,color .15s}
.pwm-fsbtn:hover{border-color:var(--purple,#9487d8);color:var(--purple-hi,#b6aaff);background:rgba(148,135,216,.16)}
.pwm-fsbtn:focus-visible{outline:2px solid var(--purple-hi,#b6aaff);outline-offset:1px}
.pwm-fsbtn[aria-pressed="true"]{color:var(--teal,#4fd8c0);border-color:rgba(79,216,192,.5)}
.pwm-fsbtn svg{display:block}
.pwm-canvaswrap:has(.pwm-drawer.open) .pwm-fsbtn{right:calc(min(380px,100%) + 12px)}
.pwm-light .pwm-fsbtn{background:var(--pwm-ov-bg);border-color:var(--pwm-ov-line);color:var(--pwm-ov-txt)}
@media(min-width:761px){.pwm-is-explore .pwm-fsbtn{top:calc(var(--pwm-tbh,49px) + 10px)}}   /* below the floating toolbar */
@media(max-width:760px){.pwm-canvaswrap:has(.pwm-drawer.open) .pwm-fsbtn{right:12px}}
.pwm-canvaswrap:fullscreen{width:100vw;height:100vh!important;max-height:none;border:0;border-radius:0;background:var(--bg,#08070d)}
.pwm-canvaswrap:-webkit-full-screen{width:100vw;height:100vh;background:var(--bg,#08070d)}
.pwm-canvaswrap.is-fs-pinned{position:fixed!important;inset:0!important;z-index:3000!important;width:auto!important;height:auto!important;max-height:none!important;
  margin:0!important;border:0!important;border-radius:0!important;background:var(--bg,#08070d)}
html.pwfs-lock,html.pwfs-lock body{overflow:hidden}
/* the pinned fallback must escape its ancestors' containing blocks and stacking contexts (backdrop-filter, transforms, z-index) */
html.pwfs-lock :has(.is-fs-pinned){transform:none!important;filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  perspective:none!important;contain:none!important;will-change:auto!important;z-index:3000!important;animation:none!important}   /* lift every ancestor stacking context (fixed and z-indexed ones form one); a filled transform animation also makes a containing block */
.pwm-canvaswrap.is-fullscreen{--pwm-tbh:0px}   /* the toolbar stays outside: overlays start at the top edge */
/* spec §18: "+K more upstreams" ghosts are muted; the Tier-1 pill and the "observed from here" tick */
.pwm-graph .pwm-node.is-ghost .pwm-glyph{opacity:.6}
.pwm-graph .pwm-node.is-ghost .pwm-label{opacity:.75}
.pwm-graph .pwm-obs{cursor:help}
.pwm-graph .pwm-tierpill{cursor:help}
