the editor sections fall to one column when it is narrow

A container query on the scroller, once, so a new section is responsive by being
in the column rather than by remembering to say so. Below 320px the two-column
sections stack instead of truncating every select to "Martia…".

Colors stays flex-wrap: three swatches in a two-column grid is 2 and 1.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

web/sections/LayoutPanel.tsx

@@ -354,7 +354,7 @@ export const LayoutPanel = () => {
             give each one room to be read, which is the only thing this control is for.
 
           */}
-          <div className="grid grid-cols-2 gap-3">
+          <div className="grid grid-cols-1 gap-3 @[20rem]:grid-cols-2">
             {ROLES.map(({ font, label }) => (
               <div key={font} className="flex flex-col gap-1">
                 <label className="text-xs">{label}</label>