*{box-sizing:border-box}body{margin:0;background-color:#0b2434;padding:20px}main{background-color:#0000;max-width:1000px;padding:20px;display:flex;flex-direction:column;justify-content:space-around;align-items:center;border-radius:25px}html,body{overscroll-behavior:none}.body{overscroll-behavior:none;text-align:center;background:#000;height:200vh}.hero-text{color:#fff}.btn-14{position:relative;color:#ffea00;border:none;padding:.5em 1em;z-index:2;border-radius:15px;background-color:#000;font-size:1.5rem;margin-top:10em}.btn-14:before,.btn-14:after{position:absolute;content:"";width:20%;height:20%;border:1px solid;z-index:-1;transition:all .3s ease}.btn-14:before{top:0;left:0;border-bottom-color:transparent;border-right-color:transparent;border-top-color:#ffea00;border-left-color:#ffea00}.btn-14:after{bottom:0;right:0;border-top-color:transparent;border-left-color:transparent;border-bottom-color:#ffea00;border-right-color:#ffea00}.btn-14:hover:before,.btn-14:hover:after{border-color:#ffea00;height:100%;width:100%;box-shadow:0 0 5px #ffea00,0 0 5px #ffea00 inset}.title{font-size:40px;margin:0}.header-section{background-image:url(futuristicbg.png);background-position:center;background-repeat:no-repeat;background-size:cover;width:100%;height:400px;display:flex;flex-direction:column;justify-content:center;align-items:start;color:#f2ff00;text-shadow:5px 5px 10px rgb(255,0,242);margin-bottom:3em;padding-left:2em;font-family:Orbitron,sans-serif;border-radius:25px}.header-section h1{font-size:4rem;margin:0;border-bottom:3px solid}.header-section p{width:300px}.spline-bg{transition:opacity .6s ease,visibility .6s ease;z-index:100;height:200vh;width:100%}.main-container{height:110vh}main{z-index:300;position:absolute;width:100%;height:100%;left:10%}.dice-section{display:flex;flex-direction:column;justify-content:center;align-items:center}.dice-container{display:grid;grid-template:auto auto auto auto / repeat(5,1fr);gap:30px;margin-bottom:40px;padding:2em}.dice-container,.highscore,.scoreboard{border:2px solid rgba(225,225,225,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 0 10px #0003;border-radius:25px}.die-num{font-size:2rem}.roll-dice{height:50px;width:200px;border:none;border-radius:25px;box-shadow:0 0 20px 5px #c9c9c9;font-size:1.5rem;font-family:Orbitron,sans-serif;cursor:pointer}.roll-dice:focus{outline:none}.roll-dice:active{box-shadow:inset 5px 5px 10px -3px #000000b3}.diamond{box-shadow:0 0 20px 5px #f0f;color:#f0f}.diamond,.heart,.star,.bomb,.bolt,.fish{height:50px;width:50px;border-radius:10px;display:flex;justify-content:center;align-items:center;cursor:pointer}.heart{box-shadow:0 0 20px 5px red;color:red}.star{box-shadow:0 0 20px 5px #fff700;color:#fff700}.bomb{box-shadow:0 0 20px 5px #4b4b4b;color:#4b4b4b}.fish{box-shadow:0 0 20px 5px #0df;color:#0df}.bolt{box-shadow:0 0 20px 5px #00ff2f;color:#00ff2f}.flex-container{display:flex;justify-content:space-evenly;align-items:start;width:100%;gap:1em}.scoreboard,.highscore{padding:1em}.scoreboard{color:#fbff00;width:150px;font-size:3rem;font-family:Orbitron,sans-serif;display:flex;justify-content:center;align-items:center;margin-right:.1em}.score{width:150px;padding:.1em;text-align:center}.highscore{width:200px;color:#ffea00;font-size:1rem;text-align:center;list-style-position:inside}.highscore li{text-align:left;margin-left:20%;font-size:1.5rem}@media (max-width: 1075px){main{left:5%}body{font-size:.5rem}.flex-container{flex-direction:column;width:500px;margin:1em auto}.scoreboard{width:50%}.highscore,.spline{display:none}}@media (max-width: 500px){.scoreboard{width:40%}.body{font-size:.3rem}.dice-container{grid-template:auto auto auto auto auto / repeat(4,1fr)}}