:root{--grid-columns:6;--grid-rows:3;--letter-size:calc(48vh / var(--grid-columns))}.hack-box-container{margin-top:10%}.game-grid{grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(var(--grid-rows),1fr)}.game-grid,.game-grid-row{display:grid;gap:.5rem;z-index:1}.game-grid-row{justify-content:center;grid-template-columns:repeat(var(--grid-columns),1fr);grid-template-rows:repeat(1,1fr)}.lock-container{display:grid;grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(var(--grid-rows),1fr);gap:.5rem;z-index:999}.lock-container .lock-row{display:grid;justify-content:center;grid-template-columns:repeat(var(--grid-columns),1fr);grid-template-rows:repeat(1,1fr);gap:.5rem;z-index:999}.timer-container{background-color:#242f3b;display:flex;width:100%;height:10px;margin-top:auto}.timer-progress-bar{bottom:100px;background-color:#ff4500;width:100%;height:100%}.message-container{position:absolute;top:0;width:100%;height:70px;display:flex;justify-content:flex-end;align-items:center;margin-right:20px}.lose-message{padding:0 18px;background-color:#5b1425}.lose-message,.win-message{height:40px;gap:10px;display:none;color:#fff;border-radius:5px;align-items:center;justify-content:center}.win-message{padding:0 10px;background-color:#1e7d73}.reset-message{height:40px;gap:10px;display:none;color:#fff;padding:0 10px;border-radius:5px;align-items:center;justify-content:center;background-color:#768025}.lose-message p,.reset-message p,.win-message p{font-size:10.5px;font-weight:500}.letter{display:flex;align-items:center;justify-content:center;font-size:2rem;width:var(--letter-size);height:var(--letter-size);color:#70c1ff;border:.125rem solid rgba(112,193,255,.4);border-radius:5px;z-index:1}.letter.done{color:#54ffa4;border:.125rem solid rgba(84,255,164,.4);background-color:rgba(84,255,164,.05)}.letter.fail{color:#ff5454;border:.125rem solid rgba(255,84,84,.4);background-color:rgba(255,84,84,.05)}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:transparent;z-index:9999}.other-container{display:flex;align-items:left;justify-content:left;gap:10px;margin-top:10px}.home-button{background-color:#54ffa4;border-radius:100px;box-shadow:0 0 3px #7fffbf;color:#000;cursor:pointer;display:inline-block;font-family:CerebriSans-Regular,-apple-system,system-ui,Roboto,sans-serif;padding:10px 20px;text-align:center;text-decoration:none;transition:all .25s;border:0;font-size:16px;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:manipulation}.home-button:hover{box-shadow:inset 0 -25px 18px -14px rgba(127,255,191,.397),0 1px 2px rgba(127,255,191,.397),0 2px 4px rgba(127,255,191,.397),0 4px 8px rgba(127,255,191,.397),0 8px 16px rgba(127,255,191,.397),0 16px 32px rgba(127,255,191,.397);transform:scale(1.05) rotate(-1deg)}.gamePad{width:40px}#settings-icon{color:#5e5d5d;width:40px;height:40px;cursor:pointer;position:absolute;right:0;transition:all .3s cubic-bezier(.68,-.55,.27,1.55)}#settings-icon:hover{transform:scale(1.1) rotate(270deg)}.settings-container{flex-direction:column;background:radial-gradient(rgba(15,27,33,.781),#0f1b21);outline:3px solid #54ffa4;z-index:10000;position:absolute;width:640px;height:580px;display:none;left:50%;top:55%;gap:50px;transform:translate(-50%,-50%)}#settings-exit{position:absolute;color:#5e5d5d;top:0;right:0;width:20px;height:20px;cursor:pointer}.settings-header{font-size:25px;color:#54ffa4;text-shadow:0 0 2.1px #7fffbf;margin:20px 0 0 20px}.sliders{margin:-20px auto 10px;flex-direction:row;width:70%}.sliders,.timing-container{color:#5e5d5d;font-size:20px;display:flex;justify-content:center}.timing-container{width:50%;margin:0 auto;flex-direction:column;gap:5px;align-items:center}.timing-container .slider-value{position:relative;width:100%}.timing-container .slider-value span{position:absolute;text-align:center;height:25px;width:25px;color:rgba(22,40,52,.979);top:60px;left:7%;font-size:15px;transform:translateX(-80%);line-height:45px;z-index:2}.letters-container .slider-value span:after,.timing-container .slider-value span:after{position:absolute;text-align:center;left:50%;top:30%;content:"";height:25px;width:25px;background-color:#54ffa4;transform:translateX(-50%) rotate(45deg);border:3px solid rgba(22,40,52,.651);border-bottom-left-radius:70%;border-bottom-right-radius:70%;border-top-right-radius:70%;z-index:-1}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:20px;background:transparent;outline:none;cursor:pointer;border-radius:10px;box-shadow:0 0 2px #7fffbf;transition:all .3s}input::-moz-range-thumb{width:20px;background:#54ffa4;border-radius:50%;border:1px solid rgba(22,40,52,.651)}input::-moz-range-progress,input::-moz-range-thumb{height:20px;cursor:pointer;-moz-transition:all .3s;transition:all .3s}input::-moz-range-progress{width:100%;background:radial-gradient(rgba(22,40,52,.651),#162834);border-top-left-radius:10px;border-bottom-left-radius:10px}input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#54ffa4;cursor:pointer;border-radius:50%;border:1px solid rgba(22,40,52,.651);-webkit-transition:all .3s;transition:all .3s}.button-container{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:20px}#reset-button,#save-button{background-color:#54ffa4;border-radius:10px;box-shadow:0 0 2px #7fffbf;color:#000;cursor:pointer;display:inline-block;padding:10px 20px;text-align:center;text-decoration:none;transition:all .25s;border:0;font-size:16px;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:manipulation;width:100px}#reset-button:hover,#save-button:hover{box-shadow:inset 0 -25px 18px -14px rgba(127,255,191,.397),0 1px 2px rgba(127,255,191,.397),0 2px 4px rgba(127,255,191,.397),0 4px 8px rgba(127,255,191,.397),0 8px 16px rgba(127,255,191,.397),0 16px 32px rgba(127,255,191,.397);transform:scale(1.05) rotate(-1deg)}.letters-container{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#5e5d5d;width:35%;font-size:20px;transform:translate(92%)}.letters-container .slider-value{position:relative;width:85%}.letters-container .slider-value span{left:0;position:absolute;text-align:center;height:25px;width:25px;color:rgba(22,40,52,.979);top:50px;font-size:15px;line-height:45px;z-index:2;transform:translateX(-50%)}.letters-container input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:20px;background:transparent;outline:none;cursor:pointer;border-radius:10px;box-shadow:0 0 2px #7fffbf;transition:all .3s}.letters-container input::-moz-range-thumb{width:20px;height:20px;background:#54ffa4;cursor:pointer;border-radius:50%;border:1px solid rgba(22,40,52,.651);-moz-transition:all .3s;transition:all .3s}.letters-container input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#54ffa4;cursor:pointer;border-radius:50%;border:1px solid rgba(22,40,52,.651);-webkit-transition:all .3s;transition:all .3s}.letters-container input::-moz-range-progress{width:100%;height:20px;cursor:pointer;background:radial-gradient(rgba(22,40,52,.651),#162834);border-top-left-radius:10px;border-bottom-left-radius:10px;-moz-transition:all .3s;transition:all .3s}