/*! JSON Diff — generated bundle. Do not edit by hand.
 *  Sources: css/reset.css, css/variables.css, css/layout.css, css/editor.css, css/diff.css, css/tree.css, css/modal.css, css/responsive.css, css/main.css
 *  Rebuild: node tools/build-css.mjs  (or `--check` to verify it is in sync)
 */
/* css/reset.css */
*,*::before,*::after{box-sizing: border-box}html,body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol{margin: 0;padding: 0}ul,ol{list-style: none}html{-webkit-text-size-adjust: 100%;text-size-adjust: 100%;scroll-behavior: smooth}body{min-height: 100vh;min-height: 100dvh;font-family: var(--font-ui,system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif);font-size: 14px;line-height: 1.6;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-rendering: optimizeLegibility}img,svg,video,canvas{display: block;max-width: 100%}button,input,select,textarea{font: inherit;color: inherit;margin: 0}button{background: none;border: none;cursor: pointer;padding: 0;color: inherit}textarea{resize: none}a{color: inherit;text-decoration: none}table{border-collapse: collapse;border-spacing: 0}code,pre,kbd,samp{font-family: var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace)}[hidden]{display: none !important}:focus-visible{outline: 2px solid var(--color-accent,#58a6ff);outline-offset: 1px}::selection{background: var(--color-selection,rgba(88,166,255,0.35))}.skip-link{position: absolute;left: -9999px;top: 0;z-index: 999;padding: 8px 14px;background: var(--color-accent,#58a6ff);color: #fff;border-radius: 0 0 6px 0}.skip-link:focus{left: 0}
/* css/variables.css */
:root{--color-add: #3fb950;--color-add-bg: rgba(63,185,80,0.12);--color-remove: #f85149;--color-remove-bg: rgba(248,81,73,0.12);--color-change: #d29922;--color-change-bg: rgba(210,153,34,0.12);--color-plain: #c9d1d9;--color-path: #58a6ff;--color-move: #a371f7;--color-accent: #58a6ff;--color-type: #ff7b72;--font-ui: -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;--font-mono: ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono","Courier New",monospace;--font-size-code: 13px;--line-height-code: 21px;--header-height: 48px;--radius-sm: 4px;--radius: 6px;--radius-lg: 10px;--gutter-width: 52px;--shadow-1: 0 1px 2px rgba(0,0,0,0.24);--shadow-2: 0 8px 28px rgba(0,0,0,0.35);--transition: 140ms ease}html[data-theme="dark"]{--bg-app: #0d1117;--bg-panel: #161b22;--bg-panel-2: #1c2128;--bg-elevated: #21262d;--bg-hover: #262c36;--bg-active: #30363d;--bg-input: #0d1117;--bg-overlay: rgba(1,4,9,0.72);--border: #30363d;--border-strong: #444c56;--border-subtle: #21262d;--text-1: #e6edf3;--text-2: #c9d1d9;--text-3: #8b949e;--text-4: #6e7681;--code-key: #79c0ff;--code-string: #a5d6ff;--code-number: #ffa657;--code-bool: #ff7b72;--code-null: #8b949e;--code-punct: #8b949e;--color-selection: rgba(88,166,255,0.32);--gutter-bg: #0d1117;--gutter-text: #484f58;--gutter-text-active: #c9d1d9;--current-line-bg: rgba(110,118,129,0.14);--search-hit-bg: rgba(210,153,34,0.42);--scrollbar-thumb: #484f58;--scrollbar-thumb-hover: #6e7681}html[data-theme="light"]{--bg-app: #ffffff;--bg-panel: #f6f8fa;--bg-panel-2: #ffffff;--bg-elevated: #ffffff;--bg-hover: #eaeef2;--bg-active: #dfe3e8;--bg-input: #ffffff;--bg-overlay: rgba(31,35,40,0.5);--border: #d0d7de;--border-strong: #afb8c1;--border-subtle: #e6e9ec;--text-1: #1f2328;--text-2: #32383f;--text-3: #59636e;--text-4: #818b98;--code-key: #0550ae;--code-string: #0a3069;--code-number: #953800;--code-bool: #cf222e;--code-null: #6e7781;--code-punct: #6e7781;--color-add: #1a7f37;--color-add-bg: rgba(26,127,55,0.1);--color-remove: #cf222e;--color-remove-bg: rgba(207,34,46,0.1);--color-change: #9a6700;--color-change-bg: rgba(154,103,0,0.1);--color-plain: #1f2328;--color-path: #0969da;--color-move: #8250df;--color-accent: #0969da;--color-type: #cf222e;--color-selection: rgba(9,105,218,0.2);--gutter-bg: #f6f8fa;--gutter-text: #8c959f;--gutter-text-active: #1f2328;--current-line-bg: rgba(208,215,222,0.4);--search-hit-bg: rgba(255,212,0,0.5);--scrollbar-thumb: #c6cdd5;--scrollbar-thumb-hover: #afb8c1;--shadow-1: 0 1px 2px rgba(31,35,40,0.08);--shadow-2: 0 8px 28px rgba(31,35,40,0.14)}
/* css/layout.css */
body{background: var(--bg-app);color: var(--text-2);display: flex;flex-direction: column}.app-header{height: var(--header-height);flex: 0 0 auto;display: flex;align-items: center;justify-content: space-between;gap: 12px;padding: 0 14px;background: var(--bg-panel);border-bottom: 1px solid var(--border);position: sticky;top: 0;z-index: 40}.brand{display: flex;align-items: center;gap: 10px;min-width: 0}.brand-mark{display: inline-flex;align-items: center;justify-content: center;width: 28px;height: 28px;border-radius: var(--radius-sm);background: linear-gradient(135deg,var(--color-add),var(--color-remove));color: #fff;font-weight: 700;font-size: 13px;letter-spacing: -1px;flex: 0 0 auto}.brand-text{display: flex;align-items: baseline;gap: 8px;min-width: 0}.brand-text strong{color: var(--text-1);font-size: 15px;letter-spacing: 0.2px}.brand-text small{color: var(--text-3);font-size: 12px;white-space: nowrap}.app-nav{display: flex;align-items: center;gap: 6px;flex-wrap: nowrap;overflow: visible}.nav-btn{padding: 5px 10px;border-radius: var(--radius-sm);color: var(--text-2);font-size: 13px;border: 1px solid transparent;white-space: nowrap;transition: background var(--transition),color var(--transition),border-color var(--transition)}.nav-btn:hover{background: var(--bg-hover);color: var(--text-1)}.nav-btn.is-active{background: var(--bg-active);border-color: var(--border-strong);color: var(--text-1)}.nav-btn-icon{width: 30px;text-align: center;padding: 5px 0}.app-main{flex: 1 1 auto;display: flex;flex-direction: column;gap: 10px;padding: 10px;min-height: 0}.panels{display: grid;grid-template-columns: 1fr 1fr;gap: 10px;min-height: 320px;height: 46vh}.panel{display: flex;flex-direction: column;min-width: 0;min-height: 0;background: var(--bg-panel);border: 1px solid var(--border);border-radius: var(--radius);overflow: hidden}.panel.is-invalid{border-color: var(--color-remove)}.panel-head{flex: 0 0 auto;display: flex;align-items: center;justify-content: space-between;gap: 8px;padding: 5px 8px;border-bottom: 1px solid var(--border);background: var(--bg-panel-2);flex-wrap: wrap}.panel-title{font-size: 12px;font-weight: 600;color: var(--text-1);text-transform: uppercase;letter-spacing: 0.6px;margin: 0}.panel-sub{font-weight: 400;color: var(--text-4);text-transform: none;letter-spacing: 0;margin-left: 4px;font-size: 11px}.panel-tools{display: flex;align-items: center;gap: 3px;flex-wrap: wrap}.action-bar{flex: 0 0 auto;display: flex;align-items: center;gap: 8px;flex-wrap: wrap;padding: 8px 10px;background: var(--bg-panel);border: 1px solid var(--border);border-radius: var(--radius)}.action-spacer{flex: 1 1 auto}.btn{padding: 6px 14px;border-radius: var(--radius-sm);border: 1px solid var(--border);background: var(--bg-elevated);color: var(--text-1);font-size: 13px;transition: background var(--transition),border-color var(--transition),transform var(--transition)}.btn:hover{background: var(--bg-hover);border-color: var(--border-strong)}.btn:active{transform: translateY(1px)}.btn-primary{background: var(--color-accent);border-color: var(--color-accent);color: #fff;font-weight: 600}.btn-primary:hover{background: var(--color-accent);filter: brightness(1.1)}.btn-ghost{background: transparent}.btn[disabled]{opacity: 0.5;cursor: not-allowed}.switch-inline{display: inline-flex;align-items: center;gap: 5px;font-size: 12px;color: var(--text-3);cursor: pointer;user-select: none;white-space: nowrap}.switch-inline input{accent-color: var(--color-accent);width: 14px;height: 14px;cursor: pointer}.switch-inline:hover{color: var(--text-1)}.result-area{flex: 1 1 auto;min-height: 260px;display: flex;flex-direction: column;background: var(--bg-panel);border: 1px solid var(--border);border-radius: var(--radius);overflow: hidden}.result-head{flex: 0 0 auto;display: flex;align-items: center;justify-content: space-between;gap: 10px;padding: 0 8px;border-bottom: 1px solid var(--border);background: var(--bg-panel-2);flex-wrap: wrap}.tabs{display: flex;align-items: center;gap: 2px}.tab{padding: 8px 12px;font-size: 13px;color: var(--text-3);border-bottom: 2px solid transparent;transition: color var(--transition),border-color var(--transition)}.tab:hover{color: var(--text-1)}.tab.is-active{color: var(--text-1);border-bottom-color: var(--color-accent);font-weight: 600}.result-tools{display: flex;align-items: center;gap: 6px;padding: 6px 0;flex-wrap: wrap}.result-body{flex: 1 1 auto;min-height: 0;position: relative;display: flex}.result-pane{display: none;flex: 1 1 auto;min-width: 0;min-height: 0;overflow: auto}.result-pane.is-active{display: flex}.result-empty{position: absolute;inset: 0;display: flex;align-items: center;justify-content: center;color: var(--text-4);font-size: 13px;padding: 20px;text-align: center;pointer-events: none}.stats-bar{flex: 0 0 auto;display: flex;align-items: center;gap: 14px;flex-wrap: wrap;padding: 8px 12px;background: var(--bg-panel);border: 1px solid var(--border);border-radius: var(--radius);font-size: 13px;color: var(--text-3)}.stat b{font-weight: 700;margin-right: 3px;font-variant-numeric: tabular-nums}.stat-add b{color: var(--color-add)}.stat-remove b{color: var(--color-remove)}.stat-change b{color: var(--color-change)}.stat-type b{color: var(--color-type)}.stat-move b{color: var(--color-move)}.stat-total b{color: var(--text-1)}.stats-meta{margin-left: auto;color: var(--text-4);font-size: 12px}.seo-footer{padding: 28px 20px 40px;border-top: 1px solid var(--border);background: var(--bg-panel);color: var(--text-3);font-size: 13px;line-height: 1.8;max-width: 1100px;margin: 0 auto;width: 100%}.seo-footer h1{font-size: 20px;line-height: 1.45;color: var(--text-1);margin-bottom: 10px}.seo-footer h2{font-size: 17px;color: var(--text-1);margin-bottom: 10px}.seo-footer h3{font-size: 14px;color: var(--text-1);margin: 18px 0 8px}.seo-footer p{margin-bottom: 10px}.feature-list{display: grid;grid-template-columns: repeat(auto-fill,minmax(320px,1fr));gap: 6px 20px;margin-bottom: 8px}.feature-list li{position: relative;padding-left: 14px}.feature-list li::before{content: "▸";position: absolute;left: 0;color: var(--color-accent)}.seo-footer code{background: var(--bg-elevated);border: 1px solid var(--border);border-radius: 3px;padding: 1px 5px;font-size: 12px;color: var(--color-path)}.faq details{border: 1px solid var(--border);border-radius: var(--radius-sm);padding: 8px 12px;margin-bottom: 6px;background: var(--bg-panel-2)}.faq summary{cursor: pointer;color: var(--text-1);font-size: 13px;font-weight: 500}.faq p{margin: 8px 0 2px;color: var(--text-3)}.seo-note{margin-top: 18px;color: var(--text-4);font-size: 12px}.noscript{padding: 16px;background: var(--color-change-bg);border: 1px solid var(--color-change);border-radius: var(--radius);margin: 12px;color: var(--text-1)}.seo-toc{display: flex;flex-wrap: wrap;align-items: baseline;gap: 6px 14px;padding: 10px 12px;margin-bottom: 18px;border: 1px solid var(--border-subtle);border-radius: var(--radius);background: var(--bg-panel-2)}.seo-toc-title{color: var(--text-4);font-size: 12px;letter-spacing: 0.06em;text-transform: uppercase}.seo-toc ul{display: flex;flex-wrap: wrap;gap: 4px 14px;margin: 0;padding: 0;list-style: none}.seo-toc a{color: var(--color-accent);font-size: 13px;text-decoration: none}.seo-toc a:hover,.seo-toc a:focus-visible{text-decoration: underline}.seo-table-wrap{margin: 10px 0 18px;overflow-x: auto;border: 1px solid var(--border);border-radius: var(--radius)}.seo-table{width: 100%;min-width: 540px;border-collapse: collapse;font-size: 13px}.seo-table caption{caption-side: top;padding: 8px 12px;border-bottom: 1px solid var(--border-subtle);color: var(--text-4);font-size: 12px;text-align: left}.seo-table th,.seo-table td{padding: 8px 12px;border-bottom: 1px solid var(--border-subtle);text-align: left;vertical-align: top}.seo-table thead th{background: var(--bg-panel-2);color: var(--text-2);font-weight: 600;white-space: nowrap}.seo-table tbody th{font-weight: 600;white-space: nowrap}.seo-table td{color: var(--text-3)}.seo-table tbody tr:last-child th,.seo-table tbody tr:last-child td{border-bottom: 0}.cell-add{color: var(--color-add)}.cell-remove{color: var(--color-remove)}.cell-change{color: var(--color-change)}.cell-type{color: var(--color-type)}.cell-move{color: var(--color-move)}.seo-steps{margin: 10px 0 12px;padding-left: 0;list-style: none;counter-reset: seo-step}.seo-steps li{position: relative;margin-bottom: 10px;padding-left: 32px;counter-increment: seo-step}.seo-steps li::before{content: counter(seo-step);position: absolute;top: 2px;left: 0;display: grid;place-items: center;width: 20px;height: 20px;border: 1px solid var(--border);border-radius: 50%;background: var(--bg-elevated);color: var(--color-accent);font-size: 11px;font-weight: 600}.seo-footer h2[id],.seo-footer h3[id]{scroll-margin-top: 16px}
/* css/editor.css */
.editor{position: relative;flex: 1 1 auto;min-height: 0;display: flex;background: var(--bg-input);overflow: hidden}.editor-gutter{flex: 0 0 var(--gutter-width);width: var(--gutter-width);background: var(--gutter-bg);border-right: 1px solid var(--border-subtle);overflow: hidden;position: relative;user-select: none;contain: strict}.gutter-inner{position: absolute;top: 0;left: 0;right: 0;padding: 8px 0;will-change: transform}.gutter-line{height: var(--line-height-code);line-height: var(--line-height-code);font-family: var(--font-mono);font-size: 11px;color: var(--gutter-text);text-align: right;padding-right: 10px;white-space: nowrap}.gutter-line.is-current{color: var(--gutter-text-active)}.gutter-line.is-error{color: var(--color-remove);font-weight: 700}.editor-main{position: relative;flex: 1 1 auto;min-width: 0;overflow: hidden}.editor-layer{position: absolute;top: 0;left: 0;width: 100%;height: 100%;margin: 0;padding: 8px 12px;border: 0;font-family: var(--font-mono);font-size: var(--font-size-code);line-height: var(--line-height-code);tab-size: 2;white-space: pre;word-wrap: normal;overflow-wrap: normal;will-change: transform}.editor-highlight{z-index: 1;overflow: visible;pointer-events: none;color: var(--text-2);background: transparent;width: max-content;min-width: 100%;padding-right: 40px}.editor-highlight code{display: block;font: inherit;white-space: inherit}.editor-current-line{z-index: 2;pointer-events: none;height: var(--line-height-code);padding: 0;background: var(--current-line-bg);left: 0;right: 0;width: 100%;top: 8px;display: none}.editor-input{z-index: 3;resize: none;background: transparent;color: transparent;caret-color: var(--text-1);overflow: auto;outline: none;border: 0;-webkit-text-fill-color: transparent}.editor-input::placeholder{color: var(--text-4);-webkit-text-fill-color: var(--text-4)}.editor-input::selection{background: var(--color-selection)}.editor.no-highlight .editor-highlight{display: none}.editor.no-highlight .editor-input{color: var(--text-2);-webkit-text-fill-color: var(--text-2)}.tk-key{color: var(--code-key)}.tk-string{color: var(--code-string)}.tk-number{color: var(--code-number)}.tk-bool{color: var(--code-bool)}.tk-null{color: var(--code-null);font-style: italic}.tk-punct{color: var(--code-punct)}.tk-error{color: var(--color-remove);text-decoration: underline wavy var(--color-remove)}mark.hit{background: var(--search-hit-bg);color: inherit;border-radius: 2px}mark.hit.is-current{background: var(--color-accent);color: #fff}.drop-hint{position: absolute;inset: 0;z-index: 10;display: none;align-items: center;justify-content: center;background: var(--bg-overlay);color: var(--text-1);font-size: 13px;border: 2px dashed var(--color-accent);border-radius: var(--radius);pointer-events: none}.panel.is-dragover .drop-hint{display: flex}.field-search{flex: 0 0 auto;display: flex;align-items: center;gap: 6px;padding: 5px 8px;border-bottom: 1px solid var(--border-subtle);background: var(--bg-panel)}.field-search-input{flex: 1 1 auto;min-width: 0;height: 26px;padding: 0 8px;border: 1px solid var(--border);border-radius: var(--radius-sm);background: var(--bg-input);color: var(--text-1);font-size: 12px}.field-search-input:focus{border-color: var(--color-accent);outline: none}.field-search-count{font-size: 11px;color: var(--text-4);font-variant-numeric: tabular-nums;min-width: 34px;text-align: right}.result-search{display: flex;align-items: center;gap: 4px}.result-search-input{width: 180px;flex: 0 0 auto}.icon-btn{padding: 4px 9px;border-radius: var(--radius-sm);border: 1px solid var(--border);background: var(--bg-elevated);color: var(--text-2);font-size: 12px;transition: background var(--transition),color var(--transition),border-color var(--transition);white-space: nowrap}.icon-btn:hover{background: var(--bg-hover);color: var(--text-1);border-color: var(--border-strong)}.icon-btn:active{background: var(--bg-active)}.icon-btn-sm{padding: 4px 7px;min-width: 26px;text-align: center}.editor-status{flex: 0 0 auto;display: flex;align-items: center;gap: 12px;padding: 4px 10px;font-size: 11px;color: var(--text-4);background: var(--bg-panel-2);border-top: 1px solid var(--border-subtle);font-variant-numeric: tabular-nums;flex-wrap: wrap}.editor-status .status-validity.is-valid{color: var(--color-add)}.editor-status .status-validity.is-invalid{color: var(--color-remove)}.editor-status .status-cursor{margin-left: auto}.editor-error{flex: 0 0 auto;padding: 6px 10px;font-size: 12px;font-family: var(--font-mono);background: var(--color-remove-bg);color: var(--color-remove);border-top: 1px solid var(--color-remove);cursor: pointer;white-space: pre-wrap}.editor-error:hover{filter: brightness(1.15)}.editor-input::-webkit-scrollbar,.result-pane::-webkit-scrollbar,.modal-body::-webkit-scrollbar,.tree-view::-webkit-scrollbar,.diff-view::-webkit-scrollbar{width: 11px;height: 11px}.editor-input::-webkit-scrollbar-track,.result-pane::-webkit-scrollbar-track,.modal-body::-webkit-scrollbar-track,.tree-view::-webkit-scrollbar-track,.diff-view::-webkit-scrollbar-track{background: transparent}.editor-input::-webkit-scrollbar-thumb,.result-pane::-webkit-scrollbar-thumb,.modal-body::-webkit-scrollbar-thumb,.tree-view::-webkit-scrollbar-thumb,.diff-view::-webkit-scrollbar-thumb{background: var(--scrollbar-thumb);border-radius: 6px;border: 2px solid transparent;background-clip: content-box}.editor-input::-webkit-scrollbar-thumb:hover,.diff-view::-webkit-scrollbar-thumb:hover{background: var(--scrollbar-thumb-hover);background-clip: content-box}.editor-input::-webkit-scrollbar-corner{background: transparent}
/* css/diff.css */
html[data-theme="dark"]{--row-bg: #161b22;--row-bg-add: #16251a;--row-bg-remove: #251a1a;--row-bg-change: #241f14;--row-bg-type: #241a19}html[data-theme="light"]{--row-bg: #ffffff;--row-bg-add: #e9f6ec;--row-bg-remove: #fdeceb;--row-bg-change: #fbf3e0;--row-bg-type: #fdeceb}.diff-view{flex: 1 1 auto;min-width: 0;font-family: var(--font-mono);font-size: var(--font-size-code);line-height: var(--line-height-code);color: var(--color-plain);overflow: auto;padding: 4px 0;outline: none}.diff-line{display: flex;align-items: flex-start;white-space: pre;min-width: 100%;width: max-content;padding-right: 14px;cursor: pointer;border-left: 2px solid transparent}.diff-line:hover{background: var(--bg-hover)}.diff-line.is-current{background: var(--bg-active);border-left-color: var(--color-accent)}.diff-sign{flex: 0 0 34px;width: 34px;text-align: center;user-select: none;color: var(--text-4);position: sticky;left: 0;z-index: 2;background: var(--row-bg)}.diff-ln{flex: 0 0 46px;width: 46px;text-align: right;padding-right: 10px;color: var(--text-4);user-select: none;position: sticky;left: 34px;z-index: 2;background: var(--row-bg)}.diff-ln.diff-lnb{left: 80px}.diff-path{flex: 0 0 auto;color: var(--color-path);padding: 0 10px 0 2px;user-select: all}.diff-code{flex: 1 1 auto;padding-left: 2px}.diff-badge{display: inline-block;margin-left: 10px;padding: 0 6px;border-radius: 8px;font-size: 10px;line-height: 16px;vertical-align: 1px;border: 1px solid currentColor;opacity: 0.9;font-family: var(--font-ui)}.diff-line.is-add{background: var(--color-add-bg);color: var(--color-add);border-left-color: var(--color-add)}.diff-line.is-add .diff-sign,.diff-line.is-add .diff-ln{color: var(--color-add);background: var(--row-bg-add)}.diff-line.is-add .diff-code{color: var(--color-add)}.diff-line.is-remove{background: var(--color-remove-bg);color: var(--color-remove);border-left-color: var(--color-remove)}.diff-line.is-remove .diff-sign,.diff-line.is-remove .diff-ln{color: var(--color-remove);background: var(--row-bg-remove)}.diff-line.is-remove .diff-code{color: var(--color-remove)}.diff-line.is-change{background: var(--color-change-bg);color: var(--color-change)}.diff-line.is-change .diff-sign,.diff-line.is-change .diff-ln{color: var(--color-change);background: var(--row-bg-change)}.diff-line.is-change .diff-code{color: var(--color-change)}.diff-line.is-type{background: rgba(255,123,114,0.1);color: var(--color-type)}.diff-line.is-type .diff-sign,.diff-line.is-type .diff-ln{color: var(--color-type);background: var(--row-bg-type)}.diff-line.is-type .diff-code{color: var(--color-type)}.diff-line.is-type .diff-badge{color: var(--color-type)}.diff-line.is-move .diff-badge{color: var(--color-move)}.diff-line.is-same .diff-code{color: var(--color-plain)}.diff-line.is-fold{color: var(--text-4);font-style: italic;cursor: pointer}.diff-line.is-fold:hover .diff-code{color: var(--text-2)}.diff-code .tk-key{color: var(--code-key)}.diff-code .tk-string{color: var(--code-string)}.diff-code .tk-number{color: var(--code-number)}.diff-code .tk-bool{color: var(--code-bool)}.diff-code .tk-null{color: var(--code-null);font-style: italic}.diff-code .tk-punct{color: var(--code-punct)}.diff-overview{display: flex;align-items: center;gap: 10px;padding: 6px 12px;border-bottom: 1px solid var(--border-subtle);background: var(--bg-panel-2);font-family: var(--font-ui);font-size: 12px;color: var(--text-3);position: sticky;top: 0;z-index: 3;flex-wrap: wrap}.diff-overview .ov-item{display: inline-flex;align-items: center;gap: 4px}.ov-dot{width: 8px;height: 8px;border-radius: 50%;display: inline-block}.ov-add{background: var(--color-add)}.ov-remove{background: var(--color-remove)}.ov-change{background: var(--color-change)}.ov-type{background: var(--color-type)}.minimap{flex: 0 0 56px;width: 56px;position: relative;align-self: stretch;background: var(--bg-panel-2);border-left: 1px solid var(--border-subtle);cursor: pointer;overflow: hidden}.minimap-canvas{display: block}.minimap-viewport{position: absolute;left: 0;right: 0;background: rgba(88,166,255,0.16);border-top: 1px solid rgba(88,166,255,0.5);border-bottom: 1px solid rgba(88,166,255,0.5);pointer-events: none}.raw-view{display: grid;grid-template-columns: 1fr 1fr;gap: 1px;background: var(--border);min-width: 100%;min-height: 100%}.raw-col{background: var(--bg-input);min-width: 0;display: flex;flex-direction: column}.raw-col-head{position: sticky;top: 0;z-index: 2;padding: 5px 10px;font-family: var(--font-ui);font-size: 12px;color: var(--text-3);background: var(--bg-panel-2);border-bottom: 1px solid var(--border)}.raw-pre{margin: 0;padding: 8px 12px;font-family: var(--font-mono);font-size: var(--font-size-code);line-height: var(--line-height-code);color: var(--color-plain);white-space: pre;overflow: visible}
/* css/tree.css */
.tree-view{flex: 1 1 auto;min-width: 0;padding: 8px 6px 24px;font-family: var(--font-mono);font-size: var(--font-size-code);line-height: 1.9;color: var(--color-plain);overflow: auto}.tree-node{position: relative}.tree-row{display: flex;align-items: flex-start;gap: 6px;padding: 0 8px 0 0;border-radius: var(--radius-sm);cursor: pointer;white-space: pre;min-width: max-content}.tree-row:hover{background: var(--bg-hover)}.tree-row.is-current{background: var(--bg-active);box-shadow: inset 2px 0 0 var(--color-accent)}.tree-toggle{flex: 0 0 auto;width: 16px;color: var(--text-4);text-align: center;user-select: none;font-size: 10px;transition: transform var(--transition)}.tree-toggle.is-open{transform: rotate(90deg)}.tree-toggle.is-leaf{visibility: hidden}.tree-key{color: var(--code-key)}.tree-index{color: var(--text-4)}.tree-colon{color: var(--code-punct)}.tree-value{white-space: pre}.tree-value.is-string{color: var(--code-string)}.tree-value.is-number{color: var(--code-number)}.tree-value.is-boolean{color: var(--code-bool)}.tree-value.is-null{color: var(--code-null);font-style: italic}.tree-value.is-object,.tree-value.is-array{color: var(--text-4)}.tree-type{color: var(--text-4);font-size: 11px;font-family: var(--font-ui)}.tree-children{margin-left: 14px;border-left: 1px dashed var(--border);padding-left: 4px}.tree-children.is-collapsed{display: none}.tree-badge{display: inline-block;padding: 0 6px;border-radius: 8px;font-size: 10px;line-height: 16px;font-family: var(--font-ui);border: 1px solid currentColor;margin-left: 6px;flex: 0 0 auto}.tree-node.is-add > .tree-row{color: var(--color-add);background: var(--color-add-bg)}.tree-node.is-add > .tree-row .tree-value,.tree-node.is-add > .tree-row .tree-key{color: var(--color-add)}.tree-node.is-remove > .tree-row{color: var(--color-remove);background: var(--color-remove-bg)}.tree-node.is-remove > .tree-row .tree-value,.tree-node.is-remove > .tree-row .tree-key{color: var(--color-remove)}.tree-node.is-change > .tree-row{color: var(--color-change);background: var(--color-change-bg)}.tree-node.is-change > .tree-row .tree-value,.tree-node.is-change > .tree-row .tree-key{color: var(--color-change)}.tree-node.is-type > .tree-row{color: var(--color-type);background: rgba(255,123,114,0.1)}.tree-node.is-type > .tree-row .tree-value,.tree-node.is-type > .tree-row .tree-key{color: var(--color-type)}.tree-node.is-same > .tree-row .tree-value.is-string{color: var(--code-string)}.tree-old{color: var(--color-remove);text-decoration: line-through;opacity: 0.85}.tree-new{color: var(--color-add)}.tree-arrow{color: var(--text-4);padding: 0 4px;font-family: var(--font-ui)}.tree-move{color: var(--color-move);font-family: var(--font-ui);font-size: 11px;margin-left: 6px}.tree-empty{padding: 24px;text-align: center;color: var(--text-4);font-family: var(--font-ui)}
/* css/modal.css */
.modal-root{position: fixed;inset: 0;z-index: 80;display: flex;align-items: center;justify-content: center;padding: 20px}.modal-backdrop{position: absolute;inset: 0;background: var(--bg-overlay);backdrop-filter: blur(2px)}.modal-panel{position: relative;z-index: 1;width: min(760px,100%);max-height: min(84vh,900px);display: flex;flex-direction: column;background: var(--bg-panel);border: 1px solid var(--border-strong);border-radius: var(--radius-lg);box-shadow: var(--shadow-2);animation: modal-in 160ms ease}@keyframes modal-in{from{opacity: 0;transform: translateY(8px) scale(0.99)}to{opacity: 1;transform: none}}.modal-head{flex: 0 0 auto;display: flex;align-items: center;justify-content: space-between;gap: 10px;padding: 12px 14px;border-bottom: 1px solid var(--border)}.modal-title{font-size: 15px;color: var(--text-1);font-weight: 600}.modal-body{flex: 1 1 auto;min-height: 0;overflow: auto;padding: 14px;color: var(--text-2);font-size: 13px}.modal-foot{flex: 0 0 auto;display: flex;align-items: center;justify-content: flex-end;gap: 8px;padding: 10px 14px;border-top: 1px solid var(--border);background: var(--bg-panel-2);flex-wrap: wrap}.form-row{margin-bottom: 16px}.form-label{display: block;font-size: 12px;font-weight: 600;color: var(--text-1);margin-bottom: 4px}.form-hint{display: block;font-size: 11px;color: var(--text-4);margin-top: 3px;line-height: 1.5}.form-input,.form-textarea,.form-select{width: 100%;padding: 6px 9px;border: 1px solid var(--border);border-radius: var(--radius-sm);background: var(--bg-input);color: var(--text-1);font-size: 13px}.form-textarea{min-height: 84px;font-family: var(--font-mono);font-size: 12px;line-height: 1.6;resize: vertical}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color: var(--color-accent);outline: none}.check-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(190px,1fr));gap: 8px 14px}.check-item{display: flex;align-items: center;gap: 7px;font-size: 13px;color: var(--text-2);cursor: pointer}.check-item input{accent-color: var(--color-accent);width: 15px;height: 15px;cursor: pointer}.list-item{display: flex;align-items: center;gap: 10px;padding: 8px 10px;border: 1px solid var(--border);border-radius: var(--radius-sm);background: var(--bg-panel-2);margin-bottom: 6px;transition: border-color var(--transition),background var(--transition)}.list-item:hover{border-color: var(--border-strong);background: var(--bg-hover)}.list-item-main{flex: 1 1 auto;min-width: 0}.list-item-title{font-size: 13px;color: var(--text-1);font-weight: 500;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.list-item-meta{font-size: 11px;color: var(--text-4);margin-top: 2px;display: flex;gap: 10px;flex-wrap: wrap}.list-item-actions{display: flex;gap: 4px;flex: 0 0 auto}.list-empty{padding: 34px 10px;text-align: center;color: var(--text-4);font-size: 13px}.tool-section{margin-bottom: 18px}.tool-section h3{font-size: 13px;color: var(--text-1);margin-bottom: 8px}.tool-output{margin-top: 10px;padding: 10px;background: var(--bg-input);border: 1px solid var(--border);border-radius: var(--radius-sm);font-family: var(--font-mono);font-size: 12px;line-height: 1.65;color: var(--text-2);max-height: 260px;overflow: auto;white-space: pre-wrap;word-break: break-all}.decode-steps{display: flex;flex-direction: column;gap: 6px;margin-top: 10px}.decode-step{border: 1px solid var(--border);border-radius: var(--radius-sm);background: var(--bg-panel-2);overflow: hidden}.decode-step-head{display: flex;align-items: center;justify-content: space-between;gap: 8px;padding: 5px 10px;font-size: 11px;color: var(--text-3);background: var(--bg-elevated);border-bottom: 1px solid var(--border-subtle)}.decode-step-body{padding: 8px 10px;font-family: var(--font-mono);font-size: 12px;color: var(--text-2);white-space: pre-wrap;word-break: break-all;max-height: 160px;overflow: auto}.toast-root{position: fixed;right: 16px;bottom: 16px;z-index: 120;display: flex;flex-direction: column;gap: 8px;align-items: flex-end;pointer-events: none}.toast{pointer-events: auto;min-width: 200px;max-width: 380px;padding: 9px 13px;border-radius: var(--radius);border: 1px solid var(--border-strong);background: var(--bg-elevated);color: var(--text-1);font-size: 13px;box-shadow: var(--shadow-2);animation: toast-in 180ms ease;display: flex;align-items: flex-start;gap: 8px}.toast.is-hiding{animation: toast-out 160ms ease forwards}.toast-icon{flex: 0 0 auto;font-weight: 700}.toast.is-success{border-left: 3px solid var(--color-add)}.toast.is-success .toast-icon{color: var(--color-add)}.toast.is-error{border-left: 3px solid var(--color-remove)}.toast.is-error .toast-icon{color: var(--color-remove)}.toast.is-warn{border-left: 3px solid var(--color-change)}.toast.is-warn .toast-icon{color: var(--color-change)}.toast.is-info{border-left: 3px solid var(--color-accent)}.toast.is-info .toast-icon{color: var(--color-accent)}@keyframes toast-in{from{opacity: 0;transform: translateY(8px)}to{opacity: 1;transform: none}}@keyframes toast-out{to{opacity: 0;transform: translateY(6px)}}
/* css/responsive.css */
@media (max-width: 1180px){.panels{height: 42vh}.brand-text small{display: none}}@media (max-width: 900px){.app-main{padding: 8px;gap: 8px}.panels{grid-template-columns: 1fr;height: auto;gap: 8px}.panel{height: 30vh;min-height: 200px}.app-nav{gap: 2px}.nav-btn{padding: 5px 7px;font-size: 12px}.action-bar{gap: 6px}.btn{padding: 6px 10px;font-size: 12px}.raw-view{grid-template-columns: 1fr}.stats-meta{margin-left: 0;flex-basis: 100%}}@media (max-width: 640px){:root{--gutter-width: 42px;--font-size-code: 12px}.app-header{padding: 0 8px;gap: 6px}.brand-mark{display: none}.nav-btn{padding: 4px 6px;font-size: 11px}.panel-tools .icon-btn{padding: 3px 6px;font-size: 11px}.panel{height: 28vh;min-height: 180px}.field-search{padding: 4px 6px}.result-tools{gap: 4px}.seo-footer{padding: 20px 14px 32px}.feature-list{grid-template-columns: 1fr}.modal-root{padding: 8px}.toast-root{left: 10px;right: 10px;bottom: 10px;align-items: stretch}.toast{max-width: none}.diff-sign{flex-basis: 22px;width: 22px}.diff-ln{flex-basis: 38px;width: 38px;left: 22px}}@media print{.app-header,.action-bar,.panel-tools,.field-search,.result-head,.stats-bar,.seo-footer,.toast-root,.modal-root{display: none !important}.panels{height: auto;display: block}.panel{height: auto;border: 1px solid #ccc}}@media (prefers-reduced-motion: reduce){*{animation-duration: 0.001ms !important;transition-duration: 0.001ms !important}}
/* css/main.css */
html,body{height: 100%}body{overflow: hidden}.app-shell{flex: 1 1 auto;min-height: 0;overflow-y: auto;overflow-x: hidden;display: flex;flex-direction: column;overscroll-behavior: contain}.app-main{flex: 0 0 auto;min-height: calc(100vh - var(--header-height) - 120px);max-width: 1800px;width: 100%;margin: 0 auto}@media (max-width: 900px){.app-main{min-height: 0}}.seo-footer{flex: 0 0 auto}.is-hidden{display: none !important}.is-blurred{filter: blur(4px);user-select: none;pointer-events: none}.text-muted{color: var(--text-4)}.spin{animation: spin 900ms linear infinite;display: inline-block}@keyframes spin{to{transform: rotate(360deg)}}.loading-mask{position: absolute;inset: 0;display: flex;align-items: center;justify-content: center;gap: 8px;background: var(--bg-overlay);color: var(--text-1);font-size: 13px;z-index: 20}kbd{display: inline-block;padding: 1px 5px;border: 1px solid var(--border-strong);border-bottom-width: 2px;border-radius: 3px;background: var(--bg-elevated);font-size: 11px;color: var(--text-2);font-family: var(--font-mono)}.shortcut-table{width: 100%;font-size: 13px}.shortcut-table td{padding: 5px 6px;border-bottom: 1px solid var(--border-subtle);color: var(--text-2)}.shortcut-table td:first-child{width: 220px;color: var(--text-1)}.shortcut-table tr:last-child td{border-bottom: 0}