.top-toolbar{display:flex;align-items:center;justify-content:space-between;height:var(--header-height);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-md);flex-shrink:0}.top-toolbar .toolbar-left{display:flex;align-items:center;gap:var(--space-lg)}.top-toolbar .logo-link{text-decoration:none;color:inherit}.top-toolbar .logo-link:hover h1{color:var(--accent-primary)}.top-toolbar .toolbar-left h1{margin:0;font-size:var(--font-size-lg);font-weight:700;color:var(--text-primary);transition:color .2s}.top-toolbar .sketch-title-container{display:flex;align-items:center;gap:var(--space-md)}.top-toolbar .sketch-thumbnail{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background-color:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-sm);overflow:hidden;flex-shrink:0}.top-toolbar .thumbnail-svg{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.top-toolbar .thumbnail-svg svg{width:100%;height:100%;object-fit:contain}.top-toolbar .sketch-title-input{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-primary);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);font-family:var(--font-family);min-width:200px;max-width:300px;transition:border-color .2s}.top-toolbar .sketch-title-input:hover{border-color:var(--border-secondary)}.top-toolbar .sketch-title-input:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 1px var(--accent-primary)}.top-toolbar .sketch-title-display{margin:0;font-size:var(--font-size-lg);font-weight:700;color:var(--text-primary);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-toolbar .toolbar-right{display:flex;align-items:center;gap:var(--space-lg)}.top-toolbar .save-section{display:flex;align-items:center;gap:var(--space-sm)}.top-toolbar .save-btn{font-family:var(--font-family)}.top-toolbar .save-btn.disabled,.top-toolbar .save-btn:disabled{background-color:var(--bg-tertiary);border-color:var(--border-primary);color:var(--text-muted);cursor:not-allowed}.top-toolbar .last-saved{font-size:var(--font-size-xs);color:var(--text-muted);white-space:nowrap}.top-toolbar .examples-dropdown{display:flex;align-items:center;gap:var(--space-sm)}.top-toolbar .examples-dropdown label{font-size:var(--font-size-sm);color:var(--text-secondary);white-space:nowrap}.top-toolbar .examples-select{font-family:var(--font-family)}.top-toolbar .examples-select option{background-color:var(--bg-tertiary);color:var(--text-primary)}.top-toolbar .sketch-meta{display:flex;align-items:center;gap:var(--space-md);margin-top:var(--space-xs);font-size:var(--font-size-xs);color:var(--text-muted)}.top-toolbar .sketch-meta .author a{color:var(--accent-primary);text-decoration:none}.top-toolbar .sketch-meta .author a:hover{text-decoration:underline}.top-toolbar .view-actions{display:flex;align-items:center;gap:var(--space-sm)}.top-toolbar .edit-btn,.top-toolbar .fork-btn{font-family:var(--font-family)}.top-toolbar .toolbar-center{display:flex;align-items:center;gap:var(--space-md)}.top-toolbar .run-btn{font-family:var(--font-detail);text-transform:uppercase;letter-spacing:.5px}.top-toolbar .run-btn:disabled{background-color:var(--bg-tertiary);border-color:var(--border-primary);color:var(--text-muted);cursor:not-allowed}.top-toolbar .toolbar-right .status{font-size:var(--font-size-sm);color:var(--text-secondary);font-family:var(--font-detail)}.code-panel{display:flex;flex-direction:column;min-height:200px;height:100%}.code-panel .panel-header{justify-content:space-between;height:40px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-md);flex-shrink:0}.code-panel .panel-header,.code-panel .panel-header h3,.code-panel .panel-title{display:flex;align-items:center}.code-panel .panel-header h3{margin:0;font-size:var(--font-size-sm);font-weight:500;font-family:var(--font-header);color:var(--text-primary);gap:var(--space-sm);text-transform:uppercase;letter-spacing:1px}.code-panel .panel-controls{display:flex;align-items:center;gap:8px}.code-panel .minimize-btn{padding:4px 8px;font-size:var(--font-size-xs);line-height:1}.code-panel .minimize-btn:active{background-color:var(--accent-primary);color:var(--text-invert)}.code-panel .run-btn{font-family:var(--font-detail);text-transform:uppercase;letter-spacing:.5px}.code-panel .run-btn:disabled{background-color:var(--bg-tertiary);border-color:var(--border-primary);color:var(--text-muted);cursor:not-allowed}.code-panel .editor-container{flex:1 1;overflow:hidden;height:100%;width:100%;position:relative}.code-panel .editor-container .monaco-editor{height:100%!important;width:100%!important;position:absolute!important;top:0!important;left:0!important}.editor-loading{display:flex;align-items:center;justify-content:center;height:200px;color:var(--text-muted);font-style:italic}.monaco-editor,.monaco-editor .margin{background-color:#1e1e1e!important}.controls-panel{display:flex;flex-direction:column;min-height:150px;height:100%;border-top:1px solid var(--border-primary)}.controls-panel .panel-header{justify-content:space-between;height:40px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-md);flex-shrink:0}.controls-panel .panel-header,.controls-panel .panel-title{display:flex;align-items:center}.controls-panel .panel-header h3{margin:0;font-size:var(--font-size-sm);font-weight:500;font-family:var(--font-header);color:var(--text-primary);display:flex;align-items:center;gap:var(--space-sm);text-transform:uppercase;letter-spacing:1px}.controls-panel .minimize-btn{padding:4px 8px;font-size:var(--font-size-xs);line-height:1}.controls-panel .minimize-btn:active{background-color:var(--accent-primary);color:var(--text-invert)}.controls-content{padding:16px;background-color:var(--bg-secondary);flex:1 1;overflow-y:auto}.controls-content h4{margin:0 0 12px;font-size:var(--font-size-sm);color:var(--text-primary);font-weight:500;font-family:var(--font-header);text-transform:uppercase;letter-spacing:1px}.control-group{margin-bottom:16px}.control-group label{display:block;margin-bottom:4px;font-size:var(--font-size-xs);color:var(--text-secondary);font-family:var(--font-detail)}.control-group input,.control-group select{padding:6px 8px;border:1px solid var(--border-primary);background:var(--bg-secondary);color:var(--text-primary);font-family:var(--font-body);font-size:var(--font-size-sm);border-radius:var(--radius-sm);transition:border-color .2s ease;width:100%}.preview-panel{display:flex;flex-direction:column;min-height:300px;height:100%}.preview-panel .panel-header{justify-content:space-between;height:40px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-md);flex-shrink:0}.preview-panel .panel-header,.preview-panel .panel-title{display:flex;align-items:center}.preview-panel .panel-header h3{margin:0;font-size:var(--font-size-sm);font-weight:500;font-family:var(--font-header);color:var(--text-primary);display:flex;align-items:center;gap:var(--space-sm);text-transform:uppercase;letter-spacing:1px}.preview-panel .minimize-btn{padding:4px 8px;font-size:var(--font-size-xs);line-height:1}.preview-panel .minimize-btn:active{background-color:var(--accent-primary);color:var(--text-invert)}.visualization-panel{height:100%;width:100%;display:flex;flex-direction:column;position:relative;flex:1 1}.visualization-panel>div{flex:1 1;min-height:0;height:100%}.visualization-panel .js-plotly-plot,.visualization-panel .plotly{width:100%!important;height:100%!important}.thumbnail-preview{flex-direction:column;height:100%;padding:var(--space-lg);gap:var(--space-lg)}.thumbnail-container,.thumbnail-preview{display:flex;align-items:center;justify-content:center}.thumbnail-container{width:200px;height:200px;background-color:var(--bg-tertiary);border:2px solid var(--border-primary);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 4px 8px rgba(0,0,0,.1)}.preview-svg{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.preview-svg svg{width:100%;height:100%;object-fit:contain}.thumbnail-message{text-align:center;font-family:var(--font-detail);max-width:300px}.plot-loading,.thumbnail-message{color:var(--text-muted);font-style:italic}.plot-loading{display:flex;align-items:center;justify-content:center;height:100%}.gcode-panel-container{display:flex;flex-direction:column;min-height:200px;height:100%;border-top:1px solid var(--border-primary)}.gcode-panel-container .panel-header{display:flex;align-items:center;justify-content:space-between;height:40px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:0 var(--space-md);flex-shrink:0}.gcode-panel-container .panel-header h3,.gcode-panel-container .panel-title{display:flex;align-items:center;gap:var(--space-sm)}.gcode-panel-container .panel-header h3{margin:0;font-size:var(--font-size-sm);font-weight:500;font-family:var(--font-header);color:var(--text-primary);text-transform:uppercase;letter-spacing:1px}.gcode-panel-container .minimize-btn{padding:4px 8px;font-size:var(--font-size-xs);line-height:1}.gcode-panel-container .minimize-btn:active{background-color:var(--accent-primary);color:var(--text-invert)}.copy-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:var(--radius-sm);transition:all .2s ease}.copy-btn:hover{color:var(--text-primary);background:var(--bg-tertiary)}.gcode-panel{height:100%;width:100%;display:flex;flex-direction:column;position:relative;flex:1 1}.gcode-panel>div{flex:1 1;min-height:0;height:100%}.gcode-output{width:100%;height:100%;background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-xs);padding:var(--space-sm);margin:0;border:none;outline:none;resize:none;overflow:auto;white-space:pre-wrap;word-wrap:break-word}.placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-style:italic;text-align:center;padding:var(--space-lg);font-family:var(--font-detail)}.main-layout{min-height:100vh;display:flex;flex-direction:column;background:var(--bg-primary)}.editor-wrapper{flex:1 1;display:flex;flex-direction:column}