feat(titlebar): selectable window button styles + minimize toggle (#1083)

* feat(titlebar): selectable window button styles + minimize toggle

Custom title bar (Linux) gains a window-button style picker, mirroring
the seekbar style picker pattern. Six form-named styles: dots, dotsGlyph,
flat, pill, outline, glyph. All buttons now carry minimize/maximize/close
glyphs for clear, colour-blind-friendly iconography; dots reveal glyphs on
hover, dotsGlyph always shows them.

- New authStore state windowButtonStyle (default dots) + showMinimizeButton,
  with rehydrate validation falling back to dots on unknown values.
- WindowButtonPreview reuses the real .titlebar-btn classes for WYSIWYG tiles.
- Picker + minimize toggle render under the Custom title bar setting, gated
  on the toggle being on.
- Monochrome styles use --text-primary glyphs and stronger borders for
  contrast on dark themes.
- Dev-build grey marker scoped to the real title bar so previews show true
  colours.
- i18n keys in all 9 locales; setter and rehydrate tests.

* docs(changelog): window button styles (#1083)

src/components/settings/AppearanceTab.tsx

@@ -7,12 +7,13 @@ import {
   LIBRARY_GRID_MAX_COLUMNS_MAX,
   LIBRARY_GRID_MAX_COLUMNS_MIN,
 } from '../../store/authStoreDefaults';
-import type { SeekbarStyle } from '../../store/authStoreTypes';
+import type { SeekbarStyle, WindowButtonStyle } from '../../store/authStoreTypes';
 import { useFontStore, FontId } from '../../store/fontStore';
 import { useThemeStore } from '../../store/themeStore';
 import { IS_LINUX, IS_WINDOWS } from '../../utils/platform';
 import SettingsSubSection from '../SettingsSubSection';
 import { SeekbarPreview } from '../WaveformSeekPreview';
+import WindowButtonPreview from '../WindowButtonPreview';
 
 export function AppearanceTab() {
   const { t } = useTranslation();
@@ -170,6 +171,39 @@ export function AppearanceTab() {
                   <span className="toggle-track" />
                 </label>
               </div>
+              {auth.useCustomTitlebar && (
+                <>
+                  <div className="settings-section-divider" />
+                  <div>
+                    <div style={{ fontWeight: 500 }}>{t('settings.windowButtonStyle')}</div>
+                    <div style={{ fontSize: 12, color: 'var(--text-muted)', marginBottom: '0.75rem' }}>
+                      {t('settings.windowButtonStyleDesc')}
+                    </div>
+                    <div style={{ display: 'flex', flexWrap: 'wrap', gap: 10 }}>
+                      {(['dots', 'dotsGlyph', 'flat', 'pill', 'outline', 'glyph'] as WindowButtonStyle[]).map(style => (
+                        <WindowButtonPreview
+                          key={style}
+                          style={style}
+                          label={t(`settings.windowButtons${style.charAt(0).toUpperCase() + style.slice(1)}` as any)}
+                          selected={auth.windowButtonStyle === style}
+                          onClick={() => auth.setWindowButtonStyle(style)}
+                        />
+                      ))}
+                    </div>
+                  </div>
+                  <div className="settings-section-divider" />
+                  <div className="settings-toggle-row">
+                    <div>
+                      <div style={{ fontWeight: 500 }}>{t('settings.showMinimizeButton')}</div>
+                      <div style={{ fontSize: 12, color: 'var(--text-muted)' }}>{t('settings.showMinimizeButtonDesc')}</div>
+                    </div>
+                    <label className="toggle-switch" aria-label={t('settings.showMinimizeButton')}>
+                      <input type="checkbox" checked={auth.showMinimizeButton} onChange={e => auth.setShowMinimizeButton(e.target.checked)} />
+                      <span className="toggle-track" />
+                    </label>
+                  </div>
+                </>
+              )}
             </>
           )}
         </div>