#switchlab{--bg:light-dark(#f5f7f7,#101819);--panel:light-dark(#ffffff,#192426);--ink:light-dark(#182f33,#e4efef);--sub:light-dark(#62777a,#a0b5b7);--line:light-dark(#dce5e4,#314244);--accent:light-dark(#006d60,#82e4c4);--soft:light-dark(#e5f4ee,#233d35);--red:light-dark(#b83d43,#ff7d83);color:var(--ink);font:14px/1.5 Inter,system-ui,sans-serif;background:var(--bg);border-radius:16px;overflow:hidden}#switchlab *{box-sizing:border-box}#switchlab button,#switchlab input{font:inherit}#switchlab button{cursor:pointer}#switchlab button:focus-visible,#switchlab input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}#switchlab .preview{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--panel);padding:12px 22px;border-bottom:1px solid var(--line)}#switchlab .tabs{display:flex;gap:5px;flex-wrap:wrap}#switchlab button{border:1px solid var(--line);border-radius:8px;padding:9px 14px;background:var(--panel);color:var(--ink)}#switchlab button.sel,#switchlab .primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}#switchlab .small{font-size:12px;color:var(--sub)}#switchlab .header{padding:23px 30px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line)}#switchlab .brand{font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:10px}#switchlab .logo{display:inline-grid;place-items:center;background:var(--accent);color:var(--bg);border-radius:8px;width:32px;height:32px;letter-spacing:0}#switchlab .badge{display:inline-flex;align-items:center;gap:7px;font-size:12px;border-radius:20px;padding:5px 10px;background:var(--soft);color:var(--accent)}#switchlab .content{padding:30px}#switchlab h1{font-size:34px;line-height:1.15;letter-spacing:-1.2px;margin:12px 0;font-weight:650}#switchlab h2{font-size:19px;margin:0 0 8px}#switchlab h3{font-size:14px;margin:0}#switchlab p{color:var(--sub);margin:8px 0 0}#switchlab .eyebrow{font-size:11px;font-weight:650;letter-spacing:1.7px;color:var(--accent)}#switchlab .hero{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:30px}#switchlab .spec{font-size:12px;color:var(--sub);display:flex;gap:20px;flex-wrap:wrap;margin-top:20px}#switchlab .chassis{background:light-dark(#e7edec,#263234);border:1px solid light-dark(#c5cfce,#435252);border-radius:15px;padding:22px;box-shadow:0 9px 0 light-dark(#d1dada,#1d292a),0 18px 24px #0000000a}#switchlab .hardware-top{display:flex;justify-content:space-between;gap:15px;margin-bottom:24px;font-size:11px;letter-spacing:1.5px;color:var(--sub)}#switchlab .port-layout{display:grid;grid-template-columns:1fr 120px;gap:20px}#switchlab .ports{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}#switchlab .port{padding:12px 6px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:9px;min-width:0}#switchlab .port:hover:not(:disabled){border-color:var(--accent);transform:translateY(-2px)}#switchlab .port:disabled{cursor:default;opacity:1}#switchlab .socket{height:35px;width:57px;max-width:100%;background:light-dark(#203436,#10191b);border:3px solid light-dark(#96a5a4,#526062);border-radius:3px;margin:10px auto;position:relative;box-shadow:inset 0 5px 5px #0006}#switchlab .socket:before{content:'';position:absolute;left:10px;right:10px;top:1px;height:9px;background:repeating-linear-gradient(90deg,#b8a166 0 2px,transparent 2px 5px)}#switchlab .socket:after{content:'';position:absolute;bottom:-3px;left:17px;right:17px;height:7px;background:light-dark(#96a5a4,#526062)}#switchlab .led{display:inline-block;width:7px;height:7px;border-radius:50%;background:#418b60;margin-right:6px}#switchlab .led.red{background:#ef5963;box-shadow:0 0 7px #ef596355}#switchlab .led.blink{animation:packet 1.8s infinite steps(1)}#switchlab .led.wan{background:#58df9b;box-shadow:0 0 8px #58df9b66;animation:packet 1.3s infinite steps(1)}@keyframes packet{0%,17%,31%,66%,85%{opacity:1}12%,24%,60%,78%{opacity:.3}}#switchlab .portstate{font-size:11px;color:var(--sub);font-variant-numeric:tabular-nums}#switchlab .uplink{border-left:1px solid var(--line);padding-left:20px;display:flex;flex-direction:column;justify-content:center;text-align:center}#switchlab .legend{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:24px 0 30px;font-size:12px;color:var(--sub)}#switchlab .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border-top:1px solid var(--line);padding-top:25px}#switchlab .stepnum{font-family:monospace;color:var(--accent);margin-bottom:10px}#switchlab .foot{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;padding:18px 30px;border-top:1px solid var(--line);color:var(--sub);font-size:12px}#switchlab .foot strong{color:var(--ink);font-size:17px}#switchlab .panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px}#switchlab .formwrap{max-width:490px;margin:10px auto 30px}#switchlab label{display:block;margin:16px 0 6px}#switchlab input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);min-width:0}#switchlab .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}#switchlab .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0}#switchlab .value{font-size:28px;letter-spacing:-.8px;margin:7px 0;font-variant-numeric:tabular-nums}#switchlab .meter{height:4px;background:var(--line);border-radius:5px;margin-top:12px}#switchlab .meter span{display:block;height:100%;background:var(--accent);border-radius:5px}#switchlab .dashgrid{display:grid;grid-template-columns:1.45fr 1fr;gap:18px}#switchlab .panelhead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}#switchlab .dnsrow{display:grid;grid-template-columns:1fr auto;gap:10px;padding:13px 0;border-top:1px solid var(--line)}#switchlab .domain{overflow-wrap:anywhere}#switchlab .allowed{color:var(--accent);font-size:12px}#switchlab .blocked{color:var(--red);font-size:12px}#switchlab .rule{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}#switchlab .rule button{font-size:12px;padding:6px 9px}#switchlab .notice{padding:12px 14px;border-radius:8px;background:var(--soft);color:var(--accent);font-size:12px;margin-top:18px}#switchlab [hidden]{display:none!important}#switchlab .error{color:var(--red);font-size:12px}#switchlab .mono{font-family:ui-monospace,monospace}#switchlab .gate{text-align:center;max-width:490px;margin:45px auto}#switchlab .gate .logo{margin:0 auto 15px;width:46px;height:46px}#switchlab .demo{font-size:11px;letter-spacing:.3px;color:var(--sub)}@media(max-width:650px){#switchlab .content{padding:22px 16px}#switchlab .header{padding:18px 16px}#switchlab h1{font-size:28px}#switchlab .hero{align-items:start;flex-direction:column}#switchlab .port-layout{grid-template-columns:1fr}#switchlab .uplink{border-left:0;border-top:1px solid var(--line);padding:15px 0 0;display:block}#switchlab .uplink .socket{display:none}#switchlab .steps,#switchlab .dashgrid{grid-template-columns:1fr}#switchlab .stats{grid-template-columns:1fr}#switchlab .chassis{padding:15px}#switchlab .ports{gap:7px}#switchlab .port{padding:10px 3px}#switchlab .foot{padding:16px}#switchlab .preview{padding:12px 16px}}@media(prefers-reduced-motion:reduce){#switchlab .led{animation:none!important}}

