/* Crossover Frequency Tester — tool-specific overrides only.
   SIGNAL tool: plays a slow log sweep or a manually sweepable tone so the user can find driver
   handoffs by ear and mark candidate frequencies. No microphone. Prefix: xo */

.xo-warn-note {
  max-width: 820px; margin: var(--space-md) auto 0;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border); border-left: 4px solid var(--color-warning);
  border-radius: var(--radius-sm); background: rgba(255, 179, 0, 0.05);
  color: var(--color-text); font-size: 0.9rem; line-height: 1.55; text-align: left;
}
.xo-warn-note strong { color: var(--color-text-bright); }
.xo-warn-note a { color: var(--color-secondary); }

.input-label {
  display: block; font-size: var(--fs-sm); color: var(--color-text-muted);
  margin-bottom: var(--space-xs); font-family: var(--font-mono);
}

/* top control row */
.xo-toprow { display: flex; flex-wrap: wrap; gap: var(--space-md); align-items: flex-end; }
.xo-field { flex: 1 1 180px; min-width: 150px; }
.xo-volval { font-family: var(--font-mono); color: var(--color-primary); }

.xo-select, .xo-num {
  width: 100%; margin-top: 6px; padding: 10px 12px; background: var(--color-bg); color: var(--color-text);
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  font-family: var(--font-mono); font-size: 0.95rem;
}
.xo-select:focus, .xo-num:focus {
  outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(0, 255, 65, 0.18);
}

.xo-range { width: 100%; margin-top: 8px; accent-color: var(--color-primary); cursor: pointer; }
.xo-range--main { height: 28px; }
.xo-range:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }

/* mode panels */
.xo-modepanel { margin-top: var(--space-lg); }

.xo-bighz {
  text-align: center; font-family: var(--font-display); font-size: 2.4rem; line-height: 1.1;
  color: var(--color-primary); text-shadow: var(--glow-sm); margin-bottom: var(--space-sm);
}
.xo-bighz span { color: var(--color-primary); }

.xo-nudge {
  display: flex; flex-wrap: wrap; gap: var(--space-sm); justify-content: center;
  align-items: center; margin-top: var(--space-md);
}
.xo-nudgebtn { min-width: 110px; }

.xo-sweeprow { display: flex; flex-wrap: wrap; gap: var(--space-md); align-items: flex-end; }
.xo-hint, .xo-marks__empty {
  margin-top: var(--space-sm); font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.5;
}

.xo-actions {
  display: flex; flex-wrap: wrap; gap: var(--space-md); justify-content: center;
  margin-top: var(--space-lg);
}

.xo-status {
  margin-top: var(--space-md); padding: 10px 14px;
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  background: rgba(0, 255, 65, 0.03); color: var(--color-text);
  font-family: var(--font-mono); font-size: 0.88rem; line-height: 1.5; text-align: center;
}

.xo-h3 { font-size: 1.0rem; margin-top: var(--space-xl); margin-bottom: var(--space-sm); }

/* typical bands */
.xo-bands { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
@media (max-width: 680px) { .xo-bands { grid-template-columns: 1fr; } }
.xo-band {
  padding: var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  background: rgba(0, 255, 65, 0.02);
}
.xo-band__name {
  font-family: var(--font-display); font-size: 0.85rem; color: var(--color-text-bright);
  text-transform: uppercase; letter-spacing: 0.04em;
}
.xo-band__range {
  font-family: var(--font-mono); font-size: 1.35rem; color: var(--color-primary); margin: 4px 0 6px;
}
.xo-band__note { font-size: 0.82rem; color: var(--color-text-muted); line-height: 1.5; }

/* marks */
.xo-marks { display: flex; flex-direction: column; gap: 6px; }
.xo-mark-row {
  display: grid; grid-template-columns: 110px 1fr auto auto; gap: var(--space-sm); align-items: center;
  padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  background: rgba(0, 255, 65, 0.02);
}
.xo-mark-row__hz { font-family: var(--font-mono); font-size: 1.05rem; color: var(--color-primary); }
.xo-mark-row__band {
  font-size: 0.78rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.04em;
}
.xo-mark-row__go {
  padding: 5px 12px; background: transparent; color: var(--color-secondary);
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  font-family: var(--font-mono); font-size: 0.8rem; cursor: pointer; transition: var(--transition-fast);
}
.xo-mark-row__go:hover { border-color: var(--color-secondary); box-shadow: 0 0 8px rgba(0, 229, 255, 0.25); }
.xo-mark-row__del {
  width: 30px; height: 30px; line-height: 1; background: transparent; color: var(--color-text-muted);
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  font-size: 1.1rem; cursor: pointer; transition: var(--transition-fast);
}
.xo-mark-row__del:hover { border-color: var(--color-error); color: var(--color-error); }

.xo-marks-actions { margin-top: var(--space-md); }

@media (max-width: 520px) {
  .xo-mark-row { grid-template-columns: 1fr auto auto; }
  .xo-mark-row__band { display: none; }
  .xo-bighz { font-size: 1.9rem; }
}
