/* === CSS extrahiert aus index.html (extrahiert 2026-04-26) === */
  @import url('/shared/fonts/inter.css');
  * { margin: 0; padding: 0; box-sizing: border-box; }

  :root {
    --bg: linear-gradient(145deg, #eef2f7 0%, #e4ecf4 25%, #dfe8f0 50%, #e8eef5 75%, #f0f4f8 100%);
    --nav-bg: rgba(255,255,255,0.55);
    --nav-border: rgba(255,255,255,0.5);
    --card-bg: rgba(255,255,255,0.45);
    --card-border: rgba(255,255,255,0.6);
    --card-hover-bg: rgba(255,255,255,0.65);
    --card-shadow: 0 2px 16px rgba(0,0,0,0.04);
    --card-hover-shadow: 0 12px 44px rgba(0,0,0,0.08);
    --text-primary: #1c1c1e;
    --text-secondary: #636366;
    --text-tertiary: #8e8e93;
    --badge-bg: rgba(4,179,214,0.1);
    --badge-color: #04b3d6;
    --toggle-bg: rgba(0,0,0,0.06);
    --toggle-knob: #fff;
    --input-bg: rgba(255,255,255,0.6);
    --input-border: rgba(0,0,0,0.1);
    --table-row-hover: rgba(4,179,214,0.06);
    --table-border: rgba(0,0,0,0.06);
    --modal-overlay: rgba(0,0,0,0.3);
    --modal-bg: rgba(255,255,255,0.85);
  }

  [data-theme="dark"] {
    --bg: linear-gradient(145deg, #0a0a1a 0%, #0f1528 20%, #151022 40%, #1a0f1e 60%, #12111a 80%, #0d1318 100%);
    --nav-bg: rgba(255,255,255,0.05);
    --nav-border: rgba(255,255,255,0.09);
    --card-bg: rgba(255,255,255,0.06);
    --card-border: rgba(255,255,255,0.1);
    --card-hover-bg: rgba(255,255,255,0.1);
    --card-shadow: 0 2px 16px rgba(0,0,0,0.2);
    --card-hover-shadow: 0 12px 44px rgba(0,0,0,0.3);
    --text-primary: #f5f5f7;
    --text-secondary: #a1a1a6;
    --text-tertiary: #636366;
    --badge-bg: rgba(4,179,214,0.15);
    --badge-color: #2cc5e4;
    --toggle-bg: rgba(255,255,255,0.1);
    --toggle-knob: #1c1c1e;
    --input-bg: rgba(255,255,255,0.07);
    --input-border: rgba(255,255,255,0.12);
    --table-row-hover: rgba(4,179,214,0.08);
    --table-border: rgba(255,255,255,0.07);
    --modal-overlay: rgba(0,0,0,0.6);
    --modal-bg: rgba(30,30,46,0.92);
  }

  body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
    min-height: 100vh;
    background: var(--bg);
    background-size: 400% 400%;
    animation: gradientShift 20s ease infinite;
    -webkit-font-smoothing: antialiased;
    transition: background 0.4s;
  }

  @keyframes gradientShift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }

  nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: var(--nav-bg);
    backdrop-filter: blur(44px) saturate(180%);
    -webkit-backdrop-filter: blur(44px) saturate(180%);
    border-bottom: 1px solid var(--nav-border);
    padding: 0 24px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background 0.3s;
  }

  .nav-left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex-shrink: 1;
    overflow: hidden;
  }

  .nav-logo { height: 28px; width: auto; }
  [data-theme="dark"] .nav-logo { filter: brightness(2.2) contrast(0.85); }

  .nav-brand {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.4px;
    transition: color 0.3s;
  }

  .nav-divider {
    width: 1px;
    height: 18px;
    background: var(--nav-border);
    margin: 0 2px;
  }

  .nav-subtitle {
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 500;
    transition: color 0.3s;
    white-space: nowrap;
  }

  .nav-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
  }

  .back-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 8px;
    border: 1px solid var(--card-border);
    background: var(--toggle-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    color: var(--text-secondary);
    font-size: 12.5px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s;
    -webkit-tap-highlight-color: transparent;
  }
  .back-btn:hover { background: var(--card-hover-bg); color: var(--text-primary); }

  .theme-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .toggle-icon { font-size: 14px; line-height: 1; }
  .toggle-track {
    width: 44px;
    height: 26px;
    border-radius: 13px;
    background: var(--toggle-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--card-border);
    position: relative;
    transition: all 0.3s;
  }
  .toggle-knob {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: var(--toggle-knob);
    position: absolute;
    top: 2px;
    left: 3px;
    transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
    box-shadow: 0 1px 4px rgba(0,0,0,0.15);
  }
  [data-theme="dark"] .toggle-knob { left: 21px; background: #f5f5f7; }

  .container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 36px 24px 60px;
  }

  .page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 28px;
    gap: 16px;
    flex-wrap: wrap;
  }

  .page-title h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.7px;
    transition: color 0.3s;
  }
  .page-title p {
    font-size: 14px;
    color: var(--text-secondary);
    margin-top: 4px;
    transition: color 0.3s;
  }

  .upload-btn {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 9px 18px;
    border-radius: 13px;
    border: none;
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 4px 16px rgba(4,179,214,0.3);
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .upload-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 22px rgba(4,179,214,0.4); }
  .upload-btn:active { transform: translateY(0); }

  .stat-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    margin-bottom: 28px;
  }

  .stat-card {
    background: var(--card-bg);
    backdrop-filter: blur(60px) saturate(180%);
    -webkit-backdrop-filter: blur(60px) saturate(180%);
    border: 1px solid var(--card-border);
    border-radius: 20px;
    padding: 20px 22px;
    box-shadow: var(--card-shadow);
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    cursor: pointer;
  }
  .stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--card-hover-shadow);
    background: var(--card-hover-bg);
  }
  .stat-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 50%;
    background: linear-gradient(180deg, rgba(255,255,255,0.18) 0%, transparent 100%);
    border-radius: 20px 20px 0 0;
    pointer-events: none;
  }
  [data-theme="dark"] .stat-card::before {
    background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, transparent 100%);
  }

  .stat-label {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    transition: color 0.3s;
  }

  .stat-value {
    font-size: 34px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -1px;
    line-height: 1;
    transition: color 0.3s;
  }
  .stat-value.error  { color: #ff453a; }
  .stat-value.accent { color: #04b3d6; }

  .stat-icon {
    position: absolute;
    top: 18px;
    right: 18px;
    font-size: 22px;
    opacity: 0.4;
  }

  .tab-bar {
    display: flex;
    gap: 4px;
    background: var(--card-bg);
    backdrop-filter: blur(40px) saturate(160%);
    -webkit-backdrop-filter: blur(40px) saturate(160%);
    border: 1px solid var(--card-border);
    border-radius: 14px;
    padding: 4px;
    margin-bottom: 20px;
    width: fit-content;
    box-shadow: var(--card-shadow);
  }

  .tab-btn {
    padding: 7px 18px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 13.5px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    -webkit-tap-highlight-color: transparent;
    white-space: nowrap;
  }
  .tab-btn:hover { color: var(--text-primary); }
  .tab-btn.active {
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 10px rgba(4,179,214,0.3);
  }

  .tab-panel { display: none; }
  .tab-panel.active { display: block; }

  .glass-panel {
    background: var(--card-bg);
    backdrop-filter: blur(60px) saturate(180%);
    -webkit-backdrop-filter: blur(60px) saturate(180%);
    border: 1px solid var(--card-border);
    border-radius: 20px;
    box-shadow: var(--card-shadow);
    overflow: hidden;
    position: relative;
  }
  .glass-panel::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 44px;
    background: linear-gradient(180deg, rgba(255,255,255,0.14) 0%, transparent 100%);
    border-radius: 20px 20px 0 0;
    pointer-events: none;
    z-index: 1;
  }
  [data-theme="dark"] .glass-panel::before {
    background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, transparent 100%);
  }

  .filter-bar {
    display: flex;
    gap: 10px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--table-border);
    flex-wrap: wrap;
    align-items: center;
  }

  .filter-bar select,
  .filter-bar input {
    padding: 7px 12px;
    border-radius: 10px;
    border: 1px solid var(--input-border);
    background: var(--input-bg);
    color: var(--text-primary);
    font-size: 13px;
    font-family: inherit;
    transition: all 0.2s;
    outline: none;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
  .filter-bar select:focus,
  .filter-bar input:focus {
    border-color: rgba(4,179,214,0.5);
    box-shadow: 0 0 0 3px rgba(4,179,214,0.1);
  }
  .filter-bar input { min-width: 200px; flex: 1; }

  .filter-btn {
    padding: 7px 14px;
    border-radius: 10px;
    border: none;
    background: rgba(4,179,214,0.12);
    color: #04b3d6;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    -webkit-tap-highlight-color: transparent;
  }
  .filter-btn:hover { background: rgba(4,179,214,0.2); }

  .table-wrap { overflow-x: auto; }

  table { width: 100%; border-collapse: collapse; font-size: 13.5px; }

  thead th {
    padding: 10px 16px;
    text-align: left;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--table-border);
    white-space: nowrap;
  }

  tbody tr {
    border-bottom: 1px solid var(--table-border);
    cursor: pointer;
    transition: background 0.15s;
  }
  tbody tr:last-child { border-bottom: none; }
  tbody tr:hover { background: var(--table-row-hover); }

  tbody td {
    padding: 11px 16px;
    color: var(--text-primary);
    transition: color 0.3s;
  }

  .td-secondary { color: var(--text-secondary); font-size: 13px; }
  .td-mono { font-variant-numeric: tabular-nums; }

  .status-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 7px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
  }
  .status-klassifiziert { background: rgba(4,179,214,0.12);   color: #04b3d6; }
  .status-offen         { background: rgba(255,159,10,0.12);  color: #ff9500; }
  .status-geprueft      { background: rgba(48,209,88,0.12);   color: #30d158; }
  .status-abgeglichen   { background: rgba(48,209,88,0.12);   color: #30d158; }
  .status-abgelegt      { background: rgba(142,142,147,0.12); color: #8e8e93; }
  .status-fehler        { background: rgba(255,69,58,0.12);   color: #ff453a; }
  [data-theme="dark"] .status-klassifiziert { color: #2cc5e4; }
  [data-theme="dark"] .status-offen         { color: #ffb340; }

  .kat-badge {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 500;
    background: rgba(142,142,147,0.1);
    color: var(--text-secondary);
    white-space: nowrap;
  }

  .alert-list { padding: 8px 0; }

  .alert-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--table-border);
    transition: background 0.15s;
  }
  .alert-item:last-child { border-bottom: none; }
  .alert-item:hover { background: var(--table-row-hover); }

  .alert-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 5px;
  }
  .alert-dot.error   { background: #ff453a; }
  .alert-dot.warning { background: #ff9500; }
  .alert-dot.info    { background: #04b3d6; }

  .alert-text { flex: 1; }
  .alert-title {
    font-size: 13.5px;
    font-weight: 500;
    color: var(--text-primary);
    transition: color 0.3s;
  }
  .alert-meta {
    font-size: 12px;
    color: var(--text-tertiary);
    margin-top: 2px;
    transition: color 0.3s;
  }

  .empty-state {
    text-align: center;
    padding: 52px 24px;
    color: var(--text-tertiary);
    font-size: 14px;
    transition: color 0.3s;
  }
  .empty-state .empty-icon { font-size: 36px; margin-bottom: 12px; opacity: 0.5; }

  .loading-state {
    text-align: center;
    padding: 52px 24px;
    color: var(--text-tertiary);
    font-size: 14px;
  }
  .spinner {
    width: 28px;
    height: 28px;
    border: 2.5px solid var(--card-border);
    border-top-color: #04b3d6;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
    margin: 0 auto 12px;
  }
  @keyframes spin { to { transform: rotate(360deg); } }

  .modal-overlay {
    position: fixed;
    inset: 0;
    background: var(--modal-overlay);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s;
  }
  .modal-overlay.open { opacity: 1; pointer-events: all; }

  .modal {
    background: var(--modal-bg);
    backdrop-filter: blur(60px) saturate(200%);
    -webkit-backdrop-filter: blur(60px) saturate(200%);
    border: 1px solid var(--card-border);
    border-radius: 20px;
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow: auto;
    box-shadow: 0 24px 80px rgba(0,0,0,0.2);
    transform: translateY(12px) scale(0.98);
    transition: transform 0.25s cubic-bezier(0.25,0.46,0.45,0.94), max-width 0.3s, max-height 0.3s, border-radius 0.3s;
  }
  .modal.with-preview {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .modal.with-preview .modal-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px 16px;
    min-height: 0;
  }
  .modal-overlay.open .modal { transform: translateY(0) scale(1); }
  .modal-overlay.fullscreen { padding: 10px; }

  .doc-preview-container {
    margin-top: 12px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--table-border);
    background: rgba(0,0,0,0.15);
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
  }
  .doc-preview-tabs {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--table-border);
  }
  .doc-preview-tab {
    flex: 1;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
  }
  .doc-preview-tab.active {
    color: var(--accent);
    background: rgba(4,179,214,0.08);
    box-shadow: inset 0 -2px 0 var(--accent);
  }
  .doc-preview-frame {
    width: 100%;
    height: 500px;
    border: none;
    background: #fff;
    border-radius: 0 0 12px 12px;
    flex: 1;
    min-height: 0;
  }
  .modal.with-preview .doc-preview-frame { height: 80vh; min-height: 500px; }
  .doc-preview-img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: 0 auto;
    border-radius: 0 0 12px 12px;
    object-fit: contain;
  }
  .modal.with-preview .doc-preview-img { max-height: none; flex: 1; min-height: 0; }
  .doc-preview-placeholder {
    padding: 40px 20px;
    text-align: center;
    color: var(--text-secondary);
    font-size: 14px;
  }
  @media (max-width: 700px) {
    .modal.with-preview { max-width: 100%; }
    .abgleich-preview-grid { flex-direction: column; }
  }

  /* Abgleich Side-by-Side */
  .abgleich-summary {
    padding: 0;
    margin-bottom: 10px;
    font-size: 13px;
    flex-shrink: 0;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }
  .abgleich-summary-label {
    color: var(--text-secondary);
    font-weight: 500;
  }
  .abgleich-info-card {
    flex: 1;
    min-width: 180px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--table-border);
    background: var(--card-bg);
  }
  .abgleich-info-card h4 {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-secondary);
  }
  .abgleich-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px 0;
    font-size: 13px;
  }
  .abgleich-info-row .label { color: var(--text-secondary); }
  .abgleich-info-row .value { font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; }
  .abgleich-info-row .value.mono { font-family: 'SF Mono', 'Fira Code', monospace; font-size: 12px; }
  .betrag-match { color: #30d158; }
  .betrag-warn { color: #ff9500; }
  .betrag-error { color: #ff453a; }
  .differenz-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
  }
  .differenz-badge.ok { background: rgba(48,209,88,0.1); color: #30d158; }
  .differenz-badge.warn { background: rgba(255,149,0,0.1); color: #ff9500; }
  .differenz-badge.error { background: rgba(255,69,58,0.1); color: #ff453a; }
  .konfidenz-bar {
    display: inline-block;
    width: 50px;
    height: 5px;
    border-radius: 3px;
    background: var(--table-border);
    vertical-align: middle;
    margin-left: 6px;
  }
  .konfidenz-fill {
    display: block;
    height: 100%;
    border-radius: 3px;
  }
  .zusammenfassung-text {
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.4;
    margin-top: 4px;
  }
  .abgleich-preview-grid {
    display: flex;
    gap: 12px;
    height: 70vh;
    min-height: 400px;
  }
  .abgleich-preview-col {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .abgleich-preview-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    flex-shrink: 0;
  }
  .abgleich-preview-frame {
    width: 100%;
    height: 500px;
    border: 1px solid var(--table-border);
    border-radius: 10px;
    background: #fff;
    flex: 1;
    min-height: 0;
  }
  .abgleich-preview-name {
    font-size: 12px;
    color: var(--text-secondary);
    margin-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--table-border);
    flex-shrink: 0;
  }
  .modal-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.3px;
    transition: color 0.3s;
  }
  .modal-close {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: var(--toggle-bg);
    color: var(--text-secondary);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    flex-shrink: 0;
  }
  .modal-close:hover { background: rgba(255,69,58,0.12); color: #ff453a; }

  .modal-body { padding: 20px 22px; }

  .detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 16px;
    flex-shrink: 0;
  }
  .modal.with-preview .detail-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 8px 14px;
    margin-bottom: 10px;
  }
  .detail-field label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    margin-bottom: 4px;
    transition: color 0.3s;
  }
  .detail-field .field-val {
    font-size: 13.5px;
    color: var(--text-primary);
    font-weight: 500;
    transition: color 0.3s;
    word-break: break-word;
  }
  .detail-field.full { grid-column: 1 / -1; }

  .modal-footer {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px 16px;
    border-top: 1px solid var(--table-border);
    flex-wrap: wrap;
    flex-shrink: 0;
  }

  .modal-footer select {
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid var(--input-border);
    background: var(--input-bg);
    color: var(--text-primary);
    font-size: 13px;
    font-family: inherit;
    outline: none;
    flex: 1;
    min-width: 140px;
  }

  .modal-action-btn {
    padding: 8px 18px;
    border-radius: 10px;
    border: none;
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
  }
  .modal-action-btn:hover { opacity: 0.88; }
  .modal-action-btn:disabled { opacity: 0.5; cursor: not-allowed; }

  .modal-delete-btn {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(255,69,58,0.3);
    background: rgba(255,69,58,0.1);
    color: #ff453a;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
  }
  .modal-delete-btn:hover { background: rgba(255,69,58,0.25); }

  .restore-btn {
    padding: 5px 12px;
    border-radius: 8px;
    border: 1px solid rgba(4,179,214,0.3);
    background: rgba(4,179,214,0.1);
    color: var(--accent);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
  }
  .restore-btn:hover { background: rgba(4,179,214,0.25); }
  .restore-btn:disabled { opacity: 0.5; cursor: not-allowed; }

  .upload-area {
    border: 2px dashed var(--card-border);
    border-radius: 14px;
    padding: 36px 24px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    color: var(--text-secondary);
    font-size: 14px;
    margin-bottom: 16px;
  }
  .upload-area:hover, .upload-area.drag-over {
    border-color: #04b3d6;
    background: rgba(4,179,214,0.05);
    color: #04b3d6;
  }
  .upload-area .upload-icon { font-size: 32px; margin-bottom: 10px; }
  .upload-area input[type="file"] { display: none; }

  .upload-progress {
    display: none;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--text-secondary);
    margin-top: 12px;
  }
  .upload-progress.active { display: flex; }
  .progress-bar-wrap {
    flex: 1;
    height: 4px;
    background: var(--toggle-bg);
    border-radius: 2px;
    overflow: hidden;
  }
  .progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #04b3d6, #0090b0);
    border-radius: 2px;
    width: 0%;
    transition: width 0.3s;
  }

  .panel-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 10px 16px 0;
  }

  .refresh-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 8px;
    border: 1px solid var(--card-border);
    background: var(--toggle-bg);
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    -webkit-tap-highlight-color: transparent;
  }
  .refresh-btn:hover { background: var(--card-hover-bg); color: var(--text-primary); }
  .refresh-btn svg { transition: transform 0.5s; }
  .refresh-btn.spinning svg { transform: rotate(360deg); }

  .betrag { font-variant-numeric: tabular-nums; white-space: nowrap; }

  .abgleich-ok     { color: #30d158; font-weight: 600; }
  .abgleich-diff   { color: #ff9500; font-weight: 600; }
  .abgleich-fehler { color: #ff453a; font-weight: 600; }

  /* Abgleich Split View */
  .abgleich-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
  }
  .abgleich-column {
    background: var(--card-bg);
    backdrop-filter: blur(60px) saturate(180%);
    -webkit-backdrop-filter: blur(60px) saturate(180%);
    border: 1px solid var(--card-border);
    border-radius: 20px;
    padding: 20px;
    box-shadow: var(--card-shadow);
  }
  .abgleich-col-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
  }
  .abgleich-col-title {
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .abgleich-col-title.ls { color: #ff9500; }
  .abgleich-col-title.re { color: #ff453a; }
  .abgleich-count {
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
  }
  .abgleich-count.ls { background: rgba(255,149,0,0.12); color: #ff9500; }
  .abgleich-count.re { background: rgba(255,69,58,0.12); color: #ff453a; }

  .abgleich-card {
    padding: 14px 16px;
    border-radius: 14px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid;
  }
  .abgleich-card:last-child { margin-bottom: 0; }
  .abgleich-card:hover { transform: translateY(-1px); }
  .abgleich-card.ls {
    background: rgba(255,149,0,0.06);
    border-color: rgba(255,149,0,0.2);
  }
  .abgleich-card.ls:hover { background: rgba(255,149,0,0.12); }
  .abgleich-card.re {
    background: rgba(255,69,58,0.06);
    border-color: rgba(255,69,58,0.2);
  }
  .abgleich-card.re:hover { background: rgba(255,69,58,0.12); }
  .abgleich-card.re.has-ref {
    background: rgba(48,209,88,0.06);
    border-color: rgba(48,209,88,0.2);
  }
  .abgleich-card.re.has-ref:hover { background: rgba(48,209,88,0.12); }

  .abgleich-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
  }
  .abgleich-card-supplier {
    font-weight: 600;
    font-size: 13px;
    color: var(--text-primary);
  }
  .abgleich-card-beleg {
    font-family: 'Inter', monospace;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
  }
  .abgleich-card-beleg.ls { color: #92400e; }
  [data-theme="dark"] .abgleich-card-beleg.ls { color: #fbbf24; }
  .abgleich-card-beleg.re { color: #0f172a; font-weight: 600; }
  [data-theme="dark"] .abgleich-card-beleg.re { color: #f5f5f7; }

  .abgleich-card-detail {
    font-size: 12px;
    color: var(--text-secondary);
    margin-top: 2px;
  }
  .abgleich-card-meta {
    font-size: 11px;
    color: var(--text-tertiary);
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .abgleich-card-ref {
    color: #30d158;
    font-weight: 600;
    font-size: 12px;
  }
  .abgleich-card-warn {
    color: #ff453a;
    font-size: 12px;
  }

  .abgleich-empty {
    text-align: center;
    padding: 32px 16px;
    color: var(--text-tertiary);
    font-size: 13px;
  }

  /* Action Buttons im Modal */
  .modal-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--table-border);
    flex-shrink: 0;
  }
  .action-btn {
    padding: 8px 16px;
    border-radius: 10px;
    border: 1px solid;
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent;
  }
  .action-btn:hover { opacity: 0.85; transform: translateY(-1px); }
  .action-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
  .action-btn.green { border-color: #30d158; color: #30d158; background: rgba(48,209,88,0.08); }
  .action-btn.blue { border-color: #04b3d6; color: #04b3d6; background: rgba(4,179,214,0.08); }
  .action-btn.orange { border-color: #ff9500; color: #ff9500; background: rgba(255,149,0,0.08); }
  .action-btn.purple { border-color: #af52de; color: #af52de; background: rgba(175,82,222,0.08); }
  .action-btn.red { border-color: #ff453a; color: #ff453a; background: rgba(255,69,58,0.08); }

  @media (max-width: 860px) {
    .abgleich-split { grid-template-columns: 1fr; }
  }

  .dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .dashboard-panel {
    padding: 22px;
  }

  .panel-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 16px;
    letter-spacing: -0.2px;
    transition: color 0.3s;
  }

  .pipeline-step {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    transition: background 0.15s;
  }
  .pipeline-step:nth-child(odd) { background: var(--table-row-hover); }

  .step-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
  }

  .step-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    transition: color 0.3s;
  }

  .step-desc {
    font-size: 11px;
    color: var(--text-secondary);
    transition: color 0.3s;
  }

  .step-arrow {
    color: var(--text-tertiary);
    font-size: 12px;
    margin-left: auto;
    flex-shrink: 0;
  }

  .category-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 4px;
    border-bottom: 1px solid var(--table-border);
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
  }
  .category-row:last-child { border-bottom: none; }
  .category-row:hover { background: var(--table-row-hover); }

  .cat-icon { font-size: 16px; flex-shrink: 0; }

  .cat-label {
    flex: 1;
    font-size: 13px;
    color: var(--text-primary);
    transition: color 0.3s;
  }

  .cat-bar-wrap {
    width: 80px;
    height: 6px;
    background: var(--toggle-bg);
    border-radius: 3px;
    overflow: hidden;
    flex-shrink: 0;
  }

  .cat-bar {
    height: 100%;
    border-radius: 3px;
    transition: width 0.5s ease;
  }

  .cat-count {
    width: 24px;
    text-align: right;
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
  }

  .folder-tree {
    font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 2;
    transition: color 0.3s;
  }
  .folder-tree b { color: var(--text-primary); font-weight: 600; }
  .folder-tree .tree-comment { color: var(--text-tertiary); font-weight: 400; }

  .dash-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    margin-bottom: 8px;
    border-left: 3px solid;
    transition: background 0.15s;
  }
  .dash-alert:last-child { margin-bottom: 0; }
  .dash-alert { cursor: pointer; }
  .dash-alert:hover { filter: brightness(0.97); }
  .dash-alert.success { border-color: #30d158; background: rgba(48,209,88,0.06); }
  .dash-alert.warning { border-color: #ff9500; background: rgba(255,149,0,0.06); }
  .dash-alert.error   { border-color: #ff453a; background: rgba(255,69,58,0.06); }
  [data-theme="dark"] .dash-alert.success { background: rgba(48,209,88,0.08); }
  [data-theme="dark"] .dash-alert.warning { background: rgba(255,149,0,0.08); }
  [data-theme="dark"] .dash-alert.error   { background: rgba(255,69,58,0.08); }

  .dash-alert-icon {
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
  }
  .dash-alert.success .dash-alert-icon { color: #30d158; }
  .dash-alert.warning .dash-alert-icon { color: #ff9500; }
  .dash-alert.error   .dash-alert-icon { color: #ff453a; }

  .dash-alert-msg {
    font-size: 13px;
    color: var(--text-primary);
    line-height: 1.4;
    transition: color 0.3s;
  }

  .dash-alert-time {
    font-size: 11px;
    color: var(--text-tertiary);
    margin-top: 2px;
    transition: color 0.3s;
  }

  @media (max-width: 860px) {
    .stat-grid { grid-template-columns: repeat(3, 1fr); }
    .dashboard-grid { grid-template-columns: 1fr; }
  }

  @media (max-width: 600px) {
    nav { padding: 0 12px; }
    .nav-subtitle { display: none; }
    .nav-divider  { display: none; }
    .nav-right { gap: 6px; }
    .back-text { display: none; }
    .back-btn { padding: 6px 10px; }
    .container { padding: 20px 12px 48px; }
    .page-header { flex-direction: column; gap: 12px; }
    .upload-btn { width: 100%; justify-content: center; }
    .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .stat-value { font-size: 26px; }
    .tab-bar { width: 100%; overflow-x: auto; }
    .tab-btn { flex: 1; text-align: center; padding: 7px 10px; font-size: 12.5px; }
    .filter-bar { padding: 12px 14px; }
    .filter-bar input { min-width: 0; }
    thead th:nth-child(4), tbody td:nth-child(4) { display: none; }
    .detail-grid { grid-template-columns: 1fr; }
    .modal { max-height: 90vh; }
  }

  @media (max-width: 420px) {
    thead th:nth-child(3), tbody td:nth-child(3) { display: none; }
  }

  /* ===== Pipeline Chat Panel ===== */
  .pchat-toggle {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    border: none;
    font-size: 24px;
    cursor: pointer;
    box-shadow: 0 4px 20px rgba(4,179,214,0.4);
    z-index: 210;
    display: none;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s;
  }
  .pchat-toggle:hover { transform: scale(1.08); }

  .pchat-panel {
    position: fixed;
    top: 0; bottom: 0;
    width: 400px;
    min-width: 300px;
    max-width: 80vw;
    background: var(--modal-bg);
    backdrop-filter: blur(60px) saturate(180%);
    -webkit-backdrop-filter: blur(60px) saturate(180%);
    border-left: 1px solid var(--card-border);
    z-index: 220;
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 30px rgba(0,0,0,0.12);
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    right: 0;
  }
  .pchat-panel.open { transform: translateX(0); }
  .pchat-panel.resizing { transition: none !important; }

  .pchat-resize-handle {
    position: absolute;
    left: -4px;
    top: 0;
    bottom: 0;
    width: 8px;
    cursor: col-resize;
    z-index: 221;
  }
  .pchat-resize-handle::after {
    content: '';
    position: absolute;
    left: 3px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 40px;
    border-radius: 2px;
    background: var(--text-secondary);
    opacity: 0;
    transition: opacity 0.2s;
  }
  .pchat-resize-handle:hover::after,
  .pchat-panel.resizing .pchat-resize-handle::after {
    opacity: 0.4;
  }

  .pchat-header {
    padding: 14px 18px;
    border-bottom: 1px solid var(--table-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
  }
  .pchat-header-title { font-size: 15px; font-weight: 700; color: var(--text-primary); }
  .pchat-header-sub { font-size: 11px; color: var(--text-secondary); margin-top: 2px; }
  .pchat-close {
    width: 28px; height: 28px; border-radius: 50%; border: none;
    background: var(--toggle-bg); color: var(--text-secondary); font-size: 15px;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    transition: all 0.2s; flex-shrink: 0;
  }
  .pchat-close:hover { background: rgba(255,69,58,0.12); color: #ff453a; }

  .pchat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .pchat-msg { max-width: 88%; }
  .pchat-msg.user { align-self: flex-end; }
  .pchat-msg.assistant { align-self: flex-start; }
  .pchat-bubble {
    padding: 10px 14px;
    border-radius: 16px;
    font-size: 13.5px;
    line-height: 1.5;
    word-break: break-word;
  }
  .pchat-msg.user .pchat-bubble {
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff;
    border-bottom-right-radius: 4px;
  }
  .pchat-msg.assistant .pchat-bubble {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    color: var(--text-primary);
    border-bottom-left-radius: 4px;
  }
  .pchat-tool-status {
    font-size: 11px;
    color: var(--accent);
    padding: 4px 0;
    font-style: italic;
  }

  /* Markdown in Chat-Bubbles */
  .pchat-msg.assistant .pchat-bubble p { margin: 0 0 8px 0; }
  .pchat-msg.assistant .pchat-bubble p:last-child { margin-bottom: 0; }
  .pchat-msg.assistant .pchat-bubble strong { font-weight: 600; }
  .pchat-msg.assistant .pchat-bubble em { font-style: italic; }
  .pchat-msg.assistant .pchat-bubble ul,
  .pchat-msg.assistant .pchat-bubble ol { margin: 6px 0; padding-left: 18px; }
  .pchat-msg.assistant .pchat-bubble li { margin: 3px 0; }
  .pchat-msg.assistant .pchat-bubble code {
    background: rgba(0,0,0,0.06);
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 12px;
    font-family: 'SF Mono', Menlo, monospace;
  }
  .pchat-msg.assistant .pchat-bubble pre {
    background: rgba(0,0,0,0.06);
    padding: 8px 10px;
    border-radius: 6px;
    overflow-x: auto;
    margin: 6px 0;
    font-size: 12px;
  }
  .pchat-msg.assistant .pchat-bubble pre code {
    background: none;
    padding: 0;
  }
  .pchat-msg.assistant .pchat-bubble table {
    width: 100%;
    border-collapse: collapse;
    margin: 8px 0;
    font-size: 12.5px;
  }
  .pchat-msg.assistant .pchat-bubble thead th {
    background: rgba(4,179,214,0.08);
    font-weight: 600;
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid var(--accent);
    white-space: nowrap;
  }
  .pchat-msg.assistant .pchat-bubble tbody td {
    padding: 5px 8px;
    border-bottom: 1px solid var(--table-border);
  }
  .pchat-msg.assistant .pchat-bubble tbody tr:last-child td {
    border-bottom: none;
  }
  .pchat-msg.assistant .pchat-bubble blockquote {
    border-left: 3px solid var(--accent);
    margin: 6px 0;
    padding: 4px 10px;
    color: var(--text-secondary);
    font-size: 12.5px;
  }
  .pchat-msg.assistant .pchat-bubble h1,
  .pchat-msg.assistant .pchat-bubble h2,
  .pchat-msg.assistant .pchat-bubble h3 {
    font-size: 13.5px;
    font-weight: 700;
    margin: 10px 0 4px 0;
  }
  .pchat-msg.assistant .pchat-bubble hr {
    border: none;
    border-top: 1px solid var(--table-border);
    margin: 8px 0;
  }

  [data-theme="dark"] .pchat-msg.assistant .pchat-bubble code { background: rgba(255,255,255,0.08); }
  [data-theme="dark"] .pchat-msg.assistant .pchat-bubble pre { background: rgba(255,255,255,0.08); }
  [data-theme="dark"] .pchat-msg.assistant .pchat-bubble thead th { background: rgba(4,179,214,0.15); }
  .pchat-status-indicator {
    align-self: flex-start;
    font-size: 12px;
    color: var(--text-secondary);
    padding: 8px 14px;
    border-radius: 12px;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .pchat-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    animation: pulse-dot 1.2s ease-in-out infinite;
    flex-shrink: 0;
  }
  @keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.7); }
  }

  .pchat-input-area {
    padding: 12px 16px;
    border-top: 1px solid var(--table-border);
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    align-items: flex-end;
  }
  .pchat-input {
    flex: 1;
    resize: none;
    border: 1px solid var(--input-border);
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 13.5px;
    font-family: inherit;
    background: var(--input-bg);
    color: var(--text-primary);
    max-height: 100px;
    outline: none;
    transition: border-color 0.2s;
  }
  .pchat-input:focus { border-color: var(--accent); }
  .pchat-send {
    width: 40px; height: 40px; border-radius: 50%; border: none;
    background: linear-gradient(135deg, #04b3d6, #0090b0);
    color: #fff; font-size: 18px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: opacity 0.2s; flex-shrink: 0;
  }
  .pchat-send:disabled { opacity: 0.4; cursor: not-allowed; }
  .pchat-send:hover:not(:disabled) { opacity: 0.88; }
  .pchat-mic {
    width: 40px; height: 40px; border-radius: 50%; border: none;
    background: var(--toggle-bg); color: var(--text-secondary);
    font-size: 18px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.2s; flex-shrink: 0;
  }
  .pchat-mic:hover { color: var(--accent); }
  .pchat-mic.recording { color: #ff453a; animation: pchat-pulse 1s infinite; background: rgba(255,69,58,0.1); }
  @keyframes pchat-pulse { 0%,100%{opacity:1} 50%{opacity:0.5} }

  @media (max-width: 700px) {
    .pchat-panel { width: 100% !important; min-width: unset; }
    .pchat-resize-handle { display: none; }
  }

  /* ===== Artikelvergleich ===== */
  .pos-card {
    min-width: 100%;
    padding: 14px 18px;
  }
  .pos-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    cursor: pointer;
    user-select: none;
  }
  .pos-header:hover { opacity: 0.8; }
  .pos-header h4 {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-secondary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .pos-header h4 .pos-chevron {
    display: inline-block;
    transition: transform 0.2s;
    font-size: 10px;
  }
  .pos-header h4 .pos-chevron.collapsed { transform: rotate(-90deg); }
  .pos-table-wrap {
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.2s;
    max-height: 2000px;
    opacity: 1;
  }
  .pos-table-wrap.collapsed {
    max-height: 0;
    opacity: 0;
  }
  .pos-stats {
    font-size: 11px;
    display: flex;
    gap: 10px;
  }
  .pos-stats span { padding: 2px 8px; border-radius: 8px; font-weight: 600; }
  .pos-stats .pos-s-ok { background: rgba(48,209,88,0.12); color: #30d158; }
  .pos-stats .pos-s-diff { background: rgba(255,149,0,0.12); color: #ff9500; }
  .pos-stats .pos-s-miss { background: rgba(255,69,58,0.12); color: #ff453a; }

  .pos-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
  }
  .pos-table th {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: var(--text-secondary);
    font-weight: 700;
    padding: 6px 8px;
    border-bottom: 2px solid var(--table-border);
    text-align: left;
    white-space: nowrap;
  }
  .pos-table th.pos-th-group {
    text-align: center;
    font-size: 10px;
    color: var(--accent);
    border-bottom: 1px solid var(--accent);
    padding: 4px 8px 2px;
  }
  .pos-table th.num { text-align: right; }
  .pos-table td {
    padding: 5px 8px;
    border-bottom: 1px solid var(--table-border);
  }
  .pos-table td.num { text-align: right; }
  .pos-table td.pos-border-l,
  .pos-table th.pos-border-l {
    border-left: 2px solid var(--table-border);
  }
  .pos-table tr:last-child td { border-bottom: none; }
  .pos-table tr.pos-match td { }
  .pos-table tr.pos-diff td { background: rgba(255,149,0,0.06); }
  .pos-table tr.pos-missing td { background: rgba(255,69,58,0.06); }
  .pos-table tr.pos-pfand td { color: var(--text-secondary); font-style: italic; font-size: 11px; }
  .pos-table tr.pos-sum td { border-top: 2px solid var(--table-border); font-weight: 700; font-size: 12px; }
  .pos-val-ok { color: #30d158; }
  .pos-val-diff { color: #ff9500; font-weight: 600; }
  .pos-val-miss { color: #ff453a; font-weight: 600; }
  .pos-status { text-align: center; font-size: 11px; }
  .pos-no-data {
    text-align: center;
    padding: 20px;
    color: var(--text-secondary);
    font-size: 12px;
    font-style: italic;
  }


/* === Auto-generierte Klassen aus inline style="..." (index.html, 17 unique) === */
.s-bc7378 { display:flex;align-items:center;gap:6px; }
.s-b7b688 { width:8px;height:8px;border-radius:50%;background:#8e8e93;transition:all 0.3s; }
.s-fd5787 { font-size:12px;color:var(--text-tertiary);white-space:nowrap;transition:color 0.3s; }
.s-96b971 { display:flex;gap:8px;flex-wrap:wrap; }
.s-2712b6 { background:linear-gradient(135deg,#ff6b6b,#ee5a24); }
.s-b3ce68 { color:#ff9500; }
.s-632c2a { color:#30d158; }
.s-af633e { color:#059669; }
.s-77d93f { padding-left:20px; }
.s-605476 { padding-left:40px; }
.s-6e7ad9 { justify-content:space-between;padding:10px 16px; }
.s-bcf003 { font-size:14px;font-weight:600;color:var(--text-primary); }
.s-50487d { font-size:12px;margin-top:6px;opacity:0.7; }
.s-92d173 { margin-top:10px; }
.s-e5a82c { font-size:13px;margin-top:10px;display:none; }
.s-8588e4 { width:100%; }
.s-b78c4f { position:fixed;bottom:24px;right:24px;z-index:999;background:#04b3d6;color:#fff;border:none;border-radius:50%;width:56px;height:56px;font-size:24px;cursor:pointer;box-shadow:0 4px 16px rgba(4,179,214,0.4); }


/* === Auto-Klassen aus inline style="..." in index.js (29 unique) === */
.s-58aba5 { cursor:pointer; }
.s-632c2a { color:#30d158; }
.s-539b04 { text-align:center; }
.s-84712b { opacity:0.4; }
.s-716ecf { margin-top:20px; }
.s-b30e2c { margin-bottom:8px; }
.s-e7620a { font-size:11px;color:var(--text-secondary); }
.s-090c37 { opacity:0.7; }
.s-a5d2ba { font-weight:600; }
.s-bc36f0 { width:' + pct + '%;background:' + color + '; }
.s-9bd93d { font-size:12px; }
.s-d94fb9 { margin-top:4px;padding-top:4px;border-top:1px solid var(--table-border); }
.s-587b40 { min-width:100%; }
.s-e3f221 { object-fit:contain; }
.s-93b8ea { display:none; }
.s-82f4b9 { color:var(--accent);font-weight:600;font-size:15px;text-decoration:none; }
.s-c222a6 { display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--table-border);font-size:13px; }
.s-8aab4e { flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.s-9e79ed { color:var(--text-secondary);flex-shrink:0; }
.s-584a98 { flex-shrink:0;width:20px;text-align:center; }
.s-8895c1 { background:none;border:none;color:#ff453a;cursor:pointer;font-size:16px;flex-shrink:0;padding:0 4px; }
.s-24c661 { width:14px;height:14px;border-width:2px;display:inline-block; }
.s-3ae4da { color:#ff453a; }
.s-d163f8 { font-size:13px;color:var(--text-secondary);margin-bottom:12px; }
.s-b2fca5 { padding:24px; }
.s-d5e8c5 { flex:1; }
.s-f871cb { width:' + pct + '%;background:' + meta.color + '; }
.s-8e6968 { color:' + meta.color + '; }
.s-e31aa9 { opacity:0.3; }