.capability-card { border:1px solid var(--line,#d6dcd4); border-radius:14px; padding:20px; background:var(--surface,#fff); margin:0; }
.capability-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.capability-heading h3 { margin:0; font-size:1.05rem; }
.ai-capabilities .capability-toggle { display:flex; align-items:center; gap:6px; margin:0; white-space:nowrap; }
.ai-capabilities .capability-toggle input { width:auto; margin:0; }
.capability-description,.capability-notice,.capability-card small { color:var(--muted,#656f67); font-size:.9rem; }
.capability-state { font-size:.85rem; font-weight:600; }
.capability-card label:not(.capability-toggle) { display:block; margin:12px 0; }
.capability-card input[type=number] { display:block; width:100%; box-sizing:border-box; margin:6px 0; padding:9px; border:1px solid var(--line,#d6dcd4); border-radius:8px; background:var(--surface,#fff); color:inherit; }
.capability-card small { display:block; }
.capability-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.capability-message { font-size:.9rem; min-height:1.3em; }
.capability-card input:not([type=checkbox]),.capability-card textarea,.capability-card select { width:100%; box-sizing:border-box; padding:10px; margin-top:6px; border:1px solid var(--line,#d6dcd4); border-radius:8px; font:inherit; background:var(--surface,#fff); color:inherit; }
.capability-card fieldset { border:1px solid var(--line,#d6dcd4); border-radius:8px; display:flex; flex-wrap:wrap; gap:14px; }
.capability-card fieldset label { display:flex !important; align-items:center; gap:6px; }
.capability-card fieldset input { width:auto; }
.ai-settings-page section { margin-top:24px; scroll-margin-top:24px; }
.chat-settings-page { height:auto; min-height:100vh; overflow:auto; }
.chat-settings-page .ai-settings-page { max-width:1250px; margin:0 auto; padding:32px 24px 80px; }
.chat-settings-page h1 { font-size:1.8rem; }
.chat-settings-page .capability-actions { gap:16px; }
.ai-capabilities .capability-toggle,.capability-card fieldset label { flex-direction:row; }
.template-source { margin-top:24px; padding-top:18px; border-top:1px solid var(--line,#d6dcd4); }
.template-source small { margin:12px 0; }
.template-source button { margin:10px 6px 0 0; }
.capability-table-wrap { overflow:auto; border:1px solid var(--line,#d6dcd4); border-radius:10px; }
.capability-table { width:100%; min-width:660px; border-collapse:collapse; font-size:13px; text-align:left; }
.capability-table th,.capability-table td { padding:9px 12px; border-bottom:1px solid var(--line,#d6dcd4); vertical-align:middle; }
.capability-table th { font-size:12px; font-weight:600; color:var(--muted,#656f67); background:var(--background,#f6f7fa); }
.capability-table tr:last-child td { border-bottom:0; }
.capability-table td:first-child { min-width:140px; max-width:220px; }
.capability-table td:last-child { white-space:nowrap; width:1%; }
.capability-table td:last-child button { font-size:12px; padding:5px 9px; margin:2px; }
.capability-table .capability-summary { font-size:12px; line-height:1.5; }
.capability-summary small,.capability-summary a { display:block; color:var(--muted,#656f67); overflow-wrap:anywhere; }
.capability-purpose { max-width:300px; font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.capability-excerpt { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.capability-badge { display:inline-block; border-radius:20px; padding:2px 8px; font-size:11px; background:var(--background,#f2f3f5); color:var(--muted,#656f67); white-space:nowrap; }
.capability-badge.is-enabled { background:#e9f4ed; color:#286140; }
.capability-toolbar { display:flex; align-items:center; gap:16px; justify-content:space-between; margin:0 0 12px; }
.capability-toolbar p { margin:0; }
.capability-toolbar button { flex-shrink:0; font-size:13px; }
.ai-capabilities>p,.capability-toolbar p { font-size:13px; }
.ai-capabilities>[role=status]:empty { display:none; }
dialog.capability-dialog { box-sizing:border-box; width:min(720px,calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 40px); overflow:auto; border:1px solid var(--line,#d6dcd4); border-radius:16px; padding:22px; background:var(--surface,#fff); color:var(--ink,#262e27); box-shadow:0 24px 90px #0003; }
dialog.capability-dialog:not([open]) { display:none; }
.capability-dialog::backdrop { background:#18202a66; }
.capability-dialog .capability-card { padding:0; border:0; border-radius:0; box-shadow:none; }
.capability-dialog .capability-card>h3 { margin:5px 90px 20px 0; font-size:1.15rem; }
.capability-dialog-close { float:right; font-size:12px; padding:5px 9px; margin:0 0 10px 12px; }
.capability-dialog .capability-heading { clear:both; }
.capability-preview { clear:both; }
.capability-preview img { display:block; width:100%; height:auto; background:white; border:1px solid var(--line,#ddd); }
.capability-preview-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin:12px 0; }
.capability-preview-note { font-size:13px; color:var(--muted,#656f67); }
@media(max-width:650px) { .capability-toolbar { align-items:flex-start; flex-direction:column; gap:8px; } .chat-settings-page .ai-settings-page { padding:20px 12px 40px; } dialog.capability-dialog { padding:16px; } }
