* { margin: 0; padding: 0; box-sizing: border-box; }
    body {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
      background: #f5f5f7;
      color: #1c1c1e;
      line-height: 1.4;
    }
    .app { max-width: 1280px; margin: 0 auto; padding: 20px; }

    /* Header */
    .header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 16px;
      margin-bottom: 32px;
      padding-bottom: 16px;
      border-bottom: 1px solid #e9e9ef;
    }
    .logo h1 {
      font-size: 1.6rem;
      font-weight: 600;
      background: linear-gradient(135deg, #1c1c1e, #3a3a3e);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .logo p { font-size: 0.85rem; color: #8e8e93; }
    .upgrade-btn {
      background: #ff9500;
      color: white;
      border: none;
      padding: 8px 20px;
      border-radius: 40px;
      font-weight: 600;
      cursor: pointer;
      transition: 0.2s;
    }
    .upgrade-btn:hover { background: #e68600; }
    .upgrade-btn.plan-top {
      background: #1c1c1e;
      color: #f5f5f7;
    }
    .upgrade-btn.plan-top:hover { background: #3a3a3c; }
    .upgrade-btn .upgrade-plan-name {
      font-weight: 700;
    }
    .upgrade-btn .upgrade-plan-sep {
      opacity: 0.75;
      font-weight: 500;
      margin: 0 0.35em;
    }
    .upgrade-btn.has-complimentary {
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      padding: 7px 18px;
      line-height: 1.15;
    }
    .upgrade-btn .upgrade-plan-row {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
    }
    .upgrade-btn .upgrade-plan-subline {
      display: block;
      font-size: 0.68rem;
      font-weight: 600;
      opacity: 0.92;
      letter-spacing: 0.01em;
    }
    .first-run-banner {
      display: none;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      background: linear-gradient(135deg, #eff6ff, #f0fdf4);
      border: 1px solid #bfdbfe;
      border-radius: 14px;
      padding: 10px 12px;
      margin-bottom: 14px;
      color: #0f172a;
      font-size: 0.88rem;
      line-height: 1.35;
    }
    .first-run-banner button {
      border: 1px solid #cbd5e1;
      background: #fff;
      color: #334155;
      border-radius: 999px;
      padding: 4px 10px;
      font-size: 0.75rem;
      font-weight: 600;
      cursor: pointer;
      flex-shrink: 0;
    }
    .first-run-banner button:hover {
      background: #f8fafc;
    }

    /* Top cards */
    .dashboard-grid { display: flex; gap: 24px; flex-wrap: wrap; margin-bottom: 32px; }
    .health-card {
      flex: 2;
      background: white;
      border-radius: 24px;
      padding: 20px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
      min-width: 220px;
      overflow: hidden;
    }
    .credits-card {
      flex: 1;
      background: white;
      border-radius: 24px;
      padding: 20px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
      min-width: 160px;
      overflow: hidden;
    }
    .revenue-card {
      flex: 1.1;
      background: linear-gradient(140deg, #fff7ed, #fff1d6);
      border: 1px solid #fed7aa;
      border-radius: 24px;
      padding: 20px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
      min-width: 200px;
      overflow: hidden;
    }
    .credits-sticky { position: sticky; top: 20px; }
    .score-circle { display: flex; align-items: baseline; gap: 8px; margin: 16px 0; flex-wrap: wrap; }
    .score-number { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; }
    .score-max { font-size: clamp(0.9rem, 1.5vw, 1.2rem); color: #8e8e93; }
    .progress-bar { background: #e9e9ef; border-radius: 20px; height: 8px; width: 100%; margin: 12px 0; }
    .progress-fill { border-radius: 20px; height: 8px; width: 0%; transition: width 0.6s ease; }
    .credit-box { background: #f9f9fb; border-radius: 20px; padding: 16px; text-align: center; margin-top: 12px; transition: background 0.2s; }
    .credit-box.credit-warn { background: #fff4c2; }
    .credit-box.credit-critical { background: #fdf2f1; }
    .credit-count { font-size: clamp(1rem, 2.6vw, 2.2rem); line-height: 1.08; font-weight: 700; color: #ff9500; word-break: break-word; overflow-wrap: break-word; }
    .credit-count.credit-warn { color: #916a00; }
    .credit-count.credit-critical { color: #c0392b; }
    .credit-low-banner { display: none; margin-top: 8px; font-size: 0.75rem; font-weight: 500; border-radius: 8px; padding: 5px 8px; }
    .credit-low-banner.warn { display: block; background: #fff4c2; color: #916a00; }
    .credit-low-banner.critical { display: block; background: #fdf2f1; color: #c0392b; }
    .revenue-big {
      font-size: 2rem;
      font-weight: 900;
      color: #dc2626;
      margin: 10px 0 4px;
      letter-spacing: -0.02em;
    }
    .revenue-sub {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      margin-top: 12px;
      font-size: 0.82rem;
      color: #7c2d12;
    }
    .revenue-sub strong {
      display: block;
      color: #9a3412;
      font-size: 1rem;
      margin-top: 3px;
    }
    .revenue-disclaimer {
      margin-top: 10px;
      font-size: 0.76rem;
      line-height: 1.35;
      color: #9a3412;
      background: rgba(255, 247, 237, 0.8);
      border: 1px solid #fed7aa;
      border-radius: 10px;
      padding: 8px 10px;
    }
    .revenue-card-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
    }
    .revenue-card-title {
      font-size: 0.95rem;
      font-weight: 700;
      color: #0f172a;
    }
    .revenue-risk-badge {
      font-size: 0.72rem;
      font-weight: 700;
      padding: 3px 9px;
      border-radius: 20px;
      background: #f3f4f6;
      color: #6b7280;
    }
    .revenue-risk-badge.risk-low { background: #dcfce7; color: #166534; }
    .revenue-risk-badge.risk-medium { background: #fef3c7; color: #92400e; }
    .revenue-risk-badge.risk-high { background: #fee2e2; color: #991b1b; }
    .revenue-metrics {
      display: flex;
      align-items: stretch;
      gap: 16px;
      margin: 14px 0 4px;
      overflow: hidden;
    }
    .revenue-metric {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 5px;
    }
    .revenue-metric-label {
      font-size: 0.7rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: #9a3412;
      opacity: 0.75;
    }
    .revenue-metric-value {
      font-size: clamp(1.1rem, 2.5vw, 1.9rem);
      font-weight: 800;
      color: #1a1a2e;
      line-height: 1;
      letter-spacing: -0.02em;
      overflow-wrap: break-word;
      word-break: break-word;
    }
    .revenue-metric-risk {
      font-size: clamp(1rem, 2vw, 1.45rem);
      line-height: 1.2;
      overflow-wrap: break-word;
      word-break: break-word;
    }
    .revenue-metric-risk.risk-low    { color: #166534; }
    .revenue-metric-risk.risk-medium { color: #92400e; }
    .revenue-metric-risk.risk-high   { color: #991b1b; }
    .revenue-metric-divider {
      width: 1px;
      align-self: stretch;
      background: rgba(254,215,170,0.8);
      flex-shrink: 0;
    }
    .revenue-statements { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 12px; }
    .revenue-statement { font-size: 0.83rem; color: #9a3412; line-height: 1.4; }
    .revenue-chart-section {
      margin-top: 14px;
      padding-top: 12px;
      border-top: 1px solid rgba(254, 215, 170, 0.7);
    }
    .revenue-pie-wrap {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }
    .revenue-pie {
      width: 88px;
      height: 88px;
      border-radius: 50%;
      flex-shrink: 0;
      box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.85);
    }
    .revenue-pie-legend {
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
      min-width: 120px;
    }
    .revenue-pie-legend-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.78rem;
      color: #7c2d12;
    }
    .revenue-pie-swatch {
      width: 10px;
      height: 10px;
      border-radius: 3px;
      flex-shrink: 0;
    }
    .revenue-pie-legend-item strong {
      margin-left: auto;
      color: #1a1a2e;
      font-weight: 700;
    }
    .credit-reset-countdown {
      margin-top: 10px;
      padding: 10px 12px;
      background: #f0f9ff;
      border: 1px solid #bae6fd;
      border-radius: 12px;
      text-align: center;
    }
    .credit-reset-countdown-value {
      font-size: 1.35rem;
      font-weight: 800;
      color: #0369a1;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }
    .credit-reset-countdown-label {
      margin-top: 4px;
      font-size: 0.72rem;
      color: #64748b;
      line-height: 1.35;
    }
    .top-actions-card {
      background: linear-gradient(140deg, #eff6ff, #f0f9ff);
      border: 1px solid #93c5fd;
      border-radius: 20px;
      box-shadow: 0 10px 28px rgba(14,165,233,0.10);
      padding: 18px 20px;
      margin-top: 22px;
      margin-bottom: 22px;
    }
    .top-actions-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; }
    .top-actions-header h2 { font-size:1rem; font-weight:700; background: linear-gradient(135deg, #0369a1, #0ea5e9); -webkit-background-clip:text; background-clip:text; color:transparent; }
    .top-actions-list { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:12px; }
    .top-action-item { border:1px solid #bfdbfe; border-left:4px solid #0ea5e9; border-radius:14px; padding:12px; background:#fff; display:flex; flex-direction:column; gap:8px; min-height:150px; box-shadow:0 2px 8px rgba(14,165,233,0.07); transition: box-shadow 0.2s, transform 0.15s; }
    .top-action-item:hover { box-shadow:0 6px 18px rgba(14,165,233,0.15); transform:translateY(-2px); }
    .top-action-title { font-size:0.9rem; font-weight:400; color:#0c4a6e; line-height:1.3; }
    .top-action-meta { display:flex; flex-wrap:wrap; gap:6px; }
    .risk-chip, .rollback-chip, .impact-chip-inline { display:inline-flex; align-items:center; border-radius:999px; padding:3px 8px; font-size:0.72rem; font-weight:800; }
    .risk-safe { background:#dcfce7; color:#166534; }
    .risk-caution { background:#ffedd5; color:#9a3412; }
    .risk-manual { background:#e2e8f0; color:#475569; }
    .rollback-chip { background:#dbeafe; color:#1d4ed8; }
    .impact-chip-inline { background:#fef9c3; color:#854d0e; }
    .top-action-outcome { color:#475569; font-size:0.8rem; line-height:1.35; flex:1; }
    .review-fix-btn { border:0; border-radius:10px; background:linear-gradient(135deg,#0ea5e9,#0284c7); color:#fff; padding:8px 10px; font-weight:800; cursor:pointer; box-shadow:0 2px 8px rgba(14,165,233,0.25); transition:0.2s; }
    .review-fix-btn:hover { background:linear-gradient(135deg,#0284c7,#0369a1); box-shadow:0 4px 14px rgba(14,165,233,0.35); }
    .preview-details { display:flex; flex-direction:column; gap:10px; text-align:left; }
    .preview-row { border:1px solid #e5e7eb; border-radius:10px; padding:10px; background:#f8fafc; }
    .preview-label { font-size:0.75rem; font-weight:800; color:#475569; margin-bottom:4px; text-transform:uppercase; }
    .preview-value { color:#111827; font-size:0.88rem; line-height:1.4; white-space:pre-wrap; }
    .preview-proposed-value { display:flex; align-items:flex-start; gap:8px; }
    .preview-proposed-text { flex:1 1 auto; min-width:0; white-space:pre-wrap; }
    .preview-copy-btn { flex:0 0 auto; width:28px; height:28px; border:1px solid #cbd5e1; border-radius:8px; background:#fff; color:#475569; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; margin-top:-2px; }
    .preview-copy-btn:hover { border-color:#0ea5e9; color:#0369a1; background:#f0f9ff; }
    .preview-copy-icon { position:relative; width:14px; height:14px; display:block; }
    .preview-copy-icon::before, .preview-copy-icon::after { content:""; position:absolute; border:1.5px solid currentColor; border-radius:2px; }
    .preview-copy-icon::before { left:1px; top:1px; width:9px; height:11px; opacity:0.55; }
    .preview-copy-icon::after { left:4px; top:4px; width:9px; height:11px; background:#fff; }
    .preview-copy-btn:hover .preview-copy-icon::after { background:#f0f9ff; }
    .preview-image-row { display:grid; grid-template-columns:64px minmax(0, 1fr); gap:10px; align-items:start; }
    .preview-thumb { width:64px; height:64px; object-fit:cover; border-radius:8px; border:1px solid #dbe1ea; background:#fff; }
    .preview-copy { min-width:0; display:flex; flex-direction:column; gap:6px; }
    .preview-note { color:#0f766e; background:#ecfdf5; border:1px solid #99f6e4; border-radius:10px; padding:8px 10px; font-size:0.82rem; }
    .pc-merchant-notices { display:flex; flex-direction:column; gap:8px; margin:10px 0 4px; }
    .pc-merchant-notice {
      border-radius:10px; padding:10px 12px; font-size:0.84rem; line-height:1.4;
      border:1px solid #e2e8f0; background:#f8fafc; color:#334155;
    }
    .pc-merchant-notice.blocking {
      background:#fef2f2; border-color:#fecaca; color:#991b1b;
    }
    .pc-merchant-notice.warning {
      background:#fffbeb; border-color:#fde68a; color:#92400e;
    }
    .pc-merchant-notice.apply-unlocked {
      background:#fff7ed; border-color:#fdba74; color:#9a3412;
    }
    .pc-merchant-notice.info {
      background:#eff6ff; border-color:#bfdbfe; color:#1e3a8a;
    }
    .pc-merchant-notice strong { display:block; margin-bottom:2px; font-size:0.8rem; }
    .preview-warning { color:#9a3412; background:#fff7ed; border:1px solid #fed7aa; border-radius:10px; padding:8px 10px; font-size:0.82rem; }
    .preview-eligibility { border:1px solid #dbe1ea; border-radius:10px; padding:10px; background:#fff; display:flex; flex-direction:column; gap:8px; }
    .preview-eligibility-title { font-size:0.75rem; font-weight:800; color:#475569; text-transform:uppercase; letter-spacing:0.02em; }
    .preview-eligibility-row { display:flex; gap:10px; align-items:flex-start; border-radius:8px; padding:8px 10px; }
    .preview-eligibility-pass { background:#ecfdf5; border:1px solid #bbf7d0; }
    .preview-eligibility-fail { background:#fff7ed; border:1px solid #fed7aa; }
    .preview-eligibility-icon { font-weight:800; width:16px; flex:0 0 16px; line-height:1.35; }
    .preview-eligibility-pass .preview-eligibility-icon { color:#047857; }
    .preview-eligibility-fail .preview-eligibility-icon { color:#c2410c; }
    .preview-eligibility-body { min-width:0; flex:1 1 auto; }
    .preview-eligibility-label { font-size:0.8rem; font-weight:700; color:#111827; margin-bottom:2px; }
    .preview-eligibility-values { display:flex; flex-wrap:wrap; gap:6px 12px; font-size:0.82rem; color:#334155; }
    .preview-eligibility-required { color:#64748b; }
    /* SERP preview & SEO edit modal */
    .serp-preview-box { background:#fff; border:1px solid #dfe1e5; border-radius:10px; padding:14px 16px; margin:4px 0 8px; font-family:Arial,sans-serif; }
    .serp-preview-label { font-size:10px; text-transform:uppercase; color:#888; margin-bottom:6px; letter-spacing:0.5px; }
    .serp-preview-url { font-size:12px; color:#202124; margin-bottom:2px; }
    .serp-url-path { color:#0d652d; }
    .serp-preview-title { font-size:17px; color:#1a0dab; line-height:1.3; margin-bottom:4px; font-weight:400; word-break:break-word; }
    .serp-preview-desc { font-size:13px; color:#4d5156; line-height:1.45; word-break:break-word; }
    .seo-edit-row { border:1px solid #e5e7eb; border-radius:10px; padding:12px; margin:4px 0; background:#fff; }
    .seo-edit-row.seo-row-skipped { opacity:0.4; pointer-events:none; }
    .seo-edit-row-header { display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap; }
    .seo-field-toggle-label { display:flex; align-items:center; gap:4px; font-size:12px; font-weight:600; color:#374151; cursor:pointer; user-select:none; flex-shrink:0; }
    .seo-field-toggle-label input[type=checkbox] { cursor:pointer; }
    .seo-field-label-text { font-size:11px; font-weight:800; text-transform:uppercase; color:#6b7280; flex:1; }
    .seo-char-count { font-size:11px; color:#6b7280; white-space:nowrap; flex-shrink:0; }
    .seo-char-count.over { color:#dc2626; font-weight:700; }
    .seo-char-bar-wrap { height:4px; background:#e5e7eb; border-radius:2px; flex:0 0 80px; min-width:60px; }
    .seo-char-bar { height:100%; border-radius:2px; background:#22c55e; transition:width 0.15s,background 0.15s; }
    .seo-char-bar.yellow { background:#f59e0b; }
    .seo-char-bar.red { background:#ef4444; }
    .seo-edit-existing { font-size:12px; color:#9ca3af; margin-bottom:6px; padding:4px 6px; background:#f9fafb; border-radius:6px; }
    .seo-edit-textarea { width:100%; border:1px solid #d1d5db; border-radius:6px; padding:8px 10px; font-size:13px; resize:vertical; box-sizing:border-box; font-family:inherit; color:#111827; transition:border-color 0.2s; line-height:1.5; }
    .seo-edit-textarea:focus { outline:none; border-color:#6366f1; }
    .seo-url-row { border:1px solid #e5e7eb; border-radius:10px; padding:12px; margin:4px 0; background:#f8fafc; }
    .seo-url-admin-link { display:inline-flex; align-items:center; gap:4px; font-size:12px; color:#4f46e5; text-decoration:none; margin-top:6px; }
    .seo-url-admin-link:hover { text-decoration:underline; }
    .analytics-strip {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      margin-bottom: 28px;
    }
    .store-status-panel {
      display: flex;
      flex-direction: column;
      gap: 8px;
      font-size: 0.82rem;
      line-height: 1.45;
    }
    .store-status-auto {
      padding: 10px 12px;
      border-radius: 10px;
      background: #ecfdf5;
      border: 1px solid #bbf7d0;
      color: #166534;
    }
    .store-status-auto.enterprise-hint {
      background: #eff6ff;
      border-color: #bfdbfe;
      color: #1e40af;
    }
    .store-status-line {
      color: #8e8e93;
      font-size: 0.78rem;
    }
    .store-status-line.is-cached {
      color: #b45309;
    }
    .analytics-panel {
      background: white;
      border-radius: 20px;
      padding: 18px 20px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    }
    .analytics-panel h3 {
      font-size: 0.95rem;
      margin-bottom: 14px;
      color: #111827;
    }
    /* Rollback timeline – collapsible panel */
    .fst-panel { padding: 0; }
    .fst-header { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; cursor:pointer; width:100%; background:transparent; border:0; text-align:left; border-radius:20px; }
    .fst-header:hover { background:#f8fafc; }
    .fst-header-left { display:flex; align-items:center; gap:8px; }
    .fst-header h3 { margin:0; font-size:0.95rem; color:#111827; }
    .fst-count { background:#fee2e2; color:#b91c1c; font-size:0.7rem; font-weight:800; padding:2px 8px; border-radius:999px; }
    .fst-chevron { font-size:1rem; color:#94a3b8; transition:transform 0.2s; }
    .fst-chevron.open { transform:rotate(180deg); }
    .fst-body { border-top:1px solid #f1f5f9; padding:10px 16px 14px; }
    .fst-age-note { font-size:0.72rem; color:#94a3b8; margin-bottom:8px; }
    .fst-list { display:flex; flex-direction:column; gap:7px; }
    .fst-entry { border:1px solid #e5e7eb; border-radius:10px; background:#fafafa; overflow:hidden; }
    .fst-entry-top { display:flex; justify-content:space-between; align-items:center; padding:8px 12px; gap:8px; }
    .fst-entry-left { display:flex; align-items:center; gap:8px; min-width:0; flex:1; }
    .fst-resource { min-width:0; }
    .fst-resource-name { display:block; font-size:0.88rem; font-weight:700; color:#111827; overflow-wrap:anywhere; white-space:normal; }
    a.fst-resource-name { color:#2563eb; text-decoration:none; }
    a.fst-resource-name:hover { text-decoration:underline; }
    .fst-resource-operation, .fst-resource-variant { margin-top:4px; font-size:0.76rem; color:#64748b; overflow-wrap:anywhere; }
    .fst-confirm-resource { overflow-wrap:anywhere; }
    .fst-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
    .fst-dot-ok { background:#22c55e; }
    .fst-dot-fail { background:#ef4444; }
    .fst-dot-info { background:#0ea5e9; }
    .fst-entry-stage { font-size:0.82rem; font-weight:700; color:#111827; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .fst-entry-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
    .fst-badge { font-size:0.67rem; font-weight:800; padding:2px 8px; border-radius:999px; }
    .fst-time { font-size:0.71rem; color:#94a3b8; white-space:nowrap; }
    .fst-entry details summary { cursor:pointer; padding:5px 12px 6px; font-size:0.73rem; font-weight:700; color:#475569; border-top:1px solid #f1f5f9; list-style:none; display:flex; align-items:center; gap:4px; }
    .fst-entry details summary::-webkit-details-marker { display:none; }
    .fst-entry details summary::before { content:'▸'; font-size:0.68rem; }
    .fst-entry details[open] summary::before { content:'▾'; }
    .fst-detail-body { padding:6px 12px 10px; }
    .metric-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    .metric-chip {
      background: #f8fafc;
      border: 1px solid #e5e7eb;
      border-radius: 14px;
      padding: 12px;
    }
    .metric-chip-label {
      font-size: 0.78rem;
      color: #6b7280;
      margin-bottom: 4px;
    }
    .metric-chip-value {
      font-size: 1.15rem;
      font-weight: 800;
      color: #111827;
    }
    .stack-list {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    .stack-row {
      display: grid;
      grid-template-columns: 92px 1fr 40px;
      gap: 10px;
      align-items: center;
      font-size: 0.82rem;
      color: #475569;
    }
    .stack-bar {
      height: 10px;
      border-radius: 999px;
      background: #edf2f7;
      overflow: hidden;
    }
    .stack-bar-fill {
      height: 100%;
      border-radius: 999px;
    }
    .muted-empty {
      color: #94a3b8;
      font-size: 0.85rem;
    }

    /* Issues section */
    .section-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 24px 0 16px;
      flex-wrap: wrap;
      gap: 12px;
    }
    .section-header-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }
    /* Detected Issues — scan + actions in root header */
    .di-root-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .scan-mode-hint-inline {
      font-size: 0.75rem;
      color: #64748b;
      max-width: 140px;
      text-align: right;
      line-height: 1.3;
    }
    .scan-mode-hint-inline.is-active {
      color: #1d4ed8;
      font-weight: 600;
    }
    .scan-btn-inline {
      padding: 8px 14px;
      border-radius: 10px;
      font-size: 0.78rem;
      min-height: 0;
      min-width: 0;
      gap: 6px;
      box-shadow: 0 2px 8px rgba(0, 122, 255, 0.24);
    }
    .scan-btn-inline .scan-btn-icon {
      width: 14px;
      height: 14px;
    }
    /* 3-level detected issues hierarchy */
    .di-section {
      background: white;
      border-radius: 20px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
      overflow: hidden;
      margin-top: 8px;
    }
    .di-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 16px 20px;
      cursor: pointer;
      user-select: none;
      border-bottom: 1px solid #f1f5f9;
      gap: 12px;
      flex-wrap: wrap;
    }
    .di-header:hover { background: #f8fafc; }
    .di-title {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 1rem;
      font-weight: 700;
      color: #0f172a;
    }
    .di-count {
      font-size: 0.85rem;
      font-weight: 500;
      color: #64748b;
    }
    .di-body { padding: 12px 12px 4px; }
    .di-subsection {
      border: 1px solid #e9e9ef;
      border-radius: 16px;
      margin-bottom: 10px;
      overflow: hidden;
    }
    .di-subsection-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 13px 16px;
      cursor: pointer;
      user-select: none;
      background: #f8fafc;
      gap: 10px;
      flex-wrap: wrap;
    }
    .di-subsection-header:hover { background: #f1f5f9; }
    .di-subsection-title {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.95rem;
      font-weight: 700;
      color: #1e293b;
    }
    .di-subsection-body { padding: 10px 10px 4px; }
    /* ── App loading overlay ─────────────────────────────── */
    #app-loading-overlay {
      position: fixed; inset: 0; z-index: 99999;
      background: #f5f5f7;
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      gap: 20px;
      transition: opacity 0.35s ease;
    }
    #app-loading-overlay.hidden {
      opacity: 0; pointer-events: none;
    }
    .app-loading-logo {
      font-size: 1.5rem; font-weight: 700;
      background: linear-gradient(135deg, #1c1c1e, #3a3a3e);
      -webkit-background-clip: text; background-clip: text; color: transparent;
    }
    .app-loading-spinner {
      width: 40px; height: 40px;
      border: 4px solid #e9e9ef;
      border-top-color: #007aff;
      border-radius: 50%;
      animation: appSpinRot 0.75s linear infinite;
    }
    .app-loading-text {
      font-size: 0.9rem; color: #6c6c70;
    }
    @keyframes appSpinRot { to { transform: rotate(360deg); } }

    /* ── Scan button ─────────────────────────────── */
    .scan-btn {
      background: linear-gradient(135deg, #3b82f6, #007aff);
      color: #ffffff;
      border: none;
      padding: 12px 26px;
      border-radius: 12px;
      font-size: 0.95rem;
      font-weight: 800;
      cursor: pointer;
      transition: 0.2s;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 44px;
      min-width: 130px;
      box-shadow: 0 4px 14px rgba(0, 122, 255, 0.32);
      white-space: nowrap;
      letter-spacing: 0.01em;
    }
    .scan-btn-prominent:not(:disabled):not(.is-scanning) {
      animation: scanBtnPulse 2.8s ease-in-out infinite;
    }
    @keyframes scanBtnPulse {
      0%, 100% { box-shadow: 0 4px 14px rgba(0, 122, 255, 0.32); }
      50% { box-shadow: 0 6px 22px rgba(0, 122, 255, 0.48), 0 0 0 4px rgba(59, 130, 246, 0.14); }
    }
    .scan-btn-icon {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
    }
    .scan-btn:hover:not(:disabled) {
      background: linear-gradient(135deg, #2563eb, #006ae6);
      box-shadow: 0 4px 12px rgba(0, 122, 255, 0.28);
    }
    .scan-btn:disabled {
      background: #94a3b8;
      cursor: wait;
      box-shadow: none;
    }
    .scan-btn.is-scanning {
      background: linear-gradient(135deg, #2563eb, #005ecb);
      box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.18), 0 2px 8px rgba(0, 122, 255, 0.24);
    }
    .scan-more-wrap {
      position: relative;
      display: inline-flex;
      align-items: center;
    }
    .scan-more-btn {
      background: #f8fafc;
      color: #334155;
      border: 1px solid #cbd5e1;
      padding: 10px 12px;
      border-radius: 40px;
      font-weight: 700;
      cursor: pointer;
      transition: 0.2s;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      min-width: 64px;
      justify-content: center;
    }
    .scan-more-btn:hover:not(:disabled) {
      background: #f1f5f9;
      border-color: #94a3b8;
    }
    .scan-more-btn:disabled {
      background: #f1f5f9;
      color: #94a3b8;
      border-color: #e2e8f0;
      cursor: not-allowed;
    }
    .scan-more-menu,
    .scan-dropdown-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      min-width: 170px;
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
      padding: 6px;
      z-index: 40;
      display: none;
    }
    .scan-more-menu.open,
    .scan-dropdown-menu.open {
      display: block;
    }
    .scan-more-item,
    .scan-dropdown-item {
      width: 100%;
      border: 0;
      background: transparent;
      color: #0f172a;
      text-align: left;
      border-radius: 8px;
      padding: 9px 10px;
      font-size: 0.86rem;
      font-weight: 600;
      cursor: pointer;
    }
    .scan-more-item:hover:not(:disabled),
    .scan-dropdown-item:hover:not(:disabled) {
      background: #f8fafc;
    }
    .scan-more-item:disabled,
    .scan-dropdown-item:disabled {
      color: #94a3b8;
      cursor: not-allowed;
    }
    .btn-spinner {
      width: 14px; height: 14px;
      border: 2px solid rgba(255,255,255,0.4);
      border-top-color: #fff;
      border-radius: 50%;
      animation: appSpinRot 0.7s linear infinite;
      flex-shrink: 0;
    }
    /* Scan badge pulse while PROCESSING */
    .scan-progress-badge.PROCESSING,
    .scan-progress-badge.RUNNING {
      animation: badgePulse 1.2s ease-in-out infinite;
    }
    @keyframes badgePulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.55; }
    }
    .alt-text-btn {
      background: #0f766e;
    }
    .alt-text-btn:hover:not(:disabled) {
      background: #115e59;
    }
    .scan-progress-card {
      background: white;
      border: 1px solid #dbeafe;
      border-radius: 20px;
      padding: 18px 20px;
      margin-bottom: 18px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    }
    .scan-progress-card.hidden { display: none; }
    .scan-progress-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 12px;
      flex-wrap: wrap;
    }
    .scan-progress-title {
      font-size: 1rem;
      font-weight: 700;
      color: #0f172a;
    }
    .scan-progress-badge {
      border-radius: 999px;
      padding: 5px 10px;
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      background: #e0f2fe;
      color: #075985;
    }
    .scan-progress-meta {
      margin-top: 10px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      font-size: 0.82rem;
    }
    .scan-progress-stat {
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 10px 12px;
    }
    .scan-progress-stat strong {
      display: block;
      font-size: 1rem;
      color: #0f172a;
    }
    .scan-current-item {
      margin-top: 12px;
      padding: 12px 14px;
      background: #eff6ff;
      color: #1d4ed8;
      border-radius: 14px;
      font-size: 0.88rem;
      word-break: break-word;
    }
    .scan-progress-log {
      margin-top: 14px;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .scan-log-row {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      padding: 10px 12px;
      border-radius: 12px;
      background: #f8fafc;
      border: 1px solid #e5e7eb;
      font-size: 0.82rem;
      color: #334155;
    }
    .scan-log-label {
      font-weight: 600;
      color: #0f172a;
      word-break: break-word;
    }
    .scan-log-status {
      flex-shrink: 0;
      font-weight: 700;
      text-transform: uppercase;
      font-size: 0.72rem;
      letter-spacing: 0.04em;
    }
    .scan-log-status.COMPLETED { color: #166534; }
    .scan-log-status.FAILED { color: #b91c1c; }
    .scan-log-status.SKIPPED { color: #9a3412; }
    .scan-log-status.PROCESSING, .scan-log-status.PENDING { color: #0369a1; }

    /* Category cards */
    .category-card {
      background: white;
      border-radius: 20px;
      margin-bottom: 16px;
      overflow: hidden;
      box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }
    .category-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 18px 20px;
      cursor: pointer;
      background: white;
      transition: background 0.2s;
    }
    .category-header:hover { background: #fafafc; }
      .category-title { display: flex; align-items: center; gap: 12px; font-weight: 600; font-size: 1.05rem; flex-wrap: wrap; }
    .compact-badge {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #d8e3f2;
      padding: 4px 10px;
      font-size: 0.74rem;
      font-weight: 700;
      letter-spacing: 0.01em;
      color: #334155;
      background: #f8fbff;
      white-space: nowrap;
    }
    .compact-badge.auto {
      border-color: #bfdbfe;
      color: #1d4ed8;
      background: #eff6ff;
    }
    .compact-badge.pending {
      border-color: #cbd5e1;
      color: #475569;
      background: #f8fafc;
    }
    .compact-badge-info {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-left: 5px;
      font-size: 0.66rem;
      font-weight: 800;
      line-height: 1;
      color: inherit;
      cursor: help;
      opacity: 0.9;
    }
    .compact-badge-info:hover {
      opacity: 1;
    }
    .category-badge { background: #f2f2f5; padding: 4px 10px; border-radius: 30px; font-size: 0.8rem; font-weight: 500; }
    .category-actions { display: flex; align-items: center; gap: 10px; }
    .fix-all-btn {
      border: 1px solid #d4d9e2;
      background: #fff;
      border-radius: 999px;
      padding: 5px 10px;
      font-size: 0.74rem;
      font-weight: 600;
      cursor: pointer;
      white-space: nowrap;
    }
    .fix-all-btn:hover { background: #f4f7fb; }
    .issues-container { border-top: 1px solid #f0f0f4; background: #fefefe; }
    .issue-item {
      padding: 16px 20px;
      border-bottom: 1px solid #f0f0f4;
      cursor: pointer;
      transition: background 0.1s;
    }
    .issue-item:last-child { border-bottom: none; }
    .issue-item:hover { background: #fafafc; }
    .issue-item.fixed-item {
      opacity: 0.7;
      background: #fbfbfd;
    }
    .issue-item.fixed-item:hover {
      background: #f7f8fc;
    }
    .issue-item.issue-focus,
    .issue-card.issue-focus,
    .lr-row.issue-focus,
    .dup-card.issue-focus {
      outline: 2px solid #0ea5e9;
      box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.16);
    }
    .issue-summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
    .issue-summary-title {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }
    .fixed-pill {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #d5d9e2;
      padding: 3px 10px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: #4b5563;
      background: #f3f4f6;
    }
    .manual-pill {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #e5dcc2;
      padding: 3px 10px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: #8a5a00;
      background: #fff7e6;
    }
    .workflow-pill {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #bfdbfe;
      padding: 3px 10px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: #1d4ed8;
      background: #eff6ff;
    }
    .workflow-pill.approval {
      border-color: #fed7aa;
      color: #9a3412;
      background: #fff7ed;
    }
    .workflow-pill.guided {
      border-color: #d8b4fe;
      color: #6b21a8;
      background: #faf5ff;
    }
    .workflow-pill.developer {
      border-color: #bae6fd;
      color: #075985;
      background: #f0f9ff;
    }
    .severity-high  { color: #ff3b30; }
    .severity-medium { color: #ff9500; }
    .severity-low   { color: #34c759; }
    .issue-detail { margin-top: 14px; padding: 14px; background: #f9f9fb; border-radius: 14px; }
    .issue-detail p { margin-bottom: 8px; font-size: 0.9rem; }
    .issue-detail a {
      color: #0b63ce;
      font-weight: 600;
      text-decoration: none;
    }
    .issue-detail a:hover {
      text-decoration: underline;
    }
    .loss-negative {
      color: #dc2626;
      font-weight: 800;
    }
    .suggestion-text {
      background: white;
      padding: 10px 14px;
      border-radius: 10px;
      margin-top: 8px;
      border-left: 4px solid #007aff;
      font-size: 0.9rem;
    }
    .meta-tag-insight {
      display: grid;
      gap: 8px;
      margin-top: 8px;
    }
    .meta-tag-row {
      background: #fff;
      border: 1px solid #dbe7f3;
      border-left: 4px solid #0ea5e9;
      border-radius: 10px;
      padding: 10px 12px;
    }
    .meta-tag-row.recommended {
      border-color: #bbf7d0;
      border-left-color: #16a34a;
      background: #f8fffb;
    }
    .meta-tag-label {
      color: #475569;
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0;
      margin-bottom: 4px;
      text-transform: uppercase;
    }
    .meta-tag-value {
      color: #111827;
      font-size: 0.9rem;
      line-height: 1.45;
    }
    .manual-help {
      background: #fffaf0;
      padding: 10px 14px;
      border-radius: 10px;
      margin-top: 8px;
      border-left: 4px solid #d97706;
      font-size: 0.9rem;
      color: #7c4a03;
    }
    .manual-help a {
      color: #9a3412;
      font-weight: 700;
      text-decoration: none;
    }
    .manual-help a:hover {
      text-decoration: underline;
    }
    .impact-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border-radius: 999px;
      border: 1px solid #dbe6f3;
      background: #f7fbff;
      color: #0f4066;
      font-size: 0.76rem;
      font-weight: 700;
      padding: 4px 10px;
      margin-left: 8px;
    }
    .fix-btn {
      border: 0;
      border-radius: 999px;
      padding: 6px 12px;
      font-size: 0.78rem;
      font-weight: 600;
      color: #fff;
      background: #0b7a55;
      cursor: pointer;
    }
    .fix-btn:hover { background: #086948; }
    .ignore-btn {
      border: 1px solid #d1d5db;
      border-radius: 999px;
      padding: 6px 12px;
      font-size: 0.78rem;
      font-weight: 600;
      color: #374151;
      background: #ffffff;
      cursor: pointer;
    }
    .ignore-btn:hover { background: #f9fafb; }
    .no-issues { padding: 28px 20px; text-align: center; color: #6c6c70; font-size: 0.95rem; }
    .perfect-banner {
      background: #34c75910;
      text-align: center;
      padding: 24px;
      border-radius: 24px;
      margin-bottom: 24px;
      font-size: 1.05rem;
    }

    /* Toast notifications */
    #toast-container {
      position: fixed;
      bottom: 24px;
      right: 24px;
      z-index: 9999;
      display: flex;
      flex-direction: column;
      gap: 10px;
      pointer-events: none;
    }
    .toast {
      min-width: 280px;
      max-width: 400px;
      padding: 14px 18px;
      border-radius: 14px;
      font-size: 0.9rem;
      font-weight: 500;
      box-shadow: 0 4px 16px rgba(0,0,0,0.15);
      animation: slideIn 0.25s ease;
      color: white;
      pointer-events: auto;
    }
    .toast-success { background: #34c759; }
    .toast-error   { background: #ff3b30; }
    .toast-info    { background: #007aff; }
    .toast-action {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-width: 320px;
    }
    .toast-action button {
      border: 1px solid rgba(255,255,255,0.72);
      border-radius: 999px;
      background: rgba(255,255,255,0.18);
      color: #fff;
      font-size: 0.78rem;
      font-weight: 800;
      padding: 6px 10px;
      cursor: pointer;
      white-space: nowrap;
    }

    /* Modal */
    :root {
      --modal-bottom-clearance: env(safe-area-inset-bottom, 0px);
    }
    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(15, 23, 42, 0.45);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 10000;
      padding: 16px;
      padding-bottom: calc(16px + var(--modal-bottom-clearance));
    }
    .modal-overlay.hidden { display: none; }
    .modal {
      width: min(560px, 100%);
      max-height: calc(100vh - 32px - var(--modal-bottom-clearance));
      max-height: calc(100dvh - 32px - var(--modal-bottom-clearance));
      display: flex;
      flex-direction: column;
      background: #fff;
      border-radius: 16px;
      border: 1px solid #dbe1ea;
      box-shadow: 0 20px 44px rgba(15, 23, 42, 0.18);
      overflow: hidden;
    }
    .modal.product-preview-modal {
      width: min(1180px, 100%);
      max-height: calc(100vh - 20px - var(--modal-bottom-clearance));
      max-height: calc(100dvh - 20px - var(--modal-bottom-clearance));
      display: flex;
      flex-direction: column;
    }
    /* Request 580/581 — one-screen modal; native textarea scroll (not absolute). */
    .modal.product-preview-modal.is-manual-edit {
      width: min(1180px, 100%);
      height: calc(100dvh - 16px - var(--modal-bottom-clearance));
      max-height: calc(100dvh - 16px - var(--modal-bottom-clearance));
    }
    .modal.product-preview-modal.is-manual-edit .modal-body {
      overflow: hidden;
      display: flex;
      flex-direction: column;
      padding: 10px 14px;
    }
    .modal-header {
      flex: 0 0 auto;
      padding: 16px 18px;
      border-bottom: 1px solid #edf1f6;
      font-weight: 700;
    }
    .modal-body {
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
      padding: 16px 18px;
      color: #243447;
      line-height: 1.6;
      white-space: pre-wrap;
    }
    .product-content-preview {
      white-space: normal;
      display: flex;
      flex-direction: column;
      gap: 14px;
      /* Request 577 — only .modal-body scrolls. A second max-height here clipped the editor. */
      max-height: none;
      overflow: visible;
      padding-bottom: 8px;
    }
    .product-content-preview.is-manual-edit {
      flex: 1;
      min-height: 0;
      height: 100%;
      gap: 8px;
      padding-bottom: 0;
      overflow: hidden;
    }
    .product-content-preview.is-manual-edit .pc-preview-summary {
      flex: 0 0 auto;
      padding: 8px 12px;
    }
    .product-content-preview.is-manual-edit .pc-merchant-notices {
      flex: 0 1 auto;
      margin-top: 0;
      margin-bottom: 0;
      max-height: 168px;
      overflow: auto;
    }
    .product-content-preview.is-manual-edit .pc-merchant-notice {
      flex: 0 0 auto;
      margin-top: 0;
      margin-bottom: 0;
      max-height: none;
      padding: 6px 10px;
      font-size: 0.78rem;
    }
    .product-content-preview.is-manual-edit .pc-preview-product {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
    .product-content-preview.is-manual-edit .pc-preview-product-title {
      flex: 0 0 auto;
    }
    .product-content-preview.is-manual-edit .pc-preview-grid {
      flex: 1;
      min-height: 0;
      grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr);
      grid-template-rows: minmax(0, 1fr);
    }
    .product-content-preview.is-manual-edit .pc-preview-panel {
      min-height: 0;
      height: 100%;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .product-content-preview.is-manual-edit .pc-preview-label,
    .product-content-preview.is-manual-edit .pc-preview-title,
    .product-content-preview.is-manual-edit .pc-edit-title,
    .product-content-preview.is-manual-edit .pc-edit-actions {
      flex: 0 0 auto;
    }
    .pc-preview-body-wrap,
    .pc-edit-body-wrap {
      position: static;
      display: block;
      flex: 1 1 auto;
      height: 240px;
      max-height: 240px;
      min-height: 240px;
      overflow: visible;
    }
    .pc-preview-body-wrap .pc-preview-body,
    .pc-edit-body-wrap .pc-edit-body {
      position: static !important;
      inset: auto;
      display: block;
      width: 100%;
      height: 240px !important;
      max-height: 240px !important;
      min-height: 240px !important;
      overflow-x: hidden !important;
      overflow-y: scroll !important;
      overscroll-behavior: contain;
    }
    .pc-preview-body-wrap .pc-preview-body::-webkit-scrollbar,
    .pc-edit-body-wrap .pc-edit-body::-webkit-scrollbar {
      width: 10px;
    }
    .pc-preview-body-wrap .pc-preview-body::-webkit-scrollbar-thumb,
    .pc-edit-body-wrap .pc-edit-body::-webkit-scrollbar-thumb {
      background: #94a3b8;
      border-radius: 8px;
    }
    .pc-preview-summary {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: flex-start;
      padding: 12px 14px;
      border: 1px solid #dbeafe;
      background: #f8fbff;
      border-radius: 12px;
    }
    .pc-preview-summary strong {
      display: block;
      color: #0f172a;
      font-size: 0.92rem;
      font-weight: 500;
      margin-bottom: 2px;
    }
    .pc-preview-summary span {
      color: #475569;
      font-size: 0.82rem;
    }
    .pc-preview-summary.is-careful-apply {
      border-color: #fdba74;
      background: #fff7ed;
    }
    .pc-preview-summary.is-careful-apply strong {
      color: #9a3412;
    }
    .pc-preview-summary.is-careful-apply span {
      color: #9a3412;
    }
    .pc-preview-credit {
      flex: 0 0 auto;
      border-radius: 999px;
      padding: 5px 10px;
      background: #ecfdf5;
      color: #047857;
      font-size: 0.78rem;
      font-weight: 800;
    }
    .pc-preview-product {
      border: 1px solid #e2e8f0;
      border-radius: 14px;
      overflow: hidden;
      background: #ffffff;
    }
    .pc-preview-product-title {
      padding: 12px 14px;
      border-bottom: 1px solid #e2e8f0;
      background: #f8fafc;
      font-weight: 500;
      color: #0f172a;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .pc-product-status-badge {
      font-size: 11px;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 20px;
      white-space: nowrap;
      flex-shrink: 0;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }
    .pc-product-status-badge.status-active {
      background: #dcfce7;
      color: #15803d;
    }
    .pc-product-status-badge.status-draft {
      background: #f1f5f9;
      color: #64748b;
    }
    .pc-product-status-badge.status-archived {
      background: #1e293b;
      color: #f8fafc;
    }
    .pc-product-status-badge.status-unknown {
      background: #e0f2fe;
      color: #0369a1;
    }
    .pc-stock-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      border-radius: 999px;
      padding: 2px 8px;
      background: #f8fafc;
      color: #334155;
      border: 1px solid #e2e8f0;
      font-size: 11px;
      font-weight: 600;
      white-space: nowrap;
    }
    .pc-stock-badge.low {
      background: #fff7ed;
      border-color: #fed7aa;
      color: #c2410c;
    }
    .pc-bulk-intro,
    .pc-bulk-apply,
    .pc-bulk-progress {
      white-space: normal;
    }
    .pc-info-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 1.5px solid currentColor;
      background: transparent;
      font-size: 12px;
      font-weight: 700;
      line-height: 1;
      cursor: pointer;
      vertical-align: middle;
      opacity: 0.7;
      padding: 0;
      margin-left: 6px;
      color: inherit;
    }
    .pc-info-btn:hover { opacity: 1; background: rgba(0,0,0,0.06); }
    .pc-methodology-panel {
      background: #f0f7ff;
      border: 1px solid #bfdbfe;
      border-radius: 8px;
      padding: 12px 16px;
      margin-bottom: 12px;
      font-size: 13px;
      line-height: 1.6;
    }
    .pc-methodology-list {
      margin: 0;
      padding-left: 18px;
    }
    .pc-methodology-list li { margin-bottom: 5px; }
    .pc-methodology-list li:last-child { margin-bottom: 0; }
    .pc-bulk-intro {
      display: grid;
      gap: 14px;
    }
    .pc-bulk-intro-hero,
    .pc-bulk-apply-hero,
    .pc-bulk-progress-hero {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      align-items: flex-start;
      border: 1px solid #dbeafe;
      background: #f8fbff;
      border-radius: 14px;
      padding: 14px;
    }
    .pc-bulk-intro-hero strong,
    .pc-bulk-apply-hero strong,
    .pc-bulk-progress-hero strong {
      display: block;
      color: #0f172a;
      font-size: 0.98rem;
      line-height: 1.25;
      margin-bottom: 4px;
    }
    .pc-bulk-intro-hero span,
    .pc-bulk-apply-hero span,
    .pc-bulk-progress-hero span {
      color: #475569;
      display: block;
      font-size: 0.84rem;
      line-height: 1.45;
    }
    .pc-bulk-intro-hero span strong,
    .pc-bulk-apply-hero span strong,
    .pc-bulk-progress-hero span strong {
      display: inline;
      font-weight: 600;
      color: #1e40af;
    }
    .pc-bulk-kpis,
    .pc-bulk-progress-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }
    .pc-bulk-kpi,
    .pc-bulk-progress-stat {
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 11px 12px;
      background: #ffffff;
      min-width: 0;
    }
    .pc-bulk-kpi span,
    .pc-bulk-progress-stat span {
      display: block;
      color: #64748b;
      font-size: 0.74rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      margin-bottom: 4px;
    }
    .pc-bulk-kpi strong,
    .pc-bulk-progress-stat strong {
      display: block;
      color: #0f172a;
      font-size: 1.05rem;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pc-bulk-note {
      border: 1px solid #bbf7d0;
      background: #f0fdf4;
      color: #166534;
      border-radius: 12px;
      padding: 11px 12px;
      font-size: 0.84rem;
      line-height: 1.45;
    }
    .pc-bulk-warning {
      border: 1px solid #fed7aa;
      background: #fff7ed;
      color: #9a3412;
      border-radius: 12px;
      padding: 11px 12px;
      font-size: 0.84rem;
      line-height: 1.45;
    }
    .pc-bulk-progress {
      display: grid;
      gap: 14px;
    }
    .pc-bulk-percent {
      flex: 0 0 auto;
      min-width: 76px;
      border-radius: 12px;
      background: #0f766e;
      color: #ffffff;
      padding: 8px 10px;
      text-align: center;
      font-size: 1.05rem;
      font-weight: 800;
      line-height: 1;
    }
    .pc-bulk-percent span {
      color: rgba(255, 255, 255, 0.82);
      font-size: 0.66rem;
      font-weight: 700;
      margin-top: 4px;
      text-transform: uppercase;
    }
    .pc-progress-bar {
      height: 10px;
      overflow: hidden;
      border-radius: 999px;
      background: #e2e8f0;
    }
    .pc-progress-bar-fill {
      height: 100%;
      width: 0;
      border-radius: inherit;
      background: linear-gradient(90deg, #0ea5e9, #10b981);
      transition: width 180ms ease;
    }
    .pc-bulk-product-list {
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      overflow: hidden;
    }
    .pc-bulk-product-list-header {
      padding: 8px 12px;
      background: #f8fafc;
      border-bottom: 1px solid #e2e8f0;
      font-size: 0.75rem;
      font-weight: 700;
      color: #64748b;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }
    .pc-bulk-product-list-body {
      max-height: 230px;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
    .pc-bulk-product-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 7px 12px;
      border-bottom: 1px solid #f1f5f9;
      font-size: 0.83rem;
      color: #0f172a;
    }
    .pc-bulk-product-row:last-child { border-bottom: none; }
    .pc-bulk-product-row-num {
      flex: 0 0 24px;
      text-align: right;
      color: #94a3b8;
      font-size: 0.72rem;
      font-variant-numeric: tabular-nums;
      font-weight: 600;
    }
    .pc-bulk-product-row-title {
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pc-current-product {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      border: 1px solid #bae6fd;
      background: #f0f9ff;
      border-radius: 14px;
      padding: 13px 14px;
    }
    .pc-current-product-label {
      color: #0369a1;
      font-size: 0.73rem;
      font-weight: 800;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      margin-bottom: 3px;
    }
    .pc-current-product-title {
      color: #0f172a;
      font-size: 0.95rem;
      font-weight: 700;
      line-height: 1.35;
      word-break: break-word;
    }
    .pc-product-meta-row {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      flex-wrap: wrap;
    }
    .pc-progress-list,
    .pc-bulk-apply-list {
      border: 1px solid #e2e8f0;
      border-radius: 14px;
      overflow: auto;
      background: #ffffff;
      max-height: 260px;
    }
    .pc-progress-row,
    .pc-bulk-apply-row {
      display: grid;
      grid-template-columns: 24px minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 10px 12px;
      border-bottom: 1px solid #edf2f7;
    }
    .pc-progress-row:last-child,
    .pc-bulk-apply-row:last-child {
      border-bottom: 0;
    }
    .pc-progress-row.active {
      background: #f0f9ff;
    }
    .pc-progress-row.done {
      background: #f8fffb;
    }
    .pc-progress-row.failed {
      background: #fff7ed;
    }
    .pc-bulk-apply-row.deferred {
      background: #f8fafc;
      opacity: 0.92;
    }
    .pc-progress-icon {
      width: 18px;
      height: 18px;
      border-radius: 999px;
      border: 2px solid #cbd5e1;
      background: #ffffff;
    }
    .pc-progress-row.active .pc-progress-icon {
      border-color: #0ea5e9;
      border-top-color: #bae6fd;
      animation: spin 0.8s linear infinite;
    }
    .pc-progress-row.done .pc-progress-icon {
      border-color: #10b981;
      background: #10b981;
      box-shadow: inset 0 0 0 4px #ffffff;
    }
    .pc-progress-row.failed .pc-progress-icon {
      border-color: #f97316;
      background: #fed7aa;
    }
    .pc-bulk-apply-row .pc-progress-icon {
      border-color: #10b981;
      background: #10b981;
      box-shadow: inset 0 0 0 4px #ffffff;
    }
    .pc-progress-title,
    .pc-bulk-apply-title {
      color: #0f172a;
      font-size: 0.86rem;
      font-weight: 600;
      line-height: 1.35;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pc-progress-subtitle {
      color: #64748b;
      font-size: 0.74rem;
      margin-top: 2px;
    }
    .pc-bulk-apply {
      display: grid;
      gap: 14px;
    }
    .pc-preview-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 0;
    }
    .pc-preview-panel {
      padding: 14px;
      min-width: 0;
    }
    .pc-preview-panel + .pc-preview-panel {
      border-left: 1px solid #e2e8f0;
    }
    .pc-preview-panel.current {
      background: #fbfcfe;
    }
    .pc-preview-panel.suggested {
      background: #f7fffb;
    }
    .pc-preview-label {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
      color: #475569;
      font-size: 0.76rem;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }
    .pc-preview-title {
      color: #0f172a;
      font-weight: 500;
      font-size: 0.96rem;
      line-height: 1.35;
      margin-bottom: 10px;
      word-break: break-word;
    }
    .pc-preview-body {
      border: 1px solid #e2e8f0;
      background: rgba(255, 255, 255, 0.78);
      border-radius: 10px;
      padding: 11px 12px;
      color: #334155;
      font-size: 0.86rem;
      line-height: 1.55;
      max-height: 270px;
      overflow: auto;
      word-break: break-word;
    }
    .pc-preview-body p {
      margin: 0 0 10px;
    }
    .pc-preview-body p:last-child,
    .pc-preview-body ul:last-child,
    .pc-preview-body ol:last-child {
      margin-bottom: 0;
    }
    .pc-preview-body ul,
    .pc-preview-body ol {
      margin: 0 0 10px 18px;
      padding: 0;
    }
    .pc-preview-body li {
      margin: 0 0 6px;
    }
    .pc-preview-panel.suggested.is-editable {
      background: #fffbeb;
    }
    .pc-edit-title,
    .pc-edit-body {
      width: 100%;
      box-sizing: border-box;
      border: 1px solid #f59e0b;
      border-radius: 8px;
      background: #fff;
      color: #0f172a;
      font: inherit;
    }
    .pc-edit-title {
      font-weight: 500;
      font-size: 0.96rem;
      line-height: 1.35;
      padding: 8px 10px;
      margin-bottom: 8px;
    }
    .pc-edit-body {
      display: block;
      box-sizing: border-box;
      min-height: 240px !important;
      height: 240px !important;
      max-height: 240px !important;
      padding: 10px 12px;
      font-size: 0.86rem;
      line-height: 1.55;
      resize: none;
      overflow-x: hidden !important;
      overflow-y: scroll !important;
      overscroll-behavior: contain;
    }
    .pc-edit-actions {
      display: flex;
      justify-content: flex-end;
      margin-bottom: 8px;
    }
    .pc-copy-current-btn {
      border: 1px solid #cbd5e1;
      background: #fff;
      color: #334155;
      border-radius: 8px;
      padding: 4px 8px;
      font-size: 0.75rem;
      cursor: pointer;
    }
    .pc-preview-loading {
      display: flex;
      gap: 12px;
      align-items: center;
      padding: 14px;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      background: #f8fafc;
      white-space: normal;
    }
    .pc-preview-spinner {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 3px solid #bae6fd;
      border-top-color: #0ea5e9;
      animation: spin 0.8s linear infinite;
      flex: 0 0 auto;
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    /* Bulk fix progress styles (all categories) */
    .bulk-fix-progress { display: grid; gap: 14px; min-height: 420px; }
    .bulk-fix-progress-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
    .bulk-fix-progress-hero > div:first-child strong { display: block; font-size: 0.98rem; font-weight: 700; color: #0f172a; margin-bottom: 4px; }
    .bulk-fix-progress-hero > div:first-child span { font-size: 0.85rem; color: #64748b; line-height: 1.4; }
    .bulk-fix-progress-percent { flex: 0 0 auto; min-width: 72px; border-radius: 12px; background: #0f766e; color: #ffffff; padding: 8px 10px; text-align: center; font-size: 1.1rem; font-weight: 800; line-height: 1; }
    .bulk-fix-progress-percent span { color: rgba(255, 255, 255, 0.82); font-size: 0.65rem; font-weight: 700; margin-top: 4px; text-transform: uppercase; display: block; }
    .bulk-fix-progress-bar { height: 10px; overflow: hidden; border-radius: 999px; background: #e2e8f0; }
    .bulk-fix-progress-bar-fill { height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #0ea5e9, #10b981); transition: width 180ms ease; }
    .bulk-fix-progress-bar-fill.active { background-image: linear-gradient(90deg, #0ea5e9, #10b981, #0ea5e9); background-size: 180% 100%; animation: progressFlow 1.1s linear infinite; }
    .bulk-fix-progress-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .bulk-fix-progress-stat { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 10px 12px; text-align: center; }
    .bulk-fix-progress-stat span { display: block; font-size: 0.75rem; font-weight: 600; color: #64748b; text-transform: uppercase; margin-bottom: 3px; }
    .bulk-fix-progress-stat strong { display: block; font-size: 1rem; font-weight: 700; color: #0f172a; }
    .bulk-fix-activity-ticker {
      min-height: 1.35em;
      font-size: 0.84rem;
      font-weight: 600;
      color: #0f766e;
      line-height: 1.4;
    }
    .bulk-fix-current-task {
      border: 1px solid #7dd3fc;
      background: linear-gradient(180deg, #f0f9ff 0%, #ffffff 100%);
      border-radius: 12px;
      padding: 12px 14px;
      display: grid;
      grid-template-columns: 20px minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
    }
    .bulk-fix-current-task .bulk-fix-item-icon {
      border-color: #0ea5e9;
      border-top-color: #bae6fd;
      animation: spin 0.8s linear infinite;
    }
    .bulk-fix-current-task-kicker {
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      color: #0369a1;
      margin-bottom: 2px;
    }
    .bulk-fix-item-list-wrap { display: grid; gap: 6px; min-height: 0; }
    .bulk-fix-item-list-title {
      font-size: 0.75rem;
      font-weight: 600;
      color: #64748b;
      text-transform: uppercase;
      letter-spacing: 0.03em;
    }
    .bulk-fix-item-list { border: 1px solid #e2e8f0; border-radius: 12px; overflow: auto; background: #ffffff; max-height: 260px; }
    .bulk-fix-item { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid #edf2f7; }
    .bulk-fix-item:last-child { border-bottom: 0; }
    .bulk-fix-item.pending { background: #ffffff; }
    .bulk-fix-item.processing { background: #f0f9ff; }
    .bulk-fix-item.done { background: #f8fffb; }
    .bulk-fix-item.failed { background: #fff7ed; }
    .bulk-fix-item-icon { width: 18px; height: 18px; border-radius: 999px; border: 2px solid #cbd5e1; background: #ffffff; flex-shrink: 0; }
    .bulk-fix-item.processing .bulk-fix-item-icon { border-color: #0ea5e9; border-top-color: #bae6fd; animation: spin 0.8s linear infinite; }
    .bulk-fix-item.done .bulk-fix-item-icon { border-color: #10b981; background: #10b981; box-shadow: inset 0 0 0 4px #ffffff; }
    .bulk-fix-item.failed .bulk-fix-item-icon { border-color: #f97316; background: #fed7aa; }
    .bulk-fix-item-label { color: #0f172a; font-size: 0.86rem; font-weight: 600; line-height: 1.35; }
    .bulk-fix-item-detail { color: #64748b; font-size: 0.8rem; margin-top: 2px; }
    .bulk-fix-item-content { min-width: 0; flex: 1; }
    .bulk-fix-item-meta { font-size: 0.75rem; font-weight: 600; color: #64748b; white-space: nowrap; }
    @keyframes progressFlow { from { background-position: 0 0; } to { background-position: 180% 0; } }
    .modal-actions {
      position: relative;
      flex: 0 0 auto;
      display: flex;
      justify-content: flex-end;
      flex-wrap: wrap;
      gap: 10px;
      padding: 14px 18px calc(18px + env(safe-area-inset-bottom, 0px));
      border-top: 1px solid #edf1f6;
      background: #fff;
    }
    .btn-outline {
      border: 1px solid #cbd5e1;
      background: #fff;
      color: #1e293b;
      border-radius: 10px;
      padding: 9px 14px;
      font-weight: 600;
      cursor: pointer;
    }
    .btn-primary {
      border: 0;
      background: #0ea5e9;
      color: #fff;
      border-radius: 10px;
      padding: 9px 14px;
      font-weight: 700;
      cursor: pointer;
    }
    @keyframes slideIn {
      from { opacity: 0; transform: translateY(10px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Embedded mobile: Shopify nav bar is ~80px — always applied when class is present */
    html.sfai-embedded-mobile {
      --modal-bottom-clearance: calc(80px + env(safe-area-inset-bottom, 0px));
    }

    @media (max-width: 780px) {
      :root {
        --modal-bottom-clearance: max(16px, env(safe-area-inset-bottom, 0px));
      }
      html.sfai-embedded-mobile {
        --modal-bottom-clearance: calc(80px + env(safe-area-inset-bottom, 0px));
      }
      .modal-overlay {
        align-items: flex-end;
        padding: 12px 12px calc(12px + var(--modal-bottom-clearance));
      }
      .modal-overlay .modal {
        max-height: calc(100dvh - 24px - var(--modal-bottom-clearance));
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
      }
      .modal-actions .btn-outline,
      .modal-actions .btn-primary {
        min-height: 44px;
      }
      .top-actions-list { grid-template-columns: 1fr; }
      .analytics-strip { grid-template-columns: 1fr; }
      .pc-preview-grid { grid-template-columns: 1fr; }
      .product-content-preview.is-manual-edit .pc-preview-grid {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(120px, 0.4fr) minmax(180px, 1fr);
      }
      .pc-preview-panel + .pc-preview-panel { border-left: 0; border-top: 1px solid #e2e8f0; }
      .pc-preview-summary { flex-direction: column; }
      .pc-bulk-intro-hero,
      .pc-bulk-apply-hero,
      .pc-bulk-progress-hero,
      .pc-current-product { flex-direction: column; align-items: stretch; }
      .pc-bulk-kpis,
      .pc-bulk-progress-stats { grid-template-columns: 1fr; }
      .pc-progress-row,
      .pc-bulk-apply-row { grid-template-columns: 22px minmax(0, 1fr); }
      .pc-progress-row .pc-product-meta-row,
      .pc-bulk-apply-row .pc-product-meta-row { grid-column: 2; justify-content: flex-start; }
      .category-header { flex-wrap: wrap; gap: 10px; }
      .di-root-header { flex-wrap: wrap; }
      .di-root-summary { white-space: normal; }
      .parent-group-body { margin-left: 8px; padding-left: 12px; }
      .scan-progress-meta { grid-template-columns: 1fr; }
      .health-row { grid-template-columns: minmax(0, 1fr) minmax(40px, 1.5fr) auto; }
      .health-row-icon { display: none; }
      .health-row-score { min-width: 52px; font-size: 0.75rem; }
    }

    /* ═══════════════════════════════════════════
       ISSUE CARD GRID — Polaris-inspired redesign
       ═══════════════════════════════════════════ */

    /* Accordion expand/collapse animation */
    @keyframes catBodyOpen {
      from { opacity: 0; transform: translateY(-6px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Card grid container — responsive: 3col desktop / 2col tablet / 1col mobile */
    .issue-card-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      padding: 16px;
      animation: catBodyOpen 0.2s ease both;
    }
    @media (max-width: 900px) {
      .issue-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 500px) {
      .issue-card-grid { grid-template-columns: 1fr; }
    }

    /* ── REQ-063 License Risk section ── */
    .lr-list { padding: 8px 16px 16px; display: flex; flex-direction: column; gap: 10px; }
    .lr-row {
      display: flex; align-items: center; justify-content: space-between;
      background: #fff; border: 1px solid #e1e3e5; border-radius: 8px; padding: 12px 16px; gap: 12px;
    }
    .lr-row--opened {
      background: #f3f8ff;
      border-color: #9ec5eb;
      box-shadow: inset 3px 0 0 #3b82f6;
    }
    .lr-row-left { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
    .lr-thumb { width: 52px; height: 52px; object-fit: cover; border-radius: 6px; flex-shrink: 0; background: #f0f1f3; }
    .lr-thumb-placeholder { width: 52px; height: 52px; border-radius: 6px; background: #f0f1f3; flex-shrink: 0; }
    .lr-row-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
    .lr-product-title { font-weight: 600; font-size: 0.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lr-keywords { font-size: 0.78rem; color: #bf5800; background: #fff4e5; border-radius: 4px; padding: 2px 6px; display: inline-block; }
    .lr-keywords--patent { color: #7c2d12; background: #fef2f2; border: 1px solid #fecaca; }
    .lr-badges-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 3px 0; }
    .lr-type-badge { font-size: 0.72rem; font-weight: 600; border-radius: 4px; padding: 2px 7px; display: inline-block; }
    .lr-type-badge--license { color: #bf5800; background: #fff4e5; border: 1px solid #f5a623; }
    .lr-type-badge--patent  { color: #7c2d12; background: #fef2f2; border: 1px solid #fca5a5; }
    .lr-type-badge--weapon  { color: #9a3412; background: #fff7ed; border: 1px solid #fdba74; }
    .lr-keywords--weapon { color: #9a3412; background: #fff7ed; border: 1px solid #fed7aa; }
    .lr-badge { font-size: 0.73rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; display: inline-block; }
    .lr-badge-active { background: #e3f7e8; color: #1a7a39; }
    .lr-badge-draft  { background: #f0f1f3; color: #555; }
    .lr-row-actions { display: flex; gap: 8px; flex-shrink: 0; }
    .lr-edit-btn {
      padding: 7px 14px; border-radius: 7px; font-size: 0.83rem; font-weight: 600; cursor: pointer;
      background: #fff; border: 1px solid #8c9196; color: #202223; text-decoration: none; display: inline-flex; align-items: center;
    }
    .lr-edit-btn--disabled { opacity: 0.45; cursor: not-allowed; }
    .lr-edit-btn:hover:not(.lr-edit-btn--disabled) { background: #f6f6f7; }
    .lr-edit-btn--opened {
      background: #dbeafe;
      border-color: #93c5fd;
      color: #1d4ed8;
      pointer-events: none;
    }
    .lr-delete-btn {
      padding: 7px 14px; border-radius: 7px; font-size: 0.83rem; font-weight: 600; cursor: pointer;
      background: #fff; border: 1px solid #d72c0d; color: #d72c0d;
    }
    .lr-delete-btn:hover { background: #fff4f4; }
    .lr-ignore-btn {
      padding: 7px 14px; border-radius: 7px; font-size: 0.83rem; font-weight: 600; cursor: pointer;
      background: #fff; border: 1px solid #b4b8be; color: #555555;
    }
    .lr-ignore-btn:hover { background: #f6f7f8; }
    .lr-recheck-btn {
      padding: 7px 14px; border-radius: 7px; font-size: 0.83rem; font-weight: 600; cursor: pointer;
      background: #fff; border: 1px solid #2563eb; color: #1d4ed8;
    }
    .lr-recheck-btn:hover { background: #eff6ff; }
    .lr-recheck-btn:disabled { opacity: 0.45; cursor: not-allowed; }
    .license-risk-banner {
      display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-radius: 8px; margin: 12px 16px 16px; font-size: 0.92rem;
    }
    .license-risk-banner.success { background: #f0f8f0; border: 1px solid #97d0a1; color: #1a7a39; }
    .license-risk-banner.info { background: #eff6ff; border: 1px solid #93c5fd; color: #1e3a8a; }
    .lr-action-hint { font-size: 0.76rem; color: #4b5563; line-height: 1.4; }
    .lr-banner-icon { font-size: 1.1rem; }
    /* ── End REQ-063 ── */

    /* Duplicate products section */
    .dup-list {
      padding: 12px 16px 16px;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    @media (max-width: 900px) {
      .dup-list { grid-template-columns: 1fr; }
    }
    .dup-card {
      background: #ffffff;
      border: 1px solid #e1e3e5;
      border-radius: 8px;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.08);
      animation: cardFadeIn 0.15s ease both;
    }
    .dup-card-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 10px;
    }
    .dup-card-title {
      color: #0f172a;
      font-size: 0.88rem;
      font-weight: 800;
      line-height: 1.35;
    }
    .dup-signal {
      display: inline-flex;
      align-items: center;
      white-space: nowrap;
      border-radius: 999px;
      border: 1px solid #fed7aa;
      background: #fff7ed;
      color: #c2410c;
      font-size: 0.7rem;
      font-weight: 800;
      padding: 3px 8px;
    }
    .dup-products {
      display: grid;
      gap: 8px;
    }
    .dup-product-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      border: 1px solid #eef2f7;
      border-radius: 7px;
      background: #f8fafc;
      padding: 9px 10px;
    }
    .dup-product-thumbs {
      display: flex;
      gap: 3px;
      align-items: center;
      flex-shrink: 0;
    }
    .dup-thumb {
      width: 52px;
      height: 52px;
      object-fit: cover;
      border-radius: 5px;
      border: 1px solid #e1e3e5;
      background: #f1f5f9;
      flex-shrink: 0;
    }
    .dup-thumb-placeholder {
      width: 52px;
      height: 52px;
      border-radius: 5px;
      border: 1px solid #e1e3e5;
      background: #f1f5f9;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #cbd5e1;
      font-size: 20px;
    }
    .dup-product-title {
      color: #111827;
      font-size: 0.82rem;
      font-weight: 700;
      line-height: 1.3;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .dup-product-id {
      color: #64748b;
      font-size: 0.72rem;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      margin-top: 2px;
    }
    .dup-actions {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
    }
    .dup-view-btn,
    .dup-delete-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 30px;
      border-radius: 6px;
      padding: 6px 10px;
      font-size: 0.76rem;
      font-weight: 800;
      text-decoration: none;
      cursor: pointer;
    }
    .dup-view-btn { border: 1px solid #cbd5e1; background: #fff; color: #0f172a; }
    .dup-view-btn:hover { background: #f1f5f9; }
    .dup-delete-btn { border: 1px solid #d72c0d; background: #fff; color: #d72c0d; }
    .dup-delete-btn:hover { background: #fff4f4; }
    @media (max-width: 560px) {
      .dup-product-row { grid-template-columns: 1fr; }
      .dup-product-thumbs { display: none; }
      .dup-actions { justify-content: flex-start; }
    }

    /* Individual issue card */
    .issue-card {
      background: #ffffff;
      border: 1px solid #e1e3e5;
      border-radius: 8px;
      padding: 16px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.08);
      transition: box-shadow 0.15s ease, border-color 0.15s ease;
      animation: cardFadeIn 0.15s ease both;
      overflow: hidden;
    }

    @keyframes cardFadeIn {
      from { opacity: 0; transform: translateY(4px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* Stagger cards */
    .issue-card:nth-child(1)  { animation-delay: 0ms; }
    .issue-card:nth-child(2)  { animation-delay: 20ms; }
    .issue-card:nth-child(3)  { animation-delay: 40ms; }
    .issue-card:nth-child(4)  { animation-delay: 60ms; }
    .issue-card:nth-child(5)  { animation-delay: 80ms; }
    .issue-card:nth-child(6)  { animation-delay: 100ms; }
    .issue-card:nth-child(7)  { animation-delay: 120ms; }
    .issue-card:nth-child(8)  { animation-delay: 140ms; }
    .issue-card:nth-child(9)  { animation-delay: 160ms; }
    .issue-card:nth-child(10) { animation-delay: 180ms; }
    .issue-card:nth-child(11) { animation-delay: 200ms; }
    .issue-card:nth-child(12) { animation-delay: 220ms; }

    .issue-card:hover {
      box-shadow: 0 4px 12px rgba(0,0,0,0.12);
      border-color: #c4c7cc;
    }
    .issue-card--resolved {
      opacity: 0.65;
      background: #fafbfc;
    }
    .issue-card--opened {
      background: #f3f8ff;
      border-color: #9ec5eb;
      box-shadow: inset 3px 0 0 #3b82f6, 0 1px 3px rgba(0,0,0,0.06);
    }
    .issue-card--opened:hover {
      border-color: #7eb0e0;
    }
    .issue-opened-badge {
      font-size: 0.72rem;
      font-weight: 700;
      color: #1d4ed8;
      background: #dbeafe;
      border: 1px solid #93c5fd;
      border-radius: 999px;
      padding: 2px 8px;
      align-self: flex-start;
    }

    /* Card top row: severity badge + score */
    .issue-card-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    /* Severity badge */
    .sev-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.05em;
      border-radius: 999px;
      padding: 3px 8px;
    }
    .sev-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      flex-shrink: 0;
    }
    .sev-high  { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
    .sev-high .sev-dot  { background: #ef4444; }
    .sev-medium { background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa; }
    .sev-medium .sev-dot { background: #f97316; }
    .sev-low   { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
    .sev-low .sev-dot   { background: #22c55e; }

    /* Score */
    .issue-score {
      font-size: 0.78rem;
      font-weight: 700;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      min-width: 0;
      flex-shrink: 1;
      max-width: 70%;
    }
    .score-red    { color: #dc2626; }
    .score-orange { color: #d97706; }
    .score-green  { color: #16a34a; }

    /* Card title */
    .issue-card-title {
      font-size: 0.875rem;
      font-weight: 700;
      color: #0f172a;
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-width: 0;
    }

    /* Manual-only badge */
    .manual-only-badge {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #fcd34d;
      background: #fffbeb;
      color: #92400e;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.04em;
      padding: 2px 8px;
      align-self: flex-start;
    }

    /* Trust Sidekick hint */
    .trust-ai-hint {
      margin-top: 8px;
      padding: 8px 10px;
      background: #f0f7ff;
      border: 1px solid #bfdbfe;
      border-radius: 6px;
      font-size: 0.72rem;
      color: #1e40af;
      line-height: 1.45;
    }
    .trust-ai-hint-label {
      font-weight: 700;
      display: block;
      margin-bottom: 3px;
      color: #1d4ed8;
    }
    .trust-ai-hint-prompt {
      display: block;
      font-style: italic;
      color: #374151;
      word-break: break-word;
    }
    .trust-ai-hint-copy {
      display: inline-block;
      margin-top: 5px;
      padding: 2px 8px;
      font-size: 0.68rem;
      font-weight: 600;
      background: #dbeafe;
      border: 1px solid #93c5fd;
      border-radius: 4px;
      cursor: pointer;
      color: #1e40af;
    }
    .trust-ai-hint-copy:hover { background: #bfdbfe; }

    /* REQ-208: App Recommendation Cards */
    .app-rec-section {
      margin-top: 8px;
      border: 1px solid #e5e7eb;
      border-radius: 6px;
      overflow: hidden;
    }
    .app-rec-toggle {
      display: flex;
      align-items: center;
      gap: 6px;
      width: 100%;
      padding: 6px 10px;
      background: #f9fafb;
      border: none;
      cursor: pointer;
      font-size: 0.72rem;
      font-weight: 600;
      color: #374151;
      text-align: left;
    }
    .app-rec-toggle:hover { background: #f3f4f6; }
    .app-rec-toggle-arrow { font-size: 0.65rem; transition: transform 0.2s; }
    .app-rec-section.open .app-rec-toggle-arrow { transform: rotate(90deg); }
    .app-rec-list {
      display: none;
      padding: 6px 8px 8px;
      gap: 6px;
      flex-direction: column;
    }
    .app-rec-section.open .app-rec-list { display: flex; }
    .app-rec-card {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 8px;
      background: #fff;
      border: 1px solid #e5e7eb;
      border-radius: 5px;
    }
    .app-rec-initial {
      flex-shrink: 0;
      width: 28px;
      height: 28px;
      border-radius: 5px;
      background: #6366f1;
      color: #fff;
      font-size: 0.72rem;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .app-rec-info { flex: 1; min-width: 0; }
    .app-rec-name { font-size: 0.72rem; font-weight: 700; color: #111827; }
    .app-rec-desc { font-size: 0.67rem; color: #6b7280; line-height: 1.35; }
    .app-rec-btn {
      flex-shrink: 0;
      padding: 3px 8px;
      font-size: 0.67rem;
      font-weight: 600;
      background: #f3f4f6;
      border: 1px solid #d1d5db;
      border-radius: 4px;
      color: #374151;
      cursor: pointer;
      white-space: nowrap;
      text-decoration: none;
    }
    .app-rec-btn:hover { background: #e5e7eb; }

    /* Affected page URL */
    .issue-card-page {
      font-size: 0.75rem;
      color: #6b7280;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      min-width: 0;
    }
    .issue-card-page a {
      color: #0b63ce;
      text-decoration: none;
      font-weight: 500;
    }
    .issue-card-page a.product-link.status-active { color: #16a34a; }
    .issue-card-page a.product-link.status-draft { color: #6b7280; }
    .issue-card-page a.product-link.status-archived { color: #111827; }
    .issue-card-page a:hover { text-decoration: underline; }

    .issue-card-location-note {
      font-size: 0.72rem;
      color: #64748b;
      line-height: 1.35;
      margin-top: -3px;
      min-width: 0;
    }

    /* Suggestion text */
    .issue-card-suggestion {
      font-size: 0.75rem;
      color: #64748b;
      line-height: 1.45;
      overflow: visible;
      text-overflow: clip;
      flex: 0 0 auto;
      cursor: default;
      max-height: none;
      min-width: 0;
    }

    /* Absorbs row-height differences so action buttons stay compact */
    .issue-card-spacer {
      flex: 1 1 auto;
      min-height: 0;
    }

    /* Card footer: action buttons */
    .issue-card-footer {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-shrink: 0;
      padding-top: 0;
    }

    .card-fix-btn,
    .card-guide-btn {
      flex: 1 1 0;
      min-width: 0;
      align-self: center;
      border: 0;
      border-radius: 6px;
      padding: 6px 8px;
      font-size: 0.76rem;
      line-height: 1.25;
      font-weight: 600;
      cursor: pointer;
      background: linear-gradient(135deg, #0ea5e9, #0284c7);
      color: #fff;
      transition: background 0.15s, box-shadow 0.15s;
    }
    .card-fix-btn:hover,
    .card-guide-btn:hover {
      background: linear-gradient(135deg, #0284c7, #0369a1);
      box-shadow: 0 2px 8px rgba(14,165,233,0.3);
    }

    .card-ignore-btn {
      flex: 1 1 0;
      min-width: 0;
      align-self: center;
      border: 1px solid #d1d5db;
      border-radius: 6px;
      padding: 6px 8px;
      font-size: 0.76rem;
      line-height: 1.25;
      font-weight: 600;
      cursor: pointer;
      background: #fff;
      color: #374151;
      transition: background 0.15s, border-color 0.15s;
    }
    .card-ignore-btn:hover {
      background: #f9fafb;
      border-color: #9ca3af;
    }

    .card-delete-btn {
      flex: 1 1 0;
      min-width: 0;
      align-self: center;
      border: 1px solid #d72c0d;
      border-radius: 6px;
      padding: 6px 8px;
      font-size: 0.76rem;
      line-height: 1.25;
      font-weight: 600;
      cursor: pointer;
      background: #fff;
      color: #d72c0d;
      transition: background 0.15s, border-color 0.15s;
    }
    .card-delete-btn:hover {
      background: #fff4f4;
      border-color: #b91c1c;
    }

    /* Mobile: Shopify requires min 44px touch targets */
    @media (max-width: 500px) {
      .card-fix-btn,
      .card-guide-btn,
      .card-ignore-btn,
      .card-delete-btn {
        min-height: 44px;
        font-size: 0.85rem;
        padding: 10px 12px;
      }
    }

    /* Pending AI proposals banner */
    .pending-proposals-banner {
      background: linear-gradient(135deg, #fffbeb, #fef3c7);
      border: 1.5px solid #f59e0b;
      border-radius: 10px;
      padding: 14px 18px;
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 10px;
      font-size: 0.88rem;
      color: #92400e;
      font-weight: 500;
    }
    .pending-proposals-banner.hidden { display: none; }
    .pending-proposals-actions { display: flex; gap: 8px; flex-shrink: 0; }
    .pending-proposals-apply-btn {
      background: #f59e0b;
      color: #fff;
      border: none;
      border-radius: 6px;
      padding: 7px 16px;
      font-size: 0.83rem;
      font-weight: 700;
      cursor: pointer;
      min-height: 36px;
    }
    .pending-proposals-apply-btn:hover { background: #d97706; }
    .pending-proposals-dismiss-btn {
      background: transparent;
      border: 1px solid #f59e0b;
      border-radius: 6px;
      padding: 7px 12px;
      font-size: 0.83rem;
      color: #92400e;
      cursor: pointer;
      min-height: 36px;
    }
    .pending-proposals-dismiss-btn:hover { background: #fef3c7; }

    .card-resolved-badge {
      font-size: 0.72rem;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 999px;
      background: #f3f4f6;
      color: #6b7280;
      border: 1px solid #d1d5db;
      align-self: flex-start;
    }

    .shipping-inline-form {
      border: 1px solid #dbeafe;
      border-radius: 8px;
      background: #f8fbff;
      padding: 10px;
      display: grid;
      gap: 9px;
    }
    .shipping-inline-form label {
      display: grid;
      gap: 4px;
      font-size: 0.72rem;
      color: #475569;
      font-weight: 700;
    }
    .shipping-inline-form input,
    .shipping-inline-form select {
      width: 100%;
      min-height: 34px;
      border: 1px solid #cbd5e1;
      border-radius: 6px;
      padding: 7px 8px;
      font-size: 0.78rem;
      background: #fff;
      color: #0f172a;
    }
    .shipping-form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }
    .shipping-country-groups {
      display: grid;
      gap: 7px;
      max-height: 142px;
      overflow: auto;
      border: 1px solid #e2e8f0;
      border-radius: 6px;
      background: #fff;
      padding: 8px;
    }
    .shipping-region-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      color: #0f172a;
      font-size: 0.72rem;
      font-weight: 800;
    }
    .shipping-region-title button {
      border: 1px solid #bfdbfe;
      border-radius: 999px;
      background: #eff6ff;
      color: #1d4ed8;
      font-size: 0.68rem;
      font-weight: 800;
      padding: 2px 7px;
      cursor: pointer;
    }
    .shipping-country-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 4px 8px;
      margin-bottom: 2px;
    }
    .shipping-country-list label,
    .shipping-product-row {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
      font-size: 0.72rem;
      color: #334155;
      font-weight: 600;
    }
    .shipping-country-list input,
    .shipping-product-row input {
      width: 14px;
      height: 14px;
      min-height: 14px;
      flex: 0 0 auto;
      padding: 0;
    }
    .shipping-product-picker {
      display: grid;
      gap: 6px;
    }
    .shipping-product-list {
      display: grid;
      gap: 5px;
      max-height: 132px;
      overflow: auto;
      border: 1px solid #e2e8f0;
      border-radius: 6px;
      background: #fff;
      padding: 8px;
    }
    .shipping-product-meta {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .shipping-product-subtle {
      color: #64748b;
      font-size: 0.68rem;
      font-weight: 500;
    }
    .shipping-form-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .shipping-preview-btn,
    .shipping-load-products-btn {
      border: 1px solid #bfdbfe;
      border-radius: 6px;
      background: #eff6ff;
      color: #1d4ed8;
      font-size: 0.75rem;
      font-weight: 800;
      padding: 7px 10px;
      cursor: pointer;
    }
    .shipping-apply-btn {
      border: 0;
      border-radius: 6px;
      background: #0f766e;
      color: #fff;
      font-size: 0.75rem;
      font-weight: 800;
      padding: 7px 10px;
      cursor: pointer;
    }
    .shipping-form-note {
      color: #64748b;
      font-size: 0.7rem;
      line-height: 1.35;
    }

    /* Shipping Quick Setup Wizard */
    .shipping-wizard-open-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border: 0;
      border-radius: 8px;
      background: #0f766e;
      color: #fff;
      font-size: 0.8rem;
      font-weight: 700;
      padding: 9px 14px;
      cursor: pointer;
      margin-bottom: 4px;
    }
    .shipping-wizard-open-btn:hover { background: #0d6460; }
    .shipping-wizard-open-btn .wizard-badge {
      background: rgba(255,255,255,0.22);
      border-radius: 999px;
      font-size: 0.66rem;
      font-weight: 700;
      padding: 2px 6px;
    }
    .shipping-wizard-modal { max-width: 460px; }
    .shipping-wizard-close {
      position: absolute;
      top: 12px;
      right: 14px;
      background: none;
      border: none;
      font-size: 1.4rem;
      line-height: 1;
      color: #64748b;
      cursor: pointer;
      padding: 2px 6px;
    }
    .shipping-wizard-close:hover { color: #0f172a; }
    .shipping-wz-step { animation: fadeInUp 0.15s ease; }
    @keyframes fadeInUp { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
    .shipping-wz-label {
      font-size: 1rem;
      font-weight: 700;
      color: #0f172a;
      margin-bottom: 12px;
      line-height: 1.4;
    }
    .shipping-wz-label small {
      display: block;
      font-size: 0.75rem;
      color: #64748b;
      font-weight: 500;
      margin-top: 2px;
    }
    .shipping-wz-options {
      display: grid;
      gap: 8px;
      margin-bottom: 16px;
    }
    .shipping-wz-option {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      border: 2px solid #e2e8f0;
      border-radius: 10px;
      padding: 12px 14px;
      cursor: pointer;
      background: #fff;
      text-align: left;
      transition: border-color 0.1s, background 0.1s;
    }
    .shipping-wz-option:hover { border-color: #0f766e; background: #f0fdf4; }
    .shipping-wz-option.selected { border-color: #0f766e; background: #f0fdf4; }
    .shipping-wz-option-icon { font-size: 1.3rem; flex-shrink: 0; margin-top: 1px; }
    .shipping-wz-option-text strong { display: block; font-size: 0.85rem; font-weight: 700; color: #0f172a; }
    .shipping-wz-option-text span { font-size: 0.72rem; color: #64748b; }
    .shipping-wz-country-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin-bottom: 16px;
    }
    .shipping-wz-amount-row {
      display: grid;
      gap: 6px;
      margin-bottom: 16px;
    }
    .shipping-wz-amount-row label {
      font-size: 0.78rem;
      font-weight: 700;
      color: #334155;
    }
    .shipping-wz-amount-row input {
      width: 100%;
      border: 1.5px solid #cbd5e1;
      border-radius: 8px;
      padding: 9px 12px;
      font-size: 1rem;
      color: #0f172a;
      background: #fff;
      outline: none;
    }
    .shipping-wz-amount-row input:focus { border-color: #0f766e; }
    .shipping-wz-summary {
      background: #f0fdf4;
      border: 1px solid #bbf7d0;
      border-radius: 10px;
      padding: 14px;
      margin-bottom: 16px;
      font-size: 0.85rem;
      color: #065f46;
      font-weight: 600;
      line-height: 1.5;
    }
    .shipping-wz-nav {
      display: flex;
      gap: 8px;
      justify-content: space-between;
    }
    .shipping-wz-back {
      border: 1.5px solid #e2e8f0;
      border-radius: 8px;
      background: #fff;
      color: #475569;
      font-size: 0.8rem;
      font-weight: 700;
      padding: 8px 14px;
      cursor: pointer;
    }
    .shipping-wz-back:hover { background: #f8fafc; }
    .shipping-wz-next {
      border: 0;
      border-radius: 8px;
      background: #0f766e;
      color: #fff;
      font-size: 0.8rem;
      font-weight: 700;
      padding: 8px 18px;
      cursor: pointer;
      flex: 1;
    }
    .shipping-wz-next:hover { background: #0d6460; }
    .shipping-wz-next:disabled { background: #94a3b8; cursor: not-allowed; }
    .shipping-wz-progress {
      display: flex;
      gap: 4px;
      margin-bottom: 18px;
    }
    .shipping-wz-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #e2e8f0;
      transition: background 0.2s;
    }
    .shipping-wz-dot.active { background: #0f766e; }
    .shipping-wz-advanced-link {
      display: block;
      text-align: center;
      font-size: 0.72rem;
      color: #94a3b8;
      margin-top: 10px;
      text-decoration: none;
    }
    .shipping-wz-advanced-link:hover { color: #475569; }
    .shipping-wz-error {
      background: #fef2f2;
      border: 1px solid #fecaca;
      border-radius: 8px;
      padding: 10px 12px;
      font-size: 0.78rem;
      color: #b91c1c;
      margin-bottom: 12px;
    }

    /* Pagination row */
    .cat-pagination {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 8px;
      padding: 10px 16px 14px;
      border-top: 1px solid #f1f5f9;
      font-size: 0.8rem;
      color: #6b7280;
    }
    .cat-pagination-info { white-space: nowrap; }
    .cat-pagination-pages {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: wrap;
    }
    .cat-page-btn {
      border: 1px solid #e2e8f0;
      border-radius: 6px;
      background: #fff;
      color: #374151;
      font-size: 0.78rem;
      font-weight: 600;
      padding: 4px 9px;
      cursor: pointer;
      transition: background 0.1s, border-color 0.1s;
      min-width: 32px;
      text-align: center;
    }
    .cat-page-btn:hover:not(:disabled) {
      background: #f8fafc;
      border-color: #94a3b8;
    }
    .cat-page-btn:disabled {
      color: #c4c7cc;
      cursor: default;
      background: #fafbfc;
    }
    .cat-page-btn.active {
      background: #0ea5e9;
      border-color: #0ea5e9;
      color: #fff;
    }
    .cat-page-ellipsis {
      color: #9ca3af;
      padding: 0 2px;
      font-size: 0.8rem;
    }

    /* Empty state inside category */
    .cat-empty {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 24px 20px;
      color: #6b7280;
      font-size: 0.9rem;
    }

    /* Detected Issues — 3-level hierarchy */
    .di-root-card {
      background: #ffffff;
      border: 1px solid #dbe3ef;
      border-radius: 16px;
      box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
      overflow: hidden;
    }
    .di-root-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      padding: 18px 20px;
      cursor: pointer;
      user-select: none;
      background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
      border-bottom: 1px solid #e8edf4;
    }
    .di-root-header:hover { background: #f8fafc; }
    .di-root-title {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 1.12rem;
      font-weight: 800;
      color: #0f172a;
    }
    .di-root-summary {
      font-size: 0.82rem;
      font-weight: 600;
      color: #64748b;
      white-space: nowrap;
    }
    .di-root-summary strong {
      color: #0369a1;
      font-weight: 800;
    }
    .di-root-body {
      padding: 14px 16px 8px;
      background: #eef2f7;
    }
    .fix-all-btn-primary {
      border: 0;
      border-radius: 10px;
      background: linear-gradient(135deg, #22c55e, #16a34a);
      color: #ffffff;
      padding: 8px 14px;
      font-size: 0.78rem;
      font-weight: 800;
      cursor: pointer;
      white-space: nowrap;
      box-shadow: 0 2px 8px rgba(34, 197, 94, 0.22);
      transition: 0.2s;
    }
    .fix-all-btn-primary:hover {
      background: linear-gradient(135deg, #16a34a, #15803d);
      box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
    }
    .fix-all-btn-group {
      border: 0;
      background: linear-gradient(135deg, #22c55e, #16a34a);
      color: #ffffff;
      border-radius: 10px;
      padding: 6px 12px;
      font-size: 0.72rem;
      font-weight: 800;
      cursor: pointer;
      white-space: nowrap;
      box-shadow: 0 2px 8px rgba(34, 197, 94, 0.22);
      transition: 0.2s;
    }
    .fix-all-btn-group:hover {
      background: linear-gradient(135deg, #16a34a, #15803d);
      box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
    }
    .fix-all-btn-sub {
      border: 0;
      background: linear-gradient(135deg, #22c55e, #16a34a);
      color: #ffffff;
      border-radius: 10px;
      padding: 5px 10px;
      font-size: 0.7rem;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
      box-shadow: 0 1px 6px rgba(34, 197, 94, 0.2);
      transition: 0.2s;
    }
    .fix-all-btn-sub:hover {
      background: linear-gradient(135deg, #16a34a, #15803d);
      color: #ffffff;
    }

    /* Parent category groups */
    .parent-group-card {
      --parent-accent: #64748b;
      background: #ffffff;
      border: 1px solid #d7dee8;
      border-radius: 12px;
      margin-bottom: 12px;
      overflow: hidden;
      box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06);
      border-left: 6px solid var(--parent-accent);
    }
    .parent-group-card[data-expanded="true"] {
      background: color-mix(in srgb, var(--parent-accent) 12%, white);
      border-color: color-mix(in srgb, var(--parent-accent) 35%, #d7dee8);
      box-shadow: 0 4px 14px color-mix(in srgb, var(--parent-accent) 18%, transparent);
    }
    .parent-group-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      padding: 12px 14px 12px 12px;
      cursor: pointer;
      user-select: none;
      background: transparent;
      border-bottom: 1px solid transparent;
    }
    .parent-group-card[data-expanded="true"] .parent-group-header {
      border-bottom-color: color-mix(in srgb, var(--parent-accent) 18%, #e2e8f0);
    }
    .parent-group-header:hover {
      background: color-mix(in srgb, var(--parent-accent) 6%, white);
    }
    .parent-group-title {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--parent-accent);
      font-size: 0.78rem;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      flex-wrap: wrap;
    }
    .parent-issue-count {
      display: inline-flex;
      align-items: baseline;
      gap: 4px;
      margin-left: 4px;
      padding: 2px 8px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--parent-accent) 10%, white);
      border: 1px solid color-mix(in srgb, var(--parent-accent) 24%, white);
      color: #334155;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0;
      text-transform: none;
    }
    .parent-issue-count strong {
      color: var(--parent-accent);
      font-size: 0.9rem;
      font-weight: 800;
      line-height: 1;
    }
    .parent-group-body {
      padding: 10px 12px 12px 24px;
      border-left: 3px solid color-mix(in srgb, var(--parent-accent) 45%, #cbd5e1);
      margin: 0 12px 12px 16px;
      animation: catBodyOpen 0.2s ease both;
    }
    .category-card.nested-category {
      --parent-accent: #64748b;
      margin-bottom: 10px;
      margin-left: 4px;
      border-radius: 10px;
      border: 1px solid #dde4ee;
      border-left: 4px solid var(--parent-accent);
      box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
      background: #ffffff;
    }
    .category-card.nested-category .category-header {
      padding: 14px 16px;
      background: #ffffff;
    }
    .category-card.nested-category .category-header:hover {
      background: color-mix(in srgb, var(--parent-accent) 5%, white);
    }
    .category-card.nested-category .category-title {
      font-size: 0.95rem;
      font-weight: 600;
      color: #1e293b;
    }
    .category-card.nested-category .compact-badge {
      font-size: 0.68rem;
      padding: 3px 8px;
    }
    .group-placeholder {
      border: 1px dashed #d1d5db;
      border-radius: 12px;
      background: #ffffff;
      color: #6b7280;
      font-size: 0.85rem;
      line-height: 1.45;
      padding: 14px;
      margin: 6px 4px;
    }
    .group-parent-fix-btn {
      border: 1px solid #cbd5e1;
      background: #fff;
      border-radius: 999px;
      padding: 5px 10px;
      font-size: 0.74rem;
      font-weight: 700;
      color: #0f172a;
      cursor: pointer;
      white-space: nowrap;
    }
    .group-parent-fix-btn:hover {
      background: #f8fafc;
    }
    .group-status-badge {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid #d1d5db;
      padding: 3px 8px;
      font-size: 0.72rem;
      font-weight: 700;
      color: #475569;
      background: #ffffff;
    }
    .group-status-badge.not-scanned {
      color: #6b7280;
      border-color: #d1d5db;
      background: #f9fafb;
    }

    /* Health score widget */
    .health-widget {
      background: #ffffff;
      border: 1px solid #e5e7eb;
      border-radius: 16px;
      box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
      padding: 14px;
      margin: 6px 0 16px;
    }
    .health-widget.hidden {
      display: none;
    }
    .health-widget-top {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin-bottom: 10px;
      flex-wrap: wrap;
    }
    .health-widget-title {
      font-size: 1rem;
      font-weight: 800;
      color: #0f172a;
    }
    .health-widget-score {
      font-size: 1.05rem;
      font-weight: 800;
      color: #0f172a;
    }
    .health-overall-bar {
      height: 10px;
      border-radius: 999px;
      background: #e5e7eb;
      overflow: hidden;
      margin-bottom: 8px;
    }
    .health-overall-fill {
      height: 100%;
      border-radius: 999px;
      width: 0%;
      transition: width 1.1s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .health-overall-label {
      font-size: 0.82rem;
      font-weight: 700;
      margin-bottom: 10px;
    }
    .health-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .health-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(60px, 2fr) auto auto;
      align-items: center;
      gap: 8px;
      font-size: 0.8rem;
      overflow: hidden;
    }
    .health-row-label {
      color: #1f2937;
      font-weight: 600;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      min-width: 0;
    }
    .health-row-bar {
      height: 8px;
      border-radius: 999px;
      background: #e5e7eb;
      overflow: hidden;
    }
    .health-row-fill {
      height: 100%;
      border-radius: 999px;
      width: 0%;
      transition: width 0.9s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .health-row-score {
      color: #111827;
      font-weight: 700;
      min-width: 66px;
      text-align: right;
    }
    .health-row-icon {
      min-width: 18px;
      text-align: center;
    }
    .health-not-scanned {
      color: #9ca3af;
      font-weight: 600;
      min-width: 66px;
      text-align: right;
    }
    .health-mobile-summary {
      display: none;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      border: 1px solid #cbd5e1;
      border-radius: 14px;
      background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
      color: #111827;
      font-size: 0.84rem;
      font-weight: 700;
      padding: 14px 14px 14px 16px;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
      transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s ease;
      -webkit-tap-highlight-color: transparent;
    }
    .health-mobile-summary:active {
      transform: scale(0.985);
    }
    .health-mobile-summary:hover,
    .health-mobile-summary:focus-visible {
      border-color: #94a3b8;
      box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
      outline: none;
    }
    .health-mobile-summary.hint-pulse {
      animation: healthSummaryPulse 0.7s ease-in-out;
    }
    @keyframes healthSummaryPulse {
      0%, 100% { box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06); border-color: #cbd5e1; }
      50% { box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18), 0 4px 14px rgba(15, 23, 42, 0.1); border-color: #818cf8; }
    }
    .health-mobile-summary-main {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 3px;
      flex: 1;
      min-width: 0;
    }
    .health-mobile-summary-label {
      font-size: 0.68rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: #64748b;
    }
    .health-mobile-summary-score {
      font-size: 1.15rem;
      font-weight: 800;
      color: #0f172a;
      line-height: 1.15;
    }
    .health-mobile-summary-hint {
      font-size: 0.74rem;
      font-weight: 600;
      color: #6366f1;
    }
    .health-mobile-summary-action {
      flex-shrink: 0;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      min-width: 52px;
    }
    .health-mobile-summary-action-label {
      font-size: 0.62rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: #64748b;
    }
    .health-mobile-summary-chevron {
      width: 34px;
      height: 34px;
      border-radius: 999px;
      background: #eef2ff;
      color: #4338ca;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 1rem;
      font-weight: 800;
      line-height: 1;
      transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), background 0.2s ease;
    }
    .health-mobile-summary[aria-expanded="true"] .health-mobile-summary-chevron {
      transform: rotate(180deg);
      background: #dbeafe;
    }
    .health-mobile-summary[aria-expanded="true"] .health-mobile-summary-hint {
      color: #4338ca;
    }
    .health-mobile-details {
      display: block;
      max-height: none;
      opacity: 1;
      overflow: visible;
    }
    .health-mobile-details-inner {
      padding-top: 0;
    }

    .score-tone-red { color: #dc2626; }
    .score-tone-orange { color: #ea580c; }
    .score-tone-yellow { color: #ca8a04; }
    .score-tone-green { color: #16a34a; }
    .score-fill-red { background: linear-gradient(90deg, #ef4444, #dc2626); }
    .score-fill-orange { background: linear-gradient(90deg, #fb923c, #ea580c); }
    .score-fill-yellow { background: linear-gradient(90deg, #facc15, #ca8a04); }
    .score-fill-green { background: linear-gradient(90deg, #22c55e, #16a34a); }

    @media (max-width: 900px) {
      .dashboard-grid { flex-direction: column; }
      .health-row {
        grid-template-columns: 1fr auto;
        grid-template-areas:
          "label icon"
          "bar   bar"
          "score score";
        gap: 4px;
      }
      .health-row-label { grid-area: label; }
      .health-row-bar   { grid-area: bar; }
      .health-row-score { grid-area: score; }
      .health-row-icon  { grid-area: icon; align-self: center; }
      .health-row-score,
      .health-not-scanned {
        text-align: left;
      }
      .health-widget-top {
        display: none;
      }
      .health-mobile-summary {
        display: flex;
      }
      .health-mobile-details {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.9s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.7s ease;
      }
      .health-mobile-details-inner {
        padding-top: 12px;
      }
      .health-mobile-details.open {
        max-height: 1400px;
        opacity: 1;
      }
      .health-mobile-details.peek-hint {
        max-height: 104px;
        opacity: 1;
      }
      .health-mobile-details.peek-hint,
      .health-mobile-details.peek-closing {
        transition: max-height 1.05s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.85s ease;
      }
    }


/* A finished scan can still have unavailable checks. */
.toast-warning { background: #92400e; }
.scan-incomplete .bulk-fix-progress-percent { background: #92400e; }
.scan-incomplete .bulk-fix-progress-bar-fill { background: #d97706; }