/* "Did this work?" check-in popup — fires when a human interacts with a
     DOM element an agent registered a trigger against (see
     frontend/js/feature-triggers.js). Reuses .warn-card (system.css) for the
     card chrome, adds a third "ask me later" action below the yes/no pair. */
  #feature-trigger-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(6,7,10,0.75);
    align-items: center; justify-content: center;
    z-index: 160;
  }
  #feature-trigger-overlay.visible { display: flex; }
  .feature-trigger-card .icon { display: flex; justify-content: center; margin-bottom: 4px; }
  .feature-trigger-card .icon .icon-svg { width: 28px; height: 28px; color: var(--accent); }
  .feature-trigger-card h2 { text-align: center; }
  .feature-trigger-card p { text-align: center; }
  .feature-trigger-card #feature-trigger-later-btn {
    display: block;
    width: 100%;
    margin-top: 10px;
    background: transparent;
    border: none;
    color: var(--text-dim);
    font-size: 12px;
    cursor: pointer;
    padding: 6px;
  }
  .feature-trigger-card #feature-trigger-later-btn:hover { color: var(--text); text-decoration: underline; }

  /* Work Items row badge — shown while a trigger tied to that item is still
     active (see feature-triggers.js's decorateWorkItemTriggerBadges). */
  .work-item-trigger-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--amber);
    border: 1px solid rgba(255,176,32,0.35);
    border-radius: 6px;
    padding: 2px 6px;
    margin-left: 6px;
  }
  .work-item-trigger-badge .icon-svg { width: 12px; height: 12px; color: var(--amber); }