fix: stabilize Sudoku workspace layout

src/components/BoardViewport.tsx

@@ -100,7 +100,7 @@ export function BoardViewport({
 
   return (
     <section
-      className={`board-viewport${panMode ? " is-pan-mode" : ""}`}
+      className={`board-viewport${scale > 1 ? " is-zoomed-in" : ""}${panMode ? " is-pan-mode" : ""}`}
       aria-label="Board zoom and pan"
       onKeyDownCapture={onKeyDownCapture}
     >

src/components/Workbench.tsx

@@ -2335,9 +2335,7 @@ export function Workbench() {
         </p>
       )}
 
-      <div
-        className={`workbench-grid${workspace === "helpers" ? " workbench-grid--helpers" : ""}`}
-      >
+      <div className="workbench-grid">
         <section className="board-column" aria-label="Puzzle board">
           <div className="board-toolbar">
             <div className="toolbar-group">

src/styles.css

@@ -632,10 +632,6 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
   gap: clamp(0.85rem, 1.6vw, 1.35rem);
 }
 
-.workbench-grid--helpers {
-  grid-template-columns: minmax(24rem, 0.92fr) minmax(31rem, 1.08fr);
-}
-
 .board-column,
 .side-panel,
 .play-panel,
@@ -738,19 +734,23 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 
 .board-viewport__scroller {
   width: 100%;
-  max-height: min(82dvh, 56rem);
+  max-height: none;
   overflow: auto;
   overscroll-behavior: contain;
   scrollbar-gutter: stable;
 }
 
+.board-viewport.is-zoomed-in .board-viewport__scroller {
+  max-height: min(82dvh, 56rem);
+}
+
 .board-viewport__scroller:focus-visible {
   outline: 2px solid var(--toolbox-focus);
   outline-offset: 2px;
 }
 
 .board-viewport__canvas {
-  min-width: 100%;
+  min-width: 0;
   margin-inline: auto;
 }
 
@@ -2858,12 +2858,12 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 
 .digit-pad {
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(2.75rem, 1fr));
+  grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0.42rem;
 }
 
 .digit-pad--wide {
-  grid-template-columns: repeat(auto-fit, minmax(2.5rem, 1fr));
+  grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 
 .digit-pad button {
@@ -2875,6 +2875,7 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 }
 
 .digit-pad .erase-key {
+  grid-column: 1 / -1;
   padding-inline: 0.65rem;
   color: var(--toolbox-muted);
   font-size: 0.76rem;
@@ -3273,7 +3274,7 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 
 .candidate-lab__controls {
   display: grid;
-  grid-template-columns: minmax(12rem, 1.5fr) repeat(3, minmax(8rem, 1fr));
+  grid-template-columns: repeat(2, minmax(0, 1fr));
   align-items: end;
   gap: 0.55rem 0.8rem;
 }
@@ -3510,6 +3511,8 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 .solve-steps {
   max-height: 32rem;
   display: grid;
+  grid-auto-rows: max-content;
+  align-content: start;
   gap: 0.42rem;
   overflow: auto;
   padding: 0.15rem;
@@ -3518,7 +3521,6 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 
 .solve-step {
   width: 100%;
-  min-height: 0 !important;
   display: grid !important;
   grid-template-columns: 2rem minmax(0, 1fr);
   align-items: start !important;
@@ -3966,8 +3968,7 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
 /* Responsive composition */
 
 @media (max-width: 67rem) {
-  .workbench-grid,
-  .workbench-grid--helpers {
+  .workbench-grid {
     grid-template-columns: minmax(0, 1fr);
   }
 
@@ -4033,7 +4034,7 @@ body:has(.toolbox-shell[data-toolbox-theme="dark"]) .fatal-error {
     min-height: 2.75rem;
   }
 
-  .board-viewport__scroller {
+  .board-viewport.is-zoomed-in .board-viewport__scroller {
     max-height: min(72dvh, 48rem);
   }
 

src/toolbox/manifest.source.json

@@ -3,7 +3,7 @@
   "schemaVersion": 1,
   "id": "de.add-ideas.sudoku-tools",
   "name": "Sudoku Tools",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Set, play, solve and analyse Sudoku puzzles locally in the browser.",
   "entry": "./",
   "icon": "./favicon.svg",

src/version.ts

@@ -1 +1 @@
-export const APPLICATION_VERSION = "0.2.0";
+export const APPLICATION_VERSION = "0.2.1";