css-prop style-precedence

[01-binary]

https://emotion.sh/docs/css-prop#style-precedence
when you see above article

CSS delivered from the parent component is applied later.

i am using storybook8, vite, emotion

in local server, it works fine.
but in result of build doesn't work like the article said.

in xxx.stories.tsx

      <SelectButton.Root
        onClick={() => setSelected(!selected)}
        selected={selected}
        css={css`
          height: 100%;
          padding: 8px 8px 12px 8px;
          width: 127px;
          display: flex;
          flex-direction: column;
        `}
      >

As you can see above, I pass css props to SelectButton.
and SelectButton.Root has default css, height and padding already defined.

as you can see, 1 className and the default height and padding have been overridden and ignored.

that is what i want.

but in build result, below picture

The css I put in the stories file was ignored.

of course, i can increase CSS priority with && selector or fix it with !important.
but i don't wanna use these methods

I would like to modify the build configuration so that the class name is one, or the value entered as CSS props in the parent component is applied first. Except for Storybook, other services work as described.

I tried many ways but couldn't find it.
If anyone knows, please let me know.

ah! Previously, I used Storybook 6 and webpack4, and there were no problems back then.

thank you for reading