diff --git a/frontend/src/components/tables/EPGsTable.jsx b/frontend/src/components/tables/EPGsTable.jsx
index 848c1666..c429e3c4 100644
--- a/frontend/src/components/tables/EPGsTable.jsx
+++ b/frontend/src/components/tables/EPGsTable.jsx
@@ -94,9 +94,9 @@ const EPGsTable = () => {
     }
 
     return (
-      <Stack spacing={5}>
+      <Stack spacing={2}>
         <Text size="xs">{label}: {parseInt(progress.progress)}%</Text>
-        <Progress value={parseInt(progress.progress)} size="xs" />
+        <Progress value={parseInt(progress.progress)} size="xs" style={{ margin: '2px 0' }} />
         {progress.speed && <Text size="xs">Speed: {parseInt(progress.speed)} KB/s</Text>}
       </Stack>
     );
@@ -179,7 +179,7 @@ const EPGsTable = () => {
           if (data.status === 'error' && data.last_message) {
             return (
               <Tooltip label={data.last_message} multiline width={300}>
-                <Text c="dimmed" size="xs" lineClamp={2} style={{ color: theme.colors.red[6] }}>
+                <Text c="dimmed" size="xs" lineClamp={2} style={{ color: theme.colors.red[6], lineHeight: 1.3 }}>
                   {data.last_message}
                 </Text>
               </Tooltip>
@@ -189,7 +189,7 @@ const EPGsTable = () => {
           // Show success message for successful sources
           if (data.status === 'success') {
             return (
-              <Text c="dimmed" size="xs" style={{ color: theme.colors.green[6] }}>
+              <Text c="dimmed" size="xs" style={{ color: theme.colors.green[6], lineHeight: 1.3 }}>
                 EPG data refreshed successfully
               </Text>
             );
diff --git a/frontend/src/components/tables/M3UsTable.jsx b/frontend/src/components/tables/M3UsTable.jsx
index 44c79477..050ef211 100644
--- a/frontend/src/components/tables/M3UsTable.jsx
+++ b/frontend/src/components/tables/M3UsTable.jsx
@@ -108,7 +108,7 @@ const M3UTable = () => {
 
     return (
       <Box>
-        <Flex direction="column" gap={4}>
+        <Flex direction="column" gap={2}>
           <Flex justify="space-between" align="center">
             <Text size="xs" fw={500}>Downloading:</Text>
             <Text size="xs">{parseInt(data.progress)}%</Text>
@@ -142,7 +142,7 @@ const M3UTable = () => {
 
     return (
       <Box>
-        <Flex direction="column" gap={4}>
+        <Flex direction="column" gap={2}>
           <Flex justify="space-between" align="center">
             <Text size="xs" fw={500}>Processing groups:</Text>
             <Text size="xs">{parseInt(data.progress)}%</Text>
@@ -167,11 +167,11 @@ const M3UTable = () => {
   const buildErrorStats = (data) => {
     return (
       <Box>
-        <Flex direction="column" gap={4}>
+        <Flex direction="column" gap={2}>
           <Flex align="center">
             <Text size="xs" fw={500} color="red">Error:</Text>
           </Flex>
-          <Text size="xs" color="red">{data.error || "Unknown error occurred"}</Text>
+          <Text size="xs" color="red" style={{ lineHeight: 1.3 }}>{data.error || "Unknown error occurred"}</Text>
         </Flex>
       </Box>
     );
@@ -197,7 +197,7 @@ const M3UTable = () => {
 
     return (
       <Box>
-        <Flex direction="column" gap={4}>
+        <Flex direction="column" gap={2}>
           <Flex justify="space-between" align="center">
             <Text size="xs" fw={500}>Parsing:</Text>
             <Text size="xs">{parseInt(data.progress)}%</Text>
@@ -228,7 +228,7 @@ const M3UTable = () => {
   const buildInitializingStats = () => {
     return (
       <Box>
-        <Flex direction="column" gap={4}>
+        <Flex direction="column" gap={2}>
           <Flex align="center">
             <Text size="xs" fw={500}>Initializing refresh...</Text>
           </Flex>
@@ -340,9 +340,9 @@ const M3UTable = () => {
           const value = cell.getValue();
           if (!value) return null;
 
-          // Match EPG table styling with Text component
+          // Match EPG table styling with Text component - always use xs size
           return (
-            <Text size={tableSize === 'compact' ? 'xs' : 'sm'} c={getStatusColor(value)}>
+            <Text size="xs" c={getStatusColor(value)}>
               {formatStatusText(value)}
             </Text>
           );
@@ -387,7 +387,7 @@ const M3UTable = () => {
           if (data.status === 'error') {
             return (
               <Tooltip label={value} multiline width={300}>
-                <Text c="dimmed" size={tableSize === 'compact' ? 'xs' : 'sm'} lineClamp={2} style={{ color: theme.colors.red[6] }}>
+                <Text c="dimmed" size="xs" lineClamp={2} style={{ color: theme.colors.red[6], lineHeight: 1.3 }}>
                   {value}
                 </Text>
               </Tooltip>
@@ -398,7 +398,7 @@ const M3UTable = () => {
           if (data.status === 'success') {
             return (
               <Tooltip label={value} multiline width={300}>
-                <Text c="dimmed" size={tableSize === 'compact' ? 'xs' : 'sm'} style={{ color: theme.colors.green[6] }}>
+                <Text c="dimmed" size="xs" style={{ color: theme.colors.green[6], lineHeight: 1.3 }}>
                   {value}
                 </Text>
               </Tooltip>
@@ -408,7 +408,7 @@ const M3UTable = () => {
           // For all other status values, just use dimmed text
           return (
             <Tooltip label={value} multiline width={300}>
-              <Text c="dimmed" size={tableSize === 'compact' ? 'xs' : 'sm'} lineClamp={2}>
+              <Text c="dimmed" size="xs" lineClamp={2} style={{ lineHeight: 1.3 }}>
                 {value}
               </Text>
             </Tooltip>
@@ -421,7 +421,7 @@ const M3UTable = () => {
         size: 120,
         Cell: ({ cell }) => {
           const value = cell.getValue();
-          return value ? new Date(value).toLocaleString() : 'Never';
+          return value ? <Text size="xs">{new Date(value).toLocaleString()}</Text> : <Text size="xs">Never</Text>;
         },
       },
       {