.attachment{--attachment-media-size:var(--space-48);--attachment-card-min:var(--space-160);--attachment-thumb-size:var(--space-80);--attachment-icon-size:var(--space-32);--attachment-gap:var(--space-12);--attachment-padding:var(--space-12);--attachment-radius:var(--radius-16);--attachment-media-radius:var(--radius-12);border:var(--stroke-components) solid transparent;border-radius:var(--attachment-radius);background-color:var(--neutral-surface-support);min-width:0;color:var(--neutral-content-main-titles);transition:background-color var(--speed-medium) var(--ease-linear), border-color var(--speed-medium) var(--ease-linear);position:relative}.attachment-layout-row{align-items:center;gap:var(--attachment-gap);padding:var(--attachment-padding);grid-template-columns:auto minmax(0,1fr) auto;display:grid}.attachment-layout-row .attachment-media{width:var(--attachment-media-size);height:var(--attachment-media-size)}.attachment-layout-card{gap:var(--attachment-gap);padding:var(--attachment-padding);flex-direction:column;display:flex}.attachment-layout-card .attachment-media{aspect-ratio:1;width:100%}.attachment-layout-thumb{width:var(--attachment-thumb-size);border-radius:var(--attachment-media-radius);background-color:#0000;padding:0;display:block}.attachment-layout-thumb .attachment-media{aspect-ratio:1;border-radius:inherit;width:100%;display:flex}.attachment-media{border-radius:var(--attachment-media-radius);background-color:var(--neutral-surface-background);--color-surface-icon-fill-primary:var(--neutral-surface-icons);color:var(--neutral-surface-icons);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden}.attachment-preview{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.attachment-placeholder{width:100%;height:100%}.attachment-media-icon{height:var(--attachment-icon-size);justify-content:center;align-items:center;display:inline-flex}.attachment-media-icon>svg{width:auto;height:100%;display:block}.attachment-layout-card .attachment-media-icon{height:40%}.attachment-layout-thumb .attachment-media-icon{height:56%}.attachment-sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.attachment-media-loading{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.attachment-layout-row[data-status=uploading] .attachment-preview,.attachment-layout-row[data-status=uploading] .attachment-media-icon{display:none}.attachment-layout-card[data-status=uploading] .attachment-preview,.attachment-layout-card[data-status=uploading] .attachment-placeholder,.attachment-layout-card[data-status=uploading] .attachment-media-icon{opacity:.32}.attachment-body{gap:var(--space-4);flex-direction:column;min-width:0;display:flex}.attachment-name{color:var(--neutral-content-main-titles);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.attachment-meta{color:var(--neutral-content-support);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.attachment-progress{height:var(--space-4);margin-top:var(--space-2);border-radius:var(--radius-full);background-color:var(--neutral-surface-background);position:relative;overflow:hidden}.attachment-progress-bar{border-radius:var(--radius-full);background-color:var(--color-surface-primary);position:absolute;inset-block:0;inset-inline-start:0}.attachment-remove{flex-shrink:0}.attachment-layout-card .attachment-remove,.attachment-layout-thumb .attachment-remove{top:var(--attachment-padding);opacity:0;transition:opacity var(--speed-fast) var(--ease-linear);position:absolute;inset-inline-end:var(--attachment-padding)}.attachment-layout-thumb .attachment-remove{top:var(--space-4);inset-inline-end:var(--space-4)}.attachment-layout-card:hover .attachment-remove,.attachment-layout-card:focus-within .attachment-remove,.attachment-layout-thumb:hover .attachment-remove,.attachment-layout-thumb:focus-within .attachment-remove{opacity:1}@media (hover:none){.attachment-layout-card .attachment-remove,.attachment-layout-thumb .attachment-remove{opacity:1}}.attachment[data-status=error]{border-color:var(--color-border-error);background-color:var(--color-surface-error-light)}.attachment[data-status=error] .attachment-meta{color:var(--color-content-error)}.attachment[data-disabled=true]{background-color:var(--neutral-surface-disabled)}.attachment[data-disabled=true] .attachment-name,.attachment[data-disabled=true] .attachment-meta{color:var(--neutral-content-disabled)}.attachment[data-disabled=true] .attachment-media{color:var(--neutral-surface-disabled-icon);--color-surface-icon-fill-primary:var(--neutral-surface-disabled-icon)}.attachment[data-disabled=true] .attachment-media-icon{filter:grayscale();opacity:.56}.attachment-size-l{--attachment-media-size:var(--space-64);--attachment-card-min:var(--space-192);--attachment-thumb-size:var(--space-96);--attachment-icon-size:var(--space-40);--attachment-gap:var(--space-16);--attachment-padding:var(--space-16);--attachment-radius:var(--radius-20);--attachment-media-radius:var(--radius-16)}.attachment-size-m{--attachment-media-size:var(--space-48);--attachment-card-min:var(--space-160);--attachment-thumb-size:var(--space-80);--attachment-icon-size:var(--space-32);--attachment-gap:var(--space-12);--attachment-padding:var(--space-12);--attachment-radius:var(--radius-16);--attachment-media-radius:var(--radius-12)}.attachment-size-s{--attachment-media-size:var(--space-40);--attachment-card-min:var(--space-128);--attachment-thumb-size:var(--space-64);--attachment-icon-size:var(--space-24);--attachment-gap:var(--space-8);--attachment-padding:var(--space-8);--attachment-radius:var(--radius-12);--attachment-media-radius:var(--radius-8)}.attachment-list{--attachment-card-min:var(--space-160);gap:var(--space-16);flex-direction:column;width:100%;min-width:0;display:flex}.attachment-list-grid{grid-template-columns:repeat(auto-fill, minmax(var(--attachment-card-min), 1fr));gap:var(--space-16);margin:0;padding:0;list-style:none;display:grid}.attachment-list-strip{gap:var(--space-8);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.attachment-list-stack{gap:var(--space-12);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.attachment-list-item{min-width:0;display:flex}.attachment-list-item>.attachment:not(.attachment-layout-thumb){width:100%}
.uploader{width:100%}.uploader-control{gap:var(--space-16);flex-direction:column;width:100%;min-width:0;display:flex}.uploader-dropzone{justify-content:center;align-items:center;gap:var(--space-24);text-align:center;cursor:pointer;border:none;border-color:var(--neutral-border-components);border:var(--stroke-components) dashed var(--neutral-border-components);width:100%;min-height:200px;transition:background-color var(--speed-medium) var(--ease-linear), border-color var(--speed-medium) var(--ease-linear), box-shadow var(--speed-medium) var(--ease-linear);outline:none;flex-direction:column;display:flex}.uploader-dropzone:hover{border-color:var(--neutral-border-active)}.uploader-dropzone[data-dragging=true]{border-color:var(--color-surface-primary);background-color:var(--color-surface-primary);box-shadow:var(--shadow-bottom-xs)}.uploader-dropzone[data-disabled=true]{cursor:not-allowed;border-color:var(--neutral-border-disabled);background-color:var(--neutral-surface-disabled);box-shadow:none}.uploader-dropzone:focus-visible{border-color:var(--neutral-border-active);box-shadow:var(--shadow-focus);outline:none}.uploader-dropzone:focus-within{box-shadow:none;outline:none}.uploader-dropzone-icon{width:var(--space-24);height:var(--space-24);--color-surface-icon-fill-primary:var(--neutral-surface-icons);color:var(--neutral-surface-icons);justify-content:center;align-items:center;display:inline-flex}.uploader-dropzone-icon>svg,.uploader-dropzone-icon>img{width:100%;height:100%}.uploader-dropzone-text{gap:var(--space-8);color:var(--neutral-content-support);flex-direction:column;display:flex}.uploader-dropzone-title{color:var(--neutral-content-main-titles);font-family:var(--font-sans);font-size:var(--size-title6);line-height:var(--line-title6);letter-spacing:var(--spacing-title6)}.uploader-dropzone-action{color:var(--color-surface-primary);font-family:var(--font-sans);font-size:var(--size-label);line-height:var(--line-label);letter-spacing:var(--spacing-label);text-underline-offset:var(--space-2);text-decoration:underline}.uploader-dropzone-helper{color:var(--neutral-content-placeholder);font-family:var(--font-sans);font-size:var(--size-caption);line-height:var(--line-caption);letter-spacing:var(--spacing-caption)}