ui: lay the EUICCInfo2 chip fields out in two columns

The short EUICCInfo2 fields (versions, card resources, category, PPRs, …)
were one per row in the wide right-hand box, wasting half of it.

- esimChipValueWide(): a row needs the full width when its value is a
  list or a long token (>24 chars or ', '), so short scalars pair up.
- esimChipBox() gained a twoColumns mode: rows in a responsive
  grid-cols-1 sm:grid-cols-2 grid with long values spanning both columns;
  the other boxes keep their single-column rows.
- esimRenderChip() renders the EUICCInfo2 box with two columns.
- style.css rebuilt (sm:grid-cols-2, sm:col-span-2).
- tests: the wide/short rule, the two-column markup and the render call;
  help EN/RU and AGENTS note the layout; sw.js simple-v233.

frontend/style.css

@@ -1977,6 +1977,16 @@ video {
   color: rgb(203 213 225 / var(--tw-text-opacity, 1));
 }
 
+@media (min-width: 640px) {
+  .sm\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+
+  .sm\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
 @media (min-width: 1024px) {
   .lg\:col-span-1 {
     grid-column: span 1 / span 1;