Improve slide preview modal with full-screen presentation mode

- Remove padding and shadows for true full-screen experience
- Use theme background color to fill empty space around slides
- Optimize aspect ratio calculations to maximize screen usage
- Maintain proper aspect ratios without distortion
- Add theme-background class for proper CSS variable inheritance

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/components/presentations/SlidePreviewModal.css

@@ -5,11 +5,14 @@
   right: 0;
   bottom: 0;
   z-index: 9999;
-  background: rgba(0, 0, 0, 0.95);
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 2rem;
+  padding: 0;
+}
+
+.slide-preview-modal.theme-background {
+  background: var(--theme-background, #000000);
 }
 
 .preview-hint {
@@ -94,29 +97,37 @@
 }
 
 .slide-preview-wrapper .slide-container {
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+  box-shadow: none;
-  border-radius: 0.5rem;
+  border-radius: 0;
   overflow: hidden;
   background: white;
 }
 
-/* Aspect ratio handling - matching SlideEditor pattern */
+/* Full screen aspect ratio handling - maintain proper aspect ratio */
+.slide-preview-wrapper .slide-container {
+  position: relative;
+}
+
 .slide-preview-wrapper .slide-container.aspect-16-9 {
   aspect-ratio: 16 / 9;
-  width: min(90vw, calc(90vh * 16/9));
+  width: min(100vw, calc(100vh * 16 / 9));
+  height: min(100vh, calc(100vw * 9 / 16));
 }
 
 .slide-preview-wrapper .slide-container.aspect-4-3 {
   aspect-ratio: 4 / 3;
-  width: min(90vw, calc(90vh * 4/3));
+  width: min(100vw, calc(100vh * 4 / 3));
+  height: min(100vh, calc(100vw * 3 / 4));
 }
 
 .slide-preview-wrapper .slide-container.aspect-16-10 {
   aspect-ratio: 16 / 10;
-  width: min(90vw, calc(90vh * 16/10));
+  width: min(100vw, calc(100vh * 16 / 10));
+  height: min(100vh, calc(100vw * 10 / 16));
 }
 
 .slide-preview-wrapper .slide-container.aspect-1-1 {
   aspect-ratio: 1 / 1;
-  width: min(90vw, 90vh);
+  width: min(100vw, 100vh);
+  height: min(100vh, 100vw);
 }

src/components/presentations/SlidePreviewModal.tsx

@@ -79,7 +79,7 @@ export const SlidePreviewModal: React.FC<SlidePreviewModalProps> = ({
   };
 
   return (
-    <div className="slide-preview-modal" onClick={handleOverlayClick}>
+    <div className="slide-preview-modal theme-background" onClick={handleOverlayClick}>
       {/* ESC hint */}
       {showHint && (
         <div className="preview-hint">