feat: polish app loading screen and home section emphasis

Refine the global loading experience to feel smoother and less flashy while keeping brand accents. Simplify the home continue-reading highlight by styling the section header instead of using a heavy card wrapper.

src/components/home/HomeContent.tsx

@@ -31,13 +31,12 @@ export function HomeContent({ data }: HomeContentProps) {
   return (
     <div className="space-y-10 pb-2">
       {data.ongoingBooks && data.ongoingBooks.length > 0 && (
-        <div className="rounded-2xl border border-primary/20 bg-[linear-gradient(145deg,hsl(var(--primary)/0.12),hsl(var(--background)/0.1)_45%)] p-4 sm:p-5">
-          <MediaRow
-            titleKey="home.sections.continue_reading"
-            items={optimizeBookData(data.ongoingBooks)}
-            iconName="BookOpen"
-          />
-        </div>
+        <MediaRow
+          titleKey="home.sections.continue_reading"
+          items={optimizeBookData(data.ongoingBooks)}
+          iconName="BookOpen"
+          featuredHeader
+        />
       )}
 
       {data.ongoing && data.ongoing.length > 0 && (

src/components/home/MediaRow.tsx

@@ -41,6 +41,7 @@ interface MediaRowProps {
   titleKey: string;
   items: (OptimizedSeries | OptimizedBook)[];
   iconName?: string;
+  featuredHeader?: boolean;
 }
 
 const iconMap = {
@@ -51,7 +52,7 @@ const iconMap = {
   History,
 };
 
-export function MediaRow({ titleKey, items, iconName }: MediaRowProps) {
+export function MediaRow({ titleKey, items, iconName, featuredHeader = false }: MediaRowProps) {
   const router = useRouter();
   const { t } = useTranslate();
   const icon = iconName ? iconMap[iconName as keyof typeof iconMap] : undefined;
@@ -68,7 +69,13 @@ export function MediaRow({ titleKey, items, iconName }: MediaRowProps) {
       title={t(titleKey)}
       icon={icon}
       className="space-y-5"
-      headerClassName="border-b border-border/50 pb-2"
+      headerClassName={cn("border-b border-border/50 pb-2", featuredHeader && "border-primary/25")}
+      titleClassName={
+        featuredHeader
+          ? "bg-gradient-to-r from-primary via-cyan-500 to-fuchsia-500 bg-clip-text text-transparent"
+          : undefined
+      }
+      iconClassName={featuredHeader ? "text-primary" : undefined}
     >
       <ScrollContainer
         showArrows={true}