/* Copia exacta del CSS de PDA Analytics de TCG (const css de pantallas/09-tableros/1490-PdaAnalytics.js, que la pantalla pone
   en un <style> después de los estilos comunes). No se edita a mano: si cambia en TCG, se vuelve a copiar (salvo el bloque
   final, propio de GG360). */
  .pda-root{
    background:var(--pda-bg); color:var(--pda-text); font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif;
    border-radius:16px; padding:28px 26px 40px; transition:background .18s, color .18s;
  }
  .pda-root *{ box-sizing:border-box; }
  .pda-num{ font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; }
  .pda-header-right{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .pda-meta-tag{ font-size:10.5px; color:var(--pda-text); font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; background:var(--pda-panel); border:1px solid var(--pda-line); padding:7px 13px; border-radius:999px; }
  .pda-toggle{ display:flex; align-items:center; gap:2px; border:1px solid var(--pda-line); border-radius:999px; padding:3px; background:var(--pda-panel); }
  .pda-toggle .pda-opt{ font-size:12px; padding:6px 12px; border-radius:999px; color:var(--pda-text); cursor:pointer; transition:.15s; user-select:none; display:flex; align-items:center; gap:6px; border:none; background:transparent; font-family:inherit; }
  .pda-toggle .pda-opt.active{ background:var(--pda-amber); color:var(--pda-ink); font-weight:700; }
  .pda-theme-dot{ width:8px; height:8px; border-radius:50%; flex-shrink:0; }

  .pda-controls{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:22px; }
  .pda-seg{ display:flex; border:1px solid var(--pda-line); border-radius:999px; padding:3px; background:var(--pda-panel); gap:2px; }
  .pda-seg button{ background:transparent; border:none; color:var(--pda-text); font-family:inherit; font-weight:600; font-size:12px; padding:8px 15px; border-radius:999px; cursor:pointer; transition:.15s; }
  .pda-seg button.active{ background:var(--pda-amber); color:var(--pda-ink); }
  .pda-select{ background:var(--pda-panel); border:1px solid var(--pda-line); color:var(--pda-text); font-family:inherit; font-weight:600; font-size:12px; padding:9px 14px; border-radius:999px; cursor:pointer; }
  .pda-spacer{ flex:1; }
  .pda-btn{ display:inline-flex; align-items:center; gap:7px; border:none; border-radius:999px; font-family:inherit; font-weight:700; font-size:12px; padding:10px 18px; cursor:pointer; transition:.15s; }
  .pda-btn-primary{ background:var(--pda-amber); color:var(--pda-ink); }
  .pda-btn-primary:hover{ filter:brightness(1.07); }
  .pda-btn-ghost{ background:var(--pda-panel); border:1px solid var(--pda-line); color:var(--pda-text); }
  .pda-btn-ghost:hover{ color:var(--pda-text); border-color:var(--pda-muted); }

  .pda-kpis{ display:grid; grid-template-columns:repeat(3, minmax(190px,1fr)); gap:14px; margin-bottom:14px; }
  .pda-kpi{ background:var(--pda-panel); border:1px solid var(--pda-line); border-radius:16px; padding:20px 22px; box-shadow:0 1px 3px rgba(0,0,0,.15); }
  .pda-kpi-label{ font-size:10.5px; color:var(--pda-text); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
  .pda-kpi-value{ font-size:25px; font-weight: 700; margin-top:9px; letter-spacing:-.01em; }
  .pda-kpi-sub{ font-size:11.5px; margin-top:6px; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; color:var(--pda-text); }
  .pda-up{ color:var(--pda-text); } .pda-down{ color:var(--pda-red); }
  @media(max-width:620px){ .pda-kpis{ grid-template-columns:1fr; } }

  .pda-quad-grid{ display:grid; grid-template-columns:repeat(3, minmax(170px,1fr)); gap:12px; }
  @media(max-width:560px){ .pda-quad-grid{ grid-template-columns:1fr; } }
  .pda-kpi-sm{ padding:14px 16px; }
  .pda-spot-name{ display:flex; align-items:center; gap:10px; font-size:13px; font-weight:700; }
  .pda-brand-badge{ width:30px; height:30px; border-radius:9px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-weight: 700; font-size:13px; color:#fff; }
  .pda-spot-row{ display:flex; justify-content:space-between; align-items:baseline; font-size:11.5px; color:var(--pda-text); padding:7px 0; border-top:1px solid var(--pda-rowborder); }
  .pda-spot-row:first-of-type{ margin-top:10px; }
  .pda-spot-row b{ color:var(--pda-text); font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; font-size:12.5px; font-weight:700; }

  .pda-podium-list{ display:flex; flex-direction:column; gap:2px; margin-top:8px; }
  .pda-podium-row{ display:flex; align-items:center; gap:9px; padding:6px 0; border-bottom:1px solid var(--pda-rowborder); }
  .pda-podium-row:last-child{ border-bottom:none; }
  .pda-medal{ font-size:15px; line-height:1; flex-shrink:0; }
  .pda-podium-name{ font-size:12px; font-weight:700; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .pda-podium-val{ font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; font-size:12px; font-weight:700; text-align:right; display:flex; flex-direction:column; align-items:flex-end; line-height:1.3; flex-shrink:0; }
  .pda-podium-share{ font-family:inherit; font-size:10px; font-weight:600; color:var(--pda-text); }

  .pda-panel{ background:var(--pda-panel); border:1px solid var(--pda-line); border-radius:16px; padding:22px 24px 24px; box-shadow:0 1px 3px rgba(0,0,0,.15); margin-bottom:16px; }
  .pda-panel h2{ font-size:14px; font-weight: 700; letter-spacing:-.01em; display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; gap:10px; flex-wrap:wrap; }
  .pda-hint{ font-size:11px; color:var(--pda-text); font-weight:600; }

  .pda-mode-seg{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
  .pda-mode-seg button{ background:var(--pda-panel2); border:1px solid var(--pda-line); color:var(--pda-text); font-family:inherit; font-weight:600; font-size:11px; padding:7px 13px; border-radius:999px; cursor:pointer; transition:.15s; }
  .pda-mode-seg button.active{ background:var(--pda-teal); border-color:var(--pda-teal); color:var(--pda-text); }

  .pda-chips{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:14px; }
  .pda-chip{ display:flex; align-items:center; gap:7px; font-size:11.5px; font-weight:600; color:var(--pda-text); cursor:pointer; user-select:none; background:var(--pda-chipbg); border:1px solid var(--pda-line); padding:7px 13px 7px 10px; border-radius:999px; transition:.15s; }
  .pda-chip .pda-dot{ width:8px; height:8px; border-radius:50%; opacity: 1; flex-shrink:0; }
  .pda-chip.active{ color:var(--pda-text); border-color:var(--pda-muted); }
  .pda-chip.active .pda-dot{ opacity:1; }
  .pda-chip.total{ font-weight: 700; }

  .pda-opt-row{ display:flex; gap:16px; flex-wrap:wrap; margin:10px 0 14px; align-items:center; }
  .pda-opt-check{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--pda-text); cursor:pointer; user-select:none; }
  .pda-opt-check input{ accent-color:var(--pda-amber); width:14px; height:14px; cursor:pointer; }
  .pda-opt-check.on{ color:var(--pda-text); font-weight:600; }
  .pda-pill-link{ font-size:11.5px; color:var(--pda-text); font-weight:600; cursor:pointer; user-select:none; }
  .pda-pill-link:hover{ color:var(--pda-text); }

  .pda-grid2{ display:grid; grid-template-columns:1.6fr 1fr; gap:16px; }
  @media(max-width:900px){ .pda-grid2{ grid-template-columns:1fr; } }

  .pda-rank-list{ display:flex; flex-direction:column; gap:1px; }
  .pda-rank-row{ display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:10px; padding:9px 2px; border-bottom:1px solid var(--pda-rowborder); }
  .pda-rank-row:last-child{ border-bottom:none; }
  .pda-pos{ font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; font-size:11px; color:var(--pda-text); text-align:right; }
  .pda-rank-row:first-child .pda-pos{ color:var(--pda-text); font-weight:700; }
  .pda-rank-name{ font-size:12px; font-weight:600; }
  .pda-rank-bar-bg{ height:5px; background:var(--pda-panel2); border-radius:999px; margin-top:6px; overflow:hidden; }
  .pda-rank-bar{ height:100%; border-radius:999px; }
  .pda-rank-right{ text-align:right; }
  .pda-rank-value{ font-size:12px; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; }
  .pda-rank-share{ font-size:10px; color:var(--pda-text); margin-top:2px; }

  .pda-focus-head{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; justify-content:space-between; }
  .pda-focus-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
  @media(max-width:820px){ .pda-focus-kpis{ grid-template-columns:repeat(2,1fr); } }
  .pda-fk{ background:var(--pda-panel2); border-radius:12px; padding:14px 16px; }
  .pda-fk-label{ font-size:10px; color:var(--pda-text); font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
  .pda-fk-value{ font-size:17px; font-weight: 700; margin-top:6px; }
  .pda-fk-sub{ font-size:10.5px; color:var(--pda-text); margin-top:4px; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; }
  .pda-insight-line{ font-size:12px; color:var(--pda-text); margin-top:14px; padding-top:14px; border-top:1px solid var(--pda-line); line-height:1.7; }
  .pda-focus-charts{ display:grid; grid-template-columns:1.4fr 1fr; gap:16px; margin-top:16px; }
  @media(max-width:900px){ .pda-focus-charts{ grid-template-columns:1fr; } }
  .pda-sub-panel{ background:var(--pda-panel2); border-radius:12px; padding:16px 18px; }
  .pda-sub-panel h3{ font-size:11.5px; font-weight:700; color:var(--pda-text); margin-bottom:10px; text-transform:uppercase; letter-spacing:.04em; }

  .pda-table-wrap{ overflow-x:auto; border-radius:12px; }
  .pda-table{ width:100%; border-collapse:collapse; font-size:11.5px; }
  .pda-table thead th{ text-align:right; padding:9px 12px; color:var(--pda-text); font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:.04em; border-bottom:1px solid var(--pda-line); white-space:nowrap; }
  .pda-table thead th:first-child{ text-align:left; }
  .pda-table tbody td{ text-align:right; padding:8px 12px; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; white-space:nowrap; }
  .pda-table tbody td:first-child{ text-align:left; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; font-weight:600; }
  .pda-table tbody tr{ border-bottom:1px solid var(--pda-rowborder); }
  .pda-table tbody tr:hover{ background:var(--pda-panel2); }
  .pda-table tbody tr.pda-total-row td{ color:var(--pda-text); font-weight: 700; border-top:1px solid var(--pda-line); }
  .pda-heat{ border-radius:6px; padding:3px 7px; }

  .pda-footer{ margin-top:24px; padding-top:16px; border-top:1px solid var(--pda-line); color:var(--pda-text); font-size:10.5px; font-family: "Montserrat", ui-sans-serif, system-ui, sans-serif; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }

  /* pointer-events:none — es un cartel, no un control: abajo a la derecha
     está el botón de cerrar de casi todos los pies. */
  .pda-toast{ pointer-events:none; position:fixed; bottom:24px; right:24px; background:var(--pda-panel); border:1px solid var(--pda-line); border-left:4px solid var(--pda-amber); color:var(--pda-text); padding:14px 18px; border-radius:12px; max-width:320px; box-shadow:0 8px 24px rgba(0,0,0,.3); z-index:9999; }
  .pda-toast.error{ border-left-color:var(--pda-red); }
  .pda-toast .pda-t-title{ font-weight: 700; font-size:12px; color:var(--pda-text); margin-bottom:3px; }
  .pda-toast.error .pda-t-title{ color:var(--pda-red); }
  .pda-toast-body{ font-size:11.5px; color:var(--pda-text); line-height:1.5; }
  .pda-fileinput{ display:none; }


/* ── Lo único de GG360 (no es de TCG) ──
   En TCG las variables --pda-* y los colores de las marcas los escribe la pantalla en línea (themeVars, BRAND_COLORS,
   heatColor). En GG360 ningún color va suelto en una pantalla (A12): acá quedan, con los mismos valores de TCG. */
.pda-root {
  --pda-bg: var(--panel, #1B1D22); --pda-panel: var(--panel-2, #24262C); --pda-panel2: var(--bg, #131417); --pda-line: var(--border, #2C2F36);
  --pda-text: var(--text, #FFFFFF); --pda-muted: var(--text-muted, #FFFFFF);
  --pda-amber: #F2A93B; --pda-amber-soft: #F2A93B22; --pda-teal: #57B6AC; --pda-teal-soft: #57B6AC22; --pda-red: #E0725F;
  --pda-total-line: #EDEAE2; --pda-ink: #171410; --pda-teal-ink: #0e211e; --pda-rowborder: #24262C; --pda-chipbg: #24262C;
  --pda-heat: #F2A93B; --pda-grafico-linea: #2C2F36; --pda-grafico-texto: #FFFFFF;
}
.tcg-claro .pda-root {
  --pda-bg: var(--panel, #FFFFFF); --pda-panel: var(--panel-2, #F0EDE5); --pda-panel2: var(--bg, #F6F4EF); --pda-line: var(--border, #E6E1D5);
  --pda-text: var(--text, #000000); --pda-muted: var(--text-muted, #000000);
  --pda-amber: #C9791B; --pda-amber-soft: #C9791B1A; --pda-teal: #2E8177; --pda-teal-soft: #2E81771A; --pda-red: #BD4A37;
  --pda-total-line: #242119; --pda-ink: #171410; --pda-rowborder: #F0EDE5; --pda-chipbg: #F0EDE5;
  --pda-heat: #C9791B; --pda-grafico-linea: #E6E1D5; --pda-grafico-texto: #000000;
}
/* Los temas de marca del botón de arriba (Original, Peugeot, Renault, Toyota). */
.pda-root.pda-tema-peugeot { --pda-amber: #4f8ef7; --pda-ink: #FFFFFF; --pda-teal: #8B96A5; }
.pda-root.pda-tema-renault { --pda-amber: #E4D400; --pda-ink: #14140A; --pda-teal: #9BA0A6; }
.pda-root.pda-tema-toyota { --pda-amber: #EB0A1E; --pda-ink: #FFFFFF; --pda-teal: #B0B0B0; }
.pda-theme-dot.pda-tema-peugeot { background: var(--accent-blue, #4f8ef7); }
.pda-theme-dot.pda-tema-renault { background: #E4D400; }
.pda-theme-dot.pda-tema-toyota { background: #EB0A1E; }
/* El color de cada marca (BRAND_COLORS de TCG; la que no está, gris). Sirve para el punto, la barra, la letra y la línea. */
.pda-c { --pda-c: #888; }
.pda-c-fiat { --pda-c: #F2A93B; } .pda-c-renault { --pda-c: #57B6AC; } .pda-c-volkswagen { --pda-c: #7C93C9; } .pda-c-chevrolet { --pda-c: #E0725F; }
.pda-c-toyota { --pda-c: #E0B84C; } .pda-c-peugeot { --pda-c: #9A87D6; } .pda-c-nissan { --pda-c: #5FB893; } .pda-c-ford { --pda-c: #D08858; }
.pda-c-citroen { --pda-c: #6FA8DC; } .pda-c-jeep { --pda-c: #B5A46A; } .pda-c-mercedes-benz { --pda-c: #A3A3A3; } .pda-c-ram { --pda-c: #CD6E6E; }
.pda-c-leapmotor { --pda-c: #6ED3C8; }
.pda-c-total { --pda-c: var(--pda-total-line); }
.pda-c-teal { --pda-c: var(--pda-teal); }
.pda-c-muted { --pda-c: var(--pda-muted); }
.pda-dot.pda-c, .pda-rank-bar.pda-c, .pda-brand-badge.pda-c { background: var(--pda-c); }
/* El gráfico de líneas (MultiLineChart de TCG, en SVG). */
.pda-graf-rejilla { stroke: var(--pda-grafico-linea); }
.pda-graf-texto { fill: var(--pda-grafico-texto); font-family: 'Montserrat', ui-sans-serif, system-ui, sans-serif; }
.pda-graf-linea.pda-c { stroke: var(--pda-c); fill: none; }
.pda-graf-relleno.pda-c { fill: var(--pda-c); }
.pda-graf-punto.pda-c { fill: var(--pda-c); }
/* El color de calor de la tabla (heatColor: el ámbar de la base, más fuerte cuanto más alto). */
.pda-heat { background: color-mix(in srgb, var(--pda-heat) var(--pda-calor, 8%), transparent); }
.pda-celda-sin { color: var(--pda-muted); }