*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;background:#1e1e1e;color:#ccc}#app{display:flex;flex-direction:column;height:100vh;height:100dvh}#toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:36px;background:#323233;border-bottom:1px solid #3c3c3c;flex-shrink:0}.toolbar-left{display:flex;align-items:center;gap:12px}.toolbar-logo{width:24px;height:24px;border-radius:4px}.toolbar-title{font-size:13px;font-weight:500;color:#ccc;letter-spacing:.5px}.toolbar-actions{display:flex;align-items:center;gap:4px}.toolbar-actions button{padding:4px 10px;border:none;border-radius:4px;background:transparent;color:#ccc;cursor:pointer;font-size:12px;line-height:20px}.toolbar-actions button:hover{background:#505050}.toolbar-actions button:active{background:#404040}#auto-sync-btn{font-weight:700;border:1px solid #555;border-radius:4px;padding:4px 8px;transition:background .2s,border-color .2s,color .2s}#auto-sync-btn.auto-sync-on,#mobile-sync-btn.auto-sync-on{color:#4ec9b0;border-color:#4ec9b0;background:#4ec9b01f}#auto-sync-btn.auto-sync-off,#mobile-sync-btn.auto-sync-off{color:#888;border-color:#555;background:transparent}#auto-sync-btn.auto-sync-on:hover,#mobile-sync-btn.auto-sync-on:hover{background:#4ec9b040}#auto-sync-btn.auto-sync-off:hover,#mobile-sync-btn.auto-sync-off:hover{background:#3a3a3a}#sync-blocks-btn{color:#f0c040;border:1px solid transparent;transition:border-color .3s,box-shadow .3s}#sync-code-btn{color:#5edc8e;border:1px solid transparent;transition:border-color .3s,box-shadow .3s}#sync-blocks-btn:hover{background:#f0c04026}#sync-code-btn:hover{background:#2ecc7126}.toolbar-separator{width:1px;height:16px;background:#505050;margin:0 4px}.toolbar-select{padding:2px 6px;border:1px solid #555;border-radius:4px;background:#3c3c3c;color:#ccc;font-size:11px;cursor:pointer;outline:none}.toolbar-select:hover{border-color:#007acc}.toolbar-select:focus{border-color:#007acc}.topic-selector{display:inline-flex;align-items:center;gap:2px}.topic-dropdown{max-width:140px}.topic-tree-btn{padding:2px 6px!important;font-size:11px!important;line-height:18px!important;min-width:22px;background:#3c3c3c!important;border:1px solid #555!important;border-radius:3px!important;color:#ccc!important;cursor:pointer;transition:background .15s}.topic-tree-btn:hover{background:#505050!important;color:#fff!important}.topic-tree-popover{z-index:10002;background:#2d2d2d;border:1px solid #555;border-radius:6px;padding:6px 0;box-shadow:0 4px 16px #00000080;min-width:200px;max-width:320px;font-size:12px}.topic-tree-row{display:flex;align-items:center;gap:5px;padding:3px 10px;cursor:pointer;color:#ccc;white-space:nowrap;-webkit-user-select:none;user-select:none}.topic-tree-row:hover{background:#3c3c3c}.topic-tree-row input[type=checkbox]{margin:0;accent-color:#007acc;cursor:pointer}.topic-tree-row input[type=checkbox]:disabled{opacity:.5;cursor:default}.topic-tree-label{overflow:hidden;text-overflow:ellipsis}#editors{display:flex;flex:1;overflow:hidden}.split-left,.split-right{overflow:hidden;position:relative}.split-divider{width:4px;background:#252526;cursor:col-resize;flex-shrink:0;transition:background .1s}.split-divider:hover{background:#007acc}#blockly-panel{background:#1e1e1e}#blockly-panel .injectionDiv{border:none!important}#monaco-panel{background:#1e1e1e}#status-bar{display:flex;align-items:center;padding:0 12px;height:22px;background:#007acc;color:#fff;font-size:12px;flex-shrink:0}.status-item{margin:0 4px}.status-sep{margin:0 2px;opacity:.6}.status-spacer{flex:1}.status-sync{opacity:.9}.status-message{font-weight:500}.console-panel{display:flex;flex-direction:column;background:#1e1e1e;border-top:1px solid #3c3c3c}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;background:#252526;border-bottom:1px solid #3c3c3c}.panel-title{font-size:11px;font-weight:600;text-transform:uppercase;color:#ccc}.panel-clear-btn{border:none;background:transparent;color:#999;cursor:pointer;font-size:12px;padding:2px 4px}.panel-clear-btn:hover{color:#fff}.console-output{flex:1;overflow-y:auto;padding:4px 8px;font-family:Consolas,Courier New,monospace;font-size:12px}.console-line{padding:1px 0;color:#ccc;white-space:pre-wrap}.console-error{color:#f44747}.variable-panel{display:flex;flex-direction:column;background:#1e1e1e;border-top:1px solid #3c3c3c}.variable-table{width:100%;border-collapse:collapse;font-size:12px}.variable-table th{background:#252526;color:#999;text-align:left;padding:3px 8px;font-weight:500;font-size:11px;text-transform:uppercase;border-bottom:1px solid #3c3c3c}.variable-table td{padding:2px 8px;border-bottom:1px solid #2d2d2d}.var-name{color:#9cdcfe}.var-type{color:#4ec9b0}.var-value{color:#ce9178}.var-empty{color:#666;text-align:center;padding:8px!important}.toast{position:fixed;bottom:40px;left:50%;transform:translate(-50%) translateY(20px);padding:8px 20px;border-radius:4px;font-size:13px;color:#fff;opacity:0;transition:opacity .3s,transform .3s;z-index:10000;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.toast-success{background:#27ae60f2}.toast-error{background:#e74c3cf2}.style-action-bar{position:fixed;top:36px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;background:#1e1e1ef7;border-bottom:2px solid #007acc;color:#ccc;font-size:13px;z-index:10001;transform:translateY(-100%);transition:transform .25s ease;box-shadow:0 2px 8px #0006}.style-action-bar.show{transform:translateY(0)}.style-action-bar-msg{flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.style-action-bar-btns{display:flex;gap:6px;flex-shrink:0}.style-action-btn{padding:3px 12px;border:1px solid #555;border-radius:3px;background:#333;color:#ccc;font-size:12px;cursor:pointer}.style-action-btn:hover{background:#444}.style-action-btn.primary{background:#007acc;border-color:#007acc;color:#fff}.style-action-btn.primary:hover{background:#0098ff}.bottom-panel{display:flex;flex-direction:column;overflow:hidden}.bottom-panel-divider{height:6px;background:#333;cursor:row-resize;flex-shrink:0;transition:background .1s;position:relative}.bottom-panel-divider:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:32px;height:2px;background:#666;border-radius:1px}.bottom-panel-divider:hover{background:#007acc}.bottom-panel-divider:hover:after{background:#fff}.bottom-panel-tabs{display:flex;align-items:center;background:#252526;border-bottom:1px solid #3c3c3c;flex-shrink:0}.bottom-panel-tab-buttons{display:flex;flex:1}.bottom-panel-tab-actions{display:flex;margin-right:4px}.bottom-panel-action-btn{padding:2px 6px;border:1px solid #555;background:transparent;color:#999;cursor:pointer;font-size:12px;line-height:1;border-radius:3px}.bottom-panel-action-btn:hover{color:#fff;background:#3c3c3c}.bottom-tab-btn{padding:4px 12px;border:none;border-bottom:2px solid transparent;background:transparent;color:#999;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500}.bottom-tab-btn:hover{color:#ccc}.bottom-tab-btn.active{color:#fff;border-bottom-color:#007acc}.bottom-panel-content{flex:1;overflow:hidden;position:relative}.bottom-panel-content>*{position:absolute;inset:0;overflow-y:auto}.right-column{display:flex;flex-direction:column;overflow:hidden}.right-column>.monaco-wrapper{flex:1;overflow:hidden}.console-input-row{display:flex;align-items:center;padding:2px 8px;gap:4px;border-top:1px solid #3c3c3c}.console-input{flex:1;background:#2d2d2d;border:1px solid #555;border-radius:3px;color:#ccc;padding:3px 6px;font-family:Consolas,Courier New,monospace;font-size:12px;outline:none}.console-input:focus{border-color:#007acc}.console-input-btn{padding:3px 8px;border:none;border-radius:3px;background:#007acc;color:#fff;cursor:pointer;font-size:11px}.console-inline-input-line{display:flex;align-items:center;padding:1px 0}.console-inline-input{background:transparent;border:none;outline:none;color:#ccc;caret-color:#ccc;font-family:Consolas,Courier New,monospace;font-size:12px;padding:0;margin:0;width:auto;min-width:60px;flex:1;display:inline}.console-inline-input::placeholder{color:#cccccc4d}.console-input-echo{color:#ccc;padding:1px 0}.console-status{padding:2px 8px;font-size:11px;color:#999;border-top:1px solid #3c3c3c;flex-shrink:0}.console-status:empty{display:none}.console-status.running{color:#4fc1ff;background:#4fc1ff1f;border-radius:10px;display:inline-block;padding:1px 10px;margin:2px 8px;border-top:none}.console-status.error{color:#f44747;background:#f447471f;border-radius:10px;display:inline-block;padding:1px 10px;margin:2px 8px;border-top:none}.console-status.completed{color:#6a9955;background:#6a99551f;border-radius:10px;display:inline-block;padding:1px 10px;margin:2px 8px;border-top:none}.scope-group{margin-bottom:2px}.scope-group-header{display:flex;align-items:center;padding:2px 8px;background:#2d2d2d;cursor:pointer;font-size:11px;color:#999;-webkit-user-select:none;user-select:none}.scope-group-header:hover{background:#333}.scope-group-toggle{margin-right:4px;font-size:10px}.scope-group.collapsed .scope-group-body{display:none}.var-changed{background:#ffff0014!important}.var-changed .var-value{color:#dcdcaa;font-weight:600}.exec-btn{padding:4px 8px!important}.exec-btn.run{color:#fff!important;background:#27ae6059!important;border:1px solid #27ae60!important}.exec-btn.run:hover{background:#27ae608c!important}.run-group{display:flex;align-items:center;position:relative}.run-group #run-btn{border-radius:4px 0 0 4px!important;border-right:none!important}.run-group .run-mode-arrow{border-radius:0 4px 4px 0!important;padding:4px!important;min-width:20px;font-size:10px}.run-mode-menu{position:absolute;top:100%;right:0;margin-top:2px;background:#2d2d2d;border:1px solid #555;border-radius:6px;box-shadow:0 4px 12px #00000080;min-width:160px;z-index:10000;overflow:hidden;padding:4px 0}.run-mode-option{padding:6px 12px;font-size:12px;color:#ccc;cursor:pointer;white-space:nowrap}.run-mode-option:hover{background:#094771;color:#fff}.run-mode-option.active{background:#27ae6033}.run-mode-option.active:after{content:" ✓";color:#27ae60}.run-mode-separator{height:1px;background:#555;margin:4px 0}.debug-toolbar{position:fixed;top:38px;left:50%;transform:translate(-50%);z-index:9999;display:flex;align-items:center;gap:1px;background:#3c3c3c;border:1px solid #555;border-radius:6px;padding:2px 4px;box-shadow:0 4px 12px #00000080;-webkit-user-select:none;user-select:none}.debug-toolbar-handle{display:flex;align-items:center;cursor:grab;padding:0 4px;color:#888;font-size:10px;letter-spacing:1px}.debug-toolbar-handle:active{cursor:grabbing}.debug-toolbar-handle:before{content:"⠿";font-size:14px}.debug-toolbar button{display:flex;align-items:center;justify-content:center;width:28px;height:24px;border:none;border-radius:4px;background:transparent;color:#ccc;font-size:14px;cursor:pointer;padding:0;line-height:1}.debug-toolbar button:hover{background:#505050}.debug-toolbar button:active{background:#404040}.debug-toolbar button.debug-continue{color:#27ae60}.debug-toolbar button.debug-pause{color:#f39c12}.debug-toolbar button.debug-step,.debug-toolbar button.debug-step-out{color:#4fc1ff}.debug-toolbar button.debug-accelerate{color:#dcdcaa}.debug-toolbar button.debug-auto-scroll{opacity:.5;border-bottom:2px solid transparent}.debug-toolbar button.debug-auto-scroll.active{opacity:1;border-bottom:2px solid #4fc1ff}.debug-toolbar .debug-accelerate-level{width:36px;height:22px;background:#3c3c3c;color:#dcdcaa;border:1px solid #555;border-radius:3px;text-align:center;font-size:12px;padding:0 2px;margin-left:2px}.debug-toolbar button.debug-stop{color:#e74c3c}.debug-toolbar .debug-separator{width:1px;height:16px;background:#555;margin:0 2px}.debug-toolbar .debug-status{font-size:11px;color:#aaa;padding:0 6px;white-space:nowrap}#sync-blocks-btn.sync-hint{animation:sync-pulse-yellow 1.5s ease-in-out infinite;border:2px solid #f0c040!important;box-shadow:0 0 6px #f0c04099}#sync-code-btn.sync-hint{animation:sync-pulse-green 1.5s ease-in-out infinite;border:2px solid #2ecc71!important;box-shadow:0 0 6px #2ecc7199}@keyframes sync-pulse-yellow{0%,to{box-shadow:0 0 4px #f0c04066}50%{box-shadow:0 0 10px #f0c040cc}}@keyframes sync-pulse-green{0%,to{box-shadow:0 0 4px #2ecc7166}50%{box-shadow:0 0 10px #2ecc71cc}}.blocklySelected>.blocklyPath{stroke:inherit!important;stroke-width:inherit!important;filter:none!important}.blocklyPath.blockly-highlight-forward,.blocklySelected>.blocklyPath.blockly-highlight-forward{stroke:#f0c040!important;stroke-width:4px!important;filter:drop-shadow(0 0 6px rgba(240,192,64,.8))!important}.blocklyPath.blockly-highlight-reverse,.blocklySelected>.blocklyPath.blockly-highlight-reverse{stroke:#2ecc71!important;stroke-width:4px!important;filter:drop-shadow(0 0 6px rgba(46,204,113,.8))!important}.blocklyPath.blockly-highlight-execution,.blocklySelected>.blocklyPath.blockly-highlight-execution{stroke:#ffdd57!important;stroke-width:6px!important;filter:drop-shadow(0 0 14px rgba(255,221,87,1)) drop-shadow(0 0 6px rgba(255,255,150,.8))!important}.monaco-line-highlight{background:#f0c04026!important}.monaco-line-highlight-gutter{background:#f0c040;width:3px!important}.monaco-line-highlight-reverse{background:#2ecc7126!important}.monaco-line-highlight-gutter-reverse{background:#2ecc71;width:3px!important}.ghost-line{opacity:.4!important;font-style:italic!important}.ghost-line-gutter{background:#8080804d;width:3px!important}.quick-access-bar{display:flex;align-items:center;gap:4px;padding:2px 8px;background:#2d2d2d;border-bottom:1px solid #3c3c3c;flex-shrink:0;flex-wrap:wrap}.quick-access-bar button{padding:2px 8px;border:none;border-radius:3px;background:transparent;color:#bbb;cursor:pointer;font-size:11px;line-height:18px}.quick-access-bar button:hover{background:#505050;color:#fff}.quick-access-bar button:active{background:#404040}.file-menu-group{position:relative}.file-menu{position:absolute;top:100%;left:0;margin-top:2px;background:#2d2d2d;border:1px solid #555;border-radius:6px;box-shadow:0 4px 12px #00000080;min-width:140px;z-index:10000;overflow:hidden;padding:4px 0}.file-menu-option{padding:6px 12px;font-size:12px;color:#ccc;cursor:pointer;white-space:nowrap}.file-menu-option:hover{background:#094771;color:#fff}.breakpoint-glyph{background:#e51400;border-radius:50%;width:10px!important;height:10px!important;margin-top:4px;margin-left:4px;cursor:pointer}.hidden{display:none!important}.monaco-clipboard-bar{display:flex;gap:4px;padding:6px 8px;background:#1e1e1e;border-bottom:1px solid #333;flex-shrink:0}.clipboard-btn{background:#2d2d2d;color:#ccc;border:1px solid #444;border-radius:3px;padding:2px 8px;font-size:11px;cursor:pointer;white-space:nowrap}.clipboard-btn:hover{background:#3a3a3a;color:#fff}.blocklyToolboxDiv{background:#252526!important}.blocklyTreeRow{padding:4px 12px!important}.blocklyTreeLabel{color:#ccc!important;font-size:13px!important}.blocklyFlyoutBackground{fill:#2d2d2d!important}.blocklyScrollbarBackground{fill:transparent!important}.blocklyScrollbarHandle{fill:#4a4a4a!important}.blocklyTrash{opacity:.6}#mobile-tab-bar-container{flex-shrink:0;height:48px}.mobile-tab-bar{display:flex;align-items:center;justify-content:space-around;height:48px;background:#252526;border-top:1px solid #3c3c3c;z-index:9000}.mobile-tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;height:100%;min-height:44px;border:none;background:transparent;color:#888;cursor:pointer;font-size:10px;padding:4px 0;position:relative;-webkit-tap-highlight-color:transparent}.mobile-tab-item.active{color:#007acc}.mobile-tab-icon{font-size:18px;line-height:1}.mobile-tab-label{font-size:10px;margin-top:2px}.mobile-tab-badge{position:absolute;top:4px;right:calc(50% - 16px);width:8px;height:8px;background:#e74c3c;border-radius:50%}.mobile-menu-overlay{position:absolute;top:36px;right:0;background:#2d2d2d;border:1px solid #555;border-radius:0 0 6px 6px;box-shadow:0 4px 16px #00000080;min-width:220px;max-width:300px;z-index:10001;padding:8px 0}.mobile-menu-item{display:flex;align-items:center;gap:8px;padding:8px 16px;color:#ccc;font-size:12px}.mobile-menu-item label{white-space:nowrap;min-width:60px;color:#999;font-size:11px}.mobile-menu-item .toolbar-select,.mobile-menu-item select,.mobile-menu-item .topic-selector{flex:1;min-width:0}.mobile-menu-separator{height:1px;background:#3c3c3c;margin:4px 0}.mobile-menu-summary{padding:8px 16px;font-size:11px;color:#888;border-top:1px solid #3c3c3c;margin-top:4px}.hamburger-btn{display:none;padding:4px 10px;border:none;border-radius:4px;background:transparent;color:#ccc;cursor:pointer;font-size:16px;line-height:20px}.hamburger-btn:hover{background:#505050}.mobile-panel-container{display:none;position:absolute;inset:0;overflow:hidden}.mobile-panel-container.active{display:flex;flex-direction:column}.mobile-panel-container>.monaco-wrapper{flex:1;overflow:hidden}.mobile-panel-container>.monaco-wrapper .monaco-editor .inputarea{font-size:16px!important}.mobile-panel-container>.bottom-panel{flex:1!important}.mobile-panel-container>.bottom-panel .bottom-panel-divider{display:none}.mobile-panel-container>.bottom-panel .bottom-panel-content{flex:1}.code-keyboard{background:#1b1b1b;border-top:1px solid #3c3c3c;padding:4px 2px;flex-shrink:0;user-select:none;-webkit-user-select:none}.code-kb-row{display:flex;justify-content:center;gap:3px;margin-bottom:3px}.code-kb-row:last-child{margin-bottom:0}.code-kb-key{flex:1;min-width:0;height:38px;border:none;border-radius:5px;background:#3a3a3a;color:#e0e0e0;font-size:15px;font-family:Consolas,Courier New,monospace;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.code-kb-key:active{background:#555}.code-kb-key.code-kb-active{background:#007acc;color:#fff}.code-kb-shortcuts{border-bottom:1px solid #333;padding-bottom:4px;margin-bottom:2px}.code-kb-shortcut-key{height:30px!important;font-size:12px!important;font-family:-apple-system,BlinkMacSystemFont,sans-serif!important;background:#2a2a2a!important;border-radius:3px!important}.code-kb-shortcut-key:active{background:#555!important}.ime-toggle-btn{position:absolute;bottom:8px;right:8px;width:40px;height:40px;border:none;border-radius:50%;background:#007acc;color:#fff;font-size:20px;cursor:pointer;z-index:200;box-shadow:0 2px 8px #00000080;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.ime-toggle-btn:active{background:#0098ff}@media(max-width:768px){.split-divider,#status-bar,.quick-access-bar #auto-sync-btn,.quick-access-bar #sync-blocks-btn,.quick-access-bar #sync-code-btn,.quick-access-bar #level-selector-mount,.quick-access-bar #block-style-selector-mount,.quick-access-bar .file-menu-group,.quick-access-bar .toolbar-separator{display:none!important}.hamburger-btn{display:inline-flex}.toolbar-actions #style-selector-mount,.toolbar-actions #locale-selector-mount,.toolbar-actions .toolbar-separator{display:none!important}#editors{flex-direction:column;position:relative}.split-left,.split-right{position:absolute!important;width:100%!important}#mobile-blocks #blockly-panel{flex:1;max-height:calc(100% - 10px)}.blocklyToolbox{max-height:calc(100vh - 111px)!important;overflow-y:auto!important}.toolbox-collapse-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:200;width:22px;height:44px;background:#333;border:1px solid #555;border-left:none;border-radius:0 6px 6px 0;color:#ccc;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation}.toolbox-collapse-btn:active{background:#444}body>.toast{bottom:calc(var(--kb-height, 0px) + 60px)}.debug-toolbar{top:38px;font-size:11px}}
