A!leys Galerie

const fs = require('fs');
const path = require('path');
const { Canvas, loadImage, createCanvas } = require('canvas');
const { JSDOM } = require('jsdom');
const { performance } = require('perf_hooks');

// Main configuration
const APP = {
    name: 'Luminous Realms Studio',
    version: '1.0.0',
    outputDir: 'output',
    presetsDir: 'presets',
    previewSize: { width: 800, height: 600 },
    mapSize: { width: 20, height: 15 },
    animations: {
        pulse: { duration: 1000, intensity: 0.5 },
        flicker: { base: 0.7, range: 0.3, speed: 50 },
        scan: { speed: 2, width: 0.1 }
    }
};

// Initialize directories
function ensureDirectory(dir) {
    if (!fs.existsSync(dir)) {
        fs.mkdirSync(dir, { recursive: true });
    }
}

ensureDirectory(APP.outputDir);
ensureDirectory(APP.presetsDir);

// RGB to HSL conversion with improved precision
function rgbToHsl(r, g, b) {
    r /= 255; g /= 255; b /= 255;
    const max = Math.max(r, g, b), min = Math.min(r, g, b);
    let h, s, l = (max + min) / 2;

    if (max === min) {
        h = s = 0; // achromatic
    } else {
        const d = max - min;
        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
        switch (max) {
            case r: h = (g - b) / d + (g < b ? 6 : 0); break;
            case g: h = (b - r) / d + 2; break;
            case b: h = (r - g) / d + 4; break;
        }
        h /= 6;
    }

    return [h * 360, s * 100, l * 100];
}

// HSL to RGB with gamma correction
function hslToRgb(h, s, l) {
    h = h % 360 / 360;
    s = s / 100;
    l = l / 100;

    let r, g, b;
    function hueToRgb(p, q, t) {
        if (t < 0) t += 1;
        if (t > 1) t -= 1;
        if (t < 1/6) return p + (q - p) * 6 * t;
        if (t < 1/2) return q;
        if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
        return p;
    }

    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
    const p = 2 * l - q;

    r = hueToRgb(p, q, h + 1/3);
    g = hueToRgb(p, q, h);
    b = hueToRgb(p, q, h - 1/3);

    return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
}

// Generate complementary color palette
function generatePalette(baseHue, count = 5) {
    const palette = [];
    for (let i = 0; i < count; i++) {
        const hue = (baseHue + (i * (360 / count)) + 180) % 360;
        const saturation = 80 + Math.random() * 20;
        const lightness = 50 + Math.random() * 10;
        palette.push(hslToRgb(hue, saturation, lightness));
    }
    return palette;
}

// Fractal glow effect with Perlin-like noise
function createFractalGlow(baseColor, intensity = 0.3, octaves = 3, size = 50) {
    const canvas = createCanvas(size, size);
    const ctx = canvas.getContext('2d');
    const imageData = ctx.getImageData(0, 0, size, size);
    const data = imageData.data;

    // Simplified fractal noise
    for (let y = 0; y < size; y++) {
        for (let x = 0; x < size; x++) {
            let noise = 0;
            let frequency = 1;
            let amplitude = 1;
            let maxNoise = 0;

            for (let o = 0; o < octaves; o++) {
                const sampleX = x / frequency * Math.PI * 2;
                const sampleY = y / frequency * Math.PI * 2;

                // Simple pseudo-random noise
                const noiseValue = Math.sin(sampleX) * Math.cos(sampleY) * amplitude;
                noise += noiseValue;
                maxNoise += amplitude;
                amplitude *= 0.5;
                frequency *= 2;
            }

            const normalized = noise / maxNoise;
            const glowIntensity = (normalized + 1) * 0.5 * intensity;

            // Apply base color with glow
            const baseR = baseColor[0], baseG = baseColor[1], baseB = baseColor[2];
            const idx = (y * size + x) * 4;
            data[idx] = baseR + (baseR * glowIntensity);
            data[idx + 1] = baseG + (baseG * glowIntensity);
            data[idx + 2] = baseB + (baseB * glowIntensity);
            data[idx + 3] = 255;
        }
    }

    ctx.putImageData(imageData, 0, 0);
    return canvas;
}

