/* OBEINSON FREQUENCY X — Enhancement Processor appearance.
 *
 * The rack is the app's one piece of real personality: a wood faceplate, a
 * brushed-metal nameplate, ten vertical band faders. None of that changes
 * here. What changes is what the colours and sizes say.
 *
 * Contrast in this panel was already fine (6.4–12.9:1 measured). These are
 * semantic fixes, not accessibility ones, except for the type sizes.
 */

/* ---------------------------------------------------------------- 1
 * A band cell is  span.hz ("SUB") + input[range] + span.val ("0"):
 * .hz is the NAME and .val is the reading. dial-colors.css maps .hz to the
 * value hue, because "hz" reads as a frequency anywhere else in the app —
 * here it holds a label, so the rack was painting labels and their own
 * readouts the same orange and collapsing the one distinction the role
 * system exists to make. This is a regression that layer introduced; the
 * rack is the only place .hz means something different.
 */
#rackOv .hz,
#rackOv .rkB .hz {
  color: var(--dial-label) !important;
  -webkit-text-fill-color: var(--dial-label) !important;
}

/* ---------------------------------------------------------------- 2
 * The fader scale and the output meter legend were #5fbfa0, a teal that
 * belongs to no role. The scale is a set of readings; L / R / OUT is a key.
 */
#rackOv .rackScale span {
  color: var(--dial-value) !important;
  -webkit-text-fill-color: var(--dial-value) !important;
  opacity: .72;                      /* a scale should sit behind the faders */
}
#rackOv .rackMLbl span {
  color: var(--dial-label) !important;
  -webkit-text-fill-color: var(--dial-label) !important;
}

/* ---------------------------------------------------------------- 3
 * On/off was invisible: FLAT / ON / ON rendered identical plain white
 * whatever their state. POWER already carries .lit and swaps its text to
 * BYP, so the state was there and simply unstyled.
 *
 * Lit uses the "live / active / ok" green — the same green that marks the
 * playing station, so it means the same thing in both places. Bypassed goes
 * amber rather than red: bypass is a mode, not a fault.
 */
#rackOv #rackPower.lit,
#rackOv #rackMode.lit,
#rackOv #rackPhase.lit {
  background: rgba(0, 255, 34, .16) !important;
  border-color: #00ff22 !important;
  color: #00ff22 !important;
  -webkit-text-fill-color: #00ff22 !important;
  box-shadow: 0 0 10px rgba(0, 255, 34, .30) !important;
}
#rackOv #rackPower:not(.lit) {
  background: rgba(255, 212, 0, .12) !important;
  border-color: rgba(255, 212, 0, .75) !important;
  color: #ffd400 !important;
  -webkit-text-fill-color: #ffd400 !important;
}

/* ---------------------------------------------------------------- 4
 * #rackCurve held ten numbers at 8.5px in a dark green that no one could
 * read. It is now the EQ curve itself, drawn by enhance-rack.js into a
 * canvas — the one thing a ten-band enhancer should actually show. The
 * nameplate keeps its brushed-metal character but gives up the height.
 */
#rackOv #rackCurve {
  height: 46px !important;
  margin: 0 0 2px !important;
  display: block !important;
  font-size: 0 !important;            /* hides the numeric fallback text */
  line-height: 0 !important;
}
#rackOv #rackCurve canvas {
  display: block;
  width: 100%;
  height: 46px;
}
#rackOv .rackName b {
  font-size: 15px !important;
  letter-spacing: .26em !important;
}
#rackOv .rackName > span {
  font-size: 9px !important;
}

/* ---------------------------------------------------------------- 5
 * 8px type. Passing contrast does not make 8px comfortable, and these are
 * the labels that say what every control does.
 */
#rackOv .cap,
#rackOv .rackMLbl span,
#rackOv .rackScale span {
  font-size: 10px !important;
  letter-spacing: .06em;
}
#rackOv .rkB .hz {
  font-size: 11px !important;
}