/* Lightweight salon UI: no 3D previews or continuously animated effects. */
.room-lobby{max-width:1500px;margin:0 auto;padding:28px;color:#e9eee5}
.room-lobby-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px}
.room-lobby-heading h1{margin:8px 0 10px;font:800 clamp(1.6rem,3vw,2.6rem)/1.1 Manrope,sans-serif;letter-spacing:-.04em}
.room-lobby-heading p{max-width:660px;margin:0;color:#b2c4bc;font-size:.95rem;line-height:1.5}
.room-lobby-heading .meta-kicker{font-size:.68rem;letter-spacing:.1em;color:#e4bf77}
.room-lobby-heading-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px;flex-shrink:0}
.room-lobby-button{display:inline-flex;justify-content:center;align-items:center;min-height:40px;padding:9px 13px;border:1px solid #5b7568;border-radius:8px;background:#18362e;color:#e8efdf;font:inherit;font-size:.78rem;font-weight:700;line-height:1.25;cursor:pointer;white-space:nowrap;text-decoration:none}
.room-lobby-button:hover:not(:disabled){border-color:#d4b875;background:#25493c}
.room-lobby-button.is-primary{background:#e8bd73;border-color:#efcf92;color:#1d2a22}
.room-lobby-button.is-primary:hover:not(:disabled){background:#f6d393}
.room-lobby-button.is-danger{border-color:#9d6b59;color:#f2c1ae;background:#492f28}
.room-lobby-button:disabled{opacity:.5;cursor:default}
.room-lobby-button:focus-visible,.room-lobby select:focus-visible,.room-options select:focus-visible,.room-options input:focus-visible,.room-lobby-table-scroll:focus-visible{outline:2px solid #f3d394;outline-offset:3px}
.room-lobby-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:16px;border:1px solid #ffffff16;border-radius:12px;background:#102521}
.room-lobby-filter{display:grid;gap:7px;flex:1 1 170px;min-width:0}
.room-lobby-filter>span,.room-option-field>span{font-size:.7rem;color:#b5cbc0;font-weight:700}
.room-lobby-filter select,.room-option-field select{width:100%;min-width:0;min-height:42px;padding:9px 30px 9px 11px;border:1px solid #49665a;border-radius:7px;background:#0c1d19;color:#ebeee4;font:inherit;font-size:.83rem;color-scheme:dark}
.room-lobby-summary{margin:16px 0 10px!important;color:#c3d2c9;font-size:.78rem!important;font-variant-numeric:tabular-nums}
.room-lobby-error{padding:12px 14px;border:1px solid #b57a5e;border-radius:8px;background:#482e25;color:#f4c8b5!important;font-size:.86rem!important;line-height:1.5}
.room-lobby-table-scroll{overflow-x:auto;border:1px solid #ffffff18;border-radius:12px;background:#10201e;overscroll-behavior-inline:contain}
.room-lobby-table{border-collapse:collapse;width:100%;min-width:1030px;font-size:.8rem;text-align:left}
.room-lobby-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.room-lobby-table thead{background:#19362d}
.room-lobby-table th,.room-lobby-table td{padding:14px 12px;border-bottom:1px solid #ffffff10;vertical-align:middle}
.room-lobby-table thead th{font-size:.67rem;letter-spacing:.04em;text-transform:uppercase;color:#b9cfc0;font-weight:700;white-space:nowrap}
.room-lobby-table tbody th{font-weight:700;max-width:170px}
.room-lobby-table tbody tr:last-child>*{border-bottom:0}
.room-lobby-table tbody tr:hover{background:#28413655}
.room-lobby-room-name{display:block;overflow-wrap:anywhere}
.room-lobby-competition{display:inline-block;margin-top:7px;padding:3px 7px;border:1px solid #527765;border-radius:5px;background:#19372c;color:#c5dfcc;font-size:.64rem;font-weight:700;line-height:1.35}
.room-lobby-competition.is-ranked{border-color:#a58b50;background:#3b3520;color:#f3d88f}
.room-lobby-table .room-lobby-series{font-weight:700;color:#dcc48e}
.room-lobby-join-reason{max-width:180px;margin:7px 0 0!important;color:#dec5a3;font-size:.69rem!important;font-weight:400;line-height:1.5!important;overflow-wrap:anywhere}
.room-lobby-table small{display:block;color:#a9c0b1;font-size:.69rem;line-height:1.4;margin-top:5px;font-weight:400}
.room-lobby-status{display:inline-block;padding:5px 8px;border:1px solid #5b7964;border-radius:20px;white-space:nowrap;color:#cce7d5;background:#284c35;font-size:.68rem;font-weight:700}
.room-lobby-status.is-active{border-color:#6e7869;background:#2c3930;color:#d8e1cc}
.room-lobby-guide{white-space:nowrap}
.room-lobby-row-actions{min-width:110px}
.room-lobby-row-actions .room-lobby-button{display:flex;width:100%;margin:5px 0;font-size:.72rem}
.room-lobby-own{display:block;max-width:135px;color:#edcb8d;font-size:.75rem}
.room-lobby-muted{color:#a9beb1;font-size:.8rem;line-height:1.5}
.room-lobby-table .room-lobby-empty{padding:40px 20px;text-align:center;color:#bccfc0;line-height:1.6}
.room-lobby-empty .room-lobby-button{margin-top:14px}
.room-lobby-footnote{font-size:.75rem!important;line-height:1.5!important;color:#a8bfb0!important;margin:13px 0 0!important}
.room-roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.room-roster-team{padding:12px;border:1px solid #ffffff17;border-radius:8px;background:#163028;min-width:0}
.room-roster-team>strong{display:block;margin-bottom:7px;color:#e4c382;font-size:.72rem}
.room-roster-team ul{list-style:none;padding:0;margin:0}
.room-roster-team li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:3px 0;font-size:.82rem;line-height:1.4;overflow-wrap:anywhere}
.room-roster-team li.is-actor>span{color:#fff1ce}
.room-roster-team li>small{flex-shrink:0;color:#b9d6a8;font-size:.65rem}
.room-roster-team .room-roster-vacancy{color:#8ca394;font-style:italic;font-size:.75rem}
.room-roster.is-compact{display:flex;gap:10px;margin:0;min-width:150px}
.room-roster.is-compact .room-roster-team{padding:0;background:none;border:0;min-width:65px;flex:1}
.room-roster.is-compact .room-roster-team>strong{font-size:.6rem;margin-bottom:2px;color:#a4bbae}
.room-roster.is-compact li{font-size:.71rem;display:block;padding:2px 0}
.room-roster.is-compact .room-roster-vacancy{font-size:.67rem}
.room-options{display:grid;gap:14px;margin:16px 0 0;padding:15px;border:1px solid #ffffff24;border-radius:10px;min-width:0}
.room-options legend{padding:0 6px;font-size:.78rem;color:#e9cd93;font-weight:700}
.room-option-field{display:grid;gap:7px;min-width:0}
.room-option-toggle{display:flex;align-items:flex-start;gap:10px;cursor:pointer;min-width:0}
.room-option-toggle input{width:18px;height:18px;min-height:18px;flex:none;margin:2px 0 0;padding:0;accent-color:#e9c77e;cursor:pointer}
.room-option-toggle>span{display:grid;gap:4px;min-width:0}
.room-option-toggle strong{font-size:.82rem;font-weight:700;color:#e5eddf}
.room-option-toggle small{font-size:.74rem!important;line-height:1.45;color:#aec3b4}
.room-option-toggle:has(input:disabled){cursor:default;opacity:.6}
.room-options-note{margin:0!important;font-size:.76rem!important;line-height:1.5!important;color:#d4d9c1!important}
.room-visitors{color:#e5eddf}
.room-visitors-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.room-visitors-heading h3{font-size:1.05rem!important;margin:0 0 5px!important}
.room-visitors-heading p,.room-visitors-role{font-size:.8rem!important;line-height:1.4!important;margin:0!important;color:#b8cdbd}
.room-visitors-lists{display:grid;gap:18px;margin-top:20px}
.room-visitors-lists h4{font-size:.83rem;margin:0 0 9px;color:#d7e2d4}
.room-visitors-lists h4 span{font-weight:400;color:#a6bead}
.room-visitors-list{list-style:none;padding:0;margin:0}
.room-visitors-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #ffffff14}
.room-visitors-list li>span{min-width:0;overflow-wrap:anywhere;font-size:.82rem}
.room-visitors-list li>div{display:flex;gap:6px;flex-shrink:0}
.room-visitors-list .room-lobby-button{min-height:34px;padding:7px 9px;font-size:.7rem}
.room-visitors-dialog{position:fixed;width:min(600px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid #63816b;border-radius:14px;background:#10251f;color:#e5eddf;overflow-y:auto;overscroll-behavior:contain}
.room-visitors-dialog::backdrop{background:#020a08c9}
.room-visitors-close{position:absolute;right:12px;top:10px;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid #6b806c;border-radius:8px;background:#18362a;color:#f1e6cb;font:inherit;font-size:1.35rem;cursor:pointer}
.room-visitors-dialog .room-visitors-heading{padding-right:32px}
.room-lobby-panel-actions{display:flex;justify-content:center;margin-top:16px}
.club-waiting>.club-button{margin:9px 5px}
.club-waiting>.club-button.is-secondary{background:#18362e;border-color:#5b7568;color:#e8efdf;box-shadow:none}
.club-waiting>.club-button.is-secondary:hover{background:#25493c;border-color:#d4b875}
#roomVisitorChatStatus{padding:0 10px 9px;margin-top:0!important}
.room-lobby-current{display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:1444px;margin:20px auto 0;padding:14px 18px;border:1px solid #8a7b4b;border-radius:10px;background:#273b2a;color:#e7d7aa;font-size:.84rem}
.room-lobby-current>span{margin-right:auto}
.room-lobby-create-back{padding:14px 28px 0}
.room-lobby-competition-choice,.room-lobby-series-choice{min-width:0}
.room-lobby-competition-choice>.meta-kicker,.room-lobby-series-choice>.meta-kicker{display:block;margin-bottom:9px}
.room-lobby-competition-choice .meta-note,.room-lobby-series-choice .meta-note{font-size:.76rem;line-height:1.5;color:#c1d0c5}
.room-lobby-competition-choice .meta-v21-segments,.room-lobby-series-choice .meta-v21-segments{display:flex;flex-wrap:wrap;gap:8px}
.room-lobby-competition-choice .meta-v21-segments button,.room-lobby-series-choice .meta-v21-segments button{min-width:0;flex:1;white-space:normal}
.meta-v21-play-catalog>.room-lobby-competition-choice{display:none}
@media(max-width:767px){.meta-v21-play-catalog>.room-lobby-competition-choice{display:block;margin-bottom:18px}.room-lobby-series-choice .meta-v21-segments button{min-height:44px;padding:8px 10px;font-size:.75rem}}
@media(max-width:850px){.room-lobby{padding:20px 16px}.room-lobby-heading{align-items:flex-start;flex-direction:column;gap:16px}.room-lobby-heading-actions{justify-content:flex-start}.room-lobby-filter{flex-basis:calc(50% - 12px)}.room-lobby-filters{gap:12px;padding:12px}.room-lobby-table{min-width:940px}.room-lobby-table th,.room-lobby-table td{padding:12px 10px}.room-lobby-footnote{font-size:.71rem!important}}
@media(max-width:767px),(pointer:coarse) and (max-width:1100px){
 .room-lobby-table-scroll{overflow:visible;background:transparent;border:0}
 .room-lobby-table{display:block;min-width:0;width:100%}
 .room-lobby-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .room-lobby-table tbody{display:grid;gap:12px}
 .room-lobby-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;padding:15px;border:1px solid #ffffff1c;border-radius:11px;background:#10251f}
 .room-lobby-table tbody th,.room-lobby-table tbody td{display:block;max-width:none;min-width:0;padding:0;border:0;overflow-wrap:anywhere}
 .room-lobby-table tbody th{grid-column:1/-1;font-size:.92rem}
 .room-lobby-table td[data-label]::before{content:attr(data-label);display:block;font-size:.63rem;font-weight:700;line-height:1.4;color:#a7bead;margin-bottom:5px}
 .room-lobby-table td:nth-child(6),.room-lobby-table .room-lobby-row-actions,.room-lobby-table .room-lobby-empty{grid-column:1/-1}
 .room-lobby-table .room-lobby-row-actions{display:flex;gap:8px;flex-wrap:wrap}
 .room-lobby-table .room-lobby-row-actions::before{display:none}
 .room-lobby-row-actions .room-lobby-button{min-height:43px;margin:0;flex:1;width:auto;white-space:normal}
 .room-lobby-join-reason{flex-basis:100%;max-width:none}
 .room-lobby-table .room-lobby-empty{padding:20px 5px}
 .room-lobby-filter select{padding-right:20px}
 .room-lobby-current{margin:14px 12px 0;padding:12px}
 .room-lobby-create-back{padding-left:12px}
}
@media(max-width:480px){.room-lobby{padding:18px 12px}.room-lobby-heading h1{font-size:1.8rem}.room-lobby-heading p{font-size:.84rem}.room-lobby-heading-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.room-lobby-heading-actions .room-lobby-button{font-size:.72rem;white-space:normal}.room-lobby-filter>span{font-size:.65rem}.room-lobby-filter select{font-size:.77rem;padding-left:8px}.room-lobby-summary{font-size:.72rem!important}.room-visitors-heading{align-items:flex-start;flex-direction:column}.room-visitors-list li{align-items:flex-start;flex-direction:column;gap:8px}.room-roster{gap:8px}.room-roster-team{padding:10px}.room-roster-team li{font-size:.76rem}}
/* One stable scroll owner survives room refreshes. The VR entry's flex frame
   must not clip or shrink this long page to the viewport. These local overrides
   intentionally take precedence over that frame, only while listing rooms. */
@media(max-width:767px),(pointer:coarse) and (max-width:1100px){
 #metaGame:has(.room-lobby){overflow-y:auto;overscroll-behavior-y:contain;touch-action:auto;scrollbar-width:thin}
 #metaGame:has(.room-lobby)>.meta-v21-shell{height:auto!important;min-height:100%;overflow:visible!important}
 #metaGame .meta-v21-shell>.meta-page-play:has(>.room-lobby){height:auto!important;min-height:calc(var(--meta-viewport-height,100dvh) - 64px);flex:0 0 auto!important;overflow:visible!important}
}

.room-creation-policy{display:grid;gap:16px}.room-entry-stepper{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px;margin-top:8px}.room-entry-stepper button{min-height:44px;border:1px solid var(--meta-line,#536c5f);border-radius:10px;background:#193b2f;color:#f0cf81;font-size:25px;cursor:pointer}.room-entry-stepper button:disabled{opacity:.4;cursor:default}.room-entry-stepper output{text-align:center;font-weight:700;font-size:18px}.room-creation-level{display:grid;gap:8px}.room-creation-level select{width:100%;min-height:46px;border:1px solid #536c5f;border-radius:10px;background:#0a251e;color:#f4efda;padding:10px;font:inherit}.room-lobby-min-level{display:block;margin-top:7px;color:#b5c7bc;font-weight:400}

/* Compact room discovery actions; only an active request animates. */
.room-lobby-heading-actions .room-lobby-refresh{width:44px;min-width:44px;height:44px;padding:10px;flex:none}
.room-lobby-refresh svg{display:block;width:22px;height:22px;transform-origin:center}
.room-lobby-refresh.is-refreshing svg{animation:room-lobby-refresh-turn .9s linear infinite}
.room-lobby-filter-toggle{display:none;gap:7px}
.room-lobby-filter-toggle svg{width:18px;height:18px;flex:none}
.room-lobby-filter-toggle small{display:inline-grid;place-items:center;min-width:19px;min-height:19px;border-radius:20px;padding:0 4px;background:#e8bd73;color:#1d2a22;font:inherit;font-size:.65rem}
@keyframes room-lobby-refresh-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.room-lobby-refresh.is-refreshing svg{animation:none}.room-lobby-refresh.is-refreshing{border-color:#e8bd73}}
@media(max-width:767px){
 .room-lobby-filter-panel:not(.is-open){display:none}
 .room-lobby-filter-toggle{display:inline-flex;min-height:44px}
 .room-lobby-heading-actions{display:flex;width:100%;flex-wrap:nowrap;align-items:center;gap:8px}
 .room-lobby-heading-actions .room-lobby-button.is-primary{min-height:44px;flex:1;min-width:0;padding:10px}
 .room-lobby-heading-actions .room-lobby-filter-toggle{flex:none;white-space:nowrap}
}

/* The mobile creation screen keeps its own back action instead of bottom navigation. */
@media(max-width:767px){
 #metaGame .meta-page-play:has(>.room-lobby-create-back)+.meta-v21-mobile-nav{display:none!important}
}

/* Invitation entry uses the established room-code join flow. */
.room-lobby-invite{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;padding:16px;border:1px solid #647451;border-radius:12px;background:#172d25;min-width:0}
.room-lobby-invite-copy{display:grid;gap:5px;flex:1 1 230px;min-width:0}
.room-lobby-invite-copy strong{color:#efd39a;font-size:.92rem;line-height:1.4}
.room-lobby-invite-copy span{color:#b9cec0;font-size:.78rem;line-height:1.5;overflow-wrap:anywhere}
.room-lobby-invite-entry{display:grid;gap:7px;flex:0 1 410px;min-width:0}
.room-lobby-invite-entry>label{font-size:.72rem;font-weight:700;color:#d5e1d4}
.room-lobby-invite-entry>div{display:flex;gap:9px;min-width:0}
.room-lobby-invite-entry input{flex:1 1 120px;width:100%;min-width:0;min-height:44px;box-sizing:border-box;padding:10px 12px;border:1px solid #718572;border-radius:8px;background:#0c1d19;color:#f3f0df;font:inherit;font-size:16px;letter-spacing:.06em}
.room-lobby-invite-entry input::placeholder{color:#96aa9c;opacity:1}
.room-lobby-invite-entry input:focus-visible{outline:2px solid #f3d394;outline-offset:3px}
.room-lobby-invite-entry input:disabled{opacity:.5}
.room-lobby-invite-entry .room-lobby-button{min-height:44px;flex-shrink:0}
@media(max-width:600px){.room-lobby-invite-entry{flex-basis:100%}}
@media(max-width:380px){.room-lobby-invite-entry>div{flex-wrap:wrap}.room-lobby-invite-entry .room-lobby-button{width:100%}}

/* Ranked admission help stays beside entry and opens above the scrolling table. */
.room-lobby-join-entry{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-width:0}
.room-lobby-row-actions .room-lobby-join-entry>.room-lobby-button{flex:1;min-width:0}
.room-lobby-entry-info{display:inline-grid;place-items:center;flex:none;width:40px;min-width:40px;height:40px;padding:0;border:1px solid #8da38c;border-radius:50%;background:#18362e;color:#efcf92;font:700 1rem/1 Georgia,serif;cursor:pointer}
.room-lobby-entry-info:hover{background:#25493c;border-color:#efcf92}
.room-lobby-entry-info:focus-visible,.room-lobby-info-close:focus-visible{outline:2px solid #f3d394;outline-offset:3px}
.room-lobby-ranked-popover{display:none;box-sizing:border-box;width:min(380px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid #8b9d7e;border-radius:14px;background:#10251f;color:#e9eee5;box-shadow:0 16px 60px #0009;overflow-y:auto;overscroll-behavior:contain;font:400 .85rem/1.55 Manrope,sans-serif;text-align:left}
.room-lobby-ranked-popover::backdrop{background:#020a0866}
.room-lobby-ranked-popover h2{margin:0 28px 14px 0;font:800 1.05rem/1.35 Manrope,sans-serif;color:#efcf92}
.room-lobby-ranked-popover p{margin:12px 0 0;font:inherit;color:#c5d4c9}
.room-lobby-info-close{position:absolute;right:10px;top:10px;display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid #647c69;border-radius:8px;background:#18362e;color:#edf2e5;font:400 1.5rem/1 sans-serif;cursor:pointer}
@media(max-width:700px){.room-lobby-join-entry{flex:1;min-width:0}.room-lobby-entry-info{width:44px;min-width:44px;height:44px}.room-lobby-ranked-popover{padding:22px}}

.room-lobby-ranked-popover:popover-open{display:block}
.room-lobby-entry-fallback{flex:0 0 40px;min-width:0}
.room-lobby-entry-fallback>summary{box-sizing:border-box;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid #8da38c;border-radius:50%;background:#18362e;color:#efcf92;font:700 1rem/1 Georgia,serif;list-style:none;cursor:pointer}
.room-lobby-entry-fallback>summary::-webkit-details-marker{display:none}
.room-lobby-entry-fallback>summary:focus-visible{outline:2px solid #f3d394;outline-offset:3px}
.room-lobby-entry-fallback[open]{flex:1 1 100%}
.room-lobby-entry-fallback-content{box-sizing:border-box;width:min(300px,100%);margin-top:9px;padding:14px;border:1px solid #8b9d7e;border-radius:10px;background:#10251f;color:#c5d4c9;white-space:normal;font:400 .8rem/1.5 Manrope,sans-serif}
.room-lobby-entry-fallback-content h2{margin:0 0 10px;color:#efcf92;font:800 .9rem/1.35 Manrope,sans-serif}
.room-lobby-entry-fallback-content p{margin:10px 0 0;font:inherit;color:inherit}
@media(max-width:700px){.room-lobby-entry-fallback{flex-basis:44px}.room-lobby-entry-fallback>summary{width:44px;height:44px}.room-lobby-entry-fallback[open]{flex-basis:100%}}