// Create a simple random map for preview
function generatePreviewMap() {
    const canvas = createCanvas(
        APP.previewSize.width,
        APP.previewSize.height
    );
    const ctx = canvas.getContext('2d');

    // Draw grid
    ctx.strokeStyle = '#333';
    ctx.lineWidth = 1;
    for (let i = 0; i < APP.mapSize.width; i++) {
        ctx.beginPath();
        ctx.moveTo(i * (APP.previewSize.width / APP.mapSize.width), 0);
        ctx.lineTo(i * (APP.previewSize.width / APP.mapSize.width), APP.previewSize.height);
        ctx.stroke();
    }

    for (let i = 0; i < APP.mapSize.height; i++) {
        ctx.beginPath();
        ctx.moveTo(0, i * (APP.previewSize.height / APP.mapSize.height));
        ctx.lineTo(APP.previewSize.width, i * (APP.previewSize.height / APP.mapSize.height));
        ctx.stroke();
    }

    // Add random elements
    for (let i = 0; i < 100; i++) {
        const x = Math.random() * APP.previewSize.width;
        const y = Math.random() * APP.previewSize.height;
        const size = Math.random() * 20 + 5;

        ctx.fillStyle = `rgba(50, 50, 50, ${Math.random() * 0.3 + 0.1})`;
        ctx.beginPath();
        ctx.arc(x, y, size, 0, Math.PI * 2);
        ctx.fill();
    }

    return canvas;
}

// Create lighting effect with multiple layers
function createLightingEffect(lightSettings) {
    const { width, height, backgroundColor, lightSources, effectType } = lightSettings;
    const canvas = createCanvas(width, height);
    const ctx = canvas.getContext('2d');

    // Draw background
    ctx.fillStyle = `rgb(${backgroundColor.join(', ')})`;
    ctx.fillRect(0, 0, width, height);

    // Draw light sources
    for (const light of lightSources) {
        const { x, y, color, intensity, radius, type } = light;
        const glowCanvas = createCanvas(width, height);

        const glowCtx = glowCanvas.getContext('2d');
        glowCtx.globalCompositeOperation = 'source-atop';
        glowCtx.fillStyle = `rgba(${color.join(', ')}, ${intensity * 0.5})`;
        glowCtx.beginPath();
        glowCtx.arc(x, y, radius, 0, Math.PI * 2);
        glowCtx.fill();

        // Add glow effect based on type
        if (type === 'fractal') {
            const fractal = createFractalGlow(color, 0.2, 2, 200);
            glowCtx.drawImage(fractal, x - 100, y - 100, 200, 200);
        } else if (type === 'scan') {
            const now = Date.now();
            const scanX = (x + (Math.sin(now / APP.animations.scan.speed) * 0.2 * width)) % width;
            glowCtx.fillStyle = `rgba(${color.join(', ')}, ${intensity * 0.3})`;
            glowCtx.fillRect(scanX - APP.animations.scan.width * width, y - APP.animations.scan.width * height,
                           APP.animations.scan.width * width, APP.animations.scan.width * 2);
        }

        ctx.drawImage(glowCanvas, 0, 0);
    }

    // Apply pulse animation if enabled
    if (lightSettings.effectType === 'pulse') {
        const now = Date.now();
        const pulse = 0.5 + 0.5 * Math.sin(now / APP.animations.pulse.duration * Math.PI * 2);
        for (const light of lightSources) {
            const adjustedIntensity = light.intensity * pulse;
            ctx.fillStyle = `rgba(${light.color.join(', ')}, ${adjustedIntensity * 0.3})`;
            ctx.beginPath();
            ctx.arc(light.x, light.y, light.radius * pulse, 0, Math.PI * 2);
            ctx.fill();
        }
    }

    return canvas;
}

