.button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 46px; padding: .72rem 1.05rem; color: white; background: var(--brand); border: 1px solid var(--brand); border-radius: 11px; font-weight: 750; text-decoration: none; cursor: pointer; }
.button:hover { color: white; background: var(--brand-dark); border-color: var(--brand-dark); }
.button-secondary { color: var(--ink); background: white; border-color: var(--line); }
.button-secondary:hover { color: var(--brand-dark); background: var(--soft); border-color: #c8bff5; }
.button-danger { color: var(--danger); background: white; border-color: #f3c5c1; }
.button-danger:hover { color: white; background: var(--danger); border-color: var(--danger); }
.button-small { min-height: 38px; padding: .5rem .8rem; font-size: .88rem; }
.button:disabled { opacity: .5; cursor: not-allowed; }
.field { display: grid; gap: .4rem; }
.field label, .field-label { font-size: .9rem; font-weight: 750; }
.input, .textarea, .select { width: 100%; color: var(--ink); background: white; border: 1px solid var(--line); border-radius: 11px; outline: none; }
.input, .select { min-height: 46px; padding: .65rem .8rem; }
.textarea { min-height: 170px; padding: .85rem; resize: vertical; line-height: 1.65; }
.input:focus, .textarea:focus, .select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(102,87,232,.12); }
.help { color: var(--muted); font-size: .82rem; }
.status { min-height: 1.5em; color: var(--muted); font-size: .87rem; }
.status.error { color: var(--danger); }
.status.success { color: #08765f; }
.chip { display: inline-flex; align-items: center; padding: .28rem .6rem; color: var(--brand-dark); background: #eeebff; border-radius: 999px; font-size: .76rem; font-weight: 750; }
.segmented { display: flex; flex-wrap: wrap; gap: .5rem; }
.segmented label { cursor: pointer; }
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented span { display: block; padding: .52rem .72rem; border: 1px solid var(--line); border-radius: 9px; font-size: .86rem; font-weight: 650; }
.segmented input:checked + span { color: var(--brand-dark); background: #eeebff; border-color: #bcb2f8; }
.range-row { display: grid; grid-template-columns: 1fr 70px; gap: .75rem; align-items: center; }
.dropzone { position: relative; display: grid; place-items: center; min-height: 160px; padding: 1.5rem; text-align: center; color: var(--muted); background: #fbfcfe; border: 2px dashed #cfd7e2; border-radius: 15px; transition: .2s; }
.dropzone.dragover { color: var(--brand-dark); background: #f0edff; border-color: var(--brand); }
.dropzone input[type=file] { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.file-list { display: grid; gap: .65rem; margin-top: 1rem; }
.file-item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .7rem; background: white; border: 1px solid var(--line); border-radius: 10px; }
.file-item-main { min-width: 0; display: flex; align-items: center; gap: .7rem; }
.thumb { width: 54px; height: 42px; object-fit: cover; border-radius: 6px; background: var(--soft); }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.actions { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; }
.two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 650px) { .two-col { grid-template-columns: 1fr; } }