Tutorial: pin coachmarks to a bottom banner so they never cover the UI

The center-anchored callouts (opener, create-modal steps) obscured the map/modal/picker.
Route every step to one consistent banner low on the screen (centred, above the controls
+ picker) — readable, click-through everywhere else, and 'starts at the bottom'. Verified:
opener sits in the bottom third with the picker fully clickable below it.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web/tutorial.js

@@ -9,15 +9,14 @@ const save = (s) => { try { localStorage.setItem(KEY, JSON.stringify(s)) } catch
 function elc(tag, css, text) { const n = document.createElement(tag); if (css) n.style.cssText = css; if (text != null) n.textContent = text; return n }
 
 // Place a fixed-position callout in a screen region, offset so it doesn't cover the control.
-const REGION = {
-  center: 'top:50%;left:50%;transform:translate(-50%,-50%)',
-  'top-left': 'top:70px;left:14px',
-  'top-right': 'top:70px;right:14px',
-  'bottom-left': 'left:20px;bottom:165px',
-  'bottom-right': 'right:20px;bottom:190px',
-  'bottom-center': 'left:50%;bottom:205px;transform:translateX(-50%)',
-  right: 'top:50%;right:min(330px,86vw);transform:translateY(-50%)',
-}
+// All anchors sit in the LOWER part of the screen so the callout never covers the map, the create
+// modal, the picker or the top UI — and you can still read + click through. 'bottom' is the default
+// banner (centred, just above the on-screen controls); the others nudge left/right toward a control.
+// One consistent banner low on the screen (centred, above the on-screen controls + picker) so the
+// callout never covers the map, the create modal, the picker or the top UI — you can read it and
+// still click through everywhere else. Every step maps here.
+const BANNER = 'left:50%;bottom:170px;transform:translateX(-50%)'
+const REGION = { center: BANNER, bottom: BANNER, 'bottom-center': BANNER, 'bottom-left': BANNER, 'bottom-right': BANNER, 'top-left': BANNER, 'top-right': BANNER, right: BANNER }
 
 export function createTutorial(steps) {
   let state = { step: 0, done: false, dismissed: false, ...load() }