diff --git a/app/(main)/footer.tsx b/app/(main)/footer.tsx
index a09a84e..5a0ba55 100644
--- a/app/(main)/footer.tsx
+++ b/app/(main)/footer.tsx
@@ -1,7 +1,7 @@
 import pack from "@/package.json";
 import { useTranslations } from "next-intl";
 
-export const experimental_ppr = true
+export const experimental_ppr = true;
 
 export default function Footer() {
   const t = useTranslations("Footer");
diff --git a/app/(main)/header.tsx b/app/(main)/header.tsx
index 6caca55..b23f7ae 100644
--- a/app/(main)/header.tsx
+++ b/app/(main)/header.tsx
@@ -11,7 +11,7 @@ import Image from "next/image";
 import { useRouter } from "next/navigation";
 import React, { useEffect, useRef, useState } from "react";
 
-export const experimental_ppr = true
+export const experimental_ppr = true;
 
 function Header() {
   const t = useTranslations("Header");
@@ -105,7 +105,7 @@ function Links() {
 
 // https://github.com/streamich/react-use/blob/master/src/useInterval.ts
 const useInterval = (callback: () => void, delay: number | null) => {
-  const savedCallback = useRef<() => void>(() => { });
+  const savedCallback = useRef<() => void>(() => {});
   useEffect(() => {
     savedCallback.current = callback;
   });
diff --git a/app/(main)/page.tsx b/app/(main)/page.tsx
index b632f9b..2b271a3 100644
--- a/app/(main)/page.tsx
+++ b/app/(main)/page.tsx
@@ -1,7 +1,7 @@
 import ServerList from "@/components/ServerList";
 import ServerOverview from "@/components/ServerOverview";
 
-export const experimental_ppr = true
+export const experimental_ppr = true;
 export default function Home() {
   return (
     <div className="mx-auto grid w-full max-w-5xl gap-4 md:gap-6">
diff --git a/bun.lockb b/bun.lockb
index 4ea6ab6..6363e59 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/components/ServerCard.tsx b/components/ServerCard.tsx
index c90d44c..5ad964b 100644
--- a/components/ServerCard.tsx
+++ b/components/ServerCard.tsx
@@ -4,10 +4,11 @@ import ServerUsageBar from "@/components/ServerUsageBar";
 import { Badge } from "@/components/ui/badge";
 import { Card } from "@/components/ui/card";
 import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "@/components/ui/popover";
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
 import getEnv from "@/lib/env-entry";
 import { cn, formatBytes, formatNezhaInfo } from "@/lib/utils";
 import { useTranslations } from "next-intl";
@@ -36,7 +37,7 @@ export default function ServerCard({
         }
       >
         <section
-          className="grid items-center gap-2 lg:w-28 "
+          className="grid items-center gap-2 lg:w-28"
           style={{ gridTemplateColumns: "auto auto 1fr" }}
         >
           <span className="h-2 w-2 shrink-0 rounded-full bg-green-500 self-center"></span>
@@ -48,17 +49,30 @@ export default function ServerCard({
           >
             {showFlag ? <ServerFlag country_code={country_code} /> : null}
           </div>
-          <p
-            className={cn(
-              "break-all font-bold tracking-tight",
-              showFlag ? "text-xs" : "text-sm",
-            )}
-          >
-            {name}
-          </p>
+
+          <TooltipProvider delayDuration={50}>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <div className="relative">
+                  <p
+                    className={cn(
+                      "break-all font-bold tracking-tight text-nowrap lg:max-w-[80px] overflow-x-scroll scrollbar-hidden pr-4",
+                      showFlag ? "text-[11px]" : "text-sm",
+                    )}
+                  >
+                    {name}
+                  </p>
+                  <div className="absolute inset-y-0 right-0 w-4 bg-gradient-to-l from-background to-transparent pointer-events-none" />
+                </div>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p className="text-xs text-muted-foreground">{name}</p>
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
         </section>
         <div className="flex flex-col gap-2">
-          <section className={"grid  grid-cols-5 items-center gap-3"}>
+          <section className={"grid grid-cols-5 items-center gap-3"}>
             <div className={"flex w-14 flex-col"}>
               <p className="text-xs text-muted-foreground">{t("CPU")}</p>
               <div className="flex items-center text-xs font-semibold">
@@ -130,35 +144,40 @@ export default function ServerCard({
           : "lg:min-h-[61px] min-h-[93px]",
       )}
     >
-      <Popover>
-        <PopoverTrigger asChild>
-          <section
-            className="grid items-center gap-2 lg:w-28"
-            style={{ gridTemplateColumns: "auto auto 1fr" }}
-          >
-            <span className="h-2 w-2 shrink-0 rounded-full bg-red-500 self-center"></span>
-            <div
-              className={cn(
-                "flex items-center justify-center",
-                showFlag ? "min-w-[17px]" : "min-w-0",
-              )}
-            >
-              {showFlag ? <ServerFlag country_code={country_code} /> : null}
-            </div>
-            <p
-              className={cn(
-                "break-all font-bold tracking-tight",
-                showFlag ? "text-xs" : "text-sm",
-              )}
-            >
-              {name}
-            </p>
-          </section>
-        </PopoverTrigger>
-        <PopoverContent className="w-fit p-2" side="top">
-          <p className="text-sm text-muted-foreground">{t("Offline")}</p>
-        </PopoverContent>
-      </Popover>
+      <section
+        className="grid items-center gap-2 lg:w-28"
+        style={{ gridTemplateColumns: "auto auto 1fr" }}
+      >
+        <span className="h-2 w-2 shrink-0 rounded-full bg-red-500 self-center"></span>
+        <div
+          className={cn(
+            "flex items-center justify-center",
+            showFlag ? "min-w-[17px]" : "min-w-0",
+          )}
+        >
+          {showFlag ? <ServerFlag country_code={country_code} /> : null}
+        </div>
+        <TooltipProvider delayDuration={50}>
+          <Tooltip>
+            <TooltipTrigger asChild>
+              <div className="relative">
+                <p
+                  className={cn(
+                    "break-all font-bold tracking-tight text-nowrap overflow-x-scroll scrollbar-hidden pr-4",
+                    showFlag ? "text-xs max-w-[80px]" : "text-sm",
+                  )}
+                >
+                  {name}
+                </p>
+                <div className="absolute inset-y-0 right-0 w-4 bg-gradient-to-l from-background to-transparent pointer-events-none" />
+              </div>
+            </TooltipTrigger>
+            <TooltipContent>
+              <p className="text-xs text-muted-foreground">{name}</p>
+            </TooltipContent>
+          </Tooltip>
+        </TooltipProvider>
+      </section>
     </Card>
   );
 }
diff --git a/components/ui/tooltip.tsx b/components/ui/tooltip.tsx
index 2d0ad74..219d4ff 100644
--- a/components/ui/tooltip.tsx
+++ b/components/ui/tooltip.tsx
@@ -18,7 +18,7 @@ const TooltipContent = React.forwardRef<
     ref={ref}
     sideOffset={sideOffset}
     className={cn(
-      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-50 overflow-hidden rounded-[10px] border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       className,
     )}
     {...props}
diff --git a/next.config.mjs b/next.config.mjs
index c20f14b..5062cd1 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -23,7 +23,7 @@ const withPWA = withPWAInit({
 const nextConfig = {
   output: "standalone",
   experimental: {
-    ppr: 'incremental',
+    ppr: "incremental",
   },
   reactStrictMode: true,
   logging: {
diff --git a/package.json b/package.json
index 498dd27..3f8b02d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nezha-dash",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3020",
@@ -32,7 +32,7 @@
     "framer-motion": "^12.0.0-alpha.1",
     "lucide-react": "^0.451.0",
     "luxon": "^3.5.0",
-    "next": "^15.0.3-canary.3",
+    "next": "^15.0.3-canary.4",
     "next-auth": "^5.0.0-beta.25",
     "next-intl": "^3.24.0",
     "next-runtime-env": "^3.2.2",
@@ -57,7 +57,7 @@
     "@types/react": "npm:types-react@19.0.0-rc.1",
     "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
     "autoprefixer": "^10.4.20",
-    "eslint": "^9.13.0",
+    "eslint": "^9.14.0",
     "eslint-config-next": "15.0.2",
     "postcss": "^8.4.47",
     "prettier": "^3.3.3",