:root{--eggshell: #faf3dd;--laurel-green: #c8d5b9;--cambridge-blue: #8fc0a9;--green-sheen: #68b0ab;--black-coral: #696d7d}html{font-size:16px;box-sizing:border-box;font-weight:400}*,*::before,*::after{box-sizing:border-box}body{background-color:var(--black-coral);width:100vw;height:100vh;margin:0;font-family:Poppins;color:var(--black-coral);font-weight:300;overflow:hidden}.container{display:grid;height:100%;grid-template-columns:1fr;grid-template-rows:3.125rem 1fr 3.125rem;grid-gap:0.625rem}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-weight:inherit;border:0.125rem solid var(--black-coral);padding:0.125rem 0.25rem;font-size:1.875rem;background-color:var(--laurel-green);border-radius:0.1875rem;outline:none;cursor:pointer;color:inherit;transition:background-color .2s ease-in-out}button:hover{background-color:var(--eggshell)}h1,h2,h3,h4,h5,h6{margin:0;text-align:center}p{margin:0}a{color:var(--green-sheen);text-decoration:inherit;transition:color .2s ease-in-out}a:hover{color:var(--cambridge-blue)}::-moz-selection{background-color:var(--green-sheen)}::selection{background-color:var(--green-sheen)}@font-face{font-family:Poppins;font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/Poppins/Poppins-Light.ttf") format("truetype")}@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/Poppins/Poppins-Regular.ttf") format("truetype")}@font-face{font-family:Poppins;font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/Poppins/Poppins-SemiBold.ttf") format("truetype")}@font-face{font-family:Pacifico;font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/Pacifico/Pacifico-Regular.ttf") format("truetype")}.header{background-color:var(--laurel-green);display:flex;justify-content:space-around;font-size:1.25rem;padding:0.3125rem}.header__numberChoose{height:100%;padding:0.3125rem;background-color:var(--green-sheen);color:var(--eggshell);display:flex;gap:0.625rem;align-items:center;justify-content:center;font-size:2.5rem;border-radius:0.3125rem;cursor:default}.header__numberChoose span{width:100%;text-align:center}.header__arrow{background-color:var(--laurel-green);color:var(--black-coral);height:100%;line-height:67%;font-size:3.125rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:0.1875rem;transition:background-color .2s ease-in-out}.header__arrow:hover{background-color:var(--eggshell)}.header__currentNumber{width:3.75rem;font-size:2.1875rem;text-align:center}.header__dot{font-size:.5em;line-height:4}.header__button{background-color:var(--cambridge-blue)}.game{position:relative;margin:0 0.625rem}.game__canvas{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.footer{background-color:var(--laurel-green);display:flex;justify-content:center;align-items:center;font-size:1.125rem;padding:0.3125rem}.footer p{margin:0}.modal{position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.1333333333);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity .2s ease-in-out,visibility 0s linear}.modal--opening{opacity:1;visibility:visible}.modal--opened{transition:opacity .2s ease-in-out,visibility 0s .2s linear}.victory__content,.confirmBox__content{margin:0.625rem;box-shadow:0.625rem 0.625rem 1.625rem -0.4375rem rgba(0,0,0,.7490196078);padding:1.25rem 2.5rem;background-color:var(--laurel-green);border:0.25rem solid var(--black-coral);border-radius:0.375rem;padding:0.625rem}.victory__content h1,.confirmBox__content h1{color:var(--green-sheen);text-decoration:underline;font-size:1.875rem}.victory__content h2,.confirmBox__content h2{font-size:1.25rem}.victory__content button,.confirmBox__content button{display:block;margin:0.625rem auto 0 auto;font-size:1.25rem;font-weight:400}.victory,.confirmBox{z-index:3;background-color:rgba(0,0,0,.3333333333)}.confirmBox__buttons{display:flex}.setup{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--black-coral);z-index:3;overflow:auto;overflow:hidden;text-align:center}.setup__content{position:relative;padding:1.25rem 2.5rem;border:0.125rem solid var(--green-sheen);border-radius:0.3125rem;background-color:var(--laurel-green);width:100%;overflow:auto}.setup__content h1{font-size:2.5rem;color:var(--black-coral)}.setup__content h2{color:var(--cambridge-blue);font-weight:400;font-size:1.25rem;margin-bottom:1.25rem}.setup__content h3{font-size:1.75rem}.setup__content button{display:block;margin:0 auto 0.625rem auto}.setup__content button:not(:hover){background-color:var(--cambridge-blue)}.setup__content a:not(:hover){color:var(--cambridge-blue);text-decoration:underline}.setup__close{position:absolute;top:0;right:0;font-size:3.75rem;width:3.125rem;height:3.125rem;font-weight:500;cursor:pointer;transition:color .2s ease-in-out;color:var(--black-coral)}.setup__close:hover{color:var(--cambridge-blue)}.setup h1{font-family:Pacifico;letter-spacing:0.1875rem;line-height:1;font-weight:200;text-decoration:underline;text-shadow:0.125rem 0.125rem 0.0625rem var(--black-coral)}.setup h2{text-shadow:0.0625rem 0.0625rem 0.0625rem var(--eggshell)}.setup__content{max-height:100%}.setup--closed{visibility:hidden;opacity:0}@media (min-width: 64rem){button{font-size:inherit;padding:0.4375rem 0.625rem}}@media (min-width: 40rem){.header__currentNumber{font-size:2.5rem}.footer{font-size:1.25rem}.victory__content,.confirmBox__content{padding:1.5625rem}.victory__content h1,.confirmBox__content h1{font-size:2.5rem}.victory__content h2,.confirmBox__content h2{font-size:1.5625rem}.setup{display:flex;justify-content:center;align-items:center}.setup__content{margin:1.25rem;width:initial}.setup__content h1{font-size:3.4375rem}.setup__content h2{font-size:1.25rem}.setup__content h3{font-size:1.25rem}}@media (max-width: 39.9375rem){.setup__content{border:none;border-radius:0;min-height:100%}}