.json-diff-wrapper{max-width:1200px}.options-bar{background:var(--bi-surface);padding:15px 20px;border-radius:12px;box-shadow:0 2px 12px #00000014}.options-bar .form-check-label{font-size:14px;color:var(--bi-text);cursor:pointer}.options-bar .form-check-input{cursor:pointer}.input-panel{background:var(--bi-surface);border-radius:12px;box-shadow:0 2px 12px #00000014;overflow:hidden;display:flex;flex-direction:column;height:100%}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--bi-surface-2);border-bottom:1px solid var(--bi-border);flex-wrap:wrap;gap:10px}.panel-title{font-weight:600;font-size:14px;color:var(--bi-text);display:flex;align-items:center;gap:6px}.panel-actions{display:flex;gap:8px}.panel-actions .btn{font-size:12px;padding:4px 10px}.json-input{border:none;border-radius:0;font-family:Consolas,Monaco,Courier New,monospace;font-size:13px;line-height:1.6;height:500px;min-height:500px;resize:vertical;background:#fafafa}.json-input:focus{background:var(--bi-surface);box-shadow:none}.panel-footer{padding:8px 16px;background:var(--bi-surface-2);border-top:1px solid var(--bi-border)}.stats-bar{background:var(--bi-surface);padding:15px 20px;border-radius:12px;box-shadow:0 2px 12px #00000014}.stats-bar .badge{font-size:13px;padding:8px 14px;font-weight:500}.result-panel{background:var(--bi-surface);border-radius:12px;box-shadow:0 2px 12px #00000014;overflow:hidden}.result-content{padding:20px;max-height:600px;overflow-y:auto}.diff-tree{font-family:Consolas,Monaco,Courier New,monospace;font-size:13px;line-height:1.8}.diff-item{margin-left:20px}.diff-key{font-weight:600;color:var(--bi-text)}.diff-value{padding:2px 8px;border-radius:4px;margin-left:8px}.diff-same{color:#198754}.diff-same .diff-value{background:#d1e7dd}.diff-modified{color:#ffc107}.diff-modified .diff-value{background:#fff3cd}.diff-added{color:#0dcaf0}.diff-added .diff-value{background:#cff4fc}.diff-removed{color:#dc3545}.diff-removed .diff-value{background:#f8d7da}.diff-path{font-size:12px;color:var(--bi-text-muted);margin-bottom:4px}.diff-toggle{cursor:pointer;user-select:none;display:inline-flex;align-items:center;gap:4px}.diff-toggle:hover{color:#0d6efd}.diff-toggle i{font-size:12px;transition:transform .2s ease}.diff-toggle.collapsed i{transform:rotate(-90deg)}.diff-children{margin-left:20px}.diff-children.collapsed{display:none}.type-tag{font-size:10px;padding:1px 6px;border-radius:3px;background:var(--bi-border);color:var(--bi-text-muted);margin-left:4px;font-weight:400}.type-tag.string{background:#d1e7dd;color:#0f5132}.type-tag.number{background:#cff4fc;color:#055160}.type-tag.boolean{background:#fff3cd;color:#664d03}.type-tag.null{background:#f8d7da;color:#842029}.type-tag.array{background:#e2e3e5;color:#41464b}.type-tag.object{background:#d3d3d3;color:var(--bi-text)}.result-panel .panel-actions .btn{font-size:12px;padding:4px 10px}@media (max-width: 768px){.json-input{height:300px;min-height:300px;font-size:12px}.panel-header{flex-direction:column;align-items:flex-start;padding:.5rem .75rem}.panel-actions{width:100%;justify-content:flex-end}.panel-actions .btn{min-height:36px;padding:6px 12px;font-size:12px}.result-content{padding:1rem;max-height:350px}.diff-tree{font-size:12px}.diff-container{gap:.75rem}.diff-stat{font-size:.8rem}}.empty-state{text-align:center;padding:60px 20px;color:var(--bi-text-muted)}.empty-state i{font-size:64px;margin-bottom:16px;display:block}.empty-state p{font-size:16px;margin:0}.loading-overlay{position:absolute;inset:0;background:#fffc;display:flex;align-items:center;justify-content:center;z-index:10}.loading-overlay .spinner-border{width:3rem;height:3rem}html[data-theme=dark] .json-input{background:#0f172a}html[data-theme=dark] .diff-toggle:hover{color:var(--brand)}html[data-theme=dark] .diff-same{color:#75b798}html[data-theme=dark] .diff-same .diff-value{background:#19875440}html[data-theme=dark] .diff-modified{color:#ffda6a}html[data-theme=dark] .diff-modified .diff-value{background:#ffc10733}html[data-theme=dark] .diff-added{color:#6edff6}html[data-theme=dark] .diff-added .diff-value{background:#0dcaf033}html[data-theme=dark] .diff-removed{color:#ea868f}html[data-theme=dark] .diff-removed .diff-value{background:#dc354533}html[data-theme=dark] .type-tag.string{background:#19875440;color:#75b798}html[data-theme=dark] .type-tag.number{background:#0dcaf033;color:#6edff6}html[data-theme=dark] .type-tag.boolean{background:#ffc10733;color:#ffda6a}html[data-theme=dark] .type-tag.null{background:#dc354533;color:#ea868f}html[data-theme=dark] .type-tag.array{background:#6c757d40;color:#adb5bd}html[data-theme=dark] .type-tag.object{background:#6c757d59;color:#ced4da}