/* Foundation adoption for Chat and its opt-in sheets. */
.chat-foundation.wz-system {
  --wz-text-xs: max(12px, .75rem); --wz-text-sm: max(13px, .8125rem);
  --wz-text-md: max(14px, .875rem); --wz-text-lg: max(16px, 1rem);
  --surface: var(--wz-surface); --surface-2: var(--wz-surface-subtle); --surface-sunken: var(--wz-surface-hover);
  --text: var(--wz-text); --text-muted: var(--wz-text-secondary); --text-faint: var(--wz-text-muted);
  --border: var(--wz-border); --border-strong: var(--wz-border-control);
  --brand: var(--wz-accent); --brand-strong: var(--wz-accent-hover); --brand-soft: var(--wz-accent-soft); --brand-contrast: var(--wz-on-accent);
  --danger: var(--wz-danger); --danger-soft: var(--wz-danger-soft); --success: var(--wz-success); --s-won: var(--wz-success);
  --radius-sm: var(--wz-radius-md); --radius: var(--wz-radius-lg); --radius-lg: var(--wz-radius-xl);
  --fs-2xs: var(--wz-text-xs); --fs-xs: var(--wz-text-xs); --fs-sm: var(--wz-text-sm); --fs-md: var(--wz-text-md); --fs-lg: var(--wz-text-lg); --fs-xl: var(--wz-text-xl);
  --shadow: var(--wz-shadow-float); --shadow-lg: var(--wz-shadow-float);
}
body.chat-mode .main.chat-foundation { background: var(--wz-bg); padding: var(--wz-space-4); padding-bottom: calc(var(--nav-space) + var(--wz-space-3)); }
.chat-foundation .chat { gap: 0; border: 1px solid var(--wz-border); border-radius: var(--wz-radius-lg); overflow: hidden; background: var(--wz-surface); }
.chat-foundation .chat__list, .chat-foundation .chat__thread { border: 0; border-radius: 0; }
.chat-foundation .chat__list { border-right: 1px solid var(--wz-border); }
.chat__list-heading { display: flex; align-items: center; justify-content: space-between; padding: var(--wz-space-5) var(--wz-space-4) var(--wz-space-3); gap: var(--wz-space-3); }
.chat__list-heading h2 { font-size: var(--wz-text-xl); font-weight: var(--wz-weight-semibold); letter-spacing: -.025em; }
.chat-foundation .chat__search { border: 1px solid var(--wz-border-control); border-radius: var(--wz-radius-md); margin: 0 var(--wz-space-4) var(--wz-space-4); padding: 0 var(--wz-space-3); min-height: 40px; }
.chat-foundation .chat__search:focus-within { outline: 2px solid var(--wz-focus); outline-offset: 2px; }
.chat-foundation .chat__search .input { font-size: var(--wz-text-md); min-height: 38px; box-shadow: none; outline: none; }
.chat-foundation .chat__kinds { display: flex; gap: var(--wz-space-1); padding: var(--wz-space-1); margin: 0 var(--wz-space-4) var(--wz-space-3); border-radius: var(--wz-radius-md); background: var(--wz-bg); }
.chat__kind { display: flex; align-items: center; justify-content: center; gap: var(--wz-space-2); flex: 1; min-height: 36px; padding: 0 var(--wz-space-3); border: 1px solid transparent; border-radius: var(--wz-radius-sm); background: transparent; color: var(--wz-text-secondary); font-weight: var(--wz-weight-medium); }
.chat__kind[aria-pressed='true'] { border-color: var(--wz-border); background: var(--wz-surface); color: var(--wz-text); box-shadow: var(--wz-shadow-sm); }
.chat-foundation .chat__kind-dot { margin: 0; min-width: 20px; height: 20px; background: var(--wz-accent-soft); color: var(--wz-accent); border-radius: var(--wz-radius-sm); }
.chat-foundation .chat__rows { padding: 0 var(--wz-space-2) var(--wz-space-2); overscroll-behavior: contain; scrollbar-width: thin; }
.chat-foundation .chat__row { min-height: 76px; padding: var(--wz-space-3); gap: var(--wz-space-3); border-radius: var(--wz-radius-md); }
.chat-foundation .chat__row.is-open { box-shadow: inset 3px 0 var(--wz-accent); }
.chat-foundation .chat__who b { font-size: var(--wz-text-md); font-weight: var(--wz-weight-medium); }
.chat-foundation .chat__last { font-size: var(--wz-text-sm); }
.chat-foundation .chat__row:has(.chat__badge) .chat__who b { font-weight: var(--wz-weight-semibold); color: var(--wz-text); }
.chat-foundation .chat__badge { border-radius: var(--wz-radius-sm); min-width: 22px; height: 22px; }
.chat-foundation .chat__face .avatar, .chat-foundation .chat__face--group { width: 36px; height: 36px; border-radius: var(--wz-radius-lg); }
.chat-foundation .chat__face--group { color: var(--wz-accent); background: var(--wz-accent-soft); }
.chat-foundation .chat__none { font-size: var(--wz-text-sm); line-height: var(--wz-leading-copy); padding: var(--wz-space-6) var(--wz-space-4); }
.chat-foundation .chat__head { min-height: 76px; padding: var(--wz-space-4) var(--wz-space-6); background: var(--wz-surface); }
.chat-foundation .chat__head > .grow { min-width: 0; }
.chat-foundation .chat__head b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--wz-text-md); font-weight: var(--wz-weight-semibold); }
.chat-foundation .chat__head .tiny { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-foundation .chat__scroll { padding: var(--wz-space-6); gap: 4px; background: var(--wz-surface-subtle); overscroll-behavior: contain; scrollbar-width: thin; }
.chat-foundation .chat__stack { max-width: min(82%, 580px); }
.chat-foundation .chat__bubble { font-size: var(--wz-text-lg); line-height: var(--wz-leading-body); background: var(--wz-surface); border: 1px solid var(--wz-border); padding: 10px 14px; border-radius: 8px 8px 8px 3px; }
.chat-foundation .chat__msg.is-mine .chat__bubble { background: var(--wz-accent-soft); color: var(--wz-text); border-color: transparent; border-radius: 8px 8px 3px 8px; }
.chat-foundation .chat__msg.is-last { margin-bottom: var(--wz-space-4); }
.chat-foundation .chat__meta-line { color: var(--wz-text-muted); font-size: var(--wz-text-xs); }
.chat-foundation .chat__tick.is-seen { color: var(--wz-info); }
.chat-foundation .chat__typing { background: var(--wz-surface-subtle); padding-inline: var(--wz-space-6); min-height: 24px; }
.chat-foundation .chat__tray { background: var(--wz-surface-subtle); padding-inline: var(--wz-space-6); }
.chat-foundation .chat__compose { gap: var(--wz-space-3); padding: var(--wz-space-4) var(--wz-space-6); background: var(--wz-surface); align-items: center; }
.chat-foundation .chat__field { min-height: 48px; border-radius: var(--wz-radius-lg); background: var(--wz-surface); border: 1px solid var(--wz-border-control); padding-left: var(--wz-space-3); }
.chat-foundation .chat__field:focus-within { outline: 2px solid var(--wz-focus); outline-offset: 2px; }
.chat-foundation .chat__field .input { font-size: var(--wz-text-lg); box-shadow: none; outline: none; }
.chat-foundation .chat__field-btn { width: 40px; height: 40px; border-radius: var(--wz-radius-md); color: var(--wz-text-secondary); }
.chat-foundation .chat__send { width: 48px; height: 48px; border-radius: var(--wz-radius-lg); }
.chat-foundation .chat__msg.is-mine .chat__bubble .attach { background: var(--wz-surface); color: var(--wz-text); border-color: var(--wz-border); }
.chat-foundation .chat__bubble .shot { max-width: 100%; }
.chat-foundation .chat__text--gone { opacity: 1; color: var(--wz-text-muted); }
.chat__welcome { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; padding: var(--wz-space-8); text-align: center; gap: var(--wz-space-4); background: var(--wz-surface-subtle); }
.chat__welcome-icon { display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid var(--wz-border); border-radius: var(--wz-radius-xl); background: var(--wz-surface); color: var(--wz-accent); }
.chat__welcome-icon .icon { width: 24px; height: 24px; }
.chat__welcome h2 { font-size: var(--wz-text-xl); font-weight: var(--wz-weight-semibold); letter-spacing: -.02em; }
.chat__welcome p { max-width: 330px; font-size: var(--wz-text-md); color: var(--wz-text-muted); line-height: var(--wz-leading-copy); }
/* Only chat opts its existing dialogs into these Foundation tokens. */
.chat-dialog .sheet { display: flex; flex-direction: column; overflow: hidden; position: relative; border: 1px solid var(--wz-border); border-radius: var(--wz-radius-xl); background: var(--wz-surface); box-shadow: var(--wz-shadow-float); max-height: 90dvh; }
.chat-dialog .sheet__title { flex: none; margin: 0 0 var(--wz-space-4); min-height: 32px; display: flex; align-items: center; padding-right: 48px; font-size: var(--wz-text-xl); font-weight: var(--wz-weight-semibold); }
.chat-dialog .sheet__content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.chat-dialog .sheet__grip { flex-shrink: 0; }
.chat-dialog__close { position: absolute; right: 12px; top: 12px; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: var(--wz-radius-md); background: transparent; color: var(--wz-text-secondary); }
.chat-dialog__close:hover { background: var(--wz-surface-hover); }
.chat-dialog .chat__search--sheet { margin: var(--wz-space-4) 0; }
.chat-dialog .input { border-radius: var(--wz-radius-md); font-size: var(--wz-text-lg); background: var(--wz-surface); border-color: var(--wz-border-control); }
.chat-dialog .btn { min-height: 40px; border-radius: var(--wz-radius-md); box-shadow: none; font-size: var(--wz-text-md); }
.chat-dialog .btn--danger { color: var(--wz-surface); }
.chat-dialog .action-menu__item { border-radius: var(--wz-radius-md); min-height: 56px; }
.chat-dialog .action-menu__text b { font-size: var(--wz-text-md); font-weight: var(--wz-weight-medium); }
.chat-dialog .chat__picker { max-height: 36dvh; border-radius: var(--wz-radius-lg); }
.chat-dialog .chat__pick { min-height: 44px; }
.chat-dialog .chat__member { min-height: 48px; }
.chat-dialog .chat__divider, .chat-dialog .section-title { text-transform: none; letter-spacing: 0; }
.chat__menu.chat-foundation { border: 1px solid var(--wz-border); border-radius: var(--wz-radius-lg); background: var(--wz-surface); padding: var(--wz-space-1); box-shadow: var(--wz-shadow-float); }
.chat-foundation .chat__menu-item { min-height: 40px; border-radius: var(--wz-radius-md); font-size: var(--wz-text-md); }
@media (min-width: 860px) { .chat-foundation .chat { grid-template-columns: 304px minmax(0, 1fr); } }
@media (min-width: 900px) { body.chat-mode .main.chat-foundation { padding-bottom: var(--wz-space-4); } }
@media (max-width: 859px) {
  body.chat-mode .main.chat-foundation { padding: 0 0 var(--nav-space); }
  .chat-foundation .chat { border-radius: 0; border: 0; }
  .chat-foundation .chat__list { border: 0; }
  .chat-foundation .chat__search .input { font-size: var(--wz-text-lg); }
  .chat-foundation .chat__head, .chat-foundation .chat__compose { padding: var(--wz-space-3); }
  .chat-foundation .chat__scroll { padding: var(--wz-space-4) var(--wz-space-3); }
  .chat-foundation .chat__typing, .chat-foundation .chat__tray { padding-inline: var(--wz-space-3); }
  .chat-foundation .chat__stack { max-width: 86%; }
  .chat-foundation .chat__more { width: 32px; height: 32px; }
  .chat-dialog .sheet { border-radius: var(--wz-radius-xl) var(--wz-radius-xl) 0 0; }
}
@media (pointer: coarse) { .chat__kind, .chat-dialog .btn, .chat-dialog .chat__menu-item { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .chat-foundation *, .chat-foundation *::before, .chat-foundation *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } }