@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@500&display=swap";body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;transition:background-color .3s ease,color .3s ease,border-color .3s ease}body{overscroll-behavior:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}*{-webkit-tap-highlight-color:transparent}input,select,textarea{font-size:16px}@media (prefers-reduced-motion: no-preference){*{will-change:transform}}.mainContainer{min-height:100vh;display:flex;flex-direction:column}.container{flex:1;padding:16px 16px 15px;display:flex;flex-direction:column;align-items:center;width:100%;max-width:600px;margin:0 auto}.header{margin-bottom:1px;display:flex;justify-content:space-between;align-items:center;width:100%;border-bottom:2px solid}.title{font-size:32px;font-weight:700;text-align:center}.statsContainer{display:flex;justify-content:space-between;margin-top:5px;width:100%}.statsText{font-size:18px;font-weight:600}.footer{height:60px;display:flex;justify-content:center;align-items:center;padding:0 16px;border-top:1px solid;width:100%;background-color:#0000000d;font-size:14px;color:inherit;margin-top:20px;text-align:center}@media (min-height: 800px){.container{min-height:calc(100vh - 80px)}}.board{width:min(calc(100vw - 32px),450px);max-width:100%;aspect-ratio:1;border-width:2px;border-style:solid;border-radius:8px;margin:0 auto 10px;display:flex;flex-direction:column;align-items:center;overflow:hidden}.row{display:flex;width:100%;height:calc(100% / 9)}.cell-wrapper{width:calc(100% / 9);aspect-ratio:1;display:flex}.cell{flex:1;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:.3px solid;font-family:DM Sans,sans-serif;font-size:35px;font-weight:400;cursor:pointer;transition:all .2s ease;position:relative;box-shadow:inset 1px 1px 2px #a7a1a133,inset -1px -1px 2px #0000001a;background-image:linear-gradient(145deg,rgba(255,255,255,.05) 0%,rgba(0,0,0,.05) 100%)}.cell:hover{transform:scale(1.02);box-shadow:inset 1px 1px 3px #032edc4d,inset -1px -1px 3px #2102ac33}.cell:active{transform:scale(.98);box-shadow:inset -1px -1px 3px #05050533,inset 1px 1px 3px #0003}.bottomBorder{border-bottom:3px solid}.rightBorder{border-right:3px solid}@media (min-width: 769px){.board{width:450px}.cell{font-size:36px}}.headerControls{display:flex;gap:5px}.iconButton{padding:8px;border-radius:12px;width:32px;height:32px;border:none;cursor:pointer;transition:all .2s ease;box-shadow:2px 2px 5px #0003,-2px -2px 5px #ffffff1a;background-image:linear-gradient(145deg,rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%);display:flex;align-items:center;justify-content:center}.difficultyContainer{display:flex;justify-content:center;margin-bottom:20px;gap:8px;width:100%}.difficultyButton{padding:8px 20px;border-radius:20px;border:none;cursor:pointer;font-weight:600;font-size:16px;transition:all .2s ease;box-shadow:2px 2px 5px #0003,-2px -2px 5px #ffffff1a;background-image:linear-gradient(145deg,rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%)}.numpad{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px;max-width:500px;width:100%}.numButton{width:45px;height:45px;display:flex;justify-content:center;align-items:center;border-radius:8px;border:none;font-size:20px;cursor:pointer;transition:all .2s ease;box-shadow:2px 2px 5px #0003,-2px -2px 5px #ffffff1a;background-image:linear-gradient(145deg,rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%)}.actionButtons{display:flex;justify-content:center;gap:16px}.actionButton{display:flex;align-items:center;padding:10px 16px;border-radius:8px;border:none;gap:5px;cursor:pointer;font-weight:600;font-size:16px;transition:all .2s ease;box-shadow:2px 2px 5px #0003,-2px -2px 5px #ffffff1a;background-image:linear-gradient(145deg,rgba(255,255,255,.1) 0%,rgba(0,0,0,.1) 100%)}.iconButton:hover,.difficultyButton:hover,.numButton:hover,.actionButton:hover{transform:translateY(-1px);box-shadow:3px 3px 6px #00000040,-3px -3px 6px #ffffff26}.iconButton:active,.difficultyButton:active,.numButton:active,.actionButton:active{transform:translateY(1px);box-shadow:1px 1px 3px #0003,-1px -1px 3px #ffffff1a}.actionButton.disabled{opacity:.5;cursor:not-allowed}@media (min-width: 769px){.numButton{width:52px;height:52px;font-size:24px}.actionButton{padding:12px 20px;font-size:18px}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}75%{transform:translate(3px)}}@keyframes errorFlash{0%{background-color:#f443361a;transform:translate(0)}25%{background-color:#f443364d;transform:translate(-3px)}50%{background-color:#f4433666;transform:translate(0)}75%{background-color:#f443364d;transform:translate(3px)}to{background-color:#f443361a;transform:translate(0)}}@keyframes successPop{0%{transform:scale(1);background-color:#4caf5000}50%{transform:scale(1.1) rotate(5deg);background-color:#37b83b4d}to{transform:scale(1);background-color:#4caf5000}}.cell.error{animation:shake .4s ease-in-out,errorFlash 1s ease-in-out}.cell.success{animation:successPop .5s ease-out forwards}.winMessage{animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 480px){body{overflow-x:hidden}.container{padding:8px 4px}.header,.statsContainer,.difficultyContainer,.controls{width:100%;max-width:100%;padding:0 5px}.title{font-size:22px}.statsText{font-size:14px}.iconButton{width:28px;height:28px;padding:6px}.headerControls{gap:6px}.board{width:min(calc(100vw - 32px),450px)}.cell{font-size:min(28px,5vw)}.numpad{gap:4px;margin-bottom:12px;padding:0 4px}.numButton{width:calc((100vw - 64px)/5);height:calc((100vw - 64px)/5);max-width:50px;max-height:50px;min-width:35px;min-height:35px;font-size:min(28px,5vw)}.actionButtons{gap:8px}.actionButton{padding:8px 12px;font-size:14px;white-space:nowrap}.difficultyButton{padding:6px 10px;font-size:14px}.footer{height:40px;font-size:12px}}@media (min-width: 481px) and (max-width: 768px){.container{padding:8px}.header,.statsContainer,.difficultyContainer,.controls{width:100%;max-width:360px}.cell{font-size:min(26px,calc(100vw / 22))}.numButton{width:45px;height:45px;font-size:26px}.difficultyButton{padding:6px 12px;font-size:14px}.title{font-size:24px}}