#lobby{display:block;padding:0;background:linear-gradient(90deg,#081a1cee 0%,#0a1b1dd9 25%,#0a1b1d73 45%,#08191c0a 67%),linear-gradient(0deg,#071519d9,transparent 23%,transparent 80%,#07171e4d);overflow:hidden;isolation:isolate}#lobby:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 72% 58%,#dcac5c08,transparent 48%);z-index:-1}#lobby svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}#lobby .menu-header{position:absolute;top:34px;left:6vw;right:6vw;display:flex;align-items:center;justify-content:space-between;gap:20px}.menu-brand{display:flex;align-items:center;gap:12px;color:#e2ebdc}.menu-brand>svg{width:32px;height:34px;color:#c9e6aa;stroke-width:1.2}.menu-brand>span{font-size:13px;font-weight:700;letter-spacing:2.2px}.menu-brand>span>span{font-weight:400;color:#8fa89e;letter-spacing:2px;margin-left:6px}.menu-release{font-size:9px;letter-spacing:1.8px;color:#c5d2c3;display:flex;align-items:center;gap:9px}.menu-release i{width:5px;height:5px;border-radius:50%;background:#b8d494;box-shadow:0 0 9px #b8d49470}.menu-release>span{border-left:1px solid #8ca99a40;padding-left:15px;margin-left:6px;color:#809c91;font-size:8px}.menu-content{position:absolute;left:6vw;top:49%;transform:translateY(-45%);width:clamp(380px,31vw,500px);max-height:calc(100dvh - 160px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#799b7350 transparent;padding:2px}.menu-heading{margin-bottom:26px}#lobby .eyebrow{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:3px;color:#c2d7b4;margin-bottom:17px}#lobby .eyebrow>span{width:23px;height:1px;background:#b5d190}#lobby h1{font-size:clamp(96px,8.2vw,144px);line-height:.8;font-weight:700;letter-spacing:-9px;color:#edf1db;margin:0;text-shadow:0 4px 40px #d9e8a908}#lobby h1>span{display:block;font-size:16px;letter-spacing:14px;line-height:1.5;font-weight:500;color:#adc3aa;margin:20px 0 0 6px}#lobby .menu-intro{font-size:15px;line-height:1.75;color:#a5bcb0;margin:20px 0 0}.menu-card{position:relative;padding:22px;background:linear-gradient(135deg,#213b32c9,#0e2422df);border:1px solid #b9d0ac32;border-top-color:#c1d5b848;border-radius:16px;box-shadow:0 16px 60px #0003,inset 0 1px #ffffff06;backdrop-filter:blur(18px)}.menu-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#081b1d91;padding:4px;border:1px solid #7b9d7e1f;border-radius:9px;margin-bottom:21px}#lobby .menu-tabs button{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 5px;border:1px solid transparent;background:none;border-radius:6px;color:#819d8f;font-size:11px;white-space:nowrap;font-weight:500}.menu-tabs button>svg{width:15px;height:15px}#lobby .menu-tabs button[aria-selected=true]{background:linear-gradient(135deg,#476044a6,#344e399e);border-color:#c4dd9d40;color:#e0e9cd;box-shadow:0 2px 7px #0002}#lobby .menu-tabs button:hover{color:#e0e9cd;background:#38503b80}.menu-form-body{display:grid;grid-template-columns:1fr 1fr;gap:14px}#new-game-fields,#join-game-fields{display:contents}#lobby .menu-field{display:block;min-width:0;margin:0}#lobby .menu-field>span{display:block;font-size:8px;letter-spacing:1.35px;color:#9bb3a0;font-weight:600;margin-bottom:9px}.field-control{position:relative}.field-control>svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:#91ab90;pointer-events:none}#lobby .field-control .select-chevron{left:auto;right:10px;width:12px;height:12px;color:#b8c8ad}#lobby input,#lobby select{width:100%;height:48px;margin:0;padding:10px 12px 10px 36px;background:#0b201f9e;border:1px solid #8ca99136;border-radius:8px;font-size:12px;color:#d9e5d0;transition:border-color .2s,box-shadow .2s}#lobby select{appearance:none;padding-right:26px}#lobby select option{background:#17332a;color:#e4ecdc}#lobby input:focus,#lobby select:focus{outline:none;border-color:#b9d89599;box-shadow:0 0 0 3px #badb940c;background:#102722}#lobby input::placeholder{color:#5f8074;font-size:11px;letter-spacing:2px}#lobby #code{letter-spacing:3px;font-size:12px;text-transform:uppercase}.menu-field-hint{grid-column:1/-1;color:#829e8b;font-size:9px;line-height:1.6;margin:0 0 1px}#lobby .menu-play{grid-column:1/-1;display:flex;align-items:center;gap:13px;width:100%;height:55px;margin:0;padding:14px 18px;border-radius:8px;border:1px solid #ddf4bc42;background:linear-gradient(115deg,#d6edb0,#b6d78c);color:#24391f;font-size:13px;letter-spacing:.3px;font-weight:700;box-shadow:0 3px 20px #b1d47a10;transition:transform .18s,box-shadow .18s,filter .18s}#lobby .menu-play>svg{width:20px;height:20px;stroke-width:1.8}#lobby #create>svg:first-child{fill:#36532c;stroke-width:0}#lobby .menu-play>.play-arrow{margin-left:auto;float:none;width:19px;height:19px;opacity:.7}#lobby .menu-play>span{float:none}#lobby .menu-play:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.055);box-shadow:0 7px 26px #b1d47a25}#lobby .menu-play:active:not(:disabled){transform:translateY(0)}#lobby .menu-play:disabled{opacity:.35;filter:saturate(.5);cursor:not-allowed}#lobby #error{font-size:10px;line-height:1.6;min-height:0;margin:0;color:#edb29b}#lobby #error:not(:empty){margin-top:13px;padding:9px 11px;border:1px solid #e0a38c30;border-radius:5px;background:#8b4c3317}#lobby .menu-resume{display:flex;align-items:center;gap:12px;width:100%;margin:12px 0 0;padding:12px 16px;border:1px solid #8ca78b26;border-radius:10px;background:#14292280;color:#b6cbaa;text-align:left;font-size:12px;backdrop-filter:blur(12px)}.menu-resume .resume-symbol{display:grid;place-items:center;width:30px;height:30px;border:1px solid #9bbb7c33;border-radius:6px;background:#96b7730a}.resume-symbol svg{width:17px;height:17px}.menu-resume b{display:block;font-size:11px;font-weight:500;color:#c5d4b8}.menu-resume small{display:block;font-size:8px;color:#6f8b7b;margin-top:4px}.menu-resume>.resume-arrow{margin-left:auto;width:14px;height:14px;color:#88a577}#lobby .menu-resume:hover{border-color:#c1d69c66;background:#263e2f99}.menu-features{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 2px 0}.menu-features>span{display:flex;align-items:center;gap:6px;font-size:8px;letter-spacing:.7px;color:#789480}.menu-features svg{width:13px;height:13px;opacity:.85}.menu-scene-caption{position:absolute;right:7vw;bottom:110px;display:flex;align-items:center;gap:14px;text-shadow:0 1px 12px #0006;pointer-events:none}.scene-line{height:38px;width:1px;background:linear-gradient(transparent,#c0d3a7,transparent)}.menu-scene-caption small{display:block;letter-spacing:2px;color:#a8c0b0;font-size:8px;margin-bottom:8px}.menu-scene-caption strong{display:block;color:#dce7cf;font-size:19px;font-weight:400;letter-spacing:-.3px}#lobby .menu-footer{position:absolute;bottom:26px;left:6vw;right:6vw;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:18px;border-top:1px solid #78978624}#lobby .menu-footer>div{display:flex;gap:22px}#lobby .menu-footer button{display:flex;align-items:center;gap:7px;padding:2px 0;background:none;border:0;font-size:9px;color:#829f8b;border-radius:2px}#lobby .menu-footer button:hover{color:#d8e5c8}.menu-footer svg{width:13px;height:13px}#lobby .menu-footer>span{font-size:7px;color:#5e7b70;letter-spacing:2px}.menu-content{animation:menu-appear .8s ease both}.menu-scene-caption{animation:menu-appear 1.2s .2s ease both}@keyframes menu-appear{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:blur(0)}}
@media(min-width:1800px){#lobby .menu-intro{font-size:17px}.menu-card{padding:25px}.menu-tabs{margin-bottom:23px}#lobby .menu-tabs button{font-size:12px;padding:12px 5px}#lobby input,#lobby select{height:51px;font-size:13px}#lobby .menu-play{height:59px;font-size:14px}.menu-field-hint{font-size:10px}.menu-form-body{gap:16px}.menu-features>span{font-size:9px}}
@media(max-height:800px){#lobby .menu-header{top:22px}.menu-content{top:48%;transform:translateY(-43%);max-height:calc(100dvh - 115px)}#lobby h1{font-size:82px;letter-spacing:-5px}#lobby h1>span{font-size:12px;letter-spacing:11px;margin-top:12px}#lobby .eyebrow{font-size:8px;margin-bottom:12px}#lobby .menu-intro{font-size:12px;line-height:1.6;margin-top:13px}.menu-heading{margin-bottom:17px}.menu-card{padding:18px}.menu-tabs{margin-bottom:16px}#lobby .menu-tabs button{padding:8px 3px;font-size:10px}#lobby input,#lobby select{height:43px;font-size:11px}.menu-form-body{gap:11px}.menu-field-hint{font-size:8px}#lobby .menu-play{height:48px;font-size:12px}.menu-features{padding-top:13px}#lobby .menu-resume{padding:9px 13px;margin-top:10px}.menu-content{width:400px}#lobby .menu-footer{bottom:19px;padding-top:12px}.menu-scene-caption{bottom:95px}.menu-scene-caption strong{font-size:16px}}
@media(max-width:900px){#lobby{background:linear-gradient(90deg,#071b1bf0,#0b201bc7 45%,#09201b30),linear-gradient(0deg,#07171bcc,transparent 30%)}#lobby .menu-header{left:30px;right:30px}.menu-content{left:30px;width:390px}.menu-release>span{display:none}.menu-scene-caption{right:35px;bottom:95px}.menu-scene-caption small{font-size:7px;letter-spacing:1px}.menu-scene-caption strong{font-size:14px}#lobby .menu-footer{left:30px;right:30px}#lobby .menu-footer>span{display:none}}
@media(max-width:620px){.menu-content{left:20px;width:calc(100% - 40px);max-width:430px}.menu-scene-caption{display:none}#lobby .menu-header{left:23px;right:23px}.menu-brand>span{font-size:11px}.menu-release{font-size:8px}#lobby .menu-footer{left:24px;right:24px}#lobby .menu-footer>div{width:100%;justify-content:space-between;gap:10px}}
#lobby .menu-scene-caption{top:32%;bottom:auto}
@media(max-width:900px){#lobby .menu-scene-caption{display:none}}
@media(prefers-reduced-motion:reduce){.menu-content,.menu-scene-caption{animation:none}#lobby *{transition:none!important}}