fix(details): QSL via gets the width, QSL message gives it up

Width should follow use, and these two are nowhere near equal: a manager's
callsign is typed constantly, a QSL message almost never. The message held 7
columns of 12 for text most operators never write, while the field beside it —
often a long "via" instruction — was the one running out of room.

Swapped, so QSL via takes 7 and the message 5. Also puts them in the order they
are reached for.

frontend/src/components/DetailsPanel.tsx

@@ -373,12 +373,16 @@ export function DetailsPanel({ callsign, prefix, operatorGrid, remoteGrid, qth,
               <Input value={details.address} onChange={(e) => onChange({ address: e.target.value })} />
             </Field>
           </div>
-          <Field label={t('detp.qslMessage')} span={7}>
-            <Input value={details.qsl_msg} onChange={(e) => onChange({ qsl_msg: e.target.value })} />
-          </Field>
-          <Field label={t('detp.qslVia')} span={5}>
+          {/* QSL via gets the room, not the message. Width should follow use, and
+              these two are nowhere near equal: a manager's callsign is filled in
+              constantly and a QSL message almost never. The message had 7 columns
+              of 12 for text most operators never type. */}
+          <Field label={t('detp.qslVia')} span={7}>
             <Input value={details.qsl_via} onChange={(e) => onChange({ qsl_via: e.target.value })} />
           </Field>
+          <Field label={t('detp.qslMessage')} span={5}>
+            <Input value={details.qsl_msg} onChange={(e) => onChange({ qsl_msg: e.target.value })} />
+          </Field>
         </div>
       )}