.routing-preview-widget{width:100%;min-width:0;color:var(--ink);padding-top:34px;line-height:1.7;position:relative;container-type:inline-size;& [hidden]{display:none!important}& .rp-card{background:#ffffffcf;border:1px solid #d9dfed;border-radius:25px;margin:0;position:relative;overflow:hidden;transform:rotate(-.7deg);box-shadow:0 32px 74px #26386520}& .rp-header{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;gap:10px;padding:22px 22px 18px;display:flex}& .rp-overline,& .rp-node-label,& .rp-badge,& .rp-request,& .rp-result strong{font-family:var(--mono);font-size:.75rem;font-weight:500;line-height:1.5}& .rp-overline{letter-spacing:.06em;color:#3659a8;margin:0;font-weight:600}& .rp-header .rp-heading{letter-spacing:-.03em;margin:6px 0 0;font-size:.88rem;font-weight:700;line-height:1.5}& .rp-badge{color:#3659a8;background:#f3f6ff;border:1px solid #e0e7f8;border-radius:30px;flex-shrink:0;padding:5px 10px}& .rp-request{border-bottom:1px solid var(--rule);color:#59677f;background:#f7f9ff;justify-content:space-between;gap:8px;padding:14px 21px;display:flex}& .rp-request>span:first-child{overflow-wrap:anywhere;min-width:0}& .rp-request>span:last-child{color:#3659a8;font-size:.625rem}& .rp-network{grid-template-columns:1.03fr .95fr 1.15fr;align-items:center;gap:18px;min-height:325px;padding:28px 19px;display:grid;position:relative}& .rp-lines{pointer-events:none;width:100%;height:calc(100% - 48px);position:absolute;inset:24px 0}& .rp-network[data-route-network=direct-ip] .rp-lines{display:none}& .rp-active-path{animation:12s linear infinite routing-preview-flow}& .rp-node{z-index:1;overflow-wrap:anywhere;background:#fff;border:1px solid #e0e5ef;border-radius:14px;min-width:0;padding:15px 12px;position:relative;box-shadow:0 8px 20px #31487c09}& .rp-node strong{letter-spacing:-.025em;margin-top:7px;font-size:.8125rem;font-weight:700;line-height:1.5;display:block}& .rp-node-label{letter-spacing:.045em;color:#59677f;display:block}& .rp-detail{color:#59677f;margin-top:7px;font-size:.75rem;display:block}& .rp-progress{background:linear-gradient(90deg,#2864ff 75%,#ebeff9 75%);border-radius:4px;height:4px;margin-top:14px}& .rp-core{border-color:#a8beff;padding:16px 12px;box-shadow:0 0 0 4px #2864ff09,0 12px 26px #2864ff12}& .rp-core svg{width:58%;height:58%}& .rp-core .rp-node-label,& .rp-server-brand .rp-node-label,& .rp-core .rp-detail{color:#3659a8}& .rp-core .rp-gateway-label{color:#59677f;margin-bottom:10px}& .rp-providers{flex-direction:column;gap:10px;min-width:0;display:flex}& .rp-network[data-route-network=direct-ip]{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}& .rp-network[data-route-network=direct-ip] .rp-source,& .rp-destination{grid-column:1/-1;justify-self:center;width:min(100%,220px)}& .rp-direct-nodes{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid;position:relative}& .rp-direct-nodes:before,& .rp-direct-nodes:after{content:"";border-top:1.5px solid #d2d9ed;position:absolute;left:calc(25% - 3px);right:calc(25% - 3px)}& .rp-direct-nodes:before{top:-16px}& .rp-direct-nodes:after{bottom:-16px}& .rp-network[data-route-network=direct-ip] .rp-source:after,& .rp-egress-node:before,& .rp-egress-node:after,& .rp-destination:before{content:"";border-left:1.5px dashed #d2d9ed;height:16px;position:absolute;left:50%}& .rp-egress-node:before,& .rp-destination:before{top:-17px}& .rp-network[data-route-network=direct-ip] .rp-source:after,& .rp-egress-node:after{bottom:-17px}& .rp-egress-node.rp-selected:before,& .rp-egress-node.rp-selected:after{border-color:#2864ff}& .rp-server-brand{align-items:center;gap:7px;margin-top:8px;display:flex}& .rp-server-brand svg{flex-shrink:0;width:22px;height:22px}& .rp-ip-pool{margin-top:12px}& .rp-ip-pool .rp-node-label{font-size:.625rem}& .rp-ip-addresses{flex-wrap:wrap;gap:5px;margin-top:5px;display:flex}& .rp-ip{color:#59677f;max-width:100%;font:.625rem/1.5 var(--mono);overflow-wrap:anywhere;background:#f7f9ff;border:1px solid #e0e5ef;border-radius:5px;padding:3px 5px}& .rp-ip-selected{color:#246854;background:#e9f5ef;border-color:#75b3a8}& .rp-dynamic-pool-heading{padding:0 3px 2px}& .rp-dynamic-pool-heading .rp-node-label{color:#3659a8}& .rp-dynamic-pool-heading strong{margin-top:2px;font-size:.8125rem;line-height:1.4;display:block}& .rp-dynamic-pool-heading .rp-detail{margin-top:2px;font-size:.625rem}& .rp-dynamic-pool .rp-provider{padding:9px 11px}& .rp-dynamic-pool .rp-provider strong{font:.625rem/1.4 var(--mono);overflow-wrap:anywhere}& .rp-dynamic-pool .rp-provider .rp-detail{font-size:.625rem}& .rp-provider{padding:13px 12px}& .rp-provider strong{margin-top:3px}& .rp-provider .rp-detail{margin-top:4px}& .rp-selected{color:#1a493e;border-color:#75b3a8;box-shadow:0 0 0 2px #e9f5ef}& .rp-selected .rp-detail,& .rp-check{color:#246854}& .rp-check{font-size:.6rem;position:absolute;top:11px;right:9px}& .rp-result{border-top:1px solid var(--rule);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}& .rp-result>div{overflow-wrap:anywhere;padding:14px 16px}& .rp-result>div+div{border-left:1px solid var(--rule)}& .rp-result strong{margin-top:4px;display:block}& .rp-floating-label{max-width:calc(100% - 16px);font:.75rem/1.5 var(--mono);background:#fff;border:1px solid #e1e5ef;border-radius:30px;align-items:center;gap:7px;padding:9px 13px;display:flex;box-shadow:0 8px 20px #2e427918}& .rp-label-top{z-index:2;position:absolute;top:7px;left:25px;transform:rotate(-3deg)}& .rp-label-bottom{width:fit-content;margin:14px 0 0 auto}& .rp-dot{background:var(--blue);border-radius:2px;flex-shrink:0;width:5px;height:5px}& .rp-tabs{background:#e9edfa;border:1px solid #dfe4f2;border-radius:30px;justify-content:center;gap:4px;width:fit-content;max-width:100%;margin:24px auto 0;padding:4px;display:flex}& .rp-tabs button{color:#59677f;min-width:0;min-height:44px;font:500 .875rem/1.5 var(--font-sans);cursor:pointer;background:0 0;border:0;border-radius:25px;padding:9px 12px}& .rp-tabs button[aria-selected=true]{color:#294db0;background:#fff;box-shadow:0 2px 6px #26366710}& .rp-tabs button:focus-visible,& .rp-description:focus-visible{outline:3px solid var(--blue);outline-offset:4px}& .rp-description{color:#59677f;text-align:center;max-width:410px;min-height:3.5em;margin:13px auto 0;font-size:.75rem;line-height:1.7}}@container (width<=460px){.routing-preview-widget{& .rp-header{padding:18px 16px}& .rp-request{padding:14px 16px}& .rp-request>span:last-child{display:none}& .rp-network{grid-template-columns:1fr .89fr 1.12fr;gap:12px;min-height:340px;padding:20px 13px}& .rp-node{border-radius:12px;padding:13px 9px}& .rp-node strong{font-size:.75rem}& .rp-node-label,& .rp-detail{font-size:.625rem}& .rp-result>div{padding:13px 9px}& .rp-result strong{font-size:.6875rem}& .rp-label-top{left:12px}& .rp-floating-label{font-size:.6875rem}& .rp-tabs{gap:0}& .rp-tabs button{font-size:.75rem}}}@container (width<=320px){.routing-preview-widget{& .rp-network{gap:9px;padding-inline:10px}& .rp-node{padding-inline:7px}& .rp-node strong{font-size:.6875rem}& .rp-tabs button{padding-inline:9px}& .rp-header .rp-heading{font-size:.8125rem}& .rp-badge{font-size:.625rem}}}@media (prefers-reduced-motion:reduce){.routing-preview-widget .rp-active-path{animation:none}}@keyframes routing-preview-flow{to{stroke-dashoffset:-132px}}