diff --git a/src/components/article/ArticleUnifyDialog.jsx b/src/components/article/ArticleUnifyDialog.jsx
index 823467b..60c7209 100644
--- a/src/components/article/ArticleUnifyDialog.jsx
+++ b/src/components/article/ArticleUnifyDialog.jsx
@@ -950,7 +950,7 @@ export default class ArticleUnifyDialog extends Component {
                         onChange={(e) => this.setState({ selectedHistory: { ...selectedHistory, left: e.target.checked } })}
                       />
                       <Box sx={{ flex: 1, minWidth: 0 }}>
-                        <Stack direction="row" spacing={0.5} alignItems="center">
+                        <Stack direction="row" spacing={0.5} sx={{ alignItems: 'center' }}>
                           <HistoryOutlinedIcon fontSize="small" sx={{ color: 'text.secondary', flexShrink: 0 }} />
                           <Typography variant="body2" fontWeight={700}>
                             {leftHistory.length} Einträge vorhanden
@@ -977,7 +977,7 @@ export default class ArticleUnifyDialog extends Component {
                         onChange={(e) => this.setState({ selectedHistory: { ...selectedHistory, right: e.target.checked } })}
                       />
                       <Box sx={{ flex: 1, minWidth: 0 }}>
-                        <Stack direction="row" spacing={0.5} alignItems="center">
+                        <Stack direction="row" spacing={0.5} sx={{ alignItems: 'center' }}>
                           <HistoryOutlinedIcon fontSize="small" sx={{ color: 'text.secondary', flexShrink: 0 }} />
                           <Typography variant="body2" fontWeight={700}>
                             {rightHistory.length} Einträge vorhanden
diff --git a/src/components/article/tabs/ArticleSettingsTab.jsx b/src/components/article/tabs/ArticleSettingsTab.jsx
index a004236..9e47da9 100644
--- a/src/components/article/tabs/ArticleSettingsTab.jsx
+++ b/src/components/article/tabs/ArticleSettingsTab.jsx
@@ -131,7 +131,7 @@ export default class ArticleSettingsTab extends Component {
 
     return (
       <Box>
-        <Stack direction="row" spacing={1.5} alignItems="center" useFlexGap sx={{ flexWrap: 'wrap' }}>
+        <Stack direction="row" spacing={1.5} useFlexGap sx={{ alignItems: 'center', flexWrap: 'wrap' }}>
           <Button
             type="button"
             color="error"
diff --git a/src/components/article/tabs/ArticleSupplierTab.jsx b/src/components/article/tabs/ArticleSupplierTab.jsx
index c864d00..898fab4 100644
--- a/src/components/article/tabs/ArticleSupplierTab.jsx
+++ b/src/components/article/tabs/ArticleSupplierTab.jsx
@@ -308,7 +308,7 @@ export default class ArticleSupplierTab extends PureComponent {
                 >
                   {/* Sort Order & Reorder Controls */}
                   <TableCell sx={{ pl: 1 }}>
-                    <Stack direction="row" spacing={0.5} alignItems="center">
+                    <Stack direction="row" spacing={0.5} sx={{ alignItems: 'center' }}>
                       <Typography variant="caption" sx={{ minWidth: 16, fontWeight: 700, color: 'text.secondary' }}>
                         {index + 1}
                       </Typography>
@@ -403,7 +403,7 @@ export default class ArticleSupplierTab extends PureComponent {
 
                   {/* Actions */}
                   <TableCell align="right" sx={{ pr: 1 }}>
-                    <Stack direction="row" spacing={0.5} justifyContent="flex-end">
+                    <Stack direction="row" spacing={0.5} sx={{ justifyContent: 'flex-end' }}>
                       <Tooltip title="Bearbeiten">
                         <IconButton
                           size="small"
diff --git a/src/components/settings/BackupSettingsPanel.jsx b/src/components/settings/BackupSettingsPanel.jsx
index 0dde41c..3b9703b 100644
--- a/src/components/settings/BackupSettingsPanel.jsx
+++ b/src/components/settings/BackupSettingsPanel.jsx
@@ -222,7 +222,7 @@ export default class BackupSettingsPanel extends Component {
               Automatische Sicherung von Datenbank, virtuellen Dateisystemen (VFS) und Dokumentenspeicher.
             </Typography>
           </Box>
-          <Stack direction="row" spacing={1.5} alignItems="center">
+          <Stack direction="row" spacing={1.5} sx={{ alignItems: 'center' }}>
             <Button
               variant="outlined"
               size="small"
@@ -308,7 +308,7 @@ export default class BackupSettingsPanel extends Component {
           {/* Hourly KPI */}
           <Card variant="outlined" sx={{ bgcolor: WHITE, borderColor: BORDER, borderRadius: 2 }}>
             <CardContent sx={{ p: 2, '&:last-child': { pb: 2 } }}>
-              <Typography variant="caption" color="text.secondary" fontWeight={600} textTransform="uppercase">
+              <Typography variant="caption" color="text.secondary" fontWeight={600} sx={{ textTransform: 'uppercase' }}>
                 Stündliche Sicherungen
               </Typography>
               <Typography variant="h5" fontWeight={700} sx={{ color: DARK_4, mt: 0.5 }}>
@@ -330,7 +330,7 @@ export default class BackupSettingsPanel extends Component {
           {/* Daily KPI */}
           <Card variant="outlined" sx={{ bgcolor: WHITE, borderColor: BORDER, borderRadius: 2 }}>
             <CardContent sx={{ p: 2, '&:last-child': { pb: 2 } }}>
-              <Typography variant="caption" color="text.secondary" fontWeight={600} textTransform="uppercase">
+              <Typography variant="caption" color="text.secondary" fontWeight={600} sx={{ textTransform: 'uppercase' }}>
                 Tägliche Sicherungen
               </Typography>
               <Typography variant="h5" fontWeight={700} sx={{ color: DARK_4, mt: 0.5 }}>
@@ -352,7 +352,7 @@ export default class BackupSettingsPanel extends Component {
           {/* Monthly KPI */}
           <Card variant="outlined" sx={{ bgcolor: WHITE, borderColor: BORDER, borderRadius: 2 }}>
             <CardContent sx={{ p: 2, '&:last-child': { pb: 2 } }}>
-              <Typography variant="caption" color="text.secondary" fontWeight={600} textTransform="uppercase">
+              <Typography variant="caption" color="text.secondary" fontWeight={600} sx={{ textTransform: 'uppercase' }}>
                 Monatliche Sicherungen
               </Typography>
               <Typography variant="h5" fontWeight={700} sx={{ color: DARK_4, mt: 0.5 }}>
@@ -488,7 +488,7 @@ function BackupTableRow({ item, isExpanded, isManual, manifest, onToggleExpand }
         <TableCell colSpan={5} sx={{ py: 0, px: 3 }}>
           <Collapse in={isExpanded} timeout="auto" unmountOnExit>
             <Box sx={{ py: 2 }}>
-              <Typography variant="caption" fontWeight={700} color="text.secondary" textTransform="uppercase">
+              <Typography variant="caption" fontWeight={700} color="text.secondary" sx={{ textTransform: 'uppercase' }}>
                 Backup-Details & Manifest
               </Typography>
               <Box
diff --git a/src/components/settings/McpAuthorizationsPanel.jsx b/src/components/settings/McpAuthorizationsPanel.jsx
index 54b3fe8..700bec6 100644
--- a/src/components/settings/McpAuthorizationsPanel.jsx
+++ b/src/components/settings/McpAuthorizationsPanel.jsx
@@ -101,9 +101,9 @@ export default class McpAuthorizationsPanel extends Component {
     return (
       <Box sx={{ maxWidth: 860 }}>
         {/* Header */}
-        <Stack direction="row" alignItems="flex-start" justifyContent="space-between" sx={{ mb: 2.5 }}>
+        <Stack direction="row" sx={{ alignItems: 'flex-start', justifyContent: 'space-between', mb: 2.5 }}>
           <Box>
-            <Stack direction="row" alignItems="center" spacing={1} sx={{ mb: 0.5 }}>
+            <Stack direction="row" spacing={1} sx={{ alignItems: 'center', mb: 0.5 }}>
               <SecurityIcon sx={{ color: 'primary.main', fontSize: 24 }} />
               <Typography variant="h6" sx={{ fontWeight: 600 }}>
                 MCP-Autorisierungen & Sicherheit
@@ -190,11 +190,13 @@ export default class McpAuthorizationsPanel extends Component {
                   <CardContent sx={{ p: 2.5, '&:last-child': { pb: 2.5 } }}>
                     <Stack
                       direction={{ xs: 'column', sm: 'row' }}
-                      alignItems={{ xs: 'flex-start', sm: 'center' }}
-                      justifyContent="space-between"
                       spacing={2}
+                      sx={{
+                        alignItems: { xs: 'flex-start', sm: 'center' },
+                        justifyContent: 'space-between',
+                      }}
                     >
-                      <Stack direction="row" spacing={2} alignItems="center">
+                      <Stack direction="row" spacing={2} sx={{ alignItems: 'center' }}>
                         <Box
                           sx={{
                             width: 44,
@@ -212,7 +214,7 @@ export default class McpAuthorizationsPanel extends Component {
                         </Box>
 
                         <Box>
-                          <Stack direction="row" alignItems="center" spacing={1} useFlexGap sx={{ flexWrap: 'wrap' }}>
+                          <Stack direction="row" spacing={1} useFlexGap sx={{ alignItems: 'center', flexWrap: 'wrap' }}>
                             <Typography variant="subtitle1" sx={{ fontWeight: 600 }}>
                               {auth.clientName || 'Unbenannter Client'}
                             </Typography>
@@ -246,7 +248,7 @@ export default class McpAuthorizationsPanel extends Component {
                               Autorisiert: <strong>{authorizedDate}</strong>
                             </Typography>
                             {auth.tokenCount != null && (
-                              <Stack direction="row" spacing={0.5} alignItems="center">
+                              <Stack direction="row" spacing={0.5} sx={{ alignItems: 'center' }}>
                                 <KeyIcon sx={{ fontSize: 13, color: 'text.secondary' }} />
                                 <Typography variant="caption" sx={{ color: 'text.secondary' }}>
                                   Aktive Tokens: <strong>{auth.tokenCount}</strong>
diff --git a/src/routes/oauth/OAuthAuthorizePage.jsx b/src/routes/oauth/OAuthAuthorizePage.jsx
index 9619549..9b48c3b 100644
--- a/src/routes/oauth/OAuthAuthorizePage.jsx
+++ b/src/routes/oauth/OAuthAuthorizePage.jsx
@@ -271,7 +271,7 @@ export default class OAuthAuthorizePage extends Component {
             ) : (
               <Stack spacing={3}>
                 {/* Visual handshake illustration */}
-                <Stack direction="row" alignItems="center" justifyContent="center" spacing={2.5} sx={{ py: 1 }}>
+                <Stack direction="row" spacing={2.5} sx={{ alignItems: 'center', justifyContent: 'center', py: 1 }}>
                   <Box
                     sx={{
                       width: 56,