feat: premium redesign — DM Serif, refined palette, flat score badges

- Design tokens (ds.ts, theme.ts, scoreTheme.ts): new warm palette
  (#152642 navy, #f9f8f6 warm white, #e8e7e4 borders, #b8975a gold accent),
  flat score tier badges replacing CSS gradients, Inter + DM Serif Display typography
- Card components: white-background cards, DM Serif score numbers, max-2 badge
  chips with +N overflow tooltip, editorial score badge positioning
- Layout shell: gold left-accent nav active state, 64px top bar, outlined
  workspace chip, DM Serif page titles
- Shared atoms: GenericBadge (outlined/solid variants), ResultFilterBar
  (simplified chip styles), DecisionContextPanel (dot metrics, no left accent)
- Global replacement (118 files): #1e3a5f→#152642, #e2e8f0→#e8e7e4,
  #f4f6f9→#f9f8f6 — all handled via Node.js for proper UTF-8 safety

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/components/shared/GenericBadge.tsx

@@ -6,26 +6,15 @@ export type BadgeSemanticVariant = keyof typeof BADGE_COLORS
 
 export interface GenericBadgeProps {
   label: string
-  /**
-   * Semantic variant key from BADGE_COLORS (preferred).
-   * Example: semanticVariant="confidenceHigh" instead of color="#1a7a4a"
-   */
+  /** Semantic variant key from BADGE_COLORS (preferred). */
   semanticVariant?: BadgeSemanticVariant
-  /**
-   * Raw hex color — use only when no semantic variant fits.
-   * Prefer semanticVariant to avoid hardcoded colors.
-   */
+  /** Raw hex color — use only when no semantic variant fits. */
   color?: string
-  /** transparent: semi-opaque bg (color + 18% opacity) | solid: filled bg, white text */
-  variant?: 'transparent' | 'solid'
-  /** Adds a 1px border at color 25% opacity (transparent variant only) */
-  showBorder?: boolean
-  /** fontWeight 700 instead of 600 */
+  /** outlined: border + text, no bg | solid: filled bg, white text */
+  variant?: 'outlined' | 'solid'
   bold?: boolean
-  /** Optional lucide / MUI icon element — sized by the caller */
   icon?: ReactElement
   size?: 'small' | 'medium'
-  /** Wraps the badge in a Tooltip */
   tooltip?: string
   ariaLabel?: string
 }
@@ -34,15 +23,14 @@ export function GenericBadge({
   label,
   semanticVariant,
   color: colorProp,
-  variant = 'transparent',
-  showBorder = false,
+  variant = 'outlined',
   bold = false,
   icon,
   size = 'small',
   tooltip,
   ariaLabel,
 }: GenericBadgeProps) {
-  const color = semanticVariant ? BADGE_COLORS[semanticVariant] : (colorProp ?? '#64748b')
+  const color = semanticVariant ? BADGE_COLORS[semanticVariant] : (colorProp ?? '#9a9a9a')
 
   const chip = (
     <Chip
@@ -51,11 +39,11 @@ export function GenericBadge({
       icon={icon}
       aria-label={ariaLabel}
       sx={{
-        fontWeight: bold ? 700 : 600,
-        fontSize: size === 'small' ? '0.7rem' : '0.8125rem',
-        bgcolor: variant === 'solid' ? color : `${color}18`,
+        fontWeight: bold ? 700 : 500,
+        fontSize: size === 'small' ? '0.75rem' : '0.8125rem',
+        bgcolor: variant === 'solid' ? color : 'transparent',
         color: variant === 'solid' ? 'white' : color,
-        border: variant === 'transparent' && showBorder ? `1px solid ${color}40` : 'none',
+        border: variant === 'outlined' ? `1px solid ${color}` : 'none',
         '& .MuiChip-icon': { ml: 0.5 },
       }}
     />

src/components/shared/LocationPreview.tsx

@@ -114,7 +114,7 @@ export function LocationPreview({ imageUrl, lat, lng, address, cityLabel, height
             '&:hover': { bgcolor: 'white' },
           }}
         >
-          <Map size={14} color="#1e3a5f" />
+          <Map size={14} color="#152642" />
         </IconButton>
       </Tooltip>
     </Box>

src/components/shared/PropertyMap.tsx

@@ -111,7 +111,7 @@ export function PropertyMap({ lat, lng, label, height = 260, searchCenterLat, se
             </Typography>
           </Box>
           <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>
-            <Box sx={{ width: 10, height: 10, borderRadius: '50%', bgcolor: '#1e3a5f', flexShrink: 0 }} />
+            <Box sx={{ width: 10, height: 10, borderRadius: '50%', bgcolor: '#152642', flexShrink: 0 }} />
             <Typography sx={{ fontSize: '0.67rem', color: '#334155' }}>Objekt</Typography>
           </Box>
         </Box>

src/components/shared/ViewToggle.tsx

@@ -17,7 +17,7 @@ export function ViewToggle({ view, onChange }: Props) {
             borderRadius: 0,
             width: 32,
             height: 32,
-            bgcolor: view === 'list' ? '#1e3a5f' : 'transparent',
+            bgcolor: view === 'list' ? '#152642' : 'transparent',
             color: view === 'list' ? 'white' : '#64748b',
             '&:hover': { bgcolor: view === 'list' ? '#162d4a' : '#f1f5f9' },
           }}
@@ -33,7 +33,7 @@ export function ViewToggle({ view, onChange }: Props) {
             borderRadius: 0,
             width: 32,
             height: 32,
-            bgcolor: view === 'grid' ? '#1e3a5f' : 'transparent',
+            bgcolor: view === 'grid' ? '#152642' : 'transparent',
             color: view === 'grid' ? 'white' : '#64748b',
             '&:hover': { bgcolor: view === 'grid' ? '#162d4a' : '#f1f5f9' },
           }}