localized team names

app/components/Fixtures.tsx

@@ -101,7 +101,7 @@ function GroupStandings({
                 <td className="team">
                   <span className={`rankdot ${cls}`}>{r.rank}</span>
                   <Flag team={team} size={20} />
-                  <span className="team-name">{team?.name ?? r.teamId}</span>
+                  <span className="team-name">{team?.localisedName ?? team?.name ?? r.teamId}</span>
                   {isLive && <span className="row-live-dot" title="läuft gerade" />}
                 </td>
                 <td>{r.played}</td>
@@ -163,12 +163,12 @@ export default function Fixtures({
                 <div className="fx-teams">
                   <div className={`fx-team home ${homeWin ? "win" : ""}`}>
                     <Flag team={home} size={22} />
-                    <span className="fx-name">{home?.name ?? "—"}</span>
+                    <span className="fx-name">{home?.localisedName ?? home?.name ?? "—"}</span>
                   </div>
                   <ScoreCell m={m} />
                   <div className={`fx-team away ${awayWin ? "win" : ""}`}>
                     <Flag team={away} size={22} />
-                    <span className="fx-name">{away?.name ?? "—"}</span>
+                    <span className="fx-name">{away?.localisedName ?? away?.name ?? "—"}</span>
                   </div>
                 </div>
                 <div className="fx-meta">

app/components/Flag.tsx

@@ -13,7 +13,7 @@ export default function Flag({
     return (
       <img
         src={team.crest}
-        alt={team.code || team.name}
+        alt={team.code || team.localisedName || team.name}
         className="flag"
         style={style}
         loading="lazy"

app/components/Groups.tsx

@@ -66,7 +66,7 @@ export default function Groups({
                       <td className="team">
                         <span className={`rankdot ${cls}`}>{r.rank}</span>
                         <Flag team={team} size={20} />
-                        <span className="team-name">{team?.name ?? r.teamId}</span>
+                        <span className="team-name">{team?.localisedName ?? team?.name ?? r.teamId}</span>
                         {isLive && <span className="row-live-dot" title="läuft gerade" />}
                       </td>
                       <td>{r.played}</td>

app/components/Simulation.tsx

@@ -298,7 +298,7 @@ function SimRow({
       <span style={{ display: "flex", alignItems: "center", gap: 6, minWidth: 0, flex: 1, justifyContent: "flex-end" }}>
         <Flag team={home} size={18} />
         <span style={{ fontWeight: 600, whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", maxWidth: 140 }}>
-          {home?.name ?? "—"}
+          {home?.localisedName ?? home?.name ?? "—"}
         </span>
       </span>
       <input
@@ -338,7 +338,7 @@ function SimRow({
       />
       <span style={{ display: "flex", alignItems: "center", gap: 6, minWidth: 0, flex: 1 }}>
         <span style={{ fontWeight: 600, whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", maxWidth: 140 }}>
-          {away?.name ?? "—"}
+          {away?.localisedName ?? away?.name ?? "—"}
         </span>
         <Flag team={away} size={18} />
       </span>

app/components/ThirdPlace.tsx

@@ -5,7 +5,10 @@ import { Team, ThirdPlaceRow } from "@/lib/types";
 export default function ThirdPlace({
   rows, teams,
 }: { rows: ThirdPlaceRow[]; teams: Team[] }) {
-  const name = (id: string) => teams.find((t) => t.id === id)?.name ?? id;
+  const name = (id: string) => {
+    const t = teams.find((t) => t.id === id);
+    return t?.localisedName ?? t?.name ?? id;
+  };
 
   return (
     <div className="third-wrap">