File: style.css

body { font-family: 'Segoe UI', sans-serif; display: flex; flex-direction: column; height: 100vh; margin: 0; background-color: #050505; color: white; }
        
        .controls { 
            padding: 15px; background: #1a1a1a; border-bottom: 1px solid #333; 
            display: flex; gap: 10px; align-items: center; z-index: 10;
        }
        textarea { 
            width: 300px; height: 40px; resize: none; border-radius: 4px; border: 1px solid #444; padding: 5px;
            background: #111; color: #eee; 
        }
        button {
            padding: 10px 15px; cursor: pointer; background: #0066cc; color: white; border: none; border-radius: 4px; font-weight: bold;
        }
        button:hover { background: #0052a3; }
        button.secondary { background: #444; }

        #chart-container { flex-grow: 1; width: 100%; position: relative; }
        
        #status-bar { padding: 5px 15px; background: #000; color: #00ff00; font-family: monospace; font-size: 0.9em; border-top: 1px solid #333; }
        
        #comparison-panel {
            position: absolute; top: 80px; right: 20px; 
            background: rgba(20, 20, 20, 0.9); border: 1px solid #555; padding: 20px; 
            border-radius: 8px; width: 250px; display: none; pointer-events: none;
            box-shadow: 0 0 20px rgba(0,0,0,0.8);
            z-index: 100;
        }
        .comp-score { font-size: 2.5em; font-weight: bold; color: #00ff00; text-align: center; margin: 15px 0; }