.network-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:36px 0}.network-hero h1{font-size:clamp(32px,4vw,54px);line-height:1.5}.network-hero em{color:var(--red,#ba2946);font-style:normal}.network-orbit{position:relative;width:230px;height:230px;border:1px dashed #ba29464d;border-radius:50%;flex-shrink:0;background:radial-gradient(circle,#16827320,transparent 70%)}.network-orbit b,.network-orbit span{position:absolute;display:grid;place-items:center;border-radius:16px;border:1px solid #b72f4e44;background:var(--panel,#fff);color:var(--text,#252835);box-shadow:0 8px 30px #00000009}.network-orbit b{inset:76px;font:800 24px monospace}.network-orbit span{width:54px;height:54px;font:700 16px monospace}.network-orbit span:nth-child(1){top:-10px;left:88px}.network-orbit span:nth-child(2){right:-10px;top:88px}.network-orbit span:nth-child(3){bottom:-10px;left:88px}.network-orbit span:nth-child(4){left:-10px;top:88px}.net-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0}.net-tabs button{background:transparent;border:1px solid #8885;color:inherit}.net-tabs button[aria-pressed=true]{background:#b72f4e;color:white;border-color:#b72f4e}.net-panel{margin-bottom:30px}.net-panel[hidden]{display:none}.net-form{display:flex;flex-wrap:wrap;align-items:end;gap:16px}.net-form label{display:flex;flex-direction:column;gap:8px;flex:1 1 190px}.net-form .wide{flex-basis:100%}.net-form input,.net-form select,.net-form textarea,.net-cli input{width:100%;font:16px Consolas,monospace;padding:12px;border:1px solid #8885;border-radius:10px;background:var(--panel,#fff);color:inherit;box-sizing:border-box}.net-form textarea{line-height:1.8;resize:vertical}.net-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.net-result{border:1px solid #8884;border-radius:12px;padding:14px}.net-result dt{font-size:14px;opacity:.75}.net-result dd{margin:8px 0 0;font:600 18px Consolas,monospace;direction:ltr}.net-console{padding:20px;background:#101a23;color:#d2f1df;border:1px solid #36574c;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.9;min-height:70px;max-height:440px;overflow:auto;font-size:15px}.net-cli{display:flex;align-items:center;gap:10px;flex-wrap:wrap;direction:ltr}.net-cli input{flex:1;min-width:150px}.net-cli label{font:700 16px monospace;color:#168273}.switch-ports{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.switch-ports span{border:1px solid #16827366;border-radius:9px;padding:12px;font:14px monospace}.switch-ports span:last-child{border-color:#b72f4e66}.packet-path{display:flex;align-items:center;direction:ltr;margin:30px 0}.packet-path span{border:1px solid #8885;border-radius:14px;padding:18px;transition:background .25s,border-color .25s;flex-shrink:0}.packet-path span.active{background:#16827322;border-color:#168273;box-shadow:0 0 0 5px #16827310}.packet-path i{flex:1;height:2px;background:linear-gradient(90deg,#168273,#b72f4e)}.net-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.net-ok{color:#168273;font-weight:700}.net-error{color:#b72f4e;font-weight:700}.net-course-links{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.net-course-links a{font-weight:700}.net-prereq{border-inline-start:3px solid #168273;padding-inline-start:16px}.network-callout{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #16827344;border-radius:20px;padding:24px;margin:28px 0;background:linear-gradient(120deg,#16827310,#b72f4e09)}.network-callout h3{margin:0 0 8px}.network-callout p{margin:0}.network-callout a{flex-shrink:0}[data-theme=dark] .network-orbit span,[data-theme=dark] .network-orbit b,[data-theme=dark] .net-form input,[data-theme=dark] .net-form textarea,[data-theme=dark] .net-form select,[data-theme=dark] .net-cli input{background:#17212a;color:#e2e9e8}[data-theme=dark] .net-error{color:#ff8496}[data-theme=dark] .net-ok,[data-theme=dark] .net-cli label{color:#68d5ac}@media(max-width:640px){.network-hero{align-items:flex-start}.network-orbit{display:none}.network-callout{flex-direction:column;align-items:flex-start}.packet-path span{padding:12px 8px;font-size:13px}.net-form button{flex:1}.net-results{grid-template-columns:1fr}.net-cli button{flex:1}}@media(prefers-reduced-motion:reduce){.packet-path span{transition:none}}
