.color-tuning{min-width:0;margin:1rem 0 0;padding:1rem;border:1px solid #5a5141;border-radius:12px;background:#191b1e}
.color-tuning legend{padding:0 .45rem;color:#d2b581;font-size:.84rem;letter-spacing:.04em;text-transform:none}
.color-tuning-preview{display:flex;align-items:center;gap:.65rem;margin:.15rem 0 .8rem;color:#dfd9ce;font-size:.82rem}
.color-tuning-swatch{display:inline-block;width:2rem;height:2rem;border:1px solid #d2b581;border-radius:50%;box-shadow:inset 0 0 0 2px #ffffff1a;flex:none}
.color-tuning-control{display:grid;grid-template-columns:1fr auto;column-gap:.7rem;margin-top:.45rem}
.color-tuning .color-tuning-control label{margin:0;font-size:.83rem;letter-spacing:0;text-transform:none;color:#eee9e0}
.color-tuning output{font-size:.8rem;color:#cdb181;font-variant-numeric:tabular-nums}
.color-tuning input[type=range]{grid-column:1/-1;width:100%;min-width:0;height:44px;margin:0;padding:0;border:0;border-radius:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:pan-y}
.color-tuning input[type=range]::-webkit-slider-runnable-track{height:8px;background:var(--tuning-gradient);border-radius:8px;border:1px solid #ffffff35}
.color-tuning input[type=range]::-moz-range-track{height:8px;background:var(--tuning-gradient);border-radius:8px;border:1px solid #ffffff35}
.color-tuning input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-top:-9px;border-radius:50%;background:#d2b581;border:3px solid #17191c;box-shadow:0 0 0 1px #d2b581}
.color-tuning input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#d2b581;border:3px solid #17191c;box-shadow:0 0 0 1px #d2b581}
.color-tuning input:focus-visible{outline:2px solid #d2b581;outline-offset:1px;border-radius:5px}
.color-tuning-ends{grid-column:1/-1;display:flex;justify-content:space-between;color:#b9b5ad;font-size:.72rem;margin-top:-5px;margin-bottom:.35rem}
.color-tuning .color-tuning-reset{min-height:44px;margin:.8rem 0 0;padding:.45rem .75rem;background:transparent;border:1px solid #796a51;border-radius:6px;color:#dec493;font-size:.8rem}
.color-tuning .color-tuning-reset:disabled{opacity:.45;cursor:default}
.color-matching{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #5a5141}
.color-tuning .color-matching button{flex:1 1 40%;min-height:44px;padding:.55rem .65rem;border:1px solid #796a51;border-radius:6px;background:#24231f;color:#eee3ce;font-size:.8rem;cursor:pointer}
.color-tuning .color-matching .color-match-all{flex-basis:100%;background:#d2b581;color:#17191c;border-color:#d2b581}
.color-matching button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.color-tuning .color-matching p{flex-basis:100%;margin:.15rem 0 0;font-size:.74rem;line-height:1.5;color:#b9b5ad}
