thumbnails

frontend/src/styles.css

@@ -919,18 +919,29 @@ button.icon-button.ghost:hover:not([disabled]) {
   text-align: center;
 }
 
-.document-thumbnail {
-  width: 36px;
+.document-thumbnail-wrapper {
+  width: 48px;
   height: 48px;
-  object-fit: cover;
-  border-radius: 3px;
+  background: transparent;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.document-thumbnail {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+  background: var(--surface-subtle);
+  border-radius: 1px;
   box-shadow: 0 1px 3px var(--shadow-medium);
 }
 
 .thumb-placeholder {
-  width: 36px;
-  height: 48px;
+  width: 100%;
+  height: 100%;
   border-radius: 1px;
+  background: var(--surface-subtle);
   color: var(--muted);
   display: inline-flex;
   align-items: center;
@@ -938,6 +949,7 @@ button.icon-button.ghost:hover:not([disabled]) {
   font-size: 0.68rem;
   font-weight: 600;
   letter-spacing: 0.08em;
+  box-shadow: 0 1px 3px var(--shadow-medium);
 }
 
 .thumb-placeholder.icon {