/* Existing HonkWatch typography and colours; status is never conveyed by colour alone. */
.cable-app .cable-heading-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cable-app .cable-monitoring-status{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px 24px;padding:10px 0;border-block:1px solid var(--line);margin:12px 0 14px}
.cable-app .cable-monitoring-status p{font-size:13px;line-height:1.6;margin:0;color:var(--muted)}
.cable-app .cable-monitoring-status strong{color:var(--ink);font-weight:600}
.cable-app .cable-more>summary{color:var(--muted)}
.cable-app #aboutDialog .coverage-note,.cable-app #aboutDialog .live-summary{margin:12px 0}
.cable-app .cable-report-scope{font-size:13px;line-height:1.6;margin:12px 0 20px;color:var(--muted)}
.cable-app #selectedCableOverview{margin:14px 0}
.cable-app #selectedCableOverview h3{font:600 15px var(--display);margin:12px 0 8px}
.cable-app #selectedCableOverview p{font-size:13px;line-height:1.55;margin:8px 0}
.cable-app #selectedCableOverview .overview-verdict{font-size:18px;font-weight:650;color:var(--ink)}
.cable-app #selectedCableOverview .overview-verdict.anomaly{color:var(--down)}
.cable-app #selectedCableOverview .overview-verdict.no-change{color:var(--up)}
.cable-app .overview-checked,.cable-app .overview-source,.cable-app .overview-history-readout{color:var(--muted)}
.cable-app .overview-route-label{display:grid;gap:8px;font-size:13px;font-weight:600;margin:16px 0 10px}
.cable-app .overview-route-label select{width:100%;min-width:0;min-height:44px;font-weight:400}
.cable-app .overview-history{list-style:none;display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;padding:0;margin:10px 0 6px}
.cable-app .overview-history li{min-width:0}
.cable-app .overview-history button{display:block;width:100%;height:44px;min-width:0;padding:0;border:0;border-radius:2px;background:var(--surface-2);cursor:pointer}
.cable-app .overview-history button.history-normal{background:var(--up)}
.cable-app .overview-history button.history-change{background:var(--warn)}
.cable-app .overview-history button.history-unknown{background:var(--line);border:1px dashed var(--muted)}
.cable-app .overview-history button:focus-visible{outline:2px solid var(--ink);outline-offset:2px;position:relative;z-index:1}
.cable-app .overview-history-axis{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted)}
.cable-app .overview-history-key{display:flex;flex-wrap:wrap;gap:8px 14px}
.cable-app .overview-history-key span{font-size:11px;display:inline-flex;align-items:center;gap:5px}
.cable-app .overview-history-key span::before{content:'';width:7px;height:7px;background:var(--line);display:inline-block}
.cable-app .overview-history-key .history-normal::before{background:var(--up)}
.cable-app .overview-history-key .history-change::before{background:var(--warn)}
.cable-app .cable-extra{margin:16px 0;border-top:1px solid var(--line);padding-top:12px}
.cable-app .cable-extra>summary{font-size:14px;font-weight:600;cursor:pointer;min-height:32px}
.cable-app .detail-buttons{flex-wrap:wrap}
.cable-app .detail-buttons .button{font-size:12px;padding:9px 10px;display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;margin:0}
.cable-app .issue-halo{fill:none;stroke:var(--surface);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:.9;vector-effect:non-scaling-stroke;pointer-events:none}
.cable-app .issue-section{fill:none;stroke:var(--down);stroke-width:4;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:7 5;vector-effect:non-scaling-stroke;cursor:pointer;animation:issue-pulse 2.8s ease-in-out infinite}
.cable-app .issue-dot{fill:var(--down);stroke:var(--surface);stroke-width:1.5;vector-effect:non-scaling-stroke;cursor:pointer;animation:issue-pulse 2.8s ease-in-out infinite}
@keyframes issue-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@media(prefers-reduced-motion:reduce){.cable-app .issue-section,.cable-app .issue-dot{animation:none}}
.cable-app .legend .issue-key{display:inline-block;width:16px;height:4px;background:repeating-linear-gradient(90deg,var(--down) 0 5px,transparent 5px 8px);margin-right:6px;vertical-align:middle}
@media(max-width:680px){
  .cable-app .cable-monitoring-status{flex-direction:column;gap:10px}
  .cable-app .cable-heading-actions{width:100%}
}
.cable-app.cable-public [data-cable-write]{display:none!important}
