/* Painted cabinetry palette. Builds on the .color-explorer layout in colors.css. */
.painted-explorer{scroll-margin-top:100px}
.paint-stage{height:540px;padding:34px}
.paint-door{--paint:#edeae2;position:relative;height:100%;aspect-ratio:3/5;max-width:100%;background:var(--paint);box-shadow:0 34px 60px #0009,inset 0 0 0 1px #0000001f,inset 0 1px 0 #ffffff26;transition:background-color .4s ease}
.paint-door-panel{position:absolute;inset:12% 14%;background:linear-gradient(135deg,#ffffff12,#00000012);box-shadow:inset 2px 3px 6px #00000052,inset -1px -1px 2px #ffffff2e,0 0 0 1px #00000014}
.paint-door-knob{position:absolute;right:5.5%;top:50%;width:13px;height:13px;margin-top:-6px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f3dfae,#b08d4c 60%,#6e5628);box-shadow:0 2px 4px #0008}
.paint-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.paint-chip{display:block;width:100%;aspect-ratio:4/3;background:var(--chip);border:3px solid var(--paper);outline:1px solid transparent;outline-offset:0;box-shadow:inset 0 0 0 1px #ffffff1f;transition:outline-color .2s,transform .3s}
.paint-swatch:hover .paint-chip{transform:translateY(-3px)}
.paint-swatch[aria-pressed=true] .paint-chip{outline-color:#f1ede4}
@media(max-width:700px){
 .paint-stage{height:360px;padding:24px}
 .paint-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.paint-door,.paint-chip{transition:none}.paint-swatch:hover .paint-chip{transform:none}}