diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index f65167e..a31b2e8 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -152,11 +152,9 @@ header {
 .dr-wd { text-align: center; font-size: 11px; color: var(--text-muted); padding-bottom: 4px; }
 .dr-day { position: relative; border: none; background: none; padding: 2px 0; cursor: pointer; display: flex; align-items: center; justify-content: center; height: 30px; }
 .dr-day::before { content: ""; position: absolute; inset: 0; z-index: 0; }
-.dr-day.rng::before { background: #eef0fe; }
-.dr-day.s::before { background: linear-gradient(to right, transparent 50%, #eef0fe 50%); }
-.dr-day.e::before { background: linear-gradient(to left, transparent 50%, #eef0fe 50%); }
-.dr-day.s.e::before { background: transparent; }
-.dr-num { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; font-size: 12px; color: var(--text); }
+/* In-range days: a separate light circle, same 27px diameter as the endpoints. */
+.dr-day.rng::before { inset: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 27px; height: 27px; border-radius: 50%; background: #eef0fe; }
+.dr-num { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 27px; height: 27px; border-radius: 50%; font-size: 12px; color: var(--text); }
 .dr-day:hover .dr-num { background: var(--surface-2); }
 .dr-day.s .dr-num, .dr-day.e .dr-num { background: var(--accent); color: #fff; font-weight: 600; }
 .dr-day.s:hover .dr-num, .dr-day.e:hover .dr-num { background: var(--accent); }