*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%}body{color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a0a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{width:100%;height:100%}button{border:none;outline:none;font-family:inherit}input{font-family:inherit}a{color:inherit;text-decoration:none}::selection{color:#fff;background-color:#2a2a2a}.room-entry-page{box-sizing:border-box;background-color:#0a0a0a;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;position:relative}.room-entry-card{box-sizing:border-box;background-color:#141414;border:1px solid #2a2a2a;border-radius:12px;width:100%;max-width:380px;padding:36px 32px;position:relative}.app-title{color:#fff;text-align:center;margin:0 0 8px;font-size:24px;font-weight:600}.app-subtitle{color:#9a9a9a;text-align:center;margin:0 0 28px;font-size:14px;line-height:1.5}.btn{cursor:pointer;box-sizing:border-box;border:1px solid #0000;border-radius:8px;width:100%;padding:12px 16px;font-size:14px;font-weight:500;transition:background-color .15s,border-color .15s}.btn-primary{color:#0a0a0a;background-color:#fff}.btn-primary:hover{background-color:#e2e2e2}.btn-secondary{color:#fff;background-color:#1c1c1c;border:1px solid #2f2f2f}.btn-secondary:hover{background-color:#232323;border-color:#3a3a3a}.divider{align-items:center;margin:24px 0;display:flex}.divider-line{background-color:#2a2a2a;flex:1;height:1px}.divider-text{color:#7a7a7a;text-transform:uppercase;letter-spacing:.05em;margin:0 12px;font-size:12px}.form-group{flex-direction:column;gap:12px;display:flex}.room-code-input{color:#fff;box-sizing:border-box;background-color:#1c1c1c;border:1px solid #2f2f2f;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-size:14px;transition:border-color .15s}.room-code-input::placeholder{color:#6b6b6b}.room-code-input:focus{border-color:#4a4a4a}.helper-text{color:#7a7a7a;text-align:center;margin:20px 0 0;font-size:12px;line-height:1.5}.overlay-backdrop{z-index:1000;box-sizing:border-box;background-color:#0009;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:absolute;inset:0}.overlay-card{box-sizing:border-box;background-color:#141414;border:1px solid #2a2a2a;border-radius:12px;flex-direction:column;gap:16px;width:100%;max-width:340px;padding:28px 24px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.overlay-title{color:#fff;text-align:center;margin:0 0 4px;font-size:18px;font-weight:600}@media (width<=480px){.room-entry-card{padding:28px 20px}.app-title{font-size:20px}.app-subtitle{font-size:13px}.overlay-card{max-width:90%;padding:22px 18px}.overlay-title{font-size:16px}}@media (width<=360px){.room-entry-card{padding:22px 16px}.btn{padding:11px 14px;font-size:13px}.room-code-input{padding:11px 12px;font-size:13px}}.chat-window-page{box-sizing:border-box;background-color:#0a0a0a;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}.chat-container{box-sizing:border-box;background-color:#141414;border:1px solid #2a2a2a;border-radius:12px;flex-direction:column;width:100%;max-width:100%;height:640px;display:flex;position:relative;overflow:hidden}.chat-header{background-color:#161616;border-bottom:1px solid #2a2a2a;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:16px 20px;display:flex}.chat-header-info{justify-content:space-between;align-items:center;width:100%;display:flex}.room-code{color:#fff;letter-spacing:.02em;font-size:14px;font-weight:600}.connected-users{color:#8a8a8a;font-size:12px;font-weight:500}.chat-messages{scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;flex:1;gap:10px;padding:20px;display:flex;overflow-y:auto}.chat-messages::-webkit-scrollbar{display:none}.message-bubble{box-sizing:border-box;word-wrap:break-word;border-radius:12px;max-width:75%;padding:10px 14px}.message-incoming{background-color:#16233a;border:1px solid #1f3252;border-bottom-left-radius:4px;align-self:flex-start}.message-outgoing{background-color:#14261c;border:1px solid #1f3d2c;border-bottom-right-radius:4px;align-self:flex-end}.message-text{color:#ededed;margin:0;font-size:14px;line-height:1.5}.chat-input-bar{box-sizing:border-box;background-color:#161616;border-top:1px solid #2a2a2a;flex-shrink:0;align-items:center;gap:10px;padding:14px 16px;display:flex}.chat-input{color:#fff;box-sizing:border-box;background-color:#1e1e1e;border:1px solid #2f2f2f;border-radius:8px;outline:none;flex:1;padding:11px 14px;font-size:14px;transition:border-color .15s}.chat-input::placeholder{color:#6b6b6b}.chat-input:focus{border-color:#4a4a4a}.send-button{color:#fff;cursor:pointer;white-space:nowrap;background-color:#1b3a63;border:1px solid #234a7d;border-radius:8px;padding:11px 18px;font-size:14px;font-weight:500;transition:background-color .15s,border-color .15s}.send-button:hover{background-color:#204a7d;border-color:#2d5f9c}.leave-chat{justify-content:center;align-items:center;width:100%;margin-top:10px;display:flex}.leave-chat button{color:#fff;cursor:pointer;background-color:#f009;border-radius:10px;padding:10px;font-weight:500}@media (width<=520px){.chat-window-page{padding:0}.chat-container{border:none;border-radius:0;max-width:100%;height:100vh}}@media (width<=360px){.chat-header{padding:14px 16px}.room-code{font-size:13px}.connected-users{font-size:11px}.chat-messages{padding:16px}.message-bubble{max-width:85%}.chat-input-bar{padding:12px}.send-button{padding:10px 14px;font-size:13px}}.leave-button{color:#e8a0a0;cursor:pointer;white-space:nowrap;background-color:#2a1414;border:1px solid #3d1f1f;border-radius:8px;padding:7px 14px;font-size:12px;font-weight:500;transition:background-color .15s,border-color .15s}.leave-button:hover{background-color:#3a1818;border-color:#4d2626}