*{box-sizing:border-box}html,body{height:100%;margin:0;display:flex;justify-content:center;align-items:center;font-family:system-ui,-apple-system,sans-serif}.editor{display:flex;flex-direction:row;align-items:flex-start;gap:10px;padding:20px}.editor__toolbar{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.editor__toolbar-file-input::-webkit-file-upload-button,.editor__toolbar-export-btn,.editor__toolbar-mode-btn,.editor__toolbar-run-btn{background:#f8f9fa;border:1px solid #ccc;border-radius:4px;padding:4px 8px;margin-right:8px;cursor:pointer;font-size:13px}.editor__toolbar-file-input::-webkit-file-upload-button:hover,.editor__toolbar-export-btn:hover,.editor__toolbar-mode-btn:hover,.editor__toolbar-run-btn:hover{background:#e9ecef}.editor__palette{display:flex;flex-direction:column;gap:12px;padding:12px;flex:1}.editor__palette-category{display:block;width:100%;margin-bottom:8px}.editor__palette-category-title{font-size:13px;font-weight:600;color:#666;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.editor__palette-row{display:flex;flex-wrap:nowrap;gap:4px;width:100%}.editor__palette-item{display:flex;align-items:center;justify-content:center;width:90px;height:30px;font-size:11px;font-weight:500;text-align:center;background:#fff;color:#fff;border:1px solid #ccc;border-radius:4px;cursor:pointer;transition:border-color .2s}.editor__palette-item--selected{border-color:#000;border-width:2px}.editor__canvas-container{width:min(80vw,80vh,1000px);height:min(80vw,80vh,1000px);border:2px solid #333;position:relative;flex-shrink:0}.editor__canvas,.editor__canvas-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:block}.editor__canvas-overlay{pointer-events:none;z-index:10}