Map-Bilder und Seitenwahl mit Emblemen

Map-Bilder aus ghostcap-gaming/cs2-map-images lokal als WebP gespeichert
(npm run images lädt und verkleinert sie). Bilder in Veto-Kacheln,
Pool-Vorschau, Serie und Seitenwahl; CT/T-Embleme aus client/public/sides
mit Ersatzsymbol, falls die Dateien fehlen.

client/src/components/SeriesList.jsx

@@ -1,3 +1,6 @@
+import MapImage from './MapImage.jsx';
+import SideIcon from './SideIcon.jsx';
+
 const STATUS = { pending: 'Ausstehend', next: 'Wird eingerichtet', live: 'Aktuell', done: 'Gespielt' };
 
 export default function SeriesList({ state }) {
@@ -12,13 +15,19 @@ export default function SeriesList({ state }) {
           const t = s.ctTeam ? teams[s.ctTeam === 'A' ? 'B' : 'A'].name : null;
           return (
             <li key={s.number} className={`series-item is-${s.status}`} style={{ '--map': map?.color ?? '#556' }}>
+              <MapImage map={map} className="series-art" />
               <span className="series-no">Map {s.number}</span>
               <strong className="series-map">{s.mapName}</strong>
               <span className="series-origin">
                 {s.pickedBy ? `Pick von ${teams[s.pickedBy].name}` : 'Entscheidungsmap'}
               </span>
               <span className="series-sides">
-                {ct ? <><span className="side-ct">CT: {ct}</span> <span className="side-t">T: {t}</span></> : 'Seiten im Spiel festlegen'}
+                {ct ? (
+                  <>
+                    <span className="side-ct"><SideIcon side="CT" size={18} /> {ct}</span>
+                    <span className="side-t"><SideIcon side="T" size={18} /> {t}</span>
+                  </>
+                ) : 'Seiten im Spiel festlegen'}
               </span>
               <span className="series-status">{STATUS[s.status]}</span>
             </li>