html,body{font-family:Avenir,Helvetica,Arial,sans-serif;font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;width:100%;height:100%;margin:0;padding:0}#fui{position:relative;z-index:1}#dice-box{box-sizing:border-box;width:100%;height:calc(100% - 44px)}canvas{width:100%;height:100%}body>canvas{position:absolute}#dice-box{position:relative;background-image:url(./woodgrain2.jpg);background-size:cover}#rollers{position:relative}#rollers>div{opacity:0;transform:scale(.1);transition:all .3s ease-in-out}#rollers .pt-current{visibility:visible}#visibility{position:absolute;top:42px;right:20px}#toggleVisibility{z-index:2;position:relative;cursor:pointer;padding:10px 15px;color:#fff;background:#A97D47;border:2px solid #B29B7E;text-align:center;display:inline-block;border-radius:0 0 10px 10px;box-shadow:0 2px 4px #000}.pt-rotateCubeBottomOut{transform-origin:50% 0%;animation:rotateCubeBottomOut .6s both ease-in}.pt-rotateCubeBottomIn{transform-origin:50% 100%;animation:rotateCubeBottomIn .6s both ease-in}@keyframes rotateCubeBottomOut{50%{animation-timing-function:ease-out;transform:translateY(50%) translateZ(-200px) rotateX(-45deg)}to{opacity:.3;transform:translateY(100%) rotateX(-90deg)}}@keyframes rotateCubeBottomIn{0%{opacity:.3;transform:translateY(-100%) rotateX(90deg)}50%{animation-timing-function:ease-out;transform:translateY(-50%) translateZ(-200px) rotateX(45deg)}}.version{position:absolute;bottom:0;right:20px;padding:10px 15px 5px;color:#fff;background-color:#704b2d;text-align:center;display:inline-block;border-radius:15px 15px 0 0;box-shadow:0 0 10px #000}.adv-roller .footnote,.adv-roller .footnote a,.version a{color:#fff}#rollNotes{position:absolute;top:10px;width:60%;text-align:left;z-index:0}.adv-roller{align-items:center}.adv-roller form{display:inline-block;z-index:1}#rollNotes>input{position:absolute;left:-9999px}#rollNotes #toggleNotes:checked~label{cursor:pointer}#toggleNotes:checked~.footnote{opacity:1;transform:scale(1)}.footnote{background-color:#704b2dcc;border:2px solid rgba(178,155,126,.8);margin:0;padding:10px 10px 10px 30px;border-radius:0 15px 15px;opacity:0;transform:scaleY(.1);transform-origin:top;transition:all .3s ease-in-out}.plain-roller{position:absolute;display:flex;top:0;left:0;right:0;padding:10px;justify-content:center;text-align:center}.plain-roller input{padding:10px;margin-right:5px;text-align:center;border:2px solid;border-radius:5px}#plain-roller--clear{cursor:pointer}#rollers .adv-roller{margin:10px}#roll-tabs{padding:5px 5px 0;background-color:#704b2d;border-bottom:2px solid #B29B7E}#roll-tabs>input{position:absolute;left:-9999px}#roll-tabs label{position:relative;display:inline-block;border:0;outline:none;cursor:pointer;margin:0 5px 5px 0;border-radius:5px;background:#fff;box-shadow:0 3px #0000004d;color:#eee;opacity:.8;padding:0 20px;background:#B29B7E;font-size:16px;font-weight:700;line-height:32px;transition:all .2s ease-in-out}#roll-tabs input:checked+label{cursor:default;margin-bottom:0;padding-bottom:5px;border-bottom-right-radius:0;border-bottom-left-radius:0;color:#fff;background-color:#a97d47;box-shadow:none;opacity:1}#tab1:checked~#rollers .plain-roller,#tab2:checked~#rollers .adv-roller,#tab3:checked~#rollers .dice-picker,#tab4:checked~#rollers .genesys-dice-picker{z-index:1;opacity:1;transform:scale(1)}.displayResults{display:flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;transform:translateZ(0)}.displayResults .results{position:absolute;cursor:pointer;background:#CCCCCC;font-size:2rem;padding:10px 20px;margin:40px;border-radius:10px;transform:scale(1.5);opacity:0;pointer-events:all}.displayResults .showEffect{transform:scale(1);opacity:1;z-index:2}.displayResults .hideEffect{transform:scale(.5);opacity:0;z-index:1}.displayResults .hidden{pointer-events:none}.displayResults .crit-success{color:green}.displayResults .crit-failure{color:#b22222}.displayResults .die-dropped,.displayResults .die-rerolled{text-decoration:line-through;opacity:.4}.displayResults .die-exploded{color:green}.displayResults .die-exploded:after{content:"!";display:"block";color:green}.displayResults .success,.displayResults .failure,.displayResults .null{position:relative;top:6px;width:32px;height:32px}.displayResults .success{fill:#4b8968}.displayResults .failure{fill:#a82e2d}.displayResults .null{fill:#3e577d}.displayResults .crit-success .success{border:3px solid green;border-radius:50%;top:9px}.displayResults .crit-failure .failure{border:3px solid #A82E2D;border-radius:50%;top:9px}.adv-roller{position:absolute;top:0;left:0;right:0;display:flex;justify-content:center;margin:30px;flex-direction:column;text-align:center}.adv-roller form{margin-bottom:10px}.adv-roller--notation{padding:10px;margin-right:5px;text-align:center;border:2px solid;border-radius:5px}.adv-roller--clear{padding:10px}.adv-roller .footnote,.adv-roller .footnote a{color:#fff}.dice-picker{position:absolute;display:flex;top:0;left:0;right:0;padding:10px;justify-content:center;text-align:center}.dice-picker .die{width:50px;height:50px}.dice-picker .dice{margin-top:10px;margin-bottom:10px}.dice-picker .dice button{background-color:transparent;border:none}.dice-picker .output{display:inline-block;min-height:2.2rem;margin-bottom:10px;font-size:1.5rem;font-weight:700;background-color:#ffffff4d;padding:5px 15px;border-radius:10px}.dice-picker button img{filter:drop-shadow(5px 5px 5px rgba(0,0,0,.5))}.genesysResults{display:flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;transform:translateZ(0)}.genesysResults .results{position:absolute;cursor:pointer;background:#CCCCCC;padding:10px 20px;margin:40px;border-radius:10px;text-align:center;transform:scale(1.5);opacity:0;pointer-events:all}.genesysResults .totals>span{display:inline-flex;flex-direction:row;align-items:center;margin-right:20px}.genesysResults .totals>span:last-child{margin-right:0}.genesysResults .total{font-size:2rem}.genesysResults .showEffect{transform:scale(1);opacity:1;z-index:2}.genesysResults .hideEffect{transform:scale(.5);opacity:0;z-index:1}.genesysResults .hidden{pointer-events:none}.genesysResults .symbol{display:inline-block;width:35px;height:35px}.genesysResults .totals .symbol{width:50px;height:50px}.genesysResults .die-boost{color:#1396ab}.genesysResults .die-setback{color:#000}.genesysResults .die-ability{color:#339730}.genesysResults .die-difficulty{color:#b921ef}.genesysResults .die-challenge{color:#971d17}.genesysResults .die-proficiency{color:#daa42a}.genesysResults .die-blank{font-size:3rem;line-height:100%;padding:8px 0 0}.genesysResults .tooltip{position:relative}.genesysResults .tooltiptext{visibility:hidden;background-color:#000;color:#fff;text-align:center;border-radius:6px;padding:5px 10px;position:absolute;z-index:1;bottom:110%;left:50%;font-size:1.5rem;line-height:100%;transform:translate(-50%)}.genesysResults .tooltiptext:after{content:"";position:absolute;top:100%;left:50%;margin-left:-8px;border-width:8px;border-style:solid;border-color:black transparent transparent transparent}.tooltip:hover .tooltiptext{visibility:visible}.genesys-dice-picker{position:absolute;display:flex;top:0;left:0;right:0;padding:10px;justify-content:center;text-align:center}.genesys-dice-picker .die{height:70px;width:auto}.genesys-dice-picker .dice{margin-top:10px;margin-bottom:10px}.genesys-dice-picker .dice button{background-color:transparent;border:none}.genesys-dice-picker .output{display:inline-block;min-height:2.2rem;margin-bottom:10px;font-size:1.5rem;font-weight:700;background-color:#ffffff4d;padding:5px 15px;border-radius:10px}.genesys-dice-picker button img{filter:drop-shadow(5px 5px 5px rgba(0,0,0,.5))}.dice-box-canvas{opacity:1;transition:opacity 1s}.dice-box-canvas--hide{opacity:0}