/* 연락방 (부장 B): 1:1 메시지 말풍선·출근 확인 카드. 색은 theme의 변수만 쓴다 */
.chat{padding:8px 12px 96px;display:flex;flex-direction:column;gap:3px}
.chat-day{align-self:center;margin:12px 0 6px;font-size:12px;color:var(--label-2)}
.chat-empty{padding:48px 24px;text-align:center;color:var(--label-2);font-size:15px}
.bub-row{display:flex;align-items:flex-end;gap:6px;max-width:100%}
.bub-row.me{flex-direction:row-reverse}
.bub{max-width:76%;padding:8px 12px;border-radius:18px;background:var(--cell);font-size:16px;line-height:1.35;overflow-wrap:anywhere}
.bub-row.me .bub{background:var(--primary);color:var(--on-primary)} /* 부장 11-09: 밝은 화면에서 남색 위 남색 글자로 안 보이던 것 — 짝 변수로(밝게 흰 글자·어둡게 남색 글자) */
.bub-t{font-size:11px;color:var(--label-2);padding-bottom:2px}
.chat-bar{display:flex;align-items:flex-end;gap:8px}
.chat-in{flex:1;min-height:40px;max-height:120px;padding:9px 14px;border:0;border-radius:20px;background:var(--cell);font:inherit;font-size:16px;resize:none;color:var(--label)}
.chat-in::placeholder{color:var(--label-2)}
.chat-send{width:auto;min-width:64px;height:40px;padding:0 16px}
.cf{margin:0 16px 10px;padding:14px 16px;border-radius:14px;background:var(--cell)}
.cf-t{display:flex;flex-direction:column;gap:2px}
.cf-t b{font-size:16px;font-weight:600}
.cf-s{font-size:13px;color:var(--label-2)}
.cf-a{display:flex;gap:8px;margin-top:12px}
.cf-a .btn{flex:1;height:40px}

/* 연락방 사진 보내기(38절): 고르기 버튼·미리보기 줄·말풍선 속 썸네일 */
.chat-col{display:block}
.ph-strip{display:flex;gap:8px;margin-bottom:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.ph-strip:empty{display:none}
.ph-it{position:relative;flex:none;width:56px;height:56px;border-radius:10px;overflow:hidden;background:var(--cell)}
.ph-it img{display:block;width:100%;height:100%;object-fit:cover}
.ph-x{position:absolute;top:2px;right:2px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center}
.ph-x::before{content:"";position:absolute;inset:-10px}
.ph-x svg{width:12px;height:12px;stroke:var(--white);stroke-width:2.4}
.ph-plus{flex:none;position:relative;width:40px;height:40px;border-radius:50%;background:var(--cell);display:grid;place-items:center;color:var(--label)}
.ph-plus svg{width:20px;height:20px}
.ph-plus::before{content:"";position:absolute;inset:-2px}
.bub.ph{padding:4px;display:flex;flex-wrap:wrap;gap:4px;max-width:236px}
.bub-img{display:block;width:114px;height:114px;border-radius:14px;object-fit:cover;background:var(--cell);border:0;padding:0}
.bub-img.one{width:228px;height:auto;max-height:260px}
.bub-gone{padding:8px 12px;border-radius:18px;background:var(--cell);color:var(--label-2);font-size:14px;line-height:1.35}