Add audience views: gay men, lesbian, trans with smart cross-visibility and entry picker

src/components/AgeGate.tsx

@@ -5,6 +5,8 @@ import { Button } from "@/components/ui/button";
 import { Label } from "@/components/ui/label";
 import { Logo } from "@/components/Logo";
 import { US_STATES, setUserState, requiresIdVerification } from "@/lib/id-verification";
+import { AudiencePicker } from "@/components/AudiencePicker";
+import { saveAudienceView, formatSiteTitle, type AudienceViewMode } from "@/lib/audience";
 
 interface AgeGateProps {
   onVerified: () => void;
@@ -17,6 +19,7 @@ export function AgeGate({ onVerified }: AgeGateProps) {
   const [state, setState] = useState("");
   const [error, setError] = useState("");
   const [agreed, setAgreed] = useState(false);
+  const [audienceView, setAudienceView] = useState<AudienceViewMode>("gay-men");
 
   const handleVerify = () => {
     const m = parseInt(month, 10);
@@ -51,6 +54,7 @@ export function AgeGate({ onVerified }: AgeGateProps) {
       return;
     }
 
+    saveAudienceView(audienceView);
     localStorage.setItem("eg_age_verified", "true");
     localStorage.setItem("eg_age_verified_at", new Date().toISOString());
     setUserState(state);
@@ -74,7 +78,7 @@ export function AgeGate({ onVerified }: AgeGateProps) {
             <Logo size="lg" showText={false} />
           </div>
           <h1 className="text-2xl font-bold gradient-text">
-            ExposedGays
+            {formatSiteTitle(audienceView)}
           </h1>
           <p className="mt-2 text-sm text-muted-foreground">
             Adults only. Explicit content ahead.
@@ -149,6 +153,15 @@ export function AgeGate({ onVerified }: AgeGateProps) {
             )}
           </div>
 
+          <div>
+            <Label className="mb-2 block">Who do you want to see?</Label>
+            <AudiencePicker
+              value={audienceView}
+              onChange={setAudienceView}
+              compact
+            />
+          </div>
+
           <div className="rounded-xl border border-primary/25 bg-primary/10 p-3">
             <p className="text-xs text-foreground/90 leading-relaxed">
               <strong className="text-pulse-pink-light">No account needed.</strong> Verify your age