fix: UserTitle cards

modules/frontend/src/components/Header/Header.tsx

@@ -12,7 +12,7 @@ export const Header: React.FC<HeaderProps> = ({ username }) => {
   const toggleMenu = () => setMenuOpen(!menuOpen);
 
   return (
-    <header className="w-full bg-white shadow-md fixed top-0 left-0 z-50">
+    <header className="w-full bg-white shadow-md sticky top-0 left-0 z-50">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
         <div className="flex justify-between h-16 items-center">
 

modules/frontend/src/components/cards/UserTitleCardHorizontal.tsx

@@ -0,0 +1,22 @@
+import type { UserTitle } from "../../api";
+
+export function UserTitleCardHorizontal({ title }: { title: UserTitle }) {
+  return (
+    <div style={{
+      display: "flex",
+      gap: 12,
+      padding: 12,
+      border: "1px solid #ddd",
+      borderRadius: 8
+    }}>
+      {title.title?.poster?.image_path && (
+        <img src={title.title?.poster.image_path} width={80} />
+      )}
+      <div>
+        <h3>{title.title?.title_names["en"]}</h3>
+        <p>{title.title?.release_year} · {title.title?.release_season} · Rating: {title.title?.rating}</p>
+        <p>Status: {title.title?.title_status}</p>
+      </div>
+    </div>
+  );
+}

modules/frontend/src/components/cards/UserTitleCardSquare.tsx

@@ -0,0 +1,22 @@
+import type { UserTitle } from "../../api";
+
+export function UserTitleCardSquare({ title }: { title: UserTitle }) {
+  return (
+    <div style={{
+      width: 160,
+      border: "1px solid #ddd",
+      padding: 8,
+      borderRadius: 8,
+      textAlign: "center"
+    }}>
+      {title.title?.poster?.image_path && (
+        <img src={title.title?.poster.image_path} width={140} />
+      )}
+      <div>
+        <h4>{title.title?.title_names["en"]}</h4>
+        <h5>{title.status}</h5>
+        <small>{title.title?.release_year} • {title.title?.rating}</small>
+      </div>
+    </div>
+  );
+}