/* =============================================================
   DESMOCHEE · UNIVERSAL TABLE SKIN RENDERER · FASE 2.3.6C
   -------------------------------------------------------------
   Una misma composición para todas las mesas.
   No existen selectores por id de skin.
   ============================================================= */

/* La textura declarada por la skin manda; no agregamos grid genérico. */
.game-screen.collection-game-skin.table-renderer-active .pilot-table {
  background: var(--table-render-bg) !important;
  filter:
    contrast(var(--table-render-contrast,1))
    saturate(var(--table-render-saturation,1))
    brightness(var(--table-render-brightness,1)) !important;
}

/* Sin SVG: el ::before desaparece. La propia tableBg conserva su textura. */
.game-screen.collection-game-skin.table-renderer-active:not(.table-renderer-has-motif) .pilot-table::before {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  -webkit-mask: none !important;
  mask: none !important;
}

/* Con SVG: misma regla, misma intensidad y misma posición para todos. */
.game-screen.collection-game-skin.table-renderer-active.table-renderer-has-motif .pilot-table::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 4% 5% 8% !important;
  pointer-events: none !important;
  background: var(--table-render-motif-color) !important;
  opacity: var(--table-render-motif-opacity,.30) !important;
  -webkit-mask-image: var(--table-render-motif) !important;
  mask-image: var(--table-render-motif) !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: var(--table-render-motif-position,50% 58%) !important;
  mask-position: var(--table-render-motif-position,50% 58%) !important;
  -webkit-mask-size: var(--table-render-motif-size,min(62vw,270px)) !important;
  mask-size: var(--table-render-motif-size,min(62vw,270px)) !important;
}

/* Arena sigue organizando la mesa, pero no coloca textura propia encima. */
.game-screen.game-screen-arena.table-renderer-active .pilot-table::after {
  background: radial-gradient(circle at 50% 38%, rgba(255,255,255,.020), transparent 48%) !important;
  border-color: rgba(255,255,255,.042) !important;
  box-shadow:
    inset 0 0 0 5px rgba(0,0,0,.032),
    inset 0 18px 42px rgba(255,255,255,.007),
    inset 0 -18px 42px rgba(0,0,0,.075) !important;
}

/* Los paneles no deben lavar el material del tapete. */
.game-screen.game-screen-arena.table-renderer-active .table-center,
.game-screen.game-screen-arena.table-renderer-active .human-zone {
  background-color: transparent !important;
}

/* Preview de Colección: exactamente la misma fuente de datos. */
.collection-table-preview.table-renderer-active {
  background: var(--table-render-bg) !important;
  filter:
    contrast(var(--table-render-contrast,1))
    saturate(var(--table-render-saturation,1))
    brightness(var(--table-render-brightness,1));
}

.collection-table-preview.table-renderer-active:not(.table-renderer-has-motif) .collection-table-motif {
  display: none !important;
}

.collection-table-preview.table-renderer-active.table-renderer-has-motif .collection-table-motif {
  display: block !important;
  inset: 18px !important;
  background: var(--table-render-motif-color) !important;
  opacity: var(--table-render-preview-motif-opacity,.24) !important;
  -webkit-mask-image: var(--table-render-motif) !important;
  mask-image: var(--table-render-motif) !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: var(--table-render-preview-motif-position,50% 54%) !important;
  mask-position: var(--table-render-preview-motif-position,50% 54%) !important;
  -webkit-mask-size: var(--table-render-preview-motif-size,62%) !important;
  mask-size: var(--table-render-preview-motif-size,62%) !important;
}