// Generate RPG Maker MZ plugin code
function generatePluginCode(presetName, lightingData) {
    let code = `// ===============================================\n// Luminous Realms - ${presetName}\n// Dynamic Lighting Plugin for RPG Maker MZ\n// Generated by Luminous Realms Studio\n// ===============================================\n\n(function() {\n    \n    const Luminous = Luminous || {};\n    \n    Luminous.Version = '1.0';\n    Luminous.PluginName = 'Luminous Realms - ${presetName}';\n    \n    // Plugin parameters\n    Luminous.Parameters = {\n        backgroundColor: '${lightingData.backgroundColor.join(', ')}',\n        lightSources: ${JSON.stringify(lightingData.lightSources, null, 2)},\n        effectType: '${lightingData.effectType}',\n        fractalSettings: ${JSON.stringify(lightingData.fractalSettings || {})},\n        scanSettings: ${JSON.stringify(lightingData.scanSettings || {})}\n    };\n    \n    // Main drawing function\n    Luminous.drawLighting = function() {\n        const canvas = this._lightingCanvas;\n        const ctx = canvas.getContext('2d');\n        \n        // Clear canvas\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\n        \n        // Draw background\n        ctx.fillStyle = \`rgb(${Luminous.Parameters.backgroundColor.join(', ')})\`;\n        ctx.fillRect(0, 0, canvas.width, canvas.height);\n        \n        // Draw light sources\n        for (const light of Luminous.Parameters.lightSources) {\n            const { x, y, color, intensity, radius, type } = light;\n            \n            // Main light\n            ctx.fillStyle = \`rgba(${color.join(', ')}, ${intensity * 0.5})\`;\n            ctx.beginPath();\n            ctx.arc(x, y, radius, 0, Math.PI * 2);\n            ctx.fill();\n            \n            // Glow effect based on type\n            if (type === 'fractal') {\n                const fractal = this._createFractalGlow(color, 0.2, 2, 200);\n                ctx.drawImage(fractal, x - 100, y - 100, 200, 200);\n            }\n        }\n        \n        // Apply animations\n        if (Luminous.Parameters.effectType === 'pulse') {\n            const now = Date.now();\n            const pulse = 0.5 + 0.5 * Math.sin(now / 1000 * Math.PI * 2);\n            for (const light of Luminous.Parameters.lightSources) {\n                const adjustedIntensity = light.intensity * pulse;\n                ctx.fillStyle = \`rgba(${light.color.join(', ')}, ${adjustedIntensity * 0.3})\`;\n                ctx.beginPath();\n                ctx.arc(light.x, light.y, light.radius * pulse, 0, Math.PI * 2);\n                ctx.fill();\n            }\n        }\n    };\n    \n    // Helper function for fractal glow\n    Luminous._createFractalGlow = function(baseColor, intensity, octaves, size) {\n        const canvas = document.createElement('canvas');\n        canvas.width = size;\n        canvas.height = size;\n        const ctx = canvas.getContext('2d');\n        const imageData = ctx.getImageData(0, 0, size, size);\n        const data = imageData.data;\n        \n        for (let y = 0; y < size; y++) {\n            for (let x = 0; x < size; x++) {\n                let noise = 0;\n                let frequency = 1;\n                let amplitude = 1;\n                let maxNoise = 0;\n                \n                for (let o = 0; o < octaves; o++) {\n                    const sampleX = x / frequency * Math.PI * 2;\n                    const sampleY = y / frequency * Math.PI * 2;\n                    const noiseValue = Math.sin(sampleX) * Math.cos(sampleY) * amplitude;\n                    noise += noiseValue;\n                    maxNoise += amplitude;\n                    amplitude *= 0.5;\n                    frequency *= 2;\n                }\n                \n                const normalized = noise / maxNoise;\n                const glowIntensity = (normalized + 1) * 0.5 * intensity;\n                \n                const idx = (y * size + x) * 4;\n                data[idx] = baseColor[0] + (baseColor[0] * glowIntensity);\n                data[idx + 1] = baseColor[1] + (baseColor[1] * glowIntensity);\n                data[idx + 2] = baseColor[2] + (baseColor[2] * glowIntensity);\n                data[idx + 3] = 255;\n            }\n        }\n        \n        ctx.putImageData(imageData, 0, 0);\n        return canvas;\n    };\n    \n    // Plugin manager hooks\n    Luminous.onSceneLoad = function(scene) {\n        if (!scene._lightingCanvas) {\n            const canvas = document.createElement('canvas');\n            canvas.width = Graphics.boxWidth;\n            canvas.height = Graphics.boxHeight;\n            scene._lightingCanvas = canvas;\n        }\n    };\n    \n    Luminous.onSceneUpdate = function(scene) {\n        this.drawLighting();\n    };\n    \n    // Add to Plugin Manager\n    LuminousManager.add(Graphics.frameCount, function() {\n        Luminous.onSceneLoad(Scene_Map);\n        Luminous.onSceneUpdate(Scene_Map);\n    });\n})();\n\n// ===============================================\n// END OF LUMINOUS REALMS - ${presetName}\n// ===============================================`;

    return code;
}

