Upravil jsem:

responzivitu layoutu, menu, karet, filtrů, tlačítek, tabulek a log panelů v styles.css
tabulky se na menších šířkách horizontálně posouvají místo rozbíjení layoutu
menu má teď přímé položky Přehled, Služby a rozbalovací skupiny Provoz, Správa
stránkování se vůbec nezobrazuje, pokud existuje jen jedna stránka
Předchozí / Další se nezobrazují, když daný směr není dostupný
odstranil jsem staré neaktivní disabled pagination odkazy

app/static/styles.css

@@ -44,6 +44,13 @@ header {
     box-shadow: 0 10px 26px rgba(30, 81, 107, 0.16);
 }
 
+nav {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-wrap: wrap;
+}
+
 .brand {
     display: inline-flex;
     align-items: center;
@@ -70,18 +77,53 @@ header {
 nav a {
     color: white;
     text-decoration: none;
-    margin-left: 8px;
     font-weight: 600;
     padding: 9px 12px;
     border-radius: 8px;
 }
 
-.nav-group {
-    color: rgba(255, 255, 255, 0.62);
-    margin-left: 14px;
-    font-size: 11px;
-    font-weight: 800;
-    text-transform: uppercase;
+nav a:hover,
+.nav-menu-button:hover,
+.nav-menu:focus-within .nav-menu-button,
+.nav-menu:hover .nav-menu-button {
+    background: rgba(255, 255, 255, 0.12);
+    text-decoration: none;
+}
+
+.nav-menu {
+    position: relative;
+}
+
+.nav-menu-button {
+    background: transparent;
+    color: white;
+    padding: 9px 12px;
+    min-height: 0;
+}
+
+.nav-menu-panel {
+    display: none;
+    position: absolute;
+    top: calc(100% + 6px);
+    left: 0;
+    z-index: 20;
+    min-width: 180px;
+    background: var(--secondary-dark);
+    border: 1px solid rgba(255, 255, 255, 0.14);
+    border-radius: 8px;
+    padding: 6px;
+    box-shadow: 0 12px 28px rgba(10, 31, 42, 0.28);
+}
+
+.nav-menu:hover .nav-menu-panel,
+.nav-menu:focus-within .nav-menu-panel {
+    display: block;
+}
+
+.nav-menu-panel a {
+    display: block;
+    margin: 0;
+    white-space: nowrap;
 }
 
 .user-menu {
@@ -134,6 +176,7 @@ main {
     padding: 22px;
     box-shadow: 0 8px 24px rgba(30, 81, 107, 0.07);
     margin-bottom: 24px;
+    overflow-x: auto;
 }
 
 .card h2 {
@@ -211,6 +254,7 @@ main {
 table {
     border-collapse: collapse;
     width: 100%;
+    min-width: 760px;
     margin-top: 12px;
 }
 
@@ -260,6 +304,18 @@ button:hover,
     text-decoration: none;
 }
 
+.nav-menu-button,
+.nav-menu-button:hover {
+    background: transparent;
+    color: white;
+    width: auto;
+}
+
+.nav-menu:hover .nav-menu-button,
+.nav-menu:focus-within .nav-menu-button {
+    background: rgba(255, 255, 255, 0.12);
+}
+
 .btn + .btn {
     margin-left: 8px;
 }
@@ -476,3 +532,102 @@ pre {
     color: var(--secondary);
     white-space: nowrap;
 }
+
+@media (max-width: 980px) {
+    header {
+        align-items: flex-start;
+        flex-direction: column;
+        padding: 14px 18px;
+    }
+
+    .brand img {
+        width: 120px;
+    }
+
+    nav {
+        width: 100%;
+    }
+
+    .nav-menu-panel {
+        position: static;
+        width: 100%;
+        margin-top: 4px;
+        box-shadow: none;
+    }
+
+    .user-menu {
+        width: 100%;
+        justify-content: flex-start;
+        flex-wrap: wrap;
+    }
+
+    main {
+        padding: 18px;
+    }
+}
+
+@media (max-width: 640px) {
+    .brand {
+        align-items: flex-start;
+        flex-direction: column;
+        gap: 8px;
+        font-size: 16px;
+    }
+
+    nav a,
+    .nav-menu,
+    .nav-menu-button {
+        width: 100%;
+    }
+
+    .nav-menu-button,
+    nav a {
+        text-align: left;
+    }
+
+    .stats-grid,
+    .grid {
+        grid-template-columns: 1fr;
+    }
+
+    .card {
+        padding: 16px;
+    }
+
+    .filter-form,
+    .inline-form {
+        align-items: stretch;
+        flex-direction: column;
+    }
+
+    input,
+    select,
+    button,
+    .btn {
+        width: 100%;
+    }
+
+    .btn + .btn {
+        margin-left: 0;
+        margin-top: 8px;
+    }
+
+    .cmd-row,
+    .copy-row {
+        grid-template-columns: 1fr;
+    }
+
+    .copy-button,
+    .actions-cell button {
+        width: 100%;
+    }
+
+    .pagination {
+        align-items: flex-start;
+        flex-direction: column;
+    }
+
+    .pagination-actions {
+        width: 100%;
+    }
+}