Mobile UX polish: scrollable column, menu workspace section, pin tap fixes

The phone layout had three problems that compounded when running ADC /
Pin / Serial demos: the editor refused to shrink past 42vh so panels
spilled over a clipped console, the workspace badge was crammed full of
buttons, and the IN-pin toggle button was unreliable to tap.

- styles.css: on `<= 768px`, make `.main-content` scroll vertically and
  give the editor a fixed 50vh height (drops to 32vh via `:has()` when a
  simulator panel is open). All panels + console pin to `flex: 0 0 auto`
  so flexbox stops squashing them. Inner panel scroll caps tightened to
  22vh so two stacked panels don't push the console below the fold.
  `.pin-toggle` gets `touch-action: manipulation` + `user-select: none`
  to fix iOS taps inside scrollable parents.

- script.js: pin button now has a `pointerup` backup with a 300 ms
  debounce alongside `click` (Safari sometimes drops `click` on small
  buttons inside scroll containers). The `⋮` workspace menu auto-closes
  on outside `pointerdown` as well as `click`, so the open dropdown
  can't sit on top of the Pin panel and absorb taps.

- script.js / index.html / styles.css: move every Workspace action
  (Export, Import, Reset demos, plus the local-mode-only Folder…,
  Reconnect, IndexedDB swap, Exit) out of the badge and into a new
  "Workspace" section in the `⋮` menu. Badge keeps just the storage
  label. Adds `.menu-separator`, `.menu-section-label`, `.menu-note`,
  and `.menu-action` styles; removes the now-unused
  `.workspace-badge-action` / `-exit` / `-note` rules.

- bundled-demos/pin_demo.py: pin 4 is now driven exclusively by the
  IRQ handler, so it stays steady until the IN button is pressed —
  previously it auto-flashed via on/off in the loop, which made the
  IRQ effect indistinguishable from the existing animation. The IRQ
  handler also no longer prints on every press (the panel indicator
  is the feedback).

Cache busters: styles.css 32 -> 36, script.js 57 -> 59.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/static/bundled-demos/pin_demo.py

@@ -2,11 +2,12 @@
 
 A "Pins" panel appears below the editor while this script runs:
 
-  * Pin 2 (OUT)  — blinks every 200 ms; the indicator follows along.
-  * Pin 4 (OUT)  — chases through .on() / .off() / .toggle().
-  * Pin 0 (IN)   — click the toggle button in the panel to flip its value.
-                   When it goes 0 -> 1 we register an IRQ that toggles pin 2.
-  * Pin 13 (PWM) — duty sweeps up and down; the bar shows the live duty cycle.
+  * Pin 2  (OUT) — blinks automatically every ~200 ms via ``.value(...)``.
+  * Pin 4  (OUT) — stays put until you press the button, then flips
+                   (driven from the IRQ handler with ``.toggle()``).
+  * Pin 0  (IN)  — click the toggle button in the panel to drive a 0 → 1
+                   rising edge; the IRQ fires and flips pin 4.
+  * Pin 13 (PWM) — duty sweeps up and down; the bar shows the live duty.
 """
 
 import time
@@ -21,8 +22,9 @@ fader = PWM(Pin(13), freq=1000, duty_u16=0)
 
 
 def on_button(pin):
-    print("[irq] button rising edge -> toggling pin 2")
-    led_a.toggle()
+    # Pin 4 is IRQ-driven on purpose — its only source of change is the
+    # button press, so when you see it flip you know the IRQ fired.
+    led_b.toggle()
 
 
 button.irq(handler=on_button, trigger=Pin.IRQ_RISING)
@@ -33,12 +35,10 @@ duty = 0
 direction = 1024
 
 while True:
+    # Pin 2: fast on/off via direct .value(...) writes (no IRQ involvement).
     led_a.value(tick % 2)
-    if tick % 4 == 0:
-        led_b.on()
-    elif tick % 4 == 2:
-        led_b.off()
 
+    # Pin 13: triangular duty sweep so the PWM bar visibly fills and drains.
     duty += direction
     if duty >= 65535:
         duty = 65535
@@ -48,6 +48,8 @@ while True:
         direction = 1024
     fader.duty_u16(duty)
 
+    # Poll the IN pin so its IRQ actually fires when the panel button changes.
+    # (`.value()` reads the current state and dispatches any pending edge.)
     button.value()
 
     tick += 1