.svg-page[data-v-0b23325e]{display:flex;flex-direction:column;min-height:100vh;background-color:#f5f7fa}.header[data-v-0b23325e]{display:flex;justify-content:space-between;align-items:center;padding:0 20px;height:60px;background-color:#fff;box-shadow:0 1px 4px rgba(0,0,0,.1);border-bottom:1px solid #ebeef5;position:sticky;top:0;z-index:10}.logo[data-v-0b23325e]{display:flex;align-items:center;gap:16px}.back-link[data-v-0b23325e]{font-size:14px;color:#606266;text-decoration:none;display:flex;align-items:center;gap:4px}.back-link[data-v-0b23325e]:hover{color:#409eff}.title[data-v-0b23325e]{font-size:20px;font-weight:700;color:#303133;margin:0}.main-container[data-v-0b23325e]{display:flex;flex:1;padding:20px;gap:20px;max-height:calc(100vh - 60px);overflow:hidden}.left-panel[data-v-0b23325e]{width:40%;display:flex;flex-direction:column;gap:20px;overflow-y:auto;padding-right:10px;max-height:100%;min-height:0}.section-title[data-v-0b23325e]{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:16px;font-weight:700;color:#303133}.svg-type-selector[data-v-0b23325e]{background-color:#fff;padding:20px;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.1)}.svg-tags[data-v-0b23325e]{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}.svg-tag[data-v-0b23325e]{cursor:pointer;margin-right:5px;margin-bottom:5px;transition:all .3s}.svg-tag[data-v-0b23325e]:hover{transform:translateY(-2px)}.ai-generation-section[data-v-0b23325e]{background-color:#fff;padding:20px;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.1)}.ai-input[data-v-0b23325e]{margin-top:10px}.size-inputs[data-v-0b23325e]{display:flex;align-items:center;gap:10px;margin:10px 0}.size-separator[data-v-0b23325e]{color:#909399;font-size:16px}.ai-actions[data-v-0b23325e]{margin-top:10px;display:flex;justify-content:center}.code-editor-section[data-v-0b23325e]{background-color:#fff;padding:20px;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.1);flex:1;display:flex;flex-direction:column}.code-actions[data-v-0b23325e]{display:flex;gap:10px}.code-editor[data-v-0b23325e]{margin-top:10px;flex:1}.code-editor[data-v-0b23325e] .el-textarea__inner{font-family:Courier New,monospace;font-size:14px;line-height:1.5}.right-panel[data-v-0b23325e]{width:60%;background-color:#fff;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.1);display:flex;flex-direction:column;max-height:100%;overflow:hidden}.preview-header[data-v-0b23325e]{padding:15px 20px;border-bottom:1px solid #ebeef5;display:flex;justify-content:space-between;align-items:center;font-size:16px;font-weight:700;color:#303133;background-color:#fff;position:sticky;top:0;z-index:5;flex-shrink:0}.preview-actions[data-v-0b23325e]{display:flex;gap:10px}.svg-container[data-v-0b23325e]{flex:1;overflow:auto;padding:20px;display:flex;justify-content:center;align-items:flex-start;position:relative;min-height:0}.empty-svg[data-v-0b23325e]{text-align:center;color:#909399}.empty-svg i[data-v-0b23325e]{font-size:48px;margin-bottom:10px}.error-svg[data-v-0b23325e]{text-align:center;color:#f56c6c}.error-svg i[data-v-0b23325e]{font-size:48px;margin-bottom:10px}.svg-rendered[data-v-0b23325e]{width:100%;min-height:100%;display:flex;justify-content:center;align-items:flex-start;padding:10px 0}.svg-rendered[data-v-0b23325e] svg{max-width:100%;height:auto;display:block}.generation-progress[data-v-0b23325e]{text-align:center;padding:20px 0}.progress-icon[data-v-0b23325e]{font-size:40px;color:#409eff;margin-bottom:20px}.progress-message[data-v-0b23325e]{margin-top:15px;color:#606266}.websocket-status[data-v-0b23325e]{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:12px}.status-indicator[data-v-0b23325e]{display:flex;align-items:center;gap:6px;font-size:12px;padding:4px 12px;border-radius:12px;background:rgba(245,108,108,.1);color:#f56c6c;transition:all .3s}.status-indicator.connected[data-v-0b23325e]{background:rgba(103,194,58,.1);color:#67c23a}.reconnect-btn[data-v-0b23325e]{color:#409eff;font-size:12px;padding:2px 6px}.status-tip[data-v-0b23325e]{font-size:12px;color:#909399;display:flex;align-items:center;gap:4px}.svg-rendered[data-v-0b23325e] text{cursor:text;transition:background-color .2s}.svg-rendered[data-v-0b23325e] text:hover{fill:#409eff}.svg-rendered[data-v-0b23325e] text[contenteditable=true]:focus{outline:none;background-color:rgba(64,158,255,.1)}@media (max-width:992px){.main-container[data-v-0b23325e]{flex-direction:column}.left-panel[data-v-0b23325e],.right-panel[data-v-0b23325e]{width:100%;max-height:none}.left-panel[data-v-0b23325e]{max-height:none;overflow:visible}.right-panel[data-v-0b23325e]{height:500px}}@media (max-width:768px){.header[data-v-0b23325e]{padding:0 15px;height:50px}.title[data-v-0b23325e]{font-size:18px}.main-container[data-v-0b23325e]{padding:10px}.code-actions[data-v-0b23325e]{flex-wrap:wrap}}