feat: make the web UI usable on phones (360-768px)

Responsive pass limited to CSS plus small markup hooks, so desktop (>900px) is unchanged.

- shell: static header with 2-row controls, sticky scrollable tab bar with fade + snap, 40px touch targets, 16px inputs, full-width toasts with safe-area
- grids collapse to one column; dashboard counters become 3 compact tiles and analyst stats 2x2
- equipment: full-width subtabs/filters, 3-up tiles, inspector becomes a bottom sheet on phones
- inventory: 2 columns fit without side scrolling, full-width quantity inputs
- characters: full-width search, 2-column avatar grid with stacked portrait
- dialogs: dvh-capped bottom sheets, two-column light cone and avatar pickers
- json/monster/settings/console form and scroll fixes
- compact one-row header for landscape phones (844x390 174px -> 108px)
- i18n: localize inventory view and relic-set search aria labels/placeholder
- bump styles.css 2.33, item-catalog.css 3, app.js 3.27, i18n.js 2.22

css/item-catalog.css

@@ -107,6 +107,10 @@
 @media (max-width: 540px) {
   .item-catalog-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
   .item-catalog-toolbar .form-select { flex: 1 1 100%; }
+  /* Keep supporting text legible on phones. */
+  .item-catalog-name { font-size: .88rem; }
+  .item-catalog-details { font-size: .72rem; }
+  .item-catalog-support { font-size: .68rem; }
 }
 .inventory-mode-switch {
   display: flex;