fix(medications): widen the schedule day-of-week grid for narrow viewports and drop the DrugLevelChart dead axis labels

The medication-form schedule editor's day-of-week row packed the
wide "Daily" pill (min-w-24) into the same single-flex row as the
seven weekday pills; at 320 px the row overflowed and the last
weekday clipped off-screen. Stack the Daily pill above a fixed
seven-column grid so every weekday keeps the 44 px tap-target floor
regardless of container width.

Drop two dead axis decorations from the GLP-1 DrugLevelChart: an
empty `<text>` child beneath the XAxis that rendered an invisible
SVG node, and a duplicate Recharts `label={…}` prop on the YAxis
that painted the unit-less caption inside a 1 px-wide axis where it
could never be read. The external `<p>` above the chart remains the
single source of truth for the caption.

src/components/medications/DrugLevelChart.tsx

@@ -523,6 +523,9 @@ function ChartBody({
             stroke="var(--border)"
             opacity={0.5}
           />
+          {/* v1.4.27 MB6 CF-16 — dropped a stray empty `<text>` child
+              that previously declared no content and rendered an
+              invisible SVG node beneath the x-axis. */}
           <XAxis
             dataKey="dayOffset"
             type="number"
@@ -532,34 +535,22 @@ function ChartBody({
             tick={{ fontSize: 11, fill: "var(--muted-foreground)" }}
             tickLine={false}
             axisLine={false}
-          >
-            <text
-              x="50%"
-              y="100%"
-              dy={14}
-              textAnchor="middle"
-              fontSize={10}
-              fill="var(--muted-foreground)"
-            />
-          </XAxis>
+          />
           {/* Research §2.3 — y-axis is unit-less. We hide tick labels
               and the axis line entirely; the human-readable label sits
               outside the chart frame, above. The `tick={false}` flag
-              suppresses the textual ticks per Recharts. */}
+              suppresses the textual ticks per Recharts. v1.4.27 MB6
+              CF-16 — the duplicate Recharts `label={…}` prop dropped
+              here painted the same caption inside the SVG behind the
+              `width={1}` axis, where it could never be read. The
+              external `<p>` above the chart is the single source of
+              truth for the caption. */}
           <YAxis
             domain={[0, "auto"]}
             tick={false}
             tickLine={false}
             axisLine={false}
             width={1}
-            label={{
-              value: axisLabel,
-              angle: -90,
-              position: "insideLeft",
-              fontSize: 10,
-              fill: "var(--muted-foreground)",
-              offset: 0,
-            }}
           />
           <Tooltip
             content={() => null}

src/components/medications/medication-form.tsx

@@ -902,18 +902,30 @@ export function MedicationForm({
                   <Label className="text-sm">
                     {t("medications.scheduleDays")}
                   </Label>
-                  <div className="flex w-full gap-1">
-                    <button
-                      type="button"
-                      onClick={() => updateSchedule(i, "daysOfWeek", [])}
-                      className={`min-h-11 min-w-24 rounded-md border px-3 text-xs font-medium transition-colors ${
-                        s.daysOfWeek.length === 0
-                          ? "border-primary bg-primary text-primary-foreground"
-                          : "border-border/70 bg-muted text-foreground/70 hover:bg-accent hover:text-foreground"
-                      }`}
-                    >
-                      {t("medications.scheduleDaily")}
-                    </button>
+                  {/* v1.4.27 MB6 CF-4 — the previous single-row
+                      `flex w-full gap-1` layout placed the wide
+                      "Daily" pill (min-w-24 ≈ 96 px) next to seven
+                      weekday pills inside the same row. At 320 px
+                      viewport widths the eighth child pushed the row
+                      past the form edge and the last weekday clipped
+                      off-screen. The new layout stacks the Daily
+                      pill above a seven-column grid so each weekday
+                      keeps the 44 px tap-target floor without
+                      relying on the available width. The grid wraps
+                      naturally at any container width because every
+                      cell is one explicit grid track. */}
+                  <button
+                    type="button"
+                    onClick={() => updateSchedule(i, "daysOfWeek", [])}
+                    className={`block w-full min-h-11 rounded-md border px-3 text-xs font-medium transition-colors ${
+                      s.daysOfWeek.length === 0
+                        ? "border-primary bg-primary text-primary-foreground"
+                        : "border-border/70 bg-muted text-foreground/70 hover:bg-accent hover:text-foreground"
+                    }`}
+                  >
+                    {t("medications.scheduleDaily")}
+                  </button>
+                  <div className="grid w-full grid-cols-7 gap-1">
                     {getDayLabelsShort(t).map((label, dayIndex) => {
                       const isSelected = s.daysOfWeek.includes(dayIndex);
                       return (
@@ -921,7 +933,7 @@ export function MedicationForm({
                           key={dayIndex}
                           type="button"
                           onClick={() => toggleDay(i, dayIndex)}
-                          className={`min-h-11 flex-1 rounded-md border text-xs font-medium transition-colors ${
+                          className={`min-h-11 rounded-md border text-xs font-medium transition-colors ${
                             isSelected
                               ? "border-primary bg-primary text-primary-foreground"
                               : "border-border/70 bg-muted text-foreground/75 hover:bg-accent hover:text-foreground"