.sonar-scene{--sonar-water:#092d38;--sonar-light:var(--accent,#72e4cf);margin:12px 0 14px;overflow:hidden;border:1px solid var(--line,rgba(135,172,180,.25));border-radius:18px;background:var(--panel,#092d38);color:var(--text)}
.sonar-scene-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;font-size:10px;font-weight:700;letter-spacing:1px}
.sonar-scene-head>span{min-width:0}.sonar-scene-head small{display:inline-block;margin-left:5px;font-size:10px;font-weight:500;letter-spacing:0;color:var(--muted)}
.sonar-scene .sonar-pause{min-height:36px;flex-shrink:0;padding:5px 8px;border:0;background:transparent;color:var(--text);font-size:11px;font-weight:600;letter-spacing:0;border-radius:9px;cursor:pointer;box-shadow:none}
.sonar-scene .sonar-pause:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.sonar-window{position:relative;height:96px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 45% 0%,#164d59 0%,var(--sonar-water) 78%);color:var(--sonar-light)}
.sonar-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(136,224,210,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(136,224,210,.06) 1px,transparent 1px);background-size:20px 20px}
.sonar-window svg{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.sonar-sweep{position:absolute;inset:0 auto 0 0;width:36%;background:linear-gradient(90deg,transparent,rgba(105,245,196,.04) 40%,rgba(105,245,196,.16));border-right:1px solid rgba(159,255,224,.8);animation:kiyi-sonar-scan 6s linear infinite;opacity:.75;pointer-events:none}
.sonar-fish{animation:kiyi-sonar-swim var(--swim-duration,22s) linear infinite;animation-delay:var(--swim-delay,0s);opacity:.6}
.sonar-seabed{fill:#071e29;opacity:.6}
.sonar-scene>p{margin:0;padding:8px 12px;font-size:10px;line-height:1.5;color:var(--muted);letter-spacing:0}
.sonar-scene.is-paused .sonar-sweep,.sonar-scene.is-paused .sonar-fish{animation-play-state:paused}
@keyframes kiyi-sonar-scan{from{transform:translateX(-100%)}to{transform:translateX(280%)}}
@keyframes kiyi-sonar-swim{from{transform:translateX(410px)}to{transform:translateX(-55px)}}
@media(prefers-reduced-motion:reduce){.sonar-sweep,.sonar-fish{animation:none}.sonar-fish{transform:translateX(var(--still-x,180px))}.sonar-sweep{display:none}.sonar-scene .sonar-pause{display:none}}