@7ots/cli 0.1.7 → 0.1.9

package/cli/pet/electron/main.cjs

@@ -18,7 +18,9 @@ const URL_ = process.env.SEVENOTS_PET_URL;
 const TOKEN = process.env.SEVENOTS_PET_TOKEN;
 const OPAQUE = process.env.SEVENOTS_PET_OPAQUE === '1';
 const VIEW3D = process.env.SEVENOTS_PET_3D === '1';
-const LANG = String(process.env.SEVENOTS_PET_LANG || 'en').slice(0, 2);
+// menus in the human's language: SEVENOTS_PET_LANG, else the system's (es_CL.UTF-8 → es)
+const LANG = [process.env.SEVENOTS_PET_LANG, process.env.SEVENOTS_LANG, process.env.LC_ALL, process.env.LC_MESSAGES, process.env.LANG]
+  .map((l) => String(l || '').slice(0, 2).toLowerCase()).find((l) => ['en', 'es', 'pt'].includes(l)) || 'en';
 const ICON = path.join(__dirname, '..', '..', '..', 'brand', 'icon-512.png');
 const BIG = { w: 240, h: 270 }; // with room for the bubble, the buttons and the talk box
 const SMALL = { w: 160, h: 164 }; // just the ot
@@ -47,6 +49,69 @@ const post = (p, body) =>
 
 app.whenReady().then(() => setTimeout(start, linux ? 400 : 0)); // Linux: the compositor needs a moment
 
+// The shell lives as long as the daemon that started it: when that one stops (7ots stop) or another takes
+// its place (a relaunch), this shell leaves too, so there are never two shells (and two directors) at once.
+{
+  let pid = 0;
+  let misses = 0;
+  setInterval(async () => {
+    const h = await fetch(new URL('/health', URL_), { signal: AbortSignal.timeout(3000) }).then((r) => r.json(), () => null);
+    if (!h?.pid) return ++misses > 4 && app.quit(); // gone for ~25 s
+    misses = 0;
+    pid ||= h.pid;
+    if (h.pid !== pid) app.quit();
+  }, 5000);
+}
+
+// The cursor. On X11 Chromium answers getCursorScreenPoint() from the last mouse event its own windows got,
+// and a click-through window gets none: the point froze wherever the mouse last left the ot, so hovering it
+// often did nothing (no menu, no grab). There a tiny python3 + libX11 helper asks the X server ~60 times a
+// second instead; without python3/libX11 (or off X11) it stays Electron's answer.
+let xCursor = null; // { x, y, at } in physical pixels
+function watchX11Cursor() {
+  if (!linux || !process.env.DISPLAY || process.env.WAYLAND_DISPLAY) return;
+  const py = [
+    'import ctypes, ctypes.util, sys, time',
+    "x = ctypes.cdll.LoadLibrary(ctypes.util.find_library('X11') or 'libX11.so.6')",
+    'x.XOpenDisplay.restype = ctypes.c_void_p',
+    'x.XDefaultRootWindow.argtypes = [ctypes.c_void_p]; x.XDefaultRootWindow.restype = ctypes.c_ulong',
+    'x.XQueryPointer.argtypes = [ctypes.c_void_p, ctypes.c_ulong] + [ctypes.c_void_p] * 7',
+    'd = x.XOpenDisplay(None)',
+    'if not d: sys.exit(1)',
+    'r = x.XDefaultRootWindow(d)',
+    'w = ctypes.c_ulong(); i = [ctypes.c_int() for _ in range(4)]; m = ctypes.c_uint(); last = None; n = 0',
+    'while True:',
+    '  x.XQueryPointer(d, r, ctypes.byref(w), ctypes.byref(w), *[ctypes.byref(v) for v in i], ctypes.byref(m))',
+    '  p = (i[0].value, i[1].value); n += 1',
+    '  if p != last or n % 30 == 0:',
+    "    last = p; sys.stdout.write('%d %d\\n' % p); sys.stdout.flush()",
+    '  time.sleep(0.016)',
+  ].join('\n');
+  let child;
+  try {
+    child = require('node:child_process').spawn('python3', ['-c', py], { stdio: ['ignore', 'pipe', 'ignore'] });
+  } catch {
+    return;
+  }
+  child.on('error', () => {});
+  let buf = '';
+  child.stdout.on('data', (d) => {
+    buf += d;
+    const lines = buf.split('\n');
+    buf = lines.pop();
+    const m = /^(-?\d+) (-?\d+)$/.exec(lines.pop() || '');
+    if (m) xCursor = { x: +m[1], y: +m[2], at: Date.now() };
+  });
+  app.on('will-quit', () => child.kill());
+}
+const cursorPoint = () => {
+  if (xCursor && Date.now() - xCursor.at < 2000) {
+    const k = screen.getPrimaryDisplay().scaleFactor || 1; // X11 pixels → Electron's DIP
+    return { x: Math.round(xCursor.x / k), y: Math.round(xCursor.y / k) };
+  }
+  return screen.getCursorScreenPoint();
+};
+
 // Every ot on the desktop: the one that lives here ('host') and visitors from the same account.
 const DEBUG = !!process.env.SEVENOTS_PET_DEBUG;
 const ots = new Map();
