html {
    background: url(https://x.boardgamearena.net/data/themereleases/221026-1000/img/layout/back-main.jpg), #f2f2f2;
}

.nav {
    font-size: 120%;
    font-weight: bold;
}

h1, h2 {
    margin: 0.3rem;
}

.flex {
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.flex > div {
    flex: 1;
}

.block {
    background: #FFFFFF99;
    border-radius: 8px;
    padding: 10px;
}

.flex .block {
    min-width: 500px;
}

.colored-die .bga-dice_die-face {
    background: url('dice.jpg');
    background-size: 600% 600%;
    border-radius: 5px;
}

.kot-die4 .bga-dice_die-face {
    background: linear-gradient(90deg, lightgoldenrodyellow 0%, gold 100%);
}



.kot-die4 .bga-dice_die-face-number {
    transform-origin: center 66.66667%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    display: block;
}

.kot-die4 .bga-dice_die-face-number:nth-child(1) {
    transform: rotateZ(0deg);
}

.kot-die4 .bga-dice_die-face-number:nth-child(2) {
    transform: rotateZ(120deg);
}

.kot-die4 .bga-dice_die-face-number:nth-child(3) {
    transform: rotateZ(240deg);
}

.kot-die4 .bga-dice_die-face-number::after {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    color: navy;
    font-size: 16pt;
    font-weight: bold;
    padding-top: calc(var(--size) * 0.1);
}

.kot-die4 .bga-dice_die-face-number[data-number="1"]::after {
    content: '1';
}
.kot-die4 .bga-dice_die-face-number[data-number="2"]::after {
    content: '2';
}
.kot-die4 .bga-dice_die-face-number[data-number="3"]::after {
    content: '3';
}
.kot-die4 .bga-dice_die-face-number[data-number="4"]::after {
    content: '4';
}

.bga-dice_die .bga-dice_die-face[data-face="1"] {
    background-position-x: 0%;
}
.bga-dice_die .bga-dice_die-face[data-face="2"] {
    background-position-x: 20%;
}
.bga-dice_die .bga-dice_die-face[data-face="3"] {
    background-position-x: 40%;
}
.bga-dice_die .bga-dice_die-face[data-face="4"] {
    background-position-x: 60%;
}
.bga-dice_die .bga-dice_die-face[data-face="5"] {
    background-position-x: 80%;
}
.bga-dice_die .bga-dice_die-face[data-face="6"] {
    background-position-x: 100%;
}

.colored-die[data-color="red"] .bga-dice_die-face {
    background-position-y: 0%;
}
.colored-die[data-color="yellow"] .bga-dice_die-face {
    background-position-y: 20%;
}
.colored-die[data-color="green"] .bga-dice_die-face {
    background-position-y: 40%;
}
.colored-die[data-color="blue"] .bga-dice_die-face {
    background-position-y: 60%;
}
.colored-die[data-color="purple"] .bga-dice_die-face {
    background-position-y: 80%;
}
.colored-die[data-color="white"] .bga-dice_die-face {
    background-position-y: 100%;
}

.bga-dice_die8 .bga-dice_die-face {
    background: linear-gradient(90deg, cyan 0%, blue 100%);
    /*background-image: url('data:image/svg+xml;base64,PHN2ZyBpZD0idHJpYW5nbGUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDMzNi45MiAyOTEuNzUiPgoJPHBvbHlnb24gcG9pbnRzPSIzMzQuNzUgMjkwLjUgMi4xNyAyOTAuNSAxNjguNDcgMi41IDMzNC43NSAyOTAuNSIgZmlsbD0icmdiYSgxMzMsMTMzLDI1NSwwLjgpIiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iMi41Ii8+Cjwvc3ZnPg==');*/
    display: flex !important;
    justify-content: center;
    align-items: center;
}