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

js/avatars-data.js

@@ -1,4 +1,4 @@
-import { getCurrentLanguage, translateElement, translatePath } from "./i18n.js?v=2.21";
+import { getCurrentLanguage, translateElement, translatePath } from "./i18n.js?v=2.22";
 
 export const AVATAR_METADATA = {
   "1001": {