Enhance database export functionality and update CSS styles

src/index.css

@@ -1061,6 +1061,8 @@ body:not([data-theme="light"]) .markdown-preview {
   inset: 0;
   display: grid;
   place-items: center;
+  padding: 16px;
+  overflow: auto;
   z-index: 30;
 }
 
@@ -1073,7 +1075,8 @@ body:not([data-theme="light"]) .markdown-preview {
 .settings-panel {
   position: relative;
   z-index: 1;
-  width: min(420px, 92vw);
+  width: min(420px, calc(100vw - 32px));
+  max-height: calc(100vh - 32px);
   padding: 20px;
   border-radius: 16px;
   background: var(--bg-elevated);
@@ -1082,6 +1085,7 @@ body:not([data-theme="light"]) .markdown-preview {
   display: flex;
   flex-direction: column;
   gap: 16px;
+  overflow: hidden;
 }
 
 .settings-panel__header {
@@ -1094,6 +1098,16 @@ body:not([data-theme="light"]) .markdown-preview {
   font-size: 1.1rem;
 }
 
+.settings-panel__body {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  min-height: 0;
+  overflow-y: auto;
+  padding-right: 4px;
+  margin-right: -4px;
+}
+
 .settings-panel__section {
   display: flex;
   flex-direction: column;
@@ -1160,6 +1174,19 @@ body:not([data-theme="light"]) .markdown-preview {
   color: var(--muted);
 }
 
+.settings-panel__status {
+  font-size: 0.8rem;
+  word-break: break-word;
+}
+
+.settings-panel__status--success {
+  color: var(--ink);
+}
+
+.settings-panel__status--error {
+  color: #d36b6b;
+}
+
 body[data-theme="light"] .editor__textarea-wrap:focus-within {
   border-color: var(--accent-strong);
 }