diff --git a/README.md b/README.md
index befac8d..1ff56c8 100644
--- a/README.md
+++ b/README.md
@@ -34,6 +34,20 @@ in memory only. Reference changes share the in-flight lookup and reuse its resul
 (including failures) without another request. Closing resets this state; reopening
 starts a fresh lookup, and responses from previous openings are ignored.
 
+## Workload Actions
+
+Workload Actions are queried in the background after product results arrive,
+including cached products. Each distinct `RevnId` uses `requestWlActions` with
+the `WWB-TS` credential in `Wwb-Provider-Authorization`. The Act badge beside SR
+aggregates all products: green means an action's `owner` matches the general
+tokenrelay response's `principal`; red means no matching owner was found. `Act ?`
+means ownership could not be confirmed (including a missing principal). Tooltips
+retain all returned actions, regardless of owner. Principal stays in memory only.
+Queries are shared per modal opening (up to four concurrently), reused
+across Reference changes, and discarded on close. Reopening queries again.
+Only the first page is requested for now; `hasNext` is indicated in the tooltip.
+The debug panel groups these requests under Actions, with credentials masked.
+
 ## Build
 
 Use Node.js:
diff --git a/dist/chromium/background.js b/dist/chromium/background.js
index 7ee7b62..9c28c7e 100644
--- a/dist/chromium/background.js
+++ b/dist/chromium/background.js
@@ -13,6 +13,7 @@ function createMessageTypes() {
     requestAccountPlans: "opportunitiesExtension.requestAccountPlans",
     requestInstallBase: "opportunitiesExtension.requestInstallBase",
     requestCustomerServiceRequest: "opportunitiesExtension.requestCustomerServiceRequest",
+    requestWlActions: "opportunitiesExtension.requestWlActions",
     requestConsumptionTrend: "opportunitiesExtension.requestConsumptionTrend",
     requestConsumptionPlanDetail: "opportunitiesExtension.requestConsumptionPlanDetail",
     requestRatecardByPlan: "opportunitiesExtension.requestRatecardByPlan"
@@ -204,7 +205,8 @@ function createAuthConsumerSession({
           accountSummary: accountSummaryAuthorization,
           accountPlans: accountPlansAuthorization,
           installBase: extractTokenServiceAuthorization(tokenResponse, "SAIB-TS", ""),
-          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", "")
+          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", ""),
+          workloadActions: extractTokenServiceAuthorization(tokenResponse, "WWB-TS", "Wwb-Provider-Authorization")
         },
         debugRequests
       };
@@ -610,6 +612,37 @@ function createSpaCustomerServiceRequests({ ACCOUNT_SUMMARY_URL, fetchJson, find
   return { requestCustomerServiceRequest };
 }
 
+// Source: src/services/spa/workload-actions.js
+function createSpaWorkloadActions({ fetchJson }) {
+  async function requestWlActions(message) {
+    const debugRequests = [];
+    try {
+      const revnId = String(message.revnId ?? "").trim();
+      const token = message.authorization?.value;
+      if (!/^\d+$/.test(revnId)) throw new Error("A numeric RevnId is required.");
+      if (typeof token !== "string" || !token.trim()) throw new Error("WWB-TS uiaasHeader.value is unavailable.");
+      const url = `https://spa.oracle.com/oalcrm/web/api/provider-proxy/wwb-provider/service/workbench-proxy/wwb/mgmt/actions?parentType=WORKLOAD&parentId=${encodeURIComponent(revnId)}`;
+      const result = await fetchJson(url, {
+        method: "GET", credentials: "include",
+        headers: { Accept: "application/json", "Wwb-Provider-Authorization": token.trim() }
+      }, "requestWlActions", debugRequests);
+      if (!result || !Array.isArray(result.actions) || typeof result.hasNext !== "boolean"
+        || result.actions.some(item => !item || typeof item !== "object" || Array.isArray(item))) {
+        throw new Error("requestWlActions returned an invalid collection.");
+      }
+      return { ok: true, actions: result.actions, hasNext: result.hasNext, debugRequests };
+    } catch (error) {
+      error.debugRequests = debugRequests;
+      throw error;
+    } finally {
+      for (const entry of debugRequests) {
+        if (entry.requestHeaders?.["Wwb-Provider-Authorization"]) entry.requestHeaders["Wwb-Provider-Authorization"] = "(present)";
+      }
+    }
+  }
+  return { requestWlActions };
+}
+
 // Source: src/services/spa/consumption.js
 function createSpaConsumption({
   CONSUMPTION_TREND_REQUESTS,
@@ -1662,6 +1695,7 @@ function registerBackgroundMessages({
   requestAccountPlans,
   requestInstallBase,
   requestCustomerServiceRequest,
+  requestWlActions,
   requestConsumerTokenService,
   requestConsumptionTrend,
   requestConsumptionPlanDetail,
@@ -1743,6 +1777,14 @@ runtimeApi.runtime.onMessage.addListener((message, sender, sendResponse) => {
       return true;
     }
 
+    if (message.type === messageTypes.requestWlActions) {
+      requestWlActions(message).then(sendResponse).catch(error => sendResponse({
+        ok: false, error: error.message || "Unable to load workload actions.",
+        debugRequests: Array.isArray(error.debugRequests) ? error.debugRequests : []
+      }));
+      return true;
+    }
+
     if (message.type === messageTypes.requestCustomerServiceRequest) {
       requestCustomerServiceRequest(message).then(sendResponse).catch(error => sendResponse({
         ok: false, error: error.message || "Unable to load service requests.",
@@ -1921,6 +1963,8 @@ function createBackgroundApplication(overrides = {}) {
   const refreshXsrfCookie = (...args) => authXsrfRecovery.refreshXsrfCookie(...args);
   const requestAccountPlans = (...args) => spaAccounts.requestAccountPlans(...args);
   const requestInstallBase = (...args) => spaInstallBase.requestInstallBase(...args);
+  const spaWorkloadActions = createSpaWorkloadActions({ fetchJson: (...args) => httpBackgroundJson.fetchJson(...args) });
+  const requestWlActions = (...args) => spaWorkloadActions.requestWlActions(...args);
   const requestCustomerServiceRequest = (...args) => spaCustomerServiceRequests.requestCustomerServiceRequest(...args);
   const requestConsumerTokenService = (...args) => authConsumerSession.requestConsumerTokenService(...args);
   const requestConsumptionTrend = (...args) => spaConsumption.requestConsumptionTrend(...args);
@@ -1929,7 +1973,7 @@ function createBackgroundApplication(overrides = {}) {
   const requestOpptyProducts = (...args) => productsBackgroundJobs.requestOpptyProducts(...args);
   const runtimeApi = environment.browser || environment.chrome;
   function start() {
-    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
+    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestWlActions, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
   }
   return {
     start, contracts,
diff --git a/dist/chromium/content.js b/dist/chromium/content.js
index b0aaf96..668db49 100644
--- a/dist/chromium/content.js
+++ b/dist/chromium/content.js
@@ -1,6 +1,6 @@
 (function () {
   "use strict";
-const redwoodStyles = "\n      .opportunities-extension-scroll-lock {\n        overflow: hidden !important;\n      }\n\n      .opportunities-extension-modal,\n      .opportunities-extension-modal * {\n        box-sizing: border-box;\n        font-family: \"Oracle Sans\", Arial, Helvetica, sans-serif;\n      }\n\n      .opportunities-extension-modal {\n        position: fixed;\n        inset: 0;\n        z-index: 2147483647;\n        background: #f5f4f2;\n        color: #000000;\n      }\n\n      .opportunities-extension-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-shell {\n        height: 100vh;\n        min-height: 0;\n        display: grid;\n        grid-template-rows: auto minmax(0, 1fr);\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-header {\n        position: relative;\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 24px;\n        padding: 28px 40px 22px;\n        border-bottom: 1px solid #dedbd7;\n        background:\n          linear-gradient(90deg, #8f624a 0 11%, #c74634 11% 23%, #6f5a7f 23% 36%, #00758f 36% 51%, #d4b06a 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #ffffff;\n      }\n\n      .opportunities-extension-header::before {\n        position: absolute;\n        left: 40px;\n        bottom: -1px;\n        width: 64px;\n        height: 3px;\n        background: #00758f;\n        content: \"\";\n      }\n\n      .opportunities-extension-header h1 {\n        margin: 0;\n        color: #000000;\n        font-size: 24px;\n        font-weight: 700;\n        line-height: 1.2;\n        letter-spacing: 0;\n      }\n\n      .opportunities-extension-header p {\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        line-height: 1.4;\n      }\n\n      .opportunities-extension-subtitle-row {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n        margin-top: 6px;\n      }\n\n      .opportunities-extension-auth-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        color: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-auth-badge-authenticated {\n        background: #3f6f17;\n      }\n\n      .opportunities-extension-auth-badge-unauthenticated {\n        background: #c5331f;\n      }\n\n      .opportunities-extension-auth-badge-pending {\n        background: #6f5a7f;\n      }\n\n      .opportunities-extension-products-progress {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-progress[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-cache-timestamp {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #f0eeeb;\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-cache-timestamp[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"running\"]::before {\n        width: 12px;\n        height: 12px;\n        margin-right: 6px;\n        border: 2px solid currentColor;\n        border-right-color: transparent;\n        border-radius: 50%;\n        content: \"\";\n        animation: opportunities-extension-spin .8s linear infinite;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-products-progress[data-state=\"error\"] {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      @keyframes opportunities-extension-spin {\n        to { transform: rotate(360deg); }\n      }\n\n      .opportunities-extension-icon-button {\n        width: 36px;\n        height: 36px;\n        flex: 0 0 36px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 18px;\n        font-weight: 600;\n        line-height: 1;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-header-actions {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n      }\n\n      .opportunities-extension-icon-button svg {\n        width: 18px;\n        height: 18px;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-icon-button .opportunities-extension-settings-icon {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-icon-button:hover,\n      .opportunities-extension-icon-button:focus {\n        border-color: #b8b2ad;\n        background: #f5f4f2;\n        outline: none;\n      }\n\n      .opportunities-extension-body {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        gap: 16px;\n        padding: 22px 40px 36px;\n        background: #f5f4f2;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-form {\n        display: flex;\n        align-items: end;\n        flex-wrap: wrap;\n        gap: 24px;\n        min-height: 82px;\n        max-width: none;\n        margin: 0;\n        padding: 14px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-field {\n        display: grid;\n        max-width: max-content;\n        min-width: 270px;\n        width: max-content;\n        gap: 6px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-dashboard {\n        display: grid;\n        grid-template-columns: repeat(6, minmax(0, 1fr));\n        gap: 12px;\n      }\n\n      .opportunities-extension-stage-dashboard-card {\n        display: grid;\n        gap: 6px;\n        min-width: 0;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-top: 3px solid #5f5a55;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-stage-dashboard-card span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-stage-dashboard-value {\n        overflow: hidden;\n        color: #312d2a;\n        font-size: 22px;\n        font-weight: 700;\n        line-height: 1.2;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #008aa6;\n      }\n\n      .opportunities-extension-total-dashboard-card {\n        border-top-color: #312d2a;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #6f6863;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #c87b00;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #755b8b;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #4b7f22;\n      }\n\n      .opportunities-extension-stage-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-stage-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-stage-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #006b84;\n        background: #006b84;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #5f5a55;\n        background: #5f5a55;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #945400;\n        background: #945400;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #624e74;\n        background: #624e74;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #3f6f17;\n        background: #3f6f17;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-status-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-status-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-status-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-status-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-customer-filter {\n        position: relative;\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 220px;\n      }\n\n      .opportunities-extension-customer-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-customer-filter-trigger {\n        position: relative;\n        min-width: 220px;\n        min-height: 44px;\n        padding: 10px 38px 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-trigger::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-top: 6px solid #312d2a;\n        border-right: 5px solid transparent;\n        border-left: 5px solid transparent;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-customer-filter-trigger:disabled {\n        cursor: not-allowed;\n        background: #f5f4f2;\n        color: #7d7772;\n      }\n\n      .opportunities-extension-customer-filter-trigger:focus-visible {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-panel {\n        position: absolute;\n        top: calc(100% + 8px);\n        left: 0;\n        z-index: 4;\n        display: grid;\n        width: min(360px, calc(100vw - 80px));\n        gap: 10px;\n        padding: 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n      }\n\n      .opportunities-extension-customer-filter-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-customer-filter-search {\n        width: 100%;\n        min-height: 40px;\n        padding: 8px 10px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-customer-filter-search:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-customer-filter-option {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-customer-filter-select-all {\n        min-height: 32px;\n        padding-bottom: 8px;\n        border-bottom: 1px solid #dedbd7;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-customer-filter-panel input[type=\"checkbox\"] {\n        width: 16px;\n        height: 16px;\n        flex: 0 0 16px;\n        accent-color: #00758f;\n      }\n\n      .opportunities-extension-customer-filter-list {\n        display: block;\n        max-height: 250px;\n        overflow: auto;\n      }\n\n      .opportunities-extension-customer-filter-option {\n        display: grid;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: start;\n        min-height: 0;\n        height: auto !important;\n        padding: 8px 4px;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-option input[type=\"checkbox\"] {\n        margin-top: 1px;\n      }\n\n      .opportunities-extension-customer-filter-option span {\n        display: block;\n        min-width: 0;\n        line-height: 18px;\n        overflow-wrap: anywhere;\n        white-space: normal;\n      }\n\n      .opportunities-extension-customer-filter-option:hover {\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-customer-filter-empty {\n        margin: 4px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-table-search-field {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        width: 260px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input {\n        width: 100%;\n        min-height: 44px;\n        padding: 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-select-wrap {\n        position: relative;\n        display: block;\n        width: 270px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-select-wrap::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-left: 5px solid transparent;\n        border-right: 5px solid transparent;\n        border-top: 6px solid #000000;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-field select {\n        width: 100%;\n        min-width: 0;\n        max-width: 100%;\n        min-height: 44px;\n        box-sizing: border-box;\n        appearance: none;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #000000;\n        font-size: 14px;\n        line-height: 1.3;\n        padding: 11px 44px 11px 12px;\n      }\n\n      .opportunities-extension-field select:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-table-surface {\n        min-height: 0;\n        height: 100%;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n        overflow-x: auto;\n        overflow-y: auto;\n      }\n\n      .opportunities-extension-table {\n        width: 100%;\n        min-width: 0;\n        border-collapse: collapse;\n        table-layout: fixed;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-table thead {\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-table th {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n        height: 44px;\n        border-bottom: 1px solid #b8b2ad;\n        background: #faf9f8;\n        color: #312d2a;\n        font-size: 12px;\n        font-weight: 700;\n        text-align: left;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td {\n        min-height: 48px;\n        padding: 12px 16px;\n        border-bottom: 1px solid #ebe8e5;\n        vertical-align: middle;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-table th:nth-child(1) {\n        width: 16%;\n      }\n\n      .opportunities-extension-table th:nth-child(2) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(3) {\n        width: 18%;\n      }\n\n      .opportunities-extension-table th:nth-child(4) {\n        width: 11%;\n      }\n\n      .opportunities-extension-table th:nth-child(5) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(6) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(7) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(8) {\n        width: 6%;\n      }\n\n      .opportunities-extension-table th:nth-child(9) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(10) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(11) {\n        width: 4%;\n      }\n\n      .opportunities-extension-table td:nth-child(2),\n      .opportunities-extension-table td:nth-child(5),\n      .opportunities-extension-table td:nth-child(6),\n      .opportunities-extension-table td:nth-child(8) {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      .opportunities-extension-table td:nth-child(9) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(7) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(10) {\n        padding-right: 6px;\n        padding-left: 6px;\n        font-size: 12px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td:nth-child(11) {\n        padding-right: 6px;\n        padding-left: 6px;\n        text-align: center;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table tbody tr:hover {\n        background: #f7f6f4;\n      }\n\n      .opportunities-extension-table tbody tr:last-child td {\n        border-bottom: 0;\n      }\n\n      .opportunities-extension-table a {\n        color: #006b84;\n        text-decoration: underline;\n        text-decoration-thickness: 1px;\n        text-underline-offset: 2px;\n      }\n\n      .opportunities-extension-table a:hover {\n        color: #004f63;\n      }\n\n      .opportunities-extension-opty-number-content {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-name-content {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-name-content > a {\n        min-width: 0;\n      }\n\n      .opportunities-extension-actions-content {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        gap: 4px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-products-count {\n        display: inline-grid;\n        width: auto;\n        min-width: 20px;\n        height: 20px;\n        place-items: center;\n        flex: 0 0 auto;\n        box-sizing: border-box;\n        padding: 0 3px;\n        border: 1px solid #7ca7b2;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 10px;\n        font-weight: 700;\n        line-height: 1;\n        text-align: center;\n        vertical-align: middle;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-products-count:hover,\n      .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n        outline: none;\n      }\n\n      .opportunities-extension-products-count-error {\n        border-color: #d8887e;\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-products-detail-row:hover {\n        background: transparent !important;\n      }\n\n      .opportunities-extension-products-detail-cell {\n        padding: 0 !important;\n      }\n\n      .opportunities-extension-products-detail {\n        padding: 14px 20px 18px;\n        border-bottom: 1px solid #c9c5c1;\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-products-detail-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 10px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-ai-summary {\n        box-sizing: border-box;\n        width: 100%;\n        min-width: 0;\n        margin: 0 0 12px;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 6px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.5;\n        text-align: left;\n        white-space: normal;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-ai-summary strong {\n        display: block;\n        font-size: 13px;\n        font-weight: 600;\n      }\n\n      .opportunities-extension-ai-summary p {\n        margin: 4px 0 0;\n        font: inherit;\n        white-space: pre-wrap;\n      }\n\n      .opportunities-extension-ai-summary-error {\n        color: #b42318;\n        border-color: #d9928b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary {\n        background: #292827;\n        color: #f6f4f2;\n        border-color: #5f5a55;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary-error {\n        color: #ffb4ab;\n        border-color: #a45c55;\n      }\n\n      .opportunities-extension-products-detail-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-products-detail-heading span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-products-table {\n        width: 100%;\n        table-layout: fixed;\n        border-collapse: collapse;\n        border: 1px solid #dedbd7;\n        background: #ffffff;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-products-table th,\n      .opportunities-extension-products-table td {\n        position: static;\n        height: auto;\n        padding: 8px 10px;\n        border-bottom: 1px solid #ebe8e5;\n        background: transparent;\n        overflow-wrap: anywhere;\n        vertical-align: middle;\n        white-space: normal;\n      }\n\n      .opportunities-extension-products-table th {\n        background: #faf9f8;\n        font-size: 11px;\n      }\n\n      .opportunities-extension-products-table th:nth-child(1) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(2) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(3) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(4) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(5) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(6) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(7) { width: 7%; }\n      .opportunities-extension-products-table th:nth-child(8) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(9) { width: 12%; }\n      .opportunities-extension-products-table th:nth-child(10) { width: 5%; }\n\n      .opportunities-extension-products-empty {\n        margin: 0;\n        padding: 10px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-copy-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n        width: 24px;\n        height: 24px;\n        padding: 3px;\n        border: 0;\n        border-radius: 3px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-copy-button svg {\n        width: 16px;\n        height: 16px;\n        fill: currentColor;\n      }\n\n      .opportunities-extension-copy-button:hover,\n      .opportunities-extension-copy-button:focus-visible {\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 32px;\n        height: 32px;\n        padding: 5px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-action-button svg {\n        width: 21px;\n        height: 21px;\n      }\n\n      .opportunities-extension-action-button:hover,\n      .opportunities-extension-action-button:focus-visible {\n        border-color: #7ca7b2;\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button:disabled {\n        cursor: wait;\n        opacity: .72;\n      }\n\n      .opportunities-extension-action-button-loading svg {\n        animation: opportunities-extension-pulse 1s ease-in-out infinite;\n      }\n\n      @keyframes opportunities-extension-pulse {\n        50% { opacity: .35; }\n      }\n\n      .opportunities-extension-copy-toast {\n        position: fixed;\n        right: 28px;\n        bottom: 28px;\n        z-index: 3;\n        max-width: min(360px, calc(100vw - 56px));\n        padding: 12px 16px;\n        border-radius: 4px;\n        background: #2f6f18;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n        color: #ffffff;\n        font-size: 13px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-copy-toast-error {\n        background: #a52b1c;\n      }\n\n      .opportunities-extension-copy-toast[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-stage-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"SQL\"] {\n        background: #d9f0f5;\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"PIPELINE\"] {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"UPSIDE\"] {\n        background: #fff0d8;\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"FORECAST\"] {\n        background: #eee8f5;\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"WON\"] {\n        background: #e5f1d9;\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-status-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"OPEN\"] {\n        background: #e2f2e5;\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"CLOSED\"] {\n        background: #e5e7eb;\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"LOST\"] {\n        background: #f9e3e1;\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"WON\"] {\n        background: #e3edf8;\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-sort-button {\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n        width: 100%;\n        min-height: 44px;\n        padding: 8px 42px 8px 16px;\n        border: 0;\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-weight: inherit;\n        letter-spacing: 0;\n        line-height: 1.2;\n        text-align: left;\n        white-space: normal;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-table-header-label {\n        display: inline-flex;\n        align-items: center;\n        min-height: 44px;\n        padding: 8px 6px;\n      }\n\n      .opportunities-extension-sort-button::after {\n        position: absolute;\n        right: 15px;\n        color: #5f5a55;\n        content: \"↕\";\n        font-size: 16px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"ascending\"]::after {\n        color: #00758f;\n        content: \"↑\";\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"descending\"]::after {\n        color: #00758f;\n        content: \"↓\";\n      }\n\n      .opportunities-extension-sort-button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-sort-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-table-status {\n        height: 152px;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-visually-hidden {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 3;\n        display: grid;\n        place-items: center;\n        padding: 24px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-preferences-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 4;\n        display: grid;\n        place-items: center;\n        padding: 12px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-account-plans-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-dialog {\n        display: grid;\n        width: min(1180px, 100%);\n        height: min(760px, calc(100vh - 24px));\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plans-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 14px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-header h2 {\n        margin: 0;\n        font-size: 20px;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-account-plans-header p {\n        margin: 5px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-account-plans-content {\n        display: grid;\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-content > .opportunities-extension-account-plans-skeleton {\n        grid-row: 1 / -1;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation {\n        position: relative;\n        min-width: 0;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation .opportunities-extension-account-plans-tab-navigation-button[hidden] {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tabs {\n        display: flex;\n        min-width: 0;\n        gap: 4px;\n        overflow-x: auto;\n        padding: 8px 20px 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-account-plans-tabs::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button {\n        display: grid;\n        position: absolute;\n        z-index: 1;\n        top: 50%;\n        width: 32px;\n        height: 32px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        box-shadow: 0 2px 6px rgba(0, 0, 0, .16);\n        transform: translateY(-50%);\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:first-child {\n        left: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:last-child {\n        right: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-account-plans-panels {\n        min-width: 0;\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plan-tab {\n        min-height: 38px;\n        flex: 0 0 auto;\n        padding: 7px 12px;\n        border: 0;\n        border-bottom: 3px solid transparent;\n        background: transparent;\n        color: #5f5a55;\n        font-size: 13px;\n        font-weight: 600;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plan-tab:hover {\n        background: #f0eeeb;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #00758f;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-account-plan-tab:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-account-plan-panel {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        box-sizing: border-box;\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plan-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plan-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        margin: 0;\n      }\n\n      .opportunities-extension-account-plan-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        gap: 10px;\n        min-height: 42px;\n        align-items: center;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plan-details dt {\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-account-plan-details dd {\n        min-width: 0;\n        margin: 0;\n        color: #312d2a;\n        font-size: 13px;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-consumption-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 14px;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-trend-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        gap: 24px;\n      }\n\n      .opportunities-extension-consumption-periods {\n        display: flex;\n        align-items: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-periods button {\n        min-height: 38px;\n        padding: 7px 14px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-periods button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #00758f;\n        background: #e7f6f8;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-periods button:focus-visible,\n      .opportunities-extension-consumption-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-consumption-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 4px;\n      }\n\n      .opportunities-extension-consumption-navigation {\n        display: grid;\n        grid-template-columns: 36px minmax(130px, auto) 36px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 40px;\n        margin-bottom: 2px;\n      }\n\n      .opportunities-extension-consumption-navigation strong {\n        color: #312d2a;\n        font-size: 13px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-navigation-button {\n        display: grid;\n        width: 36px;\n        height: 36px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-consumption-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-consumption-figure {\n        position: relative;\n        min-width: 0;\n        min-height: 0;\n        margin: 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-consumption-figure::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-consumption-visual {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 176px;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-consumption-svg {\n        display: block;\n        width: 100%;\n        height: 300px;\n        min-height: 0;\n        overflow: visible;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #dedbd7;\n        stroke-width: 1;\n        shape-rendering: crispEdges;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #5f5a55;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #312d2a;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #b77888;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #de7907;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #de7907;\n        stroke-width: 1.5;\n        stroke-dasharray: 6 6;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group {\n        cursor: default;\n        outline: none;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group rect {\n        transition: filter .16s ease, opacity .16s ease, stroke .16s ease;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        filter: brightness(1.06);\n        stroke: #312d2a;\n        stroke-width: 1.5;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-label {\n        opacity: 0;\n        animation: opportunities-extension-consumption-label-in .24s ease-out forwards;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-average {\n        opacity: 0;\n        animation: opportunities-extension-consumption-average-in .35s .32s ease-out forwards;\n      }\n\n      @keyframes opportunities-extension-consumption-label-in {\n        from { opacity: 0; transform: translateY(4px); }\n        to { opacity: 1; transform: translateY(0); }\n      }\n\n      @keyframes opportunities-extension-consumption-average-in {\n        from { opacity: 0; }\n        to { opacity: 1; }\n      }\n\n      .opportunities-extension-consumption-legend {\n        display: grid;\n        align-content: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-legend button {\n        display: grid;\n        min-width: 0;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: center;\n        gap: 8px;\n        padding: 6px 4px;\n        border: 0;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.25;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-legend button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-legend button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 1px;\n      }\n\n      .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #77726d;\n        opacity: .55;\n      }\n\n      .opportunities-extension-consumption-legend-swatch {\n        display: block;\n        width: 12px;\n        height: 12px;\n        justify-self: center;\n      }\n\n      .opportunities-extension-consumption-legend-funded {\n        background: #b77888;\n      }\n\n      .opportunities-extension-consumption-legend-overage {\n        background: #de7907;\n      }\n\n      .opportunities-extension-consumption-legend-average {\n        height: 0;\n        border-top: 2px dashed #de7907;\n      }\n\n      .opportunities-extension-consumption-tooltip {\n        position: absolute;\n        z-index: 2;\n        display: grid;\n        min-width: 190px;\n        max-width: 260px;\n        gap: 4px;\n        padding: 10px 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .2);\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.3;\n        pointer-events: none;\n      }\n\n      .opportunities-extension-consumption-tooltip[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-consumption-tooltip strong {\n        margin-bottom: 2px;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton {\n        height: 100%;\n        min-height: 0;\n        padding: 34px 62px 24px;\n        box-sizing: border-box;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot {\n        display: flex;\n        height: 100%;\n        min-height: 220px;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px;\n        border-bottom: 1px solid #dedbd7;\n        border-left: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot span {\n        width: min(38px, 6%);\n        border-radius: 2px 2px 0 0;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-consumption-chart-empty,\n      .opportunities-extension-consumption-chart-error {\n        display: grid;\n        min-height: 220px;\n        place-items: center;\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-chart-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-account-plan-status-indicator {\n        display: inline-block;\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        background: #9b9691;\n        box-shadow: 0 0 0 3px #efedeb;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #3f6f17;\n        box-shadow: 0 0 0 3px #e2f2e5;\n      }\n\n      .opportunities-extension-account-plan-tab .opportunities-extension-account-plan-status-indicator {\n        margin-right: 8px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs {\n        display: flex;\n        min-height: 46px;\n        align-items: center;\n        padding: 0 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-skeleton-panel {\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tab {\n        display: inline-flex;\n        align-items: center;\n        gap: 9px;\n        min-height: 38px;\n        padding: 0 12px;\n        border-bottom: 3px solid #00758f;\n      }\n\n      .opportunities-extension-account-plans-skeleton-status {\n        display: block;\n        width: 10px;\n        height: 10px;\n        flex: 0 0 auto;\n        border-radius: 50%;\n        background: #dedbd7;\n        box-shadow: 0 0 0 3px #efedeb;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        padding: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        align-items: center;\n        gap: 10px;\n        min-height: 42px;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plans-skeleton-bar {\n        display: block;\n        height: 12px;\n        border-radius: 3px;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs .opportunities-extension-account-plans-skeleton-bar {\n        height: 14px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-label {\n        width: 74%;\n        height: 10px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        margin: 14px 0 0;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend-header {\n        display: flex;\n        justify-content: flex-end;\n        min-height: 38px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods {\n        display: flex;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n        height: 12px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-period-active {\n        height: 38px !important;\n        border: 1px solid #8cc8d3;\n        background: #e7f6f8;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation {\n        display: grid;\n        grid-template-columns: 32px 124px 32px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 54px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation .opportunities-extension-account-plans-skeleton-bar {\n        justify-self: center;\n      }\n\n      .opportunities-extension-account-plans-skeleton-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 150px;\n        align-items: center;\n        gap: 28px;\n        padding: 12px 14px 0 62px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot {\n        display: flex;\n        position: relative;\n        height: 300px;\n        min-height: 0;\n        box-sizing: border-box;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px 64px;\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #ebe8e5 58px, #ebe8e5 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        position: absolute;\n        display: block;\n        content: \"\";\n        background: #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before {\n        top: 0;\n        bottom: 64px;\n        left: 0;\n        width: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        right: 0;\n        bottom: 64px;\n        left: 0;\n        height: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot .opportunities-extension-account-plans-skeleton-bar {\n        width: min(38px, 7%);\n        flex: 0 1 38px;\n        border-radius: 2px 2px 0 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend {\n        display: grid;\n        align-content: center;\n        gap: 18px;\n        min-height: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend .opportunities-extension-account-plans-skeleton-bar {\n        height: 11px;\n      }\n\n      @keyframes opportunities-extension-skeleton-pulse {\n        from { opacity: .48; }\n        to { opacity: 1; }\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        .opportunities-extension-account-plans-skeleton-bar,\n        .opportunities-extension-consumption-chart-skeleton-plot span,\n        .opportunities-extension-consumption-svg .consumption-animated-label,\n        .opportunities-extension-consumption-svg .consumption-animated-average {\n          animation: none;\n          opacity: 1;\n        }\n      }\n\n      .opportunities-extension-account-plans-empty,\n      .opportunities-extension-account-plans-error {\n        margin: 0;\n        padding: 28px 20px;\n        color: #5f5a55;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-account-plans-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-preferences-dialog {\n        display: grid;\n        width: min(680px, 100%);\n        max-height: min(720px, calc(100vh - 48px));\n        grid-template-rows: auto minmax(0, 1fr) auto;\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-preferences-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 18px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-preferences-header h2 {\n        margin: 0;\n        font-size: 20px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-preferences-content {\n        min-height: 0;\n        overflow: auto;\n        padding: 20px;\n      }\n\n      .opportunities-extension-preferences-fieldset {\n        min-width: 0;\n        margin: 0;\n        padding: 0;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-fieldset legend {\n        margin-bottom: 12px;\n        padding: 0;\n        color: #312d2a;\n        font-size: 15px;\n        font-weight: 700;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-preferences-options {\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 4px 20px;\n      }\n\n      .opportunities-extension-preferences-option {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        min-width: 0;\n        padding: 9px 8px;\n        border-radius: 4px;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.35;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-option:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-preferences-option input {\n        width: 18px;\n        height: 18px;\n        flex: 0 0 18px;\n        margin: 0;\n        accent-color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-cache-field {\n        display: grid;\n        width: min(280px, 100%);\n        gap: 6px;\n        margin-top: 24px;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-preferences-cache-field select {\n        width: 100%;\n        height: 40px;\n        padding: 0 36px 0 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-preferences-cache-field select:focus {\n        border-color: #00758f;\n        outline: 2px solid #bde7ee;\n        outline-offset: 0;\n      }\n\n      .opportunities-extension-preferences-footer {\n        display: flex;\n        justify-content: flex-end;\n        padding: 14px 20px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-button {\n        min-width: 88px;\n        min-height: 36px;\n        padding: 7px 16px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-button-primary {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-button-primary:hover,\n      .opportunities-extension-button-primary:focus-visible {\n        border-color: #005e73;\n        background: #005e73;\n        outline: none;\n      }\n\n      .opportunities-extension-debug-panel {\n        position: fixed;\n        right: 24px;\n        bottom: 24px;\n        z-index: 1;\n        width: min(640px, calc(100vw - 48px));\n        max-height: min(560px, calc(100vh - 120px));\n        overflow: auto;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 2px 8px rgba(0, 0, 0, .16);\n        padding: 16px;\n        color: #000000;\n      }\n\n      .opportunities-extension-debug-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-debug-panel h2 {\n        margin: 0;\n        font-size: 18px;\n        font-weight: 700;\n        line-height: 1.25;\n      }\n\n      .opportunities-extension-debug-panel p {\n        margin: 4px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-panel-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 12px;\n      }\n\n      .opportunities-extension-debug-visibility-button {\n        width: 34px;\n        height: 34px;\n        flex: 0 0 34px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-debug-visibility-button svg {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-debug-list {\n        display: grid;\n        gap: 10px;\n      }\n\n      .opportunities-extension-debug-item {\n        border: 1px solid #dedbd7;\n        border-left-width: 4px;\n        border-radius: 4px;\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-debug-item[open] {\n        background: #ffffff;\n      }\n\n      .opportunities-extension-debug-item-success {\n        border-left-color: #3f6f17;\n      }\n\n      .opportunities-extension-debug-item-success .opportunities-extension-debug-status {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-debug-item-failed {\n        border-left-color: #c5331f;\n      }\n\n      .opportunities-extension-debug-item-failed .opportunities-extension-debug-status {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-debug-item-pending {\n        border-left-color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-item-pending .opportunities-extension-debug-status {\n        background: #eee8f2;\n        color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        min-height: 42px;\n        padding: 9px 12px 9px 10px;\n        cursor: pointer;\n        list-style: none;\n      }\n\n      .opportunities-extension-debug-heading::-webkit-details-marker {\n        display: none;\n      }\n\n      .opportunities-extension-debug-heading::before {\n        content: \"⌄\";\n        width: 14px;\n        color: #5f5a55;\n        font-size: 16px;\n        line-height: 1;\n        transform: rotate(-90deg);\n        transition: transform .15s ease;\n      }\n\n      .opportunities-extension-debug-item[open] .opportunities-extension-debug-heading::before {\n        transform: rotate(0deg);\n      }\n\n      .opportunities-extension-debug-summary-meta {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        margin-left: auto;\n      }\n\n      .opportunities-extension-debug-http-status,\n      .opportunities-extension-debug-status {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 0 8px;\n        border-radius: 999px;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-debug-http-status {\n        background: #e8f4f6;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-debug-status {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-debug-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-item pre {\n        margin: 0;\n        padding: 8px 12px 12px;\n        color: #312d2a;\n        font-family: Consolas, \"Courier New\", monospace;\n        font-size: 12px;\n        line-height: 1.45;\n        white-space: pre-wrap;\n        word-break: break-word;\n      }\n\n      .opportunities-extension-debug-empty {\n        padding: 14px;\n        border: 1px dashed #b8b2ad;\n        border-radius: 4px;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] {\n        background: #1f1f1f;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-shell,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-body {\n        background: #1f1f1f;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header {\n        border-bottom-color: #4e4a46;\n        background:\n          linear-gradient(90deg, #a8795d 0 11%, #dd5a47 11% 23%, #876e9b 23% 36%, #00a6be 36% 51%, #dfbd76 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header h1,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-value,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dt,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-bar {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-status {\n        background: #5b5753;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-period-active {\n        border-color: #3f7580;\n        background: #23474e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot span {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator {\n        background: #8f8a85;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #7fb05b;\n        box-shadow: 0 0 0 3px #314527;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-form,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-surface,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item[open] {\n        border-color: #4e4a46;\n        background: #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-select-wrap::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger:disabled {\n        background: #292827;\n        color: #918b86;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search::placeholder,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input::placeholder {\n        color: #b5b0ab;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-fieldset legend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dd,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item pre,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel h2 {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation strong {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th {\n        border-bottom-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-footer,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs-navigation,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details > div,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-details > div {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #4e4a46 58px, #4e4a46 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::after {\n        background: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab:hover {\n        background: #3b3937;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #43c4d5;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #43c4d5;\n        background: #173e43;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:hover:not(:disabled),\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #43c4d5;\n        background: #3b3937;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:disabled,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #4e4a46;\n        color: #746f6a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        stroke: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #a8a39e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-funded {\n        background: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-overage {\n        background: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-average {\n        border-top-color: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-tooltip {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option input {\n        accent-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary {\n        border-color: #00a6be;\n        background: #008aa6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:focus-visible {\n        border-color: #43c4d5;\n        background: #006d7a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table tbody tr:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sort-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:focus {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table thead,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th {\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail {\n        border-bottom-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count {\n        border-color: #2f9bae;\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #43c4d5;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"running\"] {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #244f2e;\n        color: #a8dfb7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"error\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count-error {\n        border-color: #b13b34;\n        background: #5f2926;\n        color: #ffb4ad;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-cache-timestamp {\n        background: #3b3937;\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:focus-visible {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #d1cbc6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #ffbf62;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #d2b7e9;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #9bd46a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-total-dashboard-card {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #c0b9b3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #ffb84d;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #cba7e7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #92cf5b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #008aa6;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #6f6863;\n        background: #6f6863;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #b96e00;\n        background: #b96e00;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #755b8b;\n        background: #755b8b;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #4b7f22;\n        background: #4b7f22;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #69c985;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #c3cad3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #ff9d94;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #83bfff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item {\n        border-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button {\n        color: #f6f4f2;\n      }\n\n      @media (min-width: 1201px) and (max-width: 1450px) {\n        .opportunities-extension-table th:nth-child(1) {\n          width: 16%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 18%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 12%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 7%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 8%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 10%;\n        }\n      }\n\n      @media (max-width: 1200px) {\n        .opportunities-extension-table {\n          min-width: 1180px;\n        }\n\n        .opportunities-extension-table th:nth-child(1) {\n          width: 15%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 17%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 13%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 6%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 9%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 11%;\n        }\n      }\n\n      @media (max-width: 700px) {\n        .opportunities-extension-header {\n          padding: 24px 20px 18px;\n        }\n\n        .opportunities-extension-header::before {\n          left: 20px;\n        }\n\n        .opportunities-extension-header h1 {\n          font-size: 22px;\n        }\n\n        .opportunities-extension-header p {\n          font-size: 14px;\n        }\n\n        .opportunities-extension-body {\n          padding: 16px 20px 24px;\n        }\n\n        .opportunities-extension-form {\n          align-items: stretch;\n          flex-wrap: wrap;\n          gap: 14px;\n          min-height: auto;\n          padding: 12px;\n        }\n\n        .opportunities-extension-field {\n          max-width: none;\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-trigger {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-panel {\n          width: min(360px, calc(100vw - 64px));\n        }\n\n        .opportunities-extension-table-search-field {\n          width: 100%;\n        }\n\n        .opportunities-extension-stage-dashboard {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n        }\n\n        .opportunities-extension-stage-dashboard-value {\n          font-size: 18px;\n        }\n\n        .opportunities-extension-preferences-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-account-plans-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-preferences-dialog {\n          max-height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plans-dialog {\n          height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plan-panel {\n          padding: 12px 14px;\n        }\n\n        .opportunities-extension-account-plan-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n        }\n\n        .opportunities-extension-account-plan-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 3px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n          padding: 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 5px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-trend {\n          margin: 14px 0 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          align-items: center;\n          gap: 6px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n          width: 100% !important;\n        }\n\n        .opportunities-extension-account-plans-skeleton-chart {\n          grid-template-columns: minmax(0, 1fr);\n          gap: 12px;\n          padding: 12px 8px 0 34px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-legend {\n          display: flex;\n          min-height: 24px;\n          align-items: center;\n          justify-content: center;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-trend-header {\n          align-items: stretch;\n        }\n\n        .opportunities-extension-consumption-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          gap: 3px;\n        }\n\n        .opportunities-extension-consumption-periods button {\n          min-width: 0;\n          padding: 7px 4px;\n          font-size: 12px;\n        }\n\n        .opportunities-extension-consumption-chart {\n          min-height: 0;\n        }\n\n        .opportunities-extension-consumption-svg {\n          width: 760px;\n          height: 245px;\n        }\n\n        .opportunities-extension-consumption-visual {\n          width: 920px;\n          grid-template-columns: 760px 144px;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-figure {\n          overflow-x: auto;\n          overscroll-behavior-inline: contain;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton {\n          min-height: 0;\n          padding: 24px 18px 18px;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton-plot {\n          min-height: 180px;\n          gap: 4px;\n          padding: 0 6px;\n        }\n\n        .opportunities-extension-preferences-options {\n          grid-template-columns: 1fr;\n        }\n\n        .opportunities-extension-stage-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-status-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-table-surface {\n          min-width: 0;\n          min-height: calc(100vh - 230px);\n        }\n\n        .opportunities-extension-debug-panel {\n          right: 12px;\n          bottom: 12px;\n          width: calc(100vw - 24px);\n          max-height: calc(100vh - 96px);\n        }\n      }\n    \n/* Full-page diagnostics, scoped to the extension and its current theme. */\n.opportunities-extension-modal .opportunities-extension-debug-panel {\n  --debug-surface: #fff;\n  --debug-code: #f5f6f7;\n  --debug-text: #312d2a;\n  --debug-muted: #5f5a55;\n  --debug-border: #dedbd7;\n  --debug-success: #22613b;\n  --debug-success-bg: #e1f1e5;\n  --debug-failed: #a12721;\n  --debug-failed-bg: #fce8e6;\n  --debug-pending: #805000;\n  --debug-pending-bg: #fff1ce;\n  --debug-info: #075e87;\n  --debug-info-bg: #e5f1fa;\n  --debug-key: #075e87;\n  --debug-string: #22613b;\n  --debug-number: #865000;\n  --debug-literal: #73429b;\n  position: fixed;\n  inset: 0;\n  z-index: 50;\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  width: auto;\n  height: auto;\n  max-height: none;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  margin: 0;\n  padding: 20px;\n  border: 0;\n  border-radius: 0;\n  background: var(--debug-surface);\n  color: var(--debug-text);\n  color-scheme: light;\n}\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel {\n  --debug-surface: #292827;\n  --debug-code: #222120;\n  --debug-text: #f6f4f2;\n  --debug-muted: #c9c5c1;\n  --debug-border: #514c47;\n  --debug-success: #a9e3bd;\n  --debug-success-bg: #214d34;\n  --debug-failed: #ffb4ab;\n  --debug-failed-bg: #582c2a;\n  --debug-pending: #ffe099;\n  --debug-pending-bg: #59441e;\n  --debug-info: #a8d9ff;\n  --debug-info-bg: #233f52;\n  --debug-key: #8ed6f0;\n  --debug-string: #a9e3bd;\n  --debug-number: #ffe099;\n  --debug-literal: #d6b7f1;\n  color: #f6f4f2;\n  color-scheme: dark;\n}\n.opportunities-extension-debug-actions { display: flex; gap: 8px; flex: 0 0 auto; }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-list {\n  overflow: auto;\n  min-height: 0;\n  min-width: 0;\n  align-content: start;\n  scrollbar-gutter: stable;\n  padding: 2px 8px 12px 2px;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item {\n  --debug-state: var(--debug-info);\n  --debug-state-bg: var(--debug-info-bg);\n  border-color: var(--debug-border);\n  border-left-color: var(--debug-state);\n  background: var(--debug-surface);\n  min-width: 0;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-success { --debug-state: var(--debug-success); --debug-state-bg: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-failed { --debug-state: var(--debug-failed); --debug-state-bg: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-pending { --debug-state: var(--debug-pending); --debug-state-bg: var(--debug-pending-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-status {\n  color: var(--debug-state);\n  background: var(--debug-state-bg);\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status,\n.opportunities-extension-debug-method {\n  color: var(--debug-info);\n  background: var(--debug-info-bg);\n}\n.opportunities-extension-debug-method {\n  display: inline-flex;\n  align-items: center;\n  min-height: 22px;\n  padding: 0 8px;\n  border-radius: 4px;\n  font: 700 11px/1.2 Consolas, monospace;\n}\n.opportunities-extension-debug-method[data-method=\"POST\"] { color: var(--debug-literal); background: var(--debug-code); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"2\"] { color: var(--debug-success); background: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"4\"],\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"5\"] { color: var(--debug-failed); background: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"pending\"] { color: var(--debug-pending); background: var(--debug-pending-bg); }\n.opportunities-extension-debug-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 14px 16px; }\n.opportunities-extension-debug-block { min-width: 0; border-left: 2px solid var(--debug-info); padding-left: 10px; }\n.opportunities-extension-debug-block[data-direction=\"response\"] { border-left-color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-block h3 { margin: 0 0 8px; color: var(--debug-info); font-size: 12px; }\n.opportunities-extension-modal .opportunities-extension-debug-block[data-direction=\"response\"] h3 { color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item pre {\n  min-width: 0;\n  margin: 0;\n  padding: 12px;\n  max-height: 380px;\n  overflow: auto;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  color: var(--debug-text);\n  background: var(--debug-code);\n  line-height: 1.6;\n  tab-size: 2;\n}\n.opportunities-extension-debug-json-key { color: var(--debug-key); }\n.opportunities-extension-debug-json-string { color: var(--debug-string); }\n.opportunities-extension-debug-json-number { color: var(--debug-number); }\n.opportunities-extension-debug-json-literal { color: var(--debug-literal); }\n@media (max-width: 760px) {\n  .opportunities-extension-modal .opportunities-extension-debug-panel { padding: 12px; }\n  .opportunities-extension-debug-details { grid-template-columns: minmax(0, 1fr); }\n}\n.opportunities-extension-debug-tabs {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  margin-bottom: 12px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid #dedbd7;\n}\n\n.opportunities-extension-debug-tabs button {\n  max-width: 100%;\n  min-height: 32px;\n  padding: 6px 8px;\n  border: 0;\n  border-bottom: 2px solid transparent;\n  border-radius: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.35;\n  overflow-wrap: anywhere;\n  cursor: pointer;\n}\n\n.opportunities-extension-debug-tabs button:hover {\n  background: #f5f4f2;\n}\n\n.opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  border-bottom-color: #00758f;\n  background: #e8f4f6;\n  color: #006b84;\n  font-weight: 700;\n}\n\n.opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline: 2px solid #00758f;\n  outline-offset: -2px;\n}\n\n.opportunities-extension-debug-time {\n  font-size: 11px;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.opportunities-extension-debug-heading {\n  flex-wrap: wrap;\n}\n\n.opportunities-extension-debug-heading strong {\n  flex: 1 1 180px;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-debug-summary-meta {\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button {\n  color: #f6f4f2;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading::before {\n  color: #c9c5c1;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs {\n  border-bottom-color: #514c47;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:hover {\n  background: #383633;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  background: #173f48;\n  border-bottom-color: #8cc8d3;\n  color: #bde7ee;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline-color: #8cc8d3;\n}\n\n/* Compact filters use available CSS width, including Windows display scaling. */\n.opportunities-extension-crm-sr-badge {\n  flex: 0 0 auto;\n  padding: 0 6px;\n  border: 1px solid #408254;\n  border-radius: 8px;\n  font-size: 10px;\n  line-height: 18px;\n  font-weight: 600;\n  white-space: nowrap;\n  color: #185b30;\n  background: #e1f1e5;\n}\n.opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #9f201b; background: #fde8e7; border-color: #c74640; }\n.opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #785000; background: #fff0cd; border-color: #987021; }\n.opportunities-extension-crm-sr-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge { color: #b8e4c6; background: #214d34; border-color: #6eac82; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #ffd9d5; background: #542824; border-color: #ef938b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #ffe0a3; background: #584219; border-color: #c99b4b; }\n\n.opportunities-extension-form {\n  display: grid;\n  grid-template-columns: max-content minmax(110px, 1fr) minmax(110px, 1fr) minmax(145px, 180px) max-content max-content;\n  align-items: end;\n  gap: 12px;\n  min-height: 0;\n  padding: 12px;\n}\n\n.opportunities-extension-form > * {\n  min-width: 0;\n  width: 100%;\n  max-width: none;\n  grid-template-rows: auto 32px;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.opportunities-extension-form > * > span:first-child {\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap {\n  width: 100%;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger,\n.opportunities-extension-form .opportunities-extension-table-search-field input {\n  box-sizing: border-box;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  min-height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger {\n  padding-right: 26px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap::after,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger::after {\n  right: 10px;\n  border-left-width: 4px;\n  border-right-width: 4px;\n  border-top-width: 5px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-controls,\n.opportunities-extension-form .opportunities-extension-status-filter-controls {\n  flex-wrap: nowrap;\n  gap: 4px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-button,\n.opportunities-extension-form .opportunities-extension-status-filter-button {\n  min-height: 28px;\n  padding: 4px 7px;\n  font-size: 11px;\n  line-height: 18px;\n  white-space: nowrap;\n}\n\n/* Native select intrinsic sizing includes its longest option, not just the selection. */\n@media (min-width: 1151px) {\n  .opportunities-extension-form > .opportunities-extension-field,\n  .opportunities-extension-form .opportunities-extension-select-wrap,\n  .opportunities-extension-form .opportunities-extension-field select {\n    width: max-content;\n    max-width: none;\n  }\n}\n\n@media (max-width: 1150px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-column: span 2;\n  }\n}\n\n@media (max-width: 700px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .opportunities-extension-form .opportunities-extension-stage-filter-controls,\n  .opportunities-extension-form .opportunities-extension-status-filter-controls {\n    flex-wrap: wrap;\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-template-rows: auto auto;\n  }\n}\n\n@media (max-width: 420px) {\n  .opportunities-extension-form { grid-template-columns: minmax(0, 1fr); }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter { grid-column: auto; }\n}\n\n/* Keep layout rules on the outer table, never on expanded product tables. */\n.opportunities-extension-table[data-opportunities-layout=\"inline-actions\"] {\n  width: 100%;\n  min-width: 1120px;\n  table-layout: fixed;\n}\n\n/* Fixed table layout shares leftover width only between the two auto columns. */\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"owner\"] { width: 132px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"optyNumber\"] { width: 106px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"revenue\"] { width: 124px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"closeDate\"] { width: 100px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"status\"] { width: 114px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"winProbability\"] { width: 110px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"stage\"] { width: 94px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"lastUpdateDate\"] { width: 136px; }\n\n.opportunities-extension-table > tbody > tr > td[data-column] {\n  padding: 10px 8px;\n  overflow: visible;\n  text-overflow: clip;\n  white-space: normal;\n  font-variant-numeric: tabular-nums;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"name\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] {\n  position: relative;\n  padding-right: 16px;\n  padding-left: 12px;\n  padding-bottom: 38px;\n  vertical-align: top;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"owner\"] {\n  padding-right: 16px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"closeDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"lastUpdateDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"status\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"stage\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"winProbability\"] {\n  white-space: nowrap;\n}\n\n.opportunities-extension-cell-content {\n  display: block;\n  min-width: 0;\n  min-height: 2.7em;\n  line-height: 1.35;\n}\n\n.opportunities-extension-cell-content > :first-child {\n  display: block;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-cell-actions {\n  position: absolute;\n  left: 12px;\n  right: 16px;\n  bottom: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: 6px;\n  height: 24px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button {\n  flex: 0 0 24px;\n  width: 24px;\n  height: 24px;\n  padding: 2px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] .opportunities-extension-cell-actions {\n  min-width: 84px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button svg {\n  width: 18px;\n  height: 18px;\n}\n\n.opportunities-extension-cell-actions button:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n}\n\n.opportunities-extension-products-ramp {\n  display: inline-block;\n  min-width: 0;\n  max-width: 100%;\n  padding: 0 6px;\n  border: 1px solid #bba5cf;\n  border-radius: 8px;\n  background: #f0e8f7;\n  color: #63358a;\n  font-size: 10px;\n  font-weight: 600;\n  line-height: 16px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp {\n  background: #43334f;\n  color: #ead5fc;\n  border-color: #9372ac;\n}\n\n.opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #fde8e7;\n  color: #9f201b;\n  border-color: #c74640;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #542824;\n  color: #ffd9d5;\n  border-color: #ef938b;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  gap: 6px;\n  padding: 10px 8px;\n  align-items: center;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] .opportunities-extension-sort-button,\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] .opportunities-extension-sort-button {\n  padding-left: 12px;\n  padding-right: 16px;\n}\n\n.opportunities-extension-sort-label {\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button::after {\n  position: static;\n  justify-self: end;\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog {\n  width: min(1700px, 100%);\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header {\n  padding: 10px 12px;\n  gap: 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header h2 {\n  font-size: 16px;\n  line-height: 22px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header p {\n  font-size: 12px;\n  line-height: 16px;\n  margin-top: 3px;\n  overflow-wrap: anywhere;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-icon-button {\n  width: 28px;\n  height: 28px;\n  min-width: 28px;\n  min-height: 28px;\n  padding: 4px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-toolbar {\n  padding: 8px 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-search {\n  width: min(320px, 100%);\n  height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n.opportunities-extension-install-base-content {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  scrollbar-gutter: stable;\n}\n.opportunities-extension-install-base-message { margin: 10px 12px; font-size: 12px; line-height: 16px; }\n.opportunities-extension-install-base-table {\n  width: 100%; min-width: 1120px; table-layout: fixed; border-collapse: collapse; font-size: 11px;\n}\n.opportunities-extension-install-base-table col { width: 7%; }\n.opportunities-extension-install-base-table .install-base-col-partyName { width: 12%; }\n.opportunities-extension-install-base-table .install-base-col-productGroupName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-productName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-quantity { width: 5%; }\n.opportunities-extension-install-base-table .install-base-col-quantityType { width: 8%; }\n.opportunities-extension-install-base-table th,\n.opportunities-extension-install-base-table td {\n  padding: 8px 6px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-install-base-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-install-base-table td[data-format=\"amount\"],\n.opportunities-extension-install-base-table td[data-format=\"quantity\"] { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-install-base-table td[data-format=\"date\"] { white-space: nowrap; }\n.opportunities-extension-install-base-status {\n  display: inline-block; padding: 2px 5px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\n.opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #855300; background: #fff0d6; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #b8e4c6; background: #214d34; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #ffdfa2; background: #614418; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-install-base-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog { width: min(1700px, 100%); }\n.opportunities-extension-service-requests-content { min-width: 0; min-height: 0; overflow: auto; scrollbar-gutter: stable; }\n.opportunities-extension-service-requests-message { margin: 16px; font-size: 13px; }\n.opportunities-extension-service-requests-table {\n  width: 100%; min-width: 1200px; table-layout: fixed; border-collapse: collapse; font-size: 12px;\n}\n.opportunities-extension-service-requests-table col { width: 7%; }\n.opportunities-extension-service-requests-table .service-requests-col-name { width: 17%; }\n.opportunities-extension-service-requests-table .service-requests-col-id { width: 10%; }\n.opportunities-extension-service-requests-table .service-requests-col-severity { width: 5%; }\n.opportunities-extension-service-requests-table .service-requests-col-subStatus { width: 14%; }\n.opportunities-extension-service-requests-table .service-requests-col-productName { width: 12%; }\n.opportunities-extension-service-requests-table th,\n.opportunities-extension-service-requests-table td {\n  padding: 12px 8px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-service-requests-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-service-requests-table td[data-field=\"created\"],\n.opportunities-extension-service-requests-table td[data-field=\"lastUpdated\"],\n.opportunities-extension-service-requests-table td[data-field=\"id\"] { white-space: nowrap; font-variant-numeric: tabular-nums; }\n.opportunities-extension-service-request-status {\n  display: inline-block; padding: 3px 6px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8;\n}\n.opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #b8e4c6; background: #214d34; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-service-requests-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n/* Scope sizing to Cloud Consumption, not other dialogs sharing its components. */\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header { padding: 10px 12px; gap: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header h2 { font-size: 16px; line-height: 22px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header p { font-size: 12px; line-height: 16px; margin-top: 3px; overflow-wrap: anywhere; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-icon-button { width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 4px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-tabs { padding: 4px 12px 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-tab { min-height: 30px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { padding: 8px 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { gap: 0 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details > div { grid-template-columns: minmax(85px, 35%) minmax(0, 1fr); min-height: 32px; padding: 4px 0; gap: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dt { font-size: 11px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dd { font-size: 12px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-trend { margin-top: 8px; padding-top: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-periods button { min-height: 28px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation { grid-template-columns: 28px minmax(120px, auto) 28px; min-height: 30px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation strong { font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation-button { width: 28px; height: 28px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-svg { height: 100%; max-height: 100%; min-width: 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend button { font-size: 11px; padding: 4px; gap: 5px; }\n\n/* Small viewports must scroll rather than clip details or collapse the chart. */\n@media (max-height: 560px), (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-panels { overflow: auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { height: auto; min-height: 100%; grid-template-rows: auto minmax(280px, 1fr); }\n}\n@media (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { grid-template-columns: minmax(0, 1fr); }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend { display: flex; flex-wrap: wrap; }\n}\n\n.opportunities-extension-plan-detail-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }\n.opportunities-extension-consumption-trend-header { align-items: center; justify-content: space-between; gap: 12px; }\n.opportunities-extension-consumption-trend-header > .opportunities-extension-plan-detail-badges { min-width: 0; }\n.opportunities-extension-plan-detail-skeleton { width: 64px; height: 20px; }\n.opportunities-extension-projection-badge {\n  display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent;\n  padding: 3px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; line-height: 1.3;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\nbutton.opportunities-extension-projection-badge { cursor: pointer; }\n.opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #a12424; background: #fbe5e5; }\n.opportunities-extension-projection-badge[data-status=\"overage\"] { color: #185a9d; background: #e0edfc; }\n.opportunities-extension-projection-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-projection-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; padding: 14px; overflow: auto; overscroll-behavior: contain;\n  border: 1px solid #b9b4ae; border-radius: 4px; background: #ffffff; color: #312d2a;\n  box-shadow: 0 4px 16px #0003; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere;\n}\n.opportunities-extension-projection-popover[hidden] { display: none; }\n.opportunities-extension-projection-popover .opportunities-extension-projection-dismiss {\n  display: grid; place-items: center; width: 24px; height: 24px; margin-left: auto; margin-bottom: 8px; padding: 4px; border: 1px solid #b9b4ae;\n  border-radius: 4px; background: transparent; color: inherit; cursor: pointer; font-size: 12px;\n}\n.opportunities-extension-projection-dismiss svg { width: 14px; height: 14px; }\n.opportunities-extension-projection-line h3 { margin: 0 0 8px; font-size: 12px; }\n.opportunities-extension-projection-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; }\n.opportunities-extension-projection-fields > div { min-width: 0; }\n.opportunities-extension-projection-fields dt { font-weight: 600; color: #5f5a55; font-size: 11px; }\n.opportunities-extension-projection-fields dd { margin: 2px 0 0; font-variant-numeric: tabular-nums; }\n.opportunities-extension-projection-fields a { color: #006d7a; text-decoration: underline; }\n.opportunities-extension-projection-children { margin-top: 14px; padding-left: 12px; border-left: 2px solid #dedbd7; }\n.opportunities-extension-projection-children > section + section { margin-top: 16px; }\n.opportunities-extension-plan-detail-error { color: #a12424; font-size: 12px; }\n.opportunities-extension-projection-empty { color: #5f5a55; font-size: 12px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-popover { color: #f1efec; background: #302e2b; border-color: #716b64; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #ffb9b9; background: #682e32; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"overage\"] { color: #c5dfff; background: #224b76; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields dt,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-empty { color: #cec9c2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields a { color: #76dbea; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-plan-detail-error { color: #ffb9b9; }\n@media (max-width: 480px) { .opportunities-extension-projection-fields { grid-template-columns: minmax(0, 1fr); } }\n@media (max-width: 480px) {\n  .opportunities-extension-consumption-trend-header > .opportunities-extension-consumption-periods { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n}\n@media (prefers-reduced-motion: reduce) { .opportunities-extension-plan-detail-skeleton { animation: none; } }\n\n.opportunities-extension-account-plan-details > .opportunities-extension-contract-row {\n  align-items: center;\n}\n.opportunities-extension-contract-row > dt,\n.opportunities-extension-contract-row > dd,\n.opportunities-extension-contract-ratecard > span {\n  line-height: 20px;\n}\n.opportunities-extension-contract-ratecard {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n.opportunities-extension-ratecard-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  align-self: center;\n  box-sizing: border-box;\n  height: 28px;\n  margin: 0;\n  flex: 0 0 auto;\n  padding: 0 8px;\n  border: 1px solid #8aaeb9;\n  border-radius: 4px;\n  background: #fff;\n  color: #006b80;\n  font: inherit;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 20px;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-button:hover { background: #e8f4f6; }\n.opportunities-extension-ratecard-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 8;\n  display: flex;\n  justify-content: flex-end;\n  overflow: hidden;\n  overflow: clip;\n  background: rgba(0, 0, 0, 0);\n  transition: background-color 320ms ease;\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] { background: rgba(0, 0, 0, .32); }\n.opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #fff;\n  --ratecard-heading: #faf9f8;\n  --ratecard-text: #312d2a;\n  --ratecard-muted: #615a55;\n  --ratecard-border: #dedbd8;\n  --ratecard-accent: #00758f;\n  --ratecard-skeleton: #eae7e4;\n  display: grid;\n  grid-template-rows: auto auto auto minmax(0, 1fr);\n  width: min(1520px, calc(100% - 48px));\n  height: 100%;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  box-shadow: -6px 0 24px rgba(0, 0, 0, .2);\n  transform: translateX(100%);\n  transition: transform 320ms cubic-bezier(.22, .61, .36, 1);\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(0); }\n.opportunities-extension-ratecard-header > div { min-width: 0; overflow-wrap: anywhere; }\n.opportunities-extension-ratecard-plan-details { padding: 12px 20px 0; }\n.opportunities-extension-ratecard-toolbar { display: flex; align-items: center; gap: 16px; padding: 12px 20px; }\n.opportunities-extension-ratecard-search {\n  width: min(360px, 100%);\n  min-width: 0;\n  box-sizing: border-box;\n  padding: 9px 12px;\n  border: 1px solid var(--ratecard-muted);\n  border-radius: 4px;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-ratecard-search::placeholder { color: var(--ratecard-muted); opacity: 1; }\n.opportunities-extension-ratecard-count { color: var(--ratecard-muted); font-size: 12px; white-space: nowrap; }\n.opportunities-extension-ratecard-viewport { overflow: auto; min-height: 0; min-width: 0; scrollbar-gutter: stable; }\n.opportunities-extension-ratecard-table { width: 100%; min-width: 1100px; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 12px; }\n.opportunities-extension-ratecard-table th, .opportunities-extension-ratecard-table td {\n  padding: 11px 10px;\n  border-bottom: 1px solid var(--ratecard-border);\n  vertical-align: top;\n  overflow-wrap: anywhere;\n  text-align: left;\n}\n.opportunities-extension-ratecard-table th { position: sticky; top: 0; z-index: 1; background: var(--ratecard-heading); }\n.opportunities-extension-ratecard-sort {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  align-items: center;\n  gap: 5px;\n  width: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-weight: 600;\n  text-align: left;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-sort-icon { color: var(--ratecard-accent); text-align: center; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-numeric { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-notice { padding: 28px 20px; text-align: center; }\n.opportunities-extension-ratecard-notice [role=\"alert\"] { color: #b3261e; }\n.opportunities-extension-ratecard-skeleton { display: block; width: 85%; height: 14px; border-radius: 3px; background: var(--ratecard-skeleton); animation: opportunities-ratecard-pulse 1.1s ease-in-out infinite alternate; }\n.opportunities-extension-ratecard-drawer :focus-visible, .opportunities-extension-ratecard-button:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] { pointer-events: none; background: rgba(0, 0, 0, 0); transition-duration: 180ms; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(100%); transition-duration: 180ms; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #292725;\n  --ratecard-heading: #35322f;\n  --ratecard-text: #f5f3f1;\n  --ratecard-muted: #c2bcb6;\n  --ratecard-border: #514c47;\n  --ratecard-accent: #59d1e5;\n  --ratecard-skeleton: #514c47;\n}\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button { color: #59d1e5; border-color: #6298a2; background: #292725; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button:hover { background: #313f40; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-notice [role=\"alert\"] { color: #ffb4ab; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer :focus-visible, [data-theme=\"dark\"] .opportunities-extension-ratecard-button:focus-visible { outline-color: #59d1e5; }\n@keyframes opportunities-ratecard-pulse { from { opacity: .45; } to { opacity: 1; } }\n@media (max-width: 720px) {\n  .opportunities-extension-ratecard-drawer { width: 100%; }\n  .opportunities-extension-ratecard-toolbar { flex-wrap: wrap; gap: 8px; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-ratecard-overlay, .opportunities-extension-ratecard-drawer, .opportunities-extension-ratecard-skeleton,\n  .opportunities-extension-ratecard-overlay[data-closing=\"true\"], .opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { animation: none; transition: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog,\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog {\n  grid-template-rows: auto auto minmax(0, 1fr);\n}\n.opportunities-extension-customer-table-toolbar { padding: 12px 16px; border-bottom: 1px solid #dedbd7; }\n.opportunities-extension-customer-table-search {\n  box-sizing: border-box;\n  width: min(420px, 100%);\n  min-width: 0;\n  height: 38px;\n  padding: 8px 12px;\n  border: 1px solid #8f8a85;\n  border-radius: 4px;\n  background: #fff;\n  color: #312d2a;\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-customer-table-search::placeholder { color: #5f5a55; opacity: 1; }\n.opportunities-extension-customer-table-search:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-toolbar { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search { background: #353331; color: #f6f4f2; border-color: #8f8a85; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search::placeholder { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search:focus-visible { outline-color: #59d1e5; }\n";
+const redwoodStyles = "\n      .opportunities-extension-scroll-lock {\n        overflow: hidden !important;\n      }\n\n      .opportunities-extension-modal,\n      .opportunities-extension-modal * {\n        box-sizing: border-box;\n        font-family: \"Oracle Sans\", Arial, Helvetica, sans-serif;\n      }\n\n      .opportunities-extension-modal {\n        position: fixed;\n        inset: 0;\n        z-index: 2147483647;\n        background: #f5f4f2;\n        color: #000000;\n      }\n\n      .opportunities-extension-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-shell {\n        height: 100vh;\n        min-height: 0;\n        display: grid;\n        grid-template-rows: auto minmax(0, 1fr);\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-header {\n        position: relative;\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 24px;\n        padding: 28px 40px 22px;\n        border-bottom: 1px solid #dedbd7;\n        background:\n          linear-gradient(90deg, #8f624a 0 11%, #c74634 11% 23%, #6f5a7f 23% 36%, #00758f 36% 51%, #d4b06a 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #ffffff;\n      }\n\n      .opportunities-extension-header::before {\n        position: absolute;\n        left: 40px;\n        bottom: -1px;\n        width: 64px;\n        height: 3px;\n        background: #00758f;\n        content: \"\";\n      }\n\n      .opportunities-extension-header h1 {\n        margin: 0;\n        color: #000000;\n        font-size: 24px;\n        font-weight: 700;\n        line-height: 1.2;\n        letter-spacing: 0;\n      }\n\n      .opportunities-extension-header p {\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        line-height: 1.4;\n      }\n\n      .opportunities-extension-subtitle-row {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n        margin-top: 6px;\n      }\n\n      .opportunities-extension-auth-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        color: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-auth-badge-authenticated {\n        background: #3f6f17;\n      }\n\n      .opportunities-extension-auth-badge-unauthenticated {\n        background: #c5331f;\n      }\n\n      .opportunities-extension-auth-badge-pending {\n        background: #6f5a7f;\n      }\n\n      .opportunities-extension-products-progress {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-progress[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-cache-timestamp {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #f0eeeb;\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-cache-timestamp[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"running\"]::before {\n        width: 12px;\n        height: 12px;\n        margin-right: 6px;\n        border: 2px solid currentColor;\n        border-right-color: transparent;\n        border-radius: 50%;\n        content: \"\";\n        animation: opportunities-extension-spin .8s linear infinite;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-products-progress[data-state=\"error\"] {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      @keyframes opportunities-extension-spin {\n        to { transform: rotate(360deg); }\n      }\n\n      .opportunities-extension-icon-button {\n        width: 36px;\n        height: 36px;\n        flex: 0 0 36px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 18px;\n        font-weight: 600;\n        line-height: 1;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-header-actions {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n      }\n\n      .opportunities-extension-icon-button svg {\n        width: 18px;\n        height: 18px;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-icon-button .opportunities-extension-settings-icon {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-icon-button:hover,\n      .opportunities-extension-icon-button:focus {\n        border-color: #b8b2ad;\n        background: #f5f4f2;\n        outline: none;\n      }\n\n      .opportunities-extension-body {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        gap: 16px;\n        padding: 22px 40px 36px;\n        background: #f5f4f2;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-form {\n        display: flex;\n        align-items: end;\n        flex-wrap: wrap;\n        gap: 24px;\n        min-height: 82px;\n        max-width: none;\n        margin: 0;\n        padding: 14px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-field {\n        display: grid;\n        max-width: max-content;\n        min-width: 270px;\n        width: max-content;\n        gap: 6px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-dashboard {\n        display: grid;\n        grid-template-columns: repeat(6, minmax(0, 1fr));\n        gap: 12px;\n      }\n\n      .opportunities-extension-stage-dashboard-card {\n        display: grid;\n        gap: 6px;\n        min-width: 0;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-top: 3px solid #5f5a55;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-stage-dashboard-card span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-stage-dashboard-value {\n        overflow: hidden;\n        color: #312d2a;\n        font-size: 22px;\n        font-weight: 700;\n        line-height: 1.2;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #008aa6;\n      }\n\n      .opportunities-extension-total-dashboard-card {\n        border-top-color: #312d2a;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #6f6863;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #c87b00;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #755b8b;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #4b7f22;\n      }\n\n      .opportunities-extension-stage-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-stage-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-stage-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #006b84;\n        background: #006b84;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #5f5a55;\n        background: #5f5a55;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #945400;\n        background: #945400;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #624e74;\n        background: #624e74;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #3f6f17;\n        background: #3f6f17;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-status-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-status-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-status-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-status-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-customer-filter {\n        position: relative;\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 220px;\n      }\n\n      .opportunities-extension-customer-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-customer-filter-trigger {\n        position: relative;\n        min-width: 220px;\n        min-height: 44px;\n        padding: 10px 38px 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-trigger::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-top: 6px solid #312d2a;\n        border-right: 5px solid transparent;\n        border-left: 5px solid transparent;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-customer-filter-trigger:disabled {\n        cursor: not-allowed;\n        background: #f5f4f2;\n        color: #7d7772;\n      }\n\n      .opportunities-extension-customer-filter-trigger:focus-visible {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-panel {\n        position: absolute;\n        top: calc(100% + 8px);\n        left: 0;\n        z-index: 4;\n        display: grid;\n        width: min(360px, calc(100vw - 80px));\n        gap: 10px;\n        padding: 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n      }\n\n      .opportunities-extension-customer-filter-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-customer-filter-search {\n        width: 100%;\n        min-height: 40px;\n        padding: 8px 10px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-customer-filter-search:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-customer-filter-option {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-customer-filter-select-all {\n        min-height: 32px;\n        padding-bottom: 8px;\n        border-bottom: 1px solid #dedbd7;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-customer-filter-panel input[type=\"checkbox\"] {\n        width: 16px;\n        height: 16px;\n        flex: 0 0 16px;\n        accent-color: #00758f;\n      }\n\n      .opportunities-extension-customer-filter-list {\n        display: block;\n        max-height: 250px;\n        overflow: auto;\n      }\n\n      .opportunities-extension-customer-filter-option {\n        display: grid;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: start;\n        min-height: 0;\n        height: auto !important;\n        padding: 8px 4px;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-option input[type=\"checkbox\"] {\n        margin-top: 1px;\n      }\n\n      .opportunities-extension-customer-filter-option span {\n        display: block;\n        min-width: 0;\n        line-height: 18px;\n        overflow-wrap: anywhere;\n        white-space: normal;\n      }\n\n      .opportunities-extension-customer-filter-option:hover {\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-customer-filter-empty {\n        margin: 4px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-table-search-field {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        width: 260px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input {\n        width: 100%;\n        min-height: 44px;\n        padding: 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-select-wrap {\n        position: relative;\n        display: block;\n        width: 270px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-select-wrap::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-left: 5px solid transparent;\n        border-right: 5px solid transparent;\n        border-top: 6px solid #000000;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-field select {\n        width: 100%;\n        min-width: 0;\n        max-width: 100%;\n        min-height: 44px;\n        box-sizing: border-box;\n        appearance: none;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #000000;\n        font-size: 14px;\n        line-height: 1.3;\n        padding: 11px 44px 11px 12px;\n      }\n\n      .opportunities-extension-field select:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-table-surface {\n        min-height: 0;\n        height: 100%;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n        overflow-x: auto;\n        overflow-y: auto;\n      }\n\n      .opportunities-extension-table {\n        width: 100%;\n        min-width: 0;\n        border-collapse: collapse;\n        table-layout: fixed;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-table thead {\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-table th {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n        height: 44px;\n        border-bottom: 1px solid #b8b2ad;\n        background: #faf9f8;\n        color: #312d2a;\n        font-size: 12px;\n        font-weight: 700;\n        text-align: left;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td {\n        min-height: 48px;\n        padding: 12px 16px;\n        border-bottom: 1px solid #ebe8e5;\n        vertical-align: middle;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-table th:nth-child(1) {\n        width: 16%;\n      }\n\n      .opportunities-extension-table th:nth-child(2) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(3) {\n        width: 18%;\n      }\n\n      .opportunities-extension-table th:nth-child(4) {\n        width: 11%;\n      }\n\n      .opportunities-extension-table th:nth-child(5) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(6) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(7) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(8) {\n        width: 6%;\n      }\n\n      .opportunities-extension-table th:nth-child(9) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(10) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(11) {\n        width: 4%;\n      }\n\n      .opportunities-extension-table td:nth-child(2),\n      .opportunities-extension-table td:nth-child(5),\n      .opportunities-extension-table td:nth-child(6),\n      .opportunities-extension-table td:nth-child(8) {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      .opportunities-extension-table td:nth-child(9) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(7) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(10) {\n        padding-right: 6px;\n        padding-left: 6px;\n        font-size: 12px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td:nth-child(11) {\n        padding-right: 6px;\n        padding-left: 6px;\n        text-align: center;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table tbody tr:hover {\n        background: #f7f6f4;\n      }\n\n      .opportunities-extension-table tbody tr:last-child td {\n        border-bottom: 0;\n      }\n\n      .opportunities-extension-table a {\n        color: #006b84;\n        text-decoration: underline;\n        text-decoration-thickness: 1px;\n        text-underline-offset: 2px;\n      }\n\n      .opportunities-extension-table a:hover {\n        color: #004f63;\n      }\n\n      .opportunities-extension-opty-number-content {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-name-content {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-name-content > a {\n        min-width: 0;\n      }\n\n      .opportunities-extension-actions-content {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        gap: 4px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-products-count {\n        display: inline-grid;\n        width: auto;\n        min-width: 20px;\n        height: 20px;\n        place-items: center;\n        flex: 0 0 auto;\n        box-sizing: border-box;\n        padding: 0 3px;\n        border: 1px solid #7ca7b2;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 10px;\n        font-weight: 700;\n        line-height: 1;\n        text-align: center;\n        vertical-align: middle;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-products-count:hover,\n      .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n        outline: none;\n      }\n\n      .opportunities-extension-products-count-error {\n        border-color: #d8887e;\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-products-detail-row:hover {\n        background: transparent !important;\n      }\n\n      .opportunities-extension-products-detail-cell {\n        padding: 0 !important;\n      }\n\n      .opportunities-extension-products-detail {\n        padding: 14px 20px 18px;\n        border-bottom: 1px solid #c9c5c1;\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-products-detail-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 10px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-ai-summary {\n        box-sizing: border-box;\n        width: 100%;\n        min-width: 0;\n        margin: 0 0 12px;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 6px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.5;\n        text-align: left;\n        white-space: normal;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-ai-summary strong {\n        display: block;\n        font-size: 13px;\n        font-weight: 600;\n      }\n\n      .opportunities-extension-ai-summary p {\n        margin: 4px 0 0;\n        font: inherit;\n        white-space: pre-wrap;\n      }\n\n      .opportunities-extension-ai-summary-error {\n        color: #b42318;\n        border-color: #d9928b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary {\n        background: #292827;\n        color: #f6f4f2;\n        border-color: #5f5a55;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary-error {\n        color: #ffb4ab;\n        border-color: #a45c55;\n      }\n\n      .opportunities-extension-products-detail-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-products-detail-heading span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-products-table {\n        width: 100%;\n        table-layout: fixed;\n        border-collapse: collapse;\n        border: 1px solid #dedbd7;\n        background: #ffffff;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-products-table th,\n      .opportunities-extension-products-table td {\n        position: static;\n        height: auto;\n        padding: 8px 10px;\n        border-bottom: 1px solid #ebe8e5;\n        background: transparent;\n        overflow-wrap: anywhere;\n        vertical-align: middle;\n        white-space: normal;\n      }\n\n      .opportunities-extension-products-table th {\n        background: #faf9f8;\n        font-size: 11px;\n      }\n\n      .opportunities-extension-products-table th:nth-child(1) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(2) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(3) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(4) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(5) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(6) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(7) { width: 7%; }\n      .opportunities-extension-products-table th:nth-child(8) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(9) { width: 12%; }\n      .opportunities-extension-products-table th:nth-child(10) { width: 5%; }\n\n      .opportunities-extension-products-empty {\n        margin: 0;\n        padding: 10px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-copy-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n        width: 24px;\n        height: 24px;\n        padding: 3px;\n        border: 0;\n        border-radius: 3px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-copy-button svg {\n        width: 16px;\n        height: 16px;\n        fill: currentColor;\n      }\n\n      .opportunities-extension-copy-button:hover,\n      .opportunities-extension-copy-button:focus-visible {\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 32px;\n        height: 32px;\n        padding: 5px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-action-button svg {\n        width: 21px;\n        height: 21px;\n      }\n\n      .opportunities-extension-action-button:hover,\n      .opportunities-extension-action-button:focus-visible {\n        border-color: #7ca7b2;\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button:disabled {\n        cursor: wait;\n        opacity: .72;\n      }\n\n      .opportunities-extension-action-button-loading svg {\n        animation: opportunities-extension-pulse 1s ease-in-out infinite;\n      }\n\n      @keyframes opportunities-extension-pulse {\n        50% { opacity: .35; }\n      }\n\n      .opportunities-extension-copy-toast {\n        position: fixed;\n        right: 28px;\n        bottom: 28px;\n        z-index: 3;\n        max-width: min(360px, calc(100vw - 56px));\n        padding: 12px 16px;\n        border-radius: 4px;\n        background: #2f6f18;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n        color: #ffffff;\n        font-size: 13px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-copy-toast-error {\n        background: #a52b1c;\n      }\n\n      .opportunities-extension-copy-toast[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-stage-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"SQL\"] {\n        background: #d9f0f5;\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"PIPELINE\"] {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"UPSIDE\"] {\n        background: #fff0d8;\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"FORECAST\"] {\n        background: #eee8f5;\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"WON\"] {\n        background: #e5f1d9;\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-status-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"OPEN\"] {\n        background: #e2f2e5;\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"CLOSED\"] {\n        background: #e5e7eb;\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"LOST\"] {\n        background: #f9e3e1;\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"WON\"] {\n        background: #e3edf8;\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-sort-button {\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n        width: 100%;\n        min-height: 44px;\n        padding: 8px 42px 8px 16px;\n        border: 0;\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-weight: inherit;\n        letter-spacing: 0;\n        line-height: 1.2;\n        text-align: left;\n        white-space: normal;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-table-header-label {\n        display: inline-flex;\n        align-items: center;\n        min-height: 44px;\n        padding: 8px 6px;\n      }\n\n      .opportunities-extension-sort-button::after {\n        position: absolute;\n        right: 15px;\n        color: #5f5a55;\n        content: \"↕\";\n        font-size: 16px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"ascending\"]::after {\n        color: #00758f;\n        content: \"↑\";\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"descending\"]::after {\n        color: #00758f;\n        content: \"↓\";\n      }\n\n      .opportunities-extension-sort-button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-sort-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-table-status {\n        height: 152px;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-visually-hidden {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 3;\n        display: grid;\n        place-items: center;\n        padding: 24px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-preferences-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 4;\n        display: grid;\n        place-items: center;\n        padding: 12px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-account-plans-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-dialog {\n        display: grid;\n        width: min(1180px, 100%);\n        height: min(760px, calc(100vh - 24px));\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plans-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 14px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-header h2 {\n        margin: 0;\n        font-size: 20px;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-account-plans-header p {\n        margin: 5px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-account-plans-content {\n        display: grid;\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-content > .opportunities-extension-account-plans-skeleton {\n        grid-row: 1 / -1;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation {\n        position: relative;\n        min-width: 0;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation .opportunities-extension-account-plans-tab-navigation-button[hidden] {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tabs {\n        display: flex;\n        min-width: 0;\n        gap: 4px;\n        overflow-x: auto;\n        padding: 8px 20px 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-account-plans-tabs::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button {\n        display: grid;\n        position: absolute;\n        z-index: 1;\n        top: 50%;\n        width: 32px;\n        height: 32px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        box-shadow: 0 2px 6px rgba(0, 0, 0, .16);\n        transform: translateY(-50%);\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:first-child {\n        left: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:last-child {\n        right: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-account-plans-panels {\n        min-width: 0;\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plan-tab {\n        min-height: 38px;\n        flex: 0 0 auto;\n        padding: 7px 12px;\n        border: 0;\n        border-bottom: 3px solid transparent;\n        background: transparent;\n        color: #5f5a55;\n        font-size: 13px;\n        font-weight: 600;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plan-tab:hover {\n        background: #f0eeeb;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #00758f;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-account-plan-tab:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-account-plan-panel {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        box-sizing: border-box;\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plan-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plan-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        margin: 0;\n      }\n\n      .opportunities-extension-account-plan-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        gap: 10px;\n        min-height: 42px;\n        align-items: center;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plan-details dt {\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-account-plan-details dd {\n        min-width: 0;\n        margin: 0;\n        color: #312d2a;\n        font-size: 13px;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-consumption-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 14px;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-trend-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        gap: 24px;\n      }\n\n      .opportunities-extension-consumption-periods {\n        display: flex;\n        align-items: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-periods button {\n        min-height: 38px;\n        padding: 7px 14px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-periods button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #00758f;\n        background: #e7f6f8;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-periods button:focus-visible,\n      .opportunities-extension-consumption-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-consumption-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 4px;\n      }\n\n      .opportunities-extension-consumption-navigation {\n        display: grid;\n        grid-template-columns: 36px minmax(130px, auto) 36px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 40px;\n        margin-bottom: 2px;\n      }\n\n      .opportunities-extension-consumption-navigation strong {\n        color: #312d2a;\n        font-size: 13px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-navigation-button {\n        display: grid;\n        width: 36px;\n        height: 36px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-consumption-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-consumption-figure {\n        position: relative;\n        min-width: 0;\n        min-height: 0;\n        margin: 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-consumption-figure::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-consumption-visual {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 176px;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-consumption-svg {\n        display: block;\n        width: 100%;\n        height: 300px;\n        min-height: 0;\n        overflow: visible;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #dedbd7;\n        stroke-width: 1;\n        shape-rendering: crispEdges;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #5f5a55;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #312d2a;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #b77888;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #de7907;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #de7907;\n        stroke-width: 1.5;\n        stroke-dasharray: 6 6;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group {\n        cursor: default;\n        outline: none;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group rect {\n        transition: filter .16s ease, opacity .16s ease, stroke .16s ease;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        filter: brightness(1.06);\n        stroke: #312d2a;\n        stroke-width: 1.5;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-label {\n        opacity: 0;\n        animation: opportunities-extension-consumption-label-in .24s ease-out forwards;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-average {\n        opacity: 0;\n        animation: opportunities-extension-consumption-average-in .35s .32s ease-out forwards;\n      }\n\n      @keyframes opportunities-extension-consumption-label-in {\n        from { opacity: 0; transform: translateY(4px); }\n        to { opacity: 1; transform: translateY(0); }\n      }\n\n      @keyframes opportunities-extension-consumption-average-in {\n        from { opacity: 0; }\n        to { opacity: 1; }\n      }\n\n      .opportunities-extension-consumption-legend {\n        display: grid;\n        align-content: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-legend button {\n        display: grid;\n        min-width: 0;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: center;\n        gap: 8px;\n        padding: 6px 4px;\n        border: 0;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.25;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-legend button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-legend button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 1px;\n      }\n\n      .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #77726d;\n        opacity: .55;\n      }\n\n      .opportunities-extension-consumption-legend-swatch {\n        display: block;\n        width: 12px;\n        height: 12px;\n        justify-self: center;\n      }\n\n      .opportunities-extension-consumption-legend-funded {\n        background: #b77888;\n      }\n\n      .opportunities-extension-consumption-legend-overage {\n        background: #de7907;\n      }\n\n      .opportunities-extension-consumption-legend-average {\n        height: 0;\n        border-top: 2px dashed #de7907;\n      }\n\n      .opportunities-extension-consumption-tooltip {\n        position: absolute;\n        z-index: 2;\n        display: grid;\n        min-width: 190px;\n        max-width: 260px;\n        gap: 4px;\n        padding: 10px 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .2);\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.3;\n        pointer-events: none;\n      }\n\n      .opportunities-extension-consumption-tooltip[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-consumption-tooltip strong {\n        margin-bottom: 2px;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton {\n        height: 100%;\n        min-height: 0;\n        padding: 34px 62px 24px;\n        box-sizing: border-box;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot {\n        display: flex;\n        height: 100%;\n        min-height: 220px;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px;\n        border-bottom: 1px solid #dedbd7;\n        border-left: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot span {\n        width: min(38px, 6%);\n        border-radius: 2px 2px 0 0;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-consumption-chart-empty,\n      .opportunities-extension-consumption-chart-error {\n        display: grid;\n        min-height: 220px;\n        place-items: center;\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-chart-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-account-plan-status-indicator {\n        display: inline-block;\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        background: #9b9691;\n        box-shadow: 0 0 0 3px #efedeb;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #3f6f17;\n        box-shadow: 0 0 0 3px #e2f2e5;\n      }\n\n      .opportunities-extension-account-plan-tab .opportunities-extension-account-plan-status-indicator {\n        margin-right: 8px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs {\n        display: flex;\n        min-height: 46px;\n        align-items: center;\n        padding: 0 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-skeleton-panel {\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tab {\n        display: inline-flex;\n        align-items: center;\n        gap: 9px;\n        min-height: 38px;\n        padding: 0 12px;\n        border-bottom: 3px solid #00758f;\n      }\n\n      .opportunities-extension-account-plans-skeleton-status {\n        display: block;\n        width: 10px;\n        height: 10px;\n        flex: 0 0 auto;\n        border-radius: 50%;\n        background: #dedbd7;\n        box-shadow: 0 0 0 3px #efedeb;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        padding: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        align-items: center;\n        gap: 10px;\n        min-height: 42px;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plans-skeleton-bar {\n        display: block;\n        height: 12px;\n        border-radius: 3px;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs .opportunities-extension-account-plans-skeleton-bar {\n        height: 14px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-label {\n        width: 74%;\n        height: 10px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        margin: 14px 0 0;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend-header {\n        display: flex;\n        justify-content: flex-end;\n        min-height: 38px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods {\n        display: flex;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n        height: 12px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-period-active {\n        height: 38px !important;\n        border: 1px solid #8cc8d3;\n        background: #e7f6f8;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation {\n        display: grid;\n        grid-template-columns: 32px 124px 32px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 54px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation .opportunities-extension-account-plans-skeleton-bar {\n        justify-self: center;\n      }\n\n      .opportunities-extension-account-plans-skeleton-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 150px;\n        align-items: center;\n        gap: 28px;\n        padding: 12px 14px 0 62px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot {\n        display: flex;\n        position: relative;\n        height: 300px;\n        min-height: 0;\n        box-sizing: border-box;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px 64px;\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #ebe8e5 58px, #ebe8e5 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        position: absolute;\n        display: block;\n        content: \"\";\n        background: #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before {\n        top: 0;\n        bottom: 64px;\n        left: 0;\n        width: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        right: 0;\n        bottom: 64px;\n        left: 0;\n        height: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot .opportunities-extension-account-plans-skeleton-bar {\n        width: min(38px, 7%);\n        flex: 0 1 38px;\n        border-radius: 2px 2px 0 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend {\n        display: grid;\n        align-content: center;\n        gap: 18px;\n        min-height: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend .opportunities-extension-account-plans-skeleton-bar {\n        height: 11px;\n      }\n\n      @keyframes opportunities-extension-skeleton-pulse {\n        from { opacity: .48; }\n        to { opacity: 1; }\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        .opportunities-extension-account-plans-skeleton-bar,\n        .opportunities-extension-consumption-chart-skeleton-plot span,\n        .opportunities-extension-consumption-svg .consumption-animated-label,\n        .opportunities-extension-consumption-svg .consumption-animated-average {\n          animation: none;\n          opacity: 1;\n        }\n      }\n\n      .opportunities-extension-account-plans-empty,\n      .opportunities-extension-account-plans-error {\n        margin: 0;\n        padding: 28px 20px;\n        color: #5f5a55;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-account-plans-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-preferences-dialog {\n        display: grid;\n        width: min(680px, 100%);\n        max-height: min(720px, calc(100vh - 48px));\n        grid-template-rows: auto minmax(0, 1fr) auto;\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-preferences-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 18px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-preferences-header h2 {\n        margin: 0;\n        font-size: 20px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-preferences-content {\n        min-height: 0;\n        overflow: auto;\n        padding: 20px;\n      }\n\n      .opportunities-extension-preferences-fieldset {\n        min-width: 0;\n        margin: 0;\n        padding: 0;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-fieldset legend {\n        margin-bottom: 12px;\n        padding: 0;\n        color: #312d2a;\n        font-size: 15px;\n        font-weight: 700;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-preferences-options {\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 4px 20px;\n      }\n\n      .opportunities-extension-preferences-option {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        min-width: 0;\n        padding: 9px 8px;\n        border-radius: 4px;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.35;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-option:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-preferences-option input {\n        width: 18px;\n        height: 18px;\n        flex: 0 0 18px;\n        margin: 0;\n        accent-color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-cache-field {\n        display: grid;\n        width: min(280px, 100%);\n        gap: 6px;\n        margin-top: 24px;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-preferences-cache-field select {\n        width: 100%;\n        height: 40px;\n        padding: 0 36px 0 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-preferences-cache-field select:focus {\n        border-color: #00758f;\n        outline: 2px solid #bde7ee;\n        outline-offset: 0;\n      }\n\n      .opportunities-extension-preferences-footer {\n        display: flex;\n        justify-content: flex-end;\n        padding: 14px 20px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-button {\n        min-width: 88px;\n        min-height: 36px;\n        padding: 7px 16px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-button-primary {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-button-primary:hover,\n      .opportunities-extension-button-primary:focus-visible {\n        border-color: #005e73;\n        background: #005e73;\n        outline: none;\n      }\n\n      .opportunities-extension-debug-panel {\n        position: fixed;\n        right: 24px;\n        bottom: 24px;\n        z-index: 1;\n        width: min(640px, calc(100vw - 48px));\n        max-height: min(560px, calc(100vh - 120px));\n        overflow: auto;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 2px 8px rgba(0, 0, 0, .16);\n        padding: 16px;\n        color: #000000;\n      }\n\n      .opportunities-extension-debug-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-debug-panel h2 {\n        margin: 0;\n        font-size: 18px;\n        font-weight: 700;\n        line-height: 1.25;\n      }\n\n      .opportunities-extension-debug-panel p {\n        margin: 4px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-panel-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 12px;\n      }\n\n      .opportunities-extension-debug-visibility-button {\n        width: 34px;\n        height: 34px;\n        flex: 0 0 34px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-debug-visibility-button svg {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-debug-list {\n        display: grid;\n        gap: 10px;\n      }\n\n      .opportunities-extension-debug-item {\n        border: 1px solid #dedbd7;\n        border-left-width: 4px;\n        border-radius: 4px;\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-debug-item[open] {\n        background: #ffffff;\n      }\n\n      .opportunities-extension-debug-item-success {\n        border-left-color: #3f6f17;\n      }\n\n      .opportunities-extension-debug-item-success .opportunities-extension-debug-status {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-debug-item-failed {\n        border-left-color: #c5331f;\n      }\n\n      .opportunities-extension-debug-item-failed .opportunities-extension-debug-status {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-debug-item-pending {\n        border-left-color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-item-pending .opportunities-extension-debug-status {\n        background: #eee8f2;\n        color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        min-height: 42px;\n        padding: 9px 12px 9px 10px;\n        cursor: pointer;\n        list-style: none;\n      }\n\n      .opportunities-extension-debug-heading::-webkit-details-marker {\n        display: none;\n      }\n\n      .opportunities-extension-debug-heading::before {\n        content: \"⌄\";\n        width: 14px;\n        color: #5f5a55;\n        font-size: 16px;\n        line-height: 1;\n        transform: rotate(-90deg);\n        transition: transform .15s ease;\n      }\n\n      .opportunities-extension-debug-item[open] .opportunities-extension-debug-heading::before {\n        transform: rotate(0deg);\n      }\n\n      .opportunities-extension-debug-summary-meta {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        margin-left: auto;\n      }\n\n      .opportunities-extension-debug-http-status,\n      .opportunities-extension-debug-status {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 0 8px;\n        border-radius: 999px;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-debug-http-status {\n        background: #e8f4f6;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-debug-status {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-debug-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-item pre {\n        margin: 0;\n        padding: 8px 12px 12px;\n        color: #312d2a;\n        font-family: Consolas, \"Courier New\", monospace;\n        font-size: 12px;\n        line-height: 1.45;\n        white-space: pre-wrap;\n        word-break: break-word;\n      }\n\n      .opportunities-extension-debug-empty {\n        padding: 14px;\n        border: 1px dashed #b8b2ad;\n        border-radius: 4px;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] {\n        background: #1f1f1f;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-shell,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-body {\n        background: #1f1f1f;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header {\n        border-bottom-color: #4e4a46;\n        background:\n          linear-gradient(90deg, #a8795d 0 11%, #dd5a47 11% 23%, #876e9b 23% 36%, #00a6be 36% 51%, #dfbd76 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header h1,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-value,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dt,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-bar {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-status {\n        background: #5b5753;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-period-active {\n        border-color: #3f7580;\n        background: #23474e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot span {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator {\n        background: #8f8a85;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #7fb05b;\n        box-shadow: 0 0 0 3px #314527;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-form,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-surface,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item[open] {\n        border-color: #4e4a46;\n        background: #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-select-wrap::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger:disabled {\n        background: #292827;\n        color: #918b86;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search::placeholder,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input::placeholder {\n        color: #b5b0ab;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-fieldset legend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dd,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item pre,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel h2 {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation strong {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th {\n        border-bottom-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-footer,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs-navigation,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details > div,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-details > div {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #4e4a46 58px, #4e4a46 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::after {\n        background: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab:hover {\n        background: #3b3937;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #43c4d5;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #43c4d5;\n        background: #173e43;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:hover:not(:disabled),\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #43c4d5;\n        background: #3b3937;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:disabled,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #4e4a46;\n        color: #746f6a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        stroke: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #a8a39e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-funded {\n        background: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-overage {\n        background: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-average {\n        border-top-color: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-tooltip {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option input {\n        accent-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary {\n        border-color: #00a6be;\n        background: #008aa6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:focus-visible {\n        border-color: #43c4d5;\n        background: #006d7a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table tbody tr:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sort-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:focus {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table thead,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th {\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail {\n        border-bottom-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count {\n        border-color: #2f9bae;\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #43c4d5;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"running\"] {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #244f2e;\n        color: #a8dfb7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"error\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count-error {\n        border-color: #b13b34;\n        background: #5f2926;\n        color: #ffb4ad;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-cache-timestamp {\n        background: #3b3937;\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:focus-visible {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #d1cbc6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #ffbf62;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #d2b7e9;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #9bd46a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-total-dashboard-card {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #c0b9b3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #ffb84d;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #cba7e7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #92cf5b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #008aa6;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #6f6863;\n        background: #6f6863;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #b96e00;\n        background: #b96e00;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #755b8b;\n        background: #755b8b;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #4b7f22;\n        background: #4b7f22;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #69c985;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #c3cad3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #ff9d94;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #83bfff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item {\n        border-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button {\n        color: #f6f4f2;\n      }\n\n      @media (min-width: 1201px) and (max-width: 1450px) {\n        .opportunities-extension-table th:nth-child(1) {\n          width: 16%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 18%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 12%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 7%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 8%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 10%;\n        }\n      }\n\n      @media (max-width: 1200px) {\n        .opportunities-extension-table {\n          min-width: 1180px;\n        }\n\n        .opportunities-extension-table th:nth-child(1) {\n          width: 15%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 17%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 13%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 6%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 9%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 11%;\n        }\n      }\n\n      @media (max-width: 700px) {\n        .opportunities-extension-header {\n          padding: 24px 20px 18px;\n        }\n\n        .opportunities-extension-header::before {\n          left: 20px;\n        }\n\n        .opportunities-extension-header h1 {\n          font-size: 22px;\n        }\n\n        .opportunities-extension-header p {\n          font-size: 14px;\n        }\n\n        .opportunities-extension-body {\n          padding: 16px 20px 24px;\n        }\n\n        .opportunities-extension-form {\n          align-items: stretch;\n          flex-wrap: wrap;\n          gap: 14px;\n          min-height: auto;\n          padding: 12px;\n        }\n\n        .opportunities-extension-field {\n          max-width: none;\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-trigger {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-panel {\n          width: min(360px, calc(100vw - 64px));\n        }\n\n        .opportunities-extension-table-search-field {\n          width: 100%;\n        }\n\n        .opportunities-extension-stage-dashboard {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n        }\n\n        .opportunities-extension-stage-dashboard-value {\n          font-size: 18px;\n        }\n\n        .opportunities-extension-preferences-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-account-plans-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-preferences-dialog {\n          max-height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plans-dialog {\n          height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plan-panel {\n          padding: 12px 14px;\n        }\n\n        .opportunities-extension-account-plan-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n        }\n\n        .opportunities-extension-account-plan-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 3px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n          padding: 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 5px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-trend {\n          margin: 14px 0 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          align-items: center;\n          gap: 6px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n          width: 100% !important;\n        }\n\n        .opportunities-extension-account-plans-skeleton-chart {\n          grid-template-columns: minmax(0, 1fr);\n          gap: 12px;\n          padding: 12px 8px 0 34px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-legend {\n          display: flex;\n          min-height: 24px;\n          align-items: center;\n          justify-content: center;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-trend-header {\n          align-items: stretch;\n        }\n\n        .opportunities-extension-consumption-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          gap: 3px;\n        }\n\n        .opportunities-extension-consumption-periods button {\n          min-width: 0;\n          padding: 7px 4px;\n          font-size: 12px;\n        }\n\n        .opportunities-extension-consumption-chart {\n          min-height: 0;\n        }\n\n        .opportunities-extension-consumption-svg {\n          width: 760px;\n          height: 245px;\n        }\n\n        .opportunities-extension-consumption-visual {\n          width: 920px;\n          grid-template-columns: 760px 144px;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-figure {\n          overflow-x: auto;\n          overscroll-behavior-inline: contain;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton {\n          min-height: 0;\n          padding: 24px 18px 18px;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton-plot {\n          min-height: 180px;\n          gap: 4px;\n          padding: 0 6px;\n        }\n\n        .opportunities-extension-preferences-options {\n          grid-template-columns: 1fr;\n        }\n\n        .opportunities-extension-stage-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-status-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-table-surface {\n          min-width: 0;\n          min-height: calc(100vh - 230px);\n        }\n\n        .opportunities-extension-debug-panel {\n          right: 12px;\n          bottom: 12px;\n          width: calc(100vw - 24px);\n          max-height: calc(100vh - 96px);\n        }\n      }\n    \n/* Full-page diagnostics, scoped to the extension and its current theme. */\n.opportunities-extension-modal .opportunities-extension-debug-panel {\n  --debug-surface: #fff;\n  --debug-code: #f5f6f7;\n  --debug-text: #312d2a;\n  --debug-muted: #5f5a55;\n  --debug-border: #dedbd7;\n  --debug-success: #22613b;\n  --debug-success-bg: #e1f1e5;\n  --debug-failed: #a12721;\n  --debug-failed-bg: #fce8e6;\n  --debug-pending: #805000;\n  --debug-pending-bg: #fff1ce;\n  --debug-info: #075e87;\n  --debug-info-bg: #e5f1fa;\n  --debug-key: #075e87;\n  --debug-string: #22613b;\n  --debug-number: #865000;\n  --debug-literal: #73429b;\n  position: fixed;\n  inset: 0;\n  z-index: 50;\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  width: auto;\n  height: auto;\n  max-height: none;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  margin: 0;\n  padding: 20px;\n  border: 0;\n  border-radius: 0;\n  background: var(--debug-surface);\n  color: var(--debug-text);\n  color-scheme: light;\n}\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel {\n  --debug-surface: #292827;\n  --debug-code: #222120;\n  --debug-text: #f6f4f2;\n  --debug-muted: #c9c5c1;\n  --debug-border: #514c47;\n  --debug-success: #a9e3bd;\n  --debug-success-bg: #214d34;\n  --debug-failed: #ffb4ab;\n  --debug-failed-bg: #582c2a;\n  --debug-pending: #ffe099;\n  --debug-pending-bg: #59441e;\n  --debug-info: #a8d9ff;\n  --debug-info-bg: #233f52;\n  --debug-key: #8ed6f0;\n  --debug-string: #a9e3bd;\n  --debug-number: #ffe099;\n  --debug-literal: #d6b7f1;\n  color: #f6f4f2;\n  color-scheme: dark;\n}\n.opportunities-extension-debug-actions { display: flex; gap: 8px; flex: 0 0 auto; }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-list {\n  overflow: auto;\n  min-height: 0;\n  min-width: 0;\n  align-content: start;\n  scrollbar-gutter: stable;\n  padding: 2px 8px 12px 2px;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item {\n  --debug-state: var(--debug-info);\n  --debug-state-bg: var(--debug-info-bg);\n  border-color: var(--debug-border);\n  border-left-color: var(--debug-state);\n  background: var(--debug-surface);\n  min-width: 0;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-success { --debug-state: var(--debug-success); --debug-state-bg: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-failed { --debug-state: var(--debug-failed); --debug-state-bg: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-pending { --debug-state: var(--debug-pending); --debug-state-bg: var(--debug-pending-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-status {\n  color: var(--debug-state);\n  background: var(--debug-state-bg);\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status,\n.opportunities-extension-debug-method {\n  color: var(--debug-info);\n  background: var(--debug-info-bg);\n}\n.opportunities-extension-debug-method {\n  display: inline-flex;\n  align-items: center;\n  min-height: 22px;\n  padding: 0 8px;\n  border-radius: 4px;\n  font: 700 11px/1.2 Consolas, monospace;\n}\n.opportunities-extension-debug-method[data-method=\"POST\"] { color: var(--debug-literal); background: var(--debug-code); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"2\"] { color: var(--debug-success); background: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"4\"],\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"5\"] { color: var(--debug-failed); background: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"pending\"] { color: var(--debug-pending); background: var(--debug-pending-bg); }\n.opportunities-extension-debug-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 14px 16px; }\n.opportunities-extension-debug-block { min-width: 0; border-left: 2px solid var(--debug-info); padding-left: 10px; }\n.opportunities-extension-debug-block[data-direction=\"response\"] { border-left-color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-block h3 { margin: 0 0 8px; color: var(--debug-info); font-size: 12px; }\n.opportunities-extension-modal .opportunities-extension-debug-block[data-direction=\"response\"] h3 { color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item pre {\n  min-width: 0;\n  margin: 0;\n  padding: 12px;\n  max-height: 380px;\n  overflow: auto;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  color: var(--debug-text);\n  background: var(--debug-code);\n  line-height: 1.6;\n  tab-size: 2;\n}\n.opportunities-extension-debug-json-key { color: var(--debug-key); }\n.opportunities-extension-debug-json-string { color: var(--debug-string); }\n.opportunities-extension-debug-json-number { color: var(--debug-number); }\n.opportunities-extension-debug-json-literal { color: var(--debug-literal); }\n@media (max-width: 760px) {\n  .opportunities-extension-modal .opportunities-extension-debug-panel { padding: 12px; }\n  .opportunities-extension-debug-details { grid-template-columns: minmax(0, 1fr); }\n}\n.opportunities-extension-debug-tabs {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  margin-bottom: 12px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid #dedbd7;\n}\n\n.opportunities-extension-debug-tabs button {\n  max-width: 100%;\n  min-height: 32px;\n  padding: 6px 8px;\n  border: 0;\n  border-bottom: 2px solid transparent;\n  border-radius: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.35;\n  overflow-wrap: anywhere;\n  cursor: pointer;\n}\n\n.opportunities-extension-debug-tabs button:hover {\n  background: #f5f4f2;\n}\n\n.opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  border-bottom-color: #00758f;\n  background: #e8f4f6;\n  color: #006b84;\n  font-weight: 700;\n}\n\n.opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline: 2px solid #00758f;\n  outline-offset: -2px;\n}\n\n.opportunities-extension-debug-time {\n  font-size: 11px;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.opportunities-extension-debug-heading {\n  flex-wrap: wrap;\n}\n\n.opportunities-extension-debug-heading strong {\n  flex: 1 1 180px;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-debug-summary-meta {\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button {\n  color: #f6f4f2;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading::before {\n  color: #c9c5c1;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs {\n  border-bottom-color: #514c47;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:hover {\n  background: #383633;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  background: #173f48;\n  border-bottom-color: #8cc8d3;\n  color: #bde7ee;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline-color: #8cc8d3;\n}\n\n/* Compact filters use available CSS width, including Windows display scaling. */\n.opportunities-extension-products-progress,\n.opportunities-extension-auth-badge { opacity: 1; transition: opacity 300ms ease; }\n.opportunities-extension-products-progress[data-fading=\"true\"],\n.opportunities-extension-auth-badge[data-fading=\"true\"] { opacity: 0; }\n.opportunities-extension-auth-badge[hidden] { display: none; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-products-progress,\n  .opportunities-extension-auth-badge { transition: none; }\n}\n.opportunities-extension-crm-sr-badge {\n  flex: 0 0 auto;\n  padding: 0 6px;\n  border: 1px solid #408254;\n  border-radius: 8px;\n  font-size: 10px;\n  line-height: 18px;\n  font-weight: 600;\n  white-space: nowrap;\n  color: #185b30;\n  background: #e1f1e5;\n}\n.opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #9f201b; background: #fde8e7; border-color: #c74640; }\n.opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #785000; background: #fff0cd; border-color: #987021; }\n.opportunities-extension-wl-actions-badge[data-state=\"loading\"] { color: #5f5a55; background: #eceae8; border-color: #8f8a85; }\n.opportunities-extension-crm-sr-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge { color: #b8e4c6; background: #214d34; border-color: #6eac82; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #ffd9d5; background: #542824; border-color: #ef938b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #ffe0a3; background: #584219; border-color: #c99b4b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-wl-actions-badge[data-state=\"loading\"] { color: #dedbd7; background: #484541; border-color: #8f8a85; }\n\n.opportunities-extension-form {\n  display: grid;\n  grid-template-columns: max-content minmax(110px, 1fr) minmax(110px, 1fr) minmax(145px, 180px) max-content max-content;\n  align-items: end;\n  gap: 12px;\n  min-height: 0;\n  padding: 12px;\n}\n\n.opportunities-extension-form > * {\n  min-width: 0;\n  width: 100%;\n  max-width: none;\n  grid-template-rows: auto 32px;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.opportunities-extension-form > * > span:first-child {\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap {\n  width: 100%;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger,\n.opportunities-extension-form .opportunities-extension-table-search-field input {\n  box-sizing: border-box;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  min-height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger {\n  padding-right: 26px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap::after,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger::after {\n  right: 10px;\n  border-left-width: 4px;\n  border-right-width: 4px;\n  border-top-width: 5px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-controls,\n.opportunities-extension-form .opportunities-extension-status-filter-controls {\n  flex-wrap: nowrap;\n  gap: 4px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-button,\n.opportunities-extension-form .opportunities-extension-status-filter-button {\n  min-height: 28px;\n  padding: 4px 7px;\n  font-size: 11px;\n  line-height: 18px;\n  white-space: nowrap;\n}\n\n/* Native select intrinsic sizing includes its longest option, not just the selection. */\n@media (min-width: 1151px) {\n  .opportunities-extension-form > .opportunities-extension-field,\n  .opportunities-extension-form .opportunities-extension-select-wrap,\n  .opportunities-extension-form .opportunities-extension-field select {\n    width: max-content;\n    max-width: none;\n  }\n}\n\n@media (max-width: 1150px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-column: span 2;\n  }\n}\n\n@media (max-width: 700px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .opportunities-extension-form .opportunities-extension-stage-filter-controls,\n  .opportunities-extension-form .opportunities-extension-status-filter-controls {\n    flex-wrap: wrap;\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-template-rows: auto auto;\n  }\n}\n\n@media (max-width: 420px) {\n  .opportunities-extension-form { grid-template-columns: minmax(0, 1fr); }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter { grid-column: auto; }\n}\n\n/* Keep layout rules on the outer table, never on expanded product tables. */\n.opportunities-extension-table[data-opportunities-layout=\"inline-actions\"] {\n  width: 100%;\n  min-width: 1120px;\n  table-layout: fixed;\n}\n\n/* Fixed table layout shares leftover width only between the two auto columns. */\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"owner\"] { width: 132px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"optyNumber\"] { width: 106px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"revenue\"] { width: 124px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"closeDate\"] { width: 100px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"status\"] { width: 114px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"winProbability\"] { width: 110px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"stage\"] { width: 94px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"lastUpdateDate\"] { width: 136px; }\n\n.opportunities-extension-table > tbody > tr > td[data-column] {\n  padding: 10px 8px;\n  overflow: visible;\n  text-overflow: clip;\n  white-space: normal;\n  font-variant-numeric: tabular-nums;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"name\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] {\n  position: relative;\n  padding-right: 16px;\n  padding-left: 12px;\n  padding-bottom: 38px;\n  vertical-align: top;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"owner\"] {\n  padding-right: 16px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"closeDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"lastUpdateDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"status\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"stage\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"winProbability\"] {\n  white-space: nowrap;\n}\n\n.opportunities-extension-cell-content {\n  display: block;\n  min-width: 0;\n  min-height: 2.7em;\n  line-height: 1.35;\n}\n\n.opportunities-extension-cell-content > :first-child {\n  display: block;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-cell-actions {\n  position: absolute;\n  left: 12px;\n  right: 16px;\n  bottom: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: 6px;\n  height: 24px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button {\n  flex: 0 0 24px;\n  width: 24px;\n  height: 24px;\n  padding: 2px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] .opportunities-extension-cell-actions {\n  min-width: 84px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button svg {\n  width: 18px;\n  height: 18px;\n}\n\n.opportunities-extension-cell-actions button:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n}\n\n.opportunities-extension-products-ramp {\n  display: inline-block;\n  min-width: 0;\n  max-width: 100%;\n  padding: 0 6px;\n  border: 1px solid #bba5cf;\n  border-radius: 8px;\n  background: #f0e8f7;\n  color: #63358a;\n  font-size: 10px;\n  font-weight: 600;\n  line-height: 16px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp {\n  background: #43334f;\n  color: #ead5fc;\n  border-color: #9372ac;\n}\n\n.opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #fde8e7;\n  color: #9f201b;\n  border-color: #c74640;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #542824;\n  color: #ffd9d5;\n  border-color: #ef938b;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  gap: 6px;\n  padding: 10px 8px;\n  align-items: center;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] .opportunities-extension-sort-button,\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] .opportunities-extension-sort-button {\n  padding-left: 12px;\n  padding-right: 16px;\n}\n\n.opportunities-extension-sort-label {\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button::after {\n  position: static;\n  justify-self: end;\n}\n.opportunities-extension-crm-sr-badge[type=\"button\"] { cursor: pointer; font-family: inherit; }\n.opportunities-extension-sr-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; overflow: auto;\n  padding: 12px; border: 1px solid #b9b5b0; border-radius: 6px;\n  background: #fff; color: #302e2b; box-shadow: 0 6px 24px #0003;\n  font: 12px/1.5 Arial, sans-serif; text-align: left; overflow-wrap: anywhere;\n}\n.opportunities-extension-sr-popover section { padding: 8px 0; }\n.opportunities-extension-sr-popover section + section { border-top: 1px solid #dedbd7; }\n.opportunities-extension-sr-number { display: flex; align-items: center; gap: 8px; padding-right: 30px; font-weight: 600; }\n.opportunities-extension-sr-popover a { color: #00677d; text-decoration: underline; }\n.opportunities-extension-sr-details { white-space: pre-wrap; margin-top: 6px; }\n.opportunities-extension-sr-dismiss {\n  position: absolute; top: 6px; right: 6px; width: 28px; height: 28px;\n  display: grid; place-items: center; padding: 4px; border: 0;\n  background: transparent; color: inherit; cursor: pointer;\n}\n.opportunities-extension-sr-dismiss svg { width: 16px; height: 16px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover { background: #292827; color: #f1efec; border-color: #77716b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover section + section { border-color: #5f5953; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover a { color: #7ddced; }\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog {\n  width: min(1700px, 100%);\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header {\n  padding: 10px 12px;\n  gap: 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header h2 {\n  font-size: 16px;\n  line-height: 22px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header p {\n  font-size: 12px;\n  line-height: 16px;\n  margin-top: 3px;\n  overflow-wrap: anywhere;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-icon-button {\n  width: 28px;\n  height: 28px;\n  min-width: 28px;\n  min-height: 28px;\n  padding: 4px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-toolbar {\n  padding: 8px 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-search {\n  width: min(320px, 100%);\n  height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n.opportunities-extension-install-base-content {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  scrollbar-gutter: stable;\n}\n.opportunities-extension-install-base-message { margin: 10px 12px; font-size: 12px; line-height: 16px; }\n.opportunities-extension-install-base-table {\n  width: 100%; min-width: 1120px; table-layout: fixed; border-collapse: collapse; font-size: 11px;\n}\n.opportunities-extension-install-base-table col { width: 7%; }\n.opportunities-extension-install-base-table .install-base-col-partyName { width: 12%; }\n.opportunities-extension-install-base-table .install-base-col-productGroupName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-productName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-quantity { width: 5%; }\n.opportunities-extension-install-base-table .install-base-col-quantityType { width: 8%; }\n.opportunities-extension-install-base-table th,\n.opportunities-extension-install-base-table td {\n  padding: 8px 6px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-install-base-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-install-base-table td[data-format=\"amount\"],\n.opportunities-extension-install-base-table td[data-format=\"quantity\"] { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-install-base-table td[data-format=\"date\"] { white-space: nowrap; }\n.opportunities-extension-install-base-status {\n  display: inline-block; padding: 2px 5px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\n.opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #855300; background: #fff0d6; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #b8e4c6; background: #214d34; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #ffdfa2; background: #614418; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-install-base-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog { width: min(1700px, 100%); }\n.opportunities-extension-service-requests-content { min-width: 0; min-height: 0; overflow: auto; scrollbar-gutter: stable; }\n.opportunities-extension-service-requests-message { margin: 16px; font-size: 13px; }\n.opportunities-extension-service-requests-table {\n  width: 100%; min-width: 1200px; table-layout: fixed; border-collapse: collapse; font-size: 12px;\n}\n.opportunities-extension-service-requests-table col { width: 7%; }\n.opportunities-extension-service-requests-table .service-requests-col-name { width: 17%; }\n.opportunities-extension-service-requests-table .service-requests-col-id { width: 10%; }\n.opportunities-extension-service-requests-table .service-requests-col-severity { width: 5%; }\n.opportunities-extension-service-requests-table .service-requests-col-subStatus { width: 14%; }\n.opportunities-extension-service-requests-table .service-requests-col-productName { width: 12%; }\n.opportunities-extension-service-requests-table th,\n.opportunities-extension-service-requests-table td {\n  padding: 12px 8px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-service-requests-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-service-requests-table td[data-field=\"created\"],\n.opportunities-extension-service-requests-table td[data-field=\"lastUpdated\"],\n.opportunities-extension-service-requests-table td[data-field=\"id\"] { white-space: nowrap; font-variant-numeric: tabular-nums; }\n.opportunities-extension-service-request-status {\n  display: inline-block; padding: 3px 6px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8;\n}\n.opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #b8e4c6; background: #214d34; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-service-requests-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n/* Scope sizing to Cloud Consumption, not other dialogs sharing its components. */\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header { padding: 10px 12px; gap: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header h2 { font-size: 16px; line-height: 22px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header p { font-size: 12px; line-height: 16px; margin-top: 3px; overflow-wrap: anywhere; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-icon-button { width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 4px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-tabs { padding: 4px 12px 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-tab { min-height: 30px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { padding: 8px 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { gap: 0 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details > div { grid-template-columns: minmax(85px, 35%) minmax(0, 1fr); min-height: 32px; padding: 4px 0; gap: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dt { font-size: 11px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dd { font-size: 12px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-trend { margin-top: 8px; padding-top: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-periods button { min-height: 28px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation { grid-template-columns: 28px minmax(120px, auto) 28px; min-height: 30px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation strong { font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation-button { width: 28px; height: 28px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-svg { height: 100%; max-height: 100%; min-width: 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend button { font-size: 11px; padding: 4px; gap: 5px; }\n\n/* Small viewports must scroll rather than clip details or collapse the chart. */\n@media (max-height: 560px), (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-panels { overflow: auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { height: auto; min-height: 100%; grid-template-rows: auto minmax(280px, 1fr); }\n}\n@media (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { grid-template-columns: minmax(0, 1fr); }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend { display: flex; flex-wrap: wrap; }\n}\n\n.opportunities-extension-plan-detail-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }\n.opportunities-extension-consumption-trend-header { align-items: center; justify-content: space-between; gap: 12px; }\n.opportunities-extension-consumption-trend-header > .opportunities-extension-plan-detail-badges { min-width: 0; }\n.opportunities-extension-plan-detail-skeleton { width: 64px; height: 20px; }\n.opportunities-extension-projection-badge {\n  display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent;\n  padding: 3px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; line-height: 1.3;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\nbutton.opportunities-extension-projection-badge { cursor: pointer; }\n.opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #a12424; background: #fbe5e5; }\n.opportunities-extension-projection-badge[data-status=\"overage\"] { color: #185a9d; background: #e0edfc; }\n.opportunities-extension-projection-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-projection-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; padding: 14px; overflow: auto; overscroll-behavior: contain;\n  border: 1px solid #b9b4ae; border-radius: 4px; background: #ffffff; color: #312d2a;\n  box-shadow: 0 4px 16px #0003; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere;\n}\n.opportunities-extension-projection-popover[hidden] { display: none; }\n.opportunities-extension-projection-popover .opportunities-extension-projection-dismiss {\n  display: grid; place-items: center; width: 24px; height: 24px; margin-left: auto; margin-bottom: 8px; padding: 4px; border: 1px solid #b9b4ae;\n  border-radius: 4px; background: transparent; color: inherit; cursor: pointer; font-size: 12px;\n}\n.opportunities-extension-projection-dismiss svg { width: 14px; height: 14px; }\n.opportunities-extension-projection-line h3 { margin: 0 0 8px; font-size: 12px; }\n.opportunities-extension-projection-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; }\n.opportunities-extension-projection-fields > div { min-width: 0; }\n.opportunities-extension-projection-fields dt { font-weight: 600; color: #5f5a55; font-size: 11px; }\n.opportunities-extension-projection-fields dd { margin: 2px 0 0; font-variant-numeric: tabular-nums; }\n.opportunities-extension-projection-fields a { color: #006d7a; text-decoration: underline; }\n.opportunities-extension-projection-children { margin-top: 14px; padding-left: 12px; border-left: 2px solid #dedbd7; }\n.opportunities-extension-projection-children > section + section { margin-top: 16px; }\n.opportunities-extension-plan-detail-error { color: #a12424; font-size: 12px; }\n.opportunities-extension-projection-empty { color: #5f5a55; font-size: 12px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-popover { color: #f1efec; background: #302e2b; border-color: #716b64; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #ffb9b9; background: #682e32; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"overage\"] { color: #c5dfff; background: #224b76; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields dt,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-empty { color: #cec9c2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields a { color: #76dbea; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-plan-detail-error { color: #ffb9b9; }\n@media (max-width: 480px) { .opportunities-extension-projection-fields { grid-template-columns: minmax(0, 1fr); } }\n@media (max-width: 480px) {\n  .opportunities-extension-consumption-trend-header > .opportunities-extension-consumption-periods { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n}\n@media (prefers-reduced-motion: reduce) { .opportunities-extension-plan-detail-skeleton { animation: none; } }\n\n.opportunities-extension-account-plan-details > .opportunities-extension-contract-row {\n  align-items: center;\n}\n.opportunities-extension-contract-row > dt,\n.opportunities-extension-contract-row > dd,\n.opportunities-extension-contract-ratecard > span {\n  line-height: 20px;\n}\n.opportunities-extension-contract-ratecard {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n.opportunities-extension-ratecard-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  align-self: center;\n  box-sizing: border-box;\n  height: 28px;\n  margin: 0;\n  flex: 0 0 auto;\n  padding: 0 8px;\n  border: 1px solid #8aaeb9;\n  border-radius: 4px;\n  background: #fff;\n  color: #006b80;\n  font: inherit;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 20px;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-button:hover { background: #e8f4f6; }\n.opportunities-extension-ratecard-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 8;\n  display: flex;\n  justify-content: flex-end;\n  overflow: hidden;\n  overflow: clip;\n  background: rgba(0, 0, 0, 0);\n  transition: background-color 320ms ease;\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] { background: rgba(0, 0, 0, .32); }\n.opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #fff;\n  --ratecard-heading: #faf9f8;\n  --ratecard-text: #312d2a;\n  --ratecard-muted: #615a55;\n  --ratecard-border: #dedbd8;\n  --ratecard-accent: #00758f;\n  --ratecard-skeleton: #eae7e4;\n  display: grid;\n  grid-template-rows: auto auto auto minmax(0, 1fr);\n  width: min(1520px, calc(100% - 48px));\n  height: 100%;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  box-shadow: -6px 0 24px rgba(0, 0, 0, .2);\n  transform: translateX(100%);\n  transition: transform 320ms cubic-bezier(.22, .61, .36, 1);\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(0); }\n.opportunities-extension-ratecard-header > div { min-width: 0; overflow-wrap: anywhere; }\n.opportunities-extension-ratecard-plan-details { padding: 12px 20px 0; }\n.opportunities-extension-ratecard-toolbar { display: flex; align-items: center; gap: 16px; padding: 12px 20px; }\n.opportunities-extension-ratecard-search {\n  width: min(360px, 100%);\n  min-width: 0;\n  box-sizing: border-box;\n  padding: 9px 12px;\n  border: 1px solid var(--ratecard-muted);\n  border-radius: 4px;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-ratecard-search::placeholder { color: var(--ratecard-muted); opacity: 1; }\n.opportunities-extension-ratecard-count { color: var(--ratecard-muted); font-size: 12px; white-space: nowrap; }\n.opportunities-extension-ratecard-viewport { overflow: auto; min-height: 0; min-width: 0; scrollbar-gutter: stable; }\n.opportunities-extension-ratecard-table { width: 100%; min-width: 1100px; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 12px; }\n.opportunities-extension-ratecard-table th, .opportunities-extension-ratecard-table td {\n  padding: 11px 10px;\n  border-bottom: 1px solid var(--ratecard-border);\n  vertical-align: top;\n  overflow-wrap: anywhere;\n  text-align: left;\n}\n.opportunities-extension-ratecard-table th { position: sticky; top: 0; z-index: 1; background: var(--ratecard-heading); }\n.opportunities-extension-ratecard-sort {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  align-items: center;\n  gap: 5px;\n  width: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-weight: 600;\n  text-align: left;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-sort-icon { color: var(--ratecard-accent); text-align: center; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-numeric { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-notice { padding: 28px 20px; text-align: center; }\n.opportunities-extension-ratecard-notice [role=\"alert\"] { color: #b3261e; }\n.opportunities-extension-ratecard-skeleton { display: block; width: 85%; height: 14px; border-radius: 3px; background: var(--ratecard-skeleton); animation: opportunities-ratecard-pulse 1.1s ease-in-out infinite alternate; }\n.opportunities-extension-ratecard-drawer :focus-visible, .opportunities-extension-ratecard-button:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] { pointer-events: none; background: rgba(0, 0, 0, 0); transition-duration: 180ms; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(100%); transition-duration: 180ms; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #292725;\n  --ratecard-heading: #35322f;\n  --ratecard-text: #f5f3f1;\n  --ratecard-muted: #c2bcb6;\n  --ratecard-border: #514c47;\n  --ratecard-accent: #59d1e5;\n  --ratecard-skeleton: #514c47;\n}\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button { color: #59d1e5; border-color: #6298a2; background: #292725; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button:hover { background: #313f40; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-notice [role=\"alert\"] { color: #ffb4ab; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer :focus-visible, [data-theme=\"dark\"] .opportunities-extension-ratecard-button:focus-visible { outline-color: #59d1e5; }\n@keyframes opportunities-ratecard-pulse { from { opacity: .45; } to { opacity: 1; } }\n@media (max-width: 720px) {\n  .opportunities-extension-ratecard-drawer { width: 100%; }\n  .opportunities-extension-ratecard-toolbar { flex-wrap: wrap; gap: 8px; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-ratecard-overlay, .opportunities-extension-ratecard-drawer, .opportunities-extension-ratecard-skeleton,\n  .opportunities-extension-ratecard-overlay[data-closing=\"true\"], .opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { animation: none; transition: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog,\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog {\n  grid-template-rows: auto auto minmax(0, 1fr);\n}\n.opportunities-extension-customer-table-toolbar { padding: 12px 16px; border-bottom: 1px solid #dedbd7; }\n.opportunities-extension-customer-table-search {\n  box-sizing: border-box;\n  width: min(420px, 100%);\n  min-width: 0;\n  height: 38px;\n  padding: 8px 12px;\n  border: 1px solid #8f8a85;\n  border-radius: 4px;\n  background: #fff;\n  color: #312d2a;\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-customer-table-search::placeholder { color: #5f5a55; opacity: 1; }\n.opportunities-extension-customer-table-search:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-toolbar { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search { background: #353331; color: #f6f4f2; border-color: #8f8a85; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search::placeholder { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search:focus-visible { outline-color: #59d1e5; }\n";
 // Source: src/shared/messages.js
 /** Stable wire names. All payloads remain plain, serializable objects. */
 function createMessageTypes() {
@@ -14,6 +14,7 @@ function createMessageTypes() {
     requestAccountPlans: "opportunitiesExtension.requestAccountPlans",
     requestInstallBase: "opportunitiesExtension.requestInstallBase",
     requestCustomerServiceRequest: "opportunitiesExtension.requestCustomerServiceRequest",
+    requestWlActions: "opportunitiesExtension.requestWlActions",
     requestConsumptionTrend: "opportunitiesExtension.requestConsumptionTrend",
     requestConsumptionPlanDetail: "opportunitiesExtension.requestConsumptionPlanDetail",
     requestRatecardByPlan: "opportunitiesExtension.requestRatecardByPlan"
@@ -170,6 +171,7 @@ function createAuthSessionState({ AUTH_STATUS } = {}) {
     tokenRelayRequest: null,
     consumerTokenServiceRequest: null,
     accessToken: "",
+    principal: "",
     authStatus: AUTH_STATUS.idle
   };
 }
@@ -465,6 +467,8 @@ function createContentModal({
   requestOpportunitiesForPeriod,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
+  reopenWorkloadActions,
   requestTokenRelayOnce,
   resetCustomerAndOwnerFiltersForPeriod,
   resetOpportunitiesTable,
@@ -475,7 +479,15 @@ function createContentModal({
   toggleOwnerFilterPanel,
   environment
 }) {
-  const { document, window } = environment;
+  const { document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let authCompletion = null;
+  function resetAuthCompletion() {
+    if (!authCompletion) return;
+    clearTimeout(authCompletion.waitTimer);
+    clearTimeout(authCompletion.hideTimer);
+    authCompletion.badge.setAttribute("data-fading", "false");
+    authCompletion = null;
+  }
   function openOpportunitiesModal() {
     ensureExtensionStyles();
     debugState.debugSecretsVisible = false;
@@ -484,6 +496,7 @@ function createContentModal({
 
     if (existingModal) {
       existingModal.hidden = false;
+      reopenWorkloadActions();
       existingModal.querySelector("select").focus();
       document.documentElement.classList.add("opportunities-extension-scroll-lock");
       ensureEscapeKeyHandler();
@@ -497,6 +510,7 @@ function createContentModal({
     authSessionState.tokenRelayRequest = null;
     authSessionState.consumerTokenServiceRequest = null;
     authSessionState.accessToken = "";
+    authSessionState.principal = "";
     opportunitiesQueryState.periodRequestVersion = 0;
     authSessionState.authStatus = AUTH_STATUS.idle;
     resetOpportunitiesTable();
@@ -834,6 +848,24 @@ function createContentModal({
       ? status
       : AUTH_STATUS.pending;
 
+    if (authCompletion && (authCompletion.badge !== badge || badgeStatus !== AUTH_STATUS.authenticated)) resetAuthCompletion();
+    badge.hidden = Boolean(authCompletion?.hidden);
+    if (badgeStatus === AUTH_STATUS.authenticated && !authCompletion) {
+      const current = { badge, hidden: false, waitTimer: null, hideTimer: null };
+      authCompletion = current;
+      badge.setAttribute("data-fading", "false");
+      current.waitTimer = setTimeout(() => {
+        if (authCompletion !== current) return;
+        badge.setAttribute("data-fading", "true");
+        const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+        current.hideTimer = setTimeout(() => {
+          if (authCompletion !== current) return;
+          current.hidden = true;
+          badge.hidden = true;
+        }, reducedMotion ? 0 : 300);
+      }, 5000);
+    }
+
     badge.setAttribute("data-auth-status", badgeStatus);
     badge.className = `opportunities-extension-auth-badge opportunities-extension-auth-badge-${badgeStatus}`;
     badge.textContent = badgeStatus === AUTH_STATUS.authenticated
@@ -844,6 +876,8 @@ function createContentModal({
   }
 
   function closeOpportunitiesModal() {
+    resetAuthCompletion();
+    resetWorkloadActions(false);
     resetCrmServiceRequests();
     const modal = document.getElementById(MODAL_ID);
 
@@ -1115,6 +1149,7 @@ function createAuthContentSession({
         })
         .catch((error) => {
           authSessionState.accessToken = "";
+          authSessionState.principal = "";
           authSessionState.authStatus = AUTH_STATUS.unauthenticated;
           throw error;
         })
@@ -1189,6 +1224,7 @@ function createAuthSalesCommon({
 // Source: src/auth/token-relay.js
 function createAuthTokenRelay({
   TOKEN_RELAY_URL,
+  authSessionState,
   createDebugBody,
   getXsrfToken,
   logRequestFailure,
@@ -1202,6 +1238,7 @@ function createAuthTokenRelay({
 }) {
   const { fetch } = environment;
   async function requestTokenRelay({ name = "requestTokenRelay", url = TOKEN_RELAY_URL, includeExpiry = false } = {}) {
+    if (url === TOKEN_RELAY_URL) authSessionState.principal = "";
     let refreshResult = null;
     let refreshAttempted = false;
 
@@ -1284,6 +1321,9 @@ function createAuthTokenRelay({
           access_token: maskToken(responseData.access_token)
         }, null, 2)));
 
+        if (url === TOKEN_RELAY_URL) {
+          authSessionState.principal = typeof responseData.principal === "string" ? responseData.principal.trim() : "";
+        }
         if (includeExpiry) {
           const lifetime = Number(responseData.expires_in);
           return {
@@ -1525,6 +1565,7 @@ function createOpportunitiesController({
   requestOpportunitiesPage,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
   requestOpptyProductsInBackground,
   requestTokenRelayOnce,
   setOpportunitiesTableState
@@ -1616,6 +1657,7 @@ function createOpportunitiesController({
   }
 
   function resetOpportunitiesTable() {
+    resetWorkloadActions();
     resetCrmServiceRequests();
     opportunitiesFilterState.selectedStages = new Set(STAGE_OPTIONS);
     opportunitiesFilterState.selectedStatuses = new Set(STATUS_OPTIONS);
@@ -1891,12 +1933,12 @@ function createFusionCrmServiceRequests({ isCurrentPeriodRequest,
 }
 
 // Source: src/features/opportunities/crm-service-requests.js
-function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, environment }) {
+function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, bindPopover, closePopover, environment }) {
   let status = "idle";
   let byOpportunity = new Map();
   let pending = null;
   let generation = 0;
-  function reset() { generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
+  function reset() { closePopover(); generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
   function load(token, version) {
     if (!isCurrentPeriodRequest(version)) return;
     if (!pending) pending = run(token, version, generation);
@@ -1925,28 +1967,250 @@ function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurre
   function createBadge(optyNumber) {
     if (!optyNumber || status === "idle" || status === "loading") return null;
     const items = byOpportunity.get(String(optyNumber)) || [];
-    const badge = environment.document.createElement("span");
+    const badge = environment.document.createElement(items.length && status === "ready" ? "button" : "span");
     badge.className = "opportunities-extension-crm-sr-badge";
     badge.setAttribute("data-state", status === "error" ? "error" : items.length ? "matched" : "missing");
     badge.textContent = status === "error" ? "SR ?" : items.length ? "\u2705 SR" : "\u26d4 SR";
     const display = value => value === null || value === undefined || value === "" ? "N/D" : String(value);
-    badge.title = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
-      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
-      : items.map(item => [
-        `SR Number: ${display(item.SrNumber)}`, `Title: ${display(item.Title)}`,
+    const descriptions = items.map(item => [
+        `Title: ${display(item.Title)}`,
         `Opportunity: ${display(item.OpportunityName_Id_c?.OptyNumber)}`,
         `Reported Hours: ${display(item.ReportedHours_c)}`,
         `Owner: ${[item.Owner?.PersonFirstName, item.Owner?.PersonLastName].filter(Boolean).join(" ") || "N/D"}`,
         `Email: ${display(item.Owner?.PrimaryEmail?.EmailAddress)}`,
         `Do Not Call: ${display(item.DoNotCallFlag)}`, `Do Not Email: ${display(item.DoNotEmailFlag)}`
-      ].join("\n")).join("\n\n");
-    badge.setAttribute("aria-label", badge.title);
+      ].join("\n"));
+    const description = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
+      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
+      : items.map((item, index) => `SR Number: ${display(item.SrNumber)}\n${descriptions[index]}`).join("\n\n");
+    badge.setAttribute("aria-label", description);
+    if (items.length && status === "ready") bindPopover(badge, items, descriptions);
+    else badge.title = description;
     badge.tabIndex = 0;
     return badge;
   }
   return { reset, load, createBadge };
 }
 
+// Source: src/features/opportunities/crm-sr-popover.js
+function createCrmSrPopover({ MODAL_ID, createCopyButton, createCloseIcon, environment }) {
+  const { document, window, setTimeout, clearTimeout } = environment;
+  let active = null;
+  let sequence = 0;
+  function close(restoreFocus = false) {
+    if (!active) return;
+    const entry = active;
+    active = null;
+    clearTimeout(entry.timer);
+    entry.panel.remove();
+    entry.button.setAttribute("aria-expanded", "false");
+    document.removeEventListener("pointerdown", entry.outside, true);
+    document.removeEventListener("keydown", entry.keydown, true);
+    window.removeEventListener("resize", entry.position);
+    document.removeEventListener("scroll", entry.scroll, true);
+    if (restoreFocus && entry.button.isConnected) {
+      entry.suppressFocus = true;
+      entry.button.focus();
+      entry.suppressFocus = false;
+    }
+  }
+  function bind(button, items, descriptions) {
+    button.type = "button";
+    button.setAttribute("aria-haspopup", "dialog");
+    button.setAttribute("aria-expanded", "false");
+    const id = `opportunities-extension-sr-details-${++sequence}`;
+    button.setAttribute("aria-controls", id);
+    const entry = { button, panel: null, timer: null, pinned: false, suppressFocus: false };
+    const contains = target => target && (button.contains(target) || entry.panel?.contains(target));
+    entry.outside = event => { if (!contains(event.target)) close(); };
+    entry.scroll = event => { if (!entry.panel.contains(event.target)) close(); };
+    entry.keydown = event => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        event.stopPropagation();
+        close(true);
+      }
+    };
+    entry.position = () => {
+      const rect = button.getBoundingClientRect();
+      const width = Math.min(480, window.innerWidth - 24);
+      entry.panel.style.width = `${width}px`;
+      entry.panel.style.maxHeight = `${Math.min(480, window.innerHeight - 24)}px`;
+      const height = entry.panel.getBoundingClientRect().height;
+      entry.panel.style.left = `${Math.max(12, Math.min(rect.left, window.innerWidth - width - 12))}px`;
+      entry.panel.style.top = `${Math.max(12, Math.min(rect.bottom + 6, window.innerHeight - height - 12))}px`;
+    };
+    function leave() {
+      clearTimeout(entry.timer);
+      if (!entry.pinned && !contains(document.activeElement)) {
+        entry.timer = setTimeout(() => { if (active === entry) close(); }, 200);
+      }
+    }
+    function focusOut(event) { if (!contains(event.relatedTarget) && active === entry) close(); }
+    function open() {
+      if (entry.suppressFocus) return;
+      clearTimeout(entry.timer);
+      if (active === entry) return;
+      close();
+      const host = document.getElementById(MODAL_ID);
+      if (!host) return;
+      const panel = document.createElement("div");
+      entry.panel = panel;
+      entry.pinned = false;
+      panel.id = id;
+      panel.className = "opportunities-extension-sr-popover";
+      panel.setAttribute("role", "dialog");
+      panel.setAttribute("aria-label", "CRM service requests");
+      const dismiss = document.createElement("button");
+      dismiss.type = "button";
+      dismiss.className = "opportunities-extension-sr-dismiss";
+      dismiss.title = "Close service request details";
+      dismiss.setAttribute("aria-label", dismiss.title);
+      dismiss.append(createCloseIcon());
+      dismiss.addEventListener("click", () => close(true));
+      panel.append(dismiss);
+      items.forEach((item, index) => {
+        const section = document.createElement("section");
+        const heading = document.createElement("div");
+        heading.className = "opportunities-extension-sr-number";
+        const number = item.SrNumber;
+        const link = document.createElement(number ? "a" : "span");
+        link.textContent = number ? String(number) : "N/D";
+        if (number) {
+          link.href = `https://eeho.fa.us2.oraclecloud.com/fscmUI/redwood/service/ec/container/sr/edit?srNumber=${encodeURIComponent(String(number))}`;
+          link.target = "_blank";
+          link.rel = "noopener noreferrer";
+        }
+        const label = document.createElement("span");
+        label.textContent = "SR Number:";
+        heading.append(label, link);
+        if (number) heading.append(createCopyButton(String(number), "SR number", "SR Number"));
+        const details = document.createElement("div");
+        details.className = "opportunities-extension-sr-details";
+        details.textContent = descriptions[index];
+        section.append(heading, details);
+        panel.append(section);
+      });
+      panel.addEventListener("pointerenter", () => clearTimeout(entry.timer));
+      panel.addEventListener("pointerleave", leave);
+      panel.addEventListener("focusout", focusOut);
+      host.append(panel);
+      active = entry;
+      button.setAttribute("aria-expanded", "true");
+      entry.position();
+      document.addEventListener("pointerdown", entry.outside, true);
+      document.addEventListener("keydown", entry.keydown, true);
+      document.addEventListener("scroll", entry.scroll, true);
+      window.addEventListener("resize", entry.position);
+    }
+    button.addEventListener("pointerenter", open);
+    button.addEventListener("pointerleave", leave);
+    button.addEventListener("focus", open);
+    button.addEventListener("focusout", focusOut);
+    button.addEventListener("click", event => {
+      event.stopPropagation();
+      if (active === entry && entry.pinned) close();
+      else {
+        open();
+        if (active === entry) {
+          entry.pinned = true;
+          entry.panel.querySelector("a, button").focus();
+        }
+      }
+    });
+  }
+  return { bind, close };
+}
+
+// Source: src/features/opportunities/workload-actions.js
+function createOpportunityWorkloadActions({ authSessionState, requestConsumerTokenServiceOnce, sendRuntimeMessage,
+  appendBackgroundRequestLog, queueProductsTableRender, productsContentState, messageTypes, environment }) {
+  let session = newSession();
+  function newSession() { return { enabled: true, records: new Map(), queue: [], running: 0 }; }
+  function reset(enabled = true) {
+    session.enabled = false;
+    session.queue.length = 0;
+    session = newSession();
+    session.enabled = enabled;
+  }
+  function idsFor(products) {
+    return [...new Set((products?.items || []).map(item => String(item?.RevnId ?? "").trim()).filter(Boolean))];
+  }
+  function loadProducts(products) {
+    if (!session.enabled) return;
+    for (const revnId of idsFor(products)) {
+      if (session.records.has(revnId)) continue;
+      const record = { status: "loading", actions: [], hasNext: false };
+      session.records.set(revnId, record);
+      session.queue.push({ revnId, record });
+    }
+    pump(session);
+  }
+  function reopen() {
+    reset();
+    for (const products of productsContentState.opptyProductsByNumber.values()) loadProducts(products);
+    queueProductsTableRender();
+  }
+  function pump(current) {
+    while (current.enabled && current === session && current.running < 4 && current.queue.length) {
+      const job = current.queue.shift();
+      current.running += 1;
+      run(current, job).finally(() => { current.running -= 1; pump(current); });
+    }
+  }
+  async function run(current, { revnId, record }) {
+    try {
+      const authorizations = await requestConsumerTokenServiceOnce();
+      if (!current.enabled || current !== session) return;
+      const result = await sendRuntimeMessage({ type: messageTypes.requestWlActions, revnId, authorization: authorizations?.workloadActions });
+      if (!current.enabled || current !== session) return;
+      appendBackgroundRequestLog(result?.debugRequests);
+      if (!result?.ok) throw new Error(result?.error || "Unable to load workload actions.");
+      record.actions = result.actions;
+      record.hasNext = result.hasNext;
+      record.status = "ready";
+    } catch (error) {
+      if (!current.enabled || current !== session) return;
+      record.status = "error";
+      record.error = error.message || "Unable to load workload actions.";
+    } finally {
+      if (current.enabled && current === session) queueProductsTableRender();
+    }
+  }
+  function createBadge(optyNumber) {
+    if (!session.enabled || !optyNumber) return null;
+    const products = productsContentState.opptyProductsByNumber.get(String(optyNumber));
+    if (!products) return null;
+    const ids = idsFor(products);
+    const records = ids.map(id => session.records.get(id));
+    const actions = records.flatMap(record => record?.actions || []);
+    const pending = records.some(record => !record || record.status === "loading");
+    const uncertain = products.error || (products.items || []).some(item => !String(item?.RevnId ?? "").trim())
+      || records.some(record => record?.status === "error" || record?.hasNext);
+    const principal = authSessionState.principal;
+    const owned = Boolean(principal) && actions.some(action => typeof action.owner === "string" && action.owner.trim() === principal);
+    const state = owned ? "matched" : pending ? "loading" : uncertain || !principal ? "error" : "missing";
+    const badge = environment.document.createElement("span");
+    badge.className = "opportunities-extension-crm-sr-badge opportunities-extension-wl-actions-badge";
+    badge.setAttribute("data-state", state);
+    badge.textContent = state === "matched" ? "\u2705 Act" : state === "missing" ? "\u26d4 Act" : state === "loading" ? "Act ..." : "Act ?";
+    badge.title = actions.length ? actions.map(action => [
+      `Action: ${action.name ?? "N/D"}`, `ID: ${action.id ?? "N/D"}`, `Status: ${action.status ?? "N/D"}`,
+      `Owner: ${action.owner || "N/D"}`, `Email: ${action.ownerEmail || "N/D"}`, `Workload: ${action.workloadName || "N/D"}`,
+      `Description: ${action.workloadDescription || "N/D"}`, `Start: ${action.startDate || "N/D"}`, `End: ${action.endDate || "N/D"}`
+    ].join("\n")).join("\n\n") : state === "missing" ? "No actions found for this opportunity's products."
+      : state === "loading" ? "Loading workload actions..." : "Unable to confirm workload actions. Check product RevnId and Debug Requests.";
+    if (records.some(record => record?.hasNext)) badge.title += "\nAdditional actions exist; pagination is not enabled.";
+    if (!principal) badge.title += "\nTokenrelay principal is unavailable; ownership cannot be verified.";
+    else if (actions.length && state === "missing") badge.title += "\nNone of the returned actions belong to the signed-in principal.";
+    if (actions.length && (pending || uncertain)) badge.title += "\nSome workloads are still loading or could not be fully checked.";
+    badge.tabIndex = 0;
+    badge.setAttribute("aria-label", badge.title);
+    return badge;
+  }
+  return { reset, reopen, loadProducts, createBadge };
+}
+
 // Source: src/features/opportunities/fiscal-periods.js
 function createOpportunitiesFiscalPeriods() {
   function getFiscalPeriodRange(period, currentDate) {
@@ -2018,6 +2282,8 @@ function createOpportunitiesTable({
   createProductsCountButton,
   createProductsRampBadge,
   createCrmServiceRequestBadge,
+  closeCrmSrPopover,
+  createWorkloadActionsBadge,
   createProductsDetailRow,
   createStageBadge,
   createStatusBadge,
@@ -2058,6 +2324,7 @@ function createOpportunitiesTable({
       return;
     }
 
+    closeCrmSrPopover();
     table.textContent = "";
     table.setAttribute("data-opportunities-layout", "inline-actions");
     table.setAttribute("aria-busy", opportunitiesTableState.opportunitiesTableState.status === "loading" ? "true" : "false");
@@ -2144,6 +2411,8 @@ function createOpportunitiesTable({
               }
               const srBadge = createCrmServiceRequestBadge(item.OptyNumber);
               if (srBadge) productActions.append(srBadge);
+              const actionsBadge = createWorkloadActionsBadge(item.OptyNumber);
+              if (actionsBadge) productActions.append(actionsBadge);
               nameCellContent.append(opportunityLink, productActions);
               cell.append(nameCellContent);
             } else if (column.key === "optyNumber" && item.OptyNumber) {
@@ -2926,19 +3195,19 @@ function createOpportunitiesLinks({
     return link;
   }
 
-  function createCopyOpportunityButton(optyNumber) {
+  function createCopyOpportunityButton(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     const button = document.createElement("button");
     const icon = document.createElementNS("http://www.w3.org/2000/svg", "svg");
     const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
 
     button.type = "button";
     button.className = "opportunities-extension-copy-button";
-    button.setAttribute("aria-label", `Copy opportunity number ${optyNumber}`);
-    button.title = "Copy opportunity number";
+    button.setAttribute("aria-label", `Copy ${label} ${optyNumber}`);
+    button.title = `Copy ${label}`;
     button.addEventListener("click", (event) => {
       event.preventDefault();
       event.stopPropagation();
-      copyOpportunityNumber(String(optyNumber));
+      copyOpportunityNumber(String(optyNumber), label, confirmationLabel);
     });
 
     icon.setAttribute("viewBox", "0 0 24 24");
@@ -2949,7 +3218,7 @@ function createOpportunitiesLinks({
     return button;
   }
 
-  async function copyOpportunityNumber(optyNumber) {
+  async function copyOpportunityNumber(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     try {
       if (navigator.clipboard && navigator.clipboard.writeText) {
         await navigator.clipboard.writeText(optyNumber);
@@ -2965,9 +3234,9 @@ function createOpportunitiesLinks({
         input.remove();
       }
 
-      showCopyConfirmation(`Opty Number ${optyNumber} copied.`);
+      showCopyConfirmation(`${confirmationLabel} ${optyNumber} copied.`);
     } catch (error) {
-      showCopyConfirmation("Unable to copy opportunity number.", true);
+      showCopyConfirmation(`Unable to copy ${label}.`, true);
     }
   }
 
@@ -3322,10 +3591,43 @@ function createProductsContentJobs({
   preferencesState,
   productsContentState,
   renderOpportunitiesTable,
+  loadWorkloadActions,
   sendRuntimeMessage,
   environment
 }) {
-  const { browser, chrome, document, window } = environment;
+  const { browser, chrome, document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let completion = null;
+  function updateCompletionVisibility(badge) {
+    const requestId = productsContentState.currentProductsRequestId;
+    const complete = productsContentState.productsProgress.state === "complete";
+    if (completion && (!complete || completion.requestId !== requestId || completion.badge !== badge)) {
+      clearTimeout(completion.waitTimer);
+      clearTimeout(completion.hideTimer);
+      completion.badge.setAttribute("data-fading", "false");
+      completion = null;
+    }
+    if (!complete) {
+      badge.setAttribute("data-fading", "false");
+      return;
+    }
+    if (completion) {
+      badge.hidden = completion.hidden;
+      return;
+    }
+    const current = { requestId, badge, hidden: false, waitTimer: null, hideTimer: null };
+    completion = current;
+    badge.setAttribute("data-fading", "false");
+    current.waitTimer = setTimeout(() => {
+      if (completion !== current) return;
+      badge.setAttribute("data-fading", "true");
+      const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+      current.hideTimer = setTimeout(() => {
+        if (completion !== current) return;
+        current.hidden = true;
+        badge.hidden = true;
+      }, reducedMotion ? 0 : 300);
+    }, 5000);
+  }
   function requestOpptyProductsInBackground(opportunities, token) {
     const optyNumbers = Array.from(new Set(opportunities
       .map((item) => item && item.OptyNumber)
@@ -3401,6 +3703,7 @@ function createProductsContentJobs({
           cachedAt: Number(message.cachedAt) || 0,
           error: message.error || ""
         });
+        loadWorkloadActions(productsContentState.opptyProductsByNumber.get(String(message.optyNumber)));
       }
 
       if (Number(message.cachedAt) > productsContentState.productsLastCachedAt) {
@@ -3445,6 +3748,7 @@ function createProductsContentJobs({
     } else {
       badge.textContent = "Products ready 0";
     }
+    updateCompletionVisibility(badge);
 
     const timestamp = document.getElementById(PRODUCTS_CACHE_TIMESTAMP_ID);
 
@@ -6152,7 +6456,7 @@ function createDebugContentView({
     ["all", "All"], ["authentication", "Authentication"],
     ["opportunities", "Opportunities"], ["products", "Products"],
     ["ai", "AI"], ["consumption", "Consumption"], ["installBase", "Installed Base"],
-    ["serviceRequests", "Service Requests"], ["other", "Other"]
+    ["serviceRequests", "Service Requests"], ["actions", "Actions"], ["other", "Other"]
   ];
   let selectedCategory = "all";
   const expandedIds = new Set();
@@ -6162,6 +6466,7 @@ function createDebugContentView({
     if (/^request(?:TokenRelay|ConsumerTokenService|CustomerTokenService)/.test(entry.name)) return "authentication";
     if (entry.name === "requestOpportunities") return "opportunities";
     if (entry.name === "requestOpptyProducts") return "products";
+    if (entry.name === "requestWlActions") return "actions";
     if (entry.name === "requestGenerateAiSummary") return "ai";
     if (entry.name === "requestInstallBase") return "installBase";
     if (entry.name === "requestCustomerServiceRequest" || entry.name === "resquestCrmServiceRequest") return "serviceRequests";
@@ -6607,6 +6912,8 @@ function createContentApplication(overrides = {}) {
     requestTokenRelayOnce: (...args) => authContentSession.requestTokenRelayOnce(...args),
     resetCustomerAndOwnerFiltersForPeriod: (...args) => opportunitiesFilters.resetCustomerAndOwnerFiltersForPeriod(...args),
     resetOpportunitiesTable: (...args) => opportunitiesController.resetOpportunitiesTable(...args),
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
+    reopenWorkloadActions: () => opportunityWorkloadActions.reopen(),
     loadCrmServiceRequests: (...args) => opportunityCrmServiceRequests.load(...args),
     resetCrmServiceRequests: () => opportunityCrmServiceRequests.reset(),
     restoreFilterPreferences: (...args) => preferencesStorage.restoreFilterPreferences(...args),
@@ -6646,6 +6953,7 @@ function createContentApplication(overrides = {}) {
     requestTokenRelay: (...args) => authTokenRelay.requestTokenRelay(...args)
   });
   const authTokenRelay = createAuthTokenRelay({
+    authSessionState,
     TOKEN_RELAY_URL: contracts.TOKEN_RELAY_URL,
     createDebugBody: (...args) => debugContentLog.createDebugBody(...args),
     getXsrfToken: (...args) => authXsrfContent.getXsrfToken(...args),
@@ -6667,6 +6975,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const opportunitiesController = createOpportunitiesController({
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
     STAGE_OPTIONS: contracts.STAGE_OPTIONS,
     STATUS_OPTIONS: contracts.STATUS_OPTIONS,
     authSessionState,
@@ -6708,11 +7017,20 @@ function createContentApplication(overrides = {}) {
     readResponseBodyForDebug: (...args) => debugContentLog.readResponseBodyForDebug(...args),
     maskToken: (...args) => debugContentLog.maskToken(...args), environment
   });
+  const crmSrPopover = createCrmSrPopover({
+    MODAL_ID: contracts.MODAL_ID,
+    createCopyButton: (...args) => opportunitiesLinks.createCopyOpportunityButton(...args),
+    createCloseIcon: (...args) => contentIcons.createCloseIcon(...args), environment
+  });
   const opportunityCrmServiceRequests = createOpportunityCrmServiceRequests({
+    bindPopover: (...args) => crmSrPopover.bind(...args),
+    closePopover: (...args) => crmSrPopover.close(...args),
     requestCrmServiceRequest: (...args) => fusionCrmServiceRequests.requestCrmServiceRequest(...args),
     isCurrentPeriodRequest: (...args) => opportunitiesController.isCurrentPeriodRequest(...args), environment
   });
   const opportunitiesTable = createOpportunitiesTable({
+    closeCrmSrPopover: (...args) => crmSrPopover.close(...args),
+    createWorkloadActionsBadge: (...args) => opportunityWorkloadActions.createBadge(...args),
     ACCOUNT_DETAIL_URL: contracts.ACCOUNT_DETAIL_URL,
     OPPORTUNITIES_COLUMNS: columns,
     OPPORTUNITIES_TABLE_ID: contracts.OPPORTUNITIES_TABLE_ID,
@@ -6812,6 +7130,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const productsContentJobs = createProductsContentJobs({
+    loadWorkloadActions: (...args) => opportunityWorkloadActions.loadProducts(...args),
     appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
     messageTypes,
     PRODUCTS_CACHE_TIMESTAMP_ID: contracts.PRODUCTS_CACHE_TIMESTAMP_ID,
@@ -6823,6 +7142,14 @@ function createContentApplication(overrides = {}) {
     sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
     environment
   });
+  const opportunityWorkloadActions = createOpportunityWorkloadActions({
+    authSessionState,
+    requestConsumerTokenServiceOnce: (...args) => authContentSession.requestConsumerTokenServiceOnce(...args),
+    sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
+    appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
+    queueProductsTableRender: () => productsContentJobs.queueProductsTableRender(),
+    productsContentState, messageTypes, environment
+  });
   const productsDetails = createProductsDetails({
     OPPORTUNITIES_COLUMNS: columns,
     createAiSummaryAlert: (...args) => aiSummaryContent.createAiSummaryAlert(...args),
@@ -6988,6 +7315,7 @@ function createContentApplication(overrides = {}) {
   }
   return {
     start, contracts,
+    opportunityWorkloadActions,
     fusionCrmServiceRequests, opportunityCrmServiceRequests,
     authSessionState,
     authSalesCommonState,
diff --git a/dist/firefox/background.js b/dist/firefox/background.js
index 7ee7b62..9c28c7e 100644
--- a/dist/firefox/background.js
+++ b/dist/firefox/background.js
@@ -13,6 +13,7 @@ function createMessageTypes() {
     requestAccountPlans: "opportunitiesExtension.requestAccountPlans",
     requestInstallBase: "opportunitiesExtension.requestInstallBase",
     requestCustomerServiceRequest: "opportunitiesExtension.requestCustomerServiceRequest",
+    requestWlActions: "opportunitiesExtension.requestWlActions",
     requestConsumptionTrend: "opportunitiesExtension.requestConsumptionTrend",
     requestConsumptionPlanDetail: "opportunitiesExtension.requestConsumptionPlanDetail",
     requestRatecardByPlan: "opportunitiesExtension.requestRatecardByPlan"
@@ -204,7 +205,8 @@ function createAuthConsumerSession({
           accountSummary: accountSummaryAuthorization,
           accountPlans: accountPlansAuthorization,
           installBase: extractTokenServiceAuthorization(tokenResponse, "SAIB-TS", ""),
-          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", "")
+          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", ""),
+          workloadActions: extractTokenServiceAuthorization(tokenResponse, "WWB-TS", "Wwb-Provider-Authorization")
         },
         debugRequests
       };
@@ -610,6 +612,37 @@ function createSpaCustomerServiceRequests({ ACCOUNT_SUMMARY_URL, fetchJson, find
   return { requestCustomerServiceRequest };
 }
 
+// Source: src/services/spa/workload-actions.js
+function createSpaWorkloadActions({ fetchJson }) {
+  async function requestWlActions(message) {
+    const debugRequests = [];
+    try {
+      const revnId = String(message.revnId ?? "").trim();
+      const token = message.authorization?.value;
+      if (!/^\d+$/.test(revnId)) throw new Error("A numeric RevnId is required.");
+      if (typeof token !== "string" || !token.trim()) throw new Error("WWB-TS uiaasHeader.value is unavailable.");
+      const url = `https://spa.oracle.com/oalcrm/web/api/provider-proxy/wwb-provider/service/workbench-proxy/wwb/mgmt/actions?parentType=WORKLOAD&parentId=${encodeURIComponent(revnId)}`;
+      const result = await fetchJson(url, {
+        method: "GET", credentials: "include",
+        headers: { Accept: "application/json", "Wwb-Provider-Authorization": token.trim() }
+      }, "requestWlActions", debugRequests);
+      if (!result || !Array.isArray(result.actions) || typeof result.hasNext !== "boolean"
+        || result.actions.some(item => !item || typeof item !== "object" || Array.isArray(item))) {
+        throw new Error("requestWlActions returned an invalid collection.");
+      }
+      return { ok: true, actions: result.actions, hasNext: result.hasNext, debugRequests };
+    } catch (error) {
+      error.debugRequests = debugRequests;
+      throw error;
+    } finally {
+      for (const entry of debugRequests) {
+        if (entry.requestHeaders?.["Wwb-Provider-Authorization"]) entry.requestHeaders["Wwb-Provider-Authorization"] = "(present)";
+      }
+    }
+  }
+  return { requestWlActions };
+}
+
 // Source: src/services/spa/consumption.js
 function createSpaConsumption({
   CONSUMPTION_TREND_REQUESTS,
@@ -1662,6 +1695,7 @@ function registerBackgroundMessages({
   requestAccountPlans,
   requestInstallBase,
   requestCustomerServiceRequest,
+  requestWlActions,
   requestConsumerTokenService,
   requestConsumptionTrend,
   requestConsumptionPlanDetail,
@@ -1743,6 +1777,14 @@ runtimeApi.runtime.onMessage.addListener((message, sender, sendResponse) => {
       return true;
     }
 
+    if (message.type === messageTypes.requestWlActions) {
+      requestWlActions(message).then(sendResponse).catch(error => sendResponse({
+        ok: false, error: error.message || "Unable to load workload actions.",
+        debugRequests: Array.isArray(error.debugRequests) ? error.debugRequests : []
+      }));
+      return true;
+    }
+
     if (message.type === messageTypes.requestCustomerServiceRequest) {
       requestCustomerServiceRequest(message).then(sendResponse).catch(error => sendResponse({
         ok: false, error: error.message || "Unable to load service requests.",
@@ -1921,6 +1963,8 @@ function createBackgroundApplication(overrides = {}) {
   const refreshXsrfCookie = (...args) => authXsrfRecovery.refreshXsrfCookie(...args);
   const requestAccountPlans = (...args) => spaAccounts.requestAccountPlans(...args);
   const requestInstallBase = (...args) => spaInstallBase.requestInstallBase(...args);
+  const spaWorkloadActions = createSpaWorkloadActions({ fetchJson: (...args) => httpBackgroundJson.fetchJson(...args) });
+  const requestWlActions = (...args) => spaWorkloadActions.requestWlActions(...args);
   const requestCustomerServiceRequest = (...args) => spaCustomerServiceRequests.requestCustomerServiceRequest(...args);
   const requestConsumerTokenService = (...args) => authConsumerSession.requestConsumerTokenService(...args);
   const requestConsumptionTrend = (...args) => spaConsumption.requestConsumptionTrend(...args);
@@ -1929,7 +1973,7 @@ function createBackgroundApplication(overrides = {}) {
   const requestOpptyProducts = (...args) => productsBackgroundJobs.requestOpptyProducts(...args);
   const runtimeApi = environment.browser || environment.chrome;
   function start() {
-    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
+    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestWlActions, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
   }
   return {
     start, contracts,
diff --git a/dist/firefox/content.js b/dist/firefox/content.js
index b0aaf96..668db49 100644
--- a/dist/firefox/content.js
+++ b/dist/firefox/content.js
@@ -1,6 +1,6 @@
 (function () {
   "use strict";
-const redwoodStyles = "\n      .opportunities-extension-scroll-lock {\n        overflow: hidden !important;\n      }\n\n      .opportunities-extension-modal,\n      .opportunities-extension-modal * {\n        box-sizing: border-box;\n        font-family: \"Oracle Sans\", Arial, Helvetica, sans-serif;\n      }\n\n      .opportunities-extension-modal {\n        position: fixed;\n        inset: 0;\n        z-index: 2147483647;\n        background: #f5f4f2;\n        color: #000000;\n      }\n\n      .opportunities-extension-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-shell {\n        height: 100vh;\n        min-height: 0;\n        display: grid;\n        grid-template-rows: auto minmax(0, 1fr);\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-header {\n        position: relative;\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 24px;\n        padding: 28px 40px 22px;\n        border-bottom: 1px solid #dedbd7;\n        background:\n          linear-gradient(90deg, #8f624a 0 11%, #c74634 11% 23%, #6f5a7f 23% 36%, #00758f 36% 51%, #d4b06a 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #ffffff;\n      }\n\n      .opportunities-extension-header::before {\n        position: absolute;\n        left: 40px;\n        bottom: -1px;\n        width: 64px;\n        height: 3px;\n        background: #00758f;\n        content: \"\";\n      }\n\n      .opportunities-extension-header h1 {\n        margin: 0;\n        color: #000000;\n        font-size: 24px;\n        font-weight: 700;\n        line-height: 1.2;\n        letter-spacing: 0;\n      }\n\n      .opportunities-extension-header p {\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        line-height: 1.4;\n      }\n\n      .opportunities-extension-subtitle-row {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n        margin-top: 6px;\n      }\n\n      .opportunities-extension-auth-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        color: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-auth-badge-authenticated {\n        background: #3f6f17;\n      }\n\n      .opportunities-extension-auth-badge-unauthenticated {\n        background: #c5331f;\n      }\n\n      .opportunities-extension-auth-badge-pending {\n        background: #6f5a7f;\n      }\n\n      .opportunities-extension-products-progress {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-progress[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-cache-timestamp {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #f0eeeb;\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-cache-timestamp[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"running\"]::before {\n        width: 12px;\n        height: 12px;\n        margin-right: 6px;\n        border: 2px solid currentColor;\n        border-right-color: transparent;\n        border-radius: 50%;\n        content: \"\";\n        animation: opportunities-extension-spin .8s linear infinite;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-products-progress[data-state=\"error\"] {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      @keyframes opportunities-extension-spin {\n        to { transform: rotate(360deg); }\n      }\n\n      .opportunities-extension-icon-button {\n        width: 36px;\n        height: 36px;\n        flex: 0 0 36px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 18px;\n        font-weight: 600;\n        line-height: 1;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-header-actions {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n      }\n\n      .opportunities-extension-icon-button svg {\n        width: 18px;\n        height: 18px;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-icon-button .opportunities-extension-settings-icon {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-icon-button:hover,\n      .opportunities-extension-icon-button:focus {\n        border-color: #b8b2ad;\n        background: #f5f4f2;\n        outline: none;\n      }\n\n      .opportunities-extension-body {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        gap: 16px;\n        padding: 22px 40px 36px;\n        background: #f5f4f2;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-form {\n        display: flex;\n        align-items: end;\n        flex-wrap: wrap;\n        gap: 24px;\n        min-height: 82px;\n        max-width: none;\n        margin: 0;\n        padding: 14px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-field {\n        display: grid;\n        max-width: max-content;\n        min-width: 270px;\n        width: max-content;\n        gap: 6px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-dashboard {\n        display: grid;\n        grid-template-columns: repeat(6, minmax(0, 1fr));\n        gap: 12px;\n      }\n\n      .opportunities-extension-stage-dashboard-card {\n        display: grid;\n        gap: 6px;\n        min-width: 0;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-top: 3px solid #5f5a55;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-stage-dashboard-card span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-stage-dashboard-value {\n        overflow: hidden;\n        color: #312d2a;\n        font-size: 22px;\n        font-weight: 700;\n        line-height: 1.2;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #008aa6;\n      }\n\n      .opportunities-extension-total-dashboard-card {\n        border-top-color: #312d2a;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #6f6863;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #c87b00;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #755b8b;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #4b7f22;\n      }\n\n      .opportunities-extension-stage-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-stage-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-stage-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #006b84;\n        background: #006b84;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #5f5a55;\n        background: #5f5a55;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #945400;\n        background: #945400;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #624e74;\n        background: #624e74;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #3f6f17;\n        background: #3f6f17;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-status-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-status-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-status-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-status-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-customer-filter {\n        position: relative;\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 220px;\n      }\n\n      .opportunities-extension-customer-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-customer-filter-trigger {\n        position: relative;\n        min-width: 220px;\n        min-height: 44px;\n        padding: 10px 38px 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-trigger::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-top: 6px solid #312d2a;\n        border-right: 5px solid transparent;\n        border-left: 5px solid transparent;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-customer-filter-trigger:disabled {\n        cursor: not-allowed;\n        background: #f5f4f2;\n        color: #7d7772;\n      }\n\n      .opportunities-extension-customer-filter-trigger:focus-visible {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-panel {\n        position: absolute;\n        top: calc(100% + 8px);\n        left: 0;\n        z-index: 4;\n        display: grid;\n        width: min(360px, calc(100vw - 80px));\n        gap: 10px;\n        padding: 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n      }\n\n      .opportunities-extension-customer-filter-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-customer-filter-search {\n        width: 100%;\n        min-height: 40px;\n        padding: 8px 10px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-customer-filter-search:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-customer-filter-option {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-customer-filter-select-all {\n        min-height: 32px;\n        padding-bottom: 8px;\n        border-bottom: 1px solid #dedbd7;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-customer-filter-panel input[type=\"checkbox\"] {\n        width: 16px;\n        height: 16px;\n        flex: 0 0 16px;\n        accent-color: #00758f;\n      }\n\n      .opportunities-extension-customer-filter-list {\n        display: block;\n        max-height: 250px;\n        overflow: auto;\n      }\n\n      .opportunities-extension-customer-filter-option {\n        display: grid;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: start;\n        min-height: 0;\n        height: auto !important;\n        padding: 8px 4px;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-option input[type=\"checkbox\"] {\n        margin-top: 1px;\n      }\n\n      .opportunities-extension-customer-filter-option span {\n        display: block;\n        min-width: 0;\n        line-height: 18px;\n        overflow-wrap: anywhere;\n        white-space: normal;\n      }\n\n      .opportunities-extension-customer-filter-option:hover {\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-customer-filter-empty {\n        margin: 4px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-table-search-field {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        width: 260px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input {\n        width: 100%;\n        min-height: 44px;\n        padding: 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-select-wrap {\n        position: relative;\n        display: block;\n        width: 270px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-select-wrap::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-left: 5px solid transparent;\n        border-right: 5px solid transparent;\n        border-top: 6px solid #000000;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-field select {\n        width: 100%;\n        min-width: 0;\n        max-width: 100%;\n        min-height: 44px;\n        box-sizing: border-box;\n        appearance: none;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #000000;\n        font-size: 14px;\n        line-height: 1.3;\n        padding: 11px 44px 11px 12px;\n      }\n\n      .opportunities-extension-field select:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-table-surface {\n        min-height: 0;\n        height: 100%;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n        overflow-x: auto;\n        overflow-y: auto;\n      }\n\n      .opportunities-extension-table {\n        width: 100%;\n        min-width: 0;\n        border-collapse: collapse;\n        table-layout: fixed;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-table thead {\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-table th {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n        height: 44px;\n        border-bottom: 1px solid #b8b2ad;\n        background: #faf9f8;\n        color: #312d2a;\n        font-size: 12px;\n        font-weight: 700;\n        text-align: left;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td {\n        min-height: 48px;\n        padding: 12px 16px;\n        border-bottom: 1px solid #ebe8e5;\n        vertical-align: middle;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-table th:nth-child(1) {\n        width: 16%;\n      }\n\n      .opportunities-extension-table th:nth-child(2) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(3) {\n        width: 18%;\n      }\n\n      .opportunities-extension-table th:nth-child(4) {\n        width: 11%;\n      }\n\n      .opportunities-extension-table th:nth-child(5) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(6) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(7) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(8) {\n        width: 6%;\n      }\n\n      .opportunities-extension-table th:nth-child(9) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(10) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(11) {\n        width: 4%;\n      }\n\n      .opportunities-extension-table td:nth-child(2),\n      .opportunities-extension-table td:nth-child(5),\n      .opportunities-extension-table td:nth-child(6),\n      .opportunities-extension-table td:nth-child(8) {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      .opportunities-extension-table td:nth-child(9) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(7) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(10) {\n        padding-right: 6px;\n        padding-left: 6px;\n        font-size: 12px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td:nth-child(11) {\n        padding-right: 6px;\n        padding-left: 6px;\n        text-align: center;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table tbody tr:hover {\n        background: #f7f6f4;\n      }\n\n      .opportunities-extension-table tbody tr:last-child td {\n        border-bottom: 0;\n      }\n\n      .opportunities-extension-table a {\n        color: #006b84;\n        text-decoration: underline;\n        text-decoration-thickness: 1px;\n        text-underline-offset: 2px;\n      }\n\n      .opportunities-extension-table a:hover {\n        color: #004f63;\n      }\n\n      .opportunities-extension-opty-number-content {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-name-content {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-name-content > a {\n        min-width: 0;\n      }\n\n      .opportunities-extension-actions-content {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        gap: 4px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-products-count {\n        display: inline-grid;\n        width: auto;\n        min-width: 20px;\n        height: 20px;\n        place-items: center;\n        flex: 0 0 auto;\n        box-sizing: border-box;\n        padding: 0 3px;\n        border: 1px solid #7ca7b2;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 10px;\n        font-weight: 700;\n        line-height: 1;\n        text-align: center;\n        vertical-align: middle;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-products-count:hover,\n      .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n        outline: none;\n      }\n\n      .opportunities-extension-products-count-error {\n        border-color: #d8887e;\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-products-detail-row:hover {\n        background: transparent !important;\n      }\n\n      .opportunities-extension-products-detail-cell {\n        padding: 0 !important;\n      }\n\n      .opportunities-extension-products-detail {\n        padding: 14px 20px 18px;\n        border-bottom: 1px solid #c9c5c1;\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-products-detail-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 10px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-ai-summary {\n        box-sizing: border-box;\n        width: 100%;\n        min-width: 0;\n        margin: 0 0 12px;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 6px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.5;\n        text-align: left;\n        white-space: normal;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-ai-summary strong {\n        display: block;\n        font-size: 13px;\n        font-weight: 600;\n      }\n\n      .opportunities-extension-ai-summary p {\n        margin: 4px 0 0;\n        font: inherit;\n        white-space: pre-wrap;\n      }\n\n      .opportunities-extension-ai-summary-error {\n        color: #b42318;\n        border-color: #d9928b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary {\n        background: #292827;\n        color: #f6f4f2;\n        border-color: #5f5a55;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary-error {\n        color: #ffb4ab;\n        border-color: #a45c55;\n      }\n\n      .opportunities-extension-products-detail-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-products-detail-heading span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-products-table {\n        width: 100%;\n        table-layout: fixed;\n        border-collapse: collapse;\n        border: 1px solid #dedbd7;\n        background: #ffffff;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-products-table th,\n      .opportunities-extension-products-table td {\n        position: static;\n        height: auto;\n        padding: 8px 10px;\n        border-bottom: 1px solid #ebe8e5;\n        background: transparent;\n        overflow-wrap: anywhere;\n        vertical-align: middle;\n        white-space: normal;\n      }\n\n      .opportunities-extension-products-table th {\n        background: #faf9f8;\n        font-size: 11px;\n      }\n\n      .opportunities-extension-products-table th:nth-child(1) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(2) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(3) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(4) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(5) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(6) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(7) { width: 7%; }\n      .opportunities-extension-products-table th:nth-child(8) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(9) { width: 12%; }\n      .opportunities-extension-products-table th:nth-child(10) { width: 5%; }\n\n      .opportunities-extension-products-empty {\n        margin: 0;\n        padding: 10px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-copy-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n        width: 24px;\n        height: 24px;\n        padding: 3px;\n        border: 0;\n        border-radius: 3px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-copy-button svg {\n        width: 16px;\n        height: 16px;\n        fill: currentColor;\n      }\n\n      .opportunities-extension-copy-button:hover,\n      .opportunities-extension-copy-button:focus-visible {\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 32px;\n        height: 32px;\n        padding: 5px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-action-button svg {\n        width: 21px;\n        height: 21px;\n      }\n\n      .opportunities-extension-action-button:hover,\n      .opportunities-extension-action-button:focus-visible {\n        border-color: #7ca7b2;\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button:disabled {\n        cursor: wait;\n        opacity: .72;\n      }\n\n      .opportunities-extension-action-button-loading svg {\n        animation: opportunities-extension-pulse 1s ease-in-out infinite;\n      }\n\n      @keyframes opportunities-extension-pulse {\n        50% { opacity: .35; }\n      }\n\n      .opportunities-extension-copy-toast {\n        position: fixed;\n        right: 28px;\n        bottom: 28px;\n        z-index: 3;\n        max-width: min(360px, calc(100vw - 56px));\n        padding: 12px 16px;\n        border-radius: 4px;\n        background: #2f6f18;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n        color: #ffffff;\n        font-size: 13px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-copy-toast-error {\n        background: #a52b1c;\n      }\n\n      .opportunities-extension-copy-toast[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-stage-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"SQL\"] {\n        background: #d9f0f5;\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"PIPELINE\"] {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"UPSIDE\"] {\n        background: #fff0d8;\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"FORECAST\"] {\n        background: #eee8f5;\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"WON\"] {\n        background: #e5f1d9;\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-status-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"OPEN\"] {\n        background: #e2f2e5;\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"CLOSED\"] {\n        background: #e5e7eb;\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"LOST\"] {\n        background: #f9e3e1;\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"WON\"] {\n        background: #e3edf8;\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-sort-button {\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n        width: 100%;\n        min-height: 44px;\n        padding: 8px 42px 8px 16px;\n        border: 0;\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-weight: inherit;\n        letter-spacing: 0;\n        line-height: 1.2;\n        text-align: left;\n        white-space: normal;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-table-header-label {\n        display: inline-flex;\n        align-items: center;\n        min-height: 44px;\n        padding: 8px 6px;\n      }\n\n      .opportunities-extension-sort-button::after {\n        position: absolute;\n        right: 15px;\n        color: #5f5a55;\n        content: \"↕\";\n        font-size: 16px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"ascending\"]::after {\n        color: #00758f;\n        content: \"↑\";\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"descending\"]::after {\n        color: #00758f;\n        content: \"↓\";\n      }\n\n      .opportunities-extension-sort-button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-sort-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-table-status {\n        height: 152px;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-visually-hidden {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 3;\n        display: grid;\n        place-items: center;\n        padding: 24px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-preferences-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 4;\n        display: grid;\n        place-items: center;\n        padding: 12px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-account-plans-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-dialog {\n        display: grid;\n        width: min(1180px, 100%);\n        height: min(760px, calc(100vh - 24px));\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plans-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 14px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-header h2 {\n        margin: 0;\n        font-size: 20px;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-account-plans-header p {\n        margin: 5px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-account-plans-content {\n        display: grid;\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-content > .opportunities-extension-account-plans-skeleton {\n        grid-row: 1 / -1;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation {\n        position: relative;\n        min-width: 0;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation .opportunities-extension-account-plans-tab-navigation-button[hidden] {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tabs {\n        display: flex;\n        min-width: 0;\n        gap: 4px;\n        overflow-x: auto;\n        padding: 8px 20px 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-account-plans-tabs::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button {\n        display: grid;\n        position: absolute;\n        z-index: 1;\n        top: 50%;\n        width: 32px;\n        height: 32px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        box-shadow: 0 2px 6px rgba(0, 0, 0, .16);\n        transform: translateY(-50%);\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:first-child {\n        left: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:last-child {\n        right: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-account-plans-panels {\n        min-width: 0;\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plan-tab {\n        min-height: 38px;\n        flex: 0 0 auto;\n        padding: 7px 12px;\n        border: 0;\n        border-bottom: 3px solid transparent;\n        background: transparent;\n        color: #5f5a55;\n        font-size: 13px;\n        font-weight: 600;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plan-tab:hover {\n        background: #f0eeeb;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #00758f;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-account-plan-tab:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-account-plan-panel {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        box-sizing: border-box;\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plan-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plan-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        margin: 0;\n      }\n\n      .opportunities-extension-account-plan-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        gap: 10px;\n        min-height: 42px;\n        align-items: center;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plan-details dt {\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-account-plan-details dd {\n        min-width: 0;\n        margin: 0;\n        color: #312d2a;\n        font-size: 13px;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-consumption-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 14px;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-trend-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        gap: 24px;\n      }\n\n      .opportunities-extension-consumption-periods {\n        display: flex;\n        align-items: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-periods button {\n        min-height: 38px;\n        padding: 7px 14px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-periods button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #00758f;\n        background: #e7f6f8;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-periods button:focus-visible,\n      .opportunities-extension-consumption-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-consumption-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 4px;\n      }\n\n      .opportunities-extension-consumption-navigation {\n        display: grid;\n        grid-template-columns: 36px minmax(130px, auto) 36px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 40px;\n        margin-bottom: 2px;\n      }\n\n      .opportunities-extension-consumption-navigation strong {\n        color: #312d2a;\n        font-size: 13px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-navigation-button {\n        display: grid;\n        width: 36px;\n        height: 36px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-consumption-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-consumption-figure {\n        position: relative;\n        min-width: 0;\n        min-height: 0;\n        margin: 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-consumption-figure::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-consumption-visual {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 176px;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-consumption-svg {\n        display: block;\n        width: 100%;\n        height: 300px;\n        min-height: 0;\n        overflow: visible;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #dedbd7;\n        stroke-width: 1;\n        shape-rendering: crispEdges;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #5f5a55;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #312d2a;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #b77888;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #de7907;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #de7907;\n        stroke-width: 1.5;\n        stroke-dasharray: 6 6;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group {\n        cursor: default;\n        outline: none;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group rect {\n        transition: filter .16s ease, opacity .16s ease, stroke .16s ease;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        filter: brightness(1.06);\n        stroke: #312d2a;\n        stroke-width: 1.5;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-label {\n        opacity: 0;\n        animation: opportunities-extension-consumption-label-in .24s ease-out forwards;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-average {\n        opacity: 0;\n        animation: opportunities-extension-consumption-average-in .35s .32s ease-out forwards;\n      }\n\n      @keyframes opportunities-extension-consumption-label-in {\n        from { opacity: 0; transform: translateY(4px); }\n        to { opacity: 1; transform: translateY(0); }\n      }\n\n      @keyframes opportunities-extension-consumption-average-in {\n        from { opacity: 0; }\n        to { opacity: 1; }\n      }\n\n      .opportunities-extension-consumption-legend {\n        display: grid;\n        align-content: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-legend button {\n        display: grid;\n        min-width: 0;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: center;\n        gap: 8px;\n        padding: 6px 4px;\n        border: 0;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.25;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-legend button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-legend button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 1px;\n      }\n\n      .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #77726d;\n        opacity: .55;\n      }\n\n      .opportunities-extension-consumption-legend-swatch {\n        display: block;\n        width: 12px;\n        height: 12px;\n        justify-self: center;\n      }\n\n      .opportunities-extension-consumption-legend-funded {\n        background: #b77888;\n      }\n\n      .opportunities-extension-consumption-legend-overage {\n        background: #de7907;\n      }\n\n      .opportunities-extension-consumption-legend-average {\n        height: 0;\n        border-top: 2px dashed #de7907;\n      }\n\n      .opportunities-extension-consumption-tooltip {\n        position: absolute;\n        z-index: 2;\n        display: grid;\n        min-width: 190px;\n        max-width: 260px;\n        gap: 4px;\n        padding: 10px 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .2);\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.3;\n        pointer-events: none;\n      }\n\n      .opportunities-extension-consumption-tooltip[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-consumption-tooltip strong {\n        margin-bottom: 2px;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton {\n        height: 100%;\n        min-height: 0;\n        padding: 34px 62px 24px;\n        box-sizing: border-box;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot {\n        display: flex;\n        height: 100%;\n        min-height: 220px;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px;\n        border-bottom: 1px solid #dedbd7;\n        border-left: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot span {\n        width: min(38px, 6%);\n        border-radius: 2px 2px 0 0;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-consumption-chart-empty,\n      .opportunities-extension-consumption-chart-error {\n        display: grid;\n        min-height: 220px;\n        place-items: center;\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-chart-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-account-plan-status-indicator {\n        display: inline-block;\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        background: #9b9691;\n        box-shadow: 0 0 0 3px #efedeb;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #3f6f17;\n        box-shadow: 0 0 0 3px #e2f2e5;\n      }\n\n      .opportunities-extension-account-plan-tab .opportunities-extension-account-plan-status-indicator {\n        margin-right: 8px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs {\n        display: flex;\n        min-height: 46px;\n        align-items: center;\n        padding: 0 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-skeleton-panel {\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tab {\n        display: inline-flex;\n        align-items: center;\n        gap: 9px;\n        min-height: 38px;\n        padding: 0 12px;\n        border-bottom: 3px solid #00758f;\n      }\n\n      .opportunities-extension-account-plans-skeleton-status {\n        display: block;\n        width: 10px;\n        height: 10px;\n        flex: 0 0 auto;\n        border-radius: 50%;\n        background: #dedbd7;\n        box-shadow: 0 0 0 3px #efedeb;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        padding: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        align-items: center;\n        gap: 10px;\n        min-height: 42px;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plans-skeleton-bar {\n        display: block;\n        height: 12px;\n        border-radius: 3px;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs .opportunities-extension-account-plans-skeleton-bar {\n        height: 14px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-label {\n        width: 74%;\n        height: 10px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        margin: 14px 0 0;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend-header {\n        display: flex;\n        justify-content: flex-end;\n        min-height: 38px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods {\n        display: flex;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n        height: 12px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-period-active {\n        height: 38px !important;\n        border: 1px solid #8cc8d3;\n        background: #e7f6f8;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation {\n        display: grid;\n        grid-template-columns: 32px 124px 32px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 54px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation .opportunities-extension-account-plans-skeleton-bar {\n        justify-self: center;\n      }\n\n      .opportunities-extension-account-plans-skeleton-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 150px;\n        align-items: center;\n        gap: 28px;\n        padding: 12px 14px 0 62px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot {\n        display: flex;\n        position: relative;\n        height: 300px;\n        min-height: 0;\n        box-sizing: border-box;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px 64px;\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #ebe8e5 58px, #ebe8e5 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        position: absolute;\n        display: block;\n        content: \"\";\n        background: #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before {\n        top: 0;\n        bottom: 64px;\n        left: 0;\n        width: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        right: 0;\n        bottom: 64px;\n        left: 0;\n        height: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot .opportunities-extension-account-plans-skeleton-bar {\n        width: min(38px, 7%);\n        flex: 0 1 38px;\n        border-radius: 2px 2px 0 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend {\n        display: grid;\n        align-content: center;\n        gap: 18px;\n        min-height: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend .opportunities-extension-account-plans-skeleton-bar {\n        height: 11px;\n      }\n\n      @keyframes opportunities-extension-skeleton-pulse {\n        from { opacity: .48; }\n        to { opacity: 1; }\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        .opportunities-extension-account-plans-skeleton-bar,\n        .opportunities-extension-consumption-chart-skeleton-plot span,\n        .opportunities-extension-consumption-svg .consumption-animated-label,\n        .opportunities-extension-consumption-svg .consumption-animated-average {\n          animation: none;\n          opacity: 1;\n        }\n      }\n\n      .opportunities-extension-account-plans-empty,\n      .opportunities-extension-account-plans-error {\n        margin: 0;\n        padding: 28px 20px;\n        color: #5f5a55;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-account-plans-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-preferences-dialog {\n        display: grid;\n        width: min(680px, 100%);\n        max-height: min(720px, calc(100vh - 48px));\n        grid-template-rows: auto minmax(0, 1fr) auto;\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-preferences-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 18px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-preferences-header h2 {\n        margin: 0;\n        font-size: 20px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-preferences-content {\n        min-height: 0;\n        overflow: auto;\n        padding: 20px;\n      }\n\n      .opportunities-extension-preferences-fieldset {\n        min-width: 0;\n        margin: 0;\n        padding: 0;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-fieldset legend {\n        margin-bottom: 12px;\n        padding: 0;\n        color: #312d2a;\n        font-size: 15px;\n        font-weight: 700;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-preferences-options {\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 4px 20px;\n      }\n\n      .opportunities-extension-preferences-option {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        min-width: 0;\n        padding: 9px 8px;\n        border-radius: 4px;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.35;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-option:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-preferences-option input {\n        width: 18px;\n        height: 18px;\n        flex: 0 0 18px;\n        margin: 0;\n        accent-color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-cache-field {\n        display: grid;\n        width: min(280px, 100%);\n        gap: 6px;\n        margin-top: 24px;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-preferences-cache-field select {\n        width: 100%;\n        height: 40px;\n        padding: 0 36px 0 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-preferences-cache-field select:focus {\n        border-color: #00758f;\n        outline: 2px solid #bde7ee;\n        outline-offset: 0;\n      }\n\n      .opportunities-extension-preferences-footer {\n        display: flex;\n        justify-content: flex-end;\n        padding: 14px 20px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-button {\n        min-width: 88px;\n        min-height: 36px;\n        padding: 7px 16px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-button-primary {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-button-primary:hover,\n      .opportunities-extension-button-primary:focus-visible {\n        border-color: #005e73;\n        background: #005e73;\n        outline: none;\n      }\n\n      .opportunities-extension-debug-panel {\n        position: fixed;\n        right: 24px;\n        bottom: 24px;\n        z-index: 1;\n        width: min(640px, calc(100vw - 48px));\n        max-height: min(560px, calc(100vh - 120px));\n        overflow: auto;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 2px 8px rgba(0, 0, 0, .16);\n        padding: 16px;\n        color: #000000;\n      }\n\n      .opportunities-extension-debug-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-debug-panel h2 {\n        margin: 0;\n        font-size: 18px;\n        font-weight: 700;\n        line-height: 1.25;\n      }\n\n      .opportunities-extension-debug-panel p {\n        margin: 4px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-panel-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 12px;\n      }\n\n      .opportunities-extension-debug-visibility-button {\n        width: 34px;\n        height: 34px;\n        flex: 0 0 34px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-debug-visibility-button svg {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-debug-list {\n        display: grid;\n        gap: 10px;\n      }\n\n      .opportunities-extension-debug-item {\n        border: 1px solid #dedbd7;\n        border-left-width: 4px;\n        border-radius: 4px;\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-debug-item[open] {\n        background: #ffffff;\n      }\n\n      .opportunities-extension-debug-item-success {\n        border-left-color: #3f6f17;\n      }\n\n      .opportunities-extension-debug-item-success .opportunities-extension-debug-status {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-debug-item-failed {\n        border-left-color: #c5331f;\n      }\n\n      .opportunities-extension-debug-item-failed .opportunities-extension-debug-status {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-debug-item-pending {\n        border-left-color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-item-pending .opportunities-extension-debug-status {\n        background: #eee8f2;\n        color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        min-height: 42px;\n        padding: 9px 12px 9px 10px;\n        cursor: pointer;\n        list-style: none;\n      }\n\n      .opportunities-extension-debug-heading::-webkit-details-marker {\n        display: none;\n      }\n\n      .opportunities-extension-debug-heading::before {\n        content: \"⌄\";\n        width: 14px;\n        color: #5f5a55;\n        font-size: 16px;\n        line-height: 1;\n        transform: rotate(-90deg);\n        transition: transform .15s ease;\n      }\n\n      .opportunities-extension-debug-item[open] .opportunities-extension-debug-heading::before {\n        transform: rotate(0deg);\n      }\n\n      .opportunities-extension-debug-summary-meta {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        margin-left: auto;\n      }\n\n      .opportunities-extension-debug-http-status,\n      .opportunities-extension-debug-status {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 0 8px;\n        border-radius: 999px;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-debug-http-status {\n        background: #e8f4f6;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-debug-status {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-debug-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-item pre {\n        margin: 0;\n        padding: 8px 12px 12px;\n        color: #312d2a;\n        font-family: Consolas, \"Courier New\", monospace;\n        font-size: 12px;\n        line-height: 1.45;\n        white-space: pre-wrap;\n        word-break: break-word;\n      }\n\n      .opportunities-extension-debug-empty {\n        padding: 14px;\n        border: 1px dashed #b8b2ad;\n        border-radius: 4px;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] {\n        background: #1f1f1f;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-shell,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-body {\n        background: #1f1f1f;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header {\n        border-bottom-color: #4e4a46;\n        background:\n          linear-gradient(90deg, #a8795d 0 11%, #dd5a47 11% 23%, #876e9b 23% 36%, #00a6be 36% 51%, #dfbd76 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header h1,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-value,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dt,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-bar {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-status {\n        background: #5b5753;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-period-active {\n        border-color: #3f7580;\n        background: #23474e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot span {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator {\n        background: #8f8a85;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #7fb05b;\n        box-shadow: 0 0 0 3px #314527;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-form,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-surface,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item[open] {\n        border-color: #4e4a46;\n        background: #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-select-wrap::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger:disabled {\n        background: #292827;\n        color: #918b86;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search::placeholder,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input::placeholder {\n        color: #b5b0ab;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-fieldset legend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dd,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item pre,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel h2 {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation strong {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th {\n        border-bottom-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-footer,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs-navigation,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details > div,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-details > div {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #4e4a46 58px, #4e4a46 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::after {\n        background: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab:hover {\n        background: #3b3937;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #43c4d5;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #43c4d5;\n        background: #173e43;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:hover:not(:disabled),\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #43c4d5;\n        background: #3b3937;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:disabled,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #4e4a46;\n        color: #746f6a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        stroke: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #a8a39e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-funded {\n        background: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-overage {\n        background: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-average {\n        border-top-color: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-tooltip {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option input {\n        accent-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary {\n        border-color: #00a6be;\n        background: #008aa6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:focus-visible {\n        border-color: #43c4d5;\n        background: #006d7a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table tbody tr:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sort-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:focus {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table thead,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th {\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail {\n        border-bottom-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count {\n        border-color: #2f9bae;\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #43c4d5;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"running\"] {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #244f2e;\n        color: #a8dfb7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"error\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count-error {\n        border-color: #b13b34;\n        background: #5f2926;\n        color: #ffb4ad;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-cache-timestamp {\n        background: #3b3937;\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:focus-visible {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #d1cbc6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #ffbf62;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #d2b7e9;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #9bd46a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-total-dashboard-card {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #c0b9b3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #ffb84d;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #cba7e7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #92cf5b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #008aa6;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #6f6863;\n        background: #6f6863;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #b96e00;\n        background: #b96e00;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #755b8b;\n        background: #755b8b;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #4b7f22;\n        background: #4b7f22;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #69c985;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #c3cad3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #ff9d94;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #83bfff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item {\n        border-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button {\n        color: #f6f4f2;\n      }\n\n      @media (min-width: 1201px) and (max-width: 1450px) {\n        .opportunities-extension-table th:nth-child(1) {\n          width: 16%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 18%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 12%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 7%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 8%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 10%;\n        }\n      }\n\n      @media (max-width: 1200px) {\n        .opportunities-extension-table {\n          min-width: 1180px;\n        }\n\n        .opportunities-extension-table th:nth-child(1) {\n          width: 15%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 17%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 13%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 6%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 9%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 11%;\n        }\n      }\n\n      @media (max-width: 700px) {\n        .opportunities-extension-header {\n          padding: 24px 20px 18px;\n        }\n\n        .opportunities-extension-header::before {\n          left: 20px;\n        }\n\n        .opportunities-extension-header h1 {\n          font-size: 22px;\n        }\n\n        .opportunities-extension-header p {\n          font-size: 14px;\n        }\n\n        .opportunities-extension-body {\n          padding: 16px 20px 24px;\n        }\n\n        .opportunities-extension-form {\n          align-items: stretch;\n          flex-wrap: wrap;\n          gap: 14px;\n          min-height: auto;\n          padding: 12px;\n        }\n\n        .opportunities-extension-field {\n          max-width: none;\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-trigger {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-panel {\n          width: min(360px, calc(100vw - 64px));\n        }\n\n        .opportunities-extension-table-search-field {\n          width: 100%;\n        }\n\n        .opportunities-extension-stage-dashboard {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n        }\n\n        .opportunities-extension-stage-dashboard-value {\n          font-size: 18px;\n        }\n\n        .opportunities-extension-preferences-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-account-plans-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-preferences-dialog {\n          max-height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plans-dialog {\n          height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plan-panel {\n          padding: 12px 14px;\n        }\n\n        .opportunities-extension-account-plan-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n        }\n\n        .opportunities-extension-account-plan-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 3px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n          padding: 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 5px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-trend {\n          margin: 14px 0 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          align-items: center;\n          gap: 6px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n          width: 100% !important;\n        }\n\n        .opportunities-extension-account-plans-skeleton-chart {\n          grid-template-columns: minmax(0, 1fr);\n          gap: 12px;\n          padding: 12px 8px 0 34px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-legend {\n          display: flex;\n          min-height: 24px;\n          align-items: center;\n          justify-content: center;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-trend-header {\n          align-items: stretch;\n        }\n\n        .opportunities-extension-consumption-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          gap: 3px;\n        }\n\n        .opportunities-extension-consumption-periods button {\n          min-width: 0;\n          padding: 7px 4px;\n          font-size: 12px;\n        }\n\n        .opportunities-extension-consumption-chart {\n          min-height: 0;\n        }\n\n        .opportunities-extension-consumption-svg {\n          width: 760px;\n          height: 245px;\n        }\n\n        .opportunities-extension-consumption-visual {\n          width: 920px;\n          grid-template-columns: 760px 144px;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-figure {\n          overflow-x: auto;\n          overscroll-behavior-inline: contain;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton {\n          min-height: 0;\n          padding: 24px 18px 18px;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton-plot {\n          min-height: 180px;\n          gap: 4px;\n          padding: 0 6px;\n        }\n\n        .opportunities-extension-preferences-options {\n          grid-template-columns: 1fr;\n        }\n\n        .opportunities-extension-stage-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-status-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-table-surface {\n          min-width: 0;\n          min-height: calc(100vh - 230px);\n        }\n\n        .opportunities-extension-debug-panel {\n          right: 12px;\n          bottom: 12px;\n          width: calc(100vw - 24px);\n          max-height: calc(100vh - 96px);\n        }\n      }\n    \n/* Full-page diagnostics, scoped to the extension and its current theme. */\n.opportunities-extension-modal .opportunities-extension-debug-panel {\n  --debug-surface: #fff;\n  --debug-code: #f5f6f7;\n  --debug-text: #312d2a;\n  --debug-muted: #5f5a55;\n  --debug-border: #dedbd7;\n  --debug-success: #22613b;\n  --debug-success-bg: #e1f1e5;\n  --debug-failed: #a12721;\n  --debug-failed-bg: #fce8e6;\n  --debug-pending: #805000;\n  --debug-pending-bg: #fff1ce;\n  --debug-info: #075e87;\n  --debug-info-bg: #e5f1fa;\n  --debug-key: #075e87;\n  --debug-string: #22613b;\n  --debug-number: #865000;\n  --debug-literal: #73429b;\n  position: fixed;\n  inset: 0;\n  z-index: 50;\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  width: auto;\n  height: auto;\n  max-height: none;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  margin: 0;\n  padding: 20px;\n  border: 0;\n  border-radius: 0;\n  background: var(--debug-surface);\n  color: var(--debug-text);\n  color-scheme: light;\n}\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel {\n  --debug-surface: #292827;\n  --debug-code: #222120;\n  --debug-text: #f6f4f2;\n  --debug-muted: #c9c5c1;\n  --debug-border: #514c47;\n  --debug-success: #a9e3bd;\n  --debug-success-bg: #214d34;\n  --debug-failed: #ffb4ab;\n  --debug-failed-bg: #582c2a;\n  --debug-pending: #ffe099;\n  --debug-pending-bg: #59441e;\n  --debug-info: #a8d9ff;\n  --debug-info-bg: #233f52;\n  --debug-key: #8ed6f0;\n  --debug-string: #a9e3bd;\n  --debug-number: #ffe099;\n  --debug-literal: #d6b7f1;\n  color: #f6f4f2;\n  color-scheme: dark;\n}\n.opportunities-extension-debug-actions { display: flex; gap: 8px; flex: 0 0 auto; }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-list {\n  overflow: auto;\n  min-height: 0;\n  min-width: 0;\n  align-content: start;\n  scrollbar-gutter: stable;\n  padding: 2px 8px 12px 2px;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item {\n  --debug-state: var(--debug-info);\n  --debug-state-bg: var(--debug-info-bg);\n  border-color: var(--debug-border);\n  border-left-color: var(--debug-state);\n  background: var(--debug-surface);\n  min-width: 0;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-success { --debug-state: var(--debug-success); --debug-state-bg: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-failed { --debug-state: var(--debug-failed); --debug-state-bg: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-pending { --debug-state: var(--debug-pending); --debug-state-bg: var(--debug-pending-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-status {\n  color: var(--debug-state);\n  background: var(--debug-state-bg);\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status,\n.opportunities-extension-debug-method {\n  color: var(--debug-info);\n  background: var(--debug-info-bg);\n}\n.opportunities-extension-debug-method {\n  display: inline-flex;\n  align-items: center;\n  min-height: 22px;\n  padding: 0 8px;\n  border-radius: 4px;\n  font: 700 11px/1.2 Consolas, monospace;\n}\n.opportunities-extension-debug-method[data-method=\"POST\"] { color: var(--debug-literal); background: var(--debug-code); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"2\"] { color: var(--debug-success); background: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"4\"],\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"5\"] { color: var(--debug-failed); background: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"pending\"] { color: var(--debug-pending); background: var(--debug-pending-bg); }\n.opportunities-extension-debug-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 14px 16px; }\n.opportunities-extension-debug-block { min-width: 0; border-left: 2px solid var(--debug-info); padding-left: 10px; }\n.opportunities-extension-debug-block[data-direction=\"response\"] { border-left-color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-block h3 { margin: 0 0 8px; color: var(--debug-info); font-size: 12px; }\n.opportunities-extension-modal .opportunities-extension-debug-block[data-direction=\"response\"] h3 { color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item pre {\n  min-width: 0;\n  margin: 0;\n  padding: 12px;\n  max-height: 380px;\n  overflow: auto;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  color: var(--debug-text);\n  background: var(--debug-code);\n  line-height: 1.6;\n  tab-size: 2;\n}\n.opportunities-extension-debug-json-key { color: var(--debug-key); }\n.opportunities-extension-debug-json-string { color: var(--debug-string); }\n.opportunities-extension-debug-json-number { color: var(--debug-number); }\n.opportunities-extension-debug-json-literal { color: var(--debug-literal); }\n@media (max-width: 760px) {\n  .opportunities-extension-modal .opportunities-extension-debug-panel { padding: 12px; }\n  .opportunities-extension-debug-details { grid-template-columns: minmax(0, 1fr); }\n}\n.opportunities-extension-debug-tabs {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  margin-bottom: 12px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid #dedbd7;\n}\n\n.opportunities-extension-debug-tabs button {\n  max-width: 100%;\n  min-height: 32px;\n  padding: 6px 8px;\n  border: 0;\n  border-bottom: 2px solid transparent;\n  border-radius: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.35;\n  overflow-wrap: anywhere;\n  cursor: pointer;\n}\n\n.opportunities-extension-debug-tabs button:hover {\n  background: #f5f4f2;\n}\n\n.opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  border-bottom-color: #00758f;\n  background: #e8f4f6;\n  color: #006b84;\n  font-weight: 700;\n}\n\n.opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline: 2px solid #00758f;\n  outline-offset: -2px;\n}\n\n.opportunities-extension-debug-time {\n  font-size: 11px;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.opportunities-extension-debug-heading {\n  flex-wrap: wrap;\n}\n\n.opportunities-extension-debug-heading strong {\n  flex: 1 1 180px;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-debug-summary-meta {\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button {\n  color: #f6f4f2;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading::before {\n  color: #c9c5c1;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs {\n  border-bottom-color: #514c47;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:hover {\n  background: #383633;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  background: #173f48;\n  border-bottom-color: #8cc8d3;\n  color: #bde7ee;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline-color: #8cc8d3;\n}\n\n/* Compact filters use available CSS width, including Windows display scaling. */\n.opportunities-extension-crm-sr-badge {\n  flex: 0 0 auto;\n  padding: 0 6px;\n  border: 1px solid #408254;\n  border-radius: 8px;\n  font-size: 10px;\n  line-height: 18px;\n  font-weight: 600;\n  white-space: nowrap;\n  color: #185b30;\n  background: #e1f1e5;\n}\n.opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #9f201b; background: #fde8e7; border-color: #c74640; }\n.opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #785000; background: #fff0cd; border-color: #987021; }\n.opportunities-extension-crm-sr-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge { color: #b8e4c6; background: #214d34; border-color: #6eac82; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #ffd9d5; background: #542824; border-color: #ef938b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #ffe0a3; background: #584219; border-color: #c99b4b; }\n\n.opportunities-extension-form {\n  display: grid;\n  grid-template-columns: max-content minmax(110px, 1fr) minmax(110px, 1fr) minmax(145px, 180px) max-content max-content;\n  align-items: end;\n  gap: 12px;\n  min-height: 0;\n  padding: 12px;\n}\n\n.opportunities-extension-form > * {\n  min-width: 0;\n  width: 100%;\n  max-width: none;\n  grid-template-rows: auto 32px;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.opportunities-extension-form > * > span:first-child {\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap {\n  width: 100%;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger,\n.opportunities-extension-form .opportunities-extension-table-search-field input {\n  box-sizing: border-box;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  min-height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger {\n  padding-right: 26px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap::after,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger::after {\n  right: 10px;\n  border-left-width: 4px;\n  border-right-width: 4px;\n  border-top-width: 5px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-controls,\n.opportunities-extension-form .opportunities-extension-status-filter-controls {\n  flex-wrap: nowrap;\n  gap: 4px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-button,\n.opportunities-extension-form .opportunities-extension-status-filter-button {\n  min-height: 28px;\n  padding: 4px 7px;\n  font-size: 11px;\n  line-height: 18px;\n  white-space: nowrap;\n}\n\n/* Native select intrinsic sizing includes its longest option, not just the selection. */\n@media (min-width: 1151px) {\n  .opportunities-extension-form > .opportunities-extension-field,\n  .opportunities-extension-form .opportunities-extension-select-wrap,\n  .opportunities-extension-form .opportunities-extension-field select {\n    width: max-content;\n    max-width: none;\n  }\n}\n\n@media (max-width: 1150px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-column: span 2;\n  }\n}\n\n@media (max-width: 700px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .opportunities-extension-form .opportunities-extension-stage-filter-controls,\n  .opportunities-extension-form .opportunities-extension-status-filter-controls {\n    flex-wrap: wrap;\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-template-rows: auto auto;\n  }\n}\n\n@media (max-width: 420px) {\n  .opportunities-extension-form { grid-template-columns: minmax(0, 1fr); }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter { grid-column: auto; }\n}\n\n/* Keep layout rules on the outer table, never on expanded product tables. */\n.opportunities-extension-table[data-opportunities-layout=\"inline-actions\"] {\n  width: 100%;\n  min-width: 1120px;\n  table-layout: fixed;\n}\n\n/* Fixed table layout shares leftover width only between the two auto columns. */\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"owner\"] { width: 132px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"optyNumber\"] { width: 106px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"revenue\"] { width: 124px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"closeDate\"] { width: 100px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"status\"] { width: 114px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"winProbability\"] { width: 110px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"stage\"] { width: 94px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"lastUpdateDate\"] { width: 136px; }\n\n.opportunities-extension-table > tbody > tr > td[data-column] {\n  padding: 10px 8px;\n  overflow: visible;\n  text-overflow: clip;\n  white-space: normal;\n  font-variant-numeric: tabular-nums;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"name\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] {\n  position: relative;\n  padding-right: 16px;\n  padding-left: 12px;\n  padding-bottom: 38px;\n  vertical-align: top;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"owner\"] {\n  padding-right: 16px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"closeDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"lastUpdateDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"status\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"stage\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"winProbability\"] {\n  white-space: nowrap;\n}\n\n.opportunities-extension-cell-content {\n  display: block;\n  min-width: 0;\n  min-height: 2.7em;\n  line-height: 1.35;\n}\n\n.opportunities-extension-cell-content > :first-child {\n  display: block;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-cell-actions {\n  position: absolute;\n  left: 12px;\n  right: 16px;\n  bottom: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: 6px;\n  height: 24px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button {\n  flex: 0 0 24px;\n  width: 24px;\n  height: 24px;\n  padding: 2px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] .opportunities-extension-cell-actions {\n  min-width: 84px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button svg {\n  width: 18px;\n  height: 18px;\n}\n\n.opportunities-extension-cell-actions button:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n}\n\n.opportunities-extension-products-ramp {\n  display: inline-block;\n  min-width: 0;\n  max-width: 100%;\n  padding: 0 6px;\n  border: 1px solid #bba5cf;\n  border-radius: 8px;\n  background: #f0e8f7;\n  color: #63358a;\n  font-size: 10px;\n  font-weight: 600;\n  line-height: 16px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp {\n  background: #43334f;\n  color: #ead5fc;\n  border-color: #9372ac;\n}\n\n.opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #fde8e7;\n  color: #9f201b;\n  border-color: #c74640;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #542824;\n  color: #ffd9d5;\n  border-color: #ef938b;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  gap: 6px;\n  padding: 10px 8px;\n  align-items: center;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] .opportunities-extension-sort-button,\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] .opportunities-extension-sort-button {\n  padding-left: 12px;\n  padding-right: 16px;\n}\n\n.opportunities-extension-sort-label {\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button::after {\n  position: static;\n  justify-self: end;\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog {\n  width: min(1700px, 100%);\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header {\n  padding: 10px 12px;\n  gap: 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header h2 {\n  font-size: 16px;\n  line-height: 22px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header p {\n  font-size: 12px;\n  line-height: 16px;\n  margin-top: 3px;\n  overflow-wrap: anywhere;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-icon-button {\n  width: 28px;\n  height: 28px;\n  min-width: 28px;\n  min-height: 28px;\n  padding: 4px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-toolbar {\n  padding: 8px 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-search {\n  width: min(320px, 100%);\n  height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n.opportunities-extension-install-base-content {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  scrollbar-gutter: stable;\n}\n.opportunities-extension-install-base-message { margin: 10px 12px; font-size: 12px; line-height: 16px; }\n.opportunities-extension-install-base-table {\n  width: 100%; min-width: 1120px; table-layout: fixed; border-collapse: collapse; font-size: 11px;\n}\n.opportunities-extension-install-base-table col { width: 7%; }\n.opportunities-extension-install-base-table .install-base-col-partyName { width: 12%; }\n.opportunities-extension-install-base-table .install-base-col-productGroupName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-productName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-quantity { width: 5%; }\n.opportunities-extension-install-base-table .install-base-col-quantityType { width: 8%; }\n.opportunities-extension-install-base-table th,\n.opportunities-extension-install-base-table td {\n  padding: 8px 6px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-install-base-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-install-base-table td[data-format=\"amount\"],\n.opportunities-extension-install-base-table td[data-format=\"quantity\"] { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-install-base-table td[data-format=\"date\"] { white-space: nowrap; }\n.opportunities-extension-install-base-status {\n  display: inline-block; padding: 2px 5px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\n.opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #855300; background: #fff0d6; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #b8e4c6; background: #214d34; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #ffdfa2; background: #614418; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-install-base-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog { width: min(1700px, 100%); }\n.opportunities-extension-service-requests-content { min-width: 0; min-height: 0; overflow: auto; scrollbar-gutter: stable; }\n.opportunities-extension-service-requests-message { margin: 16px; font-size: 13px; }\n.opportunities-extension-service-requests-table {\n  width: 100%; min-width: 1200px; table-layout: fixed; border-collapse: collapse; font-size: 12px;\n}\n.opportunities-extension-service-requests-table col { width: 7%; }\n.opportunities-extension-service-requests-table .service-requests-col-name { width: 17%; }\n.opportunities-extension-service-requests-table .service-requests-col-id { width: 10%; }\n.opportunities-extension-service-requests-table .service-requests-col-severity { width: 5%; }\n.opportunities-extension-service-requests-table .service-requests-col-subStatus { width: 14%; }\n.opportunities-extension-service-requests-table .service-requests-col-productName { width: 12%; }\n.opportunities-extension-service-requests-table th,\n.opportunities-extension-service-requests-table td {\n  padding: 12px 8px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-service-requests-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-service-requests-table td[data-field=\"created\"],\n.opportunities-extension-service-requests-table td[data-field=\"lastUpdated\"],\n.opportunities-extension-service-requests-table td[data-field=\"id\"] { white-space: nowrap; font-variant-numeric: tabular-nums; }\n.opportunities-extension-service-request-status {\n  display: inline-block; padding: 3px 6px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8;\n}\n.opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #b8e4c6; background: #214d34; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-service-requests-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n/* Scope sizing to Cloud Consumption, not other dialogs sharing its components. */\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header { padding: 10px 12px; gap: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header h2 { font-size: 16px; line-height: 22px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header p { font-size: 12px; line-height: 16px; margin-top: 3px; overflow-wrap: anywhere; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-icon-button { width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 4px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-tabs { padding: 4px 12px 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-tab { min-height: 30px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { padding: 8px 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { gap: 0 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details > div { grid-template-columns: minmax(85px, 35%) minmax(0, 1fr); min-height: 32px; padding: 4px 0; gap: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dt { font-size: 11px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dd { font-size: 12px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-trend { margin-top: 8px; padding-top: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-periods button { min-height: 28px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation { grid-template-columns: 28px minmax(120px, auto) 28px; min-height: 30px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation strong { font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation-button { width: 28px; height: 28px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-svg { height: 100%; max-height: 100%; min-width: 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend button { font-size: 11px; padding: 4px; gap: 5px; }\n\n/* Small viewports must scroll rather than clip details or collapse the chart. */\n@media (max-height: 560px), (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-panels { overflow: auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { height: auto; min-height: 100%; grid-template-rows: auto minmax(280px, 1fr); }\n}\n@media (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { grid-template-columns: minmax(0, 1fr); }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend { display: flex; flex-wrap: wrap; }\n}\n\n.opportunities-extension-plan-detail-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }\n.opportunities-extension-consumption-trend-header { align-items: center; justify-content: space-between; gap: 12px; }\n.opportunities-extension-consumption-trend-header > .opportunities-extension-plan-detail-badges { min-width: 0; }\n.opportunities-extension-plan-detail-skeleton { width: 64px; height: 20px; }\n.opportunities-extension-projection-badge {\n  display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent;\n  padding: 3px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; line-height: 1.3;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\nbutton.opportunities-extension-projection-badge { cursor: pointer; }\n.opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #a12424; background: #fbe5e5; }\n.opportunities-extension-projection-badge[data-status=\"overage\"] { color: #185a9d; background: #e0edfc; }\n.opportunities-extension-projection-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-projection-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; padding: 14px; overflow: auto; overscroll-behavior: contain;\n  border: 1px solid #b9b4ae; border-radius: 4px; background: #ffffff; color: #312d2a;\n  box-shadow: 0 4px 16px #0003; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere;\n}\n.opportunities-extension-projection-popover[hidden] { display: none; }\n.opportunities-extension-projection-popover .opportunities-extension-projection-dismiss {\n  display: grid; place-items: center; width: 24px; height: 24px; margin-left: auto; margin-bottom: 8px; padding: 4px; border: 1px solid #b9b4ae;\n  border-radius: 4px; background: transparent; color: inherit; cursor: pointer; font-size: 12px;\n}\n.opportunities-extension-projection-dismiss svg { width: 14px; height: 14px; }\n.opportunities-extension-projection-line h3 { margin: 0 0 8px; font-size: 12px; }\n.opportunities-extension-projection-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; }\n.opportunities-extension-projection-fields > div { min-width: 0; }\n.opportunities-extension-projection-fields dt { font-weight: 600; color: #5f5a55; font-size: 11px; }\n.opportunities-extension-projection-fields dd { margin: 2px 0 0; font-variant-numeric: tabular-nums; }\n.opportunities-extension-projection-fields a { color: #006d7a; text-decoration: underline; }\n.opportunities-extension-projection-children { margin-top: 14px; padding-left: 12px; border-left: 2px solid #dedbd7; }\n.opportunities-extension-projection-children > section + section { margin-top: 16px; }\n.opportunities-extension-plan-detail-error { color: #a12424; font-size: 12px; }\n.opportunities-extension-projection-empty { color: #5f5a55; font-size: 12px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-popover { color: #f1efec; background: #302e2b; border-color: #716b64; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #ffb9b9; background: #682e32; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"overage\"] { color: #c5dfff; background: #224b76; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields dt,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-empty { color: #cec9c2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields a { color: #76dbea; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-plan-detail-error { color: #ffb9b9; }\n@media (max-width: 480px) { .opportunities-extension-projection-fields { grid-template-columns: minmax(0, 1fr); } }\n@media (max-width: 480px) {\n  .opportunities-extension-consumption-trend-header > .opportunities-extension-consumption-periods { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n}\n@media (prefers-reduced-motion: reduce) { .opportunities-extension-plan-detail-skeleton { animation: none; } }\n\n.opportunities-extension-account-plan-details > .opportunities-extension-contract-row {\n  align-items: center;\n}\n.opportunities-extension-contract-row > dt,\n.opportunities-extension-contract-row > dd,\n.opportunities-extension-contract-ratecard > span {\n  line-height: 20px;\n}\n.opportunities-extension-contract-ratecard {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n.opportunities-extension-ratecard-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  align-self: center;\n  box-sizing: border-box;\n  height: 28px;\n  margin: 0;\n  flex: 0 0 auto;\n  padding: 0 8px;\n  border: 1px solid #8aaeb9;\n  border-radius: 4px;\n  background: #fff;\n  color: #006b80;\n  font: inherit;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 20px;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-button:hover { background: #e8f4f6; }\n.opportunities-extension-ratecard-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 8;\n  display: flex;\n  justify-content: flex-end;\n  overflow: hidden;\n  overflow: clip;\n  background: rgba(0, 0, 0, 0);\n  transition: background-color 320ms ease;\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] { background: rgba(0, 0, 0, .32); }\n.opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #fff;\n  --ratecard-heading: #faf9f8;\n  --ratecard-text: #312d2a;\n  --ratecard-muted: #615a55;\n  --ratecard-border: #dedbd8;\n  --ratecard-accent: #00758f;\n  --ratecard-skeleton: #eae7e4;\n  display: grid;\n  grid-template-rows: auto auto auto minmax(0, 1fr);\n  width: min(1520px, calc(100% - 48px));\n  height: 100%;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  box-shadow: -6px 0 24px rgba(0, 0, 0, .2);\n  transform: translateX(100%);\n  transition: transform 320ms cubic-bezier(.22, .61, .36, 1);\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(0); }\n.opportunities-extension-ratecard-header > div { min-width: 0; overflow-wrap: anywhere; }\n.opportunities-extension-ratecard-plan-details { padding: 12px 20px 0; }\n.opportunities-extension-ratecard-toolbar { display: flex; align-items: center; gap: 16px; padding: 12px 20px; }\n.opportunities-extension-ratecard-search {\n  width: min(360px, 100%);\n  min-width: 0;\n  box-sizing: border-box;\n  padding: 9px 12px;\n  border: 1px solid var(--ratecard-muted);\n  border-radius: 4px;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-ratecard-search::placeholder { color: var(--ratecard-muted); opacity: 1; }\n.opportunities-extension-ratecard-count { color: var(--ratecard-muted); font-size: 12px; white-space: nowrap; }\n.opportunities-extension-ratecard-viewport { overflow: auto; min-height: 0; min-width: 0; scrollbar-gutter: stable; }\n.opportunities-extension-ratecard-table { width: 100%; min-width: 1100px; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 12px; }\n.opportunities-extension-ratecard-table th, .opportunities-extension-ratecard-table td {\n  padding: 11px 10px;\n  border-bottom: 1px solid var(--ratecard-border);\n  vertical-align: top;\n  overflow-wrap: anywhere;\n  text-align: left;\n}\n.opportunities-extension-ratecard-table th { position: sticky; top: 0; z-index: 1; background: var(--ratecard-heading); }\n.opportunities-extension-ratecard-sort {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  align-items: center;\n  gap: 5px;\n  width: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-weight: 600;\n  text-align: left;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-sort-icon { color: var(--ratecard-accent); text-align: center; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-numeric { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-notice { padding: 28px 20px; text-align: center; }\n.opportunities-extension-ratecard-notice [role=\"alert\"] { color: #b3261e; }\n.opportunities-extension-ratecard-skeleton { display: block; width: 85%; height: 14px; border-radius: 3px; background: var(--ratecard-skeleton); animation: opportunities-ratecard-pulse 1.1s ease-in-out infinite alternate; }\n.opportunities-extension-ratecard-drawer :focus-visible, .opportunities-extension-ratecard-button:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] { pointer-events: none; background: rgba(0, 0, 0, 0); transition-duration: 180ms; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(100%); transition-duration: 180ms; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #292725;\n  --ratecard-heading: #35322f;\n  --ratecard-text: #f5f3f1;\n  --ratecard-muted: #c2bcb6;\n  --ratecard-border: #514c47;\n  --ratecard-accent: #59d1e5;\n  --ratecard-skeleton: #514c47;\n}\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button { color: #59d1e5; border-color: #6298a2; background: #292725; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button:hover { background: #313f40; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-notice [role=\"alert\"] { color: #ffb4ab; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer :focus-visible, [data-theme=\"dark\"] .opportunities-extension-ratecard-button:focus-visible { outline-color: #59d1e5; }\n@keyframes opportunities-ratecard-pulse { from { opacity: .45; } to { opacity: 1; } }\n@media (max-width: 720px) {\n  .opportunities-extension-ratecard-drawer { width: 100%; }\n  .opportunities-extension-ratecard-toolbar { flex-wrap: wrap; gap: 8px; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-ratecard-overlay, .opportunities-extension-ratecard-drawer, .opportunities-extension-ratecard-skeleton,\n  .opportunities-extension-ratecard-overlay[data-closing=\"true\"], .opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { animation: none; transition: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog,\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog {\n  grid-template-rows: auto auto minmax(0, 1fr);\n}\n.opportunities-extension-customer-table-toolbar { padding: 12px 16px; border-bottom: 1px solid #dedbd7; }\n.opportunities-extension-customer-table-search {\n  box-sizing: border-box;\n  width: min(420px, 100%);\n  min-width: 0;\n  height: 38px;\n  padding: 8px 12px;\n  border: 1px solid #8f8a85;\n  border-radius: 4px;\n  background: #fff;\n  color: #312d2a;\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-customer-table-search::placeholder { color: #5f5a55; opacity: 1; }\n.opportunities-extension-customer-table-search:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-toolbar { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search { background: #353331; color: #f6f4f2; border-color: #8f8a85; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search::placeholder { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search:focus-visible { outline-color: #59d1e5; }\n";
+const redwoodStyles = "\n      .opportunities-extension-scroll-lock {\n        overflow: hidden !important;\n      }\n\n      .opportunities-extension-modal,\n      .opportunities-extension-modal * {\n        box-sizing: border-box;\n        font-family: \"Oracle Sans\", Arial, Helvetica, sans-serif;\n      }\n\n      .opportunities-extension-modal {\n        position: fixed;\n        inset: 0;\n        z-index: 2147483647;\n        background: #f5f4f2;\n        color: #000000;\n      }\n\n      .opportunities-extension-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-shell {\n        height: 100vh;\n        min-height: 0;\n        display: grid;\n        grid-template-rows: auto minmax(0, 1fr);\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-header {\n        position: relative;\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 24px;\n        padding: 28px 40px 22px;\n        border-bottom: 1px solid #dedbd7;\n        background:\n          linear-gradient(90deg, #8f624a 0 11%, #c74634 11% 23%, #6f5a7f 23% 36%, #00758f 36% 51%, #d4b06a 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #ffffff;\n      }\n\n      .opportunities-extension-header::before {\n        position: absolute;\n        left: 40px;\n        bottom: -1px;\n        width: 64px;\n        height: 3px;\n        background: #00758f;\n        content: \"\";\n      }\n\n      .opportunities-extension-header h1 {\n        margin: 0;\n        color: #000000;\n        font-size: 24px;\n        font-weight: 700;\n        line-height: 1.2;\n        letter-spacing: 0;\n      }\n\n      .opportunities-extension-header p {\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        line-height: 1.4;\n      }\n\n      .opportunities-extension-subtitle-row {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n        margin-top: 6px;\n      }\n\n      .opportunities-extension-auth-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        color: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-auth-badge-authenticated {\n        background: #3f6f17;\n      }\n\n      .opportunities-extension-auth-badge-unauthenticated {\n        background: #c5331f;\n      }\n\n      .opportunities-extension-auth-badge-pending {\n        background: #6f5a7f;\n      }\n\n      .opportunities-extension-products-progress {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-progress[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-cache-timestamp {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 8px;\n        border-radius: 999px;\n        background: #f0eeeb;\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-products-cache-timestamp[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"running\"]::before {\n        width: 12px;\n        height: 12px;\n        margin-right: 6px;\n        border: 2px solid currentColor;\n        border-right-color: transparent;\n        border-radius: 50%;\n        content: \"\";\n        animation: opportunities-extension-spin .8s linear infinite;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-products-progress[data-state=\"error\"] {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      @keyframes opportunities-extension-spin {\n        to { transform: rotate(360deg); }\n      }\n\n      .opportunities-extension-icon-button {\n        width: 36px;\n        height: 36px;\n        flex: 0 0 36px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 18px;\n        font-weight: 600;\n        line-height: 1;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-header-actions {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n      }\n\n      .opportunities-extension-icon-button svg {\n        width: 18px;\n        height: 18px;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-icon-button .opportunities-extension-settings-icon {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-icon-button:hover,\n      .opportunities-extension-icon-button:focus {\n        border-color: #b8b2ad;\n        background: #f5f4f2;\n        outline: none;\n      }\n\n      .opportunities-extension-body {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        gap: 16px;\n        padding: 22px 40px 36px;\n        background: #f5f4f2;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-form {\n        display: flex;\n        align-items: end;\n        flex-wrap: wrap;\n        gap: 24px;\n        min-height: 82px;\n        max-width: none;\n        margin: 0;\n        padding: 14px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-field {\n        display: grid;\n        max-width: max-content;\n        min-width: 270px;\n        width: max-content;\n        gap: 6px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-dashboard {\n        display: grid;\n        grid-template-columns: repeat(6, minmax(0, 1fr));\n        gap: 12px;\n      }\n\n      .opportunities-extension-stage-dashboard-card {\n        display: grid;\n        gap: 6px;\n        min-width: 0;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-top: 3px solid #5f5a55;\n        border-radius: 4px;\n        background: #ffffff;\n      }\n\n      .opportunities-extension-stage-dashboard-card span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-stage-dashboard-value {\n        overflow: hidden;\n        color: #312d2a;\n        font-size: 22px;\n        font-weight: 700;\n        line-height: 1.2;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #008aa6;\n      }\n\n      .opportunities-extension-total-dashboard-card {\n        border-top-color: #312d2a;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #6f6863;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #c87b00;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #755b8b;\n      }\n\n      .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #4b7f22;\n      }\n\n      .opportunities-extension-stage-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-stage-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-stage-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-stage-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #006b84;\n        background: #006b84;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #5f5a55;\n        background: #5f5a55;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #945400;\n        background: #945400;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #624e74;\n        background: #624e74;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #3f6f17;\n        background: #3f6f17;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-stage-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-status-filter {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-status-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-status-filter-controls {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: 8px;\n      }\n\n      .opportunities-extension-status-filter-button {\n        min-height: 36px;\n        padding: 6px 12px;\n        border: 1px solid currentColor;\n        border-radius: 18px;\n        background: #ffffff;\n        font-size: 12px;\n        font-weight: 700;\n        letter-spacing: 0;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-status-filter-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-customer-filter {\n        position: relative;\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        min-width: 220px;\n      }\n\n      .opportunities-extension-customer-filter-label {\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-customer-filter-trigger {\n        position: relative;\n        min-width: 220px;\n        min-height: 44px;\n        padding: 10px 38px 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-trigger::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-top: 6px solid #312d2a;\n        border-right: 5px solid transparent;\n        border-left: 5px solid transparent;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-customer-filter-trigger:disabled {\n        cursor: not-allowed;\n        background: #f5f4f2;\n        color: #7d7772;\n      }\n\n      .opportunities-extension-customer-filter-trigger:focus-visible {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-panel {\n        position: absolute;\n        top: calc(100% + 8px);\n        left: 0;\n        z-index: 4;\n        display: grid;\n        width: min(360px, calc(100vw - 80px));\n        gap: 10px;\n        padding: 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n      }\n\n      .opportunities-extension-customer-filter-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-customer-filter-search {\n        width: 100%;\n        min-height: 40px;\n        padding: 8px 10px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-customer-filter-search:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-customer-filter-option {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-customer-filter-select-all {\n        min-height: 32px;\n        padding-bottom: 8px;\n        border-bottom: 1px solid #dedbd7;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-customer-filter-panel input[type=\"checkbox\"] {\n        width: 16px;\n        height: 16px;\n        flex: 0 0 16px;\n        accent-color: #00758f;\n      }\n\n      .opportunities-extension-customer-filter-list {\n        display: block;\n        max-height: 250px;\n        overflow: auto;\n      }\n\n      .opportunities-extension-customer-filter-option {\n        display: grid;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: start;\n        min-height: 0;\n        height: auto !important;\n        padding: 8px 4px;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-customer-filter-option input[type=\"checkbox\"] {\n        margin-top: 1px;\n      }\n\n      .opportunities-extension-customer-filter-option span {\n        display: block;\n        min-width: 0;\n        line-height: 18px;\n        overflow-wrap: anywhere;\n        white-space: normal;\n      }\n\n      .opportunities-extension-customer-filter-option:hover {\n        background: #f5f4f2;\n      }\n\n      .opportunities-extension-customer-filter-empty {\n        margin: 4px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-table-search-field {\n        display: grid;\n        grid-template-rows: auto 44px;\n        gap: 6px;\n        width: 260px;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input {\n        width: 100%;\n        min-height: 44px;\n        padding: 10px 12px;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-table-search-field input:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-select-wrap {\n        position: relative;\n        display: block;\n        width: 270px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-select-wrap::after {\n        position: absolute;\n        top: 50%;\n        right: 16px;\n        width: 0;\n        height: 0;\n        border-left: 5px solid transparent;\n        border-right: 5px solid transparent;\n        border-top: 6px solid #000000;\n        content: \"\";\n        pointer-events: none;\n        transform: translateY(-50%);\n      }\n\n      .opportunities-extension-field select {\n        width: 100%;\n        min-width: 0;\n        max-width: 100%;\n        min-height: 44px;\n        box-sizing: border-box;\n        appearance: none;\n        border: 1px solid #b8b2ad;\n        border-radius: 3px;\n        background: #ffffff;\n        color: #000000;\n        font-size: 14px;\n        line-height: 1.3;\n        padding: 11px 44px 11px 12px;\n      }\n\n      .opportunities-extension-field select:focus {\n        border-color: #312d2a;\n        box-shadow: 0 0 0 1px #312d2a;\n        outline: none;\n      }\n\n      .opportunities-extension-table-surface {\n        min-height: 0;\n        height: 100%;\n        border: 1px solid #dedbd7;\n        border-radius: 4px;\n        background: #ffffff;\n        overflow-x: auto;\n        overflow-y: auto;\n      }\n\n      .opportunities-extension-table {\n        width: 100%;\n        min-width: 0;\n        border-collapse: collapse;\n        table-layout: fixed;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-table thead {\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-table th {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n        height: 44px;\n        border-bottom: 1px solid #b8b2ad;\n        background: #faf9f8;\n        color: #312d2a;\n        font-size: 12px;\n        font-weight: 700;\n        text-align: left;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td {\n        min-height: 48px;\n        padding: 12px 16px;\n        border-bottom: 1px solid #ebe8e5;\n        vertical-align: middle;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-table th:nth-child(1) {\n        width: 16%;\n      }\n\n      .opportunities-extension-table th:nth-child(2) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(3) {\n        width: 18%;\n      }\n\n      .opportunities-extension-table th:nth-child(4) {\n        width: 11%;\n      }\n\n      .opportunities-extension-table th:nth-child(5) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(6) {\n        width: 8%;\n      }\n\n      .opportunities-extension-table th:nth-child(7) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(8) {\n        width: 6%;\n      }\n\n      .opportunities-extension-table th:nth-child(9) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(10) {\n        width: 7%;\n      }\n\n      .opportunities-extension-table th:nth-child(11) {\n        width: 4%;\n      }\n\n      .opportunities-extension-table td:nth-child(2),\n      .opportunities-extension-table td:nth-child(5),\n      .opportunities-extension-table td:nth-child(6),\n      .opportunities-extension-table td:nth-child(8) {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      .opportunities-extension-table td:nth-child(9) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(7) {\n        padding-right: 6px;\n        padding-left: 6px;\n        white-space: nowrap;\n        overflow: visible;\n      }\n\n      .opportunities-extension-table td:nth-child(10) {\n        padding-right: 6px;\n        padding-left: 6px;\n        font-size: 12px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table td:nth-child(11) {\n        padding-right: 6px;\n        padding-left: 6px;\n        text-align: center;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-table tbody tr:hover {\n        background: #f7f6f4;\n      }\n\n      .opportunities-extension-table tbody tr:last-child td {\n        border-bottom: 0;\n      }\n\n      .opportunities-extension-table a {\n        color: #006b84;\n        text-decoration: underline;\n        text-decoration-thickness: 1px;\n        text-underline-offset: 2px;\n      }\n\n      .opportunities-extension-table a:hover {\n        color: #004f63;\n      }\n\n      .opportunities-extension-opty-number-content {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n        max-width: 100%;\n      }\n\n      .opportunities-extension-name-content {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        min-width: 0;\n      }\n\n      .opportunities-extension-name-content > a {\n        min-width: 0;\n      }\n\n      .opportunities-extension-actions-content {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        gap: 4px;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-products-count {\n        display: inline-grid;\n        width: auto;\n        min-width: 20px;\n        height: 20px;\n        place-items: center;\n        flex: 0 0 auto;\n        box-sizing: border-box;\n        padding: 0 3px;\n        border: 1px solid #7ca7b2;\n        border-radius: 999px;\n        background: #e8f4f6;\n        color: #006d7a;\n        font-size: 10px;\n        font-weight: 700;\n        line-height: 1;\n        text-align: center;\n        vertical-align: middle;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-products-count:hover,\n      .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n        outline: none;\n      }\n\n      .opportunities-extension-products-count-error {\n        border-color: #d8887e;\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-products-detail-row:hover {\n        background: transparent !important;\n      }\n\n      .opportunities-extension-products-detail-cell {\n        padding: 0 !important;\n      }\n\n      .opportunities-extension-products-detail {\n        padding: 14px 20px 18px;\n        border-bottom: 1px solid #c9c5c1;\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-products-detail-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 10px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-ai-summary {\n        box-sizing: border-box;\n        width: 100%;\n        min-width: 0;\n        margin: 0 0 12px;\n        padding: 12px 16px;\n        border: 1px solid #dedbd7;\n        border-radius: 6px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 13px;\n        line-height: 1.5;\n        text-align: left;\n        white-space: normal;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-ai-summary strong {\n        display: block;\n        font-size: 13px;\n        font-weight: 600;\n      }\n\n      .opportunities-extension-ai-summary p {\n        margin: 4px 0 0;\n        font: inherit;\n        white-space: pre-wrap;\n      }\n\n      .opportunities-extension-ai-summary-error {\n        color: #b42318;\n        border-color: #d9928b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary {\n        background: #292827;\n        color: #f6f4f2;\n        border-color: #5f5a55;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-ai-summary-error {\n        color: #ffb4ab;\n        border-color: #a45c55;\n      }\n\n      .opportunities-extension-products-detail-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-products-detail-heading span {\n        color: #5f5a55;\n        font-size: 11px;\n        font-weight: 600;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-products-table {\n        width: 100%;\n        table-layout: fixed;\n        border-collapse: collapse;\n        border: 1px solid #dedbd7;\n        background: #ffffff;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-products-table th,\n      .opportunities-extension-products-table td {\n        position: static;\n        height: auto;\n        padding: 8px 10px;\n        border-bottom: 1px solid #ebe8e5;\n        background: transparent;\n        overflow-wrap: anywhere;\n        vertical-align: middle;\n        white-space: normal;\n      }\n\n      .opportunities-extension-products-table th {\n        background: #faf9f8;\n        font-size: 11px;\n      }\n\n      .opportunities-extension-products-table th:nth-child(1) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(2) { width: 16%; }\n      .opportunities-extension-products-table th:nth-child(3) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(4) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(5) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(6) { width: 8%; }\n      .opportunities-extension-products-table th:nth-child(7) { width: 7%; }\n      .opportunities-extension-products-table th:nth-child(8) { width: 10%; }\n      .opportunities-extension-products-table th:nth-child(9) { width: 12%; }\n      .opportunities-extension-products-table th:nth-child(10) { width: 5%; }\n\n      .opportunities-extension-products-empty {\n        margin: 0;\n        padding: 10px 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-copy-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n        width: 24px;\n        height: 24px;\n        padding: 3px;\n        border: 0;\n        border-radius: 3px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-copy-button svg {\n        width: 16px;\n        height: 16px;\n        fill: currentColor;\n      }\n\n      .opportunities-extension-copy-button:hover,\n      .opportunities-extension-copy-button:focus-visible {\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 32px;\n        height: 32px;\n        padding: 5px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-action-button svg {\n        width: 21px;\n        height: 21px;\n      }\n\n      .opportunities-extension-action-button:hover,\n      .opportunities-extension-action-button:focus-visible {\n        border-color: #7ca7b2;\n        background: #e8f4f6;\n        color: #004f63;\n        outline: none;\n      }\n\n      .opportunities-extension-action-button:disabled {\n        cursor: wait;\n        opacity: .72;\n      }\n\n      .opportunities-extension-action-button-loading svg {\n        animation: opportunities-extension-pulse 1s ease-in-out infinite;\n      }\n\n      @keyframes opportunities-extension-pulse {\n        50% { opacity: .35; }\n      }\n\n      .opportunities-extension-copy-toast {\n        position: fixed;\n        right: 28px;\n        bottom: 28px;\n        z-index: 3;\n        max-width: min(360px, calc(100vw - 56px));\n        padding: 12px 16px;\n        border-radius: 4px;\n        background: #2f6f18;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);\n        color: #ffffff;\n        font-size: 13px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-copy-toast-error {\n        background: #a52b1c;\n      }\n\n      .opportunities-extension-copy-toast[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-stage-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"SQL\"] {\n        background: #d9f0f5;\n        color: #006b84;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"PIPELINE\"] {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"UPSIDE\"] {\n        background: #fff0d8;\n        color: #945400;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"FORECAST\"] {\n        background: #eee8f5;\n        color: #624e74;\n      }\n\n      .opportunities-extension-stage-badge[data-stage=\"WON\"] {\n        background: #e5f1d9;\n        color: #3f6f17;\n      }\n\n      .opportunities-extension-status-badge {\n        display: inline-flex;\n        align-items: center;\n        min-height: 24px;\n        padding: 3px 8px;\n        border-radius: 12px;\n        background: #ebe8e5;\n        color: #312d2a;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1.2;\n        white-space: nowrap;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"OPEN\"] {\n        background: #e2f2e5;\n        color: #197a3d;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"CLOSED\"] {\n        background: #e5e7eb;\n        color: #4b5563;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"LOST\"] {\n        background: #f9e3e1;\n        color: #b13b34;\n      }\n\n      .opportunities-extension-status-badge[data-status=\"WON\"] {\n        background: #e3edf8;\n        color: #1f5f99;\n      }\n\n      .opportunities-extension-sort-button {\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n        width: 100%;\n        min-height: 44px;\n        padding: 8px 42px 8px 16px;\n        border: 0;\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-weight: inherit;\n        letter-spacing: 0;\n        line-height: 1.2;\n        text-align: left;\n        white-space: normal;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-table-header-label {\n        display: inline-flex;\n        align-items: center;\n        min-height: 44px;\n        padding: 8px 6px;\n      }\n\n      .opportunities-extension-sort-button::after {\n        position: absolute;\n        right: 15px;\n        color: #5f5a55;\n        content: \"↕\";\n        font-size: 16px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"ascending\"]::after {\n        color: #00758f;\n        content: \"↑\";\n      }\n\n      .opportunities-extension-sort-button[data-sort-direction=\"descending\"]::after {\n        color: #00758f;\n        content: \"↓\";\n      }\n\n      .opportunities-extension-sort-button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-sort-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-table-status {\n        height: 152px;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-visually-hidden {\n        position: absolute;\n        width: 1px;\n        height: 1px;\n        padding: 0;\n        margin: -1px;\n        overflow: hidden;\n        clip: rect(0, 0, 0, 0);\n        white-space: nowrap;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 3;\n        display: grid;\n        place-items: center;\n        padding: 24px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-preferences-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-modal {\n        position: absolute;\n        inset: 0;\n        z-index: 4;\n        display: grid;\n        place-items: center;\n        padding: 12px;\n        background: rgba(0, 0, 0, .42);\n      }\n\n      .opportunities-extension-account-plans-modal[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plans-dialog {\n        display: grid;\n        width: min(1180px, 100%);\n        height: min(760px, calc(100vh - 24px));\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plans-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 14px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-header h2 {\n        margin: 0;\n        font-size: 20px;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-account-plans-header p {\n        margin: 5px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n        line-height: 1.35;\n      }\n\n      .opportunities-extension-account-plans-content {\n        display: grid;\n        min-width: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        grid-template-columns: minmax(0, 1fr);\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-content > .opportunities-extension-account-plans-skeleton {\n        grid-row: 1 / -1;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation {\n        position: relative;\n        min-width: 0;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-tabs-navigation .opportunities-extension-account-plans-tab-navigation-button[hidden] {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tabs {\n        display: flex;\n        min-width: 0;\n        gap: 4px;\n        overflow-x: auto;\n        padding: 8px 20px 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-account-plans-tabs::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button {\n        display: grid;\n        position: absolute;\n        z-index: 1;\n        top: 50%;\n        width: 32px;\n        height: 32px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        box-shadow: 0 2px 6px rgba(0, 0, 0, .16);\n        transform: translateY(-50%);\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:first-child {\n        left: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:last-child {\n        right: 8px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-account-plans-tab-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-account-plans-panels {\n        min-width: 0;\n        min-height: 0;\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plan-tab {\n        min-height: 38px;\n        flex: 0 0 auto;\n        padding: 7px 12px;\n        border: 0;\n        border-bottom: 3px solid transparent;\n        background: transparent;\n        color: #5f5a55;\n        font-size: 13px;\n        font-weight: 600;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-account-plan-tab:hover {\n        background: #f0eeeb;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #00758f;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-account-plan-tab:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: -2px;\n      }\n\n      .opportunities-extension-account-plan-panel {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        box-sizing: border-box;\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plan-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-account-plan-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        margin: 0;\n      }\n\n      .opportunities-extension-account-plan-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        gap: 10px;\n        min-height: 42px;\n        align-items: center;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plan-details dt {\n        color: #5f5a55;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-account-plan-details dd {\n        min-width: 0;\n        margin: 0;\n        color: #312d2a;\n        font-size: 13px;\n        overflow-wrap: anywhere;\n      }\n\n      .opportunities-extension-consumption-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 14px;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-trend-header {\n        display: flex;\n        align-items: center;\n        justify-content: flex-end;\n        gap: 24px;\n      }\n\n      .opportunities-extension-consumption-periods {\n        display: flex;\n        align-items: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-periods button {\n        min-height: 38px;\n        padding: 7px 14px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 13px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-periods button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #00758f;\n        background: #e7f6f8;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-periods button:focus-visible,\n      .opportunities-extension-consumption-navigation-button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 2px;\n      }\n\n      .opportunities-extension-consumption-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        margin-top: 4px;\n      }\n\n      .opportunities-extension-consumption-navigation {\n        display: grid;\n        grid-template-columns: 36px minmax(130px, auto) 36px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 40px;\n        margin-bottom: 2px;\n      }\n\n      .opportunities-extension-consumption-navigation strong {\n        color: #312d2a;\n        font-size: 13px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-navigation-button {\n        display: grid;\n        width: 36px;\n        height: 36px;\n        place-items: center;\n        padding: 0;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-navigation-button:hover:not(:disabled) {\n        border-color: #00758f;\n        background: #f0eeeb;\n        color: #005e73;\n      }\n\n      .opportunities-extension-consumption-navigation-button:disabled {\n        border-color: #dedbd7;\n        color: #b8b2ad;\n        cursor: default;\n      }\n\n      .opportunities-extension-consumption-navigation-button svg {\n        width: 18px;\n        height: 18px;\n      }\n\n      .opportunities-extension-consumption-figure {\n        position: relative;\n        min-width: 0;\n        min-height: 0;\n        margin: 0;\n        scrollbar-width: none;\n      }\n\n      .opportunities-extension-consumption-figure::-webkit-scrollbar {\n        display: none;\n      }\n\n      .opportunities-extension-consumption-visual {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 176px;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-consumption-svg {\n        display: block;\n        width: 100%;\n        height: 300px;\n        min-height: 0;\n        overflow: visible;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #dedbd7;\n        stroke-width: 1;\n        shape-rendering: crispEdges;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #5f5a55;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #312d2a;\n        font-family: Arial, sans-serif;\n        font-size: 12px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #b77888;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #de7907;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #de7907;\n        stroke-width: 1.5;\n        stroke-dasharray: 6 6;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group {\n        cursor: default;\n        outline: none;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group rect {\n        transition: filter .16s ease, opacity .16s ease, stroke .16s ease;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        filter: brightness(1.06);\n        stroke: #312d2a;\n        stroke-width: 1.5;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-label {\n        opacity: 0;\n        animation: opportunities-extension-consumption-label-in .24s ease-out forwards;\n      }\n\n      .opportunities-extension-consumption-svg .consumption-animated-average {\n        opacity: 0;\n        animation: opportunities-extension-consumption-average-in .35s .32s ease-out forwards;\n      }\n\n      @keyframes opportunities-extension-consumption-label-in {\n        from { opacity: 0; transform: translateY(4px); }\n        to { opacity: 1; transform: translateY(0); }\n      }\n\n      @keyframes opportunities-extension-consumption-average-in {\n        from { opacity: 0; }\n        to { opacity: 1; }\n      }\n\n      .opportunities-extension-consumption-legend {\n        display: grid;\n        align-content: center;\n        gap: 4px;\n      }\n\n      .opportunities-extension-consumption-legend button {\n        display: grid;\n        min-width: 0;\n        grid-template-columns: 16px minmax(0, 1fr);\n        align-items: center;\n        gap: 8px;\n        padding: 6px 4px;\n        border: 0;\n        border-radius: 4px;\n        background: transparent;\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.25;\n        text-align: left;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-consumption-legend button:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-consumption-legend button:focus-visible {\n        outline: 2px solid #00758f;\n        outline-offset: 1px;\n      }\n\n      .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #77726d;\n        opacity: .55;\n      }\n\n      .opportunities-extension-consumption-legend-swatch {\n        display: block;\n        width: 12px;\n        height: 12px;\n        justify-self: center;\n      }\n\n      .opportunities-extension-consumption-legend-funded {\n        background: #b77888;\n      }\n\n      .opportunities-extension-consumption-legend-overage {\n        background: #de7907;\n      }\n\n      .opportunities-extension-consumption-legend-average {\n        height: 0;\n        border-top: 2px dashed #de7907;\n      }\n\n      .opportunities-extension-consumption-tooltip {\n        position: absolute;\n        z-index: 2;\n        display: grid;\n        min-width: 190px;\n        max-width: 260px;\n        gap: 4px;\n        padding: 10px 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 4px 12px rgba(0, 0, 0, .2);\n        color: #312d2a;\n        font-size: 12px;\n        line-height: 1.3;\n        pointer-events: none;\n      }\n\n      .opportunities-extension-consumption-tooltip[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-consumption-tooltip strong {\n        margin-bottom: 2px;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton {\n        height: 100%;\n        min-height: 0;\n        padding: 34px 62px 24px;\n        box-sizing: border-box;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot {\n        display: flex;\n        height: 100%;\n        min-height: 220px;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px;\n        border-bottom: 1px solid #dedbd7;\n        border-left: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-consumption-chart-skeleton-plot span {\n        width: min(38px, 6%);\n        border-radius: 2px 2px 0 0;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-consumption-chart-empty,\n      .opportunities-extension-consumption-chart-error {\n        display: grid;\n        min-height: 220px;\n        place-items: center;\n        margin: 0;\n        color: #5f5a55;\n        font-size: 14px;\n        text-align: center;\n      }\n\n      .opportunities-extension-consumption-chart-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-account-plan-status-indicator {\n        display: inline-block;\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        background: #9b9691;\n        box-shadow: 0 0 0 3px #efedeb;\n        vertical-align: middle;\n      }\n\n      .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #3f6f17;\n        box-shadow: 0 0 0 3px #e2f2e5;\n      }\n\n      .opportunities-extension-account-plan-tab .opportunities-extension-account-plan-status-indicator {\n        margin-right: 8px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs {\n        display: flex;\n        min-height: 46px;\n        align-items: center;\n        padding: 0 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton {\n        display: grid;\n        height: 100%;\n        min-height: 0;\n        grid-template-rows: auto minmax(0, 1fr);\n        overflow: hidden;\n      }\n\n      .opportunities-extension-account-plans-skeleton-panel {\n        padding: 16px 20px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tab {\n        display: inline-flex;\n        align-items: center;\n        gap: 9px;\n        min-height: 38px;\n        padding: 0 12px;\n        border-bottom: 3px solid #00758f;\n      }\n\n      .opportunities-extension-account-plans-skeleton-status {\n        display: block;\n        width: 10px;\n        height: 10px;\n        flex: 0 0 auto;\n        border-radius: 50%;\n        background: #dedbd7;\n        box-shadow: 0 0 0 3px #efedeb;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details {\n        display: grid;\n        grid-template-columns: repeat(3, minmax(0, 1fr));\n        gap: 0 24px;\n        padding: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-details > div {\n        display: grid;\n        grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);\n        align-items: center;\n        gap: 10px;\n        min-height: 42px;\n        padding: 7px 0;\n        border-bottom: 1px solid #ebe8e5;\n      }\n\n      .opportunities-extension-account-plans-skeleton-bar {\n        display: block;\n        height: 12px;\n        border-radius: 3px;\n        background: #dedbd7;\n        animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;\n      }\n\n      .opportunities-extension-account-plans-skeleton-tabs .opportunities-extension-account-plans-skeleton-bar {\n        height: 14px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-label {\n        width: 74%;\n        height: 10px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend {\n        display: grid;\n        min-height: 0;\n        grid-template-rows: auto auto minmax(0, 1fr);\n        margin: 14px 0 0;\n        padding-top: 12px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-trend-header {\n        display: flex;\n        justify-content: flex-end;\n        min-height: 38px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods {\n        display: flex;\n        align-items: center;\n        gap: 16px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n        height: 12px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-period-active {\n        height: 38px !important;\n        border: 1px solid #8cc8d3;\n        background: #e7f6f8;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation {\n        display: grid;\n        grid-template-columns: 32px 124px 32px;\n        align-items: center;\n        justify-content: center;\n        gap: 8px;\n        min-height: 54px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-navigation .opportunities-extension-account-plans-skeleton-bar {\n        justify-self: center;\n      }\n\n      .opportunities-extension-account-plans-skeleton-chart {\n        display: grid;\n        min-height: 0;\n        grid-template-columns: minmax(0, 1fr) 150px;\n        align-items: center;\n        gap: 28px;\n        padding: 12px 14px 0 62px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot {\n        display: flex;\n        position: relative;\n        height: 300px;\n        min-height: 0;\n        box-sizing: border-box;\n        align-items: flex-end;\n        justify-content: space-around;\n        gap: 12px;\n        padding: 0 14px 64px;\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #ebe8e5 58px, #ebe8e5 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        position: absolute;\n        display: block;\n        content: \"\";\n        background: #dedbd7;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::before {\n        top: 0;\n        bottom: 64px;\n        left: 0;\n        width: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot::after {\n        right: 0;\n        bottom: 64px;\n        left: 0;\n        height: 1px;\n      }\n\n      .opportunities-extension-account-plans-skeleton-plot .opportunities-extension-account-plans-skeleton-bar {\n        width: min(38px, 7%);\n        flex: 0 1 38px;\n        border-radius: 2px 2px 0 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend {\n        display: grid;\n        align-content: center;\n        gap: 18px;\n        min-height: 0;\n      }\n\n      .opportunities-extension-account-plans-skeleton-legend .opportunities-extension-account-plans-skeleton-bar {\n        height: 11px;\n      }\n\n      @keyframes opportunities-extension-skeleton-pulse {\n        from { opacity: .48; }\n        to { opacity: 1; }\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        .opportunities-extension-account-plans-skeleton-bar,\n        .opportunities-extension-consumption-chart-skeleton-plot span,\n        .opportunities-extension-consumption-svg .consumption-animated-label,\n        .opportunities-extension-consumption-svg .consumption-animated-average {\n          animation: none;\n          opacity: 1;\n        }\n      }\n\n      .opportunities-extension-account-plans-empty,\n      .opportunities-extension-account-plans-error {\n        margin: 0;\n        padding: 28px 20px;\n        color: #5f5a55;\n        font-size: 14px;\n      }\n\n      .opportunities-extension-account-plans-error {\n        color: #9f2d20;\n      }\n\n      .opportunities-extension-preferences-dialog {\n        display: grid;\n        width: min(680px, 100%);\n        max-height: min(720px, calc(100vh - 48px));\n        grid-template-rows: auto minmax(0, 1fr) auto;\n        overflow: hidden;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 8px 24px rgba(0, 0, 0, .24);\n        color: #312d2a;\n      }\n\n      .opportunities-extension-preferences-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 16px;\n        padding: 18px 20px;\n        border-bottom: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-preferences-header h2 {\n        margin: 0;\n        font-size: 20px;\n        font-weight: 700;\n        line-height: 1.2;\n      }\n\n      .opportunities-extension-preferences-content {\n        min-height: 0;\n        overflow: auto;\n        padding: 20px;\n      }\n\n      .opportunities-extension-preferences-fieldset {\n        min-width: 0;\n        margin: 0;\n        padding: 0;\n        border: 0;\n      }\n\n      .opportunities-extension-preferences-fieldset legend {\n        margin-bottom: 12px;\n        padding: 0;\n        color: #312d2a;\n        font-size: 15px;\n        font-weight: 700;\n        line-height: 1.3;\n      }\n\n      .opportunities-extension-preferences-options {\n        display: grid;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 4px 20px;\n      }\n\n      .opportunities-extension-preferences-option {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        min-width: 0;\n        padding: 9px 8px;\n        border-radius: 4px;\n        color: #312d2a;\n        font-size: 14px;\n        line-height: 1.35;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-option:hover {\n        background: #f0eeeb;\n      }\n\n      .opportunities-extension-preferences-option input {\n        width: 18px;\n        height: 18px;\n        flex: 0 0 18px;\n        margin: 0;\n        accent-color: #00758f;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-preferences-cache-field {\n        display: grid;\n        width: min(280px, 100%);\n        gap: 6px;\n        margin-top: 24px;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 700;\n      }\n\n      .opportunities-extension-preferences-cache-field select {\n        width: 100%;\n        height: 40px;\n        padding: 0 36px 0 12px;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        color: #312d2a;\n        font-size: 14px;\n        font-weight: 400;\n      }\n\n      .opportunities-extension-preferences-cache-field select:focus {\n        border-color: #00758f;\n        outline: 2px solid #bde7ee;\n        outline-offset: 0;\n      }\n\n      .opportunities-extension-preferences-footer {\n        display: flex;\n        justify-content: flex-end;\n        padding: 14px 20px;\n        border-top: 1px solid #dedbd7;\n      }\n\n      .opportunities-extension-button {\n        min-width: 88px;\n        min-height: 36px;\n        padding: 7px 16px;\n        border: 1px solid transparent;\n        border-radius: 4px;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 1.2;\n        cursor: pointer;\n      }\n\n      .opportunities-extension-button-primary {\n        border-color: #00758f;\n        background: #00758f;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-button-primary:hover,\n      .opportunities-extension-button-primary:focus-visible {\n        border-color: #005e73;\n        background: #005e73;\n        outline: none;\n      }\n\n      .opportunities-extension-debug-panel {\n        position: fixed;\n        right: 24px;\n        bottom: 24px;\n        z-index: 1;\n        width: min(640px, calc(100vw - 48px));\n        max-height: min(560px, calc(100vh - 120px));\n        overflow: auto;\n        border: 1px solid #8f8a85;\n        border-radius: 4px;\n        background: #ffffff;\n        box-shadow: 0 2px 8px rgba(0, 0, 0, .16);\n        padding: 16px;\n        color: #000000;\n      }\n\n      .opportunities-extension-debug-panel[hidden] {\n        display: none !important;\n      }\n\n      .opportunities-extension-debug-panel h2 {\n        margin: 0;\n        font-size: 18px;\n        font-weight: 700;\n        line-height: 1.25;\n      }\n\n      .opportunities-extension-debug-panel p {\n        margin: 4px 0 0;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-panel-header {\n        display: flex;\n        align-items: flex-start;\n        justify-content: space-between;\n        gap: 12px;\n        margin-bottom: 12px;\n      }\n\n      .opportunities-extension-debug-visibility-button {\n        width: 34px;\n        height: 34px;\n        flex: 0 0 34px;\n        color: #312d2a;\n      }\n\n      .opportunities-extension-debug-visibility-button svg {\n        width: 20px;\n        height: 20px;\n      }\n\n      .opportunities-extension-debug-list {\n        display: grid;\n        gap: 10px;\n      }\n\n      .opportunities-extension-debug-item {\n        border: 1px solid #dedbd7;\n        border-left-width: 4px;\n        border-radius: 4px;\n        background: #faf9f8;\n      }\n\n      .opportunities-extension-debug-item[open] {\n        background: #ffffff;\n      }\n\n      .opportunities-extension-debug-item-success {\n        border-left-color: #3f6f17;\n      }\n\n      .opportunities-extension-debug-item-success .opportunities-extension-debug-status {\n        background: #e2f2e5;\n        color: #356d19;\n      }\n\n      .opportunities-extension-debug-item-failed {\n        border-left-color: #c5331f;\n      }\n\n      .opportunities-extension-debug-item-failed .opportunities-extension-debug-status {\n        background: #f9e3e1;\n        color: #a52b1c;\n      }\n\n      .opportunities-extension-debug-item-pending {\n        border-left-color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-item-pending .opportunities-extension-debug-status {\n        background: #eee8f2;\n        color: #6f5a7f;\n      }\n\n      .opportunities-extension-debug-heading {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        min-height: 42px;\n        padding: 9px 12px 9px 10px;\n        cursor: pointer;\n        list-style: none;\n      }\n\n      .opportunities-extension-debug-heading::-webkit-details-marker {\n        display: none;\n      }\n\n      .opportunities-extension-debug-heading::before {\n        content: \"⌄\";\n        width: 14px;\n        color: #5f5a55;\n        font-size: 16px;\n        line-height: 1;\n        transform: rotate(-90deg);\n        transition: transform .15s ease;\n      }\n\n      .opportunities-extension-debug-item[open] .opportunities-extension-debug-heading::before {\n        transform: rotate(0deg);\n      }\n\n      .opportunities-extension-debug-summary-meta {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        margin-left: auto;\n      }\n\n      .opportunities-extension-debug-http-status,\n      .opportunities-extension-debug-status {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 0 8px;\n        border-radius: 999px;\n        font-size: 11px;\n        font-weight: 700;\n        line-height: 1;\n        text-transform: uppercase;\n      }\n\n      .opportunities-extension-debug-http-status {\n        background: #e8f4f6;\n        color: #006d7a;\n      }\n\n      .opportunities-extension-debug-status {\n        background: #ebe8e5;\n        color: #5f5a55;\n      }\n\n      .opportunities-extension-debug-heading strong {\n        font-size: 13px;\n      }\n\n      .opportunities-extension-debug-item pre {\n        margin: 0;\n        padding: 8px 12px 12px;\n        color: #312d2a;\n        font-family: Consolas, \"Courier New\", monospace;\n        font-size: 12px;\n        line-height: 1.45;\n        white-space: pre-wrap;\n        word-break: break-word;\n      }\n\n      .opportunities-extension-debug-empty {\n        padding: 14px;\n        border: 1px dashed #b8b2ad;\n        border-radius: 4px;\n        color: #5f5a55;\n        font-size: 13px;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] {\n        background: #1f1f1f;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-shell,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-body {\n        background: #1f1f1f;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header {\n        border-bottom-color: #4e4a46;\n        background:\n          linear-gradient(90deg, #a8795d 0 11%, #dd5a47 11% 23%, #876e9b 23% 36%, #00a6be 36% 51%, #dfbd76 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,\n          #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header h1,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-value,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading span,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-empty,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dt,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel p,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-error {\n        color: #ffb4a8;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-bar {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-status {\n        background: #5b5753;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-period-active {\n        border-color: #3f7580;\n        background: #23474e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot span {\n        background: #5b5753;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator {\n        background: #8f8a85;\n        box-shadow: 0 0 0 3px #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-status-indicator[data-active=\"true\"] {\n        background: #7fb05b;\n        box-shadow: 0 0 0 3px #314527;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-form,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-surface,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-dialog,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item[open] {\n        border-color: #4e4a46;\n        background: #292827;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field select,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-select-wrap::after {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-trigger:disabled {\n        background: #292827;\n        color: #918b86;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-search::placeholder,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table-search-field input::placeholder {\n        color: #b5b0ab;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header h2,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-fieldset legend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-cache-field,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details dd,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item pre,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel h2 {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation strong {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-empty {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-select-all,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th {\n        border-bottom-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-footer,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-header,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs-navigation,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-details > div,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-tabs,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-details > div {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-chart-skeleton-plot,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-trend,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        border-color: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot {\n        background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #4e4a46 58px, #4e4a46 59px) left top / 100% 236px no-repeat;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::before,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-skeleton-plot::after {\n        background: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab {\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab:hover {\n        background: #3b3937;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plan-tab[aria-selected=\"true\"] {\n        border-bottom-color: #43c4d5;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-periods button[aria-pressed=\"true\"] {\n        border-color: #43c4d5;\n        background: #173e43;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:hover:not(:disabled),\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {\n        border-color: #43c4d5;\n        background: #3b3937;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-navigation-button:disabled,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-account-plans-tab-navigation-button:disabled {\n        border-color: #4e4a46;\n        color: #746f6a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-grid-line {\n        stroke: #4e4a46;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-axis-label,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-x-label {\n        fill: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-value-label {\n        fill: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-funded {\n        fill: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-overage {\n        fill: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-average-line {\n        stroke: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {\n        stroke: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button {\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend button[aria-pressed=\"false\"] {\n        color: #a8a39e;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-funded {\n        background: #ca8798;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-overage {\n        background: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-legend-average {\n        border-top-color: #f09a32;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-consumption-tooltip {\n        border-color: #6a6560;\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option:hover {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-preferences-option input {\n        accent-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary {\n        border-color: #00a6be;\n        background: #008aa6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-button-primary:focus-visible {\n        border-color: #43c4d5;\n        background: #006d7a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-filter-option:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table tbody tr:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sort-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button:focus {\n        background: #3b3937;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table thead,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th {\n        background: #333130;\n        color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-detail {\n        border-bottom-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table th,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-table td {\n        border-bottom-color: #3f3c39;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count {\n        border-color: #2f9bae;\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count[aria-expanded=\"true\"] {\n        border-color: #43c4d5;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"running\"] {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete\"] {\n        background: #244f2e;\n        color: #a8dfb7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"complete-with-errors\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-progress[data-state=\"error\"],\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-count-error {\n        border-color: #b13b34;\n        background: #5f2926;\n        color: #ffb4ad;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-cache-timestamp {\n        background: #3b3937;\n        color: #c9c5c1;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-table a:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-copy-button:focus-visible,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:hover,\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-action-button:focus-visible {\n        background: #1d4e55;\n        color: #91e4ed;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"SQL\"] {\n        color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"PIPELINE\"] {\n        color: #d1cbc6;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"UPSIDE\"] {\n        color: #ffbf62;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"FORECAST\"] {\n        color: #d2b7e9;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[data-stage=\"WON\"] {\n        color: #9bd46a;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"SQL\"] {\n        border-top-color: #43c4d5;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-total-dashboard-card {\n        border-top-color: #f6f4f2;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"PIPELINE\"] {\n        border-top-color: #c0b9b3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"UPSIDE\"] {\n        border-top-color: #ffb84d;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"FORECAST\"] {\n        border-top-color: #cba7e7;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-dashboard-card[data-stage=\"WON\"] {\n        border-top-color: #92cf5b;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"SQL\"] {\n        border-color: #008aa6;\n        background: #008aa6;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"PIPELINE\"] {\n        border-color: #6f6863;\n        background: #6f6863;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"UPSIDE\"] {\n        border-color: #b96e00;\n        background: #b96e00;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"FORECAST\"] {\n        border-color: #755b8b;\n        background: #755b8b;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-stage-filter-button[aria-pressed=\"true\"][data-stage=\"WON\"] {\n        border-color: #4b7f22;\n        background: #4b7f22;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"OPEN\"] {\n        color: #69c985;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"CLOSED\"] {\n        color: #c3cad3;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"LOST\"] {\n        color: #ff9d94;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[data-status=\"WON\"] {\n        color: #83bfff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"OPEN\"] {\n        border-color: #197a3d;\n        background: #197a3d;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"CLOSED\"] {\n        border-color: #4b5563;\n        background: #4b5563;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"LOST\"] {\n        border-color: #b13b34;\n        background: #b13b34;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-status-filter-button[aria-pressed=\"true\"][data-status=\"WON\"] {\n        border-color: #1f5f99;\n        background: #1f5f99;\n        color: #ffffff;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-item {\n        border-color: #4e4a46;\n        background: #252423;\n      }\n\n      .opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-icon-button {\n        color: #f6f4f2;\n      }\n\n      @media (min-width: 1201px) and (max-width: 1450px) {\n        .opportunities-extension-table th:nth-child(1) {\n          width: 16%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 18%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 12%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 7%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 8%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 10%;\n        }\n      }\n\n      @media (max-width: 1200px) {\n        .opportunities-extension-table {\n          min-width: 1180px;\n        }\n\n        .opportunities-extension-table th:nth-child(1) {\n          width: 15%;\n        }\n\n        .opportunities-extension-table th:nth-child(3) {\n          width: 17%;\n        }\n\n        .opportunities-extension-table th:nth-child(4) {\n          width: 13%;\n        }\n\n        .opportunities-extension-table th:nth-child(6) {\n          width: 6%;\n        }\n\n        .opportunities-extension-table th:nth-child(7) {\n          width: 9%;\n        }\n\n        .opportunities-extension-table th:nth-child(10) {\n          width: 11%;\n        }\n      }\n\n      @media (max-width: 700px) {\n        .opportunities-extension-header {\n          padding: 24px 20px 18px;\n        }\n\n        .opportunities-extension-header::before {\n          left: 20px;\n        }\n\n        .opportunities-extension-header h1 {\n          font-size: 22px;\n        }\n\n        .opportunities-extension-header p {\n          font-size: 14px;\n        }\n\n        .opportunities-extension-body {\n          padding: 16px 20px 24px;\n        }\n\n        .opportunities-extension-form {\n          align-items: stretch;\n          flex-wrap: wrap;\n          gap: 14px;\n          min-height: auto;\n          padding: 12px;\n        }\n\n        .opportunities-extension-field {\n          max-width: none;\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-trigger {\n          width: 100%;\n        }\n\n        .opportunities-extension-customer-filter-panel {\n          width: min(360px, calc(100vw - 64px));\n        }\n\n        .opportunities-extension-table-search-field {\n          width: 100%;\n        }\n\n        .opportunities-extension-stage-dashboard {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n        }\n\n        .opportunities-extension-stage-dashboard-value {\n          font-size: 18px;\n        }\n\n        .opportunities-extension-preferences-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-account-plans-modal {\n          padding: 12px;\n        }\n\n        .opportunities-extension-preferences-dialog {\n          max-height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plans-dialog {\n          height: calc(100vh - 24px);\n        }\n\n        .opportunities-extension-account-plan-panel {\n          padding: 12px 14px;\n        }\n\n        .opportunities-extension-account-plan-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n        }\n\n        .opportunities-extension-account-plan-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 3px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details {\n          grid-template-columns: repeat(2, minmax(0, 1fr));\n          gap: 0 14px;\n          padding: 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-details > div {\n          grid-template-columns: 1fr;\n          align-content: center;\n          gap: 5px;\n          min-height: 54px;\n          padding: 5px 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-trend {\n          margin: 14px 0 0;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          align-items: center;\n          gap: 6px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {\n          width: 100% !important;\n        }\n\n        .opportunities-extension-account-plans-skeleton-chart {\n          grid-template-columns: minmax(0, 1fr);\n          gap: 12px;\n          padding: 12px 8px 0 34px;\n        }\n\n        .opportunities-extension-account-plans-skeleton-legend {\n          display: flex;\n          min-height: 24px;\n          align-items: center;\n          justify-content: center;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-trend-header {\n          align-items: stretch;\n        }\n\n        .opportunities-extension-consumption-periods {\n          display: grid;\n          grid-template-columns: repeat(4, minmax(0, 1fr));\n          gap: 3px;\n        }\n\n        .opportunities-extension-consumption-periods button {\n          min-width: 0;\n          padding: 7px 4px;\n          font-size: 12px;\n        }\n\n        .opportunities-extension-consumption-chart {\n          min-height: 0;\n        }\n\n        .opportunities-extension-consumption-svg {\n          width: 760px;\n          height: 245px;\n        }\n\n        .opportunities-extension-consumption-visual {\n          width: 920px;\n          grid-template-columns: 760px 144px;\n          gap: 12px;\n        }\n\n        .opportunities-extension-consumption-figure {\n          overflow-x: auto;\n          overscroll-behavior-inline: contain;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton {\n          min-height: 0;\n          padding: 24px 18px 18px;\n        }\n\n        .opportunities-extension-consumption-chart-skeleton-plot {\n          min-height: 180px;\n          gap: 4px;\n          padding: 0 6px;\n        }\n\n        .opportunities-extension-preferences-options {\n          grid-template-columns: 1fr;\n        }\n\n        .opportunities-extension-stage-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-status-filter-controls {\n          gap: 6px;\n        }\n\n        .opportunities-extension-table-surface {\n          min-width: 0;\n          min-height: calc(100vh - 230px);\n        }\n\n        .opportunities-extension-debug-panel {\n          right: 12px;\n          bottom: 12px;\n          width: calc(100vw - 24px);\n          max-height: calc(100vh - 96px);\n        }\n      }\n    \n/* Full-page diagnostics, scoped to the extension and its current theme. */\n.opportunities-extension-modal .opportunities-extension-debug-panel {\n  --debug-surface: #fff;\n  --debug-code: #f5f6f7;\n  --debug-text: #312d2a;\n  --debug-muted: #5f5a55;\n  --debug-border: #dedbd7;\n  --debug-success: #22613b;\n  --debug-success-bg: #e1f1e5;\n  --debug-failed: #a12721;\n  --debug-failed-bg: #fce8e6;\n  --debug-pending: #805000;\n  --debug-pending-bg: #fff1ce;\n  --debug-info: #075e87;\n  --debug-info-bg: #e5f1fa;\n  --debug-key: #075e87;\n  --debug-string: #22613b;\n  --debug-number: #865000;\n  --debug-literal: #73429b;\n  position: fixed;\n  inset: 0;\n  z-index: 50;\n  display: grid;\n  grid-template-rows: auto auto minmax(0, 1fr);\n  width: auto;\n  height: auto;\n  max-height: none;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  margin: 0;\n  padding: 20px;\n  border: 0;\n  border-radius: 0;\n  background: var(--debug-surface);\n  color: var(--debug-text);\n  color-scheme: light;\n}\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-panel {\n  --debug-surface: #292827;\n  --debug-code: #222120;\n  --debug-text: #f6f4f2;\n  --debug-muted: #c9c5c1;\n  --debug-border: #514c47;\n  --debug-success: #a9e3bd;\n  --debug-success-bg: #214d34;\n  --debug-failed: #ffb4ab;\n  --debug-failed-bg: #582c2a;\n  --debug-pending: #ffe099;\n  --debug-pending-bg: #59441e;\n  --debug-info: #a8d9ff;\n  --debug-info-bg: #233f52;\n  --debug-key: #8ed6f0;\n  --debug-string: #a9e3bd;\n  --debug-number: #ffe099;\n  --debug-literal: #d6b7f1;\n  color: #f6f4f2;\n  color-scheme: dark;\n}\n.opportunities-extension-debug-actions { display: flex; gap: 8px; flex: 0 0 auto; }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-list {\n  overflow: auto;\n  min-height: 0;\n  min-width: 0;\n  align-content: start;\n  scrollbar-gutter: stable;\n  padding: 2px 8px 12px 2px;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item {\n  --debug-state: var(--debug-info);\n  --debug-state-bg: var(--debug-info-bg);\n  border-color: var(--debug-border);\n  border-left-color: var(--debug-state);\n  background: var(--debug-surface);\n  min-width: 0;\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-success { --debug-state: var(--debug-success); --debug-state-bg: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-failed { --debug-state: var(--debug-failed); --debug-state-bg: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item-pending { --debug-state: var(--debug-pending); --debug-state-bg: var(--debug-pending-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-status {\n  color: var(--debug-state);\n  background: var(--debug-state-bg);\n}\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status,\n.opportunities-extension-debug-method {\n  color: var(--debug-info);\n  background: var(--debug-info-bg);\n}\n.opportunities-extension-debug-method {\n  display: inline-flex;\n  align-items: center;\n  min-height: 22px;\n  padding: 0 8px;\n  border-radius: 4px;\n  font: 700 11px/1.2 Consolas, monospace;\n}\n.opportunities-extension-debug-method[data-method=\"POST\"] { color: var(--debug-literal); background: var(--debug-code); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"2\"] { color: var(--debug-success); background: var(--debug-success-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"4\"],\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"5\"] { color: var(--debug-failed); background: var(--debug-failed-bg); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-http-status[data-http-class=\"pending\"] { color: var(--debug-pending); background: var(--debug-pending-bg); }\n.opportunities-extension-debug-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 0 14px 16px; }\n.opportunities-extension-debug-block { min-width: 0; border-left: 2px solid var(--debug-info); padding-left: 10px; }\n.opportunities-extension-debug-block[data-direction=\"response\"] { border-left-color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-block h3 { margin: 0 0 8px; color: var(--debug-info); font-size: 12px; }\n.opportunities-extension-modal .opportunities-extension-debug-block[data-direction=\"response\"] h3 { color: var(--debug-success); }\n.opportunities-extension-modal .opportunities-extension-debug-panel .opportunities-extension-debug-item pre {\n  min-width: 0;\n  margin: 0;\n  padding: 12px;\n  max-height: 380px;\n  overflow: auto;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  color: var(--debug-text);\n  background: var(--debug-code);\n  line-height: 1.6;\n  tab-size: 2;\n}\n.opportunities-extension-debug-json-key { color: var(--debug-key); }\n.opportunities-extension-debug-json-string { color: var(--debug-string); }\n.opportunities-extension-debug-json-number { color: var(--debug-number); }\n.opportunities-extension-debug-json-literal { color: var(--debug-literal); }\n@media (max-width: 760px) {\n  .opportunities-extension-modal .opportunities-extension-debug-panel { padding: 12px; }\n  .opportunities-extension-debug-details { grid-template-columns: minmax(0, 1fr); }\n}\n.opportunities-extension-debug-tabs {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  margin-bottom: 12px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid #dedbd7;\n}\n\n.opportunities-extension-debug-tabs button {\n  max-width: 100%;\n  min-height: 32px;\n  padding: 6px 8px;\n  border: 0;\n  border-bottom: 2px solid transparent;\n  border-radius: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.35;\n  overflow-wrap: anywhere;\n  cursor: pointer;\n}\n\n.opportunities-extension-debug-tabs button:hover {\n  background: #f5f4f2;\n}\n\n.opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  border-bottom-color: #00758f;\n  background: #e8f4f6;\n  color: #006b84;\n  font-weight: 700;\n}\n\n.opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline: 2px solid #00758f;\n  outline-offset: -2px;\n}\n\n.opportunities-extension-debug-time {\n  font-size: 11px;\n  font-variant-numeric: tabular-nums;\n  white-space: nowrap;\n}\n\n.opportunities-extension-debug-heading {\n  flex-wrap: wrap;\n}\n\n.opportunities-extension-debug-heading strong {\n  flex: 1 1 180px;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-debug-summary-meta {\n  flex-wrap: wrap;\n  justify-content: flex-end;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button {\n  color: #f6f4f2;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-heading::before {\n  color: #c9c5c1;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs {\n  border-bottom-color: #514c47;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:hover {\n  background: #383633;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button[aria-selected=\"true\"] {\n  background: #173f48;\n  border-bottom-color: #8cc8d3;\n  color: #bde7ee;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-tabs button:focus-visible,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-debug-list[role=\"tabpanel\"]:focus-visible {\n  outline-color: #8cc8d3;\n}\n\n/* Compact filters use available CSS width, including Windows display scaling. */\n.opportunities-extension-products-progress,\n.opportunities-extension-auth-badge { opacity: 1; transition: opacity 300ms ease; }\n.opportunities-extension-products-progress[data-fading=\"true\"],\n.opportunities-extension-auth-badge[data-fading=\"true\"] { opacity: 0; }\n.opportunities-extension-auth-badge[hidden] { display: none; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-products-progress,\n  .opportunities-extension-auth-badge { transition: none; }\n}\n.opportunities-extension-crm-sr-badge {\n  flex: 0 0 auto;\n  padding: 0 6px;\n  border: 1px solid #408254;\n  border-radius: 8px;\n  font-size: 10px;\n  line-height: 18px;\n  font-weight: 600;\n  white-space: nowrap;\n  color: #185b30;\n  background: #e1f1e5;\n}\n.opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #9f201b; background: #fde8e7; border-color: #c74640; }\n.opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #785000; background: #fff0cd; border-color: #987021; }\n.opportunities-extension-wl-actions-badge[data-state=\"loading\"] { color: #5f5a55; background: #eceae8; border-color: #8f8a85; }\n.opportunities-extension-crm-sr-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge { color: #b8e4c6; background: #214d34; border-color: #6eac82; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"missing\"] { color: #ffd9d5; background: #542824; border-color: #ef938b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-crm-sr-badge[data-state=\"error\"] { color: #ffe0a3; background: #584219; border-color: #c99b4b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-wl-actions-badge[data-state=\"loading\"] { color: #dedbd7; background: #484541; border-color: #8f8a85; }\n\n.opportunities-extension-form {\n  display: grid;\n  grid-template-columns: max-content minmax(110px, 1fr) minmax(110px, 1fr) minmax(145px, 180px) max-content max-content;\n  align-items: end;\n  gap: 12px;\n  min-height: 0;\n  padding: 12px;\n}\n\n.opportunities-extension-form > * {\n  min-width: 0;\n  width: 100%;\n  max-width: none;\n  grid-template-rows: auto 32px;\n  gap: 4px;\n  font-size: 12px;\n}\n\n.opportunities-extension-form > * > span:first-child {\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap {\n  width: 100%;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger,\n.opportunities-extension-form .opportunities-extension-table-search-field input {\n  box-sizing: border-box;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  min-height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n\n.opportunities-extension-form .opportunities-extension-field select,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger {\n  padding-right: 26px;\n}\n\n.opportunities-extension-form .opportunities-extension-select-wrap::after,\n.opportunities-extension-form .opportunities-extension-customer-filter-trigger::after {\n  right: 10px;\n  border-left-width: 4px;\n  border-right-width: 4px;\n  border-top-width: 5px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-controls,\n.opportunities-extension-form .opportunities-extension-status-filter-controls {\n  flex-wrap: nowrap;\n  gap: 4px;\n}\n\n.opportunities-extension-form .opportunities-extension-stage-filter-button,\n.opportunities-extension-form .opportunities-extension-status-filter-button {\n  min-height: 28px;\n  padding: 4px 7px;\n  font-size: 11px;\n  line-height: 18px;\n  white-space: nowrap;\n}\n\n/* Native select intrinsic sizing includes its longest option, not just the selection. */\n@media (min-width: 1151px) {\n  .opportunities-extension-form > .opportunities-extension-field,\n  .opportunities-extension-form .opportunities-extension-select-wrap,\n  .opportunities-extension-form .opportunities-extension-field select {\n    width: max-content;\n    max-width: none;\n  }\n}\n\n@media (max-width: 1150px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-column: span 2;\n  }\n}\n\n@media (max-width: 700px) {\n  .opportunities-extension-form {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .opportunities-extension-form .opportunities-extension-stage-filter-controls,\n  .opportunities-extension-form .opportunities-extension-status-filter-controls {\n    flex-wrap: wrap;\n  }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter {\n    grid-template-rows: auto auto;\n  }\n}\n\n@media (max-width: 420px) {\n  .opportunities-extension-form { grid-template-columns: minmax(0, 1fr); }\n  .opportunities-extension-form > .opportunities-extension-status-filter,\n  .opportunities-extension-form > .opportunities-extension-stage-filter { grid-column: auto; }\n}\n\n/* Keep layout rules on the outer table, never on expanded product tables. */\n.opportunities-extension-table[data-opportunities-layout=\"inline-actions\"] {\n  width: 100%;\n  min-width: 1120px;\n  table-layout: fixed;\n}\n\n/* Fixed table layout shares leftover width only between the two auto columns. */\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] { width: auto; }\n.opportunities-extension-table > thead > tr > th[data-column=\"owner\"] { width: 132px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"optyNumber\"] { width: 106px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"revenue\"] { width: 124px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"closeDate\"] { width: 100px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"status\"] { width: 114px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"winProbability\"] { width: 110px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"stage\"] { width: 94px; }\n.opportunities-extension-table > thead > tr > th[data-column=\"lastUpdateDate\"] { width: 136px; }\n\n.opportunities-extension-table > tbody > tr > td[data-column] {\n  padding: 10px 8px;\n  overflow: visible;\n  text-overflow: clip;\n  white-space: normal;\n  font-variant-numeric: tabular-nums;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"name\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] {\n  position: relative;\n  padding-right: 16px;\n  padding-left: 12px;\n  padding-bottom: 38px;\n  vertical-align: top;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"owner\"] {\n  padding-right: 16px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"closeDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"lastUpdateDate\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"status\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"stage\"],\n.opportunities-extension-table > tbody > tr > td[data-column=\"winProbability\"] {\n  white-space: nowrap;\n}\n\n.opportunities-extension-cell-content {\n  display: block;\n  min-width: 0;\n  min-height: 2.7em;\n  line-height: 1.35;\n}\n\n.opportunities-extension-cell-content > :first-child {\n  display: block;\n  min-width: 0;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-cell-actions {\n  position: absolute;\n  left: 12px;\n  right: 16px;\n  bottom: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: 6px;\n  height: 24px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button {\n  flex: 0 0 24px;\n  width: 24px;\n  height: 24px;\n  padding: 2px;\n}\n\n.opportunities-extension-table > tbody > tr > td[data-column=\"customer\"] .opportunities-extension-cell-actions {\n  min-width: 84px;\n}\n\n.opportunities-extension-cell-actions .opportunities-extension-action-button svg {\n  width: 18px;\n  height: 18px;\n}\n\n.opportunities-extension-cell-actions button:focus-visible {\n  outline: 2px solid currentColor;\n  outline-offset: 2px;\n}\n\n.opportunities-extension-products-ramp {\n  display: inline-block;\n  min-width: 0;\n  max-width: 100%;\n  padding: 0 6px;\n  border: 1px solid #bba5cf;\n  border-radius: 8px;\n  background: #f0e8f7;\n  color: #63358a;\n  font-size: 10px;\n  font-weight: 600;\n  line-height: 16px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp {\n  background: #43334f;\n  color: #ead5fc;\n  border-color: #9372ac;\n}\n\n.opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #fde8e7;\n  color: #9f201b;\n  border-color: #c74640;\n}\n\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-products-ramp[data-missing=\"true\"] {\n  background: #542824;\n  color: #ffd9d5;\n  border-color: #ef938b;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  gap: 6px;\n  padding: 10px 8px;\n  align-items: center;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column=\"name\"] .opportunities-extension-sort-button,\n.opportunities-extension-table > thead > tr > th[data-column=\"customer\"] .opportunities-extension-sort-button {\n  padding-left: 12px;\n  padding-right: 16px;\n}\n\n.opportunities-extension-sort-label {\n  min-width: 0;\n  white-space: normal;\n  overflow-wrap: anywhere;\n}\n\n.opportunities-extension-table > thead > tr > th[data-column] .opportunities-extension-sort-button::after {\n  position: static;\n  justify-self: end;\n}\n.opportunities-extension-crm-sr-badge[type=\"button\"] { cursor: pointer; font-family: inherit; }\n.opportunities-extension-sr-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; overflow: auto;\n  padding: 12px; border: 1px solid #b9b5b0; border-radius: 6px;\n  background: #fff; color: #302e2b; box-shadow: 0 6px 24px #0003;\n  font: 12px/1.5 Arial, sans-serif; text-align: left; overflow-wrap: anywhere;\n}\n.opportunities-extension-sr-popover section { padding: 8px 0; }\n.opportunities-extension-sr-popover section + section { border-top: 1px solid #dedbd7; }\n.opportunities-extension-sr-number { display: flex; align-items: center; gap: 8px; padding-right: 30px; font-weight: 600; }\n.opportunities-extension-sr-popover a { color: #00677d; text-decoration: underline; }\n.opportunities-extension-sr-details { white-space: pre-wrap; margin-top: 6px; }\n.opportunities-extension-sr-dismiss {\n  position: absolute; top: 6px; right: 6px; width: 28px; height: 28px;\n  display: grid; place-items: center; padding: 4px; border: 0;\n  background: transparent; color: inherit; cursor: pointer;\n}\n.opportunities-extension-sr-dismiss svg { width: 16px; height: 16px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover { background: #292827; color: #f1efec; border-color: #77716b; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover section + section { border-color: #5f5953; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-sr-popover a { color: #7ddced; }\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog {\n  width: min(1700px, 100%);\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header {\n  padding: 10px 12px;\n  gap: 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header h2 {\n  font-size: 16px;\n  line-height: 22px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-account-plans-header p {\n  font-size: 12px;\n  line-height: 16px;\n  margin-top: 3px;\n  overflow-wrap: anywhere;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-icon-button {\n  width: 28px;\n  height: 28px;\n  min-width: 28px;\n  min-height: 28px;\n  padding: 4px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-toolbar {\n  padding: 8px 12px;\n}\n.opportunities-extension-install-base-dialog .opportunities-extension-customer-table-search {\n  width: min(320px, 100%);\n  height: 32px;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 20px;\n}\n.opportunities-extension-install-base-content {\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  scrollbar-gutter: stable;\n}\n.opportunities-extension-install-base-message { margin: 10px 12px; font-size: 12px; line-height: 16px; }\n.opportunities-extension-install-base-table {\n  width: 100%; min-width: 1120px; table-layout: fixed; border-collapse: collapse; font-size: 11px;\n}\n.opportunities-extension-install-base-table col { width: 7%; }\n.opportunities-extension-install-base-table .install-base-col-partyName { width: 12%; }\n.opportunities-extension-install-base-table .install-base-col-productGroupName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-productName { width: 13%; }\n.opportunities-extension-install-base-table .install-base-col-quantity { width: 5%; }\n.opportunities-extension-install-base-table .install-base-col-quantityType { width: 8%; }\n.opportunities-extension-install-base-table th,\n.opportunities-extension-install-base-table td {\n  padding: 8px 6px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-install-base-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-install-base-table td[data-format=\"amount\"],\n.opportunities-extension-install-base-table td[data-format=\"quantity\"] { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-install-base-table td[data-format=\"date\"] { white-space: nowrap; }\n.opportunities-extension-install-base-status {\n  display: inline-block; padding: 2px 5px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\n.opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #855300; background: #fff0d6; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"ACTIVE\"] { color: #b8e4c6; background: #214d34; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-install-base-status[data-status=\"UNSUPPORTED\"] { color: #ffdfa2; background: #614418; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-install-base-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog { width: min(1700px, 100%); }\n.opportunities-extension-service-requests-content { min-width: 0; min-height: 0; overflow: auto; scrollbar-gutter: stable; }\n.opportunities-extension-service-requests-message { margin: 16px; font-size: 13px; }\n.opportunities-extension-service-requests-table {\n  width: 100%; min-width: 1200px; table-layout: fixed; border-collapse: collapse; font-size: 12px;\n}\n.opportunities-extension-service-requests-table col { width: 7%; }\n.opportunities-extension-service-requests-table .service-requests-col-name { width: 17%; }\n.opportunities-extension-service-requests-table .service-requests-col-id { width: 10%; }\n.opportunities-extension-service-requests-table .service-requests-col-severity { width: 5%; }\n.opportunities-extension-service-requests-table .service-requests-col-subStatus { width: 14%; }\n.opportunities-extension-service-requests-table .service-requests-col-productName { width: 12%; }\n.opportunities-extension-service-requests-table th,\n.opportunities-extension-service-requests-table td {\n  padding: 12px 8px; text-align: left; vertical-align: middle; overflow-wrap: anywhere;\n  border-bottom: 1px solid #e8e5e1; line-height: 1.4;\n}\n.opportunities-extension-service-requests-table th { position: sticky; top: 0; z-index: 1; background: #faf9f8; }\n.opportunities-extension-service-requests-table td[data-field=\"created\"],\n.opportunities-extension-service-requests-table td[data-field=\"lastUpdated\"],\n.opportunities-extension-service-requests-table td[data-field=\"id\"] { white-space: nowrap; font-variant-numeric: tabular-nums; }\n.opportunities-extension-service-request-status {\n  display: inline-block; padding: 3px 6px; border-radius: 12px; font-size: 10px; font-weight: 600;\n  color: #5f5a55; background: #eceae8;\n}\n.opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #17693a; background: #e1f1e5; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-content,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { color: #f6f4f2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-message[role=\"alert\"] { color: #ffb4ab; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th { background: #353331; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table th,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-requests-table td { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-service-request-status[data-status=\"OPEN\"] { color: #b8e4c6; background: #214d34; }\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-service-requests-table .opportunities-extension-account-plans-skeleton-bar { animation: none; }\n}\n\n/* Scope sizing to Cloud Consumption, not other dialogs sharing its components. */\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header { padding: 10px 12px; gap: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header h2 { font-size: 16px; line-height: 22px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-header p { font-size: 12px; line-height: 16px; margin-top: 3px; overflow-wrap: anywhere; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-icon-button { width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 4px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-tabs { padding: 4px 12px 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-tab { min-height: 30px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { padding: 8px 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { gap: 0 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details > div { grid-template-columns: minmax(85px, 35%) minmax(0, 1fr); min-height: 32px; padding: 4px 0; gap: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dt { font-size: 11px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details dd { font-size: 12px; line-height: 16px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-trend { margin-top: 8px; padding-top: 6px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-periods button { min-height: 28px; padding: 4px 8px; font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation { grid-template-columns: 28px minmax(120px, auto) 28px; min-height: 30px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation strong { font-size: 12px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-navigation-button { width: 28px; height: 28px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-svg { height: 100%; max-height: 100%; min-width: 0; }\n[data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend button { font-size: 11px; padding: 4px; gap: 5px; }\n\n/* Small viewports must scroll rather than clip details or collapse the chart. */\n@media (max-height: 560px), (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plans-panels { overflow: auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-panel { height: auto; min-height: 100%; grid-template-rows: auto minmax(280px, 1fr); }\n}\n@media (max-width: 700px) {\n  [data-consumption-layout=\"compact\"] .opportunities-extension-account-plan-details { grid-template-columns: minmax(0, 1fr); }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-visual { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }\n  [data-consumption-layout=\"compact\"] .opportunities-extension-consumption-legend { display: flex; flex-wrap: wrap; }\n}\n\n.opportunities-extension-plan-detail-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }\n.opportunities-extension-consumption-trend-header { align-items: center; justify-content: space-between; gap: 12px; }\n.opportunities-extension-consumption-trend-header > .opportunities-extension-plan-detail-badges { min-width: 0; }\n.opportunities-extension-plan-detail-skeleton { width: 64px; height: 20px; }\n.opportunities-extension-projection-badge {\n  display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent;\n  padding: 3px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; line-height: 1.3;\n  color: #5f5a55; background: #eceae8; white-space: nowrap;\n}\nbutton.opportunities-extension-projection-badge { cursor: pointer; }\n.opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #a12424; background: #fbe5e5; }\n.opportunities-extension-projection-badge[data-status=\"overage\"] { color: #185a9d; background: #e0edfc; }\n.opportunities-extension-projection-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }\n.opportunities-extension-projection-popover {\n  position: fixed; z-index: 8; box-sizing: border-box; padding: 14px; overflow: auto; overscroll-behavior: contain;\n  border: 1px solid #b9b4ae; border-radius: 4px; background: #ffffff; color: #312d2a;\n  box-shadow: 0 4px 16px #0003; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere;\n}\n.opportunities-extension-projection-popover[hidden] { display: none; }\n.opportunities-extension-projection-popover .opportunities-extension-projection-dismiss {\n  display: grid; place-items: center; width: 24px; height: 24px; margin-left: auto; margin-bottom: 8px; padding: 4px; border: 1px solid #b9b4ae;\n  border-radius: 4px; background: transparent; color: inherit; cursor: pointer; font-size: 12px;\n}\n.opportunities-extension-projection-dismiss svg { width: 14px; height: 14px; }\n.opportunities-extension-projection-line h3 { margin: 0 0 8px; font-size: 12px; }\n.opportunities-extension-projection-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 0; }\n.opportunities-extension-projection-fields > div { min-width: 0; }\n.opportunities-extension-projection-fields dt { font-weight: 600; color: #5f5a55; font-size: 11px; }\n.opportunities-extension-projection-fields dd { margin: 2px 0 0; font-variant-numeric: tabular-nums; }\n.opportunities-extension-projection-fields a { color: #006d7a; text-decoration: underline; }\n.opportunities-extension-projection-children { margin-top: 14px; padding-left: 12px; border-left: 2px solid #dedbd7; }\n.opportunities-extension-projection-children > section + section { margin-top: 16px; }\n.opportunities-extension-plan-detail-error { color: #a12424; font-size: 12px; }\n.opportunities-extension-projection-empty { color: #5f5a55; font-size: 12px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-popover { color: #f1efec; background: #302e2b; border-color: #716b64; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge { color: #dedbd7; background: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"forfeit\"] { color: #ffb9b9; background: #682e32; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-badge[data-status=\"overage\"] { color: #c5dfff; background: #224b76; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields dt,\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-empty { color: #cec9c2; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-projection-fields a { color: #76dbea; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-plan-detail-error { color: #ffb9b9; }\n@media (max-width: 480px) { .opportunities-extension-projection-fields { grid-template-columns: minmax(0, 1fr); } }\n@media (max-width: 480px) {\n  .opportunities-extension-consumption-trend-header > .opportunities-extension-consumption-periods { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n}\n@media (prefers-reduced-motion: reduce) { .opportunities-extension-plan-detail-skeleton { animation: none; } }\n\n.opportunities-extension-account-plan-details > .opportunities-extension-contract-row {\n  align-items: center;\n}\n.opportunities-extension-contract-row > dt,\n.opportunities-extension-contract-row > dd,\n.opportunities-extension-contract-ratecard > span {\n  line-height: 20px;\n}\n.opportunities-extension-contract-ratecard {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: 6px 10px;\n}\n.opportunities-extension-ratecard-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  align-self: center;\n  box-sizing: border-box;\n  height: 28px;\n  margin: 0;\n  flex: 0 0 auto;\n  padding: 0 8px;\n  border: 1px solid #8aaeb9;\n  border-radius: 4px;\n  background: #fff;\n  color: #006b80;\n  font: inherit;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 20px;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-button:hover { background: #e8f4f6; }\n.opportunities-extension-ratecard-overlay {\n  position: absolute;\n  inset: 0;\n  z-index: 8;\n  display: flex;\n  justify-content: flex-end;\n  overflow: hidden;\n  overflow: clip;\n  background: rgba(0, 0, 0, 0);\n  transition: background-color 320ms ease;\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] { background: rgba(0, 0, 0, .32); }\n.opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #fff;\n  --ratecard-heading: #faf9f8;\n  --ratecard-text: #312d2a;\n  --ratecard-muted: #615a55;\n  --ratecard-border: #dedbd8;\n  --ratecard-accent: #00758f;\n  --ratecard-skeleton: #eae7e4;\n  display: grid;\n  grid-template-rows: auto auto auto minmax(0, 1fr);\n  width: min(1520px, calc(100% - 48px));\n  height: 100%;\n  min-width: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  box-shadow: -6px 0 24px rgba(0, 0, 0, .2);\n  transform: translateX(100%);\n  transition: transform 320ms cubic-bezier(.22, .61, .36, 1);\n}\n.opportunities-extension-ratecard-overlay[data-open=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(0); }\n.opportunities-extension-ratecard-header > div { min-width: 0; overflow-wrap: anywhere; }\n.opportunities-extension-ratecard-plan-details { padding: 12px 20px 0; }\n.opportunities-extension-ratecard-toolbar { display: flex; align-items: center; gap: 16px; padding: 12px 20px; }\n.opportunities-extension-ratecard-search {\n  width: min(360px, 100%);\n  min-width: 0;\n  box-sizing: border-box;\n  padding: 9px 12px;\n  border: 1px solid var(--ratecard-muted);\n  border-radius: 4px;\n  background: var(--ratecard-bg);\n  color: var(--ratecard-text);\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-ratecard-search::placeholder { color: var(--ratecard-muted); opacity: 1; }\n.opportunities-extension-ratecard-count { color: var(--ratecard-muted); font-size: 12px; white-space: nowrap; }\n.opportunities-extension-ratecard-viewport { overflow: auto; min-height: 0; min-width: 0; scrollbar-gutter: stable; }\n.opportunities-extension-ratecard-table { width: 100%; min-width: 1100px; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 12px; }\n.opportunities-extension-ratecard-table th, .opportunities-extension-ratecard-table td {\n  padding: 11px 10px;\n  border-bottom: 1px solid var(--ratecard-border);\n  vertical-align: top;\n  overflow-wrap: anywhere;\n  text-align: left;\n}\n.opportunities-extension-ratecard-table th { position: sticky; top: 0; z-index: 1; background: var(--ratecard-heading); }\n.opportunities-extension-ratecard-sort {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) 12px;\n  align-items: center;\n  gap: 5px;\n  width: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-weight: 600;\n  text-align: left;\n  cursor: pointer;\n}\n.opportunities-extension-ratecard-sort-icon { color: var(--ratecard-accent); text-align: center; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-numeric { text-align: right; font-variant-numeric: tabular-nums; }\n.opportunities-extension-ratecard-table .opportunities-extension-ratecard-notice { padding: 28px 20px; text-align: center; }\n.opportunities-extension-ratecard-notice [role=\"alert\"] { color: #b3261e; }\n.opportunities-extension-ratecard-skeleton { display: block; width: 85%; height: 14px; border-radius: 3px; background: var(--ratecard-skeleton); animation: opportunities-ratecard-pulse 1.1s ease-in-out infinite alternate; }\n.opportunities-extension-ratecard-drawer :focus-visible, .opportunities-extension-ratecard-button:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] { pointer-events: none; background: rgba(0, 0, 0, 0); transition-duration: 180ms; }\n.opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { transform: translateX(100%); transition-duration: 180ms; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer {\n  --ratecard-bg: #292725;\n  --ratecard-heading: #35322f;\n  --ratecard-text: #f5f3f1;\n  --ratecard-muted: #c2bcb6;\n  --ratecard-border: #514c47;\n  --ratecard-accent: #59d1e5;\n  --ratecard-skeleton: #514c47;\n}\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button { color: #59d1e5; border-color: #6298a2; background: #292725; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-button:hover { background: #313f40; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-notice [role=\"alert\"] { color: #ffb4ab; }\n[data-theme=\"dark\"] .opportunities-extension-ratecard-drawer :focus-visible, [data-theme=\"dark\"] .opportunities-extension-ratecard-button:focus-visible { outline-color: #59d1e5; }\n@keyframes opportunities-ratecard-pulse { from { opacity: .45; } to { opacity: 1; } }\n@media (max-width: 720px) {\n  .opportunities-extension-ratecard-drawer { width: 100%; }\n  .opportunities-extension-ratecard-toolbar { flex-wrap: wrap; gap: 8px; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .opportunities-extension-ratecard-overlay, .opportunities-extension-ratecard-drawer, .opportunities-extension-ratecard-skeleton,\n  .opportunities-extension-ratecard-overlay[data-closing=\"true\"], .opportunities-extension-ratecard-overlay[data-closing=\"true\"] .opportunities-extension-ratecard-drawer { animation: none; transition: none; }\n}\n\n.opportunities-extension-account-plans-dialog.opportunities-extension-install-base-dialog,\n.opportunities-extension-account-plans-dialog.opportunities-extension-service-requests-dialog {\n  grid-template-rows: auto auto minmax(0, 1fr);\n}\n.opportunities-extension-customer-table-toolbar { padding: 12px 16px; border-bottom: 1px solid #dedbd7; }\n.opportunities-extension-customer-table-search {\n  box-sizing: border-box;\n  width: min(420px, 100%);\n  min-width: 0;\n  height: 38px;\n  padding: 8px 12px;\n  border: 1px solid #8f8a85;\n  border-radius: 4px;\n  background: #fff;\n  color: #312d2a;\n  font: inherit;\n  font-size: 13px;\n}\n.opportunities-extension-customer-table-search::placeholder { color: #5f5a55; opacity: 1; }\n.opportunities-extension-customer-table-search:focus-visible { outline: 2px solid #00758f; outline-offset: 2px; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-toolbar { border-color: #484541; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search { background: #353331; color: #f6f4f2; border-color: #8f8a85; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search::placeholder { color: #c9c5c1; }\n.opportunities-extension-modal[data-theme=\"dark\"] .opportunities-extension-customer-table-search:focus-visible { outline-color: #59d1e5; }\n";
 // Source: src/shared/messages.js
 /** Stable wire names. All payloads remain plain, serializable objects. */
 function createMessageTypes() {
@@ -14,6 +14,7 @@ function createMessageTypes() {
     requestAccountPlans: "opportunitiesExtension.requestAccountPlans",
     requestInstallBase: "opportunitiesExtension.requestInstallBase",
     requestCustomerServiceRequest: "opportunitiesExtension.requestCustomerServiceRequest",
+    requestWlActions: "opportunitiesExtension.requestWlActions",
     requestConsumptionTrend: "opportunitiesExtension.requestConsumptionTrend",
     requestConsumptionPlanDetail: "opportunitiesExtension.requestConsumptionPlanDetail",
     requestRatecardByPlan: "opportunitiesExtension.requestRatecardByPlan"
@@ -170,6 +171,7 @@ function createAuthSessionState({ AUTH_STATUS } = {}) {
     tokenRelayRequest: null,
     consumerTokenServiceRequest: null,
     accessToken: "",
+    principal: "",
     authStatus: AUTH_STATUS.idle
   };
 }
@@ -465,6 +467,8 @@ function createContentModal({
   requestOpportunitiesForPeriod,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
+  reopenWorkloadActions,
   requestTokenRelayOnce,
   resetCustomerAndOwnerFiltersForPeriod,
   resetOpportunitiesTable,
@@ -475,7 +479,15 @@ function createContentModal({
   toggleOwnerFilterPanel,
   environment
 }) {
-  const { document, window } = environment;
+  const { document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let authCompletion = null;
+  function resetAuthCompletion() {
+    if (!authCompletion) return;
+    clearTimeout(authCompletion.waitTimer);
+    clearTimeout(authCompletion.hideTimer);
+    authCompletion.badge.setAttribute("data-fading", "false");
+    authCompletion = null;
+  }
   function openOpportunitiesModal() {
     ensureExtensionStyles();
     debugState.debugSecretsVisible = false;
@@ -484,6 +496,7 @@ function createContentModal({
 
     if (existingModal) {
       existingModal.hidden = false;
+      reopenWorkloadActions();
       existingModal.querySelector("select").focus();
       document.documentElement.classList.add("opportunities-extension-scroll-lock");
       ensureEscapeKeyHandler();
@@ -497,6 +510,7 @@ function createContentModal({
     authSessionState.tokenRelayRequest = null;
     authSessionState.consumerTokenServiceRequest = null;
     authSessionState.accessToken = "";
+    authSessionState.principal = "";
     opportunitiesQueryState.periodRequestVersion = 0;
     authSessionState.authStatus = AUTH_STATUS.idle;
     resetOpportunitiesTable();
@@ -834,6 +848,24 @@ function createContentModal({
       ? status
       : AUTH_STATUS.pending;
 
+    if (authCompletion && (authCompletion.badge !== badge || badgeStatus !== AUTH_STATUS.authenticated)) resetAuthCompletion();
+    badge.hidden = Boolean(authCompletion?.hidden);
+    if (badgeStatus === AUTH_STATUS.authenticated && !authCompletion) {
+      const current = { badge, hidden: false, waitTimer: null, hideTimer: null };
+      authCompletion = current;
+      badge.setAttribute("data-fading", "false");
+      current.waitTimer = setTimeout(() => {
+        if (authCompletion !== current) return;
+        badge.setAttribute("data-fading", "true");
+        const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+        current.hideTimer = setTimeout(() => {
+          if (authCompletion !== current) return;
+          current.hidden = true;
+          badge.hidden = true;
+        }, reducedMotion ? 0 : 300);
+      }, 5000);
+    }
+
     badge.setAttribute("data-auth-status", badgeStatus);
     badge.className = `opportunities-extension-auth-badge opportunities-extension-auth-badge-${badgeStatus}`;
     badge.textContent = badgeStatus === AUTH_STATUS.authenticated
@@ -844,6 +876,8 @@ function createContentModal({
   }
 
   function closeOpportunitiesModal() {
+    resetAuthCompletion();
+    resetWorkloadActions(false);
     resetCrmServiceRequests();
     const modal = document.getElementById(MODAL_ID);
 
@@ -1115,6 +1149,7 @@ function createAuthContentSession({
         })
         .catch((error) => {
           authSessionState.accessToken = "";
+          authSessionState.principal = "";
           authSessionState.authStatus = AUTH_STATUS.unauthenticated;
           throw error;
         })
@@ -1189,6 +1224,7 @@ function createAuthSalesCommon({
 // Source: src/auth/token-relay.js
 function createAuthTokenRelay({
   TOKEN_RELAY_URL,
+  authSessionState,
   createDebugBody,
   getXsrfToken,
   logRequestFailure,
@@ -1202,6 +1238,7 @@ function createAuthTokenRelay({
 }) {
   const { fetch } = environment;
   async function requestTokenRelay({ name = "requestTokenRelay", url = TOKEN_RELAY_URL, includeExpiry = false } = {}) {
+    if (url === TOKEN_RELAY_URL) authSessionState.principal = "";
     let refreshResult = null;
     let refreshAttempted = false;
 
@@ -1284,6 +1321,9 @@ function createAuthTokenRelay({
           access_token: maskToken(responseData.access_token)
         }, null, 2)));
 
+        if (url === TOKEN_RELAY_URL) {
+          authSessionState.principal = typeof responseData.principal === "string" ? responseData.principal.trim() : "";
+        }
         if (includeExpiry) {
           const lifetime = Number(responseData.expires_in);
           return {
@@ -1525,6 +1565,7 @@ function createOpportunitiesController({
   requestOpportunitiesPage,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
   requestOpptyProductsInBackground,
   requestTokenRelayOnce,
   setOpportunitiesTableState
@@ -1616,6 +1657,7 @@ function createOpportunitiesController({
   }
 
   function resetOpportunitiesTable() {
+    resetWorkloadActions();
     resetCrmServiceRequests();
     opportunitiesFilterState.selectedStages = new Set(STAGE_OPTIONS);
     opportunitiesFilterState.selectedStatuses = new Set(STATUS_OPTIONS);
@@ -1891,12 +1933,12 @@ function createFusionCrmServiceRequests({ isCurrentPeriodRequest,
 }
 
 // Source: src/features/opportunities/crm-service-requests.js
-function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, environment }) {
+function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, bindPopover, closePopover, environment }) {
   let status = "idle";
   let byOpportunity = new Map();
   let pending = null;
   let generation = 0;
-  function reset() { generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
+  function reset() { closePopover(); generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
   function load(token, version) {
     if (!isCurrentPeriodRequest(version)) return;
     if (!pending) pending = run(token, version, generation);
@@ -1925,28 +1967,250 @@ function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurre
   function createBadge(optyNumber) {
     if (!optyNumber || status === "idle" || status === "loading") return null;
     const items = byOpportunity.get(String(optyNumber)) || [];
-    const badge = environment.document.createElement("span");
+    const badge = environment.document.createElement(items.length && status === "ready" ? "button" : "span");
     badge.className = "opportunities-extension-crm-sr-badge";
     badge.setAttribute("data-state", status === "error" ? "error" : items.length ? "matched" : "missing");
     badge.textContent = status === "error" ? "SR ?" : items.length ? "\u2705 SR" : "\u26d4 SR";
     const display = value => value === null || value === undefined || value === "" ? "N/D" : String(value);
-    badge.title = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
-      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
-      : items.map(item => [
-        `SR Number: ${display(item.SrNumber)}`, `Title: ${display(item.Title)}`,
+    const descriptions = items.map(item => [
+        `Title: ${display(item.Title)}`,
         `Opportunity: ${display(item.OpportunityName_Id_c?.OptyNumber)}`,
         `Reported Hours: ${display(item.ReportedHours_c)}`,
         `Owner: ${[item.Owner?.PersonFirstName, item.Owner?.PersonLastName].filter(Boolean).join(" ") || "N/D"}`,
         `Email: ${display(item.Owner?.PrimaryEmail?.EmailAddress)}`,
         `Do Not Call: ${display(item.DoNotCallFlag)}`, `Do Not Email: ${display(item.DoNotEmailFlag)}`
-      ].join("\n")).join("\n\n");
-    badge.setAttribute("aria-label", badge.title);
+      ].join("\n"));
+    const description = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
+      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
+      : items.map((item, index) => `SR Number: ${display(item.SrNumber)}\n${descriptions[index]}`).join("\n\n");
+    badge.setAttribute("aria-label", description);
+    if (items.length && status === "ready") bindPopover(badge, items, descriptions);
+    else badge.title = description;
     badge.tabIndex = 0;
     return badge;
   }
   return { reset, load, createBadge };
 }
 
+// Source: src/features/opportunities/crm-sr-popover.js
+function createCrmSrPopover({ MODAL_ID, createCopyButton, createCloseIcon, environment }) {
+  const { document, window, setTimeout, clearTimeout } = environment;
+  let active = null;
+  let sequence = 0;
+  function close(restoreFocus = false) {
+    if (!active) return;
+    const entry = active;
+    active = null;
+    clearTimeout(entry.timer);
+    entry.panel.remove();
+    entry.button.setAttribute("aria-expanded", "false");
+    document.removeEventListener("pointerdown", entry.outside, true);
+    document.removeEventListener("keydown", entry.keydown, true);
+    window.removeEventListener("resize", entry.position);
+    document.removeEventListener("scroll", entry.scroll, true);
+    if (restoreFocus && entry.button.isConnected) {
+      entry.suppressFocus = true;
+      entry.button.focus();
+      entry.suppressFocus = false;
+    }
+  }
+  function bind(button, items, descriptions) {
+    button.type = "button";
+    button.setAttribute("aria-haspopup", "dialog");
+    button.setAttribute("aria-expanded", "false");
+    const id = `opportunities-extension-sr-details-${++sequence}`;
+    button.setAttribute("aria-controls", id);
+    const entry = { button, panel: null, timer: null, pinned: false, suppressFocus: false };
+    const contains = target => target && (button.contains(target) || entry.panel?.contains(target));
+    entry.outside = event => { if (!contains(event.target)) close(); };
+    entry.scroll = event => { if (!entry.panel.contains(event.target)) close(); };
+    entry.keydown = event => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        event.stopPropagation();
+        close(true);
+      }
+    };
+    entry.position = () => {
+      const rect = button.getBoundingClientRect();
+      const width = Math.min(480, window.innerWidth - 24);
+      entry.panel.style.width = `${width}px`;
+      entry.panel.style.maxHeight = `${Math.min(480, window.innerHeight - 24)}px`;
+      const height = entry.panel.getBoundingClientRect().height;
+      entry.panel.style.left = `${Math.max(12, Math.min(rect.left, window.innerWidth - width - 12))}px`;
+      entry.panel.style.top = `${Math.max(12, Math.min(rect.bottom + 6, window.innerHeight - height - 12))}px`;
+    };
+    function leave() {
+      clearTimeout(entry.timer);
+      if (!entry.pinned && !contains(document.activeElement)) {
+        entry.timer = setTimeout(() => { if (active === entry) close(); }, 200);
+      }
+    }
+    function focusOut(event) { if (!contains(event.relatedTarget) && active === entry) close(); }
+    function open() {
+      if (entry.suppressFocus) return;
+      clearTimeout(entry.timer);
+      if (active === entry) return;
+      close();
+      const host = document.getElementById(MODAL_ID);
+      if (!host) return;
+      const panel = document.createElement("div");
+      entry.panel = panel;
+      entry.pinned = false;
+      panel.id = id;
+      panel.className = "opportunities-extension-sr-popover";
+      panel.setAttribute("role", "dialog");
+      panel.setAttribute("aria-label", "CRM service requests");
+      const dismiss = document.createElement("button");
+      dismiss.type = "button";
+      dismiss.className = "opportunities-extension-sr-dismiss";
+      dismiss.title = "Close service request details";
+      dismiss.setAttribute("aria-label", dismiss.title);
+      dismiss.append(createCloseIcon());
+      dismiss.addEventListener("click", () => close(true));
+      panel.append(dismiss);
+      items.forEach((item, index) => {
+        const section = document.createElement("section");
+        const heading = document.createElement("div");
+        heading.className = "opportunities-extension-sr-number";
+        const number = item.SrNumber;
+        const link = document.createElement(number ? "a" : "span");
+        link.textContent = number ? String(number) : "N/D";
+        if (number) {
+          link.href = `https://eeho.fa.us2.oraclecloud.com/fscmUI/redwood/service/ec/container/sr/edit?srNumber=${encodeURIComponent(String(number))}`;
+          link.target = "_blank";
+          link.rel = "noopener noreferrer";
+        }
+        const label = document.createElement("span");
+        label.textContent = "SR Number:";
+        heading.append(label, link);
+        if (number) heading.append(createCopyButton(String(number), "SR number", "SR Number"));
+        const details = document.createElement("div");
+        details.className = "opportunities-extension-sr-details";
+        details.textContent = descriptions[index];
+        section.append(heading, details);
+        panel.append(section);
+      });
+      panel.addEventListener("pointerenter", () => clearTimeout(entry.timer));
+      panel.addEventListener("pointerleave", leave);
+      panel.addEventListener("focusout", focusOut);
+      host.append(panel);
+      active = entry;
+      button.setAttribute("aria-expanded", "true");
+      entry.position();
+      document.addEventListener("pointerdown", entry.outside, true);
+      document.addEventListener("keydown", entry.keydown, true);
+      document.addEventListener("scroll", entry.scroll, true);
+      window.addEventListener("resize", entry.position);
+    }
+    button.addEventListener("pointerenter", open);
+    button.addEventListener("pointerleave", leave);
+    button.addEventListener("focus", open);
+    button.addEventListener("focusout", focusOut);
+    button.addEventListener("click", event => {
+      event.stopPropagation();
+      if (active === entry && entry.pinned) close();
+      else {
+        open();
+        if (active === entry) {
+          entry.pinned = true;
+          entry.panel.querySelector("a, button").focus();
+        }
+      }
+    });
+  }
+  return { bind, close };
+}
+
+// Source: src/features/opportunities/workload-actions.js
+function createOpportunityWorkloadActions({ authSessionState, requestConsumerTokenServiceOnce, sendRuntimeMessage,
+  appendBackgroundRequestLog, queueProductsTableRender, productsContentState, messageTypes, environment }) {
+  let session = newSession();
+  function newSession() { return { enabled: true, records: new Map(), queue: [], running: 0 }; }
+  function reset(enabled = true) {
+    session.enabled = false;
+    session.queue.length = 0;
+    session = newSession();
+    session.enabled = enabled;
+  }
+  function idsFor(products) {
+    return [...new Set((products?.items || []).map(item => String(item?.RevnId ?? "").trim()).filter(Boolean))];
+  }
+  function loadProducts(products) {
+    if (!session.enabled) return;
+    for (const revnId of idsFor(products)) {
+      if (session.records.has(revnId)) continue;
+      const record = { status: "loading", actions: [], hasNext: false };
+      session.records.set(revnId, record);
+      session.queue.push({ revnId, record });
+    }
+    pump(session);
+  }
+  function reopen() {
+    reset();
+    for (const products of productsContentState.opptyProductsByNumber.values()) loadProducts(products);
+    queueProductsTableRender();
+  }
+  function pump(current) {
+    while (current.enabled && current === session && current.running < 4 && current.queue.length) {
+      const job = current.queue.shift();
+      current.running += 1;
+      run(current, job).finally(() => { current.running -= 1; pump(current); });
+    }
+  }
+  async function run(current, { revnId, record }) {
+    try {
+      const authorizations = await requestConsumerTokenServiceOnce();
+      if (!current.enabled || current !== session) return;
+      const result = await sendRuntimeMessage({ type: messageTypes.requestWlActions, revnId, authorization: authorizations?.workloadActions });
+      if (!current.enabled || current !== session) return;
+      appendBackgroundRequestLog(result?.debugRequests);
+      if (!result?.ok) throw new Error(result?.error || "Unable to load workload actions.");
+      record.actions = result.actions;
+      record.hasNext = result.hasNext;
+      record.status = "ready";
+    } catch (error) {
+      if (!current.enabled || current !== session) return;
+      record.status = "error";
+      record.error = error.message || "Unable to load workload actions.";
+    } finally {
+      if (current.enabled && current === session) queueProductsTableRender();
+    }
+  }
+  function createBadge(optyNumber) {
+    if (!session.enabled || !optyNumber) return null;
+    const products = productsContentState.opptyProductsByNumber.get(String(optyNumber));
+    if (!products) return null;
+    const ids = idsFor(products);
+    const records = ids.map(id => session.records.get(id));
+    const actions = records.flatMap(record => record?.actions || []);
+    const pending = records.some(record => !record || record.status === "loading");
+    const uncertain = products.error || (products.items || []).some(item => !String(item?.RevnId ?? "").trim())
+      || records.some(record => record?.status === "error" || record?.hasNext);
+    const principal = authSessionState.principal;
+    const owned = Boolean(principal) && actions.some(action => typeof action.owner === "string" && action.owner.trim() === principal);
+    const state = owned ? "matched" : pending ? "loading" : uncertain || !principal ? "error" : "missing";
+    const badge = environment.document.createElement("span");
+    badge.className = "opportunities-extension-crm-sr-badge opportunities-extension-wl-actions-badge";
+    badge.setAttribute("data-state", state);
+    badge.textContent = state === "matched" ? "\u2705 Act" : state === "missing" ? "\u26d4 Act" : state === "loading" ? "Act ..." : "Act ?";
+    badge.title = actions.length ? actions.map(action => [
+      `Action: ${action.name ?? "N/D"}`, `ID: ${action.id ?? "N/D"}`, `Status: ${action.status ?? "N/D"}`,
+      `Owner: ${action.owner || "N/D"}`, `Email: ${action.ownerEmail || "N/D"}`, `Workload: ${action.workloadName || "N/D"}`,
+      `Description: ${action.workloadDescription || "N/D"}`, `Start: ${action.startDate || "N/D"}`, `End: ${action.endDate || "N/D"}`
+    ].join("\n")).join("\n\n") : state === "missing" ? "No actions found for this opportunity's products."
+      : state === "loading" ? "Loading workload actions..." : "Unable to confirm workload actions. Check product RevnId and Debug Requests.";
+    if (records.some(record => record?.hasNext)) badge.title += "\nAdditional actions exist; pagination is not enabled.";
+    if (!principal) badge.title += "\nTokenrelay principal is unavailable; ownership cannot be verified.";
+    else if (actions.length && state === "missing") badge.title += "\nNone of the returned actions belong to the signed-in principal.";
+    if (actions.length && (pending || uncertain)) badge.title += "\nSome workloads are still loading or could not be fully checked.";
+    badge.tabIndex = 0;
+    badge.setAttribute("aria-label", badge.title);
+    return badge;
+  }
+  return { reset, reopen, loadProducts, createBadge };
+}
+
 // Source: src/features/opportunities/fiscal-periods.js
 function createOpportunitiesFiscalPeriods() {
   function getFiscalPeriodRange(period, currentDate) {
@@ -2018,6 +2282,8 @@ function createOpportunitiesTable({
   createProductsCountButton,
   createProductsRampBadge,
   createCrmServiceRequestBadge,
+  closeCrmSrPopover,
+  createWorkloadActionsBadge,
   createProductsDetailRow,
   createStageBadge,
   createStatusBadge,
@@ -2058,6 +2324,7 @@ function createOpportunitiesTable({
       return;
     }
 
+    closeCrmSrPopover();
     table.textContent = "";
     table.setAttribute("data-opportunities-layout", "inline-actions");
     table.setAttribute("aria-busy", opportunitiesTableState.opportunitiesTableState.status === "loading" ? "true" : "false");
@@ -2144,6 +2411,8 @@ function createOpportunitiesTable({
               }
               const srBadge = createCrmServiceRequestBadge(item.OptyNumber);
               if (srBadge) productActions.append(srBadge);
+              const actionsBadge = createWorkloadActionsBadge(item.OptyNumber);
+              if (actionsBadge) productActions.append(actionsBadge);
               nameCellContent.append(opportunityLink, productActions);
               cell.append(nameCellContent);
             } else if (column.key === "optyNumber" && item.OptyNumber) {
@@ -2926,19 +3195,19 @@ function createOpportunitiesLinks({
     return link;
   }
 
-  function createCopyOpportunityButton(optyNumber) {
+  function createCopyOpportunityButton(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     const button = document.createElement("button");
     const icon = document.createElementNS("http://www.w3.org/2000/svg", "svg");
     const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
 
     button.type = "button";
     button.className = "opportunities-extension-copy-button";
-    button.setAttribute("aria-label", `Copy opportunity number ${optyNumber}`);
-    button.title = "Copy opportunity number";
+    button.setAttribute("aria-label", `Copy ${label} ${optyNumber}`);
+    button.title = `Copy ${label}`;
     button.addEventListener("click", (event) => {
       event.preventDefault();
       event.stopPropagation();
-      copyOpportunityNumber(String(optyNumber));
+      copyOpportunityNumber(String(optyNumber), label, confirmationLabel);
     });
 
     icon.setAttribute("viewBox", "0 0 24 24");
@@ -2949,7 +3218,7 @@ function createOpportunitiesLinks({
     return button;
   }
 
-  async function copyOpportunityNumber(optyNumber) {
+  async function copyOpportunityNumber(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     try {
       if (navigator.clipboard && navigator.clipboard.writeText) {
         await navigator.clipboard.writeText(optyNumber);
@@ -2965,9 +3234,9 @@ function createOpportunitiesLinks({
         input.remove();
       }
 
-      showCopyConfirmation(`Opty Number ${optyNumber} copied.`);
+      showCopyConfirmation(`${confirmationLabel} ${optyNumber} copied.`);
     } catch (error) {
-      showCopyConfirmation("Unable to copy opportunity number.", true);
+      showCopyConfirmation(`Unable to copy ${label}.`, true);
     }
   }
 
@@ -3322,10 +3591,43 @@ function createProductsContentJobs({
   preferencesState,
   productsContentState,
   renderOpportunitiesTable,
+  loadWorkloadActions,
   sendRuntimeMessage,
   environment
 }) {
-  const { browser, chrome, document, window } = environment;
+  const { browser, chrome, document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let completion = null;
+  function updateCompletionVisibility(badge) {
+    const requestId = productsContentState.currentProductsRequestId;
+    const complete = productsContentState.productsProgress.state === "complete";
+    if (completion && (!complete || completion.requestId !== requestId || completion.badge !== badge)) {
+      clearTimeout(completion.waitTimer);
+      clearTimeout(completion.hideTimer);
+      completion.badge.setAttribute("data-fading", "false");
+      completion = null;
+    }
+    if (!complete) {
+      badge.setAttribute("data-fading", "false");
+      return;
+    }
+    if (completion) {
+      badge.hidden = completion.hidden;
+      return;
+    }
+    const current = { requestId, badge, hidden: false, waitTimer: null, hideTimer: null };
+    completion = current;
+    badge.setAttribute("data-fading", "false");
+    current.waitTimer = setTimeout(() => {
+      if (completion !== current) return;
+      badge.setAttribute("data-fading", "true");
+      const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+      current.hideTimer = setTimeout(() => {
+        if (completion !== current) return;
+        current.hidden = true;
+        badge.hidden = true;
+      }, reducedMotion ? 0 : 300);
+    }, 5000);
+  }
   function requestOpptyProductsInBackground(opportunities, token) {
     const optyNumbers = Array.from(new Set(opportunities
       .map((item) => item && item.OptyNumber)
@@ -3401,6 +3703,7 @@ function createProductsContentJobs({
           cachedAt: Number(message.cachedAt) || 0,
           error: message.error || ""
         });
+        loadWorkloadActions(productsContentState.opptyProductsByNumber.get(String(message.optyNumber)));
       }
 
       if (Number(message.cachedAt) > productsContentState.productsLastCachedAt) {
@@ -3445,6 +3748,7 @@ function createProductsContentJobs({
     } else {
       badge.textContent = "Products ready 0";
     }
+    updateCompletionVisibility(badge);
 
     const timestamp = document.getElementById(PRODUCTS_CACHE_TIMESTAMP_ID);
 
@@ -6152,7 +6456,7 @@ function createDebugContentView({
     ["all", "All"], ["authentication", "Authentication"],
     ["opportunities", "Opportunities"], ["products", "Products"],
     ["ai", "AI"], ["consumption", "Consumption"], ["installBase", "Installed Base"],
-    ["serviceRequests", "Service Requests"], ["other", "Other"]
+    ["serviceRequests", "Service Requests"], ["actions", "Actions"], ["other", "Other"]
   ];
   let selectedCategory = "all";
   const expandedIds = new Set();
@@ -6162,6 +6466,7 @@ function createDebugContentView({
     if (/^request(?:TokenRelay|ConsumerTokenService|CustomerTokenService)/.test(entry.name)) return "authentication";
     if (entry.name === "requestOpportunities") return "opportunities";
     if (entry.name === "requestOpptyProducts") return "products";
+    if (entry.name === "requestWlActions") return "actions";
     if (entry.name === "requestGenerateAiSummary") return "ai";
     if (entry.name === "requestInstallBase") return "installBase";
     if (entry.name === "requestCustomerServiceRequest" || entry.name === "resquestCrmServiceRequest") return "serviceRequests";
@@ -6607,6 +6912,8 @@ function createContentApplication(overrides = {}) {
     requestTokenRelayOnce: (...args) => authContentSession.requestTokenRelayOnce(...args),
     resetCustomerAndOwnerFiltersForPeriod: (...args) => opportunitiesFilters.resetCustomerAndOwnerFiltersForPeriod(...args),
     resetOpportunitiesTable: (...args) => opportunitiesController.resetOpportunitiesTable(...args),
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
+    reopenWorkloadActions: () => opportunityWorkloadActions.reopen(),
     loadCrmServiceRequests: (...args) => opportunityCrmServiceRequests.load(...args),
     resetCrmServiceRequests: () => opportunityCrmServiceRequests.reset(),
     restoreFilterPreferences: (...args) => preferencesStorage.restoreFilterPreferences(...args),
@@ -6646,6 +6953,7 @@ function createContentApplication(overrides = {}) {
     requestTokenRelay: (...args) => authTokenRelay.requestTokenRelay(...args)
   });
   const authTokenRelay = createAuthTokenRelay({
+    authSessionState,
     TOKEN_RELAY_URL: contracts.TOKEN_RELAY_URL,
     createDebugBody: (...args) => debugContentLog.createDebugBody(...args),
     getXsrfToken: (...args) => authXsrfContent.getXsrfToken(...args),
@@ -6667,6 +6975,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const opportunitiesController = createOpportunitiesController({
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
     STAGE_OPTIONS: contracts.STAGE_OPTIONS,
     STATUS_OPTIONS: contracts.STATUS_OPTIONS,
     authSessionState,
@@ -6708,11 +7017,20 @@ function createContentApplication(overrides = {}) {
     readResponseBodyForDebug: (...args) => debugContentLog.readResponseBodyForDebug(...args),
     maskToken: (...args) => debugContentLog.maskToken(...args), environment
   });
+  const crmSrPopover = createCrmSrPopover({
+    MODAL_ID: contracts.MODAL_ID,
+    createCopyButton: (...args) => opportunitiesLinks.createCopyOpportunityButton(...args),
+    createCloseIcon: (...args) => contentIcons.createCloseIcon(...args), environment
+  });
   const opportunityCrmServiceRequests = createOpportunityCrmServiceRequests({
+    bindPopover: (...args) => crmSrPopover.bind(...args),
+    closePopover: (...args) => crmSrPopover.close(...args),
     requestCrmServiceRequest: (...args) => fusionCrmServiceRequests.requestCrmServiceRequest(...args),
     isCurrentPeriodRequest: (...args) => opportunitiesController.isCurrentPeriodRequest(...args), environment
   });
   const opportunitiesTable = createOpportunitiesTable({
+    closeCrmSrPopover: (...args) => crmSrPopover.close(...args),
+    createWorkloadActionsBadge: (...args) => opportunityWorkloadActions.createBadge(...args),
     ACCOUNT_DETAIL_URL: contracts.ACCOUNT_DETAIL_URL,
     OPPORTUNITIES_COLUMNS: columns,
     OPPORTUNITIES_TABLE_ID: contracts.OPPORTUNITIES_TABLE_ID,
@@ -6812,6 +7130,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const productsContentJobs = createProductsContentJobs({
+    loadWorkloadActions: (...args) => opportunityWorkloadActions.loadProducts(...args),
     appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
     messageTypes,
     PRODUCTS_CACHE_TIMESTAMP_ID: contracts.PRODUCTS_CACHE_TIMESTAMP_ID,
@@ -6823,6 +7142,14 @@ function createContentApplication(overrides = {}) {
     sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
     environment
   });
+  const opportunityWorkloadActions = createOpportunityWorkloadActions({
+    authSessionState,
+    requestConsumerTokenServiceOnce: (...args) => authContentSession.requestConsumerTokenServiceOnce(...args),
+    sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
+    appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
+    queueProductsTableRender: () => productsContentJobs.queueProductsTableRender(),
+    productsContentState, messageTypes, environment
+  });
   const productsDetails = createProductsDetails({
     OPPORTUNITIES_COLUMNS: columns,
     createAiSummaryAlert: (...args) => aiSummaryContent.createAiSummaryAlert(...args),
@@ -6988,6 +7315,7 @@ function createContentApplication(overrides = {}) {
   }
   return {
     start, contracts,
+    opportunityWorkloadActions,
     fusionCrmServiceRequests, opportunityCrmServiceRequests,
     authSessionState,
     authSalesCommonState,
diff --git a/scripts/sources.cjs b/scripts/sources.cjs
index e9f23f7..cd2fe4f 100644
--- a/scripts/sources.cjs
+++ b/scripts/sources.cjs
@@ -31,6 +31,8 @@ module.exports = {
     "src/services/fusion/opportunities.js",
     "src/services/fusion/crm-service-requests.js",
     "src/features/opportunities/crm-service-requests.js",
+    "src/features/opportunities/crm-sr-popover.js",
+    "src/features/opportunities/workload-actions.js",
     "src/features/opportunities/fiscal-periods.js",
     "src/features/opportunities/table.js",
     "src/features/opportunities/dashboard.js",
@@ -73,6 +75,7 @@ module.exports = {
     "src/services/spa/accounts.js",
     "src/services/spa/install-base.js",
     "src/services/spa/customer-service-requests.js",
+    "src/services/spa/workload-actions.js",
     "src/services/spa/consumption.js",
     "src/services/spa/response-shapes.js",
     "src/services/http/background-json.js",
diff --git a/src/auth/consumer-session.js b/src/auth/consumer-session.js
index f660964..f26bd2e 100644
--- a/src/auth/consumer-session.js
+++ b/src/auth/consumer-session.js
@@ -60,7 +60,8 @@ function createAuthConsumerSession({
           accountSummary: accountSummaryAuthorization,
           accountPlans: accountPlansAuthorization,
           installBase: extractTokenServiceAuthorization(tokenResponse, "SAIB-TS", ""),
-          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", "")
+          customerServiceRequests: extractTokenServiceAuthorization(tokenResponse, "SPA-ORANGE", ""),
+          workloadActions: extractTokenServiceAuthorization(tokenResponse, "WWB-TS", "Wwb-Provider-Authorization")
         },
         debugRequests
       };
diff --git a/src/auth/content-session.js b/src/auth/content-session.js
index e4f0111..4b6958a 100644
--- a/src/auth/content-session.js
+++ b/src/auth/content-session.js
@@ -20,6 +20,7 @@ function createAuthContentSession({
         })
         .catch((error) => {
           authSessionState.accessToken = "";
+          authSessionState.principal = "";
           authSessionState.authStatus = AUTH_STATUS.unauthenticated;
           throw error;
         })
diff --git a/src/auth/session-state.js b/src/auth/session-state.js
index ec4c862..aee5b76 100644
--- a/src/auth/session-state.js
+++ b/src/auth/session-state.js
@@ -3,6 +3,7 @@ function createAuthSessionState({ AUTH_STATUS } = {}) {
     tokenRelayRequest: null,
     consumerTokenServiceRequest: null,
     accessToken: "",
+    principal: "",
     authStatus: AUTH_STATUS.idle
   };
 }
diff --git a/src/auth/token-relay.js b/src/auth/token-relay.js
index 09e02c6..d13dfe3 100644
--- a/src/auth/token-relay.js
+++ b/src/auth/token-relay.js
@@ -1,5 +1,6 @@
 function createAuthTokenRelay({
   TOKEN_RELAY_URL,
+  authSessionState,
   createDebugBody,
   getXsrfToken,
   logRequestFailure,
@@ -13,6 +14,7 @@ function createAuthTokenRelay({
 }) {
   const { fetch } = environment;
   async function requestTokenRelay({ name = "requestTokenRelay", url = TOKEN_RELAY_URL, includeExpiry = false } = {}) {
+    if (url === TOKEN_RELAY_URL) authSessionState.principal = "";
     let refreshResult = null;
     let refreshAttempted = false;
 
@@ -95,6 +97,9 @@ function createAuthTokenRelay({
           access_token: maskToken(responseData.access_token)
         }, null, 2)));
 
+        if (url === TOKEN_RELAY_URL) {
+          authSessionState.principal = typeof responseData.principal === "string" ? responseData.principal.trim() : "";
+        }
         if (includeExpiry) {
           const lifetime = Number(responseData.expires_in);
           return {
diff --git a/src/background/application.js b/src/background/application.js
index ab6a3ca..756d3e0 100644
--- a/src/background/application.js
+++ b/src/background/application.js
@@ -111,6 +111,8 @@ function createBackgroundApplication(overrides = {}) {
   const refreshXsrfCookie = (...args) => authXsrfRecovery.refreshXsrfCookie(...args);
   const requestAccountPlans = (...args) => spaAccounts.requestAccountPlans(...args);
   const requestInstallBase = (...args) => spaInstallBase.requestInstallBase(...args);
+  const spaWorkloadActions = createSpaWorkloadActions({ fetchJson: (...args) => httpBackgroundJson.fetchJson(...args) });
+  const requestWlActions = (...args) => spaWorkloadActions.requestWlActions(...args);
   const requestCustomerServiceRequest = (...args) => spaCustomerServiceRequests.requestCustomerServiceRequest(...args);
   const requestConsumerTokenService = (...args) => authConsumerSession.requestConsumerTokenService(...args);
   const requestConsumptionTrend = (...args) => spaConsumption.requestConsumptionTrend(...args);
@@ -119,7 +121,7 @@ function createBackgroundApplication(overrides = {}) {
   const requestOpptyProducts = (...args) => productsBackgroundJobs.requestOpptyProducts(...args);
   const runtimeApi = environment.browser || environment.chrome;
   function start() {
-    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
+    startBackgroundApplication({ messageTypes, getXsrfTokenCookie, refreshXsrfCookie, requestAccountPlans, requestInstallBase, requestCustomerServiceRequest, requestWlActions, requestConsumerTokenService, requestConsumptionTrend, requestConsumptionPlanDetail, requestRatecardByPlan, requestOpptyProducts, runtimeApi });
   }
   return {
     start, contracts,
diff --git a/src/background/messages.js b/src/background/messages.js
index 39db7c1..7159bf3 100644
--- a/src/background/messages.js
+++ b/src/background/messages.js
@@ -6,6 +6,7 @@ function registerBackgroundMessages({
   requestAccountPlans,
   requestInstallBase,
   requestCustomerServiceRequest,
+  requestWlActions,
   requestConsumerTokenService,
   requestConsumptionTrend,
   requestConsumptionPlanDetail,
@@ -87,6 +88,14 @@ runtimeApi.runtime.onMessage.addListener((message, sender, sendResponse) => {
       return true;
     }
 
+    if (message.type === messageTypes.requestWlActions) {
+      requestWlActions(message).then(sendResponse).catch(error => sendResponse({
+        ok: false, error: error.message || "Unable to load workload actions.",
+        debugRequests: Array.isArray(error.debugRequests) ? error.debugRequests : []
+      }));
+      return true;
+    }
+
     if (message.type === messageTypes.requestCustomerServiceRequest) {
       requestCustomerServiceRequest(message).then(sendResponse).catch(error => sendResponse({
         ok: false, error: error.message || "Unable to load service requests.",
diff --git a/src/content/application.js b/src/content/application.js
index d58cc31..29f0165 100644
--- a/src/content/application.js
+++ b/src/content/application.js
@@ -104,6 +104,8 @@ function createContentApplication(overrides = {}) {
     requestTokenRelayOnce: (...args) => authContentSession.requestTokenRelayOnce(...args),
     resetCustomerAndOwnerFiltersForPeriod: (...args) => opportunitiesFilters.resetCustomerAndOwnerFiltersForPeriod(...args),
     resetOpportunitiesTable: (...args) => opportunitiesController.resetOpportunitiesTable(...args),
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
+    reopenWorkloadActions: () => opportunityWorkloadActions.reopen(),
     loadCrmServiceRequests: (...args) => opportunityCrmServiceRequests.load(...args),
     resetCrmServiceRequests: () => opportunityCrmServiceRequests.reset(),
     restoreFilterPreferences: (...args) => preferencesStorage.restoreFilterPreferences(...args),
@@ -143,6 +145,7 @@ function createContentApplication(overrides = {}) {
     requestTokenRelay: (...args) => authTokenRelay.requestTokenRelay(...args)
   });
   const authTokenRelay = createAuthTokenRelay({
+    authSessionState,
     TOKEN_RELAY_URL: contracts.TOKEN_RELAY_URL,
     createDebugBody: (...args) => debugContentLog.createDebugBody(...args),
     getXsrfToken: (...args) => authXsrfContent.getXsrfToken(...args),
@@ -164,6 +167,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const opportunitiesController = createOpportunitiesController({
+    resetWorkloadActions: (...args) => opportunityWorkloadActions.reset(...args),
     STAGE_OPTIONS: contracts.STAGE_OPTIONS,
     STATUS_OPTIONS: contracts.STATUS_OPTIONS,
     authSessionState,
@@ -205,11 +209,20 @@ function createContentApplication(overrides = {}) {
     readResponseBodyForDebug: (...args) => debugContentLog.readResponseBodyForDebug(...args),
     maskToken: (...args) => debugContentLog.maskToken(...args), environment
   });
+  const crmSrPopover = createCrmSrPopover({
+    MODAL_ID: contracts.MODAL_ID,
+    createCopyButton: (...args) => opportunitiesLinks.createCopyOpportunityButton(...args),
+    createCloseIcon: (...args) => contentIcons.createCloseIcon(...args), environment
+  });
   const opportunityCrmServiceRequests = createOpportunityCrmServiceRequests({
+    bindPopover: (...args) => crmSrPopover.bind(...args),
+    closePopover: (...args) => crmSrPopover.close(...args),
     requestCrmServiceRequest: (...args) => fusionCrmServiceRequests.requestCrmServiceRequest(...args),
     isCurrentPeriodRequest: (...args) => opportunitiesController.isCurrentPeriodRequest(...args), environment
   });
   const opportunitiesTable = createOpportunitiesTable({
+    closeCrmSrPopover: (...args) => crmSrPopover.close(...args),
+    createWorkloadActionsBadge: (...args) => opportunityWorkloadActions.createBadge(...args),
     ACCOUNT_DETAIL_URL: contracts.ACCOUNT_DETAIL_URL,
     OPPORTUNITIES_COLUMNS: columns,
     OPPORTUNITIES_TABLE_ID: contracts.OPPORTUNITIES_TABLE_ID,
@@ -309,6 +322,7 @@ function createContentApplication(overrides = {}) {
     environment
   });
   const productsContentJobs = createProductsContentJobs({
+    loadWorkloadActions: (...args) => opportunityWorkloadActions.loadProducts(...args),
     appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
     messageTypes,
     PRODUCTS_CACHE_TIMESTAMP_ID: contracts.PRODUCTS_CACHE_TIMESTAMP_ID,
@@ -320,6 +334,14 @@ function createContentApplication(overrides = {}) {
     sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
     environment
   });
+  const opportunityWorkloadActions = createOpportunityWorkloadActions({
+    authSessionState,
+    requestConsumerTokenServiceOnce: (...args) => authContentSession.requestConsumerTokenServiceOnce(...args),
+    sendRuntimeMessage: (...args) => platformContentMessages.sendRuntimeMessage(...args),
+    appendBackgroundRequestLog: (...args) => debugContentLog.appendBackgroundRequestLog(...args),
+    queueProductsTableRender: () => productsContentJobs.queueProductsTableRender(),
+    productsContentState, messageTypes, environment
+  });
   const productsDetails = createProductsDetails({
     OPPORTUNITIES_COLUMNS: columns,
     createAiSummaryAlert: (...args) => aiSummaryContent.createAiSummaryAlert(...args),
@@ -485,6 +507,7 @@ function createContentApplication(overrides = {}) {
   }
   return {
     start, contracts,
+    opportunityWorkloadActions,
     fusionCrmServiceRequests, opportunityCrmServiceRequests,
     authSessionState,
     authSalesCommonState,
diff --git a/src/content/modal.js b/src/content/modal.js
index 0165d30..516e132 100644
--- a/src/content/modal.js
+++ b/src/content/modal.js
@@ -53,6 +53,8 @@ function createContentModal({
   requestOpportunitiesForPeriod,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
+  reopenWorkloadActions,
   requestTokenRelayOnce,
   resetCustomerAndOwnerFiltersForPeriod,
   resetOpportunitiesTable,
@@ -63,7 +65,15 @@ function createContentModal({
   toggleOwnerFilterPanel,
   environment
 }) {
-  const { document, window } = environment;
+  const { document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let authCompletion = null;
+  function resetAuthCompletion() {
+    if (!authCompletion) return;
+    clearTimeout(authCompletion.waitTimer);
+    clearTimeout(authCompletion.hideTimer);
+    authCompletion.badge.setAttribute("data-fading", "false");
+    authCompletion = null;
+  }
   function openOpportunitiesModal() {
     ensureExtensionStyles();
     debugState.debugSecretsVisible = false;
@@ -72,6 +82,7 @@ function createContentModal({
 
     if (existingModal) {
       existingModal.hidden = false;
+      reopenWorkloadActions();
       existingModal.querySelector("select").focus();
       document.documentElement.classList.add("opportunities-extension-scroll-lock");
       ensureEscapeKeyHandler();
@@ -85,6 +96,7 @@ function createContentModal({
     authSessionState.tokenRelayRequest = null;
     authSessionState.consumerTokenServiceRequest = null;
     authSessionState.accessToken = "";
+    authSessionState.principal = "";
     opportunitiesQueryState.periodRequestVersion = 0;
     authSessionState.authStatus = AUTH_STATUS.idle;
     resetOpportunitiesTable();
@@ -422,6 +434,24 @@ function createContentModal({
       ? status
       : AUTH_STATUS.pending;
 
+    if (authCompletion && (authCompletion.badge !== badge || badgeStatus !== AUTH_STATUS.authenticated)) resetAuthCompletion();
+    badge.hidden = Boolean(authCompletion?.hidden);
+    if (badgeStatus === AUTH_STATUS.authenticated && !authCompletion) {
+      const current = { badge, hidden: false, waitTimer: null, hideTimer: null };
+      authCompletion = current;
+      badge.setAttribute("data-fading", "false");
+      current.waitTimer = setTimeout(() => {
+        if (authCompletion !== current) return;
+        badge.setAttribute("data-fading", "true");
+        const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+        current.hideTimer = setTimeout(() => {
+          if (authCompletion !== current) return;
+          current.hidden = true;
+          badge.hidden = true;
+        }, reducedMotion ? 0 : 300);
+      }, 5000);
+    }
+
     badge.setAttribute("data-auth-status", badgeStatus);
     badge.className = `opportunities-extension-auth-badge opportunities-extension-auth-badge-${badgeStatus}`;
     badge.textContent = badgeStatus === AUTH_STATUS.authenticated
@@ -432,6 +462,8 @@ function createContentModal({
   }
 
   function closeOpportunitiesModal() {
+    resetAuthCompletion();
+    resetWorkloadActions(false);
     resetCrmServiceRequests();
     const modal = document.getElementById(MODAL_ID);
 
diff --git a/src/features/debug/content-view.js b/src/features/debug/content-view.js
index c246e11..df4af9c 100644
--- a/src/features/debug/content-view.js
+++ b/src/features/debug/content-view.js
@@ -13,7 +13,7 @@ function createDebugContentView({
     ["all", "All"], ["authentication", "Authentication"],
     ["opportunities", "Opportunities"], ["products", "Products"],
     ["ai", "AI"], ["consumption", "Consumption"], ["installBase", "Installed Base"],
-    ["serviceRequests", "Service Requests"], ["other", "Other"]
+    ["serviceRequests", "Service Requests"], ["actions", "Actions"], ["other", "Other"]
   ];
   let selectedCategory = "all";
   const expandedIds = new Set();
@@ -23,6 +23,7 @@ function createDebugContentView({
     if (/^request(?:TokenRelay|ConsumerTokenService|CustomerTokenService)/.test(entry.name)) return "authentication";
     if (entry.name === "requestOpportunities") return "opportunities";
     if (entry.name === "requestOpptyProducts") return "products";
+    if (entry.name === "requestWlActions") return "actions";
     if (entry.name === "requestGenerateAiSummary") return "ai";
     if (entry.name === "requestInstallBase") return "installBase";
     if (entry.name === "requestCustomerServiceRequest" || entry.name === "resquestCrmServiceRequest") return "serviceRequests";
diff --git a/src/features/opportunities/controller.js b/src/features/opportunities/controller.js
index 9dbe96a..bcf329e 100644
--- a/src/features/opportunities/controller.js
+++ b/src/features/opportunities/controller.js
@@ -15,6 +15,7 @@ function createOpportunitiesController({
   requestOpportunitiesPage,
   loadCrmServiceRequests,
   resetCrmServiceRequests,
+  resetWorkloadActions,
   requestOpptyProductsInBackground,
   requestTokenRelayOnce,
   setOpportunitiesTableState
@@ -106,6 +107,7 @@ function createOpportunitiesController({
   }
 
   function resetOpportunitiesTable() {
+    resetWorkloadActions();
     resetCrmServiceRequests();
     opportunitiesFilterState.selectedStages = new Set(STAGE_OPTIONS);
     opportunitiesFilterState.selectedStatuses = new Set(STATUS_OPTIONS);
diff --git a/src/features/opportunities/crm-service-requests.js b/src/features/opportunities/crm-service-requests.js
index 000170c..7975ca0 100644
--- a/src/features/opportunities/crm-service-requests.js
+++ b/src/features/opportunities/crm-service-requests.js
@@ -1,9 +1,9 @@
-function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, environment }) {
+function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurrentPeriodRequest, bindPopover, closePopover, environment }) {
   let status = "idle";
   let byOpportunity = new Map();
   let pending = null;
   let generation = 0;
-  function reset() { generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
+  function reset() { closePopover(); generation += 1; pending = null; status = "idle"; byOpportunity = new Map(); }
   function load(token, version) {
     if (!isCurrentPeriodRequest(version)) return;
     if (!pending) pending = run(token, version, generation);
@@ -32,22 +32,25 @@ function createOpportunityCrmServiceRequests({ requestCrmServiceRequest, isCurre
   function createBadge(optyNumber) {
     if (!optyNumber || status === "idle" || status === "loading") return null;
     const items = byOpportunity.get(String(optyNumber)) || [];
-    const badge = environment.document.createElement("span");
+    const badge = environment.document.createElement(items.length && status === "ready" ? "button" : "span");
     badge.className = "opportunities-extension-crm-sr-badge";
     badge.setAttribute("data-state", status === "error" ? "error" : items.length ? "matched" : "missing");
     badge.textContent = status === "error" ? "SR ?" : items.length ? "\u2705 SR" : "\u26d4 SR";
     const display = value => value === null || value === undefined || value === "" ? "N/D" : String(value);
-    badge.title = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
-      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
-      : items.map(item => [
-        `SR Number: ${display(item.SrNumber)}`, `Title: ${display(item.Title)}`,
+    const descriptions = items.map(item => [
+        `Title: ${display(item.Title)}`,
         `Opportunity: ${display(item.OpportunityName_Id_c?.OptyNumber)}`,
         `Reported Hours: ${display(item.ReportedHours_c)}`,
         `Owner: ${[item.Owner?.PersonFirstName, item.Owner?.PersonLastName].filter(Boolean).join(" ") || "N/D"}`,
         `Email: ${display(item.Owner?.PrimaryEmail?.EmailAddress)}`,
         `Do Not Call: ${display(item.DoNotCallFlag)}`, `Do Not Email: ${display(item.DoNotEmailFlag)}`
-      ].join("\n")).join("\n\n");
-    badge.setAttribute("aria-label", badge.title);
+      ].join("\n"));
+    const description = status === "error" ? "Unable to check CRM service requests. See Debug Requests."
+      : !items.length ? "No matching CRM service request with status SVC_PENDING_DELIVERY in your SR team."
+      : items.map((item, index) => `SR Number: ${display(item.SrNumber)}\n${descriptions[index]}`).join("\n\n");
+    badge.setAttribute("aria-label", description);
+    if (items.length && status === "ready") bindPopover(badge, items, descriptions);
+    else badge.title = description;
     badge.tabIndex = 0;
     return badge;
   }
diff --git a/src/features/opportunities/crm-sr-popover.js b/src/features/opportunities/crm-sr-popover.js
new file mode 100644
index 0000000..b4d5f19
--- /dev/null
+++ b/src/features/opportunities/crm-sr-popover.js
@@ -0,0 +1,128 @@
+function createCrmSrPopover({ MODAL_ID, createCopyButton, createCloseIcon, environment }) {
+  const { document, window, setTimeout, clearTimeout } = environment;
+  let active = null;
+  let sequence = 0;
+  function close(restoreFocus = false) {
+    if (!active) return;
+    const entry = active;
+    active = null;
+    clearTimeout(entry.timer);
+    entry.panel.remove();
+    entry.button.setAttribute("aria-expanded", "false");
+    document.removeEventListener("pointerdown", entry.outside, true);
+    document.removeEventListener("keydown", entry.keydown, true);
+    window.removeEventListener("resize", entry.position);
+    document.removeEventListener("scroll", entry.scroll, true);
+    if (restoreFocus && entry.button.isConnected) {
+      entry.suppressFocus = true;
+      entry.button.focus();
+      entry.suppressFocus = false;
+    }
+  }
+  function bind(button, items, descriptions) {
+    button.type = "button";
+    button.setAttribute("aria-haspopup", "dialog");
+    button.setAttribute("aria-expanded", "false");
+    const id = `opportunities-extension-sr-details-${++sequence}`;
+    button.setAttribute("aria-controls", id);
+    const entry = { button, panel: null, timer: null, pinned: false, suppressFocus: false };
+    const contains = target => target && (button.contains(target) || entry.panel?.contains(target));
+    entry.outside = event => { if (!contains(event.target)) close(); };
+    entry.scroll = event => { if (!entry.panel.contains(event.target)) close(); };
+    entry.keydown = event => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        event.stopPropagation();
+        close(true);
+      }
+    };
+    entry.position = () => {
+      const rect = button.getBoundingClientRect();
+      const width = Math.min(480, window.innerWidth - 24);
+      entry.panel.style.width = `${width}px`;
+      entry.panel.style.maxHeight = `${Math.min(480, window.innerHeight - 24)}px`;
+      const height = entry.panel.getBoundingClientRect().height;
+      entry.panel.style.left = `${Math.max(12, Math.min(rect.left, window.innerWidth - width - 12))}px`;
+      entry.panel.style.top = `${Math.max(12, Math.min(rect.bottom + 6, window.innerHeight - height - 12))}px`;
+    };
+    function leave() {
+      clearTimeout(entry.timer);
+      if (!entry.pinned && !contains(document.activeElement)) {
+        entry.timer = setTimeout(() => { if (active === entry) close(); }, 200);
+      }
+    }
+    function focusOut(event) { if (!contains(event.relatedTarget) && active === entry) close(); }
+    function open() {
+      if (entry.suppressFocus) return;
+      clearTimeout(entry.timer);
+      if (active === entry) return;
+      close();
+      const host = document.getElementById(MODAL_ID);
+      if (!host) return;
+      const panel = document.createElement("div");
+      entry.panel = panel;
+      entry.pinned = false;
+      panel.id = id;
+      panel.className = "opportunities-extension-sr-popover";
+      panel.setAttribute("role", "dialog");
+      panel.setAttribute("aria-label", "CRM service requests");
+      const dismiss = document.createElement("button");
+      dismiss.type = "button";
+      dismiss.className = "opportunities-extension-sr-dismiss";
+      dismiss.title = "Close service request details";
+      dismiss.setAttribute("aria-label", dismiss.title);
+      dismiss.append(createCloseIcon());
+      dismiss.addEventListener("click", () => close(true));
+      panel.append(dismiss);
+      items.forEach((item, index) => {
+        const section = document.createElement("section");
+        const heading = document.createElement("div");
+        heading.className = "opportunities-extension-sr-number";
+        const number = item.SrNumber;
+        const link = document.createElement(number ? "a" : "span");
+        link.textContent = number ? String(number) : "N/D";
+        if (number) {
+          link.href = `https://eeho.fa.us2.oraclecloud.com/fscmUI/redwood/service/ec/container/sr/edit?srNumber=${encodeURIComponent(String(number))}`;
+          link.target = "_blank";
+          link.rel = "noopener noreferrer";
+        }
+        const label = document.createElement("span");
+        label.textContent = "SR Number:";
+        heading.append(label, link);
+        if (number) heading.append(createCopyButton(String(number), "SR number", "SR Number"));
+        const details = document.createElement("div");
+        details.className = "opportunities-extension-sr-details";
+        details.textContent = descriptions[index];
+        section.append(heading, details);
+        panel.append(section);
+      });
+      panel.addEventListener("pointerenter", () => clearTimeout(entry.timer));
+      panel.addEventListener("pointerleave", leave);
+      panel.addEventListener("focusout", focusOut);
+      host.append(panel);
+      active = entry;
+      button.setAttribute("aria-expanded", "true");
+      entry.position();
+      document.addEventListener("pointerdown", entry.outside, true);
+      document.addEventListener("keydown", entry.keydown, true);
+      document.addEventListener("scroll", entry.scroll, true);
+      window.addEventListener("resize", entry.position);
+    }
+    button.addEventListener("pointerenter", open);
+    button.addEventListener("pointerleave", leave);
+    button.addEventListener("focus", open);
+    button.addEventListener("focusout", focusOut);
+    button.addEventListener("click", event => {
+      event.stopPropagation();
+      if (active === entry && entry.pinned) close();
+      else {
+        open();
+        if (active === entry) {
+          entry.pinned = true;
+          entry.panel.querySelector("a, button").focus();
+        }
+      }
+    });
+  }
+  return { bind, close };
+}
diff --git a/src/features/opportunities/links.js b/src/features/opportunities/links.js
index c366a21..4a61085 100644
--- a/src/features/opportunities/links.js
+++ b/src/features/opportunities/links.js
@@ -24,19 +24,19 @@ function createOpportunitiesLinks({
     return link;
   }
 
-  function createCopyOpportunityButton(optyNumber) {
+  function createCopyOpportunityButton(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     const button = document.createElement("button");
     const icon = document.createElementNS("http://www.w3.org/2000/svg", "svg");
     const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
 
     button.type = "button";
     button.className = "opportunities-extension-copy-button";
-    button.setAttribute("aria-label", `Copy opportunity number ${optyNumber}`);
-    button.title = "Copy opportunity number";
+    button.setAttribute("aria-label", `Copy ${label} ${optyNumber}`);
+    button.title = `Copy ${label}`;
     button.addEventListener("click", (event) => {
       event.preventDefault();
       event.stopPropagation();
-      copyOpportunityNumber(String(optyNumber));
+      copyOpportunityNumber(String(optyNumber), label, confirmationLabel);
     });
 
     icon.setAttribute("viewBox", "0 0 24 24");
@@ -47,7 +47,7 @@ function createOpportunitiesLinks({
     return button;
   }
 
-  async function copyOpportunityNumber(optyNumber) {
+  async function copyOpportunityNumber(optyNumber, label = "opportunity number", confirmationLabel = "Opty Number") {
     try {
       if (navigator.clipboard && navigator.clipboard.writeText) {
         await navigator.clipboard.writeText(optyNumber);
@@ -63,9 +63,9 @@ function createOpportunitiesLinks({
         input.remove();
       }
 
-      showCopyConfirmation(`Opty Number ${optyNumber} copied.`);
+      showCopyConfirmation(`${confirmationLabel} ${optyNumber} copied.`);
     } catch (error) {
-      showCopyConfirmation("Unable to copy opportunity number.", true);
+      showCopyConfirmation(`Unable to copy ${label}.`, true);
     }
   }
 
diff --git a/src/features/opportunities/styles.css b/src/features/opportunities/styles.css
index 350358b..2d9775b 100644
--- a/src/features/opportunities/styles.css
+++ b/src/features/opportunities/styles.css
@@ -1,4 +1,13 @@
 /* Compact filters use available CSS width, including Windows display scaling. */
+.opportunities-extension-products-progress,
+.opportunities-extension-auth-badge { opacity: 1; transition: opacity 300ms ease; }
+.opportunities-extension-products-progress[data-fading="true"],
+.opportunities-extension-auth-badge[data-fading="true"] { opacity: 0; }
+.opportunities-extension-auth-badge[hidden] { display: none; }
+@media (prefers-reduced-motion: reduce) {
+  .opportunities-extension-products-progress,
+  .opportunities-extension-auth-badge { transition: none; }
+}
 .opportunities-extension-crm-sr-badge {
   flex: 0 0 auto;
   padding: 0 6px;
@@ -13,10 +22,12 @@
 }
 .opportunities-extension-crm-sr-badge[data-state="missing"] { color: #9f201b; background: #fde8e7; border-color: #c74640; }
 .opportunities-extension-crm-sr-badge[data-state="error"] { color: #785000; background: #fff0cd; border-color: #987021; }
+.opportunities-extension-wl-actions-badge[data-state="loading"] { color: #5f5a55; background: #eceae8; border-color: #8f8a85; }
 .opportunities-extension-crm-sr-badge:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
 .opportunities-extension-modal[data-theme="dark"] .opportunities-extension-crm-sr-badge { color: #b8e4c6; background: #214d34; border-color: #6eac82; }
 .opportunities-extension-modal[data-theme="dark"] .opportunities-extension-crm-sr-badge[data-state="missing"] { color: #ffd9d5; background: #542824; border-color: #ef938b; }
 .opportunities-extension-modal[data-theme="dark"] .opportunities-extension-crm-sr-badge[data-state="error"] { color: #ffe0a3; background: #584219; border-color: #c99b4b; }
+.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-wl-actions-badge[data-state="loading"] { color: #dedbd7; background: #484541; border-color: #8f8a85; }
 
 .opportunities-extension-form {
   display: grid;
@@ -279,3 +290,24 @@
   position: static;
   justify-self: end;
 }
+.opportunities-extension-crm-sr-badge[type="button"] { cursor: pointer; font-family: inherit; }
+.opportunities-extension-sr-popover {
+  position: fixed; z-index: 8; box-sizing: border-box; overflow: auto;
+  padding: 12px; border: 1px solid #b9b5b0; border-radius: 6px;
+  background: #fff; color: #302e2b; box-shadow: 0 6px 24px #0003;
+  font: 12px/1.5 Arial, sans-serif; text-align: left; overflow-wrap: anywhere;
+}
+.opportunities-extension-sr-popover section { padding: 8px 0; }
+.opportunities-extension-sr-popover section + section { border-top: 1px solid #dedbd7; }
+.opportunities-extension-sr-number { display: flex; align-items: center; gap: 8px; padding-right: 30px; font-weight: 600; }
+.opportunities-extension-sr-popover a { color: #00677d; text-decoration: underline; }
+.opportunities-extension-sr-details { white-space: pre-wrap; margin-top: 6px; }
+.opportunities-extension-sr-dismiss {
+  position: absolute; top: 6px; right: 6px; width: 28px; height: 28px;
+  display: grid; place-items: center; padding: 4px; border: 0;
+  background: transparent; color: inherit; cursor: pointer;
+}
+.opportunities-extension-sr-dismiss svg { width: 16px; height: 16px; }
+.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-sr-popover { background: #292827; color: #f1efec; border-color: #77716b; }
+.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-sr-popover section + section { border-color: #5f5953; }
+.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-sr-popover a { color: #7ddced; }
diff --git a/src/features/opportunities/table.js b/src/features/opportunities/table.js
index f043b98..1da421b 100644
--- a/src/features/opportunities/table.js
+++ b/src/features/opportunities/table.js
@@ -11,6 +11,8 @@ function createOpportunitiesTable({
   createProductsCountButton,
   createProductsRampBadge,
   createCrmServiceRequestBadge,
+  closeCrmSrPopover,
+  createWorkloadActionsBadge,
   createProductsDetailRow,
   createStageBadge,
   createStatusBadge,
@@ -51,6 +53,7 @@ function createOpportunitiesTable({
       return;
     }
 
+    closeCrmSrPopover();
     table.textContent = "";
     table.setAttribute("data-opportunities-layout", "inline-actions");
     table.setAttribute("aria-busy", opportunitiesTableState.opportunitiesTableState.status === "loading" ? "true" : "false");
@@ -137,6 +140,8 @@ function createOpportunitiesTable({
               }
               const srBadge = createCrmServiceRequestBadge(item.OptyNumber);
               if (srBadge) productActions.append(srBadge);
+              const actionsBadge = createWorkloadActionsBadge(item.OptyNumber);
+              if (actionsBadge) productActions.append(actionsBadge);
               nameCellContent.append(opportunityLink, productActions);
               cell.append(nameCellContent);
             } else if (column.key === "optyNumber" && item.OptyNumber) {
diff --git a/src/features/opportunities/workload-actions.js b/src/features/opportunities/workload-actions.js
new file mode 100644
index 0000000..ce7d38c
--- /dev/null
+++ b/src/features/opportunities/workload-actions.js
@@ -0,0 +1,87 @@
+function createOpportunityWorkloadActions({ authSessionState, requestConsumerTokenServiceOnce, sendRuntimeMessage,
+  appendBackgroundRequestLog, queueProductsTableRender, productsContentState, messageTypes, environment }) {
+  let session = newSession();
+  function newSession() { return { enabled: true, records: new Map(), queue: [], running: 0 }; }
+  function reset(enabled = true) {
+    session.enabled = false;
+    session.queue.length = 0;
+    session = newSession();
+    session.enabled = enabled;
+  }
+  function idsFor(products) {
+    return [...new Set((products?.items || []).map(item => String(item?.RevnId ?? "").trim()).filter(Boolean))];
+  }
+  function loadProducts(products) {
+    if (!session.enabled) return;
+    for (const revnId of idsFor(products)) {
+      if (session.records.has(revnId)) continue;
+      const record = { status: "loading", actions: [], hasNext: false };
+      session.records.set(revnId, record);
+      session.queue.push({ revnId, record });
+    }
+    pump(session);
+  }
+  function reopen() {
+    reset();
+    for (const products of productsContentState.opptyProductsByNumber.values()) loadProducts(products);
+    queueProductsTableRender();
+  }
+  function pump(current) {
+    while (current.enabled && current === session && current.running < 4 && current.queue.length) {
+      const job = current.queue.shift();
+      current.running += 1;
+      run(current, job).finally(() => { current.running -= 1; pump(current); });
+    }
+  }
+  async function run(current, { revnId, record }) {
+    try {
+      const authorizations = await requestConsumerTokenServiceOnce();
+      if (!current.enabled || current !== session) return;
+      const result = await sendRuntimeMessage({ type: messageTypes.requestWlActions, revnId, authorization: authorizations?.workloadActions });
+      if (!current.enabled || current !== session) return;
+      appendBackgroundRequestLog(result?.debugRequests);
+      if (!result?.ok) throw new Error(result?.error || "Unable to load workload actions.");
+      record.actions = result.actions;
+      record.hasNext = result.hasNext;
+      record.status = "ready";
+    } catch (error) {
+      if (!current.enabled || current !== session) return;
+      record.status = "error";
+      record.error = error.message || "Unable to load workload actions.";
+    } finally {
+      if (current.enabled && current === session) queueProductsTableRender();
+    }
+  }
+  function createBadge(optyNumber) {
+    if (!session.enabled || !optyNumber) return null;
+    const products = productsContentState.opptyProductsByNumber.get(String(optyNumber));
+    if (!products) return null;
+    const ids = idsFor(products);
+    const records = ids.map(id => session.records.get(id));
+    const actions = records.flatMap(record => record?.actions || []);
+    const pending = records.some(record => !record || record.status === "loading");
+    const uncertain = products.error || (products.items || []).some(item => !String(item?.RevnId ?? "").trim())
+      || records.some(record => record?.status === "error" || record?.hasNext);
+    const principal = authSessionState.principal;
+    const owned = Boolean(principal) && actions.some(action => typeof action.owner === "string" && action.owner.trim() === principal);
+    const state = owned ? "matched" : pending ? "loading" : uncertain || !principal ? "error" : "missing";
+    const badge = environment.document.createElement("span");
+    badge.className = "opportunities-extension-crm-sr-badge opportunities-extension-wl-actions-badge";
+    badge.setAttribute("data-state", state);
+    badge.textContent = state === "matched" ? "\u2705 Act" : state === "missing" ? "\u26d4 Act" : state === "loading" ? "Act ..." : "Act ?";
+    badge.title = actions.length ? actions.map(action => [
+      `Action: ${action.name ?? "N/D"}`, `ID: ${action.id ?? "N/D"}`, `Status: ${action.status ?? "N/D"}`,
+      `Owner: ${action.owner || "N/D"}`, `Email: ${action.ownerEmail || "N/D"}`, `Workload: ${action.workloadName || "N/D"}`,
+      `Description: ${action.workloadDescription || "N/D"}`, `Start: ${action.startDate || "N/D"}`, `End: ${action.endDate || "N/D"}`
+    ].join("\n")).join("\n\n") : state === "missing" ? "No actions found for this opportunity's products."
+      : state === "loading" ? "Loading workload actions..." : "Unable to confirm workload actions. Check product RevnId and Debug Requests.";
+    if (records.some(record => record?.hasNext)) badge.title += "\nAdditional actions exist; pagination is not enabled.";
+    if (!principal) badge.title += "\nTokenrelay principal is unavailable; ownership cannot be verified.";
+    else if (actions.length && state === "missing") badge.title += "\nNone of the returned actions belong to the signed-in principal.";
+    if (actions.length && (pending || uncertain)) badge.title += "\nSome workloads are still loading or could not be fully checked.";
+    badge.tabIndex = 0;
+    badge.setAttribute("aria-label", badge.title);
+    return badge;
+  }
+  return { reset, reopen, loadProducts, createBadge };
+}
diff --git a/src/features/products/content-jobs.js b/src/features/products/content-jobs.js
index c5b29e9..31a4dea 100644
--- a/src/features/products/content-jobs.js
+++ b/src/features/products/content-jobs.js
@@ -7,10 +7,43 @@ function createProductsContentJobs({
   preferencesState,
   productsContentState,
   renderOpportunitiesTable,
+  loadWorkloadActions,
   sendRuntimeMessage,
   environment
 }) {
-  const { browser, chrome, document, window } = environment;
+  const { browser, chrome, document, window, setTimeout, clearTimeout, matchMedia } = environment;
+  let completion = null;
+  function updateCompletionVisibility(badge) {
+    const requestId = productsContentState.currentProductsRequestId;
+    const complete = productsContentState.productsProgress.state === "complete";
+    if (completion && (!complete || completion.requestId !== requestId || completion.badge !== badge)) {
+      clearTimeout(completion.waitTimer);
+      clearTimeout(completion.hideTimer);
+      completion.badge.setAttribute("data-fading", "false");
+      completion = null;
+    }
+    if (!complete) {
+      badge.setAttribute("data-fading", "false");
+      return;
+    }
+    if (completion) {
+      badge.hidden = completion.hidden;
+      return;
+    }
+    const current = { requestId, badge, hidden: false, waitTimer: null, hideTimer: null };
+    completion = current;
+    badge.setAttribute("data-fading", "false");
+    current.waitTimer = setTimeout(() => {
+      if (completion !== current) return;
+      badge.setAttribute("data-fading", "true");
+      const reducedMotion = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+      current.hideTimer = setTimeout(() => {
+        if (completion !== current) return;
+        current.hidden = true;
+        badge.hidden = true;
+      }, reducedMotion ? 0 : 300);
+    }, 5000);
+  }
   function requestOpptyProductsInBackground(opportunities, token) {
     const optyNumbers = Array.from(new Set(opportunities
       .map((item) => item && item.OptyNumber)
@@ -86,6 +119,7 @@ function createProductsContentJobs({
           cachedAt: Number(message.cachedAt) || 0,
           error: message.error || ""
         });
+        loadWorkloadActions(productsContentState.opptyProductsByNumber.get(String(message.optyNumber)));
       }
 
       if (Number(message.cachedAt) > productsContentState.productsLastCachedAt) {
@@ -130,6 +164,7 @@ function createProductsContentJobs({
     } else {
       badge.textContent = "Products ready 0";
     }
+    updateCompletionVisibility(badge);
 
     const timestamp = document.getElementById(PRODUCTS_CACHE_TIMESTAMP_ID);
 
diff --git a/src/services/spa/workload-actions.js b/src/services/spa/workload-actions.js
new file mode 100644
index 0000000..91259ef
--- /dev/null
+++ b/src/services/spa/workload-actions.js
@@ -0,0 +1,29 @@
+function createSpaWorkloadActions({ fetchJson }) {
+  async function requestWlActions(message) {
+    const debugRequests = [];
+    try {
+      const revnId = String(message.revnId ?? "").trim();
+      const token = message.authorization?.value;
+      if (!/^\d+$/.test(revnId)) throw new Error("A numeric RevnId is required.");
+      if (typeof token !== "string" || !token.trim()) throw new Error("WWB-TS uiaasHeader.value is unavailable.");
+      const url = `https://spa.oracle.com/oalcrm/web/api/provider-proxy/wwb-provider/service/workbench-proxy/wwb/mgmt/actions?parentType=WORKLOAD&parentId=${encodeURIComponent(revnId)}`;
+      const result = await fetchJson(url, {
+        method: "GET", credentials: "include",
+        headers: { Accept: "application/json", "Wwb-Provider-Authorization": token.trim() }
+      }, "requestWlActions", debugRequests);
+      if (!result || !Array.isArray(result.actions) || typeof result.hasNext !== "boolean"
+        || result.actions.some(item => !item || typeof item !== "object" || Array.isArray(item))) {
+        throw new Error("requestWlActions returned an invalid collection.");
+      }
+      return { ok: true, actions: result.actions, hasNext: result.hasNext, debugRequests };
+    } catch (error) {
+      error.debugRequests = debugRequests;
+      throw error;
+    } finally {
+      for (const entry of debugRequests) {
+        if (entry.requestHeaders?.["Wwb-Provider-Authorization"]) entry.requestHeaders["Wwb-Provider-Authorization"] = "(present)";
+      }
+    }
+  }
+  return { requestWlActions };
+}
diff --git a/src/shared/messages.js b/src/shared/messages.js
index ee2a2ef..918d46b 100644
--- a/src/shared/messages.js
+++ b/src/shared/messages.js
@@ -10,6 +10,7 @@ function createMessageTypes() {
     requestAccountPlans: "opportunitiesExtension.requestAccountPlans",
     requestInstallBase: "opportunitiesExtension.requestInstallBase",
     requestCustomerServiceRequest: "opportunitiesExtension.requestCustomerServiceRequest",
+    requestWlActions: "opportunitiesExtension.requestWlActions",
     requestConsumptionTrend: "opportunitiesExtension.requestConsumptionTrend",
     requestConsumptionPlanDetail: "opportunitiesExtension.requestConsumptionPlanDetail",
     requestRatecardByPlan: "opportunitiesExtension.requestRatecardByPlan"
diff --git a/tests/crmServiceRequests.test.cjs b/tests/crmServiceRequests.test.cjs
index 2c84bc6..cbef906 100644
--- a/tests/crmServiceRequests.test.cjs
+++ b/tests/crmServiceRequests.test.cjs
@@ -3,7 +3,7 @@ const { test } = require("node:test");
 const { loadApplication } = require("./support/application.cjs");
 const response = data => new Response(JSON.stringify(data), { status: 200 });
 function setup(fetch) {
-  const document = { createElement: () => ({ attributes: {}, setAttribute(key, value) { this.attributes[key] = value; } }) };
+  const document = { createElement: () => ({ attributes: {}, addEventListener() {}, setAttribute(key, value) { this.attributes[key] = value; } }) };
   const app = loadApplication("content", { fetch, document, Intl, Date });
   app.debugContentView.renderDebugPanel = () => {};
   app.opportunitiesQueryState.periodRequestVersion = 1;
@@ -81,7 +81,7 @@ test("CRM query preserves payload, paginates before opportunities, uses tokenrel
   assert.equal(found.textContent, "\u2705 SR");
   assert.equal(found.attributes["data-state"], "matched");
   for (const detail of ["SR-0", "SR-1", "Reported Hours: 0", "Test Owner", "test@example.invalid", "<script>synthetic</script>"])
-    assert.ok(found.title.includes(detail));
+    assert.ok(found.attributes["aria-label"].includes(detail));
   assert.equal(app.opportunityCrmServiceRequests.createBadge("OTHER").textContent, "\u26d4 SR");
   assert.equal(app.opportunityCrmServiceRequests.createBadge(null), null);
   app.opportunityCrmServiceRequests.reset();
diff --git a/tests/crmSrPopover.test.cjs b/tests/crmSrPopover.test.cjs
new file mode 100644
index 0000000..b25181d
--- /dev/null
+++ b/tests/crmSrPopover.test.cjs
@@ -0,0 +1,105 @@
+const assert = require("node:assert/strict");
+const { test } = require("node:test");
+const { loadApplication } = require("./support/application.cjs");
+
+function setup() {
+  const document = { activeElement: null, listeners: new Map() };
+  const window = { innerWidth: 400, innerHeight: 600, listeners: new Map(), setTimeout, clearTimeout };
+  for (const target of [document, window]) {
+    target.addEventListener = (key, fn) => target.listeners.set(key, fn);
+    target.removeEventListener = key => target.listeners.delete(key);
+  }
+  const walk = node => [node, ...node.children.flatMap(walk)];
+  function element(tag) {
+    return {
+      tag, children: [], attributes: {}, listeners: {}, style: {}, textContent: "",
+      append(...nodes) { nodes.forEach(node => { node.parent = this; this.children.push(node); }); },
+      remove() { this.parent.children = this.parent.children.filter(node => node !== this); this.parent = null; },
+      setAttribute(key, value) { this.attributes[key] = value; },
+      addEventListener(key, fn) { this.listeners[key] = fn; },
+      contains(target) { return walk(this).includes(target); },
+      get isConnected() { return this === modal || !!this.parent?.isConnected; },
+      getBoundingClientRect() { return { left: 350, bottom: 550, height: 250 }; },
+      querySelector() { return walk(this).find(node => node.tag === "a" || node.tag === "button"); },
+      focus() { document.activeElement = this; this.listeners.focus?.(); }
+    };
+  }
+  const modal = element("main");
+  Object.assign(document, {
+    createElement: element, createElementNS: (_, tag) => element(tag),
+    getElementById: id => id === "opportunities-extension-modal" ? modal : null
+  });
+  const copied = [];
+  const app = loadApplication("content", { document, window, setTimeout, clearTimeout,
+    navigator: { clipboard: { writeText: async value => copied.push(value) } } });
+  // Keep the copy test independent of the toast's own DOM/timer implementation.
+  modal.querySelector = () => ({ classList: { toggle() {} } });
+  window.setTimeout = () => 0;
+  app.fusionCrmServiceRequests.requestCrmServiceRequest = async () => [
+    { SrId: "NOT-THE-URL-ID", SrNumber: "SR /?&1", Title: "<script>synthetic</script>",
+      ReportedHours_c: 0, OpportunityName_Id_c: { OptyNumber: "OP1" } },
+    { SrNumber: "SR2", OpportunityName_Id_c: { OptyNumber: "OP1" } }
+  ];
+  app.opportunitiesQueryState.periodRequestVersion = 1;
+  const panel = () => modal.children.find(node => node.className === "opportunities-extension-sr-popover");
+  return { app, document, window, modal, walk, copied, panel };
+}
+
+test("SR popover uses encoded SrNumber, safe details and existing copy control for every record", async () => {
+  const { app, modal, walk, copied, panel } = setup();
+  await app.opportunityCrmServiceRequests.load("synthetic", 1);
+  const badge = app.opportunityCrmServiceRequests.createBadge("OP1");
+  modal.append(badge);
+  badge.listeners.pointerenter();
+  const nodes = walk(panel());
+  const links = nodes.filter(node => node.tag === "a");
+  assert.equal(links.length, 2);
+  for (const link of links) {
+    assert.equal(link.parent.children[0].textContent, "SR Number:");
+    assert.equal(link.parent.children[2].className, "opportunities-extension-copy-button");
+  }
+  const details = nodes.filter(node => node.className === "opportunities-extension-sr-details");
+  assert.equal(details.length, 2);
+  details.forEach(node => assert.doesNotMatch(node.textContent, /SR Number:|SR \/\?&1|SR2/));
+  assert.equal(links[0].href, "https://eeho.fa.us2.oraclecloud.com/fscmUI/redwood/service/ec/container/sr/edit?srNumber=SR%20%2F%3F%261");
+  assert.equal(links[0].rel, "noopener noreferrer");
+  assert.equal(links[0].target, "_blank");
+  assert.ok(nodes.some(node => node.textContent.includes("<script>synthetic</script>")));
+  assert.equal(nodes.some(node => node.tag === "script"), false);
+  const copies = nodes.filter(node => node.className === "opportunities-extension-copy-button");
+  assert.equal(copies.length, 2);
+  assert.equal(copies[0].title, "Copy SR number");
+  copies[0].listeners.click({ preventDefault() {}, stopPropagation() {} });
+  await Promise.resolve();
+  assert.deepEqual(copied, ["SR /?&1"]);
+  assert.equal(panel().style.width, "376px");
+  app.opportunityCrmServiceRequests.reset();
+  assert.equal(panel(), undefined);
+});
+
+test("SR popover pins on click, closes on Escape/outside/scroll/reset and removes global listeners", async () => {
+  const { app, modal, document, window, panel } = setup();
+  await app.opportunityCrmServiceRequests.load("synthetic", 1);
+  const badge = app.opportunityCrmServiceRequests.createBadge("OP1");
+  modal.append(badge);
+  badge.listeners.click({ stopPropagation() {} });
+  assert.equal(badge.attributes["aria-expanded"], "true");
+  assert.ok(panel().contains(document.activeElement));
+  document.listeners.get("keydown")({ key: "Escape", preventDefault() {}, stopPropagation() {} });
+  assert.equal(panel(), undefined);
+  assert.equal(document.activeElement, badge);
+  assert.equal(document.listeners.size, 0);
+  assert.equal(window.listeners.size, 0);
+  badge.listeners.pointerenter();
+  document.listeners.get("pointerdown")({ target: modal });
+  assert.equal(panel(), undefined);
+  badge.listeners.pointerenter();
+  document.listeners.get("scroll")({ target: panel() });
+  assert.ok(panel(), "scroll inside the tooltip keeps it open");
+  document.listeners.get("scroll")({ target: modal });
+  assert.equal(panel(), undefined);
+  badge.listeners.pointerenter();
+  app.opportunityCrmServiceRequests.reset();
+  assert.equal(panel(), undefined);
+  assert.equal(document.listeners.size, 0);
+});
diff --git a/tests/opportunityTable.test.cjs b/tests/opportunityTable.test.cjs
index cdce2b3..06441ca 100644
--- a/tests/opportunityTable.test.cjs
+++ b/tests/opportunityTable.test.cjs
@@ -127,7 +127,7 @@ test("CRM SR badge follows Ramp Months and remains visible while product data is
   h.app.productsContentState.opptyProductsByNumber.set("TEST-1", { items: [{ RampMonths_c: 3 }] });
   h.app.opportunitiesTable.renderOpportunitiesTable();
   const actions = h.cell("name").children[0].children[1];
-  assert.deepEqual(actions.children.map(child => child.textContent), ["1", "RM 3", "\u2705 SR"]);
+  assert.deepEqual(actions.children.map(child => child.textContent), ["1", "RM 3", "\u2705 SR", "Act ?"]);
   findClass(h.cell("name"), "opportunities-extension-products-count").click();
   assert.ok(findClass(h.rows()[1], "opportunities-extension-products-table"));
 });
diff --git a/tests/productsProgressFade.test.cjs b/tests/productsProgressFade.test.cjs
new file mode 100644
index 0000000..3178b3c
--- /dev/null
+++ b/tests/productsProgressFade.test.cjs
@@ -0,0 +1,109 @@
+const assert = require("node:assert/strict");
+const { test } = require("node:test");
+const { loadApplication } = require("./support/application.cjs");
+
+function fixture(reduced = false) {
+  let now = 0, nextId = 0;
+  const timers = new Map();
+  const badge = { hidden: false, attributes: {}, setAttribute(key, value) { this.attributes[key] = value; } };
+  const timestamp = {};
+  const app = loadApplication("content", {
+    document: { getElementById: id => id === app.contracts.PRODUCTS_PROGRESS_ID ? badge : timestamp, querySelector: () => badge },
+    setTimeout: (fn, delay) => { const id = ++nextId; timers.set(id, { fn, at: now + delay }); return id; },
+    clearTimeout: id => timers.delete(id), matchMedia: () => ({ matches: reduced })
+  });
+  const render = state => {
+    app.productsContentState.productsProgress = { state, completed: 2, total: 2, failed: 0, cacheHits: 0 };
+    app.productsContentJobs.renderProductsProgress();
+  };
+  function advance(ms) {
+    const end = now + ms;
+    while (true) {
+      const entry = [...timers].filter(([, timer]) => timer.at <= end).sort((a, b) => a[1].at - b[1].at)[0];
+      if (!entry) break;
+      now = entry[1].at;
+      timers.delete(entry[0]);
+      entry[1].fn();
+    }
+    now = end;
+  }
+  app.productsContentState.currentProductsRequestId = "first";
+  app.productsContentState.productsLastCachedAt = 1;
+  return { app, badge, timestamp, render, advance, timers };
+}
+
+test("Products ready stays for five seconds then fades for 300ms before hidden", () => {
+  const h = fixture();
+  h.render("complete");
+  h.advance(4999);
+  assert.equal(h.badge.hidden, false);
+  assert.equal(h.badge.attributes["data-fading"], "false");
+  h.render("complete");
+  h.advance(1);
+  assert.equal(h.badge.attributes["data-fading"], "true");
+  assert.equal(h.badge.hidden, false);
+  h.advance(300);
+  assert.equal(h.badge.hidden, true);
+  h.render("complete");
+  assert.equal(h.badge.hidden, true, "rerenders do not restart the completion timer");
+  assert.equal(h.timestamp.hidden, false, "Last update remains visible");
+});
+
+test("new product jobs cancel a pending fade and errors remain visible", () => {
+  const h = fixture();
+  h.render("complete");
+  h.advance(5000);
+  h.app.productsContentState.currentProductsRequestId = "second";
+  h.render("running");
+  h.advance(10000);
+  assert.equal(h.badge.hidden, false);
+  assert.equal(h.badge.attributes["data-fading"], "false");
+  assert.equal(h.timers.size, 0);
+  for (const state of ["complete-with-errors", "error"]) {
+    h.render(state);
+    h.advance(10000);
+    assert.equal(h.badge.hidden, false);
+  }
+  h.render("complete");
+  h.advance(5300);
+  assert.equal(h.badge.hidden, true);
+});
+
+test("reduced motion hides at five seconds without an animated delay", () => {
+  const h = fixture(true);
+  h.render("complete");
+  h.advance(5000);
+  assert.equal(h.badge.hidden, true);
+});
+
+test("Authenticated fades after five seconds without restarting on repeated status updates", () => {
+  const h = fixture();
+  const update = () => h.app.contentModal.updateAuthBadge(h.app.contracts.AUTH_STATUS.authenticated);
+  update();
+  h.advance(4999);
+  assert.equal(h.badge.hidden, false);
+  update();
+  h.advance(1);
+  assert.equal(h.badge.attributes["data-fading"], "true");
+  h.advance(300);
+  assert.equal(h.badge.hidden, true);
+  update();
+  assert.equal(h.badge.hidden, true);
+  h.app.contentModal.updateAuthBadge(h.app.contracts.AUTH_STATUS.unauthenticated);
+  h.advance(10000);
+  assert.equal(h.badge.hidden, false);
+  assert.equal(h.badge.attributes["data-fading"], "false");
+  update();
+  h.advance(5000);
+  h.app.contentModal.updateAuthBadge(h.app.contracts.AUTH_STATUS.pending);
+  h.advance(300);
+  assert.equal(h.badge.hidden, false);
+  assert.equal(h.badge.textContent, "Authenticating");
+});
+
+test("Authenticated respects reduced motion", () => {
+  const h = fixture(true);
+  h.app.contentModal.updateAuthBadge(h.app.contracts.AUTH_STATUS.authenticated);
+  h.advance(5000);
+  assert.equal(h.badge.hidden, true);
+});
diff --git a/tests/workloadActions.test.cjs b/tests/workloadActions.test.cjs
new file mode 100644
index 0000000..8285431
--- /dev/null
+++ b/tests/workloadActions.test.cjs
@@ -0,0 +1,185 @@
+const assert = require("node:assert/strict");
+const { test } = require("node:test");
+const { loadBackground, response } = require("./support/characterization.cjs");
+const { loadApplication } = require("./support/application.cjs");
+const flush = () => new Promise(resolve => setImmediate(resolve));
+
+for (const family of ["chrome", "firefox"]) {
+  test(`${family}: WWB-TS selection, fixed workload header, first-page GET and masked debug`, async () => {
+    const calls = [];
+    const h = loadBackground({ family, fetch: async (url, options) => {
+      calls.push({ url, options });
+      if (url.endsWith("consumerTokenService")) return response([
+        { tokenService: "ACCP-TS", uiaasHeader: { value: "summary" } },
+        { tokenService: "OCICONS-TS", uiaasHeader: { value: "consumption" } },
+        { tokenService: "WWB-TS", uiaasHeader: { label: "ignored-label", value: "synthetic-wwb" } }
+      ]);
+      return response({ actions: [{ id: 1, name: "TEST" }], totalCount: 20, hasNext: true });
+    } });
+    const auth = await h.dispatch({ type: "opportunitiesExtension.requestConsumerTokenService" });
+    assert.equal(auth.authorizations.workloadActions.value, "synthetic-wwb");
+    const result = await h.dispatch({ type: "opportunitiesExtension.requestWlActions", revnId: "12345", authorization: auth.authorizations.workloadActions });
+    assert.equal(result.ok, true);
+    assert.equal(result.hasNext, true);
+    assert.equal(result.actions.length, 1);
+    assert.equal(calls.length, 2, "no pagination");
+    assert.equal(calls[1].url, "https://spa.oracle.com/oalcrm/web/api/provider-proxy/wwb-provider/service/workbench-proxy/wwb/mgmt/actions?parentType=WORKLOAD&parentId=12345");
+    assert.equal(calls[1].options.method, "GET");
+    assert.equal(calls[1].options.headers["Wwb-Provider-Authorization"], "synthetic-wwb");
+    assert.equal(calls[1].options.headers.Authorization, undefined);
+    assert.equal(result.debugRequests[0].name, "requestWlActions");
+    assert.equal(result.debugRequests[0].requestHeaders["Wwb-Provider-Authorization"], "(present)");
+  });
+}
+
+test("workload actions reject missing credentials, invalid ids, HTTP/network/JSON failures", async () => {
+  for (const fetch of [
+    async () => { throw new Error("Synthetic network failure"); },
+    async () => new Response("Denied", { status: 401 }),
+    async () => new Response("Denied", { status: 403 }),
+    async () => new Response("<html>Login</html>"),
+    async () => response({ actions: null, hasNext: false })
+  ]) {
+    const h = loadBackground({ fetch });
+    const result = await h.dispatch({ type: "opportunitiesExtension.requestWlActions", revnId: "123", authorization: { value: "synthetic" } });
+    assert.equal(result.ok, false);
+    assert.equal(result.debugRequests.length, 1);
+  }
+  const h = loadBackground({ fetch: () => assert.fail("Unexpected network") });
+  for (const fields of [{ revnId: "123" }, { revnId: "bad&id=2", authorization: { value: "synthetic" } }]) {
+    assert.equal((await h.dispatch({ type: "opportunitiesExtension.requestWlActions", ...fields })).ok, false);
+  }
+});
+
+function contentFixture(send) {
+  const app = loadApplication("content", { document: { createElement: () => ({ attributes: {}, setAttribute(k, v) { this.attributes[k] = v; } }) } });
+  app.authContentSession.requestConsumerTokenServiceOnce = async () => ({ workloadActions: { value: "synthetic-wwb" } });
+  app.authSessionState.principal = "test@example.invalid";
+  app.platformContentMessages.sendRuntimeMessage = send;
+  app.debugContentView.renderDebugPanel = () => {};
+  app.productsContentJobs.queueProductsTableRender = () => {};
+  return app;
+}
+
+test("actions aggregate all products, share RevnId queries across Reference changes and restart on reopen", async () => {
+  const calls = [];
+  const app = contentFixture(async message => {
+    calls.push(message);
+    return { ok: true, hasNext: false, actions: message.revnId === "1" ? [{ id: 1, owner: "test@example.invalid", name: "<script>safe</script>" }] : [] };
+  });
+  const products = { items: [{ RevnId: "1" }, { RevnId: 2 }, { RevnId: "1" }] };
+  app.productsContentState.opptyProductsByNumber.set("A", products);
+  app.opportunityWorkloadActions.loadProducts(products);
+  assert.equal(app.opportunityWorkloadActions.createBadge("A").textContent, "Act ...");
+  await flush();
+  assert.equal(calls.length, 2);
+  assert.equal(calls[0].authorization.value, "synthetic-wwb");
+  const badge = app.opportunityWorkloadActions.createBadge("A");
+  assert.equal(badge.textContent, "\u2705 Act");
+  assert.match(badge.title, /<script>safe<\/script>/);
+  app.opportunityWorkloadActions.loadProducts(products);
+  await flush();
+  assert.equal(calls.length, 2);
+  app.productsContentState.opptyProductsByNumber.set("B", { items: [{ RevnId: 2 }] });
+  assert.equal(app.opportunityWorkloadActions.createBadge("B").textContent, "\u26d4 Act");
+  app.opportunityWorkloadActions.reset(false);
+  app.opportunityWorkloadActions.loadProducts(products);
+  await flush();
+  assert.equal(calls.length, 2);
+  app.opportunityWorkloadActions.reopen();
+  await flush();
+  assert.equal(calls.length, 4);
+  assert.equal(app.debugContentView.getRequestCategory({ name: "requestWlActions" }), "actions");
+});
+
+test("errors, missing ids and partial empty pages never appear as confirmed absence", async () => {
+  for (const result of [{ ok: false, error: "Synthetic" }, { ok: true, actions: [], hasNext: true }]) {
+    const app = contentFixture(async () => result);
+    const products = { items: [{ RevnId: "1" }] };
+    app.productsContentState.opptyProductsByNumber.set("A", products);
+    app.opportunityWorkloadActions.loadProducts(products);
+    await flush();
+    assert.equal(app.opportunityWorkloadActions.createBadge("A").textContent, "Act ?");
+    app.productsContentState.opptyProductsByNumber.set("A", { items: [{}] });
+    assert.equal(app.opportunityWorkloadActions.createBadge("A").textContent, "Act ?");
+  }
+});
+
+test("Act requires an owner matching tokenrelay principal while tooltip retains every action", async () => {
+  const actions = [
+    { id: 1, name: "Other action", owner: "other@example.invalid", ownerEmail: "test@example.invalid" },
+    { id: 2, name: "My action", owner: "test@example.invalid", ownerEmail: "different@example.invalid" }
+  ];
+  const app = contentFixture(async () => ({ ok: true, actions, hasNext: false }));
+  const products = { items: [{ RevnId: "1" }] };
+  app.productsContentState.opptyProductsByNumber.set("A", products);
+  app.opportunityWorkloadActions.loadProducts(products);
+  await flush();
+  const badge = () => app.opportunityWorkloadActions.createBadge("A");
+  assert.equal(badge().textContent, "\u2705 Act");
+  assert.match(badge().title, /Other action/);
+  assert.match(badge().title, /My action/);
+  app.authSessionState.principal = "different@example.invalid";
+  assert.equal(badge().textContent, "\u26d4 Act", "ownerEmail must not determine ownership");
+  assert.match(badge().title, /Other action/);
+  assert.match(badge().title, /My action/);
+  app.authSessionState.principal = "";
+  assert.equal(badge().textContent, "Act ?");
+});
+
+test("general tokenrelay retains principal without changing access-token return or accepting sales-common identity", async () => {
+  let payload = { access_token: "synthetic-token", principal: "test@example.invalid" };
+  const app = loadApplication("content", { fetch: async () => response(payload) });
+  app.authXsrfContent.getXsrfToken = async () => ({ token: "synthetic-xsrf" });
+  app.debugContentView.renderDebugPanel = () => {};
+  assert.equal(await app.authTokenRelay.requestTokenRelay(), "synthetic-token");
+  assert.equal(app.authSessionState.principal, "test@example.invalid");
+  payload = { access_token: "scoped-token", principal: "other@example.invalid", expires_in: 3600 };
+  await app.authTokenRelay.requestTokenRelay({ url: `${app.contracts.TOKEN_RELAY_URL}?scopesfq=synthetic`, includeExpiry: true });
+  assert.equal(app.authSessionState.principal, "test@example.invalid");
+  payload = { access_token: "synthetic-token" };
+  await app.authTokenRelay.requestTokenRelay();
+  assert.equal(app.authSessionState.principal, "");
+});
+
+test("actions queue caps concurrency and discards results/queued jobs from closed modals", async () => {
+  const pending = [];
+  const app = contentFixture(() => new Promise(resolve => pending.push(resolve)));
+  const products = { items: Array.from({ length: 8 }, (_, i) => ({ RevnId: String(i + 1) })) };
+  app.productsContentState.opptyProductsByNumber.set("A", products);
+  app.opportunityWorkloadActions.loadProducts(products);
+  await flush();
+  assert.equal(pending.length, 4);
+  app.opportunityWorkloadActions.reset(false);
+  pending.forEach(resolve => resolve({ ok: true, hasNext: false, actions: [{ id: 1 }] }));
+  await flush();
+  assert.equal(pending.length, 4);
+  assert.equal(app.opportunityWorkloadActions.createBadge("A"), null);
+});
+
+test("product progress triggers Actions for cached products and ignores stale product jobs", async () => {
+  let listener;
+  const calls = [];
+  const app = loadApplication("content", {
+    document: { getElementById: () => null },
+    window: { requestAnimationFrame() {} },
+    chrome: { runtime: { onMessage: { addListener(fn) { listener = fn; } } } }
+  });
+  app.authContentSession.requestConsumerTokenServiceOnce = async () => ({ workloadActions: { value: "synthetic" } });
+  app.platformContentMessages.sendRuntimeMessage = async message => {
+    calls.push(message);
+    return { ok: true, actions: [], hasNext: false };
+  };
+  app.productsContentState.currentProductsRequestId = "current";
+  app.productsContentJobs.ensureProductsBackgroundMessageHandler();
+  const message = { type: app.messageTypes?.opptyProductsProgress || "opportunitiesExtension.opptyProductsProgress",
+    requestId: "current", optyNumber: "A", items: [{ RevnId: "123" }], fromCache: true };
+  listener({ ...message, requestId: "old" });
+  await flush();
+  assert.equal(calls.length, 0);
+  listener(message);
+  await flush();
+  assert.equal(calls.length, 1);
+  assert.equal(calls[0].type, "opportunitiesExtension.requestWlActions");
+  assert.equal(calls[0].revnId, "123");
+});