@import"https://fonts.googleapis.com/css2?family=Karla:wght@400;700&display=swap";*{box-sizing:border-box}body{font-family:Karla,sans-serif;background-color:#0b2434;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;padding:20px}div#root{width:100%;height:100%;max-height:540px;max-width:540px}main{background-color:#f5f5f5;height:100%;border-radius:7px;display:flex;flex-direction:column;align-items:center}.title{font-size:2.5rem;font-weight:700;color:#333;margin-bottom:.2em}.instructions{font-size:1.2rem;color:#666;margin-top:0;margin-bottom:3.125em;text-align:center}.dice--container{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.die{width:60px;height:60px;background-color:#fff;border-radius:12px;border:2px solid #333;display:grid;place-items:center;position:relative;cursor:pointer;margin:5px;transition:background-color .2s}.die.held{background-color:#59e391}.pip{width:12px;height:12px;background-color:#333;border-radius:50%;position:absolute}.top-left{top:8px;left:8px}.top-right{top:8px;right:8px}.bottom-left{bottom:8px;left:8px}.bottom-right{bottom:8px;right:8px}.center{top:50%;left:50%;transform:translate(-50%,-50%)}.middle-left{top:50%;left:8px;transform:translateY(-50%)}.middle-right{top:50%;right:8px;transform:translateY(-50%)}.roll--btn{background-color:#5035ff;border:none;border-radius:5px;font-size:1.2rem;color:#fff;padding:15px 40px;cursor:pointer;margin-top:2em}.stats--title{display:flex;justify-content:space-around;align-items:center;width:100%;margin-top:1.5em}.roll--count,.timer{font-size:1.2rem;color:#5035ff;margin:0}.sr-only{color:#5035ff;font-size:1rem;font-style:bold;font-weight:700}