:root{--bg: #f4f6fb;--panel: #ffffff;--text: #1e2633;--muted: #5f6b7c;--line: #d8deea;--surface: #ffffff;--surface-soft: #f8fbff;--surface-softer: #fbfdff;--surface-glass: rgba(255, 255, 255, .9);--hover: #edf3ff;--active-bg: #e8f0ff;--active-border: #b9cff1;--active-text: #194a95;--scroll-track: #edf2fb;--scroll-thumb: #9db0cc;--overlay: rgba(12, 24, 42, .45);--code-text: #1b2738;--json-key: #8b2a70;--json-string: #146c2e;--json-number: #8a3208;--json-boolean: #0f4ea6;--json-null: #7a338f;--json-punc: #5f6f87;--error-bg: #ffe9ea;--error-text: #b4232f;--btn: #1967d2;--btn-text: #ffffff;--btn-muted: #e6ecfb;--btn-muted-text: #1e3a7a}[data-theme=dark]{--bg: #0b0b0c;--panel: #121314;--text: #e8e9eb;--muted: #a9adb3;--line: #25272a;--surface: #16181a;--surface-soft: #1a1c1f;--surface-softer: #141618;--surface-glass: rgba(20, 22, 24, .9);--hover: #202327;--active-bg: #163a67;--active-border: #2c6fba;--active-text: #eaf3ff;--scroll-track: #181a1d;--scroll-thumb: #4c525a;--overlay: rgba(0, 0, 0, .62);--code-text: #e0e4ea;--json-key: #ff9edd;--json-string: #83d69b;--json-number: #f4bd8c;--json-boolean: #6eb0ff;--json-null: #cba1ef;--json-punc: #9da4af;--error-bg: #3a1720;--error-text: #ff9fa9;--btn: #3f8cff;--btn-muted: #25292e;--btn-muted-text: #e3e7eb}*{box-sizing:border-box}body{margin:0;min-height:100dvh;font-family:IBM Plex Sans,Segoe UI,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at top left,#d7e7ff 0%,transparent 45%),radial-gradient(circle at bottom right,#ffe6d7 0%,transparent 40%),var(--bg)}#root,.site-shell{min-height:100dvh}.navbar{position:sticky;top:0;z-index:30;max-width:1100px;margin:12px auto 0;padding:0 16px}.navbar-inner{background:var(--surface-glass);border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;font-size:14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 22px #182b4a14}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:90px;height:90px;display:inline-flex;align-items:center;justify-content:center}.brand-mark img{width:100%;height:100%;object-fit:contain;display:block}.brand-text{line-height:1.1;display:inline-flex;flex-direction:column;gap:2px}.brand-title{font-weight:800;color:#203a5d;font-size:15px}.brand-sub{font-size:11px;color:#5f6e84}.nav-links{display:flex;gap:8px}.nav-links a{color:#2f4d79;text-decoration:none;font-weight:700;padding:6px 10px;border-radius:8px;border:1px solid transparent}.nav-links a:hover{background:var(--hover);border-color:var(--line)}.nav-links a.active{background:var(--active-bg);border-color:var(--active-border);color:var(--active-text)}.theme-toggle-btn{border:1px solid var(--line);background:var(--surface);color:inherit;border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700}.app-main{max-width:1100px;margin:20px auto;padding:0 16px;min-height:calc(100dvh - 140px);display:flex}.page-panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 4px 18px #14244214;overflow:hidden;display:flex;flex-direction:column;flex:1}.home-panel{justify-content:flex-start}.home-hero{padding:28px 18px 20px;border-bottom:1px solid var(--line);background:radial-gradient(circle at top right,rgba(38,86,156,.1),transparent 38%),linear-gradient(to bottom,#fcfdff,#f8fbff)}.home-kicker{display:inline-block;margin-bottom:12px;padding:4px 8px;border-radius:999px;background:#e9f1ff;color:#2a4f86;font-size:11px;font-weight:800;letter-spacing:.35px}.home-hero h1{margin:0;max-width:860px;font-size:38px;line-height:1.2;color:#203a5d}.home-hero p{margin:12px 0 0;max-width:840px;font-size:16px;line-height:1.6;color:#43546c}.home-actions{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap}.primary-link,.secondary-link{border-radius:8px;padding:9px 12px;font-size:14px;font-weight:700;text-decoration:none}.primary-link{background:var(--btn);color:#fff}.secondary-link{background:#e6ecfb;color:#1e3a7a}.ghost-link{border-radius:8px;padding:9px 12px;font-size:14px;font-weight:700;text-decoration:none;border:1px solid #d5dff1;background:#fff;color:#2e4f7c}.home-stats{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}.stat-chip{border:1px solid #d5e0f2;background:#fff;color:#31517c;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700}.home-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px 18px}.feature-card{border:1px solid #dbe3f3;background:#fff;border-radius:12px;padding:14px;box-shadow:0 2px 10px #1f3c680a}.feature-card h3{margin:0;color:#1e3f68;font-size:16px}.feature-card p{margin:10px 0 0;color:#4d607b;font-size:14px;line-height:1.5}.feature-link{display:inline-block;margin-top:10px;color:#1d4f98;font-size:13px;font-weight:700;text-decoration:none}.feature-link:hover{text-decoration:underline}.home-workflow{border-top:1px solid var(--line);padding:16px 18px 20px}.home-workflow h2{margin:0;color:#203a5d;font-size:20px}.workflow-list{margin-top:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.workflow-item{border:1px solid #dbe3f3;border-radius:12px;background:#fff;padding:12px}.workflow-step{width:26px;height:26px;border-radius:999px;background:#e9f1ff;color:#1d4f98;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:800}.workflow-item p{margin:8px 0 0;color:#4d607b;font-size:14px;line-height:1.45}.header{padding:14px 16px;border-bottom:1px solid var(--line);font-weight:700;letter-spacing:.2px}.header-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.controls{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);background:#f9fbff}button{border:0;border-radius:8px;padding:9px 12px;font-size:14px;font-weight:600;cursor:pointer;transition:transform 80ms ease,opacity .12s ease}button:active{transform:translateY(1px)}button:disabled{cursor:not-allowed;opacity:.55}.primary{background:var(--btn);color:var(--btn-text)}.muted{background:var(--btn-muted);color:var(--btn-muted-text)}.split{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(520px,1.2fr);min-height:0;flex:1}.pane{min-width:0;min-height:0;display:flex;flex-direction:column}.pane+.pane{border-left:1px solid var(--line)}.pane-title{padding:10px 16px;border-bottom:1px solid var(--line);font-size:13px;font-weight:700;color:#31405a;background:var(--surface-softer);letter-spacing:.2px}.pane-title-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.view-toggle{display:inline-flex;gap:6px}.view-toggle-btn{border:1px solid #cfd9ee;background:#fff;color:#3a4f70;border-radius:6px;padding:4px 8px;font-size:12px;font-weight:700}.view-toggle-btn.active{background:#eaf1ff;border-color:#8aaee8;color:#1f4f96}.editor-wrap{position:relative;flex:1;min-height:0;border-bottom:1px solid var(--line);background:var(--surface-softer);overflow:hidden}.editor-highlight{position:absolute;inset:0;margin:0;padding:12px 14px;overflow-x:auto;overflow-y:auto;font-family:Menlo,Consolas,monospace;font-size:13px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;pointer-events:none;color:var(--code-text);tab-size:2}.editor-input{position:absolute;inset:0;width:100%;border:0;padding:12px 14px;resize:none;font-family:Menlo,Consolas,monospace;font-size:13px;line-height:1.45;color:transparent;caret-color:var(--code-text);background:transparent;outline:none;tab-size:2;white-space:pre-wrap;overflow-wrap:anywhere;overflow-x:auto;overflow-y:auto}.editor-input.plain{color:var(--code-text);caret-color:var(--code-text)}.editor-input::placeholder{color:#8794a8}.status{padding:10px 16px;font-size:13px;border-top:1px solid var(--line);color:var(--muted);min-height:40px}.status.error{background:var(--error-bg);color:var(--error-text);font-weight:600}.tree-split{display:grid;grid-template-columns:minmax(340px,1.12fr) minmax(260px,.88fr);min-height:0;flex:1}.tree-split.single{grid-template-columns:1fr}.tree-pane{min-width:0;min-height:0;display:flex;flex-direction:column}.tree-pane.full-width{border-left:0}.tree-pane+.tree-pane{border-left:1px solid var(--line)}.tree-subtitle{padding:8px 12px;border-bottom:1px solid var(--line);background:var(--surface-soft);font-size:12px;font-weight:700;color:#3a4f70;letter-spacing:.15px;display:flex;align-items:center;justify-content:space-between;gap:8px}.tree-subtitle-actions{display:inline-flex;gap:6px}.copy-sub-btn{border:1px solid #cfd9ee;background:#fff;color:#3a4f70;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700}.copy-icon-btn{border:1px solid #cfd9ee;background:#fff;color:#3a4f70;border-radius:6px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.format-btn{background:#1f6feb;border-color:#1f6feb;color:#fff}.modal-overlay{position:fixed;inset:0;background:var(--overlay);display:flex;align-items:center;justify-content:center;z-index:40;padding:20px}.modal-panel{width:min(560px,100%);height:min(88vh,900px);background:var(--surface);border:1px solid #d7e1f0;border-radius:12px;box-shadow:0 18px 48px #11233f33;display:flex;flex-direction:column;overflow:hidden}.modal-header{padding:10px 12px;border-bottom:1px solid var(--line);background:var(--surface-soft);display:flex;align-items:center;justify-content:space-between;gap:10px}.modal-actions{display:inline-flex;align-items:center;gap:8px}.wrap-toggle{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#2f4d79;font-weight:700}.modal-json-view{margin:0;width:100%;height:100%;padding:12px;font-family:Menlo,Consolas,monospace;font-size:12px;line-height:1.45;white-space:pre;overflow-wrap:normal;overflow-x:auto;overflow-y:auto;color:var(--code-text);background:var(--surface-softer)}.modal-json-view.wrap{white-space:pre-wrap;overflow-wrap:anywhere}.modal-loader{margin:8px 12px 0}.modal-load-more{padding:8px 12px 12px}.tree-wrap{overflow-x:auto;overflow-y:auto;padding:10px 12px 14px;background:var(--surface);min-height:0;flex:1;font-family:Menlo,Consolas,monospace;font-size:13px;line-height:1.5}.json-tree,.tree-children{margin:0;padding-left:0;list-style:none}.tree-node{position:relative;padding-left:2px}.tree-children{margin-left:11px;padding-left:16px;border-left:1px solid #d7e2f5}.node-line{display:flex;align-items:baseline;white-space:nowrap;border-radius:6px;padding:1px 4px 1px 0}.node-line:hover{background:#4d7eca14}.perf-note{margin:8px 12px 0;padding:8px 10px;border:1px solid #d7e3f7;background:#f5f8ff;color:#335684;border-radius:8px;font-size:12px;font-weight:600}.toggle{width:16px;margin-right:4px;display:inline-flex;justify-content:center;color:#465b82;cursor:pointer;-webkit-user-select:none;user-select:none;font-weight:700;flex:0 0 16px}.toggle.blank{cursor:default;color:transparent}.key{margin-right:4px}.key.depth-0{color:#8b2a70}.key.depth-1{color:#1f5ea8}.key.depth-2{color:#0b7a50}.key.depth-3{color:#8a4a08}.key.depth-4{color:#6b3ea8}.key.depth-5{color:#2d7a8f}.brace{color:#24496e;font-weight:700;margin-right:4px}.meta{color:#63748c;margin-left:3px}.tree-load-more{margin-top:6px}.load-more-btn{background:#eef4ff;color:#294f84;border:1px solid #d2def3;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700}.string{color:var(--json-string)}.number{color:var(--json-number)}.boolean{color:var(--json-boolean);font-weight:600}.null{color:var(--json-null);font-style:italic}.formatted-wrap{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--code-text)}.formatted-loader{margin:8px 0 0;padding:10px 12px;border:1px solid #d7e3f7;background:#f5f8ff;color:#335684;border-radius:8px;font-size:12px;font-weight:700}.editor-input,.editor-highlight,.tree-wrap,.modal-json-view{scrollbar-width:auto;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}.editor-input::-webkit-scrollbar,.editor-highlight::-webkit-scrollbar,.tree-wrap::-webkit-scrollbar,.modal-json-view::-webkit-scrollbar{width:10px;height:10px}.editor-input::-webkit-scrollbar-track,.editor-highlight::-webkit-scrollbar-track,.tree-wrap::-webkit-scrollbar-track,.modal-json-view::-webkit-scrollbar-track{background:var(--scroll-track)}.editor-input::-webkit-scrollbar-thumb,.editor-highlight::-webkit-scrollbar-thumb,.tree-wrap::-webkit-scrollbar-thumb,.modal-json-view::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:10px;border:2px solid var(--scroll-track)}.json-punc{color:var(--json-punc)}.json-key{color:var(--json-key);font-weight:600}.json-string{color:var(--json-string)}.json-number{color:var(--json-number)}.json-boolean{color:var(--json-boolean);font-weight:600}.json-null{color:var(--json-null);font-style:italic}.hidden{display:none!important}.toast{position:fixed;right:20px;bottom:20px;background:#1f3f70;color:#fff;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:700;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:20}.toast.show{opacity:1;transform:translateY(0)}.diff-panel .inputs{display:grid;grid-template-columns:1fr 1fr;min-height:0;flex:1}.input-pane{min-height:0;display:flex;flex-direction:column}.input-pane+.input-pane{border-left:1px solid var(--line)}.label{padding:8px 12px;font-size:12px;font-weight:700;color:#3a4f70;background:#fbfdff;border-bottom:1px solid var(--line)}.summary{padding:10px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#f8fbff;font-size:13px;display:flex;gap:10px;flex-wrap:wrap}.pill{border-radius:999px;padding:2px 8px;font-weight:700;font-size:12px}.pill.added{background:#e7f7ec;color:#166534}.pill.removed{background:#feeaea;color:#9b1c1c}.pill.changed{background:#fff3df;color:#9a5f00}.results{overflow:auto;padding:8px 0 12px;min-height:180px;max-height:32dvh}.diff-row{padding:8px 12px;border-left:4px solid transparent;font-family:Menlo,Consolas,monospace;font-size:12px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.diff-row+.diff-row{border-top:1px solid #eef2fb}.diff-row.added{border-left-color:#16a34a;background:#f6fff8}.diff-row.removed{border-left-color:#dc2626;background:#fff8f8}.diff-row.changed{border-left-color:#d97706;background:#fffdf7}.path{color:#274b76;font-weight:700}.hint{color:#5f6b7c}.empty{padding:14px 12px;color:#3f5f8e;font-size:13px}.footer{max-width:1100px;margin:12px auto 24px;padding:0 16px;color:#5f6b7c;font-size:12px;text-align:center}.footer a{color:#2a4f86;text-decoration:none;font-weight:700}.footer a:hover{text-decoration:underline}[data-theme=dark] body{background:var(--bg)}[data-theme=dark] .navbar-inner{box-shadow:0 10px 26px #0000006b}[data-theme=dark] .brand-title,[data-theme=dark] .home-hero h1,[data-theme=dark] .home-workflow h2,[data-theme=dark] .feature-card h3{color:#f0f2f4}[data-theme=dark] .brand-sub,[data-theme=dark] .home-hero p,[data-theme=dark] .feature-card p,[data-theme=dark] .workflow-item p,[data-theme=dark] .hint,[data-theme=dark] .footer{color:var(--muted)}[data-theme=dark] .nav-links a{color:#b9d8ff}[data-theme=dark] .header,[data-theme=dark] .pane-title,[data-theme=dark] .tree-subtitle,[data-theme=dark] .label,[data-theme=dark] .wrap-toggle,[data-theme=dark] .path,[data-theme=dark] .empty{color:#e8edf5}[data-theme=dark] .theme-toggle-btn{background:#1b3f70;border-color:#3f8cff;color:#eaf3ff}[data-theme=dark] .page-panel,[data-theme=dark] .feature-card,[data-theme=dark] .workflow-item,[data-theme=dark] .tree-wrap,[data-theme=dark] .modal-panel,[data-theme=dark] .ghost-link,[data-theme=dark] .copy-icon-btn,[data-theme=dark] .copy-sub-btn,[data-theme=dark] .view-toggle-btn,[data-theme=dark] .label,[data-theme=dark] .pane-title,[data-theme=dark] .tree-subtitle,[data-theme=dark] .summary{border-color:var(--line)}[data-theme=dark] .feature-card,[data-theme=dark] .workflow-item,[data-theme=dark] .ghost-link,[data-theme=dark] .copy-icon-btn,[data-theme=dark] .copy-sub-btn,[data-theme=dark] .view-toggle-btn{background:var(--surface);color:#bfdbff}[data-theme=dark] .tree-children{border-left-color:#324762}[data-theme=dark] .key.depth-0{color:#ff8fd4}[data-theme=dark] .key.depth-1{color:#74b9ff}[data-theme=dark] .key.depth-2{color:#8fe7ab}[data-theme=dark] .key.depth-3{color:#ffc78f}[data-theme=dark] .key.depth-4{color:#d6b3ff}[data-theme=dark] .key.depth-5{color:#8ae7f4}[data-theme=dark] .node-line:hover{background:#5883c229}[data-theme=dark] .diff-row+.diff-row{border-top-color:#223146}[data-theme=dark] .diff-row.added{background:#0f2a1b}[data-theme=dark] .diff-row.removed{background:#32171a}[data-theme=dark] .diff-row.changed{background:#2f230f}[data-theme=dark] .footer a{color:#8fc2ff}@media(max-width:900px){.app-main{min-height:auto;display:block}.page-panel{display:block}.navbar-inner{flex-direction:column;align-items:stretch;gap:10px}.nav-links{justify-content:flex-start}.split,.tree-split,.diff-panel .inputs{grid-template-columns:1fr}.home-hero h1{font-size:30px}.home-grid,.workflow-list{grid-template-columns:1fr}.pane+.pane,.tree-pane+.tree-pane,.input-pane+.input-pane{border-left:0;border-top:1px solid var(--line)}}