/* ============================================================
   CHAT  —  AI control center (mock UI)
   ============================================================ */
.chat-page{display:flex;flex-direction:column;height:100%}
.chat-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}
.chat-header__left{display:flex;flex-direction:column;gap:4px;min-width:0}
.chat-title{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--text-primary);letter-spacing:-.02em;line-height:1.2}
.chat-subtitle{font-size:var(--text-base);font-weight:var(--weight-regular);color:var(--text-secondary);line-height:1.4}
.chat-header__actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.chat-hbtn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 var(--space-4);border-radius:8px;font-size:var(--text-base);font-weight:var(--weight-semibold);cursor:pointer;white-space:nowrap;border:1px solid transparent;
  transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-hbtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-hbtn--ghost{background:var(--surface);border-color:var(--border);color:var(--text-secondary)}
.chat-hbtn--ghost:hover{background:var(--surface-2);border-color:var(--border-hi);color:var(--text-primary)}
.chat-hbtn--primary{background:var(--brand);border-color:var(--brand);color:#fff}
.chat-hbtn--primary:hover{filter:brightness(.95)}

.chat-workspace{display:grid;grid-template-columns:280px 1fr;gap:var(--space-5);align-items:stretch;flex:1 1 auto;min-height:480px;position:relative}
.chat-workspace--with-panel{grid-template-columns:280px 1fr 420px}
.chat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;overflow:hidden;min-height:0}

