.react-flow{--xy-edge-stroke-default:#b1b1b7;--xy-edge-stroke-width-default:1;--xy-edge-stroke-selected-default:#555;--xy-connectionline-stroke-default:#b1b1b7;--xy-connectionline-stroke-width-default:1;--xy-attribution-background-color-default:#ffffff80;--xy-minimap-background-color-default:#fff;--xy-minimap-mask-background-color-default:#f0f0f099;--xy-minimap-mask-stroke-color-default:transparent;--xy-minimap-mask-stroke-width-default:1;--xy-minimap-node-background-color-default:#e2e2e2;--xy-minimap-node-stroke-color-default:transparent;--xy-minimap-node-stroke-width-default:2;--xy-background-color-default:transparent;--xy-background-pattern-dots-color-default:#91919a;--xy-background-pattern-lines-color-default:#eee;--xy-background-pattern-cross-color-default:#e2e2e2;background-color:var(--xy-background-color,var(--xy-background-color-default));--xy-node-color-default:inherit;--xy-node-border-default:1px solid #1a192b;--xy-node-background-color-default:#fff;--xy-node-group-background-color-default:#f0f0f040;--xy-node-boxshadow-hover-default:0 1px 4px 1px #00000014;--xy-node-boxshadow-selected-default:0 0 0 .5px #1a192b;--xy-node-border-radius-default:3px;--xy-handle-background-color-default:#1a192b;--xy-handle-border-color-default:#fff;--xy-selection-background-color-default:#0059dc14;--xy-selection-border-default:1px dotted #0059dccc;--xy-controls-button-background-color-default:#fefefe;--xy-controls-button-background-color-hover-default:#f4f4f4;--xy-controls-button-color-default:inherit;--xy-controls-button-color-hover-default:inherit;--xy-controls-button-border-color-default:#eee;--xy-controls-box-shadow-default:0 0 2px 1px #00000014;--xy-edge-label-background-color-default:#fff;--xy-edge-label-color-default:inherit;--xy-resize-background-color-default:#3367d9;direction:ltr}.react-flow.dark{--xy-edge-stroke-default:#3e3e3e;--xy-edge-stroke-width-default:1;--xy-edge-stroke-selected-default:#727272;--xy-connectionline-stroke-default:#b1b1b7;--xy-connectionline-stroke-width-default:1;--xy-attribution-background-color-default:#96969640;--xy-minimap-background-color-default:#141414;--xy-minimap-mask-background-color-default:#3c3c3c99;--xy-minimap-mask-stroke-color-default:transparent;--xy-minimap-mask-stroke-width-default:1;--xy-minimap-node-background-color-default:#2b2b2b;--xy-minimap-node-stroke-color-default:transparent;--xy-minimap-node-stroke-width-default:2;--xy-background-color-default:#141414;--xy-background-pattern-dots-color-default:#777;--xy-background-pattern-lines-color-default:#777;--xy-background-pattern-cross-color-default:#777;--xy-node-color-default:#f8f8f8;--xy-node-border-default:1px solid #3c3c3c;--xy-node-background-color-default:#1e1e1e;--xy-node-group-background-color-default:#f0f0f040;--xy-node-boxshadow-hover-default:0 1px 4px 1px #ffffff14;--xy-node-boxshadow-selected-default:0 0 0 .5px #999;--xy-handle-background-color-default:#bebebe;--xy-handle-border-color-default:#1e1e1e;--xy-selection-background-color-default:#c8c8dc14;--xy-selection-border-default:1px dotted #c8c8dccc;--xy-controls-button-background-color-default:#2b2b2b;--xy-controls-button-background-color-hover-default:#3e3e3e;--xy-controls-button-color-default:#f8f8f8;--xy-controls-button-color-hover-default:#fff;--xy-controls-button-border-color-default:#5b5b5b;--xy-controls-box-shadow-default:0 0 2px 1px #00000014;--xy-edge-label-background-color-default:#141414;--xy-edge-label-color-default:#f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props,var(--xy-background-color,var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{width:100%;height:100%;position:absolute;top:0;left:0}.react-flow__pane{z-index:1;touch-action:none}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke,var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width,var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke,var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width,var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{pointer-events:none;position:absolute;overflow:visible}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:.5s linear infinite dashdraw}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected,var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke,var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke,var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:.5s linear infinite dashdraw}svg.react-flow__connectionline{z-index:1001;position:absolute;overflow:visible}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{-webkit-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default;position:absolute}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:0 0;pointer-events:none}.react-flow__nodesselection-rect{pointer-events:all;cursor:grab;position:absolute}.react-flow__handle{pointer-events:none;background-color:var(--xy-handle-background-color,var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color,var(--xy-handle-border-color-default));border-radius:100%;width:6px;min-width:5px;height:6px;min-height:5px;position:absolute}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;bottom:0;left:50%;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{z-index:5;margin:15px;position:absolute}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px)translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px)translateY(-50%)}.react-flow__attribution{background:var(--xy-attribution-background-color,var(--xy-attribution-background-color-default));margin:0;padding:2px 3px;font-size:10px}.react-flow__attribution a{color:#999;text-decoration:none}@keyframes dashdraw{0%{stroke-dashoffset:10px}}.react-flow__edgelabel-renderer{pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;top:0;left:0}.react-flow__viewport-portal{-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;top:0;left:0}.react-flow__minimap{background:var(--xy-minimap-background-color-props,var(--xy-minimap-background-color,var(--xy-minimap-background-color-default)))}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var(--xy-minimap-mask-background-color-props,var(--xy-minimap-mask-background-color,var(--xy-minimap-mask-background-color-default)));stroke:var(--xy-minimap-mask-stroke-color-props,var(--xy-minimap-mask-stroke-color,var(--xy-minimap-mask-stroke-color-default)));stroke-width:var(--xy-minimap-mask-stroke-width-props,var(--xy-minimap-mask-stroke-width,var(--xy-minimap-mask-stroke-width-default)))}.react-flow__minimap-node{fill:var(--xy-minimap-node-background-color-props,var(--xy-minimap-node-background-color,var(--xy-minimap-node-background-color-default)));stroke:var(--xy-minimap-node-stroke-color-props,var(--xy-minimap-node-stroke-color,var(--xy-minimap-node-stroke-color-default)));stroke-width:var(--xy-minimap-node-stroke-width-props,var(--xy-minimap-node-stroke-width,var(--xy-minimap-node-stroke-width-default)))}.react-flow__background-pattern.dots{fill:var(--xy-background-pattern-color-props,var(--xy-background-pattern-color,var(--xy-background-pattern-dots-color-default)))}.react-flow__background-pattern.lines{stroke:var(--xy-background-pattern-color-props,var(--xy-background-pattern-color,var(--xy-background-pattern-lines-color-default)))}.react-flow__background-pattern.cross{stroke:var(--xy-background-pattern-color-props,var(--xy-background-pattern-color,var(--xy-background-pattern-cross-color-default)))}.react-flow__controls{box-shadow:var(--xy-controls-box-shadow,var(--xy-controls-box-shadow-default));flex-direction:column;display:flex}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{background:var(--xy-controls-button-background-color,var(--xy-controls-button-background-color-default));border:none;border-bottom:1px solid var(--xy-controls-button-border-color-props,var(--xy-controls-button-border-color,var(--xy-controls-button-border-color-default)));width:26px;height:26px;color:var(--xy-controls-button-color-props,var(--xy-controls-button-color,var(--xy-controls-button-color-default)));cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;padding:4px;display:flex}.react-flow__controls-button svg{fill:currentColor;width:100%;max-width:12px;max-height:12px}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{border-radius:var(--xy-node-border-radius,var(--xy-node-border-radius-default));width:150px;color:var(--xy-node-color,var(--xy-node-color-default));text-align:center;border:var(--xy-node-border,var(--xy-node-border-default));background-color:var(--xy-node-background-color,var(--xy-node-background-color-default));padding:10px;font-size:12px}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover,var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected,var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color,var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color,var(--xy-selection-background-color-default));border:var(--xy-selection-border,var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var(--xy-controls-button-background-color-hover-props,var(--xy-controls-button-background-color-hover,var(--xy-controls-button-background-color-hover-default)));color:var(--xy-controls-button-color-hover-props,var(--xy-controls-button-color-hover,var(--xy-controls-button-color-hover-default)))}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var(--xy-controls-button-border-color-props,var(--xy-controls-button-border-color,var(--xy-controls-button-border-color-default)))}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{background-color:var(--xy-resize-background-color,var(--xy-resize-background-color-default));border:1px solid #fff;border-radius:1px;width:5px;height:5px;translate:-50% -50%}.react-flow__resize-control.handle.left{top:50%;left:0}.react-flow__resize-control.handle.right{top:50%;left:100%}.react-flow__resize-control.handle.top{top:0;left:50%}.react-flow__resize-control.handle.bottom{top:100%;left:50%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color,var(--xy-resize-background-color-default));border-style:solid;border-width:0}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;height:100%;top:0;transform:translate(-50%)}.react-flow__resize-control.line.left{border-left-width:1px;left:0}.react-flow__resize-control.line.right{border-right-width:1px;left:100%}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{width:100%;height:1px;left:0;transform:translateY(-50%)}.react-flow__resize-control.line.top{border-top-width:1px;top:0}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color,var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color,var(--xy-edge-label-color-default))}:root{color:#e8eefc;background:#0b1020;font-family:Inter,ui-sans-serif,system-ui}*{box-sizing:border-box}body{margin:0}.app{grid-template-columns:280px 1fr 320px;height:100vh;display:grid}.left,.right{background:linear-gradient(#101831,#0b1020);border-right:1px solid #263453;padding:18px;overflow:auto}.right{border-left:1px solid #263453;border-right:0}.brand{margin-bottom:18px;font-size:28px;font-weight:800}.brand span{letter-spacing:.18em;text-transform:uppercase;color:#8fb5ff;font-size:12px;display:block}.panel{background:#ffffff0f;border:1px solid #ffffff1a;border-radius:18px;margin-bottom:14px;padding:14px;box-shadow:0 16px 50px #0003}h3{color:#b8c7e8;margin:0 0 12px;font-size:14px}.preset,.run,button{color:#e8eefc;cursor:pointer;background:#1d2b4d;border:0;border-radius:12px;width:100%;margin:6px 0;padding:10px 12px;font-weight:700}.preset:hover,.run:hover{background:#2b4071}.run{background:#3e6df6;justify-content:center;align-items:center;gap:8px;display:flex}label{color:#b8c7e8;margin:10px 0 6px;font-size:13px;display:block}input{color:#e8eefc;background:#0b1020;border:1px solid #34435f;border-radius:10px;width:100%;padding:10px}.check{align-items:center;gap:8px;display:flex}.check input{width:auto}.react-flow{background:radial-gradient(circle at 30% 20%,#203862 0,#101831 34%,#070a13 100%)}.mtu-node{color:#e8eefc;background:#121b33;border:1px solid #45608c;border-radius:18px;min-width:160px;padding:14px;box-shadow:0 12px 35px #00000059}.mtu-node.selected{outline:2px solid #8fb5ff}.mtu-node.pass{border-color:#3bd489}.mtu-node.drop{border-color:#ff5d6c}.mtu-node.fragment{border-color:#ffbd4a}.node-top{align-items:center;gap:10px;display:flex}.node-meta{color:#a8b7d8;margin-top:8px;font-size:12px}.node-pill{background:#24365d;border-radius:999px;margin-top:9px;padding:5px 8px;font-size:12px;display:inline-block}.warn{background:#ff5d6c24;border:1px solid #ff5d6c4d;border-radius:12px;padding:10px}.hop{background:#111a30;border-left:4px solid #73809b;border-radius:12px;margin:8px 0;padding:10px}.hop.pass{border-left-color:#3bd489}.hop.drop{border-left-color:#ff5d6c}.hop.fragment{border-left-color:#ffbd4a}.hop span,.hop em{color:#a8b7d8;margin-top:3px;font-size:12px;display:block}main{min-width:0}.mtu-node.packet-active{transform:scale(1.04);box-shadow:0 0 0 2px #5aa0fff2,0 0 28px #5aa0ffa6}.mtu-node.packet-active:after{content:"●";font-size:22px;animation:.7s infinite alternate packetPulse;position:absolute;top:50%;right:-14px;transform:translateY(-50%)}.mtu-node.fragment.packet-active:after{content:"● ●"}.mtu-node.drop.packet-active:after,.mtu-node.fail.packet-active:after{content:"✖"}@keyframes packetPulse{0%{opacity:.35;transform:translateY(-50%)scale(.8)}to{opacity:1;transform:translateY(-50%)scale(1.25)}}.explain.panel{z-index:8;width:420px;font-size:13px;line-height:1.35;position:absolute;bottom:18px;left:320px}.explain.panel p{color:#ebf2ffd1;margin:8px 0}select{color:#eaf2ff;background:#0a1220d9;border:1px solid #82a0d240;border-radius:10px;width:100%;margin:6px 0 10px;padding:9px 10px}.hidden{display:none!important}.mtu-node.packet-active:before{content:attr(data-active-label);letter-spacing:.08em;text-transform:uppercase;color:#b4d7fff2;font-size:10px;position:absolute;top:-18px;right:4px}.mtu-node.fragment.packet-active{outline:2px dashed #ffbe5af2}.mtu-node.fragment.packet-active:after{content:"●  ●";color:#ffd28a;letter-spacing:4px}.mtu-node.drop.packet-active:after,.mtu-node.fail.packet-active:after{content:"DROP";color:#ff8b8b;font-size:12px;font-weight:800}.walkthrough.panel{z-index:9;width:460px;max-height:42vh;position:absolute;bottom:18px;left:320px;overflow:auto}.walk-step{border-top:1px solid #ffffff14;grid-template-columns:34px 1fr;gap:10px;padding:10px 0;display:grid}.walk-num{background:#5aa0ff38;border:1px solid #5aa0ff8c;border-radius:999px;place-items:center;width:26px;height:26px;font-weight:800;display:grid}.walk-step p{color:#ebf2ffd1;margin:4px 0}.walk-step small{color:#becde6b8}.walk-step.fragmented .walk-num{background:#ffbe5a38;border-color:#ffbe5abf}.walk-step.dropped .walk-num{background:#ff5a5a38;border-color:#ff5a5acc}.walkthrough.panel{transform:translate(-50%);width:560px!important;bottom:22px!important;left:50%!important}.walk-step.active{background:#5aa0ff24;border-radius:12px;padding-left:8px;padding-right:8px;box-shadow:inset 0 0 0 1px #5aa0ff52}.hint{color:#e6f0ffc7;background:#5aa0ff1a;border:1px solid #5aa0ff38;border-radius:12px;margin-top:8px;padding:10px;font-size:12px;line-height:1.35}.advanced-title{opacity:.7}.packet-story.panel{z-index:10;width:620px;max-height:30vh;position:absolute;top:18px;left:50%;overflow:auto;transform:translate(-50%)}.packet-story.panel p{color:#ebf2ffd6;margin:8px 0;line-height:1.38}.packet-xray.panel{z-index:10;width:300px;position:absolute;top:18px;right:330px}.packet-status{background:#5aa0ff2e;border:1px solid #5aa0ff59;border-radius:999px;margin-bottom:8px;padding:5px 10px;font-weight:800;display:inline-block}.packet-status.dropped{background:#ff5a5a2e;border-color:#ff5a5a73}.packet-status.fragmented{background:#ffbe5a2e;border-color:#ffbe5a73}.xray-size{grid-template-columns:1fr auto;gap:6px 10px;margin:12px 0;display:grid}.xray-size span{color:#dce6f5b8}.xray-stack{flex-direction:column-reverse;gap:6px;display:flex}.xray-layer{border-radius:12px;padding:9px 10px;font-size:12px}.xray-layer.payload{background:#5aa0ff29;border:1px solid #5aa0ff47}.xray-layer.wrapper{background:#ffffff0f;border:1px solid #ffffff1a}.scenario-card{background:#ffffff0d;border:1px solid #ffffff14;border-radius:12px;margin-top:12px;padding:12px}.scenario-card strong{margin-bottom:4px;display:block}.scenario-meta{color:#9fb5d8;margin-bottom:8px;font-size:12px}.scenario-card p{color:#d3def3;margin-bottom:10px;font-size:13px}.floating-toggles{z-index:20;gap:8px;display:flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.floating-toggles button{background:#1d2b4deb;border:1px solid #ffffff1f;border-radius:999px;width:auto;margin:0;padding:9px 12px}@media (width<=1100px){.app{grid-template-columns:260px 1fr}.right{display:none}.packet-story.panel,.walkthrough.panel{max-height:38vh;width:calc(100vw - 320px)!important}}.node-inspector.panel{z-index:22;width:340px;position:absolute;bottom:18px;right:340px}.node-inspector-status{background:#5aa0ff2e;border:1px solid #5aa0ff59;border-radius:999px;margin-bottom:12px;padding:6px 10px;font-weight:800;display:inline-block}.node-inspector-status.dropped{background:#ff5a5a2e;border-color:#ff5a5a80}.node-inspector-status.fragmented{background:#ffbe5a2e;border-color:#ffbe5a80}.inspector-grid{grid-template-columns:1fr auto;gap:8px 12px;margin:10px 0 12px;font-size:13px;display:grid}.inspector-grid span{color:#dce6f5b8}.node-inspector p,.node-inspector li{color:#ebf2ffd6;font-size:13px;line-height:1.35}.mtu-node.encap-impact{animation:.55s ease-out encapGlow}.mtu-node.fragment-impact{animation:.55s steps(2,end) fragmentStaccato}.mtu-node.drop-impact{animation:.55s ease-in-out dropImpact}@keyframes passBurst{0%{transform:scale(1);box-shadow:0 0 #3bd48900}35%{transform:scale(1.055);box-shadow:0 0 0 8px #3bd48947,0 0 34px #3bd4896b}to{transform:scale(1);box-shadow:0 12px 35px #00000059}}@keyframes encapGlow{0%{transform:scale(1);box-shadow:0 0 #5aa0ff00}45%{transform:scale(1.05);box-shadow:0 0 0 8px #5aa0ff40,0 0 36px #5aa0ff6b}to{transform:scale(1);box-shadow:0 12px 35px #00000059}}@keyframes fragmentStaccato{0%{transform:scale(1);box-shadow:0 0 #ffbd4a00}25%{transform:scale(1.06)rotate(-.5deg);box-shadow:0 0 0 7px #ffbd4a59}50%{transform:scale(.99)rotate(.5deg);box-shadow:0 0 0 2px #ffbd4a26}75%{transform:scale(1.05)rotate(-.5deg);box-shadow:0 0 0 9px #ffbd4a47}to{transform:scale(1);box-shadow:0 12px 35px #00000059}}@keyframes dropImpact{0%{transform:translate(0)scale(1);box-shadow:0 0 #ff5d6c00}20%{transform:translate(-5px)scale(1.06);box-shadow:0 0 0 10px #ff5d6c57,0 0 42px #ff5d6c8c}40%{transform:translate(5px)scale(1.02)}60%{transform:translate(-3px)scale(1.02)}80%{transform:translate(3px)scale(1.01)}to{transform:translate(0)scale(1);box-shadow:0 12px 35px #00000059}}.mtu-node.pass-impact{animation:.32s ease-out subtlePass}@keyframes subtlePass{0%{transform:scale(1);box-shadow:0 12px 35px #00000059}45%{transform:scale(1.018);box-shadow:0 0 0 4px #3bd48924,0 0 18px #3bd48938}to{transform:scale(1);box-shadow:0 12px 35px #00000059}}.node-flag{z-index:30;pointer-events:none;border-radius:14px;width:230px;padding:10px 11px;font-size:12px;line-height:1.25;position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%);box-shadow:0 16px 42px #00000061}.node-flag:after{content:"";width:14px;height:14px;position:absolute;bottom:-7px;left:50%;transform:translate(-50%)rotate(45deg)}.node-flag strong,.node-flag span,.node-flag em{display:block}.node-flag span{color:#ffffffd6;margin-top:5px}.node-flag em{color:#ffffffb8;margin-top:7px;font-style:normal}.node-flag.warning,.node-flag.warning:after{background:#794d0ef5;border:1px solid #ffbd4a80}.node-flag.danger,.node-flag.danger:after{background:#64161ff5;border:1px solid #ff5d6c8c}.node-flag.above{bottom:calc(100% + 12px)}.node-flag.below{top:calc(100% + 12px);bottom:auto}.node-flag.below:after{top:-7px;bottom:auto}.node-flag ul{color:#ffffffc7;margin:8px 0 0;padding-left:16px}.node-flag li{margin:3px 0}.packet-xray-mini{background:#0000002e;border:1px solid #ffffff1a;border-radius:12px;margin-top:10px;padding:9px}.packet-xray-title{color:#ffffffe6;margin-bottom:7px;font-weight:800}.packet-bar{border:1px solid #ffffff2e;border-radius:9px;height:28px;display:flex;overflow:hidden}.packet-segment{color:#fff;opacity:.82;border:0;border-radius:0;place-items:center;width:auto;min-width:24px;height:100%;margin:0;padding:0;font-size:10px;display:grid}.packet-segment.active{opacity:1;outline-offset:-2px;outline:2px solid #ffffffb8}.packet-segment.payload{background:#3bd48985}.packet-segment.l4{background:#5aa0ff94}.packet-segment.ip{background:#a578ff94}.packet-segment.tunnel{background:#ffbd4a94}.packet-math{grid-template-columns:1fr auto;gap:4px 8px;margin-top:8px;font-size:11px;display:grid}.packet-math span{color:#ffffffad}.packet-layer-detail{border-top:1px solid #ffffff1f;margin-top:8px;padding-top:8px}.packet-layer-detail p{color:#ffffffc2;margin:4px 0 0}.packet-layer-list{gap:4px;margin-top:8px;display:grid}.packet-layer-list button{text-align:left;background:#ffffff0f;border:1px solid #ffffff14;border-radius:8px;grid-template-columns:1fr auto;gap:8px;width:100%;margin:0;padding:5px 7px;font-size:11px;display:grid}.packet-layer-list button.active{background:#ffffff1f;border-color:#ffffff73}.packet-layer-list b{font-size:11px}@media (width<=1100px){.investigation-hint{display:none}}.floating-toggles{display:none!important}.investigation-closed{grid-template-columns:280px 1fr 0}.investigation-closed .right{display:none}.investigation-tab{z-index:40;writing-mode:horizontal-tb;background:#101831f0;border:1px solid #8fb5ff47;width:138px;position:absolute;top:50%;right:14px;transform:translateY(-50%);box-shadow:0 16px 44px #00000059}.investigation-tab strong,.investigation-tab span,.investigation-tab em{display:block}.investigation-tab span{color:#dce6f5ad;font-size:11px}.investigation-tab em{color:#dce6f5b8;margin-top:4px;font-size:11px;font-style:normal}.investigation-tab.dropped{border-color:#ff5d6c8c}.investigation-tab.delivered{border-color:#3bd48973}.investigation-hint{z-index:39;color:#e6f0ffc2;background:#101831e0;border:1px solid #8fb5ff2e;border-radius:999px;max-width:340px;padding:10px 12px;font-size:12px;position:absolute;bottom:18px;right:18px;box-shadow:0 12px 34px #00000047}.investigation-open .investigation-hint{display:none}@media (width<=1100px){.investigation-hint{display:none}}.handshake-badge{z-index:25;background:#165a37eb;border:1px solid #3bd4898c;border-radius:999px;padding:10px 16px;font-weight:900;animation:1.8s ease-in-out forwards handshakePop;position:absolute;top:76px;left:50%;transform:translate(-50%);box-shadow:0 18px 48px #00000057}@keyframes handshakePop{0%{opacity:0;transform:translate(-50%)translateY(8px)scale(.96)}15%{opacity:1;transform:translate(-50%)translateY(0)scale(1.03)}75%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}to{opacity:0;transform:translate(-50%)translateY(-8px)scale(.98)}}.path-capacity{z-index:18;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0c1226e0;border:1px solid #8fb5ff2e;border-radius:18px;width:min(820px,100% - 64px);padding:12px 14px;position:absolute;top:14px;left:50%;transform:translate(-50%);box-shadow:0 18px 48px #00000047}.path-capacity-header{justify-content:space-between;gap:16px;margin-bottom:10px;font-size:12px;display:flex}.path-capacity-header span{color:#e6f0ffb8}.capacity-lanes{gap:7px;display:grid}.capacity-lane{grid-template-columns:150px 1fr;align-items:center;gap:10px;display:grid}.capacity-label{color:#e6f0ffbf;grid-template-columns:1fr auto;gap:8px;font-size:11px;display:grid}.capacity-track{background:#ffffff14;border-radius:999px;height:10px;overflow:hidden}.capacity-fill{background:#5aa0ff8c;border-radius:999px;height:100%;transition:width .28s}.capacity-lane.bottleneck .capacity-fill{background:#ffbd4ab8}.capacity-lane.bottleneck .capacity-label{color:#ffdc96f2;font-weight:800}.pipe-segment{background:radial-gradient(circle at 50% 0,#ffffff4d,#0000 32%),linear-gradient(#b4e6ff47,#3a76d2bf 45%,#122e70d1);border:1px solid #b4dcff38;position:relative;overflow:hidden}.pipe-segment:before{content:"";opacity:.75;background:linear-gradient(90deg,#0000,#ffffff5c,#0000);height:22%;position:absolute;inset:15% 0 auto}.pipe-segment:after{content:"";opacity:.45;background:repeating-linear-gradient(115deg,#0000 0 16px,#ffffff14 16px 18px);animation:2.8s linear infinite pipeFlow;position:absolute;inset:0}.pipe-segment.bottleneck{background:radial-gradient(circle at 50% 0,#ffffff52,#0000 32%),linear-gradient(#ffdc8c61,#ff974ad1 45%,#783614e0);border-color:#ffd27873}.pipe-join{background:linear-gradient(#ffffff47,#7396d28c,#14234bd9);border-radius:999px;width:6px;right:-3px;box-shadow:0 0 14px #5aa0ff2e}@keyframes pipeFlow{0%{background-position:0 0}to{background-position:48px 0}}.path-capacity-pipe .capacity-lanes,.path-capacity-pipe .capacity-lane,.path-capacity-pipe .capacity-track,.path-capacity-pipe .capacity-fill{display:none!important}.path-capacity-pipe{width:min(980px,100% - 64px)}.single-pipe{align-items:center;gap:0;display:flex}.single-pipe-section{flex:1;grid-template-rows:18px 44px 18px;align-items:center;min-width:82px;display:grid}.single-pipe-label{text-align:center;color:#e6f0ffb8;white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.single-pipe-body-wrap{align-items:center;height:44px;display:flex}.single-pipe-body{background:radial-gradient(circle at 50% 0,#ffffff4d,#0000 32%),linear-gradient(#b4e6ff47,#3a76d2bf 45%,#122e70d1);border:1px solid #b4dcff38;border-radius:999px;width:100%;min-height:12px;transition:height .28s;position:relative;overflow:hidden;box-shadow:inset 0 0 10px #ffffff1f,0 0 16px #5aa0ff33}.single-pipe-body:before{content:"";opacity:.75;background:linear-gradient(90deg,#0000,#ffffff5c,#0000);height:22%;position:absolute;inset:15% 0 auto}.single-pipe-body:after{content:"";opacity:.45;background:repeating-linear-gradient(115deg,#0000 0 16px,#ffffff14 16px 18px);animation:2.8s linear infinite pipeFlow;position:absolute;inset:0}.single-pipe-body.bottleneck{background:radial-gradient(circle at 50% 0,#ffffff52,#0000 32%),linear-gradient(#ffdc8c61,#ff974ad1 45%,#783614e0);border-color:#ffd27873}.single-pipe-mtu{text-align:center;color:#e6f0ffb8;font-size:11px}.single-pipe-mtu.bottleneck{color:#ffdc96fa;font-weight:900}.path-capacity-hero{width:min(1180px,100% - 64px);padding:16px 18px 14px}.path-capacity-hero .path-capacity-header b{color:#ffdc96fa}.hero-pipe{align-items:stretch;margin-top:12px;display:flex}.hero-pipe-section{flex:1;grid-template-rows:36px 72px 42px;align-items:center;min-width:90px;display:grid;position:relative}.hero-pipe-label{text-align:center;color:#ebf4ffd6;gap:3px;font-size:11px;display:grid}.hero-pipe-label strong{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.hero-pipe-label em{color:#4da3fff2;font-style:normal;font-weight:800}.hero-pipe-body{align-items:center;height:72px;display:flex;position:relative}.hero-pipe-core{background:radial-gradient(at 50% 8%,#ffffff6b,#0000 34%),linear-gradient(#a8dcff4d 0%,#408aeee0 42%,#123682eb 78%,#07143af2 100%);border-top:1px solid #d2ebff47;border-bottom:1px solid #0000006b;border-radius:999px;width:100%;height:38px;position:relative;overflow:hidden;box-shadow:inset 0 12px 18px #ffffff1f,inset 0 -12px 18px #00000052,0 0 24px #4c92ff40}.hero-pipe-core:before{content:"";background:linear-gradient(90deg,#0000,#ffffff75,#0000);border-radius:999px;height:7px;position:absolute;inset:7px 6% auto}.hero-pipe-core:after{content:"";opacity:.42;background:repeating-linear-gradient(115deg,#0000 0 20px,#ffffff14 20px 22px);animation:3.2s linear infinite pipeFlow;position:absolute;inset:0}.hero-pipe-section.bottleneck .hero-pipe-core,.hero-pipe-section.tunnel.bottleneck .hero-pipe-core{background:radial-gradient(at 50% 8%,#fff6,#0000 34%),linear-gradient(#ffdc8261 0%,#ee8c26eb 45%,#7a370cf0 82%,#3c1608fa 100%);box-shadow:inset 0 12px 18px #ffffff1f,inset 0 -12px 18px #00000057,0 0 28px #ff9b3747}.hero-pipe-coupler{z-index:2;background:linear-gradient(90deg,#1c2644e6,#d2e1f5b8,#2f3c5fe6);border-radius:5px;flex:0 0 12px;width:12px;height:50px;box-shadow:inset 0 0 8px #ffffff38,0 0 10px #00000059}.hero-pipe-section:first-child .hero-pipe-coupler.left{background:radial-gradient(circle at 30% 25%,#ffffff3d,#0000 28%),linear-gradient(90deg,#141e3a,#526d9aeb,#1c2646);border-radius:18px 6px 6px 18px;width:28px;height:66px}.hero-pipe-section:last-child .hero-pipe-coupler.right{background:radial-gradient(circle at 70% 25%,#ffffff3d,#0000 28%),linear-gradient(90deg,#1c2646,#526d9aeb,#141e3a);border-radius:6px 18px 18px 6px;width:28px;height:66px}.hero-pipe-section:not(:first-child) .hero-pipe-coupler.left{margin-left:-6px}.hero-pipe-section:not(:last-child) .hero-pipe-coupler.right{margin-right:-6px}.hero-pipe-mtu{text-align:center;color:#ebf4ffc7;gap:2px;font-size:12px;display:grid}.hero-pipe-mtu b{font-size:15px}.hero-pipe-mtu span{color:#4da3fff2;font-weight:900}.hero-pipe-section.bottleneck .hero-pipe-label strong,.hero-pipe-section.bottleneck .hero-pipe-mtu b,.hero-pipe-section.bottleneck .hero-pipe-mtu span{color:#ffcf58fa}.pipe-legend{color:#e6f0ffb8;border-top:1px solid #ffffff14;align-items:center;gap:22px;margin-top:12px;padding-top:10px;font-size:12px;display:flex}.pipe-legend i{vertical-align:-2px;border-radius:4px;width:22px;height:12px;margin-right:8px;display:inline-block}.legend-blue{background:linear-gradient(#a8dcff4d,#408aeee0)}.legend-orange{background:linear-gradient(#ffdc8261,#ee8c26eb)}@media (width<=1050px){.path-capacity-hero{display:none}}.hero-pipe-section{grid-template-rows:30px 54px 34px!important}.hero-pipe-body{height:54px!important}.hero-pipe-core{height:26px!important}.hero-pipe-coupler{opacity:.8;flex-basis:8px!important;width:8px!important;height:38px!important}.hero-pipe-section:first-child .hero-pipe-coupler.left,.hero-pipe-section:last-child .hero-pipe-coupler.right{width:20px!important;height:52px!important}.hero-pipe-section.tunnel:not(.bottleneck) .hero-pipe-core{background:radial-gradient(at 50% 8%,#ffffff61,#0000 34%),linear-gradient(#a8dcff4d 0%,#408aeee0 42%,#123682eb 78%,#07143af2 100%)!important}.hero-pipe-section.tunnel:not(.bottleneck) .hero-pipe-label strong,.hero-pipe-section.tunnel:not(.bottleneck) .hero-pipe-mtu b,.hero-pipe-section.tunnel:not(.bottleneck) .hero-pipe-mtu span,.hero-pipe-section:not(.bottleneck) .hero-pipe-label strong{color:#ebf4ffc7!important}.pipe-legend{display:none!important}.path-capacity-hero.collapsed{width:auto;min-width:320px;padding:10px 14px}.path-capacity-hero.collapsed .hero-pipe,.path-capacity-hero.collapsed .pipe-legend{display:none!important}.path-capacity-toggle{color:#ebf4ffeb;cursor:pointer;background:0 0;border:0;margin:0;padding:0;font-weight:900}.path-capacity-toggle:hover{color:#fff}.capacity-strip{width:min(1040px,100% - 64px)!important;padding:10px 14px 12px!important}.capacity-strip.collapsed{min-width:300px;width:auto!important}.capacity-strip-header{justify-content:space-between;align-items:center;gap:18px;font-size:12px;display:flex}.capacity-strip-header b{color:#ffdc96fa}.capacity-pipe{align-items:center;margin-top:14px;display:flex}.capacity-segment{flex:1;grid-template-rows:18px 30px 18px;align-items:center;min-width:90px;display:grid}.capacity-segment-label{text-align:center;color:#e6f0ffb3;white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.capacity-segment-pipe{background:linear-gradient(#78b4ffd9,#2257b4d9);border:1px solid #b4dcff33;border-radius:999px;height:18px;box-shadow:inset 0 4px 8px #ffffff1f,inset 0 -5px 10px #0000003d}.capacity-segment.bottleneck .capacity-segment-pipe{background:linear-gradient(#ffd278f2,#d77023eb);border-color:#ffd27866}.capacity-segment-mtu{text-align:center;color:#e6f0ffc7;font-size:12px;font-weight:800}.capacity-segment.bottleneck .capacity-segment-label,.capacity-segment.bottleneck .capacity-segment-mtu{color:#ffdc96fa}.capacity-segment+.capacity-segment .capacity-segment-pipe{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}.capacity-segment:not(:last-child) .capacity-segment-pipe{border-top-right-radius:0;border-bottom-right-radius:0}.hero-pipe,.pipe-legend,.single-pipe,.capacity-lanes{display:none!important}.scenario-status{color:#9fb5d8;margin:8px 0;font-size:13px}.scenario-status.error{color:#ff9b9b}.wizard-shell{background:radial-gradient(circle at 25% 15%,#203862 0,#101831 34%,#070a13 100%);place-items:center;min-height:100vh;padding:32px;display:grid}.wizard-card{background:#101831f7;border:1px solid #ffffff1f;border-radius:24px;width:min(920px,96vw);min-height:580px;padding:28px;box-shadow:0 32px 100px #0000006b}.wizard-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;gap:24px;margin-bottom:24px;padding-bottom:20px;display:flex}.wizard-brand{color:#8fb5ff;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;font-weight:900}.wizard-header h1{margin:0 0 8px;font-size:29px}.wizard-header p{color:#a8b7d8;max-width:630px;margin:0;line-height:1.45}.wizard-header>span{white-space:nowrap;color:#8fb5ff;font-weight:800}.wizard-step h2{margin:0 0 20px;font-size:21px}.wizard-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.wizard-choice{text-align:left;background:#ffffff0e;border:1px solid #ffffff1c;min-height:66px;margin:0}.wizard-choice-selected{background:#3e6df645;border-color:#8fb5ffb8}.wizard-field{margin-bottom:16px}.wizard-help{color:#9fb5d8;margin:2px 0 18px;font-size:13px;line-height:1.45}.wizard-review-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;display:grid}.wizard-review-card{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:17px;padding:16px}.wizard-review-card div{border-top:1px solid #ffffff12;justify-content:space-between;gap:18px;padding:9px 0;display:flex}.wizard-review-card span{color:#a8b7d8}.wizard-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:15px;display:grid}.wizard-summary div{background:#3e6df62b;border:1px solid #8fb5ff52;border-radius:15px;justify-content:space-between;gap:18px;padding:15px;display:flex}.wizard-summary span{color:#b8c7e8}.wizard-actions{border-top:1px solid #ffffff1a;justify-content:space-between;gap:12px;margin-top:30px;padding-top:19px;display:flex}.wizard-actions>div{gap:10px;display:flex}.wizard-actions button{width:auto;min-width:130px}.wizard-primary{background:#3e6df6}@media (width<=760px){.wizard-header,.wizard-actions{flex-direction:column}.wizard-choice-grid,.wizard-review-grid,.wizard-summary{grid-template-columns:1fr}}