*{box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-image:url(https://s14.gifyu.com/images/bNMee.jpg);color:#1e5388;background-color:#022242;margin:0;padding:20px;display:flex;justify-content:center;align-items:center;min-height:100vh}.container{text-decoration:none;color:#00bfff;font-size:16px;text-align:center;padding:12px;border:2px solid rgba(0,191,255,.4);border-radius:30px;transition:background .3s,color .3s,box-shadow .3s;background:#00bfff1a;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 4px 30px #00bfff33;width:100%;max-width:500px}.card{text-decoration:none;color:#00bfff;font-size:16px;text-align:center;padding:12px;border:2px solid rgba(0,191,255,.4);border-radius:25px;transition:background .3s,color .3s,box-shadow .3s;background:#00bfff1a;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 4px 30px #00bfff33;max-width:500px}h2{color:#7dd3fc;text-align:center;margin-top:0;margin-bottom:20px}input{width:100%;margin-bottom:15px;text-decoration:none;color:#00bfff;font-size:16px;text-align:center;padding:12px;border:2px solid rgba(0,191,255,.4);border-radius:30px;transition:background .3s,color .3s,box-shadow .3s;background:#00475fb3;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);box-shadow:0 4px 30px #00bfff33;box-sizing:border-box}input::placeholder{color:#00bfff99}input:focus{outline:none;border-color:#00bfffcc;box-shadow:0 4px 30px #00bfff66}button{width:100%;color:#00bfff;font-size:16px;text-align:center;padding:12px;border:2px solid rgba(0,191,255,.4);border-radius:30px;transition:background .3s,color .3s,box-shadow .3s;background:#00bfff1a;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 4px 30px #00bfff33;cursor:pointer}button:hover{background:#00bfff4d;color:#fff;box-shadow:0 6px 40px #00bfff66}.chat-box{height:300px;overflow-y:auto;margin:20px 0;color:#00bfff;font-size:16px;text-align:left;padding:12px;border:2px solid rgba(0,191,255,.4);border-radius:30px;transition:background .3s,color .3s,box-shadow .3s;background:#00475fb3;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);box-shadow:0 4px 30px #00bfff33}.message{margin-bottom:12px;padding:10px 15px;border-radius:8px;max-width:80%;word-wrap:break-word;line-height:1.4;display:flex;flex-direction:column}.message-left{background:#000;margin-right:auto;border-radius:40px;text-align:left}.message-right{background:#1d4ed8;margin-left:auto;text-align:right;border-radius:40px}.message-sender{font-weight:700;margin-bottom:3px}.status{font-size:12px;margin-left:8px;display:inline-block;align-self:flex-end}.online-users{color:#00bfff;font-size:16px;text-align:center;border:2px solid rgba(0,191,255,.4);transition:background .3s,color .3s,box-shadow .3s;background:#00475fb3;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);box-shadow:0 4px 30px #00bfff33;padding:12px;border-radius:40px;margin-bottom:15px}.login-status{color:#f87171;text-align:center;margin-top:10px;min-height:20px;font-size:14px}.hidden{display:none}form{display:flex;flex-direction:column}