/* Illustrated matchmaking lobby. Only rings, dots and light points move. */
dialog#lobby{position:relative;isolation:isolate;width:min(760px,96vw);max-height:96dvh;padding:24px 24px 18px;overflow-y:auto;overflow-x:hidden;text-align:center;background-color:#061b29;background-image:linear-gradient(#04152470,#04152400 22%,#04152433 42%,#041524f2 72%,#041524f5),url('assets/choice-cards/matchmaking-castle-v2.webp');background-size:100% 100%,100% auto;background-position:center,center 38px;background-repeat:no-repeat;scrollbar-color:#ae925d #071c29;border-radius:14px;border:1px solid #c6a45c}
#lobby .lobby-heading{position:relative;z-index:1;text-shadow:0 2px 12px #00111d}
#lobby .eyebrow{font:700 10px/1.4 system-ui;letter-spacing:.22em;color:#e8c680;margin:0 0 10px}
#lobbyTitle{font:700 clamp(29px,5vw,50px)/1.05 Georgia,serif;color:#ffedc7;margin:0 0 10px;letter-spacing:-.025em}
#lobbyMessage{font:600 clamp(14px,2.2vw,21px)/1.4 Georgia,serif;color:#c5dce5;margin:0 auto;max-width:42ch;overflow-wrap:anywhere}
.lobby-visual{position:relative;min-height:clamp(220px,39vw,330px);padding-top:155px;margin:0 auto 8px;max-width:570px;display:flex;align-items:flex-end;justify-content:center}
.search-sigil{position:absolute;left:50%;top:12%;width:clamp(125px,27vw,215px);aspect-ratio:1;transform:translateX(-50%);filter:drop-shadow(0 0 5px #f4b65188);pointer-events:none}
.search-sigil svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;max-height:none;min-height:0;fill:none;stroke:#e5be72;stroke-width:.65}
.search-sigil .sigil-star{fill:#f2ca79;stroke:none}.search-sigil .sigil-faint{opacity:.4}.search-sigil .sigil-dashes{stroke-dasharray:1 4}
.search-orbit{position:absolute;inset:3%;border:1px solid #f4d69c33;border-top-color:#ffe2a7;border-left-color:#ffe2a788;border-radius:50%;animation:search-orbit 11s linear infinite;animation-play-state:paused}
.search-orbit::before,.search-orbit::after{content:'';position:absolute;top:14%;left:14%;width:6px;height:6px;border-radius:50%;background:#ffedbd;box-shadow:0 0 8px 3px #f4bd6588}
.search-orbit::after{top:auto;left:auto;bottom:14%;right:14%;width:4px;height:4px}.search-orbit.inner{inset:25%;animation-direction:reverse;animation-duration:8s}
#lobbyPlayers{position:relative;z-index:1;display:grid;grid-template-columns:repeat(var(--slots,3),minmax(0,1fr));gap:clamp(10px,4vw,40px);align-items:end;max-width:100%;width:100%;padding:0 15px}
.lobby-player{min-width:0;color:#fce6b4;text-shadow:0 2px 7px #000}.player-shield{display:block;width:clamp(65px,13vw,105px);height:auto;margin:0 auto;overflow:visible;max-height:none;min-height:0;filter:drop-shadow(0 3px 4px #0008)}.shield-surface{fill:var(--seat-color);stroke:#e5be72;stroke-width:2}.shield-crown{fill:#e7c273;stroke:#e7c273;stroke-width:3;stroke-linejoin:round}.lobby-player.waiting .shield-surface{fill:var(--seat-color);fill-opacity:.4;stroke-opacity:.65}.lobby-player.waiting .shield-crown{opacity:.32}.lobby-player strong{display:block;font:700 17px/1.25 Georgia,serif;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-player small{display:block;font:11px/1.5 system-ui;color:#bdd1da;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-player.waiting strong{color:#b5c9d5}.lobby-player.ready .player-shield{filter:drop-shadow(0 0 8px #e8bd6538)}
.lobby-status{position:relative;margin:0 0 17px;min-height:74px}.lobby-status #lobbyTimer{font:700 clamp(20px,3.3vw,29px)/1.3 Georgia;margin:5px 0 3px;color:#fff0d0}.lobby-status #lobbyWait{font:16px/1.4 Georgia;margin:0;color:#b6cfda}.search-dots{display:flex;justify-content:center;gap:7px;margin-top:10px;height:9px}.search-dots i{display:block;width:5px;height:5px;background:#e8c27b;border-radius:50%;animation:search-dot 1.5s ease-in-out infinite;animation-play-state:paused}.search-dots i:nth-child(2){animation-delay:.2s}.search-dots i:nth-child(3){animation-delay:.4s}
#lobby[open].is-searching:not(.ui-paused):not(.reconnecting):not(.reduced-motion) .search-orbit,#lobby[open].is-searching:not(.ui-paused):not(.reconnecting):not(.reduced-motion) .search-dots i{animation-play-state:running}
#lobbyConnection{font:600 14px/1.4 system-ui;color:#f0bd8b!important;margin:10px 0}#lobbyConnection[hidden]{display:none}
#lobbyActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;position:relative;margin:0 0 16px}
#lobby #inviteControls{display:contents;border:0;padding:0;margin:0}#lobby #inviteShare{grid-column:1/-1;min-width:0;background:#061b2bd9;border:1px solid #b6995b;padding:15px;border-radius:10px;text-align:left}#lobby #inviteShare[hidden]{display:none}#lobby #inviteShare p{font:14px/1.5 system-ui;margin:0 0 8px}#lobby #inviteShare input{max-width:100%;margin:0 0 10px}
#lobby .lobby-action{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:flex-end;flex-direction:column;gap:4px;min-width:0;aspect-ratio:1.32;min-height:142px;overflow:hidden;margin:0;padding:84px 8px 13px;color:#ffebc8;text-align:center;border-radius:11px;border:1px solid #d2b475;background:#0b2433;box-shadow:0 4px 17px #0005}
#lobby .lobby-action img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;pointer-events:none}#lobby .lobby-action::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(transparent 35%,#071c2bb5 67%,#061b2bf5 100%);pointer-events:none}
#lobby .lobby-action strong{font:700 clamp(18px,2.9vw,27px)/1.1 Georgia;color:#fff0ce;text-shadow:0 2px 8px #000;text-wrap:balance}#lobby .lobby-action small{font:clamp(12px,1.8vw,16px)/1.3 system-ui;color:#d2e0e6;text-shadow:0 2px 6px #000;text-wrap:balance}#lobby .lobby-action:hover{border-color:#ffe3a1;box-shadow:inset 0 0 0 1px #ffe3a155,0 0 14px #c49b3544}#lobby .lobby-action[hidden]{display:none!important}#lobby.private-lobby #lobbyActions{grid-template-columns:1fr}#lobby.private-lobby .lobby-action{aspect-ratio:auto;min-height:130px;padding-top:75px}#lobby .lobby-action:disabled{opacity:.55;cursor:wait}
#lobby #cancelLobby{display:block;min-height:43px;margin:0 auto 12px;min-width:180px;padding:10px 24px;background:#091f2be6;border:1px solid #b19761;color:#d4e1e6;font:17px/1.3 Georgia;border-radius:7px}#lobbyFootnote{font:12px/1.5 system-ui;color:#a7c0cf!important;margin:0}
@keyframes search-orbit{to{transform:rotate(360deg)}}@keyframes search-dot{0%,75%,100%{opacity:.35;transform:scale(.85)}30%{opacity:1;transform:scale(1.2)}}
@media(max-width:420px){dialog#lobby{padding:20px 13px 16px}#lobbyTitle{font-size:32px}.lobby-visual{min-height:225px;padding-top:145px}#lobbyPlayers{gap:10px;padding:0 8px}.lobby-player strong{font-size:16px}#lobbyActions{gap:9px}#lobby .lobby-action{padding:80px 7px 12px;min-height:150px}#lobby .lobby-action strong{font-size:19px}#lobby .lobby-action small{font-size:12px}.lobby-status #lobbyWait{font-size:15px}}
@media(min-width:700px),(orientation:landscape) and (max-height:550px){#lobby[open]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 22px;width:min(960px,96vw);background-size:100% 100%,65% auto;background-position:center,left top;padding:20px}.lobby-heading{grid-column:1/-1}.lobby-visual{grid-column:1;grid-row:2/5;margin:0;min-height:290px;width:100%;padding-top:170px}.search-sigil{top:8%;width:160px}.lobby-status{grid-column:2;margin:12px 0;align-self:center}#lobbyActions{grid-column:2;align-self:center}#lobby #cancelLobby{grid-column:2;margin-top:0;margin-bottom:10px}#lobbyFootnote{grid-column:1/-1}#lobby .lobby-action{aspect-ratio:1.1;min-height:135px;padding-top:65px}#lobby .lobby-action strong{font-size:19px}#lobby .lobby-action small{font-size:12px}}
@media(orientation:landscape) and (max-height:420px){dialog#lobby{max-height:98dvh}#lobbyTitle{font-size:29px}.lobby-visual{min-height:235px}.lobby-player strong{font-size:14px}#lobbyPlayers{padding:0}.player-shield{width:65px}.lobby-status{min-height:55px}.lobby-status #lobbyTimer{font-size:21px}.search-sigil{width:125px}.lobby-visual{padding-top:125px}#lobby #cancelLobby{min-height:38px}}
@media(prefers-reduced-motion:reduce){#lobby .search-orbit,#lobby .search-dots i{animation:none!important}}
#lobby .lobby-action{width:100%;max-width:100%;min-inline-size:0}#lobby .lobby-action strong,#lobby .lobby-action small{width:100%;min-width:0}
@media(orientation:landscape) and (max-height:420px){dialog#lobby{padding:12px!important}#lobby .lobby-heading .eyebrow{font-size:8px;margin:0 0 4px}#lobbyTitle{font-size:27px;margin:0 0 4px}#lobbyMessage{font-size:13px;line-height:1.2}.lobby-visual{min-height:200px;padding-top:110px}.search-sigil{top:5%;width:110px}.player-shield{width:56px}.lobby-player strong{font-size:13px;margin-top:3px}.lobby-player small{font-size:10px}.lobby-status{min-height:0;margin:4px 0}.lobby-status #lobbyTimer{font-size:20px;margin:0 0 2px}.lobby-status #lobbyWait{font-size:13px}.search-dots{margin-top:5px;height:6px}#lobbyActions{margin-bottom:7px}#lobby .lobby-action{min-height:100px;height:100px;aspect-ratio:auto;padding:43px 7px 8px}#lobby .lobby-action strong{font-size:17px}#lobby .lobby-action small{font-size:11px}#lobby #cancelLobby{min-height:34px;padding:6px 16px;font-size:15px;margin-bottom:4px}#lobbyFootnote{font-size:10px}}