/* Controls rendered by makeControl(). The wrapper is .ctrl-wrapper; the
   editable element is .ctrl-field. Bare element selectors are scoped to the
   wrapper on purpose - the estate learned that bare `label` rules leak. */
.ctrl-wrapper { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; margin-bottom: var(--net-spacing-md); }
.ctrl-wrapper > label { font-size: var(--net-font-size-sm); color: var(--net-text-muted); font-weight: 600; }
.ctrl-wrapper .req { color: var(--net-color-required); }
.ctrl-wrapper .ctrl-field {
    font: inherit; color: var(--net-text-primary); background: var(--net-bg-primary);
    border: 1px solid var(--net-border-accent); border-radius: var(--net-border-radius-base);
    padding: 0.5rem 0.6rem; min-height: 40px; width: 100%;
    transition: border-color var(--net-transition-fast), box-shadow var(--net-transition-fast);
}
.ctrl-wrapper .ctrl-field:focus { outline: none; border-color: var(--net-color-primary); box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.18); }
.ctrl-wrapper .ctrl-field[readonly], .ctrl-wrapper .ctrl-field:disabled { background: var(--net-bg-accent); color: var(--net-text-muted); }
.ctrl-wrapper textarea.ctrl-field { min-height: 72px; resize: vertical; }
.ctrl-wrapper select.ctrl-field { appearance: auto; }
.ctrl-wrapper .ctrl-help { font-size: var(--net-font-size-xs); color: var(--net-text-muted); }
.ctrl-checkbox .ctrl-check { display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer; min-height: 40px; }
.ctrl-checkbox .ctrl-field { width: 1.15rem; height: 1.15rem; min-height: 0; padding: 0; accent-color: var(--net-color-primary); }
.ctrl-input.ctrl-type-number .ctrl-field { text-align: right; font-variant-numeric: tabular-nums; }

.form-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 var(--net-spacing-md); }
.form-grid > .ctrl-wrapper, .form-grid > .span-12 { grid-column: span 12; }
.form-grid > .span-6 { grid-column: span 6; }
.form-grid > .span-4 { grid-column: span 4; }
.form-grid > .span-3 { grid-column: span 3; }
.form-grid > .span-8 { grid-column: span 8; }
.form-actions { display: flex; flex-wrap: wrap; gap: var(--net-spacing-sm); align-items: center; margin: var(--net-spacing-md) 0; }
.form-status { font-size: var(--net-font-size-sm); color: var(--net-text-muted); }
.form-status.is-error { color: var(--net-alert-error-text); }
.form-status.is-ok { color: var(--net-alert-success-text); }
.field-row { display: flex; flex-wrap: wrap; gap: var(--net-spacing-sm); align-items: end; }
.field-row .ctrl-wrapper { flex: 1 1 140px; margin-bottom: var(--net-spacing-sm); }
.field-row .ctrl-wrapper.narrow { flex: 0 1 110px; }