/* LEFT — conversation sidebar */
.chat-sidebar{padding:var(--space-4);gap:var(--space-3)}
.chat-side-search{position:relative}
.chat-side-search__icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);display:flex;color:var(--text-muted);pointer-events:none}
.chat-side-search__icon svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-side-search__input{width:100%;height:36px;padding:0 var(--space-3) 0 var(--space-7);background:var(--surface-0);border:1px solid var(--border);border-radius:8px;font-size:var(--text-sm);color:var(--text-primary)}
.chat-side-search__input::placeholder{color:var(--text-muted)}
.chat-side-search__input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-muted)}
.chat-newchat{display:flex;align-items:center;justify-content:center;gap:6px;height:38px;background:var(--brand);color:#fff;border-radius:8px;font-size:var(--text-sm);font-weight:var(--weight-semibold);cursor:pointer;transition:filter var(--duration-fast) var(--ease)}
.chat-newchat:hover{filter:brightness(.95)}
.chat-newchat svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-side-label{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}
.chat-side-label-row{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-1)}
.chat-clearall{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);background:transparent;border:none;cursor:pointer;padding:0}
.chat-clearall:hover{color:var(--error,#ff3d6b);text-decoration:underline}
.chat-convos{display:flex;flex-direction:column;gap:4px;overflow-y:auto;flex:1;min-height:0;margin:0 calc(var(--space-2) * -1)}
.chat-convo{position:relative;display:flex;align-items:flex-start;gap:var(--space-2);padding:var(--space-2);padding-right:var(--space-2);border-radius:10px;cursor:pointer;transition:background var(--duration-fast) var(--ease)}
.chat-convo:hover{background:var(--surface-2)}
.chat-convo__del{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity var(--duration-fast) var(--ease),background var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-convo:hover .chat-convo__del,.chat-convo--active .chat-convo__del,.chat-convo:focus-within .chat-convo__del{opacity:1}
.chat-convo__del:hover{background:var(--error-bg,rgba(255,61,107,.12));color:var(--error,#ff3d6b)}
.chat-convo__del svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-convo__edit{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity var(--duration-fast) var(--ease),background var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-convo:hover .chat-convo__edit,.chat-convo--active .chat-convo__edit,.chat-convo:focus-within .chat-convo__edit{opacity:1}
.chat-convo__edit:hover{background:var(--brand-muted);color:var(--brand)}
.chat-convo__edit svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-convo__rename-input{width:100%;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);background:var(--surface-0);border:1px solid var(--brand);border-radius:var(--radius-sm);padding:2px 6px;outline:none}
.chat-convo--active{background:var(--info-bg)}
.chat-convo__icon{width:28px;height:28px;min-width:28px;border-radius:var(--radius-md);background:var(--info-bg);color:var(--info);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-convo--active .chat-convo__icon{background:var(--info);color:#fff}
.chat-convo__icon svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-convo__body{min-width:0;flex:1}
.chat-convo__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-convo__sub{font-size:var(--text-xs);color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.chat-convo__time{font-size:11px;color:var(--text-muted);margin-top:2px}
.chat-modes{display:flex;flex-wrap:wrap;gap:6px;padding-top:var(--space-3);border-top:1px solid var(--border)}
.chat-mode{display:inline-flex;align-items:center;height:28px;padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-mode:hover{background:var(--brand-muted);border-color:var(--brand);color:var(--brand)}

/* CENTER — chat workspace */
.chat-center{min-width:0}
.chat-chead{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-2);min-height:60px;padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--border)}
.chat-chead__main{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.chat-chead__avatar{width:34px;height:34px;min-width:34px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--info),var(--purple));color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-chead__avatar svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-chead__info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.chat-chead__title{font-size:var(--text-md);font-weight:var(--weight-semibold);color:var(--text-primary);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-chead__status{display:flex;align-items:center;gap:5px;font-size:var(--text-xs);color:var(--success);line-height:1}
.chat-chead__status::before{content:'';width:6px;height:6px;border-radius:var(--radius-full);background:var(--success)}
.chat-chead__selects{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.chat-select{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 var(--space-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;white-space:nowrap}
.chat-select svg{width:11px;height:11px;stroke:var(--text-muted);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-chead__project-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted)}
.chat-chead__project-select{height:28px;padding:0 var(--space-2);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-0);color:var(--text-primary);font-size:var(--text-xs);font-weight:var(--weight-medium);cursor:pointer;max-width:180px}

.chat-msgs{flex:1;overflow-y:auto;padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);min-height:0}
.chat-msg{display:flex;gap:var(--space-3);max-width:88%}
.chat-msg--user{align-self:flex-end;flex-direction:row-reverse}
.chat-msg__av{width:30px;height:30px;min-width:30px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-msg__av--ai{background:linear-gradient(135deg,var(--info),var(--purple));color:#fff}
.chat-msg__av--user{background:var(--navy);color:#fff;font-size:11px;font-weight:var(--weight-bold)}
.chat-msg__av svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-bubble{font-size:var(--text-sm);line-height:1.6;color:var(--text-primary);padding:var(--space-3) var(--space-4);border-radius:12px;border:1px solid var(--border);background:var(--surface)}
.chat-msg--user .chat-bubble{background:var(--info-bg);border-color:var(--info-border)}

.chat-suggests{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);margin-top:var(--space-1)}
.chat-suggest{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--border);border-radius:10px;cursor:pointer;font-size:var(--text-sm);color:var(--text-secondary);
  transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-suggest:hover{background:var(--info-bg);border-color:var(--info);color:var(--info)}
.chat-suggest svg{width:15px;height:15px;stroke:var(--info);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

.chat-plan,.chat-result{border:1px solid var(--border);border-radius:12px;background:var(--surface-0);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}
.chat-plan__title,.chat-result__title{display:flex;align-items:center;gap:6px;font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-plan__title svg,.chat-result__title svg{width:16px;height:16px;stroke:var(--info);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.chat-checklist{display:flex;flex-direction:column;gap:8px}
.chat-checkitem{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary)}
.chat-checkitem__n{width:20px;height:20px;min-width:20px;border-radius:var(--radius-full);background:var(--info-bg);color:var(--info);font-size:11px;font-weight:var(--weight-semibold);display:flex;align-items:center;justify-content:center}
.chat-btnrow{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.chat-chip-btn{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 var(--space-3);border:1px solid var(--border);border-radius:8px;background:var(--surface);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);cursor:pointer;transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease)}
.chat-chip-btn:hover{background:var(--surface-2);border-color:var(--border-hi)}
.chat-chip-btn--primary{background:var(--info);border-color:var(--info);color:#fff}
.chat-chip-btn--primary:hover{filter:brightness(.95)}
.chat-result{border-color:var(--success-border);background:var(--success-bg)}
.chat-result__title{color:var(--success)}
.chat-result__title svg{stroke:var(--success)}
.chat-result__grid{display:grid;grid-template-columns:1fr 1fr;gap:6px var(--space-4)}
.chat-result__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-size:var(--text-sm)}
.chat-result__k{color:var(--text-muted)}
.chat-result__v{font-weight:var(--weight-semibold);color:var(--text-primary)}

.chat-composer{border-top:1px solid var(--border);padding:var(--space-3) var(--space-4)}
.chat-composer__box{display:flex;align-items:flex-end;gap:var(--space-2);border:1px solid var(--border);border-radius:12px;padding:var(--space-2) var(--space-3);background:var(--surface)}
.chat-composer__box:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-muted)}
.chat-composer__input{flex:1;border:none;outline:none;resize:none;min-height:24px;max-height:120px;font-family:inherit;font-size:var(--text-sm);color:var(--text-primary);background:transparent;line-height:1.5}
.chat-composer__input::placeholder{color:var(--text-muted)}
.chat-composer__btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;flex-shrink:0;transition:background var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-composer__btn:hover{background:var(--surface-2);color:var(--text-primary)}
.chat-composer__btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-composer__send{width:32px;height:32px;background:var(--brand);color:#fff;border-radius:8px;flex-shrink:0}
.chat-composer__send:hover{filter:brightness(.95);background:var(--info)}
.chat-composer__send svg{stroke:#fff}
.chat-composer__hint{font-size:11px;color:var(--text-muted);margin-top:6px;padding-left:2px}

/* RIGHT — action panel */
.chat-actions{min-width:0}
.chat-actions__hd{display:flex;align-items:center;gap:6px;height:60px;min-height:60px;padding:0 var(--space-5);border-bottom:1px solid var(--border);font-size:var(--text-md);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-actions__hd svg{width:17px;height:17px;stroke:var(--info);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.chat-actions__body{flex:1;overflow-y:auto;padding:var(--space-4) var(--space-5);display:flex;flex-direction:column;gap:var(--space-5);min-height:0}
.chat-sec__label{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3)}
.chat-ctx{display:flex;flex-direction:column;gap:8px}
.chat-ctx__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-size:var(--text-sm)}
.chat-ctx__k{color:var(--text-muted)}
.chat-ctx__v{font-weight:var(--weight-medium);color:var(--text-primary)}
.chat-asset{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) 0;border-bottom:1px solid var(--border)}
.chat-asset:last-child{border-bottom:none}
.chat-asset__body{flex:1;min-width:0}
.chat-asset__name{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-asset__type{font-size:var(--text-xs);color:var(--text-muted)}
.chat-badge{display:inline-flex;align-items:center;height:20px;padding:0 var(--space-2);border-radius:var(--radius-full);font-size:11px;font-weight:var(--weight-semibold);white-space:nowrap;flex-shrink:0}
.chat-badge--created{background:var(--success-bg);color:var(--success)}
.chat-badge--generated{background:var(--info-bg);color:var(--info)}
.chat-badge--linked{background:var(--purple-bg);color:var(--purple)}
.chat-badge--ready{background:var(--warning-bg);color:var(--warning)}
.chat-badge--running{background:var(--warning-bg);color:var(--warning)}
.chat-flow{display:flex;flex-direction:column;gap:0}
.chat-flow__step{display:flex;align-items:center;gap:var(--space-2);min-height:38px}
.chat-flow__dot{width:8px;height:8px;min-width:8px;border-radius:var(--radius-full);background:var(--text-muted)}
.chat-flow__icon{width:24px;height:24px;border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-flow__icon svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-flow__title{flex:1;font-size:var(--text-sm);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-flow__dur{font-size:11px;color:var(--text-muted);font-family:var(--font-mono)}
.chat-next{display:flex;flex-direction:column;gap:var(--space-2)}
.chat-nextbtn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 var(--space-3);border-radius:8px;font-size:var(--text-sm);font-weight:var(--weight-semibold);cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);
  transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-nextbtn:hover{background:var(--surface-2);border-color:var(--border-hi);color:var(--text-primary)}
.chat-nextbtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-nextbtn--primary{background:var(--info);border-color:var(--info);color:#fff}
.chat-nextbtn--primary:hover{filter:brightness(.95);color:#fff}

@media(max-width:1400px){.chat-workspace{grid-template-columns:240px 1fr}.chat-workspace--with-panel{grid-template-columns:240px 1fr 360px}}
@media(max-width:1200px){
  .chat-workspace,.chat-workspace--with-panel{grid-template-columns:1fr;flex:0 0 auto;min-height:0}
  .chat-card{min-height:420px}
  .chat-workflow-panel{min-height:420px}
  /* sidebar becomes a shorter, self-scrolling block when stacked */
  .chat-sidebar{max-height:340px}
  .chat-center{min-height:480px}
}
@media(max-width:768px){
  .chat-header{flex-direction:column;align-items:stretch;gap:var(--space-3)}
  .chat-header__actions{flex-wrap:wrap}
  .chat-hbtn{flex:1 1 auto;justify-content:center}
  .chat-title{font-size:var(--text-2xl)}
  .chat-workspace{gap:var(--space-3)}
  .chat-chead{padding:var(--space-3)}
  .chat-msgs{padding:var(--space-3)}
  .chat-msg{max-width:96%}
  .chat-suggests,.chat-result__grid{grid-template-columns:1fr}
  /* touch: no hover, so keep the delete/rename affordance visible */
  .chat-convo__del,.chat-convo__edit{opacity:1}
}

/* ─── Workflow Panel ─── */
.chat-workflow-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;overflow:hidden;min-height:0;animation:wfPanelIn var(--duration-slow,320ms) var(--ease-default,cubic-bezier(.16,1,.3,1))}
@keyframes wfPanelIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
.chat-wf__hd{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);flex-shrink:0}
.chat-wf__hd-left{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm,0.8125rem);font-weight:600;color:var(--text-primary)}
.chat-wf__close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm,6px);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;transition:background var(--duration-fast,120ms)}
.chat-wf__close:hover{background:var(--surface-hover,var(--surface-3,#1e2840));color:var(--text-primary)}
.chat-wf__body{flex:1;overflow-y:auto;padding:var(--space-4) var(--space-5);display:flex;flex-direction:column;gap:var(--space-5)}

/* ─── Interactive additions ─── */

/* User bubble variant */
.chat-bubble--user{background:var(--info-bg);border-color:var(--info-border,var(--border))}

/* Typing indicator */
.chat-typing{display:flex;align-items:center;gap:4px;padding:var(--space-2) var(--space-3);min-width:80px}
.chat-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--text-muted);animation:chatDotBounce 1.2s infinite ease-in-out}
.chat-dot:nth-child(1){animation-delay:0s}
.chat-dot:nth-child(2){animation-delay:.2s}
.chat-dot:nth-child(3){animation-delay:.4s}
@keyframes chatDotBounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-6px);opacity:1}}

/* Welcome card */
.chat-welcome{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-8) var(--space-4);gap:var(--space-3);flex:1}
.chat-welcome__icon{width:56px;height:56px;border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--info),var(--purple));color:#fff;display:flex;align-items:center;justify-content:center}
.chat-welcome__icon svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-welcome__title{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-welcome__sub{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6;max-width:400px}
.chat-welcome__chips{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:center;margin-top:var(--space-2)}
.chat-welcome__chip{display:inline-flex;align-items:center;height:36px;padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;background:var(--surface);transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-welcome__chip:hover{background:var(--info-bg,var(--brand-muted));border-color:var(--info);color:var(--info)}

/* Steps card */
.chat-steps-card{border:1px solid var(--border);border-radius:12px;background:var(--surface-0);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}
.chat-steps-card .chat-plan__title svg{stroke:var(--brand)}

/* Analysis card */
.chat-analysis-card{border:1px solid var(--warning-border,var(--border));border-radius:12px;background:var(--warning-bg,var(--surface-0));padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2)}
.chat-analysis-card .chat-plan__title svg{stroke:var(--warning)}
.chat-analysis__summary{font-size:var(--text-sm);color:var(--text-primary);line-height:1.6;padding:var(--space-2) var(--space-3);background:var(--surface);border-radius:var(--radius-sm);border:1px solid var(--border)}
.chat-analysis__list{margin:0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:4px}
.chat-analysis__list li{font-size:var(--text-sm);color:var(--text-secondary)}

/* Script card */
.chat-script-card{border:1px solid var(--border);border-radius:12px;background:var(--surface-0);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}
.chat-lang-badge{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:var(--radius-full);font-size:11px;font-weight:var(--weight-semibold);background:var(--info-bg,var(--brand-muted));color:var(--info);margin-left:8px;vertical-align:middle}
.chat-code-block{font-family:var(--font-mono);font-size:var(--text-xs);line-height:1.7;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-3);overflow-x:auto;white-space:pre;color:var(--text-primary);margin:0;max-height:220px;overflow-y:auto}

/* Execution card */
.chat-exec-card{border-radius:12px;padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3)}
.chat-exec-card--pass{border:1px solid var(--success-border,var(--border));background:var(--success-bg,var(--surface-0))}
.chat-exec-card--running{border:1px solid var(--warning-border,var(--border));background:var(--warning-bg,var(--surface-0))}
.chat-exec-card__hd{display:flex;align-items:center;gap:6px;font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--success)}
.chat-exec-card--running .chat-exec-card__hd{color:var(--warning)}
.chat-exec-card__hd svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.chat-exec-dur{font-size:var(--text-xs);color:var(--text-muted);font-family:var(--font-mono);margin-left:4px}
.chat-checkitem__dot{width:16px;height:16px;min-width:16px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center}
.chat-checkitem__dot--pass{background:var(--success-bg,rgba(0,230,118,.12));color:var(--success)}
.chat-checkitem__dot--pass svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Flow dot states */
.chat-flow__dot--pass{background:var(--success)}
.chat-flow__dot--running{background:var(--warning);animation:chatDotPulse 1s infinite}
@keyframes chatDotPulse{0%,100%{opacity:1}50%{opacity:.3}}

/* Execution running bar */
.chat-exec-running{margin-bottom:var(--space-2)}
.chat-exec-running__bar{height:4px;background:var(--surface-2);border-radius:var(--radius-full);overflow:hidden}
.chat-exec-running__fill{height:100%;background:var(--warning);border-radius:var(--radius-full);transition:width .4s ease}
.chat-exec-running__txt{font-size:var(--text-xs);color:var(--text-muted);margin-top:4px}

/* Select wrappers */
.chat-select-wrap{position:relative;display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 var(--space-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:var(--surface)}
.chat-select-wrap:hover{border-color:var(--border-hi);background:var(--surface-2)}
.chat-select-native{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.chat-select-icon svg,.chat-select-wrap svg{width:11px;height:11px;stroke:var(--text-muted);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-select-val{pointer-events:none}

/* Command menu */
.chat-cmd-menu{position:absolute;bottom:calc(100% + 8px);left:0;right:0;background:var(--surface-2);border:1px solid var(--border-hi);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:200;overflow:hidden;max-height:220px;overflow-y:auto}
.chat-composer{position:relative}
.chat-cmd-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);cursor:pointer;transition:background var(--duration-fast) var(--ease)}
.chat-cmd-item:hover{background:var(--surface-3)}
.chat-cmd-name{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--brand);min-width:140px}
.chat-cmd-desc{font-size:var(--text-sm);color:var(--text-muted)}

/* Capabilities modal */
.chat-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}
.chat-modal{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-xl);width:100%;max-width:680px;max-height:80vh;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.chat-modal__hd{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--border)}
.chat-modal__title{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text-primary)}
.chat-modal__sub{font-size:var(--text-sm);color:var(--text-secondary);margin-top:4px}
.chat-modal__close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;flex-shrink:0;transition:background var(--duration-fast) var(--ease)}
.chat-modal__close:hover{background:var(--surface-2);color:var(--text-primary)}
.chat-modal__close svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-modal__body{flex:1;overflow-y:auto;padding:var(--space-5) var(--space-6)}
.chat-cap-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.chat-cap-card{display:flex;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-0);transition:border-color var(--duration-fast) var(--ease)}
.chat-cap-card:hover{border-color:var(--brand)}
.chat-cap-card__icon{width:36px;height:36px;min-width:36px;border-radius:var(--radius-sm);background:var(--brand-muted);color:var(--brand);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-cap-card__icon svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-cap-card__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.chat-cap-card__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-cap-card__desc{font-size:var(--text-xs);color:var(--text-secondary);line-height:1.5}
.chat-cap-card__btn{display:inline-flex;align-items:center;height:26px;padding:0 var(--space-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--brand);cursor:pointer;background:transparent;margin-top:auto;align-self:flex-start;transition:background var(--duration-fast) var(--ease)}
.chat-cap-card__btn:hover{background:var(--brand-muted)}

/* Save button saved state */
.chat-nextbtn--saved{background:var(--success-bg,rgba(0,230,118,.1));border-color:var(--success);color:var(--success)}
.chat-nextbtn--saved:hover{background:var(--success-bg,rgba(0,230,118,.1));border-color:var(--success)}

/* Toast */
.chat-toast{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:2000;padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);box-shadow:var(--shadow-md);opacity:0;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.chat-toast--show{opacity:1;transform:translateY(0)}
.chat-toast--success{background:var(--success);color:#fff}
.chat-toast--error{background:var(--error,#ff3d6b);color:#fff}

@media(max-width:900px){.chat-cap-grid{grid-template-columns:1fr}}

/* Knowledge Base (RAG) modal */
.chat-kb__projectrow{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}
.chat-kb__projectrow .chat-chead__project-select{max-width:none;flex:1;height:32px}
.chat-kb__empty{font-size:var(--text-sm);color:var(--text-secondary);padding:var(--space-4) 0}
.chat-kb__err{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--error,#ff3d6b);margin-bottom:var(--space-3)}
.chat-kb__list{display:flex;flex-direction:column;gap:var(--space-2)}
.chat-kb__row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-0)}
.chat-kb__icon{width:30px;height:30px;min-width:30px;border-radius:var(--radius-sm);background:var(--brand-muted);color:var(--brand);display:flex;align-items:center;justify-content:center}
.chat-kb__info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.chat-kb__name{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-kb__meta{font-size:var(--text-xs);color:var(--text-muted)}
.chat-kb__del{width:28px;height:28px;min-width:28px;display:flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-kb__del:hover{background:rgba(255,61,107,.1);color:var(--error,#ff3d6b)}
.chat-kb__actionbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-4)}
.chat-hbtn--danger{background:transparent;border-color:var(--error,#ff3d6b);color:var(--error,#ff3d6b)}
.chat-hbtn--danger:hover:not(:disabled){background:rgba(255,61,107,.1)}
.chat-hbtn--danger:disabled{opacity:.5;cursor:not-allowed}
.chat-kb__selectall{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary);padding:0 var(--space-1) var(--space-1)}
.chat-kb__selectcount{margin-left:auto;font-size:var(--text-xs);color:var(--text-muted)}
.chat-kb__row--select{gap:var(--space-2)}
.chat-kb__checkbox{width:16px;height:16px;min-width:16px;accent-color:var(--brand);cursor:pointer}

/* ─── Contextual right panel additions ─── */
.chat-guide{display:flex;flex-direction:column;gap:var(--space-2)}
.chat-guide__intro{font-size:var(--text-xs);color:var(--text-secondary);line-height:1.5;margin-bottom:4px}
.chat-guide-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);border-radius:var(--radius-sm);background:var(--surface-0);border:1px solid var(--border)}
.chat-guide-item__icon{width:22px;height:22px;min-width:22px;border-radius:var(--radius-sm);background:var(--brand-muted);color:var(--brand);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-guide-item__icon svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-guide-item__txt{font-size:var(--text-xs);color:var(--text-secondary)}

.chat-working{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-5) var(--space-4);text-align:center;background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-md)}
.chat-working__spinner svg{width:20px;height:20px;stroke:var(--brand);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;animation:chatSpinAnim 1s linear infinite}
@keyframes chatSpinAnim{to{transform:rotate(360deg)}}
.chat-working__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-working__sub{font-size:var(--text-xs);color:var(--text-muted)}

.chat-status-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);border:1px solid var(--border)}
.chat-status-card svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.chat-status-card__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-status-card__sub{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}
.chat-status-card--pass{background:var(--success-bg,rgba(0,230,118,.08));border-color:var(--success);color:var(--success)}
.chat-status-card--pass .chat-status-card__title{color:var(--success)}
.chat-status-card--info{background:var(--info-bg,rgba(41,121,255,.08));border-color:var(--info);color:var(--info)}
.chat-status-card--info .chat-status-card__title{color:var(--info)}
.chat-status-card--success{background:var(--success-bg,rgba(0,230,118,.08));border-color:var(--success);color:var(--success)}
.chat-status-card--success .chat-status-card__title{color:var(--success)}
.chat-status-card--saved{background:var(--brand-muted);border-color:var(--brand);color:var(--brand)}
.chat-status-card--saved .chat-status-card__title{color:var(--brand)}

/* ─── Workflow panel: idle grid ─── */
.chat-wf-grid{display:flex;flex-direction:column;gap:6px}
.chat-wf-card{display:flex;align-items:center;gap:var(--space-3);padding:10px var(--space-3);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;background:var(--surface-0);transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease)}
.chat-wf-card:hover{background:var(--surface-2);border-color:var(--border-hi)}
.chat-wf-card__icon{width:32px;height:32px;min-width:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-wf-card__body{flex:1;min-width:0}
.chat-wf-card__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-wf-card__desc{font-size:var(--text-xs);color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.chat-wf-card__arrow{flex-shrink:0;opacity:.5}
.chat-wf-card:hover .chat-wf-card__arrow{opacity:1}

/* ─── Workflow panel: setup ─── */
.chat-wf__back{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;flex-shrink:0;transition:background var(--duration-fast) var(--ease)}
.chat-wf__back:hover{background:var(--surface-2);color:var(--text-primary)}
.chat-wf-setup__badge{width:22px;height:22px;min-width:22px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-wf-setup__fields{display:flex;flex-direction:column;gap:var(--space-3)}
.chat-wf-setup__field{display:flex;flex-direction:column;gap:5px}
.chat-wf-setup__label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary)}
.chat-wf-setup__input{height:34px;padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-0);font-size:var(--text-sm);color:var(--text-primary);font-family:inherit;width:100%;box-sizing:border-box}
.chat-wf-setup__input::placeholder{color:var(--text-muted)}
.chat-wf-setup__input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-muted)}
.chat-wf-setup__select{height:34px;padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-0);font-size:var(--text-sm);color:var(--text-primary);font-family:inherit;width:100%;cursor:pointer;box-sizing:border-box}
.chat-wf-setup__select:focus{outline:none;border-color:var(--brand)}
.chat-wf-setup__actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}

