:root{--bg:#f6f6f3;--surface:#fff;--ink:#171817;--muted:#72766f;--line:#dedfd9;--green:#2f6b4f;--green-soft:#e9f3ec;--blue:#2563d9;--blue-soft:#eef5ff;--shadow:0 12px 30px #1c251f14;color:var(--ink);background:var(--bg);font-family:Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-width:320px;margin:0}button,textarea{font:inherit}button{cursor:pointer}.topbar{border-bottom:1px solid var(--line);background:#ffffffb8;align-items:center;gap:24px;height:68px;padding:0 clamp(20px,4vw,58px);display:flex}.brand{color:var(--ink);align-items:center;gap:10px;font-size:21px;font-weight:700;text-decoration:none;display:flex}.brand-mark{color:var(--green);letter-spacing:-8px;font-family:DM Mono,monospace;font-size:25px}.privacy{color:var(--green);background:#fbfdfb;border:1px solid #d8e6dc;border-radius:8px;margin:auto;padding:8px 13px;font-size:14px}.text-button{color:var(--ink);background:0 0;border:0;font-size:14px}.shell{max-width:1424px;margin:25px auto 48px;padding:0 28px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:13px;overflow:hidden;box-shadow:0 4px 13px #1c251f0a}.panel+.panel{margin-top:18px}.panel-heading{justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding:16px 18px 12px 24px;display:flex}.heading-group,.toolbar,.segmented,.menu-actions{align-items:center;gap:10px;display:flex}h1,h2,p{margin:0}h1,h2{letter-spacing:-.5px;font-size:22px}.status-chip,.type-chip{color:var(--green);background:var(--green-soft);border:1px solid #cde2d4;border-radius:7px;padding:5px 10px;font-size:13px;font-weight:600}.type-chip.is-muted{color:var(--muted);background:#f5f5f3;border-color:#e3e3df}.segmented{border:1px solid var(--line);background:#fff;border-radius:8px;gap:0;overflow:hidden}.segmented button{border:0;border-right:1px solid var(--line);color:#4f544e;background:#fff;padding:9px 18px;font-size:14px}.segmented button:last-child{border-right:0}.segmented button.is-active{background:var(--green);color:#fff}.button{border:1px solid var(--line);min-height:38px;color:var(--ink);background:#fff;border-radius:8px;padding:0 13px;font-size:14px;font-weight:600}.button:disabled{cursor:not-allowed;opacity:.42}.button-secondary:hover:not(:disabled){background:#f7f8f6}.button-dark{color:#fff;background:var(--ink);border-color:var(--ink)}.button-primary{color:#fff;background:var(--green);border-color:var(--green)}.editor-wrap{background:#fdfdfc;border:1px solid #d5d6d1;border-radius:8px 8px 0 0;min-height:218px;margin:0 17px;display:flex;overflow:hidden}.line-gutter{color:#777a76;text-align:right;background:#fafaf8;border-right:1px solid #e1e1dd;flex:none;width:56px;padding:18px 17px;font-family:DM Mono,monospace;font-size:14px;line-height:1.7}textarea{resize:vertical;min-height:218px;color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:18px;font:14px/1.7 DM Mono,monospace}.panel-foot{color:#595d57;border:1px solid #d5d6d1;border-top:0;border-radius:0 0 8px 8px;align-items:center;gap:9px;min-height:48px;margin:0 17px;padding:0 16px;font-size:13px;display:flex}.dot{color:#a3a6a0}.inline-run{color:var(--green);background:0 0;border:0;margin-left:auto;font-weight:700}.process-line{min-height:48px;color:var(--green);justify-content:center;align-items:center;gap:9px;font-size:14px;display:flex}.bolt{font-size:24px}.result-area{background:#fdfdfc;border:1px solid #d5d6d1;border-radius:8px 8px 0 0;min-height:300px;margin:0 17px;overflow:auto}.empty-state{color:#62665f;text-align:center;place-content:center;justify-items:center;gap:8px;min-height:298px;display:grid}.empty-state small{color:#969993}.empty-icon{color:#aeb5ac;font-family:DM Mono,monospace;font-size:34px}.code-result{white-space:pre-wrap;overflow-wrap:anywhere;color:#292b28;margin:0;padding:18px;font:14px/1.7 DM Mono,monospace}.binary-result{text-align:center;color:#575b55;padding:32px}.tree{min-width:max-content;padding:14px 12px;font:14px/1.75 DM Mono,monospace}.tree-node{border-left:1px dashed #e5e6e1;margin-left:20px}.tree-row{border-radius:5px;align-items:baseline;gap:6px;width:fit-content;min-width:100%;padding:3px 8px;display:flex}.tree-row:hover{background:#f3f5f2}.tree-row.is-selected{background:var(--blue-soft);outline:1px solid #86b1ff}.tree-toggle{color:#60645f;background:0 0;border:0;width:18px;padding:0}.tree-toggle.is-leaf{visibility:hidden}.tree-key{color:#176541;cursor:copy;font-weight:500}.tree-value{color:#2b2d2a;cursor:copy;white-space:nowrap;text-overflow:ellipsis;max-width:min(980px,75vw);overflow:hidden}.string{color:#bb3a31}.number{color:#2464cf}.boolean,.null{color:#8a4bb4}.bracket{color:#4c504a}.tree-note{color:#848882;margin-left:5px;font-size:12px}.context-menu{z-index:20;width:254px;box-shadow:var(--shadow);background:#fff;border:1px solid #d9ded8;border-radius:10px;padding:14px;position:fixed}.context-menu p{margin-bottom:11px;font-size:14px;font-weight:600}.context-menu small{color:#737770;margin-top:10px;display:block}.modal-backdrop{z-index:30;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#17181761;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:12px;flex-direction:column;width:min(920px,100%);max-height:min(720px,100vh - 48px);display:flex;overflow:hidden;box-shadow:0 20px 65px #00000038}.modal-header{border-bottom:1px solid var(--line);justify-content:space-between;gap:16px;padding:21px 27px 16px;display:flex}.modal-header h2{font-size:21px}.modal-header p{color:var(--muted);margin-top:4px;font-size:13px}.icon-button{background:0 0;border:0;border-radius:7px;width:34px;height:34px;font-size:27px;line-height:1}.icon-button:hover{background:#f3f4f1}.parse-status{color:var(--green);border-bottom:1px solid #e9ece7;padding:12px 27px;font-size:14px}.modal-toolbar{justify-content:space-between;align-items:center;gap:14px;padding:14px 27px;display:flex}.modal-result{background:#fdfdfc;border:1px solid #daddd8;border-radius:8px;flex:1;min-height:0;margin:0 27px;overflow:auto}.modal-footer{color:var(--muted);justify-content:space-between;align-items:center;padding:14px 27px 19px;font-size:13px;display:flex}.html-modal{width:min(1100px,100%);height:min(760px,100vh - 48px)}.html-modal iframe{background:#fff;border:0;flex:1}.toast{z-index:50;color:#fff;box-shadow:var(--shadow);background:#1f2922;border-radius:8px;padding:11px 16px;font-size:14px;position:fixed;bottom:26px;left:50%;transform:translate(-50%)}.is-hidden{display:none!important}@media (width<=760px){.topbar{padding:0 16px}.privacy{display:none}.topbar .text-button{margin-left:auto}.shell{margin-top:12px;padding:0 12px}.panel-heading{flex-direction:column;align-items:flex-start;padding:16px}.toolbar{flex-wrap:wrap;width:100%}.toolbar .segmented{flex:1}.segmented button{flex:1;padding:9px 8px}.editor-wrap,.panel-foot,.result-area{margin:0 10px}.modal-backdrop{padding:10px}.modal-toolbar{flex-direction:column;align-items:stretch;padding:12px}.modal-toolbar .toolbar{justify-content:flex-end}.modal-result{margin:0 12px}.modal-header,.modal-footer{padding-left:16px;padding-right:16px}.tree-value{max-width:56vw}.context-menu{width:min(254px,100vw - 24px)}}.panel-frequent-keys{flex:none}.panel-frequent-keys-popover{z-index:45;position:fixed;right:auto!important}@media (width<=1100px){.panel-heading{align-items:flex-start}.panel-heading>.toolbar{flex-wrap:wrap;justify-content:flex-end}}.editor-wrap,.result-area{background:#fcfcfb;border:0;border-radius:0;margin:0}.panel-foot{border:0;border-top:1px solid #e8eae5;border-radius:0;margin:0}.output-panel .panel-foot{border-top:1px solid #e8eae5}.output-panel .button-dark{color:var(--ink);border-color:var(--line);background:#fff}.output-panel .button-dark:hover:not(:disabled){background:#f7f8f6}.json-viewer{min-width:0}.json-viewer-body{min-height:286px;max-height:80vh;overflow:auto}.input-json-viewer .json-viewer-body{min-height:218px}@media (width<=760px){.editor-wrap,.panel-foot,.result-area{margin:0}}:root{--bg:#f1f2ef;--surface:#fff;--ink:#202420;--muted:#6f776f;--line:#d9ddd8;--green:#2f6b4f;--green-soft:#e8f1eb;--blue:#2d63c8;--blue-soft:#edf3ff;--shadow:0 8px 24px #202a230f}body{color:var(--ink);background:var(--bg)}body .topbar{gap:16px;box-shadow:0 1px #202a2308;background:#fffffff0!important;border-bottom:1px solid #c7ccc6!important;height:56px!important;min-height:56px!important;padding:0 24px!important}body .brand{gap:8px;font-size:16px;font-weight:650}body .brand-name{color:var(--ink);text-decoration:none}body .privacy{background:#fbfdfb;border-radius:6px;padding:6px 10px;font-size:11px}body .topbar .text-button{font-size:12px}body .language-switch{top:13px}body .shell{max-width:1540px;margin:14px auto 32px;padding:0 18px}body .panel{border-color:#c7ccc6;border-radius:8px;box-shadow:0 2px 8px #202a2309}body .panel+.panel{margin-top:0}body .panel-heading{border-bottom:1px solid var(--line);background:#f7f8f6;min-height:58px;padding:9px 12px 8px 16px}body .heading-group,body .toolbar{gap:7px}body h1,body h2{letter-spacing:-.2px;font-size:16px;font-weight:650}body .status-chip,body .type-chip{border-radius:4px;padding:3px 7px;font-size:11px}body .segmented{border-color:#c7ccc6;border-radius:6px}body .segmented button{min-height:32px;padding:6px 13px;font-size:12px}body .button{border-color:#c7ccc6;border-radius:6px;min-height:32px;padding:0 10px;font-size:12px}body .button-secondary:hover:not(:disabled){background:#f2f4f1;border-color:#aeb6ae}body .button:focus-visible,body .segmented button:focus-visible,body .text-button:focus-visible{outline-offset:2px;outline:2px solid #2f6b4f57}body .toolbar-divider{background:#d3d7d2;height:26px;margin:0 2px}body .button-icon{place-items:center;width:13px;margin-right:3px;font-family:DM Mono,monospace;display:inline-grid}body .editor-wrap,body .result-area,body .json-viewer-body{background:#fbfcfa}body .input-panel .editor-wrap{min-height:250px}body .line-gutter{border-right-color:var(--line);color:#8a918a;background:#f4f6f3;width:48px;padding:14px 12px;font-size:12px}body .input-panel textarea{min-height:250px;padding:14px 16px;font-size:13px;line-height:1.75}body .panel-foot{min-height:34px;color:var(--muted);background:#f7f8f6;padding:0 12px;font-size:11px}body .process-line{gap:7px;min-height:38px;font-size:11px}body .process-line .bolt{font-size:17px}body .result-area{min-height:360px}body .empty-state{min-height:358px}body .empty-state .empty-icon{font-size:27px}body .empty-state p{font-size:13px;font-weight:600}body .empty-state small{font-size:11px}body .tree-tools{border-bottom-color:var(--line);background:#f7f8f6;min-height:44px;padding:6px 10px}body .json-search input{background:#fff;border-color:#c7ccc6;border-radius:5px;min-height:30px;font-size:12px}body .tree{padding:10px 8px;font-size:13px;line-height:1.8}body .tree-row{border-radius:3px;min-height:28px;padding:2px 7px}body .context-menu,body .modal,body .frequent-keys-popover{border-color:#c7ccc6;border-radius:8px;box-shadow:0 16px 38px #202a2324}@media (width<=760px){body .topbar{height:56px!important;min-height:56px!important;padding:0 12px!important}body .shell{margin-top:10px;padding:0 10px}body .panel-heading{padding:11px 12px}body .toolbar{gap:6px}body .button{flex:auto}body .process-line{min-height:32px}}html:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0f0c;--surface:#121713;--ink:#ecf8ef;--muted:#849087;--line:#28332b;--green:#52c978;--green-soft:#52c9781c;--blue:#81aaff;--blue-soft:#81aaff24;--shadow:0 14px 36px #00000052}html body{color:var(--ink);background:radial-gradient(circle at 50% -20%,#162219 0,#0b0f0c 42%)}body .topbar{box-shadow:0 1px #52c9780e;background:#0b0f0cf0!important;border-color:#29362d!important}body .brand,body .brand-name,body .topbar .text-button{color:var(--ink)}body .brand-brace{stroke:#eef8f0}body .brand-bolt{fill:var(--green);filter:drop-shadow(0 0 4px #52c97838)}body .privacy{color:var(--green);background:#52c9780b;border-color:#284a34}body .language-switch{background:#111713;border-color:#344239}body .language-switch button{color:#91a097;background:#111713;border-color:#344239}body .language-switch button.is-active{color:#08110b;background:var(--green)}body .panel{background:#121713;border-color:#344239;box-shadow:0 8px 24px #00000038}body .panel-heading{background:#171e19;border-color:#28332b}body .status-chip,body .type-chip{color:var(--green);background:#52c97816;border-color:#305b3d}body .type-chip.is-muted{color:#849087;background:#171e19;border-color:#344239}body .segmented{background:#101511;border-color:#3a493f}body .segmented button{color:#95a199;background:#101511;border-color:#344239}body .segmented button.is-active{color:#07100a;background:var(--green);text-shadow:none}body .button{color:#dce9df;background:#151b17;border-color:#3a493f}body .button-secondary:hover:not(:disabled){color:#f3fff6;background:#1c261f;border-color:#5f7566}body .button-primary{color:#07100a;border-color:var(--green);background:var(--green)}body .button:disabled{color:#69746c;opacity:.5}body .button:focus-visible,body .segmented button:focus-visible,body .text-button:focus-visible{outline-color:#52c97866}body .toolbar-divider{background:#344239}body .editor-wrap,body .result-area,body .json-viewer-body{color:var(--ink);background:#0d120f}body .line-gutter{color:#5f6c63;background:#101612;border-color:#28332b}body textarea{color:#dff4e4;caret-color:var(--green)}body textarea::placeholder{color:#647168}body .panel-foot{color:#849087;background:#151b17;border-color:#28332b}body .process-line{color:var(--green)}body .empty-state{color:#9aa79e}body .empty-state small,body .empty-icon{color:#59675e}body .code-result,body .binary-result{color:#dbe8de}body .tree-tools{background:#151b17;border-color:#28332b}body .tree-tools input,body .json-search input{color:#dce9df;background:#0d120f;border-color:#3a493f}body .tree-tools input::placeholder,body .json-search input::placeholder{color:#68766c}body .tree-tools input:focus,body .json-search input:focus{border-color:var(--green);box-shadow:0 0 0 3px #52c97817}body .tree-node{border-left-color:#2a352d}body .tree-row:hover{background:#172019}body .tree-row.is-selected{background:#52c97817;outline-color:#52c97866}body .tree-row.is-search-match{color:#f3fff6;box-shadow:inset 3px 0 0 var(--green);background:#52c9781a}body .tree-toggle,body .bracket{color:#718077}body .tree-key{color:var(--green)}body .tree-value{color:#dce9df}body .string{color:#ff8e82}body .number{color:#81aaff}body .boolean,body .null{color:#c79bf2}body .tree-note{color:#7e8d83}body .result-meta span:last-child,body .result-meta b{color:#87948b}body .context-menu,body .modal,body .frequent-keys-popover,body .panel-frequent-keys-popover{color:var(--ink);background:#151b17;border-color:#405045;box-shadow:0 18px 48px #00000085,0 0 0 1px #52c97808}body .modal-header,body .modal-footer,body .parse-status{border-color:#2b372e}body .modal-result,body .clipboard-url{color:#dce9df;background:#0d120f;border-color:#3a493f}body .icon-button{color:#dce9df}body .icon-button:hover{background:#202a23}body .modal-backdrop,body .history-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#020503ad}body .history-panel{color:var(--ink);background:#111713f7;border-color:#344239;box-shadow:18px 0 52px #00000080}body .history-header,body .history-footer{color:#87948b;border-color:#2b372e}body .history-header p,body .history-empty,body .history-empty small{color:#7f8c83}body .history-item:hover{background:#19221c}body .history-load strong{color:#e5f2e8}body .history-load span{color:#87948b}body .history-setting,body .auto-scroll-setting{color:#a2afa6;background:#18211b}body .switch{background:#435047!important}body .switch.is-on{background:var(--green)!important}body .frequent-keys-popover p,body .frequent-keys-popover small{color:#859289}body .frequent-key-input input{color:#e3f0e6;background:#0d120f;border-color:#3a493f}body .frequent-key-tag{color:var(--green);background:#52c9781a}body .frequent-key-tag button,body .frequent-key-tag .frequent-key-jump{color:var(--green)}body .frequent-key-tag button:hover{background:#52c97824}body .scroll-top{color:#07100a;border-color:var(--green);background:var(--green);box-shadow:0 0 18px #52c97829}body .scroll-top:hover{color:#07100a;background:#68d489}body .toast{color:#07100a;background:var(--green);box-shadow:0 10px 30px #0000006b,0 0 14px #52c9781f}