:root{color-scheme:light;--bg:#f7f8fa;--surface:#fff;--text:#263244;--muted:#606d80;--border:#dce2eb;--accent:#285fba;--soft:#eaf0fa;--remove:#fff0ed;--add:#eaf7ee;--remove-mark:#ffd0c6;--add-mark:#bce8ca;--shadow:0 8px 32px #26324408}
html[data-theme=dark]{color-scheme:dark;--bg:#15171b;--surface:#1e2026;--text:#edf0f5;--muted:#a8afbd;--border:#363b46;--accent:#9abfff;--soft:#282e3a;--remove:#3f2928;--add:#203c2c;--remove-mark:#733f38;--add-mark:#326344;--shadow:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button,select,.file-button{border:1px solid var(--border);border-radius:7px;background:var(--surface);color:var(--text);padding:8px 12px}button,.file-button,summary{cursor:pointer}button:hover,.file-button:hover{background:var(--soft)}button:disabled{opacity:.5;cursor:default}button{min-height:42px}a{color:var(--accent)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.skip{position:absolute;left:10px;top:-100px;z-index:20;background:var(--surface);padding:10px}.skip:focus{top:10px}.site-header{max-width:1560px;margin:auto;min-height:80px;padding:16px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand{display:inline-flex;align-items:center;gap:7px;text-decoration:none;font-size:18px;font-weight:650;color:var(--text)}.brand strong{color:var(--accent)}.brand-logo{display:block;width:40px;height:40px;object-fit:contain;flex:none;margin-right:3px}nav{display:flex;align-items:center;gap:24px}nav a{text-decoration:none;font-size:14px}main{max-width:1560px;padding:0 24px;margin:auto}.intro{text-align:center;padding:44px 0 30px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;color:var(--accent)}h1{font-size:clamp(30px,4vw,46px);line-height:1.18;letter-spacing:-1.5px;margin:12px 0}h2{font-size:25px;letter-spacing:-.5px}h3{font-size:18px}.intro>p:not(.eyebrow){color:var(--muted);font-size:17px;margin:14px 0}.privacy-note{display:inline-block;font-size:12px;color:var(--accent);background:var(--soft);padding:5px 12px;border-radius:20px}.workspace,.results{background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}.workspace-bar,.editor-heading,.compare-bar,.result-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px}.workspace-bar{border-bottom:1px solid var(--border)}.actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.muted{font-size:12px;color:var(--muted)}.editors{display:grid;grid-template-columns:1fr 1fr}.editor{min-width:0}.editor+.editor{border-left:1px solid var(--border)}.editor-heading{padding:16px 20px 8px}.editor-heading>label:first-child{font-size:13px;font-weight:650}.file-button{font-size:12px;position:relative;overflow:hidden;display:inline-block}.file-button input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.file-button:focus-within{outline:3px solid var(--accent)}textarea{display:block;width:100%;min-height:280px;resize:vertical;border:0;background:var(--surface);color:var(--text);padding:15px 20px;line-height:1.8;font-family:Consolas,monospace;font-size:14px;border-radius:0}textarea:focus{outline:2px solid var(--accent);outline-offset:-3px}textarea::placeholder{color:var(--muted)}.editor-footer{font-size:11px;color:var(--muted);padding:8px 20px;border-top:1px solid var(--border)}.options{display:flex;gap:22px;align-items:center;flex-wrap:wrap;padding:15px 20px;border-top:1px solid var(--border);font-size:12px}.options label{display:flex;align-items:center;gap:7px}input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px}.options select{font-size:12px;padding:5px 10px}.transforms{padding:0 20px 14px;font-size:12px}.transforms p{color:var(--muted)}.transforms button{font-size:12px}.compare-bar{border-top:1px solid var(--border)}.primary{background:var(--accent);color:var(--bg);border-color:var(--accent);font-weight:650;padding:10px 24px}.primary:hover{filter:brightness(.92);background:var(--accent)}#status{font-size:13px;color:var(--muted);min-height:22px}.results{margin:24px 0;scroll-margin-top:12px}.result-toolbar{position:sticky;top:0;z-index:2;background:var(--surface);border-bottom:1px solid var(--border);border-radius:12px 12px 0 0;flex-wrap:wrap}.result-toolbar h2{font-size:16px;margin:0}.legend{font-size:12px;color:var(--muted)}.result-toolbar label{font-size:12px}.result-toolbar button,.result-toolbar select{font-size:12px}.diff-head,.diff-row{display:grid;grid-template-columns:1fr 1fr}.diff-head{font-size:12px;font-weight:650;padding:10px 0;background:var(--soft)}.diff-head span{padding:0 20px}.diff-cell{display:flex;min-width:0;align-items:stretch;font:13px/1.7 Consolas,monospace}.diff-cell+.diff-cell{border-left:1px solid var(--border)}.line-number{flex:none;align-self:stretch;width:calc(var(--line-number-digits, 2) * 1ch + 16px);padding:4px 8px;text-align:right;color:var(--muted);user-select:none;font-size:11px}.marker{display:none}.code{white-space:pre-wrap;overflow-wrap:anywhere;tab-size:4;padding:4px 10px 4px 10px;border-left:1px solid var(--border);min-width:0;flex:1;min-height:30px}.removed,.added{background:transparent}del,ins{text-decoration:none;border-radius:2px;color:inherit}del{background:var(--remove-mark)}ins{background:var(--add-mark)}.diff-row{scroll-margin-top:110px}.unified .diff-head{display:none}.unified .diff-row{display:block}.unified .diff-cell{border:0}.unified .diff-cell.empty,.unified .diff-row.equal .diff-cell:nth-child(2){display:none}.info{padding:42px 0;border-top:1px solid var(--border);margin-top:35px}.info p{color:var(--muted)}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.step{color:var(--accent);font:600 13px monospace}.info-grid h3{margin:12px 0 6px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}.faq{max-width:none;margin:20px 0 60px}.faq details{border-bottom:1px solid var(--border);padding:16px 0}.faq summary{font-weight:600}.faq details p{margin-bottom:0}footer{border-top:1px solid var(--border);max-width:1560px;margin:auto;padding:28px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}footer p{font-size:12px;color:var(--muted)}.document{max-width:820px;padding:40px 24px 70px}.document h1{font-size:36px}.document h2{margin-top:35px}.document p,.document li{color:var(--muted)}.document code{overflow-wrap:anywhere}
@media(max-width:760px){.site-header{padding:14px 18px}.site-header nav>a{display:none}.brand{font-size:16px}.intro{padding:28px 0 22px}main{padding:0 12px}.workspace-bar{align-items:flex-start;flex-direction:column}.editors{grid-template-columns:1fr}.editor+.editor{border-left:0;border-top:1px solid var(--border)}textarea{min-height:200px}.options{gap:12px}.compare-bar>.muted{max-width:150px}.compare-bar{padding:14px 12px}.primary{padding:10px 14px}.info-grid,.detail-grid{grid-template-columns:1fr;gap:22px}.info{padding:25px 8px}.result-toolbar{position:static}.diff-row{scroll-margin-top:12px}.result-toolbar .actions{gap:6px}.line-number{width:calc(var(--line-number-digits, 2) * 1ch + 10px);padding-left:5px;padding-right:5px}.code{font-size:12px}footer nav{gap:18px}.privacy-note{font-size:11px}}
.workspace{scroll-margin-top:16px}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

#compare{scroll-margin-bottom:24px}
.editing-dropdown{position:relative}
.editing-tools{position:absolute;top:calc(100% + 8px);left:0;z-index:5;width:270px;max-width:calc(100vw - 64px);padding:8px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 28px #0002}
.editing-tools p{margin:4px 8px 8px;font-size:12px;color:var(--muted)}
.editing-tools button{display:block;width:100%;border:0;text-align:left;font-size:13px}
.compare-bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.compare-bar>#compare{grid-column:2;grid-row:1;justify-self:center}
.compare-bar>#cancel{grid-column:3;grid-row:1;justify-self:start}
@media(max-width:760px){.compare-bar{grid-template-columns:1fr;text-align:center}.compare-bar>#compare{grid-column:1;grid-row:1}.compare-bar>.muted{grid-column:1;grid-row:2;max-width:none}.compare-bar>#cancel{grid-column:1;grid-row:3;justify-self:center}}


.changed-line-number{background:var(--soft);color:var(--accent);font-weight:700}

#scroll-to-bottom{position:fixed;right:24px;bottom:24px;z-index:10;width:48px;height:48px;padding:0;border-radius:50%;font-size:0;background:var(--accent);color:var(--bg);border-color:var(--accent);box-shadow:0 5px 16px #0003}
#scroll-to-bottom::after{content:"\2193";font-size:22px;line-height:1}
#scroll-to-bottom:hover{background:var(--accent);filter:brightness(.92);transform:translateY(-2px)}
@media(max-width:760px){#scroll-to-bottom{right:16px;bottom:16px;width:44px;height:44px}}