.launch-lobby { position: fixed; inset: 0; z-index: 20; display: grid; grid-template-columns: 240px minmax(0, 1fr); background: #11151c; color: #eff2f6; font: 14px/1.5 system-ui, sans-serif; overflow: auto; }
.launch-lobby[hidden] { display: none; }
.lobby-sidebar { display: flex; flex-direction: column; gap: 20px; padding: 42px 24px; border-right: 1px solid #2a303a; background: #171b23; }
.lobby-brand { font-size: 22px; font-weight: 750; letter-spacing: -.04em; white-space: nowrap; }
.lobby-local-note { margin-top: auto; color: #9aa7b7; font-size: 12px; }
.lobby-content { max-width: 1500px; width: 100%; box-sizing: border-box; padding: 46px clamp(24px, 5vw, 80px); margin-inline: auto; }
.lobby-hero { min-height: 300px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(230px, .9fr); align-items: center; gap: 18px; overflow: hidden; padding: clamp(26px, 4vw, 56px); border: 1px solid #3b4554; border-radius: 20px; background: radial-gradient(circle at 85% 15%, #3b4262 0, transparent 48%), linear-gradient(120deg, #222b37, #171b26 72%); }
.lobby-eyebrow { display: block; color: #8cced2; font-size: 11px; font-weight: 750; letter-spacing: .19em; }
.lobby-hero-title { max-width: 620px; margin: 16px 0 12px; font-size: clamp(32px, 3.5vw, 56px); line-height: 1.08; letter-spacing: -.045em; }
.lobby-hero-detail { margin: 0 0 30px; color: #bfccd8; font-size: 15px; }
.lobby-button { min-height: 42px; padding: 9px 17px; border: 1px solid #617484; border-radius: 9px; background: #293540; color: #fff; font: inherit; font-weight: 650; cursor: pointer; }
.lobby-button:hover { background: #405567; }
.lobby-primary { border-color: #79d2d0; background: #89d8d4; color: #092527; }
.lobby-primary:hover { background: #adeae4; }
.lobby-button:focus-visible, .lobby-project-card:focus-visible, .lobby-project-action:focus-visible, .lobby-home-button:focus-visible { outline: 3px solid #b9f0ed; outline-offset: 3px; }
.lobby-hero-art { width: min(100%, 420px); transform: rotate(-7deg); justify-self: center; filter: drop-shadow(0 26px 30px #0009); }
.lobby-art-screen { aspect-ratio: 16/10; border: 7px solid #121722; border-radius: 14px; background: linear-gradient(135deg, #e39e85 0 22%, #5d7f9c 22% 50%, #23304b 50% 75%, #86a7a8 75%); position: relative; overflow: hidden; }
.lobby-art-screen span { position: absolute; left: 10%; bottom: 14%; width: 76%; height: 6px; border-radius: 4px; background: #fff8; }
.lobby-art-screen span:nth-child(2) { width: 46%; bottom: 22%; }
.lobby-art-screen span:nth-child(3) { width: 20%; bottom: 30%; }
.lobby-art-track { display: flex; gap: 5px; padding: 11px; border: 5px solid #121722; border-top: 0; border-radius: 0 0 11px 11px; background: #1c2330; }
.lobby-art-track i { height: 19px; flex: 1; border-radius: 3px; background: #b77c74; }
.lobby-art-track i:nth-child(2) { flex: .65; background: #6c9ba5; }
.lobby-art-track i:nth-child(3) { flex: .4; background: #c6ab6b; }
.lobby-project-heading { display: flex; align-items: baseline; gap: 10px; margin: 36px 0 16px; }
.lobby-project-heading h2 { margin: 0; font-size: 20px; }
.lobby-project-count { color: #98a4b4; }
.lobby-project-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.lobby-empty { grid-column: 1 / -1; padding: 24px; border: 1px dashed #46505c; border-radius: 12px; color: #abb7c7; }
.lobby-project-card { min-width: 0; display: flex; flex-direction: column; align-items: stretch; gap: 8px; padding: 0 0 15px; border: 1px solid #37414e; border-radius: 12px; background: #202832; color: inherit; text-align: left; overflow: hidden; cursor: pointer; }
.lobby-project-item { min-width: 0; }
.lobby-project-item .lobby-project-card { width: 100%; }
.lobby-project-card:hover { border-color: #9ad2d3; background: #29333e; }
.lobby-project-art { display: block; height: 116px; background: linear-gradient(150deg, #394a5d 0 35%, #6d8c9a 35% 60%, #d2a185 60%); }
.lobby-project-name, .lobby-project-date { padding: 0 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lobby-project-date { color: #aab7c5; }
.lobby-project-actions { display: flex; gap: 4px; padding: 7px 0; }
.lobby-project-action { flex: 1; min-width: 0; padding: 5px 3px; border: 1px solid #445564; border-radius: 6px; background: #26313c; color: #e7eff5; font: inherit; font-size: 12px; cursor: pointer; }
.lobby-project-action:hover { background: #405567; }
.lobby-project-action:disabled { opacity: .5; cursor: default; }
.lobby-name-input { width: 100%; box-sizing: border-box; padding: 8px; font: inherit; }
.lobby-home-button { align-self: center; margin-left: 8px; padding: 5px 10px; border: 1px solid #4b5866; border-radius: 6px; background: #26313c; color: #eef4f7; cursor: pointer; }
.lobby-home-button[hidden] { display: none; }
@media (max-width: 780px) { .launch-lobby { grid-template-columns: 1fr; } .lobby-sidebar { flex-direction: row; align-items: center; padding: 15px 20px; } .lobby-local-note { display: none; } .lobby-content { padding: 24px; } .lobby-hero { grid-template-columns: 1fr; } .lobby-hero-art { display: none; } }
.lobby-sidebar .lobby-button[data-action="lobby-restore"] { width: 100%; }