Flat-matte Generate button, fix hover, FOV-based MR presets

1. Generate button — was a green gradient (#7fc003 -> var(--green)) with
glossy inset highlights + a green glow shadow; in light mode var(--green)
is the deeper #5d9400 so the gradient was pronounced. Now a flat solid
#76b900 with no gradient and no shadow — matte, and pixel-identical in
light and dark (fixed hex, not the theme token).

2. Hover was unreadable in dark. Root cause: every .primary-cta state rule
used the descendant selector `.primary-cta button`, but Gradio puts the
class on the <button> itself — so :hover/:active/:disabled never matched.
On hover, `.controls button:hover` took over and set the background to
var(--pill-hover-bg) = transparent in dark, revealing the navy panel
behind the black text. Rewrote every state to `button.primary-cta`, and
excluded .primary-cta from the `.controls button:hover` chip rule. Hover
is now a flat brighter green (#84cc00) with readable dark text.

3. MR quick presets — replaced with the three highest-volume regions in the
rflow-mr training set, with voxel dims + spacing derived from the median
FOV data (FOV mm = voxels x spacing):
T1 brain 256x256x256 spacing 0.65/1.0/1.0 (FOV ~166x256x256)
T1 breast 256x256x256 spacing 0.70/0.80/0.80 (FOV ~179x205x205)
T2 prostate 256x256x128 spacing 0.65/0.65/0.70 (FOV ~166x166x90)

Verified with Playwright: button is flat/matte/identical in both themes,
hover is green with readable text, and the T1 brain preset populates
256/256 voxels + [0.65,1.0,1.0] spacing.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

app.py

@@ -1033,7 +1033,7 @@ body [role="option"][aria-selected="true"] {
    do NOT change text color here, because this rule blanket-matches every
    button inside .controls — including the primary Generate CTA — and tinting
    text green there would make it invisible against the green button bg. */
-.controls button:hover { border-color: var(--green) !important; background: var(--pill-hover-bg) !important; }
+.controls button:not(.primary-cta):hover { border-color: var(--green) !important; background: var(--pill-hover-bg) !important; }
 
 /* ─────────────── UNIFIED SELECTED STATE ─────────────── */
 /* Pattern: active = filled accent bg + accent border + accent text.
@@ -1116,11 +1116,14 @@ body [role="option"][aria-selected="true"] {
   color: var(--green) !important;
 }
 
-/* Primary CTA: Generate — same NVIDIA green as section headers, single-tone */
-.primary-cta button, button.primary-cta {
+/* Primary CTA: Generate — flat matte NVIDIA green, identical in light + dark.
+   Gradio puts elem_classes on the <button>, so every state targets
+   `button.primary-cta` directly; the old descendant form `.primary-cta button`
+   matched nothing, which is why the hover/active states silently failed. */
+button.primary-cta {
   margin: 18px 0 6px !important;
   padding: 14px 20px !important;
-  background: linear-gradient(180deg, #7fc003 0%, var(--green) 100%) !important;
+  background: #76b900 !important;
   color: #0b1a00 !important;
   border: 1px solid #5d9100 !important;
   border-radius: var(--radius) !important;
@@ -1132,83 +1135,50 @@ body [role="option"][aria-selected="true"] {
   position: relative;
   width: 100% !important;
   cursor: pointer !important;
-  box-shadow:
-    0 1px 0 rgba(255,255,255,0.25) inset,
-    0 -1px 0 rgba(0,0,0,0.20) inset,
-    0 10px 28px -10px rgba(118, 185, 0, 0.40) !important;
-  transition: transform 140ms ease, box-shadow 220ms ease, background 180ms ease !important;
-}
-.primary-cta button:hover {
-  background: linear-gradient(180deg, #8acc00 0%, #74b400 100%) !important;
-  transform: translateY(-1px) !important;
-  box-shadow:
-    0 1px 0 rgba(255,255,255,0.35) inset,
-    0 -1px 0 rgba(0,0,0,0.20) inset,
-    0 0 0 1px rgba(118,185,0,0.30),
-    0 18px 44px -10px rgba(118, 185, 0, 0.60) !important;
-}
-.primary-cta button:active {
-  transform: translateY(0) !important;
-  box-shadow:
-    0 1px 0 rgba(255,255,255,0.15) inset,
-    0 -1px 0 rgba(0,0,0,0.30) inset,
-    0 6px 16px -8px rgba(118, 185, 0, 0.50) !important;
-}
-
-/* Lock the Generate button text color across ALL states + descendants. Going
-   aggressive because Gradio injects Svelte-hashed classes on the button that
-   can bump up rule specificity unpredictably. */
-.controls .primary-cta button,
-.controls .primary-cta button:hover,
-.controls .primary-cta button:focus,
-.controls .primary-cta button:active,
-.controls .primary-cta button:focus-visible,
-.controls .primary-cta button *,
-.controls .primary-cta button:hover *,
-.controls .primary-cta button:focus *,
-.controls .primary-cta button:active *,
-.primary-cta button,
-.primary-cta button:hover,
-.primary-cta button:focus,
-.primary-cta button:active,
-.primary-cta button *,
-.primary-cta button:hover *,
-.gradio-container .primary-cta button,
-.gradio-container .primary-cta button:hover {
+  box-shadow: none !important;
+  transition: background 140ms ease !important;
+}
+.controls button.primary-cta:hover,
+button.primary-cta:hover {
+  background: #84cc00 !important;
+  border-color: #5d9100 !important;
+}
+button.primary-cta:active {
+  background: #6aa600 !important;
+}
+
+/* Lock the Generate button text colour across normal/hover/active states and
+   any Svelte-hashed descendant spans. (Disabled overrides this below.) */
+button.primary-cta,
+button.primary-cta:hover,
+button.primary-cta:focus,
+button.primary-cta:active,
+button.primary-cta *,
+button.primary-cta:hover *,
+button.primary-cta:active * {
   color: #0b1a00 !important;
   -webkit-text-fill-color: #0b1a00 !important;
 }
 
-/* Disabled / generating state — must beat the hover rules above. The combined
-   pseudo-class `:disabled:hover` adds extra specificity (0,3,2 with .controls)
-   so the disabled style wins even while the user is hovering. */
-.primary-cta button:disabled,
-.primary-cta button:disabled:hover,
-.primary-cta button:disabled:focus,
-.primary-cta button:disabled:active,
-.primary-cta button:disabled:focus-visible,
-.controls .primary-cta button:disabled,
-.controls .primary-cta button:disabled:hover,
-.controls .primary-cta button:disabled:focus,
-.controls .primary-cta button:disabled:active,
-.gradio-container .primary-cta button:disabled,
-.gradio-container .primary-cta button:disabled:hover {
-  background: linear-gradient(180deg, var(--cta-off-a) 0%, var(--cta-off-b) 100%) !important;
+/* Disabled / generating state — the :disabled:hover pseudo adds specificity so
+   it beats the plain :hover rule even while the pointer is over the button. */
+.controls button.primary-cta:disabled,
+button.primary-cta:disabled,
+button.primary-cta:disabled:hover {
+  background: var(--cta-off-a) !important;
   color: var(--cta-off-text) !important;
   -webkit-text-fill-color: var(--cta-off-text) !important;
   cursor: wait !important;
   opacity: 1 !important;
-  transform: none !important;
   box-shadow: none !important;
   border-color: var(--cta-off-border) !important;
 }
-/* Make sure nested spans inside the disabled button inherit the dim text color */
-.primary-cta button:disabled *,
-.primary-cta button:disabled:hover * {
+button.primary-cta:disabled *,
+button.primary-cta:disabled:hover * {
   color: var(--cta-off-text) !important;
   -webkit-text-fill-color: var(--cta-off-text) !important;
 }
-.primary-cta button:disabled::after {
+button.primary-cta:disabled::after {
   content: "";
   display: inline-block;
   width: 10px; height: 10px;

ui/presets.py

@@ -82,10 +82,15 @@ CT_SAMPLES = [
     },
 ]
 
+# FOV-derived from rflow-mr training-data medians (FOV mm = voxels × spacing);
+# the three highest-volume body regions in the training set:
+#   T1 brain    160 × 256 × 256 mm   (n=4,659)
+#   T1 breast   174 × 200 × 200 mm   (n=2,162)
+#   T2 prostate 170 × 170 ×  90 mm   (n=898)
 MR_SAMPLES = [
-    {"label": "T2 prostate", "modality_label": "T2 prostate", "xy": 256, "z": 128, "spacing": [1.0, 1.0, 1.5]},
-    {"label": "T1 abdomen", "modality_label": "T1 abdomen", "xy": 256, "z": 128, "spacing": [1.25, 1.0, 1.0]},
-    {"label": "T2 brain", "modality_label": "T2 brain", "xy": 256, "z": 128, "spacing": [1.0, 1.0, 1.0]},
+    {"label": "T1 brain", "modality_label": "T1 brain", "xy": 256, "z": 256, "spacing": [0.65, 1.0, 1.0]},
+    {"label": "T1 breast", "modality_label": "T1 breast", "xy": 256, "z": 256, "spacing": [0.70, 0.80, 0.80]},
+    {"label": "T2 prostate", "modality_label": "T2 prostate", "xy": 256, "z": 128, "spacing": [0.65, 0.65, 0.70]},
 ]
 
 MR_BRAIN_SAMPLES = [