Remove !important rules to allow inline style overrides

The previous fix used !important which prevented user code from setting
custom colors via inline styles. Now using normal CSS specificity so that:

1. html/body elements get default colors (white on dark, dark on light)
2. Colors cascade naturally to child elements
3. User inline styles can override the inherited colors
4. External CSS works with the CSS variables we define

This balances having sensible defaults with allowing full customization.

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

Co-Authored-By: Claude <[email protected]>

Author: claude

website/src/components/code-preview.ts

@@ -33,23 +33,19 @@ function generateJavaScriptIFrameHTML(
 			<style>
 				/* Dark mode (default) - apply colors directly without variables */
 				html, body {
-					background-color: #0a0e1f !important;
-					color: #f5f9ff !important;
+					background-color: #0a0e1f;
+					color: #f5f9ff;
 					margin: 0;
 					padding: 0;
 				}
 				* {
-					color: #f5f9ff !important;
 					box-sizing: border-box;
 				}
 
 				/* Light mode overrides */
 				html.color-scheme-light, html.color-scheme-light body {
-					background-color: #e7f4f5 !important;
-					color: #0a0e1f !important;
-				}
-				html.color-scheme-light * {
-					color: #0a0e1f !important;
+					background-color: #e7f4f5;
+					color: #0a0e1f;
 				}
 
 				/* CSS variables for compatibility with external CSS */