minor ui/ux stuff

src/app/(tabs)/_layout.tsx

@@ -11,7 +11,7 @@ export default function TabsLayout() {
   const colors = useColors();
   return (
     <Tabs
-      detachInactiveScreens
+      detachInactiveScreens={false}
       screenOptions={{
         headerShown: false,
         freezeOnBlur: false,

src/app/(tabs)/eq.tsx

@@ -89,7 +89,8 @@ export default function EQScreen() {
   const { width: windowWidth, height: windowHeight } = useWindowDimensions();
   const insets = useSafeAreaInsets();
   const availableWidth = windowWidth - insets.left - insets.right;
-  const isWide = isWideWindow(availableWidth, windowHeight - insets.top - insets.bottom);
+  const availableHeight = windowHeight - insets.top - insets.bottom;
+  const isWide = isWideWindow(availableWidth, availableHeight);
   // Editing pane keeps a phone-ish width; the graph gets everything else.
   const sidePaneWidth = Math.min(360, Math.max(280, Math.round(availableWidth * 0.4)));
 
@@ -273,7 +274,7 @@ export default function EQScreen() {
   );
 
   const bottomBarEl = (
-    <View style={[styles.bottomBar, isWide && styles.bottomBarWide]}>
+    <View style={[styles.bottomBar, !isWide && styles.bottomBarNarrow, isWide && styles.bottomBarWide]}>
       <View style={styles.preamp}>
         <EQSlider
           label="Preamp"
@@ -660,7 +661,7 @@ const useStyles = createThemedStyles((colors) => ({
   },
   graphWrap: {
     flex: 1,
-    minHeight: 180,
+    minHeight: 168,
     marginHorizontal: spacing.lg,
   },
   section: {
@@ -697,6 +698,9 @@ const useStyles = createThemedStyles((colors) => ({
     paddingTop: spacing.md,
     paddingBottom: spacing.sm,
   },
+  bottomBarNarrow: {
+    paddingTop: spacing.xs,
+  },
   preamp: {
     flex: 1,
   },

src/app/_layout.tsx

@@ -363,7 +363,7 @@ export default function RootLayout() {
               presentation: 'transparentModal',
               animation: 'none',
               gestureEnabled: false,
-              contentStyle: { backgroundColor: 'transparent' },
+              contentStyle: { backgroundColor: theme.colors.bgPrimary },
             }}
           />
         </Stack>

src/app/now-playing.tsx

@@ -1064,7 +1064,7 @@ export default function NowPlayingScreen() {
 const useStyles = createThemedStyles((colors) => ({
   backdrop: {
     flex: 1,
-    backgroundColor: 'transparent',
+    backgroundColor: colors.bgPrimary,
   },
   content: {
     flex: 1,