:root[data-theme="dark"] {
    --bg: #0f1419; --card: #1a2332; --text: #e7ecf3; --muted: #8b9bb4;
    --accent: #ff6b9d; --accent2: #ffa94d; --border: #2a3548;
    --bar1: #ff6b9d; --bar2: #ffa94d; --bar3: #6bcf7f; --bar4: #4dabf7;
  }
  :root[data-theme="light"] {
    --bg: #f5f7fa; --card: #ffffff; --text: #1a2332; --muted: #6b7a90;
    --accent: #e91e63; --accent2: #f57c00; --border: #e0e6ed;
    --bar1: #e91e63; --bar2: #f57c00; --bar3: #43a047; --bar4: #1e88e5;
  }
  * { box-sizing: border-box; }
  body { font-family: -apple-system, system-ui, sans-serif; background: var(--bg); color: var(--text); margin: 0; padding: 20px; }
  h1 { margin: 0 0 8px; }
  .sub { color: var(--muted); margin-bottom: 24px; }
  .toolbar { display:flex; gap:12px; align-items:center; margin-bottom:24px; flex-wrap:wrap; }
  .toolbar a { color: var(--accent); text-decoration:none; padding:8px 14px; border:1px solid var(--border); border-radius:8px; }
  select, button { background: var(--card); color: var(--text); border: 1px solid var(--border); padding: 8px 14px; border-radius: 8px; font-size: 14px; cursor: pointer; }
  .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 24px; }
  .card { background: var(--card); border-radius: 12px; padding: 18px; border: 1px solid var(--border); }
  .card-label { color: var(--muted); font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; }
  .card-value { font-size: 32px; font-weight: 700; margin-top: 6px; }
  .card-value.accent { color: var(--accent); }
  .panel { background: var(--card); border-radius: 12px; padding: 20px; border: 1px solid var(--border); margin-bottom: 20px; }
  .panel h2 { margin-top: 0; font-size: 18px; }
  .bar-row { display: grid; grid-template-columns: 130px 1fr 80px; align-items: center; gap: 12px; margin-bottom: 10px; }
  .bar-label { font-size: 13px; color: var(--muted); }
  .bar-container { background: var(--border); height: 24px; border-radius: 6px; overflow: hidden; position: relative; }
  .bar-fill { height: 100%; border-radius: 6px; transition: width 0.5s; }
  .bar-value { font-weight: 600; text-align: right; font-size: 14px; }
  table { width:100%; border-collapse: collapse; }
  th, td { padding: 10px; text-align: left; border-bottom: 1px solid var(--border); font-size: 14px; }
  th { color: var(--muted); font-weight: 600; font-size: 12px; text-transform: uppercase; }
  td.num { text-align: right; font-variant-numeric: tabular-nums; }
  .src-tag { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; }
  .src-dealabs { background:#ff6b9d33; color:#ff6b9d; }
  .src-camelcamelcamel { background:#ffa94d33; color:#ffa94d; }
  .src-ledenicheur { background:#6bcf7f33; color:#6bcf7f; }
  .src-bonsplansmalins { background:#4dabf733; color:#4dabf7; }
  .loading { color: var(--muted); padding: 40px; text-align: center; }

.bar-source-dealabs { background: var(--bar1); }
.bar-source-camelcamelcamel { background: var(--bar2); }
.bar-source-ledenicheur { background: var(--bar3); }
.bar-source-bonsplansmalins { background: var(--bar4); }
.bar-source-default { background: var(--accent); }
.bar-width-0 { width: 0%; }
.bar-width-1 { width: 1%; }
.bar-width-2 { width: 2%; }
.bar-width-3 { width: 3%; }
.bar-width-4 { width: 4%; }
.bar-width-5 { width: 5%; }
.bar-width-6 { width: 6%; }
.bar-width-7 { width: 7%; }
.bar-width-8 { width: 8%; }
.bar-width-9 { width: 9%; }
.bar-width-10 { width: 10%; }
.bar-width-11 { width: 11%; }
.bar-width-12 { width: 12%; }
.bar-width-13 { width: 13%; }
.bar-width-14 { width: 14%; }
.bar-width-15 { width: 15%; }
.bar-width-16 { width: 16%; }
.bar-width-17 { width: 17%; }
.bar-width-18 { width: 18%; }
.bar-width-19 { width: 19%; }
.bar-width-20 { width: 20%; }
.bar-width-21 { width: 21%; }
.bar-width-22 { width: 22%; }
.bar-width-23 { width: 23%; }
.bar-width-24 { width: 24%; }
.bar-width-25 { width: 25%; }
.bar-width-26 { width: 26%; }
.bar-width-27 { width: 27%; }
.bar-width-28 { width: 28%; }
.bar-width-29 { width: 29%; }
.bar-width-30 { width: 30%; }
.bar-width-31 { width: 31%; }
.bar-width-32 { width: 32%; }
.bar-width-33 { width: 33%; }
.bar-width-34 { width: 34%; }
.bar-width-35 { width: 35%; }
.bar-width-36 { width: 36%; }
.bar-width-37 { width: 37%; }
.bar-width-38 { width: 38%; }
.bar-width-39 { width: 39%; }
.bar-width-40 { width: 40%; }
.bar-width-41 { width: 41%; }
.bar-width-42 { width: 42%; }
.bar-width-43 { width: 43%; }
.bar-width-44 { width: 44%; }
.bar-width-45 { width: 45%; }
.bar-width-46 { width: 46%; }
.bar-width-47 { width: 47%; }
.bar-width-48 { width: 48%; }
.bar-width-49 { width: 49%; }
.bar-width-50 { width: 50%; }
.bar-width-51 { width: 51%; }
.bar-width-52 { width: 52%; }
.bar-width-53 { width: 53%; }
.bar-width-54 { width: 54%; }
.bar-width-55 { width: 55%; }
.bar-width-56 { width: 56%; }
.bar-width-57 { width: 57%; }
.bar-width-58 { width: 58%; }
.bar-width-59 { width: 59%; }
.bar-width-60 { width: 60%; }
.bar-width-61 { width: 61%; }
.bar-width-62 { width: 62%; }
.bar-width-63 { width: 63%; }
.bar-width-64 { width: 64%; }
.bar-width-65 { width: 65%; }
.bar-width-66 { width: 66%; }
.bar-width-67 { width: 67%; }
.bar-width-68 { width: 68%; }
.bar-width-69 { width: 69%; }
.bar-width-70 { width: 70%; }
.bar-width-71 { width: 71%; }
.bar-width-72 { width: 72%; }
.bar-width-73 { width: 73%; }
.bar-width-74 { width: 74%; }
.bar-width-75 { width: 75%; }
.bar-width-76 { width: 76%; }
.bar-width-77 { width: 77%; }
.bar-width-78 { width: 78%; }
.bar-width-79 { width: 79%; }
.bar-width-80 { width: 80%; }
.bar-width-81 { width: 81%; }
.bar-width-82 { width: 82%; }
.bar-width-83 { width: 83%; }
.bar-width-84 { width: 84%; }
.bar-width-85 { width: 85%; }
.bar-width-86 { width: 86%; }
.bar-width-87 { width: 87%; }
.bar-width-88 { width: 88%; }
.bar-width-89 { width: 89%; }
.bar-width-90 { width: 90%; }
.bar-width-91 { width: 91%; }
.bar-width-92 { width: 92%; }
.bar-width-93 { width: 93%; }
.bar-width-94 { width: 94%; }
.bar-width-95 { width: 95%; }
.bar-width-96 { width: 96%; }
.bar-width-97 { width: 97%; }
.bar-width-98 { width: 98%; }
.bar-width-99 { width: 99%; }
.bar-width-100 { width: 100%; }