:root{--root-bg-primary:#fff;--root-bg-secondary:#fafbfc;--root-bg-tertiary:#f3f4f6;--root-border-color:#e1e8ed;--root-text-primary:#1f2937;--root-text-secondary:#6b7280;--root-color-primary:#06f;--root-color-primary-hover:#0052cc;--root-color-success:#10b981;--root-color-error:#ef4444;--root-color-warning:#f59e0b;--syntax-key:#06f;--syntax-string:#10b981;--syntax-number:#f59e0b;--syntax-boolean:#8b5cf6;--syntax-null:#6b7280;--header-height:60px;--toolbar-height:50px;--status-height:32px;--resizer-width:16px;--resizer-bar-width:6px;--min-panel-width:300px;--transition-fast:0.2s;--transition-normal:0.3s;--shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1)}[data-theme=dark]{--root-bg-primary:#1e1e1e;--root-bg-secondary:#252526;--root-bg-tertiary:#2d2d30;--root-border-color:#3e3e42;--root-text-primary:#e4e4e7;--root-text-secondary:#a1a1aa;--root-color-primary:#3b82f6;--root-color-primary-hover:#2563eb;--syntax-key:#4fc3f7;--syntax-string:#66bb6a;--syntax-number:#ffb74d;--syntax-boolean:#ba68c8;--syntax-null:#9e9e9e}.btn-icon{min-width:36px;padding:6px 10px}.btn-toolbar-icon{min-width:30px}.global-toolbar{background:var(--root-bg-secondary);border-bottom:1px solid var(--root-border-color);flex-wrap:wrap;gap:32px;height:var(--toolbar-height);padding:0 24px}.global-toolbar,.toolbar-group{align-items:center;display:flex}.toolbar-group{gap:8px}.toolbar-label{color:var(--root-text-secondary);font-size:1rem;font-weight:500}.tab-size{width:4rem}.main-container{display:flex;height:calc(100vh - var(--toolbar-height) - 115px);position:relative}.panel{background:var(--root-bg-primary);display:flex;flex-direction:column;overflow:hidden}.panel-left{border-right:1px solid var(--root-border-color);width:50%}.panel-right{width:50%}.panel.fullscreen{width:100%!important}.container-fluid:has(.panel.fullscreen) .floating-format-btn{display:none!important}.panel.fullscreen~.floating-exit-btn,.panel.fullscreen~.floating-format-btn{display:none!important}.panel-toolbar{align-items:center;background:var(--root-bg-secondary);border-bottom:1px solid var(--root-border-color);display:flex;flex-wrap:wrap;gap:8px;height:var(--toolbar-height);padding:0 16px}.panel-toolbar .btn{font-size:12px;padding:5px 10px}body,html{height:100%;margin:0}.editor-container{flex:1;overflow:auto;position:relative}.cm-editor{font-size:14px;height:100%}.cm-scroller{font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;overflow-x:auto!important;overflow-y:scroll!important}.cm-content,.cm-gutter{min-height:100%!important}.cm-editor.cm-focused{outline:none}#editorLeft,#editorRight{height:100%}.cm-editor:not(.cm-dark) .cm-string{color:var(--syntax-string)!important}.cm-editor:not(.cm-dark) .cm-number{color:var(--syntax-number)!important}.cm-editor:not(.cm-dark) .cm-bool{color:var(--syntax-boolean)!important}.cm-editor:not(.cm-dark) .cm-null{color:var(--syntax-null)!important}.cm-editor:not(.cm-dark) .cm-property{color:var(--syntax-key)!important;font-weight:600}.cm-editor.cm-dark .cm-string{color:var(--syntax-string)!important}.cm-editor.cm-dark .cm-number{color:var(--syntax-number)!important}.cm-editor.cm-dark .cm-bool{color:var(--syntax-boolean)!important}.cm-editor.cm-dark .cm-null{color:var(--syntax-null)!important}.cm-editor.cm-dark .cm-property{color:var(--syntax-key)!important;font-weight:600}.cm-foldGutter .cm-gutterElement{color:var(--root-color-primary)!important;cursor:pointer;font-size:20px!important;padding:0 4px}.cm-foldGutter .cm-gutterElement:hover{color:var(--root-color-primary-hover)!important}.cm-foldGutter span{display:block;margin-top:-10px}.error-layer{background:linear-gradient(135deg,#fef2f2,#fee2e2);border-radius:8px 8px 0 0;border-top:3px solid var(--root-color-error);bottom:0;box-shadow:0 -4px 12px rgba(239,68,68,.15);cursor:pointer;left:0;max-height:300px;overflow-y:auto;padding:20px;pointer-events:auto;position:absolute;right:0;transform:translateY(100%);transition:transform var(--transition-normal);z-index:5}.error-layer:hover{background:linear-gradient(135deg,#fee2e2,#fecaca)}[data-theme=dark] .error-layer{background:linear-gradient(135deg,#3f1f1f,#2d1414);box-shadow:0 -4px 12px rgba(239,68,68,.25)}[data-theme=dark] .error-layer:hover{background:linear-gradient(135deg,#4d2626,#3f1f1f)}.error-layer.show{transform:translateY(0)}.error-layer-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:12px}.error-layer-title{align-items:center;color:var(--root-color-error);display:flex;font-size:15px;font-weight:700;gap:8px}.error-layer-title:before{content:"⚠";font-size:18px}.error-layer-close{background:none;border:none;color:var(--root-text-secondary);cursor:pointer;font-size:22px;line-height:1;padding:0;transition:color var(--transition-fast)}.error-layer-close:hover{color:var(--root-color-error)}.error-layer-content{color:var(--root-text-primary);font-size:13px;line-height:1.6}.status-bar{background:var(--root-bg-secondary);border-top:1px solid var(--root-border-color);color:var(--root-text-secondary);font-size:12px;gap:16px;height:var(--status-height);padding:0 16px}.status-bar,.status-item{align-items:center;display:flex}.status-item{gap:6px}.status-icon{background:var(--root-text-secondary);border-radius:50%;height:8px;width:8px}.status-icon.success{background:var(--root-color-success)}.status-icon.error{background:var(--root-color-error)}.resizer{align-items:center;background:var(--root-bg-secondary);border-left:1px solid var(--root-border-color);border-right:1px solid var(--root-border-color);cursor:col-resize;display:flex;justify-content:center;position:relative;transition:background var(--transition-fast);width:var(--resizer-width);z-index:20}.resizer:hover{background:var(--root-bg-tertiary)}.resizer:before{background:var(--root-border-color);border-radius:3px;content:"";height:40px;transition:background var(--transition-fast);width:var(--resizer-bar-width)}.resizer.dragging,.resizer:hover:before{background:var(--root-color-primary)}.resizer.dragging{opacity:.5}.resizer.hidden{display:none}.container-fluid{max-width:100%!important;width:100%!important}.floating-format-btn{background:var(--root-color-primary);border:none;border-radius:24px;box-shadow:var(--shadow-lg);color:#fff;cursor:pointer;font-size:15px;font-weight:600;left:50%;padding:8px 16px;pointer-events:auto;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:100}@media (max-width:768px){.floating-format-btn{left:60px;transform:translateY(-50%)}}.floating-format-btn:active,.floating-format-btn:hover{background:var(--root-color-primary-hover)}.floating-exit-btn{background:#ef4444;border:none;border-radius:20px;box-shadow:var(--shadow-lg);color:#fff;cursor:pointer;display:none;font-size:16px;font-weight:600;left:50%;padding:8px 16px;pointer-events:auto;position:absolute;top:calc(50% + 55px);transform:translateX(-50%);z-index:100}.floating-exit-btn:hover{background:#dc2626}.main-fullscreen .floating-exit-btn{display:block}.main-fullscreen #btnFullscreenLeft,.main-fullscreen #btnFullscreenRight{display:none}.favorite-list{list-style:none}.favorite-item{border:1px solid var(--root-border-color);border-radius:6px;cursor:pointer;margin-bottom:12px;padding:12px;transition:all var(--transition-fast)}.favorite-item:hover{background:var(--root-bg-secondary);border-color:var(--root-color-primary)}.favorite-item-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:4px}.favorite-item-title{color:var(--root-text-primary);font-size:14px;font-weight:600}.favorite-item-date{color:var(--root-text-secondary);font-size:12px}.favorite-item-actions{display:flex;gap:8px;margin-top:8px}.favorite-item-actions .btn{font-size:11px;padding:4px 8px}.tree-view{background:var(--root-bg-primary);color:var(--root-text-primary);font-family:Monaco,Menlo,monospace;font-size:13px;height:100%;line-height:1.4;overflow:auto;padding:24px}.tree-node{position:relative}.tree-node:before{background:var(--root-border-color);bottom:0;content:"";left:8px;position:absolute;top:0}.tree-label{align-items:center;border-radius:6px;cursor:pointer;display:inline-flex;gap:8px;transition:all var(--transition-fast);user-select:none}.tree-label:hover{box-shadow:var(--shadow-sm)}.tree-label:hover,.tree-toggle{background:var(--root-bg-secondary)}.tree-toggle{align-items:center;border-radius:4px;color:var(--root-text-secondary);cursor:pointer;display:inline-flex;font-size:14px;height:20px;justify-content:center;transition:all var(--transition-fast);width:20px}.tree-toggle:hover{background:var(--root-color-primary);color:#fff}.tree-key{font-size:14px;font-weight:400}.tree-key,[data-theme=dark] .tree-key{color:var(--syntax-key)}.tree-type{background:var(--root-bg-tertiary);border-radius:12px;color:var(--root-text-secondary);font-size:11px;padding:2px 8px}.tree-type,.tree-value{font-weight:500}.tree-value.string{color:var(--syntax-string)}.tree-value.number{color:var(--syntax-number)}.tree-value.boolean{color:var(--syntax-boolean)}.tree-value.null{color:var(--syntax-null)}[data-theme=dark] .tree-value.string{color:var(--syntax-string)}[data-theme=dark] .tree-value.number{color:var(--syntax-number)}[data-theme=dark] .tree-value.boolean{color:var(--syntax-boolean)}.tree-children{border-left:2px solid var(--root-border-color);display:none;margin-left:9px;margin-top:8px;padding-left:9px}.tree-children.expanded{display:block}.search-box{background:var(--root-bg-primary);border:1px solid var(--root-border-color);border-radius:6px;box-shadow:var(--shadow-lg);display:none;left:50%;min-width:400px;padding:36px 16px 16px;position:fixed;top:100px;transform:translateX(-50%);z-index:50}.search-box.show{display:block}.search-row{display:flex;gap:8px}.search-options,.search-row,.search-row:last-of-type{margin-bottom:8px}.search-options{color:var(--root-text-secondary);display:flex;font-size:12px;gap:12px}.search-option{align-items:center;cursor:pointer;display:flex;gap:4px}.search-count{font-size:1rem;text-align:right}.search-close,.search-count{color:var(--root-text-secondary)}.search-close{align-items:center;background:transparent;border:none;border-radius:4px;cursor:pointer;display:flex;font-size:24px;height:28px;justify-content:center;position:absolute;right:4px;top:4px;transition:all var(--transition-fast);width:28px;z-index:10}.search-close:hover{background:var(--root-bg-tertiary);color:var(--root-text-primary)}.toast{background:var(--root-color-primary);border-radius:8px;box-shadow:var(--shadow-lg);color:#fff;font-size:14px;font-weight:500;left:50%;max-width:90%;opacity:0;padding:12px 24px;pointer-events:none;position:fixed;text-align:center;top:80px;transform:translateX(-50%) translateY(-20px);transition:opacity var(--transition-fast),transform var(--transition-fast),visibility var(--transition-fast);visibility:hidden;z-index:10000}.toast.show{opacity:1;transform:translateX(-50%) translateY(0);visibility:visible}.toast.success{background:var(--root-color-success)}.toast.error{background:var(--root-color-error)}@media (max-width:768px){.btn-label{display:none}.btn-icon-mobile{display:inline}.header{height:50px;padding:0 12px}.header h1{font-size:16px}.global-toolbar{flex-wrap:wrap;gap:8px;height:auto;min-height:50px;padding:8px 12px}.toolbar-group{gap:6px}.toolbar-label{font-size:11px}.main-container{flex-direction:column;height:auto;min-height:calc(100vh - 100px)}.panel-left,.panel-right{border-bottom:1px solid var(--root-border-color);border-right:none;height:400px;min-height:300px;width:100%!important}.panel-right{border-bottom:none}.editor-container{overflow:auto;-webkit-overflow-scrolling:touch}.cm-scroller{overflow-x:auto!important;overflow-y:auto!important}.resizer{display:none!important}.panel-toolbar{flex-wrap:nowrap;gap:4px;height:45px;overflow-x:auto;overflow-y:hidden;padding:0 8px;white-space:nowrap;-webkit-overflow-scrolling:touch}.panel-toolbar .btn{font-size:11px;padding:5px 8px}.floating-format-btn{border-radius:16px;font-size:12px;padding:8px 16px}.floating-exit-btn{font-size:14px;left:60px!important;padding:6px 12px}.search-box{max-width:90%;min-width:90%;padding:40px 12px 12px;top:80px}.search-close{right:8px;top:8px}.search-input{font-size:14px}.modal{max-width:95%;width:95%}.modal-body,.modal-footer,.modal-header{padding:16px}#favoriteList{max-height:60vh!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}.cm-editor{font-size:12px!important}.tree-view{font-size:11px;overflow-y:auto;padding:16px;-webkit-overflow-scrolling:touch}.tree-node{padding-left:12px}.status-bar{font-size:11px;height:28px;padding:0 12px}}@media (min-width:769px){.btn-icon-mobile{display:none}.btn-label{display:inline}}.stats-grid{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.stat-card{background:var(--root-bg-secondary);border:1px solid var(--root-border-color);border-radius:6px;padding:16px}.stat-label{color:var(--root-text-secondary);font-size:.95rem;margin-bottom:4px}.stat-value{color:var(--root-text-primary);font-size:20px;font-weight:600}.hidden{display:none!important}.text-center{text-align:center}@media (max-width:768px){.global-toolbar{height:auto;padding:12px}.panel-toolbar{height:auto;padding:8px}.floating-format-btn{font-size:14px;padding:10px 24px}}