diff --git a/src/components/sharedComponents/BigNumberInput.tsx b/src/components/sharedComponents/BigNumberInput.tsx
index 60702ede..d299629e 100644
--- a/src/components/sharedComponents/BigNumberInput.tsx
+++ b/src/components/sharedComponents/BigNumberInput.tsx
@@ -6,6 +6,7 @@ import {
   type RefObject,
   useEffect,
   useRef,
+  useState,
 } from 'react'
 import { formatUnits, maxUint256, parseUnits } from 'viem'
 export type RenderInputProps = Omit<InputProps, 'onChange'> & {
@@ -66,6 +67,7 @@ export const BigNumberInput: FC<BigNumberInputProps> = ({
   value,
 }: BigNumberInputProps) => {
   const inputRef = useRef<HTMLInputElement>(null)
+  const [hasError, setHasError] = useState(false)
 
   // update inputValue when value changes
   useEffect(() => {
@@ -73,7 +75,15 @@ export const BigNumberInput: FC<BigNumberInputProps> = ({
     if (!current) {
       return
     }
-    const currentInputValue = parseUnits(current.value.replace(/,/g, '') || '0', decimals)
+    // The input may contain an intermediate/unparseable string while the user is
+    // typing; guard against a parseUnits throw so an external value update never
+    // crashes the effect.
+    let currentInputValue: bigint
+    try {
+      currentInputValue = parseUnits(current.value.replace(/,/g, '') || '0', decimals)
+    } catch {
+      currentInputValue = BigInt(-1) // sentinel: force the DOM value to be overwritten
+    }
 
     if (currentInputValue !== value) {
       current.value = formatUnits(value, decimals)
@@ -91,6 +101,7 @@ export const BigNumberInput: FC<BigNumberInputProps> = ({
     const { value } = typeof event === 'string' ? { value: event } : event.currentTarget
 
     if (value === '') {
+      setHasError(false)
       onChange(BigInt(0))
       return
     }
@@ -125,12 +136,16 @@ export const BigNumberInput: FC<BigNumberInputProps> = ({
       }] and value is: ${value}`
       console.warn(message)
       onError?.({ value, message })
+      setHasError(true)
+    } else {
+      setHasError(false)
     }
 
     onChange(newValue)
   }
 
   const inputProps = {
+    'aria-invalid': (hasError || undefined) as true | undefined,
     disabled,
     onChange: updateValue,
     placeholder,
diff --git a/src/components/sharedComponents/Hash.tsx b/src/components/sharedComponents/Hash.tsx
index 5022ee1f..f44594df 100644
--- a/src/components/sharedComponents/Hash.tsx
+++ b/src/components/sharedComponents/Hash.tsx
@@ -61,7 +61,12 @@ const Hash: FC<HashProps> = ({
           aria-label="Copy"
         />
       )}
-      {explorerURL && <ExternalLink href={explorerURL} />}
+      {explorerURL && (
+        <ExternalLink
+          aria-label="View on explorer"
+          href={explorerURL}
+        />
+      )}
     </Flex>
   )
 }
diff --git a/src/components/sharedComponents/TokenInput/index.tsx b/src/components/sharedComponents/TokenInput/index.tsx
index 60d60626..d558d39b 100644
--- a/src/components/sharedComponents/TokenInput/index.tsx
+++ b/src/components/sharedComponents/TokenInput/index.tsx
@@ -202,7 +202,10 @@ const TokenInput: FC<Props> = ({
               showBalance={showBalance}
               showTopTokens={showTopTokens}
             >
-              <CloseButton onClick={() => setIsOpen(false)} />
+              <CloseButton
+                aria-label="Close"
+                onClick={() => setIsOpen(false)}
+              />
             </TokenSelect>
           </Dialog.Content>
         </Dialog.Positioner>
diff --git a/src/components/sharedComponents/ui/CopyButton/index.tsx b/src/components/sharedComponents/ui/CopyButton/index.tsx
index 93a2b523..bff35858 100644
--- a/src/components/sharedComponents/ui/CopyButton/index.tsx
+++ b/src/components/sharedComponents/ui/CopyButton/index.tsx
@@ -77,10 +77,15 @@ export const CopyButton: FC<Props> = ({
       height="fit-content"
       justifyContent="center"
       lineHeight="1"
-      outline="none"
       padding="0"
+      _focusVisible={{
+        outline: '2px solid',
+        outlineColor: 'primary.default',
+        outlineOffset: '2px',
+        borderRadius: '2px',
+      }}
       textDecoration="none"
-      transition="background-color {durations.moderate}, border-color {durations.moderate}, color {durations.moderate"
+      transition="background-color {durations.moderate}, border-color {durations.moderate}, color {durations.moderate}"
       userSelect="none"
       whiteSpace="nowrap"
       width="fit-content"
diff --git a/src/components/sharedComponents/ui/ExternalLink/index.tsx b/src/components/sharedComponents/ui/ExternalLink/index.tsx
index feb27ac5..6fda6159 100644
--- a/src/components/sharedComponents/ui/ExternalLink/index.tsx
+++ b/src/components/sharedComponents/ui/ExternalLink/index.tsx
@@ -57,9 +57,14 @@ export const ExternalLinkButton: FC<LinkProps> = ({
       fontWeight="400"
       height="fit-content"
       justifyContent="center"
-      outline="none"
       padding="0"
-      transition="background-color {durations.moderate}, border-color {durations.moderate}, color {durations.moderate"
+      _focusVisible={{
+        outline: '2px solid',
+        outlineColor: 'primary.default',
+        outlineOffset: '2px',
+        borderRadius: '2px',
+      }}
+      transition="background-color {durations.moderate}, border-color {durations.moderate}, color {durations.moderate}"
       whiteSpace="nowrap"
       width="fit-content"
       _hover={{
diff --git a/src/components/sharedComponents/ui/Modal/index.tsx b/src/components/sharedComponents/ui/Modal/index.tsx
index 57b263d7..d72455e6 100644
--- a/src/components/sharedComponents/ui/Modal/index.tsx
+++ b/src/components/sharedComponents/ui/Modal/index.tsx
@@ -84,7 +84,12 @@ export const Modal: FC<Props> = ({ css, children, title, onClose, text, ...restP
       >
         {title}
       </Heading>
-      {onClose && <CloseButton onClick={() => onClose()} />}
+      {onClose && (
+        <CloseButton
+          aria-label="Close"
+          onClick={() => onClose()}
+        />
+      )}
       {children ? children : 'No contents'}
       <Text
         borderRadius="md"
diff --git a/src/components/ui/provider.tsx b/src/components/ui/provider.tsx
index 00a93b0f..e9451067 100644
--- a/src/components/ui/provider.tsx
+++ b/src/components/ui/provider.tsx
@@ -57,23 +57,23 @@ export function Provider(props: ColorModeProviderProps) {
             default: {
               value: {
                 _light: '#800',
-                _dark: '#800',
+                _dark: '#ff6666',
               },
             },
           },
           ok: {
             default: {
               value: {
-                _light: '#080',
-                _dark: '#080',
+                _light: '#006600',
+                _dark: '#66ee66',
               },
             },
           },
           warning: {
             default: {
               value: {
-                _light: '#cc0',
-                _dark: '#cc0',
+                _light: '#996600',
+                _dark: '#e6b800',
               },
             },
           },
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 5666d85e..7037e400 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -7,7 +7,7 @@ import { Toaster } from '@/src/components/ui/toaster'
 import { TransactionNotificationProvider } from '@/src/providers/TransactionNotificationProvider'
 import { Web3Provider } from '@/src/providers/Web3Provider'
 import { printAppInfo } from '@/src/utils/printAppInfo'
-import { Flex } from '@chakra-ui/react'
+import { Flex, chakra } from '@chakra-ui/react'
 import { Outlet, createRootRoute } from '@tanstack/react-router'
 import { Analytics } from '@vercel/analytics/react'
 import { useEffect } from 'react'
@@ -30,11 +30,26 @@ function Root() {
             minH="100vh"
             w="100%"
           >
+            <chakra.a
+              bg="bg.default"
+              color="text.default"
+              href="#main-content"
+              left={0}
+              p={2}
+              position="absolute"
+              top="-100%"
+              zIndex="tooltip"
+              _focusVisible={{ top: 0 }}
+            >
+              Skip to main content
+            </chakra.a>
             <Header />
             <Flex
               as="main"
               direction="column"
               flexGrow="1"
+              id="main-content"
+              tabIndex={-1}
             >
               <Outlet />
             </Flex>