feat: P1 收尾 —— 事件面板区块与 90 天响应时间趋势

事件时间线（面板侧）：
- 监控列表下方「最近事件」区块（最近 20 条：时间/类型/目标/详情），
  无事件自动隐藏；维护窗口内事件带「维护」标记；窄屏隐藏详情列

响应时间趋势（P1-2）：
- 当日分桶在 {total,up} 外累计 latSum/latCount/latMax（仅在线样本）
- 快照输出 lat: { avg, max, days:[{key,avg}] }
- 卡片视图：可用率条下方新增「90 天日均延迟」细柱图（最近 30 天 + 均值）
- 表格视图：可用率列 tooltip 追加「90 天日均延迟 X ms（峰值 Y ms）」
- --demo 同步生成 90 天延迟样例（含起伏），静态部署也能看到效果

验证：verify-views 新增 [J] 段 5 条断言（趋势条/30 格/tooltip/事件空态/无溢出），
六套合计 159 项全通过（17+35+26+20+39+22）。

至此 P0（通知、证书）与 P1（事件时间线、维护窗口、响应时间趋势）全部落地。

scripts/verify-views.cjs

@@ -6,7 +6,10 @@
  * 用法：NODE_PATH=<playwright node_modules> node scripts/verify-views.cjs [baseUrl]
  */
 const fs = require('node:fs');
+const http = require('node:http');
+const os = require('node:os');
 const path = require('node:path');
+const { spawn } = require('node:child_process');
 const { chromium } = require('playwright');
 
 const BASE = process.argv[2] || 'http://localhost:8787';
@@ -244,6 +247,64 @@ async function main() {
     check(`${c.label}对比度 ≥${need}`, c.r >= need, `${c.r}:1`);
   }
 
+  // ---------- J. 事件区块与延迟趋势（演示快照，进程内临时服务） ----------
+  console.log('\n[J] 事件区块与延迟趋势');
+  const tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), 'shiroko-events-'));
+  try {
+    fs.cpSync(path.join(__dirname, '..', 'public'), tmpDir, { recursive: true });
+    const cfgPath = path.join(tmpDir, 'monitors.json');
+    const demoCfg = JSON.parse(fs.readFileSync(cfgPath, 'utf8'));
+    demoCfg.settings.dataFilter = 'config';
+    fs.writeFileSync(cfgPath, `${JSON.stringify(demoCfg, null, 2)}\n`);
+    await new Promise((resolve) => {
+      const child = spawn(process.execPath, [path.join(__dirname, '..', 'prober', 'node', 'index.js'),
+        '--once', '--demo', `--config=${cfgPath}`, `--local-config=${path.join(tmpDir, 'none.json')}`,
+        `--out=${path.join(tmpDir, 'status.json')}`], { stdio: 'ignore' });
+      child.on('exit', (code) => resolve(code));
+    });
+    const demoServer = http.createServer((req, res) => {
+      const rel = decodeURIComponent(req.url.split('?')[0]);
+      const file = path.join(tmpDir, rel === '/' ? 'index.html' : rel);
+      fs.readFile(file, (err, data) => {
+        if (err) {
+          res.writeHead(404);
+          res.end();
+          return;
+        }
+        const mime = { '.html': 'text/html;charset=utf-8', '.js': 'text/javascript', '.css': 'text/css', '.json': 'application/json', '.svg': 'image/svg+xml', '.webp': 'image/webp', '.png': 'image/png' }[path.extname(file)] ?? 'application/octet-stream';
+        res.writeHead(200, { 'content-type': mime });
+        res.end(data);
+      });
+    });
+    await new Promise((r) => demoServer.listen(8894, r));
+    const dp = await browser.newPage({ viewport: { width: 1440, height: 900 } });
+    await dp.goto('http://localhost:8894/?source=static&view=cards', { waitUntil: 'domcontentloaded' });
+    await dp.waitForSelector('.card', { timeout: 20000 });
+    await dp.waitForTimeout(1200);
+    const dj = await dp.evaluate(() => ({
+      cards: document.querySelectorAll('.card').length,
+      trends: document.querySelectorAll('.lat-trend').length,
+      cellsPerTrend: document.querySelector('.lat-trend')?.children[1]?.children.length ?? 0,
+      trendTip: document.querySelector('.lat-trend')?.title ?? '',
+      eventsHidden: document.getElementById('events').hidden,
+      overflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
+    }));
+    check('卡片视图渲染 90 天延迟趋势条', dj.trends > 0 && dj.cellsPerTrend === 30, `${dj.trends} 条 × ${dj.cellsPerTrend} 格`);
+    check('趋势条 tooltip 含日均与峰值', /90 天日均延迟 \d+ ms · 峰值 \d+ ms/.test(dj.trendTip), dj.trendTip.slice(0, 60));
+    check('无事件时区块隐藏', dj.eventsHidden === true, '');
+    check('演示视图无横向溢出', dj.overflow <= 0, `${dj.overflow}px`);
+    // 表格视图：可用率列 tooltip 应带日均延迟
+    await dp.evaluate(() => document.querySelector('.view-btn').click());
+    await dp.waitForSelector('table.monitor-table', { timeout: 10000 });
+    await dp.waitForTimeout(500);
+    const dt = await dp.evaluate(() => document.querySelector('tr[data-status] .t-uptime')?.title ?? '');
+    check('表格可用率 tooltip 含 90 天日均延迟', /90 天日均延迟 \d+ ms/.test(dt), dt.slice(0, 60));
+    await dp.close();
+    await new Promise((r) => demoServer.close(r));
+  } finally {
+    fs.rmSync(tmpDir, { recursive: true, force: true });
+  }
+
   // 429 是刷新限流保护在起作用（快速连续导航各触发一次强制探测），面板已优雅降级为只读数据；
   // 这里只把 429 以外的错误视为失败
   const hardErrors = errors.filter((e) => !/429/.test(e));