/* HeroX HQ 4.9 — Sales CRM board + deal page. Pipedrive's layout, sizes and behaviour (docs/pipedrive-replica-spec.md §1, §3, §7),
   HQ's own palette and icons. Roles: positive = --ok (Won, "+ Deal", passed stages), negative = --bad (Lost, rotting, overdue),
   selection = --action. */
.cb{font-size:14px;color:var(--ink)}
.cb-h1{font-size:20px;font-weight:600;margin:0 0 10px;line-height:28px}
.cb-banner{display:flex;align-items:center;gap:10px;padding:7px 12px;border:1px solid color-mix(in srgb,var(--info) 25%,transparent);background:var(--info-soft);color:var(--info);border-radius:8px;font-size:12.5px;margin-bottom:10px}
.cb-banner .sp{flex:1}.cb-banner button{background:none;border:0;color:inherit;cursor:pointer;font-size:18px;line-height:1;padding:0 2px}
.cb-ic{display:inline-flex;width:16px;height:16px;flex:none}.cb-ic svg{width:100%;height:100%}
.cb-ic.s{width:14px;height:14px}.cb-ic.l{width:20px;height:20px}
.cb-tb{display:flex;align-items:center;gap:8px;min-height:32px;flex-wrap:wrap}
.cb-tb2{display:flex;align-items:center;gap:8px;min-height:24px;margin-top:8px;flex-wrap:wrap}
.cb-tb .sp,.cb-tb2 .sp{flex:1}
.cb-seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--surface);height:32px;box-sizing:border-box}
.cb-seg button{width:48px;height:30px;border:0;border-right:1px solid var(--border);background:none;color:var(--ink2);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.cb-seg button:last-child{border-right:0}.cb-seg button:hover{background:var(--surface2)}
.cb-seg button.on{background:var(--action-soft);color:var(--action);box-shadow:inset 0 0 0 1px var(--action)}
.cb-btn{height:32px;box-sizing:border-box;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--ink);font:inherit;font-size:14px;font-weight:600;padding:0 12px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;max-width:260px}
.cb-btn>span.tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-btn:hover{background:var(--surface2)}
.cb-btn.pri{background:var(--ok);border-color:var(--ok);color:#fff}.cb-btn.pri:hover{filter:brightness(.92)}
.cb-btn.neg{background:var(--bad);border-color:var(--bad);color:#fff}.cb-btn.neg:hover{filter:brightness(.92)}
.cb-btn.on{background:var(--action-soft);border-color:var(--action);color:var(--action)}
.cb-btn.ico{width:34px;padding:0;justify-content:center}
.cb-btn.sm{height:24px;border-radius:6px;font-size:12px;padding:0 8px}
.cb-btn[disabled]{opacity:.55;cursor:default}
.cb-join{display:inline-flex}.cb-join>.cb-btn:first-child{border-radius:8px 0 0 8px}
.cb-join>.cb-btn+.cb-btn{border-radius:0 8px 8px 0;margin-left:-1px;width:33px;padding:0;justify-content:center}
.cb-join.split>.cb-btn+.cb-btn{margin-left:1px;width:32px}
.cb-chip{height:24px;border-radius:6px;border:0;background:none;font:inherit;font-size:12px;font-weight:600;color:var(--ink2);padding:0 8px;display:inline-flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap}
.cb-chip:hover{background:var(--surface2)}.cb-chip.on{background:var(--action-soft);color:var(--action)}
.cb-chip.ico{width:24px;padding:0;justify-content:center}
.cb-count{font-size:14px;color:var(--ink2);display:inline-flex;align-items:center;gap:2px;font-weight:450}
.cb-count button{border:0;background:none;color:var(--ink3);cursor:pointer;display:inline-flex;padding:2px;border-radius:50%}.cb-count button:hover{color:var(--ink);background:var(--surface2)}
.cb-next{font-size:10px;font-weight:600;text-transform:uppercase;color:var(--ink3);border:1px solid var(--border);border-radius:99px;padding:0 5px;margin-left:4px}
/* board */
.cb-board{display:flex;gap:8px;overflow:auto;margin-top:10px;align-items:stretch;position:relative;padding-bottom:4px}
.cb-col{flex:1 1 0;min-width:140px;display:flex;flex-direction:column;background:var(--surface2);border-radius:4px 4px 0 0}
.cb-ch{position:sticky;top:0;z-index:2;height:62px;box-sizing:border-box;padding:10px 20px 0 12px;background:var(--grey-soft);border-radius:4px 0 0 0;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,0 100%)}
.cb-ch .n{font-size:16px;line-height:24px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-ch .s{font-size:12px;line-height:18px;color:var(--ink2);display:flex;align-items:center;gap:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-cards{padding:8px 6px;display:flex;flex-direction:column;gap:4px;flex:1;min-height:120px}
.cb-col.dropok .cb-cards{background:color-mix(in srgb,var(--action) 8%,transparent);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--action) 45%,transparent);border-radius:4px}
.cb-card{display:block;background:var(--surface);border-radius:6px;padding:6px 8px;box-shadow:0 0 1px 1px rgba(0,0,0,.05),0 1px 2px -2px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.07);color:var(--ink);text-decoration:none;cursor:pointer;position:relative}
.cb-card:hover{box-shadow:0 3px 5px rgba(0,0,0,.08),0 0 4px rgba(0,0,0,.12);text-decoration:none}
.cb-card.rot{background:var(--bad-soft)}
.cb-card.dragging{opacity:.35}
.cb-card .t{font-size:14px;font-weight:600;line-height:21px;word-break:break-word}
.cb-card .m{font-size:12px;color:var(--ink2);line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-card .m.ecd{display:flex;align-items:center;gap:3px}.cb-card .m.ecd.past{color:var(--bad)}
.cb-card .v{font-size:11px;font-weight:600;color:var(--ink2);line-height:16px}
.cb-card .b{display:flex;align-items:center;justify-content:space-between;margin-top:2px;min-height:18px}
.cb-card .b .av{width:16px;height:16px;font-size:7.5px}
.cb-pill{display:inline-block;height:16px;line-height:16px;border-radius:99px;padding:0 6px;font-size:10px;font-weight:600;text-transform:uppercase;color:#fff;background:var(--bad);vertical-align:1px}
.cb-pill.rp{text-transform:none}.cb-pill.won{background:var(--ok)}.cb-pill.lost{background:var(--ink3)}.cb-pill.over{background:var(--bad)}
.cb-lbls{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0}
.cb-lbl{display:inline-block;font-size:10px;font-weight:600;text-transform:uppercase;border-radius:99px;padding:0 6px;height:16px;line-height:16px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-lbl.green{background:var(--ok-soft);color:var(--ok)}.cb-lbl.blue{background:var(--info-soft);color:var(--info)}.cb-lbl.red{background:var(--bad-soft);color:var(--bad)}.cb-lbl.yellow{background:var(--warn-soft);color:var(--warn)}.cb-lbl.purple{background:var(--pur-soft);color:var(--pur)}.cb-lbl.gray{background:var(--grey-soft);color:var(--ink2)}
.cb-as{width:18px;height:18px;border:0;padding:1px;background:none;cursor:pointer;display:inline-flex;border-radius:50%}
.cb-as svg{width:16px;height:16px}
.cb-as.none{color:#d9a400}.cb-as.plan{color:var(--ink3)}.cb-as.today{color:var(--ok)}.cb-as.over{color:var(--bad)}
.cb-as:hover{background:var(--surface2)}
.cb-add{opacity:0;align-self:center;margin-top:2px;height:24px;width:100%;border:0;border-radius:6px;background:none;color:var(--ink2);cursor:pointer;display:flex;align-items:center;justify-content:center}
.cb-col:hover .cb-add{opacity:1}.cb-add:hover{background:var(--grey-soft)}
.cb-more{border:0;background:none;color:var(--action);font:inherit;font-size:12px;font-weight:600;cursor:pointer;padding:6px}
.cb-skel{height:64px;border-radius:6px;background:linear-gradient(90deg,var(--surface) 0%,var(--grey-soft) 50%,var(--surface) 100%);background-size:200% 100%;animation:cbsk 1.2s infinite linear}
@keyframes cbsk{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* the bar that slides up while you drag a card */
.cb-dropbar{position:fixed;bottom:0;display:flex;gap:8px;padding:8px;box-sizing:border-box;background:var(--surface);box-shadow:0 -4px 16px rgba(0,0,0,.12);border-radius:12px 12px 0 0;transform:translateY(110%);transition:transform .15s ease;z-index:300}
.cb-dropbar.on{transform:none}
.cb-dz{flex:1;height:56px;border:2px dashed var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;gap:6px;font-weight:600;font-size:14px;color:var(--ink2);background:var(--surface)}
.cb-dz.lost{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,transparent)}.cb-dz.won{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,transparent)}
.cb-dz.hov{background:var(--surface2);border-style:solid}.cb-dz.lost.hov{background:var(--bad-soft)}.cb-dz.won.hov{background:var(--ok-soft)}
/* popovers & menus */
.cb-pop{position:fixed;z-index:400;background:var(--surface);color:var(--ink);border-radius:12px;box-shadow:0 0 2px rgba(0,0,0,.24),0 8px 10px 1px rgba(0,0,0,.05),0 3px 14px 2px rgba(0,0,0,.06);max-height:70vh;overflow:auto;padding:6px 0;box-sizing:border-box;font-size:14px}
.cb-pop .ps{display:block;margin:2px 8px 6px;height:32px;box-sizing:border-box;width:calc(100% - 16px);border:1px solid var(--border);border-radius:8px;padding:0 10px;font:inherit;font-size:14px;background:var(--surface);color:var(--ink);outline:0}
.cb-pop .ps:focus{border-color:var(--action)}
.cb-pop .sh{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:var(--ink3);background:var(--surface2);padding:6px 12px;margin:4px 0}
.cb-pop .row{min-height:33px;padding:0 12px;display:flex;align-items:center;gap:8px;cursor:pointer;line-height:1.3}
.cb-pop .row .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-pop .row:hover,.cb-pop .row.hi{background:var(--action);color:#fff}.cb-pop .row:hover .mut{color:#fff}
.cb-pop .row.dis{cursor:default;color:var(--ink3)}.cb-pop .row.dis:hover{background:none;color:var(--ink3)}
.cb-pop .row .ck{color:var(--action);display:none}.cb-pop .row.sel .ck{display:inline-flex}.cb-pop .row.sel:hover .ck{color:#fff}
.cb-pop .row .av{width:20px;height:20px;font-size:8.5px}
.cb-pop .mut{color:var(--ink3);font-size:12px}
.cb-pop hr{border:0;border-top:1px solid var(--border);margin:6px 0}
.cb-pop .lk{color:var(--action);font-weight:600}
.cb-pop .tabs3{display:flex;gap:4px;padding:0 8px 6px}.cb-pop .tabs3 button{flex:1;height:30px;border:1px solid var(--border);background:var(--surface);border-radius:8px;cursor:pointer;color:var(--ink2);display:flex;align-items:center;justify-content:center}
.cb-pop .tabs3 button.on{background:var(--action-soft);border-color:var(--action);color:var(--action)}
.cb-pop .tot{padding:6px 14px 10px}.cb-pop .tot .big{font-size:21px;line-height:32px}
.cb-pop table{width:100%;border-collapse:collapse;font-size:13px}.cb-pop td{padding:4px 14px}.cb-pop td.r{text-align:right}
.cb-pop .act{display:grid;grid-template-columns:20px 18px 1fr;gap:8px;align-items:start;padding:8px 12px}
.cb-pop .act .st{font-size:14px;font-weight:600}.cb-pop .act .cmt{font-size:12px;color:var(--ink3)}.cb-pop .act .cmt.over{color:var(--bad)}
.cb-ring{width:16px;height:16px;border:1.5px solid var(--ink3);border-radius:50%;box-sizing:border-box;margin-top:2px;cursor:pointer}
/* deal page */
.cd-hd{background:var(--surface);border:1px solid var(--border);border-radius:12px 12px 0 0;padding:14px 16px 10px}
.cd-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cd-title{font-size:25px;line-height:38px;font-weight:400;flex:1;min-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-owner{display:flex;align-items:center;gap:8px;margin-right:4px}.cd-owner .av{width:32px;height:32px;font-size:12px}
.cd-owner b{font-size:14px;display:block;line-height:18px}.cd-owner span{font-size:12px;color:var(--ink3)}
.cd-badge{height:24px;line-height:24px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;color:#fff}
.cd-badge.won{background:var(--ok)}.cd-badge.lost{background:var(--bad)}.cd-badge.deleted{background:var(--ink3)}
.cd-sbar{display:flex;align-items:center;gap:12px;margin-top:12px}
.cd-stages{display:flex;flex:1;min-width:0}
.cd-st{flex:0 1 146px;min-width:44px;height:24px;line-height:24px;font-size:12px;padding:0 12px 0 16px;box-sizing:border-box;background:var(--grey-soft);color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%,8px 50%);margin-right:-5px;cursor:pointer;border:0;font-family:inherit;text-align:left}
.cd-st:first-child{clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%);padding-left:10px;border-radius:4px 0 0 4px}
.cd-st:last-child{margin-right:0}
.cd-st.done,.cd-st.cur{background:var(--ok);color:#fff}
.cd-st:hover{filter:brightness(.96)}
.cd-crumb{margin-top:8px;display:flex}
.cd-crumb button{border:0;background:none;font:inherit;font-size:12px;color:var(--ink2);height:24px;padding:0 6px;border-radius:6px;cursor:pointer}.cd-crumb button:hover{background:var(--surface2)}
.cd-body{display:grid;grid-template-columns:401px minmax(0,1fr);border:1px solid var(--border);border-top:0;border-radius:0 0 12px 12px;overflow:hidden}
.cd-side{background:var(--surface);border-right:1px solid var(--border);overflow:auto;padding:12px 0 16px}
.cd-main{background:var(--surface2);padding:24px;overflow:auto}
.cd-ff{display:block;margin:0 16px 8px;height:32px;width:calc(100% - 32px);box-sizing:border-box;border:1px solid var(--border);border-radius:8px;padding:0 10px;font:inherit;font-size:14px;background:var(--surface);color:var(--ink)}
.cd-sec{border-bottom:1px solid var(--border);padding:6px 8px 8px}
.cd-sec>h3{font-size:16px;line-height:24px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ink);margin:2px 8px 4px;display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.cd-sec>h3 .cv{display:inline-flex;transition:transform .12s}.cd-sec.closed>h3 .cv{transform:rotate(-90deg)}
.cd-sec>h3 .sp{flex:1}.cd-sec>h3 .hx{opacity:0;color:var(--ink3);display:inline-flex}.cd-sec:hover>h3 .hx{opacity:1}
.cd-sec.closed>.cd-sb{display:none}
.cd-sec.fill{box-shadow:inset 3px 0 0 #f0a020}
.cd-f{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;padding:5px 30px 5px 8px;border-radius:6px;position:relative}
.cd-f:hover{background:var(--surface2)}
.cd-f .l{font-size:12px;color:var(--ink3);text-align:right;line-height:18px;word-break:break-word}
.cd-f .l.imp:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#f0a020;margin-right:5px;vertical-align:1px}
.cd-f .x{font-size:14px;line-height:20px;word-break:break-word}.cd-f .x.e{color:var(--ink3)}
.cd-f .pen{position:absolute;right:8px;top:6px;opacity:0;border:0;background:none;color:var(--ink3);cursor:pointer;padding:0;display:inline-flex}
.cd-f:hover .pen{opacity:1}
.cd-sum{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:8px;align-items:center;padding:5px 8px;border-radius:6px;font-size:14px}
.cd-sum:hover{background:var(--surface2)}.cd-sum .i{color:var(--ink3);display:inline-flex}.cd-sum .a{font-size:12px}
.cd-lnk{color:var(--action);font-weight:600;cursor:pointer}
.cd-grp{border:1px solid var(--border);border-radius:8px;margin:6px 8px}
.cd-grp>.gh{display:flex;align-items:center;gap:6px;padding:6px 10px;font-weight:600;font-size:14px;cursor:pointer;user-select:none}
.cd-grp>.gh .c{font-size:12px;color:var(--ink3);font-weight:450}.cd-grp.closed>.gb{display:none}
.cd-grp>.gh .cv{display:inline-flex;transition:transform .12s}.cd-grp.closed>.gh .cv{transform:rotate(-90deg)}
.cd-foot{font-size:12px;color:var(--ink3);padding:10px 16px 0;line-height:18px}
.cd-comp{background:var(--surface);border-radius:8px;box-shadow:0 0 1px 1px rgba(0,0,0,.05),0 1px 3px rgba(0,0,0,.07)}
.cd-tabs{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--border);padding:0 4px}
.cd-tabs button{height:40px;padding:6px 12px;font:inherit;font-size:14px;border:0;background:none;color:var(--ink2);border-bottom:2px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.cd-tabs button.on{color:var(--action);border-bottom-color:var(--action);background:var(--action-soft)}
.cd-ph{min-height:60px;box-sizing:border-box;padding:18px 16px;color:var(--ink3);cursor:text}
.cd-ph.msg{color:var(--info);background:var(--info-soft);cursor:default;border-radius:0 0 8px 8px}
.cd-h{font-size:16px;font-weight:600;margin:24px 0 10px;display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.cd-h .cv{display:inline-flex;transition:transform .12s}.cd-h.closed .cv{transform:rotate(-90deg)}
.cd-chips{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 12px 56px}
.cd-it{display:grid;grid-template-columns:56px minmax(0,1fr);position:relative;padding-bottom:12px}
.cd-it .g{display:flex;justify-content:center;position:relative}
.cd-it .g:after{content:'';position:absolute;top:34px;bottom:-2px;left:50%;border-left:1px dashed var(--border)}
.cd-it:last-child .g:after{display:none}
.cd-it .ci{width:32px;height:32px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink2);box-sizing:border-box;position:relative;z-index:1}
.cd-it .ci svg{width:16px;height:16px}
.cd-it.dot .ci{width:10px;height:10px;margin-top:11px;background:var(--ink3);border:0}
.cd-it .cc{background:var(--surface);border-radius:8px;box-shadow:0 0 1px 1px rgba(0,0,0,.05),0 1px 3px rgba(0,0,0,.07);padding:10px 12px;max-width:640px;position:relative}
.cd-it.dot .cc{background:none;box-shadow:none;padding:4px 0}
.cd-it.note .cc{background:color-mix(in srgb,#ffd84a 22%,var(--surface))}
.cd-it .tt{font-size:16px;line-height:24px;font-weight:600;display:flex;align-items:center;gap:6px;padding-right:28px}
.cd-it.dot .tt{font-size:14px;font-weight:450}
.cd-it .cmt{font-size:12px;line-height:18px;color:var(--ink3);display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.cd-it .cmt .over{color:var(--bad)}.cd-it .cmt .cb-pill.over{color:#fff}
.cd-it .bx{margin-top:6px;font-size:14px;line-height:21px;word-break:break-word}
.cd-it .bx.clamp{max-height:84px;overflow:hidden}
.cd-it .nb{margin-top:6px;background:color-mix(in srgb,#ffd84a 22%,var(--surface));border-radius:6px;padding:6px 8px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-it .dots{position:absolute;right:8px;top:8px;border:0;background:none;color:var(--ink3);cursor:pointer;display:inline-flex;padding:2px;border-radius:6px}
.cd-it .dots:hover{background:var(--surface2)}
.cd-ok{color:var(--ok);display:inline-flex}
.cd-empty{margin-left:56px;color:var(--ink3);font-size:13px;padding:6px 0 12px}
.cd-q{font-size:13px}.cd-q a{font-weight:600}
@media (max-width:980px){.cd-body{grid-template-columns:1fr}.cd-side{border-right:0;border-bottom:1px solid var(--border)}}
/* ---------- slice 2: activity form, popover, Activities page, Add deal, quick add, composer (§3.4, §7.4, §8, §11, §2.5) ---------- */
.cb-ring:hover{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent)}.cb-ring.busy{opacity:.4;pointer-events:none}.cb-ring.on{background:var(--ok);border-color:var(--ok)}
.cb-pop .act .ab{cursor:pointer;min-width:0}.cb-pop .act .ab:hover .st{color:var(--action);text-decoration:underline}
.af{font-size:14px;color:var(--ink)}.af-body{display:flex;gap:16px;align-items:flex-start}.af-l{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.af.compact .af-l{gap:7px}
.af-subj{font:inherit;font-size:16px;font-weight:600;height:40px;border:1px solid var(--border);border-radius:8px;padding:0 12px;background:var(--surface);color:var(--ink);outline:0}.af-subj:focus,.af .in:focus{border-color:var(--action)}
.af-types{display:flex;flex-wrap:wrap;gap:4px}.af-ty{width:32px;height:32px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.af-ty svg{width:16px;height:16px}
.af-ty:hover{background:var(--surface2)}.af-ty.on{background:var(--action-soft);border-color:var(--action);color:var(--action)}
.af-r{display:flex;align-items:center;gap:8px;min-height:32px;flex-wrap:wrap}.af-r .in{height:32px;box-sizing:border-box;border-radius:8px;font-size:14px}.af-r select.in{min-width:150px}
.af-i{width:20px;display:inline-flex;justify-content:center;color:var(--ink3);flex:none}.af-when input[type=date]{width:150px}.af-when input[type=time]{width:104px}.af-dur{font-size:12px}
.af-note{font:inherit;font-size:14px;border:1px solid color-mix(in srgb,#e6c34a 55%,var(--border));border-radius:8px;padding:8px 10px;background:color-mix(in srgb,#ffd84a 16%,var(--surface));color:var(--ink);resize:vertical;min-height:64px;outline:0}
.af-lk{flex-wrap:nowrap}.af-pick{flex:1;min-width:0;position:relative}.af-pick .af-q{width:100%}
.af-chip{display:inline-flex;align-items:center;gap:6px;height:28px;max-width:100%;padding:0 4px 0 8px;border:1px solid var(--border);border-radius:99px;background:var(--surface2);font-size:13px;box-sizing:border-box}
.af-chip .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.af-chip button{border:0;background:none;color:var(--ink3);cursor:pointer;font-size:16px;line-height:1;padding:0 4px;border-radius:50%}.af-chip button:hover{color:var(--bad)}
.af-dd{position:absolute;left:0;right:0;top:calc(100% + 2px);z-index:420;background:var(--surface);border-radius:8px;box-shadow:0 0 2px rgba(0,0,0,.24),0 8px 14px rgba(0,0,0,.08);max-height:240px;overflow:auto;padding:4px 0}
.af-o{padding:6px 12px;cursor:pointer;font-size:14px}.af-o .mut{font-size:12px;color:var(--ink3)}.af-o:hover,.af-o.hi{background:var(--action);color:#fff}.af-o:hover .mut,.af-o.hi .mut{color:#fff}
.af-o.new{position:sticky;bottom:-4px;background:var(--surface);border-top:1px solid var(--border);color:var(--action);display:flex;align-items:center;gap:6px}.af-o.new:hover{background:var(--action);color:#fff}
.af-cal{width:230px;flex:none;border-left:1px solid var(--border);padding-left:14px;font-size:13px;max-height:460px;overflow:auto}
.af-ch{display:flex;align-items:center;gap:6px;margin-bottom:8px}.af-ch b{flex:1;text-align:center;font-size:13px}.af-ch button{border:1px solid var(--border);background:var(--surface);border-radius:6px;width:26px;height:26px;cursor:pointer;color:var(--ink2)}
.af-cg{font-size:11px;font-weight:600;text-transform:uppercase;color:var(--ink3);margin:4px 0}
.af-ci{display:flex;align-items:center;gap:6px;padding:5px 6px;margin-bottom:3px;border-radius:6px;background:var(--info-soft);color:var(--ink)}.af-ci .tm{width:38px;flex:none;font-size:12px;color:var(--ink3)}.af-ci .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.af-ci.me{background:color-mix(in srgb,var(--ok) 16%,var(--surface));outline:1px dashed var(--ok)}.af-ci.done .tx{text-decoration:line-through;color:var(--ink3)}
.af-now{position:relative;height:0;border-top:2px solid var(--bad);margin:7px 0}.af-now span{position:absolute;left:0;top:-9px;font-size:10px;color:#fff;background:var(--bad);border-radius:4px;padding:0 4px}
.af-err{margin-top:8px;color:var(--bad);font-size:13px}.af .in.bad,.ad .in.bad{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.af-ft{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}.af-ft .sp{flex:1}.af-done{display:inline-flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}
.af-msg{font-size:12.5px;color:var(--info);max-width:320px}
.af-pop{padding:10px 14px}.af-fu{padding:12px 14px}.af-fu .h{display:flex;align-items:center;gap:6px;color:var(--ok);font-weight:600}.af-fu .st{margin:4px 0 10px 22px;font-size:13px}.af-fu .q{font-weight:600;margin-bottom:10px}.af-fu .b{display:flex;justify-content:flex-end;gap:8px}
#mbox.crm-am{max-width:900px;width:94vw}#mbox.crm-ad{max-width:820px;width:94vw}
.cd-ph.open{cursor:default;padding:14px 16px}.cd-ae{cursor:pointer}.cd-ae:hover{color:var(--action);text-decoration:underline}
.ne-tb{display:flex;gap:2px;margin-bottom:6px}.ne-tb button{min-width:30px;height:28px;border:1px solid transparent;border-radius:6px;background:none;color:var(--ink2);cursor:pointer;font-size:13px}.ne-tb button:hover{background:var(--surface2);border-color:var(--border)}
.ne-ed{min-height:96px;border:1px solid color-mix(in srgb,#e6c34a 55%,var(--border));border-radius:8px;padding:10px 12px;background:color-mix(in srgb,#ffd84a 16%,var(--surface));outline:0;line-height:1.5}.ne-ed:empty:before{content:attr(data-ph);color:var(--ink3)}
.ag-wrap{border:1px solid var(--border);border-radius:8px;overflow:auto;background:var(--surface);max-height:calc(100vh - 230px)}
.ag-t{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:14px}
.ag-t th{position:sticky;top:0;z-index:1;background:var(--surface2);text-align:left;font-size:12px;font-weight:600;color:var(--ink2);height:31px;padding:0 10px;border-bottom:1px solid var(--border);white-space:nowrap}
.ag-t td{height:31px;padding:0 10px;border-bottom:1px solid var(--border);white-space:nowrap;max-width:260px;overflow:hidden;text-overflow:ellipsis}
.ag-t td.c,.ag-t th.c{width:56px;text-align:center}.ag-t td.c .cb-ring{display:inline-block;margin:0;vertical-align:middle}.ag-t td.c .cd-ok{display:inline-flex;color:var(--ok);cursor:pointer}
.ag-t tr:hover td{background:var(--surface2)}.ag-t a{color:var(--action);text-decoration:none}.ag-t a:not([href]){color:inherit}.ag-t a[href]:hover{text-decoration:underline}
.ag-s{display:inline-flex;align-items:center;gap:6px;cursor:pointer;max-width:240px}.ag-s .tx{overflow:hidden;text-overflow:ellipsis}.ag-s:hover .tx{text-decoration:underline;color:var(--action)}
.ag-t tr.over .ag-s,.ag-t tr.over td.hl,.ag-t tr.over td.hl a{color:var(--bad)}.ag-t tr.isdone .ag-s .tx{text-decoration:line-through;color:var(--ink3)}
.ag-t td.nt{max-width:220px;color:var(--ink2)}
select.cb-chip.ag-st{height:24px;padding:0 6px;font:inherit;font-size:12px}
.ad{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px}.ad-l{display:flex;flex-direction:column;gap:12px}.ad-r{border-left:1px solid var(--border);padding-left:18px;display:flex;flex-direction:column;gap:12px}
.ad-f{display:flex;flex-direction:column;gap:4px}.ad-lb{font-size:13px;font-weight:600;color:var(--ink2)}.ad .in{height:32px;box-sizing:border-box;border-radius:8px}.ad textarea.in{height:auto}
.ad-two{display:flex;gap:6px;align-items:center}.ad-two .in:first-child{flex:1}.ad-e{color:var(--bad);font-size:12px;min-height:0}.ad-e:empty{display:none}
.ad-stg{height:24px}.ad-stg .cd-st{height:24px;min-width:46px;cursor:pointer}.ad-h{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--ink3);border-bottom:1px solid var(--border);padding-bottom:4px}
.ad-set{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:13px}.ad-set label{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.crm-qa{width:32px;height:32px;border-radius:50%;border:0;background:var(--ok);color:#fff;font-size:22px;line-height:1;cursor:pointer;margin-right:10px;display:inline-flex;align-items:center;justify-content:center;flex:none}.crm-qa .p{display:inline-block;transition:transform .15s}.crm-qa.open .p{transform:rotate(45deg)}
.cb-pop .row .qk{font-size:12px}
@media (max-width:760px){.af-body{flex-direction:column}.af-cal{width:auto;border-left:0;padding-left:0;border-top:1px solid var(--border);padding-top:10px}.ad{grid-template-columns:1fr}.ad-r{border-left:0;padding-left:0}}
.af-r{flex-wrap:nowrap}.af-r>.in{width:auto;flex:none;min-width:0}.af-r>input.in[data-f="location"],.af-r>select.in[data-f="owner"]{flex:1 1 auto}.af-r>select.in[data-f="priority"],.af-r>select.af-busy{width:170px;min-width:0}
.af-when{flex-wrap:wrap}.af.compact .af-when input[type=date]{width:140px}.af.compact .af-when input[type=time]{width:96px}
.af-r[hidden],.ad-f[hidden],.af [hidden]{display:none!important}