/* overseer live-model panel — scoped .rkv-*, tokens from the Abyssal Light system */
.rkv-panel {
  position: relative;
  margin: var(--ax-s-md) 0 var(--ax-s-sm);
  height: clamp(240px, 34vw, 330px);
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  overflow: hidden;
  background:
    radial-gradient(120% 90% at 70% -10%, rgba(143,140,242,.10) 0%, transparent 55%),
    radial-gradient(100% 80% at 15% 110%, rgba(78,231,214,.07) 0%, transparent 50%),
    linear-gradient(180deg, #0a1128 0%, #060a18 100%);
  box-shadow: inset 0 0 60px rgba(2,6,22,.6);
}
.rkv-panel::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; z-index: 2;
  background: linear-gradient(90deg, transparent, var(--ax-glow), transparent);
  opacity: .5; pointer-events: none;
}
.rkv-canvas-host, .rkv-canvas-host canvas {
  position: absolute; inset: 0; width: 100%; height: 100%; display: block;
}
.rkv-hud {
  position: absolute; z-index: 3; pointer-events: none;
  font-family: var(--ax-mono); font-size: .68rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ax-text-mute); text-shadow: 0 1px 6px rgba(2,6,22,.9);
}
.rkv-hud--legend { left: var(--ax-s-sm); bottom: var(--ax-s-xs); }
.rkv-hud--count  { right: var(--ax-s-sm); top: var(--ax-s-xs); color: var(--ax-teal); opacity: .85; }
.rkv-hud--count b { font-weight: 500; color: var(--ax-aqua); }
@media (max-width: 560px) { .rkv-hud--legend { display: none; } }
