:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--accent: #3b82f6;--accent-hover: #2563eb;--success: #22c55e;--error: #ef4444;--warning: #f59e0b;--border: #334155}[data-theme=light]{--bg-primary: #f8fafc;--bg-secondary: #ffffff;--bg-tertiary: #e2e8f0;--text-primary: #0f172a;--text-secondary: #64748b;--accent: #3b82f6;--accent-hover: #2563eb;--success: #16a34a;--error: #dc2626;--warning: #d97706;--border: #cbd5e1}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;transition:background-color .3s,color .3s}#root{min-height:100vh;display:flex;flex-direction:column}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.json-editor{font-family:JetBrains Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:13px;line-height:1.6;-moz-tab-size:2;tab-size:2;resize:none;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);border-radius:8px;padding:12px;width:100%;outline:none;transition:border-color .2s}.json-editor:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b82f61a}.json-editor::placeholder{color:var(--text-secondary);opacity:.6}.diff-added{background-color:#22c55e26;border-left:3px solid var(--success)}.diff-removed{background-color:#ef444426;border-left:3px solid var(--error)}.diff-changed{background-color:#f59e0b26;border-left:3px solid var(--warning)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .3s ease-out}.tooltip-wrapper{position:relative}.tooltip-wrapper:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);padding:4px 10px;border-radius:6px;background:var(--bg-tertiary);color:var(--text-primary);font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s;z-index:50}.tooltip-wrapper:hover:after{opacity:1}.tree-node{padding-left:20px;border-left:1px dashed var(--border)}.tree-key{color:#93c5fd}.tree-string{color:#86efac}.tree-number{color:#fbbf24}.tree-boolean{color:#c084fc}.tree-null{color:#f87171;font-style:italic}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;border:none;outline:none}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary)}.btn-secondary:hover{background:var(--border);transform:translateY(-1px)}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover{opacity:.9;transform:translateY(-1px)}.btn-success{background:var(--success);color:#fff}.btn-success:hover{opacity:.9;transform:translateY(-1px)}.tab-active{position:relative}.tab-active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:var(--accent);border-radius:3px 3px 0 0}