// Load existing presets
function loadPresets() {
    const presets = {};
    try {
        const files = fs.readdirSync(APP.presetsDir);
        files.forEach(file => {
            if (file.endsWith('.json')) {
                const preset = JSON.parse(fs.readFileSync(path.join(APP.presetsDir, file), 'utf8'));
                presets[preset.name] = preset;
            }
        });
    } catch (err) {
        console.error('Error loading presets:', err);
    }
    return presets;
}

// Main function to run the application
function runApplication() {
    // Load presets
    const presets = loadPresets();

    // Example preset
    const presetName = 'Example';
    const lightingData = {
        backgroundColor: [255, 255, 255],
        lightSources: [
            { x: 100, y: 100, color: [0, 0, 255], intensity: 0.8, radius: 50, type: 'fractal' },
            { x: 300, y: 300, color: [255, 0, 0], intensity: 0.6, radius: 75, type: 'scan' }
        ],
        effectType: 'pulse',
        fractalSettings: { octaves: 4, size: 100 },
        scanSettings: { speed: 10 }
    };

    // Generate plugin code
    const pluginCode = generatePluginCode(presetName, lightingData);

    // Write plugin code to file
    const outputFilePath = path.join(APP.outputDir, `${presetName}.js`);
    fs.writeFileSync(outputFilePath, pluginCode, 'utf8');

    console.log(`Plugin code generated and saved to ${outputFilePath}`);
}

