v0.34.3

src/admin/web/style.css

@@ -12193,4 +12193,87 @@ html[data-dashboard-density] #panel-overview .dashboard-overview-grid>.card.pool
 
 .certificate-bulk-list .check {
     overflow-wrap: anywhere;
+}
+
+#panel-overview .stat-cache-outcomes .cache-mix-bar {
+    display: flex;
+    width: 100%;
+    height: 12px;
+    margin: 7px 0 9px;
+    border-radius: var(--rp-progress-radius);
+    background: var(--rp-progress-track);
+    overflow: hidden;
+}
+
+#panel-overview .cache-mix-bar>span {
+    display: block;
+    height: 100%;
+    min-width: 0;
+}
+
+#panel-overview .cache-mix-hit {
+    background: var(--chart-accent);
+}
+
+#panel-overview .cache-mix-miss {
+    background: var(--chart-secondary);
+}
+
+#panel-overview .cache-mix-bypass {
+    background: var(--chart-tertiary);
+}
+
+#panel-overview .cache-mix-other {
+    background: var(--muted);
+    opacity: 0.65;
+}
+
+#panel-overview .cache-mix-legend {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 5px 8px;
+    line-height: 1.25;
+}
+
+#panel-overview .cache-mix-legend>span {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    min-width: 0;
+}
+
+#panel-overview .cache-mix-legend i {
+    display: inline-block;
+    flex: 0 0 7px;
+    width: 7px;
+    height: 7px;
+    border-radius: 2px;
+}
+
+#panel-overview .cache-mix-hit-key i {
+    background: var(--chart-accent);
+}
+
+#panel-overview .cache-mix-miss-key i {
+    background: var(--chart-secondary);
+}
+
+#panel-overview .cache-mix-bypass-key i {
+    background: var(--chart-tertiary);
+}
+
+#panel-overview .cache-mix-other-key i {
+    background: var(--muted);
+}
+
+#panel-overview .cache-mix-legend b {
+    margin-left: auto;
+    color: var(--text);
+    font: 500 10px var(--mono);
+}
+
+#panel-overview .stat-cache-outcomes .cache-mix-caption {
+    display: block;
+    margin-top: 8px;
+    color: var(--muted);
 }