body{margin: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}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{color-scheme:light dark;--bg: light-dark(#cee0ff, #0a111e);--highlight: light-dark(#0055ff, #0ec3c9);--element-bg: light-dark(#c1cbff, #0f0718);--element-hover: light-dark(#e0e6ff, #28234e);--element-active: light-dark(#6483ff, #000);--selected-bg: light-dark(#7d95ff, #30449e);--selected-hover: light-dark(#a9b8ff, #5669bf);--border: #6a86cd;--element-border: 2px solid var(--border);--hover-border: #00b3ff;--gradient: linear-gradient( 45deg, light-dark(#2b8cb6, #00b3ff), light-dark(#00c7d1, #00f2ff) );--active: #0048ff;--active-gradient: linear-gradient(45deg, var(--active), #00b3ff);--main: light-dark(#222, #ddd);--element-transform: scale(1.2);--margin: 4px;--size-element: 16px}*{outline:none;scrollbar-color:var(--main) #0000;scrollbar-width:thin}a{cursor:pointer}a:hover{color:var(--highlight)}label{display:flex;align-items:center;cursor:pointer}label:hover{color:var(--highlight)}label>p{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:calc(100% - 32px)}input[type=checkbox]{-webkit-appearance:none;appearance:none;width:var(--size-element);height:var(--size-element);margin:var(--margin);background:var(--element-bg);border:var(--element-border);cursor:pointer;outline:none;position:relative;flex-shrink:0}input[type=checkbox]:hover{background:var(--element-hover);border-color:var(--hover-border);transform:var(--element-transform)}input[type=checkbox]:active{background:var(--element-active);border-color:var(--active);transform:var(--element-transform)}input[type=checkbox]:checked:before,input[type=checkbox]:checked:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:2px;background:var(--gradient);transform:translate(-50%,-50%)}input[type=checkbox]:checked:before{transform:translate(-50%,-50%) rotate(45deg)}input[type=checkbox]:checked:after{transform:translate(-50%,-50%) rotate(-45deg)}input[type=radio]{-webkit-appearance:none;appearance:none;width:var(--size-element);height:var(--size-element);margin:var(--margin);background:var(--element-bg);border:var(--element-border);border-radius:50%;cursor:pointer;outline:none;position:relative;box-sizing:border-box;flex-shrink:0}input[type=radio]:hover{background:var(--element-hover);border-color:var(--hover-border);transform:var(--element-transform)}input[type=radio]:active{background:var(--element-active);border-color:var(--active);transform:var(--element-transform)}input[type=radio]:checked:after{content:"";position:absolute;top:50%;left:50%;width:8px;height:8px;background:var(--gradient);border-radius:50%;transform:translate(-50%,-50%)}input[type=range]{-webkit-appearance:none;appearance:none;width:80px;height:var(--size-element);margin:var(--margin);background:transparent;cursor:pointer}input[type=range]:disabled{cursor:not-allowed}input[type=range]::-moz-range-track{box-sizing:border-box;height:var(--size-element);background:var(--element-bg);border:var(--element-border)}input[type=range]::-webkit-slider-runnable-track{box-sizing:border-box;height:var(--size-element);background:var(--element-bg);border:var(--element-border)}input[type=range]::-moz-range-thumb{border:none;box-shadow:none;width:var(--size-element);height:13px;border-radius:4px;background:var(--gradient);cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:var(--size-element);height:13px;border-radius:4px;background:var(--gradient);cursor:pointer}input[type=range]:hover::-moz-range-thumb{transform:var(--element-transform)}input[type=range]:hover::-webkit-slider-thumb{transform:var(--element-transform)}input[type=range]:active::-moz-range-thumb{background:var(--active-gradient)}input[type=range]:active::-webkit-slider-thumb{background:var(--active-gradient)}input[type=range]:disabled::-moz-range-thumb{background:var(--main)}input[type=range]:disabled::-webkit-slider-thumb{background:var(--main)}input[type=text]{margin:var(--margin);padding:4px;background:var(--element-bg);color:var(--main);border:1px solid var(--border)}button{font-size:12px;width:100%;margin:var(--margin);padding:6px;background:var(--element-bg);color:var(--main);border:1px solid var(--border);cursor:pointer}button:hover{background:var(--element-hover);border:1px solid var(--hover-border)}button:active{background:var(--element-active);border:1px solid var(--active)}button:disabled{cursor:not-allowed;border:1px solid var(--main);color:var(--main);opacity:.5;background:var(--element-bg)}fieldset{margin:var(--margin);width:160px;min-width:0px;height:120px;overflow:auto}ol{margin:auto}li{transition:color .3s ease-out}li:hover{color:var(--highlight);cursor:pointer;transition:none}p{padding:0 6px;margin:0}.button-auto{width:auto}.status{margin:var(--margin) 0}.App{background:var(--bg);min-height:100vh;display:flex;justify-content:center;align-items:center;color:var(--main);-webkit-user-select:none;user-select:none}.flex-center{display:flex;align-items:center}.flex-column{display:flex;flex-direction:column}.flex-row{width:100%;display:flex;justify-content:center;margin:0 auto}.letter-row{margin:auto 6px}.letter{margin:0;width:36px}.letter-selected{margin:0;width:36px;background-color:var(--selected-bg)}.letter-selected:hover{background:var(--selected-hover)}.letter-selected:active{background:var(--selected-bg)}.game-canvas{position:relative;width:400px;height:400px;margin:var(--margin)}
