.attachment-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 10px; margin: 8px 0; }
.attachment-item { min-width: 0; display: flex; align-items: center; gap: 10px; padding: 10px; background: #fafbfd; border: 1px solid #e5e9f0; border-radius: 4px; }
.attachment-main { display: flex !important; align-items: center; flex: 1; min-width: 0; gap: 12px; padding: 0 !important; color: #253448 !important; text-decoration: none; }
.attachment-main:hover .attachment-name { color: #163f78; }
.attachment-preview { position: relative; display: grid; place-items: center; flex: none; width: 48px; height: 48px; background: #edf1f6; border-radius: 3px; overflow: hidden; }
.attachment-preview img { position: absolute; inset: 0; width: 48px; height: 48px; object-fit: cover; background: #edf1f6; }
.attachment-file-icon { display: grid; place-items: end center; width: 30px; height: 36px; padding-bottom: 4px; border: 1px solid currentColor; border-radius: 2px; color: #60758d; background: #fff; font-size: 8px; font-weight: 700; letter-spacing: .2px; clip-path: polygon(0 0, 70% 0, 100% 25%, 100% 100%, 0 100%); }
.attachment-word { background: #e8effa; }.attachment-word .attachment-file-icon { color: #2d589e; }
.attachment-excel { background: #e8f4ed; }.attachment-excel .attachment-file-icon { color: #28734c; }
.attachment-pdf { background: #fbeceb; }.attachment-pdf .attachment-file-icon { color: #b63c38; }
.attachment-slides { background: #fff0e7; }.attachment-slides .attachment-file-icon { color: #b9662d; }
.attachment-archive { background: #f2edf7; }.attachment-archive .attachment-file-icon { color: #80629d; }
.attachment-name { min-width: 0; overflow-wrap: anywhere; font-size: 12px; line-height: 1.5; }
.attachment-name small { display: block; margin-top: 3px; color: #8894a4; font-size: 11px; }
.attachment-delete { flex: none; padding: 5px !important; border: 0; background: transparent; color: #a73d3d; font-size: 12px; cursor: pointer; }
.attachment-delete:disabled { opacity: .5; cursor: default; }
.attachment-confirm { width: min(420px, calc(100vw - 32px)); padding: 24px; border: 1px solid #dce3ec; border-radius: 6px; background: #fff; color: #253448; box-shadow: 0 20px 60px #0b203c40; }
.attachment-confirm::backdrop { background: #0b203c55; }
.attachment-confirm h2 { margin: 0; font-size: 18px; }
.attachment-confirm p { margin: 18px 0 24px; overflow-wrap: anywhere; font-size: 13px; line-height: 1.7; }
.attachment-confirm-actions { display: flex; gap: 10px; justify-content: flex-end; }
.attachment-confirm-actions button { padding: 7px 14px; border: 1px solid #dce3ec; border-radius: 3px; background: #fff; cursor: pointer; }
.attachment-confirm-actions [data-confirm] { background: #ae3535; color: #fff; border-color: #ae3535; }