/* Shared square facade samples, cropped in CSS from the unmodified HD photographs. */
.facade-swatch{display:block;flex-shrink:0;width:56px;height:56px;aspect-ratio:1;background-image:var(--swatch);background-size:1000% auto;background-position:43% 50%;background-repeat:no-repeat;border:1px solid #ffffff35;border-radius:2px;box-shadow:0 2px 8px #0003;transition:outline-color .25s;outline:1px solid transparent;outline-offset:4px}
#finitions .finish-selector{gap:16px}
#finitions .finish-selector button{border-radius:3px;width:54px;height:54px;padding:5px;border-color:transparent}
#finitions .finish-selector button .facade-swatch{width:100%;height:100%;border-radius:1px;background-size:1000% auto}
#finitions .finish-selector button[aria-pressed=true] .facade-swatch{outline-color:#e0c7a1}
.plate-choices .finish-choice .facade-swatch{width:min(100%,64px);height:auto;aspect-ratio:1}
.plate-choices .finish-choice.selected .facade-swatch{outline-color:#cbb58a}
.plate-choices .finish-choice::after{display:none}
@media(max-width:760px){#finitions .finish-selector{gap:9px}#finitions .finish-selector button{width:45px;height:45px}.plate-choices .finish-choice .facade-swatch{width:min(100%,56px)}}
@media(prefers-reduced-motion:reduce){.facade-swatch{transition:none}}
/* Keep the white raster fringe trimmed; show a ring only for the selected lever. */
.mechanism-dot img{clip-path:circle(43% at 50% 50%);border-radius:0;transform:scale(1.08);filter:none;box-shadow:none}
.mechanism-dot::after{display:block;inset:-3px;border:1px solid transparent;border-radius:50%}
.selected .mechanism-dot::after{border-color:#cbb58a}
.mechanism-choices .selected .choice-label{text-decoration:none}