*{box-sizing:border-box;font-family:Calibri,Trebuchet MS,sans-serif}html{height:100%}body{background-color:#f6f6f6;height:100%;margin:0;overflow:hidden}#main{height:100%}.footer{margin-top:1rem}.content{flex-direction:column;width:100%;height:100%;display:flex;position:absolute}.body{padding:1rem;overflow:auto}.barchart{border-left:1px dashed #bbb;border-right:1px dashed #bbb;width:100%;margin:0;display:flex}.barchart:first-child{border-right:none}.barchart:last-child{border-left:none}.bar-container.selected .text{color:#000;text-shadow:-1px -1px #fff9,0 -1px #fff9,1px -1px #fff9,-1px 0 #fff9,1px 0 #fff9,-1px 1px #fff9,0 1px #fff9,1px 1px #fff9;padding:0 .2rem;font-weight:700}.bar-container.selected .bar{background-image:linear-gradient(#c66 0%,#a21 100%)}.bar{background-color:#e33;background-image:linear-gradient(#e33 0%,#fee 100%);min-width:1px;transition:all 2s,background-color .2s}.split{gap:8px;display:flex}.roll-details{margin-left:24px;display:flex;overflow:auto hidden}.roll-details>*{margin:0 auto;padding-right:100px}.bar-container{text-align:center;flex-direction:column-reverse;flex-grow:10;display:flex}.label,.percent{height:1rem;position:relative}.label .text,.percent .text{white-space:nowrap;text-align:center;color:#0000;margin:0 auto;font-size:1rem;position:absolute;left:50%;transform:translate(-50%)}.percent .text{font-size:.8rem;bottom:0}.expression-input{text-align:center;border:none;width:100%}.expression-input input{padding:.5rem 0;font-size:2.4rem}.details>.die{white-space:nowrap;margin:0;font-size:.6rem}.roll-result a{background-color:#eaeaea;background-image:linear-gradient(top, #f6f6f6, #eaeaea);color:#000;text-shadow:0 0 3px #fff,1px 1px 6px #00000080;border-radius:4.5rem;width:6rem;height:6rem;font-size:3rem;font-weight:700;line-height:6rem;text-decoration:none;display:inline-block;position:relative;box-shadow:0 3px 3px #00000040,0 6px 9px #0000001a}.roll-result a:active{transition:all .1s;transform:translateY(4px)}.roll-result a:after{content:"";z-index:1;background:radial-gradient(#0000 0% 50%,#9678b466 100%),radial-gradient(at 25% 25%,#f5f5ffcc 0% 3%,#96a0c840 8%,#c8a09600 100%);border-radius:8rem;position:absolute;inset:2px}.roll-result a:focus{outline:none}.roll-result a:focus:before{background-color:#eaeaff}.roll-box{text-align:center;justify-content:center;gap:12px;padding:1rem 0 .5rem;display:flex}.pair{flex-direction:column;display:flex}.result{border-bottom:1px solid #ccc;font-size:1rem;position:relative}.binop,.unop{flex-direction:row;gap:4px;display:flex}.left,.right{flex:1}.op{flex:.1}.dice-set,.explode,.reroll{gap:2px;display:flex}.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:"";text-align:center;z-index:-1;background:linear-gradient(135deg,#fff0 48.75%,#f00c 48.8% 51.2%,#fff0 51.25%),linear-gradient(45deg,#fff0 48.75%,#f00c 48.8% 51.2%,#fff0 51.25%);width:100%;height:20px;margin:0 auto;display:block;position:absolute;top:0;left:0}.header{z-index:1;background-color:#fff;border-bottom:1px solid #ddd;box-shadow:0 4px 12px #0000001a}.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{background-color:#f3f3f3;padding:.1rem .25rem;font-family:monospace;font-weight:700}.text-content a{color:#309;text-decoration:none}.text-content h1{color:#444;margin:0;font-size:1rem;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{padding:0 20px;overflow:auto hidden}.probabilities{justify-content:space-between;padding:0;display:flex}.probabilities-labels{justify-content:space-around;display:flex}.probabilities-labels .label{text-align:center;color:#999;font-size:.8rem}.roll-seed{color:#999;margin-top:1rem;font-size:.8rem}.text-editor{text-align:center;background-color:#f6f6f6;border:none;border-bottom:1px dashed #bbb;width:80px;padding:0 4px;font-size:2.4rem;display:inline-block}.expression-input .text-editor{width:100%}.roll-seed,.roll-seed label{gap:.5rem;display:flex}.roll-seed .text-editor{color:#999;font-size:.8rem}.text-editor:focus{outline:none}.stats{text-align:right;color:#999;margin-bottom:-.5rem;font-size:.8rem;font-style:italic}@media screen and (width<=960px){.description{column-count:2}.roll-result a{width:4rem;height:4rem;font-size:2rem;line-height:4rem}.roll-result a:before{inset:-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 (width<=720px){.description{column-count:1}.roll-result a{width:3rem;height:3rem;font-size:1.6rem;line-height:3rem}.roll-result a:before{inset:-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{transform-origin:0 0;z-index:1;background-color:#ff5722;background-image:linear-gradient(#0000,#00000040);padding:4px 0;line-height:1rem;position:absolute;top:-40px;right:-140px;transform:rotate(45deg);box-shadow:10px 10px 22px #00000047}.ribbon a{color:#fff;letter-spacing:.06em;text-shadow:0 -1px #7a2a0f;text-align:center;border-top:1px dotted #ffd1a6;border-bottom:1px dotted #ffb380;width:300px;padding:.15rem 0 .35rem;font-family:Helvetica Neue;font-size:.95em;font-weight:600;text-decoration:none;display:inline-block}.ribbon a .prefix{color:#ffe4d4;font-size:.7rem;font-weight:400}.error{text-align:center;border-left:2rem solid #a20;padding:.5rem 1rem;line-height:1.5rem}.error .label{color:#999}.error .expected,.error .got{padding:0 .5rem}.error .expected{background-color:#eee;font-family:monospace}.error .got{background-color:#e99}.validation-prefix{color:#999}.banner{height:100px}.validation-message{font-style:italic}.roll{animation-timing-function:ease-out;animation-iteration-count:1;animation-fill-mode:forwards}.roll1{animation-name:roll1;animation-duration:.6s}.roll2{animation-name:roll2;animation-duration:.8s}.roll3{animation-name:roll3;animation-duration:1s}.roll4{animation-name:roll4;animation-duration:1.2s}.roll5{animation-name:roll5;animation-duration:1.6s}.roll6{animation-name:roll6;animation-duration:.6s}.roll7{animation-name:roll7;animation-duration:.8s}.roll8{animation-name:roll8;animation-duration:1s}.roll9{animation-name:roll9;animation-duration:1.2s}.roll10{animation-name:roll10;animation-duration:1.6s}.tooltip-container{position:relative}.tooltip-container .tooltip{color:#fff;text-align:center;text-shadow:1px 1px #0003;z-index:999;background-color:#0076ea;background-image:linear-gradient(#0000,#0003);border-radius:2px;width:160px;margin-left:calc(50% - 80px);padding:.4rem 1rem;font-size:1rem;font-weight:400;line-height:1rem;position:absolute;left:0;box-shadow:0 8px 16px #0003}.tooltip-container .tooltip:after{content:"";border-bottom:8px solid #0076ea;border-left:8px solid #0000;border-right:8px solid #0000;width:0;height:0;margin-left:-8px;position:absolute;bottom:100%;left:50%}@keyframes roll1{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes roll2{0%{transform:rotate(0)}to{transform:rotate(2turn)}}@keyframes roll3{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@keyframes roll4{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@keyframes roll5{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@keyframes roll6{0%{transform:rotate(0)}to{transform:rotate(6turn)}}@keyframes roll7{0%{transform:rotate(0)}to{transform:rotate(5turn)}}@keyframes roll8{0%{transform:rotate(0)}to{transform:rotate(4turn)}}@keyframes roll9{0%{transform:rotate(0)}to{transform:rotate(3turn)}}@keyframes roll10{0%{transform:rotate(0)}to{transform:rotate(2turn)}}
