.attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px;max-width:min(420px,100%)}
.attachment-image{position:relative;width:154px;height:112px;overflow:hidden;padding:0;border:1px solid rgb(127 127 140 / .22);border-radius:10px;background:rgb(127 127 140 / .14);color:inherit;text-align:left}.attachment-image img{display:block;width:100%;height:100%;object-fit:cover}.attachment-image-placeholder{display:grid;place-items:center;width:100%;height:100%;color:inherit;font-size:11px;opacity:.75}.attachment-image-name{position:absolute;right:0;bottom:0;left:0;overflow:hidden;padding:20px 8px 7px;background:linear-gradient(transparent,rgb(0 0 0 / .7));color:#fff;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.attachment-image:hover{filter:brightness(1.08)}
.attachment-file{display:flex;align-items:center;gap:8px;max-width:260px;padding:9px 10px;border:1px solid rgb(127 127 140 / .24);border-radius:9px;background:rgb(127 127 140 / .10);color:inherit;text-align:left}.attachment-file:hover{background:rgb(127 127 140 / .19)}.attachment-file-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:rgb(127 127 140 / .22);font-size:17px}.attachment-file-copy{min-width:0;display:grid;gap:1px}.attachment-file-copy b{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.attachment-file-copy small{color:inherit;font-size:10px;opacity:.67}.attachment-download-label{margin-left:auto;font-size:10px;opacity:.72}
.attachment-preview-dialog{width:min(940px,calc(100vw - 28px));height:min(780px,calc(100dvh - 28px));padding:0;border:0;border-radius:13px;background:#151519;color:#eee;box-shadow:0 28px 90px rgb(0 0 0 / .55)}.attachment-preview-dialog::backdrop{background:rgb(0 0 0 / .74);backdrop-filter:blur(3px)}.attachment-preview-dialog>img{display:block;width:100%;height:calc(100% - 52px);object-fit:contain}.attachment-preview-bar{display:flex;align-items:center;gap:8px;height:52px;padding:0 12px;border-bottom:1px solid #38383d}.attachment-preview-bar strong{min-width:0;flex:1;overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.attachment-preview-bar button{min-height:32px;padding:0 10px;border:0;border-radius:7px;background:#303036;color:#f0f0f3;font:inherit;font-size:11px}.attachment-preview-bar button:hover{background:#45454d}.attachment-preview-bar [data-preview-close]{width:32px;padding:0;font-size:20px}
.composer-attachments{display:flex;flex-wrap:wrap;gap:6px;padding:0 2px 8px}.composer-attachment{display:flex;align-items:center;gap:6px;max-width:100%;padding:5px 5px 5px 8px;border:1px solid rgb(127 127 140 / .24);border-radius:7px;background:rgb(127 127 140 / .12);font-size:10px}.composer-attachment>span{display:grid;min-width:0}.composer-attachment>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-attachment small{margin-top:1px;opacity:.65}.composer-attachment button{width:22px;height:22px;padding:0;border:0;border-radius:5px;background:transparent;color:inherit;font-size:17px;line-height:1}.composer-attachment button:hover{background:rgb(127 127 140 / .25)}.composer-attachment.has-error{border-color:#d96e6e;color:#d96e6e}.attachment-uploading{align-self:center;font-size:10px;opacity:.7}.attachment-picker{display:inline-grid;place-items:center;width:31px;height:31px;padding:0;border:0;border-radius:8px;background:transparent;color:inherit;font-size:21px;line-height:1}.attachment-picker:hover{background:rgb(127 127 140 / .18)}.is-dragging-files{outline:2px dashed currentColor;outline-offset:-3px}
@media(max-width:520px){.attachment-image{width:132px;height:96px}.attachment-preview-dialog{width:100vw;height:100dvh;border-radius:0}}