UI: Larger touch targets and shift components up for better ergonomics

src/screens/PreviewScreen.tsx

@@ -589,7 +589,7 @@ export default function PreviewScreen({
           >
             <FontAwesomeIcon
               icon={faFaceGrinStars}
-              size={16}
+              size={22}
               color={showStickerTray ? THEME.colors.text : THEME.colors.accent}
             />
             <Text style={[styles.editToolText, showStickerTray && styles.editToolTextActive]}>
@@ -612,7 +612,7 @@ export default function PreviewScreen({
             >
               <FontAwesomeIcon
                 icon={faBorderAll}
-                size={16}
+                size={22}
                 color={selectedFrameId !== null ? THEME.colors.text : THEME.colors.accent}
               />
               <Text style={[styles.editToolText, selectedFrameId !== null && styles.editToolTextActive]}>
@@ -692,9 +692,10 @@ const styles = StyleSheet.create({
   },
   previewPanel: {
     flex: 1.2,
-    justifyContent: 'center',
+    justifyContent: 'flex-start',
     alignItems: 'center',
     padding: THEME.spacing.md,
+    paddingTop: 60,
     backgroundColor: '#030308',
   },
   viewShotContainer: {
@@ -803,9 +804,9 @@ const styles = StyleSheet.create({
   editToolBtn: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: 6,
-    paddingVertical: 8,
-    paddingHorizontal: 14,
+    gap: 8,
+    paddingVertical: 12,
+    paddingHorizontal: 20,
     borderRadius: THEME.borderRadius.round,
     borderWidth: 1,
     borderColor: THEME.colors.border,
@@ -816,7 +817,7 @@ const styles = StyleSheet.create({
     borderColor: THEME.colors.accent,
   },
   editToolText: {
-    fontSize: 13,
+    fontSize: 16,
     fontWeight: '600',
     color: THEME.colors.accent,
   },