:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b)}#root{width:100%;height:100vh}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}::-webkit-scrollbar-thumb{background:#888;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}@media (prefers-color-scheme: dark){::-webkit-scrollbar-track{background:#2a2a2a}::-webkit-scrollbar-thumb{background:#555}::-webkit-scrollbar-thumb:hover{background:#777}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}*:focus{outline:2px solid #ffd700;outline-offset:2px}.skip-link{position:absolute;top:-40px;left:6px;background:#3b82f6;color:#fff;padding:8px;text-decoration:none;border-radius:4px;z-index:1000}.skip-link:focus{top:6px}.json-tree-visualizer{display:flex;flex-direction:column;height:100%;background:#1e1e1e;border-left:1px solid #3e3e42;overflow:hidden;min-width:300px}.visualizer-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#2d2d30;border-bottom:1px solid #3e3e42;flex-shrink:0}.visualizer-header h3{margin:0;color:#ccc;font-size:16px;font-weight:600}.visualizer-controls{display:flex;gap:8px;align-items:center}.visualizer-controls .control-btn{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#3c3c3c;color:#ccc;border:1px solid #5a5a5a;border-radius:4px;cursor:pointer;font-size:12px;font-weight:500;transition:all .2s ease;white-space:nowrap}.visualizer-controls .control-btn:hover{background:#4c4c4c;border-color:#6a6a6a;color:#fff}.visualizer-controls .close-btn{padding:4px 8px;font-size:16px;font-weight:700;min-width:24px;height:24px;display:flex;align-items:center;justify-content:center}.visualizer-content{flex:1;overflow-y:auto;padding:16px}.tree-container{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;line-height:1.4;padding:8px 0}.tree-node{margin:1px 0;position:relative}.tree-node:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:#3e3e42;opacity:.3}.tree-node{margin:2px 0}.node-header{display:flex;align-items:center;gap:6px;padding:4px 6px;border-radius:4px;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none}.node-header:hover{background-color:#2a2a2a}.node-header:active{background-color:#3a3a3a}.expand-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px;color:#888;flex-shrink:0;transition:transform .15s ease}.expand-icon svg{width:14px;height:14px}.node-label{color:#4ec9b0;font-weight:500;flex-shrink:0}.node-summary{color:#dcdcdc;font-size:12px;opacity:.8;margin-left:auto}.value-string{color:#ce9178}.value-number{color:#b5cea8}.value-boolean{color:#569cd6}.value-null{color:#569cd6;font-style:italic}.no-data{text-align:center;padding:40px 20px;color:#888}.no-data p{margin:8px 0;font-size:14px}.visualizer-content::-webkit-scrollbar{width:8px}.visualizer-content::-webkit-scrollbar-track{background:#2d2d30}.visualizer-content::-webkit-scrollbar-thumb{background:#5a5a5a;border-radius:4px}.visualizer-content::-webkit-scrollbar-thumb:hover{background:#6a6a6a}.json-tree-visualizer.light-theme{background:#fff;border-left-color:#e1e1e1}.json-tree-visualizer.light-theme .visualizer-header{background:#f3f3f3;border-bottom-color:#e1e1e1}.json-tree-visualizer.light-theme .visualizer-header h3{color:#333}.json-tree-visualizer.light-theme .visualizer-controls .control-btn{background:#f0f0f0;color:#333;border-color:#d1d1d1}.json-tree-visualizer.light-theme .visualizer-controls .control-btn:hover{background:#e0e0e0;border-color:#b0b0b0}.json-tree-visualizer.light-theme .node-header:hover{background-color:#f5f5f5}.json-tree-visualizer.light-theme .node-label{color:#06c}.json-tree-visualizer.light-theme .node-summary{color:#666}.json-tree-visualizer.light-theme .value-string{color:#a31515}.json-tree-visualizer.light-theme .value-number{color:#098658}.json-tree-visualizer.light-theme .value-boolean,.json-tree-visualizer.light-theme .value-null{color:#00f}.json-tree-visualizer.light-theme .no-data{color:#666}button:focus,button:focus-visible{outline:none!important}.json-editor{display:flex;flex-direction:column;height:100%;background:#1e1e1e;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px #0000004d}.editor-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#2d2d30;border-bottom:1px solid #3e3e42;flex-shrink:0}.editor-controls{display:flex;gap:8px;flex-wrap:wrap}.control-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#3c3c3c;color:#ccc;border:1px solid #5a5a5a;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease;white-space:nowrap;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.control-btn:hover:not(:disabled){background:#4c4c4c;border-color:#6a6a6a;color:#fff;transform:translateY(-1px)}.control-btn:active:not(:disabled){transform:translateY(0)}.control-btn:focus{outline:none!important}.control-btn:focus-visible{outline:none!important}.control-btn:disabled{opacity:.5;cursor:not-allowed}.control-btn.primary{background:#0078d4;border-color:#0078d4;color:#fff}.control-btn.primary:hover:not(:disabled){background:#106ebe;border-color:#106ebe}.control-btn.theme-toggle{background:#4a4a4a;border-color:#666;color:gold}.control-btn.theme-toggle:hover:not(:disabled){background:#5a5a5a;border-color:#777;color:#ffed4e}.editor-status-container{display:flex;align-items:center;gap:8px}.editor-status{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#2d2d30;border-radius:6px;border:1px solid #3e3e42;transition:all .2s ease}.tree-view-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:#3c3c3c;color:#ccc;border:1px solid #5a5a5a;border-radius:6px;cursor:pointer;transition:all .2s ease;flex-shrink:0}.tree-view-toggle:hover{background:#4c4c4c;border-color:#6a6a6a;color:#fff;transform:translateY(-1px)}.tree-view-toggle.active{background:#0078d4;border-color:#0078d4;color:#fff}.tree-view-toggle.active:hover{background:#106ebe;border-color:#106ebe}.editor-status.clickable{cursor:pointer;background:#3a3a3a;border-color:#5a5a5a}.editor-status.clickable:hover{background:#4a4a4a;border-color:#6a6a6a;transform:translateY(-1px)}.status-icon{width:16px;height:16px}.status-icon.success{color:#4caf50}.status-icon.error{color:#f44336}.status-icon.warning{color:#ff9800}.status-icon.info{color:#2196f3}.status-text{color:#ccc;font-size:13px;font-weight:500;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.editor-container{flex:1;min-height:0;position:relative;background:#1e1e1e;display:flex;flex-direction:row;overflow:hidden}.editor-container.with-tree-view{display:flex;flex-direction:row}.editor-container.with-tree-view .editor-main{flex:0 0 50%;min-width:0;border-right:1px solid #3e3e42}.panel-separator{width:6px;background:#3e3e42;cursor:col-resize;position:relative;flex-shrink:0;transition:background-color .2s ease}.panel-separator:hover{background:#5a5a5a}.panel-separator:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:2px;height:20px;background:#888;border-radius:1px}.panel-separator:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:2px;height:20px;background:#888;border-radius:1px;margin-top:8px}.json-tree-visualizer{flex:1;min-width:0;overflow:hidden}@media (max-width: 1200px){.editor-container.with-tree-view .editor-main{flex:0 0 70%!important}.json-tree-visualizer{flex:0 0 30%!important}}@media (max-width: 768px){.editor-container.with-tree-view{flex-direction:column}.editor-container.with-tree-view .editor-main{flex:0 0 70%!important}.json-tree-visualizer{flex:0 0 30%!important;min-width:100%}.panel-separator{display:none}}.editor-container .monaco-editor{height:100%!important;overflow:hidden!important}.editor-container>div{height:100%!important;overflow:hidden!important}.editor-main{flex:1;min-width:0;position:relative;overflow:hidden}.editor-container:empty:after{content:"Loading JSON Editor...";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ccc;font-size:16px}.validation-panel{background:#2d2d30;border-top:1px solid #3e3e42;max-height:150px;overflow-y:auto;flex-shrink:0;transition:max-height .3s ease}.validation-panel.collapsed{max-height:40px;overflow:hidden}.validation-header{display:flex;justify-content:space-between;align-items:center;padding:8px 20px;background:#252526;border-bottom:1px solid #3e3e42;cursor:pointer;-webkit-user-select:none;user-select:none}.validation-header:hover{background:#2a2a2b}.validation-header-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#ccc}.validation-toggle{color:#888;transition:transform .3s ease}.validation-toggle.expanded{transform:rotate(180deg)}.validation-content{max-height:100px;overflow-y:auto}.validation-section{padding:8px 20px}.validation-section:not(:last-child){border-bottom:1px solid #3e3e42}.validation-title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;margin-bottom:4px}.validation-title.error{color:#f44336}.validation-title.warning{color:#ff9800}.validation-list{list-style:none;padding:0;margin:0}.validation-item{padding:2px 0;font-size:11px;line-height:1.3}.validation-item.error{color:#ffcdd2}.validation-item.warning{color:#ffe0b2}.validation-panel:not(.collapsed){border-top-color:#f44336}.validation-panel.has-errors{border-top-color:#f44336;background:#2a1e1e}.validation-panel.has-errors .validation-header{background:#3a1e1e}@media (max-width: 1024px){.editor-header{flex-direction:column;gap:12px;align-items:stretch}.editor-controls{justify-content:center}.editor-status-container{align-self:center}}@media (max-width: 768px){.editor-header{padding:12px 16px}.editor-controls{gap:6px}.control-btn{padding:6px 10px;font-size:12px}.validation-section{padding:6px 16px}.validation-panel{max-height:120px}}@media (max-width: 480px){.editor-controls{flex-direction:row;flex-wrap:wrap;gap:4px;justify-content:center}.control-btn{justify-content:center;padding:4px 8px;font-size:11px;min-width:auto}}.clipboard-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.clipboard-dialog{background:#2d2d30;border:1px solid #3e3e42;border-radius:12px;box-shadow:0 20px 60px #00000080;max-width:500px;width:90%;max-height:80vh;overflow:hidden;animation:dialogSlideIn .3s ease-out}@keyframes dialogSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.clipboard-dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid #3e3e42}.clipboard-dialog-header h3{margin:0;color:#fff;font-size:18px;font-weight:600}.clipboard-dialog-close{background:none;border:none;color:#ccc;cursor:pointer;padding:4px;border-radius:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.clipboard-dialog-close:hover{background:#3c3c3c;color:#fff}.clipboard-dialog-content{padding:20px 24px 24px}.clipboard-dialog-content p{margin:0 0 20px;color:#ccc;font-size:14px;line-height:1.5}.clipboard-dialog-actions{display:flex;justify-content:flex-end;gap:12px}.clipboard-dialog-btn{padding:10px 20px;border:1px solid #5a5a5a;border-radius:6px;background:#3c3c3c;color:#ccc;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.clipboard-dialog-btn:hover{background:#4c4c4c;border-color:#6a6a6a;color:#fff}.clipboard-dialog-btn.primary{background:#0078d4;border-color:#0078d4;color:#fff}.clipboard-dialog-btn.primary:hover{background:#106ebe;border-color:#106ebe}@media (max-width: 768px){.clipboard-dialog{width:95%;margin:20px}.clipboard-dialog-header{padding:16px 20px 12px}.clipboard-dialog-content{padding:16px 20px 20px}.clipboard-dialog-header h3{font-size:16px}.clipboard-dialog-content p{font-size:13px}}.editor-container .monaco-editor .overflow-guard,.editor-container .monaco-editor .monaco-scrollable-element,.editor-container .monaco-editor .monaco-editor-background,.editor-container .monaco-editor .monaco-editor-background .monaco-editor-background,.editor-container .monaco-editor .monaco-scrollable-element .monaco-scrollable-element{overflow:hidden!important}.editor-container .monaco-editor *{overflow:visible}.editor-container .monaco-editor .monaco-editor-background,.editor-container .monaco-editor .monaco-scrollable-element,.editor-container .monaco-editor .overflow-guard{overflow:hidden!important}.header{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.2);padding:.5rem 0;position:sticky;top:0;z-index:100}.header-content{max-width:100%;margin:0 auto;padding:0 16px;display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:8px}.logo-icon{width:24px;height:24px;object-fit:contain;transition:transform .2s ease;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.logo-icon:hover{transform:scale(1.1)}.logo-text{display:flex;align-items:center;gap:12px}.logo-text h1{color:#fff;margin:0;font-size:1.3rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3);line-height:1;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.logo-text .description{color:#fffc;font-size:.9rem;font-weight:400;margin:0;line-height:1}.header-buttons{display:flex;align-items:center;gap:8px}.txt-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:6px 10px;color:#fff;cursor:pointer;display:flex;align-items:center;gap:4px;font-size:.8rem;font-weight:500;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.txt-icon{width:16px;height:16px;object-fit:contain}.about-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:6px 10px;color:#fff;cursor:pointer;display:flex;align-items:center;gap:4px;font-size:.8rem;font-weight:500;transition:all .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.txt-btn:hover{background:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.txt-btn:active{transform:translateY(0)}.about-btn:hover{background:#fff3;border-color:#ffffff4d;transform:translateY(-1px)}.about-btn:active{transform:translateY(0)}@media (max-width: 768px){.header-content{padding:0 15px}.logo-text{flex-direction:column;align-items:flex-start;gap:2px}.logo-text h1{font-size:1.4rem}.logo-text .description{font-size:.8rem}.txt-btn,.about-btn{padding:5px 10px;font-size:.8rem}}.app{display:flex;flex-direction:column;height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b)}.main-content{flex:1;padding:16px;display:flex;flex-direction:column;min-height:0;overflow:hidden}@media (max-width: 768px){.main-content{padding:8px}}