nio-cat 0.9.11 → 0.9.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nio-cat",
-  "version": "0.9.11",
+  "version": "0.9.13",
   "description": "nio: fes servir Claude Code, Codex, Grok, Antigravity i Ollama del teu ordinador des del mòbil.",
   "license": "UNLICENSED",
   "author": "f.cat",

package/src/agents/claude.js

@@ -23,10 +23,9 @@ module.exports = {
     // Que l'agent posi un títol que resumeixi la feina (eina MCP de nio; el hub el desa).
     args.push('--append-system-prompt', 'Treballes dins una sessió de nio. Quan entenguis la tasca, crida l’eina mcp__nio__sessio_titol amb un títol de 3-7 paraules que la resumeixi, en l’idioma de l’usuari; torna-la a cridar només si la feina canvia de tema.');
 
-    if (session.mode === 'tot' && process.getuid?.() === 0) {
-      ctx.fail('Claude Code no deixa el mode «Via lliure» quan s’executa com a root. Canvia els permisos a «Demana permís» o engega nio amb un usuari normal.');
-      return { kill() {} };
-    }
+    // Com a root (un VPS), Claude Code no accepta bypassPermissions: «Via lliure» hi fa servir el mode auto,
+    // que també treballa sol però fa revisar cada acció a un classificador (el mateix que el Claude Code remot).
+    const root = process.getuid?.() === 0;
 
     const env = {};
     const gate = (extra = {}) => {
@@ -38,7 +37,7 @@ module.exports = {
     if (session.mode === 'llegir') {
       args.push('--permission-mode', 'plan');
     } else if (session.mode === 'tot') {
-      args.push('--permission-mode', 'bypassPermissions');
+      args.push('--permission-mode', root ? 'auto' : 'bypassPermissions');
       // Amb el control del navegador o l'escriptori actiu, les ordres que hi actuen sempre es pregunten.
       if (control) gate({ NIO_GATE: 'tot' });
     } else {

package/src/notes.js

@@ -195,9 +195,11 @@ class Notes {
   async liveTranscribe(n, sg) {
     if (!this.notes.includes(n)) return;
     try {
-      const { text } = await voice.transcribe(this.cfg, fs.readFileSync(this.liveFile(n, sg)), sg.mime, n.live.lang);
-      const t = String(text || '').replace(/\s+/g, ' ').trim();
-      sg.text = HALLUCINATION.test(t) ? '' : t; sg.state = 'ok'; sg.error = '';
+      // El final del tros anterior fa de context: Whisper hi enganxa millor les frases i hi escriu igual els noms.
+      const prev = n.live.segs.filter((x) => x.seq < sg.seq && x.text).pop()?.text || '';
+      const { text } = await voice.transcribe(this.cfg, fs.readFileSync(this.liveFile(n, sg)), sg.mime, n.live.lang, { prompt: prev.slice(-200) });
+      const t = unloop(String(text || '').replace(/\s+/g, ' ').trim());
+      sg.text = HALLUCINATION.test(t) || (prev && t === prev) ? '' : t; sg.state = 'ok'; sg.error = '';
     } catch (e) {
       sg.state = 'error'; sg.error = String(e.message || e).slice(0, 300);
     }
@@ -218,8 +220,8 @@ class Notes {
         const pick = await this.pickEngine(L.engine);
         if (!pick) return; // sense model: al final es deixa la transcripció
         const part = { from: ready[0].seq, to: ready[ready.length - 1].seq, text: '', error: '' };
-        if (text.trim().length > 40) {
-          try { part.text = (await this.ask(pick, LIVE_TASKS.part[L.kind], text, false)).text.trim(); }
+        if (words(text) >= MIN_WORDS) {
+          try { part.text = cleanOut((await this.ask(pick, LIVE_TASKS.part[L.kind], text, false)).text); }
           catch (e) { part.error = String(e.message || e).slice(0, 200); }
         }
         if (!this.notes.includes(n)) return;
@@ -260,6 +262,11 @@ class Notes {
         await this.liveParts(n, true);
         const transcript = L.segs.map((x) => x.text).filter(Boolean).join(' ').trim();
         if (!transcript) throw new Error('No s’ha transcrit res: no hi ha res a resumir.');
+        // Amb quatre paraules, el model no té res a resumir i acaba resumint les seves instruccions.
+        if (words(transcript) < MIN_WORDS) {
+          if (!n.text.trim()) n.text = transcript;
+          throw new Error('Hi ha massa poca transcripció per fer-ne un resum: l’he deixada a la nota. Comprova que el micròfon capti bé la veu.');
+        }
         const pick = await this.pickEngine(L.engine);
         if (!pick) {
           if (!n.text.trim()) n.text = transcript;
@@ -274,11 +281,19 @@ class Notes {
           for (const b of blocks) { const g = groups[groups.length - 1]; if (g && g.join('\n\n').length + b.length < max * 0.8) g.push(b); else groups.push([b]); }
           if (groups.length === blocks.length) groups.splice(0, groups.length, ...Array.from({ length: Math.ceil(blocks.length / 2) }, (_, i) => blocks.slice(i * 2, i * 2 + 2)));
           blocks = [];
-          for (const g of groups) blocks.push((await this.ask(pick, LIVE_TASKS.condense, g.join('\n\n'), false)).text.trim());
+          for (const g of groups) blocks.push(cleanOut((await this.ask(pick, LIVE_TASKS.condense, g.join('\n\n'), false)).text) || g.join('\n\n').slice(0, max / 2));
+        }
+        let r = await this.ask(pick, LIVE_TASKS.final[L.kind], blocks.join('\n\n').slice(0, max), true);
+        if (echoes(r.text) || echoes(r.title)) r = await this.ask(pick, LIVE_TASKS.final[L.kind], blocks.join('\n\n').slice(0, max), true); // un segon intent
+        if (echoes(r.text) || echoes(r.title)) {
+          if (!n.text.trim()) n.text = transcript;
+          throw new Error('El model ha resumit les instruccions en lloc de la classe. He deixat la transcripció a la nota: torna-ho a provar amb un model més gran.');
         }
-        const r = await this.ask(pick, LIVE_TASKS.final[L.kind], blocks.join('\n\n').slice(0, max), true);
         const text = str(r.text, 200000).trim();
-        if (!text) throw new Error('El model no ha tornat cap resum. Torna-ho a provar o tria’n un altre.');
+        if (!text) {
+          if (!n.text.trim()) n.text = transcript;
+          throw new Error('El model diu que la transcripció no té prou contingut per resumir-la. L’he deixada a la nota.');
+        }
         if (!this.notes.includes(n)) return;
         const title = str(r.title, 120).trim();
         if (title && n.title === L.autoTitle) { n.title = `${title}`; L.autoTitle = n.title; }
@@ -300,7 +315,7 @@ class Notes {
 
   async ask(pick, task, body, json) {
     const local = pick.id.startsWith('ollama:'), wrap = !json && local;
-    const user = `--- TRANSCRIPCIÓ ---\n${body}\n--- FI ---\n\n${task}${wrap ? '\n\nTorna només JSON amb aquest format: {"text":"…"}. El text pot tenir salts de línia.' : ''}`;
+    const user = `--- TRANSCRIPCIÓ ---\n${body}\n--- FI ---\n\n${task}\n\nFes-ho només amb el que es diu entre «--- TRANSCRIPCIÓ ---» i «--- FI ---». No parlis d’aquestes instruccions ni de tu mateix. Si la transcripció no té prou contingut, torna el text buit.${wrap ? '\n\nTorna només JSON amb aquest format: {"text":"…"}. El text pot tenir salts de línia.' : ''}`;
     const raw = await runModel(this.cfg, pick.id, LIVE_SYSTEM, user, json || wrap, { numCtx: local ? 8192 : 0 });
     return json ? parseJson(raw) : wrap ? { text: String(parseJson(raw).text ?? '') } : { text: raw };
   }
@@ -419,6 +434,18 @@ const LIVE_LANGS = ['ca', 'es', 'en'];
 const PART_CHARS = 3500; // ≈ 4-5 minuts de veu per tros d'apunts
 // Whisper s'inventa aquestes frases quan sent silenci o soroll.
 const HALLUCINATION = /^[\s.…]*$|^(gràcies( per (veure|mirar|escoltar)[^.!]*)?|subtítols[^.!]*|amara\.org[^.!]*|gracias( por (ver|mirar)[^.!]*)?|subtítulos[^.!]*|thank you( for watching)?|thanks for watching)[.!…\s]*$/i;
+const MIN_WORDS = 25; // per sota, no hi ha res a apuntar ni a resumir
+const words = (t) => (String(t || '').match(/[\p{L}\p{N}]+/gu) || []).length;
+// Whisper de vegades es queda encallat repetint la mateixa frase: se'n deixa una.
+function unloop(t) {
+  let out = t;
+  for (let n = 1; n <= 12; n++) out = out.replace(new RegExp(`((?:\\S+\\s+){${n - 1}}\\S+)(?:\\s+\\1(?![\\p{L}\\p{N}])){3,}`, 'gu'), '$1');
+  return out;
+}
+// La resposta parla de les instruccions (el «system prompt») en lloc de la transcripció.
+const ECHO = /assistent de notes|transcripci[óo] autom[àa]tica|no t[’']inventis|no facis servir cap eina|---\s*(TRANSCRIPCI[ÓO]|FI)\s*---|torna nom[ée]s json|en l[’']idioma de la transcripci[óo]|les meves instruccions|system prompt/i;
+const echoes = (t) => ECHO.test(String(t || ''));
+const cleanOut = (t) => { const v = String(t || '').trim(); return echoes(v) ? '' : v; };
 const LIVE_SYSTEM = 'Ets l’assistent de notes de nio. Treballes amb la transcripció automàtica d’una classe o d’una reunió: pot tenir paraules mal transcrites, que pots corregir quan el context ho deixa clar. No t’inventis res que no s’hi digui. Respon en l’idioma de la transcripció (si dubtes, en català). No facis servir cap eina.';
 const LIVE_TASKS = {
   part: {

package/src/voice.js

@@ -103,13 +103,13 @@ function status(cfg) {
   };
 }
 
-async function transcribe(cfg, audio, mime, lang) {
+async function transcribe(cfg, audio, mime, lang, opts = {}) {
   const p = pick(cfg, 'stt');
   lang = lang || cfgOf(cfg).lang || 'ca';
   const l = lang === 'auto' ? '' : lang; // «auto»: que el proveïdor ho endevini
   if (!p) throw httpErr(400, 'Aquest ordinador encara no té veu. Activa Whisper (gratis) o posa una clau a Ajustos → Veu.');
   if (!audio?.length) throw httpErr(400, 'No hi ha àudio');
-  if (p === 'whisper') return { text: await whisper.transcribe(cfg, audio, mime, lang), provider: p };
+  if (p === 'whisper') return { text: await whisper.transcribe(cfg, audio, mime, lang, opts), provider: p };
   return { text: (await PROVIDERS[p].stt(cfg.voice.keys[p], audio, mime, l)).trim(), provider: p };
 }
 

package/src/whisper.js

@@ -120,7 +120,7 @@ function ext(mime) {
   return /ogg/.test(mime || '') ? 'ogg' : /mp4|m4a|aac/.test(mime || '') ? 'm4a' : /mpeg|mp3/.test(mime || '') ? 'mp3' : /wav/.test(mime || '') ? 'wav' : 'webm';
 }
 
-async function transcribe(cfg, audio, mime, lang = 'ca') {
+async function transcribe(cfg, audio, mime, lang = 'ca', { prompt = '' } = {}) {
   const e = engine();
   if (!e) throw httpErr(400, `Falta Whisper en aquest ordinador. Instal·la’l: ${installHint()}`);
   const tmp = fs.mkdtempSync(path.join(os.tmpdir(), 'nio-veu-'));
@@ -128,7 +128,7 @@ async function transcribe(cfg, audio, mime, lang = 'ca') {
     const input = path.join(tmp, `audio.${ext(mime)}`);
     fs.writeFileSync(input, audio);
     if (e === 'python') {
-      await run(pyBin(), [input, '--model', 'turbo', ...(lang === 'auto' ? [] : ['--language', lang]), '--output_format', 'txt', '--output_dir', tmp, '--fp16', 'False', '--verbose', 'False']);
+      await run(pyBin(), [input, '--model', 'turbo', ...(lang === 'auto' ? [] : ['--language', lang]), '--output_format', 'txt', '--output_dir', tmp, '--fp16', 'False', '--verbose', 'False', ...(prompt ? ['--initial_prompt', prompt] : [])]);
       return fs.readFileSync(path.join(tmp, 'audio.txt'), 'utf8').trim();
     }
     if (!fs.existsSync(modelPath(cfg))) {
@@ -138,7 +138,7 @@ async function transcribe(cfg, audio, mime, lang = 'ca') {
     const wav = path.join(tmp, 'audio.wav');
     await run(which('ffmpeg'), ['-nostdin', '-loglevel', 'error', '-i', input, '-ar', '16000', '-ac', '1', '-c:a', 'pcm_s16le', wav], 60000);
     const threads = String(Math.max(1, Math.min(8, os.cpus().length - 1)));
-    const out = await run(cppBin(), ['-m', modelPath(cfg), '-f', wav, '-l', lang, '-t', threads, '-nt', '-np']);
+    const out = await run(cppBin(), ['-m', modelPath(cfg), '-f', wav, '-l', lang, '-t', threads, '-nt', '-np', ...(prompt ? ['--prompt', prompt] : [])]);
     return out.split('\n').map((l) => l.trim()).filter((l) => l && !/^\[(BLANK_AUDIO|Música|Music)\]$/i.test(l)).join(' ').trim();
   } finally {
     fs.rm(tmp, { recursive: true, force: true }, () => {});

package/web/app/app.js

@@ -583,7 +583,7 @@ function renderChrome() {
 }
 let notesCtl = null, callCtl = null;
 const getCall = () => (callCtl ||= createCall({ api, esc, toast, bot, machine, isDemo, noMachine, voiceSheet, agentName: (a) => AGENT_NAMES[a] || a, sessions: () => [...state.sessions.values()], approvals: () => [...state.approvals.keys()], refresh: () => {} }));
-const getNotes = () => (notesCtl ||= createNotes({ api, nodeAudio, toast, esc, machine, voiceOn, voiceSheet, isDemo, isPhone, openSheet, closeSheet, mobileQrSheet }));
+const getNotes = () => (notesCtl ||= createNotes({ api, nodeAudio, toast, esc, machine, voiceOn, voiceSheet, isDemo, isPhone, openSheet, closeSheet, mobileQrSheet, nodeVersion: () => state.info?.version || '', nodeAtLeast: (v) => !state.info || verAtLeast(state.info.version, v), installCmd: INSTALL_CMD }));
 function render() {
   const r = state.route, view = $('#view'), board = r.name === 'pissarra';
   if (r.name !== 'sessions') manage = null;
@@ -738,10 +738,12 @@ function noMachine(text) {
 function viewSettings() {
   const head = '<div class="top"><div><h1>Ajustos</h1><p>Avisos al mòbil, veu i Telegram. Es configuren per a cada ordinador.</p></div></div>';
   if (!machine()) return `${head}<div class="stack-lg" style="max-width:640px">${settingsOff()}</div>`;
-  const avisos = machine() ? `<section class="panel"><header><h2>Avisos al mòbil</h2></header><div class="body stack"><p class="small">Rep un avís quan un agent et demana permís o acaba la feina.</p>${isIOS && !standalone ? '<p class="muted small">A l’iPhone, primer afegeix nio a la pantalla d’inici (Comparteix → Afegeix a la pantalla d’inici) i obre’l des d’allà.</p>' : ''}${pushOn ? '<p class="small"><span class="chip ok">' + svg(ICON.check) + 'Avisos activats en aquest dispositiu</span></p>' : ''}<div class="row">${pushOn ? '<button class="btn ink grow" data-act="push-test" type="button">Envia’n un de prova</button><button class="btn" data-act="push-off" type="button">Desactiva</button>' : '<button class="btn ink grow" data-act="push" type="button">Activa els avisos</button>'}</div></div></section>` : '';
+  const avisos = window.NioAndroid && machine() ? '<section class="panel"><header><h2>Avisos al mòbil</h2></header><div class="body stack"><p class="small">Dins l’app d’Android, els avisos encara no hi són. Per rebre’ls, connecta Telegram aquí sota o activa’ls obrint nio.cat al navegador.</p></div></section>' : machine() ? `<section class="panel"><header><h2>Avisos al mòbil</h2></header><div class="body stack"><p class="small">Rep un avís quan un agent et demana permís o acaba la feina.</p>${isIOS && !standalone ? '<p class="muted small">A l’iPhone, primer afegeix nio a la pantalla d’inici (Comparteix → Afegeix a la pantalla d’inici) i obre’l des d’allà.</p>' : ''}${pushOn ? '<p class="small"><span class="chip ok">' + svg(ICON.check) + 'Avisos activats en aquest dispositiu</span></p>' : ''}<div class="row">${pushOn ? '<button class="btn ink grow" data-act="push-test" type="button">Envia’n un de prova</button><button class="btn" data-act="push-off" type="button">Desactiva</button>' : '<button class="btn ink grow" data-act="push" type="button">Activa els avisos</button>'}</div></div></section>` : '';
   if (machine() && pushOn === null) refreshPush();
   if (machine() && tgState === undefined) loadTelegram();
-  return `${head}<div class="stack-lg cols">${avisos}${voicePanel()}<div id="tgPanel">${telegramPanel()}</div></div>`;
+  // App d'Android: només es proposa des del navegador d'un mòbil Android (dins l'app ja no cal).
+  const android = /Android/i.test(navigator.userAgent) && !window.NioAndroid ? `<section class="panel"><header><h2>App d’Android</h2></header><div class="body stack"><p class="small">nio a pantalla completa i, sobretot, <b>classes i reunions que es continuen gravant amb la pantalla bloquejada</b>. En instal·lar-la, el navegador et demanarà permís per instal·lar apps d’aquesta font. Dins l’app, torna a connectar l’ordinador amb el QR.</p><div class="row"><a class="btn ink grow" href="/nio-android.apk" download="nio.apk">Baixa l’app (APK)</a></div></div></section>` : '';
+  return `${head}<div class="stack-lg cols">${android}${avisos}${voicePanel()}<div id="tgPanel">${telegramPanel()}</div></div>`;
 }
 // Ajustos sense ordinador: un sol avís a dalt i les seccions de mostra, desactivades.
 function settingsOff() {
@@ -806,15 +808,27 @@ async function sshAdd(target, onStep, via) {
   if (!last || last.error) throw new Error(last?.error || 'S’ha tallat la connexió');
   return last;
 }
+// Lector de QR: BarcodeDetector si el navegador en té; si no (Firefox, l'app d'Android), jsQR, que llegeix la imatge en JavaScript.
+let jsQRload = null;
+const loadJsQR = () => (jsQRload ||= new Promise((ok, ko) => { const s = document.createElement('script'); s.src = 'https://cdn.jsdelivr.net/npm/jsqr@1.4.0/dist/jsQR.min.js'; s.onload = () => (window.jsQR ? ok(window.jsQR) : ko(new Error('jsQR'))); s.onerror = () => { jsQRload = null; ko(new Error('No he pogut carregar el lector de QR')); }; document.head.appendChild(s); }));
 async function startScan(video, onText) {
-  const det = new BarcodeDetector({ formats: ['qr_code'] });
+  let detect;
+  if ('BarcodeDetector' in window) { const det = new BarcodeDetector({ formats: ['qr_code'] }); detect = async () => (await det.detect(video))[0]?.rawValue; }
+  else {
+    const jsQR = await loadJsQR(), cv = document.createElement('canvas'), g = cv.getContext('2d', { willReadFrequently: true });
+    detect = async () => {
+      const w = Math.min(640, video.videoWidth), h = Math.round(video.videoHeight * (w / video.videoWidth)); if (!w || !h) return null;
+      cv.width = w; cv.height = h; g.drawImage(video, 0, 0, w, h);
+      return jsQR(g.getImageData(0, 0, w, h).data, w, h, { inversionAttempts: 'dontInvert' })?.data;
+    };
+  }
   const stream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: 'environment' } });
   video.srcObject = stream; await video.play(); let alive = true;
-  (async () => { while (alive) { try { const r = await det.detect(video); if (r[0]) onText(r[0].rawValue); } catch { /* quadre sense QR */ } await sleep(250); } })();
+  (async () => { while (alive) { try { const t = await detect(); if (t) onText(t); } catch { /* quadre sense QR */ } await sleep(250); } })();
   return { stop() { alive = false; stream.getTracks().forEach((t) => t.stop()); } };
 }
 function addComputerSheet(tab, opts = {}) {
-  const phone = isPhone(), canScan = 'BarcodeDetector' in window && !!navigator.mediaDevices?.getUserMedia;
+  const phone = isPhone(), canScan = !!navigator.mediaDevices?.getUserMedia;
   const TABS = phone ? [['code', 'Codi o QR', ICON.scan], ['vps', 'Servidor', ICON.server]] : [['local', 'Aquest ordinador', ICON.machine], ['vps', 'Servidor', ICON.server], ['code', 'Tinc un codi', ICON.scan]];
   let cur = TABS.some((t) => t[0] === tab) ? tab : TABS[0][0], poll = 0, scan = null, shown = '', hosts = [];
   const intro = (t, d) => `<div class="add-intro"><h3>${t}</h3>${d ? `<p>${d}</p>` : ''}</div>`;
@@ -1663,8 +1677,7 @@ $('#sheet').addEventListener('close', () => setTimeout(focusMain, 0));
 
 // Al mòbil, els fulls es tanquen lliscant cap avall, com els de l'iPhone: el full segueix el dit
 // i, si baixa prou o es llença, marxa; si no, torna a pujar. Si el contingut té scroll, primer s'ha d'arribar a dalt.
-(() => {
-  const d = $('#sheet');
+function dragToClose(d, close) {
   let g = null;
   const scrollerOf = (t) => { for (let el = t; el && el !== d.parentElement; el = el.parentElement) { if (el.scrollHeight > el.clientHeight + 1 && /auto|scroll/.test(getComputedStyle(el).overflowY)) return el; if (el === d) break; } return null; };
   const reset = () => { d.style.transition = ''; d.style.transform = ''; };
@@ -1692,21 +1705,27 @@ $('#sheet').addEventListener('close', () => setTimeout(focusMain, 0));
     const x = g; g = null; if (!x || x.lock !== 'y') return;
     const [t0, y0] = x.pts[0], [t1, y1] = x.pts[x.pts.length - 1], v = (y1 - y0) / Math.max(1, t1 - t0);
     if (e.type === 'touchend' && (x.dy > Math.min(160, d.offsetHeight * 0.28) || (v > 0.5 && x.dy > 20))) {
-      if (reduce) { reset(); closeSheet(); return; }
+      if (reduce) { reset(); close(); return; }
       d.style.transition = 'transform .2s cubic-bezier(.4,0,1,1)'; d.style.transform = `translateY(${d.offsetHeight + 20}px)`;
-      setTimeout(() => { closeSheet(); requestAnimationFrame(reset); }, 200);
+      setTimeout(() => { close(); requestAnimationFrame(reset); }, 200);
     } else { d.style.transition = 'transform .3s cubic-bezier(.22,1,.36,1)'; d.style.transform = ''; setTimeout(reset, 300); }
   };
   d.addEventListener('touchend', end, { passive: true });
   d.addEventListener('touchcancel', end, { passive: true });
   d.addEventListener('close', reset);
-})();
+}
+dragToClose($('#sheet'), () => closeSheet());
+dragToClose($('#palette'), () => $('#palette').close());
 
-// Claude Code no deixa «Via lliure» quan nio corre com a root (típic en un VPS).
-const modeBlocked = (agentId, mode) => agentId === 'claude' && mode === 'tot' && state.info?.user === 'root';
+// Claude Code no deixa «Via lliure» (bypassPermissions) quan nio corre com a root (típic en un VPS).
+// Des de nio-cat 0.9.12, com a root fa servir el mode auto de Claude Code; només les versions anteriors el bloquegen.
+const verAtLeast = (v, min) => { const a = String(v || '').split('.').map(Number), b = min.split('.').map(Number); for (let i = 0; i < 3; i++) { if ((a[i] || 0) !== b[i]) return (a[i] || 0) > b[i]; } return true; };
+const asRoot = (agentId) => agentId === 'claude' && state.info?.user === 'root';
+const modeBlocked = (agentId, mode) => mode === 'tot' && asRoot(agentId) && !verAtLeast(state.info?.version, '0.9.12');
 function modeHelp(agentId, mode) {
   const a = state.info?.agents?.find((x) => x.id === agentId);
-  if (modeBlocked(agentId, mode)) return 'No disponible: Claude Code no ho permet quan s’executa com a root. Fes servir «Demana permís» o engega nio amb un usuari normal.';
+  if (modeBlocked(agentId, mode)) return 'No disponible en aquesta versió de nio quan s’executa com a root. Actualitza nio (curl -fsSL https://www.nio.cat/install.sh | sh) o fes servir «Demana permís».';
+  if (mode === 'tot' && asRoot(agentId)) return 'Treballa sense preguntar amb el mode auto de Claude Code (com a root no n’hi ha d’altre): un classificador revisa cada acció i atura les arriscades.';
   if (mode === 'llegir') return 'Llegeix el projecte i et proposa canvis, però no toca cap fitxer.';
   if (mode === 'tot') return 'Treballa sense preguntar. Fes-lo servir només en carpetes on confiïs plenament.';
   if (a?.approvals) return 'Llegeix sol. Abans d’editar un fitxer o d’executar una ordre, et demana permís aquí.';
@@ -3041,6 +3060,20 @@ if ('serviceWorker' in navigator) {
   navigator.serviceWorker.register('/sw.js').catch(() => {});
   navigator.serviceWorker.addEventListener('message', (e) => { if (e.data?.type === 'open-session' && e.data.id) go(`#/s/${e.data.id}`); });
 }
+// L'app d'Android (i la de la pantalla d'inici) es queda oberta dies sense recarregar: en tornar-hi, si hi ha una versió
+// nova de la web (sw.js canvia a cada canvi de l'app), es recarrega, però només si no estàs fent res a mitges.
+(() => {
+  const ver = async () => { try { return (await (await fetch('/sw.js', { cache: 'no-store' })).text()).match(/nio-shell-v\d+/)?.[0] || null; } catch { return null; } };
+  const busy = () => document.querySelector('dialog[open], .nt-ov, .call-ov, .rd, .lv-pill, .lv-rec') || [...document.querySelectorAll('textarea, input[type=text], input:not([type])')].some((t) => t.value.trim());
+  let mine = null, hiddenAt = 0;
+  ver().then((v) => { mine = v; });
+  document.addEventListener('visibilitychange', async () => {
+    if (document.hidden) { hiddenAt = Date.now(); return; }
+    if (!mine || Date.now() - hiddenAt < 60000) return;
+    const now = await ver();
+    if (now && now !== mine && !document.hidden && !busy()) location.reload();
+  });
+})();
 addEventListener('hashchange', route);
 // El mòbil congela la pàgina en segon pla i el flux queda mort sense cap error: l'ordinador envia un ping cada 15 s,
 // així que si fa més de 40 s que no arriba res (o en tornar a l'app, més de 20 s), es torna a connectar sol.
@@ -3073,11 +3106,12 @@ if (T.on) tourGo(T.i); else if (!T.seen && !machine()) setTimeout(tourStart, 700
 
 /* ---------------------------------------------------------------- lliscar entre pàgines (mòbil) */
 (() => {
-  const PAGES = ['sessions', 'approvals', 'ordinadors'];
+  // Les pàgines de la barra de baix, en el mateix ordre («Pantalla» i «Més» no són pàgines: obren un full).
+  const PAGES = ['sessions', 'notes', 'ordinadors'];
   const view = $('#view');
   let g = null, timer = 0;
   const scrollsX = (el) => { for (; el && el !== view; el = el.parentElement) { if (el.scrollWidth > el.clientWidth + 2 && /auto|scroll/.test(getComputedStyle(el).overflowX)) return true; } return false; };
-  const blocked = (t) => !mq.matches || document.body.classList.contains('nav-open') || $('#sheet')?.open || state.route.name === 'session' || t.closest?.('input, textarea, select, [contenteditable], [data-noswipe]') || scrollsX(t);
+  const blocked = (t) => !mq.matches || document.body.classList.contains('nav-open') || $('#sheet')?.open || state.route.name === 'session' || t.closest?.('input, textarea, select, [contenteditable], [data-noswipe], .nt-card') || scrollsX(t); // a Notes, lliscar una targeta l'arxiva
   const target = (dir) => PAGES[PAGES.indexOf(state.route.name) + dir];
   const put = (x, o) => { view.style.setProperty('--sx', x + 'px'); view.style.setProperty('--so', String(o)); };
   const clear = () => { view.classList.remove('swiping', 'swipe-anim'); view.style.removeProperty('--sx'); view.style.removeProperty('--so'); };

package/web/app/index.html

@@ -32,6 +32,7 @@
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&family=Caveat:wght@500;600&display=swap" rel="stylesheet">
+<script>/* App d'Android: la pàgina va per sota de les barres del sistema; l'app en diu la mida abans de pintar. */try{var i=JSON.parse(NioAndroid.insets()),d=document.documentElement;d.style.setProperty('--safe-t',i.t+'px');d.style.setProperty('--safe-b',i.b+'px');d.classList.add('android')}catch(e){}</script>
 <link rel="stylesheet" href="/bot.css">
 <link rel="stylesheet" href="/board.css">
 <link rel="stylesheet" href="/app/style.css">

package/web/app/notes-live.js

@@ -6,6 +6,9 @@
 const SEG_MS = Number(globalThis.NIO_LIVE_SEG_MS) || 20000; // durada de cada tros: prou curt per veure-ho gairebé en directe, prou llarg perquè Whisper tingui context
 const SILENCE = 0.003; // per sota d'aquest volum (RMS) tot el tros, no s'envia: Whisper s'inventa frases en el silenci
 const KINDS = { classe: 'Classe', reunio: 'Reunió' };
+const LIVE_MIN = '0.9.11', OLD = /ruta no existeix|Error 404/i; // un nio antic, sense classes ni reunions
+// Dins l'app d'Android, grava un servei natiu: continua amb la pantalla bloquejada (android/LiveService.java).
+const NA = typeof window !== 'undefined' && window.NioAndroid?.liveStart ? window.NioAndroid : null;
 const LANGS = [['ca', 'Català'], ['es', 'Castellà'], ['en', 'Anglès']];
 const STATES = { rec: 'Gravant', closing: 'Acabant de transcriure…', summarizing: 'Fent el resum…', done: 'Resum fet', error: 'No s’ha pogut resumir' };
 const LI = {
@@ -44,11 +47,28 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
   }
 
   // ---------------------------------------------------------------- començar
+  // L’ordinador té un nio d’abans de les classes: cal actualitzar-lo allà (la web ja és nova).
+  function oldSheet() {
+    const v = ctx.nodeVersion(), cmd = ctx.installCmd;
+    ctx.openSheet(`<h2>Cal actualitzar nio</h2>
+      <div class="stack">
+        <p>${v ? `Aquest ordinador té nio ${esc(v)}` : 'Aquest ordinador té un nio antic'} i «Classe o reunió» necessita la ${LIVE_MIN} o més nova.</p>
+        <p class="small muted">Obre un terminal a l’ordinador i executa:</p>
+        <pre class="mono small" style="white-space:pre-wrap;user-select:all">${esc(cmd)}</pre>
+        <p class="small muted">Quan acabi, torna aquí i prova-ho de nou.</p>
+        <div class="row sheet-foot"><button class="btn ghost" type="button" data-close>Tanca</button><button class="btn ink" type="button" data-copy>Copia l’ordre</button></div>
+      </div>`, (sh) => {
+      sh.querySelector('[data-close]').onclick = ctx.closeSheet;
+      sh.querySelector('[data-copy]').onclick = () => navigator.clipboard?.writeText(cmd).then(() => toast('Ordre copiada'), () => toast('No l’he pogut copiar'));
+    });
+  }
+
   async function startSheet() {
     if (ctx.isDemo()) return toast('A la demo no hi ha micròfon. Amb nio instal·lat, grava una classe i Whisper la transcriu a l’ordinador.', 5000);
+    if (!ctx.nodeAtLeast(LIVE_MIN)) return oldSheet();
     if (!ctx.voiceOn()) { toast('Cal activar Whisper per transcriure (gratis, a l’ordinador).', 3500); return ctx.voiceSheet(); }
     if (rec) return open(rec.id);
-    if (!navigator.mediaDevices?.getUserMedia || !window.MediaRecorder) return toast('Aquest navegador no pot gravar àudio.');
+    if (!NA && (!navigator.mediaDevices?.getUserMedia || !window.MediaRecorder)) return toast('Aquest navegador no pot gravar àudio.');
     const kind0 = LSget('nio.live.kind', 'classe'), lang0 = LANGS.some(([k]) => k === LSget('nio.live.lang', 'ca')) ? LSget('nio.live.lang', 'ca') : 'ca';
     ctx.openSheet(`<h2>Classe o reunió</h2>
       <div class="stack lv-start">
@@ -56,7 +76,7 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
         <label class="f">Idioma<select id="lvLang">${LANGS.map(([k, l]) => `<option value="${k}" ${k === lang0 ? 'selected' : ''}>${l}</option>`).join('')}</select></label>
         <label class="f">Model per als apunts i el resum<select id="lvEng"><option>Mirant quins models hi ha…</option></select></label>
         <p class="small muted" id="lvWhat"></p>
-        <p class="small lv-warn">Deixa nio obert i la pantalla encesa: si el mòbil es bloqueja, el navegador atura el micròfon.</p>
+        <p class="small lv-warn">${NA ? 'Pots bloquejar el mòbil: l’app continua gravant i ho envia a l’ordinador.' : 'Deixa nio obert i la pantalla encesa: si el mòbil es bloqueja, el navegador atura el micròfon. Amb l’app d’Android, no cal.'}</p>
         <div class="row sheet-foot"><button class="btn ghost" type="button" data-close>Cancel·la</button><button class="btn ink" type="button" data-go>${svg('<circle cx="12" cy="12" r="6" fill="currentColor" stroke="none"/>')}Comença a gravar</button></div>
       </div>`, async (sh) => {
       let kind = kind0;
@@ -75,6 +95,16 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
       });
       sh.querySelector('[data-go]').onclick = async (ev) => {
         const b = ev.currentTarget; b.disabled = true;
+        if (NA) {
+          const lang = sh.querySelector('#lvLang').value, engine = sel.value || '';
+          LSset('nio.live.kind', kind); LSset('nio.live.lang', lang); if (engine) LSset('nio.notes.engine', engine);
+          try {
+            const n = await api('/api/notes/live', { method: 'POST', body: { kind, lang, engine } });
+            setNote(n); ctx.closeSheet(); open(n.id);
+            await nativeStart(n);
+          } catch (e) { b.disabled = false; if (OLD.test(e.message)) return oldSheet(); toast(e.message, 4500); }
+          return;
+        }
         // El micròfon es demana dins del clic: Safari no el deixa demanar més tard.
         let stream;
         try { stream = await mic(); } catch { b.disabled = false; return toast('No tinc permís per al micròfon. Activa’l als ajustos del navegador.', 4500); }
@@ -84,7 +114,7 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
           const n = await api('/api/notes/live', { method: 'POST', body: { kind, lang, engine } });
           setNote(n); ctx.closeSheet();
           begin(n, stream); open(n.id);
-        } catch (e) { stream.getTracks().forEach((t) => t.stop()); b.disabled = false; toast(e.message, 4500); }
+        } catch (e) { stream.getTracks().forEach((t) => t.stop()); b.disabled = false; if (OLD.test(e.message)) return oldSheet(); toast(e.message, 4500); }
       };
     });
   }
@@ -105,7 +135,46 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
     segment(rec);
     rec.tick = setInterval(() => { drawRec(); drawPill(); }, 500);
   }
-  const elapsed = (r) => r.base + (Date.now() - r.t0) / 1000;
+  const elapsed = (r) => (r.native ? r.st.elapsed || 0 : r.base + (Date.now() - r.t0) / 1000);
+
+  // ---------------------------------------------------------------- gravació nativa (app d'Android)
+  async function nativeStart(n) {
+    const m = ctx.machine(), segs = n.live?.segs || [], last = segs[segs.length - 1];
+    const cfg = { url: m.url, token: m.token, id: n.id, seq: last ? last.seq + 1 : 0, base: last ? last.at + last.dur : 0, segMs: SEG_MS, kind: KINDS[n.live?.kind] || 'Classe' };
+    let r = NA.liveStart(JSON.stringify(cfg));
+    if (r === 'perm') {
+      // L'app demana el permís del micròfon i avisa quan l'usuari ha respost.
+      r = await new Promise((done) => addEventListener('nio-native', function on(e) { if (!e.detail?.live) return; removeEventListener('nio-native', on); done(e.detail.live === 'started' ? 'ok' : 'denied'); }));
+    }
+    if (r !== 'ok') { toast(r === 'denied' ? 'Sense permís per al micròfon no puc gravar. Activa’l a Ajustos → Apps → nio → Permisos.' : 'No he pogut començar a gravar.', 5000); draw(); return; }
+    nativeWatch(n.id, m.url);
+    // HyperOS (Xiaomi) i altres aturen les apps en segon pla: es demana que no ho faci amb nio.
+    try { if (NA.batteryOk && !NA.batteryOk() && !LSget('nio.live.battery', false)) { LSset('nio.live.battery', true); toast('Perquè no s’aturi amb la pantalla bloquejada, permet que nio funcioni sense restriccions de bateria.', 6000); NA.batteryHelp(); } } catch { /* res */ }
+  }
+  function nativeWatch(id, url) {
+    if (rec?.native) clearInterval(rec.tick);
+    const r = rec = { native: true, id, url, running: true, stopping: false, lost: false, queue: [], st: {} };
+    const tick = () => {
+      let st = {}; try { st = JSON.parse(NA.liveStatus()); } catch { /* res */ }
+      r.st = st; r.lost = !!st.lost; r.stopping = !!st.stopping;
+      // Si el túnel ha canviat d'adreça, els trossos pendents van a la nova.
+      const m = ctx.machine(); if (m && m.url !== r.url) { r.url = m.url; try { NA.liveTarget(m.url, m.token); } catch { /* res */ } }
+      if (!st.active) { clearInterval(r.tick); if (rec === r) { rec = null; pill?.remove(); pill = null; draw(); } return; }
+      const bar = view && view.el.querySelector('.lv-meter i'); if (bar) bar.style.transform = `scaleX(${Math.min(1, (st.level || 0) * 1.2).toFixed(3)})`;
+      // La vista es redibuixa quan canvia l'estat (o si encara no mostra la gravació d'aquí).
+      if (view?.id === id) { const st2 = view.el.querySelector('.lv-st'); if (!st2 || st2.textContent !== nativeText(r)) draw(); }
+      drawRec(); drawPill();
+    };
+    r.tick = setInterval(tick, 500); tick();
+  }
+  function nativeText(r) {
+    const q = r.st.queue || 0;
+    return r.stopping ? (q ? `Enviant ${q} ${q === 1 ? 'tros' : 'trossos'}…` : 'Acabant…')
+      : r.lost ? 'El micròfon és ocupat (una trucada?). Tornarà a gravar sol quan quedi lliure.'
+      : q > 1 ? `Sense connexió amb l’ordinador: ${q} trossos esperant` : 'Grava amb la pantalla bloquejada i transcriu cada 20 s';
+  }
+  // Si l'app es torna a obrir amb una gravació en marxa, se'n recupera l'estat.
+  if (NA) { try { const st = JSON.parse(NA.liveStatus()); if (st.active && st.id) setTimeout(() => nativeWatch(st.id, ctx.machine()?.url), 0); } catch { /* res */ } }
   function segment(r) {
     if (!r.running || r.lost) return;
     if (r.stream.getAudioTracks().every((t) => t.readyState === 'ended')) { r.lost = true; draw(); return; }
@@ -117,8 +186,8 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
     mr.onstop = () => {
       clearTimeout(r.timer);
       const dur = (Date.now() - start) / 1000, blob = new Blob(chunks, { type: mr.mimeType || 'audio/webm' });
-      if (blob.size > 1500 && r.peak >= SILENCE) { r.queue.push({ seq: r.seq++, at: Math.round(at * 10) / 10, dur: Math.round(dur * 10) / 10, blob }); pump(r); }
-      else if (dur > 2) r.skipped++;
+      if (blob.size > 1500 && r.peak >= SILENCE) { r.queue.push({ seq: r.seq++, at: Math.round(at * 10) / 10, dur: Math.round(dur * 10) / 10, blob }); if (r.quiet) { r.quiet = 0; draw(); } pump(r); }
+      else if (dur > 2) { r.skipped++; r.quiet = (r.quiet || 0) + 1; if (r.quiet === 2) draw(); } // trossos en silenci seguits: el micròfon no capta la veu
       if (r.running && !r.lost) segment(r);
       else if (!r.running) finish(r);
     };
@@ -147,6 +216,7 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
   }
   function stop() {
     const r = rec; if (!r) return;
+    if (r.native) { NA.liveStop(); r.stopping = true; draw(); return; }
     r.running = false; r.stopping = true;
     if (r.mr?.state === 'recording') r.mr.stop(); else finish(r);
     draw();
@@ -168,6 +238,11 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
   }
   // El micròfon s'ha aturat (pantalla bloquejada, trucada…): es continua a la mateixa nota amb un clic.
   async function resume(id) {
+    if (NA) {
+      if (rec?.native && rec.id === id) return; // l'app ja hi torna sola quan el micròfon queda lliure
+      try { const n = await api(`/api/notes/${id}/live/resume`, { method: 'POST' }); setNote(n); await nativeStart(n); draw(); } catch (e) { toast(e.message, 4500); }
+      return;
+    }
     let stream;
     try { stream = await mic(); } catch { return toast('No tinc permís per al micròfon.', 4000); }
     if (rec && rec.id === id) {
@@ -275,15 +350,16 @@ export function createLive({ ctx, api, esc, toast, svg, getNote, setNote, loadEn
     t2?.addEventListener('scroll', () => { if (view) view.follow = t2.scrollHeight - t2.scrollTop - t2.clientHeight < 60; }, { passive: true });
   }
   function recBar(n) {
-    const r = rec, waiting = r.queue.length;
-    const status = r.stopping ? (waiting ? `Enviant ${waiting} ${waiting === 1 ? 'tros' : 'trossos'}…` : 'Acabant…')
+    const r = rec, waiting = r.native ? r.st.queue || 0 : r.queue.length;
+    const status = r.native ? nativeText(r) : r.stopping ? (waiting ? `Enviant ${waiting} ${waiting === 1 ? 'tros' : 'trossos'}…` : 'Acabant…')
       : r.lost ? 'El micròfon s’ha aturat (pantalla bloquejada o una altra app). Prem «Continua».'
-      : waiting > 1 ? `Sense connexió amb l’ordinador: ${waiting} trossos esperant` : 'Grava i transcriu cada 20 s';
+      : waiting > 1 ? `Sense connexió amb l’ordinador: ${waiting} trossos esperant`
+      : r.quiet >= 2 ? 'No sento res: apropa el micròfon o tria’n un altre a la icona del navegador' : 'Grava i transcriu cada 20 s';
     return `<div class="lv-rec ${r.lost ? 'lost' : ''}">
       <i class="lv-dot ${r.lost || r.stopping ? 'off' : ''}"></i><b class="lv-time">${fmt(elapsed(r))}</b>
       <span class="lv-meter" aria-hidden="true"><i></i></span>
       <span class="lv-st">${esc(status)}</span>
-      ${r.lost && !r.stopping ? `<button class="btn sm" type="button" data-lv="resume">Continua</button>` : ''}
+      ${r.lost && !r.stopping && !r.native ? `<button class="btn sm" type="button" data-lv="resume">Continua</button>` : ''}
       ${r.stopping ? '' : `<button class="btn ink sm" type="button" data-lv="stop">${svg('<rect x="7" y="7" width="10" height="10" rx="2"/>')}Atura i resumeix</button>`}
     </div>`;
   }

package/web/app/notes.css

@@ -173,6 +173,8 @@ body:has(.nt-ov) { overflow: hidden; }
 .nt-ai-f { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
 
 @media (max-width: 700px) {
+  /* Els desplegables de la nota (color, etiqueta, assistent) ocupen l'amplada, amb marge: no se surten pels costats. */
+  .nt-pop { left: 10px !important; right: 10px; max-width: none; min-width: 0; }
   .page:has(.nt) { padding-inline: 14px; }
   .nt-title h1 { font-size: 26px; } .nt-title p { display: none; }
   .nt-top { margin-bottom: 12px; } .nt-tools .btn span { display: none; } .nt-tools .btn { padding: 0 11px; }

package/web/app/style.css

@@ -304,6 +304,15 @@ dialog.sheet[open] { animation: pop .22s var(--ease); }
 #palette li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 10px; cursor: pointer; font-size: 14px; }
 #palette li[aria-selected="true"] { background: var(--bg-2); }
 #palette li span { color: var(--fg-muted); font-size: 12px; }
+/* Al mòbil, la paleta és un full de baix com els altres, i es tanca lliscant cap avall. */
+@media (max-width: 820px) {
+  #palette { width: 100%; max-width: none; margin: auto 0 0; border-radius: 20px 20px 0 0; padding-bottom: var(--safe-b); max-height: 82dvh; }
+  #palette[open] { display: flex; flex-direction: column; animation: sheet-up .3s var(--ease); }
+  #palette::before { content: ''; display: block; width: 36px; height: 4px; margin: 8px auto 2px; border-radius: 4px; background: var(--border); flex: none; }
+  #palette input { border-radius: 0; flex: none; }
+  #palette ul { max-height: none; flex: 1; min-height: 0; }
+  #palette li { min-height: 46px; align-items: center; font-size: 15px; }
+}
 
 .tour { position: fixed; inset: 0; z-index: 40; pointer-events: none; }
 .tour-spot { position: fixed; border-radius: 12px; box-shadow: 0 0 0 9999px color-mix(in srgb, var(--fg) 42%, transparent), 0 0 0 2px var(--white) inset; transition: left .35s var(--ease), top .35s var(--ease), width .35s var(--ease), height .35s var(--ease); }
@@ -458,7 +467,9 @@ dialog.sheet.wiz .sheet-in { padding: 0; gap: 0; flex: 1; min-height: 0; display
 .fs-pick b { overflow-wrap: anywhere; }
 .fs-list { max-height: none; }
 @media (max-width: 820px) {
-  dialog.sheet.wiz { height: min(92dvh, calc(var(--vvh, 100dvh) - 8px)); }
+  /* Al mòbil, els assistents (Nova sessió, Afegeix ordinador…) fan l'alçada del contingut, no la de tota la pantalla. */
+  dialog.sheet.wiz { height: auto; max-height: min(92dvh, calc(var(--vvh, 100dvh) - 8px - var(--safe-t))); }
+  dialog.sheet.wiz .sheet-in, dialog.sheet.wiz .wiz-body { flex: 0 1 auto; }
   .wiz-head { padding: 10px 18px 8px; }
   .wiz-body { padding: 4px 18px 14px; }
   .wiz-foot { padding: 12px 18px calc(14px + var(--safe-b)); }
@@ -724,7 +735,7 @@ html.rd-open, html.rd-open body { overflow: hidden; }
 @media (max-width: 560px) { .rd-bar { padding: 8px 10px; gap: 8px; } .rd-stat, #rdFull { display: none; } .rd-seg button { padding: 9px 11px; } }
 
 .rd-stage img { transform-origin: center; will-change: transform; }
-.rd-tools { position: absolute; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); display: flex; align-items: center; gap: 6px; padding: 6px; border-radius: 14px; background: rgba(22, 22, 23, .86); border: 1px solid #36363a; backdrop-filter: blur(8px); z-index: 2; max-width: calc(100% - 20px); }
+.rd-tools { position: absolute; left: 50%; bottom: calc(14px + var(--safe-b, 0px)); transform: translateX(-50%); display: flex; align-items: center; gap: 6px; padding: 6px; border-radius: 14px; background: rgba(22, 22, 23, .86); border: 1px solid #36363a; backdrop-filter: blur(8px); z-index: 2; max-width: calc(100% - 20px); }
 .rd-tools .rd-btn { padding: 10px 12px; min-width: 40px; }
 .rd-pct { min-width: 56px !important; font-variant-numeric: tabular-nums; }
 .rd-sep { width: 1px; align-self: stretch; background: #36363a; }

package/web/board.css

@@ -109,7 +109,7 @@
 .bd-chat .chips::-webkit-scrollbar { display: none; }
 .bd-chat .chip-s { flex: none; scroll-snap-align: start; max-width: 260px; box-sizing: border-box; height: 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 12px; line-height: 30px; text-align: center; border: 1px solid var(--border); border-radius: 999px; background: var(--white); font-size: 12px; font-weight: 500; cursor: pointer; }
 .bd-chat .chip-s:hover { border-color: var(--fg); }
-.bd-chat .cin { display: flex; gap: 8px; align-items: flex-end; padding: 12px 14px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); }
+.bd-chat .cin { display: flex; gap: 8px; align-items: flex-end; padding: 12px 14px calc(14px + var(--safe-b, 0px)); border-top: 1px solid var(--border); }
 .bd-chat .cin textarea { flex: 1; min-height: 42px; max-height: 140px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--white); resize: none; font: inherit; font-size: 14px; line-height: 1.4; outline: none; }
 .bd-chat .cin textarea:focus { border-color: var(--fg); }
 .bd-chat .send { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border: 0; border-radius: 12px; background: var(--fg); color: var(--bg); cursor: pointer; }
@@ -118,9 +118,9 @@
 
 @media (max-width: 1100px) { .board-root { --chat-w: 320px; } }
 @media (max-width: 820px) {
-  .board-root { height: calc(100dvh - 56px - env(safe-area-inset-top)); }
+  .board-root { height: calc(100dvh - 56px - var(--safe-t, 0px)); }
   .chat-open .bd-tools, .chat-open .bd-right { transform: none; }
-  .bd-tools { top: auto; bottom: calc(12px + env(safe-area-inset-bottom)); left: 10px; right: 10px; transform: none; overflow-x: auto; scrollbar-width: none; }
+  .bd-tools { top: auto; bottom: calc(12px + var(--safe-b, 0px)); left: 10px; right: 10px; transform: none; overflow-x: auto; scrollbar-width: none; }
   .bd-tools::-webkit-scrollbar { display: none; }
   .bd .tb { width: 40px; height: 40px; flex: none; }
   .bd .tb small { display: none; }
@@ -131,7 +131,7 @@
   .bd .chat-t > span:not(.bot) { display: none; }
   .only-m { display: grid !important; }
   .bd-style { display: none; }
-  .style-open .bd-style:not([hidden]) { display: grid; left: 10px; right: 10px; top: auto; bottom: calc(70px + env(safe-area-inset-bottom)); width: auto; grid-template-columns: 1fr 1fr; }
+  .style-open .bd-style:not([hidden]) { display: grid; left: 10px; right: 10px; top: auto; bottom: calc(70px + var(--safe-b, 0px)); width: auto; grid-template-columns: 1fr 1fr; }
   .bd-help .cols { grid-template-columns: 1fr; }
   .bd-chat { position: absolute; top: auto; left: 0; right: 0; bottom: 0; z-index: 9; width: auto; height: min(78%, 600px); border: 0; border-top: 1px solid var(--border); border-radius: 20px 20px 0 0; transform: translateY(105%); transition: transform .34s var(--bd-ease), visibility 0s linear .34s; box-shadow: 0 -20px 50px -30px color-mix(in srgb, var(--fg) 55%, transparent); }
   .chat-open .bd-chat { transform: none; transition: transform .34s var(--bd-ease), visibility 0s; }
@@ -145,7 +145,7 @@
   .chat-open .bd-chat { transform: none; transition: transform .34s var(--bd-ease), visibility 0s; }
   .bd-chat header::before { content: ""; position: absolute; top: 6px; left: 50%; width: 36px; height: 4px; margin-left: -18px; border-radius: 4px; background: var(--border); }
   .chat-open .bd-tools, .chat-open .bd-right { transform: none; }
-  .bd-tools { top: auto; bottom: calc(12px + env(safe-area-inset-bottom)); left: 10px; right: 10px; transform: none; overflow-x: auto; scrollbar-width: none; justify-content: flex-start; }
+  .bd-tools { top: auto; bottom: calc(12px + var(--safe-b, 0px)); left: 10px; right: 10px; transform: none; overflow-x: auto; scrollbar-width: none; justify-content: flex-start; }
   .bd-tools::-webkit-scrollbar { display: none; }
   .bd .tb { flex: none; }
   .bd .tb small { display: none; }
@@ -156,7 +156,7 @@
   .bd .chat-t > span:not(.bot) { display: none; }
   .bd .tb.only-m { display: grid !important; }
   .bd-style { display: none; }
-  .style-open .bd-style:not([hidden]) { display: grid; left: 10px; right: 10px; top: auto; bottom: calc(70px + env(safe-area-inset-bottom)); width: auto; grid-template-columns: 1fr 1fr; }
+  .style-open .bd-style:not([hidden]) { display: grid; left: 10px; right: 10px; top: auto; bottom: calc(70px + var(--safe-b, 0px)); width: auto; grid-template-columns: 1fr 1fr; }
 }
 @container stage (max-width: 440px) {
   .bd .tb[data-tool="hand"], .bd .tb[data-tool="line"], .bd .tb[data-bd="lock"] { display: none; }
@@ -181,7 +181,7 @@
   .bd-chat header { padding-top: 22px; }
   .bd-chat .msgs { overscroll-behavior: contain; }
   .bd-chat .cin textarea { font-size: 16px; }
-  .bd-chat .cin { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
+  .bd-chat .cin { padding-bottom: calc(12px + var(--safe-b, 0px)); }
 }
 @container stage (max-width: 720px) {
   .bd-scrim { display: block; position: absolute; inset: 0; z-index: 8; border: 0; background: color-mix(in srgb, var(--fg) 30%, transparent); opacity: 0; visibility: hidden; transition: opacity .3s, visibility 0s linear .3s; }
@@ -232,10 +232,10 @@
 /* Mòbil en horitzontal: poc d'alçada */
 @media (max-height: 480px) and (max-width: 940px) {
   .bd-chat { height: min(92%, 600px); }
-  .bd-tools { bottom: calc(6px + env(safe-area-inset-bottom)); left: auto; right: auto; max-width: calc(100% - 20px); }
+  .bd-tools { bottom: calc(6px + var(--safe-b, 0px)); left: auto; right: auto; max-width: calc(100% - 20px); }
   .bd-tools { left: 50%; transform: translateX(-50%); }
   .bd .tb { height: 40px; }
-  .style-open .bd-style:not([hidden]) { bottom: calc(58px + env(safe-area-inset-bottom)); max-height: calc(100% - 130px); overflow-y: auto; grid-template-columns: repeat(2, 1fr); }
+  .style-open .bd-style:not([hidden]) { bottom: calc(58px + var(--safe-b, 0px)); max-height: calc(100% - 130px); overflow-y: auto; grid-template-columns: repeat(2, 1fr); }
   .bd-help-in { padding: 14px; }
   .bd-empty { display: none; }
 }

package/web/index.html

@@ -218,6 +218,7 @@ main { padding-bottom: 8px; }
   <section aria-labelledby="que">
     <div class="sec-head"><span class="eyebrow">Què hi pots fer</span><h2 id="que">Tot el que necessites per treballar amb agents</h2></div>
     <div class="grid">
+      <article class="card big c-lemon"><div class="big-l"><span class="tag">Notes</span><h3>Classe o reunió, apuntada sola</h3><p>Grava amb el micròfon del mòbil o de l’ordinador i Whisper ho transcriu a l’ordinador mentre es parla. Cada 4 o 5 minuts, un model en fa apunts; quan acabes, surt el resum de tot.</p><p class="muted">Tries l’idioma (català, castellà o anglès) i el model. L’àudio no surt dels teus ordinadors.</p></div><dl class="rows stack"><div><dt><strong>En directe</strong></dt><dd>La transcripció apareix cada 20 segons, al costat dels apunts.</dd></div><div><dt><strong>Classe</strong></dt><dd>Conceptes clau, punts importants i preguntes per repassar.</dd></div><div><dt><strong>Reunió</strong></dt><dd>Resum, decisions, tasques amb qui se’n fa càrrec i temes oberts.</dd></div><div><dt><strong>App d’Android</strong></dt><dd>Continua gravant amb la pantalla bloquejada, i si es talla la connexió guarda els trossos fins que torna.</dd></div></dl></article>
       <article class="card c-blue"><span class="tag">Agents</span><h3>Sessions en directe</h3><p>Claude Code, Codex, Grok i Antigravity a qualsevol dels teus ordinadors. Tries la carpeta i els permisos, i la resposta arriba mentre treballa.</p></article>
       <article class="card c-rose"><span class="tag">Seguretat</span><h3>Aprovacions</h3><p>Abans d’editar, executar o clicar res, te’n demana permís amb el motiu. Ho aproves o ho rebutges amb un toc, i tot queda registrat.</p></article>
       <article class="card c-lilac"><span class="tag">Connexió</span><h3>Avisos al mòbil</h3><p>Una notificació quan un agent et demana permís o acaba. Arriba buida: el detall el demana el mòbil directament a l’ordinador.</p></article>
@@ -230,6 +231,9 @@ main { padding-bottom: 8px; }
       <article class="card c-blue"><span class="tag">Agents</span><h3>Git i GitHub</h3><p>Clona un repositori, mira els canvis, fes commit i crea un PR des del mòbil, amb el <code>git</code> i el <code>gh</code> de l’ordinador.</p></article>
       <article class="card c-lilac"><span class="tag">Connexió</span><h3>Telegram i veu</h3><p>Parla amb el teu bot o amb notes de veu, aprova amb un botó i escolta les respostes. Dictes gratis amb Whisper, que funciona a l’ordinador: l’àudio no en surt.</p></article>
       <article class="card c-green"><span class="tag">Xat local</span><h3>Ollama i xat local</h3><p>Fes servir models gratuïts a l’ordinador, o un model petit dins del navegador del mòbil, sense connexió.</p></article>
+      <article class="card c-peach"><span class="tag">Notes</span><h3>Notes i veu</h3><p>Notes amb llistes, colors i etiquetes, guardades a l’ordinador. Dicta-les o adjunta-hi àudio i es transcriu; llisca una nota per arxivar-la. Des de l’ordinador, pots fer servir el mòbil com a micròfon.</p></article>
+      <article class="card c-rose"><span class="tag">Agents</span><h3>Truca a en Nio</h3><p>Parla amb en Nio en temps real (ElevenLabs, amb la teva clau): et diu com van les sessions, li encarregues feina i aproves de paraula. La conversa surt en directe, paraula per paraula.</p></article>
+      <article class="card c-blue"><span class="tag">Agents</span><h3>Continua les sessions del terminal</h3><p>Les converses de Claude Code obertes al terminal de l’ordinador surten a Sessions. Toca’n una i continua-la des del mòbil amb tot l’historial.</p></article>
     </div>
   </section>
 

package/web/sw.js

@@ -1,5 +1,5 @@
 // nio · service worker: obre l'app encara que no hi hagi connexió i mostra els avisos.
-const SHELL = 'nio-shell-v53';
+const SHELL = 'nio-shell-v59';
 const FILES = ['/app', '/app/style.css', '/app/notes.css', '/app/call.css', '/app/app.js', '/app/notes.js', '/app/notes-live.js', '/app/call.js', '/app/demo.js', '/bot.css', '/bot.js', '/board.css', '/board.js', '/favicon.svg', '/manifest.webmanifest'];
 
 self.addEventListener('install', (e) => {