create-pmos 0.534.0 → 0.536.0

package/workspace/lib/route-modules.js

@@ -39,6 +39,7 @@ const MODULES = Object.freeze([
   'routes-capture',       // Run 3 (3C): ⌘K capture
   'routes-board',         // Run 4 (4D): the cross-initiative Board, Release
   'routes-reports',       // Run 5 (5C): drafts, Issue, notes
+  'routes-report-orders', // batch 27 item 16: apply an order to a report draft, Undo, my saved orders (canvas TpA, TpD, TpE)
   'routes-report-flow',   // batch 22 item 14: the report building flow (template versions, the report's own session, review)
   'routes-notes',         // meeting-notes Run 1: the Notes view (typed notes, dictation, transcripts, summaries)
   'routes-my-work',       // initiative my-work: the ranked list of work assigned to the PM, the brief, Read again

package/workspace/lib/routes-report-flow.js

@@ -307,4 +307,4 @@ async function handle(req, res, url, ctx) {
   return r.ok ? send({ status: 200, body: r }) : fail(r);
 }
 
-module.exports = { prefixes, handle, stateOf, askPrompt, draftWords };
+module.exports = { prefixes, handle, stateOf, askPrompt, draftWords, ask };

package/workspace/lib/routes-report-orders.js

@@ -0,0 +1,161 @@
+'use strict';
+/* routes-report-orders.js — apply an order to a report draft, Undo, and my saved orders (batch 27 item 16; main canvas TpA, TpD, TpE;
+ * lib/report-orders.js). The app says "order", never "template".
+ *
+ *   GET  /api/report-orders?ws&path          → { ok, id, slot, issued, engine, now, pick, next, orders, slides, undo }   what the draft's order is,
+ *                                               the ✦ (pick), every order with what it adds and drops, my orders first, my slides, and the Undo
+ *   GET  /api/report-orders/preview?ws&order → text/html, the order drawn with placeholder words (one slide per part), sanitized
+ *   POST /api/report-orders/apply  { ws, path, order }   → { ok, redraft: { session, started|passed } } | { ok, next: { id, name } }
+ *                                     A draft: the draft is copied aside (Undo, one day), the brief takes the order (lib/report-engine.js make),
+ *                                     and the report's own session is asked to write it again in that order, keeping its readings. An agreed outline:
+ *                                     nothing changes today; the order is used from the next cycle. An issued cycle is refused 409 (it is frozen).
+ *   POST /api/report-orders/undo   { ws, path }          → { ok }   the draft as it was before the redraft (its day only)
+ *   POST /api/report-orders/save   { ws, path, name? }   → { ok, id }   the draft's parts and layouts as my order (never its numbers or words)
+ *   POST /api/report-orders/slide  { ws, path, n }       → { ok, id, name }   slide n (from 0) of the draft's deck as my slide: its layout and part
+ *   POST /api/report-orders/rename { ws, id, name }      → { ok }
+ *   POST /api/report-orders/remove { ws, id }            → { ok }
+ *
+ * MY ORDERS are the PM's own: they live in the per-user runtime directory (ctx.runtimeDir), not in any repository, and no other person reads them.
+ * WHO WRITES. Every POST passes pm-guard requirePagePress; a request with an agent session header is refused first (403). Nothing here sends
+ * anything outward; the redraft runs in the report's own session (lib/routes-report-flow.js ask), which never issues.
+ */
+const fs = require('fs');
+const path = require('path');
+const guard = require('./pm-guard.js');
+const RO = require('./report-orders.js');
+const RE = require('./report-engine.js');
+const RL = require('./report-library.js');
+const issues = require('./issues.js');
+
+const prefixes = ['/api/report-orders'];
+const POSTS = ['apply', 'undo', 'save', 'slide', 'rename', 'remove'];
+const text = (v) => (typeof v === 'string' ? v : '');
+const bad = (status, error) => ({ status, body: { ok: false, error } });
+const PATH_RE = /(?:^|\/)reports\/([a-z][a-z0-9-]{0,39})\/(\d{4}-\d{2}-\d{2})\.md$/;
+function wsOf(ctx, id) { const w = ctx.getWs(id || null); return w && (!id || w.id === id) ? w : null; }
+const mineDir = (ctx) => ctx.runtimeDir || require('./state-root.js').defaultRoot();
+const readJson = (f) => { try { return JSON.parse(fs.readFileSync(f, 'utf8')); } catch { return null; } };
+
+/** The draft a path names: { id, slot, P, issued } | { error }. The path must be a report document that exists. */
+function draftOf(w, rel) {
+  const m = PATH_RE.exec(text(rel));
+  if (!m || text(rel).split('/').includes('..')) return { error: bad(400, 'path must be a report draft') };
+  let P; try { P = RE.paths(w.root, m[1], m[2]); } catch (e) { return { error: bad(400, e.message) }; }
+  if (!fs.existsSync(P.md.abs)) return { error: bad(404, 'no such report') };
+  let iss = false; try { iss = issues.isIssued(issues.readIssues(w.root), m[1], m[2]); } catch { iss = false; }
+  return { id: m[1], slot: m[2], P, issued: iss };
+}
+function setupName(w, id) { try { const RS = require('./report-setups.js'); const s = RS.fold(RS.readLines(RS.ledgerFile(w.root))).setups.get(id); return (s && s.name) || ''; } catch { return ''; } }
+function reportName(w, id, brief) { return setupName(w, id) || (brief && brief.title) || id; }
+/** A saved order's first name: the recurring report's ("Product weekly order"), else the order it began as ("Weekly Review, my way"), else
+ *  "My order". Never an ad hoc report's title: that is its question, a sentence with dates in it. */
+function savedName(w, id, brief) { const s = setupName(w, id); if (s) return s + ' order'; return brief && brief.template && brief.template.name ? brief.template.name.replace(/, my way$/, '') + ', my way' : 'My order'; }
+const card = (o, now, mine, extra = {}) => ({ id: o.id, name: o.name, sub: RO.subOf(o.id, mine), n: o.outline.length, parts: o.outline, ...RO.diff(now.parts, o.outline), ...extra });
+/** The whole state of one draft's order. */
+function stateOf(ctx, w, d) {
+  const brief = readJson(d.P.brief.abs), report = readJson(d.P.report.abs);
+  const now = RO.nowOf(brief, report);
+  const my = RO.fold(RO.readLines(mineDir(ctx)));
+  const pk = d.issued ? null : RO.pick(brief, report);
+  const orders = my.orders.map((o) => card(o, now, my.orders, { mine: true }))
+    .concat(RL.TEMPLATES.map((t) => card({ id: t.id, name: t.name, outline: t.outline }, now, my.orders)));
+  return { ok: true, id: d.id, slot: d.slot, issued: d.issued, engine: !!report, name: reportName(w, d.id, brief),
+    now, pick: pk, next: RO.nextOf(w.root, d.id), orders, slides: my.slides.map((s) => ({ id: s.id, name: s.name, part: s.outline[0].part, layout: s.outline[0].layout, at: s.at })),
+    undo: RO.undoOf(w.root, d.id, d.slot, { issued: d.issued }) };
+}
+/** The words the report's session gets for a redraft in an order. */
+function redraftWords(id, slot, rel, order) {
+  return `Write this draft again in the "${order.name}" order (${rel}, slot ${slot}). This change IS a redraft, of this slot only. `
+    + `The brief (${slot}.brief.json) now carries the order as its template: follow skills/report-write.skill from step 3, with the order's parts as the starting outline, `
+    + `each part in its slide layout and retitled as a finding; add or drop a part when the findings say so. Keep every reading and every finding already filed: `
+    + `run \`pmos report make ${id} --slot ${slot}\` only when a source is missing. Then run \`pmos report write ${id} --slot ${slot} --from <file>\`.`;
+}
+/** The deck slide n as one saved part: its layout, and a part name that is never a finding. */
+function slidePart(d, n) {
+  const deck = RE.engineDeckOf(d.P.md.abs, null);
+  if (!deck) return { error: bad(409, 'this draft was written before the report engine: its slides have no layouts to save') };
+  const s = deck.slides[n];
+  if (!s) return { error: bad(404, 'no such slide') };
+  const fixed = { title: ['Title', 'overview'], answer: ['The answer', s.layout], beyond: ['Beyond the question', 'agenda'], ask: ['Asks', 'decisions'], sources: ['Sources', 'sources'] };
+  if (fixed[s.kind]) return { part: fixed[s.kind][0], layout: fixed[s.kind][1] || 'statement' };
+  const report = readJson(d.P.report.abs), brief = readJson(d.P.brief.abs);
+  const parts = RO.partsOf(report, brief);
+  // the section slides come after the title and answer slides, in the report's order (a long text section may take several slides)
+  const k = deck.slides.slice(0, n + 1).filter((x) => x.kind === 'section' && !/\(continued\)$/.test(x.title)).length - 1;
+  const p = parts[k] || { part: RO.nameOfLayout(s.layout), layout: s.layout };
+  return { part: p.part, layout: p.layout };
+}
+
+async function handle(req, res, url, ctx) {
+  const p = url.pathname;
+  const send = (r) => { ctx.json(res, r.body, r.status); return true; };
+  const sub = p.replace(/^\/api\/report-orders\/?/, '');
+  if (req.method === 'GET') {
+    const w = wsOf(ctx, url.searchParams.get('ws'));
+    if (!w) return send(bad(404, 'no such workspace'));
+    if (sub === 'preview') {
+      const o = RO.orderOf(text(url.searchParams.get('order')), RO.fold(RO.readLines(mineDir(ctx))).orders);
+      if (!o) return send(bad(404, 'no such order'));
+      const html = require('./report-design.js').sanitize(require('./report-slides.js').deckHtml(RO.previewDeck(o)));
+      res.writeHead && res.writeHead(200, { 'content-type': 'text/html; charset=utf-8', 'cache-control': 'no-store' });
+      if (res.end) res.end(html); else { res.status = 200; res.body = html; }
+      return true;
+    }
+    if (sub !== '') return send(bad(404, 'no such route'));
+    const d = draftOf(w, url.searchParams.get('path'));
+    if (d.error) return send(d.error);
+    return send({ status: 200, body: stateOf(ctx, w, d) });
+  }
+  if (!POSTS.includes(sub)) return send(bad(404, 'no such route'));
+  if (req.method !== 'POST') return send(bad(405, 'POST only'));
+  if (req.headers && req.headers['x-pmos-session']) return send(bad(403, 'a session cannot change a report: the PM presses on the page'));
+  const read = await ctx.readJson(req);
+  if (!read.ok) return send(bad(400, 'the body is not JSON'));
+  const body = read.body || {};
+  const g = guard.requirePagePress(req, body);
+  if (!g.ok) return send(bad(g.status, g.error));
+  const w = wsOf(ctx, text(body.ws));
+  if (!w) return send(bad(404, 'no such workspace'));
+  const dir = mineDir(ctx);
+
+  if (sub === 'rename') { const r = RO.rename(dir, text(body.id), text(body.name)); return send(r.ok ? { status: 200, body: { ok: true } } : bad(r.status, r.error)); }
+  if (sub === 'remove') { const r = RO.remove(dir, text(body.id)); return send(r.ok ? { status: 200, body: { ok: true } } : bad(r.status, r.error)); }
+
+  const d = draftOf(w, body.path);
+  if (d.error) return send(d.error);
+  if (sub === 'save') {
+    const report = readJson(d.P.report.abs), brief = readJson(d.P.brief.abs);
+    if (!report) return send(bad(409, 'this draft was written before the report engine: its slides have no layouts to save'));
+    const outline = [{ part: 'Title', layout: 'overview' }].concat(RO.partsOf(report, brief), [{ part: 'Sources', layout: 'sources' }]);
+    const r = RO.save(dir, { kind: 'order', name: text(body.name) || savedName(w, d.id, brief), outline, from: { report: d.id, slot: d.slot } });
+    return send(r.ok ? { status: 200, body: { ok: true, id: r.id } } : bad(r.status, r.error));
+  }
+  if (sub === 'slide') {
+    const n = Number(body.n);
+    if (!Number.isInteger(n) || n < 0) return send(bad(400, 'n is the slide, from 0'));
+    const sp = slidePart(d, n);
+    if (sp.error) return send(sp.error);
+    const r = RO.save(dir, { kind: 'slide', name: sp.part, outline: [sp], from: { report: d.id, slot: d.slot } });
+    return send(r.ok ? { status: 200, body: { ok: true, id: r.id, name: sp.part, layout: sp.layout } } : bad(r.status, r.error));
+  }
+  if (d.issued) return send(bad(409, `the ${d.slot} report is issued, so it is frozen. The next cycle starts from its order`));
+  if (sub === 'undo') { const r = RO.undo(w.root, d.id, d.slot); return send(r.ok ? { status: 200, body: { ok: true, order: r.order } } : bad(r.status, r.error)); }
+
+  // apply
+  const order = RO.orderOf(text(body.order), RO.fold(RO.readLines(dir)).orders);
+  if (!order) return send(bad(404, 'no such order'));
+  const brief = readJson(d.P.brief.abs);
+  if (brief && Array.isArray(brief.agreed_outline) && brief.agreed_outline.length) {
+    RO.setNext(w.root, d.id, order, d.slot, { by: g.actor });
+    return send({ status: 200, body: { ok: true, next: { id: order.id, name: order.name } } });
+  }
+  RO.snapshot(w.root, d.id, d.slot, { order });
+  const m = RE.make(w.root, d.id, { slot: d.slot, template: RL.templateOf(order.id) ? order.id : order });
+  if (!m.ok) { RO.undo(w.root, d.id, d.slot); return send(bad(m.status || 400, m.error)); }
+  const rel = d.P.md.rel;
+  const r = require('./routes-report-flow.js').ask(ctx, w, d.id, redraftWords(d.id, d.slot, rel, order), rel);
+  if (!r.ok) { RO.undo(w.root, d.id, d.slot); return send(bad(r.status || 409, r.error)); }
+  return send({ status: 200, body: { ok: true, redraft: { session: r.session, started: !!r.started, passed: !!r.passed }, order: { id: order.id, name: order.name } } });
+}
+
+module.exports = { prefixes, handle, stateOf, redraftWords };

package/workspace/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "pmos-workspace",
-  "version": "0.534.0",
+  "version": "0.536.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "pmos-workspace",
-      "version": "0.534.0",
+      "version": "0.536.0",
       "license": "MIT",
       "dependencies": {
         "@anthropic-ai/sdk": "^1.3.0",

package/workspace/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pmos-workspace",
-  "version": "0.534.0",
+  "version": "0.536.0",
   "private": true,
   "description": "PMOS Terminal Workspace — local companion hosting real PTYs beside the library and gates (D62)",
   "license": "MIT",

package/workspace/premium-briefing-depth-test.js

@@ -254,7 +254,10 @@ const GANTT = [
   await until(() => p.evaluate(() => document.querySelectorAll('#evSettings:not([hidden]) .ev-fr[data-src]').length > 0), 20000);
   const ft = await p.evaluate(() => document.querySelector('#evSettings .ev-st-main').textContent);
   const srcRows = await p.evaluate(() => document.querySelectorAll('#evSettings .ev-fr[data-src]').length);
-  ok('F1 Settings › Connectors lists the workspace\'s sources with when each was last read, and says it never posts', srcRows >= 3 && /read /.test(ft) && /never posts/.test(ft) && !/up to date/i.test(ft), ft);
+  // batch 28 item 1 (CnA): "never posts" is the (i) button's note; press it and the note says so
+  await p.click('#evSettings [data-ev-info]');
+  const note = await until(() => p.evaluate(() => (document.querySelector('#evSettings #evConInfo') || {}).textContent || ''), 5000);
+  ok('F1 Settings › Connectors lists the workspace\'s sources with when each was last read, and (i) says it never posts', srcRows >= 3 && /read/.test(ft) && /never posts/.test(note || '') && !/up to date/i.test(ft), ft + ' | ' + note);
   await shot('src-1280-light');
   const one = await p.evaluate(() => { const b = document.querySelector('#evSettings .ev-fr [data-ev-read]'); return b ? b.dataset.evRead : null; });
   if (one) {

package/workspace/public/pm/cozy-ev.css

@@ -292,12 +292,21 @@
 /* Settings › Connectors: each source's last read (feedback batch 16 item 5, FmA3Settings; was the Sources card), and the amber box on top */
 .ev-st-main > .ev-st-warn { margin-bottom: 12px; color: var(--cz-ink); }
 .ev-st-warn .ev-ib-card { background: var(--cz-card); }
-.ev-st .ev-reads { margin-bottom: 12px; }
+.ev-st .ev-reads { margin-bottom: 0; }
 .ev-st .ev-fr { align-items: center; gap: 10px; }
 .ev-st .ev-fr .ev-late { color: var(--cz-risk); font-weight: var(--fw-strong); }
 .ev-st .ev-ib-sp { width: 32px; flex: none; }
 .ev-st-nav .ev-mi .ev-dot.risk { margin-left: 6px; }
-.ev-st .ev-rl { margin: 4px 0; }
+/* design A (batch 28 item 1, canvas CnA): one list, trouble first; the dot sits in a gutter so every name lines up */
+.ev-st .ev-fr { min-height: 60px; box-sizing: border-box; padding: 10px 0; }
+.ev-st .ev-fr .ev-gut { width: 8px; flex: none; display: flex; justify-content: center; }
+.ev-st .ev-fr .ev-why { margin-top: 2px; overflow-wrap: anywhere; }
+.ev-st .ev-fr .ev-why.ev-late { font-weight: inherit; }
+.ev-st .ev-fr .ev-tx > span { overflow-wrap: anywhere; }
+.ev-st .ev-info { margin: 0 0 8px; }
+.ev-st .ev-fold { border-top: 1px solid var(--cz-hair); border-bottom: 0; }
+.ev-st .ev-con-more { padding-left: 16px; border-left: 2px solid var(--cz-hair); margin-bottom: 12px; }
+@media (max-width: 760px) { .ev-st .ev-fr .ev-ib, .ev-st .ev-fr .ev-ib-sp { width: 44px; height: 44px; } }
 
 /* New for you's item Viewers (batch 18 items 2 and 2b, canvas OvA5Overlap, OvA6Given): the summary, then the two initiatives, the pick and ONE primary */
 .nv { display: flex; flex-direction: column; gap: 10px; }

package/workspace/public/pm/cozy-evmodel.js

@@ -7,6 +7,9 @@
  *   bannerOf(sources, now)        → { id, name, title: 'Reconnect Jira.', body, text, action } | null   the one source the PM must act on
  *                                   (self-heal, feedback batch 26 item 7): null while Claude repairs a source by itself, or after it did
  *   sourceRows(sources, now)      → [{ id, name, sub, when, risk, act: 'read' | 'connect' | '' }]   the Sources table (EvSources)
+ *   connectorRows(sources, health, now) → [{ id, name, trouble, why, when, act }]   Settings › Connectors, design A (CnA): trouble first
+ *   issueRow(issue)            → { src, name, why }   a harness-health issue split into a row's name and reason
+ *   clockOf(iso, now)             → '09:15' today · 'yesterday' · '3 Nov'
  *   partsOf(id)                   → what may be out of date when that source is old ('Board and the Jira-linked initiatives')
  *   fabLabel(here, open, stale, news) → 'Open the menu. You are in Home. 3 new for you. Jira 5 days old' (the button says both dots, FmGrill 13)
  *   SEARCH_KINDS · searchGroups(results, { phone }) → [{ key, label, rows }]   EvSearch's groups, in its order
@@ -71,6 +74,80 @@ export function sourceRows(sources, now = Date.now()) {
   });
 }
 
+/* Settings › Connectors, design A (batch 28 item 1, canvas CnA): one list, trouble first. Each source says its status once, on its own
+ * row. A trouble row has the amber dot, one reason and one action; a quiet row has its name and its time. Claude's failed background
+ * work and the repository's Git sync failure are rows too: an issue about a source (harness-health `src`) is that source's reason,
+ * and any other issue is a row of its own. */
+const HEALTH_SRC = { calendar: 'calendar', jira: 'jira', mywork: 'my-work', tracker: 'tracker', tools: 'tools', sync: 'repository' };
+// lib/harness-health.js words each issue as one sentence that starts with the work's label (refresh SOURCES); a row splits it into
+// its name and its reason here, so the server's sentence stays as the bell and the logs know it
+const HEALTH_NAME = { calendar: 'Calendar', jira: 'Jira tickets and sprints', mywork: 'Work assigned to you', tracker: 'Tracker files', tools: 'Your tools', brief: 'Morning briefing' };
+const cap = (t) => t.replace(/^./, (c) => c.toUpperCase());
+/** { src, name, why } of a harness-health issue ({ key, text }). */
+export function issueRow(i) {
+  const key = String((i && i.key) || ''), text = String((i && i.text) || '');
+  const m = /^(failed|missed):(.+)$/.exec(key);
+  if (m) { const name = HEALTH_NAME[m[2]] || m[2], why = text.startsWith(name + ' ') ? cap(text.slice(name.length + 1)) : text; return { src: m[2], name, why }; }
+  if (key === 'sync') { const g = /^Git sync is failing: (.+?) was not found\./.exec(text); return { src: 'sync', name: 'Repository', why: g ? 'Git cannot find ' + g[1] + '. Check the address or your access.' : text }; }
+  if (key === 'brief') return { src: 'brief', name: 'Morning brief', why: cap(text.replace(/^Morning brief /, '')) };
+  if (key === 'tick') return { src: '', name: 'Background checks', why: text.replace(/^Background checks /, '').replace(/^./, (c) => c.toUpperCase()) };
+  if (key === 'signedout') return { src: '', name: 'Claude', why: text.replace(/^Claude /, '').replace(/^./, (c) => c.toUpperCase()) };
+  if (key.startsWith('unsent:')) { const k = text.indexOf(' is idle: '); return k > 0 ? { src: '', name: text.slice(0, k), why: 'Idle: ' + text.slice(k + 10) } : { src: '', name: 'A session', why: text }; }
+  return { src: '', name: 'Background work', why: text };
+}
+const two_ = (n) => String(n).padStart(2, '0');
+/** A clock time today ("09:15"), else the day ("yesterday", "3 Nov"). */
+export function clockOf(iso, now = Date.now()) {
+  const d = new Date(iso || ''); if (Number.isNaN(d.getTime())) return '';
+  const n = new Date(now), day = (x) => new Date(x.getFullYear(), x.getMonth(), x.getDate()).getTime();
+  const diff = Math.round((day(n) - day(d)) / 86400000);
+  if (diff <= 0) return two_(d.getHours()) + ':' + two_(d.getMinutes());
+  if (diff === 1) return 'yesterday';
+  return d.getDate() + ' ' + ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][d.getMonth()];
+}
+const short = (a) => a.replace(/ hours? ago$/, ' h ago');
+/**
+ * connectorRows(sources, health, now) → [{ id, name, trouble, why, when, act }]   trouble rows first (needs you, then failed, then
+ *   the other issues), then the quiet rows in the server's order.
+ *   why   the one reason (trouble), or "Checked 10:42 · same since 09:15" on a quiet row a measured read applies to, else ''
+ *   when  the time on a quiet row ('3 h ago', 'Watching', 'Not connected', 'Reading now'); '' when `why` carries the time
+ *   act   { kind: 'read' | 'open' | 'sec', label, href?, sec? } | null   the one icon action
+ */
+export function connectorRows(sources, health, now = Date.now()) {
+  const issues = (health && (health.level === 'warn' || health.level === 'bad') && health.issues) || [];
+  const bySrc = new Map(), alone = [];
+  for (const x of issues) { const i = { key: x.key, ...issueRow(x) }, id = HEALTH_SRC[i.src]; if (id && !bySrc.has(id)) bySrc.set(id, i); else if (!id) alone.push(i); }
+  const out = [];
+  for (const s of (sources || []).filter(Boolean)) {
+    const name = sourceName(s), h = s.heal, iss = bySrc.get(s.id);
+    const read = { kind: 'read', label: 'Read ' + name + ' again' };
+    if (h && h.state === 'needs-you' && h.action) {
+      const a = h.action, dur = s.as_of ? ago(s.as_of, now).replace(/ ago$/, '') : '';
+      const why = [s.as_of ? 'Not read for ' + dur + '.' : 'Never read.', h.tried || (h.why ? 'The read ' + h.why + '.' : ''), a.read ? '' : a.how].filter(Boolean).join(' ');
+      out.push({ id: s.id, name, trouble: 1, why, when: '', act: a.read ? { ...read, label: a.label } : a.href ? { kind: 'open', label: a.label, href: a.href } : { kind: 'sec', label: a.label, sec: a.sec || 'claude' } });
+      continue;
+    }
+    if (s.state === 'failed' || iss) {
+      const why = iss ? iss.why : 'Could not be read.';
+      const act = s.id === 'repository' ? (iss ? { kind: 'sec', label: 'Check the repository address', sec: 'workspaces' } : null) : read;
+      out.push({ id: s.id, name, trouble: 2, why, when: '', act });
+      continue;
+    }
+    const mend = h && h.state === 'repairing' && (s.state === 'stale' || s.state === 'never');
+    const sch = s.schedule || {};
+    if (s.state === 'fresh' && sch.same_since && sch.checked_at) {
+      out.push({ id: s.id, name, trouble: 0, why: 'Checked ' + clockOf(sch.checked_at, now) + ' · same since ' + clockOf(sch.same_since, now), when: '', act: null });
+      continue;
+    }
+    const when = s.state === 'off' ? 'Not connected' : s.state === 'building' ? 'Reading now' : mend ? 'Reading again' : s.state === 'never' ? 'Never read'
+      : s.id === 'repository' && s.state === 'fresh' ? 'Watching' : short(ago(s.as_of, now)) || 'Never read';
+    const behind = (s.state === 'stale' || s.state === 'never') && s.id !== 'repository' && !mend;
+    out.push({ id: s.id, name, trouble: 0, why: '', when, act: behind ? read : null });
+  }
+  for (const i of alone) out.push({ id: 'issue:' + i.key, name: i.name || 'Background work', trouble: 3, why: i.why, when: '', act: i.key === 'signedout' ? { kind: 'sec', label: 'Open Settings › Claude', sec: 'claude' } : null });
+  return out.map((r, k) => ({ r, k })).sort((a, b) => (a.r.trouble || 9) - (b.r.trouble || 9) || a.k - b.k).map((x) => x.r);
+}
+
 export function fabLabel(here, open, stale, news) {
   if (open) return 'Close the menu';
   return 'Open the menu. You are in ' + (PLACE[here] || 'PMOS') + (news > 0 ? '. ' + news + ' new for you' : '') + (stale ? '. ' + (stale.text || 'A source is stale') : '');

package/workspace/public/pm/cozy-settings.js

@@ -12,10 +12,12 @@
  *               › Dress for the day (adler.dress.*, canvas AsSet1, batch 18 item 8): the master switch, where you are, one switch per group,
  *               "More festivals" with one switch per day, big sports and your colours, exam season, your days, Wear now (pm/cozy-seasons.js).
  *               openSettings('dress') opens it straight away (the › in Adler's tap popover, AsSet2Tap).
- *   Connectors  each source's last read (GET /api/sources; was the Sources card, feedback batch 16 item 5, canvas FmA3Settings): the amber dot
- *               and ↻ Read again on a stale or failed one (POST /api/sources/refresh), ↻ in the header reads every source
- *               (POST /api/sources/refresh-all); then what PMOS reads on its own, and the connectors your sessions have (GET and POST
- *               /api/proactive/settings)
+ *   Connectors  design A (batch 28 item 1, canvas CnA): one list, trouble first (GET /api/sources, pm/cozy-evmodel.js connectorRows). Each
+ *               source says its status once, on its own row: a trouble row has the amber dot, one reason and one icon action (↻ POST
+ *               /api/sources/refresh, or the place to fix it); a quiet row has its name and time, and "Checked 10:42 · same since 09:15"
+ *               where a measured read applies (SrSee R3). Claude's failed background work and the Git sync failure are rows too. ↻ in the
+ *               header reads every source (POST /api/sources/refresh-all); (i) says what PMOS reads and that it never posts. The switches
+ *               (what PMOS reads on its own, the connectors your sessions have; GET and POST /api/proactive/settings) fold into one row.
  *   Workspaces  the repositories PMOS works in (GET and POST /api/workspaces, POST /api/workspaces/forget; the folder is never touched)
  *   Workflows   a link to its own page, /premium-workflows.html (pm/wf-page.js, D99): the stages each kind of initiative goes through
  *   Updates     the versions and Check now, Update, Restart to update (GET /api/kit/status, POST /api/kit/check | update | upgrade-app); opening it
@@ -25,7 +27,7 @@
  * Adler's moments (batch 17 item 4-B, AdM4): one face per section, where Claude speaks. Updates: glasses while it checks or installs,
  * holding the card when a version is ready, calm when up to date. General: holding the update card, else the Jira promise (only after
  * Commit). A failure in the status line takes the honest face, and then the section's face steps back (one Adler per screen).
- * The card at the bottom of General says when an update is ready. While a source needs you (lib/source-heal.js), an amber box at the top of every section names
+ * The card at the bottom of General says when an update is ready. While a source needs you (lib/source-heal.js), an amber box at the top of every other section names
  * it with its one action and what Claude tried, and the place menu opens Settings at Connectors. Every write is the PM's press (pmPost carries the launch nonce).
  * PMOS reads the sources and never posts to them.
  *   openSettings(section?) */
@@ -33,7 +35,7 @@ import { mountClaudeSetup } from './cozy-claude-setup.js';
 import * as JL from './cozy-jl.js';
 import { pmGet, pmPost, pressFetch } from './http.js';
 import { esc, svg, ICON, toast, wsParam, wsQ } from './cozy-evui.js';
-import { sourceRows, bannerOf } from './cozy-evmodel.js';
+import { connectorRows, bannerOf } from './cozy-evmodel.js';
 import * as AD from './cozy-adler.js';
 import * as SE from './cozy-seasons.js';
 import { weeksOf, lineOf, storiesOf } from './upd-weeks.js';
@@ -47,7 +49,7 @@ const SECTIONS = [['general', 'General'], ['claude', 'Claude'], ['checks', 'Clau
 const PAGE_LINKS = { workflows: '/premium-workflows.html' };   // a section that is a page of its own: the row goes there
 const SRC = { calendar: 'Calendar', wispr: 'Wispr Flow', mail: 'Mail', slack: 'Slack', jira: 'Jira', confluence: 'Confluence', github: 'GitHub', drive: 'Google Drive', figma: 'Figma', website: 'Your websites' };
 const VIEWER_KEY = 'pmos.cz.viewer';
-const T = { el: null, sec: 'general', ws: null, st: {}, src: null, con: {}, conn: [], set: null, prods: null, msg: '', busy: false, phase: '', say: '', back: null, fresh: null, reading: '', note: {}, lines: null, dress: false, more: false, bday: false, dset: {}, wkOpen: new Set(), wkMore: new Set(), arc: false };
+const T = { el: null, sec: 'general', ws: null, st: {}, src: null, con: {}, conn: [], set: null, prods: null, msg: '', busy: false, phase: '', say: '', back: null, fresh: null, reading: '', note: {}, info: false, fold: false, dress: false, more: false, bday: false, dset: {}, wkOpen: new Set(), wkMore: new Set(), arc: false };
 const cmpVer = (a, b) => { const x = String(a || '0').split('-')[0].split('.').map(Number), y = String(b || '0').split('-')[0].split('.').map(Number); for (let i = 0; i < 3; i++) if ((x[i] || 0) !== (y[i] || 0)) return (x[i] || 0) < (y[i] || 0) ? -1 : 1; return 0; };
 const home = () => (T.ws && T.ws[0] ? T.st[T.ws[0].id] : null);
 const latest = () => { const s = home(); return (s && (s.latest || (s.lastCheck && s.lastCheck.latest))) || null; };
@@ -168,22 +170,24 @@ function dressSec() {
 const firstLine = () => { const c = changes().find((e) => e.v === latest()); const p = c && c.prs && c.prs[0]; return p ? (p.t || p.s || '') : ''; };
 /* each source's last read (FmA3Settings): the name, "read 09:41", the amber dot and ↻ on a stale or failed one */
 const RD = 'M20 12a8 8 0 1 1-2.3-5.7M20 4v5h-5';
+const INFO_I = 'M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18M12 11v5M12 8h.01';
 const readBtn = (id, label, cls = 'ev-ib') => `<button type="button" class="${cls}" data-ev-read="${esc(id)}" aria-label="${esc(label)}" title="${esc(label)}"${T.reading ? ' disabled' : ''}>${svg(RD, 18)}</button>`;
 function readsHtml() {
   const s = T.fresh;
   if (!s) return '<p class="ev-small ev-mut">Reading when each source was last read.</p>';
   if (!s.ok) return `<p class="ev-small ev-mut">When each source was last read could not be read${s.error ? ': ' + esc(s.error) : ''}.</p>`;
-  const rows = sourceRows(s.sources).map((x) => `<div class="ev-trow ev-fr" data-src="${esc(x.id)}"><div class="ev-tx"><b>${esc(x.name)}</b>${T.note[x.id] ? `<p class="ev-small" role="status">${esc(T.note[x.id])}</p>` : ''}</div>`
-    + `${x.risk ? '<i class="ev-dot risk" aria-hidden="true"></i>' : ''}<span class="ev-small ${x.risk ? 'ev-late' : 'ev-mut'}">${esc(/^(Watching|Never read|Not connected|Reading now|Could not be read)$/.test(x.when) ? x.when : 'read ' + x.when)}</span>`
-    + `${x.act === 'read' ? readBtn(x.id, 'Read ' + x.name + ' again') : '<span class="ev-ib-sp" aria-hidden="true"></span>'}</div>`).join('');
-  // the background line (harness-health): quiet when all is well, a box when something needs a look
-  const hl = s.health && s.health.level;
-  const health = !s.health ? '' : hl === 'warn' || hl === 'bad'
-    ? `<div class="ev-box ev-small ev-line" id="srcHealth" data-level="${esc(hl)}" role="status"><i class="ev-dot risk" aria-hidden="true"></i><p class="ev-grow"><b>${esc(s.health.line)}</b>${(s.health.issues || []).slice(1, 4).map((i) => `<br>${esc(i.text)}`).join('')}</p></div>`
-    : `<p class="ev-small ev-mut ev-line" id="srcHealth" data-level="ok"><i class="ev-dot ok" aria-hidden="true"></i>${esc(s.health.line || '')}</p>`;
-  // which reads each part of Home shows (briefing-source-flow slice 5), in home-more.js readLine words
-  const L = T.lines ? [['Today', T.lines.readLine(s, ['calendar'])], ['Needs you', T.lines.readLine(s, ['initiatives', 'my-work', 'd:brief'])]].filter((x) => x[1]) : [];
-  return `${health}<div class="ev-reads">${rows}</div>${L.map(([k, v]) => `<p class="ev-small ev-mut ev-rl" data-reads="${esc(k)}"><b>${esc(k)}:</b> ${esc(v)}</p>`).join('')}`;
+  const act = (x) => {
+    const a = x.act;
+    if (!a) return '<span class="ev-ib-sp" aria-hidden="true"></span>';
+    if (a.kind === 'read') return readBtn(x.id, a.label);
+    const at = a.kind === 'open' ? `href="${esc(a.href)}" target="_blank" rel="noopener"` : `href="#${esc(a.sec)}" data-ev-sec="${esc(a.sec)}"`;
+    return `<a class="ev-ib" ${at} aria-label="${esc(a.label)}" title="${esc(a.label)}">${svg(ICON.open, 18)}</a>`;
+  };
+  // one list, trouble first (CnA): the amber dot, the one reason and the one action on a trouble row; the name and the time on a quiet one
+  const rows = connectorRows(s.sources, s.health).map((x) => `<div class="ev-trow ev-fr${x.trouble ? ' ev-fr-t' : ''}" data-src="${esc(x.id)}"><span class="ev-gut">${x.trouble ? '<i class="ev-dot risk" aria-hidden="true"></i>' : ''}</span>`
+    + `<div class="ev-tx ev-grow">${x.trouble ? `<b>${esc(x.name)}</b>` : `<span>${esc(x.name)}</span>`}${x.why ? `<p class="ev-small ev-why ${x.trouble ? 'ev-late' : 'ev-mut'}">${x.trouble ? '<span class="ev-vh">Needs a look: </span>' : ''}${esc(x.why)}</p>` : ''}${T.note[x.id] ? `<p class="ev-small" role="status">${esc(T.note[x.id])}</p>` : ''}</div>`
+    + `${x.when ? `<span class="ev-small ev-mut">${esc(x.when)}</span>` : ''}${act(x)}</div>`).join('');
+  return `<div class="ev-reads">${rows}</div>`;
 }
 /** The amber box at the top of Settings, only when the PM must act on a source (self-heal, feedback batch 26 item 7). While Claude
  * reads a source again by itself, or after it did, there is no box. The box names the one action and links to the exact place:
@@ -196,11 +200,19 @@ function staleHtml() {
     : `<a class="ev-ib ev-ib-card" href="${esc(a.href || '#' + a.sec)}"${a.href ? ' target="_blank" rel="noopener"' : ` data-ev-sec="${esc(a.sec)}"`} aria-label="${esc(a.label)}" title="${esc(a.label)}">${svg(ICON.open, 18)}</a>`;
   return `<div class="ev-warn ev-line ev-st-warn" id="srcWarn" data-cause="${esc(b.cause || '')}"><i class="ev-dot risk" aria-hidden="true"></i><p class="ev-grow"><b>${esc(b.title)}</b> ${esc(b.body)}${a.read ? '' : ' ' + esc(a.how)}</p>${act}</div>`;
 }
+const INFO = 'PMOS reads these sources and never posts to them. A switch chooses only what PMOS reads on its own; your Claude sessions can use every connector.';
 function connectors() {
-  if (T.src === null) return readsHtml() + '<p class="ev-small ev-mut">Reading the connectors.</p>';
-  const brief = Object.keys(SRC).filter((k) => k in T.src).map((k) => trow(SRC[k], T.src[k] ? 'PMOS reads it on its own' : 'PMOS does not read it on its own', sw(T.src[k], `data-ev-src="${k}"`, SRC[k])));
-  const more = T.conn.filter((c) => !c.source).map((c) => trow(c.label, T.con[c.name] ? 'On. Your sessions can use it' : 'Your sessions can use it', sw(T.con[c.name], `data-ev-conn="${esc(c.name)}"`, c.label)));
-  return readsHtml() + '<p class="ev-small ev-mut">Every connector your Claude session has. A switch chooses only what PMOS reads on its own. PMOS reads and never posts.</p>' + brief.join('') + more.join('');
+  const info = T.info ? `<p class="ev-small ev-mut ev-info" id="evConInfo">${esc(INFO)}</p>` : '';
+  if (T.src === null) return info + readsHtml() + '<p class="ev-small ev-mut">Reading the connectors.</p>';
+  const brief = Object.keys(SRC).filter((k) => k in T.src).map((k) => [SRC[k], trow(SRC[k], T.src[k] ? 'PMOS reads it on its own' : 'PMOS does not read it on its own', sw(T.src[k], `data-ev-src="${k}"`, SRC[k]))]);
+  const more = T.conn.filter((c) => !c.source).map((c) => [c.label, trow(c.label, T.con[c.name] ? 'On. Your sessions can use it' : 'Your sessions can use it', sw(T.con[c.name], `data-ev-conn="${esc(c.name)}"`, c.label))]);
+  const all = [...brief, ...more];
+  if (!all.length) return info + readsHtml();
+  // the other connectors fold to one row (CnA): how many, and the first three names
+  const names = all.map((x) => x[0]), sub = names.length > 3 ? names.slice(0, 3).join(', ') + ' and ' + (names.length - 3) + (names.length - 3 === 1 ? ' other' : ' others') : names.join(', ');
+  const fold = `<div class="ev-trow ev-fr ev-fold"><span class="ev-gut"></span><div class="ev-tx ev-grow"><span>${all.length} more in your Claude session</span><p class="ev-small ev-mut">${esc(sub)}</p></div>`
+    + `<button type="button" class="ev-ib" data-ev-fold aria-expanded="${!!T.fold}" aria-controls="evConMore" aria-label="${T.fold ? 'Hide the other connectors' : 'Open the other connectors'}" title="${T.fold ? 'Hide the other connectors' : 'Open the other connectors'}">${svg(T.fold ? ICON.down : CHEV, 18)}</button></div>`;
+  return info + readsHtml() + fold + (T.fold ? `<div class="ev-con-more" id="evConMore">${all.map((x) => x[1]).join('')}</div>` : '');
 }
 function workspaces() {
   if (T.ws === null) return '<p class="ev-small ev-mut">Reading the repositories.</p>';
@@ -323,12 +335,14 @@ function draw() {
   const el = T.el; if (!el || el.hidden) return;
   // a redraw replaces the nodes: keep focus on the same control (by its data-ev-* key), else on the open section, never on the body
   const ae = document.activeElement, had = ae && el.contains(ae), key = had ? [...ae.attributes].find((a) => a.name.startsWith('data-ev-')) : null;
-  const n = { connectors: T.src === null ? '' : Object.keys(SRC).filter((k) => T.src[k]).length + T.conn.filter((c) => !c.source && T.con[c.name]).length, workspaces: T.ws ? T.ws.filter((x) => !x.linked).length : '', updates: ready() ? '<span class="ev-pill y">1</span>' : '' };
+  const n = { workspaces: T.ws ? T.ws.filter((x) => !x.linked).length : '', updates: ready() ? '<span class="ev-pill y">1</span>' : '' };
   const stale = T.fresh && T.fresh.ok ? bannerOf(T.fresh.sources) : null;
   el.querySelector('.ev-st-nav').innerHTML = '<h2 class="ev-h2">Settings</h2>' + SECTIONS.map(([k, l]) => PAGE_LINKS[k] ? `<a href="${PAGE_LINKS[k]}" class="ev-mi">${esc(l)}</a>` : `<a href="#${k}" class="ev-mi" data-ev-sec="${k}"${T.sec === k ? ' aria-current="page"' : ''}>${esc(l)}${k === 'connectors' && stale ? '<i class="ev-dot risk" aria-label="A source needs you" role="img"></i>' : ''}${n[k] !== undefined && n[k] !== '' ? `<span class="ev-k">${typeof n[k] === 'number' ? n[k] : n[k]}</span>` : ''}</a>`).join('');
   const label = (SECTIONS.find((x) => x[0] === T.sec) || SECTIONS[0])[1];
-  const all = T.sec === 'connectors' ? `<button type="button" class="ev-ib" data-ev-readall aria-label="Read every source again" title="Read all again"${T.reading ? ' disabled' : ''}>${svg(RD, 18)}</button>` : '';
-  el.querySelector('.ev-st-main').innerHTML = staleHtml() + `<div class="ev-top"><h3 class="ev-h2" id="evStTitle">${esc(label)}</h3>${all}<button type="button" class="ev-ib" data-ev-close aria-label="Close settings" title="Close settings">${svg(ICON.close, 18)}</button></div>`
+  const all = T.sec === 'connectors' ? `<button type="button" class="ev-ib" data-ev-info aria-expanded="${!!T.info}" aria-controls="evConInfo" aria-label="What PMOS reads and what it never does" title="What PMOS reads and what it never does">${svg(INFO_I, 18)}</button>`
+    + `<button type="button" class="ev-ib" data-ev-readall aria-label="Read every source again" title="Read all again"${T.reading ? ' disabled' : ''}>${svg(RD, 18)}</button>` : '';
+  // the amber box sits on top of the other sections only: on Connectors the trouble row says it (say it once, CnA)
+  el.querySelector('.ev-st-main').innerHTML = (T.sec === 'connectors' ? '' : staleHtml()) + `<div class="ev-top"><h3 class="ev-h2" id="evStTitle">${esc(label)}</h3>${all}<button type="button" class="ev-ib" data-ev-close aria-label="Close settings" title="Close settings">${svg(ICON.close, 18)}</button></div>`
     + BODY[T.sec]() + `<p role="status"${T.msg && AD.moodOfText(T.msg) === 'honest' ? ' class="ev-say honest"' : ''}>${T.msg && AD.moodOfText(T.msg) === 'honest' ? AD.adler('honest', 24, { label: false }) : ''}${esc(T.msg)}</p>`;
   if (disposeClaudeSetup) { disposeClaudeSetup(); disposeClaudeSetup = null; }
   const setup = el.querySelector('[data-claude-setup]');
@@ -372,6 +386,8 @@ async function press(e) {
   if ('evClose' in t.dataset) { closeSettings(); return; }
   if (t.dataset.evWk) { const k = t.dataset.evWk; if (T.wkOpen.has(k)) T.wkOpen.delete(k); else T.wkOpen.add(k); draw(); return; }
   if ('evArc' in t.dataset) { T.arc = !T.arc; draw(); return; }
+  if ('evInfo' in t.dataset) { T.info = !T.info; draw(); return; }
+  if ('evFold' in t.dataset) { T.fold = !T.fold; draw(); return; }
   if (t.dataset.evMore) { T.wkMore.add(t.dataset.evMore); draw(); return; }
   if (t.dataset.evGo) { T.sec = t.dataset.evGo; draw(); return; }
   if (t.dataset.evSeg === 'theme') { const M = await import('./cozy-nav.js'); M.setTheme(t.dataset.v); draw(); return; }
@@ -480,7 +496,6 @@ async function waitRestart(from, log) {
 }
 /** GET /api/sources: when each source was last read. The place menu's amber dot follows (the event pm:sources). */
 async function readFresh() {
-  if (!T.lines) T.lines = await import('./home-more.js').catch(() => null);
   const r = await pmGet('/api/sources' + wsQ());
   T.fresh = r && r.ok !== false ? r : { ok: false, error: (r && r.error) || 'the server did not answer' };
   if (T.fresh.ok) window.dispatchEvent(new CustomEvent('pm:sources', { detail: T.fresh }));
@@ -525,7 +540,7 @@ export function openSettings(section) {
   const el = mount();
   if (section === 'dress') { T.sec = 'adler'; T.dress = true; } else if (section && BODY[section]) { T.sec = section; T.dress = false; }
   else if (el.hidden) { T.sec = 'general'; T.dress = false; }   // a fresh open with no section opens on General (R2), not on the section of the last visit
-  if (el.hidden) { const ae = document.activeElement; T.back = ae && ae !== document.body ? ae : null; T.ws = null; T.src = null; T.msg = ''; T.phase = ''; T.auto = false; T.wkOpen = new Set(); T.wkMore = new Set(); T.arc = false; T.fresh = null; T.note = {}; T.dset = {}; T.cl = null; T.gr = null; T.np = null; JL.reset(); }
+  if (el.hidden) { const ae = document.activeElement; T.back = ae && ae !== document.body ? ae : null; T.ws = null; T.src = null; T.msg = ''; T.phase = ''; T.auto = false; T.wkOpen = new Set(); T.wkMore = new Set(); T.arc = false; T.fresh = null; T.note = {}; T.info = false; T.fold = false; T.dset = {}; T.cl = null; T.gr = null; T.np = null; JL.reset(); }
   el.hidden = false; document.getElementById('evStScrim').hidden = false; el.setAttribute('data-esc-layer', '');
   draw();
   const f = el.querySelector('[aria-current="page"]'); if (f) f.focus();

package/workspace/public/pm/cozy-vw-rp.css

@@ -310,3 +310,43 @@ button.rp-cc { cursor: pointer; }
 .rf-lk .rf-fix small { color: var(--cz-ink3); font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .rf-tplx { padding: 10px 12px; border: 1px solid var(--cz-hair); border-radius: 14px; background: var(--cz-bluebg); }
 .rf-hv em.rf-rest { color: var(--cz-ink2); }
+
+/* ── the orders of a draft (batch 27 item 16; canvas TpA, TpD, TpE; report-orders-ui.js) ── */
+.ro-row { align-items: center; }
+.ro-row .ro-ib.rp-tl { width: 30px; height: 30px; }
+.ro-next { color: var(--cz-ink3); }
+.ro-ass { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--cz-blue); background: var(--cz-card); font-size: var(--fs-body); line-height: var(--lh-body); }
+.ro-ass p { margin: 0; }
+.ro-st { color: var(--cz-blueink); font-weight: var(--fw-strong); }
+.vz .ro-note { margin: 0; font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--cz-ink3); }
+.ro-pts { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
+.ro-pt { display: inline-flex; padding: 2px 8px; border-radius: 8px; border: 1px solid var(--cz-hair); background: var(--cz-well); color: var(--cz-ink2); font-size: var(--fs-badge); line-height: var(--lh-badge); }
+.ro-pt.add, .ro-pt.on { border-color: var(--cz-blue); color: var(--cz-blueink); font-weight: var(--fw-strong); background: var(--cz-card); }
+.ro-pt.cut { border-style: dashed; color: var(--cz-ink3); text-decoration: line-through; background: none; }
+.ro-acts { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
+.ro-acts .rp-pri { margin: 0; width: 36px; height: 36px; }
+.ro-gal { display: flex; flex-direction: column; gap: 10px; }
+.ro-gh { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
+.ro-gh small { display: block; color: var(--cz-ink3); font-size: var(--fs-meta); line-height: var(--lh-meta); }
+.ro-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
+.ro-card { display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 10px; border-radius: 14px; border: 1px solid var(--cz-hair); background: var(--cz-card); color: var(--cz-ink); cursor: pointer; font: inherit; }
+.ro-card:hover { background: var(--cz-well); }
+.ro-card:focus-visible, .ro-sl:focus-visible { outline: 2px solid var(--cz-blue); outline-offset: 2px; }
+.ro-card.now { border-color: var(--cz-blue); }
+.ro-card small, .ro-sl small { color: var(--cz-ink3); font-size: var(--fs-meta); line-height: var(--lh-meta); }
+.ro-cn { display: flex; align-items: center; gap: 6px; font-size: var(--fs-row); line-height: var(--lh-row); }
+.ro-tag { display: inline-flex; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--cz-hair); font-size: var(--fs-badge); line-height: var(--lh-badge); color: var(--cz-ink2); font-weight: var(--fw-strong); }
+.ro-tag.ro-star { color: var(--cz-blueink); border-color: var(--cz-blue); }
+.ro-pics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
+.ro-pic { display: block; position: relative; aspect-ratio: 16 / 9; border-radius: 4px; overflow: hidden; background: var(--cz-well); box-shadow: inset 0 0 0 1px var(--cz-hair); }
+.ro-slides { display: flex; flex-wrap: wrap; gap: 10px; }
+.ro-sl { display: flex; flex-direction: column; gap: 4px; width: 120px; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; font: inherit; }
+.ro-sl .ro-pics { grid-template-columns: 1fr; }
+.ro-big { position: relative; aspect-ratio: 16 / 9; }
+.ro-big .ro-pic { position: absolute; inset: 0; }
+.ro-ren { display: flex; align-items: center; gap: 6px; }
+.ro-ren input { flex: 1; min-width: 0; height: 34px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--cz-hair); background: var(--cz-card); color: var(--cz-ink); font: inherit; }
+.ro-ren .rp-pri { margin: 0; }
+@media (max-width: 560px) { .ro-grid { grid-template-columns: 1fr; } }
+.ro-ib.rp-pri { background: var(--cz-blue); color: var(--cz-onsolid); border-radius: 999px; }
+.ro-ib.rp-pri:hover { background: var(--cz-blue); filter: brightness(1.08); color: var(--cz-onsolid); }