.background-crowns{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}.crown{position:absolute;font-size:3.5rem;color:#ffd70066;animation:float 8s ease-in-out infinite}.welcome-container{position:relative;text-align:center;background:#ff9c00;padding:2rem 3rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;animation:fadeIn .7s ease-out}.title{font-size:3rem;letter-spacing:4px;color:#fff;margin-bottom:.5rem}.subtitle{font-family:Roboto Mono,monospace;font-size:1rem;color:#fff;margin-bottom:1.8rem}.button-group{display:flex;gap:1.5rem;justify-content:center}.btn{display:inline-block;padding:.8rem 1.8rem;font-size:.8rem;text-transform:uppercase;border-radius:8px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease;font-family:Roboto Mono,monospace}.auth-container{position:relative;z-index:1;background:#ff9c00;padding:2rem 2.5rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;text-align:center;width:320px;animation:fadeIn .7s ease-out}form{display:flex;flex-direction:column;gap:1rem}.btn-primary{background:#fff;color:#ff9c00;padding:.8rem 1.5rem;font-size:.8rem;border:none;border-radius:8px;cursor:pointer;box-shadow:0 0 12px #fff;transition:transform .2s ease,box-shadow .2s ease}.btn-primary:hover{transform:scale(1.1) rotate(-1deg);box-shadow:0 0 20px #0000004d}.subtitle{margin-top:1rem;font-family:Roboto Mono,monospace;font-size:.7rem;color:#fff}.link-inline{display:inline;background:none;box-shadow:none;padding:0;margin-left:.5rem;font-family:Roboto Mono,monospace;color:#fff;text-decoration:underline;transition:color .2s ease,transform .2s ease}.link-inline:hover{color:#ffd300;transform:scale(1.05)}.container{position:relative;z-index:1;text-align:center;background:#ff9c00;padding:2.5rem 3rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;animation:fadeIn .7s ease-out;width:340px}.dashboard-container{margin-top:70px}.navbar{position:fixed;top:0;left:0;width:100%;background-color:#ff9c00;box-shadow:0 2px 10px #0000001a;z-index:100}.navbar-container{display:flex;justify-content:space-between;align-items:center;padding:.8rem 2rem;max-width:1200px;margin:0 auto}.navbar-logo{display:flex;align-items:center;gap:.5rem;cursor:pointer}.logo-crown{font-size:1.5rem;animation:float 3s ease-in-out infinite}.logo-text{font-size:1.5rem;font-weight:700;color:#fff;letter-spacing:2px}.navbar-menu{display:flex;gap:1.5rem;list-style:none;align-items:center}.navbar-link{background:none;border:none;font-family:Roboto Mono,monospace;font-size:.9rem;color:#fff;cursor:pointer;text-transform:uppercase;padding:.5rem;letter-spacing:1px;transition:all .3s ease}.navbar-link:hover{color:#ffd300;transform:translateY(-2px)}.logout-link{color:#ff5252;font-weight:700}.logout-link:hover{color:red}.username-display{margin-left:auto;padding:.5rem 1rem;background-color:#fff3;border-radius:20px}.username-text{color:#fff;font-weight:700;font-size:.9rem}.navbar-menu-icon{display:none;cursor:pointer;flex-direction:column;justify-content:space-between;width:25px;height:20px}.bar1,.bar2,.bar3{width:25px;height:3px;background-color:#fff;transition:.4s;border-radius:2px}.change.bar1{transform:rotate(-45deg) translate(-5px,6px)}.change.bar2{opacity:0}.change.bar3{transform:rotate(45deg) translate(-5px,-6px)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-5px)}to{transform:translateY(0)}}@media screen and (max-width: 768px){.navbar-menu-icon{display:flex}.navbar-menu{position:absolute;top:60px;left:0;flex-direction:column;width:100%;background-color:#ff9c00;align-items:center;padding:1rem 0;gap:1rem;box-shadow:0 5px 10px #0000001a;transform:translateY(-150%);transition:transform .4s ease;z-index:-1}.navbar-menu.active{transform:translateY(0)}.username-display{margin:0;order:-1}}.update-container{position:relative;z-index:1;background:#ff9c00;padding:2rem 2.5rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;text-align:center;width:320px;animation:fadeIn .7s ease-out}.title{font-size:1.4rem;letter-spacing:2px;color:#fff;margin-bottom:1rem}.update-form{display:flex;flex-direction:column;gap:1rem}input{padding:.8rem;border:none;border-radius:6px;font-size:.8rem}.go-back{margin-top:1rem;width:100%}.game-container{position:relative;z-index:1;text-align:center}.title{font-size:2rem;letter-spacing:4px;color:#fff;margin-bottom:.5rem}.subtitle{font-family:Roboto Mono,monospace;font-size:1rem;color:#fff}.game-wrapper{display:flex;gap:2rem;margin-top:1.5rem;justify-content:center;align-items:flex-start}.chat-container{background:#fff;border:3px solid #ff9c00;border-radius:12px;width:300px;height:450px;display:flex;flex-direction:column;justify-content:space-between;padding:1rem;box-shadow:0 0 20px #ffffffb3}.messages{list-style:none;overflow-y:auto;flex-grow:1;margin-bottom:1rem}.message{margin-bottom:.5rem;font-size:.7rem;color:#ff9c00}.sender{font-weight:700;margin-right:.3rem}.chat-input{display:flex;gap:.5rem}.chat-input input{flex:1;padding:.5rem;border:2px solid #ff9c00;border-radius:6px;font-size:.7rem}.chat-input .btn{padding:.5rem 1rem;font-size:.7rem}.player-container{background:#ff9c00;border:3px solid #ffffff;border-radius:12px;width:400px;padding:1rem;box-shadow:0 0 20px #ffffffb3;display:flex;flex-direction:column;align-items:center}.player-grid{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:1rem}.player-tile{background:#fff;border:2px solid #ff9c00;border-radius:8px;padding:.8rem;width:120px;text-align:center;font-size:.7rem;display:flex;flex-direction:column;gap:.5rem}.player-name{font-weight:700;color:#ff7000}.player-role{font-family:Roboto Mono,monospace;color:#ffd300}.result{font-size:.8rem;color:#fff;margin-bottom:1rem}.endgame{padding:.8rem 1.5rem;font-size:.8rem}.btn{display:inline-block;text-transform:uppercase;border-radius:8px;font-family:inherit;cursor:pointer;border:none;transition:transform .2s ease,box-shadow .2s ease}.btn-voted{background-color:#7a7a7a;color:#fff;cursor:not-allowed;opacity:.7}button:disabled{cursor:not-allowed}.btn.vote-wazir-btn{border:3px solid #ffd700!important;border-radius:8px!important;box-shadow:0 0 5px #ffd70080!important;transition:all .3s ease!important}.btn.vote-wazir-btn:hover{border-color:#fa0!important;box-shadow:0 0 10px #ffd700cc!important}.vote-highlight{animation:voteAnimation 1s ease}.vote-count{display:inline-block;margin-left:5px}.status-highlight{animation:statusAnimation 2s ease}@keyframes statusAnimation{0%{transform:scale(1);color:#fff}25%{transform:scale(1.3);color:red;text-shadow:0 0 12px #ffd700}50%{transform:scale(1.2);color:gold;text-shadow:0 0 10px #ff0000}75%{transform:scale(1.3);color:red;text-shadow:0 0 12px #ffd700}to{transform:scale(1);color:#fff}}@keyframes voteAnimation{0%{transform:scale(1);color:#ff7000}50%{transform:scale(1.3);color:red;text-shadow:0 0 10px #ffd700}to{transform:scale(1);color:#ff7000}}.container{position:relative;z-index:1;text-align:center;background:#ff9c00;padding:2.5rem 3rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;animation:fadeIn .7s ease-out;width:340px;margin-top:70px}.title{font-size:2rem;letter-spacing:4px;color:#fff;margin-bottom:1rem}.stats{font-size:.9rem;color:#fff;margin-bottom:2rem}.button-group{display:flex;flex-direction:column;gap:1rem}.waiting-message{margin-top:20px;text-align:center;font-family:Roboto Mono,monospace;font-size:14px;color:#000}*{margin:0;padding:0;box-sizing:border-box}body{position:relative;font-family:Roboto Mono,monospace;background:#ffd300;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#000}.background-crowns{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1}.crown{position:absolute;font-size:3rem;color:#ffd70066;animation:float 8s ease-in-out infinite}.crown1{top:5%;left:10%;animation-delay:0s}.crown2{top:20%;left:80%;animation-delay:1s}.crown3{top:40%;left:30%;animation-delay:2s}.crown4{top:65%;left:90%;animation-delay:3s}.crown5{top:80%;left:20%;animation-delay:4s}.crown6{top:55%;left:50%;animation-delay:5s}.crown7{top:30%;left:60%;animation-delay:6s}.crown8{top:10%;left:45%;animation-delay:7s}.crown9{top:75%;left:75%;animation-delay:4s}.crown10{top:50%;left:15%;animation-delay:2s}@keyframes float{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(15px,-15px) rotate(15deg)}}.friends-container{position:relative;z-index:1;text-align:center;background:#ff9c00;padding:2rem 2.5rem;border:3px solid #ffffff;border-radius:16px;box-shadow:0 0 30px #ffffffb3;animation:fadeIn .7s ease-out;width:360px;margin-top:70px}.title{font-size:1.8rem;letter-spacing:3px;color:#fff}.add-friend-form{display:flex;gap:1rem;margin-top:1.5rem}.add-friend-form input{flex:1;padding:.8rem;border:none;border-radius:6px;font-size:.8rem}.friend-list{list-style:none;margin-top:1.5rem;display:flex;flex-direction:column;gap:.75rem}.friend-item{background:#fff;border:2px solid #ff9c00;border-radius:8px;padding:.6rem .8rem;display:flex;justify-content:space-between;align-items:center;font-size:.8rem}.friend-name,.friend-stats{color:#ff9c00}.go-back{margin-top:1.5rem;width:100%;padding:.8rem;font-size:.8rem;border:none;border-radius:8px;background:#ffd300;color:#ff9c00;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.go-back:hover{transform:scale(1.05) rotate(-1deg);box-shadow:0 0 20px #0000004d}.btn{display:inline-block;padding:.8rem 1.5rem;font-size:.8rem;text-transform:uppercase;border-radius:8px;font-family:inherit;cursor:pointer;border:none;transition:transform .2s ease,box-shadow .2s ease}.btn-primary{background:#fff;color:#ff9c00;box-shadow:0 0 12px #fff}.btn-secondary{background:#ffd300;color:#ff9c00;box-shadow:0 0 12px #ffd300}.btn:hover{transform:scale(1.1) rotate(-1deg);box-shadow:0 0 20px #0000004d}@keyframes fadeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}