implemented step 19 by Gemini

- Preview and Export

public/css/wizard.css

@@ -509,6 +509,102 @@ textarea:focus, input[type="text"]:focus, input[type="email"]:focus, input[type=
 	color: var(--primary-color);
 }
 
+/* Preview Step */
+.step-header-with-actions {
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-start;
+	gap: 1rem;
+	margin-bottom: 1.5rem;
+}
+
+.device-toggle {
+	display: flex;
+	background-color: #f1f5f9;
+	padding: 0.25rem;
+	border-radius: 0.5rem;
+	white-space: nowrap;
+}
+
+.btn-toggle {
+	padding: 0.4rem 0.8rem;
+	border-radius: 0.375rem;
+	font-size: 0.75rem;
+	border: none;
+	background: transparent;
+	color: var(--text-muted);
+}
+
+.btn-toggle.active {
+	background-color: white;
+	color: var(--primary-color);
+	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
+	font-weight: 600;
+}
+
+.preview-window {
+	border: 1px solid var(--border-color);
+	border-radius: 0.5rem;
+	background-color: #e2e8f0;
+	overflow: hidden;
+	transition: all 0.3s ease;
+	margin: 0 auto;
+}
+
+.preview-window iframe {
+	width: 100%;
+	height: 600px;
+	border: none;
+	background-color: white;
+	display: block;
+}
+
+.preview-window.mobile {
+	max-width: 375px;
+}
+
+/* Success / Export Screen */
+.success-screen {
+	text-align: center;
+	padding: 1rem 0;
+}
+
+.success-icon {
+	font-size: 4rem;
+	margin-bottom: 1rem;
+}
+
+.export-actions {
+	margin: 2.5rem 0;
+}
+
+.btn-large {
+	padding: 1rem 2rem;
+	font-size: 1.125rem;
+}
+
+.instructions-box {
+	background-color: #f8fafc;
+	border: 1px solid var(--border-color);
+	border-radius: 0.75rem;
+	padding: 2rem;
+	text-align: left;
+}
+
+.instructions-box h3 {
+	margin-bottom: 1rem;
+	font-size: 1rem;
+}
+
+.instructions-box ol {
+	padding-left: 1.25rem;
+	color: #475569;
+}
+
+.instructions-box li {
+	margin-bottom: 0.75rem;
+}
+
 button:disabled {
 	opacity: 0.5;
 	cursor: not-allowed;