changes

app/components/Bracket.tsx

@@ -9,13 +9,15 @@ function Side({
   s, prob, teams,
 }: { s: ResolvedSide; prob?: number | null; teams: Team[] }) {
   const team = s.teamId ? teams.find((t) => t.id === s.teamId) : undefined;
+  // fix = ein echtes Team steht fest (nicht vorläufig). Eigene Klasse für klares Styling.
+  const fix = s.teamId != null && !s.provisional;
   return (
-    <div className={`side ${s.isWinner ? "win" : ""} ${s.provisional ? "prov" : ""}`}>
+    <div className={`side ${s.isWinner ? "win" : ""} ${s.provisional ? "prov" : ""} ${fix ? "fix" : ""}`}>
       <span className="nm">
         {s.teamId ? (
           <>
             <Flag team={team} size={18} />
-            <span>{s.label}</span>
+            <span className="tn">{s.label}</span>
             {s.provisional && <span className="prov-mark" title="vorläufig – Gruppe/Zuordnung noch nicht fix">≈</span>}
           </>
         ) : (
@@ -33,7 +35,7 @@ function Side({
 function Tie({ tie, teams, isFinal }: { tie: ResolvedTie; teams: Team[]; isFinal?: boolean }) {
   return (
     <div className={`tie ${isFinal ? "final-tie" : ""}`}>
-      <span className="tie-num">Spiel {tie.matchNumber}</span>
+      <div className="tie-head">Spiel {tie.matchNumber}</div>
       <Side s={tie.home} prob={tie.prob?.home} teams={teams} />
       <Side s={tie.away} prob={tie.prob?.away} teams={teams} />
     </div>
@@ -119,4 +121,4 @@ export default function Bracket({
       </div>
     </div>
   );
-}
+}