/* Cable workspace styles: kept inside the host application shell. */
.cable-app .detection-panel{padding:22px;border:1px solid var(--line);border-radius:10px;background:var(--surface);margin-bottom:30px;scroll-margin-top:20px}
.cable-app .detection-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}
.cable-app .detection-heading h2{font:700 25px var(--display);margin:0 0 8px}
.cable-app .detection-panel p{font-size:12px;color:var(--muted);line-height:1.7}
.cable-app .detection-heading p{margin:0}
.cable-app .detection-counts{font-size:13px;padding:18px 0;margin-top:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cable-app .detection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.cable-app .detection-card{border:1px solid var(--line);border-radius:6px;padding:16px;min-width:0}
.cable-app .detection-card header{display:flex;justify-content:space-between;gap:8px;align-items:start}
.cable-app .detection-card h3{font:600 17px var(--display);margin:0 0 8px}
.cable-app .detection-state{font-size:11px;color:var(--muted)}
.cable-app .detection-state.correlated,.cable-app .path-state.anomaly{color:#e87c65}
.cable-app .detection-state.single-path{color:#d8a84d}
.cable-app .detection-coverage{font:10px var(--mono);color:var(--muted);white-space:nowrap}
.cable-app .detection-path{margin-top:14px;border-top:1px solid var(--line);padding-top:12px;font-size:11px}
.cable-app .detection-path summary{cursor:pointer;display:flex;justify-content:space-between;gap:8px;line-height:1.5}
.cable-app .detection-path summary:before{content:'+';color:var(--accent)}
.cable-app .detection-path[open] summary:before{content:'−'}
.cable-app .detection-path summary>span:first-child{flex:1}
.cable-app .path-state{font-size:10px;color:var(--muted)}
.cable-app .detection-bars{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;margin:15px 0}
.cable-app .detection-bars span{height:18px;background:#646973;border-radius:2px}
.cable-app .detection-bars .normal{background:#388b72}
.cable-app .detection-bars .latency{background:#d8a84d}
.cable-app .detection-bars .loss{background:#d66b58}
.cable-app .detection-path a{color:var(--accent);font-size:11px}
.cable-app .detection-events{padding-left:18px;color:var(--muted);font-size:11px;line-height:1.8}
.cable-app .detection-card footer{margin-top:16px;font-size:10px;color:var(--muted);line-height:1.8}
.cable-app .detection-card footer button{font-size:10px}
.cable-app .detection-panel .outage-method{margin:18px 0 0}
.cable-app .detection-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:10px;color:var(--muted)}
.cable-app .detection-legend i{display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:2px}
.cable-app .detection-panel button:disabled{opacity:.6;cursor:wait}
@media(max-width:900px){.cable-app .detection-grid{grid-template-columns:1fr}}
@media(max-width:620px){.cable-app .detection-panel{padding:15px}
.cable-app .detection-heading{align-items:start;flex-direction:column}
.cable-app .detection-card{padding:13px}
.cable-app .detection-card header{flex-direction:column}
.cable-app .detection-counts{line-height:1.8}}
.cable-app .check-totals{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:7px;margin:20px 0}
.cable-app .check-totals>div{padding:16px;border-right:1px solid var(--line)}
.cable-app .check-totals>div:last-child{border:0}
.cable-app .check-totals strong{display:block;font:600 28px var(--mono);margin-bottom:7px}
.cable-app .check-totals span{font-size:11px;color:var(--muted)}
.cable-app .check-totals .stable strong{color:#55bf98}
.cable-app .check-totals .anomaly strong{color:#f18b76}
.cable-app .check-totals .checking strong{color:var(--accent)}
.cable-app .check-progress{display:flex;gap:16px;align-items:center;font-size:12px;color:var(--muted)}
.cable-app .check-progress progress{width:180px;height:7px;accent-color:var(--accent)}
.cable-app .check-row{padding:16px 0;border-top:1px solid var(--line);margin-top:12px}
.cable-app .check-title{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:12px}
.cable-app .check-title strong{font-weight:500}
.cable-app .check-badge{display:inline-flex;align-items:center;gap:6px;border-radius:4px;padding:5px 7px;font-size:10px;background:var(--surface-2);white-space:nowrap;color:var(--muted)}
.cable-app .check-badge:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.cable-app .check-badge.stable{color:#55bf98;background:#25825d20}
.cable-app .check-badge.anomaly{color:#f18b76;background:#cc493020}
.cable-app .check-badge.checking{color:var(--accent)}
.cable-app .check-badge.checking:before{animation:cable-check-pulse 1s ease-in-out infinite}
.cable-app .check-metrics{display:flex;gap:25px;margin-top:13px;font-size:11px;color:var(--muted)}
.cable-app .check-metrics b{font-family:var(--mono);font-weight:400;color:var(--text);margin-left:6px}
.cable-app .check-row .check-sample{font-size:10px;margin:8px 0}
.cable-app .check-row .detection-path{border:0;padding:0;margin:9px 0 0}
.cable-app .check-row .detection-path summary{justify-content:flex-start;color:var(--muted);font-size:10px}
.cable-app .detection-state.no-change{color:#55bf98}
.cable-app .detection-state.checking{color:var(--accent)}
.cable-app .detection-panel .check-scope{font-size:11px}
.cable-app .check-row:last-of-type{padding-bottom:0}
@keyframes cable-check-pulse{50%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.cable-app .check-badge.checking:before{animation:none}}
@media(max-width:620px){.cable-app .check-totals{grid-template-columns:repeat(3,1fr)}
.cable-app .check-totals>div{padding:12px}
.cable-app .check-totals strong{font-size:23px}
.cable-app .check-totals span{font-size:10px}
.cable-app .check-progress{flex-wrap:wrap}
.cable-app .check-title{font-size:11px;gap:5px}
.cable-app .check-metrics{gap:14px}}