diff --git a/public/css/style.css b/public/css/style.css
index dbb3393..a1c781e 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -38,67 +38,75 @@ body.setup-mode { cursor: default; }
 @keyframes spin { to { transform: rotate(360deg); } }
 @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
 
-/* === SLIDESHOW - VINTAGE POLAROID PILE === */
+/* =============================================
+   SLIDESHOW - VINTAGE POLAROID PILE
+   ============================================= */
 #slideshow-screen { background: #1a1510; }
 
+/* Warm blurred bg behind everything */
 .bg-blur {
   position: absolute; top: -30px; left: -30px;
   width: calc(100% + 60px); height: calc(100% + 60px);
   background-size: cover; background-position: center;
-  filter: blur(40px) brightness(0.3) saturate(0.6) sepia(0.3);
+  filter: blur(40px) brightness(0.25) saturate(0.5) sepia(0.3);
   opacity: 0; transition: opacity 2s ease; z-index: 1;
 }
 .bg-blur.visible { opacity: 1; }
 
-.bg-vignette {
+/* Canvas pile of accumulated polaroids */
+#pile-canvas {
   position: absolute; top: 0; left: 0; width: 100%; height: 100%;
-  background: radial-gradient(ellipse at center, transparent 40%, rgba(15,12,8,0.7) 100%);
   z-index: 2; pointer-events: none;
 }
 
-/* --- Photo pile --- */
-#photo-pile { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; }
-.pile-frame { position: absolute; top: 50%; left: 50%; width: 30vmin; height: 34vmin; transform: translate(-50%, -50%); opacity: 0; transition: all 1.5s ease; pointer-events: none; }
-.pile-frame.visible { opacity: 1; }
+/* Vignette on top of pile */
+.bg-vignette {
+  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
+  background: radial-gradient(ellipse at center, transparent 50%, rgba(15,12,8,0.6) 100%);
+  z-index: 3; pointer-events: none;
+}
 
-/* --- Main floating frame --- */
-.main-frame { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 5; opacity: 0; transition: opacity 1.2s ease; animation: float 25s ease-in-out infinite; }
+/* --- Main floating frame (nearly full screen) --- */
+.main-frame {
+  position: absolute; top: 50%; left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 5; opacity: 0;
+  transition: opacity 1.2s ease;
+  animation: float 25s ease-in-out infinite;
+}
 .main-frame.visible { opacity: 1; }
 
 @keyframes float {
-  0%   { transform: translate(-50%, -50%) rotate(0deg)    translateX(0)   translateY(0); }
-  15%  { transform: translate(-50%, -50%) rotate(0.8deg)  translateX(8px)  translateY(-5px); }
-  30%  { transform: translate(-50%, -50%) rotate(-0.5deg) translateX(-5px) translateY(6px); }
-  50%  { transform: translate(-50%, -50%) rotate(0.3deg)  translateX(6px)  translateY(3px); }
-  65%  { transform: translate(-50%, -50%) rotate(-0.7deg) translateX(-8px) translateY(-4px); }
-  80%  { transform: translate(-50%, -50%) rotate(0.4deg)  translateX(4px)  translateY(7px); }
-  100% { transform: translate(-50%, -50%) rotate(0deg)    translateX(0)   translateY(0); }
+  0%   { transform: translate(-50%, -50%) rotate(0deg)    translateX(0)    translateY(0); }
+  15%  { transform: translate(-50%, -50%) rotate(0.6deg)  translateX(6px)  translateY(-4px); }
+  30%  { transform: translate(-50%, -50%) rotate(-0.4deg) translateX(-4px) translateY(5px); }
+  50%  { transform: translate(-50%, -50%) rotate(0.3deg)  translateX(5px)  translateY(2px); }
+  65%  { transform: translate(-50%, -50%) rotate(-0.5deg) translateX(-6px) translateY(-3px); }
+  80%  { transform: translate(-50%, -50%) rotate(0.3deg)  translateX(3px)  translateY(5px); }
+  100% { transform: translate(-50%, -50%) rotate(0deg)    translateX(0)    translateY(0); }
 }
 