/* ─── Capabilities modal: mapping table ─── */
.chat-cap-map{display:flex;flex-direction:column;gap:6px}
.chat-cap-map-row{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-0);font-size:var(--text-xs)}
.chat-cap-map-row__fn{display:flex;align-items:center;gap:6px;flex:1;min-width:0;color:var(--text-primary);font-weight:var(--weight-medium)}
.chat-cap-map-row__fn svg{flex-shrink:0;stroke:var(--info)}
.chat-cap-map-row__arrow{color:var(--text-muted);flex-shrink:0}
.chat-cap-map-row__wf{flex-shrink:0;color:var(--brand);font-weight:var(--weight-semibold);white-space:nowrap}

/* ─── Markdown rendering inside AI chat bubbles ─── */
.chat-bubble--md{line-height:var(--leading-normal)}
.chat-bubble--md .chat-md-p{margin:0 0 var(--space-2) 0}
.chat-bubble--md .chat-md-p:last-child{margin-bottom:0}
.chat-bubble--md .chat-md-h{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);margin:var(--space-3) 0 var(--space-1) 0}
.chat-bubble--md .chat-md-ol{margin:var(--space-2) 0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:6px;list-style:decimal}
.chat-bubble--md .chat-md-ul{margin:var(--space-2) 0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:4px;list-style:disc}
.chat-bubble--md li{padding-left:2px;line-height:var(--leading-normal)}
.chat-bubble--md strong{font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-bubble--md em{font-style:italic;color:var(--text-secondary)}
.chat-bubble--md .chat-md-inline-code{font-family:var(--font-mono);font-size:0.85em;background:var(--surface-0);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--brand)}
.chat-bubble--md .chat-md-code{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--surface-0);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-3);overflow-x:auto;margin:var(--space-2) 0;white-space:pre}
.chat-bubble--md br{display:block;margin:var(--space-1) 0;content:''}

