:root{--header-height: 56px;--sider-width: 240px;--preview-width: 360px;--border-color: #f0f0f0;--bg-light: #fafafa;--bg-white: #ffffff;--primary-color: #1890ff;--success-color: #52c41a;--warning-color: #faad14;--error-color: #ff4d4f;--text-color: rgba(0, 0, 0, .85);--text-secondary: rgba(0, 0, 0, .45)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}.app-layout{height:100vh;width:100vw}.app-header{display:flex;align-items:center;height:var(--header-height);padding:0;background:var(--bg-white);border-bottom:1px solid var(--border-color);box-shadow:0 2px 8px #0000000f}.app-body{height:calc(100vh - var(--header-height))}.app-sider{border-right:1px solid var(--border-color);overflow:hidden}.app-content{background:var(--bg-light);overflow:hidden}.app-preview-sider{border-left:1px solid var(--border-color);overflow:hidden}.header-container{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;padding:0 16px}.header-left{display:flex;align-items:center;gap:8px}.app-title{font-size:18px;color:var(--primary-color)}.modified-indicator{font-size:12px}.header-center,.header-right{display:flex;align-items:center}.sidebar-container{height:100%;overflow-y:auto;padding:8px 0}.sidebar-header{padding:8px 16px;border-bottom:1px solid var(--border-color)}.sidebar-hint{display:block;font-size:12px;margin-top:4px}.sidebar-collapsed{display:flex;flex-direction:column;align-items:center;padding:16px 0}.sidebar-collapsed-icon{font-size:20px;color:var(--text-secondary)}.draggable-element{display:flex;align-items:center;gap:8px;padding:8px 12px;margin:4px 8px;background:var(--bg-white);border:1px solid var(--border-color);border-radius:6px;cursor:grab;transition:all .2s}.draggable-element:hover{border-color:var(--primary-color);box-shadow:0 2px 8px #1890ff26}.draggable-element.dragging{opacity:.5;cursor:grabbing}.element-label{font-size:13px}.drag-overlay-item{padding:8px 16px;background:var(--primary-color);color:#fff;border-radius:6px;box-shadow:0 4px 12px #00000026;font-weight:500}.tree-container{height:100%;overflow:auto;padding:8px;background:var(--bg-white);border-radius:8px;border:2px solid transparent;transition:border-color .2s}.tree-container.tree-drop-active{border-color:var(--primary-color);background:#1890ff05}.tree-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:8px;border-bottom:1px solid var(--border-color)}.tree-empty-state{display:flex;align-items:center;justify-content:center;height:100%;padding:24px}.tree-node-title{display:flex;align-items:center;gap:8px}.tree-node-tag{font-size:11px;line-height:1.4}.tree-node-summary{font-size:12px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.csl-tree .ant-tree-treenode{padding:2px 0}.csl-tree .ant-tree-node-content-wrapper{border-radius:4px}.csl-tree .ant-tree-node-content-wrapper:hover{background:#1890ff0f}.csl-tree .ant-tree-node-selected .ant-tree-node-content-wrapper{background:#1890ff1a}.property-editor{height:100%;overflow-y:auto;padding:8px;background:var(--bg-white)}.property-editor-empty{display:flex;align-items:center;justify-content:center;height:100%;padding:24px;background:var(--bg-white)}.property-editor-header{margin-bottom:12px}.node-info{display:flex;align-items:center;justify-content:space-between}.node-type-tag{font-size:13px;font-weight:500}.node-path{font-size:11px;max-width:180px;overflow:hidden;text-overflow:ellipsis}.validation-alert{margin-bottom:12px}.validation-errors,.validation-warnings{margin:0;padding-left:16px}.attributes-section{padding:8px 0}.attribute-form-item{margin-bottom:12px}.attribute-field{background:var(--bg-light);padding:8px 12px;border-radius:6px}.attribute-field-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.attribute-name{font-size:13px}.attribute-help{color:var(--text-secondary);cursor:help}.attribute-remove{color:var(--error-color);cursor:pointer;opacity:.6;transition:opacity .2s}.attribute-remove:hover{opacity:1}.attribute-default{font-size:11px;margin-top:4px;display:block}.add-attribute-btn{margin-top:12px}.children-section{padding:8px 0}.children-list{display:flex;flex-wrap:wrap;gap:6px}.child-tag{font-size:12px}.preview-panel{height:100%;overflow:hidden;display:flex;flex-direction:column;background:var(--bg-white)}.preview-panel-empty{display:flex;align-items:center;justify-content:center;height:100%;padding:24px;background:var(--bg-white)}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border-color)}.preview-tabs{flex:1;overflow:hidden}.preview-tabs .ant-tabs-content{height:100%;overflow-y:auto;padding:12px}.citations-preview{display:flex;flex-direction:column;gap:8px}.citation-item{background:var(--bg-light)}.citation-content{font-size:14px;line-height:1.6}.bibliography-preview{display:flex;flex-direction:column;gap:12px}.bibliography-entry{padding:8px 12px;background:var(--bg-light);border-radius:6px;font-size:14px;line-height:1.6}.example-data{display:flex;flex-direction:column;gap:8px}.example-hint{margin-bottom:8px}.example-item{background:var(--bg-light)}.visual-editor{height:100%;display:flex;flex-direction:column}.editor-main{display:flex;flex:1;overflow:hidden;gap:12px;padding:12px}.editor-tree-panel{flex:1;min-width:300px;overflow:hidden;background:var(--bg-white);border-radius:8px;box-shadow:0 1px 4px #0000000f}.editor-property-panel{width:320px;min-width:280px;overflow:hidden;background:var(--bg-white);border-radius:8px;box-shadow:0 1px 4px #0000000f}.element-palette{padding:12px}.element-palette-header{margin-bottom:12px}.element-category-section{margin-bottom:16px}.category-title{font-size:13px;margin-bottom:8px;color:var(--text-secondary)}.element-card{cursor:grab;transition:all .2s}.element-card:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 12px #1890ff26}.element-card.dragging{opacity:.5;cursor:grabbing}.element-card-content{display:flex;flex-direction:column;align-items:center;gap:4px}.element-card-label{font-size:11px;text-align:center}@media(max-width:1200px){.editor-property-panel{width:280px}}@media(max-width:992px){.editor-main{flex-direction:column}.editor-tree-panel,.editor-property-panel{width:100%;min-width:unset}.editor-tree-panel{flex:1}.editor-property-panel{height:300px}}