@layer m3-components{.m3-theme{gap:20px;display:grid}.m3-theme section{justify-items:start;gap:8px;display:grid}.m3-theme__swatches{flex-wrap:wrap;gap:12px;display:flex}.m3-swatch{color:#fff;width:44px;height:44px;transition:border-radius var(--md-sys-motion-t-small);border:0;border-radius:50%;place-items:center;display:grid;position:relative;box-shadow:inset 0 0 0 1px #0000001f}.m3-swatch[aria-pressed=true]{border-radius:14px}.m3-swatch:active{border-radius:10px}.m3-swatch--custom{background:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface-variant);cursor:pointer;overflow:hidden}.m3-swatch--custom input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}}