/* Лазоревка — помощник пульта. Только transform/opacity; цвета — токены пульта (app.css), с запасными значениями. */
.lzh { position: absolute; inset: 0; pointer-events: none; }
.lzh[hidden], .lzh-bubble[hidden] { display: none; }
.lzh-world { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.lzh-bird, .lzh-g { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-origin: 0 0; }
.lzh-bird { will-change: transform; }
.lzh-fly { opacity: 0; }
.lzh-part { position: absolute; display: block; max-width: none; user-select: none; -webkit-user-drag: none; }
.lzh-part[src*="wing"], .lzh-part[src*="tail"] { will-change: transform; }

.lzh-bubble { position: absolute; left: 0; top: 0; visibility: hidden; opacity: 0; z-index: 1;
  width: max-content; max-width: 240px; box-sizing: border-box; pointer-events: auto;
  display: flex; align-items: baseline; gap: 10px; padding: 8px 10px 8px 12px;
  background: var(--panel, #FFFFFF); color: var(--navy, #0E1A2B);
  border: 1px solid #D5DDF3; border-radius: 12px; box-shadow: 0 6px 22px rgba(14, 26, 43, .14);
  font: 500 13px/1.35 var(--f-body, 'Golos Text', system-ui, sans-serif); letter-spacing: 0; }
.lzh-bubble::after { content: ''; position: absolute; left: var(--tail, 70%); bottom: -6px; width: 10px; height: 10px;
  margin-left: -5px; background: inherit; border: inherit; border-width: 0 1px 1px 0; transform: rotate(45deg); }
.lzh-text { flex: 1 1 auto; min-width: 9.5em; }
.lzh-side::after { display: none; }
.lzh-no { flex: 0 0 auto; min-height: 0; padding: 2px 6px; border: 0; border-radius: 6px; background: transparent;
  color: var(--muted, #586371); font-family: inherit; font-size: 11px; font-weight: 500; line-height: 1.2; cursor: pointer; }
.lzh-no:hover, .lzh-no:focus-visible { background: #E8EDF8; color: #1B3C9E; }
@media (prefers-color-scheme: dark) {
  .lzh-bubble { background: var(--panel, #16233A); color: var(--ink, #E6EAF2); border-color: #2A3A55; box-shadow: 0 6px 22px rgba(0, 0, 0, .35); }
  .lzh-no:hover, .lzh-no:focus-visible { background: #22325A; color: #D5DDF3; }
}
.lzh-name { display: block; font: 600 11px/1.2 'Geologica', system-ui, sans-serif; letter-spacing: .02em; color: var(--accent, #1B3C9E); margin-bottom: 2px; }
@media (prefers-color-scheme: dark) { .lzh-name { color: #8FA8F5; } }