@import "https://registry.npmmirror.com/lxgw-wenkai-screen-web/1.520.0/files/lxgwwenkaigbscreen/result.css";:root{--bg-color:#f7f8fa;--header-bg-color:#fff;--card-bg-color:#fff;--border-color:#e5e7eb;--text-color:#1f2937;--text-color-secondary:#6b7280;--primary-color:#4f46e5;--primary-color-light:#818cf8;--font-family-sans:"LXGW Wenkai GB Screen",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-family-mono:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New","LXGW Wenkai GB Screen",monospace}body.dark{--bg-color:#121212;--header-bg-color:#1e1e1e;--card-bg-color:#1e1e1e;--border-color:#333;--text-color:#e0e0e0;--text-color-secondary:#a0a0a0;--primary-color:#bb86fc;--primary-color-light:#d1c4e9}.el-card{transition:background-color .2s,border-color .2s,box-shadow .2s!important}.theme-transitioning .cm-editor,.theme-transitioning .cm-editor *{transition:background-color .2s,color .2s,border-color .2s,opacity .2s!important}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-family-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;transition:background-color .2s,color .2s}.common-layout{flex-direction:column;min-height:100vh;display:flex}.header{background-color:var(--header-bg-color);border-bottom:1px solid var(--border-color);align-items:center;height:60px;padding:0 24px;display:flex}.header-content{justify-content:space-between;align-items:center;width:100%;display:flex}.logo{color:var(--primary-color);align-items:center;gap:12px;display:flex}.title{color:var(--text-color);font-size:1.25rem;font-weight:600}.theme-switcher-btn.el-button{color:var(--text-color-secondary);background:0 0;border:none;border-radius:50%;padding:8px;transition:background-color .3s}.theme-switcher-btn.el-button:hover{color:var(--primary-color);border:none;background-color:#ffffff1a!important}body.light .theme-switcher-btn.el-button:hover{background-color:#0000000d!important}.language-icon-trigger{cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:background-color .3s;display:flex}.language-icon-trigger:hover{background-color:#ffffff1a}body.light .language-icon-trigger:hover{background-color:#f3f4f6}.main-content{flex-direction:column;flex-grow:1;gap:20px;padding:20px;display:flex}.control-panel-card{--el-card-padding:16px;background-color:var(--card-bg-color);border:none;transition:background-color .2s,box-shadow .2s}.toolbar{align-items:center;gap:20px;width:100%;display:flex}.sort-controls,.array-sort-controls{align-items:center;gap:12px;display:flex}.control-label{color:var(--text-color-secondary);white-space:nowrap;font-size:14px}.array-sort-controls{flex-grow:1}.key-selection-area{border:1px solid var(--border-color);border-radius:6px;flex-wrap:nowrap;flex-grow:1;justify-content:space-between;align-items:center;gap:8px;min-height:32px;padding:5px 10px;transition:border-color .2s,background-color .2s;display:flex}.draggable-zone{flex-wrap:wrap;gap:8px;display:flex}.unselected-keys-container{flex-grow:1;justify-content:flex-end;display:flex}.unselected-keys-zone{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.key-tag{cursor:pointer;transition:all .2s,background-color .2s,border-color .2s}.key-tag.selected{cursor:grab}body.dark .el-tag--primary{--el-tag-bg-color:#13ce66;--el-tag-border-color:#13ce66;--el-tag-text-color:#fff;--el-tag-hover-color:#16a34a}body.dark .el-tag--info{--el-tag-bg-color:#333;--el-tag-border-color:#555;--el-tag-text-color:#ccc}body.dark .el-tag--info:hover{background-color:#444}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#bbb}body.dark ::-webkit-scrollbar-thumb{background:#444}body.dark ::-webkit-scrollbar-thumb:hover{background:#555}.ghost{opacity:.5;background:#3a3a3a}.list-right-move,.list-right-enter-active,.list-right-leave-active{transition:all .4s}.list-right-enter-from,.list-right-leave-to{opacity:0;transform:translateY(15px)}.list-right-leave-active{position:absolute}.sort-order-button.el-button{color:#fff;background:0 0;border:none;border-radius:50%;height:auto;min-height:auto;margin-left:8px;padding:4px;font-size:14px;transition:all .3s}.sort-order-button.el-button:hover{border:none;background-color:#fff3!important}body.dark .sort-order-button.el-button{color:#fff}body.dark .sort-order-button.el-button:hover{color:#fff;background-color:#fff3!important}body.light .sort-order-button.el-button{color:var(--primary-color)}body.light .sort-order-button.el-button:hover{color:var(--primary-color);background-color:#0000000d!important}.no-keys-placeholder{color:var(--text-color-secondary);font-size:14px}.action-buttons{gap:12px;margin-left:auto;display:flex}.sort-button,.clear-button{min-width:100px}.editor-grid{flex-grow:1;grid-template-columns:1fr 1fr;gap:20px;min-height:0;display:grid}.editor-card{background-color:var(--card-bg-color);border:none;flex-direction:column;transition:box-shadow .3s,border-color .3s,background-color .2s;display:flex}.editor-card:hover{box-shadow:0 4px 12px #00000014}body.dark .editor-card:hover{box-shadow:0 4px 12px #ffffff14}.editor-card .el-card__header{border-bottom:1px solid var(--border-color);padding:12px 16px}.card-header{justify-content:space-between;align-items:center;display:flex}.card-title{align-items:center;gap:8px;font-size:14px;font-weight:600;display:flex}.input-card .card-title{color:#16a34a}.output-card .card-title{color:#ea580c}body.dark .input-card .card-title{color:#4ade80}body.dark .output-card .card-title{color:#fb923c}.editor-icon{color:currentColor}.header-actions{align-items:center;gap:4px;display:flex}.header-action-btn{color:var(--text-color-secondary);background:0 0;border:none;border-radius:50%;padding:8px;transition:background-color .3s}.header-action-btn.el-button:hover{color:var(--primary-color);border:none;background-color:#ffffff1a!important}body.light .header-action-btn.el-button:hover{background-color:#0000000d!important}.editor-card .el-card__body{flex-direction:column;flex-grow:1;padding:0;display:flex;overflow:auto}.editor-wrapper{flex-grow:1;width:100%;height:calc(100vh - 280px);min-height:300px}.theme-transitioning,.theme-transitioning *{transition:background-color .2s,color .2s,border-color .2s!important}.el-divider--vertical{border-left:1px solid var(--border-color);height:2.5em;transition:border-color .2s}.el-tag{--el-tag-font-size:14px;height:28px;transition:background-color .2s,border-color .2s,color .2s}.el-button{--el-button-font-weight:500;font-family:var(--font-family-sans);border-radius:6px;transition:background-color .2s,border-color .2s,color .2s}body.dark .el-button.is-text:hover{border:none;background-color:#ffffff1a!important}body.light .el-button.is-text:hover{background-color:#0000000d!important}.cm-editor{width:100%;height:100%;font-size:14px}.cm-scroller{font-family:var(--font-family-mono);line-height:1.6}.cm-content{font-family:var(--font-family-mono);padding:8px 0}.cm-gutterElement,.cm-placeholder{color:var(--text-color-secondary)!important}.cm-line{padding:0 16px}.cm-gutters{color:var(--text-color-secondary)!important}.cm-editor .cm-selectionBackground,.cm-editor .cm-content ::selection{background-color:var(--primary-color)!important;color:#fff!important}.cm-editor.cm-focused .cm-selectionBackground,.cm-editor.cm-focused .cm-content ::selection{opacity:.8;background-color:var(--primary-color)!important;color:#fff!important}@media (max-width:768px){.main-content{flex-grow:1}.toolbar{flex-direction:column;align-items:stretch;gap:16px}.toolbar .el-divider--vertical{display:none}.array-sort-controls{flex-direction:column;align-items:flex-start;width:100%}.key-selection-area{width:100%}.editor-grid{grid-template-columns:1fr;min-height:auto}.editor-wrapper{height:60vh;min-height:auto}}