/* holding-anim.css — 홀딩·복행 흔적 애니메이션 + 고도 단면 (관리자 전용, 2026-09-27)
   색 토큰은 holding-watch.css와 같은 이름을 쓴다(다크 모드는 토큰이 맡는다). */

/* 지도 위 기체 아이콘 — 방향은 JS가 .hga-plane에 rotate로 준다 */
.hga-icon { background: none; border: 0; }
.hga-plane { width: 26px; height: 26px; transform-origin: 50% 50%; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .45)); }
.hga-plane.gap { opacity: .35; }   /* 수집 공백을 건너뛰는 중 — 그 사이 비행은 모른다 */

/* 고도 단면 상자 — 지도 위에 떠 있다(v2). 자리(left/bottom 또는 폰의 top)와 폭은 JS place()가 준다.
   ⚠ v1은 서랍 안(목록 아래 sticky)이었다 — 서랍에 스크롤이 생기고 선택한 줄을 덮어(운영 실화면) 옮겼다.
   z-index: Leaflet 판(≤700)·컨트롤(800) 위, 호스트 팝업보다는 아래에 둔다. */
.hga-box {
  position: absolute; z-index: 850;
  box-shadow: var(--shadow-lg, 0 8px 24px rgba(15, 23, 42, .18));
  padding: 8px 10px 6px;
  background: var(--bg-surface-elevated, #fff);
  border: 1px solid var(--border-subtle, #e2e8f0); border-radius: 10px;
  box-sizing: border-box; cursor: default;
}
.hga-hd { display: flex; align-items: center; gap: 6px; margin-bottom: 4px;
  font-size: var(--fs-md, 12px); font-weight: 700; color: var(--text-primary, #0f172a); }
.hga-t { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* v3 (2026-09-28): 머리줄을 끌어 옮긴다 — 끄는 동안 글자 선택·터치 스크롤을 막는다. 단추는 제 커서 그대로 */
.hga-hd { cursor: move; touch-action: none; user-select: none; -webkit-user-select: none; }
.hga-hd .hga-btn { cursor: pointer; }
.hga-box.hga-drag { opacity: .92; box-shadow: var(--shadow-xl, 0 12px 32px rgba(15, 23, 42, .28)); }
/* 관리자 전용 칩 — 일반 기능과 한눈에 갈라 보이게 보라(관리 쪽 강조색) */
.hga-adm { flex: none; padding: 0 7px; border-radius: 8px; font-size: 10px; font-weight: 700; line-height: 16px;
  color: #fff; background: var(--status-purple, #7c3aed); }
.hga-note { margin: -2px 0 4px; font-size: 10px; color: var(--text-muted, #64748b); }
.hga-ctl { margin-left: auto; display: flex; gap: 4px; flex: none; }
.hga-btn {
  width: auto !important;             /* 전역 button{width:100%} 방지 (holding-watch v11과 같은 함정) */
  min-width: 30px; height: 24px; padding: 0 7px; cursor: pointer;
  font-size: var(--fs-sm, 11px); font-weight: 700; line-height: 22px;
  color: var(--text-primary, #0f172a); background: var(--bg-sunken, #f8fafc);
  border: 1px solid var(--border-medium, #cbd5e1); border-radius: 6px;
}
.hga-btn:hover { background: var(--bg-hover, #eef2f7); }
.hga-spd { font-family: var(--font-mono, ui-monospace, Menlo, Consolas, monospace); }

.hga-wrap { width: 100%; }
.hga-svg { display: block; width: 100%; height: auto; touch-action: none; user-select: none; }
.hga-grid { stroke: var(--border-subtle, #e2e8f0); stroke-width: 1; }
.hga-ax { font-size: 10px; fill: var(--text-muted, #64748b); font-family: var(--font-mono, ui-monospace, Menlo, monospace); }
.hga-band { fill: var(--accent-cyan-soft, rgba(2, 132, 199, .10)); opacity: .8; }
.hga-area { opacity: .14; }
.hga-line { fill: none; stroke-width: 2; stroke-linejoin: round; }
.hga-min { fill: var(--bg-surface-elevated, #fff); stroke-width: 2; }
.hga-minlbl { font-size: 10px; font-weight: 700; fill: var(--text-secondary, #475569); }
.hga-cur { stroke: var(--text-secondary, #475569); stroke-width: 1; stroke-dasharray: 3 3; }
.hga-dot { stroke: #fff; stroke-width: 1.5; }
.hga-hit { fill: transparent; cursor: ew-resize; }
.hga-rd { margin-top: 2px; font-size: var(--fs-sm, 11px); color: var(--text-secondary, #475569);
  font-family: var(--font-mono, ui-monospace, Menlo, Consolas, monospace); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }