/* Keep help separate from the action it explains, including on touch screens. */
body.team-workspace button.context-help {
  display:inline-flex; align-items:center; justify-content:center; vertical-align:middle;
  width:24px; height:24px; min-width:24px; min-height:24px; flex:0 0 24px;
  margin:0 0 0 4px; padding:3px; border:0; border-radius:50%;
  background:transparent; color:var(--muted); cursor:help; font-size:12px;
}
body.team-workspace button.context-help:hover,
body.team-workspace button.context-help:focus-visible { color:var(--accent); background:var(--panel-strong); }
body.team-workspace button.context-help:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
body.team-workspace button.context-help > svg,
body.team-workspace button.context-help > img { width:16px; height:16px; pointer-events:none; }
.context-help-action { display:inline-flex; align-items:center; gap:0; max-width:100%; min-width:0; }
.context-help-action.context-help-block { display:flex; width:100%; }
.context-help-block > button:not(.context-help) { flex:1; min-width:0; }
.context-help-action:has(> button:not(.context-help)[hidden]) { display:none; }
.context-help-tooltip {
  position:fixed; z-index:10000; box-sizing:border-box; width:max-content;
  max-width:min(320px,calc(100vw - 16px)); padding:12px 14px; border:1px solid var(--accent);
  border-radius:8px; color:var(--text); background:#111925; box-shadow:0 8px 28px #0008;
  font-size:13px; line-height:1.5; font-weight:400; text-align:left; overflow-wrap:anywhere;
}
.context-help-tooltip[hidden] { display:none; }
.context-help-tooltip strong, .context-help-tooltip span { display:block; }
.context-help-tooltip strong { margin-bottom:4px; font-size:13px; font-weight:750; }
.scout-row-head .context-help { margin-left:0; }
@media (max-width:640px) {
  body.team-workspace button.context-help { width:32px; height:32px; min-width:32px; min-height:32px; flex-basis:32px; }
  .scout-row-head { grid-template-columns:44px minmax(0,1fr) 80px 56px 20px; }
}
