.diff{display:grid;gap:var(--space-5);font-family:var(--font-body);color:var(--text-body)}.diff__controls{display:grid;gap:var(--space-4)}.diff__panes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-4)}@media(max-width:720px){.diff__panes{grid-template-columns:minmax(0,1fr)}}.diff__pane{display:flex;flex-direction:column}.diff__label{display:block;font-weight:var(--weight-semibold);font-size:var(--size-step--1);color:var(--text-strong);margin-bottom:.4rem}.diff__textarea{width:100%;min-height:14rem;padding:.85rem 1rem;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:var(--surface-elevated);color:var(--text-strong);font-family:var(--font-mono);font-size:var(--size-step--1);line-height:var(--leading-snug);resize:vertical;transition:border-color var(--duration-fast) var(--ease-out)}.diff__textarea:focus-visible{border-color:var(--border-focus);box-shadow:var(--shadow-focus);outline:none}.diff__toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--space-4);justify-content:space-between}.diff__format{display:flex;flex-direction:column;gap:.35rem}.diff__format-label{font-size:var(--size-step--2);font-weight:var(--weight-semibold);color:var(--text-strong);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.diff__select{padding:.55rem .75rem;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:var(--surface-elevated);color:var(--text-strong);font:inherit;min-width:10rem}.diff__select:focus-visible{border-color:var(--border-focus);box-shadow:var(--shadow-focus);outline:none}.diff__actions{display:flex;flex-wrap:wrap;gap:.55rem}.diff__btn{display:inline-flex;align-items:center;gap:.35rem;padding:.6rem 1rem;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:var(--surface-elevated);color:var(--text-strong);font:inherit;font-weight:var(--weight-medium);cursor:pointer;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out)}.diff__btn:hover:not(:disabled){background:var(--surface-muted)}.diff__btn:disabled{opacity:.5;cursor:not-allowed}.diff__btn--primary{background:var(--color-ink);color:var(--text-on-inverted);border-color:var(--color-ink)}.diff__btn--primary:hover:not(:disabled){background:color-mix(in oklab,var(--color-ink) 85%,var(--text-link))}.diff__btn--ghost{background:transparent;border-color:var(--border-subtle);color:var(--text-muted)}.diff__results{display:grid;gap:var(--space-4);padding:var(--space-5);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);background:var(--surface-elevated);box-shadow:var(--shadow-sm)}.diff__results-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3)}.diff__results-header h3{font-family:var(--font-display);font-size:var(--size-step-1);margin:0;color:var(--text-strong)}.diff__stats{margin:0;display:inline-flex;flex-wrap:wrap;align-items:center;gap:.55rem;font-size:var(--size-step--1);color:var(--text-muted)}.diff__stat strong{font-family:var(--font-mono);color:var(--text-strong)}.diff__stat[data-tone=added] strong{color:var(--color-success)}.diff__stat[data-tone=removed] strong{color:var(--color-danger)}.diff__stat[data-tone=changed] strong{color:var(--color-warn)}.diff__sep{color:var(--text-muted);opacity:.6}.diff__notes{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-muted);padding:.55rem .85rem;font-size:var(--size-step--2);color:var(--text-muted)}.diff__notes summary{cursor:pointer;font-weight:var(--weight-semibold);color:var(--text-strong)}.diff__notes ul{margin:.4rem 0 0;padding-inline-start:1.2rem;display:flex;flex-direction:column;gap:.25rem}.diff__empty{margin:0;color:var(--text-muted);font-size:var(--size-step--1)}.diff__rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.2rem;border-radius:var(--radius-md);border:1px solid var(--border-subtle);overflow:hidden}.diff__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border-top:1px solid var(--border-subtle)}.diff__row:first-child{border-top:none}.diff__row-side{display:grid;grid-template-columns:1.25rem 3rem minmax(0,1fr);align-items:baseline;padding:.4rem .6rem;font-family:var(--font-mono);font-size:var(--size-step--2);line-height:var(--leading-snug);background:var(--surface-body);border-inline-start:3px solid transparent;overflow-wrap:anywhere;word-break:break-word}.diff__row-side--left{border-right:1px solid var(--border-subtle)}.diff__row-marker{color:var(--text-muted);font-weight:var(--weight-semibold)}.diff__row-index{color:var(--text-muted);font-size:var(--size-step--3);text-align:right;padding-inline-end:.5rem}.diff__row-content{background:transparent;color:var(--text-strong);white-space:pre-wrap}.diff__row[data-op=equal] .diff__row-side{background:var(--surface-body)}.diff__row[data-op=added] .diff__row-side--right{background:color-mix(in oklab,var(--color-success-soft) 70%,var(--surface-body));border-inline-start-color:var(--color-success)}.diff__row[data-op=added] .diff__row-side--left{background:var(--surface-muted);opacity:.55}.diff__row[data-op=removed] .diff__row-side--left{background:color-mix(in oklab,var(--color-danger-soft) 70%,var(--surface-body));border-inline-start-color:var(--color-danger)}.diff__row[data-op=removed] .diff__row-side--right{background:var(--surface-muted);opacity:.55}.diff__row[data-op=changed] .diff__row-side{background:color-mix(in oklab,var(--color-warn-soft) 60%,var(--surface-body));border-inline-start-color:var(--color-warn)}.diff__element-list{grid-column:1 / -1;list-style:none;margin:0;padding:.45rem .85rem;background:var(--surface-muted);border-top:1px solid var(--border-subtle);display:flex;flex-direction:column;gap:.25rem;font-size:var(--size-step--2)}.diff__element{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:.85rem;align-items:baseline}.diff__element-label{font-family:var(--font-mono);color:var(--text-muted)}.diff__element-op{text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--size-step--3);margin-inline-start:.25rem}.diff__element[data-op=changed] .diff__element-op{color:var(--color-warn)}.diff__element[data-op=added] .diff__element-op{color:var(--color-success)}.diff__element[data-op=removed] .diff__element-op{color:var(--color-danger)}.diff__element-values{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:.45rem;font-family:var(--font-mono)}.diff__element-left{background:color-mix(in oklab,var(--color-danger-soft) 65%,var(--surface-body));color:var(--text-strong);padding:.05rem .35rem;border-radius:var(--radius-sm)}.diff__element-right{background:color-mix(in oklab,var(--color-success-soft) 65%,var(--surface-body));color:var(--text-strong);padding:.05rem .35rem;border-radius:var(--radius-sm)}.diff__element[data-op=added] .diff__element-right{background:color-mix(in oklab,var(--color-success-soft) 80%,var(--surface-body))}.diff__element[data-op=removed] .diff__element-left{background:color-mix(in oklab,var(--color-danger-soft) 80%,var(--surface-body))}.diff__element-arrow{color:var(--text-muted)}@media(max-width:720px){.diff__row{grid-template-columns:minmax(0,1fr)}.diff__row-side--left{border-right:none;border-bottom:1px solid var(--border-subtle)}}