feat(keyboard): add Apple Standard Keyboard visualizer style

Apps/Keyty/Sources/Keyty/Features/Settings/Keyboard/KeyboardSettingsPane.swift

@@ -262,7 +262,7 @@ struct KeyboardSettingsPane: View {
             subtitle: L10n.KeyboardVisualizer.themeSubtitle
         ) {
             Picker("", selection: self.$model.themeSelection) {
-                ForEach(Array(KeyboardVisualizerTheme.pickerSections.enumerated()), id: \.offset) { index, section in
+                ForEach(Array(self.model.allowedThemeSections.enumerated()), id: \.offset) { index, section in
                     if index > 0 {
                         Divider()
                     }
@@ -341,7 +341,7 @@ struct KeyboardSettingsPane: View {
     ) -> some View {
         SettingsControlRow(title: title, subtitle: subtitle) {
             Picker("", selection: selection) {
-                ForEach(Array(KeyboardVisualizerTheme.pickerSections.enumerated()), id: \.offset) { index, section in
+                ForEach(Array(self.model.allowedThemeSections.enumerated()), id: \.offset) { index, section in
                     if index > 0 {
                         Divider()
                     }
@@ -381,7 +381,7 @@ struct KeyboardSettingsPane: View {
             }
             .labelsHidden()
             .accessibilityLabel(L10n.KeyboardVisualizer.styleLabel)
-            .frame(width: Size.Control.settingsPickerWidth, alignment: .trailing)
+            .frame(width: Size.Control.keyboardStylePickerWidth, alignment: .trailing)
         }
     }
 

Apps/Keyty/Sources/Keyty/Features/Settings/Keyboard/KeyboardSettingsPaneViewModel.swift

@@ -46,7 +46,15 @@ final class KeyboardSettingsPaneViewModel: ObservableObject {
     }
 
     @Published var theme: KeyboardVisualizerTheme {
-        didSet { self.settings.theme = self.theme }
+        didSet {
+            guard self.theme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.theme)
+            guard sanitized == self.theme else {
+                self.theme = sanitized
+                return
+            }
+            self.settings.theme = sanitized
+        }
     }
 
     @Published var legendColorMode: KeyboardLegendColorMode {
@@ -77,27 +85,71 @@ final class KeyboardSettingsPaneViewModel: ObservableObject {
     }
 
     @Published var modifierTheme: KeyboardVisualizerTheme {
-        didSet { self.settings.modifierTheme = self.modifierTheme }
+        didSet {
+            guard self.modifierTheme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.modifierTheme)
+            guard sanitized == self.modifierTheme else {
+                self.modifierTheme = sanitized
+                return
+            }
+            self.settings.modifierTheme = sanitized
+        }
     }
 
     @Published var specialTheme: KeyboardVisualizerTheme {
-        didSet { self.settings.specialTheme = self.specialTheme }
+        didSet {
+            guard self.specialTheme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.specialTheme)
+            guard sanitized == self.specialTheme else {
+                self.specialTheme = sanitized
+                return
+            }
+            self.settings.specialTheme = sanitized
+        }
     }
 
     @Published var mediaTheme: KeyboardVisualizerTheme {
-        didSet { self.settings.mediaTheme = self.mediaTheme }
+        didSet {
+            guard self.mediaTheme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.mediaTheme)
+            guard sanitized == self.mediaTheme else {
+                self.mediaTheme = sanitized
+                return
+            }
+            self.settings.mediaTheme = sanitized
+        }
     }
 
     @Published var mouseTheme: KeyboardVisualizerTheme {
-        didSet { self.settings.mouseTheme = self.mouseTheme }
+        didSet {
+            guard self.mouseTheme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.mouseTheme)
+            guard sanitized == self.mouseTheme else {
+                self.mouseTheme = sanitized
+                return
+            }
+            self.settings.mouseTheme = sanitized
+        }
     }
 
     @Published var groupBackgroundTheme: KeyboardVisualizerTheme {
-        didSet { self.settings.groupBackgroundTheme = self.groupBackgroundTheme }
+        didSet {
+            guard self.groupBackgroundTheme != oldValue else { return }
+            let sanitized = self.style.sanitize(theme: self.groupBackgroundTheme)
+            guard sanitized == self.groupBackgroundTheme else {
+                self.groupBackgroundTheme = sanitized
+                return
+            }
+            self.settings.groupBackgroundTheme = sanitized
+        }
     }
 
     @Published var style: KeycapStyle {
-        didSet { self.settings.style = self.style }
+        didSet {
+            guard self.style != oldValue else { return }
+            self.settings.style = self.style
+            self.syncThemeStateFromSettings()
+        }
     }
 
     @Published var scale: Double {
@@ -175,6 +227,11 @@ final class KeyboardSettingsPaneViewModel: ObservableObject {
         ].joined(separator: "-")
     }
 
+    /// Theme picker sections filtered to the themes allowed by the selected keycap style.
+    var allowedThemeSections: [[KeyboardVisualizerTheme]] {
+        KeyboardVisualizerTheme.pickerSections(for: self.style.allowedThemes)
+    }
+
     var previewRenderSettings: KeyboardVisualizerSettings {
         let settings = KeyboardVisualizerSettings(store: InMemoryKeyValueStore())
         settings.registerDefaults()
@@ -246,6 +303,15 @@ final class KeyboardSettingsPaneViewModel: ObservableObject {
         self.customLegendColor = color
         self.legendColorSelectionOverride = Self.customLegendColorSelectionID
     }
+
+    private func syncThemeStateFromSettings() {
+        self.theme = self.settings.theme
+        self.modifierTheme = self.settings.modifierTheme
+        self.specialTheme = self.settings.specialTheme
+        self.mediaTheme = self.settings.mediaTheme
+        self.mouseTheme = self.settings.mouseTheme
+        self.groupBackgroundTheme = self.settings.groupBackgroundTheme
+    }
 }
 
 extension KeyboardSettingsPaneViewModel {

Apps/Keyty/Sources/Keyty/Features/Visualizers/Keyboard/Appearance/KeycapAppearance+Apple.swift

@@ -0,0 +1,34 @@
+//
+//  KeycapAppearance+Apple.swift
+//  Keyty
+//
+//  SPDX-FileCopyrightText: 2026 Serhii Bykov
+//  SPDX-License-Identifier: BSD-3-Clause
+//
+
+import AppKit
+
+extension KeycapAppearance {
+    struct Apple: KeycapAppearanceProviding {
+        let shared: Shared
+        let strokeColor: NSColor
+        let undersideGradient: NSGradient?
+        let mainGradient: NSGradient?
+
+        init(tokens: KeycapThemeTokens) {
+            self.shared = Shared(tokens: tokens)
+            self.strokeColor = tokens.surfaceBorderColor
+            let undersideEdgeColor = tokens.undersideEdgeColor ?? tokens.recessColor
+            let undersideCenterColor = tokens.undersideCenterColor ?? tokens.surfaceBaseColor
+            self.undersideGradient = NSGradient(colorsAndLocations:
+                (undersideEdgeColor, 0.0),
+                (undersideCenterColor, 0.5),
+                (undersideEdgeColor, 1.0)
+            )
+            self.mainGradient = NSGradient(colorsAndLocations:
+                (tokens.surfaceBaseColor, 0.0),
+                (tokens.surfaceShadowColor, 1.0)
+            )
+        }
+    }
+}

Apps/Keyty/Sources/Keyty/Features/Visualizers/Keyboard/Appearance/KeycapAppearance+M0116.swift

@@ -0,0 +1,64 @@
+//
+//  KeycapAppearance+M0116.swift
+//  Keyty
+//
+//  SPDX-FileCopyrightText: 2026 Serhii Bykov
+//  SPDX-License-Identifier: BSD-3-Clause
+//
+
+import AppKit
+
+extension KeycapAppearance {
+    /// Sculpted beige-era keycap: a lit body, an inset top face, and a front skirt,
+    /// all sitting in a near-black well like the plate of an Apple Standard Keyboard.
+    struct M0116: KeycapAppearanceProviding {
+        let shared: Shared
+        let wellColor: NSColor
+        let bodyGradient: NSGradient?
+        let skirtGradient: NSGradient?
+        let faceGradient: NSGradient?
+        let creaseColor: NSColor
+        let bodyStrokeColor: NSColor
+
+        init(tokens: KeycapThemeTokens) {
+            let bodyEdge = tokens.surfaceShadowColor.darkened(by: 0.28)
+            let bodyHighlight = tokens.surfaceHighlightColor.blended(
+                withFraction: 0.35,
+                of: tokens.surfaceBaseColor
+            ) ?? tokens.surfaceHighlightColor
+            let legendTextColor = tokens.textColor.darkened(by: 0.18)
+
+            self.shared = Shared(
+                badgeFillColor: tokens.badgeFillColor,
+                badgeHighlightColor: tokens.badgeHighlightColor,
+                badgeStrokeColor: tokens.badgeStrokeColor,
+                badgeTextColor: tokens.badgeTextColor,
+                groupBackgroundColor: tokens.groupBackgroundColor,
+                groupStrokeColor: tokens.groupStrokeColor,
+                textColor: legendTextColor
+            )
+            self.wellColor = tokens.recessColor.darkened(by: 0.45)
+            // Lit from the left: bright edge, base across the middle, shaded right edge.
+            self.bodyGradient = NSGradient(colorsAndLocations:
+                (tokens.surfaceHighlightColor, 0.0),
+                (bodyHighlight, 0.14),
+                (tokens.surfaceBaseColor, 0.55),
+                (tokens.surfaceShadowColor, 0.92),
+                (bodyEdge, 1.0)
+            )
+            // The front skirt catches more light at its lower edge than the face above it.
+            self.skirtGradient = NSGradient(colorsAndLocations:
+                (bodyEdge, 0.0),
+                (tokens.surfaceBaseColor, 0.45),
+                (tokens.surfaceHighlightColor, 1.0)
+            )
+            self.faceGradient = NSGradient(colorsAndLocations:
+                (tokens.surfaceHighlightColor, 0.0),
+                (tokens.surfaceBaseColor, 0.58),
+                (tokens.surfaceShadowColor, 1.0)
+            )
+            self.creaseColor = tokens.surfaceBorderColor.withAlphaComponent(0.42)
+            self.bodyStrokeColor = tokens.surfaceBorderColor
+        }
+    }
+}

Apps/Keyty/Sources/Keyty/Features/Visualizers/Keyboard/Appearance/KeycapAppearance+Minimal.swift

@@ -0,0 +1,19 @@
+//
+//  KeycapAppearance+Minimal.swift
+//  Keyty
+//
+//  SPDX-FileCopyrightText: 2026 Serhii Bykov
+//  SPDX-License-Identifier: BSD-3-Clause
+//
+
+import AppKit
+
+extension KeycapAppearance {
+    struct Minimal: KeycapAppearanceProviding {
+        let shared: Shared
+
+        init(tokens: KeycapThemeTokens) {
+            self.shared = Shared(tokens: tokens)
+        }
+    }
+}

Apps/Keyty/Sources/Keyty/Features/Visualizers/Keyboard/Appearance/KeycapAppearance+PBT.swift

@@ -0,0 +1,42 @@
+//
+//  KeycapAppearance+PBT.swift
+//  Keyty
+//
+//  SPDX-FileCopyrightText: 2026 Serhii Bykov
+//  SPDX-License-Identifier: BSD-3-Clause
+//
+
+import AppKit
+
+extension KeycapAppearance {
+    struct PBT: KeycapAppearanceProviding {
+        let shared: Shared
+        let bodyGradient: NSGradient?
+        let bodyStrokeColor: NSColor
+        let underDishColor: NSColor
+        let dishGradient: NSGradient?
+
+        init(tokens: KeycapThemeTokens) {
+            let bodyTop = tokens.surfaceBaseColor.lightened(by: 0.08)
+            let bodyMid = tokens.surfaceShadowColor.lightened(by: 0.03)
+            let bodyBottom = tokens.surfaceShadowColor.darkened(by: 0.08)
+            let dishTop = tokens.surfaceBaseColor.lightened(by: 0.05)
+            let dishMid = tokens.surfaceBaseColor.lightened(by: 0.06)
+            let dishBottom = tokens.surfaceShadowColor.lightened(by: 0.05)
+
+            self.shared = Shared(tokens: tokens)
+            self.bodyGradient = NSGradient(colorsAndLocations:
+                (bodyTop, 0.0),
+                (bodyMid, 0.48),
+                (bodyBottom, 1.0)
+            )
+            self.bodyStrokeColor = tokens.surfaceBorderColor
+            self.underDishColor = tokens.surfaceBaseColor.lightened(by: 0.12)
+            self.dishGradient = NSGradient(colorsAndLocations:
+                (dishTop, 0.0),
+                (dishMid, 0.32),
+                (dishBottom, 1.0)
+            )
+        }
+    }
+}

Apps/Keyty/Sources/Keyty/Features/Visualizers/Keyboard/Appearance/KeycapAppearance+Retro.swift

@@ -0,0 +1,81 @@
+//
+//  KeycapAppearance+Retro.swift
+//  Keyty
+//
+//  SPDX-FileCopyrightText: 2026 Serhii Bykov
+//  SPDX-License-Identifier: BSD-3-Clause
+//
+
+import AppKit
+
+extension KeycapAppearance {
+    struct Retro: KeycapAppearanceProviding {
+        let shared: Shared
+        let lipGradient: NSGradient?
+        let bodyShadowColor: NSColor
+        let bodyGradient: NSGradient?
+        let bodyStrokeColor: NSColor
+        let faceShadowGradient: NSGradient?
+        let darkFaceGradient: NSGradient?
+        let darkFaceStrokeColor: NSColor
+        let lightFaceGradient: NSGradient?
+        let lightFaceStrokeColor: NSColor
+        let glossColor: NSColor
+
+        init(tokens: KeycapThemeTokens) {
+            let bodyEdge = tokens.surfaceShadowColor.darkened(by: 0.08)
+            let bodyCenter = tokens.surfaceBaseColor.darkened(by: 0.10)
+            let darkFaceTop = tokens.surfaceBaseColor.lightened(by: 0.03)
+            let darkFaceBottom = tokens.surfaceBaseColor.darkened(by: 0.01)
+            let lightFaceTop = tokens.surfaceHighlightColor.lightened(by: 0.08)
+            let lightFaceBottom = tokens.surfaceBaseColor
+            let groupBackgroundColor = tokens.recessColor.darkened(by: 0.40)
+            let groupStrokeColor = tokens.surfaceBaseColor.withAlphaComponent(0.70)
+            let lipEdge = tokens.recessColor.darkened(by: 0.34).withAlphaComponent(0.96)
+            let lipCenter = tokens.recessColor.darkened(by: 0.12).withAlphaComponent(0.86)
+            let bodyStrokeColor = tokens.surfaceBorderColor.withAlphaComponent(0.20)
+            let darkFaceStrokeColor = tokens.surfaceBorderColor.withAlphaComponent(0.20)
+            let faceShadowEdge = tokens.recessColor.darkened(by: 0.34).withAlphaComponent(0.46)
+            let faceShadowCenter = tokens.recessColor.darkened(by: 0.12).withAlphaComponent(0.26)
+
+            self.shared = Shared(
+                badgeFillColor: tokens.badgeFillColor,
+                badgeHighlightColor: tokens.badgeHighlightColor,
+                badgeStrokeColor: tokens.badgeStrokeColor,
+                badgeTextColor: tokens.badgeTextColor,
+                groupBackgroundColor: groupBackgroundColor,
+                groupStrokeColor: groupStrokeColor,
+                textColor: tokens.textColor
+            )
+            self.lipGradient = NSGradient(colorsAndLocations:
+                (lipEdge, 0.0),
+                (lipCenter, 0.5),
+                (lipEdge, 1.0)
+            )
+            self.bodyShadowColor = NSColor.black.withAlphaComponent(0.6)
+            self.bodyGradient = NSGradient(colorsAndLocations:
+                (bodyEdge, 0.0),
+                (bodyCenter, 0.32),
+                (bodyCenter, 0.68),
+                (bodyEdge, 1.0)
+            )
+            self.bodyStrokeColor = bodyStrokeColor
+            self.faceShadowGradient = NSGradient(colorsAndLocations:
+                (faceShadowEdge, 0.0),
+                (faceShadowCenter, 0.5),
+                (faceShadowEdge, 1.0)
+            )
+            self.darkFaceGradient = NSGradient(colorsAndLocations:
+                (darkFaceTop, 0.0),
+                (darkFaceBottom, 1.0)
+            )
+            self.darkFaceStrokeColor = darkFaceStrokeColor
+            self.lightFaceGradient = NSGradient(colorsAndLocations:
+                (lightFaceTop, 0.0),
+                (lightFaceBottom, 1.0)
+            )
+            self.lightFaceStrokeColor = tokens.surfaceBorderColor.withAlphaComponent(0.55)
+            self.glossColor = NSColor(white: 1, alpha: 0.08)
+        }
+    }
+}