
/* ── Co-pilot ───────────────────────────────────────────── no comp ───── */

/* the conversation, with the opportunity feed beside it */
.zr-cp{
  display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:0;
  width:min(680px,100%); margin-left:auto; overflow:hidden;
  background:#fff; border:1px solid #EDF1F7; border-radius:20px;
  box-shadow:0 24px 60px -24px rgba(16,49,110,.28), 0 2px 6px rgba(16,49,110,.06);
}
.zr-cp__thread{ display:flex; flex-direction:column; gap:14px; padding:20px; }
.zr-cp__msg{ font-size:13.5px; line-height:21px; color:var(--pp-body); }
.zr-cp__msg--user{ align-self:flex-end; max-width:86%; padding:10px 14px; border-radius:12px 12px 4px 12px; background:#F3F4F6; color:var(--pp-ink); font-weight:500; }
.zr-cp__msg--ai{ display:flex; gap:10px; }
.zr-cp__av{ display:grid; place-items:center; width:26px; height:26px; flex:0 0 auto; border-radius:8px; background:var(--zr-blue); color:#fff; }
.zr-cp__av svg{ width:14px; height:14px; }
.zr-cp__reads{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:8px; font-size:11.5px; color:#9AA1AC; }
.zr-cp__reads i{ font-style:normal; padding:2px 7px; border-radius:5px; background:#F1F3F6; color:#4B5563; font-family:var(--pp-mono); font-size:11px; }
.zr-cp__msg--ai p{ margin:0 0 8px; }
.zr-cp__msg--ai p b{ font-weight:600; color:var(--pp-ink); }
.zr-cp__cite{ font-family:var(--pp-mono); font-size:11px; color:#9AA1AC; }
.zr-cp__action{ display:flex; align-items:center; gap:12px; margin-top:10px; padding:12px 14px; border:1px solid #DCE6F8; border-radius:12px; background:#F7FAFF; }
.zr-cp__action b{ display:block; font-size:12px; font-weight:600; color:var(--zr-blue); letter-spacing:.02em; text-transform:uppercase; }
.zr-cp__action span{ display:block; margin-top:2px; font-size:13px; color:var(--pp-ink); }
.zr-cp__btns{ display:flex; gap:6px; margin-left:auto; flex:0 0 auto; }
.zr-cp__btns i{ display:inline-flex; align-items:center; height:30px; padding:0 10px; border-radius:7px; border:1px solid var(--pp-hair); font-style:normal; font-size:12.5px; font-weight:500; color:var(--pp-ink); }
.zr-cp__btns i.is-ok{ background:var(--zr-blue); border-color:var(--zr-blue); color:#fff; }
.zr-cp__input{ display:flex; align-items:center; gap:10px; margin-top:auto; padding:10px 12px; border:1px solid var(--pp-hair); border-radius:12px; font-size:13px; color:#9AA1AC; }
.zr-cp__input i{ display:grid; place-items:center; width:28px; height:28px; margin-left:auto; border-radius:8px; background:var(--zr-blue); color:#fff; }
.zr-cp__input i svg{ width:14px; height:14px; }
.zr-cp__feed{ display:flex; flex-direction:column; gap:8px; padding:18px 14px; border-left:1px solid #EEF1F5; background:#FAFBFC; }
.zr-cp__feed h4{ margin:0 0 6px; font-family:var(--pp-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:#9AA1AC; font-weight:500; }
.zr-cp__feed li{ list-style:none; padding:10px 11px; border-radius:10px; background:#fff; border:1px solid #EDF1F7; font-size:12px; line-height:17px; color:var(--pp-body); }
.zr-cp__feed li b{ display:block; font-weight:500; color:var(--pp-ink); }
.zr-cp__feed li .zr-chip{ margin-top:6px; }
.zr-cp__feed .is-wait{ border-color:#DCE6F8; background:#F7FAFF; }

/* three cards */
.zr-feat3{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.zr-feat3__card{ padding:26px 24px 28px; }
.zr-feat3__ico{ display:grid; place-items:center; width:40px; height:40px; margin-bottom:18px; border-radius:12px; background:#E8F0FE; color:var(--zr-blue); }
.zr-feat3__ico svg{ width:20px; height:20px; }
.zr-feat3__card b{ display:block; font-size:20px; font-weight:500; line-height:1.3; color:var(--pp-ink); }
.zr-feat3__card p{ margin:8px 0 0; font-size:15px; line-height:24px; color:var(--pp-dim); text-wrap:pretty; }

/* try asking — copyable, the MCP page's contract */
.zr-try{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
.zr-try__q{
  display:flex; align-items:center; gap:12px; width:100%; padding:16px 18px;
  border:1px solid #EDF1F7; border-radius:14px; background:#fff;
  font:inherit; text-align:left; cursor:pointer;
  box-shadow:0 6px 16px -6px rgba(31,36,41,.05);
  transition:border-color .16s var(--zr-ease-out-quad), background .16s var(--zr-ease-out-quad);
}
.zr-try__q:hover{ border-color:#C9D6F2; background:#F8FAFE; }
.zr-try__q span{ flex:1 1 auto; min-width:0; font-size:14.5px; line-height:22px; color:var(--pp-ink); }
.zr-try__q svg{ width:18px; height:18px; flex:0 0 auto; color:#9AA1AC; }
.zr-try__q .zr-menu__tick{ display:none; }
.zr-try__q.is-copied{ border-color:#BFE5CD; background:#F3FBF6; }
.zr-try__q.is-copied span{ color:#0F7A45; }
.zr-try__q.is-copied .zr-menu__copy{ display:none; }
.zr-try__q.is-copied .zr-menu__tick{ display:block; color:#16A34A; }

@media (max-width:1040px){
  .zr-cp{ margin-inline:auto; }
  .zr-feat3{ grid-template-columns:minmax(0,1fr); }
  .zr-try{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:620px){
  .zr-cp__action{ flex-wrap:wrap; } .zr-cp__btns{ margin-left:0; }
}
