/* Efficiency and cost (efficiency.js): resolved rate against active minutes, one logo per assistant */
#lb-eff p.lead{margin:0 0 14px;color:var(--ink2);font-size:15px;line-height:1.65;max-width:none}
#lb-eff p.lead b{color:var(--ink);font-weight:600}
#lb-eff .eff-title{margin:6px 0 0;color:var(--ink);font-size:15px;font-weight:600}
.eff-wrap{position:relative;padding:30px 8px 46px 44px}
.eff-plot{position:relative;height:clamp(260px,34vw,360px);border-left:1px solid var(--axis);border-bottom:1px solid var(--axis)}
.eff-gy,.eff-gx{position:absolute;background:var(--grid)}
.eff-gy{left:0;right:0;height:1px}
.eff-gx{top:0;bottom:0;width:1px}
.eff-gy b,.eff-gx b{position:absolute;font-weight:400;font-style:normal;font-size:12.5px;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap}
.eff-gy b{right:calc(100% + 8px);transform:translateY(-50%)}
.eff-gx b{top:calc(100% + 6px);transform:translateX(-50%)}
.eff-dot{position:absolute;width:var(--s);height:var(--s);transform:translate(-50%,50%);display:block;z-index:1}
.eff-dot img{width:100%;height:100%;border-radius:24%;display:block;box-shadow:0 0 0 2px var(--surface),0 2px 10px rgba(0,0,0,.35);background:#fff}
.eff-dot:hover,.eff-dot.on{z-index:2}
.eff-dot:focus-visible{outline:none}
.eff-dot:hover img,.eff-dot.on img,.eff-dot:focus-visible img{box-shadow:0 0 0 2px var(--accent),0 2px 12px rgba(0,0,0,.45)}
.eff-name{position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);font-size:12.5px;color:var(--ink);white-space:nowrap}
.eff-dot.flip .eff-name{left:auto;right:calc(100% + 8px)}
.eff-ylab,.eff-xlab{position:absolute;font-size:12.5px;color:var(--ink2)}
.eff-ylab{left:0;top:4px}
.eff-xlab{left:50%;transform:translateX(-50%);bottom:4px}
.eff-key{margin:2px 0 0;color:var(--ink2);font-size:12.5px}
#lb-eff figure{margin:0}
#lb-eff figcaption{margin-top:8px;color:var(--muted);font-size:12.5px;line-height:1.5}
#lb-eff p.after{margin:16px 0 0;color:var(--ink2);font-size:15px;line-height:1.65}
#lb-eff p.after b{color:var(--ink);font-weight:600}
@media (max-width:560px){.eff-name{display:none}.eff-wrap{padding-left:38px}.eff-dot::before{content:"";position:absolute;inset:-9px}}

/* efficiency chart: a wash that brightens toward the top right, where an assistant is both fast and right */
.eff-plot { background: linear-gradient(to top left, rgba(239, 107, 107, 0.20) 0%, rgba(239, 107, 107, 0) 40%, rgba(110, 200, 140, 0) 52%, rgba(110, 200, 140, 0.36) 100%); border-radius: 6px 0 0 0; }
.eff-better { position: absolute; top: 8px; left: 10px; color: #6ec88c; font: 600 0.72rem/1 Inter, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; pointer-events: none; }
#lb-eff .eff-wrap { padding-bottom: 54px; }
#lb-eff .eff-xlab { left: 50%; right: auto; transform: translateX(-50%); bottom: 4px; white-space: nowrap; }

/* hover card for a logo, as in the post */
.eff-tip { position: fixed; z-index: 40; max-width: 260px; padding: 9px 12px; border: 1px solid rgba(74, 143, 194, 0.35); border-radius: 9px; background: #1c1c1c; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45); color: #b0b0b0; font-size: 13px; line-height: 1.45; pointer-events: none; }
.eff-tip b { display: block; color: #f5f5f5; font-weight: 600; }
.eff-tip[hidden] { display: none; }
#lb-eff .eff-dot { cursor: default; }

/* the logo under the pointer (or opened by tap or keyboard) grows, the others fade */
.eff-dot { transition: scale .18s ease, opacity .18s; }
.eff-dot:hover, .eff-dot.on { scale: 1.25; }
.eff-plot:has(.eff-dot:hover) .eff-dot:not(:hover), .eff-plot:has(.eff-dot.on) .eff-dot:not(.on):not(:hover) { opacity: 0.45; }
@media (prefers-reduced-motion: reduce) { .eff-dot { transition: none; } }

/* chart text: larger and white, like the radar profiles */
.eff-gy b,.eff-gx b,.eff-ylab,.eff-xlab,.eff-key{color:#fff;font-size:14px}
.eff-name{color:#fff;font-size:14.5px;font-weight:500}