.tsp{--tsp-stage:radial-gradient(120% 120% at 30% 20%, #17304d 0%, #0b1626 55%, #070e19 100%);--tsp-grid:#8cb4dc14;--tsp-route:#3ee6c8;--tsp-city:#e8f1ff;--tsp-start:#ffb547;--tsp-radius:14px;--tsp-line:#0f9f8a;--tsp-mark:#c2410c;grid-template:"stage side""chart side"1fr/minmax(0,1.25fr) minmax(0,1fr);align-items:start;gap:16px;margin:8px 0 24px;font-size:14px;line-height:1.6;display:grid}@media (width<=720px){.tsp{grid-template:"stage""side""chart"/minmax(0,1fr)}}.tsp-stage{grid-area:stage}.tsp-side{grid-area:side}.tsp-chart-box{grid-area:chart}.tsp-stage{border-radius:var(--tsp-radius);background:var(--tsp-stage);position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff0a,0 12px 40px #050f1e59}.tsp-canvas{aspect-ratio:1;width:100%;display:block}.tsp-badge{color:#cfe3f7;background:#0a142399;border-radius:999px;padding:2px 10px 2px 22px;font-size:12px;position:absolute;top:10px;left:10px}.tsp-badge:before{content:"";background:#6b7f95;border-radius:50%;width:7px;height:7px;margin-top:-3.5px;position:absolute;top:50%;left:9px}.tsp-badge[data-state=running]:before{background:var(--tsp-route)}.tsp-badge[data-state=running]:after{content:"";background:var(--tsp-route);border-radius:50%;width:7px;height:7px;margin-top:-3.5px;animation:1.4s ease-out infinite tsp-pulse;position:absolute;top:50%;left:9px}@keyframes tsp-pulse{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(3.2)}}.tsp-side{gap:14px;min-width:0;display:grid}.tsp-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.tsp-stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;gap:2px;min-width:0;padding:10px 12px;display:grid}.tsp-stat-label{color:var(--muted);font-size:12px}.tsp-stat-value{font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;font-size:18px;overflow:hidden}.tsp-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.tsp button{font:inherit;cursor:pointer}.tsp-buttons button{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:999px;padding:7px 14px}.tsp-buttons button:hover:not(:disabled){border-color:var(--accent)}.tsp-buttons .tsp-primary{color:#fff;background:linear-gradient(135deg,#18b39a,#0f8f9e);border-color:#0000;font-weight:700;box-shadow:0 4px 14px #0f8f9e59}.tsp-buttons button:disabled{opacity:.45;cursor:default}.tsp-error{color:#d9480f;margin:0}.tsp-group{border:1px solid var(--line);background:var(--panel);border-radius:12px;gap:8px;min-width:0;margin:0;padding:10px 14px 12px;display:grid}.tsp-group legend{padding:0 4px;font-weight:700}.tsp-note{color:var(--muted);margin:-4px 0 0;font-size:12px}.tsp-seg{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}@media (width<=380px){.tsp-seg{grid-template-columns:repeat(2,minmax(0,1fr))}}.tsp-seg button{white-space:nowrap;border:1px solid var(--line);color:var(--ink);background:0 0;border-radius:999px;padding:4px 6px;font-size:13px}.tsp-seg button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--panel)}.tsp-field{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label num""range range";align-items:center;gap:2px 8px;font-size:13px;display:grid}.tsp-field>span,.tsp-field>label{grid-area:label}.tsp-field>input[type=range]{grid-area:range}.tsp-field>.tsp-num,.tsp-field>.tsp-numbox{grid-area:num}.tsp-field>span,.tsp-field>label{color:var(--muted)}.tsp-field input[type=range]{accent-color:#18b39a;width:100%}.tsp-num{align-items:center;gap:3px;display:flex}.tsp-num:not(:has(.tsp-unit)):after{content:"%";visibility:hidden;font-size:12px}.tsp-numbox{border:1px solid var(--line);background:var(--bg);width:5.5em;color:var(--ink);font:inherit;font-family:var(--f-mono);font-variant-numeric:tabular-nums;text-align:right;border-radius:7px;padding:3px 6px}.tsp-numbox:hover{border-color:var(--muted)}.tsp-numbox:focus{border-color:#18b39a;outline:none;box-shadow:0 0 0 2px #18b39a40}.tsp-unit{color:var(--muted);font-size:12px}.tsp-field-wide .tsp-numbox{width:9em}.tsp-toggle{align-items:center;gap:8px;font-size:13px;display:flex}.tsp-toggle input{accent-color:#18b39a;width:16px;height:16px}.tsp-chart-box{border-radius:var(--tsp-radius);background:var(--panel);border:1px solid var(--line);padding:12px 14px 6px}.tsp-chart-title{color:var(--muted);font-size:13px}.tsp-chart{width:100%;height:auto;display:block}.tsp-chart-empty{aspect-ratio:420/230}.tsp-axis line{stroke:var(--line)}.tsp-axis text{fill:var(--muted);font-family:var(--f-mono);font-size:12px}.tsp-line{fill:none;stroke:var(--tsp-line);stroke-width:2px;stroke-linejoin:round}.tsp-dot{fill:var(--tsp-line);stroke:var(--panel);stroke-width:2px}.tsp-optimum line{stroke:var(--tsp-mark);stroke-dasharray:5 4}.tsp-optimum text{fill:var(--tsp-mark);font-size:12px}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tsp{--tsp-line:#3ee6c8;--tsp-mark:#ffb547}}:root[data-theme=dark] .tsp{--tsp-line:#3ee6c8;--tsp-mark:#ffb547}@media (prefers-reduced-motion:reduce){.tsp-badge[data-state=running]:after{opacity:0;animation:none}}