*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Segoe UI,Roboto,system-ui,sans-serif;background:#f4f6f4;color:#1a2e1a}#app{height:100vh;display:flex;flex-direction:column}#toolbar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:#fff;border-bottom:1px solid #d9e2d9;flex-shrink:0}.toolbar-group{display:flex;gap:8px}.mode-btn,.action-btn{border:1px solid #cfd8cf;background:#fff;border-radius:8px;padding:8px 14px;font-size:14px;cursor:pointer;transition:background .15s,border-color .15s}.mode-btn.active{background:#e6f4ea;border-color:#2f9e44;color:#1a5c27;font-weight:600}.action-btn.run{background:#2f9e44;border-color:#2f9e44;color:#fff;font-weight:600}.action-btn.run:hover{background:#278238}.action-btn.stop{color:#b3261e;border-color:#e0a29d}.action-btn:disabled{opacity:.5;cursor:not-allowed}#workspace-area{flex:1;display:flex;min-height:0}#editor-pane{flex:1 1 50%;min-width:320px;border-right:1px solid #d9e2d9;position:relative;background:#fff}#blockly-editor,#code-editor{position:absolute;top:0;right:0;bottom:0;left:0}#code-editor{overflow:auto}#canvas-pane{flex:1 1 50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fafcfa;padding:16px;min-width:320px}#turtle-canvas{background:#fff;border:1px solid #d9e2d9;border-radius:8px;max-width:100%;max-height:100%}#status-bar{margin-top:8px;font-size:13px;color:#4a5a4a;min-height:18px}#status-bar.error{color:#b3261e;font-weight:600}@media (max-width: 800px){#workspace-area{flex-direction:column}#editor-pane{border-right:none;border-bottom:1px solid #d9e2d9;height:45vh}#canvas-pane{height:55vh}}