:root{--bg:#f7f8fb;--panel:#fff;--subtle:#f1f5f9;--border:#d9e0ea;--control-bg:#fff;--control-border:#cbd5e1;--text:#475569;--text-strong:#101827;--muted:#64748b;--code-bg:#0f172a;--code-text:#e2e8f0;--accent:#0f766e;--success:#047857;--success-bg:#dcfce7;--success-border:#86efac;--danger:#b91c1c;--danger-bg:#fee2e2;--danger-border:#fecaca;--highlight:#fef3c7;--mono:"Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace;--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;color:var(--text);background:var(--bg);font-family:var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5}@media (prefers-color-scheme:dark){:root{--bg:#111827;--panel:#172033;--subtle:#1f2937;--border:#334155;--control-bg:#111827;--control-border:#475569;--text:#cbd5e1;--text-strong:#f8fafc;--muted:#94a3b8;--code-bg:#0b1120;--code-text:#e5e7eb;--success:#86efac;--success-bg:#22c55e29;--success-border:#86efac59;--danger:#fca5a5;--danger-bg:#ef444429;--danger-border:#fca5a561;--highlight:#f59e0b33}}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}#root{min-height:100svh}button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline-offset:2px;outline:3px solid #14b8a647}.app-shell{min-height:100svh;color:var(--text);background:linear-gradient(180deg, #1f29370d, transparent 220px), var(--bg);box-sizing:border-box;padding:28px}.app-header{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:20px;display:flex}.eyebrow{color:var(--muted);letter-spacing:0;text-transform:uppercase;margin:0 0 4px;font-size:13px;font-weight:700}.app-header h1{color:var(--text-strong);letter-spacing:0;margin:0;font-size:36px;line-height:1}.status-badge{border:1px solid var(--success-border);min-height:38px;color:var(--success);background:var(--success-bg);white-space:nowrap;border-radius:8px;align-items:center;gap:8px;padding:0 13px;font-size:14px;font-weight:700;display:inline-flex}.status-badge.invalid{border-color:var(--danger-border);color:var(--danger);background:var(--danger-bg)}.toolbar,.search-row,.path-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.toolbar{margin-bottom:16px}button,select,input,textarea{font:inherit}button,select{border:1px solid var(--control-border);min-height:38px;color:var(--text-strong);background:var(--control-bg);border-radius:8px}button{cursor:pointer;padding:0 13px;transition:border-color .14s,box-shadow .14s,transform .14s}button:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px);box-shadow:0 8px 22px #0f172a14}button:disabled{cursor:not-allowed;opacity:.45}.select-field{min-height:38px;color:var(--muted);align-items:center;gap:8px;font-size:14px;display:inline-flex}select{padding:0 10px}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:16px;display:grid}.panel,.formatted-panel{border:1px solid var(--border);background:var(--panel);border-radius:8px;box-shadow:0 18px 38px #0f172a0f}.panel{min-height:560px;overflow:hidden}.panel-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;min-height:52px;padding:0 16px;display:flex}.panel-header h2{color:var(--text-strong);letter-spacing:0;margin:0;font-size:16px}.panel-header span{color:var(--muted);font-size:13px}textarea{width:100%;height:calc(100% - 53px);min-height:507px;color:var(--code-text);background:var(--code-bg);box-sizing:border-box;font-family:var(--mono);resize:none;border:0;outline:none;padding:18px;font-size:14px;line-height:1.55;display:block}.output-panel{flex-direction:column;display:flex}.search-row{border-bottom:1px solid var(--border);padding:14px 16px}.search-row input{border:1px solid var(--control-border);min-width:0;min-height:38px;color:var(--text-strong);background:var(--control-bg);box-sizing:border-box;border-radius:8px;flex:260px;padding:0 12px}.path-row{border-bottom:1px solid var(--border);background:var(--subtle);justify-content:space-between;padding:10px 16px}.path-row span{min-width:0;color:var(--text-strong);font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.tree{flex:1;margin:0;padding:12px 0 18px;list-style:none;overflow:auto}.tree-children{margin:0;padding:0;list-style:none}.tree-row{min-height:32px;padding-left:calc(12px + var(--depth) * 18px);align-items:center;gap:4px;padding-right:10px;display:flex}.tree-node.match>.tree-row{background:var(--highlight)}.toggle{width:26px;min-height:26px;color:var(--muted);font-family:var(--mono);background:0 0;border:0;flex:0 0 26px;place-items:center;padding:0;font-size:12px;display:inline-grid}.toggle:hover:not(:disabled){box-shadow:none;transform:none}.node-main{text-align:left;background:0 0;border:0;grid-template-columns:minmax(80px,.35fr) auto minmax(80px,1fr);align-items:center;gap:8px;width:100%;min-width:0;min-height:30px;padding:0 8px;display:grid}.node-main:hover{background:var(--subtle);box-shadow:none}.node-name,.node-value{min-width:0;font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.node-name{color:var(--text-strong);font-weight:700}.node-value{color:var(--muted)}.type-pill{min-width:58px;min-height:22px;color:var(--type-text);background:var(--type-bg);border-radius:999px;justify-content:center;align-items:center;padding:0 8px;font-size:12px;font-weight:700;display:inline-flex}.type-pill.string{--type-bg:#14b8a624;--type-text:#0f766e}.type-pill.number{--type-bg:#f9731629;--type-text:#c2410c}.type-pill.boolean{--type-bg:#3b82f626;--type-text:#1d4ed8}.type-pill.null{--type-bg:#64748b26;--type-text:#475569}.type-pill.array,.type-pill.object{--type-bg:#84cc1626;--type-text:#3f6212}.error-box{border:1px solid var(--danger-border);color:var(--danger);background:var(--danger-bg);text-align:left;border-radius:8px;gap:10px;margin:16px;padding:16px;display:grid}.error-box span{color:var(--text);font-family:var(--mono);font-size:13px}.formatted-panel{margin-top:16px;overflow:hidden}.formatted-panel pre{max-height:320px;color:var(--code-text);background:var(--code-bg);font-family:var(--mono);text-align:left;margin:0;padding:18px;font-size:13px;line-height:1.55;overflow:auto}.toast{border:1px solid var(--border);color:var(--text-strong);background:var(--panel);opacity:0;pointer-events:none;border-radius:8px;padding:10px 14px;transition:opacity .16s,transform .16s;position:fixed;bottom:24px;right:24px;transform:translateY(8px);box-shadow:0 18px 38px #0f172a29}.toast.show{opacity:1;transform:translateY(0)}@media (width<=900px){.app-shell{padding:18px}.app-header{flex-direction:column;align-items:flex-start}.workspace{grid-template-columns:1fr}.panel{min-height:420px}textarea{min-height:360px}}