mira, tengo esto

(venv) huggingface-math-rm-7693149:~/huggingface-math-rm/backend{main}$ python -m uvicorn main:app --host 0.0.0.0 --port 8000 --reload
INFO:     Will watch for changes in these directories: ['/home/user/huggingface-math-rm/backend']
INFO:     Uvicorn running on http://0.0.0.0:8000 (Press CTRL+C to quit)
INFO:     Started reloader process [53372] using StatReload
Error al cargar el modelo: marshal data too short
INFO:     Started server process [53374]
INFO:     Waiting for application startup.
INFO:     Application startup complete.
INFO:     127.0.0.1:49354 - "GET / HTTP/1.1" 404 Not Found

mira mis documentos:

# backend/main.py

import torch
from transformers import AutoModel, AutoTokenizer
from fastapi import FastAPI, HTTPException
from pydantic import BaseModel
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()

# Configuración de CORS
origins = [
    "http://localhost:5173",  # URL del frontend React (Vite usa por defecto el puerto 5173)
    "http://127.0.0.1:5173",
]

app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,          # Permitir solicitudes desde estos orígenes
    allow_credentials=True,
    allow_methods=["*"],            # Permitir todos los métodos HTTP
    allow_headers=["*"],            # Permitir todas las cabeceras
)

# Configuración del modelo
model_name = "Qwen/Qwen2.5-Math-RM-72B"
device = "auto"  # Usa 'cuda' si tienes GPU, o 'cpu' si no

# Cargar el modelo y el tokenizador
try:
    model = AutoModel.from_pretrained(
        model_name, 
        device_map=device, 
        torch_dtype=torch.bfloat16 if device != "cpu" else torch.float32,
        trust_remote_code=True,
    ).eval()
    tokenizer = AutoTokenizer.from_pretrained(model_name, trust_remote_code=True)
except Exception as e:
    print(f"Error al cargar el modelo: {e}")

# Definir el esquema de la petición
class Message(BaseModel):
    user_input: str

@app.post("/chat/")
async def get_bot_response(message: Message):
    try:
        chat = [
            {"role": "system", "content": "Please reason step by step, and put your final answer within \\boxed{}."},
            {"role": "user", "content": message.user_input},
        ]

        # Crear la cadena de conversación según el formato del tokenizador
        conversation_str = tokenizer.apply_chat_template(
            chat, 
            tokenize=False, 
            add_generation_prompt=False
        )

        input_ids = tokenizer.encode(
            conversation_str, 
            return_tensors="pt", 
            add_special_tokens=False
        ).to(model.device)

        with torch.no_grad():
            outputs = model.generate(
                input_ids=input_ids,
                max_new_tokens=512,
                temperature=0.7,
                top_p=0.9,
                do_sample=True,
                stop_token_id=tokenizer.eos_token_id
            )

        response = tokenizer.decode(outputs[0], skip_special_tokens=True)
        # Extraer la respuesta del asistente
        assistant_response = response.split("assistant:",1)[-1].strip()

        return {"response": assistant_response}

    except Exception as e:
        raise HTTPException(status_code=500, detail=str(e))

ahora en mi fronted tengo esto:

// frontend/src/App.tsx

import React, { useState, useEffect, useRef } from "react";
import { FiSend, FiRefreshCw } from "react-icons/fi";
import ReactMarkdown from "react-markdown";
import axios from "axios";
import "./App.css";

interface Mensaje {
  texto: string;
  respuesta: boolean;
}

