/* Card workspace: chat left, task right. Tokens only. */
.main.cc-wide{max-width:none}
.cc-tabs{display:none}
.cc-split{display:grid;gap:20px;align-items:start}
.cc-task{display:grid;gap:16px;min-width:0}
.cc-task .grid2{grid-template-columns:1fr}

.cc-chat{display:flex;flex-direction:column;padding:0;overflow:hidden;min-width:0}
.cc-head{display:flex;align-items:baseline;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.cc-head b{font-size:16px}
.cc-head span{color:var(--ink2);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-list{flex:1;overflow:auto;padding:16px 18px;display:flex;flex-direction:column;gap:12px;min-height:240px}
.cc-m{display:grid;gap:3px;max-width:88%}
.cc-m.me{align-self:flex-end;justify-items:end}
.cc-by{font-size:12px;font-weight:600;color:var(--ink2)}
.cc-m.j .cc-by{color:var(--accent)}
.cc-b{padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;background:var(--bg);word-break:break-word}
.cc-m.me .cc-b{background:var(--ink);color:#fff;border-bottom-right-radius:4px}
.cc-m.j .cc-b{background:var(--paper);border:1px solid var(--line);border-bottom-left-radius:4px}
.cc-b img{display:block;max-width:100%;border-radius:8px;margin-top:8px}
.cc-li{display:block;padding-left:14px;position:relative}
.cc-li::before{content:"";position:absolute;left:3px;top:.62em;width:4px;height:4px;border-radius:50%;background:currentColor}
.cc-m time{font-size:11px;color:var(--ink2)}
.cc-typing{display:inline-flex;gap:4px;padding:13px 14px}
.cc-typing i{width:6px;height:6px;border-radius:50%;background:var(--ink2);animation:ccDot 1.2s infinite ease-in-out}
.cc-typing i:nth-child(2){animation-delay:.15s}.cc-typing i:nth-child(3){animation-delay:.3s}
@keyframes ccDot{0%,80%,100%{opacity:.25}40%{opacity:1}}
.cc-empty{margin:auto;max-width:360px;text-align:center;display:grid;gap:6px;color:var(--ink2);font-size:14px}
.cc-empty b{color:var(--ink);font-size:15px}
.cc-notes{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px;background:var(--cream);font-size:13px}
.cc-notes[hidden]{display:none}
.cc-who{color:var(--ink2)}
.cc-form{display:flex;gap:10px;align-items:flex-end;padding:12px 14px;border-top:1px solid var(--line)}
.cc-form textarea{min-height:44px;max-height:180px;resize:none;flex:1}
.cc-send{flex:none}

.cc-opts .cc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.cc-opts .cc-grid a{display:grid;gap:4px;color:var(--ink);text-decoration:none;font-size:12px}
.cc-opts .cc-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:8px;background:var(--bg);border:1px solid var(--line)}
.cc-opts h2 .more a{color:var(--ink2)}

/* phones + narrow windows: tabs */
@media (max-width:1099px){
  .cc-tabs{display:inline-flex;justify-self:start}
  .cc-split[data-tab=chat] .cc-task,.cc-split[data-tab=task] .cc-chat{display:none}
  .cc-chat{height:calc(100dvh - 190px);min-height:420px}
}
/* desktop: chat column pinned to the viewport, task scrolls */
@media (min-width:1100px){
  .cc-split{grid-template-columns:minmax(380px,1fr) minmax(0,1.15fr)}
  .cc-chat{position:sticky;top:24px;height:calc(100vh - 48px)}
}
@media (min-width:1800px){
  .cc-split{grid-template-columns:minmax(480px,1fr) minmax(0,1fr);max-width:2000px}
}
.cc-crumb{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.cc-crumb:hover{text-decoration-color:var(--ink2)}
.cc-close{display:flex;gap:8px;margin-top:6px}
