.capability-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 28px; }
.capability-summary > div { padding: 17px; background: var(--white); border: 1px solid var(--border); border-radius: 13px; display: flex; gap: 12px; align-items: center; }
.capability-summary svg { color: var(--violet); }
.capability-summary span { display: grid; gap: 3px; }
.capability-summary strong { font-size: 10px; }
.capability-summary small { font-size: 8px; color: #85877e; }
.capability-group { margin-bottom: 28px; }
.capability-group-title { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; }
.capability-group-title h2 { margin: 0; font-family: Georgia, serif; font-size: 20px; }
.capability-group-title span { width: 22px; height: 22px; border-radius: 50%; background: #deddd6; display: grid; place-items: center; font-size: 8px; }
.capability-list { border: 1px solid var(--border); border-radius: 15px; overflow: hidden; }
.capability-row { min-height: 88px; padding: 14px 18px; display: grid; grid-template-columns: 40px 1fr auto 38px; align-items: center; gap: 14px; background: var(--white); border-bottom: 1px solid var(--border); }
.capability-row:last-child { border-bottom: 0; }
.capability-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; background: var(--paper); color: var(--violet); }
.capability-row > div { display: grid; gap: 3px; }
.capability-row h3 { margin: 0; font-size: 11px; }
.capability-row p { margin: 0; color: #777970; font-size: 9px; }
.capability-row code { width: fit-content; padding: 3px 5px; border-radius: 5px; background: var(--paper); font-size: 7px; color: #777970; }
.capability-status { padding: 6px 8px; border-radius: 999px; font-size: 8px; font-weight: 750; }
.capability-status-installed { background: #e4f5e9; color: var(--green); }
.capability-status-preview { background: var(--violet-soft); color: var(--violet); }