*{box-sizing:border-box;margin:0;padding:0}#main{width:100%}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff;background-color:#131a27;background-image:linear-gradient(#252c4d,#070b1d);justify-content:center;align-items:center;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;display:flex}body.light{color:#000;background-color:#6d80a6;background-image:linear-gradient(#fff,#6d7ba6)}h1{color:#f09546;margin-bottom:.5rem;font-size:calc(24px + 3vmin)}body.light h1{color:#e88930}h2{color:#00d4aa;margin-bottom:1rem;font-size:calc(16px + 2vmin)}h3{font-size:calc(12px + 1.5vmin)}a{color:#dbaa55;text-decoration:none}a:hover{text-decoration:underline}.menu{text-align:center;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:100vh;margin:auto;padding:1rem;font-size:calc(7px + 2vmin);display:flex}@media only screen and (min-width:600px){.menu{width:50%;max-width:500px}}.subtitle{color:#888;margin-bottom:2rem;font-size:calc(8px + 1.5vmin)}body.light .subtitle{color:#555}.menu-buttons{flex-direction:column;gap:.75rem;display:flex}.section{background-color:#ffffff0d;border:1px solid #ffffff80;border-radius:10px;margin:12px 4px;padding:12px 12px 8px}body.light .section{background-color:#ffffff4d;border-color:#0003}.radio-group{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.5rem;display:flex}.radio-label{cursor:pointer;background:#ffffff1a;border:2px solid #fff3;border-radius:8px;align-items:center;padding:8px 16px;font-size:calc(7px + 1.5vmin);transition:all .15s;display:inline-flex}.radio-label:hover{background:#ffffff26;border-color:#fff6}.radio-label.selected{color:#fff;background:#4040a0;border-color:#6060c0}.radio-label input[type=radio]{accent-color:#00d4aa;margin-right:6px}body.light .radio-label{background:#0000000d;border-color:#0003}body.light .radio-label:hover{background:#0000001a;border-color:#0000004d}body.light .radio-label.selected{color:#000;background:#aabcee;border-color:#89c}.toggle-row{justify-content:center;align-items:center;gap:.25rem;margin:.5rem 0;display:flex}.stepper-row{justify-content:center;align-items:center;gap:.5rem;margin:.8rem 0;display:flex}.stepper-label{font-size:calc(7px + 1.5vmin)}.stepper-controls{align-items:center;gap:0;display:inline-flex}.stepper-btn{border-radius:6px;min-width:2em;margin:0 2px;padding:4px 14px;font-size:calc(8px + 1.5vmin)}.stepper-value{text-align:center;min-width:2em;font-size:calc(8px + 1.5vmin);font-weight:700}.param-select{cursor:pointer;color:inherit;text-align:center;appearance:none;background:#ffffff1a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23ccc' stroke-width='2' fill='none'/%3E%3C/svg%3E") right 10px center no-repeat;border:2px solid #fff3;border-radius:8px;min-width:8em;padding:6px 30px 6px 12px;font-family:inherit;font-size:calc(7px + 1.5vmin)}.param-select:hover{background-color:#ffffff26;border-color:#fff6}.param-select:focus{border-color:#6060c0;outline:none}.param-select option{color:#fff;background:#1a1a2e}body.light .param-select{background-color:#0000000d;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='2' fill='none'/%3E%3C/svg%3E");border-color:#0003}body.light .param-select:hover{background-color:#0000001a;border-color:#0000004d}body.light .param-select:focus{border-color:#89c}body.light .param-select option{color:#000;background:#fff}.param-select:disabled{opacity:.35;cursor:not-allowed;color:#fff6;background-color:#ffffff0d;border-color:#ffffff14}body.light .param-select:disabled{color:#0000004d;background-color:#00000008;border-color:#00000014}.preset-row{flex-wrap:wrap;justify-content:center;gap:.4rem;margin:.5rem 0;display:flex}.preset-row button{min-width:auto;padding:4px 10px;font-size:calc(6px + 1.2vmin)}.tooltip-wrapper{position:relative}.tooltip-text{white-space:normal;text-align:center;z-index:100;pointer-events:none;color:#e0e0e0;background:#1e1e3cf2;border:1px solid #ffffff4d;border-radius:6px;width:max-content;max-width:250px;padding:8px 12px;font-size:calc(6px + 1vmin);display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tooltip-wrapper:hover .tooltip-text{display:block}.tooltip-wrapper:active .tooltip-text{display:none}body.light .tooltip-text{color:#222;background:#f0f0fff2;border-color:#0003}button,.button{cursor:pointer;color:#fdfdff;background:#4040a0 linear-gradient(#5050b0,#202060);border:2px solid #ffffff4d;border-radius:10px;margin:4px 8px;padding:8px 20px;font-size:calc(7px + 2vmin);transition:all .15s}button:hover{background-image:linear-gradient(#202060,#5050b0);transform:translateY(-1px);box-shadow:0 4px 12px #5050b066}button:active{box-shadow:none;transform:translateY(0)}body.light button,body.light .button{color:#000;background:#aabcee linear-gradient(#fff,#aabcee);border:1px solid #0003}body.light button:hover{background:#b6c5f0;box-shadow:0 4px 12px #0003}button.disabled,button:disabled{opacity:.35;cursor:not-allowed;color:#fff6;background:#ffffff14;border-color:#ffffff1a}button.disabled:hover,button:disabled:hover{box-shadow:none;background:#ffffff14;transform:none}body.light button.disabled,body.light button:disabled{color:#0000004d;background:#0000000d;border-color:#0000001a}body.light button.disabled:hover,body.light button:disabled:hover{background:#0000000d}.game-view{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;min-height:100vh;padding:1rem;display:flex;position:relative}.game-view h3{border-radius:8px;min-width:150px;margin-bottom:.5rem;padding:.5rem 1.5rem}.status-cross{color:#6464ff;background:#6464ff33;border:2px solid #6464ff}.status-nought{color:#ff6464;background:#ff646433;border:2px solid #ff6464}.status-gameover{color:#00d4aa;background:#00d4aa33;border:2px solid #00d4aa;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}#game-canvas{touch-action:none;border-radius:8px;max-width:100%;box-shadow:0 8px 32px #0006}body.light #game-canvas{box-shadow:0 8px 32px #0003}.game-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:.5rem;display:flex}.game-buttons button{padding:.6rem 1.2rem;font-size:calc(6px + 1.5vmin)}.setting-row{background:#ffffff0d;border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:1rem;padding:1rem;display:flex}body.light .setting-row{background:#0000000d}.setting-row span{font-size:calc(8px + 1.5vmin)}.setting-row button{margin:0;padding:.5rem 1rem;font-size:calc(6px + 1.5vmin)}.setting-section{margin:1rem 0}.setting-section p{margin-bottom:.75rem;font-size:calc(8px + 1.5vmin)}.lang-grid{grid-template-columns:repeat(2,1fr);gap:.5rem;max-width:280px;margin:0 auto;display:grid}@media (min-width:600px){.lang-grid{grid-template-columns:repeat(4,1fr);max-width:520px}}.lang-btn{white-space:nowrap;margin:0;padding:.5rem .75rem;font-size:calc(6px + 1.2vmin)}.lang-btn.selected{background:#00a080 linear-gradient(#00c0a0,#006050);border-color:#00d4aa}body.light .lang-btn.selected{color:#fff;background:#00c0a0 linear-gradient(#40e0c0,#00a080)}.info{color:#888;margin:1rem 0;font-size:calc(6px + 1.2vmin)}body.light .info{color:#666}input[type=text],input[type=password]{box-sizing:border-box;color:#fff;background:#ffffff1a;border:2px solid #ffffff4d;border-radius:8px;width:100%;max-width:280px;margin:4px 0 12px;padding:10px 14px;font-size:calc(7px + 1.5vmin)}input[type=text]:focus,input[type=password]:focus{background:#ffffff26;border-color:#00d4aa;outline:none}input[type=text]:disabled,input[type=password]:disabled{opacity:.5;cursor:not-allowed}input[type=text]::placeholder,input[type=password]::placeholder{color:#ffffff80}body.light input[type=text],body.light input[type=password]{color:#000;background:#fffc;border-color:#0003}body.light input[type=text]:focus,body.light input[type=password]:focus{background:#fff;border-color:#00a080}body.light input[type=text]::placeholder,body.light input[type=password]::placeholder{color:#0006}.desk-item{border-radius:6px;flex-direction:row;place-content:center;width:100%;max-width:400px;margin-bottom:8px;padding:8px;display:flex}.desk-item.blue{background:#597fcc;border:1px solid #ffffff80}.desk-item.yellow{background:#b2994c;border:1px solid #ffffff80}.desk-item.green{background:#66b266;border:1px solid #ffffff80}.desk-item.red{background:#c66;border:1px solid #ffffff80}.desk-label-left{text-align:left;width:30%;margin:0}.desk-label-center{text-align:center;width:40%;margin:0}.desk-label-right{text-align:right;width:30%;margin:0}.online-game{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;min-height:100vh;padding:1rem;display:flex}.online-game .turn-indicator{background:#ffffff1a;border:2px solid #fff3;border-radius:8px;min-width:200px;padding:.5rem 1.5rem;font-size:calc(10px + 2vmin)}body.light .online-game .turn-indicator{background:#0000000d;border-color:#0003}.online-game .game-container{margin:.5rem 0}.online-game .error-message{color:#ff6464;background:#ff64641a;border-radius:6px;padding:.5rem 1rem;font-size:calc(7px + 1.5vmin)}.online-game .menu-buttons{flex-flow:wrap;justify-content:center}button.danger{background:#a04040 linear-gradient(#c05050,#802020);border-color:#ff646480}button.danger:hover{background-image:linear-gradient(#802020,#c05050);box-shadow:0 4px 12px #b0505066}body.light button.danger{color:#fff;background:#c66 linear-gradient(#e88,#a44)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.pointer{cursor:pointer}.hidden{display:none}.smaller{font-size:calc(6px + 1.25vmin)}@media (max-width:480px){.menu{padding:.5rem}button{padding:10px 16px;font-size:calc(8px + 1.8vmin)}.game-buttons{flex-direction:column;width:100%;padding:0 1rem}.game-buttons button{width:100%}.game-view{gap:.5rem;padding:.5rem}}.autohide{animation:0s ease-in 5s forwards hideAnimation}@keyframes hideAnimation{0%{opacity:1}50%{opacity:1}to{opacity:0;width:0;min-width:0;height:0;padding:0;overflow:hidden}}.toast-error{z-index:10;color:#ff6464;pointer-events:none;background:#1e0000d9;border:1px solid #ff646480;border-radius:8px;padding:.6rem 1.2rem;font-size:calc(9px + 1.5vmin);animation:2s ease-in forwards toastFade;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes toastFade{0%{opacity:1}70%{opacity:1}to{opacity:0}}.settings-icon{cursor:pointer;height:calc(8px + 8vh);max-height:48px;transition:transform .3s}.settings-icon:hover{animation:4s linear infinite spin}@keyframes spin{to{transform:rotate(-360deg)}}