@@ -54,6 +119,7 @@ let tray = null;
 let relaunching = false; // a 2D → 3D switch that needs the GPU (see setView)
 
 function start() {
+  watchX11Cursor();
   // Tray first: if there is one, the window can stay out of the taskbar; if not, it shows there so it can be found.
   try {
     const img = nativeImage.createFromPath(ICON);
@@ -73,7 +139,7 @@ function start() {
   };
   setTimeout(syncVisitors, 2500);
   setInterval(syncVisitors, 4000);
-  require('./director.cjs').createDirector({ ots, lang: LANG });
+  require('./director.cjs').createDirector({ ots, lang: LANG, url: URL_, token: TOKEN });
 }
 
 // Settings in a window of our own (not a browser tab); links elsewhere open in the browser.
@@ -240,19 +306,27 @@ function makeOt(opt = {}) {
   // button is down on the ot. Past 4 px it is a drag: the drop spot becomes home, as with a system drag.
   let grabbing = null;
   let grabTimer = null;
-  function grab(on) {
+  function grab(on, resizing = false) {
     clearInterval(grabTimer);
+    // stretching from a corner (pet.html): the window keeps the mouse and stays put; the page grows the ot
+    if (on && resizing) {
+      grabbing = { resize: true, moved: false };
+      grabTimer = setInterval(() => (grabbing ? (stillUntil = Date.now() + 1200) : clearInterval(grabTimer)), 200); // no wandering off mid-stretch
+      return;
+    }
     if (!on) {
       if (grabbing?.moved) (setHome(pos), (droppedSaid = false), (plan = { mode: 'idle', until: Date.now() + 6000 }));
       grabbing = null;
       return;
     }
+    // while grabbed the window has the mouse, so Electron's own cursor is live (and finer than the X11 poll)
     const c = screen.getCursorScreenPoint();
     grabbing = { dx: pos.x - c.x, dy: pos.y - c.y, x: c.x, y: c.y, moved: false };
     grabTimer = setInterval(() => {
       if (!alive() || !grabbing) return clearInterval(grabTimer);
       const p = screen.getCursorScreenPoint();
       if (!grabbing.moved && Math.hypot(p.x - grabbing.x, p.y - grabbing.y) < 4) return;
+      if (!grabbing.moved) page('postMessage({ carried: true })'); // the page stretches it toward the pull
       grabbing.moved = true;
       dragged = Date.now();
       pos.x = Math.max(area.x + size.w / 2 - 40, Math.min(right - size.w / 2 + 40, p.x + grabbing.dx));
@@ -269,7 +343,7 @@ function makeOt(opt = {}) {
   let asleep = false; // asleep it stays put (an urgent stir wakes it for a moment, see pet.html)
   const HIT = `(() => {
     const out = [];
-    for (const e of document.querySelectorAll('#stage, .actions, .ask')) {
+    for (const e of document.querySelectorAll('#stage, .actions, .ask, .bubble.asking')) {
       const cs = getComputedStyle(e);
       // the menu counts while faded out too: reaching for it must not let the mouse through (and hide it)
       if (cs.display === 'none' || cs.visibility === 'hidden' || (+cs.opacity < 0.3 && !e.classList.contains('actions'))) continue;
@@ -308,7 +382,7 @@ function makeOt(opt = {}) {
   let dbgT = 0;
   const mouseTimer = setInterval(() => {
     if (!alive() || !win.isVisible()) return;
-    const c = screen.getCursorScreenPoint();
+    const c = cursorPoint();
     const [wx, wy] = win.getPosition();
     const x = c.x - wx;
     const y = c.y - wy;
@@ -353,7 +427,8 @@ function makeOt(opt = {}) {
     const differs = want.w !== size.w || want.h !== size.h;
     if (!differs) (shrinkAt = 0), (shrinkTo = null);
     else if (!grow) shrinkTo = shrinkTo ? { w: Math.max(shrinkTo.w, want.w), h: Math.max(shrinkTo.h, want.h) } : want; // the most it wanted while waiting
-    if (differs && Date.now() - dragged > 400 && (grow || (!held && (shrinkAt ||= Date.now() + 6000) < Date.now()))) {
+    // growing never waits (a stretch while dragged would be cut off); shrinking waits for the drop
+    if (differs && (grow || (Date.now() - dragged > 400 && !held && (shrinkAt ||= Date.now() + 6000) < Date.now()))) {
       size = grow ? { w: Math.max(want.w, size.w), h: Math.max(want.h, size.h) } : shrinkTo || want;
       shrinkAt = 0;
       shrinkTo = null;
@@ -377,8 +452,12 @@ function makeOt(opt = {}) {
   // An effect just started: the page says how much room it needs right away (see tellNeed in pet.html).
   win.webContents.on('console-message', (e, level, msg) => {
     const m = String(e?.message ?? msg ?? '');
-    if (m.startsWith('\u00a77drag')) return grab(JSON.parse(m.slice(6)).on);
+    if (m.startsWith('\u00a77drag')) {
+      const d = JSON.parse(m.slice(6));
+      return grab(d.on, d.resize);
+    }
     if (m.startsWith('\u00a77bye')) return HOST || dismiss();
+    if (m.startsWith('\u00a77ctx')) return (FULL ? menu() : guestMenu()).popup({ window: win });
     if (m.startsWith('\u00a77view')) return setView(m.slice(6) === '3d');
     if (!m.startsWith('\u00a77need')) return;
     try {
@@ -456,7 +535,7 @@ function makeOt(opt = {}) {
       }
     }
     else if (plan.mode === 'follow') {
-      const c = screen.getCursorScreenPoint();
+      const c = cursorPoint();
       // stays a polite distance from the cursor, on the floor band
       tx = Math.max(minX, Math.min(maxX, c.x + (c.x > pos.x ? -90 : 90)));
       ty = clampY(c.y + SMALL.h / 2);
@@ -531,9 +610,9 @@ function makeOt(opt = {}) {
     return null;
   }
   async function goTo(goal) {
-    if (still) return;
+    if (still || plan.mode === 'scene' || plan.mode === 'fling') return; // a scene with another ot goes first
     if (goal === 'browser') await new Promise((r) => setTimeout(r, 900)); // let the site open first
-    const c = screen.getCursorScreenPoint();
+    const c = cursorPoint();
     const rect = (goal === 'agent' ? await findWindow(TERM) : goal === 'browser' ? await findWindow(BROWSER) : null) || { x: c.x - 1, y: c.y - 1, w: 2, h: 2, cursor: true };
     const cx = rect.x + rect.w / 2;
     // stand beside the window if there is room, otherwise inside it, near its lower corner closest to us
@@ -582,6 +661,9 @@ function makeOt(opt = {}) {
     bounds: () => ({ minX, maxX, floor }),
     close,
     // free to join a scene: shown, loaded, not held still, dragged, hovered, talking or on an errand
+    daemon: { url: base, token: opt.token || TOKEN }, // its own daemon (settings there can ask for a scene)
+    // for a scene asked from settings: errands (pointing at the terminal while an agent works) may be cut short
+    ready: () => alive() && win.isVisible() && !win.webContents.isLoading() && !asleep && Date.now() - dragged > 3000 && Date.now() > hoverUntil + 1500 && plan.mode !== 'scene' && plan.mode !== 'fling',
     free: () => alive() && win.isVisible() && !win.webContents.isLoading() && !still && !asleep && Date.now() - dragged > 8000 && Date.now() > hoverUntil + 1500 && !busy && /idle|go|hop/.test(plan.mode),
     walkTo: (x, y = pos.y, speed = 120) => (plan = { mode: 'scene', tx: Math.max(minX, Math.min(maxX, x)), ty: Math.max(minY, Math.min(floor, y)), speed, dir: plan.dir || 0 }),
     arrivedAt: () => plan.mode === 'scene' && Math.abs(plan.tx - pos.x) < 6 && Math.abs(plan.ty - pos.y) < 6 && Math.hypot(vel.x, vel.y) < 10,

package/cli/pet/pet.html

@@ -45,6 +45,12 @@
     opacity: 0; transform: translate(-50%, 6px) scale(.97); transform-origin: 50% 100%; transition: opacity .22s, transform .22s; pointer-events: none; }
   .bubble.on { opacity: 1; transform: translate(-50%, 0) scale(1); }
   .bubble::after { content: ''; position: absolute; left: 50%; top: 100%; width: 12px; height: 12px; margin: -6px 0 0 -6px; background: inherit; border: inherit; border-width: 0 1px 1px 0; transform: rotate(45deg); }
+  .bubble.asking { pointer-events: auto; -webkit-app-region: no-drag; border-color: var(--accent); }
+  .bubble .q { display: block; margin-bottom: 8px; }
+  .bubble .yn { display: flex; gap: 6px; justify-content: flex-end; }
+  .bubble .yn button { font: inherit; font-size: 12.5px; font-weight: 650; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
+  .bubble .yn button.ok { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
+  .bubble .yn button:hover { filter: brightness(1.08); }
   .dots { display: inline-flex; gap: 4px; padding: 2px 0; }
   .dots b { width: 6px; height: 6px; border-radius: 50%; background: var(--muted); animation: dot 1s infinite ease-in-out; }
   .dots b:nth-child(2) { animation-delay: .15s; } .dots b:nth-child(3) { animation-delay: .3s; }
@@ -119,8 +125,11 @@
   body.desktop .app { width: 100%; background: transparent; border: 0; box-shadow: none; border-radius: 0; overflow: visible; }
   body.desktop .top, body.desktop .who, body.desktop .level, body.desktop .stats, body.desktop .feed, body.desktop .foot { display: none; }
   body.desktop .hero { background: none; padding: 0 0 6px; }
-  body.desktop .stage { width: 140px; height: 148px; }
+  body.desktop .stage { width: calc(140px * var(--pet-scale, 1)); height: calc(148px * var(--pet-scale, 1)); } /* stretched from a corner (see 'resize' below) */
   body.desktop .stage.flip .face { transform: scaleX(-1); }
+  /* the 3D ot is framed with room under its feet (~34px at 1x) that grows with the stretch: the figure is drawn
+     lower by what that room grew, so a bigger ot still stands where it stood; the stage (hit area) stays put */
+  body.desktop.ot3d .face { top: calc(34px * (var(--pet-scale, 1) - 1)); }
   /* scenes with other ots (electron/director.cjs): the acts move .act; props (fireballs, beams, sabers, bullets) */
   .actor { position: absolute; inset: 0; z-index: 1; transform-origin: 50% 92%; }
   .props { position: absolute; inset: 0; z-index: 3; pointer-events: none; overflow: visible; }
@@ -137,7 +146,7 @@
   .bye { display: none; }
   body.desktop.guest .bye { display: flex; }
   body.desktop .bubble { max-width: 220px; font-size: 12.5px; padding: 8px 12px; }
-  body.desktop .actions { position: absolute; right: auto; left: calc(50% + 66px); bottom: 14px; transform: translateX(6px); display: flex; flex-direction: column; gap: 4px; padding: 4px; border-radius: 99px;
+  body.desktop .actions { position: absolute; right: auto; left: calc(50% + 70px * var(--pet-scale, 1) - 4px); /* beside the ot at any size: over it, it hid the corners that stretch it */ bottom: 14px; transform: translateX(6px); display: flex; flex-direction: column; gap: 4px; padding: 4px; border-radius: 99px;
     background: color-mix(in srgb, var(--panel) 86%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow); backdrop-filter: blur(10px);
     opacity: 0; transition: none; /* a transition here never finished painting in the transparent window: the menu stayed invisible */ -webkit-app-region: no-drag; z-index: 5; } /* above the 3D stage canvas (z 3) */
   body.desktop:hover .actions, body.desktop.hover .actions, body.desktop.menu .actions { opacity: 1; transform: none; } /* .hover: set by the shell, which sees the cursor even when no mouse event reaches the page */
@@ -213,17 +222,17 @@
 <script type="module">
   const BOOT = __BOOT__;
   const T = {
-    en: { settings: 'Settings', dismiss: 'Send home', listen: 'Listen', listening: 'Listening… 🎙️', noStt: 'Voice control needs an OpenAI or ElevenLabs key (Settings).', noMic: 'I can’t reach the microphone.', sttErr: 'I didn’t catch that.', talk: 'Talk', askPh: 'Remind me to check email in 10 min…', feed: 'Treat', play: 'Play', sleep: 'Sleep', wake: 'Wake', food: 'Food', energy: 'Energy', fun: 'Fun', level: 'Level {l}', xp: '{x} / {n} xp', live: 'Live', off: 'Reconnecting…',
+    en: { settings: 'Settings', dismiss: 'Send home', listen: 'Listen', listening: 'Listening… 🎙️', noStt: 'Voice control needs an OpenAI or ElevenLabs key (Settings).', noMic: 'I can’t reach the microphone.', sttErr: 'I didn’t catch that.', talk: 'Talk', askPh: 'Remind me to check email in 10 min…', feed: 'Treat', play: 'Play', sleep: 'Sleep', wake: 'Wake', food: 'Food', energy: 'Energy', fun: 'Fun', level: 'Level {l}', xp: '{x} / {n} xp', live: 'Live', off: 'Reconnecting…', approve: 'Approve', reject: 'Reject',
       activity: 'Activity', empty: 'Nothing yet. Run a command or ask your coding agent something.', tally: '{ok} ok · {fail} failed · turns {turns}',
       brain: 'Brain: {b}', age: 'Born {d}', lines: 'built-in phrases', now: 'now', m: '{n}m', h: '{n}h',
       moods: { happy: 'Happy', neutral: 'Calm', sad: 'Sad', disgust: 'Bored', sleep: 'Asleep', thinking: 'Thinking' },
       kind: { tool: 'Tool', shell: 'Shell', prompt: 'You asked', stop: 'Turn finished', notify: 'Needs you', start: 'Session started' } },
-    es: { settings: 'Ajustes', dismiss: 'Despedir', listen: 'Escuchar', listening: 'Te escucho… 🎙️', noStt: 'Para hablarme por voz falta una key de OpenAI o ElevenLabs (Ajustes).', noMic: 'No puedo usar el micrófono.', sttErr: 'No te entendí.', talk: 'Hablar', askPh: 'Recuérdame ver el correo en 10 min…', feed: 'Mimar', play: 'Jugar', sleep: 'Dormir', wake: 'Despertar', food: 'Comida', energy: 'Energía', fun: 'Diversión', level: 'Nivel {l}', xp: '{x} / {n} xp', live: 'En vivo', off: 'Reconectando…',
+    es: { settings: 'Ajustes', dismiss: 'Despedir', listen: 'Escuchar', listening: 'Te escucho… 🎙️', noStt: 'Para hablarme por voz falta una key de OpenAI o ElevenLabs (Ajustes).', noMic: 'No puedo usar el micrófono.', sttErr: 'No te entendí.', talk: 'Hablar', askPh: 'Recuérdame ver el correo en 10 min…', feed: 'Mimar', play: 'Jugar', sleep: 'Dormir', wake: 'Despertar', food: 'Comida', energy: 'Energía', fun: 'Diversión', level: 'Nivel {l}', xp: '{x} / {n} xp', live: 'En vivo', off: 'Reconectando…', approve: 'Aprobar', reject: 'Rechazar',
       activity: 'Actividad', empty: 'Nada todavía. Ejecuta un comando o pregúntale algo a tu agente.', tally: '{ok} ok · {fail} fallos · turnos {turns}',
       brain: 'Cerebro: {b}', age: 'Nació {d}', lines: 'frases propias', now: 'ahora', m: '{n} min', h: '{n} h',
       moods: { happy: 'Feliz', neutral: 'Tranquilo', sad: 'Triste', disgust: 'Aburrido', sleep: 'Dormido', thinking: 'Pensando' },
       kind: { tool: 'Herramienta', shell: 'Terminal', prompt: 'Preguntaste', stop: 'Turno terminado', notify: 'Te necesita', start: 'Sesión iniciada' } },
-    pt: { settings: 'Ajustes', dismiss: 'Despedir', listen: 'Ouvir', listening: 'Estou ouvindo… 🎙️', noStt: 'Para falar por voz falta uma key da OpenAI ou ElevenLabs (Ajustes).', noMic: 'Não consigo usar o microfone.', sttErr: 'Não entendi.', talk: 'Falar', askPh: 'Me lembre de ver o e-mail em 10 min…', feed: 'Mimar', play: 'Brincar', sleep: 'Dormir', wake: 'Acordar', food: 'Comida', energy: 'Energia', fun: 'Diversão', level: 'Nível {l}', xp: '{x} / {n} xp', live: 'Ao vivo', off: 'Reconectando…',
+    pt: { settings: 'Ajustes', dismiss: 'Despedir', listen: 'Ouvir', listening: 'Estou ouvindo… 🎙️', noStt: 'Para falar por voz falta uma key da OpenAI ou ElevenLabs (Ajustes).', noMic: 'Não consigo usar o microfone.', sttErr: 'Não entendi.', talk: 'Falar', askPh: 'Me lembre de ver o e-mail em 10 min…', feed: 'Mimar', play: 'Brincar', sleep: 'Dormir', wake: 'Acordar', food: 'Comida', energy: 'Energia', fun: 'Diversão', level: 'Nível {l}', xp: '{x} / {n} xp', live: 'Ao vivo', off: 'Reconectando…', approve: 'Aprovar', reject: 'Recusar',
       activity: 'Atividade', empty: 'Nada ainda. Rode um comando ou pergunte algo ao seu agente.', tally: '{ok} ok · {fail} falhas · turnos {turns}',
       brain: 'Cérebro: {b}', age: 'Nasceu {d}', lines: 'frases próprias', now: 'agora', m: '{n} min', h: '{n} h',
       moods: { happy: 'Feliz', neutral: 'Tranquilo', sad: 'Triste', disgust: 'Entediado', sleep: 'Dormindo', thinking: 'Pensando' },
@@ -272,6 +281,7 @@
   }
   ch ||= createCharacter($('#face'), spec, { locale: lang, title: id.name });
   const is3d = !!ch.character;
+  document.body.classList.toggle('ot3d', is3d);
   // While a gesture/effect/morph plays the ot needs room around it (wings, hearts, confetti): the desktop
   // shell reads window.__need() and sizes the window to what is really on screen.
   let fxUntil = 0;
@@ -319,6 +329,7 @@
     }
     if (document.body.classList.contains('talking')) (w = Math.max(w, 240)), (h = Math.max(h, st.height + 60));
     if (Date.now() < actUntil) (w = Math.max(w, actRoom * 2)), (h = Math.max(h, st.height + 70));
+    w = Math.max(w, st.width + 2 * 58); // the menu beside it (shown on hover)
     return { w: Math.ceil(w), h: Math.ceil(h) };
   };
   // The shell polls __need every 250 ms; when an effect starts it's told at once (a console line it listens
@@ -341,9 +352,53 @@
     const r = $('#stage').getBoundingClientRect();
     return e.clientX >= r.left && e.clientX <= r.right && e.clientY >= r.top && e.clientY <= r.bottom;
   };
+  // Size: grabbing the ot by a corner stretches it (bigger or smaller) instead of moving it; remembered per ot.
+  const SCALE_KEY = `7ots.petScale${guest ? `.${guest}` : ''}`;
+  let scale = 1;
+  try {
+    scale = Math.max(0.6, Math.min(2, Number(localStorage.getItem(SCALE_KEY)) || 1));
+  } catch {}
+  const setScale = (k) => ((scale = k), document.documentElement.style.setProperty('--pet-scale', k.toFixed(3)), tellNeed());
+  if (desktop && scale !== 1) setScale(scale);
+  const CORNER = 22;
+  // which corner of the ot the pointer is on ('nw' | 'ne' | 'sw' | 'se'), or ''
+  const cornerAt = (e) => {
+    if (!desktop || !onOt(e)) return '';
+    const r = $('#stage').getBoundingClientRect();
+    const v = e.clientY - r.top < CORNER ? 'n' : r.bottom - e.clientY < CORNER ? 's' : '';
+    const h = e.clientX - r.left < CORNER ? 'w' : r.right - e.clientX < CORNER ? 'e' : '';
+    return v && h ? v + h : '';
+  };
   if (desktop) {
     let down = false;
-    const up = () => down && ((down = false), console.debug('\u00a77drag' + JSON.stringify({ on: false })));
+    let sizing = null;
+    let pulled = null; // { m, on }: a drag that started off the corners
+    const up = () => {
+      if (pulled?.on) {
+        ch.unmorph?.(pulled.m); // let go: back into shape
+        fxUntil = Date.now() + 600; // room while it eases back
+      }
+      pulled = null;
+      if (sizing) {
+        sizing = null;
+        try {
+          localStorage.setItem(SCALE_KEY, String(scale));
+        } catch {}
+      }
+      if (down) (down = false), console.debug('\u00a77drag' + JSON.stringify({ on: false }));
+    };
+    addEventListener('pointermove', (e) => {
+      if (sizing) {
+        // the ot stays anchored at its feet, centred: sideways it grows on both sides, so a corner moves half as much
+        const dx = (e.screenX - sizing.x) * (sizing.c[1] === 'e' ? 1 : -1) * 2;
+        const dy = (e.screenY - sizing.y) * (sizing.c[0] === 's' ? 1 : -1);
+        const k = sizing.k * ((140 * sizing.k + dx) / (140 * sizing.k) + (148 * sizing.k + dy) / (148 * sizing.k)) / 2;
+        return setScale(Math.max(0.6, Math.min(2, k)));
+      }
+      if (down) return;
+      const c = cornerAt(e);
+      document.body.style.cursor = c ? (c === 'nw' || c === 'se' ? 'nwse-resize' : 'nesw-resize') : '';
+    });
     // on the document: in 3D the ot is drawn on a canvas above the page, so events don't target #stage
     addEventListener('pointerdown', (e) => {
       // on the ot itself, or on the move handle in the menu (a sure grip while the ot is mid-animation)
@@ -351,14 +406,50 @@
       if (e.button !== 0 || (!grip && (e.target.closest?.('.actions, .ask, a, button') || !onOt(e)))) return;
       down = true;
       document.documentElement.setPointerCapture?.(e.pointerId);
-      console.debug('\u00a77drag' + JSON.stringify({ on: true }));
+      const c = !grip && cornerAt(e);
+      if (c) sizing = { c, x: e.screenX, y: e.screenY, k: scale };
+      else if (!grip) {
+        const r = $('#stage').getBoundingClientRect();
+        const side = Math.abs(e.clientX - (r.left + r.width / 2)) / r.width > Math.abs(e.clientY - (r.top + r.height / 2)) / r.height;
+        pulled = { m: side ? 'squish' : 'stretch', on: false };
+      }
+      // resizing: the shell keeps the mouse but leaves the window where it is
+      console.debug('\u00a77drag' + JSON.stringify({ on: true, resize: !!c }));
+    });
+    // pulled by a side or the top: once the shell says the window is really being carried (the page sees
+    // almost no pointer motion then: the window moves with the hand), it stretches toward the pull — wider
+    // from a side, taller from above or below — until it's let go
+    addEventListener('message', (e) => {
+      if (!e.data?.carried || !pulled || pulled.on) return;
+      pulled.on = true;
+      fxUntil = Infinity; // room around it for as long as it's held stretched
+      ch.morph?.(pulled.m, { hold: true });
+      tellNeed();
     });
     for (const ev of ['pointerup', 'pointercancel', 'lostpointercapture']) addEventListener(ev, up);
     addEventListener('blur', up);
   }
   let lookFree = 0; // while > now, the eyes wander on their own (a glance) instead of following the cursor
   addEventListener('pointermove', (e) => Date.now() > lookFree && ch.lookAtPoint(e.clientX, e.clientY));
-  $('#face').addEventListener('click', () => ch.gesture('bounce'));
+  // A click on the ot pokes it: it gets squished and, poked again and again, more and more annoyed.
+  // Waits a beat so a double click (the menu) doesn't count as two pokes; a drag or a stretch isn't a poke.
+  let pressAt = null, pokeT = 0, pokes = 0, pokedAt = 0;
+  addEventListener('pointerdown', (e) => (pressAt = { x: e.screenX, y: e.screenY }));
+  addEventListener('click', (e) => {
+    clearTimeout(pokeT);
+    if (e.detail > 1 || !onOt(e) || e.target.closest?.('.actions, .ask, .bubble.asking, a, button')) return;
+    if (pressAt && Math.hypot(e.screenX - pressAt.x, e.screenY - pressAt.y) > 4) return;
+    pokeT = setTimeout(poke, 240);
+  });
+  function poke() {
+    pokes = Date.now() - pokedAt < 2500 ? pokes + 1 : 1;
+    pokedAt = Date.now();
+    lookFree = 0;
+    ch.morph?.('squish', { ms: 420 });
+    if (pokes === 1) ch.gesture('bounce');
+    else if (pokes <= 3) (ch.gesture('surprise'), ch.effect?.('exclaim'));
+    else (ch.gesture(pokes % 2 ? 'stomp' : 'shake'), ch.effect?.('anger'), pokes >= 6 && ch.effect?.('steam'));
+  }
 
   const post = (path, body) => fetch(path, { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-7ots-Token': BOOT.token }, body: JSON.stringify(body) });
   let asleep = false;
@@ -501,6 +592,8 @@
     speechSynthesis.speak(u);
   }
   function showBubble(content, ms) {
+    if (asking && !content.classList?.contains('askq')) return; // a question waiting for you stays until answered
+    bubble.classList.remove('asking');
     bubble.replaceChildren(content);
     bubble.classList.add('on');
     clearTimeout(hideT);
@@ -537,6 +630,42 @@
     if (withFace) react(text);
     speak(text);
   }
+  // It asks before acting for you (Orquesta…): Approve / Reject in the bubble, answered on POST /approve.
+  let asking = null;
+  function ask4(a) {
+    if (a.done) {
+      if (asking !== a.id) return;
+      asking = null;
+      bubble.classList.remove('on', 'asking');
+      return;
+    }
+    asking = null;
+    const box = document.createElement('div');
+    box.className = 'askq';
+    const q = document.createElement('span');
+    q.className = 'q';
+    q.textContent = a.text;
+    const yn = document.createElement('div');
+    yn.className = 'yn';
+    const btn = (ok) => {
+      const b = document.createElement('button');
+      b.type = 'button';
+      b.textContent = t(ok ? 'approve' : 'reject');
+      if (ok) b.className = 'ok';
+      b.addEventListener('click', () => {
+        yn.querySelectorAll('button').forEach((x) => (x.disabled = true));
+        post('/approve', { id: a.id, ok }).catch(() => {});
+      });
+      return b;
+    };
+    yn.append(btn(false), btn(true));
+    box.append(q, yn);
+    showBubble(box, 0);
+    bubble.classList.add('asking');
+    asking = a.id;
+    ch.gesture('think');
+    speak(a.text);
+  }
   function setThinking(on) {
     if (on === thinking) return;
     thinking = on;
@@ -546,7 +675,7 @@
       d.className = 'dots';
       d.innerHTML = '<b></b><b></b><b></b>';
       showBubble(d, 0);
-    } else if (bubble.querySelector('.dots')) bubble.classList.remove('on');
+    } else if (!asking && bubble.querySelector('.dots')) bubble.classList.remove('on');
   }
 
   // ── live updates ──
@@ -582,6 +711,7 @@
       if (guest) return; // the host's events are the host's
       if (m.stir || (m.say && asleep && Date.now() < stirUntil)) stir(); // awake until it has said it
       if (m.state) render(m.state);
+      if (m.ask) ask4(m.ask); // before thinking: an approved ask hands the bubble back to the dots
       if ('thinking' in m) setThinking(!!m.thinking);
       if (m.activity) addActivity(m.activity);
       if (m.gesture) ch.gesture(m.gesture);
@@ -600,6 +730,7 @@
   askIn.placeholder = t('askPh');
   $('#setBtn').href = `/settings?token=${encodeURIComponent(BOOT.token)}`;
   $('#setBtn').title = t('settings');
+  if (!desktop) $('#setBtn').removeAttribute('target'); // in a browser tab, Settings opens in place (its Back returns here); the desktop window opens a tab
   $('#byeBtn').title = t('dismiss');
   $('#byeBtn').addEventListener('click', () => console.debug('\u00a77bye')); // the shell sends the visitor home
   const talking = (on) => {
@@ -617,6 +748,14 @@
     clearTimeout(menuT);
     if (on) menuT = setTimeout(() => document.body.classList.remove('menu'), 8000);
   });
+  // right click: the shell's menu (settings, talk, sleep, hide…) at the cursor. Asked for by name: Electron's own
+  // 'context-menu' event didn't reach the shell from this transparent click-through window on Linux.
+  if (desktop)
+    addEventListener('contextmenu', (e) => {
+      if (e.target.closest?.('.ask input')) return; // the talk box keeps copy/paste
+      e.preventDefault();
+      console.debug('\u00a77ctx');
+    });
   askIn.addEventListener('keydown', (e) => e.key === 'Escape' && talking(false));
   ask.addEventListener('submit', async (e) => {
     e.preventDefault();
@@ -834,7 +973,7 @@
       [hungry ? 1.2 : 0, () => (ch.gesture('point'), ch.effect?.('thought'))],
       [0.6, () => ch.effect?.('blush')],
       [0.3, () => ch.gesture('shiver')],
-      [1.2, () => ch.morph?.(pick(['puff', 'squish', 'stretch', 'jelly']), { ms: 1600 + Math.random() * 1600 })],
+      [1.2, () => ch.morph?.(pick(['puff', 'squish', 'stretch']), { ms: 1600 + Math.random() * 1600 })],
       [0.7, () => ch.morph?.(pick(['wings', 'horns', 'spikes', 'hands']), { ms: 2500 + Math.random() * 2500 })],
       [0.8, () => ch.morph?.(`shape:${pick(SHAPES)}`, { ms: 2500 + Math.random() * 3000 })],
     ])?.();