/* ─── Test Case creation bar (appears after AI step response) ─── */
.chat-tc-bar{margin:var(--space-2) 0 var(--space-3) 44px;}
.chat-tc-bar__inner{background:var(--surface-2);border:1px solid var(--border-hi);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);}
.chat-tc-bar__label{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-brand);}
.chat-tc-bar__fields{display:flex;gap:var(--space-2);flex-wrap:wrap;}
.chat-tc-bar__input{flex:1;min-width:180px;height:30px;padding:0 var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--color-text-primary);font-size:var(--text-sm);font-family:inherit;}
.chat-tc-bar__input:focus{outline:none;border-color:var(--color-brand);}
.chat-tc-bar__select{height:30px;padding:0 var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--color-text-primary);font-size:var(--text-sm);font-family:inherit;cursor:pointer;}
.chat-tc-bar__actions{display:flex;gap:var(--space-2);}
.chat-tc-bar__btn{height:30px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:none;font-size:var(--text-sm);font-family:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:5px;transition:background var(--duration-fast);}
.chat-tc-bar__btn--save{background:var(--color-brand);color:var(--color-text-inverse);font-weight:var(--font-medium);}
.chat-tc-bar__btn--save:hover{background:var(--color-brand-dim);}
.chat-tc-bar__btn--dismiss{background:var(--color-surface-3);color:var(--color-text-secondary);}
.chat-tc-bar__btn--dismiss:hover{background:var(--color-border-hi);color:var(--color-text-primary);}

