fix(studio): add backup CLI to PauseFailedState and improve encoding guidance

- Add LogicalBackupCliInstructions to PauseFailedState (mirrors RestoreFailedState)
- Add single quote and percent sign to percent-encoding guidance (both break single-quoted shell commands or URI parsing)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/studio/components/layouts/ProjectLayout/LogicalBackupCliInstructions.tsx

@@ -81,8 +81,10 @@ export const LogicalBackupCliInstructions = ({
         <p className="text-sm text-foreground-light mt-1">
           Use your direct connection string (replace {DB_PASSWORD_PLACEHOLDER} with your database
           password). If your password contains special characters such as <code>@</code>,{' '}
-          <code>#</code>, or <code>:</code>, percent-encode them first (e.g. <code>@</code> →{' '}
-          <code>%40</code>).{' '}
+          <code>#</code>, <code>:</code>, or <code>'</code>, percent-encode them first (e.g.{' '}
+          <code>@</code> → <code>%40</code>, <code>'</code> → <code>%27</code>). If your password
+          contains <code>%</code>, encode it as <code>%25</code> before encoding any other
+          characters.{' '}
           <InlineLink href={`${DOCS_URL}/guides/platform/backups`}>Backup documentation</InlineLink>
           .
         </p>

apps/studio/components/layouts/ProjectLayout/PauseFailedState.tsx

@@ -5,6 +5,7 @@ import { useState } from 'react'
 import { Button, CriticalIcon, DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from 'ui'
 
 import { DeleteProjectModal } from '@/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectModal'
+import { LogicalBackupCliInstructions } from '@/components/layouts/ProjectLayout/LogicalBackupCliInstructions'
 import { SupportLink } from '@/components/interfaces/Support/SupportLink'
 import { ButtonTooltip } from '@/components/ui/ButtonTooltip'
 import { DropdownMenuItemTooltip } from '@/components/ui/DropdownMenuItemTooltip'
@@ -67,6 +68,10 @@ export const PauseFailedState = () => {
               </div>
             </div>
 
+            <div className="border-t border-overlay px-8 py-4">
+              <LogicalBackupCliInstructions />
+            </div>
+
             <div className="border-t border-overlay flex items-center justify-end gap-x-2 py-4 px-8">
               <Button asChild type="default">
                 <SupportLink