From 0040bfd7e9a19535bb114005539eab4d48dc7ed9 Mon Sep 17 00:00:00 2001
From: infosave2007 <urevich55@gmail.com>
Date: Sat, 8 Aug 2026 09:53:25 +0300
Subject: [PATCH] fix(routing): the high zone is unmistakably red
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

At 35% opacity over the dark background the amber medium zone and the
light-red high zone read as the same color right of the medium handle.
Saturation stepped up per zone (45/55/65%) and high uses a deeper red —
green / amber / red now read at a glance.
---
 web/css/styles.css | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/css/styles.css b/web/css/styles.css
index c6ae455..2913cd1 100644
--- a/web/css/styles.css
+++ b/web/css/styles.css
@@ -602,9 +602,9 @@ body.modal-open { overflow: hidden; }
 .bands-track { position: relative; height: 14px; border-radius: 8px; background: var(--panel-2, #23252c); margin: 26px 8px 10px; }
 .bands-track.disabled { opacity: .45; pointer-events: none; }
 .bands-zone { position: absolute; top: 0; bottom: 0; }
-.bands-zone.z-low { left: 0; background: color-mix(in srgb, var(--good) 35%, transparent); border-radius: 8px 0 0 8px; }
-.bands-zone.z-med { background: color-mix(in srgb, var(--warn, #d9a514) 35%, transparent); }
-.bands-zone.z-high { background: color-mix(in srgb, var(--bad, #e5484d) 35%, transparent); border-radius: 0 8px 8px 0; }
+.bands-zone.z-low { left: 0; background: color-mix(in srgb, var(--good) 45%, transparent); border-radius: 8px 0 0 8px; }
+.bands-zone.z-med { background: color-mix(in srgb, var(--warn, #f59e0b) 55%, transparent); }
+.bands-zone.z-high { background: color-mix(in srgb, #dc2626 65%, transparent); border-radius: 0 8px 8px 0; }
 .bands-handle { position: absolute; top: -5px; width: 24px; height: 24px; margin-left: -12px; border-radius: 50%;
   background: var(--fg, #fff); border: 3px solid var(--accent, #6c6cf5); cursor: grab; touch-action: none; z-index: 2; }
 .bands-handle:active { cursor: grabbing; }