@layer components{.Button{--Button--color: #1d2530;--Button--color-background: #f9fafb;--Button--color-border: #e0e6eb;--Button--padding-block: .5rem;--Button--padding-inline: 1rem;box-sizing:border-box;background-color:var(--Button--color-background);border:1px solid var(--Button--color-border);border-radius:.5rem;color:var(--Button--color);cursor:pointer;display:inline-block;font-weight:500;padding-block:var(--Button--padding-block);padding-inline:var(--Button--padding-inline);text-decoration:none;transition:background-color .25s ease,border-color .25s ease,color .25s ease}.Button:hover{--Button--color: #1d2530;--Button--color-background: #f49d25;--Button--color-border: #f49d25}.Button__icon{block-size:1.5rem;inline-size:1.5rem}.Button>span{display:flex;align-items:center;gap:.5rem}.Button[data-size=block]{display:block;inline-size:100%}.Button[data-size=block]>span{justify-content:center}.Button[data-size=large]{--Button--padding-block: 1rem;--Button--padding-inline: 2rem;font-size:1.125rem}.Button[data-style=primary]{--Button--color: white;--Button--color-background: #1b988d;--Button--color-border: #1b988d}.Button[data-style=primary]:hover{--Button--color-background: rgba(27, 152, 141, .9);--Button--color-border: rgba(27, 152, 141, .9)}.Button[data-style=reversed]{--Button--color: #1d2530;--Button--color-background: white;--Button--color-border: white}.Button[data-style=reversed]:hover{--Button--color-background: rgba(237, 240, 243, .8);--Button--color-border: rgba(237, 240, 243, .8)}}