.capability-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.capability-grid label { display: flex; flex-direction: column; gap: 8px; font-weight: 600; color: #102b43; min-width: 0; }
.capability-grid input, .capability-grid textarea { width: 100%; box-sizing: border-box; font: inherit; color: #223541; background: #fff; border: 1px solid #78928b; border-radius: 4px; padding: 12px; min-height: 44px; }
.capability-grid textarea { min-height: 112px; resize: vertical; }
.capability-grid .capability-wide { grid-column: 1 / -1; }
.capability-consent { display: flex; gap: 10px; align-items: flex-start; margin: 20px 0; color: #223541; }
.capability-consent input { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 2px; }
.capability-preview { margin-top: 24px; border-top: 3px solid #b88b38; padding: 20px 0; color: #223541; overflow-wrap: anywhere; }
.capability-preview h3 { font-size: 24px; }
.capability-preview h4 { font-size: 17px; margin: 20px 0 8px; }
.capability-builder .actions { flex-wrap: wrap; }
.capability-builder button:disabled { opacity: .65; cursor: not-allowed; }
.capability-builder :focus-visible { outline: 3px solid #125c77; outline-offset: 3px; }
#capabilityStatus { color: #223541; margin: 16px 0; }
.capability-builder [hidden] { display: none !important; }
@media (max-width: 700px) { .capability-grid { grid-template-columns: minmax(0, 1fr); } .capability-builder .btn { min-height: 44px; white-space: normal; } }
