fix(ui): optimize mobile layout for header and settings page

src/pages/Settings/Settings.module.scss

@@ -105,3 +105,33 @@
   display: flex;
   gap: $spacing-sm;
 }
+
+.retryRow {
+  display: flex;
+  align-items: flex-end;
+  gap: $spacing-md;
+  flex-wrap: wrap;
+
+  :global(.form-group) {
+    margin-bottom: 0;
+  }
+
+  @include mobile {
+    flex-direction: column;
+    align-items: stretch;
+  }
+}
+
+.retryInput {
+  width: 140px;
+
+  @include mobile {
+    width: 100%;
+  }
+}
+
+.retryButton {
+  @include mobile {
+    width: 100%;
+  }
+}

src/pages/SettingsPage.tsx

@@ -266,18 +266,27 @@ export function SettingsPage() {
       </Card>
 
       <Card title={t('basic_settings.retry_title')}>
-        <Input
-          label={t('basic_settings.retry_count_label')}
-          type="number"
-          value={retryValue}
-          onChange={(e) => setRetryValue(Number(e.target.value))}
-          disabled={disableControls || loading}
-          rightElement={
-            <Button onClick={handleRetryUpdate} loading={pending.retry} disabled={disableControls || loading}>
-              {t('basic_settings.retry_update')}
-            </Button>
-          }
-        />
+        <div className={styles.retryRow}>
+          <Input
+            label={t('basic_settings.retry_count_label')}
+            type="number"
+            inputMode="numeric"
+            min={0}
+            step={1}
+            value={retryValue}
+            onChange={(e) => setRetryValue(Number(e.target.value))}
+            disabled={disableControls || loading}
+            className={styles.retryInput}
+          />
+          <Button
+            className={styles.retryButton}
+            onClick={handleRetryUpdate}
+            loading={pending.retry}
+            disabled={disableControls || loading}
+          >
+            {t('basic_settings.retry_update')}
+          </Button>
+        </div>
       </Card>
 
       <Card title={t('basic_settings.quota_title')}>