:root{color-scheme:light dark}body{margin:0;padding:28px;background:light-dark(#edf1f0,#0c1314)}#switchlab{max-width:1160px;margin:auto;min-height:90vh;box-shadow:0 15px 60px #0001}#switchlab a{color:var(--accent);text-decoration:none}#switchlab .brand{letter-spacing:.5px;font-size:19px}#switchlab .brand em{font-style:normal;color:var(--accent)}#switchlab .nav{display:flex;gap:16px;align-items:center}#switchlab .chassis{position:relative}#switchlab .port.leased .socket .plug,#switchlab .wanplug{position:absolute;inset:3px 6px -5px;background:linear-gradient(135deg,#c6e3d7aa,#6b9e9188);border:1px solid #b9d4c5;border-radius:2px 2px 7px 7px;box-shadow:inset 0 0 0 3px #dbeee533;animation:insert .5s ease-out}#switchlab .plug:before,#switchlab .wanplug:before{content:'';position:absolute;width:12px;height:21px;left:calc(50% - 6px);top:3px;background:#d7ede966;border:1px solid #eaf7ef88;border-radius:2px}#switchlab .plug:after,#switchlab .wanplug:after{content:'';position:absolute;width:12px;height:17px;left:calc(50% - 6px);bottom:-15px;background:linear-gradient(90deg,#206756,#67b59a,#206756);border-radius:0 0 4px 4px;box-shadow:1px 2px 4px #0003}#switchlab .leased .socket{margin-bottom:23px}#switchlab .port{transition:transform .18s,border-color .18s}#switchlab .port.leased{background:light-dark(#f5f8f6,#1d2928)}#switchlab .uplink .socket{margin-bottom:28px}#switchlab .wide{width:100%}#switchlab .muted{color:var(--sub)}#switchlab .errorbox{padding:12px;border:1px solid var(--red);border-radius:8px;margin:14px 0;color:var(--red)}#switchlab .successmark{font-size:35px;color:var(--accent)}#switchlab .search{margin:12px 0}#switchlab .feed{min-height:220px;max-height:420px;overflow:auto}#switchlab .portstate{display:inline-block;min-width:65px}#switchlab .signal{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;margin-right:6px}#switchlab .statusline{min-height:28px;padding:0 30px 14px;color:var(--accent);font-size:13px}#switchlab button:disabled{cursor:wait;opacity:.65}#switchlab .port:disabled{cursor:default;opacity:1}#switchlab .chart{width:100%;height:100px;margin:15px 0;overflow:visible}#switchlab .adminrow{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);gap:10px}#switchlab .hint{font-size:12px;color:var(--sub);margin-top:14px}#switchlab .checkline{display:flex;gap:9px;align-items:start}#switchlab .checkline input{width:auto;margin-top:4px}#switchlab .full{grid-column:1/-1}@keyframes insert{from{transform:translateY(13px);opacity:0}to{transform:translateY(0);opacity:1}}@media(min-width:1050px){#switchlab .ports{grid-template-columns:repeat(8,1fr)}#switchlab .port-layout{grid-template-columns:1fr 110px;gap:16px}#switchlab .port{padding:14px 3px}#switchlab .socket{width:55px}}@media(max-width:650px){body{padding:0}#switchlab{border-radius:0}#switchlab .uplink .socket{display:block}#switchlab .nav .badge{display:none}#switchlab .ports{grid-template-columns:repeat(4,1fr)}#switchlab .stats{grid-template-columns:1fr}#switchlab .statusline{padding:0 16px 12px}}@media(prefers-reduced-motion:reduce){#switchlab *{animation:none!important;transition:none!important}}

#switchlab a.primary{display:inline-block;padding:10px 14px;border-radius:8px;font-weight:600}#switchlab .actions{align-items:center}