fix eval ui on the bottom

src/App.vue

@@ -609,9 +609,10 @@ const translate = async () => {
               {{ targetText }}
             </template>
             <span v-else class="text-slate-300 dark:text-slate-600 italic">翻译结果将在此显示...</span>
+          </div>
 
           <!-- Evaluation Results -->
-            <div v-if="isEvaluating || evaluationResult" class="mt-8 pt-6 border-t dark:border-slate-800 space-y-4 animate-in fade-in slide-in-from-bottom-2 duration-500">
+          <div v-if="isEvaluating || evaluationResult" class="px-6 py-4 bg-slate-200/20 dark:bg-slate-800/20 border-t border-dashed dark:border-slate-800 space-y-4 animate-in fade-in slide-in-from-bottom-2 duration-500 overflow-y-auto max-h-80 shrink-0">
             <div class="flex items-center justify-between">
               <div class="flex items-center gap-2">
                 <div :class="cn(
@@ -652,7 +653,6 @@ const translate = async () => {
               </div>
             </div>
           </div>
-          </div>
 
           <div class="p-4 border-t dark:border-slate-800 bg-slate-50/30 dark:bg-transparent flex justify-end shrink-0">
             <button