diff --git a/app/layout.tsx b/app/layout.tsx
index e867853..dc4fc2b 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -60,10 +60,10 @@ export default function RootLayout({ children }: { children: React.ReactNode })
       suppressHydrationWarning
       style={themeVars as React.CSSProperties}
       data-preset={theme.preset}
-      data-grain={theme.grain}
-      data-header-dot={theme.headerDot}
+      data-grain={String(theme.grain)}
+      data-header-dot={String(theme.headerDot)}
       data-photo-frame={theme.photoFrame}
-      data-transitions={config.transitions}
+      data-transitions={String(config.transitions)}
     >
       <head>
         <link rel="preconnect" href="https://fonts.googleapis.com" />
diff --git a/components/Lightbox.module.css b/components/Lightbox.module.css
index a85a198..82565b5 100644
--- a/components/Lightbox.module.css
+++ b/components/Lightbox.module.css
@@ -53,7 +53,7 @@
   border-radius: var(--radius-sm);
   user-select: none;
   -webkit-user-drag: none;
-  opacity: 0;
+  opacity: 1; /* Default to visible for robustness */
   transition: opacity var(--transition-normal);
 }