Graph calculator improvmentes

frontend/app/assets/css/_calculator.scss

@@ -115,6 +115,12 @@
   font: italic 0.95rem/1 'Computer Modern', Georgia, serif;
 }
 
+// a relation or point carries no lone "y =", so it sheds the gutter and the
+// input takes back the room it stood in
+.calc-input-box.bare .calc-input {
+  padding-left: 10px;
+}
+
 .calc-input {
   flex: 1;
   min-width: 0;
@@ -125,8 +131,6 @@
   color: var(--text);
   font: 0.95rem/1.2 'Computer Modern', Georgia, serif;
 
-  &::placeholder { color: var(--faint); opacity: 0.75; }
-
   &.input-error { color: var(--danger); }
 }
 
@@ -246,3 +250,40 @@
   // width back at once rather than after the slide
   .calc-dock-leave-active { position: absolute; left: 0; right: 0; }
 }
+
+// ---------- Laid on a page of the book (ToolPane) ----------
+// A pane of the book is a full surface again, at any screen width: the plane
+// fills the page and the input dock pins to its edge as on the desktop, and
+// the fold above — panels of the plain /calculator page — does not reach
+// into the pane.
+
+.pane-stage .calc-stage {
+  position: absolute;
+  inset: 0;
+  display: block;
+  background: var(--bg);
+}
+
+.pane-stage .plot-wrap {
+  position: absolute;
+  width: auto;
+  height: auto;
+  border: 0;
+  border-radius: 0;
+}
+
+.pane-stage .calc-dock {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  width: clamp(260px, 24vw, 320px);
+  margin: 0;
+  border: 0;
+  border-right: 1px solid var(--border);
+  border-radius: 0;
+  background: color-mix(in srgb, var(--bg-elev) 92%, transparent);
+  backdrop-filter: blur(12px);
+  box-shadow: var(--shadow-lg);
+  overflow-y: auto;
+}