feat(ui): widen cards to a 2/3 column grid and add a disabled role

Two columns portrait and three landscape read better than 3/4 on a 320x480
panel. The new disabled palette role sits between face and muted, for a
control that is present but inactive.

lua/lib/ui.lua

@@ -75,6 +75,7 @@ local function palette(seed)
 		color = color(foreground),
 		muted = color(mix(foreground, background, 0.45)),
 		accent = color(accent),
+		disabled = color(mix(background, foreground, 0.25)),
 		face = color(mix(background, foreground, 0.08)),
 		pressedFace = color(accent),
 		pressedColor = color(background),
@@ -187,7 +188,7 @@ end
 ---@return integer side
 ---@return integer columns
 function ui.cardSide(count, pad, gap, reserve)
-	local columns = gui.getWidth() >= gui.getHeight() and 4 or 3
+	local columns = gui.getWidth() >= gui.getHeight() and 3 or 2
 	local rows = math.ceil(count / columns)
 	local byWidth = (gui.getWidth() - 2 * pad - (columns - 1) * gap) // columns
 	local byHeight = (gui.getHeight() - 2 * pad - (reserve or 0) - (rows - 1) * gap) // rows

lua/test/ui.lua

@@ -15,6 +15,8 @@ fs = {
   end,
 }
 
+local frameWidth, frameHeight = 320, 480
+
 gui = {
   FONT_SMALL = 0,
   FONT_UI = 1,
@@ -23,8 +25,8 @@ gui = {
   STYLE_NORMAL = 0,
   STYLE_BOLD = 1,
   color = function(r, g, b) return r * 65536 + g * 256 + b end,
-  getWidth = function() return 320 end,
-  getHeight = function() return 480 end,
+  getWidth = function() return frameWidth end,
+  getHeight = function() return frameHeight end,
   getTextWidth = function(_, text) return #text * 6 end,
   getFontHeight = function() return 8 end,
   clear = function(color) cleared = color end,
@@ -188,11 +190,15 @@ assert(cleared == ui.theme.background)
 
 screen:draw()
 
--- 320x480 portrait: three columns, and the reserve comes off the height budget.
+-- 320x480 portrait: two columns, and the reserve comes off the height budget.
 local side, columns = ui.cardSide(5, 12, 8)
-assert(columns == 3 and side == 93, "width is the binding constraint in portrait")
--- Five cards are two rows, so a reserve that eats the height budget shrinks the card.
-assert(select(1, ui.cardSide(5, 12, 8, 300)) == 74, "height binds once the reserve is large")
+assert(columns == 2 and side == 144, "width is the binding constraint in portrait")
+assert(select(1, ui.cardSide(5, 12, 8, 300)) == 46, "height binds once the reserve is large")
+
+frameWidth, frameHeight = 480, 320
+side, columns = ui.cardSide(5, 12, 8)
+assert(columns == 3 and side == 144, "landscape uses three columns")
+frameWidth, frameHeight = 320, 480
 
 -- A widget painting its own feedback is never given a pressed style, while an ordinary one
 -- still is. Which node was hit is geometry, so the test names the target directly.