:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}html,body,#root{height:100%;background:#000;color:#00ff41}html,body{overflow-x:hidden}*{box-sizing:border-box}body{background-color:#000;color:#00ff41;font-family:Courier New,monospace}h2,h3{color:#00ff41}button{background-color:#111;color:#00ff41;border:1px solid #00FF41;padding:8px 12px;margin-bottom:8px;width:100%;cursor:pointer;padding:clamp(4px,1vw,8px) clamp(8px,2vw,16px);border-radius:6px;font-family:Courier New,monospace}button:hover{background-color:#00ff41;color:#000}.panel{border:1px solid #00FF41;margin:6px;padding:8px;min-width:0;max-width:100%;overflow:hidden}@keyframes pulseFade{0%{color:#fff}40%{color:var(--pulseColor)}to{color:#fff}}.pulse{animation:pulseFade 1s forwards}.info-line{color:#ff7300;font-family:Courier New,monospace;font-size:14px}.info-header{display:flex;justify-content:space-between;align-items:center}.info-title{margin:0}.clear-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin-left:8px;background:#111;color:#00ff41;border:1px solid #00FF41;border-radius:6px;cursor:pointer}.clear-btn:hover{background:#00ff41;color:#000}.info-msg{margin-top:8px}.logs-title{margin-bottom:8px}.logs-note{font-size:.8em;color:#888}.logs-box{background:#111;border:1px solid #00ff41;border-radius:6px;padding:8px;height:72vh;overflow:auto;box-sizing:border-box;font-family:Courier New,monospace}.log-line{margin:0;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;max-width:100%}.log-allow{color:#00ff41}.log-block{color:red;font-weight:700}.log-fw{color:#ff0}.log-scan{color:#0ff}.log-default{color:#fff}.info-allow{color:#00ff41}.info-block{color:red}.info-fw{color:#ff0}.info-scan{color:#0ff}.info-default{color:#fff}h2{font-size:clamp(16px,2.2vw,24px);margin:8px 0}h3{font-size:clamp(14px,1.8vw,18px);margin:8px 0}p,pre,button,select{font-size:clamp(12px,1.6vw,16px)}.app-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px}.topbar-left,.topbar-right{display:flex;align-items:center;gap:8px}.level-select{background-color:#111;color:#00ff41;border:1px solid #00FF41;font-family:Courier New,monospace;padding:4px 8px;border-radius:6px}.app-layout{display:flex;flex-direction:row;gap:12px;height:94vh;padding:0 8px 8px;box-sizing:border-box}@media (max-width: 1024px){.app-layout{flex-direction:column;height:auto}.panel{width:100%}}@media (max-width: 600px){.app-layout{gap:8px}.app-topbar{flex-direction:column;align-items:stretch}.level-select{width:100%;max-width:420px}}.actions-wrap{display:flex;flex-wrap:wrap;gap:8px}.actions-wrap button{flex:1 1 140px}.back-intro-btn{background:#111;color:#00ff41;border:1px solid #00ff41;border-radius:6px;padding:4px 10px;font-family:Courier New,monospace;cursor:pointer}.back-intro-btn:hover{background:#00ff41;color:#000}.toast{position:fixed;top:20px;right:20px;background:#111;border:1px solid #00ff41;color:#00ff41;padding:10px 16px;border-radius:6px;font-family:Courier New,monospace;font-size:14px;box-shadow:0 0 12px #00ff414d;z-index:2000;animation:fadeInOut 2.5s ease forwards}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1}to{opacity:0;transform:translateY(-10px)}}.log-alert{color:#ff4d4f;font-weight:700}.btn-active-fw,.btn-active-ids,.btn-active-tls{background-color:#ff0!important;color:#000!important;border:1px solid yellow!important}.btn-active-ips{background-color:orange!important;color:#000!important;border:1px solid orange!important}.btn-active-block{background-color:red!important;color:#fff!important;border:1px solid red!important}.progress-wrap{display:grid;gap:6px;margin-top:8px;max-width:420px}.progress-label{font-size:.9em;color:#b7ffcb}.progress-bar{height:6px;background:#0a0a0a;border:1px solid #00ff41;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#00ff41,#8cff9e);width:0%;transition:width .24s ease-in-out}.center-toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#111;border:2px solid #00ff41;color:#00ff41;padding:16px 24px;border-radius:8px;font-family:Courier New,monospace;font-size:1.2em;text-align:center;z-index:3000;box-shadow:0 0 16px #00ff4180;animation:fadeInOutCenter 2.5s ease forwards}@keyframes fadeInOutCenter{0%{opacity:0;transform:translate(-50%,-55%)}10%{opacity:1;transform:translate(-50%,-50%)}90%{opacity:1}to{opacity:0;transform:translate(-50%,-45%)}}.btn-inline{width:auto!important;display:inline-block;padding:6px 12px;margin:6px 8px 0 0;border-radius:6px}.right-col{display:flex;flex-direction:column;gap:12px;min-height:0;min-width:0}.right-col .info-pane-wrap{flex:1 1 auto;min-height:0;display:flex}.right-col .assistant-wrap{flex:0 0 36vh;min-height:260px}.info-root{display:flex;flex-direction:column;width:100%;min-height:0}.info-root .logs-box{height:auto!important;max-height:none;flex:1 1 auto;min-height:0;overflow:auto}@media (max-width: 600px){.right-col .assistant-wrap{flex-basis:30vh;min-height:220px}}.btn-active-lb,.btn-active-waf,.btn-active-vpn,.btn-active-siem,.btn-active-soc{background-color:#ff0!important;color:#000!important;border:1px solid yellow!important}.panel{min-width:0}.topology-root{font-family:Courier New,monospace}.topology-root .diagram{display:block;white-space:pre;line-height:1.3;font-size:clamp(11px,2.4vw,16px);overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px}.topology-root .diagram-l10{letter-spacing:0;word-break:keep-all;overflow-x:auto}.topology-root .desc-block{margin-top:8px;color:#ffa640;font-style:italic;line-height:1.4;white-space:normal;overflow-wrap:anywhere;word-break:break-word}.topology-root .desc-line{color:#ffa640}.topology-root .btn-inline{width:auto!important;display:inline-block;padding:6px 10px;margin:6px 8px 0 0;border-radius:6px;background:#111;color:#00ff41;border:1px solid #00ff41;cursor:pointer}.topology-root .btn-inline:hover{background:#00ff41;color:#000}.topology-root .readmore{margin-top:8px;background:#111;color:#ff9100;border:1px solid #00ff41;border-radius:6px;padding:4px 10px;cursor:pointer}.topology-root .readmore:hover{background:#00ff41;color:#000}.topology-root .modal-backdrop{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.topology-root .modal-card{width:min(90vw,700px);background:#000;border:1px solid #00ff41;border-radius:8px;padding:16px;color:#00ff41;box-shadow:0 0 24px #00ff4133;white-space:normal;line-height:1.4}.topology-root .modal-head{display:flex;align-items:center;justify-content:space-between}.topology-root .modal-title{margin:0}.topology-root .modal-close{background:#111;color:#00ff41;border:1px solid #00ff41;border-radius:6px;padding:2px 8px;cursor:pointer}.topology-root .modal-close:hover{background:#df3c13;color:#000}.topology-root .modal-list{margin-top:12px;padding-left:18px}.topology-root .modal-tip{margin-top:8px;font-size:12px;color:#0ff}.topology-root .btn-active-lb{border:2px solid yellow;background:#222;color:#ff0}@media (max-width: 360px){.topology-root .diagram{font-size:10px}}@media (max-width: 640px){.topology-root .diagram{font-size:12px}}.topology-root .media-row{margin-top:8px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.topology-root .yt-card{display:flex;gap:10px;align-items:center;border:1px solid #00ff41;border-radius:8px;padding:8px;background:#000;box-shadow:0 0 14px #00ff4114}.topology-root .yt-thumb-link{display:block;border-radius:6px;overflow:hidden;line-height:0}.topology-root .yt-thumb{display:block;width:96px;height:170px;object-fit:cover;border:1px solid #222}.topology-root .yt-meta{display:flex;flex-direction:column;gap:6px;min-width:160px}.topology-root .yt-title{color:#b7ffcb;font-size:.95em}.topology-root .yt-watch{border-color:#ff4d00;color:#ffb27a}.topology-root .yt-watch:hover{background:#ff4d00;color:#000}.landing-root{min-height:100vh;background:#000;color:#00ff41;font-family:Courier New,monospace;display:flex;flex-direction:column;gap:18px;padding:20px;box-sizing:border-box}.landing-hero{text-align:center}.brand{margin:0 0 8px;font-size:clamp(22px,5vw,42px);letter-spacing:1px;text-shadow:0 0 12px rgba(0,255,65,.2)}.tagline{margin:0 auto;max-width:800px;font-size:clamp(14px,2.2vw,18px);color:#b7ffcb}.card{background:#111;border:1px solid #00ff41;border-radius:6px;padding:16px;display:flex;flex-direction:column;justify-content:space-between}.card .desc{flex-grow:1;margin-bottom:12px}.card h2{margin:0 0 8px;font-size:clamp(16px,2.6vw,22px)}.desc{color:#ffa640;line-height:1.45;margin-bottom:12px}.cta{background:#111;color:#00ff41;border:1px solid #00ff41;padding:8px 14px;border-radius:6px;font-family:Courier New,monospace;cursor:pointer}.cta:hover{background:#00ff41;color:#000}.landing-footer{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.quick-hints ul{margin:6px 0 0 16px}.mini-ascii{white-space:pre;overflow-x:auto;border:1px dashed #00ff41;border-radius:6px;padding:10px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.landing-controls{margin-top:14px;display:flex;justify-content:space-between;align-items:center}.skip-intro{font-size:.9em;color:#b7ffcb;display:flex;gap:8px;align-items:center}.reset-btn{border-color:#ff4d4f;color:#ff4d4f}.reset-btn:hover{background:#ff4d4f;color:#000}@media (max-width: 900px){.cards,.landing-footer{grid-template-columns:1fr}.landing-controls{flex-direction:column;gap:10px}}.app-footer{margin-top:16px;padding:12px;text-align:center;border-top:1px solid #00ff41;background:#000;color:#00ff41;font-family:Courier New,monospace}.footer-title{margin:4px 0;font-size:14px;font-weight:700}.social-links{display:flex;justify-content:center;gap:20px;margin:10px 0;flex-wrap:wrap}.social-links a{display:flex;align-items:center;gap:6px;color:#00ff41;text-decoration:none;border:1px solid #00ff41;padding:6px 10px;border-radius:6px;transition:background .2s ease,color .2s ease,transform .2s ease}.social-links a:hover{background:#00ff41;color:#000;transform:translateY(-2px)}.icon{font-size:18px}.footer-note{font-size:12px;margin-top:8px;color:#888}.quiz-root{padding:8px}.quiz-list{display:grid;gap:12px}.quiz-card{border:1px solid #00ff41;border-radius:6px;padding:12px;background:#111}.quiz-q{margin-bottom:8px;font-weight:700}.q-num{color:#00ff41;margin-right:6px}.quiz-options{display:grid;gap:6px}.opt{display:flex;align-items:center;gap:6px}.quiz-input{width:100%;background:#000;color:#00ff41;border:1px solid #00ff41;padding:6px 8px;border-radius:6px}.quiz-feedback.ok{color:#00ff41;margin-top:6px}.quiz-feedback.bad{color:#ff4d4f;margin-top:6px}.explain{font-size:.9em;color:#b7ffcb;margin-top:4px}.quiz-actions{margin-top:12px;display:flex;align-items:center}.quiz-score{font-weight:700}.assistant-panel{border:1px solid #00ff41;border-radius:6px;padding:8px;background:#000;color:#00ff41;font-family:Courier New,monospace;display:flex;flex-direction:column;gap:8px;height:100%}.assistant-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid #00ff41;padding-bottom:4px;margin-bottom:6px}.assistant-head h3{margin:0;font-size:clamp(14px,1.8vw,18px)}.assistant-hint{font-size:.85em;color:#b7ffcb}.assistant-chat{background:#0a0a0a;border:1px solid #00ff41;border-radius:6px;padding:8px;flex:1 1 auto;min-height:0;overflow:auto;font-size:clamp(12px,1.6vw,16px);line-height:1.4}.assistant-msg{margin-bottom:10px}.assistant-msg .role{font-size:.8em;color:#8bd899;margin-bottom:2px}.assistant-msg .bubble{background:#111;border:1px solid #00ff41;padding:6px 8px;border-radius:6px;white-space:pre-wrap;word-wrap:break-word}.assistant-msg.user .bubble{border-color:#8cff9e}.assistant-msg.assistant .bubble{border-color:#00ff41}.assistant-error{color:#ff4d4f;font-weight:700}.assistant-sanitized{margin-top:6px;font-size:.85em;color:#ffa640}.assistant-input{display:grid;grid-template-columns:1fr auto;gap:8px}.assistant-input textarea{background:#111;color:#00ff41;border:1px solid #00ff41;border-radius:6px;padding:8px;min-height:72px;resize:vertical;font-family:Courier New,monospace;font-size:clamp(12px,1.6vw,16px)}.assistant-input button{background:#111;color:#00ff41;border:1px solid #00ff41;border-radius:6px;padding:8px 12px;height:100%;cursor:pointer;font-family:Courier New,monospace;font-size:clamp(12px,1.6vw,16px)}.assistant-input button:hover{background:#00ff41;color:#000}.assistant-input button:disabled{opacity:.6;cursor:not-allowed}.assistant-helper{margin-top:-4px;font-size:.85em;color:#b7ffcb}@media (max-width: 600px){.assistant-panel{font-size:14px}.assistant-input textarea{min-height:56px}}