diff --git a/src/GZCTF/ClientApp/src/components/ChallengeCard.tsx b/src/GZCTF/ClientApp/src/components/ChallengeCard.tsx
index 575311f82..90f0a8268 100644
--- a/src/GZCTF/ClientApp/src/components/ChallengeCard.tsx
+++ b/src/GZCTF/ClientApp/src/components/ChallengeCard.tsx
@@ -20,6 +20,7 @@ import { Trans } from 'react-i18next'
 import { BloodsTypes, useChallengeTagLabelMap } from '@Utils/Shared'
 import { ChallengeInfo, SubmissionType } from '@Api'
 import classes from '@Styles/ChallengeCard.module.css'
+import hoverClasses from '@Styles/HoverCard.module.css'
 import tooltipClasses from '@Styles/Tooltip.module.css'
 
 interface ChallengeCardProps {
@@ -38,7 +39,7 @@ const ChallengeCard: FC<ChallengeCardProps> = (props: ChallengeCardProps) => {
   const theme = useMantineTheme()
 
   return (
-    <Card onClick={onClick} radius="md" shadow="sm" className={classes.card}>
+    <Card onClick={onClick} radius="md" shadow="sm" className={hoverClasses.root}>
       <Stack gap="sm" pos="relative" style={{ zIndex: 99 }}>
         <Group h="30px" wrap="nowrap" justify="space-between" gap={2}>
           <Text fw="bold" truncate fz="lg">
diff --git a/src/GZCTF/ClientApp/src/components/GameNoticePanel.tsx b/src/GZCTF/ClientApp/src/components/GameNoticePanel.tsx
index 6b19d0805..300471585 100644
--- a/src/GZCTF/ClientApp/src/components/GameNoticePanel.tsx
+++ b/src/GZCTF/ClientApp/src/components/GameNoticePanel.tsx
@@ -180,6 +180,7 @@ const GameNoticePanel: FC = () => {
       <Stack gap="xs">
         <SegmentedControl
           value={filter}
+          color={theme.primaryColor}
           styles={{
             root: {
               background: 'transparent',
diff --git a/src/GZCTF/ClientApp/src/components/WithGameMonitor.tsx b/src/GZCTF/ClientApp/src/components/WithGameMonitor.tsx
index 79c71e5af..ede8ce1d1 100644
--- a/src/GZCTF/ClientApp/src/components/WithGameMonitor.tsx
+++ b/src/GZCTF/ClientApp/src/components/WithGameMonitor.tsx
@@ -112,8 +112,10 @@ const WithGameMonitor: FC<WithGameMonitorProps> = ({ children, isLoading }) => {
             <Stack w="calc(100% - 10rem)" pos="relative">
               <LoadingOverlay
                 visible={isLoading ?? false}
-                opacity={1}
-                c={colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2]}
+                overlayProps={{
+                  backgroundOpacity: 1,
+                  color: colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2],
+                }}
               />
               {children}
             </Stack>
diff --git a/src/GZCTF/ClientApp/src/components/WithGameTab.tsx b/src/GZCTF/ClientApp/src/components/WithGameTab.tsx
index a78f404ed..fd6392b05 100644
--- a/src/GZCTF/ClientApp/src/components/WithGameTab.tsx
+++ b/src/GZCTF/ClientApp/src/components/WithGameTab.tsx
@@ -181,8 +181,10 @@ const WithGameTab: FC<React.PropsWithChildren> = ({ children }) => {
     <Stack pos="relative" mt="md">
       <LoadingOverlay
         visible={!game}
-        opacity={1}
-        c={colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2]}
+        overlayProps={{
+          backgroundOpacity: 1,
+          color: colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2],
+        }}
       />
       <IconTabs
         active={activeTab}
diff --git a/src/GZCTF/ClientApp/src/components/WithNavbar.tsx b/src/GZCTF/ClientApp/src/components/WithNavbar.tsx
index 8283422fd..143402da9 100644
--- a/src/GZCTF/ClientApp/src/components/WithNavbar.tsx
+++ b/src/GZCTF/ClientApp/src/components/WithNavbar.tsx
@@ -91,8 +91,10 @@ const WithNavBar: FC<WithNavBarProps> = ({
             >
               <LoadingOverlay
                 visible={isLoading ?? false}
-                opacity={1}
-                c={colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2]}
+                overlayProps={{
+                  backgroundOpacity: 1,
+                  color: colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2],
+                }}
               />
               {withHeader && <IconHeader px={isMobile ? '2%' : '10%'} sticky={stickyHeader} />}
               <Box
diff --git a/src/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx b/src/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx
index b567396a9..18003fa4f 100644
--- a/src/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx
+++ b/src/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx
@@ -86,12 +86,14 @@ const WithAdminTab: FC<AdminTabProps> = ({ head, headProps, isLoading, children
           {head}
         </Group>
       )}
+      {children}
       <LoadingOverlay
         visible={isLoading ?? false}
-        opacity={1}
-        c={colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2]}
+        overlayProps={{
+          backgroundOpacity: 1,
+          color: colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2],
+        }}
       />
-      {children}
     </Stack>
   )
 }
diff --git a/src/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx b/src/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx
index cad7f749e..37521999c 100644
--- a/src/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx
+++ b/src/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx
@@ -114,8 +114,10 @@ const WithGameEditTab: FC<GameEditTabProps> = ({
         <Stack w="calc(100% - 10rem)" pos="relative">
           <LoadingOverlay
             visible={isLoading ?? false}
-            opacity={1}
-            c={colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2]}
+            overlayProps={{
+              backgroundOpacity: 1,
+              color: colorScheme === 'dark' ? theme.colors.gray[7] : theme.colors.light[2],
+            }}
           />
 
           {children}
diff --git a/src/GZCTF/ClientApp/src/locales/en_US/game.json b/src/GZCTF/ClientApp/src/locales/en_US/game.json
index fca723420..7a429dc70 100644
--- a/src/GZCTF/ClientApp/src/locales/en_US/game.json
+++ b/src/GZCTF/ClientApp/src/locales/en_US/game.json
@@ -148,8 +148,8 @@
   },
   "notice": {
     "blood": "Congratulations to {{team}} for the {{blood}} on {{chal}}.",
-    "new_challenge": "New challenge [{{title}}] has been released",
-    "new_hint": "New hints to [{{title}}]"
+    "new_challenge": "New challenge [{{title}}] has been released.",
+    "new_hint": "Hints for [{{title}}] has been updated."
   },
   "notification": {
     "connected": {
diff --git a/src/GZCTF/ClientApp/src/locales/ja_JP/admin.json b/src/GZCTF/ClientApp/src/locales/ja_JP/admin.json
index ccbfe7156..3578e5a7e 100644
--- a/src/GZCTF/ClientApp/src/locales/ja_JP/admin.json
+++ b/src/GZCTF/ClientApp/src/locales/ja_JP/admin.json
@@ -249,15 +249,15 @@
     "settings": {
       "account": {
         "allow_register": {
-          "description": "アカウントの新規登録を許可します",
+          "description": "アカウントの新規登録を許可します。",
           "label": "アカウント新規登録を許可"
         },
         "auto_active": {
-          "description": "アカウント新規登録後自動的にアクティブにします",
+          "description": "アカウント新規登録後自動的にアクティブにします。",
           "label": "新規登録後に自動で有効化する"
         },
         "email_confirmation_required": {
-          "description": "アカウント新規登録するときメールの認証を要求します",
+          "description": "アカウント新規登録するときメールの認証を要求します。",
           "label": "メール認証を要求"
         },
         "email_domain_list": {
@@ -266,25 +266,25 @@
         },
         "title": "アカウントポリシー",
         "use_captcha": {
-          "description": "ログイン、新規登録、パスワードの再設定時にキャプチャ検証を行います",
+          "description": "ログイン、新規登録、パスワードの再設定時にキャプチャ検証を行います。",
           "label": "キャプチャ認証を使用"
         }
       },
       "container": {
         "auto_destroy": {
-          "description": "ユーザーインスタンスが上限を超える場合は古いインスタンスを自動的に破棄する",
+          "description": "ユーザーインスタンスが上限を超える場合は古いインスタンスを自動的に破棄する。",
           "label": "古いインスタンスの自動破棄"
         },
         "default_lifetime": {
-          "description": "コンテナの既定の有効期限",
+          "description": "コンテナの既定の有効期限。",
           "label": "既定の有効期限（分）"
         },
         "extension_duration": {
-          "description": "コンテナが毎回延長される期間",
+          "description": "コンテナが毎回延長される期間。",
           "label": "延長される期間（分）"
         },
         "renewal_window": {
-          "description": "コンテナの有効期限が切れるまでの延長が許可される期間",
+          "description": "コンテナの有効期限が切れるまでの延長が許可される期間。",
           "label": "許可される期間（分）"
         },
         "title": "コンテナーポリシー"
@@ -299,7 +299,7 @@
           "label": "カラーパレット"
         },
         "description": {
-          "description": "検索エンジンとクローラーに提供されるプラットフォームの説明",
+          "description": "検索エンジンとクローラーに提供されるプラットフォームの説明。",
           "label": "プラットフォーム説明"
         },
         "footer": {
@@ -311,7 +311,7 @@
           "label": "プラットフォームアイコン"
         },
         "name": {
-          "description": "「::CTF」はプラットフォーム名に付かされて表示されます",
+          "description": "「::CTF」はプラットフォーム名に付かされて表示されます。",
           "label": "プラットフォーム名"
         },
         "slogan": {
diff --git a/src/GZCTF/ClientApp/src/pages/admin/Logs.tsx b/src/GZCTF/ClientApp/src/pages/admin/Logs.tsx
index e586b8375..c58a935c2 100644
--- a/src/GZCTF/ClientApp/src/pages/admin/Logs.tsx
+++ b/src/GZCTF/ClientApp/src/pages/admin/Logs.tsx
@@ -44,7 +44,7 @@ const Logs: FC = () => {
 
   const { t } = useTranslation()
   const viewport = useRef<HTMLDivElement>(null)
-  const { classes: inputClasses } = useDisplayInputStyles({ fw: 500, ff: 'monospace', lh: '1rem' })
+  const { classes: inputClasses } = useDisplayInputStyles({ fw: 500, ff: 'monospace' })
 
   useEffect(() => {
     viewport.current?.scrollTo({ top: 0, behavior: 'smooth' })
diff --git a/src/GZCTF/ClientApp/src/pages/admin/Teams.tsx b/src/GZCTF/ClientApp/src/pages/admin/Teams.tsx
index 1d4555a4c..728960c5d 100644
--- a/src/GZCTF/ClientApp/src/pages/admin/Teams.tsx
+++ b/src/GZCTF/ClientApp/src/pages/admin/Teams.tsx
@@ -162,7 +162,7 @@ const Teams: FC = () => {
       head={
         <>
           <TextInput
-            w="30%"
+            w="36%"
             leftSection={<Icon path={mdiMagnify} size={1} />}
             placeholder={t('admin.placeholder.teams.search')}
             value={hint}
diff --git a/src/GZCTF/ClientApp/src/pages/admin/Users.tsx b/src/GZCTF/ClientApp/src/pages/admin/Users.tsx
index 4ed62e302..dc53bd405 100644
--- a/src/GZCTF/ClientApp/src/pages/admin/Users.tsx
+++ b/src/GZCTF/ClientApp/src/pages/admin/Users.tsx
@@ -202,7 +202,7 @@ const Users: FC = () => {
       head={
         <>
           <TextInput
-            w="30%"
+            w="36%"
             leftSection={<Icon path={mdiMagnify} size={1} />}
             placeholder={t('admin.placeholder.users.search')}
             value={hint}
diff --git a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/CheatInfo.tsx b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/CheatInfo.tsx
index f744b1a97..46682c47b 100644
--- a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/CheatInfo.tsx
+++ b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/CheatInfo.tsx
@@ -305,8 +305,7 @@ interface CheatInfoTableViewProps {
 }
 
 const CheatInfoTableView: FC<CheatInfoTableViewProps> = (props) => {
-  const { classes: inputClasses, cx } = useDisplayInputStyles({ ff: 'monospace' })
-
+  const { classes: inputClasses } = useDisplayInputStyles({ ff: 'monospace' })
   const { t } = useTranslation()
 
   const rows = props.cheatInfo
@@ -343,8 +342,7 @@ const CheatInfoTableView: FC<CheatInfoTableViewProps> = (props) => {
         <Table.Td>{item.submission?.challenge ?? 'Challenge'}</Table.Td>
         <Table.Td
           style={{
-            width: '36vw',
-            maxWidth: '100%',
+            width: '24vw',
             padding: 0,
           }}
         >
@@ -377,7 +375,7 @@ const CheatInfoTableView: FC<CheatInfoTableViewProps> = (props) => {
                 {t('game.label.cheat_info.submit_user')}
               </Table.Th>
               <Table.Th style={{ minWidth: '3rem' }}>{t('common.label.challenge')}</Table.Th>
-              <Table.Th className={cx(classes.mono)}>{t('common.label.flag')}</Table.Th>
+              <Table.Th className={classes.mono}>{t('common.label.flag')}</Table.Th>
             </Table.Tr>
           </Table.Thead>
           <Table.Tbody>{rows}</Table.Tbody>
@@ -433,7 +431,7 @@ const CheatInfo: FC = () => {
   }
 
   return (
-    <WithGameMonitorTab>
+    <WithGameMonitorTab isLoading={!cheatInfo}>
       <Group justify="space-between" w="100%">
         <Switch
           label={SwitchLabel(
diff --git a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Events.tsx b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Events.tsx
index 5b20195fb..b7f810a39 100644
--- a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Events.tsx
+++ b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Events.tsx
@@ -209,7 +209,7 @@ const Events: FC = () => {
   )
 
   return (
-    <WithGameMonitorTab>
+    <WithGameMonitorTab isLoading={!events}>
       <Group justify="space-between" w="100%">
         <Switch
           label={SwitchLabel(
diff --git a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Submissions.tsx b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Submissions.tsx
index 68e09995b..d77f31445 100644
--- a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Submissions.tsx
+++ b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Submissions.tsx
@@ -220,7 +220,7 @@ const Submissions: FC = () => {
     )
 
   return (
-    <WithGameMonitorTab>
+    <WithGameMonitorTab isLoading={!submissions}>
       <Group justify="space-between" w="100%">
         <SegmentedControl
           color={theme.primaryColor}
diff --git a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Traffic.tsx b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Traffic.tsx
index 5a6f5fd27..f0881b5e3 100644
--- a/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Traffic.tsx
+++ b/src/GZCTF/ClientApp/src/pages/games/[id]/monitor/Traffic.tsx
@@ -142,7 +142,7 @@ const Traffic: FC = () => {
   teamTraffic?.sort((a, b) => (a.teamId ?? 0) - (b.teamId ?? 0))
 
   return (
-    <WithGameMonitorTab>
+    <WithGameMonitorTab isLoading={!challengeTraffic}>
       {!challengeTraffic || challengeTraffic?.length === 0 ? (
         <Center h="calc(100vh - 140px)">
           <Stack gap={0}>
diff --git a/src/GZCTF/ClientApp/src/styles/components/ChallengeCard.module.css b/src/GZCTF/ClientApp/src/styles/components/ChallengeCard.module.css
index 894057fe1..11504d5c3 100644
--- a/src/GZCTF/ClientApp/src/styles/components/ChallengeCard.module.css
+++ b/src/GZCTF/ClientApp/src/styles/components/ChallengeCard.module.css
@@ -25,12 +25,3 @@
     background: linear-gradient(0deg, #fff0, var(--blood-color), #fff0);
   }
 }
-
-.card {
-  transition: filter 0.1s;
-
-  &:hover {
-    cursor: pointer;
-    filter: light-dark(brightness(1.2), brightness(0.97));
-  }
-}
diff --git a/src/GZCTF/ClientApp/src/styles/components/IconTabs.module.css b/src/GZCTF/ClientApp/src/styles/components/IconTabs.module.css
index 9084b19c6..d230bc3f9 100644
--- a/src/GZCTF/ClientApp/src/styles/components/IconTabs.module.css
+++ b/src/GZCTF/ClientApp/src/styles/components/IconTabs.module.css
@@ -26,7 +26,7 @@
   }
 
   &:not(:disabled):hover {
-    background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
+    background-color: light-dark(var(--mantine-color-light-4), var(--mantine-color-dark-6));
   }
 
   &[data-active] {
@@ -35,6 +35,13 @@
       alpha(var(--mantine-color-dark-7), 0.5)
     );
     color: var(--tab-active-color, var(--mantine-primary-color-6));
+
+    &:hover {
+      background-color: light-dark(
+        var(--mantine-color-white),
+        alpha(var(--mantine-color-dark-7), 0.5)
+      );
+    }
   }
 }
 
@@ -76,7 +83,7 @@
 
 .panes {
   display: flex;
-  gap: 5pt;
+  gap: var(--mantine-spacing-xs);
   justify-content: right;
   flex-wrap: nowrap;
 
diff --git a/src/GZCTF/ClientApp/src/utils/ThemeOverride.ts b/src/GZCTF/ClientApp/src/utils/ThemeOverride.ts
index 5573e78bc..7f4e8c366 100644
--- a/src/GZCTF/ClientApp/src/utils/ThemeOverride.ts
+++ b/src/GZCTF/ClientApp/src/utils/ThemeOverride.ts
@@ -146,7 +146,7 @@ const CustomTheme: MantineThemeOverride = {
     Tabs: Tabs.extend({
       styles: {
         tab: {
-          padding: '0.5rem',
+          padding: 'var(--mantine-spacing-xs)',
           fontWeight: 500,
         },
       },