music(pwa): 自家 icon — 黑底圆角 + 金黄八分音符

apps/music/frontend/scripts/gen-icons.mjs

@@ -0,0 +1,39 @@
+#!/usr/bin/env node
+// 一次性脚本：把 icon-source.svg 渲染成 PWA 所需的各尺寸 PNG。
+// 用法： node scripts/gen-icons.mjs   （需先 npm i -D sharp）
+
+import sharp from 'sharp'
+import { readFileSync, writeFileSync } from 'fs'
+import { dirname, resolve } from 'path'
+import { fileURLToPath } from 'url'
+
+const __dirname = dirname(fileURLToPath(import.meta.url))
+const src = readFileSync(resolve(__dirname, 'icon-source.svg'))
+const pub = resolve(__dirname, '..', 'public')
+
+async function render(out, size) {
+  await sharp(src).resize(size, size).png().toFile(resolve(pub, out))
+  console.log('wrote', out)
+}
+
+// Maskable 版本：留 ~10% safe-zone padding，避免 Android 圆形遮罩切到音符
+async function renderMaskable(out, size) {
+  const pad = Math.round(size * 0.1)
+  const inner = size - pad * 2
+  const innerBuf = await sharp(src).resize(inner, inner).png().toBuffer()
+  await sharp({
+    create: { width: size, height: size, channels: 4, background: '#0f0f0f' },
+  })
+    .composite([{ input: innerBuf, top: pad, left: pad }])
+    .png()
+    .toFile(resolve(pub, out))
+  console.log('wrote', out)
+}
+
+await render('pwa-192x192.png', 192)
+await render('pwa-512x512.png', 512)
+await render('apple-touch-icon-180x180.png', 180)
+await render('favicon-48x48.png', 48)
+await renderMaskable('maskable-icon-512x512.png', 512)
+
+console.log('done')

apps/music/frontend/scripts/icon-source.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
+  <rect width="512" height="512" rx="96" ry="96" fill="#0f0f0f"/>
+  <g fill="#f5b800">
+    <!-- stem (slight tilt) -->
+    <path d="M302 110 L322 105 L322 360 L302 365 Z"/>
+    <!-- flag: bezier swoop off the stem top -->
+    <path d="M322 105 C 400 130, 430 200, 380 270 C 410 210, 380 160, 322 145 Z"/>
+    <!-- note head: ellipse rotated -22° -->
+    <ellipse cx="250" cy="360" rx="64" ry="46" transform="rotate(-22 250 360)"/>
+  </g>
+</svg>