*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:#0f0f1a;color:#e0e0e0}.container{display:flex;flex-direction:column;height:100vh;background:#0f0f1a}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:linear-gradient(135deg,#1a1a2e,#16213e);border-bottom:1px solid #2a2a4a}.logo{display:flex;align-items:center;gap:10px}.logo h1{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#00d4ff,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tagline{font-size:.75rem;color:#888;margin-left:10px}.actions{display:flex;gap:10px}.btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .2s ease}.btn-primary{background:linear-gradient(135deg,#00d4ff,#7c3aed);color:#fff}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-secondary{background:#2a2a4a;color:#e0e0e0}.btn-secondary:hover{background:#3a3a5a}.main-content{display:flex;flex:1;overflow:hidden}.editor-pane{flex:1;display:flex;flex-direction:column;border-right:1px solid #2a2a4a}.output-pane{flex:1;display:flex;flex-direction:column;background:#0a0a14}.pane-header{padding:10px 15px;background:#1a1a2e;border-bottom:1px solid #2a2a4a;font-size:.85rem;font-weight:600;color:#888;text-transform:uppercase;letter-spacing:.5px}.editor-container{flex:1;overflow:hidden}.output-content{flex:1;padding:15px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem;line-height:1.6;overflow-y:auto}.output-line{padding:2px 0}.output-value{color:#00d4ff}.output-error{color:#ff6b6b}.output-info{color:#888}.examples-panel{padding:15px;border-top:1px solid #2a2a4a;background:#0f0f1a}.examples-title{font-size:.75rem;color:#666;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.examples-grid{display:flex;flex-wrap:wrap;gap:8px}.example-chip{padding:6px 12px;background:#1a1a2e;border:1px solid #2a2a4a;border-radius:20px;font-size:.8rem;cursor:pointer;transition:all .2s ease}.example-chip:hover{background:#2a2a4a;border-color:#00d4ff}.repl-container{flex:1;display:flex;flex-direction:column;overflow:hidden}.repl-output{flex:1;padding:10px 15px;overflow-y:auto;font-family:Monaco,Menlo,monospace;font-size:.85rem}.repl-input-container{display:flex;align-items:center;padding:10px 15px;background:#1a1a2e;border-top:1px solid #2a2a4a}.repl-prompt{color:#00d4ff;margin-right:10px;font-family:monospace}.repl-input{flex:1;background:transparent;border:none;color:#e0e0e0;font-family:Monaco,Menlo,monospace;font-size:.85rem;outline:none}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0a0a14}::-webkit-scrollbar-thumb{background:#2a2a4a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#3a3a5a}