#how-graph .hg-canvas{width:100%;max-width:900px;position:relative;left:50%;transform:translate(-50%)}#how-graph .hg-title-wrap{display:grid}#how-graph .hg-title-wrap>div{grid-column:1;grid-row:1}#how-graph .hg-conn{stroke:color-mix(in oklch,var(--color-base-content) 16%,transparent);stroke-width:1.5;fill:none;stroke-dasharray:1000 0;stroke-opacity:1;transition:stroke .7s ease,stroke-dasharray .8s ease,stroke-opacity .6s ease}#how-graph .hg-ng{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px}#how-graph .hg-node{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 12px;border-radius:10px;border:1.5px solid;min-width:84px;text-align:center}#how-graph .hg-node>span{font-size:10px;font-weight:600;white-space:nowrap}#how-graph .hg-svc{background:color-mix(in oklch,var(--color-neutral) 55%,transparent);border-color:color-mix(in oklch,var(--color-base-content) 18%,transparent);color:color-mix(in oklch,var(--color-base-content) 68%,transparent)}#how-graph .hg-node.hg-missing{border-style:dashed;opacity:.65}#how-graph .hg-frow{display:grid}#how-graph .hg-frow>span{grid-column:1;grid-row:1;display:flex;align-items:center;gap:3px;font-size:8.5px;font-family:ui-monospace,monospace;padding:2px 6px;border-radius:20px;white-space:nowrap;transition:opacity .55s ease,transform .55s ease;transition-delay:var(--hg-d, 0ms)}#how-graph .hg-effort{background:color-mix(in oklch,var(--color-neutral) 55%,transparent);border:1px solid color-mix(in oklch,var(--color-base-content) 14%,transparent);color:color-mix(in oklch,var(--color-base-content) 55%,transparent)}#how-graph .hg-clabel{position:absolute;transform:translate(-50%,-50%);display:grid;pointer-events:none}#how-graph .hg-clabel>span{grid-column:1;grid-row:1;display:flex;align-items:center;gap:3px;font-size:9px;font-family:ui-monospace,monospace;padding:2px 6px;border-radius:20px;white-space:nowrap;transition:opacity .4s ease}#how-graph .hg-warn{background:color-mix(in oklch,var(--color-warning) 10%,transparent);border:1px solid color-mix(in oklch,var(--color-warning) 26%,transparent);color:var(--color-warning)}#how-graph .hg-error{background:color-mix(in oklch,var(--color-error) 10%,transparent);border:1px solid color-mix(in oklch,var(--color-error) 26%,transparent);color:var(--color-error)}#how-graph .hg-ok{background:color-mix(in oklch,var(--color-success) 8%,transparent);border:1px solid color-mix(in oklch,var(--color-success) 22%,transparent);color:var(--color-success)}#how-graph .hg-before{opacity:1;transform:translateY(0);transition:opacity .55s ease,transform .55s ease;transition-delay:var(--hg-d, 0ms)}#how-graph .hg-new{opacity:0;transition:opacity .55s ease,transform .55s ease;transition-delay:var(--hg-d, 0ms)}#how-graph .hg-after{opacity:0;transform:translateY(10px);transition:opacity .55s ease,transform .55s ease;transition-delay:var(--hg-d, 0ms)}#how-graph .hg-node{transform:translateY(0);transition:opacity .55s ease,transform .55s ease;transition-delay:var(--hg-d, 0ms)}#how-graph.is-new *{transition-delay:0ms!important}#how-graph.is-new .hg-node.hg-missing{border-style:solid;opacity:1}#how-graph.is-new .hg-conn{stroke-dasharray:6 4}#how-graph.is-new .hg-before{opacity:0}#how-graph.is-new .hg-new{opacity:1!important;transform:translateY(0)}#how-graph.is-new .hg-after{opacity:0;transform:translateY(10px)}#how-graph.is-new .hg-node.hg-res{border-style:dashed;border-width:2px}#how-graph.is-new .hg-node.hg-auto{opacity:0;transform:translateY(8px)}#how-graph.is-new-back *{transition-delay:0ms!important}#how-graph.is-new-back .hg-node.hg-missing{border-style:solid;opacity:1}#how-graph.is-new-back .hg-conn{stroke-dasharray:6 4}#how-graph.is-new-back .hg-before{opacity:0;transform:translateY(-8px)}#how-graph.is-new-back .hg-new{opacity:1!important}#how-graph.is-new-back .hg-after{opacity:0;transform:translateY(-10px)}#how-graph.is-new-back .hg-node.hg-res{border-style:dashed;border-width:2px}#how-graph.is-new-back .hg-node.hg-auto{opacity:0;transform:translateY(-8px)}#how-graph.is-snap,#how-graph.is-snap *{transition-duration:0s!important;transition-delay:0ms!important}#platform-header{opacity:0;transform:translateY(1.2rem);transition:opacity .65s ease,transform .65s ease}#platform-header.is-visible{opacity:1;transform:none}#how-graph.is-levyer .hg-node.hg-missing{border-style:solid;opacity:1}#how-graph.is-levyer .hg-conn{stroke:color-mix(in oklch,var(--color-primary) 18%,transparent);stroke-dasharray:6 4}#how-graph.is-levyer .hg-before,#how-graph.is-levyer .hg-new{opacity:0}#how-graph.is-levyer .hg-after{opacity:1!important;transform:translateY(0)}