.button-cornered{--size:0px;--inner-gap:0px;--font-size:0px;--border:0px;min-width:var(--size);min-height:var(--size);height:var(--size);padding:var(--inner-gap);font-size:var(--font-size);clip-path:polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));font-weight:700;transition:all .2s;position:relative}.button-cornered_size-md{--size:40px;--inner-gap:11px 24px;--font-size:14px;--cut:10px}.button-cornered_size-sm{--size:24px;--inner-gap:5px 12px;--font-size:10px;--cut:6px}.primary-button-cornered{background:var(--color-primary)}.secondary-button-cornered{--border:1px;--clip-border-error:calc(var(--border) * .5);background:var(--color-secondary-a20);border:none}.secondary-button-cornered:before{content:"";inset:var(--border);z-index:-1;background:var(--color-secondary);clip-path:polygon(calc(var(--cut) - var(--border) + var(--clip-border-error)) 0, 100% 0, 100% calc(100% - (var(--cut) - var(--border) + var(--clip-border-error))), calc(100% - (var(--cut) - var(--border) + var(--clip-border-error))) 100%, 0 100%, 0 calc(var(--cut) - var(--border) + var(--clip-border-error)));position:absolute}@media (min-width:768px){.primary-button-cornered:hover{background:var(--color-primary-hover)}.secondary-button-cornered:hover{background:var(--color-primary)}}