:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;background:#f5f7fb;color:#18202f;--panel: #ffffff;--panel-strong: #f9fbff;--line: #dce3ee;--muted: #657084;--text: #18202f;--brand: #155e75;--brand-strong: #0e7490;--added: #087f5b;--added-bg: #e7f7ef;--removed: #b42318;--removed-bg: #fff0ed;--modified: #8a5a00;--modified-bg: #fff7da;--focus: #2563eb}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:18px}.topbar,.utility-band,.workspace,.result-panel{max-width:1680px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px}.brand{display:flex;align-items:center;gap:12px;min-width:220px}.brand-mark{display:grid;width:42px;height:42px;place-items:center;border:1px solid #9dd3dd;border-radius:8px;color:#064e63;background:#e6f8fb}.brand h1,.brand p,.panel-title h2,.editor-title h2,.result-header h2,.result-header p{margin:0}.brand h1{font-size:22px;line-height:1.05}.brand p,.result-header p,.status,.message{color:var(--muted);font-size:13px}.toolbar,.result-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.select-field,.text-field{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.select-field select,.text-field input{height:34px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text)}.select-field select{min-width:138px;padding:0 34px 0 10px}.text-field input{width:100%;padding:0 10px}.text-field.compact{width:178px}.text-field.wide{flex:1 1 320px;min-width:260px}.icon-button,.square-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px;background:#fff;color:#253044;transition:border-color .12s ease,background .12s ease,transform .12s ease}.icon-button{min-height:34px;gap:7px;padding:0 11px}.square-button{width:34px;height:34px;flex:0 0 auto}.icon-button:hover,.square-button:hover{border-color:#9ab0c9;background:#f8fbff}.icon-button:disabled,.square-button:disabled{cursor:not-allowed;opacity:.46}.icon-button:active,.square-button:active{transform:translateY(1px)}.icon-button.primary{border-color:var(--brand);background:var(--brand);color:#fff}.tools-menu{position:relative}.tools-menu-panel{position:absolute;z-index:20;top:calc(100% + 7px);right:0;width:min(320px,calc(100vw - 28px));border:1px solid var(--line);border-radius:8px;padding:6px;background:#fff;box-shadow:0 18px 45px #0f172a29}.tools-menu-panel a{display:grid;grid-template-columns:22px minmax(0,1fr) 18px;align-items:center;gap:10px;min-height:54px;border-radius:6px;padding:9px 10px;color:#213048;text-decoration:none}.tools-menu-panel a:hover{background:#f5f9ff}.tools-menu-panel strong,.tools-menu-panel small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tools-menu-panel strong{font-size:13px}.tools-menu-panel small{margin-top:2px;color:var(--muted);font-size:12px}.utility-band{position:relative;z-index:5;margin-top:2px;border:1px solid var(--line);border-radius:8px;padding:7px;background:#ffffffeb}.utility-summary{display:flex;align-items:center;justify-content:space-between;gap:10px}.summary-metrics,.utility-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}.summary-pill{display:inline-flex;align-items:center;gap:7px;min-height:30px;border:1px solid #d8e2ee;border-radius:6px;padding:0 9px;background:#f8fbff}.summary-pill span,.summary-message{color:var(--muted);font-size:12px}.summary-pill strong{color:#1f2b3d;font-size:13px}.summary-message{overflow:hidden;max-width:340px;text-overflow:ellipsis;white-space:nowrap}.utility-actions{justify-content:flex-end}.utility-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:30px;border:1px solid var(--line);border-radius:6px;padding:0 9px;color:#253044;background:#fff;font-size:13px;font-weight:700;transition:border-color .12s ease,background .12s ease,color .12s ease,transform .12s ease}.utility-toggle:hover,.utility-toggle.active{border-color:var(--brand);background:#e6f8fb;color:#064e63}.utility-toggle:active{transform:translateY(1px)}.floating-diff-nav{position:fixed;top:50%;right:max(14px,calc((100vw - 1680px)/2 + 14px));z-index:30;display:flex;width:42px;flex-direction:column;align-items:center;gap:7px;border:1px solid #c9d7e8;border-radius:8px;padding:7px 4px;background:#fffffff5;box-shadow:0 10px 24px #0f172a24;transform:translateY(-50%)}.floating-diff-count{display:grid;min-width:34px;place-items:center;color:var(--muted);font-size:11px;line-height:1.15}.floating-diff-count strong{color:#1f2b3d;font-size:13px}.utility-drawer{margin-top:7px;border-top:1px solid var(--line);padding-top:8px}.control-band,.stats-band{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.control-band,.stats-band{min-width:0}.open-source-band{display:grid;grid-template-columns:minmax(240px,1.2fr) minmax(220px,auto) auto;gap:12px;align-items:center;min-width:0}.open-source-title{display:flex;align-items:center;gap:10px;min-width:0;color:#18202f}.open-source-title>svg{flex:0 0 auto;color:#0f172a}.open-source-title strong,.open-source-title span{display:block}.open-source-title strong{font-size:14px}.open-source-title span{margin-top:2px;color:var(--muted);font-size:12px}.open-source-points,.open-source-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.open-source-points span{display:inline-flex;align-items:center;gap:5px;min-height:26px;border:1px solid #d6e4f3;border-radius:999px;padding:0 9px;color:#334155;background:#fff;font-size:12px;font-weight:700}.open-source-points svg{color:var(--added)}.open-source-actions{position:relative;z-index:2;justify-content:flex-end}.open-source-link{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:32px;border:1px solid #c7d6e8;border-radius:6px;padding:0 10px;color:#1f2b3d;background:#fff;font-size:13px;font-weight:750;text-decoration:none;pointer-events:auto;transition:border-color .12s ease,background .12s ease,color .12s ease,transform .12s ease}.open-source-link:hover{border-color:var(--brand);background:#eef8fb;color:#064e63}.open-source-link:active{transform:translateY(1px)}.open-source-link.star{border-color:#e2b84b;color:#5f4300;background:#fff8df}.open-source-link.star:hover{border-color:#c99400;background:#ffefb0;color:#3d2a00}.toggle{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 10px;border:1px solid var(--line);border-radius:6px;color:#253044;background:#fff}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle span{position:relative;width:34px;height:18px;border-radius:999px;background:#cbd5e1}.toggle span:after{position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:#fff;content:"";transition:left .12s ease,background .12s ease}.toggle input:checked+span{background:var(--brand-strong)}.toggle input:checked+span:after{left:19px}.toggle strong{font-size:13px;font-weight:650}.metric{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--panel-strong)}.metric span{color:var(--muted);font-size:12px}.metric strong{font-size:14px}.metric-icon{display:grid;place-items:center;color:var(--brand)}.metric.added strong,.type-pill.added,.nav-item.added span{color:var(--added)}.metric.removed strong,.type-pill.removed,.nav-item.removed span{color:var(--removed)}.metric.modified strong,.type-pill.modified,.nav-item.modified span{color:var(--modified)}.message{margin-left:auto}.workspace{display:grid;grid-template-columns:minmax(0,1fr) var(--navigator-width, 300px);gap:12px;align-items:stretch;margin-top:12px;transition:grid-template-columns .16s ease}.editors{display:grid;grid-template-columns:minmax(240px,var(--left-editor-size, 1fr)) 44px minmax(240px,var(--right-editor-size, 1fr));gap:10px;min-width:0}.between-tools{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}.sync-scroll-toggle{display:inline-flex;width:34px;height:34px}.sync-scroll-toggle input{position:absolute;opacity:0;pointer-events:none}.sync-scroll-toggle span{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px;background:#fff;color:#253044;transition:border-color .12s ease,background .12s ease,color .12s ease,transform .12s ease}.sync-scroll-toggle:hover span{border-color:#9ab0c9;background:#f8fbff}.sync-scroll-toggle input:checked+span{border-color:var(--brand);background:#e6f8fb;color:#064e63}.editor-resize-handle{display:inline-flex;width:28px;height:82px;align-items:center;justify-content:center;border:1px solid #c9d4e3;border-radius:999px;background:#f7fafc;color:#607086;cursor:col-resize;touch-action:none}.editor-resize-handle:hover,.editor-resize-handle:focus-visible{border-color:var(--brand-strong);background:#e6f8fb;color:#064e63}.editor-pane,.navigator,.result-panel{border:1px solid var(--line);border-radius:8px;background:var(--panel);min-width:0}.editor-title,.panel-title,.result-header{display:flex;align-items:center;gap:10px}.editor-title{justify-content:space-between;min-height:56px;padding:10px 12px;border-bottom:1px solid var(--line)}.editor-title h2,.panel-title h2,.result-header h2{font-size:15px}.status.error{color:var(--removed)}.hidden-input{display:none}.plain-editor{display:grid;grid-template-columns:minmax(0,1fr);min-height:390px;background:#fbfdff}.plain-editor.with-line-numbers{grid-template-columns:54px minmax(0,1fr)}.input-line-gutter{overflow:hidden;border-right:1px solid var(--line);padding:14px 8px;color:#7a8799;background:#f3f6fa;font:13px/1.55 SFMono-Regular,Consolas,Liberation Mono,monospace;text-align:right;-webkit-user-select:none;user-select:none;white-space:pre}.plain-editor textarea{display:block;width:100%;min-height:390px;resize:vertical;border:0;outline:0;padding:14px;color:#101827;background:#fbfdff;font:13px/1.55 SFMono-Regular,Consolas,Liberation Mono,monospace;-moz-tab-size:2;tab-size:2}.editor-diff-view{min-height:390px;max-height:620px;overflow:auto;background:#fbfdff;font:13px/1.55 SFMono-Regular,Consolas,Liberation Mono,monospace}.editor-code-line{display:grid;grid-template-columns:minmax(0,1fr);min-height:24px;border-bottom:1px solid rgba(220,227,238,.55)}.editor-diff-view.with-line-numbers .editor-code-line{grid-template-columns:54px minmax(0,1fr)}.editor-code-gutter{padding:3px 8px;border-right:1px solid var(--line);color:#7a8799;background:#f3f6fa;text-align:right;-webkit-user-select:none;user-select:none}.editor-code-content{min-width:0;margin:0;padding-top:3px;padding-right:12px;padding-bottom:3px;color:#101827;white-space:pre-wrap;word-break:break-word}.editor-code-line.added .editor-code-content{background:var(--added-bg)}.editor-code-line.removed .editor-code-content{background:var(--removed-bg)}.editor-code-line.modified .editor-code-content{background:var(--modified-bg)}.editor-code-line.child-diff .editor-code-content{background:#eef7ff}.fold-button,.fold-spacer{display:inline-flex;width:17px;height:17px;margin-right:4px;vertical-align:-3px}.fold-button{align-items:center;justify-content:center;border:0;border-radius:4px;background:transparent;color:#526074;padding:0}.fold-button:hover{background:#dce8f5;color:#1f2b3d}.editor-code-empty{min-height:390px}.code-diff-editor{background:#fbfdff}.cm-line.cm-diff-added{background:var(--added-bg)}.cm-line.cm-diff-removed{background:var(--removed-bg)}.cm-line.cm-diff-modified{background:var(--modified-bg)}.cm-line.cm-selected-diff-line{background:#dff4ff;box-shadow:inset 3px 0 0 var(--focus)}.cm-selected-diff-token{border-radius:3px;background:#9ee7ff;color:#083344;font-weight:800}.cm-inline-diff{border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 2px;font-weight:750}.cm-inline-added{background:#bdeccf;color:#065f46}.cm-inline-removed{background:#ffc9c2;color:#8f1d14}.cm-folded-unchanged{margin:2px 10px;border:1px dashed #b8c5d6;border-radius:6px;padding:4px 10px;color:#64748b;background:#f4f7fb;font:12px/1.4 SFMono-Regular,Consolas,Liberation Mono,monospace}.navigator{display:flex;flex-direction:column;overflow:hidden;min-height:446px;max-height:678px;transition:width .16s ease,opacity .16s ease}.panel-title{min-height:48px;padding:0 12px;border-bottom:1px solid var(--line);color:#26344d}.navigator-toggle{flex:0 0 auto}.navigator.collapsed .panel-title{min-height:48px;justify-content:center;border-bottom:0;padding:6px 4px}.diff-nav-list{flex:1 1 auto;min-height:0;overflow:auto;padding:8px}.nav-item{display:grid;width:100%;grid-template-columns:46px minmax(0,1fr);gap:8px;align-items:center;margin-bottom:6px;border:1px solid transparent;border-radius:6px;background:transparent;padding:8px;text-align:left}.nav-item:hover,.nav-item.active{border-color:#bfd4ee;background:#f3f8ff}.nav-item span{font-size:12px;font-weight:700}.nav-item strong{overflow:hidden;color:#26344d;font:12px/1.35 SFMono-Regular,Consolas,Liberation Mono,monospace;text-overflow:ellipsis;white-space:nowrap}.nav-empty,.empty-state{padding:28px 18px;color:var(--muted);text-align:center}.result-panel{margin-top:12px;overflow:hidden}.result-header{justify-content:space-between;min-height:58px;padding:10px 12px;border-bottom:1px solid var(--line)}.structured-table,.text-table{overflow:auto}.structured-row{display:grid;width:100%;grid-template-columns:94px minmax(180px,.9fr) minmax(180px,1fr) minmax(180px,1fr);gap:0;border:0;border-bottom:1px solid var(--line);background:#fff;padding:0;color:var(--text);text-align:left}.structured-row.header,.text-row.header{position:sticky;top:0;z-index:1;background:#edf3fa;color:#41506a;font-size:12px;font-weight:750}.structured-row>div,.structured-row>code,.structured-row>pre{min-width:0;margin:0;border-right:1px solid var(--line);padding:10px 12px;white-space:pre-wrap;word-break:break-word}.structured-row>code,.structured-row>pre{font:12px/1.5 SFMono-Regular,Consolas,Liberation Mono,monospace}.structured-row:hover,.structured-row.active{background:#f4f9ff}.structured-row.added>pre:last-child,.text-row.added>pre:last-child{background:var(--added-bg)}.structured-row.removed>pre:nth-child(3),.text-row.removed>pre:nth-child(2){background:var(--removed-bg)}.structured-row.modified>pre,.text-row.modified>pre{background:var(--modified-bg)}.inline-diff{border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 2px;font-weight:750}.inline-diff.added{background:#bdeccf;color:#065f46}.inline-diff.removed{background:#ffc9c2;color:#8f1d14}.type-pill{display:inline-flex;align-items:center;justify-content:center;min-width:42px;min-height:23px;border:1px solid currentColor;border-radius:999px;padding:0 8px;font-size:12px;font-weight:750}.text-row{display:grid;grid-template-columns:54px minmax(260px,1fr) 54px minmax(260px,1fr);min-width:760px;border-bottom:1px solid var(--line)}.text-row>div,.text-row>pre{min-height:31px;margin:0;border-right:1px solid var(--line);padding:7px 10px}.text-row>pre{overflow:visible;white-space:pre-wrap;word-break:break-word;font:12px/1.45 SFMono-Regular,Consolas,Liberation Mono,monospace}.line-number{color:var(--muted);background:#f7f9fc;font:12px/1.45 SFMono-Regular,Consolas,Liberation Mono,monospace;text-align:right}@media(max-width:1180px){.topbar{align-items:flex-start;flex-direction:column}.toolbar,.result-actions{justify-content:flex-start}.utility-summary{align-items:flex-start;flex-direction:column}.utility-actions{justify-content:flex-start}.open-source-band{grid-template-columns:1fr}.open-source-actions{justify-content:flex-start}.workspace{grid-template-columns:1fr}.navigator{order:2;min-height:0;max-height:360px}.navigator.collapsed .panel-title{min-height:44px;justify-content:flex-start;border-bottom:0;padding:5px}}@media(max-width:820px){.app-shell{padding:10px}.floating-diff-nav{top:auto;right:12px;bottom:12px;flex-direction:row;width:auto;padding:5px;transform:none}.editors{grid-template-columns:1fr}.between-tools{flex-direction:row}.editor-resize-handle{display:none}.editor-pane textarea{min-height:260px}.structured-row{min-width:860px}.message{width:100%;margin-left:0}}
