/* Settings → AI (v3.1.179). Own classes only (.sb-ai-*); cards, switches, fields, chips and buttons
   are the site's shared ones. See HOOKS.md ("AI"). */
#screen .sb-ai{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
#screen .sb-ai .card{margin-bottom:14px}

/* Status */
#screen .sb-ai-statushead{align-items:center}
#screen .sb-ai-big{margin:14px 0 6px;font-size:20px;font-weight:750;color:#f5edff;line-height:1.3;overflow-wrap:anywhere}
#screen .sb-ai-chips{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:14px}
#screen .sb-ai-chips .cc-status{display:inline-flex;align-items:center;gap:7px;text-transform:uppercase}
#screen .sb-ai .cc-status[data-state="idle"]{color:#b7aabe}
#screen .sb-ai-save{font-size:12px;color:#9e91aa}
#screen .sb-ai-save[data-state="saving"]{color:#dcc6f5}
#screen .sb-ai-save[data-state="error"]{color:#f3a1b4}
#screen .sb-ai-keys{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px}
#screen .sb-ai-key{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#c9b8d8;min-width:0}
#screen .sb-ai-key strong{color:#f1e8fb;font-weight:650}
#screen .sb-ai-keydot{flex:none;width:8px;height:8px;border-radius:50%;background:rgba(183,170,190,.45)}
#screen .sb-ai-key[data-state="ok"] .sb-ai-keydot{background:#6fdc9c;box-shadow:0 0 6px rgba(111,220,156,.8)}
#screen .sb-ai-key[data-state="bad"] .sb-ai-keydot{background:#f3a1b4;box-shadow:0 0 6px rgba(243,161,180,.7)}
#screen .sb-ai-key[data-state="warn"] .sb-ai-keydot{background:#f0c36a}
#screen .sb-ai-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-top:16px}
#screen .sb-ai-fact{display:flex;flex-direction:column;gap:3px;min-width:0;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(200,180,230,.12)}
#screen .sb-ai-fact small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#a99bb6}
#screen .sb-ai-fact strong{font-size:14.5px;color:#f5edff;font-weight:650;overflow-wrap:anywhere}
#screen .sb-ai-warn{margin:10px 0 0;color:#f0c36a;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
#screen .sb-ai-note{margin:10px 0 0;color:#c9b8d8;font-size:13px;line-height:1.5;overflow-wrap:anywhere}

/* Rows and fields */
#screen .sb-ai-switchrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
#screen .sb-ai-switchtext{display:flex;flex-direction:column;gap:3px;min-width:0}
#screen .sb-ai-switchtext strong{font-size:15px;color:#f1e8fb;font-weight:650}
#screen .sb-ai-switchtext small,#screen .sb-ai-fieldhint{color:#b7aabe;font-size:12.5px;line-height:1.45}
#screen .sb-ai-switchrow .live-switch{margin-top:0}
#screen .sb-ai-field{margin-top:4px}
#screen .sb-ai-field .field{margin-top:12px!important}
#screen .sb-ai-field[hidden]{display:none}
#screen .sb-ai-fieldhint{display:block;margin-top:6px}
#screen .sb-ai input[type="text"],#screen .sb-ai input[type="number"],#screen .sb-ai textarea,#screen .sb-ai select{width:100%;max-width:100%;box-sizing:border-box}
#screen .sb-ai select.sb-ai-select{min-height:44px}
#screen .sb-ai textarea.sb-ai-text{min-height:96px;resize:vertical;font-size:16px;line-height:1.5}
#screen .sb-ai textarea.sb-ai-personality{min-height:300px}
#screen .sb-ai-count{display:block;margin-top:6px;text-align:right;font-size:12px;color:#9e91aa}
#screen .sb-ai-count[data-over="true"]{color:#f3a1b4}
#screen .sb-ai-sub{margin:18px 0 8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#c6a5e7}
#screen .sb-ai-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
#screen .sb-ai-actions button{flex:1 1 auto;min-height:44px}
#screen .sb-ai-small{min-height:44px!important;padding:6px 14px}
#screen .sb-ai-numrow{display:flex;align-items:center;gap:10px}
#screen .sb-ai-numrow span{color:#b7aabe;font-size:13px;white-space:nowrap}
#screen .sb-ai input.sb-ai-num{flex:none;width:96px!important;min-height:44px}

/* Segmented picker */
#screen .sb-ai-seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:6px;padding:4px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(200,180,230,.14)}
#screen .sb-ai-segbtn{min-height:44px;padding:6px 8px;border-radius:10px;border:0;background:none;color:#c9b8d8;font:inherit;font-size:13.5px;font-weight:650;cursor:pointer;box-shadow:none;line-height:1.2}
#screen .sb-ai-segbtn[aria-pressed="true"]{background:rgba(179,136,235,.24);color:#f5edff;box-shadow:inset 0 0 0 1px rgba(179,136,235,.55)}
#screen .sb-ai-segbtn:focus-visible{outline:2px solid #b388eb;outline-offset:2px}

