/* ===== RESET & BASE ===== */
    :root {
      --brand-primary: #2b2f77;
      --brand-primary-dark: #20245f;
      --brand-primary-soft: #eef0ff;
      --brand-primary-border: #c7cdfc;
      --brand-accent: #b4b233;
      --brand-accent-dark: #8f8d22;
      --brand-accent-soft: #f5f5d8;
      --brand-accent-border: #d6d369;
      --surface-page: #f4f5fa;
      --surface-card: #ffffff;
      --surface-muted: #f8f9fc;
      --border-soft: #e2e8f0;
      --text-strong: #1a202c;
      --text-muted: #64748b;
      --text-subtle: #94a3b8;
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { font-size: 16px; }
    body {
      font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
      background: var(--surface-page);
      color: var(--text-strong);
      min-height: 100vh;
    }

    /* ===== HEADER ===== */
    header {
      background: var(--surface-card);
      color: #fff;
      padding: 0 2rem;
      min-height: 72px;
      display: flex;
      align-items: center;
      gap: 14px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.25);
      position: sticky;
      top: 0;
      z-index: 100;
    }
    .brand-block {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      min-width: 0;
    }
    .brand-logo {
      width: min(150px, 48vw);
      line-height: 0;
      flex-shrink: 0;
    }
    .brand-logo svg,
    .brand-logo img {
      width: 100%;
      height: auto;
      display: block;
    }
    header .subtitle {
      font-size: 0.78rem;
      color: #d8dcfb;
      margin-top: 0;
      text-align: center;
      letter-spacing: 0.01em;
    }
    .header-spacer { flex: 1; }
    .header-badge {
      background: var(--brand-primary-soft);
      color: var(--brand-primary);
      border: 1px solid var(--brand-primary-border);
      padding: 4px 10px;
      border-radius: 20px;
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    /* ===== LAYOUT ===== */
    .main-container {
      max-width: 1100px;
      margin: 0 auto;
      padding: 2rem 1.5rem 4rem;
    }

    /* ===== CARD ===== */
    .card {
      background: var(--surface-card);
      border-radius: 12px;
      border: 1px solid var(--border-soft);
      box-shadow: 0 1px 4px rgba(0,0,0,0.06);
      padding: 1.75rem;
      margin-bottom: 1.5rem;
    }
    .card-title {
      font-size: 0.8rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: var(--text-muted);
      margin-bottom: 1.25rem;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .card-title::before {
      content: '';
      display: inline-block;
      width: 3px;
      height: 14px;
      background: var(--brand-primary);
      border-radius: 2px;
    }

    /* ===== FORM CONTROLS ===== */
    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-bottom: 1rem;
    }
    @media (max-width: 600px) {
      .form-row { grid-template-columns: 1fr; }
    }
    .form-group { display: flex; flex-direction: column; gap: 6px; }
    label {
      font-size: 0.82rem;
      font-weight: 600;
      color: #334155;
    }
    select, input[list], textarea {
      border: 1.5px solid #d1d5db;
      border-radius: 8px;
      padding: 10px 12px;
      font-size: 0.92rem;
      font-family: inherit;
      color: var(--text-strong);
      background: var(--surface-card);
      transition: border-color 0.15s, box-shadow 0.15s;
      width: 100%;
    }
    select:focus, input[list]:focus, textarea:focus {
      outline: none;
      border-color: var(--brand-primary);
      box-shadow: 0 0 0 3px rgba(43,47,119,0.12);
    }
    select {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right 10px center;
      background-size: 16px;
      padding-right: 36px;
      cursor: pointer;
    }
    textarea {
      resize: vertical;
      min-height: 130px;
      font-family: 'Courier New', monospace;
      font-size: 0.88rem;
      line-height: 1.6;
    }
    .field-hint {
      font-size: 0.76rem;
      color: var(--text-subtle);
      margin-top: 2px;
    }
    .category-filters-section {
      margin-bottom: 1.25rem;
    }
    .cf-toggle {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 0.8rem;
      font-weight: 600;
      color: var(--brand-primary);
      background: var(--surface-muted);
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      padding: 6px 12px;
      cursor: pointer;
    }
    .cf-toggle:hover { background: var(--surface-card); }
    .cf-panel {
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      background: var(--surface-muted);
      padding: 0.85rem 1rem;
      margin-top: 0.6rem;
    }
    .cf-body {
      display: flex;
      flex-direction: column;
      gap: 0.7rem;
      margin-top: 0.6rem;
    }
    .cf-facet { display: flex; flex-direction: column; gap: 4px; }
    .cf-facet-name {
      font-size: 0.8rem;
      font-weight: 700;
      color: #334155;
    }
    .cf-chips { display: flex; flex-wrap: wrap; gap: 5px; }
    .cf-chip {
      font-size: 0.74rem;
      color: #334155;
      background: var(--surface-card);
      border: 1px solid #dbe3ef;
      border-radius: 999px;
      padding: 2px 9px;
    }
    .cf-empty {
      font-size: 0.78rem;
      color: var(--text-subtle);
    }
    .product-evidence-section {
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      background: var(--surface-muted);
      padding: 1rem;
      margin-bottom: 1.25rem;
    }
    .product-evidence-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 1rem;
      margin-bottom: 0.85rem;
    }
    .product-evidence-title {
      font-size: 0.84rem;
      font-weight: 700;
      color: #334155;
    }
    .product-evidence-rows {
      display: flex;
      flex-direction: column;
      gap: 0.9rem;
    }
    .product-evidence-row {
      border: 1px solid #dbe3ef;
      border-radius: 8px;
      background: var(--surface-card);
      padding: 0.9rem;
    }
    .product-evidence-code {
      font-family: 'Courier New', monospace;
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--brand-primary);
      margin-bottom: 0.75rem;
      word-break: break-word;
    }
    .product-evidence-fields { margin-bottom: 0; }
    .product-evidence-input {
      border: 1.5px solid #d1d5db;
      border-radius: 8px;
      padding: 10px 12px;
      font-size: 0.92rem;
      font-family: inherit;
      color: var(--text-strong);
      background: var(--surface-card);
      transition: border-color 0.15s, box-shadow 0.15s;
      width: 100%;
    }
    .product-evidence-input:focus {
      outline: none;
      border-color: var(--brand-primary);
      box-shadow: 0 0 0 3px rgba(43,47,119,0.12);
    }
    .product-evidence-pdf-input {
      min-height: 72px;
      font-family: 'Courier New', monospace;
    }
    .product-evidence-local-pdf {
      grid-column: 1 / -1;
      padding-top: 2px;
    }
    .local-pdf-input {
      padding: 9px 10px;
      font-size: 0.84rem;
    }
    .local-pdf-status {
      margin-top: 6px;
      font-size: 0.78rem;
      line-height: 1.4;
    }
    .local-pdf-status-empty { color: var(--text-subtle); }
    .local-pdf-status-attached { color: #166534; font-weight: 600; }
    .local-pdf-status-invalid { color: #b3261e; font-weight: 600; }
    .local-pdf-remove {
      margin-top: 6px;
      border: none;
      background: none;
      color: #b3261e;
      font-size: 0.78rem;
      font-weight: 600;
      cursor: pointer;
      padding: 0;
      text-decoration: underline;
    }
    .product-evidence-empty {
      color: var(--text-subtle);
      font-size: 0.8rem;
      line-height: 1.5;
    }

    /* ===== GENERATE BUTTON ===== */
    .btn-generate {
      width: 100%;
      padding: 13px 20px;
      background: linear-gradient(135deg, var(--brand-primary), var(--brand-primary-dark));
      color: #fff;
      font-size: 1rem;
      font-weight: 700;
      border: none;
      border-radius: 10px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      transition: all 0.2s;
      box-shadow: 0 2px 8px rgba(43,47,119,0.28);
      margin-top: 0.5rem;
    }
    .btn-generate:hover:not(:disabled) {
      background: linear-gradient(135deg, var(--brand-primary-dark), #181c4f);
      box-shadow: 0 4px 12px rgba(43,47,119,0.36);
      transform: translateY(-1px);
    }
    .btn-generate:active:not(:disabled) { transform: translateY(0); }
    .btn-generate:disabled {
      background: #94a3b8;
      box-shadow: none;
      cursor: not-allowed;
    }
    .btn-icon {
      width: 18px;
      height: 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .btn-icon svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    /* ===== PROGRESS SECTION ===== */
    #progress-section { display: none; }
    .progress-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 1rem;
    }
    .progress-counter {
      font-size: 0.82rem;
      color: var(--text-muted);
      font-weight: 600;
    }
    .progress-bar-wrap {
      background: #e2e8f0;
      border-radius: 999px;
      height: 6px;
      overflow: hidden;
      margin-bottom: 1.25rem;
    }
    .progress-bar-fill {
      height: 100%;
      background: linear-gradient(90deg, var(--brand-primary), #3a3f9a);
      border-radius: 999px;
      transition: width 0.4s ease;
      width: 0%;
    }
    .progress-list { display: flex; flex-direction: column; gap: 8px; }
    .progress-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 14px;
      border-radius: 8px;
      background: var(--surface-muted);
      border: 1px solid var(--border-soft);
      font-size: 0.88rem;
    }
    .progress-item .prod-code {
      font-family: 'Courier New', monospace;
      font-weight: 700;
      font-size: 0.84rem;
      color: var(--brand-primary);
      min-width: 160px;
    }
    .progress-item .prod-status { font-size: 0.8rem; color: var(--text-muted); flex: 1; }

    /* Status indicators */
    .status-icon { width: 22px; height: 22px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
    .status-waiting { background: #f1f5f9; color: var(--text-subtle); font-size: 0.65rem; }
    .status-loading { animation: spin 0.8s linear infinite; }
    .status-success { background: var(--brand-accent-soft); color: var(--brand-accent-dark); font-size: 0.9rem; }
    .status-error { background: #fee2e2; color: #dc2626; font-size: 0.9rem; }
    @keyframes spin {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }
    .spinner-svg { width: 22px; height: 22px; }

    /* ===== ERROR BANNER ===== */
    #error-banner {
      display: none;
      background: #fef2f2;
      border: 1px solid #fecaca;
      border-radius: 8px;
      padding: 12px 16px;
      margin-top: 1rem;
      font-size: 0.85rem;
      color: #991b1b;
      line-height: 1.5;
    }
    #error-banner strong { display: block; margin-bottom: 4px; }

    /* ===== RESULTS SECTION ===== */
    #results-section { display: none; }

    /* Tab navigation */
    .results-tabs-nav {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
      margin-bottom: 0;
      padding: 1rem 1.75rem 0;
      background: var(--surface-card);
      border-radius: 12px 12px 0 0;
      border: 1px solid var(--border-soft);
      border-bottom: none;
    }
    .tab-btn {
      padding: 8px 16px;
      border: 1.5px solid var(--border-soft);
      background: var(--surface-muted);
      border-radius: 8px 8px 0 0;
      font-size: 0.82rem;
      font-weight: 600;
      font-family: 'Courier New', monospace;
      cursor: pointer;
      color: var(--text-muted);
      transition: all 0.15s;
      position: relative;
      bottom: -1px;
    }
    .tab-btn:hover { background: var(--brand-primary-soft); color: var(--brand-primary); border-color: var(--brand-primary-border); }
    .tab-btn.active {
      background: var(--surface-card);
      color: var(--brand-primary);
      border-color: var(--border-soft);
      border-bottom-color: var(--surface-card);
    }
    .tab-btn .tab-status-dot {
      display: inline-block;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      margin-left: 6px;
      vertical-align: middle;
    }
    .tab-btn .dot-success { background: var(--brand-accent); }
    .tab-btn .dot-error { background: #ef4444; }

    /* Tab panels */
    .results-panel-wrap {
      background: var(--surface-card);
      border: 1px solid var(--border-soft);
      border-radius: 0 0 12px 12px;
      padding: 1.75rem;
      margin-bottom: 1.5rem;
    }
    .result-panel { display: none; }
    .result-panel.active { display: block; }

    /* Error panel */
    .result-error-msg {
      background: #fef2f2;
      border: 1px solid #fecaca;
      border-radius: 8px;
      padding: 16px;
      color: #991b1b;
      font-size: 0.88rem;
    }

    /* Magento field workspace */
    .magento-fields {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .magento-field-card {
      border: 1px solid var(--border-soft);
      border-radius: 10px;
      overflow: hidden;
      background: var(--surface-muted);
    }
    .magento-field-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px 14px;
      background: var(--surface-card);
      border-bottom: 1px solid var(--border-soft);
      flex-wrap: wrap;
    }
    .magento-field-meta {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }
    .magento-field-label {
      font-size: 0.76rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: var(--text-muted);
    }
    .field-type-badge {
      padding: 3px 8px;
      border-radius: 999px;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      border: 1px solid;
    }
    .field-type-html {
      background: var(--brand-primary-soft);
      color: var(--brand-primary);
      border-color: var(--brand-primary-border);
    }
    .field-type-text {
      background: #f8fafc;
      color: var(--text-muted);
      border-color: #cbd5e1;
    }
    .btn-copy-field {
      padding: 8px 14px;
      border-radius: 8px;
      font-size: 0.82rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.15s;
      border: 1.5px solid var(--brand-accent-border);
      background: var(--brand-accent-soft);
      color: var(--brand-accent-dark);
      box-shadow: 0 1px 2px rgba(180, 178, 51, 0.16);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }
    .btn-copy-field:hover:not(:disabled) {
      background: #ececae;
      border-color: var(--brand-accent);
      color: #6d6b19;
      box-shadow: 0 3px 8px rgba(180, 178, 51, 0.2);
    }
    .btn-copy-field:disabled {
      cursor: not-allowed;
      color: #94a3b8;
      background: #f8fafc;
      border-color: #e2e8f0;
    }
    .btn-copy-field.copied {
      background: #ddd961;
      color: #5f5d15;
      border-color: var(--brand-accent-dark);
      box-shadow: 0 2px 6px rgba(180, 178, 51, 0.24);
    }
    .magento-field-body {
      padding: 14px;
    }
    .field-value-text,
    .field-value-html,
    .field-missing {
      border-radius: 8px;
      padding: 12px 14px;
      font-size: 0.9rem;
      line-height: 1.7;
      background: var(--surface-card);
    }
    .field-value-text,
    .field-value-html {
      border: 1px solid var(--border-soft);
      color: var(--text-strong);
    }
    .field-value-text {
      white-space: pre-wrap;
      word-break: break-word;
    }
    .field-value-html p { margin-bottom: 0.9rem; }
    .field-value-html p:last-child { margin-bottom: 0; }
    .field-value-html ul,
    .field-value-html ol {
      margin: 0 0 0 1.25rem;
      padding: 0;
    }
    .field-value-html li { margin-bottom: 6px; }
    .field-value-html table.table-specs {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.85rem;
    }
    .field-value-html table.table-specs td {
      padding: 8px 10px;
      border: 1px solid var(--border-soft);
      vertical-align: top;
    }
    .field-value-html table.table-specs tr:nth-child(even) td {
      background: var(--surface-muted);
    }
    .field-value-html table.table-specs td:first-child {
      font-weight: 600;
      color: #374151;
      width: 38%;
      background: #eff1f9;
    }
    .field-missing {
      border: 1px dashed #cbd5e1;
      color: var(--text-subtle);
      font-style: italic;
    }

    .testing-mode-banner {
      display: block;
      padding: 12px 16px;
      margin-bottom: 16px;
      border: 1px dashed #f59e0b;
      border-radius: 10px;
      background: #fffbeb;
      color: #78350f;
      font-size: 0.85rem;
      line-height: 1.5;
    }
    .testing-mode-banner strong {
      color: #92400e;
      margin-right: 6px;
    }

    .testing-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      padding: 14px;
      margin-bottom: 14px;
      border: 1px dashed var(--brand-primary-border);
      border-radius: 10px;
      background: linear-gradient(135deg, #f8f9ff, #eef2ff);
    }
    .testing-badges {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .testing-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 10px;
      border-radius: 999px;
      border: 1px solid var(--brand-primary-border);
      background: var(--surface-card);
      color: var(--brand-primary);
      font-size: 0.76rem;
      font-weight: 700;
      letter-spacing: 0.03em;
    }
    .testing-badge strong {
      color: #334155;
      font-weight: 700;
    }
    .evidence-badge-row {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      margin-bottom: 14px;
    }
    .evidence-badge {
      display: inline-flex;
      align-items: center;
      padding: 5px 11px;
      border-radius: 999px;
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.02em;
      border: 1px solid transparent;
      white-space: nowrap;
    }
    .evidence-action {
      font-size: 0.8rem;
      color: var(--text-muted, #64748b);
    }
    .evidence-verified { background: #e7f6ec; color: #1b7a3d; border-color: #b6e2c4; }
    .evidence-missing { background: #f1f3f8; color: #5b647a; border-color: #d3d9e6; }
    .evidence-unconfirmed { background: #fff5e0; color: #9a6a06; border-color: #f0d79a; }
    .evidence-conflicting { background: #fdeaea; color: #b3261e; border-color: #f3c0bd; }
    .prov-attached-pdf-row {
      margin-top: 8px;
    }
    .provenance-summary-row {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 10px;
    }
    .provenance-count {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 5px 10px;
      border-radius: 999px;
      border: 1px solid transparent;
      font-size: 0.76rem;
      font-weight: 700;
      white-space: nowrap;
    }
    .provenance-count strong {
      font-weight: 800;
    }
    .provenance-attached-pdf { background: #e5f7f5; color: #08766b; border-color: #a9ded8; }
    .provenance-web-fallback { background: #eef0ff; color: #2b2f77; border-color: #c9ceff; }
    .provenance-unconfirmed { background: #fff5e0; color: #9a6a06; border-color: #f0d79a; }
    .provenance-extraction-failed { background: #fdeaea; color: #b3261e; border-color: #f3c0bd; }
    .provenance-not-attached { background: #f1f3f8; color: #5b647a; border-color: #d3d9e6; }
    .btn-export-html {
      padding: 9px 14px;
      border-radius: 8px;
      font-size: 0.82rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.15s;
      border: 1.5px solid var(--brand-primary-border);
      background: var(--brand-primary-soft);
      color: var(--brand-primary);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }
    .btn-export-html:hover {
      background: #dde3ff;
      border-color: #9aa6ff;
      color: var(--brand-primary-dark);
    }
    .btn-export-html:disabled {
      cursor: not-allowed;
      background: #f8fafc;
      border-color: #dbe2ea;
      color: #94a3b8;
      box-shadow: none;
    }
    .testing-debug-meta {
      margin-top: 10px;
      font-size: 0.8rem;
      color: #7f1d1d;
      line-height: 1.5;
    }

    /* ===== EMPTY STATE ===== */
    .empty-state {
      text-align: center;
      padding: 3rem 1rem;
      color: var(--text-subtle);
    }
    .empty-state .empty-icon { font-size: 3rem; margin-bottom: 1rem; }
    .empty-state p { font-size: 0.9rem; line-height: 1.6; }

    /* ===== SCHEMA STATUS BADGES ===== */
    .schema-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.03em;
    }
    .schema-badge-none {
      background: #fef2f2;
      color: #991b1b;
      border: 1px solid #fecaca;
    }
    .schema-badge-draft {
      background: #fefce8;
      color: #854d0e;
      border: 1px solid #fde68a;
    }
    .schema-badge-approved {
      background: #f0fdf4;
      color: #166534;
      border: 1px solid #bbf7d0;
    }
    .schema-scope-tag {
      display: inline-flex;
      align-items: center;
      padding: 3px 8px;
      border-radius: 999px;
      font-size: 0.68rem;
      font-weight: 600;
      letter-spacing: 0.03em;
      margin-left: 6px;
      background: #f1f5f9;
      color: #475569;
      border: 1px solid #cbd5e1;
      cursor: default;
    }
    .schema-scope-tag--brand {
      background: #eff6ff;
      color: #1e40af;
      border-color: #bfdbfe;
    }
    .btn-bootstrap {
      padding: 6px 12px;
      border-radius: 8px;
      font-size: 0.78rem;
      font-weight: 600;
      cursor: pointer;
      border: 1.5px solid var(--brand-primary-border);
      background: var(--brand-primary-soft);
      color: var(--brand-primary);
      margin-left: 8px;
      transition: all 0.15s;
    }
    .btn-bootstrap:hover:not(:disabled) {
      background: #dde3ff;
      border-color: #9aa6ff;
    }
    .btn-bootstrap:disabled {
      cursor: not-allowed;
      opacity: 0.5;
    }
    .bsf-form { font-size: 0.82rem; }
    .bsf-group { margin-bottom: 10px; }
    .bsf-label { display: block; font-weight: 600; color: var(--text-secondary); margin-bottom: 4px; }
    .bsf-row { display: flex; gap: 6px; margin-bottom: 4px; align-items: center; }
    .bsf-input {
      flex: 1; padding: 5px 8px; border: 1.5px solid var(--border);
      border-radius: 6px; font-size: 0.8rem; color: var(--text-primary);
      background: var(--bg-primary); min-width: 0;
    }
    .bsf-input:focus { outline: none; border-color: var(--brand-primary); }
    .bsf-btn-remove {
      background: none; border: none; cursor: pointer;
      color: var(--text-secondary); font-size: 1rem; padding: 0 4px; line-height: 1;
    }
    .bsf-btn-remove:hover { color: #dc2626; }
    .bsf-btn-add {
      font-size: 0.78rem; color: var(--brand-primary); background: none;
      border: none; cursor: pointer; padding: 0; text-decoration: underline;
    }
    .bsf-btn-add:disabled { opacity: 0.4; cursor: default; text-decoration: none; }
    .bsf-actions { display: flex; gap: 8px; margin-top: 8px; }
    .bsf-btn-confirm {
      padding: 5px 14px; border-radius: 7px; font-size: 0.8rem; font-weight: 600;
      cursor: pointer; border: 1.5px solid var(--brand-primary);
      background: var(--brand-primary); color: #fff;
    }
    .bsf-btn-cancel {
      padding: 5px 12px; border-radius: 7px; font-size: 0.8rem; font-weight: 600;
      cursor: pointer; border: 1.5px solid var(--border); background: none;
      color: var(--text-secondary);
    }
    .btn-approve {
      padding: 6px 12px;
      border-radius: 8px;
      font-size: 0.78rem;
      font-weight: 600;
      cursor: pointer;
      border: 1.5px solid #bbf7d0;
      background: #f0fdf4;
      color: #166534;
      margin-left: 8px;
      transition: all 0.15s;
    }
    .btn-approve:hover:not(:disabled) {
      background: #dcfce7;
      border-color: #86efac;
    }
    .btn-approve:disabled {
      cursor: not-allowed;
      opacity: 0.5;
    }
    #bootstrap-progress {
      display: none;
      margin: 10px auto 20px auto;
      padding: 10px 14px;
      border-radius: 8px;
      background: var(--surface-muted);
      border: 1px solid var(--border-soft);
      font-size: 0.82rem;
      color: var(--text-muted);
    }

    /* ===== FOOTER ===== */
    footer {
      text-align: center;
      padding: 1.5rem;
      font-size: 0.76rem;
      color: var(--text-subtle);
    }
    .field-type-source {
      background: var(--brand-primary-soft);
      color: var(--brand-primary);
      border-color: var(--brand-primary-border);
    }
    .source-link {
      display: block;
      color: var(--brand-primary);
      text-decoration: none;
      font-size: 0.88rem;
      padding: 4px 0;
      transition: color 0.15s;
    }
    .source-link:hover {
      color: var(--brand-primary-dark);
      text-decoration: underline;
    }
    .source-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .source-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 8px 10px;
      background: var(--surface-muted);
      border-radius: 6px;
    }
    .source-type-badge {
      flex-shrink: 0;
      font-size: 0.68rem;
      font-weight: 700;
      padding: 2px 6px;
      border-radius: 4px;
      background: #e8f0fe;
      color: #1a73e8;
      border: 1px solid #c5d8fb;
      letter-spacing: 0.05em;
      margin-top: 2px;
    }
    .source-type-pdf {
      background: #fce8e6;
      color: #c5221f;
      border-color: #f5c6c5;
    }
    .source-info {
      flex: 1;
      min-width: 0;
    }
    .source-title {
      display: block;
      color: var(--brand-primary);
      text-decoration: none;
      font-size: 0.88rem;
      font-weight: 500;
      word-break: break-word;
    }
    .source-title:hover {
      text-decoration: underline;
      color: var(--brand-primary-dark);
    }
    .source-url {
      display: block;
      font-size: 0.74rem;
      color: var(--text-subtle);
      margin-top: 2px;
      word-break: break-all;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .source-open-btn {
      flex-shrink: 0;
      font-size: 1rem;
      color: var(--text-subtle);
      text-decoration: none;
      padding: 1px 5px;
      border-radius: 4px;
      transition: background 0.15s, color 0.15s;
      line-height: 1.6;
    }
    .source-open-btn:hover {
      background: var(--surface-hover, #e8eaf0);
      color: var(--brand-primary);
    }

    /* ===== PROVENANCE PANEL (operator results) ===== */
    .prov-panel { margin-top: 14px; border-style: dashed; }
    .prov-meta {
      display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 10px;
      font-size: 0.82rem; color: var(--text-muted, #64748b);
    }
    .prov-meta-item strong { color: var(--text, #1f2937); }
    .prov-status-row {
      display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 6px 0;
    }
    .prov-counts { font-size: 0.8rem; color: var(--text-muted, #64748b); }
    .prov-action { font-size: 0.8rem; color: var(--text-muted, #64748b); margin: 4px 0 2px; }
    .prov-no-sources {
      margin-top: 8px; padding: 10px 12px; border-radius: 8px;
      background: #fff5e0; border: 1px solid #f0d79a; color: #7a5a06; font-size: 0.82rem; line-height: 1.5;
    }
    .prov-hint { margin-top: 6px; font-size: 0.78rem; color: #9a6a06; }
    .prov-conflicts {
      margin-top: 8px; padding: 10px 12px; border-radius: 8px;
      background: #fdeaea; border: 1px solid #f3c0bd; color: #8a2a22; font-size: 0.82rem; line-height: 1.5;
    }
    .prov-conflicts-head { font-weight: 700; margin-bottom: 6px; }
    .prov-conflicts-list { margin: 0; padding-left: 16px; }
    .prov-conflict-item { margin-bottom: 4px; }
    .prov-conflict-field { font-weight: 600; margin-right: 6px; }
    .prov-conflict-values { color: #7a3a34; }
    .prov-unconfirmed {
      margin-top: 8px; padding: 10px 12px; border-radius: 8px;
      background: #fff5e0; border: 1px solid #f0d79a; color: #7a5a06; font-size: 0.82rem; line-height: 1.5;
    }
    .prov-unconfirmed-head { font-weight: 700; margin-bottom: 6px; }
    .prov-unconfirmed-list { margin: 0; padding-left: 16px; }
    .prov-unconfirmed-item { margin-bottom: 3px; }
    .prov-unconfirmed-label { font-weight: 600; }

    /* ===== BOOTSTRAP RESULT (admin) ===== */
    .bootstrap-result { font-size: 0.82rem; color: var(--text, #1f2937); }
    .bsr-header {
      display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px;
    }
    .bsr-title { font-weight: 700; }
    .bsr-conf {
      display: inline-flex; padding: 3px 9px; border-radius: 999px;
      font-size: 0.72rem; font-weight: 700; border: 1px solid transparent;
    }
    .bsr-conf-good { background: #e7f6ec; color: #1b7a3d; border-color: #b6e2c4; }
    .bsr-conf-warn { background: #fff5e0; color: #9a6a06; border-color: #f0d79a; }
    .bsr-conf-bad { background: #fdeaea; color: #b3261e; border-color: #f3c0bd; }
    .bsr-block { margin-top: 10px; }
    .bsr-subtitle {
      font-size: 0.74rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.04em; color: var(--text-muted, #64748b); margin-bottom: 4px;
    }
    .bsr-timings { list-style: none; margin: 0; padding: 0; }
    .bsr-timings li {
      display: flex; justify-content: space-between; gap: 12px;
      padding: 2px 0; border-bottom: 1px dashed var(--border-soft, #e2e8f0);
    }
    .bsr-stage-time { color: var(--text-muted, #64748b); }
    .bsr-warnings { margin: 0; padding-left: 18px; }
    .bsr-warnings li { margin: 2px 0; line-height: 1.45; }
    .bsr-failed .bsr-warnings li { color: #b3261e; }
    .bsr-score { display: flex; align-items: center; gap: 10px; }
    .bsr-score-bar {
      flex: 1; height: 8px; border-radius: 999px; background: var(--surface-muted, #f1f3f8); overflow: hidden;
    }
    .bsr-score-fill { height: 100%; border-radius: 999px; }
    .bsr-score-good { background: #1b7a3d; }
    .bsr-score-warn { background: #d9a206; }
    .bsr-score-bad { background: #b3261e; }
    .bsr-score-val { font-weight: 700; font-size: 0.8rem; }

    /* ===== ADMIN SHELL BRANDING ===== */
    .admin-shell header {
      background: #1e3a5f;
      box-shadow: 0 2px 8px rgba(0,0,0,0.35);
    }
    .admin-shell-label {
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #93c5fd;
      padding: 3px 10px;
      border: 1px solid #3b82f6;
      border-radius: 999px;
      background: rgba(59,130,246,0.15);
    }
    /* Access denied screen */
    .access-denied {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 60vh;
      gap: 1rem;
      text-align: center;
      color: var(--text-muted);
    }
    .access-denied h2 {
      font-size: 1.4rem;
      font-weight: 700;
      color: #b91c1c;
    }
    .access-denied p { font-size: 0.95rem; }