.hb-mcp *{box-sizing:border-box;margin:0;padding:0}
  .hb-mcp{
    /* ---- brand tokens ---- */
    --cl-orange:#D97757;     /* clay/coral accent — decorative marks only */
    --cl-orange-d:#C45A3B;
    --cl-fill:#B04A28;        /* solid button/chip fill — ~5:1 vs white text (AA) */
    --cl-fill-d:#8F3C20;      /* fill hover */
    --cl-on-fill:#FFFFFF;     /* text/icon on fill */
    --cl-cream:#F5F4EE;      /* canvas */
    --cl-panel:#FBFAF6;      /* input / raised surfaces */
    --cl-ink:#2E2D2A;        /* warm near-black text */
    --cl-muted:#75736B;
    --cl-line:#E7E4DA;
    --cl-user:#EDE9DD;       /* user message bubble */
    --cl-ok:#3F9E6E;
    --cl-radius:18px;
    --cl-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    --cl-serif:'Times New Roman',Georgia,'Iowan Old Style',serif;

    font-family:var(--cl-sans);
    color:var(--cl-ink);
    width:100%;
    max-width:480px;
    margin:0 auto;
    background:var(--cl-cream);
    border:1px solid var(--cl-line);
    border-radius:22px;
    box-shadow:0 24px 60px -28px rgba(90,55,35,.35);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    height:640px;
  }

  /* Header */
  .hb-mcp__head{
    display:flex;align-items:center;gap:11px;
    padding:14px 16px;
    background:var(--cl-cream);
    border-bottom:1px solid var(--cl-line);
  }
  .hb-star{flex:0 0 auto;width:26px;height:26px;color:var(--cl-orange)}
  .hb-mcp__titles{display:flex;flex-direction:column;line-height:1.2;min-width:0}
  .hb-mcp__title{font-family:var(--cl-sans);font-weight:600;font-size:15px;letter-spacing:0;color:var(--cl-ink)}
  .hb-conn{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--cl-muted);margin-top:1px}
  .hb-conn b{color:var(--cl-ink);font-weight:600}
  .hb-conn .dot{width:7px;height:7px;border-radius:50%;background:var(--cl-ok);box-shadow:0 0 0 0 rgba(63,158,110,.5);animation:hb-pulse 2.4s infinite}
  @keyframes hb-pulse{0%{box-shadow:0 0 0 0 rgba(63,158,110,.45)}70%{box-shadow:0 0 0 6px rgba(63,158,110,0)}100%{box-shadow:0 0 0 0 rgba(63,158,110,0)}}
  .hb-mcp__actions{margin-left:auto;display:flex;gap:8px}
  .hb-mcp__replay{border:0;background:#5253F9;color:#fff;cursor:pointer;
    width:34px;height:34px;border-radius:9px;display:grid;place-items:center;transition:.2s}
  .hb-mcp__replay:hover{background:#3F40E0}
  .hb-mcp__replay svg{width:16px;height:16px}

  /* Conversation */
  .hb-mcp__convo{
    flex:1;overflow-y:auto;background:var(--cl-cream);
    padding:18px 16px 10px;display:flex;flex-direction:column;gap:16px;scroll-behavior:smooth;
  }
  .hb-mcp__convo::-webkit-scrollbar{width:8px}
  .hb-mcp__convo::-webkit-scrollbar-thumb{background:#ddd9cc;border-radius:8px}

  /* user message — soft bubble, right aligned */
  .hb-row--user{display:flex;justify-content:flex-end}
  .hb-bubble--user{
    background:var(--cl-user);color:var(--cl-ink);
    padding:11px 14px;border-radius:16px;border-bottom-right-radius:5px;
    font-size:14px;line-height:1.5;max-width:82%;word-wrap:break-word;
    animation:hb-pop .28s ease both;
  }
  @keyframes hb-pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  /* Assistant message — borderless, with star, left aligned */
  .hb-row--mcp{display:flex;gap:10px;align-items:flex-start}
  .hb-mini{flex:0 0 auto;width:26px;height:26px;color:var(--cl-orange);margin-top:1px}
  .hb-answer{font-size:14px;line-height:1.55;max-width:90%;color:var(--cl-ink)}
  .hb-answer .seg{opacity:0;transform:translateY(6px);transition:opacity .35s ease,transform .35s ease}
  .hb-answer .seg.show{opacity:1;transform:none}
  .hb-answer .seg + .seg{margin-top:8px}

  .hb-answer strong{font-weight:700}
  .hb-answer ul,.hb-answer ol{margin:2px 0 0 2px;padding-left:18px}
  .hb-answer li{margin:3px 0}
  .hb-answer .hdr{font-weight:700;font-size:13px;margin-bottom:1px}
  .hb-answer .stat{font-variant-numeric:tabular-nums}
  .hb-answer .muted{color:var(--cl-muted);font-size:13px}
  .hb-answer .confirm{display:inline-flex;align-items:center;gap:7px;background:rgba(63,158,110,.12);
    color:#7FE0AD;font-weight:600;border-radius:10px;padding:7px 10px;font-size:13px}
  .hb-answer .note{background:#F2EEE2;border:1px dashed #DAC9B4;border-radius:10px;padding:7px 10px;color:#8a5a37;font-size:12.5px}
  .hb-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
  .hb-chip{border:1px solid var(--cl-line);background:var(--cl-panel);border-radius:999px;padding:5px 11px;font-size:12.5px;color:var(--cl-ink);font-weight:500}
  .hb-chip--solid{background:var(--cl-fill);color:var(--cl-on-fill);border-color:transparent}

  /* typing dots */
  .hb-typing{display:flex;gap:4px;padding:5px 0}
  .hb-typing span{width:7px;height:7px;border-radius:50%;background:var(--cl-orange);opacity:.55;animation:hb-bounce 1.2s infinite}
  .hb-typing span:nth-child(2){animation-delay:.18s}
  .hb-typing span:nth-child(3){animation-delay:.36s}
  @keyframes hb-bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

  /* Composer (pill) */
  .hb-mcp__composer{
    display:flex;align-items:center;gap:10px;padding:12px 14px 14px;background:var(--cl-cream);
  }
  .hb-mcp__field{
    flex:1;min-height:46px;border:1px solid var(--cl-line);border-radius:16px;background:var(--cl-panel);
    display:flex;align-items:center;padding:0 16px;font-size:14px;color:var(--cl-ink);overflow:hidden;
    box-shadow:0 1px 2px rgba(90,55,35,.04);
  }
  .hb-mcp__field .ph{color:#a39f93}
  .hb-caret{display:inline-block;width:1.5px;height:17px;background:var(--cl-orange);margin-left:1px;animation:hb-blink 1s steps(1) infinite;vertical-align:middle}
  @keyframes hb-blink{50%{opacity:0}}
  .hb-send{
    width:40px;height:40px;border-radius:50%;border:0;flex:0 0 auto;cursor:default;
    background:var(--cl-fill);color:var(--cl-on-fill);display:grid;place-items:center;
    transition:transform .12s ease, opacity .2s ease, background .2s ease;opacity:.55;
  }
  .hb-send.armed{opacity:1}
  .hb-send.armed:hover{background:var(--cl-fill-d)}
  .hb-send.fire{transform:scale(.85)}
  .hb-send svg{width:17px;height:17px}

  @media (prefers-reduced-motion: reduce){
    .hb-conn .dot{animation:none}
    .hb-bubble--user{animation:none}
  }

  /* ===== Dark mode (manager view) ===== */
  .hb-mcp{
    --cl-orange:#E08A6B; --cl-orange-d:#C45A3B;
    --cl-cream:#262624; --cl-panel:#30302E;
    --cl-ink:#ECEAE3; --cl-muted:#A8A59C;
    --cl-line:#3C3B38; --cl-user:#3A3937; --cl-ok:#5BBE8C;
    --cl-fill:#E0875F; --cl-fill-d:#E89A77; --cl-on-fill:#241F1C; /* dark text on light orange — ~5.8:1 (AA) */
    box-shadow:0 24px 60px -28px rgba(0,0,0,.6);
  }
  .hb-mcp__convo::-webkit-scrollbar-thumb{background:#45443f}
  .hb-mcp .hb-answer .confirm{background:rgba(91,190,140,.16);color:#7FE0AD}
  .hb-mcp .hb-answer .note{background:#322F2A;border:1px dashed #5A4A39;color:#E0B48C}
  .hb-mcp .hb-mcp__field .ph{color:#8C897F}