diff --git a/src/dispatch/static/dispatch/index.html b/src/dispatch/static/dispatch/index.html
index fb16c5195943..23cbde0f95aa 100755
--- a/src/dispatch/static/dispatch/index.html
+++ b/src/dispatch/static/dispatch/index.html
@@ -4,6 +4,17 @@
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <!--
+      Vuetify 4 puts every style in a cascade layer, and the browser ranks layers
+      by first appearance. Vite links the split CSS chunks (VApp-*.css, VContainer-*.css)
+      before index-*.css, and those open @layer vuetify-components first, which puts
+      vuetify-core above it: the `* { padding: 0 }` reset in vuetify-md2-compat.css
+      then beats every component rule, and v-main loses its app-bar and drawer offsets.
+      Declaring the order here, before any stylesheet, pins it to the one Vuetify documents.
+    -->
+    <style>
+      @layer vuetify-core, vuetify-components, vuetify-overrides, vuetify-utilities, vuetify-final;
+    </style>
     <title>Dispatch</title>
     <link
       href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700"