html { color-scheme: dark; }
body{
    background: #0f141c;
    color: #e8eef5;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.die {
    position: relative;
}

.value {
    display: block;
    text-align: center;
    line-height: 40px;
    width: 40px;
    height: 40px;
    outline: 1px black solid;
    font-size: 30px;
    font-family: system-ui;
    border-radius: 3px;
}

.die img{
    width: 80%;
    height: 80%;
    padding: 10%;
}

.die input{
    position: absolute;
    font-size: 10px;
    font-family: system-ui;
    margin: 0;
    background: rgba(0,0,0,0.15);
    color:  white;
    width: 17px;
    height: 17px;
    border-radius: 5px;
    border: 1px gray solid;
}

input.reroll_btn {
    top: -4px;
    right: -5px;
    padding: 3 3 0 0;
}

input.options_btn {
    bottom: -4px;
    right: -5px;
    padding: 0 3 3 0;
}

span {
    cursor: default;
}

.rules,
.rules:visited,
.rules:hover {
    color: #7df24a;
    margin-left: 15px;
}
dl.dice_options, dl.token_options { color: #111; }
input[type="button"] { background: #212b3a; color: #e8eef5; border: 1px solid #2d3a4d; border-radius: 6px; padding: 4px 10px; cursor: pointer; }
input[type="button"]:hover { border-color: #7df24a; }

dl.dice_options {
    background: #eee;
    border: 1px black solid;
    border-top:  none;
    width: 78px;
    margin: 0;
}

dl.dice_options dt {
    border-top: 1px grey solid;
    float: left;
    width: 90%;
    border-bottom: 1px gray solid;
    background: lightgray;
    margin-bottom: 5px;
    padding: 0 5% 0 5%;
}

dl.dice_options img {
    width: 25px;
}

dl.dice_options dd.dice_face {
    float: left;
    width: auto;
    border-right: 1px #ccc solid;
    padding: 4px 0 4px 0;
    width: 25px;
    height: 25px;
    text-align: center;
}

dl.dice_options dd {
    margin: 0;
    float: left;
    width: 90%;
    border-top: 1px #ccc solid;
    line-height: 25px;
    padding: 1px 5% 0 5%;
}

dl.dice_options dd:hover {
    background: lightgrey;
}

div.delete_zone {
    background: rgba(150,0,0,0.6);
    position: absolute;
    left: 5px;
    top: 590px;
    width: 110px;
    height: 110px;
}
img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}
p { padding:0; margin:0; }

.deck_o_cards_label {white-space: nowrap; }