v0.25.1

src/admin/web/style.css

@@ -4637,6 +4637,68 @@ dialog .window-heading {
     flex: 0 0 auto
 }
 
+#panel-traffic .traffic-tabs {
+    margin: 12px 0 14px
+}
+
+#panel-traffic [data-traffic-page] {
+    min-width: 0
+}
+
+.traffic-wide-chart {
+    grid-column: span 2
+}
+
+.traffic-bar-chart {
+    display: grid;
+    gap: 8px;
+    min-width: 0
+}
+
+.traffic-bar-row {
+    display: grid;
+    grid-template-columns: minmax(120px, 1.5fr) minmax(120px, 3fr) minmax(72px, auto);
+    gap: 10px;
+    align-items: center;
+    min-width: 0
+}
+
+.traffic-bar-label {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font: 11px var(--mono)
+}
+
+.traffic-bar-track {
+    height: 10px;
+    border-radius: 999px;
+    background: var(--panel2);
+    box-shadow: inset 0 0 0 1px var(--line);
+    overflow: hidden
+}
+
+.traffic-bar-fill {
+    display: block;
+    height: 100%;
+    min-width: 2px;
+    border-radius: inherit;
+    background: var(--accent)
+}
+
+.traffic-bar-value {
+    text-align: right;
+    font: 700 10px var(--mono)
+}
+
+@media(max-width:1100px) {
+    .traffic-wide-chart { grid-column: span 1 }
+}
+
+@media(max-width:650px) {
+    .traffic-bar-row { grid-template-columns: minmax(88px, 1.2fr) minmax(90px, 2fr) minmax(60px, auto); gap: 7px }
+}
+
 .logging-grid label {
     min-width: 0
 }