feat: implement album-level password protection

components/DevToolbar.tsx

@@ -93,7 +93,7 @@ export function DevToolbar() {
     // Update accent + fonts
     const accent = PRESET_ACCENTS[p] || 'var(--accent-studio, #e60012)';
     setVar('--accent', accent);
-    // Note: since accent might be a CSS var, appending hex opacity won't work in all browsers if it's a var, 
+    // Note: since accent might be a CSS var, appending hex opacity won't work in all browsers if it's a var,
     // but we provide it for backward compatibility where possible. Or use color-mix if supported.
     // For now we set it to same var or use a generic dim if needed.
     setVar('--accent-dim', `color-mix(in srgb, ${accent} 12%, transparent)`);

components/PasswordGate.tsx

@@ -11,9 +11,10 @@ import styles from './PasswordGate.module.css';
 interface PasswordGateProps {
   slug: string;
   title: string;
+  type?: 'subpage' | 'album';
 }
 
-export default function PasswordGate({ slug, title }: PasswordGateProps) {
+export default function PasswordGate({ slug, title, type = 'subpage' }: PasswordGateProps) {
   const [password, setPassword] = useState('');
   const [error, setError] = useState('');
   const [loading, setLoading] = useState(false);
@@ -27,7 +28,7 @@ export default function PasswordGate({ slug, title }: PasswordGateProps) {
       const res = await fetch('/api/auth', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ slug, password }),
+        body: JSON.stringify({ slug, password, type }),
       });
 
       if (res.ok) {