// ==UserScript==// @name        c.ai Background Image Customizer// @namespace   c.ai Background Image Customizer// @match       https://character.ai/*// @grant       none// @license     MIT// @version     1.0// @description Customize the chat interface with custom background images// @icon        https://i.imgur.com/ynjBqKW.png// ==/UserScript==(function () {// Function to create a buttonfunction createButton(symbol, onClick) {const button = document.createElement('button');button.innerHTML = symbol;button.style.position = 'fixed';button.style.top = '10px';button.style.right = '10px';button.style.width = '22px';button.style.height = '22px';button.style.backgroundColor = '#444';button.style.color = 'white';button.style.border = 'none';button.style.borderRadius = '3px';button.style.cursor = 'pointer';button.style.fontFamily = 'Montserrat, sans-serif';button.addEventListener('click', onClick);return button;}// Function to create the customization panelfunction createCustomizationPanel() {const panel = document.createElement('div');panel.id = 'customizationPanel';panel.style.position = 'fixed';panel.style.top = '50%';panel.style.left = '50%';panel.style.transform = 'translate(-50%, -50%)';panel.style.backgroundColor = '#1e1e1e';panel.style.color = 'white';panel.style.borderRadius = '5px';panel.style.padding = '20px';panel.style.zIndex = '9999';panel.style.fontFamily = 'Montserrat, sans-serif';const label = document.createElement('label');label.textContent = 'Background Image URL:';const input = document.createElement('input');input.type = 'text';input.placeholder = 'Enter image URL';input.style.width = '100%';input.style.marginBottom = '10px';input.value = localStorage.getItem('background_image_url') || '';input.addEventListener('input', () => {localStorage.setItem('background_image_url', input.value);applyBackgroundImage();});const okButton = document.createElement('button');okButton.textContent = 'OK';okButton.style.marginTop = '10px';okButton.style.padding = '5px 10px';okButton.style.border = 'none';okButton.style.borderRadius = '3px';okButton.style.backgroundColor = '#444';okButton.style.color = 'white';okButton.style.fontFamily = 'Montserrat, sans-serif';okButton.addEventListener('click', () => {panel.remove();});panel.appendChild(label);panel.appendChild(input);panel.appendChild(okButton);document.body.appendChild(panel);}// Function to apply the background imagefunction applyBackgroundImage() {const imageUrl = localStorage.getItem('background_image_url') || '';const css = `body {background-image: url('${imageUrl}');background-size: cover;background-position: center;background-repeat: no-repeat;}`;let styleElement = document.getElementById('customBackgroundStyle');if (!styleElement) {styleElement = document.createElement('style');styleElement.id = 'customBackgroundStyle';document.head.appendChild(styleElement);}styleElement.innerHTML = css;}// Create and insert the main buttonconst mainButton = createButton('🖼️', () => {const panelExists = document.getElementById('customizationPanel');if (!panelExists) {createCustomizationPanel();}});document.body.appendChild(mainButton);// Apply background image on loadapplyBackgroundImage();})();