/* Comparison widget v25 — one authoritative stylesheet. */
.compare-wrap{min-width:0}
.compare{
  --split:50%;--compare-width:600px;--handle-size:48px;
  position:relative;width:100%;max-width:100%;aspect-ratio:1.95;
  border-radius:var(--radius,6px);overflow:hidden;isolation:isolate;
  background:#b69a8b;cursor:ew-resize;touch-action:pan-y;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}
.compare>img,.compare-before,.compare-before img{position:absolute;inset:0;width:100%;height:100%}
.compare>img,.compare-before img{object-fit:cover;object-position:center;max-width:none;pointer-events:none;user-select:none;-webkit-user-drag:none}
.compare-before{width:var(--split);overflow:hidden;z-index:1;pointer-events:none}
.compare-before img{width:var(--compare-width);max-width:none}
.compare-line{
  position:absolute;z-index:3;top:0;bottom:0;left:var(--split);
  transform:translateX(-50%);width:2px;background:rgba(255,255,255,.98);
  box-shadow:0 0 8px rgba(55,34,23,.18);pointer-events:none;
  display:flex;align-items:center;justify-content:center;
}
.compare-line>.compare-handle{
  position:relative;width:var(--handle-size);height:var(--handle-size);
  flex:0 0 var(--handle-size);box-sizing:border-box;border-radius:50%;
  display:grid;place-items:center;color:#7a5c43;background:#fff;
  border:2px solid #ccb9ab;
  box-shadow:0 3px 12px rgba(41,26,17,.12),0 0 0 2px rgba(255,255,255,.92);
  transition:box-shadow .2s,background .2s;
}
.compare-handle svg{width:28px;height:18px;max-width:none;display:block}
.compare-line>.compare-hint{
  position:absolute;left:50%;top:calc(50% + var(--handle-size)/2 + 12px);
  transform:translateX(-50%);width:max-content;max-width:calc(100vw - 48px);
  height:auto;display:inline-flex;align-items:center;justify-content:center;
  padding:10px 16px;border:1px solid rgba(204,185,171,.8);border-radius:100px;
  background:#fff;color:#7a5c43;box-shadow:0 2px 10px rgba(0,0,0,.06);
  font:700 11px/1 var(--sans);letter-spacing:.16em;white-space:nowrap;
  transition:opacity .2s,visibility .2s;
}
.compare-hint svg{display:none}
.compare.is-interacted .compare-hint{opacity:0;visibility:hidden}
.compare:focus-within .compare-handle{outline:3px solid #b08e74;outline-offset:3px}
.compare-label{
  position:absolute;z-index:3;bottom:14px;padding:7px 12px;
  font-size:10px;border-radius:4px;background:rgba(255,253,251,.92);pointer-events:none;
}
.compare-label-left{left:14px}.compare-label-right{right:14px}
.compare-input,.compare-input:focus-visible{
  position:absolute;inset:0;width:100%;height:100%;margin:0;z-index:4;
  appearance:none;-webkit-appearance:none;opacity:0;outline:0;
  border:0;background:transparent;pointer-events:none;
}
.compare-input::-webkit-slider-runnable-track{height:100%;background:transparent;border:0}
.compare-input::-moz-range-track{height:100%;background:transparent;border:0}
.compare-input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:1px;height:1px;border:0;background:transparent;box-shadow:none}
.compare-input::-moz-range-thumb{width:1px;height:1px;border:0;background:transparent;box-shadow:none}
@media(max-width:700px){
  .compare{--handle-size:42px;aspect-ratio:1.4}
  .compare-handle svg{width:24px;height:16px}
  .compare-line>.compare-hint{top:calc(50% + var(--handle-size)/2 + 10px);font-size:10px;padding:8px 12px}
  .compare-label{font-size:10px;bottom:10px;padding:6px 9px}
  .compare-label-left{left:10px}.compare-label-right{right:10px}
}
@media(prefers-reduced-motion:reduce){.compare-handle,.compare-hint{transition:none}}