/* The room entry is a single form surface; room and match screens keep their layout. */
body[data-phase="league-friends"]:has(.friends-entry) .stage{display:block;width:100%;max-width:560px;margin-inline:auto}
body[data-phase="league-friends"]:has(.friends-entry) .pitchbox{display:none}
body[data-phase="league-friends"] .panel:has(>.friends-entry){padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;overflow:visible}
.friends-entry{width:100%;padding:clamp(24px,5vw,42px);border:2px solid var(--fg,#20221f);border-radius:12px;background:var(--panel,#fff);color:var(--fg,#20221f);box-shadow:4px 4px 0 var(--fg,#20221f);text-align:center}
.friends-entry h2{margin:0;font:800 clamp(36px,6vw,48px)/1.08 var(--display,sans-serif);letter-spacing:-.025em;text-transform:none}
.friends-entry-lead{max-width:32ch;margin:14px auto 28px;color:var(--muted,#657068);font:500 15px/1.6 var(--body,sans-serif)}
.friends-entry form{text-align:left}
.friends-entry label{display:block;margin:0 0 8px;font:700 14px/1.4 var(--body,sans-serif);color:var(--fg,#20221f)}
.friends-entry input,.friends-entry select{box-sizing:border-box;width:100%;min-width:0;min-height:50px;margin:0;padding:12px 14px;border:1.5px solid var(--line,#c7cec3);border-radius:6px;background:var(--panel,#fff);color:var(--fg,#20221f);font:500 16px/1.4 var(--body,sans-serif);box-shadow:none;color-scheme:light}
.friends-entry input::placeholder{color:var(--muted,#657068);opacity:1}
.friends-entry input[aria-invalid="true"]{border-color:#a33c2b}
.friends-entry :is(input,select,button,summary):focus-visible{outline:3px solid var(--accent,#397657);outline-offset:3px}
.friends-entry .btn{min-height:50px;padding:12px 20px;border:1.5px solid var(--fg,#20221f);border-radius:6px;background:var(--panel,#fff);color:var(--fg,#20221f);font:700 16px/1.4 var(--body,sans-serif);box-shadow:none;text-transform:none;letter-spacing:0}
.friends-entry .btn:hover:not(:disabled){background:var(--panel-2,#eeeee4);border-color:var(--fg,#20221f);box-shadow:none;transform:none}
.friends-entry .btn.primary{display:block;width:100%;margin-top:20px;background:var(--accent,#397657);border-color:var(--accent,#397657);color:var(--accent-ink,#fff)}
.friends-entry .btn.primary:hover:not(:disabled){background:#245b40;border-color:#245b40;color:#fff}
.friends-entry :disabled{cursor:wait;opacity:.65}
.friends-entry-settings{margin-top:16px;text-align:left}
.friends-entry-settings summary,.friends-entry-saved summary{width:fit-content;min-height:36px;padding:8px 0;cursor:pointer;color:var(--muted,#657068);font:600 13px/1.4 var(--body,sans-serif)}
.friends-entry-settings>div{display:grid;gap:8px;padding:16px;margin-top:4px;border:1px solid var(--line,#c7cec3);border-radius:6px;background:var(--panel-2,#eeeee4)}
.friends-entry-settings label{margin:0}
.friends-entry-settings select+ p{margin:2px 0 0;color:var(--muted,#657068);font:400 12px/1.6 var(--body,sans-serif)}
.friends-entry-settings input+label{margin-top:6px}
.friends-entry-divider{display:flex;align-items:center;gap:16px;margin:24px 0;color:var(--muted,#657068);font:500 13px/1.4 var(--body,sans-serif)}
.friends-entry-divider::before,.friends-entry-divider::after{content:"";flex:1;border-top:1px solid var(--line,#c7cec3)}
.friends-entry-join{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
.friends-entry-status{min-height:0;margin:0;text-align:left;color:#93412c;font:500 14px/1.55 var(--body,sans-serif);overflow-wrap:anywhere}
.friends-entry-status:not(:empty){margin-top:18px}
.friends-entry-saved{margin-top:18px;text-align:left;border-top:1px solid var(--line,#c7cec3);padding-top:10px}
.friends-entry-saved .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.friends-entry-saved .chip{min-height:44px;padding:10px 12px;border:1px solid var(--line,#c7cec3);border-radius:5px;background:var(--panel-2,#eeeee4);color:var(--fg,#20221f);font:600 13px/1.4 var(--body,sans-serif);overflow-wrap:anywhere;text-align:left}
.friends-entry-back{display:block;min-height:44px;margin:22px auto -10px;padding:10px 16px;border:0;border-radius:4px;background:none;color:var(--muted,#657068);font:600 14px/1.4 var(--body,sans-serif);cursor:pointer}
.friends-entry-back:hover{color:var(--fg,#20221f);text-decoration:underline;text-underline-offset:4px}
@media(max-width:420px){.friends-entry{padding:26px 20px}.friends-entry-lead{font-size:14px}.friends-entry-join{gap:8px}.friends-entry-join .btn{padding-inline:15px}.friends-entry input{padding-inline:11px}}