diff --git a/services/web-ui/public/screens-asset.jsx b/services/web-ui/public/screens-asset.jsx
index 2909101..90da965 100644
--- a/services/web-ui/public/screens-asset.jsx
+++ b/services/web-ui/public/screens-asset.jsx
@@ -774,6 +774,15 @@ function FilesTab({ asset, filmFrames, filmstripLoading, streamUrl, reprocessing
   const hasThumb     = !!asset.thumbnail_s3_key;
   const hasFilmstrip = Array.isArray(filmFrames) && filmFrames.length > 0;
 
+  // Thumbnail endpoint returns a signed URL, not raw image bytes
+  const [thumbUrl, setThumbUrl] = React.useState(null);
+  React.useEffect(function() {
+    if (!hasThumb) return;
+    window.ZAMPP_API.fetch('/assets/' + asset.id + '/thumbnail')
+      .then(function(r) { if (r && r.url) setThumbUrl(r.url); })
+      .catch(function() {});
+  }, [asset.id, hasThumb]);
+
   // Rows: label | status badge | path | action button
   const FileRow = function({ label, present, path, icon, actionLabel, onAction, disabled, children }) {
     return (
@@ -838,9 +847,9 @@ function FilesTab({ asset, filmFrames, filmstripLoading, streamUrl, reprocessing
         onAction={onRegenThumbnail}
         disabled={reprocessing === 'thumbnail'}
       >
-        {hasThumb && (
+        {thumbUrl && (
           <img
-            src={'/api/v1/assets/' + asset.id + '/thumbnail'}
+            src={thumbUrl}
             alt="Thumbnail"
             style={{ maxHeight: 100, borderRadius: 4, display: 'block' }}
             onError={function(e) { e.target.style.display = 'none'; }}