*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#080a10;margin:0;overflow:hidden}#root{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.status-overlay{color:#48f;letter-spacing:2px;text-transform:uppercase;z-index:100;background:#080a10e0;justify-content:center;align-items:center;font-family:Share Tech Mono,monospace;font-size:14px;display:flex;position:fixed;inset:0}.lobby{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.lobby-bg{background-color:#080a10;background-image:linear-gradient(#1a2535b3 1px,#0000 1px),linear-gradient(90deg,#1a2535b3 1px,#0000 1px);background-size:50px 50px;animation:24s linear infinite gridDrift;position:absolute;inset:0}.lobby-bg:after{content:"";background:radial-gradient(70% 70%,#0000 20%,#080a10 85%);position:absolute;inset:0}@keyframes gridDrift{0%{background-position:0 0}to{background-position:50px 50px}}.lobby-panel{z-index:1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0a0e16eb;border:1px solid #4488ff2e;flex-direction:column;align-items:center;gap:36px;padding:52px 64px 44px;animation:.45s cubic-bezier(.16,1,.3,1) both panelIn;display:flex;position:relative;box-shadow:0 0 0 1px #4488ff0f,0 0 60px #4488ff0f,0 40px 100px #000000b3}@keyframes panelIn{0%{opacity:0;transform:translateY(18px)scale(.975)}to{opacity:1;transform:translateY(0)scale(1)}}.lobby-title{align-items:baseline;gap:2px;animation:.5s cubic-bezier(.16,1,.3,1) 80ms both fadeSlideDown;display:flex}.lobby-title-main{letter-spacing:6px;color:#dde8ff;text-transform:uppercase;text-shadow:0 0 60px #4488ff40,0 2px 4px #0009;font-family:Rajdhani,sans-serif;font-size:68px;font-weight:700;line-height:1}.lobby-title-io{letter-spacing:3px;color:#48f;text-transform:uppercase;text-shadow:0 0 24px #4488ffe6,0 0 60px #48f6;padding-bottom:4px;font-family:Rajdhani,sans-serif;font-size:38px;font-weight:700;line-height:1}.lobby-divider{background:linear-gradient(90deg,#0000,#48f6 30% 70%,#0000);width:100%;height:1px;animation:.5s cubic-bezier(.16,1,.3,1) .14s both fadeSlideDown}.lobby-form{flex-direction:column;gap:10px;width:288px;animation:.5s cubic-bezier(.16,1,.3,1) .2s both fadeSlideDown;display:flex}.lobby-input{color:#dde8ff;letter-spacing:1.5px;background:#080a10d9;border:1px solid #4488ff38;border-radius:0;outline:none;width:100%;padding:13px 16px;font-family:Share Tech Mono,monospace;font-size:14px;transition:border-color .2s,box-shadow .2s}.lobby-input::placeholder{color:#2a3a5a;letter-spacing:1px}.lobby-input:focus{border-color:#4488ffa6;box-shadow:0 0 0 3px #4488ff1a,0 0 20px #4488ff1f}.lobby-btn{color:#080a10;letter-spacing:5px;text-transform:uppercase;cursor:pointer;background:#48f;border:none;border-radius:0;justify-content:center;align-items:center;gap:10px;width:100%;padding:15px 24px;font-family:Rajdhani,sans-serif;font-size:17px;font-weight:700;transition:background .15s,transform .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.lobby-btn:before{content:"";background:#fff0;transition:background .15s;position:absolute;inset:0}.lobby-btn:hover{background:#5c9aff;transform:translateY(-2px);box-shadow:0 8px 28px #4488ff73}.lobby-btn:active{transform:translateY(0);box-shadow:0 2px 10px #4488ff4d}.lobby-btn-arrow{margin-top:1px;font-size:18px;line-height:1;transition:transform .15s;display:inline-block}.lobby-btn:hover .lobby-btn-arrow{transform:translate(4px)}.lobby-controls{align-items:center;gap:8px;animation:.5s cubic-bezier(.16,1,.3,1) .28s both fadeSlideDown;display:flex}.lobby-control-group{align-items:center;gap:6px;display:flex}.lobby-key{color:#48f;letter-spacing:1px;text-transform:uppercase;background:#4488ff12;border:1px solid #4488ff40;padding:3px 7px 2px;font-family:Share Tech Mono,monospace;font-size:10px;line-height:1.6}.lobby-action{color:#2a3a5a;letter-spacing:.5px;text-transform:uppercase;font-family:Share Tech Mono,monospace;font-size:10px}.lobby-dot{color:#1a2535;margin:0 2px;font-size:14px;line-height:1}@keyframes fadeSlideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
