/* Override tool-page max-width so inner 960px containers control width */
.tool-page:has(.find-panel) { max-width: 100%; }

/* ---- Find Page Selectors ---- */
.find-controls {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  margin-bottom: 0.8rem;
  flex-wrap: wrap;
}
.find-select-wrap { position: relative; }
.find-select {
  padding: 8px 32px 8px 12px;
  border: 1.5px solid #2a2d3a;
  border-radius: 10px;
  background: #1a1d27;
  color: #ccc;
  font-size: 0.8rem;
  font-weight: 600;
  font-family: inherit;
  line-height: 1.2;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  transition: border-color 0.15s;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 12px;
}
.find-select:hover, .find-select:focus { border-color: #3a3d4a; color: #fff; }
.find-select option { background: #1a1d27; color: #ccc; }

.find-panel { display: none; width: 100%; }
.find-panel.active { display: block; }

/* Hide per-finder instrument buttons when inside the Find page (except note input sub-panel) */
.find-panel .fd-instruments { display: none; }
#find-chords .sf-instruments,
#find-scales .sf-instruments { display: none; }

/* Key Finder sub-panels */
.kf-subpanel { display: none; }
.kf-subpanel.active { display: block; }

/* Hide in-panel key/scale selectors (moved to toolbar) */
.find-panel .kf-key-context,
.find-panel .pf-degree-context { display: none; }

/* Toolbar key selectors — hidden by default, shown for KF/PF */
.find-key-wrap { display: none; }
.find-key-wrap.visible { display: block; }