/* B241 · the OKR app as it will work: inside the team's chat, a request in, the work done, a person approves */
.tm{--tm-bg:#f5f5f7;--tm-rail:#1b1d2a;--tm-line:#e4e4ea;--tm-ink:#1d1d24;--tm-mute:#6b6b78;--tm-ai:#1559f5;border-radius:18px;overflow:hidden;background:var(--tm-bg);border:1px solid var(--px-line2);box-shadow:0 1px 0 rgba(22,21,20,.04),0 60px 120px -60px rgba(11,21,48,.55),0 30px 60px -36px rgba(21,89,245,.32);display:grid;grid-template-columns:64px 230px minmax(0,1fr);min-height:560px;font:400 14px/1.45 var(--px-sans);color:var(--tm-ink)}
.tm-rail{background:var(--tm-rail);display:flex;flex-direction:column;align-items:center;gap:14px;padding:16px 0}
.tm-rail i{width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.08)}
.tm-rail i.on{background:rgba(255,255,255,.2);box-shadow:inset 3px 0 0 #8fb0ff}
.tm-side{background:#fbfbfd;border-right:1px solid var(--tm-line);padding:16px 12px}
.tm-team{font:600 13px/1.2 var(--px-sans);margin:4px 8px 14px;color:var(--tm-ink)}
.tm-ch{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;color:var(--tm-mute);font-size:13.5px}
.tm-ch.on{background:#ececf3;color:var(--tm-ink);font-weight:500}
.tm-ch b{margin-left:auto;min-width:18px;height:18px;border-radius:9px;background:var(--tm-ai);color:#fff;font:600 11px/18px var(--px-sans);text-align:center}
.tm-main{display:flex;flex-direction:column;min-width:0}
.tm-top{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid var(--tm-line);background:#fff}
.tm-top h4{margin:0;font:600 15px/1.2 var(--px-sans)}
.tm-top span{color:var(--tm-mute);font-size:12.5px}
.tm-feed{flex:1;padding:18px 20px;display:flex;flex-direction:column;gap:16px;background:#fff}
.tm-msg{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px}
.tm-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:600 12px/1 var(--px-sans);color:#fff;background:#7a5af8}
.tm-av.ai{background:transparent;overflow:hidden}.tm-av.ai img{width:34px;height:34px;display:block}
.tm-who{font:600 13px/1.2 var(--px-sans);margin-bottom:4px}.tm-who span{font-weight:400;color:var(--tm-mute);margin-left:6px;font-size:12px}
.tm-who em{font-style:normal;font:500 10.5px/1 var(--px-sans);color:var(--tm-ai);background:rgba(21,89,245,.1);border-radius:4px;padding:3px 5px;margin-left:6px;vertical-align:1px}
.tm-text{margin:0;color:var(--tm-ink)}.tm-text .at{color:var(--tm-ai);font-weight:500}
.tm-card{margin-top:8px;border:1px solid var(--tm-line);border-radius:12px;overflow:hidden;max-width:560px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.tm-card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--tm-line);background:#fafbff}
.tm-card-h b{font:600 13.5px/1.2 var(--px-sans)}.tm-card-h span{font-size:12px;color:var(--tm-mute)}
.tm-card-b{padding:12px 14px;display:grid;gap:12px}
.tm-kr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.tm-kr p{margin:0;font-size:13px}.tm-kr strong{font:600 13px/1 var(--px-sans)}
.tm-bar{grid-column:1/-1;height:6px;border-radius:3px;background:#eef0f6;overflow:hidden}.tm-bar i{display:block;height:100%;background:var(--tm-ai);border-radius:3px}
.tm-st{font:500 11.5px/1 var(--px-sans);color:var(--tm-mute)}
.tm-sug{display:flex;align-items:flex-start;gap:8px;font-size:13px}.tm-sug i{flex:none;width:16px;height:16px;margin-top:1px;border:1.5px solid #c8cad6;border-radius:4px}
.tm-acts{display:flex;flex-wrap:wrap;gap:8px;padding:0 14px 14px}
.tm-btn{border:1px solid var(--tm-line);border-radius:8px;padding:7px 12px;font:500 12.5px/1 var(--px-sans);background:#fff;color:var(--tm-ink)}
.tm-btn.pri{background:var(--tm-ai);border-color:var(--tm-ai);color:#fff}
.tm-done{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--tm-mute);margin-top:6px}.tm-done i{width:8px;height:8px;border-radius:50%;background:var(--tm-ai)}
.tm-box{margin:0 20px 18px;border:1px solid var(--tm-line);border-radius:10px;padding:12px 14px;color:var(--tm-mute);font-size:13.5px;background:#fff}
.tm-cap{margin:14px 0 0;font:400 13.5px/1.5 var(--px-sans);color:var(--px-char)}
.tm-cap b{font-weight:500;color:var(--px-ink)}
@media (max-width:1000px){.tm{grid-template-columns:52px minmax(0,1fr)}.tm-side{display:none}}
@media (max-width:560px){.tm{grid-template-columns:minmax(0,1fr);min-height:0}.tm-rail{display:none}.tm-feed{padding:14px}.tm-box{margin:0 14px 14px}.tm-card-b,.tm-acts{padding-left:12px;padding-right:12px}}
/* B241 · in step with hvhh.ai's Team page: the same conversation, CultureAI's words in Source Serif */
.tm-text.say{font:400 15px/1.5 var(--px-serif);color:var(--tm-ink)}
.tm-did{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px}
.tm-did li{display:flex;align-items:flex-start;gap:8px}
.tm-did li::before,.tm-cleared::before{content:"";flex:none;width:14px;height:14px;margin-top:2px;border-radius:50%;background:var(--tm-ai) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M4 7.2l2 2 4-4.4' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.tm-cleared{display:flex;gap:8px}.tm-cleared::before{margin-top:4px}
.tm-ask{margin:0;padding-top:12px;border-top:1px solid var(--tm-line);font:400 14.5px/1.5 var(--px-serif);color:var(--tm-ink)}
.tm-scope{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 14px}
.tm-scope em{font:500 11.5px/1 var(--px-sans);font-style:normal;color:var(--tm-mute);border:1px solid var(--tm-line);border-radius:999px;padding:6px 10px}
.tm-scope em.on{color:var(--tm-ai);border-color:rgba(21,89,245,.4);background:rgba(21,89,245,.06)}
.tm-react{display:flex;gap:6px;margin:8px 0 0}.tm-react span{font:500 12px/1 var(--px-sans);border:1px solid var(--tm-line);border-radius:999px;padding:5px 8px;background:#fff}
