@keyframes fade-in-bottom{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInBottom{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in-center{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}@keyframes loadMaskAnim{0%{translate:0 0}to{translate:-66.6666666667% 0}}@property --glow-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes glowRingSpin{to{--glow-angle:360deg}}.join-room-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(14,18,29,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:joinRoomModalFadeIn .25s ease-out both}.join-room-modal__card{position:relative;width:100%;max-width:460px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding:48px 40px 40px;border-radius:32px;background:#fdf5ec;color:#0e121d;animation:joinRoomModalPopIn .35s cubic-bezier(.34,1.56,.64,1) both}.join-room-modal__close{position:absolute;top:16px;right:16px;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:50%;background:rgba(14,18,29,.06);color:#0e121d;font-size:22px;line-height:1;transition:.2s}.join-room-modal__close:hover{transition:.5s}.join-room-modal__close:active{transition:.2s}.join-room-modal__close{opacity:1;cursor:pointer}.join-room-modal__close:focus,.join-room-modal__close:hover{opacity:.8!important}.join-room-modal__close:active{opacity:.6!important}@media(hover:none){.join-room-modal__close:focus,.join-room-modal__close:hover{opacity:1!important}}.join-room-modal__title{font-size:1.5rem;font-style:normal;font-weight:600;line-height:110%;font-family:Panton,"system-ui",sans-serif;font-style:italic}.join-room-modal__subtitle{opacity:.7;font-size:15px}.join-room-modal__slots{display:flex;gap:10px;justify-content:center;width:100%}.join-room-modal__slots.__has-error{animation:joinRoomModalShake .4s ease-in-out}.join-room-modal__slot{width:100%;max-width:56px;aspect-ratio:1}@supports not (aspect-ratio:1){.join-room-modal__slot{height:56px}}.join-room-modal__slot{border:2px solid rgba(14,18,29,.12);border-radius:16px;background:hsla(0,0%,100%,.7);text-align:center;font-family:Panton,"system-ui",sans-serif;font-size:clamp(18px,5vw,28px);font-weight:700;color:#0e121d;text-transform:uppercase;caret-color:#fe5701;transition:border-color .2s ease,background-color .2s ease,scale .15s ease,opacity .2s ease}.join-room-modal__slot:focus{border-color:#fe5701;background:#fff;scale:1.05}.join-room-modal__slot.__error{border-color:#e2413a;background:rgba(226,65,58,.08)}.join-room-modal__slot:disabled{opacity:.6}.join-room-modal__error{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:-8px;padding:8px 18px;border-radius:999px;background:rgba(226,65,58,.12);color:#b3261e;font-size:13px;font-weight:800;animation:joinRoomModalErrorIn .25s ease-out both}.join-room-modal__submit{display:flex;align-items:center;justify-content:center;width:100%;min-height:64px;margin-top:8px;border:0;border-radius:20px;background:linear-gradient(99.37deg,#FEAE04 -4.91%,#FE2701 102.87%);box-shadow:0 20px 32px rgba(254,87,1,.22);color:#fff;font-size:24px;font-weight:900;cursor:pointer;transition:opacity .2s ease,scale .15s ease}.join-room-modal__submit:active{scale:.97}.join-room-modal__submit:disabled{opacity:.45;box-shadow:none;cursor:default}.join-room-modal__submit.__loading{cursor:default}.join-room-modal__spinner{width:22px;height:22px;border:3px solid hsla(0,0%,100%,.4);border-top-color:#fff;border-radius:50%;animation:joinRoomModalSpin .7s linear infinite}@keyframes joinRoomModalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes joinRoomModalPopIn{0%{opacity:0;scale:.9;translate:0 12px}to{opacity:1;scale:1;translate:0 0}}@keyframes joinRoomModalErrorIn{0%{opacity:0;translate:0 -6px}to{opacity:1;translate:0 0}}@keyframes joinRoomModalSpin{to{transform:rotate(1turn)}}@keyframes joinRoomModalShake{0%,to{translate:0 0}20%{translate:-6px 0}40%{translate:5px 0}60%{translate:-4px 0}80%{translate:3px 0}}@media(max-width:820px){.join-room-modal__card{padding:40px 28px 32px;border-radius:28px;gap:18px}.join-room-modal__slots{gap:8px}.join-room-modal__slot{max-width:48px;border-radius:14px}}@media(max-width:495px){.join-room-modal__card{padding:36px 16px 28px;gap:16px;border-radius:24px}.join-room-modal__slots{gap:6px}.join-room-modal__slot{max-width:42px;border-radius:12px}.join-room-modal__submit{min-height:56px;font-size:16px}}