*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary: #1e1e2e;--bg-secondary: #181825;--bg-surface: #252538;--bg-toolbar: #11111b;--text-primary: #cdd6f4;--text-secondary: #a6adc8;--text-muted: #6c7086;--accent: #89b4fa;--accent-hover: #74c7ec;--green: #a6e3a1;--red: #f38ba8;--yellow: #f9e2af;--border: #313244;--radius: 6px;--toolbar-height: 48px;--panel-header-height: 30px}html,body{height:100%;overflow:hidden;font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:14px;background:var(--bg-primary);color:var(--text-primary)}#toolbar{height:var(--toolbar-height);background:var(--bg-toolbar);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:12px}.toolbar-left{display:flex;align-items:center;gap:12px}.toolbar-left button{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 14px;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:background .15s,border-color .15s}.toolbar-left button:hover{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.app-title{font-weight:700;font-size:15px;color:var(--accent);letter-spacing:.5px}.device-label{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}#device-select{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 10px;font-size:13px;cursor:pointer;min-width:140px}#device-select:hover,#device-select:focus{border-color:var(--accent);outline:none}.toolbar-icon-btn{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 10px;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:4px}.toolbar-icon-btn:hover{background:var(--bg-primary);border-color:var(--accent);color:var(--accent)}.toolbar-actions{display:flex;align-items:center;gap:8px}.toolbar-actions button{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 14px;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:background .15s,border-color .15s}.toolbar-actions button:hover:not(:disabled){background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.toolbar-actions button:disabled{opacity:.4;cursor:not-allowed}.toolbar-actions button .icon{font-size:14px}#connection-status{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px}.status-disconnected{background:#f38ba826;color:var(--red)}.status-connected{background:#a6e3a126;color:var(--green)}#workspace-container{display:flex;flex-direction:column;height:calc(100vh - var(--toolbar-height))}#top-area{flex:1 1 65%;display:flex;position:relative;min-height:200px;overflow:hidden}#blockly-area{flex:1;position:relative;min-width:200px;overflow:hidden}#blockly-div{position:absolute;top:0;right:0;bottom:0;left:0}#bottom-panels{flex:0 0 35%;min-height:0;display:flex;position:relative;border-top:1px solid var(--border)}#bottom-panels.all-collapsed{flex:0 0 var(--panel-header-height);min-height:var(--panel-header-height)}.resize-handle.horizontal{position:absolute;top:-3px;left:0;right:0;height:6px;cursor:ns-resize;z-index:10}.ide-panel{display:flex;flex-direction:column;overflow:hidden}.ide-panel .panel-body{flex:1;display:flex;flex-direction:column;overflow:hidden}.ide-panel.collapsed .panel-body{display:none}.panel-header{background:var(--bg-secondary);padding:0 12px;height:var(--panel-header-height);min-height:var(--panel-header-height);font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.8px;border-bottom:1px solid var(--border);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none}.panel-header .panel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-toggle{background:none;border:none;color:var(--text-muted);font-size:12px;cursor:pointer;padding:2px 4px;line-height:1;border-radius:3px;transition:color .15s,background .15s;flex-shrink:0}.panel-toggle:hover{color:var(--text-primary);background:var(--bg-surface)}#code-panel,#terminal-panel{flex:1;overflow:hidden}#code-panel{border-right:1px solid var(--border)}#code-panel.collapsed,#terminal-panel.collapsed{flex:0 0 auto}#code-preview{flex:1;overflow:auto;background:var(--bg-secondary);padding:10px 14px;font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:13px;line-height:1.5;color:var(--text-primary);white-space:pre;-moz-tab-size:4;tab-size:4;margin:0}#terminal-panel .panel-body{background:var(--bg-secondary)}#terminal-output{flex:1;overflow-y:auto;padding:10px 14px;font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:13px;line-height:1.5;color:var(--green);white-space:pre-wrap;word-break:break-all}#terminal-input-row{display:flex;border-top:1px solid var(--border);flex-shrink:0}#terminal-input{flex:1;background:var(--bg-toolbar);color:var(--text-primary);border:none;padding:8px 12px;font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:13px;outline:none}#terminal-input:disabled{opacity:.5}#terminal-input::placeholder{color:var(--text-muted)}#projects-panel{width:280px;min-width:0;border-left:1px solid var(--border);background:var(--bg-secondary);transition:width .15s ease;position:relative}#projects-panel.collapsed{width:30px;min-width:30px}#projects-panel.collapsed .panel-header{display:none}#projects-panel.collapsed .panel-toggle{writing-mode:horizontal-tb}#side-tools-rail{display:flex;flex-direction:column;position:absolute;right:0;top:0;bottom:0;width:30px;gap:6px}#projects-panel:not(.collapsed) .panel-header,#projects-panel:not(.collapsed) .panel-body{margin-right:30px}#projects-panel.collapsed #side-tools-rail{top:6px}.side-rail-btn{width:30px;min-height:110px;background:var(--bg-secondary);border:1px solid var(--border);border-left:none;border-right:none;color:var(--text-secondary);font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;writing-mode:vertical-rl;text-orientation:mixed;display:flex;align-items:center;justify-content:flex-start;gap:8px;padding:10px 0;cursor:pointer}.side-rail-btn:hover{color:var(--text-primary);background:var(--bg-surface)}.side-rail-arrow{writing-mode:horizontal-tb;line-height:1}.proj-tabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0}.proj-tab{flex:1;background:none;border:none;border-bottom:2px solid transparent;color:var(--text-muted);font-size:12px;font-weight:600;padding:8px 4px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;transition:color .15s,border-color .15s}.proj-tab:hover{color:var(--text-primary)}.proj-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.proj-tab-content{flex:1;display:flex;flex-direction:column;gap:8px;padding:8px;overflow-y:auto}.proj-tab-content.hidden{display:none}.projects-list{list-style:none;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);min-height:100px;max-height:40vh;overflow-y:auto;padding:4px}.projects-list li{padding:6px 10px;cursor:pointer;border-radius:4px;font-size:12px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.projects-list li:hover{background:var(--bg-surface)}.projects-list li.selected{background:var(--accent);color:var(--bg-toolbar)}.projects-list .empty-msg{padding:6px 10px;color:var(--text-muted);font-size:11px;font-style:italic;cursor:default}.projects-actions{display:flex;flex-direction:column;gap:6px}.projects-name-row{display:flex;gap:4px}.projects-name-row input{flex:1;background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:5px 8px;font-size:12px;outline:none;min-width:0}.projects-name-row input:focus{border-color:var(--accent)}.projects-btn-row{display:flex;gap:4px}.projects-actions button{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:5px 10px;font-size:12px;cursor:pointer;transition:background .15s,border-color .15s;flex:1}.projects-actions button:hover:not(:disabled){background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.projects-actions button:disabled{opacity:.4;cursor:not-allowed}.projects-actions button.btn-danger:hover:not(:disabled){background:var(--red);border-color:var(--red)}.projects-note{font-size:11px;color:var(--text-muted);font-style:italic;min-height:16px}#robot-panel{width:300px;min-width:0;flex-shrink:0;border-left:1px solid var(--border);background:var(--bg-secondary)}.robot-panel-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:10px;gap:8px;overflow:hidden}.robot-toolbar{display:flex;flex-wrap:wrap;gap:4px}.robot-tb-btn{flex:1 1 auto;min-width:0;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:5px 6px;font-size:11px;cursor:pointer;transition:background .15s,border-color .15s}.robot-tb-btn:hover{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.robot-tb-primary{font-weight:600}.robot-full-btn{width:100%;margin-top:4px;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 8px;font-size:11px;cursor:pointer}.robot-full-btn:hover{background:var(--bg-primary);border-color:var(--accent)}.robot-note{font-size:11px;color:var(--text-muted);margin-top:6px;min-height:14px}.robot-note-warn{color:var(--amber, #d4a017)}.robot-add-row{display:flex;gap:4px;margin-top:8px}.robot-add-select{flex:1;min-width:0;background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:5px 6px;font-size:12px}.robot-comp-list{list-style:none;margin:8px 0 0;padding:0;max-height:140px;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-primary)}.robot-comp-item{padding:6px 8px;font-size:12px;cursor:pointer;color:var(--text-primary);border-bottom:1px solid var(--border)}.robot-comp-item:last-child{border-bottom:none}.robot-comp-item:hover{background:var(--bg-surface)}.robot-comp-item.selected{background:var(--accent);color:var(--bg-toolbar)}.robot-editor{margin-top:8px;padding-top:8px;border-top:1px solid var(--border);flex:1;min-height:0;overflow-y:auto}.robot-editor-empty{font-size:12px;color:var(--text-muted);margin:0}.robot-editor-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.robot-editor-title{font-size:12px;font-weight:600;color:var(--text-primary)}.robot-remove-btn{flex-shrink:0;padding:4px 8px;font-size:11px}.robot-field-row{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}.robot-field-row label{font-size:11px;color:var(--text-secondary)}.robot-field-row input,.robot-field-row select{background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:5px 8px;font-size:12px}.robot-status{font-size:11px;color:var(--text-muted);margin-top:8px;min-height:14px}.robot-status-error{color:var(--red)}.robot-file-input-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;opacity:0}.blocklyMainBackground{fill:var(--bg-primary)!important}.blocklyToolboxDiv{background:var(--bg-secondary)!important;border-right:1px solid var(--border)!important}.blocklyFlyoutBackground{fill:var(--bg-surface)!important}.blocklyTreeRow:hover{background:var(--bg-surface)!important}.blocklyTreeSelected{background:var(--accent)!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.hidden{display:none!important}#flash-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:1000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#flash-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:28px 32px;width:520px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;gap:14px}#flash-modal h3{margin:0;color:var(--accent);font-size:16px}#flash-log{font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:12px;line-height:1.5;color:var(--text-secondary);background:var(--bg-secondary);border-radius:var(--radius);padding:10px 12px;max-height:200px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}#flash-progress-bar{height:10px;background:var(--bg-secondary);border-radius:5px;overflow:hidden}#flash-progress-fill{height:100%;width:0%;background:var(--accent);border-radius:5px;transition:width .2s ease}#flash-progress-text{font-size:13px;color:var(--text-secondary);text-align:center}#flash-close{align-self:flex-end;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:8px 20px;cursor:pointer;font-size:13px;transition:background .15s,border-color .15s}#flash-close:hover{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}#send-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:1000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#send-overlay.hidden{display:none!important}#send-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:28px 40px;width:360px;max-width:90vw;display:flex;flex-direction:column;gap:16px;align-items:center}#send-modal h3{margin:0;color:var(--accent);font-size:16px;text-align:center}#send-modal #send-progress-bar{width:100%;height:10px;background:var(--bg-secondary);border-radius:5px;overflow:hidden}#send-modal #send-progress-fill{height:100%;width:0%;background:var(--accent);border-radius:5px;transition:width .15s ease}#send-modal #send-progress-text{font-size:14px;color:var(--text-secondary);font-weight:600}#addons-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:1000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#addons-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:24px 28px;width:440px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;gap:14px;overflow-y:auto}.addons-header{display:flex;align-items:center;justify-content:space-between}.addons-header h3{margin:0;color:var(--accent);font-size:16px}.addons-header button{background:none;border:none;color:var(--text-muted);font-size:22px;cursor:pointer;padding:0 4px;line-height:1}.addons-header button:hover{color:var(--text-primary)}.addons-description{font-size:12px;color:var(--text-secondary);line-height:1.5;margin:0}.addons-description code{background:var(--bg-secondary);padding:1px 5px;border-radius:3px;font-size:12px}.addons-upload-row{display:flex;gap:8px;align-items:center}.addons-upload-row input[type=file]{flex:1;font-size:12px;color:var(--text-primary)}.addons-upload-row button{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 16px;font-size:13px;cursor:pointer;transition:background .15s,border-color .15s}.addons-upload-row button:hover{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.addons-status{font-size:12px;min-height:18px;color:var(--text-muted)}.addons-status.status-ok{color:var(--green)}.addons-status.status-err{color:var(--red)}.addons-status.status-warn{color:var(--yellow)}.addons-list{list-style:none;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);min-height:60px;max-height:200px;overflow-y:auto;padding:4px}.addons-list .addons-empty{padding:12px 10px;color:var(--text-muted);font-size:12px;font-style:italic;text-align:center}.addons-list .addons-item{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;border-radius:4px}.addons-list .addons-item:hover{background:var(--bg-surface)}.addons-item-name{font-size:13px;color:var(--text-primary)}.addons-item-remove{background:none;border:1px solid var(--border);border-radius:var(--radius);color:var(--red);font-size:11px;padding:3px 8px;cursor:pointer;transition:background .15s,border-color .15s}.addons-item-remove:hover{background:var(--red);color:var(--bg-toolbar);border-color:var(--red)}#customizer-panel{width:280px;min-width:0;border-left:1px solid var(--border);background:var(--bg-secondary);flex-shrink:0}#customizer-panel.hidden{display:none!important}#customizer-panel .panel-body{overflow-y:auto}.cust-done-btn{background:var(--accent);color:var(--bg-toolbar);border:none;border-radius:var(--radius);padding:2px 12px;font-size:11px;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:.4px;transition:opacity .15s}.cust-done-btn:hover{opacity:.85}.cust-presets{display:flex;flex-direction:column;gap:5px;padding:8px;border-bottom:1px solid var(--border);flex-shrink:0}.cust-preset-row{display:flex;gap:4px}.cust-preset-row select,.cust-preset-row input{flex:1;background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:4px 6px;font-size:11px;outline:none;min-width:0}.cust-preset-row select:focus,.cust-preset-row input:focus{border-color:var(--accent)}.cust-preset-row button{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:4px 8px;font-size:11px;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}.cust-preset-row button:hover{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}.cust-preset-row button.btn-danger:hover{background:var(--red);border-color:var(--red)}.customizer-tree{overflow-y:auto;padding:4px 6px;flex:1}.cust-cat{display:flex;align-items:center;gap:6px;padding:4px 6px;border-radius:4px;-webkit-user-select:none;user-select:none;transition:opacity .15s}.cust-cat:hover{background:var(--bg-surface)}.cust-swatch{width:10px;height:10px;border-radius:3px;flex-shrink:0}.cust-cat-label{font-size:12px;font-weight:600;color:var(--text-primary);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cust-expand{background:none;border:none;color:var(--text-muted);font-size:11px;cursor:pointer;padding:1px 4px;border-radius:3px;line-height:1;flex-shrink:0}.cust-expand:hover{color:var(--text-primary);background:var(--bg-primary)}.cust-cb{accent-color:var(--accent);width:14px;height:14px;cursor:pointer;flex-shrink:0}.cust-blocks{padding-left:30px}.cust-block-row{display:flex;align-items:center;gap:6px;padding:2px 6px;border-radius:4px;transition:opacity .15s}.cust-block-row:hover{background:var(--bg-surface)}.cust-block-label{font-size:11px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cust-dimmed{opacity:.4}.cust-cb:disabled{opacity:.3;cursor:not-allowed}#btn-customize.active{background:var(--accent);color:var(--bg-toolbar);border-color:var(--accent)}#hex-upload-overlay,#esp32-flash-overlay,#microbit-flash-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:1000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#hex-upload-modal,#esp32-flash-modal,#microbit-flash-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:24px 28px;width:460px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;gap:14px;overflow-y:auto}.board-select-header{display:flex;align-items:center;justify-content:space-between}.board-select-header h3{margin:0;color:var(--accent);font-size:16px}.board-select-header button{background:none;border:none;color:var(--text-muted);font-size:22px;cursor:pointer;padding:0 4px;line-height:1}.board-select-header button:hover{color:var(--text-primary)}.board-select-description{font-size:12px;color:var(--text-secondary);line-height:1.5;margin:0}.board-list{list-style:none;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);min-height:60px;max-height:200px;overflow-y:auto;padding:4px}.board-list .board-empty{padding:12px 10px;color:var(--text-muted);font-size:12px;font-style:italic;text-align:center}.board-list .board-item{padding:8px 12px;cursor:pointer;border-radius:4px;font-size:13px;color:var(--text-primary);transition:background .1s}.board-list .board-item:hover{background:var(--bg-surface)}.board-list .board-item.selected{background:var(--accent);color:var(--bg-toolbar)}.board-select-actions{display:flex;justify-content:flex-end;gap:8px}.board-select-actions button{background:var(--accent);color:var(--bg-toolbar);border:none;border-radius:var(--radius);padding:8px 20px;font-size:13px;font-weight:600;cursor:pointer;transition:opacity .15s}.board-select-actions button:hover{opacity:.85}.hex-upload-fields{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;align-items:center}.hex-field-label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.hex-upload-fields select,.hex-upload-fields input[type=file]{background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);padding:6px 10px;font-size:13px;outline:none}.hex-upload-fields select:focus{border-color:var(--accent)}.hex-upload-status{font-size:12px;min-height:18px;color:var(--text-muted)}.hex-upload-status.status-err{color:var(--red)}.hex-upload-status.status-ok{color:var(--green)}