.route-summary{border:1px solid var(--color-line-strong,#283141);background:var(--color-panel,#0f141c);border-radius:8px;padding:14px 18px;container-type:inline-size}.route-ports{display:none}.route-diagram{position:relative}.route-rail{pointer-events:none;height:14px;position:absolute;top:0;left:4px;right:4px;overflow:hidden}.route-rail:before{content:"";background:#344653;width:100%;height:1px;position:absolute;top:6px}.route-glow{z-index:3;opacity:0;background:#b6ffe9;border-radius:50%;width:5px;height:5px;position:absolute;top:4px;left:0;transform:translate(-50%);box-shadow:0 0 7px 2px #3dd6a8}.route-glow:before{content:"";background:linear-gradient(90deg,#0000,#3dd6a8);border-radius:4px;width:34px;height:3px;position:absolute;top:1px;right:1px}.route-playing .route-glow{animation:3.6s cubic-bezier(.4,0,.3,1) .3s both route-travel}@keyframes route-travel{0%{opacity:0;left:0}8%,90%{opacity:1}to{opacity:0;left:100%}}.route-chain{grid-template-columns:repeat(var(--route-stops), minmax(0, 1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.route-node{text-align:center;min-width:0;position:relative}.route-node:first-child{text-align:left}.route-node:last-child{text-align:right}.route-dot{z-index:2;background:#0f141c;border:1px solid #6d8290;border-radius:50%;width:9px;height:9px;margin:2px auto 7px;display:block;position:relative}.route-node:first-child .route-dot{margin-left:0}.route-node:last-child .route-dot{margin-right:0}.route-node.endpoint .route-dot{background:#3dd6a8;border-color:#3dd6a8}.route-name{overflow-wrap:anywhere;color:#a4b2be;font-size:14px;font-weight:400;line-height:1.3;display:block}.route-node.endpoint .route-name{color:#eceff3;font-weight:500}.route-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 16px;margin-top:10px;display:flex}.route-metrics{flex-wrap:wrap;gap:6px 18px;margin:0;display:flex}.route-metrics dd{font-family:var(--font-jetbrains-mono), monospace;margin:0;font-size:14px}.route-details{font-size:13px}.route-details[open]{flex-basis:100%}.route-details summary{color:#3dd6a8;cursor:pointer;width:fit-content;padding:5px 0}.route-details-body{border-top:1px solid #283141;margin-top:8px;padding-top:10px}.route-details-body>p{color:#8f99a8;margin:0 0 10px}.route-details dl{flex-direction:column;gap:8px;margin:0;display:flex}.route-details dt{color:#8f99a8}.route-details dd{margin:3px 0 0}@container (max-width:480px){.route-name{font-size:12px}.route-multi .route-ports{overflow-wrap:anywhere;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-bottom:8px;font-size:13px;line-height:1.3;display:grid}.route-ports span:last-child{text-align:right}.route-multi .route-node.endpoint .route-name{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}}@media (prefers-reduced-motion:reduce){.route-summary .route-glow{animation:none;display:none}}@media (max-width:540px){.route-summary{padding:12px 14px}}