@import"https://fonts.googleapis.com/css2?family=Dongle&family=DynaPuff:wght@400..700&display=swap";#root{font-family:Dongle}body{margin:0;cursor:none}*{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.chat{position:absolute;z-index:100;height:1rem;width:50vw;left:0;bottom:0;background-color:#f0f8ff80;border:none;outline:none;font-size:1rem;padding:.5rem;border-radius:0 1rem 0 0}.from-fond{width:100vw;height:100vh;position:absolute;top:0;left:0;cursor:auto}form{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:300px;margin:100px auto;padding:24px;border:1px solid rgba(255,255,255,.25);border-radius:12px;background:#ffffff1a;box-shadow:0 8px 32px #00000040;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);position:relative;z-index:1;cursor:auto}h1,form p{margin:0}form input[type=text]{padding:10px;border:1px solid #aaa;border-radius:6px;font-size:1rem;width:100%}form input[type=submit],button{padding:10px;background-color:#1976d2;color:#fff;border:none;border-radius:6px;font-size:.7rem;cursor:pointer;transition:background-color .2s}button:hover,form input[type=submit]:hover{background-color:#1565c0}p{font-size:1.5rem;line-height:70%}form .error{color:green;margin:0;font-weight:700}form>span,form>div{font-size:.9rem;color:#555}.player-list{font-size:1.2rem;position:absolute;right:14px;text-align:end;opacity:.8}.player-list li{list-style:none;font-weight:700}.player-list span{font-weight:900}.gameTitle{text-align:center;position:absolute;width:100%;font-size:50px}.gameSubTitle{text-align:center;position:absolute;width:100%;top:40px;font-size:25px}.gameTimer{top:0;position:absolute;width:100vw;margin:0}.gameTimer rect{transition:width 1s steps(5,jump-start),fill .5s}canvas{transition:transform 1s,background-size .7s cubic-bezier(.8,-.5,.3,1.4)}.gameCanvas{position:absolute;width:100vw;height:100vh;transition:transform .5s ease;transition-delay:.3s}.gameCanvas.visible{transform-origin:50% 50%;transform:scale(1)}.gameCanvas.notvisible{transform-origin:50% 50%;transform:scale(0)}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.rideau{animation:spin 200s linear infinite}.rideauCircle{transition:r .7s cubic-bezier(.8,-.5,.3,1.4)}