import React from 'react';
import { createRoot } from 'react-dom/client';
import './index.css';
import EpiCodeSpaceApp from './EpiCodeSpaceComplete.jsx';

try {
  const root = createRoot(document.getElementById('root'));
  root.render(<EpiCodeSpaceApp />);
} catch (err) {
  document.getElementById('root').innerHTML = `
    <div style="background:#0a0412;color:#e879f9;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;font-family:monospace">
      <h1>⚡ EpiCodeSpace failed to start</h1>
      <pre style="background:#1a0b35;padding:1.5rem;border-radius:0.75rem;max-width:90vw;overflow:auto;font-size:0.85rem;color:#f87171;border:1px solid rgba(232,121,249,0.3);margin-top:1rem">${err.message}\n${err.stack}</pre>
      <button onclick="localStorage.clear();location.reload()" style="margin-top:1.5rem;padding:0.75rem 2rem;background:#a21caf;color:white;border:none;border-radius:0.5rem;cursor:pointer;font-size:0.9rem">Clear Data & Reload</button>
    </div>`;
}
