/* Timeline icon tones supplement the explanatory label, never replace it. */
#cs-root .tl-item .tl-dot{width:28px;min-width:28px;height:28px;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:50%;flex-shrink:0;}
#cs-root .tl-dot[data-tone="info"]{background:#eff6ff;border-color:#bfdbfe;}
#cs-root .tl-dot[data-tone="success"]{background:#f0fdf4;border-color:#bbf7d0;}
#cs-root .tl-dot[data-tone="purple"]{background:#f5f3ff;border-color:#ddd6fe;}
#cs-root .tl-dot[data-tone="warning"]{background:#fffbeb;border-color:#fde68a;}
#cs-root .tl-dot[data-tone="danger"]{background:#fef2f2;border-color:#fecaca;}
#cs-root .tl-dot[data-tone="neutral"]{background:#f1f5f9;border-color:#cbd5e1;}
#cs-root .tl-info{min-width:0;flex:1;}#cs-root .tl-item :is(.tl-action,.tl-detail,.tl-meta){overflow-wrap:anywhere;white-space:normal;}
#cs-root .tl-detail{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.45;}
body[data-theme="nuit"] #cs-root .tl-dot{background:var(--card2);border-color:var(--border2);}