feat: add css parameter for custom CSS injection in screenshots

src/services/__tests__/screenshot.test.ts

@@ -240,6 +240,48 @@ describe('Screenshot Service', () => {
     })
   })
 
+  describe('css parameter', () => {
+    it('injects custom CSS via addStyleTag', async () => {
+      await takeScreenshot({ url: 'https://example.com', css: 'body { background: red !important }' })
+      expect(mockPage.addStyleTag).toHaveBeenCalledWith({
+        content: 'body { background: red !important }'
+      })
+    })
+
+    it('injects css after goto and waitForSelector', async () => {
+      const callOrder: string[] = []
+      mockPage.goto.mockImplementation(async () => { callOrder.push('goto') })
+      mockPage.waitForSelector.mockImplementation(async () => { callOrder.push('waitForSelector') })
+      mockPage.addStyleTag.mockImplementation(async () => { callOrder.push('addStyleTag') })
+      await takeScreenshot({ url: 'https://example.com', css: 'body { color: blue }', waitForSelector: '#main' })
+      expect(callOrder.indexOf('goto')).toBeLessThan(callOrder.indexOf('addStyleTag'))
+      expect(callOrder.indexOf('waitForSelector')).toBeLessThan(callOrder.indexOf('addStyleTag'))
+    })
+
+    it('works alongside hideSelectors', async () => {
+      await takeScreenshot({ url: 'https://example.com', css: 'body { color: blue }', hideSelectors: ['.ad'] })
+      // Both should result in addStyleTag calls
+      expect(mockPage.addStyleTag).toHaveBeenCalledWith({ content: 'body { color: blue }' })
+      expect(mockPage.addStyleTag).toHaveBeenCalledWith({ content: '.ad { display: none !important }' })
+    })
+
+    it('works alongside darkMode', async () => {
+      await takeScreenshot({ url: 'https://example.com', css: 'h1 { font-size: 48px }', darkMode: true })
+      expect(mockPage.emulateMediaFeatures).toHaveBeenCalledWith([{ name: 'prefers-color-scheme', value: 'dark' }])
+      expect(mockPage.addStyleTag).toHaveBeenCalledWith({ content: 'h1 { font-size: 48px }' })
+    })
+
+    it('does not inject style tag when css is not set', async () => {
+      await takeScreenshot({ url: 'https://example.com' })
+      expect(mockPage.addStyleTag).not.toHaveBeenCalled()
+    })
+
+    it('does not inject style tag when css is empty string', async () => {
+      await takeScreenshot({ url: 'https://example.com', css: '' })
+      expect(mockPage.addStyleTag).not.toHaveBeenCalled()
+    })
+  })
+
   describe('Page lifecycle', () => {
     it('always releases page after successful screenshot', async () => {
       await takeScreenshot({ url: 'https://example.com' })

src/services/screenshot.ts

@@ -16,6 +16,7 @@ export interface ScreenshotOptions {
   waitUntil?: "load" | "domcontentloaded" | "networkidle0" | "networkidle2";
   darkMode?: boolean;
   hideSelectors?: string[];
+  css?: string;
 }
 
 export interface ScreenshotResult {
@@ -60,6 +61,10 @@ export async function takeScreenshot(opts: ScreenshotOptions): Promise<Screensho
           await new Promise(r => setTimeout(r, Math.min(opts.delay!, 5000)));
         }
 
+        if (opts.css) {
+          await page.addStyleTag({ content: opts.css });
+        }
+
         if (opts.hideSelectors && opts.hideSelectors.length > 0) {
           await page.addStyleTag({
             content: opts.hideSelectors.map(s => s + ' { display: none !important }').join('\n')