:root{--bg-dark: #0a0a0f;--bg-card: rgba(255, 255, 255, .03);--bg-card-hover: rgba(255, 255, 255, .07);--bg-glass: rgba(10, 10, 15, .7);--primary: #00f2ff;--primary-glow: rgba(0, 242, 255, .3);--secondary: #7000ff;--secondary-glow: rgba(112, 0, 255, .3);--accent: #ff0055;--danger: #ff6b6b;--text-main: #ffffff;--text-muted: #a0a0b0;--text-dim: #8d8da0;--secondary-text: #a98bff;--border-light: rgba(255, 255, 255, .1);--border-glow: rgba(255, 255, 255, .2);--space-xs: .5rem;--space-sm: 1rem;--space-md: 2rem;--space-lg: 4rem;--space-xl: 8rem;--font-sans: "Inter", system-ui, -apple-system, sans-serif;--transition-fast: .2s ease;--transition-smooth: .4s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-dark);color:var(--text-main);line-height:1.7;font-size:17px;overflow-x:hidden;background-image:radial-gradient(circle at 10% 20%,rgba(112,0,255,.15) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(0,242,255,.1) 0%,transparent 40%);background-attachment:fixed}h1,h2,h3,h4,h5,h6{line-height:1.2;font-weight:700;letter-spacing:-.02em;overflow-wrap:anywhere}h1{font-size:3.5rem;background:linear-gradient(to right,#fff,#a0a0b0);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}h2{font-size:2.5rem;margin-bottom:var(--space-sm)}h3{font-size:1.75rem;margin-bottom:var(--space-xs);color:var(--primary)}p{margin-bottom:var(--space-sm);color:var(--text-muted);max-width:70ch}a{color:var(--primary);text-decoration:none;transition:var(--transition-fast)}a:hover{text-shadow:0 0 10px var(--primary-glow)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--space-md)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:var(--space-sm);left:var(--space-sm);z-index:1000;transform:translateY(-150%);padding:var(--space-xs) var(--space-sm);border:1px solid var(--primary);border-radius:8px;background:#0a0a0ff5;color:var(--text-main);box-shadow:0 0 20px var(--primary-glow)}.skip-link:focus{transform:translateY(0);outline:none}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}@media(max-width:768px){.grid-cols-2,.grid-cols-3,.grid-cols-4{grid-template-columns:1fr}h1{font-size:clamp(2rem,14vw,2.5rem)}h2{font-size:2rem}}.app-shell{display:flex;min-height:100vh}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:99px;font-weight:600;cursor:pointer;transition:var(--transition-fast);border:none;font-size:1rem}.btn-primary{background:var(--primary);color:#000;box-shadow:0 0 20px var(--primary-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 30px var(--primary-glow)}.btn-glass{background:#ffffff1a;color:#fff;border:1px solid var(--border-light);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-glass:hover{background:#fff3;border-color:#fff}.card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:12px;padding:var(--space-md);transition:var(--transition-smooth);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden}.card p,.card li,.card span,.card h1,.card h2,.card h3,.card h4,.card h5,.card h6{overflow-wrap:anywhere}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);opacity:0;transition:var(--transition-fast)}.card-interactive:hover{background:var(--bg-card-hover);transform:translateY(-5px);border-color:var(--border-glow);box-shadow:0 10px 40px -10px #00000080}.card-interactive:hover:before{opacity:1}.page-loading{min-height:60vh;display:grid;place-items:center;color:var(--text-muted);font-weight:600}.panel-solid{background:#0a0a0fe6;border:1px solid rgba(255,255,255,.08)}.icon-box{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;background:#ffffff0d;margin-bottom:var(--space-sm);color:var(--primary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .6s ease-out forwards}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:#333;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.sidebar{width:280px;background:#0a0a0f99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid var(--border-light);display:flex;flex-direction:column;transition:width var(--transition-smooth),transform var(--transition-smooth);height:100vh;position:fixed;left:0;top:0;z-index:50}.sidebar.open{width:280px;transform:translate(0)}.sidebar.closed{width:80px;transform:translate(-100%)}.sidebar-header{padding:var(--space-sm);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-light);height:70px}.nav-list{flex:1;overflow-y:auto;padding:var(--space-sm)}.nav-list ul{list-style:none;margin:0;padding:0}.nav-item{display:flex;align-items:center;padding:12px;margin-bottom:4px;border-radius:12px;color:var(--text-muted);transition:var(--transition-fast);white-space:nowrap;overflow:hidden}.nav-item:hover{background:#ffffff0d;color:var(--text-main)}.nav-item.active{background:#00f2ff1a;color:var(--primary);box-shadow:0 0 15px #00f2ff1a}.nav-icon{min-width:24px;display:flex;justify-content:center}.nav-label{margin-left:12px;font-weight:500;opacity:1;transition:opacity var(--transition-fast)}.sidebar.closed .nav-label{opacity:0;width:0}.main-content{flex:1;min-width:0;margin-left:280px;transition:margin-left var(--transition-smooth);min-height:100vh;padding:var(--space-md)}.main-content:focus{outline:none}.sidebar.closed+.main-content{margin-left:0}.sidebar-backdrop{position:fixed;inset:0;background:#0009;z-index:40;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-backdrop{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:var(--space-md);background:#000000ad;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal-panel{width:min(100%,420px);padding:var(--space-md);border:1px solid var(--border-light);border-radius:8px;background:#101018fa;box-shadow:0 20px 60px #00000073}.modal-panel h2{margin:0 0 var(--space-xs);font-size:1.35rem}.modal-panel p{color:var(--text-muted)}.modal-actions{display:flex;justify-content:flex-end;gap:var(--space-xs);margin-top:var(--space-sm);flex-wrap:wrap}.toggle-switch{position:relative;display:inline-block;width:50px;height:28px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--bg-card);border:1px solid var(--border-light);transition:.4s;border-radius:34px}.toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:3px;background-color:var(--text-muted);transition:.4s;border-radius:50%}input:checked+.toggle-slider{background-color:var(--primary);border-color:var(--primary)}input:checked+.toggle-slider:before{transform:translate(22px);background-color:#000}.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;margin-bottom:1rem;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.topbar-title{display:flex;align-items:center;gap:.5rem;font-weight:700;letter-spacing:.5px}.topbar-breadcrumb{display:flex;align-items:center;gap:.35rem;color:var(--text-muted);font-size:.95rem}.topbar-actions{display:flex;align-items:center;gap:.75rem}.icon-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--border-light);background:#ffffff0f;color:var(--text-main);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition-fast);-webkit-tap-highlight-color:rgba(0,242,255,.2);touch-action:manipulation}.icon-btn:hover,.icon-btn:focus-visible{border-color:var(--primary);box-shadow:0 0 0 3px #00f2ff26;outline:none}.icon-btn:active{transform:scale(.95);background:#ffffff1a}.pill{display:inline-flex;align-items:center;gap:.35rem;max-width:100%;background:#ffffff14;border:1px solid var(--border-light);padding:.35rem .65rem;border-radius:999px;font-size:.85rem;color:var(--text-main);overflow-wrap:anywhere}.pill-accent{border-color:var(--accent);color:var(--accent)}.pill-success{border-color:#00ff9d;color:#00ff9d}.section{margin-bottom:3rem}.section-header{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;border-bottom:1px solid var(--border-light);padding-bottom:1rem}.section-title{display:flex;align-items:center;gap:.75rem;min-width:0}.section-title h1,.section-title h2,.section-title h3{min-width:0;overflow-wrap:anywhere}.section-subtitle{color:var(--text-muted);font-size:1.1rem}.list-clean{list-style:none;padding:0;margin:0}.cta-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;margin-top:.5rem}.checklist{display:flex;flex-direction:column;gap:.5rem}.checklist-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;color:var(--text-main);font:inherit;-webkit-appearance:none;appearance:none;background:#ffffff08;border:1px solid var(--border-light);border-radius:10px;cursor:pointer;transition:var(--transition-fast);text-align:left;width:100%}.checklist-item:hover,.checklist-item:focus-visible{border-color:var(--primary);background:#00f2ff0d}.checklist-item .circle{width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid var(--text-muted);display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;color:#000;background:transparent;margin-top:1px}.checklist-item.completed{border-color:#00ff9d80;background:#00ff9d14;color:#ecfff7}.checklist-item.completed .circle{background:#00ff9d;border-color:#00ff9d}.badge-grid{display:flex;flex-wrap:wrap;gap:.5rem}.quiz-options{display:grid;gap:.6rem}.quiz-option{width:100%;text-align:left;padding:.75rem .9rem;background:#ffffff0a;border:1px solid var(--border-light);border-radius:12px;color:var(--text-main);cursor:pointer;transition:var(--transition-fast)}.quiz-option:hover,.quiz-option:focus-visible{border-color:var(--primary);outline:none}.quiz-option.correct{border-color:#00ff9d;background:#00ff9d14}.quiz-option.wrong{border-color:var(--accent);background:#ff005514}.alert{padding:var(--space-sm);border-radius:12px;border-left:4px solid;margin-bottom:var(--space-md);background:#ffffff0d;display:flex;gap:var(--space-sm)}.alert-info{border-color:var(--primary);background:#00f2ff0d}.alert-success{border-color:#00ff9d;background:#00ff9d0d}.alert-warning{border-color:#fc0;background:#ffcc000d}.alert-danger{border-color:var(--accent);background:#ff00550d}.alert-content h3{font-size:1.1rem;margin-bottom:.25rem;color:var(--text-main)}.alert-content p{margin-bottom:0;font-size:.95rem}@media(max-width:1024px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0;padding:var(--space-sm)}.sidebar.closed+.main-content{margin-left:0}.container{padding:0 var(--space-sm)}}@media(max-width:768px){.topbar{padding:.5rem .25rem;gap:.25rem}.topbar-title{font-size:.95rem;flex:1;min-width:0;overflow:hidden}.topbar-breadcrumb{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-actions{gap:.35rem;flex-shrink:0}.icon-btn{width:32px;height:32px;position:relative}.icon-btn:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px}.card,.tool-section{padding:var(--space-sm)}.btn{max-width:100%;justify-content:center;white-space:normal;overflow-wrap:anywhere}}.progress-bar-container{display:flex;align-items:center;gap:.75rem}.progress-bar{flex:1;height:8px;background:#ffffff1a;border-radius:999px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),#00ff9d);border-radius:999px;transition:width .4s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px var(--primary-glow)}.progress-bar-label{font-size:.9rem;font-weight:600;color:var(--primary);min-width:3rem;text-align:right}.progress-card{margin-bottom:2rem}.progress-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.nav-item.completed .nav-label{color:#00ff9d}.stack-card{text-align:center;transition:transform .2s ease,border-color .2s ease}.stack-card:hover{transform:translateY(-4px);border-color:var(--primary)!important}.stack-icon{width:56px;height:56px;margin:0 auto;display:flex;align-items:center;justify-content:center;background:#00f2ff1a;border-radius:12px}.recommended-badge{display:inline-flex;align-items:center;gap:.35rem;background:linear-gradient(135deg,#00f2ff26,#00ff9d26);border:1px solid rgba(0,255,157,.4);color:#00ff9d;font-size:.7rem;font-weight:700;padding:.3rem .6rem;border-radius:6px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}.recommended-badge:before{content:"✓";font-size:.75rem}.card-recommended{border-color:#00ff9d66!important;background:linear-gradient(135deg,#00f2ff08,#00ff9d08)!important}.tool-section{border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:var(--space-md)}.tool-list{display:grid;gap:.75rem}.tool-list-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.85rem;padding:.85rem;border:1px solid var(--border-light);border-radius:10px;background:#ffffff09;color:var(--text-main);transition:var(--transition-fast);min-width:0}a.tool-list-item:hover,a.tool-list-item:focus-visible{border-color:var(--primary);background:#00f2ff0f;text-shadow:none;outline:none}.tool-list-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:#ffffff0f;font-size:1.25rem}.tool-list-copy h4{margin:0 0 .2rem;color:var(--text-main)}.tool-list-copy{min-width:0}.tool-list-copy p{margin:0;font-size:.9rem}.tool-section p,.tool-section li,.tool-list-copy p{overflow-wrap:anywhere}.tool-list-action{color:var(--primary);font-size:.85rem;font-weight:700;white-space:nowrap}.tool-section-collapsible summary{cursor:pointer;display:flex;align-items:center;gap:.5rem;list-style:revert}.tool-section-collapsible summary h3{margin:0}.tool-section-collapsible[open] summary{margin-bottom:.5rem}.tool-section-collapsible-body{margin-top:.75rem}.viz-container{margin:1.5rem 0;overflow:hidden;max-width:100%;min-width:0;scroll-margin-top:5rem}.viz-title{color:var(--primary);margin-bottom:1rem;text-align:center;font-size:1.1rem;overflow-wrap:anywhere}.viz-content{display:flex;justify-content:center;align-items:center;gap:.5rem;min-height:120px;position:relative}.viz-node{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;border-radius:12px;background:var(--bg-card);border:1px solid var(--border-light);min-width:70px;text-align:center}.viz-node-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#00f2ff1a}.viz-node-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.viz-connection{display:flex;align-items:center;position:relative;height:4px;min-width:40px;background:var(--border-light);border-radius:2px}.viz-connection.encrypted{background:linear-gradient(90deg,var(--primary),var(--secondary));box-shadow:0 0 10px var(--primary-glow);height:8px;border-radius:4px}.viz-connection-xs{width:30px}.viz-connection-sm{width:60px}.viz-connection-md,.viz-connection-lg{width:120px}.viz-packet{position:absolute;left:0;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:600;top:50%;transform:translate(-50%,-50%)}.viz-packet.visible{background:var(--accent);color:#fff;box-shadow:0 0 8px #ff005580}.viz-packet.encrypted{background:var(--primary);color:var(--bg-dark);box-shadow:0 0 8px var(--primary-glow)}.viz-packet.labelled{width:auto;height:auto;padding:.15rem .45rem;border-radius:999px;font-family:monospace;font-size:.58rem;white-space:nowrap}.viz-ip-tag{font-size:.6rem;padding:.15rem .4rem;border-radius:4px;background:#00f2ff33;color:var(--primary);font-family:monospace;white-space:nowrap}.viz-info-box{position:absolute;bottom:-2rem;left:50%;transform:translate(-50%);background:#000c;padding:.25rem .5rem;border-radius:6px;font-size:.7rem;white-space:nowrap;border:1px solid var(--border-light)}.viz-isp-sees{display:flex;flex-direction:column;align-items:center;gap:.25rem;margin-top:.5rem}.viz-isp-sees-label{font-size:.65rem;color:var(--text-dim);display:flex;align-items:center;gap:.25rem}.viz-isp-sees-content{display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center;max-width:160px}.viz-site-tag{font-size:.6rem;padding:.15rem .4rem;border-radius:4px;background:#f053;color:var(--accent);font-family:monospace;white-space:nowrap}.viz-encrypted-tag{font-size:.6rem;padding:.15rem .4rem;border-radius:4px;background:#00f2ff33;color:var(--primary);display:flex;align-items:center;gap:.2rem;white-space:nowrap}.vpn-viz-wrapper{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%}.vpn-viz-row{display:flex;align-items:center;justify-content:flex-start;gap:.5rem;position:relative;width:fit-content;max-width:100%;overflow-x:auto;padding:1rem 0}.vpn-viz-row .viz-node,.vpn-viz-row .viz-connection{flex-shrink:0}.vpn-viz-label{flex-shrink:0;margin-right:.5rem;font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:6px;white-space:nowrap}.vpn-viz-label.no-vpn{background:#ff005526;color:var(--accent);border:1px solid rgba(255,0,85,.3)}.vpn-viz-label.with-vpn{background:#00f2ff26;color:var(--primary);border:1px solid rgba(0,242,255,.3)}.mfa-viz-wrapper{display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%}.mfa-header{text-align:center;max-width:500px}.mfa-explanation{font-size:.9rem;color:var(--text-muted);margin:0;line-height:1.5}.mfa-factors-row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;width:100%}.mfa-factor-card{flex:1;min-width:140px;max-width:180px;text-align:center;padding:1.25rem 1rem;border-radius:12px;background:var(--bg-card);border:2px solid var(--border-light);transition:var(--transition-smooth)}.mfa-factor-card.active{background:#ffffff0d}.mfa-factor-icon-wrapper{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin:0 auto .75rem;transition:var(--transition-fast)}.mfa-factor-title{font-size:.85rem;font-weight:600;color:var(--text-main);margin-bottom:.35rem}.mfa-factor-examples{font-size:.75rem;color:var(--text-dim);line-height:1.4}.mfa-result{display:flex;align-items:center;gap:.5rem;padding:.6rem 1.25rem;border-radius:8px;font-size:.85rem}.mfa-result strong{font-weight:700}.mfa-result.weak{background:#ff00551f;color:var(--accent);border:1px solid rgba(255,0,85,.25)}.mfa-result.strong{background:#00ff9d1f;color:#00ff9d;border:1px solid rgba(0,255,157,.25)}.e2e-viz-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%}.e2e-flow{display:flex;align-items:center;justify-content:center;gap:.5rem}.e2e-message{padding:.5rem .75rem;border-radius:12px;font-size:.8rem;max-width:120px;text-align:center}.e2e-message.readable{background:#00ff9d26;border:1px solid rgba(0,255,157,.3);color:#00ff9d}.e2e-message.encrypted{background:#7000ff26;border:1px solid rgba(112,0,255,.3);color:var(--secondary-text);font-family:monospace;letter-spacing:1px}.e2e-server-note{display:flex;align-items:center;gap:.35rem;font-size:.75rem;color:var(--text-dim);padding:.35rem .75rem;background:#0000004d;border-radius:6px}.tracker-viz-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;min-width:0}.tracker-header{display:flex;justify-content:center}.tracker-status{display:flex;align-items:center;gap:.4rem;padding:.4rem .8rem;border-radius:6px;font-size:.8rem;font-weight:600}.tracker-status.exposed{background:#ff005526;color:var(--accent);border:1px solid rgba(255,0,85,.3)}.tracker-status.protected{background:#00ff9d26;color:#00ff9d;border:1px solid rgba(0,255,157,.3)}.tracker-flow{display:flex;align-items:center;gap:.5rem;width:100%;justify-content:center;min-width:0}.tracker-node{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.6rem;border-radius:10px;background:var(--bg-card);border:1px solid var(--border-light);position:relative}.tracker-node.user{border-color:var(--primary)}.tracker-node-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#00f2ff1a}.tracker-node-label{font-size:.7rem;color:var(--text-muted);white-space:nowrap}.tracker-sites{display:flex;gap:.25rem}.tracker-site-wrapper{display:flex;align-items:center}.tracker-connection{width:24px;height:2px;background:var(--border-light);border-radius:1px}.tracker-eye,.tracker-blocked{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center}.tracker-eye{background:#f053;border:1px solid var(--accent)}.tracker-blocked{background:#00ff9d33;border:1px solid #00ff9d}.tracker-profile{display:flex;flex-direction:column;gap:.4rem;padding:.6rem .8rem;border-radius:8px;background:#ff005514;border:1px solid rgba(255,0,85,.2);min-width:100px}.tracker-profile.blocked{background:#00ff9d14;border:1px solid rgba(0,255,157,.2)}.tracker-profile-header{display:flex;align-items:center;gap:.3rem;font-size:.7rem;font-weight:600;color:var(--accent)}.tracker-profile.blocked .tracker-profile-header{color:#00ff9d}.tracker-profile-data{display:flex;flex-direction:column;gap:.2rem}.tracker-data-item{font-size:.65rem;color:var(--text-dim);font-family:monospace}.tracker-explanation{font-size:.8rem;color:var(--text-muted);text-align:center;max-width:400px;margin:0;line-height:1.4}.tracker-explainer{background:#0000004d;border:1px solid var(--border-light);border-radius:8px;padding:.75rem;width:100%;max-width:400px}.tracker-explainer-header{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:var(--accent);margin-bottom:.5rem}.tracker-explainer-content p{font-size:.75rem;color:var(--text-muted);margin:0 0 .5rem;line-height:1.5}.tracker-explainer-content.protected p{color:#00ff9d}.tracker-company-list{display:flex;flex-direction:column;gap:.35rem}.tracker-company-label{font-size:.65rem;color:var(--text-dim)}.tracker-company-tags{display:flex;flex-wrap:wrap;gap:.25rem}.tracker-company-tag{font-size:.6rem;padding:.15rem .35rem;background:#ff005526;border-radius:4px;color:var(--accent)}.tracker-profile-enhanced{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:linear-gradient(135deg,#ff005514,#ff005505);border:1px solid rgba(255,0,85,.2);border-radius:10px;min-width:180px;max-width:200px;overflow-wrap:anywhere}.tracker-profile-categories{display:flex;flex-direction:column;gap:.5rem}.tracker-profile-category{padding:.4rem 0;border-bottom:1px solid rgba(255,255,255,.05)}.tracker-profile-category:last-child{border-bottom:none;padding-bottom:0}.tracker-category-source{font-size:.65rem;color:var(--text-muted);font-weight:600;display:block;margin-bottom:.25rem}.tracker-data-points{display:flex;flex-direction:column;gap:.2rem}.tracker-data-point{display:flex;align-items:center;gap:.25rem;font-size:.6rem;color:var(--text-dim)}.tracker-data-type{color:var(--text-muted)}.tracker-data-value{color:var(--accent);font-style:italic}.tracker-profile-summary{display:flex;align-items:center;gap:.35rem;padding-top:.4rem;margin-top:.25rem;border-top:1px dashed rgba(255,0,85,.3);font-size:.6rem;color:var(--accent)}.tracker-blocked-message{font-size:.7rem;color:#00ff9d;margin:0}.tracker-impact{width:100%;max-width:400px;padding:.75rem;background:#ff00550d;border:1px solid rgba(255,0,85,.15);border-radius:8px}.tracker-impact h5{font-size:.8rem;color:var(--text-main);margin:0 0 .5rem}.tracker-impact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.35rem}.tracker-impact-list li{display:flex;align-items:center;gap:.4rem;font-size:.7rem;color:var(--text-muted)}.tracker-impact-list li span{flex:1}.phishing-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.phishing-email{background:#0006;border:1px solid var(--border-light);border-radius:10px;overflow:hidden;font-size:.85rem}.phishing-email-header{display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;background:#ffffff08;border-bottom:1px solid var(--border-light);font-size:.75rem;color:var(--text-dim)}.phishing-field{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.5rem .8rem;border-bottom:1px solid rgba(255,255,255,.05);position:relative;border:1px solid transparent;margin:2px;border-radius:4px}.phishing-field-label{font-size:.75rem;color:var(--text-dim);min-width:50px}.phishing-field-value{color:var(--text-main);font-size:.8rem}.phishing-fake{color:var(--accent);font-family:monospace}.phishing-urgent{color:var(--accent);font-weight:600}.phishing-body{padding:.8rem}.phishing-greeting{margin-bottom:.5rem;color:var(--text-main);position:relative}.phishing-text{font-size:.8rem;color:var(--text-muted);margin-bottom:.75rem;line-height:1.4}.phishing-link-wrapper{display:inline-flex;flex-direction:column;gap:.3rem;padding:4px 8px;border-radius:4px;border:1px solid transparent;margin-bottom:.75rem;position:relative}.phishing-link{display:inline-flex;align-items:center;gap:.3rem;color:var(--primary);font-size:.8rem;text-decoration:underline}.phishing-url-reveal{display:flex;flex-direction:column;gap:.15rem;padding:.4rem .5rem;background:#ff00551a;border-radius:4px;border:1px solid rgba(255,0,85,.2)}.phishing-url-label{font-size:.65rem;color:var(--text-dim)}.phishing-url-fake{font-size:.7rem;color:var(--accent);font-family:monospace;word-break:break-all}.phishing-attachment{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .6rem;background:#ffffff08;border:1px solid transparent;border-radius:6px;font-size:.75rem;color:var(--text-muted);position:relative}.phishing-flag{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .5rem;background:#ff005526;border:1px solid rgba(255,0,85,.3);border-radius:4px;font-size:.7rem;color:var(--accent);white-space:nowrap;margin-left:.5rem}.phishing-flag.inline{margin-left:.75rem}.phishing-legend{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:#0003;border-radius:8px}.phishing-legend-title{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:var(--accent)}.phishing-legend-items{display:flex;flex-wrap:wrap;gap:.4rem}.phishing-legend-item{display:flex;align-items:center;gap:.3rem;padding:.25rem .5rem;background:#ffffff08;border:1px solid var(--border-light);border-radius:4px;font-size:.7rem;color:var(--text-muted);transition:var(--transition-fast)}.phishing-legend-item.active{background:#ff00551a;border-color:#ff00554d;color:var(--accent)}.phishing-legend-number{width:16px;height:16px;display:flex;align-items:center;justify-content:center;background:#f053;border-radius:50%;font-size:.65rem;font-weight:600}@media(prefers-reduced-motion:reduce){.animate-fade-in{animation:none!important;transform:none!important}.viz-packet,.viz-node,.mfa-factor-card,.e2e-message,.tracker-node,.tracker-eye,.phishing-flag{animation:none!important;transition:opacity .2s ease!important}}@media(max-width:768px){.viz-content{flex-direction:column;min-height:auto;padding:1rem 0}.vpn-viz-row{flex-wrap:nowrap;padding-left:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:.5rem;justify-content:flex-start}.vpn-viz-row::-webkit-scrollbar{display:none}.vpn-viz-row{width:100%}.vpn-viz-row .viz-connection-md{width:100px;min-width:100px}.vpn-viz-row .viz-connection-lg{width:130px;min-width:130px}.vpn-viz-wrapper{gap:1rem}.viz-connection,.viz-connection-xs{width:20px;min-width:20px}.viz-connection-sm{width:25px;min-width:25px}.viz-connection-md{width:35px;min-width:35px}.viz-connection-lg{width:45px;min-width:45px}.viz-node{min-width:60px;padding:.5rem}.viz-node-icon{width:32px;height:32px}.viz-node-label{font-size:.65rem}.mfa-factors-row{gap:.75rem}.mfa-factor-card{min-width:100px;max-width:none;padding:1rem .75rem}.mfa-factor-icon-wrapper{width:40px;height:40px}.mfa-factor-title{font-size:.8rem}.mfa-factor-examples{font-size:.7rem}.mfa-explanation{font-size:.85rem}.e2e-flow{flex-wrap:wrap}.tracker-flow{flex-wrap:wrap;gap:.75rem}.tracker-eye,.tracker-blocked{top:2px;right:2px}.tracker-sites{flex-wrap:wrap;justify-content:center}.tracker-profile{min-width:auto}.tracker-explainer,.tracker-impact,.tracker-profile-enhanced{max-width:100%;width:100%}.tracker-profile-enhanced{min-width:0}.phishing-field{flex-direction:column;align-items:flex-start}.phishing-flag{margin-left:0;margin-top:.3rem}.phishing-legend-items{flex-direction:column}.tool-list-item{grid-template-columns:auto 1fr;gap:.65rem;padding:.75rem}.tool-list-action{grid-column:2;white-space:normal}}.dns-viz-wrapper{display:flex;flex-direction:column;gap:1.5rem;width:100%}.dns-map{display:block;width:100%;max-width:680px;height:auto;margin:0 auto;font-family:inherit;overflow:visible}.dns-map-link{fill:none;stroke:var(--border-light);stroke-width:1.5;opacity:.55;transition:stroke .3s ease,opacity .3s ease,stroke-width .3s ease}.dns-map-arrow.done .dns-map-link{opacity:.9}.dns-map-arrow.q.done .dns-map-link{stroke:#00f2ff73}.dns-map-arrow.a.done .dns-map-link{stroke:#00ff9d73}.dns-map-arrow.active .dns-map-link{opacity:1;stroke-width:2.5}.dns-map-arrow.q.active .dns-map-link{stroke:var(--primary);filter:drop-shadow(0 0 4px var(--primary-glow))}.dns-map-arrow.a.active .dns-map-link{stroke:#00ff9d;filter:drop-shadow(0 0 4px rgba(0,255,157,.6))}.dns-map-badge circle{fill:var(--bg-dark);stroke:var(--border-light);stroke-width:1;transition:stroke .3s ease}.dns-map-badge text{fill:var(--text-dim);font-size:9.5px;font-weight:600;transition:fill .3s ease}.dns-map-arrow.active .dns-map-badge circle{fill:var(--bg-card)}.dns-map-arrow.q.active .dns-map-badge circle{stroke:var(--primary)}.dns-map-arrow.a.active .dns-map-badge circle{stroke:#00ff9d}.dns-map-arrow.active .dns-map-badge text{fill:var(--text-main)}.dns-map-dot{filter:drop-shadow(0 0 6px currentColor)}.dns-map-ring{fill:var(--bg-card);stroke:var(--node-color, var(--border-light));stroke-width:2;transition:filter .3s ease}.dns-map-node.active .dns-map-ring{filter:drop-shadow(0 0 8px var(--node-color, var(--primary)))}.dns-map-label{fill:var(--text-muted);font-size:11.5px;transition:fill .3s ease}.dns-map.compact .dns-map-label{font-size:12.5px}.dns-map-node.active .dns-map-label{fill:var(--text-main);font-weight:600}.dns-map-cached rect{fill:#00ff9d1f;stroke:#00ff9d99;stroke-width:1}.dns-map-cached text{fill:#00ff9d;font-size:10px;font-weight:600}.dns-map-legend{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1.25rem;font-size:.72rem;color:var(--text-dim)}.dns-map-legend-item{display:inline-flex;align-items:center;gap:.35rem}.dns-map-swatch{display:inline-block;width:18px;height:3px;border-radius:2px}.dns-map-swatch.q{background:var(--primary)}.dns-map-swatch.a{background:#00ff9d}.dns-map-legend-note{flex-basis:100%;text-align:center;color:var(--text-muted);font-style:italic}.dns-query-display{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;background:#0000004d;border-radius:8px}.dns-query-label{font-size:.75rem;color:var(--text-dim)}.dns-query-text{font-family:monospace;font-size:.85rem;color:var(--primary)}.dns-query-arrow{color:var(--text-dim)}.dns-query-result,.dns-response-text{font-family:monospace;font-size:.85rem;color:#00ff9d}.dns-response-text strong{color:#00ff9d}.dns-explanation-panel{background:#00f2ff0d;border:1px solid rgba(0,242,255,.2);border-radius:10px;padding:1rem;text-align:center}.dns-step-header{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.5rem}.dns-step-number{font-size:.7rem;color:var(--primary);text-transform:uppercase;letter-spacing:1px}.dns-step-title{font-size:1rem;color:var(--text-main);margin:0}.dns-step-desc{font-size:.85rem;color:var(--text-muted);margin:0}.dns-step-detail{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-light)}.dns-step-detail p{font-size:.8rem;color:var(--text-dim);margin:0 0 .5rem;line-height:1.5}.dns-server-role{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem;background:#7000ff1a;border-radius:6px;font-size:.75rem;color:var(--secondary-text);text-align:left}.dns-packet-status{align-self:center;max-width:100%;font-family:monospace;font-size:.75rem;line-height:1.4;padding:.35rem .65rem;background:var(--bg-card);border:1px solid var(--primary);border-radius:6px;color:var(--primary);text-align:center;overflow-wrap:anywhere}.dns-technical{margin-top:.5rem;font-size:.75rem;color:var(--text-dim)}.dns-technical summary{cursor:pointer;color:var(--text-muted);padding:.25rem}.dns-technical[open] summary{margin-bottom:.5rem}.dns-technical p{margin:0;padding:.5rem;background:#0003;border-radius:4px;line-height:1.5}.osi-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%;min-width:0}.osi-stack{display:flex;flex-direction:column;gap:.35rem;width:100%;min-width:0}.osi-layer{display:flex;align-items:center;gap:.75rem;padding:.6rem .8rem;border-radius:8px;background:var(--bg-card);border:1px solid var(--border-light);transition:var(--transition-fast);min-width:0}.osi-layer.active{transform:translate(4px)}.osi-layer-num{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:.8rem;font-weight:700;color:var(--bg-dark);flex-shrink:0}.osi-layer-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#ffffff0d;flex-shrink:0}.osi-layer-content{flex:1;min-width:0}.osi-layer-info{display:flex;align-items:baseline;gap:.5rem;min-width:0}.osi-layer-name{font-size:.85rem;font-weight:600;color:var(--text-main);overflow-wrap:anywhere}.osi-layer-example{font-size:.7rem;color:var(--text-dim);overflow-wrap:anywhere}.osi-packet{display:flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:#00f2ff26;border:1px solid var(--primary);border-radius:4px;font-size:.65rem;color:var(--primary);margin-left:auto;flex-shrink:0}.osi-legend{display:flex;justify-content:center;gap:1rem;padding-top:.5rem;flex-wrap:wrap}.osi-legend-item{display:flex;align-items:center;gap:.35rem;font-size:.75rem;color:var(--text-muted)}.ports-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%;align-items:center}.ports-building{width:100%;max-width:560px;border:2px solid var(--border-light);border-radius:12px;background:#00000040;overflow:hidden}.ports-building-roof{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.5rem;padding:.55rem 1rem;background:#00f2ff14;border-bottom:1px solid rgba(0,242,255,.35);font-size:.8rem;color:var(--primary)}.ports-building-name{font-weight:600}.ports-ip{font-family:monospace;background:#0000004d;padding:.2rem .5rem;border-radius:4px}.ports-rows{display:flex;flex-direction:column;gap:.4rem;padding:.6rem}.ports-row{display:grid;grid-template-columns:132px 34px 1fr;align-items:center;gap:.25rem}.ports-visitor-cell{min-height:34px;display:flex;align-items:center;justify-content:flex-end}.ports-visitor{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;background:#7000ff2e;border:1px solid var(--secondary);border-radius:999px;font-size:.75rem;color:var(--text-main);white-space:nowrap}.ports-visitor-dest{font-family:monospace;font-weight:700;color:var(--port-color, var(--primary))}.ports-knock-cell{display:flex;justify-content:center;color:var(--port-color, var(--primary))}.ports-knock{display:inline-flex}.ports-door{display:flex;align-items:center;gap:.6rem;padding:.5rem .65rem;background:var(--bg-card);border:2px solid var(--border-light);border-radius:8px;transition:border-color .3s ease,box-shadow .3s ease}.ports-row.active .ports-door{border-color:var(--port-color);box-shadow:0 0 15px color-mix(in srgb,var(--port-color) 30%,transparent)}.ports-door-icon{display:inline-flex;color:var(--text-dim);transition:color .3s ease}.ports-row.active .ports-door-icon{color:var(--port-color)}.ports-apartment-num{font-size:.75rem;font-weight:700;font-family:monospace;padding:.25rem .5rem;border-radius:4px;color:var(--bg-dark);background:var(--port-color, var(--primary))}.ports-apartment-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center}.ports-apartment-info{flex:1;display:flex;flex-direction:column}.ports-service{font-size:.8rem;font-weight:600;color:var(--text-main)}.ports-desc{font-size:.7rem;color:var(--text-dim)}.ports-resident{font-size:.65rem;padding:.2rem .5rem;background:#00ff9d26;border:1px solid #00ff9d;border-radius:4px;color:#00ff9d}.protocols-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.protocols-toggle{display:flex;justify-content:center;gap:.5rem}.protocols-toggle-btn{padding:.5rem 1rem;background:var(--bg-card);border:1px solid var(--border-light);border-radius:8px;color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:var(--transition-fast)}.protocols-toggle-btn:hover{border-color:var(--primary)}.protocols-toggle-btn.active{background:#00f2ff1a;border-color:var(--primary);color:var(--primary)}.protocols-comparison{display:flex;flex-direction:column;gap:.75rem}.protocols-lane{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--bg-card);border:1px solid var(--border-light);border-radius:10px;opacity:.5;transition:opacity .4s ease,border-color .4s ease,box-shadow .4s ease}.protocols-lane.active{opacity:1;border-color:var(--lane-color);box-shadow:0 0 14px color-mix(in srgb,var(--lane-color) 22%,transparent)}.protocols-lane.http{--lane-color: var(--accent)}.protocols-lane.https,.protocols-lane.tcp{--lane-color: #00ff9d}.protocols-lane.udp{--lane-color: #ffa94d}.protocols-lane-header{display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--lane-color)}.protocols-path{display:flex;align-items:center;gap:.5rem}.protocols-endpoint{display:flex;flex-direction:column;align-items:center;gap:.2rem;width:74px;flex-shrink:0;padding:.45rem .25rem;border:1px solid var(--border-light);border-radius:8px;background:#00000040;color:var(--text-muted);position:relative}.protocols-endpoint-label{font-size:.65rem}.protocols-lane-track{flex:1;position:relative;min-height:72px;border-radius:6px;background:#0003}.protocols-track-line{position:absolute;left:4%;right:4%;top:50%;height:2px;background:var(--border-light);transform:translateY(-50%)}.protocols-track-line.sealed{height:8px;border-radius:4px;background:#00ff9d2e;border:1px dashed rgba(0,255,157,.5)}.protocols-packet{position:absolute;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;gap:.25rem;padding:.3rem .55rem;border-radius:6px;font-size:.72rem;white-space:nowrap;z-index:1}.protocols-packet.plain{background:#ff005526;border:1px solid var(--accent);color:var(--accent)}.protocols-packet.encrypted{background:#00ff9d26;border:1px solid #00ff9d;color:#00ff9d}.protocols-packet.tcp-packet,.protocols-packet.udp-packet{width:26px;height:26px;padding:0;font-weight:600}.protocols-packet.tcp-packet{background:#00ff9d26;border:1px solid #00ff9d;color:#00ff9d}.protocols-packet.udp-packet{background:#ffa94d26;border:1px solid #ffa94d;color:#ffa94d}.protocols-packet.udp-packet.lost{border-style:dashed;color:var(--accent);border-color:var(--accent);background:#ff00551f}.protocols-watcher{position:absolute;left:50%;bottom:4px;transform:translate(-50%);display:flex;align-items:center;gap:.35rem;font-size:.66rem;color:var(--accent);white-space:nowrap;transition:transform .3s ease}.protocols-watcher.safe{color:#00ff9d}.protocols-watcher-bubble{padding:.1rem .4rem;border:1px solid currentColor;border-radius:999px;font-family:monospace;background:#00000059}.protocols-watcher.reading{transform:translate(-50%) scale(1.12)}.protocols-watcher.reading .protocols-watcher-bubble{box-shadow:0 0 10px #ff005580;background:#f053}.protocols-watcher-label{color:var(--text-dim)}.protocols-padlock{position:absolute;top:-10px;right:-8px;display:inline-flex;align-items:center;gap:.15rem;padding:.1rem .4rem;border-radius:999px;background:#00ff9d33;border:1px solid #00ff9d;color:#00ff9d;font-size:.6rem;font-weight:700}.protocols-received{display:flex;gap:.2rem;margin-top:.15rem}.protocols-slot{width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;border:1px dashed var(--border-light);border-radius:3px;font-size:.6rem;font-weight:600;color:var(--bg-dark);transition:background .3s ease,border-color .3s ease}.protocols-slot.filled{background:var(--lane-color);border-style:solid;border-color:var(--lane-color)}.protocols-slot.missing{border-color:var(--accent);background:#ff005526}.protocols-trait{position:absolute;left:50%;bottom:4px;transform:translate(-50%);display:inline-flex;align-items:center;gap:.25rem;font-size:.66rem;color:var(--text-dim);white-space:nowrap}.firewall-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.firewall-zones{display:flex;align-items:center;justify-content:center;gap:.5rem}.firewall-zone{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.75rem;border-radius:10px;background:var(--bg-card);border:1px solid var(--border-light);min-width:80px}.firewall-zone span{font-size:.75rem;color:var(--text-muted)}.firewall-zone.external{border-color:var(--accent)}.firewall-zone.internal{border-color:#00ff9d}.firewall-wall{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem 1rem;background:linear-gradient(135deg,#7000ff26,#00f2ff26);border:2px solid var(--primary);border-radius:12px}.firewall-rules{display:flex;flex-direction:column;gap:.2rem}.firewall-rule{font-size:.65rem;font-family:monospace;padding:.15rem .4rem;border-radius:4px}.firewall-rule.allow{background:#00ff9d26;color:#00ff9d}.firewall-rule.deny{background:#ff005526;color:var(--accent)}.firewall-packets{display:flex;justify-content:center;align-items:center;min-height:50px;position:relative}.firewall-packet{display:flex;align-items:center;gap:.25rem;padding:.3rem .5rem;border-radius:6px;font-size:.75rem;position:absolute}.firewall-packet.allowed{background:#00ff9d26;border:1px solid #00ff9d;color:#00ff9d}.firewall-packet.blocked{background:#ff005526;border:1px solid var(--accent);color:var(--accent)}.firewall-packet-port{font-family:monospace;font-weight:600}.firewall-checking{font-size:.6rem;color:var(--text-dim);margin-left:.25rem}.firewall-legend{display:flex;justify-content:center;gap:1rem}.firewall-legend-item{display:flex;align-items:center;gap:.35rem;font-size:.75rem}.firewall-legend-item.allowed{color:#00ff9d}.firewall-legend-item.blocked{color:var(--accent)}.tls-viz-wrapper{display:flex;flex-direction:column;gap:1.25rem;width:100%}.tls-ladder{--tls-endpoint-width: 108px;position:relative;width:100%;max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:.5rem}.tls-ladder-head{display:flex;justify-content:space-between}.tls-endpoint{display:flex;flex-direction:column;align-items:center;gap:.3rem;width:var(--tls-endpoint-width);padding:.6rem .5rem;border-radius:10px;background:var(--bg-card);border:2px solid var(--border-light);transition:border-color .4s ease,box-shadow .4s ease}.tls-endpoint span{font-size:.75rem;color:var(--text-muted)}.tls-ladder.secure .tls-endpoint{border-color:#00ff9d;box-shadow:0 0 18px #00ff9d4d}.tls-ladder-rows{position:relative;margin:0 calc(var(--tls-endpoint-width) / 2);padding:.25rem 0 .5rem}.tls-ladder-rows:before,.tls-ladder-rows:after{content:"";position:absolute;top:0;bottom:0;width:2px;background:var(--border-light);transition:background .4s ease}.tls-ladder-rows:before{left:-1px}.tls-ladder-rows:after{right:-1px}.tls-ladder.secure .tls-ladder-rows:before,.tls-ladder.secure .tls-ladder-rows:after{background:#00ff9d99}.tls-ladder-row{position:relative;height:60px;color:var(--rung-color, var(--text-muted));transition:opacity .4s ease}.tls-ladder-row.upcoming{opacity:.32}.tls-ladder-row.done{opacity:.7}.tls-ladder-label{position:absolute;top:8px;left:50%;transform:translate(-50%);display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .6rem .25rem .3rem;border-radius:999px;border:1px solid currentColor;background:var(--bg-dark);font-size:.72rem;font-weight:600;white-space:nowrap;z-index:1}.tls-ladder-row.active .tls-ladder-label{box-shadow:0 0 12px color-mix(in srgb,currentColor 45%,transparent)}.tls-ladder-num{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:currentColor;font-size:.6rem}.tls-ladder-num:before{content:attr(data-n)}.tls-ladder-row .tls-ladder-num{color:var(--bg-dark);background:var(--rung-color, var(--text-muted))}.tls-ladder-line{position:absolute;left:0;right:0;top:44px;height:2px;background:currentColor}.tls-ladder-row.both .tls-ladder-line{height:6px;top:42px;border-radius:3px;background:linear-gradient(90deg,#00ff9d59,#00ff9d,#00ff9d59)}.tls-ladder-head-left,.tls-ladder-head-right{position:absolute;top:50%;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;transform:translateY(-50%);display:none}.tls-ladder-head-right{right:-1px;border-left:10px solid currentColor}.tls-ladder-head-left{left:-1px;border-right:10px solid currentColor}.tls-ladder-row.right .tls-ladder-head-right,.tls-ladder-row.left .tls-ladder-head-left,.tls-ladder-row.both .tls-ladder-head-left,.tls-ladder-row.both .tls-ladder-head-right{display:block}.tls-ladder-dot{position:absolute;top:45px;width:12px;height:12px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor;transform:translate(-50%,-50%);z-index:2}.tls-secure-tunnel{align-self:center;display:flex;align-items:center;gap:.4rem;padding:.35rem .75rem;background:#00ff9d26;border:1px solid #00ff9d;border-radius:8px;color:#00ff9d;font-size:.75rem;font-weight:600}.tls-explanation-panel{background:#00f2ff0d;border:1px solid rgba(0,242,255,.2);border-radius:10px;padding:1rem;text-align:center}.tls-step-header{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.5rem}.tls-step-number{font-size:.7rem;color:var(--primary);text-transform:uppercase;letter-spacing:1px}.tls-step-title{font-size:1rem;color:var(--text-main);margin:0}.tls-step-desc{font-size:.85rem;color:var(--text-muted);margin:0}.tls-step-detail{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-light)}.tls-step-detail p{font-size:.8rem;color:var(--text-dim);margin:0 0 .5rem;line-height:1.5}.tls-whats-sent{display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem;margin-bottom:.5rem}.tls-sent-item{font-size:.65rem;padding:.2rem .4rem;background:#00f2ff1a;border:1px solid rgba(0,242,255,.2);border-radius:4px;color:var(--primary)}.tls-analogy{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem;background:#7000ff1a;border-radius:6px;font-size:.75rem;font-style:italic;color:var(--secondary-text)}.tls-why-matters{text-align:center;padding:.5rem .75rem;background:#00ff9d0d;border:1px solid rgba(0,255,157,.15);border-radius:6px}.tls-why-matters p{font-size:.75rem;color:var(--text-muted);margin:0;line-height:1.5}.ipv-viz-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%;min-width:0}.ipv-comparison{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.ipv-version{flex:1;min-width:200px;max-width:280px;display:flex;flex-direction:column;gap:.75rem;padding:1rem;background:var(--bg-card);border:1px solid var(--border-light);border-radius:12px;overflow-wrap:anywhere}.ipv-version.v4{border-color:var(--accent)}.ipv-version.v6{border-color:#00ff9d}.ipv-header{display:flex;align-items:center;gap:.4rem}.ipv-label{font-size:.9rem;font-weight:600}.ipv-version.v4 .ipv-label{color:var(--accent)}.ipv-version.v6 .ipv-label{color:#00ff9d}.ipv-address{display:flex;align-items:center;padding:.5rem .75rem;background:#0000004d;border-radius:6px;font-family:monospace;min-width:0}.ipv-address-text{font-size:.85rem;color:var(--text-main);overflow-wrap:anywhere;word-break:break-word}.ipv-address-text.v6{font-size:.7rem}.ipv-cursor{color:var(--primary);margin-left:2px}.ipv-divider{display:flex;align-items:center;justify-content:center;padding:0 .5rem;color:var(--text-dim);font-size:.85rem;font-weight:600}.ipv-pool{display:flex;flex-direction:column;gap:.4rem}.ipv-pool-label{font-size:.7rem;color:var(--text-dim)}.ipv-pool-bar{position:relative;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.ipv-pool-fill{height:100%;border-radius:4px;transition:width .5s ease}.ipv-pool-fill.depleted{background:linear-gradient(90deg,var(--accent),#ff6b6b)}.ipv-pool-fill.unlimited{background:linear-gradient(90deg,#00ff9d,var(--primary))}.ipv-pool-infinite{position:absolute;right:4px;top:50%;transform:translateY(-50%)}.ipv-pool-status{display:flex;align-items:center;gap:.25rem;font-size:.7rem}.ipv-pool-status.depleted{color:var(--accent)}.ipv-pool-status.unlimited{color:#00ff9d}.ai-part-divider{display:flex;align-items:center;gap:1rem;margin:2.5rem 0 1.5rem;color:var(--primary);font-size:.8rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}.ai-part-divider:before,.ai-part-divider:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(0,242,255,.4),transparent)}.aim-wrapper{display:flex;flex-direction:column;gap:.75rem;width:100%}.aim-lane{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border:1px solid var(--border-light);border-radius:10px;background:var(--bg-card);opacity:.55;transition:opacity .4s ease,border-color .4s ease,box-shadow .4s ease}.aim-lane.active{opacity:1;border-color:var(--lane-color);box-shadow:0 0 14px color-mix(in srgb,var(--lane-color) 22%,transparent)}.aim-lane.done{opacity:.8}.aim-lane.chat{--lane-color: var(--primary)}.aim-lane.rag{--lane-color: #ffa94d}.aim-lane.agent{--lane-color: var(--accent)}.aim-lane-label{flex-shrink:0;width:52px;font-size:.72rem;font-weight:700;color:var(--lane-color);text-transform:uppercase;letter-spacing:.5px}.aim-track{position:relative;flex:1;display:flex;align-items:center;gap:.35rem;min-width:0;overflow-x:auto;scrollbar-width:none;padding:.35rem .25rem}.aim-track::-webkit-scrollbar{display:none}.aim-node{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:.2rem;width:112px;padding:.5rem .4rem;border-radius:8px;border:1px solid var(--border-light);background:#0000004d;color:var(--text-muted);text-align:center}.aim-node.lit{color:var(--text-main);border-color:color-mix(in srgb,var(--lane-color) 60%,transparent)}.aim-node-label{font-size:.7rem;font-weight:600}.aim-node-text{font-size:.62rem;color:var(--lane-color);line-height:1.3}.aim-node-tag{font-size:.58rem;color:var(--text-dim);font-style:italic;line-height:1.2}.aim-chips{display:flex;flex-direction:column;gap:.2rem}.aim-chip{font-family:monospace;font-size:.6rem;padding:.1rem .35rem;border-radius:4px;border:1px dashed var(--border-light);color:var(--text-dim)}.aim-chip.lit{border-style:solid;border-color:var(--lane-color);color:var(--lane-color)}.aim-arrow{flex-shrink:0;color:var(--text-dim);font-size:1rem;transition:color .3s ease}.aim-arrow.lit{color:var(--lane-color)}.aim-loop{display:inline-flex}.aim-dot{position:absolute;top:50%;width:10px;height:10px;border-radius:50%;background:var(--lane-color);box-shadow:0 0 8px var(--lane-color);transform:translate(-50%,-50%);pointer-events:none}.pf-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.pf-map{display:grid;grid-template-columns:1fr 96px 1fr auto 1fr auto 1fr;grid-template-rows:auto auto;align-items:start;gap:.5rem .35rem;width:100%}.pf-node{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.6rem .4rem;border-radius:10px;border:1px solid var(--border-light);background:var(--bg-card);color:var(--text-muted);text-align:center;min-width:0}.pf-node.lit{color:var(--text-main);border-color:#00f2ff80}.pf-node.current{box-shadow:0 0 14px #00f2ff40}.pf-node.off{border-style:dashed}.pf-node-label{font-size:.72rem;font-weight:600}.pf-copy{display:inline-flex;align-items:center;gap:.25rem;max-width:100%;padding:.15rem .4rem;border-radius:999px;background:#ff005526;border:1px solid rgba(255,0,85,.5);color:var(--accent);font-family:monospace;font-size:.58rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pf-note{font-size:.6rem;color:var(--text-dim);line-height:1.2}.pf-arrow{position:relative;align-self:center;width:44px;height:44px;margin-top:28px;display:flex;align-items:center;justify-content:center;color:var(--text-dim)}.pf-map>.pf-arrow:nth-child(2){width:100%}.pf-arrow-line{position:absolute;left:0;right:0;top:50%;height:2px;background:var(--border-light);transition:background .3s ease}.pf-arrow-line:after{content:"";position:absolute;right:-1px;top:-4px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor}.pf-arrow.lit{color:var(--primary)}.pf-arrow.lit .pf-arrow-line{background:var(--primary)}.pf-arrow.cut .pf-arrow-line{background:repeating-linear-gradient(90deg,var(--border-light) 0 4px,transparent 4px 8px)}.pf-arrow.cut .pf-arrow-line:after{display:none}.pf-cut{position:relative;color:var(--accent);background:var(--bg-card)}.pf-arrow-badge{position:absolute;top:-4px;left:50%;transform:translate(-50%);display:inline-flex;align-items:center;gap:.2rem;padding:.05rem .35rem;border-radius:999px;background:var(--bg-dark);border:1px solid currentColor;font-size:.55rem;font-weight:700;white-space:nowrap}.pf-watcher{position:absolute;top:34px;left:50%;transform:translate(-50%);display:inline-flex;align-items:center;gap:.2rem;width:96px;font-size:.55rem;line-height:1.2;color:var(--text-dim);text-align:center;justify-content:center}.pf-dot{position:absolute;top:50%;width:10px;height:10px;border-radius:50%;background:var(--primary);box-shadow:0 0 8px var(--primary-glow);transform:translate(-50%,-50%)}.pf-toggle{display:inline-flex;align-items:center;gap:.35rem;margin-top:.2rem;padding:.2rem .5rem .2rem .2rem;border-radius:999px;border:1px solid var(--border-light);background:#0000004d;color:var(--text-muted);font:inherit;font-size:.62rem;cursor:pointer}.pf-toggle-knob{width:22px;height:12px;border-radius:999px;background:var(--border-light);position:relative;transition:background .3s ease}.pf-toggle-knob:after{content:"";position:absolute;top:2px;left:2px;width:8px;height:8px;border-radius:50%;background:var(--text-main);transition:transform .3s ease}.pf-toggle.on{border-color:var(--accent);color:var(--accent)}.pf-toggle.on .pf-toggle-knob{background:var(--accent)}.pf-toggle.on .pf-toggle-knob:after{transform:translate(10px)}.pf-branch{grid-column:3;grid-row:2;position:relative;padding-top:26px}.pf-branch-line{position:absolute;left:50%;top:0;width:2px;height:26px;background:var(--border-light);transition:background .3s ease}.pf-branch.lit .pf-branch-line{background:var(--primary)}.pi-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.pi-transcript{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;border-radius:10px;background:#0000004d;border:1px solid var(--border-light);font-family:monospace;min-height:120px}.pi-turn{display:flex;flex-direction:column;gap:.3rem;padding:.5rem .7rem;border-radius:8px;border:1px solid var(--border-light);border-left-width:3px;background:var(--bg-card);font-size:.78rem;line-height:1.45;color:var(--text-main)}.pi-turn.user{border-left-color:var(--primary)}.pi-turn.agent{border-left-color:var(--secondary)}.pi-turn.tool{border-left-color:var(--text-dim)}.pi-turn.danger{border-color:#ff005580;border-left-color:var(--accent);background:#ff00550f}.pi-turn.alarm{border-color:var(--accent);border-left-color:var(--accent);background:#ff005524;box-shadow:0 0 14px #ff005559}.pi-turn.safe{border-color:#00ff9d73;border-left-color:#00ff9d;background:#00ff9d0f}.pi-turn.locked{border-style:dashed;color:var(--text-muted)}.pi-turn.dialog{border-color:#ffa94d99;border-left-color:#ffa94d;background:#ffa94d14}.pi-turn.quiet{border-left-color:var(--secondary)}.pi-turn.current{outline:1px solid rgba(255,255,255,.12)}.pi-role{display:inline-flex;align-items:center;gap:.35rem;font-size:.66rem;text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim)}.pi-tool-name{padding:.05rem .35rem;border-radius:4px;background:#ffffff12;color:var(--text-muted);text-transform:none;letter-spacing:0}.pi-text{display:inline-flex;align-items:flex-start;gap:.35rem}.pi-hidden{padding:.35rem .5rem;border-radius:6px;border:1px dashed var(--accent);background:#ff00551a;color:var(--accent);font-size:.72rem}.pi-dialog{display:flex;gap:.4rem;margin-top:.2rem}.pi-dialog-btn{padding:.2rem .6rem;border-radius:6px;border:1px solid var(--border-light);color:var(--text-muted);font-size:.7rem}.pi-dialog-btn.deny{border-color:#00ff9d;color:#00ff9d;background:#00ff9d1f;box-shadow:0 0 10px #00ff9d59}.pi-tag{font-size:.68rem;font-style:italic;color:var(--text-dim);font-family:inherit}.pi-transcript.naive .pi-turn.quiet .pi-tag{color:var(--accent)}.pi-trifecta{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.pi-ingredient{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .65rem;border-radius:999px;border:1px solid var(--border-light);font-size:.72rem;color:var(--text-dim);transition:color .3s ease,border-color .3s ease,background .3s ease}.pi-ingredient.lit{color:var(--accent);border-color:var(--accent);background:#ff00551f}.pi-ingredient.cut{color:#00ff9d;border-color:#00ff9d99;background:#00ff9d14;text-decoration:line-through}.pi-ingredient-mark{font-weight:700;text-decoration:none}.mcp-wrapper{display:flex;flex-direction:column;gap:1rem;width:100%}.mcp-map{display:grid;grid-template-columns:minmax(0,1.1fr) 44px minmax(0,1fr);align-items:stretch;width:100%}.mcp-host{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:.75rem;border-radius:12px;border:1px solid rgba(0,242,255,.35);background:#00f2ff0a}.mcp-host-label{font-size:.68rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--primary)}.mcp-node{display:inline-flex;align-items:center;gap:.4rem;align-self:flex-start;padding:.35rem .6rem;border-radius:8px;border:1px solid var(--border-light);background:var(--bg-card);color:var(--text-muted);font-size:.75rem;font-weight:600;transition:border-color .3s ease,color .3s ease,box-shadow .3s ease}.mcp-node.client{align-self:flex-end}.mcp-node.lit{color:var(--text-main);border-color:var(--primary);box-shadow:0 0 10px #00f2ff40}.mcp-bubbles{display:flex;flex-direction:column;gap:.4rem;min-height:60px;flex:1}.mcp-bubble{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;border-radius:10px;font-size:.74rem;line-height:1.35}.mcp-bubble.user{align-self:flex-start;background:#00f2ff1a;border:1px solid rgba(0,242,255,.35);color:var(--text-main)}.mcp-bubble.answer{align-self:flex-start;background:#7000ff1f;border:1px solid rgba(112,0,255,.5);color:var(--text-main)}.mcp-call{align-self:flex-end;padding:.3rem .5rem;border-radius:6px;border:1px solid #ffa94d;background:#ffa94d1f;color:#ffa94d;font-size:.68rem}.mcp-dialog{display:flex;flex-direction:column;gap:.4rem;padding:.5rem .6rem;border-radius:8px;border:1px solid #ffa94d;background:var(--bg-dark);box-shadow:0 0 14px #ffa94d59;font-size:.74rem;color:var(--text-main)}.mcp-dialog-text{display:inline-flex;align-items:center;gap:.35rem}.mcp-dialog-buttons{display:flex;flex-wrap:wrap;gap:.35rem}.mcp-dialog-btn{padding:.15rem .5rem;border-radius:6px;border:1px solid var(--border-light);color:var(--text-muted);font-size:.68rem}.mcp-dialog-btn.primary{border-color:#00ff9d;color:#00ff9d;background:#00ff9d1f}.mcp-bus{position:relative}.mcp-bus-line{position:absolute;left:50%;top:12%;bottom:12%;width:3px;border-radius:2px;background:var(--border-light);transform:translate(-50%);transition:background .3s ease,box-shadow .3s ease}.mcp-map.discovering .mcp-bus-line,.mcp-map.calling .mcp-bus-line{background:var(--primary);box-shadow:0 0 8px var(--primary-glow)}.mcp-bus-label{position:absolute;top:2px;left:50%;transform:translate(-50%);font-family:monospace;font-size:.58rem;color:var(--primary);white-space:nowrap}.mcp-servers{display:flex;flex-direction:column;gap:.5rem}.mcp-server{position:relative;display:flex;flex-direction:column;gap:.35rem;padding:.55rem .65rem;border-radius:10px;border:1px solid var(--border-light);background:var(--bg-card);opacity:.55;transition:opacity .3s ease,border-color .3s ease,box-shadow .3s ease}.mcp-server:before{content:"";position:absolute;left:-22px;top:50%;width:22px;height:2px;background:var(--border-light);transition:background .3s ease}.mcp-server.lit{opacity:1;border-color:#00f2ff80}.mcp-server.lit:before{background:var(--primary)}.mcp-server.busy{border-color:#00ff9d;box-shadow:0 0 14px #00ff9d40}.mcp-server-head{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;color:var(--text-main)}.mcp-server-name{font-size:.75rem;font-weight:600}.mcp-server-backend{font-size:.62rem;color:var(--text-dim)}.mcp-tools{display:flex;flex-wrap:wrap;gap:.25rem}.mcp-tool{padding:.1rem .4rem;border-radius:4px;border:1px solid var(--border-light);color:var(--text-muted);font-size:.62rem}.mcp-tool.chosen{border-color:#ffa94d;color:#ffa94d;background:#ffa94d1f}.mcp-server-work{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.mcp-sees{display:inline-flex;align-items:center;gap:.25rem;font-size:.62rem;color:var(--text-dim)}.mcp-result{padding:.15rem .5rem;border-radius:999px;border:1px solid #00ff9d;background:#00ff9d1f;color:#00ff9d;font-family:monospace;font-size:.68rem;font-weight:700}.mcp-live{margin-top:1.5rem}.mcp-live-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem}.mcp-live-actions .btn{display:inline-flex;align-items:center;gap:.4rem}.mcp-live-block{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem}.mcp-live-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim)}.mcp-live-pre{margin:0;padding:.6rem .75rem;border-radius:8px;background:#00000059;border:1px solid var(--border-light);font-size:.72rem;line-height:1.45;overflow-x:auto;max-height:320px;color:var(--text-muted)}.mcp-live-status{font-size:.85rem;color:var(--text-muted)}.mcp-live-status.error{color:var(--accent)}.mcp-live-tools{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.4rem}.mcp-live-tools li{display:flex;flex-direction:column;gap:.15rem;padding:.5rem .65rem;border-radius:8px;background:#00000040;border:1px solid var(--border-light);font-size:.8rem;color:var(--text-muted)}.mcp-live-tools code{color:var(--primary);font-size:.78rem}.mcp-live-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.5rem;margin:0}.mcp-live-summary div{padding:.5rem .65rem;border-radius:8px;background:#00000040;border:1px solid var(--border-light)}.mcp-live-summary dt{font-size:.68rem;color:var(--text-dim)}.mcp-live-summary dd{margin:.15rem 0 0;font-family:monospace;font-size:.95rem;color:var(--text-main)}.mcp-live-summary dd.highlight{color:#00ff9d;font-size:1.15rem;font-weight:700}.mcp-live-raw summary{cursor:pointer;font-size:.78rem;color:var(--text-muted);padding:.25rem 0}@media(max-width:768px){.mcp-map{grid-template-columns:1fr}.mcp-bus{height:28px}.mcp-bus-line{left:50%;top:0;bottom:0;width:3px}.mcp-bus-label{top:50%;left:calc(50% + 10px);transform:translateY(-50%)}.mcp-server:before{display:none}.aim-node{width:96px}.aim-lane-label{width:42px;font-size:.62rem}.pf-map{grid-template-columns:1fr 96px 1fr;grid-template-rows:auto auto auto auto}.pf-map>:nth-child(4){grid-column:2;grid-row:2;transform:rotate(90deg)}.pf-map>:nth-child(5){grid-column:3;grid-row:2}.pf-map>:nth-child(6){grid-column:2;grid-row:3;transform:rotate(90deg)}.pf-map>:nth-child(7){grid-column:3;grid-row:3}.pf-branch{grid-column:1;grid-row:2}.pf-arrow{align-self:start;margin-top:28px}.protocols-lane{padding:.5rem}.protocols-endpoint{width:56px}.protocols-watcher-label{display:none}.ports-row{grid-template-columns:74px 26px 1fr}.ports-visitor{padding:.3rem .45rem}.ports-visitor-word{display:none}.ports-door{gap:.45rem;padding:.45rem .5rem}.ports-resident{display:none}.tls-ladder{--tls-endpoint-width: 84px}.tls-ladder-label{font-size:.66rem}.osi-layer{padding:.5rem;gap:.5rem}.osi-layer.active{transform:none}.osi-layer-info{flex-wrap:wrap;gap:.2rem .45rem}.osi-layer-num{width:24px;height:24px;font-size:.7rem}.osi-layer-icon{width:28px;height:28px}.osi-layer-name{font-size:.8rem}.osi-packet{display:none}.protocols-toggle-btn{padding:.4rem .75rem;font-size:.75rem}.firewall-zones{flex-wrap:wrap;gap:.75rem}.firewall-zone{min-width:70px}.firewall-wall{order:-1;width:100%}.firewall-rules{flex-direction:row;gap:.4rem}.ipv-comparison{flex-direction:column;align-items:center}.ipv-version{max-width:100%;min-width:0;width:100%}.ipv-divider{display:none}.ipv-address-text{font-size:.75rem;min-width:0}.ipv-address-text.v6{font-size:.6rem}}@supports (-webkit-touch-callout: none){body{background-attachment:scroll}.sidebar,.topbar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.card,.btn-glass{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}}.animation-controls{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.75rem;margin-top:1rem;background:#0003;border-radius:10px;border:1px solid var(--border-light)}.animation-controls.disabled{opacity:.5;pointer-events:none}.animation-control-btn{position:relative;display:flex;align-items:center;justify-content:center;width:32px;height:32px;flex:0 0 32px;border-radius:8px;border:1px solid var(--border-light);background:#ffffff0d;color:var(--text-muted);cursor:pointer;transition:var(--transition-fast)}.animation-control-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary);background:#00f2ff1a}.animation-control-btn:active:not(:disabled){transform:scale(.95)}.animation-control-btn:disabled{opacity:.4;cursor:not-allowed}.animation-control-btn.play-pause{width:36px;height:36px;flex-basis:36px;border-radius:50%;margin-left:.5rem}.animation-control-btn.play-pause:hover:not(:disabled){background:#00f2ff26;box-shadow:0 0 10px var(--primary-glow)}.animation-step-dots{display:flex;align-items:center;gap:14px;min-width:0}.animation-control-btn:before,.animation-step-dot:before{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;transform:translate(-50%,-50%)}.animation-step-dot:before{width:24px}.animation-step-dot{position:relative;width:10px;height:10px;border-radius:50%;border:2px solid var(--border-light);background:transparent;cursor:pointer;transition:var(--transition-fast);padding:0}.animation-step-dot:hover:not(:disabled){border-color:var(--primary);transform:scale(1.2)}.animation-step-dot.active{border-color:var(--primary);background:var(--primary);box-shadow:0 0 8px var(--primary-glow)}.animation-step-dot.done{border-color:#00ff9d;background:#00ff9d}.animation-step-dot:disabled{cursor:not-allowed}@media(max-width:768px){.animation-controls{gap:.5rem;padding:.5rem;flex-wrap:wrap;max-width:100%}.animation-control-btn{width:28px;height:28px;flex-basis:28px}.animation-control-btn.play-pause{width:32px;height:32px;flex-basis:32px;margin-left:0}.animation-step-dots{flex-wrap:wrap;justify-content:center;max-width:100%}.animation-step-dot{width:8px;height:8px}}.viz-step-caption{background:#00f2ff0d;border:1px solid rgba(0,242,255,.2);border-radius:10px;padding:1rem;text-align:center;margin-top:1rem;display:flex;flex-direction:column;gap:.25rem}.viz-step-caption-number{font-size:.7rem;color:var(--primary);text-transform:uppercase;letter-spacing:1px}.viz-step-caption-title{font-size:1rem;color:var(--text-main);margin:0}.viz-step-caption-text{font-size:.85rem;color:var(--text-muted);margin:0;line-height:1.5}.viz-why-matters{text-align:center;padding:.5rem .75rem;background:#00ff9d0d;border:1px solid rgba(0,255,157,.15);border-radius:6px;margin-top:.75rem}.viz-why-matters p{font-size:.75rem;color:var(--text-muted);margin:0;line-height:1.5}.viz-mode-toggle{display:flex;justify-content:center;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}.viz-mode-toggle button{font-size:.8rem;padding:.35rem .9rem;border-radius:999px;border:1px solid rgba(0,242,255,.25);background:transparent;color:var(--text-muted);cursor:pointer}.viz-mode-toggle button.active{background:#00f2ff1f;color:var(--text-main);border-color:var(--primary)}.phishing-hotspot{cursor:pointer;border-radius:4px;transition:outline .15s ease,background .15s ease;outline:2px dashed transparent}.phishing-hotspot:hover,.phishing-hotspot:focus-visible{outline-color:#00f2ff80}.phishing-hotspot.found{outline:2px solid var(--accent);background:#ff4d6d14}