/* A small warm-gold invitation rail. The playfield never owns this surface. */
.recruitment{--recruitment-ink:#f5e8c9;--recruitment-muted:#adb8c1;--recruitment-gold:#d2b779;color:var(--recruitment-ink);min-width:0;width:100%;border-top:1px solid #cdb47732;font-family:var(--sans, sans-serif);text-align:left}
.recruitment button{font:inherit;touch-action:manipulation;cursor:pointer}
.recruitment button:disabled{opacity:.5;cursor:default}
.recruitment button:focus-visible{outline:2px solid #f2d592;outline-offset:2px}
.recruitment-toggle{width:100%;min-height:44px;display:flex;align-items:center;gap:9px;padding:7px 3px;border:0;background:none;color:inherit;text-align:left}
.recruitment-toggle strong{font-size:13px;line-height:1.3;font-weight:650;letter-spacing:.03em;flex:1;min-width:0}
.recruitment-mark{font-size:22px;color:var(--recruitment-gold);width:23px;text-align:center;flex:none}
.recruitment-count{font-size:11px;font-variant-numeric:tabular-nums;min-width:23px;text-align:center;border:1px solid #cdb47750;border-radius:20px;padding:2px 6px;color:var(--recruitment-gold)}
.recruitment-chevron{font-size:18px;transition:transform .24s cubic-bezier(.16,1,.3,1);color:var(--recruitment-gold)}
.recruitment[data-recruitment-open=true] .recruitment-chevron{transform:rotate(180deg)}
.recruitment-panel{min-width:0;padding:0 0 8px;animation:recruitment-unfold .24s cubic-bezier(.16,1,.3,1)}
.recruitment-list{max-height:min(18svh,152px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:2px}
.recruitment-panel.is-expanded .recruitment-list{max-height:min(54svh,440px)}
.recruitment-card{display:flex;align-items:center;gap:8px;min-width:0;min-height:64px;padding:8px 6px;border-bottom:1px solid #d3bb7a20}
.recruitment-card:last-child{border-bottom:0}
.recruitment-card.is-mine{background:#d3b87308;border-radius:8px}
.recruitment-avatar{width:34px;height:38px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:8px;background:#243644;border:1px solid #d8bd7940;color:var(--recruitment-gold)}
.recruitment-avatar img{width:100%;height:100%;object-fit:cover}.recruitment-avatar svg{max-width:100%;max-height:100%}
.recruitment-copy{flex:1;min-width:0;line-height:1.35}
.recruitment-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:650}
.recruitment-copy small{display:block;font-size:10px;color:var(--recruitment-muted);overflow-wrap:anywhere}
.recruitment-copy p{font-size:10px!important;color:#d2c6ad;margin:3px 0 0!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recruitment-copy time{font-size:9px;color:#8f9da9;margin-left:5px}
.recruitment-card-actions{flex:none;display:flex;align-items:center;gap:2px}
.recruitment-card-actions button{min-height:44px;min-width:44px;font-size:11px;border:0;border-radius:7px;background:none;color:#d9c18c;padding:5px}
.recruitment-card-actions .recruitment-join{border:1px solid #d9bb755c;background:#d9bb7511;padding:7px 11px}
.recruitment-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding-top:4px}
.recruitment-toolbar button{min-height:44px;padding:7px 10px;font-size:11px;border:0;background:none;color:var(--recruitment-muted)}
.recruitment-toolbar .recruitment-publish{color:var(--recruitment-gold);font-weight:650}
.recruitment-phrases{font-size:10px;color:var(--recruitment-muted);padding-inline:6px}.recruitment-phrases summary{min-height:44px;display:flex;align-items:center;cursor:pointer}.recruitment-phrases>div{display:flex;flex-wrap:wrap;gap:5px}.recruitment-phrases button{min-height:44px;border:1px solid #cdb47735;border-radius:7px;background:#24364466;color:var(--recruitment-muted);padding:5px 8px;font-size:10px}.recruitment-phrases button[aria-pressed=true]{border-color:var(--recruitment-gold);color:var(--recruitment-ink)}
.recruitment-empty{font-size:11px!important;line-height:1.5;color:var(--recruitment-muted);margin:10px 6px!important;text-align:center}
.recruitment-status{font-size:11px!important;line-height:1.5;color:#efbd9b;margin:4px 6px!important;overflow-wrap:anywhere}
.recruitment-status button{min-height:44px;color:var(--recruitment-gold);background:none;border:0;text-decoration:underline}
@keyframes recruitment-unfold{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:350px){.recruitment-card{gap:6px;padding-inline:2px}.recruitment-avatar{width:28px;height:34px}.recruitment-copy strong{font-size:11px}.recruitment-card-actions{flex-direction:column;gap:0}.recruitment-card-actions button{min-height:44px;font-size:10px}.recruitment-copy time{display:none}}
@media(max-height:480px){.recruitment-list{max-height:100px}.recruitment-panel.is-expanded .recruitment-list{max-height:42svh}}
@media(prefers-reduced-motion:reduce){.recruitment-panel{animation:none}.recruitment-chevron{transition:none}}
/* On illustrated preparation screens, keep the same navy paper surface as the seats. */
.party-page .recruitment,.room-page .recruitment{box-sizing:border-box;background:rgba(24,38,56,.97);border:1px solid #cdb47766;border-radius:12px;padding:0 10px;margin:10px 0 16px;box-shadow:0 2px 0 #0b1423}
.party-page .recruitment-card,.room-page .recruitment-card{background:#26374b;border:1px solid #d3bb7a30;border-radius:8px}