*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background-color:#f5f5f5;color:#333}.container{max-width:1800px;margin:0 auto;background-color:#fff;min-height:100vh}header{background-color:#4a90e2;color:#fff;padding:20px;display:flex;justify-content:space-between;align-items:center}header h1{font-size:24px;font-weight:400}.about-link{color:#fff;text-decoration:none;font-size:14px}.about-link:hover{text-decoration:underline}.tab-button,.tabs{background-color:#e8e8e8}.tabs{display:flex;border-bottom:1px solid #ccc}.tab-button{padding:10px 20px;border:0;border-right:1px solid #ccc;cursor:pointer;font-size:14px;transition:background-color .2s}.tab-button:hover{background-color:#d0d0d0}.tab-button.active{background-color:#fff;border-bottom:1px solid #fff}.toolbar{display:flex;gap:5px;padding:10px;background-color:#f9f9f9;border-bottom:1px solid #ddd;flex-wrap:wrap}.toolbar button{padding:8px 15px;background-color:#fff;border:1px solid #ccc;border-radius:3px;cursor:pointer;font-size:13px;transition:all .2s}.toolbar button:hover{background-color:#e8e8e8;border-color:#999}.toolbar button:active{background-color:#d0d0d0}.content-area{position:relative;height:calc(100vh - 180px)}.mode-content{display:none;height:100%}.mode-content.active{display:block}#jsonInput,#jsonViewer{padding:15px;height:100%;font-family:"Courier New",Courier,monospace;font-size:14px}#jsonInput{width:100%;border:0;resize:none;outline:0}#jsonViewer{overflow:auto}.json-key{color:#881391;font-weight:700}.json-string{color:#1a1aa6}.json-number{color:#1c00cf}.json-boolean{color:#0d22ff}.json-null{color:gray}.json-item{margin-left:20px}.json-collapsible{cursor:pointer;user-select:none}.json-collapsible:hover{background-color:#f0f0f0}.json-collapsed{display:none}.json-toggle{display:inline-block;width:12px;margin-right:5px;font-size:12px}.about-section{display:none;padding:20px;background-color:#f9f9f9;border-top:1px solid #ddd}.about-section:target{display:block}.about-section h2{margin-bottom:15px;color:#4a90e2}.about-section p{margin-bottom:10px;line-height:1.6}.about-section ul{margin-left:20px;line-height:1.8}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}