:root,[data-theme=dark]{--bg-primary: #1e1e2e;--bg-secondary: #181825;--bg-surface: #252536;--bg-hover: #2d2d44;--bg-active: #363654;--text-primary: #cdd6f4;--text-secondary: #a6adc8;--text-dim: #6c7086;--accent: #89b4fa;--accent-hover: #74c7ec;--border: #313244;--success: #a6e3a1;--warning: #f9e2af;--error: #f38ba8;--json-key: #89b4fa;--json-string: #a6e3a1;--json-number: #fab387;--json-bool: #cba6f7;--json-null: #6c7086;--json-bracket: #94e2d5;--scrollbar-bg: #1e1e2e;--scrollbar-thumb: #45475a;--scrollbar-thumb-hover: #585b70;--overlay-bg: rgba(30, 30, 46, .92);--overlay-bg-light: rgba(30, 30, 46, .85);--font-mono: "SF Mono", "Fira Code", "Cascadia Code", "JetBrains Mono", "Consolas", monospace;--font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--radius: 8px;--radius-sm: 4px;--transition: .15s ease}[data-theme=light]{--bg-primary: #ffffff;--bg-secondary: #f5f5f8;--bg-surface: #ecedf0;--bg-hover: #e2e3e8;--bg-active: #d4d5dc;--text-primary: #1e1e2e;--text-secondary: #4a4a5a;--text-dim: #8a8a9e;--accent: #4a7dd4;--accent-hover: #3a6bc4;--border: #d4d5dc;--success: #3a9a5f;--warning: #c8911a;--error: #d43a4a;--json-key: #4a7dd4;--json-string: #3a9a5f;--json-number: #d47a2a;--json-bool: #8b5cf6;--json-null: #8a8a9e;--json-bracket: #0d9488;--scrollbar-bg: #f5f5f8;--scrollbar-thumb: #c4c5ce;--scrollbar-thumb-hover: #a4a5b0;--overlay-bg: rgba(245, 245, 248, .92);--overlay-bg-light: rgba(245, 245, 248, .85);--font-mono: "SF Mono", "Fira Code", "Cascadia Code", "JetBrains Monaco", "Consolas", monospace;--font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--radius: 8px;--radius-sm: 4px;--transition: .15s ease}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-ui);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-bg)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}.toolbar{display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--bg-secondary);border-bottom:1px solid var(--border);-webkit-user-select:none;user-select:none}.toolbar-left{display:flex;gap:6px}.toolbar-center{flex:1;display:flex;align-items:center;gap:16px;justify-content:center}.toolbar-right{display:flex;align-items:center;gap:8px}.btn{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-primary);font-size:13px;cursor:pointer;transition:background var(--transition),border-color var(--transition)}.btn:hover{background:var(--bg-hover);border-color:var(--accent)}.btn:active{background:var(--bg-active)}.btn-sm{padding:3px 8px;font-size:12px}.opt-group{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--text-secondary)}.opt-group select{padding:2px 6px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-primary);font-size:12px;outline:none;cursor:pointer}.opt-group select:focus{border-color:var(--accent)}.opt-group input[type=checkbox]{accent-color:var(--accent);cursor:pointer}.file-info{font-size:12px;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.main-content{display:flex;height:calc(100vh - 88px);gap:0}.panel{flex:1;display:flex;flex-direction:column;min-width:0;position:relative;overflow:hidden}.panel-input,.panel-output{flex:1 1 0;min-width:100px}.split-divider{width:5px;cursor:col-resize;background:var(--border);flex-shrink:0;position:relative;transition:background .15s ease;z-index:30}.split-divider:hover,.split-divider.active{background:var(--accent)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;height:36px;background:var(--bg-secondary);border-bottom:1px solid var(--border);font-size:12px;color:var(--text-secondary);flex-shrink:0}.panel-header-right{display:flex;align-items:center;gap:6px}.panel-title{font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:11px}.panel-status{font-size:11px;color:var(--text-dim)}.panel-body{flex:1;position:relative;overflow:hidden}.code-input{width:100%;height:100%;padding:16px;border:none;outline:none;resize:none;background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-mono);font-size:13px;line-height:1.6;-moz-tab-size:4;tab-size:4}.code-input::placeholder{color:var(--text-dim)}.code-input:focus{background:var(--bg-primary)}.drop-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--overlay-bg);border:2px dashed var(--accent);border-radius:var(--radius);color:var(--accent);font-size:18px;font-weight:600;z-index:10;pointer-events:none;transition:opacity .2s ease}.drop-overlay.hidden{opacity:0;pointer-events:none}.output-container{width:100%;height:100%;overflow:auto;padding:0;background:var(--bg-primary)}.output-content{padding:12px 16px;font-family:var(--font-mono);font-size:13px;line-height:1.6;white-space:pre;min-height:100%}.output-content .jv-key{color:var(--json-key)}.output-content .jv-string{color:var(--json-string)}.output-content .jv-number{color:var(--json-number)}.output-content .jv-bool{color:var(--json-bool)}.output-content .jv-null{color:var(--json-null);font-style:italic}.output-content .jv-bracket{color:var(--json-bracket)}.output-content .jv-colon,.output-content .jv-comma{color:var(--text-dim)}.output-content .jv-line{display:block;cursor:default;white-space:pre;min-height:1.4em}.output-content .jv-line:hover{background:color-mix(in srgb,var(--accent) 10%,transparent);border-radius:2px}.output-content .jv-collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}.output-content .jv-collapsible:hover{color:var(--accent-hover)}.output-content.show-line-numbers{counter-reset:jv-line}.output-content.show-line-numbers .jv-line:before{counter-increment:jv-line;content:counter(jv-line);display:inline-block;width:3.2em;text-align:right;color:var(--text-dim);margin-right:14px;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums}.output-content .jv-collapsed{display:inline}.output-content .jv-collapsed .jv-collapsed-content{display:none}.output-content .jv-collapsed:after{content:"⋯";color:var(--text-dim);font-weight:700}.output-content .jv-collapsed>.jv-children{display:none}.output-content .jv-toggle{display:inline-block;width:12px;margin-left:-12px;color:var(--text-dim);font-size:10px;-webkit-user-select:none;user-select:none;cursor:pointer}.output-content .jv-toggle:hover{color:var(--text-primary)}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--overlay-bg-light);z-index:20;transition:opacity .2s ease}.loading-overlay.hidden{opacity:0;pointer-events:none}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-overlay span{color:var(--text-secondary);font-size:13px}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:3px 16px;background:var(--bg-secondary);border-top:1px solid var(--border);font-size:11px;color:var(--text-dim);height:24px;flex-shrink:0}.drag-over .drop-overlay{opacity:1}@media(max-width:700px){.main-content{flex-direction:column}.panel:first-child{border-right:none;border-bottom:1px solid var(--border)}.toolbar-center{flex-wrap:wrap;gap:8px}}#app{height:100%}