ref(🥞): replace local z-index theme refs with bare z-index: 1

static/app/components/forms/fields/segmentedRadioField.tsx

@@ -125,7 +125,7 @@ const RadioItem = styled('label', {shouldForwardProp})<{
   &[aria-checked='true'] {
     border-color: ${p => p.theme.tokens.border.accent.vibrant} !important;
     box-shadow: inset 0 0 0 1px ${p => p.theme.tokens.focus.default};
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
 
   &:first-child {

static/app/components/infiniteList/infiniteListItems.tsx

@@ -153,7 +153,7 @@ const PositionedList = styled('ul')`
 const Footer = styled('footer')`
   position: absolute;
   bottom: 0;
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
   display: flex;
   width: 100%;
   flex-grow: 1;

static/app/components/panels/panelTable.tsx

@@ -193,7 +193,7 @@ const PanelTableHeader = styled('div')<{sticky: boolean}>`
     css`
       position: sticky;
       top: 0;
-      z-index: ${p.theme.zIndex.initial};
+      z-index: 1;
     `}
 `;
 

static/app/components/profiling/flamegraph/flamegraphOverlays/FlamegraphWarnings.tsx

@@ -106,6 +106,6 @@ const Overlay = styled('div')`
   grid: auto/50%;
   gap: ${p => p.theme.space.md};
   place-content: center;
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
   text-align: center;
 `;

static/app/components/replays/breadcrumbs/replayTimelineEvents.tsx

@@ -61,7 +61,7 @@ const EventColumn = styled(Timeline.Col)`
   position: relative;
 
   &:hover {
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
 `;
 

static/app/components/replays/player/bufferingOverlay.tsx

@@ -36,5 +36,5 @@ const Message = styled('div')`
   background: ${p => p.theme.colors.gray400};
   border-radius: ${p => p.theme.radius.md};
   color: ${p => p.theme.colors.white};
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
 `;

static/app/components/replays/player/fastForwardBadge.tsx

@@ -35,7 +35,7 @@ const FastForwardTooltip = styled(Tooltip)`
   color: ${p => p.theme.colors.white};
   padding: ${p => p.theme.space.lg} ${p => p.theme.space.xl};
   border-top-right-radius: ${p => p.theme.radius.md};
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
 `;
 
 const StyledIconArrow = styled(IconArrow)`

static/app/components/replays/player/scrubber.tsx

@@ -199,6 +199,6 @@ export const PlayerScrubber = styled(Scrubber)`
     top: 0;
     right: calc((var(--size) + (var(--borderWidth) * 2)) / 2 * -1);
     translate: 0 calc(-50% + var(--borderWidth));
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
 `;

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

@@ -137,7 +137,7 @@ export function ReplayTableHeader({
 
 const TableHeader = styled(SimpleTable.Header)`
   grid-row: 1;
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
   height: min-content;
 `;
 

static/app/components/replays/virtualizedGrid/detailsSplitDivider.tsx

@@ -57,14 +57,14 @@ const CloseButtonWrapper = styled('div')`
   right: 0;
   height: 100%;
   padding: ${p => p.theme.space.md};
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
   display: flex;
   align-items: center;
 `;
 
 const StyledSplitDivider = styled(SplitDivider)`
   :hover,
   &[data-is-held='true'] {
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
 `;

static/app/components/truncate.tsx

@@ -109,7 +109,7 @@ const FullValue = styled('span')<{
   ${p =>
     p.expanded &&
     css`
-      z-index: ${p.theme.zIndex.truncationFullValue};
+      z-index: 1;
       display: block;
     `}
 `;

static/app/components/workflowEngine/ui/footer.tsx

@@ -19,7 +19,7 @@ const StickyFooterBase = styled('div', {
   box-shadow: none;
   justify-content: flex-end;
   gap: ${p => p.theme.space.lg};
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
 
   &[data-stuck] {
     /* TODO(design-engineering): Replace with a directional shadow token when one exists */

static/app/debug/notifications/views/index.tsx

@@ -88,7 +88,7 @@ const HeaderContainer = styled('header')`
   top: 0;
   left: 0;
   right: 0;
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   background: ${p => p.theme.tokens.background.primary};
 `;
 

static/app/stories/view/index.tsx

@@ -222,7 +222,7 @@ function GlobalStoryStyles() {
     .messages-container {
       margin-top: 52px;
       margin-left: 256px;
-      z-index: ${theme.zIndex.header};
+      z-index: 1;
       background: ${theme.tokens.background.primary};
     }
   `;
@@ -250,7 +250,7 @@ const HeaderContainer = styled('header')`
   top: 0;
   left: 0;
   right: 0;
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   background: ${p => p.theme.tokens.background.primary};
 `;
 

static/app/stories/view/storySearch.tsx

@@ -286,7 +286,7 @@ const StorySearchContainer = styled('div')`
   position: relative;
   width: 320px;
   flex-grow: 1;
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   margin-left: -${p => p.theme.space.xl};
 `;
 

static/app/views/admin/installWizard/index.tsx

@@ -189,5 +189,5 @@ const SetupWizard = styled('div')`
   padding: 40px 40px 20px;
   max-width: 1000px;
   margin: ${p => p.theme.space['2xl']};
-  z-index: ${p => p.theme.zIndex.initial};
+  z-index: 1;
 `;

static/app/views/detectors/components/forms/common/schedulePreview.tsx

@@ -308,7 +308,7 @@ const OpenPeriodCountLabel = styled('div')`
 
 const StyledContainer = styled(Container)`
   top: 8px;
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   /*
     * Prevent seeing content beneath in the uncovered strip above the sticky element.
     * Use a solid, zero-blur shadow so we don't paint over the border.

static/app/views/discover/miniGraph.tsx

@@ -245,7 +245,7 @@ class MiniGraph extends Component<Props> {
               splitLine: {
                 show: false,
               },
-              zlevel: theme.zIndex.header,
+              zlevel: 1,
             },
             tooltip: {
               show: false,

static/app/views/explore/components/styles.tsx

@@ -67,7 +67,7 @@ export const ExploreBodySearch = styled(Layout.Body)`
 
   position: sticky;
   top: var(${TOP_BAR_HEIGHT_CSS_VAR}, 0px);
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   background-color: ${p => p.theme.tokens.background.primary};
 
   border-bottom: 1px solid ${p => p.theme.tokens.border.primary};

static/app/views/explore/replays/detail/network/details/tabs.tsx

@@ -50,7 +50,7 @@ export const StyledNetworkDetailsTabs = styled(NetworkDetailsTabs)`
     margin-right: 0;
     padding-right: ${p => p.theme.space['2xl']};
     background: ${p => p.theme.tokens.background.primary};
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
   & > li:first-child {
     padding-left: ${p => p.theme.space.xl};

static/app/views/issueDetails/streamline/eventDetails.tsx

@@ -69,7 +69,7 @@ function StickyEventNav({event, group}: {event: Event; group: Group}) {
 
 const FloatingEventNavigation = styled(Sticky)`
   background: ${p => p.theme.tokens.background.primary};
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   border-radius: ${p => p.theme.radius.md} ${p => p.theme.radius.md} 0 0;
 
   &[data-stuck] {

static/app/views/issueDetails/streamline/eventListTable.tsx

@@ -147,7 +147,7 @@ export const Header = styled('div')`
   border-bottom: 1px solid ${p => p.theme.tokens.border.transparent.neutral.muted};
   position: sticky;
   top: 0;
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
   border-radius: ${p => p.theme.radius.md} ${p => p.theme.radius.md} 0 0;
 `;
 

static/app/views/issueDetails/traceTimeline/traceTimelineEvents.tsx

@@ -213,7 +213,7 @@ const EventColumn = styled('div')`
   position: relative;
 
   &:hover {
-    z-index: ${p => p.theme.zIndex.initial};
+    z-index: 1;
   }
 `;
 

static/app/views/issueList/actions/index.tsx

@@ -365,7 +365,7 @@ function shouldConfirm(
 }
 
 const StickyActions = styled(Sticky)`
-  z-index: ${p => p.theme.zIndex.header};
+  z-index: 1;
 
   /* Remove border radius from the action bar when stuck. Without this there is
    * a small gap where color can peek through. */

static/app/views/projectsDashboard/projectChart.tsx

@@ -173,7 +173,7 @@ export function ProjectChart({
       splitLine: {
         show: false,
       },
-      zlevel: theme.zIndex.header,
+      zlevel: 1,
     })),
     axisPointer: {
       // Link each x-axis together.