:host { display: block; }
.hb-upload__trigger--drag { border: 1px dashed var(--hb-color-border); border-radius: var(--hb-border-radius-base); padding: var(--hb-spacing-xl); text-align: center; cursor: pointer; color: var(--hb-color-text-secondary); transition: border-color 0.3s; }
.hb-upload__trigger--drag:hover, .hb-upload__trigger--dragover { border-color: var(--hb-color-primary); color: var(--hb-color-primary); }
.hb-upload__trigger--disabled { opacity: 0.5; cursor: not-allowed; }
.hb-upload__btn { padding: var(--hb-spacing-xs) var(--hb-spacing-md); border: 1px solid var(--hb-color-border); border-radius: var(--hb-border-radius-sm); background: var(--hb-color-bg); cursor: pointer; font-size: var(--hb-font-size-sm); }
.hb-upload__btn:hover { border-color: var(--hb-color-primary); color: var(--hb-color-primary); }
.hb-upload__list { list-style: none; margin: var(--hb-spacing-sm) 0 0; padding: 0; }
.hb-upload__item { display: flex; align-items: center; gap: var(--hb-spacing-xs); padding: var(--hb-spacing-xs) 0; font-size: var(--hb-font-size-sm); border-bottom: 1px solid var(--hb-color-border-secondary); }
.hb-upload__item-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-upload__item-size { color: var(--hb-color-text-secondary); font-size: var(--hb-font-size-xs); }
.hb-upload__item-status { font-size: 12px; }
.hb-upload__item--success .hb-upload__item-status { color: var(--hb-color-success); }
.hb-upload__item--error .hb-upload__item-status { color: var(--hb-color-danger); }
.hb-upload__item-remove { cursor: pointer; color: var(--hb-color-text-secondary); font-size: 16px; }
.hb-upload__item-remove:hover { color: var(--hb-color-danger); }
.hb-upload__item-progress { font-size: var(--hb-font-size-xs); color: var(--hb-color-primary); min-width: 34px; text-align: right; }
