feat(replay): Make deleted replay rows have same spacing as normal rows (#96008)

Before there was a little too much vertical space between the text
"Archived Replay" and the ID below.
Also the project icon was not aligned with the rows above/below.

**Before**
<img width="487" height="217" alt="SCR-20250721-jxwn"
src="https://github.com/user-attachments/assets/ab78ea49-b110-4873-bf41-74566bc94045"
/>
**After**

<img width="500" height="217" alt="SCR-20250721-jwyt"
src="https://github.com/user-attachments/assets/d685b75b-62f1-4bc2-98d6-c38e0bc21c51"
/>

Author: ryan953

static/app/components/replays/table/replayTableColumns.tsx

@@ -503,14 +503,12 @@ export const ReplaySessionColumn: ReplayTableColumn = {
     if (replay.is_archived) {
       return (
         <Flex gap={space(1)} align="center" justify="center">
-          <div style={{paddingInline: space(0.5)}}>
+          <ArchivedWrapper>
             <IconDelete color="gray500" size="md" />
-          </div>
+          </ArchivedWrapper>
 
-          <Flex direction="column" gap={space(0.5)}>
-            <Flex gap={space(0.5)} align="center">
-              {t('Deleted Replay')}
-            </Flex>
+          <Flex direction="column" gap={space(0.25)}>
+            <DisplayName>{t('Deleted Replay')}</DisplayName>
             <Flex gap={space(0.5)} align="center">
               {project ? <ProjectAvatar size={12} project={project} /> : null}
               <SmallFont>{getShortEventId(replay.id)}</SmallFont>
@@ -615,6 +613,12 @@ export const ReplaySlowestTransactionColumn: ReplayTableColumn = {
   },
 };
 
+const ArchivedWrapper = styled(Flex)`
+  width: ${p => p.theme.space['2xl']};
+  align-items: center;
+  justify-content: center;
+`;
+
 const DetailsLink = styled(Link)`
   z-index: 1;
   margin: -${p => p.theme.space.md};
@@ -672,7 +676,6 @@ const DisplayName = styled('span')`
 
   &:hover {
     color: ${p => p.theme.textColor};
-    text-decoration: underline;
   }
 `;