:root{--bg-primary: #0f0f14;--bg-secondary: #16161e;--bg-tertiary: #1e1e2a;--bg-hover: #252535;--border: #2a2a3c;--border-focus: #8b5cf6;--text-primary: #e4e4ec;--text-secondary: #9898b0;--text-muted: #6b6b82;--accent: #8b5cf6;--accent-hover: #7c3aed;--accent-dim: rgba(139, 92, 246, .15);--accent-glow: rgba(139, 92, 246, .3);--success: #22c55e;--error: #ef4444;--warning: #f59e0b;--radius: 8px;--radius-sm: 6px;--radius-lg: 12px;--font-mono: "SF Mono", "Fira Code", "Cascadia Code", Consolas, monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--shadow: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .4);--transition: .15s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;line-height:1.5;overflow-x:hidden}[dir=rtl]{text-align:right}[dir=rtl] .tabs-scroll{direction:rtl}.topbar{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:0 1rem;height:52px;position:sticky;top:0;z-index:100}.topbar-inner{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:100%}.logo{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--text-primary)}.logo-text{font-size:1.25rem;font-weight:700;letter-spacing:-.02em}.topbar-actions{display:flex;align-items:center;gap:.75rem}.lang-select{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.35rem .6rem;font-size:.8rem;cursor:pointer;outline:none;transition:border-color var(--transition)}.lang-select:focus{border-color:var(--accent)}.tabs-nav{background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:0 1rem;position:sticky;top:52px;z-index:90}.tabs-scroll{max-width:1400px;margin:0 auto;display:flex;gap:.25rem;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;padding:.5rem 0;-webkit-overflow-scrolling:touch}.tabs-scroll::-webkit-scrollbar{height:4px}.tabs-scroll::-webkit-scrollbar-track{background:transparent}.tabs-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.tab{background:none;border:none;color:var(--text-secondary);font-size:.8rem;font-weight:500;padding:.45rem .85rem;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;transition:all var(--transition);font-family:var(--font-sans)}.tab:hover{background:var(--bg-hover);color:var(--text-primary)}.tab.active{background:var(--accent-dim);color:var(--accent);font-weight:600}.workspace{flex:1;max-width:1400px;width:100%;margin:0 auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.tool-controls{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;min-height:36px}.tool-controls:empty{display:none}.ctrl-btn{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.4rem .85rem;font-size:.8rem;font-weight:500;cursor:pointer;transition:all var(--transition);font-family:var(--font-sans);white-space:nowrap}.ctrl-btn:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--accent)}.ctrl-btn.active{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.ctrl-input{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.4rem .65rem;font-size:.8rem;outline:none;font-family:var(--font-sans);transition:border-color var(--transition)}.ctrl-input:focus{border-color:var(--accent)}.ctrl-input::placeholder{color:var(--text-muted)}.ctrl-label{color:var(--text-muted);font-size:.75rem;font-weight:500}.ctrl-select{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.4rem .65rem;font-size:.8rem;cursor:pointer;outline:none;font-family:var(--font-sans)}.ctrl-select:focus{border-color:var(--accent)}.ctrl-checkbox{display:flex;align-items:center;gap:.35rem;color:var(--text-secondary);font-size:.8rem;cursor:pointer}.ctrl-checkbox input[type=checkbox]{accent-color:var(--accent)}.ctrl-number{width:70px}.panes{display:flex;gap:.75rem;flex:1;min-height:400px}.pane{flex:1;display:flex;flex-direction:column;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.pane-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;border-bottom:1px solid var(--border);background:var(--bg-tertiary)}.pane-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.text-area{flex:1;width:100%;background:transparent;color:var(--text-primary);border:none;padding:.75rem;font-family:var(--font-mono);font-size:.85rem;line-height:1.6;resize:none;outline:none;min-height:300px}.text-area::placeholder{color:var(--text-muted)}.output-area{overflow:auto;white-space:pre-wrap;word-break:break-word;min-height:300px}.center-actions{display:flex;align-items:center;justify-content:center;flex-shrink:0}.btn-icon{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.3rem;border-radius:var(--radius-sm);transition:all var(--transition);display:flex;align-items:center;justify-content:center}.btn-icon:hover{color:var(--text-primary);background:var(--bg-hover)}.btn-swap{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:50%;width:36px;height:36px;padding:0}.btn-swap:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}.stats-bar{display:flex;flex-wrap:wrap;gap:1rem;padding:.6rem .85rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);font-size:.78rem;color:var(--text-secondary)}.stats-bar:empty{display:none}.stat-item{display:flex;gap:.35rem}.stat-label{color:var(--text-muted)}.stat-value{color:var(--accent);font-weight:600;font-family:var(--font-mono)}.json-key{color:#c084fc}.json-string{color:#86efac}.json-number{color:#fbbf24}.json-boolean{color:#f87171}.json-null{color:#94a3b8}.json-bracket{color:var(--text-muted)}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%) translateY(100px);background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--accent);padding:.6rem 1.2rem;border-radius:var(--radius);font-size:.85rem;z-index:1000;transition:transform .3s ease;box-shadow:var(--shadow-lg)}.toast.show{transform:translate(-50%) translateY(0)}.footer{background:var(--bg-secondary);border-top:1px solid var(--border);padding:1rem;margin-top:auto}.footer-inner{max-width:1400px;margin:0 auto;display:flex;flex-direction:column;gap:.6rem;align-items:center}.footer-links{display:flex;align-items:center;gap:.6rem;font-size:.78rem;color:var(--text-muted);flex-wrap:wrap;justify-content:center}.footer-brand{font-weight:700;color:var(--text-secondary)}.footer-sep{color:var(--border)}.footer-crosslinks{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.footer-crosslinks a{color:var(--text-muted);text-decoration:none;font-size:.75rem;transition:color var(--transition)}.footer-crosslinks a:hover{color:var(--accent)}@media(max-width:768px){.panes{flex-direction:column;min-height:auto}.pane{min-height:200px}.text-area,.output-area{min-height:180px}.center-actions{transform:rotate(90deg);padding:.25rem 0}.workspace{padding:.75rem}.tool-controls{gap:.35rem}.ctrl-btn{padding:.35rem .65rem;font-size:.75rem}.topbar{padding:0 .75rem}.tabs-nav{padding:0 .5rem}}@media(max-width:480px){.stats-bar{gap:.6rem;font-size:.72rem}.footer-crosslinks{gap:.6rem}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}::selection{background:var(--accent-glow);color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}