.dialogues {
opacity: 0;
}
.dialogues:not(:empty) {
background: fade(#000, 50%);
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
z-index: 2147483648; // fuck it
opacity: 1;
transition: opacity .2s;
.dialogue {
font-family: @cute-font;
display: inline-block;
background: #c2affe;
box-shadow: 0 0 5px #9475B2;
border: 1px solid #9475B2;
padding: 4px;
min-width: 250px;
border-radius: 2px;
&__buttons {
text-align: right;
border-top: 1px solid #9475b2;
margin-top: 2px;
padding-top: 2px;
&__button {
background: #b19eed;
padding: 2px 4px;
cursor: pointer;
margin-left: 2px;
min-width: 50px;
border-radius: 3px;
transition: background .2s;
&:hover {
&:active {
background: #a08ddc;
&:last-child {
font-weight: 700;
min-width: 70px;
&__title {
margin: -4px;
background: linear-gradient(90deg, rgba(148, 117, 178, .7), rgba(148, 117, 178, 0)) #C2AFFE;
margin-bottom: 4px;
&__text {
white-space: pre;
padding: 3px 4px;