#lobby h2 { font-size:clamp(22px,4.5vw,28px); }
#lobbyCode {
  font-family:var(--font-head);
  font-size:clamp(32px,8vw,46px); font-weight:700; letter-spacing:12px; text-indent:12px;
  color:var(--gold);
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:3px dashed #ffc53d66; border-radius:var(--r-lg);
  padding:12px 30px; margin:var(--s3) 0;
  box-shadow:0 6px 0 rgba(0,0,0,.32), inset 0 2px 0 rgba(255,255,255,.08);
  font-variant-numeric:tabular-nums;
}
.plist { display:flex; gap:var(--s4); margin:var(--s4) 0 var(--s5); flex-wrap:wrap; justify-content:center; }

/* Mỗi ghế mang màu của nhân vật ngồi ở đó — trùng với màu vẽ trên canvas */
.pslot {
  width:132px; padding:16px 8px; text-align:center;
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:2px solid var(--line); border-radius:var(--r-lg);
  box-shadow:0 6px 0 rgba(0,0,0,.3), inset 0 2px 0 rgba(255,255,255,.08);
  transition:transform .18s ease;
}
.pslot:nth-child(1) { border-color:var(--p1); }
.pslot:nth-child(2) { border-color:var(--p2); }
.pslot:nth-child(3) { border-color:var(--p3); }
.pslot:nth-child(4) { border-color:var(--p4); }
.pslot .face { font-size:40px; line-height:1.1; }
.pslot .pname { font-family:var(--font-head); font-weight:700; margin-top:var(--s2); font-size:14px; }
.pslot.empty {
  opacity:.4; border-style:dashed; border-color:var(--line) !important;
  box-shadow:none; transform:scale(.95);
}