/* Personality versions */
#screen .sb-ai-versionrow{display:flex;gap:8px;margin-top:12px;align-items:stretch}
#screen .sb-ai-versionrow input{flex:1;min-width:0}
#screen .sb-ai-versionrow button{flex:none}
#screen .sb-ai-disclose{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;margin-top:12px;padding:0;background:none;border:0;color:#dcc6f5;font:inherit;font-size:14px;font-weight:650;text-align:left;cursor:pointer;box-shadow:none;-webkit-tap-highlight-color:transparent}
#screen .sb-ai-chev{flex:none;width:8px;height:8px;border-right:2px solid #b388eb;border-bottom:2px solid #b388eb;transform:rotate(-45deg);transition:transform .2s}
#screen [aria-expanded="true"] > .sb-ai-chev{transform:rotate(45deg)}
#screen .sb-ai-version{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-top:1px solid rgba(200,180,230,.12)}
#screen .sb-ai-versiontext{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
#screen .sb-ai-versiontext strong{font-size:14.5px;color:#f1e8fb;overflow-wrap:anywhere}
#screen .sb-ai-versiontext small{font-size:12px;color:#a99bb6}
#screen .sb-ai-preview{font-size:13px;color:#c9b8d8;line-height:1.4;overflow-wrap:anywhere}
#screen .sb-ai-versionbtns{flex:none;display:flex;flex-direction:column;align-items:stretch;gap:6px}
#screen .sb-ai-linkbtn{min-height:44px;padding:0 8px;background:none;border:0;color:#dcc6f5;font:inherit;font-size:13px;cursor:pointer;box-shadow:none}
#screen .sb-ai-danger{color:#f3a1b4}

/* Channels */
#screen .sb-ai-chan{border-top:1px solid rgba(200,180,230,.12)}
#screen .sb-ai-chanhead{display:flex;align-items:center;gap:12px}
#screen .sb-ai-chantitle{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:12px 0;background:none;border:0;color:inherit;text-align:left;font:inherit;cursor:pointer;min-height:44px;box-shadow:none;-webkit-tap-highlight-color:transparent}
#screen .sb-ai-chantitle:disabled{cursor:default;opacity:1}
#screen .sb-ai-chantitle:focus-visible{outline:2px solid #b388eb;outline-offset:4px;border-radius:12px}
#screen .sb-ai-chantext{display:flex;flex-direction:column;gap:3px;min-width:0}
#screen .sb-ai-chantext strong{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:15px;color:#f5edff;font-weight:650;overflow-wrap:anywhere}
#screen .sb-ai-chantext small{font-size:12.5px;color:#b7aabe;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
#screen .sb-ai-chantitle .sb-ai-chev{margin-left:auto}
#screen .sb-ai-light{flex:none;width:10px;height:10px;border-radius:50%;background:rgba(183,170,190,.35);transition:background .25s,box-shadow .25s}
#screen .sb-ai-light[data-on="true"]{background:#6fdc9c;box-shadow:0 0 6px rgba(111,220,156,.85),0 0 14px rgba(111,220,156,.45)}
#screen .sb-ai-tag{display:inline-flex;align-items:center;padding:1px 6px;border-radius:5px;background:rgba(243,161,180,.16);color:#f3a1b4;font-size:10px;font-weight:750;letter-spacing:.05em}
#screen .sb-ai-tag[data-kind="admin"]{background:rgba(179,136,235,.2);color:#dcc6f5}
#screen .sb-ai-lock{flex:none;font-size:12px;color:#a99bb6}
#screen .sb-ai-chanbody{padding:0 0 14px}
#screen .sb-ai-chanhead .live-switch{margin-top:0}

/* Names */
#screen .sb-ai-namechips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
#screen .sb-ai-namechip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 8px 0 14px;border-radius:999px;border:1px solid rgba(179,136,235,.4);background:rgba(179,136,235,.1);color:#e3d2f7;font:inherit;font-size:14px;font-weight:600;cursor:pointer;box-shadow:none;max-width:100%}
#screen .sb-ai-namechip span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
#screen .sb-ai-x{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.06);font-size:12px}
#screen .sb-ai-addrow{display:flex;gap:8px;margin-top:12px}
#screen .sb-ai-addrow input{flex:1;min-width:0}
#screen .sb-ai-addrow button{flex:none}

/* Test box */
#screen .sb-ai-result{margin-top:14px}
#screen .sb-ai-bubble{padding:12px 14px;border-radius:14px;background:#313338;border:1px solid rgba(255,255,255,.06)}
#screen .sb-ai-bubblehead{display:flex;align-items:center;gap:6px;margin-bottom:4px}
#screen .sb-ai-bubblehead strong{color:#f2f3f5;font-size:15px;font-weight:600}
#screen .sb-ai-bubblehead .sb-ai-tag{background:#5865f2;color:#fff}
#screen .sb-ai-bubbletext{color:#dbdee1;font-size:15px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
#screen .sb-ai-meta{margin:8px 0 0;font-size:12px;color:#a99bb6;overflow-wrap:anywhere}

/* The switch is small to look at; its tap area is 44 px (design-system.css sizes #screen inputs with !important). */
#screen .sb-ai .live-switch .live-switch-input{inset:auto!important;left:-4px!important;top:-11px!important;width:46px!important;height:44px!important;min-height:44px!important;max-width:none!important;padding:0!important}