Unify font sizes through qs.Commons.Style

Themes now drive typography the same way they drive colors: one [font]
base-size in shell.toml is the rem root, and every Style.font.<token>
(caption, bodySmall, body, subtitle, title, heading, display,
displayLarge, iconSmall, icon, iconLarge) derives from it via a fixed
multiplier. Themes can also pin individual tokens for stylistic
emphasis. base-size is clamped 11..13 until row-height tokens exist.

Bar dimensions move to the same singleton: [bar] size-horizontal /
size-vertical replace the hardcoded 26/28 in Bar.qml, exposed as
Style.bar.sizeHorizontal / sizeVertical.

Style.qml also resolves the fontconfig 'monospace' alias via fc-match
and exposes Style.font.resolvedFamily so panels can display the
concrete family. Watches ~/.config/fontconfig/fonts.conf so it tracks
'omarchy font set <name>'.

The qs.Ui kit (PillButton, Dropdown, Toggle, TextField, etc.) and
every first-party plugin (bar widgets, settings, menu, clipboard,
emoji, polkit, notifications, osd, image-picker, dev-gallery) now
bind to Style.font.* instead of pixel literals. Only three deliberate
display-scale outliers remain: the notification empty-state glyph and
the weather flyout's hero temperature pair, all commented.

Background plugin's applyTheme IPC fast-path also pushes shell.toml to
Style so theme swaps update typography and bar size without waiting
for inotify debounce.

Dev gallery (omarchy dev ui-preview) now ships a Typography section
that renders the full scale and theme tokens live, and its summon
command is fixed (omarchy-shell-ipc -> omarchy-shell).

shell/plugins/bar/widgets/media.qml

@@ -2,6 +2,7 @@ import QtQuick
 import Quickshell
 import Quickshell.Services.Mpris
 import qs.Ui
+import qs.Commons
 
 Item {
   id: root
@@ -52,8 +53,7 @@ Item {
       text: root.playIcon
       color: activePlayer && activePlayer.isPlaying ? root.bar.foreground : Qt.darker(root.bar.foreground, 1.5)
       font.family: root.bar.fontFamily
-      font.pixelSize: 12
-
+      font.pixelSize: Style.font.body
       Behavior on color { ColorAnimation { duration: 160 } }
     }
 
@@ -70,7 +70,7 @@ Item {
         text: root.title + (root.artist ? "  ·  " + root.artist : "")
         color: root.bar.foreground
         font.family: root.bar.fontFamily
-        font.pixelSize: 12
+        font.pixelSize: Style.font.body
         anchors.verticalCenter: parent.verticalCenter
 
         property bool needsScroll: implicitWidth > scrollClip.width
@@ -154,7 +154,7 @@ Item {
             text: "󰝚"
             color: root.bar.foreground
             font.family: root.bar.fontFamily
-            font.pixelSize: 28
+            font.pixelSize: Style.font.displayLarge
           }
         }
 
@@ -166,7 +166,7 @@ Item {
             text: root.title || "Nothing playing"
             color: root.bar.foreground
             font.family: root.bar.fontFamily
-            font.pixelSize: 13
+            font.pixelSize: Style.font.subtitle
             font.bold: true
             elide: Text.ElideRight
             width: parent.width
@@ -176,7 +176,7 @@ Item {
             text: root.artist
             color: Qt.darker(root.bar.foreground, 1.3)
             font.family: root.bar.fontFamily
-            font.pixelSize: 11
+            font.pixelSize: Style.font.bodySmall
             elide: Text.ElideRight
             width: parent.width
             visible: text !== ""
@@ -186,7 +186,7 @@ Item {
             text: root.activePlayer && root.activePlayer.trackAlbum ? root.activePlayer.trackAlbum : ""
             color: Qt.darker(root.bar.foreground, 1.6)
             font.family: root.bar.fontFamily
-            font.pixelSize: 10
+            font.pixelSize: Style.font.caption
             elide: Text.ElideRight
             width: parent.width
             visible: text !== ""