/* ── QA Agent action cards ── */
.chat-agent-card{background:var(--color-surface-0);border:2px solid var(--color-border-hi);border-left:4px solid var(--color-border-hi);border-radius:var(--radius-md);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);max-width:620px;box-shadow:var(--shadow-md)}
.chat-agent-card--test{border-left-color:var(--color-success)}
.chat-agent-card--run{border-left-color:var(--color-brand)}
.chat-agent-card--results{border-left-color:var(--color-info)}
.chat-agent-card__reply{font-size:var(--text-sm);color:var(--text-primary);line-height:1.6}
.chat-agent-card__hd{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border)}
.chat-agent-card__hd svg{stroke:var(--color-brand);flex-shrink:0}
.chat-agent-meta{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.chat-agent-pill{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);background:var(--color-surface-0);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:2px var(--space-3)}
.chat-agent-tag{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--color-brand);background:var(--color-brand-muted);border-radius:var(--radius-full);padding:1px var(--space-2)}
.chat-agent-tag--pri{color:var(--color-warning);background:var(--warning-bg,rgba(255,171,0,.12))}
.chat-agent-note,.chat-agent-empty{font-size:var(--text-xs);color:var(--text-muted)}
.chat-agent-steps{margin:0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:4px}
.chat-agent-steps li{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.5}
.chat-agent-expected{font-size:var(--text-sm);color:var(--text-secondary);background:var(--color-surface-0);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}
.chat-agent-expected strong{color:var(--text-primary)}
.chat-agent-code{font-family:var(--font-mono);font-size:var(--text-xs);line-height:1.6;background:var(--color-surface-0);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-3);overflow-x:auto;white-space:pre;color:var(--text-primary);margin:0;max-height:320px;overflow-y:auto}
.chat-agent-draft-note{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--color-warning,var(--warning));background:var(--color-surface-0);border:1px dashed var(--color-border-hi,var(--color-border));border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}
.chat-agent-draft-note svg{flex:none}
.chat-agent-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}
.chat-agent-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--text-secondary);font-size:var(--text-sm);font-family:inherit;font-weight:var(--weight-medium);cursor:pointer;transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease)}
.chat-agent-btn:hover{background:var(--color-surface-2);border-color:var(--color-border-hi);color:var(--text-primary)}
.chat-agent-btn svg{flex-shrink:0}
.chat-agent-btn--primary{background:var(--color-brand);border-color:var(--color-brand);color:var(--color-text-inverse,#475569)}
.chat-agent-btn--primary:hover{filter:brightness(.95);background:var(--color-brand);color:var(--color-text-inverse,#0c0202)}
.chat-agent-btn--sm{height:26px;padding:0 var(--space-2);font-size:var(--text-xs);margin-left:auto}
.chat-agent-runs{display:flex;flex-direction:column;gap:4px}
.chat-agent-run-row{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0)}
.chat-agent-run-dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--text-muted);flex-shrink:0}
.chat-agent-run-dot--pass{background:var(--color-success)}
.chat-agent-run-dot--fail{background:var(--color-error)}
.chat-agent-run-name{font-size:var(--text-sm);color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.chat-agent-run-status{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted)}
.chat-agent-run-status--pass{color:var(--color-success)}
.chat-agent-run-status--fail{color:var(--color-error)}

/* ── Project picker card (create-test-case flow) ── */
.chat-projpick{background:var(--color-surface-1);border:1px solid var(--color-border-hi);border-radius:var(--radius-md);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);max-width:560px}
.chat-projpick__title{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary)}
.chat-projpick__title svg{stroke:var(--color-brand);flex-shrink:0}
.chat-projpick__empty{font-size:var(--text-xs);color:var(--text-secondary)}
.chat-projpick__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-2)}
.chat-projpick__item{display:flex;align-items:center;gap:8px;padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--text-primary);font-size:var(--text-sm);font-family:inherit;cursor:pointer;text-align:left;transition:background var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease)}
.chat-projpick__item:hover{background:var(--color-brand-muted);border-color:var(--color-brand)}
.chat-projpick__item svg{stroke:var(--color-brand);flex-shrink:0}
.chat-projpick__item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-projpick__item--new{border-style:dashed;color:var(--color-brand);font-weight:var(--weight-medium)}
.chat-projpick__newform{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center;margin-top:var(--space-1)}
.chat-projpick__input{flex:1;min-width:180px;height:34px;padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--text-primary);font-size:var(--text-sm);font-family:inherit;box-sizing:border-box}
.chat-projpick__input:focus{outline:none;border-color:var(--color-brand)}

