/* Lobby 2.0: welcome gate, progress choice, the account block of the profile window and the sign-up shortcut. */
dialog.lobby-gate { width: min(520px, calc(100vw - 28px)); text-align: center; padding: 30px 30px 26px; }
dialog.lobby-gate::backdrop { background: #04100dd9; backdrop-filter: blur(6px); }
.lobby-gate .gate-mark { font: 400 54px/1 Georgia, serif; color: #ffe08f; filter: drop-shadow(0 2px 2px #000a) drop-shadow(0 0 14px #e9b95566); }
.lobby-gate h2 { font: 700 clamp(26px, 4vw, 34px)/1.15 var(--serif); color: #ffe3a3; margin: 8px 0 12px; }
.lobby-gate p { color: #e6e4c8; line-height: 1.6; }
.lobby-gate .small-label { letter-spacing: 3px; color: #e8c97c; }
.gate-actions { display: grid; gap: 12px; margin: 22px 0 14px; }
.gate-actions .button { min-height: 52px; font-size: 16px; border-radius: 999px; }
.gate-signup { display: grid !important; gap: 2px; place-content: center; border: 1.5px solid #e3c47c; color: #ffe6a3; background: linear-gradient(#2d6d5ee8, #133b32f0); }
.gate-signup small { font: 600 12px/1.2 var(--font); color: #d7e8c8; letter-spacing: .02em; }
.gate-signin { font-size: 15px; }
.gate-signin a, .account-block a:not(.button) { color: #ffe08f; }
.gate-note { margin-top: 14px; font-size: 12px; color: #b8c2a7 !important; letter-spacing: .04em; }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.choice-card { display: grid; gap: 8px; justify-items: center; padding: 16px 12px; border-radius: 12px; border: 1px solid #e3c47c55; background: #061612b3; }
.choice-card strong { display: inline-flex; align-items: center; gap: 8px; font: 700 26px var(--serif); color: #fff0c8; }
.choice-card span:not(.small-label):not(.coin-medallion) { font-size: 13px; color: #cfd5bd; }
.choice-card .button { width: 100%; min-height: 42px; font-size: 13px; border-radius: 999px; }
.account-block { display: grid; gap: 8px; justify-items: start; margin: 4px 0 18px; padding: 14px 16px; border-radius: 12px; border: 1px solid #e3c47c55; background: #061612b3; }
.account-block strong { font-size: 16px; color: #fff0c8; word-break: break-all; }
.account-block p { margin: 0; font-size: 14px; color: #dfe2c8; }
.account-status { font-size: 13px; font-weight: 700; }
.account-status.ok { color: #9ff0d8; }
.account-status.warn { color: #ffd38a; }
.account-sync { font-size: 12.5px; color: #b8c2a7; }
.account-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.account-block .button { min-height: 38px; padding: 0 18px; border-radius: 999px; font-size: 13px; margin: 0 !important; }
body:not(.game-active) .header-signup { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 999px; border: 1.5px solid #e9c46d; color: #ffe6a3; background: linear-gradient(#2d6d5ee8, #133b32f0); font: 700 14px var(--serif); text-decoration: none; white-space: nowrap; box-shadow: inset 0 1px #fff0b44d, 0 2px 0 #071a15; }
body:not(.game-active) .header-signup:hover { filter: brightness(1.15); }
#lobby-view .main-footer > .lobby-legal { font-size: 10px; color: #d6c69f; text-decoration: none; margin-left: 14px; }
#lobby-view .main-footer > .lobby-legal:hover { color: #ffe3a3; }
@media (max-width: 1100px) { body:not(.game-active) .header-signup { display: none; } }
@media (max-height: 600px) and (orientation: landscape) { #lobby-view .main-footer > .lobby-legal { font-size: 8px; margin-left: 8px; } }
@media (max-width: 700px) and (orientation: landscape) { #lobby-view .main-footer > .lobby-legal { display: none; } }
@media (max-height: 520px) { dialog.lobby-gate { padding: 18px 22px 16px; } .lobby-gate .gate-mark { font-size: 36px; } .lobby-gate h2 { font-size: 24px; margin: 4px 0 6px; } .gate-actions { margin: 12px 0 8px; gap: 8px; } .gate-actions .button { min-height: 42px; } .lobby-gate p { font-size: 14px; } }