*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f0f2f5;height:100vh;overflow:hidden}.layout{display:grid;grid-template-columns:300px 1fr 240px;height:100vh}.dialog-list{background:#fff;border-right:1px solid #e0e0e0;display:flex;flex-direction:column;overflow:hidden}.dialog-list__header{padding:18px 16px 12px;border-bottom:1px solid #e0e0e0}.dialog-list__header h2{font-size:18px;font-weight:600}.dialog-list__items{flex:1;overflow-y:auto}.dialog-list__empty{padding:24px 16px;color:#999;font-size:14px}.dialog-item{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;transition:background .15s;border-bottom:1px solid #f0f0f0}.dialog-item:hover{background:#f5f5f5}.dialog-item--active{background:#e8f4fd}.dialog-item__avatar{width:44px;height:44px;border-radius:50%;background:#4a90e2;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:18px}.dialog-item__info{flex:1;min-width:0}.dialog-item__top{display:flex;justify-content:space-between;margin-bottom:3px}.dialog-item__name{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dialog-item__time{font-size:11px;color:#999;flex-shrink:0}.dialog-item__bottom{display:flex;justify-content:space-between;align-items:center}.dialog-item__last{font-size:13px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}.dialog-item__badge{background:#4a90e2;color:#fff;border-radius:10px;font-size:11px;padding:2px 7px;flex-shrink:0}.chat-empty{display:flex;align-items:center;justify-content:center;background:#f0f2f5;color:#999;font-size:15px}.chat-window{display:flex;flex-direction:column;background:#f0f2f5;overflow:hidden}.chat-window__header{background:#fff;padding:12px 20px;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:8px}.chat-window__name{font-weight:600;font-size:15px}.chat-window__username{font-size:13px;color:#888}.chat-window__messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px}.message{display:flex;flex-direction:column;max-width:65%}.message--user{align-self:flex-start;align-items:flex-start}.message--support{align-self:flex-end;align-items:flex-end}.message__photos{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px}.message__photo{width:180px;height:180px;object-fit:cover;border-radius:12px;cursor:pointer;transition:opacity .15s}.message__photo:hover{opacity:.9}.message__bubble{padding:10px 14px;border-radius:18px;font-size:14px;line-height:1.5;word-break:break-word}.message--user .message__bubble{background:#fff;border-bottom-left-radius:4px}.message--support .message__bubble{background:#4a90e2;color:#fff;border-bottom-right-radius:4px}.message__time{font-size:11px;color:#999;margin-top:3px;padding:0 4px}.photo-previews{background:#fff;border-top:1px solid #e0e0e0;padding:8px 16px;display:flex;gap:8px;overflow-x:auto}.photo-preview{position:relative;flex-shrink:0}.photo-preview img{width:60px;height:60px;object-fit:cover;border-radius:8px}.photo-preview__remove{position:absolute;top:-6px;right:-6px;background:#f44;color:#fff;border:none;border-radius:50%;width:18px;height:18px;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}.chat-window__form{background:#fff;border-top:1px solid #e0e0e0;padding:10px 16px;display:flex;gap:8px;align-items:flex-end}.chat-window__attach{background:none;border:1px solid #e0e0e0;border-radius:50%;width:38px;height:38px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}.chat-window__attach:hover:not(:disabled){background:#f0f0f0}.chat-window__attach:disabled{opacity:.4;cursor:default}.chat-window__input{flex:1;border:1px solid #e0e0e0;border-radius:22px;padding:10px 16px;font-size:14px;resize:none;outline:none;font-family:inherit;line-height:1.4;max-height:120px}.chat-window__input:focus{border-color:#4a90e2}.chat-window__send{background:#4a90e2;color:#fff;border:none;border-radius:22px;padding:10px 20px;font-size:14px;cursor:pointer;transition:background .15s;white-space:nowrap}.chat-window__send:hover:not(:disabled){background:#357abd}.chat-window__send:disabled{opacity:.5;cursor:default}.user-info{background:#fff;border-left:1px solid #e0e0e0;padding:24px 16px;display:flex;flex-direction:column;align-items:center;overflow-y:auto}.user-info__avatar{width:68px;height:68px;border-radius:50%;background:#4a90e2;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:26px;margin-bottom:12px}.user-info__name{font-size:16px;font-weight:600;text-align:center}.user-info__username{font-size:13px;color:#666;margin-top:4px}.user-info__meta{width:100%;margin-top:20px;display:flex;flex-direction:column;gap:10px}.user-info__row{display:flex;flex-direction:column;gap:2px}.user-info__label{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px}.user-info__value{font-size:13px;color:#333;word-break:break-all}@media (max-width: 900px){.layout{grid-template-columns:260px 1fr}.user-info{display:none}}@media (max-width: 600px){.layout{grid-template-columns:1fr}.dialog-list{display:none}}