function App() {
  const [mensajes, setMensajes] = useState<Mensaje[]>([
    { texto: "Hola, ¿en qué puedo ayudarte con Matemáticas?", respuesta: true },
  ]);
  const [mensaje, setMensaje] = useState("");
  const [isTyping, setIsTyping] = useState(false);
  const messagesEndRef = useRef<HTMLDivElement>(null);

  const enviarMensaje = async () => {
    if (mensaje.trim() !== "") {
      const nuevoMensaje: Mensaje = { texto: mensaje, respuesta: false };
      setMensajes((prevMensajes) => [...prevMensajes, nuevoMensaje]);
      setMensaje("");
      setIsTyping(true);

      try {
        const response = await axios.post("http://localhost:8000/chat/", {
          user_input: mensaje,
        });

        const respuestaIA: Mensaje = {
          texto: response.data.response,
          respuesta: true,
        };
        setMensajes((prevMensajes) => [...prevMensajes, respuestaIA]);
      } catch (error) {
        console.error("Error al obtener respuesta de la IA:", error);
        const errorMensaje: Mensaje = {
          texto: "Lo siento, hubo un problema al obtener la respuesta de la IA.",
          respuesta: true,
        };
        setMensajes((prevMensajes) => [...prevMensajes, errorMensaje]);
      } finally {
        setIsTyping(false);
      }
    }
  };

  const handleClearChat = () => {
    setMensajes([
      { texto: "Hola, ¿en qué puedo ayudarte con Matemáticas?", respuesta: true },
    ]);
  };

  useEffect(() => {
    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
  }, [mensajes, isTyping]);

  return (
    <div className="w-screen h-screen flex flex-col items-center justify-center bg-[#1a1d23]">
      <div className="w-full max-w-md p-6 rounded-2xl shadow-2xl bg-[#1a1d23]">
        <div className="flex justify-between items-center mb-4">
          <h1 className="text-3xl font-bold text-yellow-400">
            Hugginface Matemáticas
          </h1>
          <button
            onClick={handleClearChat}
            className="rounded-full p-2 transition duration-200 bg-[#333333] hover:bg-[#555555]"
          >
            <FiRefreshCw className="w-5 h-5 text-yellow-400" />
          </button>
        </div>

        <div className="bg-[#333333] rounded-2xl p-4 flex flex-col overflow-y-scroll h-[400px] text-yellow-400 custom-scrollbar">
          <ul>
            {mensajes.map((msg, idx) => (
              <li
                key={idx}
                className={`my-2 flex ${
                  msg.respuesta ? "justify-start" : "justify-end"
                }`}
              >
                <div
                  className={`p-3 max-w-xs md:max-w-sm lg:max-w-md break-words rounded-xl shadow-md ${
                    msg.respuesta
                      ? "bg-[#555555] text-yellow-400"
                      : "bg-[#000000] text-yellow-400"
                  }`}
                >
                  <p className="text-sm opacity-75 mb-1">
                    {msg.respuesta ? "Hugginface" : "Tú"}
                  </p>
                  <ReactMarkdown>{msg.texto}</ReactMarkdown>
                </div>
              </li>
            ))}
          </ul>

          {isTyping && (
            <div className="flex justify-start items-center space-x-2">
              <img
                src="https://cdn-1.webcatalog.io/catalog/google-ai-studio/google-ai-studio-icon-filled-256.png?v=1714782928979"
                alt="IA Avatar"
                className="w-8 h-8 rounded-full bg-gray-700"
              />
              <div className="bg-[#333333] p-3 max-w-xs md:max-w-sm lg:max-w-md rounded-xl shadow-md">
                <p className="text-sm opacity-75 mb-1">Hugginface</p>
                <p className="text-lg animate-pulse">Escribiendo...</p>
              </div>
            </div>
          )}

          <div ref={messagesEndRef} />
        </div>
        <div className="flex mt-4">
          <textarea
            value={mensaje}
            onChange={(e) => setMensaje(e.target.value)}
            className="w-full p-4 rounded-2xl outline-none border-none bg-[#333333] text-yellow-400 resize-none"
            placeholder="Escribe un mensaje..."
            rows={1}
            onInput={(e) => {
              const target = e.target as HTMLTextAreaElement;
              target.style.height = "auto";
              target.style.height = `${target.scrollHeight}px`;
            }}
          />
          <button
            onClick={enviarMensaje}
            className="ml-4 rounded-full p-2 transition duration-200 bg-[#333333] text-yellow-400 hover:bg-yellow-400 hover:text-[#333333]"
          >
            <FiSend className="w-5 h-5" />
          </button>
        </div>
      </div>
      <div className="mt-6 text-center mb-2 text-sm text-yellow-400">
        Creado por{" "}
        <span className="bg-yellow-400 text-[#1a1d23] px-1 py-0.5 rounded text-xs">
          Johan Morales
        </span>
      </div>
      <div className="text-center mb-4 text-xs text-yellow-300">
        Modelo: Hugginface Mathematics
      </div>
    </div>
  );
}

export default App;