/*
 * 악보 편집 — 선택 음표/쉼표 빨강 강조.
 * abcjs는 쉼표를 path/use 혼합으로 그려서 inline fill 속성만으로는 빨강 표시 안 되는 경우 있음
 * → CSS로 g 하위 모든 그리기 요소에 강제 적용.
 */
g.pf-selected-note path,
g.pf-selected-note ellipse,
g.pf-selected-note circle,
g.pf-selected-note rect,
g.pf-selected-note polygon,
g.pf-selected-note use {
  fill: #dc2626 !important;
  stroke: #dc2626 !important;
}
g.pf-selected-note text,
g.pf-selected-note tspan {
  fill: inherit !important;
  stroke: none !important;
}

/* Playback highlighting keeps the original lead/backing colors underneath. */
g.pf-playing-note { filter: drop-shadow(0 0 4px #d97706); }
g.pf-playing-note .abcjs-notehead { fill: #d97706 !important; }
@media print { [data-score-playback-controls] { display: none !important; } }

g.pf-selected-note { visibility: visible !important; }

.abcjs-notehead.pf-playing-note { fill: #d97706 !important; filter: drop-shadow(0 0 4px #d97706); }

.abcjs-notehead.pf-selected-note { fill: #dc2626 !important; stroke: #dc2626 !important; }

.pf-score-playback-dock {
  position: fixed;
  right: max(12px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
  z-index: 70;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 6px;
  width: 196px;
  padding: 10px;
  border: 1px solid #d3dfd9;
  border-radius: 14px;
  background: #fffffff5;
  box-shadow: 0 4px 20px #183d3026;
  color: #1e4032;
  font-size: 13px;
}
.pf-score-playback-dock button, .pf-score-playback-dock select {
  min-height: 40px;
  border: 1px solid #ccd8d2;
  border-radius: 8px;
  background: white;
  padding: 5px;
  cursor: pointer;
}
.pf-score-playback-dock button { white-space: nowrap; }
.pf-score-playback-dock [data-dock-play] { background: #39765c; color: white; }
.pf-score-playback-dock button:disabled { opacity: .55; cursor: wait; }
.pf-score-playback-dock [data-dock-speed], .pf-score-playback-dock [data-dock-status] { grid-column: 1 / -1; }
.pf-score-playback-dock [data-dock-status] { font-size: 11px; text-align: center; overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .pf-score-playback-dock { width: 176px; right: max(8px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); padding: 8px; }
  /* Keep the note/lyric edit toolbar clear of the player on narrow screens. */
  body:has(.pf-score-playback-dock) [data-note-actions-target="toolbar"],
  body:has(.pf-score-playback-dock) [data-score-renderer-target="lyricToolbar"] { bottom: 180px; }
}
@media print { .pf-score-playback-dock { display: none !important; } }