@layer compat {
  .ss-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 12px 16px;
    background: #131517 !important;
    border-radius: var(--r-sm);
    color: var(--muted);
    font-size: var(--fs-13);
  }

  .ss-loading__dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--ui-2);
    animation: ss-loading-pulse 1.2s infinite ease-in-out;
  }

  .ss-loading__dot:nth-child(2) { animation-delay: 0.15s; }
  .ss-loading__dot:nth-child(3) { animation-delay: 0.30s; }

  @keyframes ss-loading-pulse {
    0%, 80%, 100% {
      transform: scale(0);
      opacity: 0.35;
    }
    40% {
      transform: scale(1);
      opacity: 1;
    }
  }

  .ss-error {
    padding: 1.75em 2em 2em !important;
    border-radius: 10px;
    color: #fff !important;
    font-size: var(--fs-16);
    font-weight: 500;
    background: #151a1c;
    margin: .75em 1px 1px;
  }

  .ss-error p { margin: 0; }

  .report-section-inner {
    background: var(--ui-0);
    border-radius: var(--r-md);
    padding: 18px 20px 16px;
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border-subtle);
  }

  .report-section-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
  }

  .report-section-header h2 { margin: 0; font-size: var(--fs-14); }
  .report-section-header p { margin: 0; color: var(--muted); font-size: var(--fs-12); }

  .report-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 15px; }

  body[data-ss-view="server_ops"] .section-security-headers  {
      padding-left: 20px;
      border-left: 1px solid #555;
      border-radius: 0 0 0 5px
    }

    body[data-ss-view="weekly"] .report-plugins-wrapper,
    body[data-ss-view="server_ops"] .report-plugins-wrapper { gap: 10px !important; }

    body[data-ss-view="weekly"] div[data-section="security"] .section-security-headers,
    body[data-ss-view="server_ops"] div[data-section="security"] .section-security-headers,
    body[data-ss-view="seo"] div[data-section="security"] .section-security-headers,
    body[data-ss-view="performance"] div[data-section="security"] .section-security-headers,
    body[data-ss-view="go_live"] div[data-section="security"] .section-security-headers,    
    body[data-ss-view="security"] div[data-section="security"] .section-security-headers {
      padding-left: 20px;
      border-left: 1px solid #555;
      border-radius: 0 0 0 5px
    }

    body[data-ss-view="weekly"] .report-grid,
    body[data-ss-view="server_ops"] .report-grid,
    body[data-ss-view="seo"] .report-grid,
    body[data-ss-view="performance"] .report-grid,
    body[data-ss-view="go_live"] .report-grid,
    body[data-ss-view="security"] .report-grid {
      /* display: flex;
      flex-direction: column; */
    }

      body[data-ss-view="weekly"] .report-section h2,
      body[data-ss-view="server_ops"] .report-section h2,
      body[data-ss-view="seo"] .report-section h2,
      body[data-ss-view="performance"] .report-section h2,
      body[data-ss-view="go_live"] .report-section h2,
      body[data-ss-view="security"] .report-section h2  { font-size: 21px; }

      body[data-ss-view="weekly"] .report-plugins-wrapper,
      body[data-ss-view="server_ops"] .report-plugins-wrapper,
      body[data-ss-view="seo"] .report-plugins-wrapper,
      body[data-ss-view="performance"] .report-plugins-wrapper,
      body[data-ss-view="go_live"] .report-plugins-wrapper,
      body[data-ss-view="security"] .report-plugins-wrapper {
        display: flex !important;
        flex-direction: column;
        gap: 0 !important;
      }
      body[data-ss-view="weekly"] div[data-section="updates"],
      body[data-ss-view="server_ops"] div[data-section="updates"],
      body[data-ss-view="seo"] div[data-section="updates"],
      body[data-ss-view="performance"] div[data-section="updates"],
      body[data-ss-view="go_live"] div[data-section="updates"],
      body[data-ss-view="security"] div[data-section="updates"] { display: none; }

}