:root{--bg:#fff;--bg-secondary:#f8f8f8;--fg:#000;--fg-muted:#666;--border:#e0e0e0;--addition-base:#0dbe4e;--addition-bg:#e6f9ed;--addition-bg-line:#ccf3d8;--deletion-base:#ff2e3f;--deletion-bg:#ffeef0;--deletion-bg-line:#fdd;--modified-base:#009fff;--line-number:#999;--font-ui:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;--font-mono:"SF Mono", Monaco, Consolas, "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-theme=dark]{--bg:#070707;--bg-secondary:#111;--fg:#fbfbfb;--fg-muted:#888;--border:#222;--addition-base:#00cab1;--addition-bg:#0a2620;--addition-bg-line:#0f3a30;--deletion-base:#ff2e3f;--deletion-bg:#2a0a0e;--deletion-bg-line:#3d1015;--modified-base:#009fff;--line-number:#555}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:13px;line-height:20px}body{font-family:var(--font-ui);background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}#app{flex-direction:column;max-width:1200px;min-height:100vh;margin:0 auto;padding:0 24px;display:flex}.header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px 0;display:flex}.header-left{align-items:center;display:flex}.logo{font-family:var(--font-mono);letter-spacing:-.5px;color:var(--fg);font-size:16px;font-weight:600}.logo-accent{color:var(--fg-muted);font-weight:400}.header-right{align-items:center;gap:12px;display:flex}.theme-btn{border:1px solid var(--border);width:32px;height:32px;color:var(--fg-muted);cursor:pointer;background:0 0;justify-content:center;align-items:center;transition:all .15s;display:flex}.theme-btn:hover{color:var(--fg);border-color:var(--fg-muted)}[data-theme=dark] .icon-sun{display:block}[data-theme=dark] .icon-moon,:root:not([data-theme=dark]) .icon-sun,html:not([data-theme=dark]) .icon-sun{display:none}:root:not([data-theme=dark]) .icon-moon,html:not([data-theme=dark]) .icon-moon{display:block}.main{flex-direction:column;flex:1;gap:16px;padding:20px 0;display:flex}.editors{grid-template-columns:1fr 1fr;gap:16px;display:grid}.editor-pane{flex-direction:column;display:flex}.editor-header{align-items:baseline;padding:8px 0;display:flex}.editor-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;color:var(--fg);font-size:12px;font-weight:600}.editor{resize:vertical;width:100%;min-height:200px;max-height:400px;font-family:var(--font-mono);tab-size:2;background:var(--bg-secondary);color:var(--fg);border:1px solid var(--border);outline:none;padding:12px;font-size:13px;line-height:20px;transition:border-color .15s}.editor::placeholder{color:var(--fg-muted);opacity:.6}.editor:focus{border-color:var(--modified-base)}.toolbar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.btn{font-family:var(--font-ui);border:1px solid var(--border);cursor:pointer;text-transform:uppercase;letter-spacing:.5px;padding:8px 20px;font-size:12px;font-weight:600;transition:all .15s}.btn-secondary{color:var(--fg-muted);background:0 0}.btn-secondary:hover{color:var(--fg);border-color:var(--fg-muted)}.diff-section{flex-direction:column;flex:1;display:flex}.diff-header{justify-content:space-between;align-items:center;padding:10px 0;display:flex}.view-toggle{border:1px solid var(--border);display:flex}.toggle-btn{font-family:var(--font-ui);color:var(--fg-muted);cursor:pointer;background:0 0;border:none;padding:6px 16px;font-size:12px;font-weight:500;transition:all .15s}.toggle-btn:hover{color:var(--fg)}.toggle-btn.active{background:var(--fg);color:var(--bg)}.stats{font-family:var(--font-mono);color:var(--fg-muted);gap:12px;font-size:12px;display:flex}.stat-add{color:var(--addition-base);font-weight:600}.stat-del{color:var(--deletion-base);font-weight:600}.diff-output{border:1px solid var(--border);flex:1;min-height:200px;overflow:hidden}.diff-placeholder{height:200px;color:var(--fg-muted);justify-content:center;align-items:center;font-size:13px;display:flex}.diff-split{grid-template-columns:1fr 1fr;display:grid}.diff-split-col{overflow-x:auto}.diff-split-col:first-child{border-right:1px solid var(--border)}.diff-split-col .diff-line{grid-template-columns:48px 1fr;display:grid}.diff-unified .diff-line{grid-template-columns:48px 48px 1fr;display:grid}.diff-line{font-family:var(--font-mono);border-bottom:1px solid #0000;font-size:13px;line-height:20px}.diff-line:hover{background:color-mix(in srgb, var(--fg) 5%, transparent)}.diff-line-num{text-align:right;color:var(--line-number);-webkit-user-select:none;user-select:none;border-right:2px solid var(--border);white-space:nowrap;min-height:20px;padding:0 8px}.diff-line-content{white-space:pre;min-height:20px;padding:0 1ch;overflow-x:auto}.diff-line-content:empty:after{content:" "}.diff-line.addition{background:var(--addition-bg)}.diff-line.addition .diff-line-num{color:var(--addition-base);background:var(--addition-bg-line);border-right-color:var(--addition-base)}.diff-line.addition .diff-line-content .highlight{background:color-mix(in srgb, var(--addition-base) 30%, transparent)}.diff-line.deletion{background:var(--deletion-bg)}.diff-line.deletion .diff-line-num{color:var(--deletion-base);background:var(--deletion-bg-line);border-right-color:var(--deletion-base)}.diff-line.deletion .diff-line-content .highlight{background:color-mix(in srgb, var(--deletion-base) 30%, transparent)}.diff-separator{height:32px;font-family:var(--font-mono);color:var(--fg-muted);background:var(--bg-secondary);border-top:1px solid var(--border);border-bottom:1px solid var(--border);justify-content:center;align-items:center;font-size:11px;display:flex}.footer{border-top:1px solid var(--border);text-align:center;color:var(--fg-muted);padding:20px 0;font-size:12px}.footer a{color:var(--fg);border-bottom:1px solid var(--border);text-decoration:none;transition:border-color .15s}.footer a:hover{border-color:var(--fg)}@media (width<=768px){.editors,.diff-split{grid-template-columns:1fr}.diff-split-col:first-child{border-right:none;border-bottom:1px solid var(--border)}}