feat(admin): redesign sidebar chrome and tighten page header typography

- Sidebar header: brand (favicon + "Mx Space") left, avatar-only popover trigger right; theme + locale preferences moved inside the user popover and the persistent footer strip removed. Right-clicking the brand opens a product context menu (version + GitHub).
- Shell header height: APP_SHELL_HEADER_HEIGHT_CLASS h-16 -> h-14 (and matching 4rem -> 3.5rem CSS value).
- Page-header titles: unify h2 inside h-14 page headers to text-lg font-semibold across _shared/ContentListHeader and every feature route/detail pane.
- Topics: remove the inline icon prompt button from TopicDetail header; add an upload affordance next to the icon URL field in TopicFormModal that calls uploadFile(file, 'icon').

Author: Innei

apps/admin/src/constants/layout.ts

@@ -1,2 +1,2 @@
-export const APP_SHELL_HEADER_HEIGHT_CLASS = 'h-16'
-export const APP_SHELL_HEADER_HEIGHT_VALUE = '4rem'
+export const APP_SHELL_HEADER_HEIGHT_CLASS = 'h-14'
+export const APP_SHELL_HEADER_HEIGHT_VALUE = '3.5rem'

apps/admin/src/features/_shared/components/content-list-toolbar.tsx

@@ -63,7 +63,7 @@ export function ContentListHeader(props: {
           {props.icon}
         </span>
         <div className="flex min-w-0 items-baseline gap-2">
-          <h2 className="truncate text-sm font-medium text-neutral-950 dark:text-neutral-50">
+          <h2 className="truncate text-lg font-semibold text-neutral-950 dark:text-neutral-50">
             {props.title}
           </h2>
           {props.count != null ? (

apps/admin/src/features/ai/components/TaskDetail.tsx

@@ -82,7 +82,7 @@ export function TaskDetail(props: {
         />
         <div className="min-w-0 flex-1">
           <div className="flex min-w-0 items-center gap-2">
-            <h2 className="truncate text-sm font-medium text-neutral-950 dark:text-neutral-50">
+            <h2 className="truncate text-lg font-semibold text-neutral-950 dark:text-neutral-50">
               {t(taskTypeLabelKeys[task.type])}
             </h2>
             <StatusBadge status={effectiveStatus}>

apps/admin/src/features/backup/components/BackupDetail.tsx

@@ -47,7 +47,7 @@ export function BackupDetail(props: {
           >
             <ArrowLeft aria-hidden="true" className="size-4" />
           </button>
-          <h2 className="text-sm font-medium text-neutral-900 dark:text-neutral-100">
+          <h2 className="text-lg font-semibold text-neutral-900 dark:text-neutral-100">
             {t('backup.detail.title')}
           </h2>
         </div>

apps/admin/src/features/categories/components/CategoriesRouteViewContent.tsx

@@ -111,7 +111,7 @@ export function CategoriesRouteViewContent() {
             )}
           >
             <div className="min-w-0">
-              <h2 className="inline-flex items-center gap-2 text-sm font-medium">
+              <h2 className="inline-flex items-center gap-2 text-lg font-semibold">
                 <FolderOpen aria-hidden="true" className="size-4" />
                 {t('categories.list.title')}
               </h2>

apps/admin/src/features/categories/components/DetailHeader.tsx

@@ -24,7 +24,7 @@ export function DetailHeader(props: {
         >
           <ArrowLeft aria-hidden="true" className="size-4" />
         </button>
-        <h2 className="truncate text-sm font-medium text-neutral-950 dark:text-neutral-50">
+        <h2 className="truncate text-lg font-semibold text-neutral-950 dark:text-neutral-50">
           {props.title}
         </h2>
       </div>

apps/admin/src/features/comments/components/CommentDetail.tsx

@@ -138,7 +138,7 @@ export function CommentDetail(props: {
           >
             <ChevronRight aria-hidden="true" className="size-4 rotate-180" />
           </Button>
-          <h2 className="text-sm font-medium text-neutral-900 dark:text-neutral-100">
+          <h2 className="text-lg font-semibold text-neutral-900 dark:text-neutral-100">
             {t('comments.detail.title')}
           </h2>
         </div>

apps/admin/src/features/cron/components/DefinitionDetail.tsx

@@ -67,7 +67,7 @@ export function DefinitionDetail(props: {
             <ArrowLeft aria-hidden="true" className="size-4" />
           </button>
           <div className="min-w-0">
-            <h2 className="truncate text-base font-semibold text-neutral-950 dark:text-neutral-50">
+            <h2 className="truncate text-lg font-semibold text-neutral-950 dark:text-neutral-50">
               {label}
             </h2>
             <p className="mt-1 truncate text-xs text-neutral-500 dark:text-neutral-400">

apps/admin/src/features/cron/components/DefinitionsRouteViewContent.tsx

@@ -90,7 +90,7 @@ export function DefinitionsRouteViewContent() {
               APP_SHELL_HEADER_HEIGHT_CLASS,
             )}
           >
-            <h2 className="flex min-w-0 items-baseline gap-2 text-sm font-medium">
+            <h2 className="flex min-w-0 items-baseline gap-2 text-lg font-semibold">
               <span className="truncate">{t('cron.definitions.title')}</span>
               <span className="text-xs font-normal tabular-nums text-neutral-400 dark:text-neutral-500">
                 {definitions.length}

apps/admin/src/features/cron/components/HistoryRouteViewContent.tsx

@@ -170,7 +170,7 @@ export function HistoryRouteViewContent() {
               APP_SHELL_HEADER_HEIGHT_CLASS,
             )}
           >
-            <h2 className="flex min-w-0 items-baseline gap-2 text-sm font-medium">
+            <h2 className="flex min-w-0 items-baseline gap-2 text-lg font-semibold">
               <span className="truncate">{t('cron.history.title')}</span>
               <span className="text-xs font-normal tabular-nums text-neutral-400 dark:text-neutral-500">
                 {total}