fix(native): clear transparent header titles and minor UI polish

Remove the hardcoded "Title" and "Person" header titles (and the person's name) from transparent headers so the back button floats cleanly over the hero image. Simplify `StatusActionButton` by dropping the unused `--color-status-watchlist` CSS variable lookup and collapsing the icon color logic; also rename the watchlist label to "Watchlisted". Fix `ExpandableText` to only mark the text `selectable` on iOS, since Android's `EditText`-backed selectable text ignores `numberOfLines` and scrolls instead of truncating.

apps/native/src/app/person/[id].tsx

@@ -165,7 +165,7 @@ export default function PersonDetailScreen() {
       <>
         <Stack.Screen
           options={{
-            title: "Person",
+            title: "",
             headerTransparent: true,
             headerBlurEffect: "none",
             headerTintColor: "white",
@@ -208,7 +208,7 @@ export default function PersonDetailScreen() {
       <>
         <Stack.Screen
           options={{
-            title: "Person",
+            title: "",
             headerTransparent: true,
             headerBlurEffect: "none",
             headerTintColor: "white",
@@ -244,7 +244,7 @@ export default function PersonDetailScreen() {
       <>
         <Stack.Screen
           options={{
-            title: "Person",
+            title: "",
             headerTransparent: true,
             headerBlurEffect: "none",
             headerTintColor: "white",
@@ -360,7 +360,7 @@ export default function PersonDetailScreen() {
     <>
       <Stack.Screen
         options={{
-          title: person.name,
+          title: "",
           headerTransparent: true,
           headerBlurEffect: "none",
           headerTintColor: "white",

apps/native/src/app/title/[id].tsx

@@ -285,7 +285,7 @@ export default function TitleDetailScreen() {
       <>
         <Stack.Screen
           options={{
-            title: "Title",
+            title: "",
             headerTransparent: true,
             headerBlurEffect: "none",
             headerTintColor: "white",
@@ -323,7 +323,7 @@ export default function TitleDetailScreen() {
       <>
         <Stack.Screen
           options={{
-            title: "Title",
+            title: "",
             headerTransparent: true,
             headerBlurEffect: "none",
             headerTintColor: "white",
@@ -349,7 +349,7 @@ export default function TitleDetailScreen() {
     <>
       <Stack.Screen
         options={{
-          title: title.title,
+          title: "",
           headerTransparent: true,
           headerBlurEffect: "none",
           headerTintColor: "white",

apps/native/src/components/titles/status-action-button.tsx

@@ -13,7 +13,7 @@ type TitleStatus = "watchlist" | "in_progress" | "completed";
 
 const statusConfig = {
   watchlist: {
-    label: "Watchlist",
+    label: "Watchlisted",
     Icon: IconBookmarkFilled,
     bgClass: "bg-title-accent/10 border-title-accent/20",
     textClass: "text-title-accent",
@@ -41,11 +41,10 @@ export function StatusActionButton({
   onStatusChange: (status: TitleStatus | null) => void;
   isPending: boolean;
 }) {
-  const [titleAccent, completedColor, watchlistColor] = useCSSVariable([
+  const [titleAccent, completedColor] = useCSSVariable([
     "--color-title-accent",
     "--color-status-completed",
-    "--color-status-watchlist",
-  ]) as [string, string, string];
+  ]) as [string, string];
 
   const config = currentStatus
     ? statusConfig[currentStatus as keyof typeof statusConfig]
@@ -72,11 +71,7 @@ export function StatusActionButton({
   }
 
   const iconColor =
-    currentStatus === "completed"
-      ? completedColor
-      : currentStatus === "watchlist"
-        ? watchlistColor
-        : titleAccent;
+    currentStatus === "completed" ? completedColor : titleAccent;
 
   return (
     <Pressable

apps/native/src/components/ui/expandable-text.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useRef, useState } from "react";
 import type { NativeSyntheticEvent, TextLayoutEventData } from "react-native";
-import { Pressable, View } from "react-native";
+import { Platform, Pressable, View } from "react-native";
 import { Text } from "@/components/ui/text";
 
 export function ExpandableText({
@@ -45,8 +45,9 @@ export function ExpandableText({
       >
         {text}
       </Text>
+      {/* selectable on Android uses EditText internally, which ignores numberOfLines and scrolls instead */}
       <Text
-        selectable
+        selectable={Platform.OS === "ios"}
         numberOfLines={expanded ? undefined : maxLines}
         className="text-[14px] text-foreground leading-[22px]"
       >