#module-toggles summary::-webkit-details-marker { display: none; }
      #module-toggles[open] > summary .module-chevron { transform: rotate(180deg); }
      .btn-audit:hover:not(:disabled) {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(56, 189, 248, 0.3);
      }
      .btn-audit:active:not(:disabled) {
        transform: translateY(0);
      }
      .btn-audit:disabled {
        opacity: 1;
        cursor: not-allowed;
      }
      @keyframes spin {
        to { transform: rotate(360deg); }
      }
.api-upsell-section { padding: 40px 0; }
  .api-upsell-card { background: linear-gradient(to right, rgba(99,102,241,0.10) 0%, rgba(168,85,247,0.10) 50%, rgba(236,72,153,0.10) 100%); border: 1px solid rgba(99,102,241,0.20); border-radius: 16px; padding: 32px; }
  .api-upsell-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
  .api-upsell-left { display: flex; align-items: center; gap: 16px; }
  .api-upsell-icon { padding: 12px; background: rgba(99,102,241,0.20); border-radius: 8px; display: inline-flex; }
  .api-upsell-icon svg { width: 32px; height: 32px; color: #818cf8; }
  .api-upsell-title { margin: 0 0 4px; font-size: 24px; line-height: 32px; font-weight: 700; color: #ffffff; }
  .api-upsell-subtitle { margin: 0; color: #94a3b8; font-size: 16px; }
/* WCAG 1.4.3 fix (2026-05-11 audit): indigo-500 (#6366f1) on white text only reaches 4.47:1,
     0.03 below the WCAG AA 4.5:1 threshold. Bump to indigo-600 (#4f46e5, ~6.0:1) and
     deepen hover to indigo-700 (#4338ca, ~7.5:1). */
  .api-upsell-btn { display: inline-flex; align-items: center; background: #4f46e5; color: #ffffff; font-weight: 500; padding: 10px 18px; border-radius: 8px; text-decoration: none; border: none; cursor: pointer; font-size: 15px; transition: background 0.15s ease; }
  .api-upsell-btn:hover { background: #4338ca; }
  .api-upsell-btn svg { width: 16px; height: 16px; margin-left: 8px; }
@keyframes spin { to { transform: rotate(360deg); } }
  .btn-spinner {
    display: inline-block;
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.5);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
    vertical-align: middle;
  }
  #biz-name-wrong-btn:hover {
    color: var(--text);
  }

  /* Loading indicator overlay: sits below the hero-search bar without
     affecting button position or causing layout shift. */
  /* Hidden by default via .u-hidden (display:none). JS removes
     .u-hidden when loading starts; :not(.u-hidden) activates flex. */
  .loading-indicator-overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    margin-top: 12px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    pointer-events: none;
  }
  .loading-indicator-overlay:not(.u-hidden) {
    display: flex;
  }

  /* Smaller spinner variant used inside the loading indicator text */
  .loading-spinner-sm {
    width: 18px;
    height: 18px;
    border-width: 2px;
    flex-shrink: 0;
  }

  /* Ensure city input renders as plain text */
  #override_biz_city {
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
    -webkit-appearance: none !important;
  }
  /* WAO-FI-011 (2026-05-29 audit): hero Gartner-citation link styling.
     Moved from inline style="color: #60a5fa; text-decoration: underline;"
     on dashboard.html to a class so the inline-style CSP hash list is
     one entry shorter. Color matches the previous inline blue (matches
     tailwind blue-400) and keeps the underline affordance. */
  .hero-cite-link {
    color: #60a5fa;
    text-decoration: underline;
  }
  .hero-cite-link:hover { color: #93c5fd; }