diff --git a/src/i18n/resources/en.json b/src/i18n/resources/en.json
index bdb3d47111..ea43b19147 100644
--- a/src/i18n/resources/en.json
+++ b/src/i18n/resources/en.json
@@ -351,6 +351,40 @@
       "description": "Apply compression to audio (lowers the volume of the loudest parts of the signal and raises the volume of the softest parts)",
       "name": "Audio Compressor"
     },
+    "audio-stream": {
+      "description": "Stream audio as Opus/Ogg over HTTP (Icecast-compatible) for external applications",
+      "menu": {
+        "port": {
+          "label": "Port"
+        },
+        "quality-latency": {
+          "label": "Quality & Latency",
+          "submenu": {
+            "bitrate": {
+              "label": "Bitrate"
+            },
+            "buffer-size": {
+              "label": "Buffer Size"
+            },
+            "channels": {
+              "label": "Channels",
+              "mono": "Mono",
+              "stereo": "Stereo"
+            },
+            "sample-rate": {
+              "label": "Sample Rate"
+            }
+          }
+        }
+      },
+      "name": "Audio Stream",
+      "prompt": {
+        "port": {
+          "label": "Enter the port for the audio stream server:\nStream URL: {{streamUrl}}",
+          "title": "Audio Stream Port"
+        }
+      }
+    },
     "auth-proxy-adapter": {
       "description": "Support for the use of authentication proxy services",
       "menu": {
diff --git a/src/pear-desktop.ts b/src/pear-desktop.ts
index b5ace4e1fe..c07e5b7f92 100644
--- a/src/pear-desktop.ts
+++ b/src/pear-desktop.ts
@@ -39,3 +39,9 @@ declare module '*.css?inline' {
 
   export default css;
 }
+
+declare module '*.js?raw' {
+  const javascript: string;
+
+  export default javascript;
+}
diff --git a/src/plugins/audio-stream/BroadcastStream.ts b/src/plugins/audio-stream/BroadcastStream.ts
new file mode 100644
index 0000000000..87885c3cd0
--- /dev/null
+++ b/src/plugins/audio-stream/BroadcastStream.ts
@@ -0,0 +1,48 @@
+export class BroadcastStream {
+  private subscribers: Set<ReadableStreamDefaultController<Uint8Array>> =
+    new Set();
+
+  // Get a new stream. Any priming pages (e.g. cached Ogg header pages) are
+  // enqueued first so the subscriber can initialise its decoder before the
+  // live audio pages arrive.
+  subscribe(primingPages: Uint8Array[] = []) {
+    let controller!: ReadableStreamDefaultController<Uint8Array>;
+    const subscribers = this.subscribers;
+    const stream = new ReadableStream<Uint8Array>({
+      start(c) {
+        controller = c;
+        for (const page of primingPages) c.enqueue(page);
+        subscribers.add(c);
+      },
+      cancel() {
+        subscribers.delete(controller);
+      },
+    });
+
+    return stream;
+  }
+
+  // Write data to all readers.
+  write(chunk: Uint8Array) {
+    for (const controller of this.subscribers) {
+      // Drop slow clients whose queue has backed up rather than buffering
+      // chunks for them unboundedly.
+      if ((controller.desiredSize ?? 0) <= 0) {
+        this.subscribers.delete(controller);
+        continue;
+      }
+      try {
+        controller.enqueue(chunk);
+      } catch {
+        this.subscribers.delete(controller);
+      }
+    }
+  }
+
+  close() {
+    for (const controller of this.subscribers) {
+      controller.close();
+    }
+    this.subscribers.clear();
+  }
+}
diff --git a/src/plugins/audio-stream/StreamProcessor.js b/src/plugins/audio-stream/StreamProcessor.js
new file mode 100644
index 0000000000..be56dcfeb6
--- /dev/null
+++ b/src/plugins/audio-stream/StreamProcessor.js
@@ -0,0 +1,36 @@
+/* eslint-disable no-undef, typescript/no-unsafe-assignment, typescript/no-unsafe-member-access, typescript/no-unsafe-call */
+class RecorderProcessor extends AudioWorkletProcessor {
+  constructor(options) {
+    super();
+    const bufferSize = options?.processorOptions?.bufferSize || 4096;
+    // Prepare an interleaved stereo buffer [L,R,L,R,...]
+    this.buffer = new Float32Array(bufferSize * 2);
+    this.bufferIndex = 0;
+  }
+
+  process(inputs, outputs) {
+    const input = inputs[0];
+    if (input && input[0]) {
+      const left = input[0];
+      const right = input[1] || left; // if mono input, duplicate for right
+      for (let i = 0; i < left.length; i++) {
+        this.buffer[this.bufferIndex++] = left[i];
+        this.buffer[this.bufferIndex++] = right[i];
+        if (this.bufferIndex >= this.buffer.length) {
+          // Buffer full: send a copy to the main thread
+          this.port.postMessage(new Float32Array(this.buffer));
+          this.bufferIndex = 0;
+        }
+      }
+    }
+    // Optionally pass the audio through unchanged. outputs[0] can be an empty
+    // array (no channels connected), so guard each channel before .set().
+    if (outputs[0] && inputs[0]) {
+      if (outputs[0][0] && inputs[0][0]) outputs[0][0].set(inputs[0][0]);
+      if (outputs[0][1] && inputs[0][1]) outputs[0][1].set(inputs[0][1]);
+    }
+    return true;
+  }
+}
+
+registerProcessor('recorder-processor', RecorderProcessor);
diff --git a/src/plugins/audio-stream/backend.ts b/src/plugins/audio-stream/backend.ts
new file mode 100644
index 0000000000..7c2f52c119
--- /dev/null
+++ b/src/plugins/audio-stream/backend.ts
@@ -0,0 +1,135 @@
+import { serve, type ServerType } from '@hono/node-server';
+import { Hono } from 'hono';
+import { stream } from 'hono/streaming';
+
+import { registerCallback, type SongInfo } from '@/providers/song-info';
+import { createBackend } from '@/utils';
+
+import { BroadcastStream } from './BroadcastStream';
+import { type AudioStreamConfig } from './config';
+import { OggOpusMuxer, OggDechainer } from './ogg-opus';
+
+const VENDOR = 'Pear Desktop';
+
+let config: AudioStreamConfig;
+const broadcast = new BroadcastStream();
+
+// Current track metadata (no ffprobe - comes straight from the player).
+let currentSong: SongInfo | null = null;
+
+// Chained Ogg/Opus stream: one logical stream per song. Pages go straight to
+// every subscriber; the muxer caches the current stream's header pages for late
+// joiners.
+const muxer = new OggOpusMuxer((page) => broadcast.write(page));
+
+// OpusTags comments for the current track (text only).
+function currentComments(): string[] {
+  const comments: string[] = [];
+  if (currentSong?.title) comments.push(`TITLE=${currentSong.title}`);
+  if (currentSong?.artist) comments.push(`ARTIST=${currentSong.artist}`);
+  if (currentSong?.album) comments.push(`ALBUM=${currentSong.album}`);
+  return comments.length ? comments : ['TITLE=Pear Desktop'];
+}
+
+export const backend = createBackend<
+  {
+    app: Hono;
+    server?: ServerType;
+  },
+  AudioStreamConfig
+>({
+  app: new Hono().get('/stream', (ctx) => {
+    // Per-song TEXT metadata is carried in-band via chained Ogg logical streams
+    // (OpusTags per track). Some clients can't follow chains - browsers
+    // (<audio>/MSE) reload on a new BOS, and VLC's clock chokes on it - so they
+    // get a de-chained single logical stream instead.
+    const ua = ctx.req.header('User-Agent') ?? '';
+    const needsDechain = /Mozilla|VLC/i.test(ua);
+
+    ctx.header('Content-Type', 'audio/ogg');
+    ctx.header('Transfer-Encoding', 'chunked');
+    ctx.header('Access-Control-Allow-Origin', '*');
+
+    if (!needsDechain) {
+      ctx.header('icy-name', 'Pear Desktop');
+      ctx.header('icy-url', 'https://github.com/pear-devs/pear-desktop');
+      ctx.header(
+        'icy-audio-info',
+        `ice-channels=${config.channels};ice-samplerate=48000;ice-bitrate=${Math.round(
+          config.bitrate / 1000,
+        )}`,
+      );
+      ctx.header('icy-pub', '1');
+    }
+
+    ctx.header('Server', 'Pear Desktop');
+
+    return stream(ctx, async (stream) => {
+      // New subscriber gets the cached OpusHead + OpusTags pages first, so the
+      // decoder can initialise before any audio page arrives.
+      let readable = broadcast.subscribe(muxer.headerPages);
+
+      if (needsDechain) {
+        const dechainer = new OggDechainer();
+        readable = readable.pipeThrough(
+          new TransformStream<Uint8Array, Uint8Array>({
+            transform(page, controller) {
+              for (const out of dechainer.push(page)) controller.enqueue(out);
+            },
+          }),
+        );
+      }
+
+      return await stream.pipe(readable);
+    });
+  }),
+
+  async start({ getConfig, ipc }) {
+    config = await getConfig();
+
+    this.server = serve(
+      {
+        fetch: this.app.fetch.bind(this.app),
+        hostname: config.hostname,
+        port: config.port,
+      },
+      ({ address, port }) => console.log('Listening on', { address, port }),
+    );
+
+    // Track metadata (no ffprobe needed). On an actual song change, start a new
+    // logical stream so the new title/artist/album are embedded in-band.
+    // SongInfo also fires for play/pause and time updates, so gate on videoId.
+    let lastVideoId = '';
+    registerCallback((songInfo: SongInfo) => {
+      currentSong = songInfo;
+      if (songInfo.videoId && songInfo.videoId !== lastVideoId) {
+        lastVideoId = songInfo.videoId;
+        if (muxer.ready) muxer.chain(VENDOR, currentComments());
+      }
+    });
+
+    // OpusHead (from WebCodecs decoderConfig.description) opens the first stream.
+    ipc.on('audio-stream:opus-head', (head: Uint8Array) => {
+      muxer.setHead(head);
+      muxer.start(VENDOR, currentComments());
+    });
+
+    // Each Opus packet → one Ogg audio page. durationUs is the packet length;
+    // Opus granule positions are counted in 48 kHz samples.
+    ipc.on(
+      'audio-stream:opus',
+      (packet: { bytes: Uint8Array; durationUs: number }) => {
+        const samples = (packet.durationUs * 48000) / 1_000_000;
+        muxer.writePacket(packet.bytes, samples);
+      },
+    );
+  },
+  async stop() {
+    if (!this.server) return;
+
+    await new Promise<void>((resolve) => this.server!.close(() => resolve()));
+  },
+  onConfigChange(newConfig) {
+    config = newConfig;
+  },
+});
diff --git a/src/plugins/audio-stream/config.ts b/src/plugins/audio-stream/config.ts
new file mode 100644
index 0000000000..19b68e699d
--- /dev/null
+++ b/src/plugins/audio-stream/config.ts
@@ -0,0 +1,20 @@
+export interface AudioStreamConfig {
+  enabled: boolean;
+  port: number;
+  hostname: string;
+  // Audio settings for the Opus/Ogg stream.
+  sampleRate: number; // Capture sample rate hint (Opus always encodes at 48 kHz)
+  bitrate: number; // Opus target bitrate in bits/sec (e.g. 128000)
+  channels: number; // Number of channels (2 = stereo)
+  bufferSize: number; // AudioWorklet batch size in frames - affects latency
+}
+
+export const defaultAudioStreamConfig: AudioStreamConfig = {
+  enabled: false,
+  port: 8765,
+  hostname: '0.0.0.0',
+  sampleRate: 48000, // 48kHz - Opus native rate
+  bitrate: 128000, // 128 kbps Opus
+  channels: 2, // Stereo
+  bufferSize: 4096, // AudioWorklet batch (frames)
+};
diff --git a/src/plugins/audio-stream/index.ts b/src/plugins/audio-stream/index.ts
new file mode 100644
index 0000000000..c28ec3bf8a
--- /dev/null
+++ b/src/plugins/audio-stream/index.ts
@@ -0,0 +1,17 @@
+import { t } from '@/i18n';
+import { createPlugin } from '@/utils';
+
+import { backend } from './backend';
+import { defaultAudioStreamConfig } from './config';
+import { onMenu } from './menu';
+import { renderer } from './renderer';
+
+export default createPlugin({
+  name: () => t('plugins.audio-stream.name'),
+  description: () => t('plugins.audio-stream.description'),
+  restartNeeded: false,
+  config: defaultAudioStreamConfig,
+  backend,
+  renderer,
+  menu: onMenu,
+});
diff --git a/src/plugins/audio-stream/menu.ts b/src/plugins/audio-stream/menu.ts
new file mode 100644
index 0000000000..acf365919d
--- /dev/null
+++ b/src/plugins/audio-stream/menu.ts
@@ -0,0 +1,139 @@
+import prompt from 'custom-electron-prompt';
+
+import { t } from '@/i18n';
+import promptOptions from '@/providers/prompt-options';
+
+import { type AudioStreamConfig, defaultAudioStreamConfig } from './config';
+
+import type { MenuTemplate } from '@/menu';
+import type { MenuContext } from '@/types/contexts';
+
+// Quality and latency presets
+const SAMPLE_RATES = [44100, 48000, 96000];
+const BITRATES = [96000, 128000, 192000, 256000];
+const CHANNELS = [1, 2];
+const BUFFER_SIZES = [1024, 2048, 4096, 8192];
+
+export const onMenu = async ({
+  getConfig,
+  setConfig,
+  window,
+}: MenuContext<AudioStreamConfig>): Promise<MenuTemplate> => {
+  const config = await getConfig();
+
+  return [
+    {
+      label: t('plugins.audio-stream.menu.port.label'),
+      type: 'normal',
+      async click() {
+        const config = await getConfig();
+
+        const currentPort = config.port || defaultAudioStreamConfig.port;
+        const streamUrl = `http://localhost:${currentPort}/stream`;
+
+        const newPort =
+          (await prompt(
+            {
+              title: t('plugins.audio-stream.prompt.port.title'),
+              label: t('plugins.audio-stream.prompt.port.label', {
+                streamUrl,
+              }),
+              value: config.port,
+              type: 'counter',
+              counterOptions: { minimum: 1, maximum: 65535 },
+              width: 450,
+              ...promptOptions(),
+            },
+            window,
+          )) ??
+          config.port ??
+          defaultAudioStreamConfig.port;
+
+        if (newPort !== config.port) {
+          await setConfig({ port: newPort });
+        }
+      },
+    },
+    {
+      label: t('plugins.audio-stream.menu.quality-latency.label'),
+      type: 'submenu',
+      submenu: [
+        {
+          label: t(
+            'plugins.audio-stream.menu.quality-latency.submenu.sample-rate.label',
+          ),
+          type: 'submenu',
+          submenu: SAMPLE_RATES.map((sampleRate) => ({
+            label: `${sampleRate} Hz`,
+            type: 'radio' as const,
+            checked: config.sampleRate === sampleRate,
+            async click() {
+              const currentConfig = await getConfig();
+              if (currentConfig.sampleRate !== sampleRate) {
+                await setConfig({ sampleRate });
+              }
+            },
+          })),
+        },
+        {
+          label: t(
+            'plugins.audio-stream.menu.quality-latency.submenu.bitrate.label',
+          ),
+          type: 'submenu',
+          submenu: BITRATES.map((bitrate) => ({
+            label: `${bitrate / 1000} kbps`,
+            type: 'radio' as const,
+            checked: config.bitrate === bitrate,
+            async click() {
+              const currentConfig = await getConfig();
+              if (currentConfig.bitrate !== bitrate) {
+                await setConfig({ bitrate });
+              }
+            },
+          })),
+        },
+        {
+          label: t(
+            'plugins.audio-stream.menu.quality-latency.submenu.channels.label',
+          ),
+          type: 'submenu',
+          submenu: CHANNELS.map((channels) => ({
+            label:
+              channels === 1
+                ? t(
+                    'plugins.audio-stream.menu.quality-latency.submenu.channels.mono',
+                  )
+                : t(
+                    'plugins.audio-stream.menu.quality-latency.submenu.channels.stereo',
+                  ),
+            type: 'radio' as const,
+            checked: config.channels === channels,
+            async click() {
+              const currentConfig = await getConfig();
+              if (currentConfig.channels !== channels) {
+                await setConfig({ channels });
+              }
+            },
+          })),
+        },
+        {
+          label: t(
+            'plugins.audio-stream.menu.quality-latency.submenu.buffer-size.label',
+          ),
+          type: 'submenu',
+          submenu: BUFFER_SIZES.map((bufferSize) => ({
+            label: `${bufferSize} samples`,
+            type: 'radio' as const,
+            checked: config.bufferSize === bufferSize,
+            async click() {
+              const currentConfig = await getConfig();
+              if (currentConfig.bufferSize !== bufferSize) {
+                await setConfig({ bufferSize });
+              }
+            },
+          })),
+        },
+      ],
+    },
+  ];
+};
diff --git a/src/plugins/audio-stream/ogg-opus.ts b/src/plugins/audio-stream/ogg-opus.ts
new file mode 100644
index 0000000000..cdbaac3b3e
--- /dev/null
+++ b/src/plugins/audio-stream/ogg-opus.ts
@@ -0,0 +1,291 @@
+// Hand-written Ogg muxer for Opus, with chained logical streams.
+//
+// Each song gets its own logical stream (its own serial, BOS OpusHead +
+// OpusTags carrying that track's title/artist/album, then audio pages). On a
+// song change we end the current stream (EOS) and begin a new one - i.e. a
+// chained Ogg stream. This puts per-song metadata in the stream itself. Players
+// like mpv/VLC/ffmpeg follow chains; browser <audio> does not, which is an
+// accepted trade-off here.
+//
+// Opus granule positions are counted in 48 kHz samples regardless of the
+// original sample rate (RFC 7845).
+
+const OGG_CRC_POLY = 0x04c11db7;
+
+// Ogg uses a CRC-32 with the given polynomial, no input/output reflection and
+// a zero initial value.
+const CRC_TABLE = (() => {
+  const table = new Uint32Array(256);
+  for (let i = 0; i < 256; i++) {
+    let crc = i << 24;
+    for (let j = 0; j < 8; j++) {
+      crc = crc & 0x80000000 ? (crc << 1) ^ OGG_CRC_POLY : crc << 1;
+    }
+    table[i] = crc >>> 0;
+  }
+  return table;
+})();
+
+function oggCrc(buf: Uint8Array): number {
+  let crc = 0;
+  for (let i = 0; i < buf.length; i++) {
+    crc = ((crc << 8) ^ CRC_TABLE[((crc >>> 24) ^ buf[i]) & 0xff]) >>> 0;
+  }
+  return crc >>> 0;
+}
+
+const HEADER_TYPE_CONTINUED = 0x01;
+const HEADER_TYPE_BOS = 0x02;
+const HEADER_TYPE_EOS = 0x04;
+
+const MAX_SEGMENTS = 255; // per Ogg page
+const NO_GRANULE = 0xffffffffffffffffn; // -1: page completes no packet
+
+export type PageSink = (page: Uint8Array) => void;
+
+// Build the OpusTags comment header payload: magic "OpusTags", vendor string,
+// then a list of length-prefixed UTF-8 "NAME=value" comments.
+function buildOpusTags(vendor: string, comments: string[]): Uint8Array {
+  const enc = new TextEncoder();
+  const vendorBytes = enc.encode(vendor);
+  const commentBytes = comments.map((c) => enc.encode(c));
+
+  let size = 8 + 4 + vendorBytes.length + 4;
+  for (const c of commentBytes) size += 4 + c.length;
+
+  const payload = new Uint8Array(size);
+  const dv = new DataView(payload.buffer);
+  payload.set(enc.encode('OpusTags'), 0);
+  let off = 8;
+  dv.setUint32(off, vendorBytes.length, true);
+  off += 4;
+  payload.set(vendorBytes, off);
+  off += vendorBytes.length;
+  dv.setUint32(off, commentBytes.length, true);
+  off += 4;
+  for (const c of commentBytes) {
+    dv.setUint32(off, c.length, true);
+    off += 4;
+    payload.set(c, off);
+    off += c.length;
+  }
+  return payload;
+}
+
+// Collapses a chained Ogg/Opus stream into a SINGLE continuous logical stream
+// for clients that can't follow chains (browser <audio>/MSE: a new BOS mid-
+// stream forces a reload). Relies on the muxer's granule already being
+// monotonic across chains. Per-client (each holds its own page-sequence state).
+//
+// Keeps the first stream's OpusHead + OpusTags, drops every later chain's header
+// pages, and rewrites all forwarded pages onto one serial with a continuous page
+// sequence (recomputing the CRC). Clears BOS/EOS on audio pages.
+export class OggDechainer {
+  private serial = 0;
+  private haveSerial = false;
+  private seq = 0;
+  private dropping = false; // dropping a chained segment's header pages
+
+  push(page: Uint8Array): Uint8Array[] {
+    const headerType = page[5];
+    const granule = new DataView(
+      page.buffer,
+      page.byteOffset,
+      page.byteLength,
+    ).getBigUint64(6, true);
+    const bos = (headerType & HEADER_TYPE_BOS) !== 0;
+
+    if (bos) {
+      if (!this.haveSerial) {
+        // First logical stream: adopt its serial, keep OpusHead (still BOS).
+        this.serial = new DataView(
+          page.buffer,
+          page.byteOffset,
+          page.byteLength,
+        ).getUint32(14, true);
+        this.haveSerial = true;
+        return [this.rewrite(page, headerType & ~HEADER_TYPE_EOS)];
+      }
+      // A later chain: drop its OpusHead and following header pages.
+      this.dropping = true;
+      return [];
+    }
+
+    if (this.dropping) {
+      // Header pages carry granulepos 0; continuation pages carry -1.
+      if (granule === 0n || granule === NO_GRANULE) return [];
+      this.dropping = false; // first audio page of the new segment
+    }
+
+    // Audio page (or the first stream's OpusTags): clear BOS+EOS, keep continued.
+    return [
+      this.rewrite(page, headerType & ~(HEADER_TYPE_BOS | HEADER_TYPE_EOS)),
+    ];
+  }
+
+  private rewrite(page: Uint8Array, headerType: number): Uint8Array {
+    const out = page.slice();
+    const dv = new DataView(out.buffer, out.byteOffset, out.byteLength);
+    out[5] = headerType;
+    dv.setUint32(14, this.serial, true);
+    dv.setUint32(18, this.seq >>> 0, true);
+    this.seq++;
+    dv.setUint32(22, 0, true); // zero CRC before recompute
+    dv.setUint32(22, oggCrc(out), true);
+    return out;
+  }
+}
+
+export class OggOpusMuxer {
+  private serial: number;
+  private seq = 0;
+  private granule = 0n;
+  private originalHead: Uint8Array | null = null; // first stream (real pre-skip)
+  private chainHead: Uint8Array | null = null; // continuations (pre-skip 0)
+  private started = false; // header pages written for the current logical stream
+  // One-packet lookahead so the EOS bit can land on the real last data page.
+  private held: { packet: Uint8Array; granulepos: bigint } | null = null;
+
+  // Cached header pages (OpusHead BOS + OpusTags) of the CURRENT logical stream,
+  // for late joiners.
+  headerPages: Uint8Array[] = [];
+
+  constructor(private sink: PageSink) {
+    this.serial = (Math.random() * 0xffffffff) >>> 0;
+  }
+
+  get ready(): boolean {
+    return this.started;
+  }
+
+  // Emit one Opus packet as one or more Ogg pages. A page holds at most 255
+  // segments (<= 65025 bytes), so a larger packet spans multiple pages: the
+  // first carries `firstType`, the rest the "continued" flag. Only the page on
+  // which the packet ends carries the real
+  // granulepos (others use -1); EOS, if requested, goes on that final page.
+  private emit(
+    payload: Uint8Array,
+    firstType: number,
+    granulepos: bigint,
+    eos: boolean,
+  ): void {
+    // Lacing: floor(len/255) values of 255, then one final value of len%255
+    // (which may be 0, signalling the packet end).
+    const total = Math.floor(payload.length / 255) + 1;
+
+    let seg = 0; // segments emitted so far
+    let dataOff = 0;
+    let first = true;
+    do {
+      const segThisPage = Math.min(MAX_SEGMENTS, total - seg);
+      const segTable = new Uint8Array(segThisPage);
+      let dataLen = 0;
+      for (let i = 0; i < segThisPage; i++) {
+        const lace = seg + i === total - 1 ? payload.length % 255 : 255;
+        segTable[i] = lace;
+        dataLen += lace;
+      }
+      const isLast = seg + segThisPage >= total;
+
+      let headerType = first ? firstType : HEADER_TYPE_CONTINUED;
+      if (isLast && eos) headerType |= HEADER_TYPE_EOS;
+
+      const page = new Uint8Array(27 + segThisPage + dataLen);
+      const dv = new DataView(page.buffer);
+      page[0] = 0x4f; // 'O'
+      page[1] = 0x67; // 'g'
+      page[2] = 0x67; // 'g'
+      page[3] = 0x53; // 'S'
+      page[4] = 0; // stream structure version
+      page[5] = headerType;
+      dv.setBigUint64(6, isLast ? granulepos : NO_GRANULE, true);
+      dv.setUint32(14, this.serial, true);
+      dv.setUint32(18, this.seq >>> 0, true);
+      // bytes 22-25 CRC: zeroed for the checksum computation, filled after.
+      page[26] = segThisPage;
+      page.set(segTable, 27);
+      page.set(payload.subarray(dataOff, dataOff + dataLen), 27 + segThisPage);
+
+      dv.setUint32(22, oggCrc(page), true);
+
+      this.seq++;
+      this.sink(page);
+
+      seg += segThisPage;
+      dataOff += dataLen;
+      first = false;
+    } while (seg < total);
+  }
+
+  // OpusHead identification header (RFC 7845) from WebCodecs
+  // decoderConfig.description, so pre-skip etc. are correct for the FIRST stream.
+  // A pre-skip-0 copy is kept for chained continuations (the encoder is not
+  // restarting, so there is no priming to discard at a chain boundary).
+  setHead(opusHead: Uint8Array): void {
+    if (this.originalHead) return;
+    this.originalHead = opusHead;
+    const chain = opusHead.slice();
+    if (chain.length >= 12) {
+      chain[10] = 0; // pre-skip low byte
+      chain[11] = 0; // pre-skip high byte
+    }
+    this.chainHead = chain;
+  }
+
+  private openStream(
+    head: Uint8Array,
+    vendor: string,
+    comments: string[],
+    resetGranule: boolean,
+  ): void {
+    // Page sequence is per logical stream, so it resets. The running granule
+    // does NOT reset across chains: keeping it monotonic means a player's clock
+    // (VLC's PCR) never jumps backwards at a song boundary. Header pages always
+    // carry granulepos 0 by spec; the chain head uses pre-skip 0 so PTS stays
+    // continuous.
+    this.seq = 0;
+    if (resetGranule) this.granule = 0n;
+    // Capture the header pages so late joiners can be primed with the same bytes.
+    const pages: Uint8Array[] = [];
+    const collect = this.sink;
+    this.sink = (p) => pages.push(p);
+    this.emit(head, HEADER_TYPE_BOS, 0n, false);
+    this.emit(buildOpusTags(vendor, comments), 0, 0n, false);
+    this.sink = collect;
+
+    this.headerPages = pages;
+    this.started = true;
+    for (const p of pages) this.sink(p);
+  }
+
+  // Open the first logical stream.
+  start(vendor: string, comments: string[]): void {
+    if (!this.originalHead || this.started) return;
+    this.openStream(this.originalHead, vendor, comments, true);
+  }
+
+  // End the current logical stream and begin a new one with fresh metadata,
+  // continuing the granule so playback clocks stay monotonic.
+  chain(vendor: string, comments: string[]): void {
+    if (!this.started || !this.chainHead) return;
+    this.flushHeld(true); // EOS on the old stream's last data page
+    this.serial = (Math.random() * 0xffffffff) >>> 0;
+    this.openStream(this.chainHead, vendor, comments, false);
+  }
+
+  private flushHeld(eos: boolean): void {
+    if (!this.held) return;
+    this.emit(this.held.packet, 0, this.held.granulepos, eos);
+    this.held = null;
+  }
+
+  // One Opus packet -> one Ogg audio page (held one packet behind so EOS can be
+  // placed correctly at a chain boundary). granuleDelta is the packet duration
+  // in 48 kHz samples.
+  writePacket(packet: Uint8Array, granuleDelta: number): void {
+    if (!this.started) return;
+    this.flushHeld(false); // emit the previously held packet (not last)
+    this.granule += BigInt(Math.round(granuleDelta));
+    this.held = { packet, granulepos: this.granule };
+  }
+}
diff --git a/src/plugins/audio-stream/renderer.ts b/src/plugins/audio-stream/renderer.ts
new file mode 100644
index 0000000000..37b3eebf25
--- /dev/null
+++ b/src/plugins/audio-stream/renderer.ts
@@ -0,0 +1,286 @@
+import { createRenderer } from '@/utils';
+
+import workletCode from './StreamProcessor.js?raw';
+
+import type { AudioStreamConfig } from './config';
+import type { RendererContext } from '@/types/contexts';
+import type { MusicPlayer } from '@/types/music-player';
+
+const ENCODE_RATE = 48000; // Opus operates at 48 kHz; bridge resamples to this.
+
+// Minimal OpusHead (RFC 7845), used only if WebCodecs doesn't supply one via
+// decoderConfig.description (Chromium normally does).
+function synthOpusHead(channels: number): Uint8Array {
+  const head = new Uint8Array(19);
+  const dv = new DataView(head.buffer);
+  head.set(new TextEncoder().encode('OpusHead'), 0);
+  head[8] = 1; // version
+  head[9] = channels;
+  dv.setUint16(10, 312, true); // pre-skip (~6.5 ms)
+  dv.setUint32(12, ENCODE_RATE, true); // original input sample rate
+  dv.setUint16(16, 0, true); // output gain
+  head[18] = 0; // channel mapping family 0
+  return head;
+}
+
+type RendererProperties = {
+  audioContext?: AudioContext;
+  audioSource?: AudioNode;
+  config?: AudioStreamConfig;
+  context?: RendererContext<AudioStreamConfig>;
+  isStreaming: boolean;
+  // WebCodecs Opus pipeline state.
+  bridgeContext?: AudioContext;
+  encoder?: AudioEncoder;
+  encodedFrames: number; // 48 kHz samples fed to the encoder (for timestamps)
+  sentHead: boolean;
+  startStreaming: (
+    ipc: RendererContext<{ enabled: boolean }>['ipc'],
+    audioContext: AudioContext,
+    audioSource: AudioNode,
+    bufferSize?: number,
+  ) => void;
+  stop: () => void;
+};
+
+export const renderer = createRenderer<RendererProperties, AudioStreamConfig>({
+  isStreaming: false,
+  encodedFrames: 0,
+  sentHead: false,
+
+  async onPlayerApiReady(
+    _: MusicPlayer,
+    context: RendererContext<AudioStreamConfig>,
+  ) {
+    this.context = context;
+    this.config = await context.getConfig();
+
+    if (!this.config.enabled) {
+      return;
+    }
+
+    // Wait for audio to be ready
+    document.addEventListener(
+      'peard:audio-can-play',
+      (e) => {
+        this.startStreaming(
+          context.ipc,
+          e.detail.audioContext,
+          e.detail.audioSource,
+          this.config?.bufferSize,
+        );
+      },
+      { once: true, passive: true },
+    );
+  },
+
+  startStreaming(
+    ipc: RendererContext<{ enabled: boolean }>['ipc'],
+    audioContext: AudioContext,
+    audioSource: AudioNode,
+    bufferSize = 4096,
+  ) {
+    if (this.isStreaming || !this.context) {
+      return;
+    }
+
+    this.audioContext = audioContext;
+    this.audioSource = audioSource;
+    this.encodedFrames = 0;
+    this.sentHead = false;
+
+    // Opus needs 48 kHz; the app's AudioContext may be 44.1 kHz. Fan the source
+    // out to a MediaStream and read it back through our own 48 kHz context,
+    // which resamples for free. This extra connect does not disturb the app's
+    // own audio output.
+    const msDest = audioContext.createMediaStreamDestination();
+    audioSource.connect(msDest);
+
+    const bridge = new AudioContext({ sampleRate: ENCODE_RATE });
+    this.bridgeContext = bridge;
+    const bridgeSource = bridge.createMediaStreamSource(msDest.stream);
+
+    // Set up the Opus encoder. Each EncodedAudioChunk is one Opus packet.
+    const encoder = new AudioEncoder({
+      output: (chunk, meta) => {
+        if (!this.sentHead) {
+          const desc = meta?.decoderConfig?.description;
+          const head = desc
+            ? ArrayBuffer.isView(desc)
+              ? new Uint8Array(
+                  desc.buffer.slice(
+                    desc.byteOffset,
+                    desc.byteOffset + desc.byteLength,
+                  ),
+                )
+              : new Uint8Array(desc.slice(0))
+            : synthOpusHead(2); // fallback if Chromium omits the description
+          ipc.send('audio-stream:opus-head', head);
+          this.sentHead = true;
+        }
+        const bytes = new Uint8Array(chunk.byteLength);
+        chunk.copyTo(bytes);
+        ipc.send('audio-stream:opus', {
+          bytes,
+          durationUs: chunk.duration ?? 0,
+        });
+      },
+      error: (err) => console.error('[Audio Stream] Opus encoder error:', err),
+    });
+    encoder.configure({
+      codec: 'opus',
+      sampleRate: ENCODE_RATE,
+      numberOfChannels: 2,
+      bitrate: this.config!.bitrate ?? 128000,
+    });
+    this.encoder = encoder;
+
+    const blob = new Blob([workletCode], { type: 'application/javascript' });
+    const blobUrl = URL.createObjectURL(blob);
+
+    bridge.audioWorklet
+      .addModule(blobUrl)
+      .then(() => {
+        const workletNode = new AudioWorkletNode(bridge, 'recorder-processor', {
+          processorOptions: { bufferSize },
+        });
+
+        workletNode.port.onmessage = (event) => {
+          if (!this.encoder || this.encoder.state !== 'configured') return;
+          // Interleaved stereo Float32 at 48 kHz from the worklet.
+          const interleaved = event.data as Float32Array;
+          const numberOfFrames = interleaved.length / 2;
+          const audioData = new AudioData({
+            format: 'f32',
+            sampleRate: ENCODE_RATE,
+            numberOfFrames,
+            numberOfChannels: 2,
+            timestamp: Math.round((this.encodedFrames / ENCODE_RATE) * 1e6),
+            data: interleaved as unknown as BufferSource,
+          });
+          this.encodedFrames += numberOfFrames;
+          try {
+            this.encoder.encode(audioData);
+          } finally {
+            audioData.close();
+          }
+        };
+
+        bridgeSource.connect(workletNode);
+        // A muted sink keeps the bridge graph pulling without playing the audio
+        // a second time (the app already outputs it on its own context).
+        const mute = bridge.createGain();
+        mute.gain.value = 0;
+        workletNode.connect(mute).connect(bridge.destination);
+        this.isStreaming = true;
+        console.log('[Audio Stream] Started Opus streaming');
+      })
+      .catch((err) => {
+        console.error(
+          '[Audio Stream] Failed to add audio worklet module:',
+          err,
+        );
+      });
+  },
+
+  stop() {
+    this.isStreaming = false;
+
+    // Tear down the Opus encoder and the 48 kHz bridge context.
+    if (this.encoder) {
+      try {
+        if (this.encoder.state !== 'closed') this.encoder.close();
+      } catch {
+        // Ignore close errors
+      }
+      this.encoder = undefined;
+    }
+    if (this.bridgeContext) {
+      this.bridgeContext.close().catch(() => {});
+      this.bridgeContext = undefined;
+    }
+    this.sentHead = false;
+    this.encodedFrames = 0;
+
+    this.audioContext = undefined;
+    this.audioSource = undefined;
+  },
+
+  onConfigChange(config: AudioStreamConfig) {
+    const wasEnabled = this.config?.enabled;
+    const oldBitrate = this.config?.bitrate;
+    const oldChannels = this.config?.channels;
+    const oldBufferSize = this.config?.bufferSize;
+
+    // Check if quality/latency settings changed
+    const qualityChanged =
+      oldBitrate !== config.bitrate ||
+      oldChannels !== config.channels ||
+      oldBufferSize !== config.bufferSize;
+
+    this.config = config;
+
+    if (config.enabled && !wasEnabled) {
+      // Wait for audio to be ready if not already streaming
+      if (!this.isStreaming && this.audioContext && this.audioSource) {
+        // Already have audio context, start immediately
+        this.startStreaming(
+          this.context!.ipc,
+          this.audioContext,
+          this.audioSource,
+          this.config?.bufferSize,
+        );
+      } else if (!this.isStreaming) {
+        // Wait for audio to be ready
+        document.addEventListener(
+          'peard:audio-can-play',
+          (e) => {
+            this.startStreaming(
+              this.context!.ipc,
+              e.detail.audioContext,
+              e.detail.audioSource,
+              this.config?.bufferSize,
+            );
+          },
+          { once: true, passive: true },
+        );
+      }
+    } else if (!config.enabled && wasEnabled) {
+      // Stop streaming
+      this.stop();
+    } else if (
+      config.enabled &&
+      wasEnabled &&
+      qualityChanged &&
+      this.isStreaming
+    ) {
+      // Quality/latency settings changed while streaming - restart with new settings
+      if (this.audioContext && this.audioSource) {
+        // Store references before cleanup
+        const audioContext = this.audioContext;
+        const audioSource = this.audioSource;
+
+        this.stop();
+
+        // Use requestAnimationFrame to ensure cleanup is complete before restarting
+        requestAnimationFrame(() => {
+          // Double-check we're not streaming and have valid references
+          if (
+            audioContext &&
+            audioSource &&
+            !this.isStreaming &&
+            this.context
+          ) {
+            // Restart with new settings - this will send new config to backend
+            this.startStreaming(
+              this.context.ipc,
+              audioContext,
+              audioSource,
+              this.config?.bufferSize,
+            );
+          }
+        });
+      }
+    }
+  },
+});