.fp-editor{color:#1e1e1e;background:#fff;grid-template:"top top top"48px"opts opts opts""tools canvas props"1fr/48px 1fr 240px;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-size:13px;line-height:1.4;display:grid}.fp-editor *,.fp-editor :after,.fp-editor :before{box-sizing:border-box}.fp-editor button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}.fp-editor button:disabled{cursor:default}.fp-canvas-mount{grid-area:canvas;position:relative;overflow:hidden}.fp-canvas-view{background-color:#e5e5e5;grid-area:canvas}.fp-topbar{background:#fff;border-bottom:1px solid #e5e5e5;grid-area:top;justify-content:space-between;align-items:center;gap:12px;padding:0 12px;display:flex}.fp-topbar-name{text-overflow:ellipsis;white-space:nowrap;color:#333;flex:1 1 0;min-width:0;overflow:hidden}.fp-topbar-actions,.fp-topbar-history{align-items:center;gap:4px;display:flex}.fp-topbar-btn{color:#333;border-radius:4px;justify-content:center;align-items:center;width:28px;height:28px;display:inline-flex}.fp-topbar-btn:hover:not(:disabled){background:#f0f0f0}.fp-topbar-btn:disabled{opacity:.5}.fp-topbar-zoom-value{text-align:center;color:#333;border-radius:4px;min-width:48px;height:28px;padding:0 6px;font-size:12px}.fp-topbar-zoom-value:hover{background:#f0f0f0}.fp-topbar-separator{background:#e0e0e0;width:1px;height:16px;margin:0 4px}.fp-option-bar{background:#fff;border-bottom:1px solid #e5e5e5;grid-area:opts;align-items:center;gap:8px;min-height:40px;padding:6px 12px;display:flex}.fp-option-group{gap:4px}.fp-option-btn,.fp-option-group{align-items:center;display:inline-flex}.fp-option-btn{color:#333;background:#fff;border:1px solid #ddd;border-radius:4px;justify-content:center;height:28px;padding:0 10px;font-size:12px}.fp-option-btn:hover{background:#f5f5f5}.fp-option-btn-active,.fp-option-btn-active:hover{color:#0d99ff;background:#0d99ff14;border-color:#0d99ff}.fp-toolbar{background:#fff;border-right:1px solid #e5e5e5;flex-direction:column;grid-area:tools;gap:2px;padding:4px 0}.fp-tool-btn,.fp-toolbar{align-items:center;display:flex}.fp-tool-btn{color:#333;border-radius:6px;justify-content:center;width:40px;height:40px}.fp-tool-btn:hover{background:#f0f0f0}.fp-tool-btn-active,.fp-tool-btn-active:hover{color:#0d99ff;background:#0d99ff1f}.fp-tool-btn-label{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.fp-side-panel{background:#fff;border-left:1px solid #e5e5e5;flex-direction:column;grid-area:props;min-height:0;display:flex}.fp-side-panel .fp-layers-panel,.fp-side-panel .fp-props-panel{grid-area:unset;border-left:none}.fp-side-panel .fp-props-panel{flex:auto;min-height:0}.fp-props-panel{background:#fff;border-left:1px solid #e5e5e5;flex-direction:column;grid-area:props;gap:12px;padding:12px;font-size:12px;display:flex;overflow-y:auto}.fp-props-canvas,.fp-props-multi,.fp-props-object{flex-direction:column;gap:10px;display:flex}.fp-props-readonly{justify-content:space-between;align-items:center;gap:8px;display:flex}.fp-color-field-label,.fp-number-field-label,.fp-props-readonly-label,.fp-text-field-label{color:#666}.fp-props-multi-count,.fp-props-readonly-value{color:#1e1e1e}.fp-color-field{flex-direction:column;gap:6px;display:flex}.fp-color-field-value{color:#888;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px}.fp-number-field,.fp-text-field{flex-direction:column;gap:4px;display:flex}.fp-number-field input{width:100%;height:28px;font:inherit;color:inherit;background:#fff;border:1px solid #ddd;border-radius:4px;padding:0 8px}.fp-number-field input:focus{border-color:#0d99ff;outline:none;box-shadow:0 0 0 1px #0d99ff}.fp-text-field textarea{min-height:64px;font:inherit;color:inherit;resize:vertical;background:#fff;border:1px solid #ddd;border-radius:4px;padding:6px 8px}.fp-text-field textarea:focus{border-color:#0d99ff;outline:none;box-shadow:0 0 0 1px #0d99ff}.fp-props-group{flex-direction:column;gap:6px;display:flex}.fp-props-group-label{color:#666}.fp-props-style-toggles{flex-wrap:wrap;gap:6px;display:flex}.fp-props-align-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.fp-props-align-grid .fp-props-toggle{padding:0 4px}.fp-props-align-grid .fp-props-toggle:disabled{opacity:.5}.fp-props-toggle{color:#333;background:#fff;border:1px solid #ddd;border-radius:4px;height:26px;padding:0 10px;font-size:12px}.fp-props-toggle:hover{background:#f5f5f5}.fp-props-toggle-active,.fp-props-toggle-active:hover{color:#0d99ff;background:#0d99ff14;border-color:#0d99ff}.fp-props-delete{color:#d32f2f;background:#fff;border:1px solid #f0c0c0;border-radius:4px;height:30px;padding:0 12px;font-size:12px}.fp-props-delete:hover{background:#fdecec}.fp-props-locked-hint{color:#8a6d1a;background:#fff7e0;border-radius:4px;padding:6px 8px}.fp-filter-field{flex-direction:column;gap:4px;display:flex}.fp-filter-field-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.fp-filter-field-label{color:#666}.fp-filter-field-value{color:#888;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px}.fp-filter-field input[type=range]{accent-color:#0d99ff;width:100%;margin:0}.fp-color-palette{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.fp-swatch{cursor:pointer;border:1px solid #00000040;border-radius:4px;width:20px;height:20px;padding:0}.fp-swatch:hover{box-shadow:0 0 0 2px #0000001f}.fp-swatch-active,.fp-swatch-active:hover{box-shadow:0 0 0 2px #fff,0 0 0 4px #0d99ff}.fp-color-custom{cursor:pointer;background:0 0;border:1px solid #00000040;border-radius:4px;width:20px;height:20px;padding:0}.fp-color-custom::-webkit-color-swatch-wrapper{padding:0}.fp-color-custom::-webkit-color-swatch{border:none;border-radius:3px}.fp-color-custom::-moz-color-swatch{border:none;border-radius:3px}.fp-layers-panel{background:#fff;border-bottom:1px solid #e5e5e5;border-left:1px solid #e5e5e5;flex-direction:column;flex:0 auto;grid-area:props;min-height:0;max-height:45%;font-size:12px;display:flex}.fp-layers-header{color:#666;border-bottom:1px solid #f0f0f0;flex:none;padding:8px 12px}.fp-layers-empty{color:#999;text-align:center;padding:16px 12px}.fp-layers-list{flex:auto;min-height:0;margin:0;padding:4px;list-style:none;overflow-y:auto}.fp-layer-item{color:#333;cursor:default;-webkit-user-select:none;user-select:none;border-top:2px solid #0000;border-bottom:2px solid #0000;border-radius:4px;align-items:center;gap:6px;height:28px;padding:0 6px;display:flex}.fp-layer-item:hover{background:#f5f5f5}.fp-layer-item-selected,.fp-layer-item-selected:hover{color:#0d99ff;background:#0d99ff1f}.fp-layer-item-hidden .fp-layer-item-icon,.fp-layer-item-hidden .fp-layer-item-name{opacity:.4}.fp-layer-item-drop-above{border-top-color:#0d99ff}.fp-layer-item-drop-below{border-bottom-color:#0d99ff}.fp-layer-item-icon{color:#666;flex:none}.fp-layer-item-selected .fp-layer-item-icon{color:inherit}.fp-layer-item-name{text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;min-width:0;overflow:hidden}.fp-layer-btn{color:#666;border-radius:4px;flex:none;justify-content:center;align-items:center;width:22px;height:22px;display:inline-flex}.fp-layer-btn:hover{background:#ececec}.fp-layer-btn-active,.fp-layer-btn-active:hover{color:#0d99ff}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}.demo-shell{height:100%;position:relative}.demo-upload{z-index:10;cursor:pointer;background:#fff;border:1px solid #d0d0d0;border-radius:4px;padding:4px 12px;position:absolute;top:8px;right:248px}.demo-upload:hover{background:#f0f0f0}