refactor(z-index): name the stacking layers as a token scale

Replace ~48 magic z-index values (z-10..z-[9999] + 2 inline zIndex) with named
tailwind zIndex tokens (base/menu/chrome/paneltab/panel/rail/overlay/popover/
tooltip/tuner). Values are UNCHANGED — a rename, not a renumber — so layering is
identical; the names give one source of truth for the stack.

frontend/src/components/NavSidebar.tsx

@@ -278,7 +278,7 @@ export default function NavSidebar({
         // margin, and a hover zone out there would fire from the dead space next to the rail —
         // leaving the side panel to the left would pop the rail open with nothing under the cursor.
         {...peek.handlers}
-        className={`glass absolute top-0 bottom-0 left-0 z-40 rounded-2xl flex flex-col py-3 m-3 transition-[width] ${
+        className={`glass absolute top-0 bottom-0 left-0 z-rail rounded-2xl flex flex-col py-3 m-3 transition-[width] ${
           slim ? "w-[56px] px-2" : "w-52 px-3"
         }`}
         aria-label={t("nav.primary")}
@@ -390,7 +390,7 @@ export default function NavSidebar({
               <div
                 ref={acctPanelRef}
                 style={{ position: "fixed", left: acctPos.left, bottom: acctPos.bottom }}
-                className="glass w-60 rounded-xl p-3 z-50 animate-[popIn_0.16s_ease]"
+                className="glass w-60 rounded-xl p-3 z-overlay animate-[popIn_0.16s_ease]"
               >
                 <div className="flex items-center gap-3 pb-3 border-b border-border">
                   <AvatarImg