.app-shell[data-view="team-chat"] .main-shell { display:flex; flex-direction:column; height:100dvh; min-height:620px; }
.app-shell[data-view="team-chat"] .content { display:flex; flex:1; flex-direction:column; min-height:0; width:100%; padding:18px 24px 16px; }
.team-chat-page { display:flex; flex:1; flex-direction:column; min-height:0; min-width:0; }
.team-chat-page-heading { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:20px; margin-bottom:12px; }
.team-chat-page-heading .eyebrow { display:block; font-size:8px; letter-spacing:1.65px; margin-bottom:3px; }
.team-chat-page-heading h1 { font-size:22px; letter-spacing:-.7px; }
.team-chat-page-heading p { margin-top:3px; font-size:10px; }
.team-chat-layout { display:grid; grid-template-columns:280px minmax(0,1fr); flex:1; min-height:0; background:#fff; border:1px solid var(--line); border-radius:13px; overflow:hidden; box-shadow:0 4px 18px #1c355105; }
.team-chat-rooms-panel { min-height:0; display:flex; flex-direction:column; border-right:1px solid var(--line); background:#fcfdff; }
.team-chat-rooms-heading { display:flex; align-items:center; justify-content:space-between; padding:19px 20px 13px; }
.team-chat-rooms-heading h2 { font-size:13px; letter-spacing:0; }
.team-chat-rooms-heading > span { font-size:10px; color:#60728a; background:#edf1f7; padding:2px 7px; border-radius:5px; }
.team-chat-search { display:flex; align-items:center; gap:9px; margin:0 16px 13px; padding:0 11px; min-height:40px; border:1px solid #e3e8f0; border-radius:7px; background:#fff; color:#9ba8ba; }
.team-chat-search .icon { width:15px; height:15px; }
.team-chat-search input { min-width:0; width:100%; border:0; background:transparent; font-size:11px; outline:none; padding:10px 0; }
.team-chat-search:focus-within { outline:2px solid var(--accent); outline-offset:1px; }
.team-chat-search input:focus { outline:none; }
.team-chat-rooms { flex:1; overflow:auto; padding:0 8px 12px; min-height:0; }
.team-chat-room { display:flex; align-items:center; gap:11px; width:100%; min-height:72px; padding:13px 11px; text-align:left; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--ink); margin-bottom:3px; }
.team-chat-room:hover { background:#f2f5fb; }
.team-chat-room.selected { background:#edf2ff; border-color:#dae4fd; }
.team-chat-room-symbol,.team-chat-heading-symbol { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; border-radius:11px; background:#eaf0f8; color:#587594; }
.team-chat-room.selected .team-chat-room-symbol { background:#dce7ff; color:var(--accent); }
.team-chat-room-symbol .icon { width:17px; height:17px; }
.team-chat-room-copy { min-width:0; flex:1; }
.team-chat-room-copy strong { display:block; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-room-copy small { display:block; margin-top:4px; font-size:10px; color:#7b8aa0; }
.team-chat-unread { display:grid; place-items:center; flex-shrink:0; min-width:21px; height:21px; padding:0 5px; color:#fff; background:var(--accent); border-radius:7px; font-size:9px; font-weight:750; }
.team-chat-rooms-footnote { display:flex; align-items:center; gap:7px; padding:14px 18px; border-top:1px solid var(--line); font-size:9px; color:#7c8b9e; }
.team-chat-rooms-footnote .icon { width:13px; height:13px; }
.team-chat-list-empty { padding:30px 16px; font-size:12px; color:var(--muted); text-align:center; }
.team-chat-conversation { display:flex; flex-direction:column; min-height:0; min-width:0; }
.team-chat-header { display:flex; align-items:center; justify-content:space-between; gap:15px; flex-shrink:0; min-height:60px; border-bottom:1px solid var(--line); padding:10px 20px; }
.team-chat-heading-copy { display:flex; align-items:center; gap:12px; min-width:0; }
.team-chat-heading-copy > div { min-width:0; }
.team-chat-heading-copy h2 { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-heading-copy p { font-size:10px; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-chat-heading-symbol { background:#edf3ff; color:var(--accent); width:34px; height:34px; }
.team-chat-heading-actions { display:flex; align-items:center; gap:13px; flex-shrink:0; }
.team-chat-private { display:inline-flex; align-items:center; gap:5px; font-size:9px; color:#577268; background:#edf7f2; border:1px solid #e0eee6; border-radius:5px; padding:5px 7px; white-space:nowrap; }
.team-chat-private .icon { width:12px; height:12px; }
.team-chat-back { display:none; }
.team-chat-history-search { display:flex; align-items:center; gap:8px; min-height:34px; padding:0 20px; flex-shrink:0; color:#8493a8; border-bottom:1px solid #eef1f6; }
.team-chat-history-search .icon { width:14px; height:14px; }
.team-chat-history-search input { border:0; background:transparent; min-width:0; flex:1; outline:none; font-size:10px; padding:7px 0; }
.team-chat-history-search input:focus { outline:none; }
.team-chat-history-search:focus-within { box-shadow:inset 0 -2px var(--accent); }
.team-chat-history-search small { font-size:9px; color:#a3acba; }
.team-chat-messages { overflow:auto; flex:1; min-height:0; padding:14px 23px 12px; background:#f8fafd; scroll-behavior:auto; }
.team-chat-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; min-height:100%; padding:28px 20px; }
.team-chat-empty-icon { display:grid; place-items:center; width:62px; height:62px; background:#eaf0fb; color:#7b93b3; border:1px solid #e0e8f5; border-radius:20px; margin-bottom:5px; }
.team-chat-empty-icon .icon { width:28px; height:28px; }
.team-chat-empty h3 { font-size:15px; color:#4a5f7b; }
.team-chat-empty p { font-size:12px; line-height:1.9; }
.team-chat-day { display:flex; justify-content:center; margin:3px 0 12px; }
.team-chat-day span { font-size:9px; color:#8b98aa; background:#edf1f6; padding:4px 11px; border-radius:6px; }
.team-chat-message { display:flex; align-items:flex-end; gap:8px; margin:0 0 10px; max-width:85%; }
.team-chat-message.own { margin-left:auto; justify-content:flex-end; }
.team-chat-avatar { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:30px; height:30px; border-radius:10px; background:#e3eaf7; color:#567097; font-size:10px; font-weight:750; }
.team-chat-bubble { min-width:0; border:1px solid #e4eaf2; background:#fff; padding:8px 12px 9px; border-radius:11px 11px 11px 3px; box-shadow:0 2px 3px #20385302; }
.team-chat-message.own .team-chat-bubble { background:#edf2ff; border-color:#dae4f9; border-radius:11px 11px 3px 11px; }
.team-chat-message-meta { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:5px; }
.team-chat-message-meta strong { font-size:10px; color:#426181; }
.team-chat-message.own .team-chat-message-meta strong { color:#5470b2; }
.team-chat-message-meta time { font-size:9px; color:#99a4b4; flex-shrink:0; }
.team-chat-bubble > p { color:#384d67; font-size:12px; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
.team-chat-message-reference { display:flex; gap:7px; align-items:center; border:1px solid #d6e1f6; background:#f4f7fd; border-radius:5px; color:#5676a1; font-size:10px; min-height:36px; margin-top:10px; padding:7px 9px; max-width:100%; overflow-wrap:anywhere; text-align:left; }
.team-chat-message-reference .icon { width:13px; height:13px; }
.team-chat-reference-unavailable { display:block; font-size:10px; color:#8794a7; margin-top:8px; }
.team-chat-older { display:block; margin:0 auto 20px; border:1px solid #dfe6f0; border-radius:6px; background:white; color:#667d9b; padding:9px 13px; font-size:10px; min-height:40px; }
.team-chat-search-note { font-size:10px; text-align:center; margin-bottom:18px; }
.team-chat-status { color:#8b6550; font-size:10px; padding:0 21px; background:#fff; min-height:0; }
.team-chat-status:not(:empty) { padding-top:10px; padding-bottom:3px; }
.team-chat-composer { flex-shrink:0; padding:11px 16px 8px; background:#fff; border-top:1px solid var(--line); }
.team-chat-composer textarea { display:block; width:100%; min-height:54px; max-height:130px; border:1px solid #e2e8f1; border-radius:8px; background:#fcfdff; resize:vertical; padding:8px 11px; font-size:12px; color:#354e6b; }
.team-chat-composer textarea::placeholder { color:#a0aabd; }
.team-chat-composer textarea:disabled { background:#f6f8fb; }
.team-chat-recipient-review { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid #eadccb; background:#fcf7ee; border-radius:7px; margin-bottom:10px; color:#8c7048; font-size:10px; }
.team-chat-recipient-review .button { flex-shrink:0; min-height:40px; font-size:10px; }
.team-chat-composer-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:7px; }
.team-chat-composer-tools { display:flex; flex-direction:column; min-width:0; gap:2px; }
.team-chat-composer-tools > small { font-size:9px; color:#8c9aad; }
.team-chat-reference-label { display:flex; align-items:center; gap:6px; min-width:0; color:#7b8da5; }
.team-chat-reference-label .icon { width:13px; height:13px; }
.team-chat-reference-label select { border:0; background:transparent; font-size:10px; color:#667e9f; max-width:230px; min-width:0; padding:2px; min-height:22px; }
.team-chat-composer-hint { font-size:8px; color:#a1aabc; text-align:right; margin-top:3px; }
.team-chat-composer .button { min-height:40px; font-size:11px; }
.team-chat-unavailable { padding:50px 20px; text-align:center; color:var(--muted); }
#modal [data-team-chat-modal] { padding-top:4px; }
.team-chat-room-form label,.team-chat-add-member label { display:flex; flex-direction:column; gap:8px; color:#526880; font-size:12px; }
.team-chat-room-form input:not([type="checkbox"]),.team-chat-add-member select { width:100%; border:1px solid #dfe5ef; border-radius:7px; min-height:42px; padding:9px 11px; background:#fff; font-size:12px; }
.team-chat-member-picker { border:0; padding:0; margin:24px 0 10px; max-height:280px; overflow:auto; }
.team-chat-member-picker legend { font-size:12px; font-weight:700; color:#4d637e; margin-bottom:5px; }
.team-chat-member-picker > p,.team-chat-modal-note { font-size:11px; line-height:1.7; color:#8592a4; margin-bottom:10px; }
.team-chat-member-picker .team-chat-member-choice { display:flex; flex-direction:row; align-items:center; gap:10px; min-height:50px; border-bottom:1px solid #eef1f5; cursor:pointer; }
.team-chat-member-choice input { accent-color:var(--accent); width:16px; height:16px; }
.team-chat-member-choice > span:last-child { flex:1; }
.team-chat-member-roster { max-height:320px; overflow:auto; }
.team-chat-member-row { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid #eef1f5; }
.team-chat-member-row > span:nth-child(2) { flex:1; min-width:0; }
.team-chat-member-row strong { display:block; font-size:12px; color:#4c637e; }
.team-chat-member-row small { display:block; font-size:10px; color:#90a0b1; margin-top:2px; }
.team-chat-add-member { display:flex; align-items:flex-end; gap:10px; margin-top:20px; }
.team-chat-add-member > label { flex:1; min-width:0; }
.team-chat-modal-error { color:#a55043; font-size:11px; margin-top:12px; }
@media (max-width:1100px) { .team-chat-layout { grid-template-columns:235px minmax(0,1fr); } .team-chat-header { padding-inline:16px; } .team-chat-private { font-size:8px; } .team-chat-heading-actions { gap:7px; } .team-chat-message { max-width:94%; } }
@media (max-width:760px) {
  .app-shell[data-view="team-chat"] .main-shell { height:100dvh; min-height:0; }
  .app-shell[data-view="team-chat"] .content { padding:15px 12px 12px; }
  .team-chat-page-heading { margin-bottom:12px; gap:10px; }
  .team-chat-page-heading h1 { font-size:21px; }
  .team-chat-page-heading .eyebrow { font-size:8px; }
  .team-chat-page-heading p { display:none; }
  .team-chat-page-heading .button { font-size:10px; min-height:44px; padding:9px 11px; }
  .team-chat-layout { display:flex; border-radius:10px; }
  .team-chat-rooms-panel { flex:1; border:0; min-width:0; }
  .team-chat-conversation { display:none; width:100%; }
  .team-chat-page[data-mobile-open="true"] .team-chat-rooms-panel { display:none; }
  .team-chat-page[data-mobile-open="true"] .team-chat-conversation { display:flex; }
  .team-chat-header { padding:10px 12px; min-height:75px; gap:7px; }
  .team-chat-back { display:inline-flex; border:0; width:32px; min-width:32px; min-height:44px; background:transparent; }
  .team-chat-heading-copy { gap:6px; }
  .team-chat-heading-symbol { display:none; }
  .team-chat-heading-copy h2 { max-width:170px; font-size:12px; }
  .team-chat-heading-copy p { max-width:150px; font-size:9px; }
  .team-chat-heading-actions { flex-direction:column; gap:2px; align-items:flex-end; }
  .team-chat-heading-actions .icon-button { min-height:44px; height:44px; width:44px; }
  .team-chat-private { font-size:8px; padding:2px 4px; border:0; background:transparent; }
  .team-chat-private .icon { width:10px; height:10px; }
  .team-chat-history-search { min-height:44px; padding-inline:14px; }
  .team-chat-history-search small { display:none; }
  .team-chat-messages { padding:16px 12px 13px; }
  .team-chat-message { max-width:96%; gap:6px; }
  .team-chat-message > .team-chat-avatar { width:25px; height:25px; border-radius:8px; font-size:8px; }
  .team-chat-bubble { padding:9px 10px; }
  .team-chat-bubble > p { font-size:12px; }
  .team-chat-message-reference,.team-chat-older { min-height:44px; }
  .team-chat-composer { padding:11px 12px 8px; }
  .team-chat-composer textarea { min-height:65px; font-size:13px; }
  .team-chat-composer-footer { gap:7px; margin-top:7px; }
  .team-chat-reference-label select { max-width:185px; min-height:44px; padding:4px 0; font-size:9px; }
  .team-chat-composer-tools { gap:0; }
  .team-chat-composer-tools > small { font-size:8px; }
  .team-chat-composer .button { min-height:44px; min-width:44px; padding:8px 10px; }
  .team-chat-composer .button > span { display:none; }
  .team-chat-composer-hint { display:none; }
  .team-chat-recipient-review { gap:8px; padding:8px; font-size:9px; }
  .team-chat-recipient-review .button { min-height:44px; padding-inline:8px; font-size:9px; }
  .team-chat-member-choice,.team-chat-member-row { min-height:52px; }
  .team-chat-member-row .icon-button { min-width:44px; min-height:44px; }
  .team-chat-add-member { flex-wrap:wrap; }
  .team-chat-add-member > label { flex-basis:100%; }
}
