/* ═══════════════════════════════════════════════════════════════════════════
   Piezas Staunton en SVG (web/js/piezas.js): materiales por tema y tamaño.
   Las variables van en :root porque los degradados viven en el <svg> oculto
   que inyecta instalarPiezas().
   ═══════════════════════════════════════════════════════════════════════════ */

:root, :root[data-tema="tablero"] {
  --pz-b-luz: #fffaf0; --pz-b-medio: #ecd6ae; --pz-b-sombra: #a97f52; --pz-b-borde: #3d2814;
  --pz-n-luz: #6d747f; --pz-n-medio: #2a2e35; --pz-n-sombra: #0b0c0f; --pz-n-borde: #000;
  --pz-n-reflejo: #9db4cf; --pz-fieltro: #1f4a2e;
}
:root[data-tema="claro"] {
  --pz-b-luz: #ffffff; --pz-b-medio: #f1e6d2; --pz-b-sombra: #b9a07e; --pz-b-borde: #2e2418;
  --pz-n-luz: #707784; --pz-n-medio: #2b2f37; --pz-n-sombra: #0d0e12; --pz-n-borde: #000;
  --pz-n-reflejo: #8aa0bb; --pz-fieltro: #22553a;
}
:root[data-tema="oscuro"] {
  --pz-b-luz: #fffaf0; --pz-b-medio: #e9d3aa; --pz-b-sombra: #a17a50; --pz-b-borde: #2a1a0c;
  --pz-n-luz: #7a8392; --pz-n-medio: #30353e; --pz-n-sombra: #0e1014; --pz-n-borde: #000;
  --pz-n-reflejo: #b4cbe6; --pz-n-halo: rgba(180, 203, 230, .4); --pz-fieltro: #1d4630;
}
:root[data-tema="neon"] {
  --pz-b-luz: #fff7cf; --pz-b-medio: #ffcf4d; --pz-b-sombra: #a8700a; --pz-b-borde: #ffe58a;
  --pz-b-brillo: #ffffff; --pz-b-reflejo: #ffb020; --pz-b-veta: #c07a00;
  --pz-n-luz: #4ff3ff; --pz-n-medio: #0b6f86; --pz-n-sombra: #031c28; --pz-n-borde: #5ff6ff;
  --pz-n-brillo: #e8ffff; --pz-n-reflejo: #7ffcff; --pz-n-veta: #00d9ff;
  --pz-b-halo: rgba(255, 207, 77, .35); --pz-n-halo: rgba(95, 246, 255, .45);
  --pz-fieltro: #2a0f4a; --pz-sombra-suelo: .25;
}
:root[data-tema="lcd"] {
  --pz-b-luz: #dcdcd4; --pz-b-medio: #b4b4aa; --pz-b-sombra: #74746c; --pz-b-borde: #101010;
  --pz-b-brillo: #f4f4ee; --pz-b-reflejo: #9a9a90; --pz-b-veta: #5a5a52;
  --pz-n-luz: #64645e; --pz-n-medio: #34342f; --pz-n-sombra: #151513; --pz-n-borde: #000;
  --pz-n-brillo: #a4a49a; --pz-n-reflejo: #8a8a80; --pz-n-veta: #46463f; --pz-n-halo: rgba(210, 210, 198, .42);
  --pz-fieltro: #181818;
}

:root[data-tema="gran-maestro"] {
  /* blancas de oro pulido, negras de ébano con reflejo champán */
  --pz-b-luz: #fff3c9; --pz-b-medio: #e2bd6a; --pz-b-sombra: #8a6420; --pz-b-borde: #2a1c06;
  --pz-b-brillo: #fffbe8; --pz-b-reflejo: #f6d98c; --pz-b-veta: #b58a3a;
  --pz-n-luz: #6a6660; --pz-n-medio: #26241f; --pz-n-sombra: #0a0908; --pz-n-borde: #000;
  --pz-n-reflejo: #d8c39a; --pz-n-halo: rgba(226, 189, 106, .35); --pz-fieltro: #3a0d12;
}

/* Un glifo convertido en SVG ocupa lo mismo que ocupaba la letra (1em) */
.con-svg { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.con-svg > svg.pzs { width: 1.1em; height: 1.1em; display: block; overflow: visible; }
.vacio .con-svg { display: flex; }
.pz.con-svg > svg.pzs { width: 78%; height: 78%; }
:root[data-tema="neon"] svg.pzs { filter: drop-shadow(0 0 .06em var(--acento)); }