refactor(admin): use CSS custom properties for bar chart heights

Refactors the admin dashboard bar charts to use CSS custom properties (`--bar-height`) instead of fragile inline `height` styles.

Changes include:
- Updating the HTML templates to pass the height as a CSS variable.
- Converting the `.bar-chart` layout from Flexbox to CSS Grid for more consistent column distribution.
- Using absolute positioning for `.bar-chart-bar` inside `.bar-chart-track`.
- Adding a Go test to verify that the dashboard renders the CSS variable and no longer uses inline height styles.

backend/static/css/50-admin.css

@@ -196,53 +196,67 @@
 }
 
 .bar-chart {
-  display: flex;
+  display: grid;
+  grid-template-columns: repeat(14, minmax(0, 1fr));
   align-items: stretch;
   gap: 0.4rem;
-  height: 180px;
+  min-height: 15rem;
   margin-top: 1.25rem;
   padding-top: 0.5rem;
 }
 
 .bar-chart-col {
-  display: grid;
-  grid-template-rows: auto minmax(0, 1fr) auto;
-  flex: 1;
+  display: flex;
+  flex-direction: column;
   min-width: 0;
-  align-items: center;
+  align-items: stretch;
   gap: 0.35rem;
-  height: 100%;
 }
 
 .bar-chart-track {
+  position: relative;
+  flex: 1 1 auto;
   width: 100%;
-  max-width: 2.2rem;
-  min-height: 0;
-  height: 100%;
-  display: flex;
-  align-items: flex-end;
-  justify-content: center;
-  align-self: stretch;
+  max-width: 1.8rem;
+  min-height: 9rem;
+  margin: 0 auto;
+  border-bottom: 2px solid color-mix(in srgb, var(--primary, #8b5cf6) 75%, transparent);
+  border-radius: 0.45rem 0.45rem 0 0;
+  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--border) 55%, transparent));
+  overflow: hidden;
 }
 
 .bar-chart-bar {
   display: block;
-  flex: 0 0 auto;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
   width: 100%;
-  min-height: 0;
+  height: var(--bar-height, 0%);
   border-radius: 6px 6px 0 0;
-  background: linear-gradient(180deg, var(--primary, #8b5cf6), color-mix(in srgb, var(--primary, #8b5cf6) 55%, transparent));
+  background: linear-gradient(180deg, var(--primary-hover, #7c3aed), var(--primary, #8b5cf6));
+  box-shadow: 0 0 18px color-mix(in srgb, var(--primary, #8b5cf6) 35%, transparent);
 }
 
 .bar-chart-value {
+  min-height: 1rem;
+  overflow: hidden;
   color: var(--foreground);
   font-size: 0.72rem;
   font-weight: 650;
+  line-height: 1;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .bar-chart-label {
+  overflow: hidden;
   color: var(--muted-foreground);
   font-size: 0.66rem;
+  text-align: center;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }