:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.user-item{display:flex;align-items:center;border-radius:4px;font-size:large;margin:10px 0}.status-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-left:16px;border:1px solid #9e9e9e}.status-online{background-color:#4caf50}.status-offline{background-color:#fff}.sudoku-board{display:grid;grid-template-columns:repeat(9,40px);grid-template-rows:repeat(9,40px);border:2px solid #000;gap:0;margin:20px auto;box-sizing:border-box}.sudoku-cell{display:flex;align-items:center;justify-content:center;font-size:32px;border:1px solid #999;font-family:Roboto,Helvetica Neue,Arial,sans-serif;font-weight:500;color:#22a;background-color:#ffd;transition:background-color .2s}.sudoku-cell.focused{border:2px solid #444;background-color:#ffd}.sudoku-cell.error{color:red;font-weight:500;background-color:#eee}.sudoku-numpad{display:flex;justify-content:center;gap:2px;margin-top:20px}.sudoku-numpad-button{width:39px;height:39px;font-size:32px;font-weight:500;font-family:Roboto,Helvetica Neue,Arial,sans-serif;cursor:pointer;border:1px solid #999;border-radius:4px;background-color:#ffd;color:#22a;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;-webkit-user-select:none;user-select:none;outline:none;box-shadow:none;transition:background-color .2s,transform .1s}.sudoku-numpad-button:focus,.sudoku-numpad-button:focus-visible{outline:none;box-shadow:none}.sudoku-numpad-button:hover{background-color:#ffe680}.sudoku-numpad-button:active{background-color:#fd5;transform:scale(.95)}.sudokuinfobox{display:flex;justify-content:space-between;gap:20px;width:90%;padding:0 10px;margin-bottom:10px}.border-bottom{border-bottom:3px solid #000}.border-right{border-right:3px solid #000}.sudoku-cell.highlight{background-color:#d0f0ff}body{margin:0;padding:0}.app-container{display:flex;width:75vw;max-width:1200px;height:80vh;margin:50px auto;background-color:#ccf;border-radius:8px;overflow:hidden;box-sizing:border-box}.users-box{flex:0 0 20%;background-color:#eef;padding:16px 32px;border-radius:8px 0 0 8px;overflow-y:auto;text-align:left}.main-content{flex:1;display:flex;flex-direction:column;padding:32px;box-sizing:border-box;justify-content:flex-start}.auth-buttons{display:flex;margin-bottom:8px;justify-content:flex-end;flex-wrap:wrap}.tech-stack{display:flex;margin-bottom:8px;justify-content:flex-start;flex-wrap:wrap}.info-connect4{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap;width:100%}.next-move{display:flex;align-items:center;gap:6px}.auth-buttons button,.info-connect4 button{padding:8px 16px;border:none;background-color:#4a69bd;color:#fff;border-radius:6px;cursor:pointer;transition:background-color .3s;width:120px;margin-left:16px;margin-top:16px}.auth-buttons button:focus{outline:none}.auth-buttons button:disabled{background-color:#777;color:#ddd;opacity:.8;cursor:default}.auth-buttons button:not(:disabled):hover{background-color:#fc0;color:#000}.buttons-container{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}.buttons-container button{border:none;background:none;padding:0;cursor:pointer}.buttons-container button:focus{outline:none}.selected-button img{border:5px solid #2233BD;border-radius:10px;padding:2px}.buttons-container img{width:80px;height:80px;object-fit:contain;border-radius:10px;transition:transform .2s}.buttons-container img:hover{transform:scale(1.1)}.status-box{display:flex;flex-direction:column;justify-content:flex-start;background-color:#eef;color:#222;padding:12px 20px;border-radius:8px;box-shadow:0 2px 5px #0000001a;width:100%;box-sizing:border-box;text-align:left;font-size:18px;line-height:1.4;margin-top:8px;margin-bottom:8px}.status-box p{margin:0}.users-box ul{list-style:none;padding:0;margin:0}.users-box li.online{color:green;font-weight:700}.users-box li.offline{color:gray}button{background:none;cursor:pointer;padding:8px;border:solid 4px #999}button img{width:250px;height:250px;object-fit:contain;transition:transform .2s}button img:hover{transform:scale(1.1)}.connect4-container{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}.connect4-board{display:grid;grid-template-columns:repeat(7,88px);grid-template-rows:repeat(6,88px);border:2px solid #000;gap:0;background-color:#00f;margin:20px auto;box-sizing:border-box;padding:8px;border-radius:8px}.conn4top{display:grid;grid-template-columns:repeat(7,88px);width:100%;height:80;padding-left:16px}.conn4inactivecol{background-color:none}.conn4cell{background-color:#00f;width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin:4px}.conn4cell:before{content:"";width:72px;height:72px;border-radius:50%;background-color:#fff;display:block}.conn4cell.Yellow:before{background-color:#ff0}.conn4cell.Red:before{background-color:red}.conn4cellNew{width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin:4px}.conn4cellNew:before{content:"";width:72px;height:72px;border-radius:50%;background-color:#fff;display:block}.conn4cellNew.Yellow:before{background-color:#ff0}.conn4cellNew.Red:before{background-color:red}.conn4cellNew.Win:before{background-color:transparent;background-image:url(/panel/assets/happy-ty_29d2T.png);background-size:cover;background-position:center;background-repeat:no-repeat}.conn4cellNew.Lose:before{background-color:transparent;background-image:url(/panel/assets/sad-Byukfkab.png);background-size:cover;background-position:center;background-repeat:no-repeat}.conn4cellNew.Draw:before{background-color:transparent;background-image:url(/panel/assets/draw-BhoxVMeU.png);background-size:cover;background-position:center;background-repeat:no-repeat}.dialog-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0000004d;display:flex;align-items:center;justify-content:center}.dialog{background:#fff;padding:16px 32px;border-radius:10px;min-width:250px;box-shadow:0 4px 10px #00000040;display:flex;flex-direction:column;align-items:flex-start;text-align:left}.dialog-buttons{margin-top:15px;display:flex;justify-content:space-between}.dialog select,.dialog input{width:100%;padding:6px;margin:10px 0;border-radius:6px;border:1px solid #ccc;font-size:1rem;box-sizing:border-box}.flaglocales{height:25px;margin-left:8px;cursor:pointer}@media(max-width:768px){.app-container{flex-direction:column;width:95vw;height:auto;margin:20px auto;padding:0}.users-box{flex:none;width:100%;border-radius:8px 8px 0 0;padding:12px 16px;margin-bottom:16px}.main-content{padding:16px}.auth-buttons{justify-content:center;flex-wrap:wrap;margin-bottom:12px}.auth-buttons button{width:auto;margin-left:8px;margin-top:8px;font-size:14px;padding:6px 12px}.buttons-container{justify-content:center;gap:12px;flex-wrap:wrap}.buttons-container img{width:80px;height:80px}.status-box{font-size:14px;padding:10px 12px}.connect4-container{padding:8px;justify-content:flex-start}.info-connect4{flex-direction:column;align-items:center;text-align:center;gap:6px}.info-connect4 button{width:100%;max-width:160px;font-size:.9rem;margin:4px 0}.connect4-board{grid-template-columns:repeat(7,44px);grid-template-rows:repeat(6,44px);padding:4px;border-radius:6px;margin:12px auto}.conn4cell,.conn4cellNew{width:40px;height:40px;margin:2px}.conn4cell:before,.conn4cellNew:before{width:34px;height:34px}.conn4top{grid-template-columns:repeat(7,44px);justify-content:center;padding-left:0}.next-move{flex-direction:column;align-items:center;font-size:.9rem}h2{font-size:1.4rem;margin-bottom:8px}}