@import "https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap";:root{--blue-200:#cee3e9;--green-300:#52ffa8;--blue-600:#4e5d73;--blue-900:#323a49;--blue-950:#1f2632}html{font-size:28px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-optical-sizing:auto;font-family:Manrope,sans-serif;font-style:normal;font-weight:800}#root{background-color:var(--blue-950);width:100%;min-height:100vh;color:var(--blue-200);padding-top:1rem}img{block-size:auto;max-inline-size:100%;display:block}h1{text-align:center;color:var(--green-300);font-size:1.5rem}.quote-container{text-align:center;background-color:var(--blue-900);border-radius:.5rem;width:15rem;margin:5rem auto;padding:1rem 1rem 0}.advice-number{text-align:center;color:var(--green-300);margin-bottom:1rem;font-size:.7rem;font-weight:400}.divider{margin:1.5rem auto .5rem}.dice-btn{background-color:var(--green-300);cursor:pointer;border:0;border-radius:50%;padding:.6rem;transform:translate(5%,50%)}.dice-btn:hover,.dice-btn:focus{box-shadow:var(--green-300) 0 0 1rem 0;outline:0}.dice-btn:active{opacity:.7}@media screen and (width>=1025px){.quote-container{width:20rem}}