feat(mui): consistent staggered page entrance across all 43 route pages

Adopt the PageEnter wrapper as every page's outermost render element and remove the ad-hoc per-page entrance motion.div wrappers. Every page now enters the same way — all top-level sections rise+fade in, staggered — so nothing appears instantly and the motion is identical app-wide. Presentation-only: no data/logic/hooks/invalidate/permissions touched. Embedded sub-tabs (CompanySettings, ReceivedInvoices), Login (auth shell) and the dev UiKit are intentionally excluded. Gates: tsc -b --noEmit=0, build=0, vitest 152/152.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/admin/pages/PlanWork.tsx

@@ -15,7 +15,7 @@ import PlanGrid from "../components/PlanGrid";
 import PlanCellModal from "../components/PlanCellModal";
 import PlanCategoriesModal from "../components/PlanCategoriesModal";
 import Forbidden from "../components/Forbidden";
-import { Button, Alert, LoadingState } from "../ui";
+import { Button, Alert, LoadingState, PageEnter } from "../ui";
 import { projectListOptions, type Project } from "../lib/queries/projects";
 import { planCategoriesOptions, type PlanCategory } from "../lib/queries/plan";
 // plan.css is imported once globally in AdminApp.tsx — no per-page re-import.
@@ -545,130 +545,107 @@ export default function PlanWork() {
   }
 
   return (
-    <Box className="plan-work-page">
-      <motion.div
-        initial={{ opacity: 0, y: 12 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ duration: 0.25 }}
-      >
-        <Typography variant="h4" sx={{ fontWeight: 700, mb: 2 }}>
-          Plán prací
-        </Typography>
-      </motion.div>
+    <PageEnter sx={{ position: "relative" }}>
+      <Typography variant="h4" sx={{ fontWeight: 700, mb: 2 }}>
+        Plán prací
+      </Typography>
 
       {!canEdit && (
-        <motion.div
-          role="status"
-          initial={{ opacity: 0, y: 12 }}
-          animate={{ opacity: 1, y: 0 }}
-          transition={{ duration: 0.25, delay: 0.06 }}
-        >
-          <Box sx={{ mb: 2 }}>
-            <Alert severity="info">
-              <strong>Režim náhledu</strong> — můžete pouze prohlížet plán.
-              Úpravy jsou dostupné oprávněným uživatelům.
-            </Alert>
-          </Box>
-        </motion.div>
+        <Box role="status" sx={{ mb: 2 }}>
+          <Alert severity="info">
+            <strong>Režim náhledu</strong> — můžete pouze prohlížet plán. Úpravy
+            jsou dostupné oprávněným uživatelům.
+          </Alert>
+        </Box>
       )}
 
-      <motion.div
-        initial={{ opacity: 0, y: 12 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ duration: 0.25, delay: 0.12 }}
+      <Box
+        sx={{
+          display: "flex",
+          flexWrap: "wrap",
+          alignItems: "center",
+          gap: 1.5,
+          mb: 2,
+        }}
       >
+        {/* Nav buttons grouped so they stay on one row when the toolbar
+              wraps on mobile. */}
+        <Box sx={{ display: "inline-flex", gap: 1 }}>
+          <Button variant="outlined" color="inherit" onClick={goToToday}>
+            Dnes
+          </Button>
+          <Button
+            variant="outlined"
+            color="inherit"
+            onClick={goPrev}
+            aria-label="Předchozí"
+          >
+            ←
+          </Button>
+          <Button
+            variant="outlined"
+            color="inherit"
+            onClick={goNext}
+            aria-label="Další"
+          >
+            →
+          </Button>
+        </Box>
         <Box
           sx={{
+            flex: 1,
+            minWidth: 220,
             display: "flex",
-            flexWrap: "wrap",
-            alignItems: "center",
-            gap: 1.5,
-            mb: 2,
+            justifyContent: "center",
           }}
         >
-          {/* Nav buttons grouped so they stay on one row when the toolbar
-              wraps on mobile. */}
-          <Box sx={{ display: "inline-flex", gap: 1 }}>
-            <Button variant="outlined" color="inherit" onClick={goToToday}>
-              Dnes
-            </Button>
-            <Button
-              variant="outlined"
-              color="inherit"
-              onClick={goPrev}
-              aria-label="Předchozí"
+          <AnimatePresence mode="popLayout" initial={false}>
+            <motion.div
+              key={`${isoDate(range.from)}-${view}`}
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              exit={{ opacity: 0 }}
+              transition={{ duration: 0.15 }}
             >
-              ←
-            </Button>
-            <Button
-              variant="outlined"
-              color="inherit"
-              onClick={goNext}
-              aria-label="Další"
-            >
-              →
-            </Button>
-          </Box>
-          <Box
-            sx={{
-              flex: 1,
-              minWidth: 220,
-              display: "flex",
-              justifyContent: "center",
-            }}
-          >
-            <AnimatePresence mode="popLayout" initial={false}>
-              <motion.div
-                key={`${isoDate(range.from)}-${view}`}
-                initial={{ opacity: 0 }}
-                animate={{ opacity: 1 }}
-                exit={{ opacity: 0 }}
-                transition={{ duration: 0.15 }}
+              <Typography
+                variant="h6"
+                sx={{ fontWeight: 600, whiteSpace: "nowrap" }}
               >
-                <Typography
-                  variant="h6"
-                  sx={{ fontWeight: 600, whiteSpace: "nowrap" }}
-                >
-                  {formatRangeLabel(
-                    isoDate(range.from),
-                    isoDate(range.to),
-                    view,
-                  )}
-                </Typography>
-              </motion.div>
-            </AnimatePresence>
-          </Box>
-          <Box
-            role="group"
-            aria-label="Měřítko zobrazení"
-            sx={{ display: "inline-flex", gap: 1 }}
-          >
-            <Button
-              variant={view === "week" ? "contained" : "outlined"}
-              color={view === "week" ? "primary" : "inherit"}
-              onClick={() => setViewWithAnim("week")}
-            >
-              Týden
-            </Button>
-            <Button
-              variant={view === "month" ? "contained" : "outlined"}
-              color={view === "month" ? "primary" : "inherit"}
-              onClick={() => setViewWithAnim("month")}
-            >
-              Měsíc
-            </Button>
-          </Box>
-          {canEdit && (
-            <Button
-              variant="outlined"
-              color="inherit"
-              onClick={() => setCatModalOpen(true)}
-            >
-              Správa kategorií
-            </Button>
-          )}
+                {formatRangeLabel(isoDate(range.from), isoDate(range.to), view)}
+              </Typography>
+            </motion.div>
+          </AnimatePresence>
         </Box>
-      </motion.div>
+        <Box
+          role="group"
+          aria-label="Měřítko zobrazení"
+          sx={{ display: "inline-flex", gap: 1 }}
+        >
+          <Button
+            variant={view === "week" ? "contained" : "outlined"}
+            color={view === "week" ? "primary" : "inherit"}
+            onClick={() => setViewWithAnim("week")}
+          >
+            Týden
+          </Button>
+          <Button
+            variant={view === "month" ? "contained" : "outlined"}
+            color={view === "month" ? "primary" : "inherit"}
+            onClick={() => setViewWithAnim("month")}
+          >
+            Měsíc
+          </Button>
+        </Box>
+        {canEdit && (
+          <Button
+            variant="outlined"
+            color="inherit"
+            onClick={() => setCatModalOpen(true)}
+          >
+            Správa kategorií
+          </Button>
+        )}
+      </Box>
 
       {gridLoading && <LoadingState />}
 
@@ -689,20 +666,14 @@ export default function PlanWork() {
         patch the cache in place and pulse a single cell via pulseKey.
       */}
       {grid ? (
-        <motion.div
-          initial={{ opacity: 0, y: 12 }}
-          animate={{ opacity: 1, y: 0 }}
-          transition={{ duration: 0.25, ease: "easeOut", delay: 0.18 }}
-        >
-          <PlanGrid
-            data={grid}
-            projects={projects}
-            categories={categories}
-            canEdit={canEdit}
-            pulseKey={lastMutated}
-            onCellClick={openCell}
-          />
-        </motion.div>
+        <PlanGrid
+          data={grid}
+          projects={projects}
+          categories={categories}
+          canEdit={canEdit}
+          pulseKey={lastMutated}
+          onCellClick={openCell}
+        />
       ) : null}
 
       <PlanCellModal
@@ -726,6 +697,6 @@ export default function PlanWork() {
         onClose={() => setCatModalOpen(false)}
         categories={categories}
       />
-    </Box>
+    </PageEnter>
   );
 }