*{font-family:Calibri,Trebuchet MS,sans-serif;box-sizing:border-box}html{height:100%}body{overflow:hidden;margin:0;height:100%;background-color:#f6f6f6}#main{height:100%}.footer{margin-top:1rem}.content{position:absolute;display:flex;flex-direction:column;height:100%;width:100%}.body{overflow:auto;padding:1rem}.barchart{display:flex;width:100%;margin:0;border-left:1px dashed #bbb;border-right:1px dashed #bbb}.barchart:first-child{border-right:none}.barchart:last-child{border-left:none}.bar-container.selected .text{color:#000;font-weight:700;padding:0 .2rem;text-shadow:-1px -1px 0 rgba(255,255,255,.6),0 -1px 0 rgba(255,255,255,.6),1px -1px 0 rgba(255,255,255,.6),-1px 0 0 rgba(255,255,255,.6),1px 0 0 rgba(255,255,255,.6),-1px 1px 0 rgba(255,255,255,.6),0 1px 0 rgba(255,255,255,.6),1px 1px 0 rgba(255,255,255,.6)}.bar-container.selected .bar{background-image:linear-gradient(to top,#a21 0%,#c66 100%)}.bar{background-color:#e33;transition:all 2s,background-color .2s;min-width:1px;background-image:linear-gradient(to top,#fee 0%,#e33 100%)}.split{display:flex;gap:8px}.roll-details{display:flex;overflow-x:auto;overflow-y:hidden;margin-left:24px}.roll-details>*{margin:0 auto;padding-right:100px}.bar-container{display:flex;flex-direction:column-reverse;text-align:center;flex-grow:10}.label,.percent{position:relative;height:1rem}.label .text,.percent .text{position:absolute;white-space:nowrap;font-size:1rem;text-align:center;margin:0 auto;color:transparent;transform:translate(-50%);left:50%}.percent .text{font-size:.8rem;bottom:0}.expression-input{width:100%;text-align:center;border:none}.expression-input input{font-size:2.4rem;padding:.5rem 0}.details>.die{font-size:.6rem;margin:0;white-space:nowrap}.roll-result a{font-size:3rem;font-weight:700;width:6rem;height:6rem;display:inline-block;position:relative;line-height:6rem;background-color:#eaeaea;background-image:linear-gradient(top,#f6f6f6,#eaeaea);border-radius:4.5rem;box-shadow:0 3px 3px #00000040,0 6px 9px #0000001a;text-decoration:none;color:#000;text-shadow:0px 0px 3px #fff,1px 1px 6px rgba(0,0,0,.5)}.roll-result a:active{transition:all .1s;transform:translateY(4px)}.roll-result a:after{content:"";position:absolute;z-index:1;top:2px;right:2px;bottom:2px;left:2px;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(150,120,180,.4) 100%),radial-gradient(ellipse at 25% 25%,rgba(245,245,255,.8) 0%,rgba(245,245,255,.8) 3%,rgba(150,160,200,.25) 8%,rgba(200,160,150,0) 100%);border-radius:8rem}.roll-result a:focus{outline:none}.roll-result a:focus:before{background-color:#eaeaff}.roll-box{text-align:center;justify-content:center;display:flex;padding:1rem 0 .5rem;gap:12px}.pair{display:flex;flex-direction:column}.result{border-bottom:1px solid #ccc;font-size:1rem;position:relative}.binop,.unop{display:flex;flex-direction:row;gap:4px}.left,.right{flex:1}.op{flex:.1}.dice-set,.explode,.reroll{display:flex;gap:2px}.dice-set>*{flex:1}.dice-set>.comma{flex:.2;padding-top:10px}.die>*{display:inline-block}.discard .result{color:#000;position:relative}.discard .result:before{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:20px;margin:0 auto;text-align:center;z-index:-1;background:linear-gradient(135deg,rgba(255,255,255,0) 48.75%,rgba(255,0,0,.8) 48.8%,rgba(255,0,0,.8) 51.2%,rgba(255,255,255,0) 51.25%),linear-gradient(45deg,rgba(255,255,255,0) 48.75%,rgba(255,0,0,.8) 48.8%,rgba(255,0,0,.8) 51.2%,rgba(255,255,255,0) 51.25%)}.header{box-shadow:0 4px 12px #0000001a;border-bottom:1px solid #ddd;z-index:1;background-color:#fff}.keep .result{color:#333}.normal .result{color:#666}.die-icon{font-size:36px;position:absolute}.die-container{width:36px;height:36px;position:relative}.discard .die-icon{color:#ccc}.text-content{color:#222}.text-content code{padding:.1rem .25rem;background-color:#f3f3f3;font-family:monospace;font-weight:700}.text-content a{text-decoration:none;color:#309}.text-content h1{margin:0rem;font-size:1rem;color:#444;font-weight:700}.text-content p{margin:.5rem}.text-content p:first-child{margin-top:0}.text-content p:last-child{margin-bottom:0}.description{column-count:3;column-rule:1px dotted #ccc}.probabilities-container{overflow-x:auto;overflow-y:hidden;padding:0 20px}.probabilities{display:flex;justify-content:space-between;padding:0}.probabilities-labels{display:flex;justify-content:space-around}.probabilities-labels .label{text-align:center;color:#999;font-size:.8rem}.roll-seed{color:#999;margin-top:1rem;font-size:.8rem}.text-editor{width:80px;padding:0 4px;background-color:#f6f6f6;display:inline-block;font-size:2.4rem;text-align:center;border:none;border-bottom:1px dashed #bbb}.expression-input .text-editor{width:100%}.roll-seed,.roll-seed label{display:flex;gap:.5rem}.roll-seed .text-editor{color:#999;font-size:.8rem}.text-editor:focus{outline:none}.stats{text-align:right;font-size:.8rem;color:#999;margin-bottom:-.5rem;font-style:italic}@media screen and (max-width: 960px){.description{column-count:2}.roll-result a{font-size:2rem;width:4rem;height:4rem;line-height:4rem}.roll-result a:before{top:-8px;right:-8px;bottom:-8px;left:-8px}.expression-input input{font-size:1.6rem}.result{font-size:.8rem}.die-icon{font-size:30px}.die-container{width:30px;height:30px}.dice-set>.comma{padding-top:8px}.roll-seed{margin-top:.5rem}.roll-box{padding:.5rem 0}}@media screen and (max-width: 720px){.description{column-count:1}.roll-result a{font-size:1.6rem;width:3rem;height:3rem;line-height:3rem}.roll-result a:before{top:-6px;right:-6px;bottom:-6px;left:-6px}.expression-input input{font-size:1.2rem}.result{font-size:.6rem}.die-icon{font-size:24px}.die-contaier{width:24px;height:24px}.dice-set>.comma{padding-top:4px}}.ribbon{position:absolute;top:-45px;right:-125px;padding:1px 0;transform-origin:top left;transform:rotate(45deg);background-color:#0076ea;background-image:linear-gradient(0,rgba(0,0,0,.2),transparent);box-shadow:8px 8px 16px #0003;line-height:.8rem;z-index:1}.ribbon a{display:inline-block;width:250px;font-family:Helvetica Neue;color:#fff;font-size:.8em;letter-spacing:.06em;text-shadow:0 -1px #777;text-decoration:none;text-align:center;border-top:1px dotted #ffc284;border-bottom:1px dotted #ffa951;padding:0 0 .2rem}.ribbon a .prefix{font-size:.6rem;color:#ccc}.error{text-align:center;padding:.5rem 1rem;border-left:2rem solid #a20;line-height:1.5rem}.error .label{color:#999}.error .expected,.error .got{padding:0 .5rem}.error .expected{font-family:monospace;background-color:#eee}.error .got{background-color:#e99}.validation-prefix{color:#999}.banner{height:100px}.validation-message{font-style:italic}.roll{animation-iteration-count:1;animation-fill-mode:forwards;animation-timing-function:ease-out}.roll1{animation-duration:.6s;animation-name:roll1}.roll2{animation-duration:.8s;animation-name:roll2}.roll3{animation-duration:1s;animation-name:roll3}.roll4{animation-duration:1.2s;animation-name:roll4}.roll5{animation-duration:1.6s;animation-name:roll5}.roll6{animation-duration:.6s;animation-name:roll6}.roll7{animation-duration:.8s;animation-name:roll7}.roll8{animation-duration:1s;animation-name:roll8}.roll9{animation-duration:1.2s;animation-name:roll9}.roll10{animation-duration:1.6s;animation-name:roll10}.tooltip-container{position:relative}.tooltip-container .tooltip{position:absolute;width:160px;color:#fff;background-color:#0076ea;background-image:linear-gradient(0,rgba(0,0,0,.2),transparent);line-height:1rem;text-align:center;border-radius:2px;box-shadow:0 8px 16px #0003;text-shadow:1px 1px rgba(0,0,0,.2);left:0;margin-left:calc(50% - 80px);z-index:999;padding:.4rem 1rem;font-size:1rem;font-weight:400}.tooltip-container .tooltip:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-8px;width:0;height:0;border-bottom:8px solid #0076ea;border-right:8px solid transparent;border-left:8px solid transparent}@-moz-keyframes roll1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@-webkit-keyframes roll1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@-o-keyframes roll1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes roll1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@-moz-keyframes roll2{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@-webkit-keyframes roll2{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@-o-keyframes roll2{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@keyframes roll2{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@-moz-keyframes roll3{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-webkit-keyframes roll3{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-o-keyframes roll3{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@keyframes roll3{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-moz-keyframes roll4{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-webkit-keyframes roll4{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-o-keyframes roll4{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@keyframes roll4{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-moz-keyframes roll5{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-webkit-keyframes roll5{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-o-keyframes roll5{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@keyframes roll5{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-moz-keyframes roll6{0%{transform:rotate(0)}to{transform:rotate(6turn)}}@-webkit-keyframes roll6{0%{transform:rotate(0)}to{transform:rotate(6turn)}}@-o-keyframes roll6{0%{transform:rotate(0)}to{transform:rotate(6turn)}}@keyframes roll6{0%{transform:rotate(0)}to{transform:rotate(6turn)}}@-moz-keyframes roll7{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-webkit-keyframes roll7{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-o-keyframes roll7{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@keyframes roll7{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@-moz-keyframes roll8{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-webkit-keyframes roll8{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-o-keyframes roll8{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@keyframes roll8{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@-moz-keyframes roll9{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-webkit-keyframes roll9{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-o-keyframes roll9{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@keyframes roll9{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@-moz-keyframes roll10{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@-webkit-keyframes roll10{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@-o-keyframes roll10{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@keyframes roll10{0%{transform:rotate(0)}to{transform:rotate(2turn)}}