.app{min-height:100vh;display:flex;flex-direction:column;position:relative;overflow-x:hidden;width:100%;margin:0;padding:0;background:radial-gradient(ellipse at top,rgba(0,255,255,.1) 0%,transparent 50%),radial-gradient(ellipse at bottom,rgba(57,255,20,.1) 0%,transparent 50%),var(--color-bg-primary)}.scan-line{position:fixed;top:0;left:0;right:0;height:2px;background:linear-gradient(to bottom,transparent 0%,rgba(0,255,255,.5) 50%,transparent 100%);pointer-events:none;z-index:9999;animation:scan-line 8s linear infinite;opacity:.3}.crt-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.15) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.15) 3px);pointer-events:none;z-index:9998;opacity:.1}.header{padding:var(--spacing-lg) var(--spacing-md);border-bottom:2px solid var(--color-neon-cyan);box-shadow:0 0 20px var(--color-glow-cyan);background:var(--color-bg-secondary);position:relative;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md);width:100%;box-sizing:border-box}.header-content{flex:1;min-width:250px}.title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);font-weight:900;letter-spacing:.3em;color:var(--color-neon-cyan);margin:0;text-transform:uppercase}.subtitle{font-size:clamp(.875rem,2vw,1.125rem);color:var(--color-text-secondary);margin-top:var(--spacing-xs);letter-spacing:.1em}.github-link{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);background:var(--color-bg-tertiary);border:1px solid var(--color-neon-cyan);border-radius:var(--border-radius);color:var(--color-neon-cyan);text-decoration:none;font-size:.875rem;font-weight:700;letter-spacing:.05em;transition:all .3s ease}.github-link:hover{background:var(--color-neon-cyan);color:var(--color-bg-primary);box-shadow:0 0 20px var(--color-glow-cyan);transform:translateY(-2px)}.main-content{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md);padding:var(--spacing-md);width:100%;box-sizing:border-box;min-width:0}.editor-section,.output-section{display:flex;flex-direction:column;gap:var(--spacing-md);min-height:0;min-width:0}.panel{background:var(--color-bg-secondary);border:1px solid var(--color-neon-cyan);border-radius:var(--border-radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 0 20px #0ff3,inset 0 0 20px #00ffff0d;min-width:0}.panel-header{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-tertiary);border-bottom:1px solid var(--color-neon-cyan);display:flex;justify-content:space-between;align-items:center}.panel-title{font-family:var(--font-display);font-size:.875rem;font-weight:700;letter-spacing:.2em;color:var(--color-neon-green)}.panel-indicator{width:12px;height:12px;border-radius:50%;background:var(--color-text-dim);box-shadow:0 0 5px #00000080}.panel-indicator.active{background:var(--color-neon-green);box-shadow:0 0 10px var(--color-glow-green);animation:glow-pulse 2s ease-in-out infinite}.editor-panel{flex:1;min-height:400px;min-width:0;display:flex;flex-direction:column}.editor-wrapper{flex:1;overflow:hidden;background:#1e1e1e;min-width:0}.code-editor{height:100%!important;width:100%!important;max-width:100%!important;font-size:14px!important;overflow-x:auto!important}.code-editor .cm-editor{height:100%;background:#1e1e1e!important}.code-editor .cm-scroller{font-family:var(--font-mono)!important;overflow-x:auto!important}.code-editor .cm-content{max-width:100%!important}.controls{display:flex;gap:var(--spacing-md);align-items:center;justify-content:center;flex-wrap:wrap;width:100%;box-sizing:border-box;min-width:0}.run-button{font-family:var(--font-display)!important;font-size:1.125rem!important;font-weight:700!important;letter-spacing:.15em!important;padding:var(--spacing-md) var(--spacing-xl)!important;background:linear-gradient(135deg,var(--color-neon-cyan),var(--color-neon-green))!important;color:var(--color-bg-primary)!important;border:none!important;border-radius:var(--border-radius)!important;cursor:pointer!important;transition:all .3s ease!important;box-shadow:0 0 20px var(--color-glow-cyan),0 4px 15px #0000004d!important;display:flex!important;align-items:center!important;gap:var(--spacing-sm)!important;white-space:nowrap}.run-button:hover:not(:disabled){transform:translateY(-3px)!important;box-shadow:0 0 30px var(--color-glow-cyan),0 0 40px var(--color-glow-green),0 8px 20px #0006!important}.run-button:active:not(:disabled){transform:translateY(-1px)!important}.run-button:disabled{opacity:.5!important;cursor:not-allowed!important}.play-icon{font-size:1.25rem}.spinner{width:16px;height:16px;border:2px solid var(--color-bg-primary);border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.footer-debug-toggle{font-family:var(--font-display);font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:.375rem .75rem;background:transparent;color:var(--color-text-dim);border:1px solid var(--color-text-dim);border-radius:4px;cursor:pointer;transition:all .2s ease}.footer-debug-toggle:hover{background:var(--color-text-dim);color:var(--color-bg-primary);border-color:var(--color-text-dim)}.output-panel{flex:1;min-height:300px;min-width:0;display:flex;flex-direction:column}.output-content{flex:1;padding:var(--spacing-md);overflow-y:auto;font-family:var(--font-mono);font-size:.875rem;line-height:1.6;background:#0a0a0a}.output-content pre{margin:0;color:var(--color-neon-green);white-space:pre-wrap;word-wrap:break-word}.debug-panel{max-height:350px;min-width:0}.debug-content{flex:1;padding:var(--spacing-sm);overflow-y:auto;font-size:.75rem;line-height:1.5;background:#0a0a0a}.debug-entry{margin-bottom:.25rem;display:flex;gap:var(--spacing-xs);align-items:baseline}.debug-timestamp{color:var(--color-text-dim);flex-shrink:0}.debug-type{font-weight:700;flex-shrink:0;min-width:100px}.debug-message{color:var(--color-text-secondary);word-wrap:break-word;flex:1}.debug-info .debug-type{color:#09f}.debug-success .debug-type{color:var(--color-success)}.debug-error .debug-type{color:var(--color-error)}.debug-warning .debug-type{color:#fa0}.debug-milestone .debug-type{color:var(--color-neon-pink)}.clear-logs{font-family:var(--font-display);font-size:.75rem;font-weight:700;letter-spacing:.1em;padding:.25rem .75rem;background:transparent;color:var(--color-neon-pink);border:1px solid var(--color-neon-pink);border-radius:4px;cursor:pointer;transition:all .2s ease}.clear-logs:hover{background:var(--color-neon-pink);color:var(--color-bg-primary)}.footer{padding:var(--spacing-md);border-top:1px solid var(--color-neon-cyan);background:var(--color-bg-secondary);text-align:center;font-size:.875rem;color:var(--color-text-secondary);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md);width:100%;box-sizing:border-box}.footer p{margin:0}.footer>*{flex-shrink:0}.status{display:flex;align-items:center;gap:var(--spacing-xs)}.status-ready{color:var(--color-success);font-weight:700}.status-loading{color:var(--color-text-dim);font-weight:700}@media (max-width: 1024px){.main-content{grid-template-columns:1fr}.header{padding:var(--spacing-md) var(--spacing-sm)}.title{font-size:clamp(1.5rem,8vw,2.5rem);letter-spacing:.2em}.github-link span{display:none}}@media (max-width: 768px){.main-content{padding:var(--spacing-sm);gap:var(--spacing-sm)}.editor-panel{min-height:300px}.output-panel{min-height:200px}.controls{width:100%}.run-button{width:100%;justify-content:center!important;font-size:1rem!important;padding:var(--spacing-sm) var(--spacing-md)!important}.footer{flex-direction:column;text-align:center;padding:var(--spacing-sm);gap:var(--spacing-sm)}}@media (max-width: 480px){.header{padding:var(--spacing-sm) var(--spacing-xs)}.title{font-size:1.5rem;letter-spacing:.15em}.subtitle{font-size:.75rem}.main-content{padding:var(--spacing-xs);gap:var(--spacing-xs)}.panel-header{padding:var(--spacing-xs) var(--spacing-sm)}.panel-title{font-size:.75rem;letter-spacing:.1em}.output-content,.debug-content{padding:var(--spacing-sm);font-size:.75rem}}@media (hover: none) and (pointer: coarse){.run-button,.debug-toggle,.clear-logs,.github-link{min-height:44px;padding:var(--spacing-sm) var(--spacing-md)!important}.code-editor{font-size:16px!important}}:root{--color-bg-primary: #0a0e27;--color-bg-secondary: #141933;--color-bg-tertiary: #1a1f3a;--color-neon-cyan: #00ffff;--color-neon-green: #39ff14;--color-neon-pink: #ff10f0;--color-neon-yellow: #ffff00;--color-text-primary: #e0e0e0;--color-text-secondary: #a0a0a0;--color-text-dim: #606060;--color-glow-cyan: rgba(0, 255, 255, .5);--color-glow-green: rgba(57, 255, 20, .5);--color-error: #ff3366;--color-success: #00ff88;--font-display: "Orbitron", sans-serif;--font-mono: "Space Mono", monospace;--border-radius: 8px;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow-x:hidden;margin:0!important;padding:0!important;width:100%}body{font-family:var(--font-mono);background:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column;width:100%;margin:0;padding:0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-neon-cyan);border-radius:5px;box-shadow:0 0 10px var(--color-glow-cyan)}::-webkit-scrollbar-thumb:hover{background:var(--color-neon-green);box-shadow:0 0 15px var(--color-glow-green)}::selection{background:var(--color-neon-cyan);color:var(--color-bg-primary)}::-moz-selection{background:var(--color-neon-cyan);color:var(--color-bg-primary)}@keyframes glow-pulse{0%,to{text-shadow:0 0 10px currentColor,0 0 20px currentColor,0 0 30px currentColor}50%{text-shadow:0 0 20px currentColor,0 0 30px currentColor,0 0 40px currentColor,0 0 50px currentColor}}@keyframes scan-line{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}@keyframes flicker{0%,to{opacity:1}50%{opacity:.95}}.glow{animation:glow-pulse 2s ease-in-out infinite}.flicker{animation:flicker .15s infinite}
