3.0.2.4

Move  At A Glance panel left. Tweak day tabs highlight and add danger level pulsing. Arrange at a glance order to make more sense and better priority. New brighter favicon.

assets/css/table.css

@@ -104,16 +104,30 @@
 }
 
 .utci-day-tab:hover:not(.active):not(.locked) {
-  filter: brightness(1.14) !important;
+  filter: brightness(1.05) !important;
 }
 
 .utci-day-tab.active {
   color: #c8922a;
-  outline: 3px solid #c8922a;
-  outline-offset: -2px;
+  outline: 1px solid #000;
+  outline-offset: -1px;
   z-index: 1;
 }
 
+/* Danger-band days breathe a slow dark-red inner glow */
+.utci-day-tab.danger {
+  animation: dayTabDangerPulse 2.4s ease-in-out infinite;
+}
+
+@keyframes dayTabDangerPulse {
+  0%, 100% { box-shadow: inset 0 0 0 0 rgba(136, 0, 0, 0); }
+  50%      { box-shadow: inset 0 0 34px 8px rgba(136, 0, 0, 0.6); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .utci-day-tab.danger { animation: none; }
+}
+
 /* The "Mon 12 May" date underneath each tab name */
 .utci-day-date {
   font-family: Fraunces, serif;

assets/css/ui.css

@@ -1698,6 +1698,13 @@
    beneath its label instead of letting long values overflow sideways.
    Mobile keeps the inline label/value layout (plenty of width there). */
 @media (min-width: 901px) {
+  /* Glance rail on the left, hourly table on the right */
+  .table-with-rail {
+    grid-template-columns: auto minmax(0, 1fr);
+  }
+  .glance-rail { grid-column: 1; grid-row: 1; }
+  .table-main  { grid-column: 2; grid-row: 1; }
+
   .insight-panel--glance .insight-row {
     display: grid;
     grid-template-columns: 20px 1fr;