/* =====================================================================================
 *  My Tasks (.tk) — Signal design language. Verbatim translation of
 *  docs/design/mytasks/My Tasks.dc.html into a real Durandal/Knockout module.
 *  In-slot (fills the App Shell content slot). Tokens are set on the .tk root via
 *  el.style.setProperty in compositionComplete (light + dark, mirrors shell theme).
 *  This file carries the fonts + the design's hover/animation rules only.
 * ===================================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

.tk-root *{box-sizing:border-box}
.tk-root ::selection{background:#C2CCFB}
.tk-scroll::-webkit-scrollbar{width:10px;height:10px}
.tk-scroll::-webkit-scrollbar-thumb{background:var(--border-strong,#cfd4e4);border-radius:99px;border:2px solid transparent;background-clip:content-box}
.tk-row{transition:background .12s}
.tk-row:hover{background:var(--surface-2,#FAFBFE)}
.tk-row:hover .tk-rowact{opacity:1}
.tk-act{transition:filter .14s}
.tk-act:hover{filter:brightness(.97)}
.tk-iconbtn{transition:background .12s,color .12s}
.tk-iconbtn:hover{background:var(--neutral-bg,#F1F2F6)}
.tk-del:hover{background:var(--bad-bg,#FCE7E7)!important;color:var(--bad-fg,#B3262B)!important}
.tk-agentrow{transition:background .1s}
.tk-agentrow:hover{background:var(--surface-2,#FAFBFE)}
.tk-menu{animation:tkpop .14s var(--ease,cubic-bezier(.2,.8,.2,1))}
@keyframes tkpop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes tkfade{from{opacity:0}to{opacity:1}}
.tk-circle:hover{border-color:var(--brand-500,#5E76EE)}