#button-colors{box-sizing:border-box;width:min(1180px,calc(100% - 32px));max-height:90vh;padding:28px;border:0;background:#fff;color:#171717;font:14px 'SCOUT Montserrat',Arial,sans-serif}
#button-colors::backdrop{background:rgb(16 20 24 / .65)}
.palette-heading{display:flex;align-items:start;justify-content:space-between;gap:24px}.palette-heading h2{font-size:26px;margin:0 0 10px;letter-spacing:-.04em}.palette-heading p{margin:0 0 24px;color:#666;line-height:1.5}
.palette-close{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;padding:0;border:1px solid #ddd;background:#fff;color:#171717;cursor:pointer;font:28px Arial}
.palette-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.palette-card{border:1px solid #ddd;padding:18px;min-width:0}.palette-card h3{font-size:16px;margin:0 0 6px}.palette-card p{font-size:11px;color:#777;margin:0 0 16px}.palette-demo{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;height:48px;border:0;padding:0 16px;font:600 13px 'SCOUT Montserrat',Arial;color:var(--ink);background:linear-gradient(110deg,var(--a),var(--b));background-size:220% 100%;transition:background-position .6s ease;cursor:pointer}.palette-demo:hover,.palette-demo:focus-visible{background-position:100% 50%}.palette-demo span{transition:transform .25s}.palette-demo:hover span{transform:translate(3px,-3px)}
.palette-swatches{display:flex;gap:6px;margin-top:14px;align-items:center}.palette-swatches i{width:24px;height:24px;background:var(--swatch)}.palette-swatches small{margin-left:auto;font-size:10px;color:#777}.palette-try{font:600 12px 'SCOUT Montserrat',Arial;background:none;border:0;border-bottom:1px solid #ccc;padding:8px 0 3px;cursor:pointer;color:#333;margin-top:10px}.palette-footer{display:flex;justify-content:space-between;gap:16px;margin-top:22px;align-items:center;font-size:12px;color:#666}.palette-reset{font:inherit;padding:10px 14px;border:1px solid #bbb;background:white;cursor:pointer;color:#222}
#palette-launch{position:fixed;bottom:18px;left:18px;z-index:1100;padding:12px 16px;background:#1d2226;color:#fff;border:1px solid #fff;font:600 12px 'SCOUT Montserrat',Arial;box-shadow:0 3px 16px #0002;cursor:pointer}
@media(max-width:699px){#button-colors{padding:18px}.palette-grid{grid-template-columns:1fr}.palette-heading h2{font-size:22px}.palette-footer{align-items:start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.palette-demo,.palette-demo span{transition:none}}
dialog#button-colors{width:min(1180px,calc(100vw - 48px))!important;max-width:none!important;border-radius:0!important;margin:auto!important;inset:0!important}.palette-demo,.palette-card,.palette-close{border-radius:0!important}.palette-close:focus:not(:focus-visible){outline:none}.palette-close:focus-visible{outline:2px solid #46415e;outline-offset:3px}
@media(max-width:699px){dialog#button-colors{width:calc(100vw - 24px)!important}}