.gg-room-directory{margin:18px 0 4px;padding:14px;border:1px solid rgba(20,54,58,.18);border-radius:18px;background:rgba(255,253,246,.92);color:#17383a;box-shadow:0 10px 30px rgba(31,62,62,.08)}
.gg-room-directory__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.gg-room-directory__head h2{margin:0;font-size:clamp(1rem,2.5vw,1.2rem);line-height:1.25}
.gg-room-directory__refresh{appearance:none;border:0;background:transparent;color:#24695c;font:inherit;font-weight:800;padding:8px;cursor:pointer}
.gg-room-directory__list{display:grid;gap:8px}
.gg-room-directory__room{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;width:100%;min-height:58px;padding:10px 12px;border:1px solid rgba(20,54,58,.14);border-radius:14px;background:#fff;color:inherit;text-align:left;cursor:pointer;font:inherit}
.gg-room-directory__room:hover,.gg-room-directory__room:focus-visible{border-color:#2d806c;box-shadow:0 0 0 3px rgba(45,128,108,.13);outline:0}
.gg-room-directory__room strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gg-room-directory__room small{color:#617271;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gg-room-directory__room b{grid-row:1/span 2;grid-column:2;color:#24695c;font-size:.92rem;white-space:nowrap}.gg-room-directory__empty{margin:0;padding:8px 2px;color:#687978;font-size:.92rem}
@media(max-width:520px){.gg-room-directory{padding:12px;border-radius:15px}.gg-room-directory__room{min-height:54px}}

/* Shared multiplayer entry size. Keep the game canvas and in-game HUD intact. */
.gg-room-directory{width:100%;box-sizing:border-box;padding:20px;min-width:0}
.gg-room-directory__head{gap:16px;margin-bottom:18px}
.gg-room-directory .gg-room-directory__head h2{font-size:22px;letter-spacing:normal;white-space:normal}
body .gg-room-directory button.gg-room-directory__refresh{min-height:44px;flex-shrink:0;padding:8px 12px;white-space:nowrap;font-family:inherit;font-size:16px;font-weight:700;width:auto;margin:0;box-shadow:none}
.gg-room-directory__list{gap:12px;max-height:360px;overflow:auto}
.gg-room-directory__room{min-height:82px;padding:16px;font-size:18px;margin:0}
.gg-room-directory__room small{font-size:15px;letter-spacing:normal}
.gg-room-directory__room b{font-size:16px}
.gg-room-directory__empty{font-size:16px;line-height:1.6;padding:12px 0}
#panel:has([data-endpoint="/party-race/rooms"]),#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]){left:50%;top:76px;bottom:24px;transform:translateX(-50%);width:min(900px,calc(100vw - 64px));max-height:none;padding:32px;overflow:auto}
#panel:has([data-endpoint="/party-race/rooms"]) #entry,#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]) #entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:28px;align-items:start}
#panel:has([data-endpoint="/party-race/rooms"]) #entry .gg-room-directory,#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]) #entry .gg-room-directory{margin-top:0}
#panel:has([data-endpoint="/rider/rooms"]){left:50%;transform:translateX(-50%);width:min(980px,calc(100vw - 64px));padding:28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:32px;align-content:start}
#panel:has([data-endpoint="/rider/rooms"])>.brand-line,#panel:has([data-endpoint="/rider/rooms"])>h1{grid-column:1/-1}
#panel:has([data-endpoint="/rider/rooms"])>#mode-picker,#panel:has([data-endpoint="/rider/rooms"])>#map-picker,#panel:has([data-endpoint="/rider/rooms"])>#open-garage{grid-column:1}
#panel:has([data-endpoint="/rider/rooms"])>#entry{grid-column:2;grid-row:3/span 4;min-width:0}
#panel:has([data-endpoint="/rider/rooms"])>#lobby{grid-column:1/-1}
#panel:has([data-room-directory]) label,#lobby.paper:has([data-room-directory]) label{font-size:16px}
#panel:has([data-room-directory]) input,#lobby.paper:has([data-room-directory]) input{min-height:54px;font-size:18px}
#panel:has([data-room-directory]) #entry button,#lobby.paper:has([data-room-directory]) #entry button{min-height:54px;font-size:17px}
#menu.menu:has([data-room-directory]){max-width:920px}
.qw-entry-shell:has([data-room-directory]){width:min(920px,100%)}
.qw-entry-screen>[data-room-directory]{width:min(680px,100%)}
.qw-entry-screen:has(>[data-room-directory]) .qw-game-logo{height:150px;margin-bottom:16px}
@media(min-width:901px){.world-setup:has([data-room-directory]){grid-template-columns:minmax(280px,1fr) minmax(520px,680px);gap:40px;padding-inline:3vw}}
@media(max-width:760px){
  #panel:has([data-endpoint="/party-race/rooms"]),#panel:has([data-endpoint="/rider/rooms"]),#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]){left:12px;right:12px;top:68px;bottom:12px;transform:none;width:auto;padding:20px;max-height:none;display:block}
  #panel:has([data-endpoint="/rider/rooms"]){display:flex;flex-direction:column}
  #panel:has([data-endpoint="/rider/rooms"])>#entry,#panel:has([data-endpoint="/rider/rooms"])>#lobby{order:1}
  #panel:has([data-endpoint="/rider/rooms"])>#mode-picker{order:2;margin-top:20px}
  #panel:has([data-endpoint="/rider/rooms"])>#map-picker{order:3}
  #panel:has([data-endpoint="/rider/rooms"])>#open-garage{order:4;flex-shrink:0}
  #panel:has([data-endpoint="/rider/rooms"])>#error{order:5}
  #panel:has([data-endpoint="/rider/rooms"])>h1{margin-bottom:20px}
  #panel:has([data-endpoint="/party-race/rooms"]) #entry,#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]) #entry{display:block}
  #panel:has([data-endpoint="/party-race/rooms"]) #entry .gg-room-directory,#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]) #entry .gg-room-directory{margin-top:20px}
  .gg-room-directory{padding:16px}.gg-room-directory__head{gap:8px}.gg-room-directory .gg-room-directory__head h2{font-size:19px}body .gg-room-directory button.gg-room-directory__refresh{padding:8px;font-size:15px}.gg-room-directory__room{min-height:76px;font-size:17px;padding:14px}.gg-room-directory__list{max-height:320px}
  .qw-entry-screen:has(>[data-room-directory]) .qw-game-logo{height:120px}
}
@media(max-height:520px) and (min-width:761px){#panel:has([data-room-directory]),#lobby.paper:has([data-endpoint="/gomgom-us/rooms"]){top:52px;bottom:10px;padding:20px}#panel:has([data-room-directory])>h1,#lobby.paper:has([data-room-directory])>h1{font-size:32px;margin:8px 0 18px}}

/* Preserve room identity and readable metadata across refresh and narrow screens. */
.gg-room-directory__room strong,.gg-room-directory__room small { overflow: visible; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; line-height: 1.4; }
.gg-room-directory__room small { color: #4a6561; }
.gg-room-directory__room[aria-pressed="true"] { border-color: #24695c; background: #edf7ee; box-shadow: inset 4px 0 #24695c; }
.gg-room-directory__room:focus-visible,body .gg-room-directory button.gg-room-directory__refresh:focus-visible { outline: 3px solid #24695c; outline-offset: 2px; }
.gg-room-directory__refresh:disabled { cursor: progress; opacity: .65; }
.gg-room-directory__empty { color: #4a6561; }
#panel:has([data-endpoint="/party-race/rooms"]) { bottom: auto; max-height: calc(100dvh - 100px); }
@media (min-width:901px) { .world-setup:has([data-room-directory]) { grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); gap: 28px; } }
@media(max-width:760px) {
  #panel:has([data-endpoint="/party-race/rooms"]) { bottom: auto; max-height: calc(100dvh - 80px); }
  .gg-room-directory__list { overscroll-behavior: contain; }
}

/* Entry/create/join and waiting rooms. Never style the live canvas or HUD. */
/* Source-first title v3: independent pressed feedback; native release-off cancels. */
.gg-room-directory :is(.gg-room-directory__room,.gg-room-directory__refresh):not(:disabled):active,
#panel:has([data-room-directory]) :is(#entry,#lobby) button:not(:disabled):active,
#menu.menu:has([data-room-directory]) button:not(:disabled):active,
.qw-entry button:not(:disabled):active,.world-setup button:not(:disabled):active,
.wrap:not(.battle-active) .battle-lobby button:not(:disabled):active {
 filter: brightness(.9); box-shadow: inset 0 2px 3px #142b382b;
}
#panel:has([data-room-directory]) :is(#entry,#lobby) { min-width: 0; }
#panel:has([data-room-directory]) #entry fieldset { min-width: 0; padding: 0; border: 0; }
#panel:has([data-room-directory]) #entry label { display: grid; gap: 8px; line-height: 1.4; }
#panel:has([data-room-directory]) #entry :is(input,button),#panel:has([data-room-directory]) #lobby :is(input,button) { border-radius: 10px; }
#panel:has([data-room-directory]) #entry .join { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; margin-top: 16px; }
#panel:has([data-room-directory]) #entry .entry-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
#panel:has([data-room-directory]) #entry .entry-actions button { flex: 1 1 140px; }
#panel:has([data-endpoint="/party-race/rooms"]) #customizer { margin-bottom: 24px; }
#panel:has([data-room-directory]) #lobby :is(#room-code,#code-label) { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#panel:has([data-room-directory]) #lobby :is(#members,#players) { padding: 0; list-style: none; display: grid; gap: 8px; }
#panel:has([data-room-directory]) :is(input,select,button,summary):focus-visible { outline: 3px solid #24695c; outline-offset: 3px; }
#panel:has([data-room-directory]) #entry button:disabled { cursor: not-allowed; }
#menu.menu:has([data-room-directory]) { width: min(860px,100%); padding: 28px; clip-path: none; }
#menu.menu:has([data-room-directory]) .menu-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
#menu.menu:has([data-room-directory]) .menu-actions button { min-height: 52px; padding: 12px; font-size: 16px; white-space: normal; }
#menu.menu:has([data-room-directory]) label { font-size: 16px; letter-spacing: normal; }
#menu.menu:has([data-room-directory]) .join-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; margin-top: 22px; }
#menu.menu:has([data-room-directory]) .join-row button { min-height: 48px; font-size: 16px; }
#menu.menu:has([data-room-directory]) .hint { font-size: 14px; line-height: 1.6; }
.qw-entry .qw-entry-form :is(input:not([type="checkbox"]):not([type="radio"]),select,button),.world-setup .setup-panel :is(input:not([type="checkbox"]):not([type="radio"]),select,button) { min-height: 48px; font-size: 16px; }
.qw-entry :is(button,input,select):focus-visible,.world-setup :is(button,input,select):focus-visible { outline: 3px solid #24695c; outline-offset: 3px; }
.qw-entry .qw-main-menu { gap: 12px; }
.qw-entry .qw-menu-button small,.qw-entry .qw-mode-card small { font-size: 15px; line-height: 1.45; }
.world-setup .setup-panel { min-width: 0; }
.world-lobby .lobby-card { overflow-wrap: anywhere; }
.wrap:not(.battle-active) .battle-lobby { padding: 20px; border-radius: 14px; }
.wrap:not(.battle-active) .battle-lobby :is(input,button) { min-height: 48px; font-size: 16px; border-radius: 8px; }
.wrap:not(.battle-active) .battle-join { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; }
.wrap:not(.battle-active) .battle-join input { width: 100%; }
.wrap:not(.battle-active) .battle-lobby :is(input,button):focus-visible { outline: 3px solid #80dbbf; outline-offset: 3px; }
@media(max-width:760px) {
 #panel:has([data-room-directory]) { padding-bottom: max(20px,env(safe-area-inset-bottom)); }
 #panel:has([data-endpoint="/rider/rooms"])>:is(#mode-picker,#map-picker,#open-garage,#entry,#lobby,#error) { order: 0; }
 #panel:has([data-endpoint="/rider/rooms"])>#mode-picker { margin-top: 0; }
 #panel:has([data-endpoint="/rider/rooms"])>#entry { margin-top: 20px; }
 #menu.menu:has([data-room-directory]) { padding: 20px 16px; }
 #menu.menu:has([data-room-directory]) .menu-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
 #menu.menu:has([data-room-directory]) #soloButton { grid-column: 1/-1; }
 .qw-entry .qw-mode-menu { gap: 12px; }
}
