.dui-field { display: grid; gap: .4rem; width: 100%; }
.dui-field label { font-size: .88rem; font-weight: 650; }
.dui-field input { width: 100%; min-width: 0; min-height: var(--dui-control-height); padding: .55rem .8rem; border: 1px solid var(--dui-input-line); border-radius: var(--dui-radius-small); background: var(--dui-surface); color: var(--dui-ink); }
.dui-field small { color: var(--dui-muted); font-size: .8rem; }
.dui-field input[aria-invalid="true"] { border-color: var(--dui-danger); border-width: 2px; }
.dui-field .dui-field-error { color: var(--dui-danger); }
.dui-field select, .dui-field textarea { width:100%; min-width:0; min-height:var(--dui-control-height); padding:.55rem .8rem; border:1px solid var(--dui-input-line); border-radius:var(--dui-radius-small); background:var(--dui-surface); color:var(--dui-ink); }
.dui-field input[type="date"] { appearance:none; min-height:44px; }
.dui-switch { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; min-height:44px; cursor:pointer; }
.dui-switch strong, .dui-choice strong { display:block; font-size:.875rem; }
.dui-switch small, .dui-choice small { display:block; font-size:.8rem; color:var(--dui-muted); }
.dui-switch input { appearance:none; width:44px; height:26px; min-width:44px; border:1px solid var(--dui-input-line); background:var(--dui-surface-alt); border-radius:99px; cursor:pointer; position:relative; margin:0; }
.dui-switch input::before { content:""; position:absolute; width:18px; height:18px; left:3px; top:3px; border-radius:50%; background:var(--dui-muted); transition:transform .15s; }
.dui-switch input:checked { background:var(--dui-accent); border-color:var(--dui-accent); }
.dui-switch input:checked::before { transform:translateX(18px); background:var(--dui-on-accent); }
.dui-choice { display:flex; gap:.75rem; padding:1rem; border:1px solid var(--dui-line); border-radius:var(--dui-radius); cursor:pointer; }
.dui-choice:has(input:checked) { border-color:var(--dui-accent); box-shadow:0 0 0 1px var(--dui-accent); }
input[type="checkbox"], input[type="radio"] { accent-color:var(--dui-accent); }
.dui-choice input { margin-top:.25rem; }
