feat(settings): set default font size to middle option (18px)

src/components/Settings.tsx

@@ -77,7 +77,7 @@ const Settings: React.FC<SettingsProps> = ({ settings, onSave, onClose }) => {
                   <button
                     key={size}
                     onClick={() => setLocalSettings({ ...localSettings, fontSize: size })}
-                    className={`font-size-btn ${(localSettings.fontSize || 16) === size ? 'active' : ''}`}
+                    className={`font-size-btn ${(localSettings.fontSize || 18) === size ? 'active' : ''}`}
                     title={`${size}px`}
                     style={{ fontSize: `${size - 2}px` }}
                   >
@@ -157,7 +157,7 @@ const Settings: React.FC<SettingsProps> = ({ settings, onSave, onClose }) => {
                 className="preview-content" 
                 style={{ 
                   fontFamily: previewFontFamily,
-                  fontSize: `${localSettings.fontSize || 16}px`,
+                  fontSize: `${localSettings.fontSize || 18}px`,
                   '--highlight-rgb': hexToRgb(localSettings.highlightColor || '#ffff00')
                 } as React.CSSProperties}
               >

src/hooks/useSettings.ts

@@ -51,7 +51,7 @@ export function useSettings({ relayPool, eventStore, pubkey, accountManager }: U
     const fontKey = settings.readingFont || 'system'
     if (fontKey !== 'system') loadFont(fontKey)
     root.setProperty('--reading-font', getFontFamily(fontKey))
-    root.setProperty('--reading-font-size', `${settings.fontSize || 16}px`)
+    root.setProperty('--reading-font-size', `${settings.fontSize || 18}px`)
     
     // Set highlight colors for three levels
     root.setProperty('--highlight-color-mine', settings.highlightColorMine || '#eab308')

src/index.css

@@ -14,7 +14,7 @@
   -webkit-text-size-adjust: 100%;
   
   --reading-font: 'Source Serif 4', serif;
-  --reading-font-size: 16px;
+  --reading-font-size: 18px;
   /* Layout variables */
   --sidebar-width: 320px;
   --sidebar-collapsed-width: 56px;