diff --git a/package.json b/package.json
index 6b80f2efd0..8f3da93f78 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
         "express-http-proxy": "^2.0.0",
         "fork-ts-checker-webpack-plugin": "^9.0.0",
         "globals": "^15.8.0",
-        "goban": "=8.3.21",
+        "goban": "=8.3.22",
         "gulp": "^5.0.0",
         "gulp-clean-css": "^4.3.0",
         "gulp-eslint-new": "^2.2.0",
diff --git a/src/components/MiniGoban/MiniGoban.tsx b/src/components/MiniGoban/MiniGoban.tsx
index bf40828ce1..4d4caf1b22 100644
--- a/src/components/MiniGoban/MiniGoban.tsx
+++ b/src/components/MiniGoban/MiniGoban.tsx
@@ -20,7 +20,7 @@ import { Link } from "react-router-dom";
 import { npgettext, interpolate } from "translate";
 import * as moment from "moment";
 import * as preferences from "preferences";
-import { GobanRenderer, createGoban } from "goban";
+import { GobanRenderer, JGOFMove, createGoban } from "goban";
 import * as data from "data";
 import { PersistentElement } from "PersistentElement";
 import { getUserRating, PROVISIONAL_RATING_CUTOFF } from "rank_utils";
@@ -36,6 +36,7 @@ export interface MiniGobanProps {
     width?: number;
     height?: number;
     displayWidth?: number;
+    className?: string;
 
     // If these are not provided, we look in the game itself (via the id prop)...
     // Also note that if you pass in a string, you won't get the rank of the player displayed...
@@ -54,6 +55,10 @@ export interface MiniGobanProps {
     onGobanCreated?: (goban: GobanRenderer) => void;
     chat?: boolean;
     labels_positioning?: "none" | "all" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
+    sampleOptions?: {
+        undo?: boolean;
+        variation?: JGOFMove[];
+    };
 }
 
 export function MiniGoban(props: MiniGobanProps): JSX.Element {
@@ -117,6 +122,7 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element {
                 width: props.width || (props.json ? props.json.width : 19),
                 height: props.height || (props.json ? props.json.height : 19),
                 last_move_opacity: last_move_opacity,
+                variation_stone_opacity: preferences.get("variation-stone-opacity"),
             },
             props.json,
         );
@@ -125,6 +131,19 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element {
             props.onGobanCreated(goban.current);
         }
 
+        if (props.sampleOptions?.undo) {
+            (window as any)["mini_goban"] = goban.current;
+            //goban.current.visual_undo_request_indicator = true;
+            goban.current.engine.undo_requested = goban.current.engine.cur_move.move_number;
+        }
+
+        if (props.sampleOptions?.variation) {
+            goban.current.setMode("analyze");
+            for (const move of props.sampleOptions.variation) {
+                goban.current.engine.place(move.x, move.y);
+            }
+        }
+
         goban.current.on("update", () => {
             const engine = goban.current?.engine;
             if (!engine) {
@@ -351,13 +370,13 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element {
     }
 
     if (props.noLink || (!props.game_id && !props.review_id)) {
-        return <div className="MiniGoban nolink">{inner}</div>;
+        return <div className={"MiniGoban nolink " + (props.className ?? "")}>{inner}</div>;
     } else {
         if (props.game_id) {
             return (
                 <Link
                     to={`/game/${props.game_id}`}
-                    className="MiniGoban link"
+                    className={"MiniGoban link " + (props.className ?? "")}
                     {...new_tab_attributes}
                 >
                     {inner}
@@ -367,7 +386,7 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element {
             return (
                 <Link
                     to={`/review/${props.review_id}`}
-                    className="MiniGoban link"
+                    className={"MiniGoban link " + (props.className ?? "")}
                     {...new_tab_attributes}
                 >
                     {inner}
diff --git a/src/lib/configure-goban.tsx b/src/lib/configure-goban.tsx
index efda093484..3da328b3ee 100644
--- a/src/lib/configure-goban.tsx
+++ b/src/lib/configure-goban.tsx
@@ -101,7 +101,7 @@ export function configure_goban() {
         getClockDrift: (): number => get_clock_drift(),
         getNetworkLatency: (): number => get_network_latency(),
         getLocation: (): string => window.location.pathname,
-        getShowMoveNumbers: (): boolean => !!preferences.get("show-move-numbers"),
+        //getShowMoveNumbers: (): boolean => !!preferences.get("show-move-numbers"),
         getShowVariationMoveNumbers: (): boolean => preferences.get("show-variation-move-numbers"),
         getMoveTreeNumbering: (): "none" | "move-number" | "move-coordinates" =>
             preferences.get("move-tree-numbering"),
@@ -112,6 +112,9 @@ export function configure_goban() {
         watchSelectedThemes: (cb) => preferences.watchSelectedThemes(cb),
         getSelectedThemes: () => preferences.getSelectedThemes(),
 
+        getShowUndoRequestIndicator: (): boolean =>
+            preferences.get("visual-undo-request-indicator"),
+
         customBlackStoneColor: (): string =>
             preferences.get("goban-theme-custom-black-stone-color"),
         customBlackTextColor: (): string => preferences.get("goban-theme-custom-white-stone-color"),
diff --git a/src/views/Game/Game.tsx b/src/views/Game/Game.tsx
index caa40a4dc4..a3a0b2b3f8 100644
--- a/src/views/Game/Game.tsx
+++ b/src/views/Game/Game.tsx
@@ -1124,7 +1124,6 @@ export function Game(): JSX.Element | null {
             draw_left_labels: label_position === "all" || label_position.indexOf("left") >= 0,
             draw_right_labels: label_position === "all" || label_position.indexOf("right") >= 0,
             draw_bottom_labels: label_position === "all" || label_position.indexOf("bottom") >= 0,
-            visual_undo_request_indicator: preferences.get("visual-undo-request-indicator"),
             variation_stone_opacity: preferences.get("variation-stone-opacity"),
             onScoreEstimationUpdated: () => {
                 goban.current?.redraw(true);
@@ -1381,9 +1380,11 @@ export function Game(): JSX.Element | null {
                         "double-click-submit-correspondence",
                     );
                 }
+                /*
                 goban.current.visual_undo_request_indicator = preferences.get(
                     "visual-undo-request-indicator",
                 );
+                */
             } catch (e) {
                 console.error(e.stack);
             }
diff --git a/src/views/Settings/ThemePreferences.styl b/src/views/Settings/ThemePreferences.styl
index a1d7f855e3..6c0dcc0d30 100644
--- a/src/views/Settings/ThemePreferences.styl
+++ b/src/views/Settings/ThemePreferences.styl
@@ -33,4 +33,18 @@
     .small.board {
         padding-left: 0;
     }
+    
+    .MiniGoban.inline {
+        height: 1.5rem;
+        width: 10rem;
+        margin-left: 3rem;
+    }
+    
+    div.with-sample-goban {
+        .left {
+            display: inline-flex;
+            align-items: center;
+            width: 12rem;
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/views/Settings/ThemePreferences.tsx b/src/views/Settings/ThemePreferences.tsx
index be51d2dab3..f72501c106 100644
--- a/src/views/Settings/ThemePreferences.tsx
+++ b/src/views/Settings/ThemePreferences.tsx
@@ -37,25 +37,18 @@ import { GobanEngineConfig } from "goban";
 import { Toggle } from "Toggle";
 
 const sample_board_data: GobanEngineConfig = {
-    width: 9,
-    height: 9,
+    width: 3,
+    height: 3,
 
     initial_state: {
-        black:
-            "abbbbaga" + // cspell: disable-line
-            "gbgchcic", // cspell: disable-line
-        white:
-            "hahbib" + // cspell: disable-line
-            "acbccccbca", // cspell: disable-line
+        black: "abbbbaga", // cspell: disable-line
+        white: "acbccccbca", // cspell: disable-line
     },
-    initial_player: "black",
-    moves: [{ x: 4, y: 4 }],
     removed:
-        "aaia" + // cspell: disable-line
+        "aa" + // cspell: disable-line
         "abbbba" + // cspell: disable-line
-        "aahahbib", // cspell: disable-line
+        "aa", // cspell: disable-line
     marks: {
-        "score-black": "haiahbib", // cspell: disable-line
         "score-white": "aaabbabb", // cspell: disable-line
     },
 };
@@ -87,8 +80,15 @@ export function ThemePreferences(): JSX.Element | null {
         "visual-undo-request-indicator",
     );
     const [last_move_opacity, _setLastMoveOpacity] = usePreference("last-move-opacity");
+    /*
     const [variation_stone_opacity, _setVariationStoneOpacity] =
         usePreference("variation-stone-opacity");
+        */
+
+    //const [show_move_numbers, _setShowMoveNumbers] = usePreference("show-move-numbers");
+    const [show_variation_move_numbers, _setShowVariationMoveNumbers] = usePreference(
+        "show-variation-move-numbers",
+    );
 
     const toggleRemovalScale = React.useCallback((tf: boolean) => {
         if (tf) {
@@ -106,6 +106,16 @@ export function ThemePreferences(): JSX.Element | null {
         }
     }, []);
 
+    /*
+    const toggleShowMoveNumbers = React.useCallback((tf: boolean) => {
+        _setShowMoveNumbers(tf);
+    }, []);
+    */
+
+    const toggleShowVariationMoveNumbers = React.useCallback((tf: boolean) => {
+        _setShowVariationMoveNumbers(tf);
+    }, []);
+
     function setLastMoveOpacity(ev: React.ChangeEvent<HTMLInputElement>) {
         const value = parseFloat(ev.target.value);
 
@@ -114,6 +124,7 @@ export function ThemePreferences(): JSX.Element | null {
         }
     }
 
+    /*
     function setVariationStoneOpacity(ev: React.ChangeEvent<HTMLInputElement>) {
         const value = parseFloat(ev.target.value);
 
@@ -121,6 +132,7 @@ export function ThemePreferences(): JSX.Element | null {
             _setVariationStoneOpacity(value);
         }
     }
+    */
 
     const [svg_enabled, setSvgEnabled] = useData("experiments.svg");
     const enable_svg = svg_enabled === "enabled";
@@ -132,8 +144,7 @@ export function ThemePreferences(): JSX.Element | null {
         //stone_removal_graphic +
         //removal_scale +
         visual_undo_request_indicator +
-        last_move_opacity +
-        variation_stone_opacity;
+        last_move_opacity;
 
     return (
         <div className="ThemePreferences">
@@ -183,7 +194,10 @@ export function ThemePreferences(): JSX.Element | null {
                     options={[
                         { value: "none", label: _("None") },
                         { value: "all", label: _("All") },
-                        { value: "top-left", label: pgettext("Board label position", "Top left") },
+                        {
+                            value: "top-left",
+                            label: pgettext("Board label position", "Top left"),
+                        },
                         {
                             value: "top-right",
                             label: pgettext("Board label position", "Top right"),
@@ -201,14 +215,55 @@ export function ThemePreferences(): JSX.Element | null {
                 />
             </PreferenceLine>
             <PreferenceLine title={_("Board label lettering")}>
-                <PreferenceDropdown
-                    value={board_labeling}
-                    options={[
-                        { value: "automatic", label: _("Automatic") },
-                        { value: "A1", label: "A1" },
-                        { value: "1-1", label: "1-1" },
-                    ]}
-                    onChange={setBoardLabeling}
+                <div className="with-sample-goban">
+                    <div className="left">
+                        <PreferenceDropdown
+                            value={board_labeling}
+                            options={[
+                                { value: "automatic", label: _("Automatic") },
+                                { value: "A1", label: "A1" },
+                                { value: "1-1", label: "1-1" },
+                            ]}
+                            onChange={setBoardLabeling}
+                        />
+                    </div>
+
+                    <MiniGoban
+                        className="inline"
+                        key={sample_goban_key}
+                        json={sample_board_data}
+                        noLink={true}
+                        width={2}
+                        height={2}
+                        displayWidth={140}
+                        labels_positioning={label_positioning}
+                    />
+                </div>
+            </PreferenceLine>
+
+            <PreferenceLine title={_("Removed stones graphic")}>
+                <button
+                    className={`theme-button light ${
+                        stone_removal_graphic === "square" ? "primary" : ""
+                    }`}
+                    onClick={setStoneRemovalGraphic.bind(null, "square")}
+                >
+                    <i className="fa fa-square" />
+                </button>
+                <button
+                    className={`theme-button light ${
+                        stone_removal_graphic === "x" ? "primary" : ""
+                    }`}
+                    onClick={setStoneRemovalGraphic.bind(null, "x")}
+                >
+                    <i className="fa fa-times" />
+                </button>
+            </PreferenceLine>
+            <PreferenceLine title={_("Reduce removed stone size")}>
+                <Toggle
+                    id={"goban-theme-removal-scale"}
+                    onChange={toggleRemovalScale}
+                    checked={removal_scale < 1.0}
                 />
             </PreferenceLine>
 
@@ -218,25 +273,106 @@ export function ThemePreferences(): JSX.Element | null {
                     "Choose the level of opacity for the 'last move' mark on stones. 0.0 is transparent and 1.0 is opaque.",
                 )}
             >
-                <input
-                    type="range"
-                    step="0.1"
-                    min="0.0"
-                    max="1.0"
-                    onChange={setLastMoveOpacity}
-                    value={last_move_opacity}
-                />
-                <span>
-                    &nbsp;
-                    {last_move_opacity}
-                </span>
+                <div className="with-sample-goban">
+                    <div className="left">
+                        <input
+                            type="range"
+                            step="0.1"
+                            min="0.0"
+                            max="1.0"
+                            onChange={setLastMoveOpacity}
+                            value={last_move_opacity}
+                        />
+                        <span>
+                            &nbsp;
+                            {last_move_opacity}
+                        </span>
+                    </div>
+
+                    <MiniGoban
+                        className="inline"
+                        key={last_move_opacity}
+                        json={{
+                            moves: [{ x: 1, y: 0 }],
+                            width: 3,
+                            height: 1,
+                        }}
+                        noLink={true}
+                        width={2}
+                        height={1}
+                        displayWidth={80}
+                        labels_positioning={"none"}
+                    />
+                </div>
+            </PreferenceLine>
+
+            {/*
+            <PreferenceLine title={_("Show analysis numbers")}>
+                <div className="with-sample-goban">
+                    <div className="left">
+                        <Toggle checked={show_move_numbers} onChange={toggleShowMoveNumbers} />
+                    </div>
+
+                    <MiniGoban
+                        className="inline"
+                        key={show_move_numbers + ""}
+                        json={{
+                            moves: [
+                                { x: 0, y: 0 },
+                                { x: 2, y: 0 },
+                            ],
+                            width: 3,
+                            height: 1,
+                        }}
+                        noLink={true}
+                        width={2}
+                        height={1}
+                        displayWidth={80}
+                        labels_positioning={"none"}
+                        sampleOptions={{}}
+                    />
+                </div>
             </PreferenceLine>
+            */}
+
+            <PreferenceLine title={_("Show variation move numbers")}>
+                <div className="with-sample-goban">
+                    <div className="left">
+                        <Toggle
+                            checked={show_variation_move_numbers}
+                            onChange={toggleShowVariationMoveNumbers}
+                        />
+                    </div>
 
+                    <MiniGoban
+                        className="inline"
+                        key={show_variation_move_numbers + ""}
+                        json={{
+                            width: 3,
+                            height: 1,
+                        }}
+                        noLink={true}
+                        width={2}
+                        height={1}
+                        displayWidth={80}
+                        labels_positioning={"none"}
+                        sampleOptions={{
+                            variation: [
+                                { x: 0, y: 0 },
+                                { x: 2, y: 0 },
+                            ],
+                        }}
+                    />
+                </div>
+            </PreferenceLine>
+
+            {/*
             <PreferenceLine
                 title={_("Variation stone opacity")}
                 description={_(
                     "Choose the level of opacity for stones shown in variations. 0.0 is transparent and 1.0 is opaque.",
                 )}
+
             >
                 <input
                     type="range"
@@ -251,6 +387,7 @@ export function ThemePreferences(): JSX.Element | null {
                     {variation_stone_opacity}
                 </span>
             </PreferenceLine>
+            */}
 
             <PreferenceLine
                 title={_("Visual undo request indicator")}
@@ -258,55 +395,30 @@ export function ThemePreferences(): JSX.Element | null {
                     "This will cause an undo request to be indicated by a mark on your opponent's last move.",
                 )}
             >
-                <Toggle
-                    checked={visual_undo_request_indicator}
-                    onChange={setVisualUndoRequestIndicator}
-                />
-            </PreferenceLine>
-
-            <PreferenceLine title={_("Removed stones graphic")}>
-                <button
-                    className={`theme-button light ${
-                        stone_removal_graphic === "square" ? "primary" : ""
-                    }`}
-                    onClick={setStoneRemovalGraphic.bind(null, "square")}
-                >
-                    <i className="fa fa-square" />
-                </button>
-                <button
-                    className={`theme-button light ${
-                        stone_removal_graphic === "x" ? "primary" : ""
-                    }`}
-                    onClick={setStoneRemovalGraphic.bind(null, "x")}
-                >
-                    <i className="fa fa-times" />
-                </button>
-            </PreferenceLine>
-            <PreferenceLine title={_("Reduce removed stone size")}>
-                <Toggle
-                    id={"goban-theme-removal-scale"}
-                    onChange={toggleRemovalScale}
-                    checked={removal_scale < 1.0}
-                />
-            </PreferenceLine>
+                <div className="with-sample-goban">
+                    <div className="left">
+                        <Toggle
+                            checked={visual_undo_request_indicator}
+                            onChange={setVisualUndoRequestIndicator}
+                        />
+                    </div>
 
-            <PreferenceLine
-                className="title-on-top body-as-column"
-                title={pgettext(
-                    "Shows an example Goban to visualize theme settings",
-                    "Sample board",
-                )}
-            >
-                {[{}].map(() => (
                     <MiniGoban
-                        key={sample_goban_key}
-                        json={sample_board_data}
+                        className="inline"
+                        key={visual_undo_request_indicator + ""}
+                        json={{
+                            moves: [{ x: 1, y: 0 }],
+                            width: 3,
+                            height: 1,
+                        }}
                         noLink={true}
-                        width={9}
-                        height={9}
-                        labels_positioning={label_positioning}
+                        width={2}
+                        height={1}
+                        displayWidth={80}
+                        labels_positioning={"none"}
+                        sampleOptions={{ undo: true }}
                     />
-                ))}
+                </div>
             </PreferenceLine>
 
             <PreferenceLine title={"Enable SVG goban renderer"}>
diff --git a/yarn.lock b/yarn.lock
index 9fb8a69aa4..7d966f0da1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5995,10 +5995,10 @@ glogg@^2.2.0:
   dependencies:
     sparkles "^2.1.0"
 
-goban@=8.3.21:
-  version "8.3.21"
-  resolved "https://registry.yarnpkg.com/goban/-/goban-8.3.21.tgz#949c5d73d421bdfbe7972509d38a2a756be69e30"
-  integrity sha512-XCsQFGpth6j5QBdNflMIyJPnh8r4wWz25+Ip0iuNQsbPmOQ1GHaqyXwIoU2djyDA/UcbUkeclpXfxaTGiYOOTQ==
+goban@=8.3.22:
+  version "8.3.22"
+  resolved "https://registry.yarnpkg.com/goban/-/goban-8.3.22.tgz#296e321cc263153c8be6ba160e21407b1b5f6f82"
+  integrity sha512-UtjWP4toxcwC59Xp/25jUhbHO9x026UXyJb4rNVbpVIXTtbKPo5ALel4g+hwHnXJHfA7gz4WTstZ+SziTt5Llw==
   dependencies:
     eventemitter3 "^5.0.0"