/* A stationary data surface with motion only for real scanning or labeled preview. */
.scan-signal{display:flex;gap:26px;align-items:center;background:linear-gradient(120deg,#0d2333,#111e30);padding:24px 28px}
.scan-radar{position:relative;flex:none;width:110px;height:110px;border:1px solid #33566a;border-radius:50%;overflow:hidden;background:repeating-radial-gradient(circle,transparent 0 17px,rgba(97,208,223,.14) 18px 19px,transparent 20px 35px)}
.scan-radar::before,.scan-radar::after{content:'';position:absolute;background:#274d61}.scan-radar::before{height:1px;width:100%;top:50%}.scan-radar::after{width:1px;height:100%;left:50%}
.scan-radar>span{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--brand);left:calc(50% - 3px);top:calc(50% - 3px)}
.scan-sweep{position:absolute;inset:0;background:conic-gradient(from 0deg,transparent 270deg,rgba(97,208,223,.32) 355deg,var(--brand) 359deg,transparent);opacity:.15}
.is-scanning .scan-sweep{opacity:1;animation:radar-turn 4s linear infinite}
.signal-content{flex:1;min-width:0}.signal-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.signal-eyebrow{font-size:10px;letter-spacing:1.6px;color:var(--brand)}.signal-head h2{margin:6px 0 0;font-size:19px}.scan-signal p{font-size:12px;color:var(--muted);margin:10px 0 16px;line-height:1.7}
.platform-signals{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.platform-signal{display:grid;grid-template-columns:7px 1fr;gap:5px 7px;padding:10px 8px;border:1px solid var(--line);border-radius:8px;background:#0c1a2a;min-width:0}.signal-dot{width:6px;height:6px;border-radius:50%;background:#8091a5;margin-top:5px}.signal-name{font-size:10px;line-height:1.5;overflow-wrap:anywhere}.signal-status{grid-column:2;font-size:10px;color:var(--muted)}
[data-status=active] .signal-dot,[data-status=pending] .signal-dot{background:var(--brand)}[data-status=ok] .signal-dot{background:var(--good)}[data-status=fail] .signal-dot{background:var(--bad)}[data-status=stale] .signal-dot,[data-status=stopped] .signal-dot{background:var(--warn)}
.is-scanning [data-status=active] .signal-dot{animation:signal-breathe 1.5s linear infinite}
.viol-card.violation-new::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;border:2px solid var(--bad);background:rgba(255,145,156,.10);animation:violation-reveal 250ms cubic-bezier(.23,1,.32,1) both}
.motion-preview-card{margin-top:12px;border:1px solid var(--bad);color:var(--bad);padding:10px 12px;border-radius:8px;font-size:12px;animation:preview-reveal 250ms cubic-bezier(.23,1,.32,1) both}.motion-preview-card[hidden]{display:none}.is-preview{border-color:#516c7c}
@keyframes radar-turn{to{transform:rotate(360deg)}}@keyframes signal-breathe{50%{opacity:.35}}@keyframes violation-reveal{from{opacity:1}to{opacity:0}}@keyframes preview-reveal{from{opacity:.25}to{opacity:1}}
.motion-paused *, .motion-paused *::after{animation-play-state:paused!important}
@media(max-width:1200px){.platform-signals{grid-template-columns:repeat(4,minmax(0,1fr))}.scan-radar{width:90px;height:90px}}
@media(max-width:600px){.scan-signal{gap:0;padding:20px 14px}.scan-radar{display:none}.platform-signals{grid-template-columns:repeat(2,minmax(0,1fr))}.platform-signal:last-child{grid-column:1/-1}.signal-head h2{font-size:17px}.signal-head button{font-size:12px;flex:none}.is-scanning [data-status=active] .signal-dot{animation:none}}
@media(prefers-reduced-motion:reduce){.scan-signal *, .viol-card.violation-new::after{animation:none!important}.is-scanning .scan-sweep{opacity:.55}.viol-card.violation-new::after{opacity:1;background:transparent}}
/* Feedback palette: restrained at rest, visibly active during a real scan or labeled demo. */
:root{--ease-out:cubic-bezier(.23,1,.32,1)}
.scan-radar .radar-pulse{position:absolute;inset:12%;border:1px solid rgba(97,208,223,.6);border-radius:50%;pointer-events:none;opacity:0}
body[data-fx=immersive] .is-scanning .radar-pulse{animation:radar-expand 2.4s linear infinite}
body[data-fx=immersive] .is-scanning .radar-pulse:last-child{animation-delay:1.2s}
body[data-fx=immersive] .is-scanning .scan-sweep{background:conic-gradient(from 0deg,transparent 215deg,rgba(97,208,223,.03) 265deg,rgba(97,208,223,.4) 351deg,#a5f5ff 359deg,transparent);animation-duration:3s}
.platform-signal{position:relative;overflow:hidden}
.platform-signal::after{content:'';pointer-events:none;position:absolute;inset:0;border:1px solid #61D0DF;border-radius:inherit;background:linear-gradient(115deg,rgba(97,208,223,.13),transparent);opacity:0;transition:opacity 220ms var(--ease-out)}
.platform-signal[data-status=active]::after{opacity:1}
.platform-signal[data-status=ok]::after,.platform-signal[data-status=empty]::after{opacity:.4;border-color:var(--good)}
[data-status=empty] .signal-dot{background:var(--good)}[data-status=error] .signal-dot{background:var(--bad)}
@keyframes radar-expand{0%{opacity:0;transform:scale(.65)}15%{opacity:.7}100%{opacity:0;transform:scale(1.4)}}
body[data-fx=quiet] .scan-signal *,body[data-fx=quiet] .scan-signal *::after,body[data-fx=quiet] .violation-new::after{animation:none!important;transition:none!important}
body[data-fx=quiet] .radar-pulse{display:none}
body[data-fx=quiet] .is-scanning .scan-sweep{opacity:.3}
body[data-fx-hidden=true] *,body[data-fx-hidden=true] *::before,body[data-fx-hidden=true] *::after{animation-play-state:paused!important}
body[data-input=keyboard] .platform-signal::after{transition:none}
@media(prefers-reduced-motion:reduce){.scan-radar .radar-pulse{display:none}.platform-signal::after{transition:none}.motion-preview-card{animation:none!important}}
@media(max-width:600px){body[data-fx=immersive] .is-scanning .radar-pulse{animation-duration:3s}.scan-radar .radar-pulse:last-child{display:none}}