-/* Polaroid */
-.main-frame.polaroid .frame-border {
-  background: #f5f0e8; padding: 12px 12px 44px 12px;
-  box-shadow: 0 4px 30px rgba(0,0,0,0.5), 0 1px 3px rgba(0,0,0,0.2), inset 0 0 0 1px rgba(0,0,0,0.05);
-  border-radius: 2px; position: relative;
+/* Polaroid frame — used for both photos and videos */
+.main-frame .frame-border {
+  background: #f5f0e8;
+  padding: 10px 10px 36px 10px;
+  box-shadow:
+    0 6px 40px rgba(0,0,0,0.6),
+    0 2px 6px rgba(0,0,0,0.3),
+    inset 0 0 0 1px rgba(0,0,0,0.05);
+  border-radius: 2px;
+  position: relative;
 }
-.main-frame.polaroid .frame-media { display: block; max-width: 72vmin; max-height: 54vmin; width: auto; height: auto; object-fit: contain; background: #2a2520; min-width: 40vmin; min-height: 30vmin; }
-.main-frame.polaroid .filmstrip-top, .main-frame.polaroid .filmstrip-bottom { display: none; }
 
-/* Film strip */
-.main-frame.filmstrip .frame-border {
-  background: #1a1a1a; padding: 0;
-  box-shadow: 0 4px 30px rgba(0,0,0,0.5), 0 1px 3px rgba(0,0,0,0.2);
-  border-radius: 2px; position: relative;
-}
-.main-frame.filmstrip .frame-media { display: block; max-width: 72vmin; max-height: 54vmin; width: auto; height: auto; object-fit: contain; background: #000; min-width: 40vmin; min-height: 30vmin; }
-
-.filmstrip-top, .filmstrip-bottom { display: none; position: absolute; left: 0; width: 100%; height: 22px; background: #1a1a1a; z-index: 6; }
-.filmstrip-top { top: -22px; border-radius: 2px 2px 0 0; }
-.filmstrip-bottom { bottom: -22px; border-radius: 0 0 2px 2px; }
-.main-frame.filmstrip .filmstrip-top, .main-frame.filmstrip .filmstrip-bottom {
+.main-frame .frame-media {
   display: block;
-  background-image: repeating-linear-gradient(90deg, transparent 0px, transparent 10px, #333 10px, #333 12px, transparent 12px, transparent 16px, rgba(255,255,255,0.08) 16px, rgba(255,255,255,0.08) 26px, transparent 26px, transparent 28px, #333 28px, #333 30px, transparent 30px, transparent 40px);
-  background-size: 40px 22px; background-position: 5px center;
+  max-width: 88vw;
+  max-height: 78vh;
+  width: auto; height: auto;
+  object-fit: contain;
+  background: #2a2520;
+  min-width: 50vw;
+  min-height: 40vh;
 }
 
 /* === OVERLAY === */
@@ -128,9 +136,8 @@ body.setup-mode { cursor: default; }
   .overlay-top-right { top: 1rem; right: 1rem; }
   .overlay-bottom { padding: 1rem 1rem 0.5rem; }
   .source-buttons { flex-direction: column; }
-  .main-frame.polaroid .frame-border { padding: 8px 8px 32px 8px; }
-  .main-frame.polaroid .frame-media, .main-frame.filmstrip .frame-media { max-width: 85vmin; max-height: 60vmin; }
-  .pile-frame { width: 25vmin; height: 29vmin; }
+  .main-frame .frame-border { padding: 6px 6px 24px 6px; }
+  .main-frame .frame-media { max-width: 94vw; max-height: 82vh; }
 }
 
 .albums-list::-webkit-scrollbar, .setup-container::-webkit-scrollbar { width: 6px; }