.input-controls { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 8px; min-height: 28px; flex-wrap: nowrap; }
  .input-action-group { display: grid; grid-template-columns: repeat(4, var(--action-btn-w)); gap: 8px; align-items: center; align-self: center; }
  .input-action-btn { width: var(--action-btn-w); height: 28px; padding-top: 0; padding-bottom: 0; justify-content: center; line-height: 1; transition: height var(--sys-motion-normal) ease; }
  #stormInlineArea { display: flex; align-items: center; justify-content: flex-start; gap: 6px; min-width: 0; flex: 1 1 auto; overflow: visible; flex-wrap: nowrap; }
  #stormInlineArea .control-pill { height: var(--pill-btn-h); padding-top: 0 !important; padding-bottom: 0 !important; line-height: 1 !important; white-space: nowrap; }
  body.mobile-layout { --action-btn-w: 55px; --pill-btn-h: 34px; }
  body.mobile-layout .msg { max-width: 100%;; }
  body.mobile-layout #userInput { font-size: 14px; line-height: 1.45; min-height: calc(14px * 1.45 * 3 + 24px + 2px); max-height: 150px; overflow-y: auto; }
  body.mobile-layout .input-controls { align-items: center; justify-content: space-between; min-height: 34px; }
  body.mobile-layout #stormInlineArea { display: flex; align-items: center; align-self: center; justify-content: flex-start; gap: 4px; min-width: 0; flex: 1 1 auto; overflow: visible; }
  body.mobile-layout #stormInlineArea .control-pill { height: var(--pill-btn-h); padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 6px !important; padding-right: 6px !important; font-size: 10px !important; gap: 3px !important; line-height: 1 !important; white-space: nowrap; }
  body.mobile-layout .input-action-group { grid-template-columns: repeat(4, var(--action-btn-w)); justify-content: end; width: auto; gap: 5px; }
  body.mobile-layout .input-action-btn { width: var(--action-btn-w); height: 34px; padding-top: 0; padding-bottom: 0; padding-left: 5px; padding-right: 5px; line-height: 1; }
  body.mobile-layout #sendBtn, body.mobile-layout #startAnalysisBtn { width: var(--action-btn-w); height: 34px; padding-top: 0; padding-bottom: 0; padding-left: 5px; padding-right: 5px; line-height: 1; }
  body.mobile-layout #sendBtn { display: inline-flex !important; }
  body.mobile-layout .input-bar button { min-width: 0; }
  @media (max-width: 1100px) {
    body.desktop-layout { --action-btn-w: 60px; }
    body.desktop-layout #stormInlineArea { gap: 4px; }
    body.desktop-layout #stormInlineArea .control-pill { padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 6px !important; padding-right: 6px !important; font-size: 10px !important; gap: 3px !important; line-height: 1 !important; }
    body.desktop-layout .input-action-group { grid-template-columns: repeat(4, var(--action-btn-w)); justify-content: end; width: auto; gap: 5px; flex: 0 0 auto; }
    body.desktop-layout .input-action-btn { width: var(--action-btn-w); padding-left: 5px; padding-right: 5px; }
  }
  .msg { max-width: min(90%, 900px); width: fit-content; margin-bottom: 20px; animation: fadeUp .25s ease; }
  .msg.user { margin-left: auto; }
  .msg .bubble { padding: 14px 18px; border-radius: var(--chat-bubble-radius); line-height: 1.7; font-size: 14px; min-width: 60px; }
  .msg.user .bubble { padding: 8px 12px; background: var(--control-bg-active); border: 1px solid var(--control-border-active); color: var(--control-color-primary); border-bottom-right-radius: var(--chat-bubble-tail-radius); }
  .user-message-text { margin: 0; color: var(--color-text); font-size: 14px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
  .msg.system .bubble { background: var(--card-bg); border: 1px solid var(--control-border-soft); box-shadow: var(--card-shadow); color: var(--control-color); border-bottom-left-radius: var(--chat-bubble-tail-radius); }
  @keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

  .input-bar textarea { width: 100%; border: 1px solid var(--input-border); border-radius: var(--control-radius-md); padding: 12px 16px; font-size: 14px; font-family: inherit; outline: none; background: var(--input-bg); color: var(--input-color); transition: var(--control-transition); }
  #userInput { line-height: 1.45; min-height: calc(14px * 1.45 * 3 + 24px + 2px); }
  .input-bar textarea:focus { border-color: var(--input-border-focus); box-shadow: var(--input-focus-ring); }

  .thinking-indicator { display: flex; align-items: center; gap: 10px; color: var(--color-muted); padding: 0; line-height: 1.7; }
  .thinking-dots { display: inline-flex; gap: 5px; }
  .thinking-dots span { width: 7px; height: 7px; border-radius: 50%; background: var(--color-primary); opacity: 0.4; animation: pulse 1.2s infinite; }
  .thinking-dots span:nth-child(2) { animation-delay: .2s; }
  .thinking-dots span:nth-child(3) { animation-delay: .4s; }
  .progress-timeline { display: grid; gap: 6px; color: var(--color-text); }
  .progress-step { display: flex; align-items: baseline; gap: 8px; font-size: 13px; line-height: 1.5; }
  .progress-step::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--control-border-default); flex-shrink: 0; margin-top: 6px; }
  .progress-step.done::before { background: var(--color-success); }
  .progress-step.active::before { background: var(--control-color-primary); box-shadow: 0 0 0 4px var(--control-bg-active); }
  .progress-step span { font-weight: 600; white-space: nowrap; }
  .progress-step small { color: var(--color-muted); font-size: 12px; }
  .route-explain-card { display: grid; gap: 10px; }
  .route-explain-head { font-size: 13px; font-weight: 700; color: var(--control-color-primary); padding-bottom: 8px; border-bottom: 1px solid var(--control-border-default); }
  .route-explain-row { display: grid; gap: 4px; }
  .route-explain-label { width: fit-content; border-radius: var(--route-label-radius); padding: 2px 8px; background: var(--route-label-bg); color: var(--route-label-color); border: 1px solid var(--route-label-border); font-size: 11px; font-weight: 700; }
  .route-explain-label.storm { background: var(--status-info-bg); color: var(--semantic-accent); border-color: var(--semantic-accent); }
  .route-explain-row p { margin: 0; color: var(--color-text); font-size: 13px; line-height: 1.7; }
  .conflict-card { border-color: var(--semantic-warning) !important; background: var(--status-warning-bg) !important; }
  .conflict-card b { color: var(--semantic-warning); font-size: 13px; }
  .conflict-card p { margin: 4px 0 0; color: var(--color-text); font-size: 13px; line-height: 1.7; }
  .routing-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--routing-card-radius); box-shadow: var(--card-shadow); padding: 16px; margin: 12px 0; }
  .routing-card.routing-status { padding: 10px 12px; }
  .routing-card .tag { font-size: 11px; padding: 3px 8px; border-radius: var(--status-badge-radius); background: var(--status-success-bg); color: var(--semantic-success); border: 1px solid var(--semantic-success); display: inline-block; margin: 2px; }