refactor: Adjust floating panel positioning and styling by removing absolute positioning, adding backdrop blur, and refining width and margin properties.

frontend/src/styles/documents/listing.css

@@ -67,22 +67,18 @@
 
 .panel-floating-region {
   position: sticky;
-  top: 0.5rem;
-  display: flex;
-  justify-content: center;
   pointer-events: none;
   z-index: 20000;
   height: 0;
-  width: calc(100% - 2rem);
-  margin: 0 1rem;
+  width: 100%;
+  display: flex;
+  justify-content: center;
 }
 
 .panel-floating {
-  position: absolute;
-  top: 0;
-  left: 50%;
-  transform: translateX(-50%);
-  background: color-mix(in oklch, var(--surface) 100%, transparent);
+  background: color-mix(in oklch, var(--surface) 70%, transparent);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
   border: 1px solid color-mix(in oklch, var(--border) 95%, transparent);
   padding: 0.45rem 0.85rem;
   border-radius: 1rem;
@@ -91,17 +87,16 @@
   color: var(--fg);
   box-shadow: 0 6px 24px color-mix(in oklch, var(--shadow-soft) 55%, transparent);
   pointer-events: auto;
-  display: inline-flex;
+  display: flex;
+  min-height: 1.5rem;
   align-items: center;
   justify-content: center;
   flex-wrap: nowrap;
   gap: 0.75rem;
   z-index: 950000;
-  width: auto;
-  max-width: min(640px, calc(100% - 2rem));
-  margin: 0 auto;
-  min-width: 0;
+  margin: 0 1rem;
   overflow: visible;
+  flex: 0 1 auto;
 }
 
 .documents-main--overlay-detail .panel-floating-region {