*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea 0,#764ba2 100%);min-height:100vh;color:#333}.navbar{background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);padding:15px 30px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 20px rgba(0,0,0,0.1);position:sticky;top:0;z-index:1000}.navbar-brand{font-size:24px;font-weight:bold;display:flex;align-items:center;gap:10px}.navbar-brand span{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.navbar-brand img{height:32px;width:auto}.navbar-controls{display:flex;gap:15px;align-items:center}.dropdown{position:relative}.dropdown-btn{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);color:white;border:0;padding:10px 20px;border-radius:25px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease;box-shadow:0 4px 15px rgba(102,126,234,0.3)}.dropdown-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,0.4)}.dropdown-content{display:none;position:absolute;top:100%;left:0;background:white;min-width:200px;border-radius:10px;box-shadow:0 8px 25px rgba(0,0,0,0.15);overflow:hidden}.dropdown:hover .dropdown-content{display:block}.dropdown-item{padding:12px 20px;cursor:pointer;transition:background .2s ease;display:flex;align-items:center;gap:10px}.dropdown-item:hover{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);color:white}.btn{padding:10px 20px;border:0;border-radius:25px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease;display:flex;align-items:center;gap:8px;color:white}.btn:hover{transform:translateY(-2px)}.btn-save{background:linear-gradient(135deg,#11998e 0,#38ef7d 100%);box-shadow:0 4px 15px rgba(17,153,142,0.3)}.btn-save:hover{box-shadow:0 6px 20px rgba(17,153,142,0.4)}.btn-run{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);box-shadow:0 4px 15px rgba(102,126,234,0.3)}.btn-run:hover{box-shadow:0 6px 20px rgba(102,126,234,0.4)}.btn-clear{background:linear-gradient(135deg,#eb3349 0,#f45c43 100%);box-shadow:0 4px 15px rgba(235,51,73,0.3)}.btn-clear:hover{box-shadow:0 6px 20px rgba(235,51,73,0.4)}.btn-redo{background:linear-gradient(135deg,#4facfe 0,#00f2fe 100%);box-shadow:0 4px 15px rgba(79,172,254,0.3)}.btn-redo:hover{box-shadow:0 6px 20px rgba(79,172,254,0.4)}.btn-undo{background:linear-gradient(135deg,#fa709a 0,#fee140 100%);box-shadow:0 4px 15px rgba(250,112,154,0.3)}.btn-undo:hover{box-shadow:0 6px 20px rgba(250,112,154,0.4)}.main-container{display:flex;gap:20px;padding:20px;height:calc(100vh - 80px)}.editor-section{flex:2;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:20px;padding:20px;box-shadow:0 8px 30px rgba(0,0,0,0.1);display:flex;flex-direction:column}.section-title{font-size:18px;font-weight:600;color:#667eea;margin-bottom:15px;display:flex;align-items:center;gap:10px}.section-title::before{content:'';width:4px;height:20px;background:linear-gradient(135deg,#667eea 0,#764ba2 100%);border-radius:2px}.CodeMirror{flex:1;height:auto!important;border-radius:10px;font-size:14px;line-height:1.6}.output-section{flex:1;display:flex;flex-direction:column;gap:20px;min-height:0}.console-container{background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:20px;padding:20px;box-shadow:0 8px 30px rgba(0,0,0,0.1);flex:1;display:flex;flex-direction:column;min-height:0}#output{background:#f8f9fa;padding:15px;border-radius:10px;flex:1;overflow-y:auto;font-family:'Courier New',monospace;font-size:13px;line-height:1.6;color:#495057;border:2px solid #e9ecef;max-height:100%;white-space:pre-wrap;word-wrap:break-word;box-sizing:border-box;overflow-x:auto}.console-output{background:#f8f9fa;padding:15px;border-radius:10px;flex:1;overflow-y:auto;font-family:'Courier New',monospace;font-size:13px;line-height:1.6;color:#495057;border:2px solid #e9ecef;max-height:100%;white-space:pre-wrap;word-wrap:break-word;box-sizing:border-box;overflow-x:auto}.console-output[contenteditable="true"]{cursor:text;outline:0}.console-output[contenteditable="true"]:focus{background:#f8f9fa}.input-prompt{color:#667eea;font-weight:bold}.hidden-input{display:none}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);backdrop-filter:blur(5px);z-index:2000;justify-content:center;align-items:center}.modal-overlay.active{display:flex}.turtle-window{background:white;border-radius:0;box-shadow:0 20px 60px rgba(0,0,0,0.3);overflow:hidden;animation:modalSlideIn .3s ease;display:flex;flex-direction:column}@keyframes modalSlideIn{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}.turtle-window-header{background:#f0f0f0;padding:8px 15px;display:flex;justify-content:space-between;align-items:center;cursor:move;user-select:none;border-bottom:1px solid #e0e0e0;flex-shrink:0}
.turtle-window-title{color:#333;font-weight:500;font-size:13px;display:flex;align-items:center;gap:6px}.turtle-window-title::before{content:'🐢'}.turtle-window-close{background:transparent;border:0;color:#666;width:24px;height:24px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s ease}.turtle-window-close:hover{background:#e0e0e0;color:#333}.turtle-window-body{padding:0;background:#fff;flex:1;overflow:hidden}.turtle-canvas-wrapper{background:white;overflow:hidden}#turtle-canvas{display:block}@media(max-width:1200px){.main-container{flex-direction:column;height:auto}.editor-section{min-height:500px}.output-section{flex-direction:column}}