/* fxdebug.css — the floating FX-debug panel (js/fxdebug.js). A compact dark console, top-right by
 * default, draggable by its header, above every TV layer. Dev tool — intentionally utilitarian. */
#fxdebug {
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 200;                 /* above standby (z75), grille (z70), modals (z25) */
  width: 270px;
  background: rgba(10, 14, 20, 0.94);
  border: 1px solid #2b3340;
  border-radius: 8px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.55);
  color: #cdd6e2;
  font-family: "Courier New", monospace;
  font-size: 12px;
  user-select: none;
}
#fxdebug[hidden] { display: none; }

#fxd-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 10px;
  background: #161d27;
  border-bottom: 1px solid #2b3340;
  border-radius: 8px 8px 0 0;
  letter-spacing: 2px;
  font-weight: bold;
  color: #6fd3ff;
}
#fxd-x {
  background: none; border: 0; color: #9fb0c4; font-size: 18px; line-height: 1;
  cursor: pointer; padding: 0 2px;
}
#fxd-x:hover { color: #fff; }

#fxd-body { padding: 6px 10px 2px; }
.fxd-layer { padding: 6px 0; border-bottom: 1px dashed #232b36; }
.fxd-layer:last-child { border-bottom: 0; }
.fxd-tog { display: flex; align-items: center; gap: 7px; cursor: pointer; color: #e6edf5; letter-spacing: 1px; }
.fxd-tog b { font-weight: bold; }
.fxd-tog input { accent-color: #6fd3ff; }

.fxd-row { display: flex; align-items: center; gap: 8px; margin: 5px 0 0 18px; }
.fxd-lab { width: 56px; color: #8fa1b5; font-size: 11px; letter-spacing: 1px; }
.fxd-row input[type="range"] { flex: 1; accent-color: #6fd3ff; min-width: 0; }
.fxd-val { width: 46px; text-align: right; color: #b7e6ff; font-variant-numeric: tabular-nums; }

#fxd-foot { display: flex; gap: 8px; padding: 8px 10px 10px; }
#fxd-foot button {
  flex: 1;
  background: #1d2733; color: #cdd6e2; border: 1px solid #33404f; border-radius: 5px;
  padding: 6px 0; font-family: inherit; font-size: 11px; letter-spacing: 1px; cursor: pointer;
}
#fxd-foot button:hover { background: #283544; color: #fff; }
#fxd-foot #fxd-reset:hover { border-color: #c8553d; color: #ffb4a2; }
