/* Tema comune dei giochi di carte: panno verde ispirato ai tavoli da
   biliardo e roulette. Caricato dopo art-direction.css per mantenere lo
   stesso tavolo in tutti i titoli, senza appiattire carte e controlli. */
:root {
  --card-table-green: #0b6b3a;
  --card-table-green-light: #14804b;
  --card-table-green-deep: #064526;
  --card-table-green-dark: #032f1b;
}

html,
body {
  background-color: var(--card-table-green-deep) !important;
}

body[data-fp-art]::before {
  background:
    radial-gradient(ellipse at 50% 34%, rgba(37, 158, 91, 0.5), transparent 48%),
    radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.07), transparent 26%),
    linear-gradient(145deg, var(--card-table-green-light), var(--card-table-green) 42%, var(--card-table-green-deep) 100%) !important;
}

body[data-fp-art]::after {
  opacity: 0.2 !important;
  background-image:
    repeating-linear-gradient(24deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(114deg, rgba(0, 0, 0, 0.035) 0 1px, transparent 1px 5px) !important;
  background-size: auto !important;
  mask-image: none !important;
}

.game-shell {
  background:
    radial-gradient(ellipse at 50% 30%, rgba(33, 153, 85, 0.48), transparent 53%),
    linear-gradient(155deg, var(--card-table-green-light), var(--card-table-green) 48%, var(--card-table-green-deep)) !important;
}

.table-wrap {
  border: 1px solid rgba(238, 213, 137, 0.18);
  background:
    repeating-linear-gradient(24deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 5px),
    radial-gradient(ellipse at 50% 36%, var(--card-table-green-light), var(--card-table-green) 48%, var(--card-table-green-deep) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    inset 0 0 55px rgba(1, 28, 15, 0.34);
}

body[data-fp-art] :is(.topbar, .panel, .hud-pill, .bloom-panel, .combo-panel) {
  border-color: rgba(241, 213, 133, 0.2);
  background-color: rgba(3, 47, 27, 0.88);
}

body[data-fp-art] :is(.stat, .opponent, .notice) {
  background-color: rgba(2, 43, 24, 0.78);
}

body[data-fp-art] :is(.overlay, .pause-panel, .modal) {
  background:
    radial-gradient(circle at 50% 22%, rgba(27, 137, 77, 0.3), transparent 30rem),
    rgba(2, 31, 18, 0.88) !important;
}

body[data-fp-art] :is(.overlay .panel, .pause-panel > div, .modal .dialog) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.065), transparent 30%),
    linear-gradient(155deg, rgba(8, 81, 45, 0.98), rgba(3, 43, 25, 0.98)) !important;
}