body[init] {opacity:0}
body {opacity:1;transition:opacity 1s}

.collection .collection-item {padding:10px}
.row .col {padding:0}
i.small {font-style:normal}

a.js {color:unset}
a.js:not(.disabled) {cursor:pointer}
a.btn {font-family:"Courier";font-size:1.5em;font-weight:bold;text-shadow:#ccc 1px 1px}

.img.bull,.digit.bull {background:url(img/bull.svg) no-repeat}
.img.cow,.digit.cow {background:url(img/cow.svg) no-repeat}
.img.coin {background:url(img/coin.svg) no-repeat;background-size:100%}
.img.gem {background:url(img/gem.svg) no-repeat;background-size:100%}
.digit.bull,.digit.cow {background-size:25px}
.digit.bull span,.digit.cow span,.digit.none span {opacity:0.2}

.game .digit {font-family:"Courier";font-size:4em;line-height:1em;font-weight:bold;text-shadow:#ccc 1px 1px}
.game .prompt {font-family:"Courier";font-size:3em;line-height:1.3em;font-weight:bold;text-shadow:#ccc 1px 1px}
.game :not(.ask)>.digit,.game .prompt {height:50px}
.game .goal .digit {color:#0f0}
.game .try .imgs {height:50px;padding-left:10px;text-align:left}
.game .try .img {display:inline-block;width:50px;height:50px;margin:0 -8px}
.game .ask input {height:1em;width:0.7em;margin:0;text-align: center;font-family:"Courier";font-size:1em;font-weight:bold;border:2px solid #000;}
.game .ask a.btn {margin:12px 0 0 5px}
.game a.btn {border-radius:1em}
.game .text span {font-size: 1.5em;vertical-align:middle}
.game .text span.gain {color:#f00;text-weight:bold}
.game .text span.lose {color:#0c0;text-weight:bold}
.game .text span.rest {color:#00f;text-weight:bold}
.game .text span.hits {color:#f00;text-weight:bold}
.game .text span.img.coin {display:inline-block;width:25px;height:25px;vertical-align:middle}
.game .text a.img {display:inline-block;width:35px;height:35px;vertical-align:middle}
.game .text.error {font-weight:bold;color:#f00}

#icons {height:90px}
#icons .img.bull,#icons .img.cow {position:absolute;height:88px;width:88px;top:2px}
#icons .img.bull {left:2px}
#icons .img.cow {right:2px}
#icons .balance {height:90px;width:fit-content;margin:0 auto;line-height:normal;text-align:center}
#icons .balance .img {display:inline-block;height:44px;width:44px;margin:2px 25px}
#icons .balance .value {margin:0;font-family:"Courier";font-size:2em;font-weight:bold}

.page.main {width:300px;margin:0 auto}
.page.main ul {border-radius:1.5em;padding:0.3em 0;font-family:"Courier";font-size:1.5em}
.page.main ul li {margin:1em 0;text-align:center}
.page.main ul li a {padding:0.5em 1em;border-radius:1em;background-color:#eee;transition:background-color 1s}
.page.main ul li a.disabled {color:#ccc}
.page.main ul li a:not(.disabled):hover {background-color:#ffd}

.page.game {width:300px;margin:0 auto}