// Run the application
runApplication();
```

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation localLocalContext
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.*
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.google.accompanist SystemUiController
import com.google.accompanist SystemUiController
import com.google.accompanist.inset localInsetNavigationBarsPadding
import kotlinx.serialization.encodeToString
import kotlinx.serialization.decodeFromString
import kotlinx.serialization.Serializable
import java.util.*
import kotlin.math.*

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MathMosaicTheme {
                val systemUiController = rememberSystemUiController()
                systemUiController.setStatusBarColor(
                    MaterialTheme.colorScheme.primaryContainer,
                    darkTheme = MaterialTheme.colorScheme.onPrimaryContainer == LightGray
                )
                systemUiController.setNavigationBarColor(
                    MaterialTheme.colorScheme.primaryContainer,
                    darkTheme = MaterialTheme.colorScheme.onPrimaryContainer == LightGray
                )
                Surface(
                    modifier = Modifier
                        .fillMaxSize()
                        .localInsetNavigationBarsPadding(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    MathMosaicApp()
                }
            }
        }
    }
}

@Composable
fun MathMosaicApp() {
    val systemUiController = rememberSystemUiController()
    val isDarkTheme = MaterialTheme.colorScheme.onSurface == DarkGray
    systemUiController.setStatusBarColor(
        MaterialTheme.colorScheme.primaryContainer,
        darkTheme = isDarkTheme
    )
    systemUiController.setNavigationBarColor(
        MaterialTheme.colorScheme.primaryContainer,
        darkTheme = isDarkTheme
    )

    var expressions by remember { mutableStateOf(listOf<String>()) }
    var currentInput by remember { mutableStateOf("") }
    var currentResult by remember { mutableStateOf(0.0) }
    var theme by remember { mutableStateOf(isDarkTheme) }
    var selectedExpression by remember { mutableStateOf(-1) }
    var emojiReactions by remember { mutableStateOf(mutableMapOf<Int, String?>()) }

    LaunchedEffect(Unit) {
        expressions = getSavedExpressions() ?: listOf()
        emojiReactions = (getSavedEmojiReactions() ?: mapOf()).toMutableMap()
    }

    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(16.dp)
            .navigationBarsPadding(),
        verticalArrangement = Arrangement.Bottom
    ) {
        // History & Mosaic Display
        Box(modifier = Modifier.weight(1f)) {
            LazyColumn(
                modifier = Modifier
                    .fillMaxWidth()
                    .weight(1f)
                    .padding(bottom = 8.dp)
            ) {
                items(expressions.size) { index ->
                    val expression = expressions.getOrNull(index) ?: return@items
                    val hasReaction = emojiReactions[expression.hashCode()]
                    val isSelected = index == selectedExpression

                    ExpressionTile(
                        expression = expression,
                        result = remember { tryParseExpression(expression) },
                        isSelected = isSelected,
                        reaction = hasReaction,
                        onClick = {
                            currentInput = expression
                            selectedExpression = index
                        },
                        onLongClick = {
                            expressions = expressions - expression
                            saveExpressions(expressions)
                        }
                    )
                }
            }

            if (expressions.isEmpty()) {
                Text(
                    text = "No expressions yet. Start calculating!",
                    style = MaterialTheme.typography.bodyLarge,
                    color = MaterialTheme.colorScheme.onSurfaceVariant,
                    modifier = Modifier.align(Alignment.Center)
                )
            }
        }

        // Calculator Input & Buttons
        Column(modifier = Modifier.fillMaxWidth()) {
            TextField(
                value = currentInput,
                onValueChange = { newValue ->
                    if (newValue.length <= 30) {
                        currentInput = newValue
                        currentResult = tryParseExpression(currentInput)
                    }
                },
                label = { Text("Enter expression") },
                singleLine = true,
                keyboardOptions = KeyboardOptions(
                    keyboardType = KeyboardType.Uri,
                    autoCapitalize = AutoCapitalize.None
                ),
                visualTransformation = {
                    val text = it
                    buildString {
                        var i = 0
                        while (i < text.length) {
                            val char = text[i]
                            if (char.isDigit() || char in listOf('+', '-', '*', '/', '^', '(', ')')) {
                                append(char)
                                i++
                            } else if (char == 'π') {
                                append("π")
                                i += 2
                            } else if (char == 'e') {
                                append("e")
                                i += 2
                            } else {
                                i++
                            }
                        }
                    }
                },
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(vertical = 8.dp),
                colors = TextFieldDefaults.colors(
                    focusedContainerColor = MaterialTheme.colorScheme.primaryContainer,
                    unfocusedContainerColor = MaterialTheme.colorScheme.surfaceVariant,
                    cursorColor = MaterialTheme.colorScheme.onSurface
                ),
                textStyle = MaterialTheme.typography.bodyLarge
            )

            // Function Buttons
            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.SpaceBetween
            ) {
                IconButton(onClick = { currentInput += "π" }) {
                    Icon(Icons.Default.Pi, contentDescription = "Pi")
                }
                IconButton(onClick = { currentInput += "e" }) {
                    Icon(Icons.Default.E, contentDescription = "Euler's number")
                }
                IconButton(onClick = { currentInput += "(" }) {
                    Icon(Icons.Default.OpenInNew, contentDescription = "Open parenthesis")
                }
                IconButton(onClick = { currentInput += ")" }) {
                    Icon(Icons.Default.Close, contentDescription = "Close parenthesis")
                }
                IconButton(onClick = { currentInput += "^" }) {
                    Icon(Icons.Default.Power, contentDescription = "Exponent")
                }
            }

            // Number Buttons (1-9)
            Row(modifier = Modifier.fillMaxWidth()) {
                repeat(3) { i ->
                    TextButton(
                        onClick = { currentInput += (i + 1).toString() },
                        modifier = Modifier.weight(1f)
                    ) { Text((i + 1).toString()) }
                }
            }

            Row(modifier = Modifier.fillMaxWidth()) {
                repeat(3) { i ->
                    TextButton(
                        onClick = { currentInput += (3 + i).toString() },
                        modifier = Modifier.weight(1f)
                    ) { Text((3 + i).toString()) }
                }
                IconButton(onClick = { currentInput += "." }) {
                    Icon(Icons.Default.Dot, contentDescription = "Decimal point")
                }
            }

            // Operator Buttons
            Row(modifier = Modifier.fillMaxWidth()) {
                TextButton(onClick = { currentInput += "+" }) { Text("+") }
                TextButton(onClick = { currentInput += "-" }) { Text("-") }
                TextButton(onClick = { currentInput += "*" }) { Text("×") }
                TextButton(onClick = { currentInput += "/" }) { Text("÷") }
            }

            // Clear, Theme Toggle, Reaction
            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.SpaceBetween
            ) {
                IconButton(onClick = { currentInput = "" }) {
                    Icon(Icons.Default.Clear, contentDescription = "Clear")
                }
                IconButton(
                    onClick = { theme = !theme },
                    tint = if (theme) Color.LightGray else Color.DarkGray
                ) {
                    Icon(
                        if (theme) Icons.Default.LightMode else Icons.Default.DarkMode,
                        contentDescription = "Toggle theme"
                    )
                }
                IconButton(
                    onClick = {
                        val exprHash = currentInput.hashCode()
                        val currentReaction = emojiReactions[exprHash]
                        val newReaction = if (currentReaction == "😍") null else "😍"
                        emojiReactions[exprHash] = newReaction
                        saveEmojiReactions(emojiReactions)
                    },
                    enabled = currentInput.isNotEmpty()
                ) {
                    Icon(
                        if (emojiReactions[currentInput.hashCode()] == "😍")
                            Icons.Default.Favorite
                        else Icons.Default.FavoriteBorder,
                        contentDescription = "Reaction",
                        tint = if (emojiReactions[currentInput.hashCode()] == "😍")
                            MaterialTheme.colorScheme.error
                        else MaterialTheme.colorScheme.onSurfaceVariant
                    )
                }
            }

            // Result Display
            if (currentInput.isNotEmpty()) {
                Text(
                    text = "= ${currentResult.toBigDecimal().toPlainString()}",
                    style = MaterialTheme.typography.titleMedium,
                    color = MaterialTheme.colorScheme.primary,
                    modifier = Modifier
                        .fillMaxWidth()
                        .padding(vertical = 8.dp)
                )
            }

            // Save Button
            Button(
                onClick = {
                    if (currentInput.isNotBlank() && !expressions.contains(currentInput)) {
                        expressions = listOf(currentInput) + expressions
                        saveExpressions(expressions)
                        selectedExpression = -1
                    }
                },
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(vertical = 8.dp),
                enabled = currentInput.isNotBlank() && !expressions.contains(currentInput)
            ) {
                Text("Save Expression")
            }
        }
    }
}

@Composable
fun ExpressionTile(
    expression: String,
    result: Double,
    isSelected: Boolean,
    reaction: String?,
    onClick: () -> Unit,
    onLongClick: () -> Unit
) {
    val colors = MaterialTheme.colorScheme
    val backgroundColor = if (isSelected) colors.primary else colors.surfaceVariant
    val contentColor = if (isSelected) colors.onPrimary else colors.onSurfaceVariant

    Card(
        modifier = Modifier
            .fillMaxWidth()
            .padding(vertical = 4.dp)
            .clickable(onClick = onClick, onLongClick = onLongClick),
        colors = CardDefaults.cardColors(
            containerColor = backgroundColor,
            contentColor = contentColor
        )
    ) {
        Row(
            modifier = Modifier.padding(16.dp),
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text(
                text = expression,
                style = MaterialTheme.typography.bodyLarge,
                maxLines = 1,
                overflow = TextOverflow.Ellipsis
            )
            Spacer(modifier = Modifier.weight(1f))
            Text(
                text = result.toBigDecimal().toPlainString(),
                style = MaterialTheme.typography.bodyMedium,
                color = contentColor.copy(alpha = 0.7f)
            )
            reaction?.let {
                Text(
                    text = it,
                    style = MaterialTheme.typography.bodySmall,
                    modifier = Modifier.padding(start = 8.dp)
                )
            }
        }
    }
}

@Preview(showBackground = true)
@Composable
fun MathMosaicPreview() {
    MathMosaicTheme {
        MathMosaicApp()
    }
}

val LightGray = Color(0xFFEEEEEE)
val DarkGray = Color(0xFF121212)

@Serializable
data class CalculatorState(
    val expressions: List<String>,
    val emojiReactions: Map<Int, String?>
)

fun tryParseExpression(expr: String): Double {
    return try {
        val parsedExpr = expr
            .replace("π", Math.PI.toString())
            .replace("e", E.toString())
            .replace("×", "*")
            .replace("÷", "/")
        val result = Object() {
            val expr = this@tryParseExpression
            expr.eval()
        }
        result.toDouble()
    } catch (e: Exception) {
        0.0
    }
}

fun Object.eval(): Double = this::class.java.getDeclaredMethod("eval").invoke(this) as Double

fun saveExpressions(expressions: List<String>) {
    val prefs = PreferenceManager.getDefaultSharedPreferences(androidx.compose.ui.platform.LocalContext.current)
    prefs.edit().putString("expressions", expressions.joinToString(",")).apply()
}

fun getSavedExpressions(): List<String>? {
    val prefs = PreferenceManager.getDefaultSharedPreferences(androidx.compose.ui.platform.LocalContext.current)
    return prefs.getString("expressions", null)?.split(",")
}

fun saveEmojiReactions(reactions: Map<Int, String?>) {
    val prefs = PreferenceManager.getDefaultSharedPreferences(androidx.compose.ui.platform.LocalContext.current)
    prefs.edit().putString("emojiReactions", reactions.toString()).apply()
}

fun getSavedEmojiReactions(): Map<Int, String?>? {
    val prefs = PreferenceManager.getDefaultSharedPreferences(androidx.compose.ui.platform.LocalContext.current)
    return prefs.getString("emojiReactions", null)?.let { mapOf<Int, String?>(it.toInt() to it) }
}

object Icons {
    object Pi : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("pi", android.R.drawable.ic_menu_rotate))
    object E : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("e", android.R.drawable.ic_menu_rotate))
    object Dot : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("dot", android.R.drawable.ic_menu_rotate))
    object Favorite : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("favorite", android.R.drawable.ic_menu_favorite))
    object FavoriteBorder : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("favorite_border", android.R.drawable.ic_menu_favorite))
    object Clear : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("clear", android.R.drawable.ic_menu_close_clear_cancel))
    object Power : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("power", android.R.drawable.ic_menu_power))
    object OpenInNew : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("open_new", android.R.drawable.ic_menu_rotate))
    object Close : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("close", android.R.drawable.ic_menu_close_clear_cancel))
    object LightMode : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("light_mode", android.R.drawable.ic_menu_rotate))
    object DarkMode : ImageVector(android.graphics.drawable.Icon.createWithAdaptive("dark_mode", android.R.drawable.ic_menu_rotate))
}

@Composable
fun MathMosaicTheme(content: @Composable () -> Unit) {
    MaterialTheme(
        colorScheme = if (true) {
            colorScheme(
                primary = Color(0xFF6750A4),
                primaryContainer = Color(0xFF8B7FFF),
                onPrimaryContainer = Color(0xFF170038),
                surface = Color(0xFFF8F0FF),
                onSurface = Color(0xFF170038),
                surfaceVariant = Color(0xFFE0D9FF),
                onSurfaceVariant = Color(0xFF4A3E6F),
                background = Color(0xFFFAF7FF),
                onBackground = Color(0xFF170038),
                error = Color(0xFFBA1A1A),
                onError = Color(0xFFFFFFFF)
            )
        } else {
            colorScheme(
                primary = Color(0xFF8B7FFF),
                primaryContainer = Color(0xFF6750A4),
                onPrimaryContainer = Color(0xFFFFFFFF),
                surface = Color(0xFF170038),
                onSurface = Color(0xFF8B7FFF),
                surfaceVariant = Color(0xFF4A3E6F),
                onSurfaceVariant = Color(0xFFE0D9FF),
                background = Color(0xFF170038),
                onBackground = Color(0xFF8B7FFF),
                error = Color(0xFFBA1A1A),
                onError = Color(0xFFFFFFFF)
            )
        },
        typography = Typography(),
        content = content
    )
}