/* success state */
.chat-tc-success{background:var(--color-surface-1);border:1px solid var(--color-success);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);color:var(--color-success);display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;}
.chat-tc-link{background:none;border:none;color:var(--color-brand);font-size:var(--text-sm);cursor:pointer;text-decoration:underline;padding:0;}
.chat-tc-run-btn{height:26px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-brand);background:transparent;color:var(--color-brand);font-size:var(--text-sm);cursor:pointer;transition:background var(--duration-fast);}
.chat-tc-run-btn:hover{background:var(--color-brand-muted);}

/* ── File Import Card ── */
.chat-import-card{background:var(--color-surface-1);border:1px solid var(--color-border-hi);border-radius:var(--radius-md);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);max-width:560px;}
.ci-header{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary);}
.ci-badge{margin-left:auto;background:var(--color-brand-muted);color:var(--color-brand);border-radius:var(--radius-full);padding:2px 10px;font-size:var(--text-xs);font-weight:var(--font-medium);}
.ci-section{display:flex;flex-direction:column;gap:6px;}
.ci-label{font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.04em;}
.ci-input{height:32px;padding:0 var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-0);color:var(--color-text-primary);font-size:var(--text-sm);font-family:inherit;width:100%;box-sizing:border-box;transition:border-color var(--duration-fast);}
.ci-input:focus{outline:none;border-color:var(--color-brand);}
.ci-cred-section{background:var(--color-surface-0);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-3);}
.ci-cred-title{display:flex;align-items:center;gap:5px;margin-bottom:var(--space-2);}
.ci-cred-grid{display:flex;flex-direction:column;gap:var(--space-2);}
.ci-cred-row{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:var(--space-2);}
.ci-cred-label{font-size:var(--text-xs);color:var(--color-text-secondary);white-space:nowrap;}
.ci-cases-preview{display:flex;flex-direction:column;gap:4px;}
.ci-case-row{display:grid;grid-template-columns:70px 1fr 80px;gap:var(--space-2);padding:5px var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);}
.ci-case-row:hover{background:var(--color-surface-2);}
.ci-case-no{color:var(--color-brand);font-family:var(--font-mono);font-weight:var(--font-medium);}
.ci-case-name{color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ci-case-tag{color:var(--color-text-secondary);text-align:right;}
.ci-case-more{font-size:var(--text-xs);color:var(--color-text-muted);padding:2px var(--space-2);}
.ci-actions{display:flex;justify-content:flex-end;gap:var(--space-2);padding-top:var(--space-1);border-top:1px solid var(--color-border);}
.ci-btn{height:32px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:none;font-size:var(--text-sm);font-family:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background var(--duration-fast);}
.ci-btn--cancel{background:var(--color-surface-2);color:var(--color-text-secondary);}
.ci-btn--cancel:hover{background:var(--color-surface-3);}
.ci-btn--import{background:var(--color-brand);color:var(--color-text-inverse);font-weight:var(--font-semibold);}
.ci-btn--import:hover{background:var(--color-brand-dim);}
.ci-btn--import:disabled{opacity:.5;cursor:not-allowed;}
.chat-bubble__spinner{display:inline-flex;align-items:center;gap:6px;}
@keyframes spin{to{transform:rotate(360deg);}}
/* Project selector row */
.ci-proj-select{height:32px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236080a0' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;cursor:pointer;}
.ci-new-proj-row{display:flex;margin-top:var(--space-2);}
.ci-new-proj-row .ci-input{flex:1;}
/* Required / from-file indicators */
.ci-input--req{border-color:rgba(255,61,107,.4);}
.ci-input--req:focus{border-color:var(--color-error);}
.ci-input--error{border-color:var(--color-error) !important;box-shadow:0 0 0 2px rgba(255,61,107,.2);}
.ci-from-file{color:var(--color-success);font-weight:var(--font-medium);font-size:var(--text-xs);}
.ci-from-file svg{vertical-align:middle;}
.ci-req-note{color:var(--color-text-secondary);font-size:var(--text-xs);}
/* Badge success variant */
.ci-badge--success{background:rgba(0,230,118,0.12);color:var(--color-success);}
/* Persisted import result card */
.ci-import-result{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-md);min-width:280px;max-width:480px;}

/* ── Upload Progress ── */
.ci-upload-progress{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-md);min-width:300px;}
.ci-up-header{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);}
.ci-up-name{flex:1;color:var(--color-text-primary);font-weight:var(--font-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px;}
.ci-up-pct{font-size:var(--text-xs);color:var(--color-brand);font-family:var(--font-mono);white-space:nowrap;}
.ci-up-bar-wrap{height:4px;background:var(--color-surface-3);border-radius:2px;overflow:hidden;}
.ci-up-bar{height:100%;background:linear-gradient(90deg,var(--color-brand),var(--color-brand-dim));border-radius:2px;transition:width .15s ease;min-width:4px;}
.ci-up-status{font-size:var(--text-xs);color:var(--color-text-secondary);display:flex;align-items:center;gap:5px;}
.ci-up-status svg{animation:spin .9s linear infinite;}

/* ── Import Status Panel ── */
.ci-status-panel{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--color-surface-1);border:1px solid var(--color-border-hi);border-radius:var(--radius-md);min-width:300px;}
.ci-status-header{display:flex;align-items:center;gap:7px;font-size:var(--text-sm);color:var(--color-text-primary);padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-1);}
.ci-step{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);padding:3px 0;transition:color .2s;}
.ci-step--wait{color:var(--color-text-muted);}
.ci-step--active{color:var(--color-text-primary);}
.ci-step--active svg{animation:spin .9s linear infinite;}
.ci-step--done{color:var(--color-success);}
.ci-step--error{color:var(--color-error);}
.ci-success-footer{display:flex;flex-direction:column;gap:6px;margin-top:var(--space-2);padding-top:var(--space-2);border-top:1px solid var(--color-border);font-size:var(--text-sm);color:var(--color-text-primary);}
.ci-cred-info{font-size:var(--text-xs);color:var(--color-text-secondary);font-family:var(--font-mono);}
