:root{--text-colour:#ffffffde;--text-colour_alt:#ffffff80;--background-colour:#0b0b0b;--border-colour:#0f0f0f;--square-colour:#0b0b0b;--square-colour_given:#0f0f0f;--square-colour_hover:#0d0d0d;--square-colour_active:var(--accent-colour);--button-colour:#141414;--keypad-background:#1b1b1b}@media (prefers-color-scheme:light){:root{--text-colour:#0b0b0bde;--text-colour_alt:#0b0b0b80;--background-colour:#f4f4f4;--border-colour:#e4e4e4;--square-colour_given:#e4e4e4;--square-colour:#f4f4f4;--square-colour_hover:#ededed;--square-colour_active:var(--accent-colour);--button-colour:#e6e6e6;--keypad-background:#dcdcdc}}:root{--font-family:"Space Grotesk",system-ui,Avenir,Helvetica,Arial,sans-serif;--font-size:16px;--border-radius:8px;--game-background-colour:#4000ff3f;--invalid-colour:#ff4d4f;--accent-colour:#ff70cb;font-family:var(--font-family);font-size:var(--font-size);--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;background-color:var(--background-colour);color:var(--text-colour);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:var(--accent-colour);-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{opacity:.75}body{place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}h1{font-size:3.2em;line-height:1.1}button{border-radius:var(--border-radius);background-color:var(--button-colour);cursor:pointer;border:1px solid #0000;padding:.6em 1.2em;font-family:inherit;font-size:1em;transition:border-color .25s}button:hover,button:focus-visible{color:var(--text-colour_alt)}button:active{opacity:1;background:var(--accent-colour);color:#fff}button:focus-visible{outline:2px solid var(--accent-colour)}input{font:inherit;border-radius:var(--border-radius);border:1px solid var(--border-colour);background-color:var(--background-colour);color:var(--text-colour_alt)}input:focus-visible{outline:2px solid var(--accent-colour)}svg{stroke:currentColor;width:1.5rem;height:1.5rem}#root{flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}:root{--rainbow:linear-gradient(to left,#fef26a,#fe8462,#ff70cb,#d270ff,#743ad5,#709df8,#5bffbd,#709df8,#743ad5,#d270ff,#ff70cb,#fe8462,#fef26a)}.rainbow-line{z-index:2147483647;background-image:var(--rainbow);background-size:400%;width:100%;height:1px;animation:100s infinite rainbow-animation;position:fixed;top:0}@keyframes rainbow-animation{0%{background-position:0%}to{background-position:400%}}.board-container{--grid-gap:.1rem;box-sizing:border-box;max-width:900px;padding:var(--grid-gap);gap:var(--grid-gap);border-radius:var(--border-radius);background-color:var(--game-background-colour);grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);display:grid}@media (max-width:710px){.board-wrapper{padding:20px}}@media (orientation:landscape) and (max-height:800px){.board-container{max-width:600px!important}}@media (orientation:landscape) and (max-height:700px){.board-container{max-width:500px!important}}@media (orientation:landscape) and (max-height:600px){.board-container{max-width:400px!important}}@media (orientation:landscape) and (max-height:500px){.board-container{max-width:300px!important}.controls{margin:.5rem 0!important}}@media (orientation:landscape) and (max-height:400px){.board-container{max-width:270px!important}}@media (max-width:1920px){.board-container{max-width:700px}}.board{aspect-ratio:1;gap:var(--grid-gap);border:var(--grid-gap)solid var(--square-colour_given);border-radius:var(--border-radius);background:var(--square-colour_given);grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);font-size:clamp(16px,1.5em,24px);display:grid}@media (max-width:800px){.board{font-size:clamp(16px,1em,24px)}}@media (max-width:500px){.board{font-size:clamp(16px,.75em,24px)}}.square{border-radius:var(--border-radius);background:var(--square-colour);justify-content:center;align-items:center;line-height:1rem;display:flex}.square.editable:hover{background:var(--square-colour_hover)}.square.editable:active{background:var(--square-colour_active)}.square.given{color:var(--text-colour_alt);background:var(--square-colour_given)}.square.invalid{outline:2px solid var(--invalid-colour);z-index:1}.square-text{-webkit-user-select:none;user-select:none}.square-cell{width:100%;height:100%;position:relative}.keypad{background:var(--keypad-background);border-radius:var(--border-radius);z-index:172;grid-template-columns:auto auto auto;gap:.15rem;margin-top:.25rem;padding:.25rem;display:grid;position:absolute;top:100%;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #00000040}.keypad-key{box-sizing:border-box;appearance:none;border-radius:var(--border-radius);aspect-ratio:1;background:var(--square-colour);width:2.1em;color:var(--text-colour);font:inherit;cursor:pointer;border:none;padding:0}.keypad-key:hover{color:var(--text-colour)}.keypad-delete{width:100%;height:1.66em;color:var(--text-colour);grid-column:1/4}.keypad-delete:hover{filter:brightness(.95)}.keypad-delete:active{filter:brightness(.9)}.square-input{cursor:pointer;box-sizing:border-box;aspect-ratio:1;text-align:center;width:100%;color:var(--text-colour);font:inherit;caret-color:#0000;background:0 0;border:none}.square-input:focus{outline:2px solid var(--accent-colour);z-index:1;border-radius:var(--border-radius)}.notes-grid{pointer-events:none;color:var(--text-colour_alt);opacity:.9;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);font-size:clamp(16px,.5em,24px);display:grid;position:absolute;inset:0}.notes-grid .note{justify-content:center;align-items:center;display:flex}.notes-grid .note.present{opacity:1}button{color:var(--text-colour)}.controls{justify-content:space-between;gap:8px;margin:1rem 0;display:flex}.controls button{justify-content:center;align-items:center;gap:8px;width:100%;display:flex}.controls .notes-button[aria-pressed=true]{background:var(--accent-colour);color:#fff;opacity:1}.newgame--icon{transition:transform .3s ease-in-out;transform:rotate(0)}.new-game-button:hover .newgame--icon{transform:rotate(-90deg)}.new-game-button:active .newgame--icon{transform:rotate(-180deg)}.notes--icon{fill:currentColor;transition:transform .2s;transform:rotate(-25deg)scale(.8)}.notes-button:hover .notes--icon{animation:.3s ease-in-out scribble}@keyframes scribble{25%{transform:rotate(-30deg)translate(-1px,1px)scale(.8)}50%{transform:rotate(-20deg)translate(1px,-1px)scale(.8)}75%{transform:rotate(-28deg)translate(-1px)scale(.8)}}input[name=font_input]{width:10em}input[name=font-size_input]{text-align:center;appearance:textfield;width:3em;padding:4px 0;font-size:.9em}input[name=font-size_input]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[name=font-size_input]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}form:has(label[for=font-size_input]){margin-top:.5em}.colours__container{--colour-size:18px;grid-template-columns:repeat(6,1fr);gap:10px;width:100%;min-width:150px;padding-bottom:10px;display:grid}.theme__colour__container{gap:10px;display:flex}.theme__colour__container p{text-wrap:nowrap;width:fit-content;margin-bottom:0}.theme__colour{box-sizing:border-box;width:var(--colour-size);aspect-ratio:1;border:1px solid var(--text-colour);box-shadow:inset 0 0 0 1px var(--square-colour_hover);cursor:pointer;border-radius:10000px;align-self:center}.theme__colour:hover{border:1px solid var(--accent-colour)}.theme__colour:focus-visible{border:1px solid var(--accent-colour);outline:2px solid var(--accent-colour)}.theme__colour.selected{border:1px solid var(--accent-colour);outline:1px solid var(--accent-colour)}.selected-colour{justify-content:center;display:flex}.colour-picker{border:1px solid var(--border-colour);border-radius:var(--border-radius);width:100%;height:30px;overflow:hidden}.colour-picker input[type=color]{cursor:pointer;width:150%;height:150%;margin:-10px;padding:0}.colour-picker:has(input[type=color]:focus-visible){outline:2px solid var(--accent-colour)}.colour__picker .react-colorful{width:100%}.colour__picker .react-colorful__saturation{border-radius:var(--border-radius);border-bottom:none;margin-bottom:8px}.colour__picker .react-colorful__hue{border-radius:var(--border-radius)var(--border-radius)0 0;height:15px}.colour__picker .react-colorful__alpha{border-radius:0 0 var(--border-radius)var(--border-radius);height:15px}.react-colorful__pointer{cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-color:var(--border-colour)!important;border-radius:var(--border-radius)!important;background-color:#0000!important;width:20px!important;height:20px!important;overflow:hidden!important}.react-colorful__pointer.react-colorful__hue-pointer,.react-colorful__pointer.react-colorful__alpha-pointer{width:10px!important;height:20px!important}.react-colorful__pointer-fill{border-radius:0!important}.rgba__inputs{grid-template-columns:repeat(4,1fr);gap:.5em;margin-top:10px;display:grid}.rgba__input-group{flex-direction:column;gap:4px;display:flex}.rgba__input-group label{color:var(--text-colour);text-align:center;font-size:.8em}.rgba__input{text-align:center;width:100%;padding:4px 0;font-size:.9em}.rgba__input:focus{outline:2px solid var(--accent-colour);border-color:var(--accent-colour)}.rgba__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.rgba__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.rgba__input[type=number]{appearance:textfield}.theme__controls{justify-content:center;margin-top:15px;display:flex}.theme__controls .reset-theme-btn{width:100%;font-size:.9em}.settings__container{--boxshadow:0px 8px 16px 0px #0003;position:absolute;top:20px;right:20px}.settings__button{align-items:center;gap:4px;display:flex}.settings__button:has(+.open){opacity:1;background:var(--accent-colour);color:#fff;box-shadow:var(--boxshadow)}.settings__dropdown-wrapper{display:inline-block;position:relative}.settings__dropdown{border-radius:var(--border-radius);background-color:var(--square-colour_hover);min-width:250px;box-shadow:var(--boxshadow);z-index:1;margin-top:.3em;display:none;position:absolute;right:0}.settings__dropdown .collapsible{border-radius:var(--border-radius);stroke:var(--text-colour);fill:var(--text-colour);color:var(--text-colour);width:100%;font-size:inherit;cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-family:inherit;text-decoration:none;display:flex}.settings__dropdown .collapsible:hover{opacity:1;background-color:var(--button-colour)}.settings__dropdown .collapsible:has(+.open){opacity:1;background-color:var(--button-colour)}.settings__dropdown .collapsible:first-child{border-bottom-right-radius:0;border-bottom-left-radius:0}.settings__dropdown .collapsible:nth-child(3){border-top-left-radius:0!important;border-top-right-radius:0!important}.settings__dropdown .collapsible:has(+.open){background-image:repeating-linear-gradient(135deg,var(--square-colour),var(--square-colour)10px,var(--square-colour_hover)10px,var(--square-colour_hover)20px)}.open{display:block!important}.content.open:nth-child(4){border-radius:0 0 var(--border-radius)var(--border-radius)}.settings__dropdown .content{background-color:var(--square-colour_hover);padding:12px 18px;display:none;overflow:hidden}.settings__dropdown .content p{margin-top:0}.settings__dropdown .content form{justify-content:space-between;gap:10px;display:flex}