.compare-shell{--compare-text:#17233d;--compare-muted:#6b7894;height:100vh;min-height:100vh;color:var(--compare-text);background:radial-gradient(circle at 8% 8%,#6366f13b,#0000 28%),radial-gradient(circle at 92% 12%,#0ea5e933,#0000 27%),radial-gradient(circle at 58% 100%,#ec48991f,#0000 28%),linear-gradient(145deg,#f8faff,#e9f1ff 55%,#f9effa);padding:14px clamp(14px,3vw,38px) 38px;overflow:auto}.compare-topbar,.compare-heading,.compare-editor-card,.compare-result{-webkit-backdrop-filter:blur(26px)saturate(155%);backdrop-filter:blur(26px)saturate(155%);background:linear-gradient(145deg,#ffffff9e,#ffffff47);border:1px solid #ffffffb8;box-shadow:0 22px 60px #34468221,inset 0 1px #ffffffdb}.compare-topbar{border-radius:18px;justify-content:space-between;align-items:center;gap:18px;max-width:1400px;min-height:58px;margin:0 auto;padding:10px 14px 10px 18px;display:flex}.compare-brand{letter-spacing:-.03em;align-items:center;gap:9px;font-weight:900;display:flex}.compare-brand span{color:#fff;letter-spacing:.02em;background:linear-gradient(135deg,#6366f1,#3b82f6);border-radius:8px;padding:5px 9px;font-size:.66rem}.compare-nav{flex-wrap:wrap;gap:6px;display:flex}.compare-nav a,.compare-editor-card header button{color:#485573;background:#fff6;border:1px solid #ffffffb3;border-radius:10px;align-items:center;min-height:32px;padding:0 12px;font-size:.72rem;font-weight:800;display:inline-flex}.compare-heading{border-radius:22px;justify-content:space-between;align-items:flex-end;gap:24px;max-width:1400px;margin:16px auto;padding:clamp(18px,3vw,30px);display:flex}.compare-kicker{color:#4f46e5;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;font-weight:900}.compare-heading h1{letter-spacing:-.055em;color:#0000;background:linear-gradient(120deg,#172554,#4f46e5 60%,#0891b2);-webkit-background-clip:text;background-clip:text;margin:7px 0;font-size:clamp(2rem,4vw,3.6rem);line-height:1}.compare-heading p{color:var(--compare-muted);margin:0}.compare-stats{flex-wrap:wrap;justify-content:flex-end;gap:7px;display:flex}.compare-stats span{border-radius:9px;padding:7px 10px;font-size:.7rem;font-weight:900}.stat-same{color:#526078;background:#64748b1a}.stat-added{color:#047857;background:#10b9811f}.stat-removed{color:#be123c;background:#f43f5e1c}.stat-modified{color:#b45309;background:#f59e0b21}.compare-editors{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);gap:10px;max-width:1400px;margin:0 auto 16px;display:grid}.compare-editor-card{border-radius:20px;min-width:0;overflow:hidden}.compare-editor-card header,.compare-result-header{background:#ffffff47;border-bottom:1px solid #ffffffad;justify-content:space-between;align-items:center;gap:14px;padding:11px 14px;display:flex}.compare-editor-card header div,.compare-result-header>div:first-child{gap:2px;display:grid}.compare-editor-card header span,.compare-result-header span{font-size:.78rem;font-weight:900}.compare-editor-card header small,.compare-result-header small{color:var(--compare-muted);font-size:.66rem}.compare-editor-card header button{cursor:pointer}.compare-editor-card textarea{resize:vertical;color:#263450;background:#fff3;border:0;outline:0;width:100%;min-height:190px;padding:16px;font-family:SFMono-Regular,Consolas,monospace;font-size:.86rem;line-height:1.7;display:block}.compare-editor-card textarea:focus{background:#fff6;box-shadow:inset 0 0 0 2px #6366f129}.compare-center-actions{align-content:center;gap:8px;display:grid}.compare-center-actions button{color:#fff;background:linear-gradient(135deg,#6366f1,#3b82f6);border:1px solid #ffffff80;border-radius:13px;width:42px;height:42px;font-size:1.1rem;font-weight:900;box-shadow:0 10px 24px #4f46e533,inset 0 1px #ffffff4d}.compare-center-actions button:last-child{color:#64748b;background:#ffffff80}.compare-result{border-radius:22px;max-width:1400px;margin:0 auto;overflow:hidden}.compare-legend{flex-wrap:wrap;gap:12px;display:flex}.compare-legend span{color:var(--compare-muted);align-items:center;gap:5px;font-size:.66rem;display:inline-flex}.compare-legend i{border-radius:50%;width:8px;height:8px}.legend-added{background:#10b981}.legend-removed{background:#f43f5e}.legend-modified{background:#f59e0b}.compare-result-columns,.compare-row{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.compare-result-columns{background:#eaf0ff6b;border-bottom:1px solid #ffffffad}.compare-result-columns span{color:#53617d;text-transform:uppercase;padding:9px 14px;font-size:.68rem;font-weight:900}.compare-result-columns span+span,.compare-cell+.compare-cell{border-left:1px solid #ffffffb8}.compare-row{border-bottom:1px solid #94a3b81a}.compare-row:last-child{border-bottom:0}.compare-cell{grid-template-columns:38px minmax(0,1fr);min-width:0;display:grid}.compare-line-number{color:#8993a8;text-align:right;background:#e2e8f042;padding:9px 8px;font-family:SFMono-Regular,Consolas,monospace;font-size:.68rem}.compare-cell code{color:#33415d;white-space:pre-wrap;word-break:break-word;padding:9px 12px;font-size:.76rem;line-height:1.5}.row-added .compare-cell:last-child{background:#10b9811a}.row-removed .compare-cell:first-child{background:#f43f5e17}.row-modified .compare-cell{background:#f59e0b1a}@media (max-width:760px){.compare-topbar,.compare-heading{flex-direction:column;align-items:flex-start}.compare-editors{grid-template-columns:1fr}.compare-center-actions{grid-template-columns:repeat(2,42px);justify-content:center}.compare-result{overflow-x:auto}.compare-result-header{flex-direction:column;align-items:flex-start}.compare-result-columns,.compare-rows{min-width:680px}}
