/* =========================================================================
 * game-icons.css — FortuneX game tile previews, "Tarot Geometry" edition.
 *
 * Each .art-<game> selector paints a single, fully-realised emblem on a
 * wine velvet ground — one dominant form, constant 1.6px stroke weight,
 * a four-note palette (wine / gold / cream / crimson), and a consistent
 * upper-left light source across all nineteen icons.
 *
 * Architecture:
 *   --tile-gradient is the velvet ground. Dark theme keeps the deep wine
 *   (#3D1019 → #1A050A); light theme lifts it to aged burgundy (#7B2535
 *   → #4D1622). One token swap retunes the entire deck.
 *
 *   Every .art-* sets `background-image: url(<svg>), var(--tile-gradient)`
 *   and uses background-position+size to anchor the icon in the upper
 *   ~62% of the tile so the game-name label below remains uncrowded.
 *
 *   Legacy ::before / ::after pseudo-shapes from the inline <style> blocks
 *   in landing.html / play.html are hidden with `display: none` so the
 *   old dots-and-rectangles don't double-print on top of these emblems.
 * ========================================================================= */

.art-crash, .art-slots, .art-roulette, .art-blackjack, .art-dice,
.art-plinko, .art-mines, .art-wheel, .art-hilo, .art-tower,
.art-coinflip, .art-limbo, .art-rps, .art-pump, .art-stairs,
.art-sicbo, .art-aviator, .art-keno, .art-baccarat {
  --tile-gradient: linear-gradient(180deg, #3D1019 0%, #1A050A 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: center 16%, center;
  background-size: 76% 60%, cover;
}

:root[data-theme="light"] .art-crash,
:root[data-theme="light"] .art-slots,
:root[data-theme="light"] .art-roulette,
:root[data-theme="light"] .art-blackjack,
:root[data-theme="light"] .art-dice,
:root[data-theme="light"] .art-plinko,
:root[data-theme="light"] .art-mines,
:root[data-theme="light"] .art-wheel,
:root[data-theme="light"] .art-hilo,
:root[data-theme="light"] .art-tower,
:root[data-theme="light"] .art-coinflip,
:root[data-theme="light"] .art-limbo,
:root[data-theme="light"] .art-rps,
:root[data-theme="light"] .art-pump,
:root[data-theme="light"] .art-stairs,
:root[data-theme="light"] .art-sicbo,
:root[data-theme="light"] .art-aviator,
:root[data-theme="light"] .art-keno,
:root[data-theme="light"] .art-baccarat {
  --tile-gradient: linear-gradient(180deg, #7B2535 0%, #4D1622 100%);
}

.art-crash::before, .art-crash::after,
.art-slots::before, .art-slots::after,
.art-roulette::before, .art-roulette::after,
.art-blackjack::before, .art-blackjack::after,
.art-dice::before, .art-dice::after,
.art-plinko::before, .art-plinko::after,
.art-mines::before, .art-mines::after,
.art-wheel::before, .art-wheel::after,
.art-hilo::before, .art-hilo::after,
.art-tower::before, .art-tower::after,
.art-coinflip::before, .art-coinflip::after,
.art-limbo::before, .art-limbo::after,
.art-rps::before, .art-rps::after,
.art-pump::before, .art-pump::after,
.art-stairs::before, .art-stairs::after,
.art-sicbo::before, .art-sicbo::after,
.art-aviator::before, .art-aviator::after,
.art-keno::before, .art-keno::after,
.art-baccarat::before, .art-baccarat::after { display: none !important; }

/* ============== PER-GAME ICONS — TAROT GEOMETRY EDITION ================ */

/* CRASH — a single rising trajectory + integrated multiplier disc.
   The curve is the form; the multiplier sits inside it, not beside it. */
.art-crash {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><path d='M6 74 Q28 62 50 40 T94 6' stroke='%23D4AF37' stroke-width='2' fill='none' stroke-linecap='round'/><circle cx='94' cy='6' r='4' fill='%23C92434'/><rect x='30' y='32' width='40' height='18' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.4'/><text x='50' y='46' font-family='monospace' font-weight='700' font-size='13' fill='%23F0D77E' text-anchor='middle'>2.40×</text></svg>"),
    var(--tile-gradient);
}

/* SLOTS — three gold-framed pillars, single 7 in each, two thin gold rails. */
.art-slots {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><line x1='6' y1='10' x2='94' y2='10' stroke='%23D4AF37' stroke-width='1.6' stroke-linecap='round'/><line x1='6' y1='70' x2='94' y2='70' stroke='%23D4AF37' stroke-width='1.6' stroke-linecap='round'/><rect x='10' y='14' width='22' height='52' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><rect x='39' y='14' width='22' height='52' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><rect x='68' y='14' width='22' height='52' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><text x='21' y='50' font-family='Cinzel,serif' font-weight='900' font-size='24' fill='%23C92434' text-anchor='middle'>7</text><text x='50' y='50' font-family='Cinzel,serif' font-weight='900' font-size='24' fill='%23C92434' text-anchor='middle'>7</text><text x='79' y='50' font-family='Cinzel,serif' font-weight='900' font-size='24' fill='%23C92434' text-anchor='middle'>7</text></svg>"),
    var(--tile-gradient);
}

/* ROULETTE — sixteen-pocket wheel with red/black/green pockets, wood
   inner bowl with cross spokes, gold rim, and a cream ball sitting in
   one of the red pockets. Reads at icon size as a roulette wheel, not
   a pie chart. */
.art-roulette {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='50' r='46' fill='%238B6914'/><circle cx='50' cy='50' r='42' fill='%230A0205'/><path d='M50 50 L50 8 A42 42 0 0 1 66.1 11.2 Z' fill='%231F8F4A'/><path d='M50 50 L66.1 11.2 A42 42 0 0 1 79.7 20.3 Z' fill='%23C92434'/><path d='M50 50 L79.7 20.3 A42 42 0 0 1 88.8 33.9 Z' fill='%230A0205'/><path d='M50 50 L88.8 33.9 A42 42 0 0 1 92 50 Z' fill='%23C92434'/><path d='M50 50 L92 50 A42 42 0 0 1 88.8 66.1 Z' fill='%230A0205'/><path d='M50 50 L88.8 66.1 A42 42 0 0 1 79.7 79.7 Z' fill='%23C92434'/><path d='M50 50 L79.7 79.7 A42 42 0 0 1 66.1 88.8 Z' fill='%230A0205'/><path d='M50 50 L66.1 88.8 A42 42 0 0 1 50 92 Z' fill='%23C92434'/><path d='M50 50 L50 92 A42 42 0 0 1 33.9 88.8 Z' fill='%230A0205'/><path d='M50 50 L33.9 88.8 A42 42 0 0 1 20.3 79.7 Z' fill='%23C92434'/><path d='M50 50 L20.3 79.7 A42 42 0 0 1 11.2 66.1 Z' fill='%230A0205'/><path d='M50 50 L11.2 66.1 A42 42 0 0 1 8 50 Z' fill='%23C92434'/><path d='M50 50 L8 50 A42 42 0 0 1 11.2 33.9 Z' fill='%230A0205'/><path d='M50 50 L11.2 33.9 A42 42 0 0 1 20.3 20.3 Z' fill='%23C92434'/><path d='M50 50 L20.3 20.3 A42 42 0 0 1 33.9 11.2 Z' fill='%230A0205'/><path d='M50 50 L33.9 11.2 A42 42 0 0 1 50 8 Z' fill='%23C92434'/><circle cx='50' cy='50' r='42' fill='none' stroke='%23D4AF37' stroke-width='1.6'/><circle cx='50' cy='50' r='22' fill='%235A1825' stroke='%23D4AF37' stroke-width='1.4'/><line x1='32' y1='50' x2='68' y2='50' stroke='%23D4AF37' stroke-width='1'/><line x1='50' y1='32' x2='50' y2='68' stroke='%23D4AF37' stroke-width='1'/><circle cx='50' cy='50' r='5' fill='%23F0D77E' stroke='%238B6914' stroke-width='1'/><circle cx='56' cy='20' r='2.6' fill='%23FFF8E7' stroke='%238B6914' stroke-width='0.5'/></svg>"),
    var(--tile-gradient);
}

/* BLACKJACK — a single Ace of spades, gently tilted; "21" disc anchors it. */
.art-blackjack {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g transform='translate(50 52) rotate(-8)'><rect x='-22' y='-32' width='44' height='64' rx='4' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.4'/><text x='-16' y='-19' font-family='Cinzel,serif' font-weight='700' font-size='10' fill='%231A050A'>A</text><text x='-16' y='-9' font-family='serif' font-size='9' fill='%231A050A'>♠</text><text x='0' y='10' font-family='serif' font-size='24' fill='%231A050A' text-anchor='middle'>♠</text><text x='16' y='28' font-family='Cinzel,serif' font-weight='700' font-size='10' fill='%231A050A' transform='rotate(180 16 28)'>A</text></g><circle cx='80' cy='20' r='10' fill='%23D4AF37' stroke='%238B6914' stroke-width='1.4'/><text x='80' y='24' font-family='Cinzel,serif' font-weight='900' font-size='12' fill='%231A050A' text-anchor='middle'>21</text></svg>"),
    var(--tile-gradient);
}

/* DICE — one isometric gold die, top + two visible faces, sharp pips. */
.art-dice {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g transform='translate(50 52)'><path d='M-26 -12 L0 -26 L26 -12 L0 2 Z' fill='%23F0D77E' stroke='%238B6914' stroke-width='1.6' stroke-linejoin='round'/><path d='M-26 -12 L-26 18 L0 32 L0 2 Z' fill='%23D4AF37' stroke='%238B6914' stroke-width='1.6' stroke-linejoin='round'/><path d='M26 -12 L26 18 L0 32 L0 2 Z' fill='%238B6914' stroke='%238B6914' stroke-width='1.6' stroke-linejoin='round'/><circle cx='-13' cy='-12' r='2' fill='%231A050A'/><circle cx='0' cy='-19' r='2' fill='%231A050A'/><circle cx='13' cy='-12' r='2' fill='%231A050A'/><circle cx='0' cy='-5' r='2' fill='%231A050A'/><circle cx='-13' cy='1' r='2' fill='%231A050A'/><circle cx='-18' cy='2' r='1.8' fill='%231A050A' opacity='0.7'/><circle cx='-8' cy='8' r='1.8' fill='%231A050A' opacity='0.7'/><circle cx='-18' cy='16' r='1.8' fill='%231A050A' opacity='0.7'/><circle cx='12' cy='4' r='1.8' fill='%23F0D77E' opacity='0.5'/><circle cx='18' cy='14' r='1.8' fill='%23F0D77E' opacity='0.5'/></g></svg>"),
    var(--tile-gradient);
}

/* PLINKO — three rows of pegs in a triangle + one crimson ball ready to drop. */
.art-plinko {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='12' r='4.5' fill='%23C92434' stroke='%238B6914' stroke-width='1'/><g fill='%23D4AF37'><circle cx='50' cy='30' r='2.2'/><circle cx='38' cy='42' r='2.2'/><circle cx='62' cy='42' r='2.2'/><circle cx='26' cy='54' r='2.2'/><circle cx='50' cy='54' r='2.2'/><circle cx='74' cy='54' r='2.2'/><circle cx='14' cy='66' r='2.2'/><circle cx='38' cy='66' r='2.2'/><circle cx='62' cy='66' r='2.2'/><circle cx='86' cy='66' r='2.2'/></g><g stroke='%238B6914' stroke-width='1.4' fill='none'><line x1='8' y1='78' x2='8' y2='90'/><line x1='28' y1='78' x2='28' y2='90'/><line x1='50' y1='78' x2='50' y2='90'/><line x1='72' y1='78' x2='72' y2='90'/><line x1='92' y1='78' x2='92' y2='90'/></g><rect x='40' y='80' width='20' height='10' rx='1.5' fill='%23F0D77E'/><text x='50' y='88' font-family='monospace' font-weight='700' font-size='7' fill='%231A050A' text-anchor='middle'>10×</text></svg>"),
    var(--tile-gradient);
}

/* MINES — 2×3 grid, two revealed diamonds, one mine, three hidden cells. */
.art-mines {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><g><rect x='8' y='10' width='26' height='26' rx='3' fill='%238B6914' stroke='%23D4AF37' stroke-width='1.6'/><rect x='37' y='10' width='26' height='26' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><polygon points='50,18 57,23 50,30 43,23' fill='%23F0D77E' stroke='%238B6914' stroke-width='0.7'/><rect x='66' y='10' width='26' height='26' rx='3' fill='%238B6914' stroke='%23D4AF37' stroke-width='1.6'/><rect x='8' y='42' width='26' height='26' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><polygon points='21,50 28,55 21,62 14,55' fill='%23F0D77E' stroke='%238B6914' stroke-width='0.7'/><rect x='37' y='42' width='26' height='26' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.6'/><circle cx='50' cy='55' r='7' fill='%23C92434'/><line x1='45' y1='50' x2='55' y2='60' stroke='%231A050A' stroke-width='1.8' stroke-linecap='round'/><line x1='55' y1='50' x2='45' y2='60' stroke='%231A050A' stroke-width='1.8' stroke-linecap='round'/><rect x='66' y='42' width='26' height='26' rx='3' fill='%238B6914' stroke='%23D4AF37' stroke-width='1.6'/></g></svg>"),
    var(--tile-gradient);
}

/* WHEEL — twelve-segment Wheel of Fortune, alternating gold/wine/red with
   thin gold frets between segments, gold rim, central hub, and a top
   pointer hanging just above the rim. Reads at icon size as a prize wheel. */
.art-wheel {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='50' r='42' fill='%231A050A'/><path d='M50 50 L50 8 A42 42 0 0 1 71 13.6 Z' fill='%23D4AF37'/><path d='M50 50 L71 13.6 A42 42 0 0 1 86.4 29 Z' fill='%237B1F2C'/><path d='M50 50 L86.4 29 A42 42 0 0 1 92 50 Z' fill='%23D4AF37'/><path d='M50 50 L92 50 A42 42 0 0 1 86.4 71 Z' fill='%23C92434'/><path d='M50 50 L86.4 71 A42 42 0 0 1 71 86.4 Z' fill='%23D4AF37'/><path d='M50 50 L71 86.4 A42 42 0 0 1 50 92 Z' fill='%237B1F2C'/><path d='M50 50 L50 92 A42 42 0 0 1 29 86.4 Z' fill='%23D4AF37'/><path d='M50 50 L29 86.4 A42 42 0 0 1 13.6 71 Z' fill='%23C92434'/><path d='M50 50 L13.6 71 A42 42 0 0 1 8 50 Z' fill='%23D4AF37'/><path d='M50 50 L8 50 A42 42 0 0 1 13.6 29 Z' fill='%237B1F2C'/><path d='M50 50 L13.6 29 A42 42 0 0 1 29 13.6 Z' fill='%23D4AF37'/><path d='M50 50 L29 13.6 A42 42 0 0 1 50 8 Z' fill='%23C92434'/><g stroke='%238B6914' stroke-width='0.7'><line x1='50' y1='8' x2='50' y2='50'/><line x1='71' y1='13.6' x2='50' y2='50'/><line x1='86.4' y1='29' x2='50' y2='50'/><line x1='92' y1='50' x2='50' y2='50'/><line x1='86.4' y1='71' x2='50' y2='50'/><line x1='71' y1='86.4' x2='50' y2='50'/><line x1='50' y1='92' x2='50' y2='50'/><line x1='29' y1='86.4' x2='50' y2='50'/><line x1='13.6' y1='71' x2='50' y2='50'/><line x1='8' y1='50' x2='50' y2='50'/><line x1='13.6' y1='29' x2='50' y2='50'/><line x1='29' y1='13.6' x2='50' y2='50'/></g><circle cx='50' cy='50' r='42' fill='none' stroke='%23F0D77E' stroke-width='2'/><circle cx='50' cy='50' r='10' fill='%238B6914' stroke='%23F0D77E' stroke-width='1.5'/><circle cx='50' cy='50' r='3' fill='%23F0D77E'/><polygon points='50,12 44,1 56,1' fill='%23F0D77E' stroke='%238B6914' stroke-width='1' stroke-linejoin='round'/></svg>"),
    var(--tile-gradient);
}

/* HI-LO — one card centered, two tiny directional triangles flank it. */
.art-hilo {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g transform='translate(50 50)'><rect x='-20' y='-30' width='40' height='60' rx='4' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.4'/><text x='-13' y='-15' font-family='Cinzel,serif' font-weight='700' font-size='12' fill='%23C92434'>Q</text><text x='-13' y='-4' font-family='serif' font-size='11' fill='%23C92434'>♥</text><text x='0' y='14' font-family='serif' font-size='24' fill='%23C92434' text-anchor='middle'>♥</text><text x='13' y='28' font-family='Cinzel,serif' font-weight='700' font-size='12' fill='%23C92434' transform='rotate(180 13 28)'>Q</text></g><polygon points='12,46 22,46 17,32' fill='%23F0D77E' stroke='%238B6914' stroke-width='1'/><polygon points='78,54 88,54 83,68' fill='%23F0D77E' stroke='%238B6914' stroke-width='1'/></svg>"),
    var(--tile-gradient);
}

/* TOWER — three diminishing rectangular tiers with a small crown. */
.art-tower {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g stroke='%238B6914' stroke-width='1.4' stroke-linejoin='round'><rect x='22' y='68' width='56' height='18' fill='%23D4AF37'/><rect x='28' y='50' width='44' height='18' fill='%23F0D77E'/><rect x='34' y='32' width='32' height='18' fill='%23D4AF37'/><path d='M34 32 L34 22 L42 27 L50 18 L58 27 L66 22 L66 32 Z' fill='%23F0D77E'/></g><circle cx='42' cy='27' r='1.8' fill='%23C92434'/><circle cx='50' cy='18' r='2' fill='%23C92434'/><circle cx='58' cy='27' r='1.8' fill='%23C92434'/><line x1='22' y1='86' x2='78' y2='86' stroke='%238B6914' stroke-width='1.6'/></svg>"),
    var(--tile-gradient);
}

/* COIN FLIP — single solid coin showing X, one orbital arc as motion hint. */
.art-coinflip {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><ellipse cx='50' cy='50' rx='30' ry='32' fill='none' stroke='%23D4AF37' stroke-width='1.2' opacity='0.45' transform='rotate(-20 50 50)'/><circle cx='50' cy='50' r='30' fill='%23D4AF37' stroke='%238B6914' stroke-width='2'/><circle cx='50' cy='50' r='24' fill='none' stroke='%23F0D77E' stroke-width='1' opacity='0.6'/><text x='50' y='62' font-family='Cinzel,serif' font-weight='900' font-size='32' fill='%231A050A' text-anchor='middle'>X</text></svg>"),
    var(--tile-gradient);
}

/* LIMBO — gauge arc with single needle pointing at the multiplier. */
.art-limbo {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><path d='M12 64 A38 38 0 0 1 88 64' fill='none' stroke='%231F8F4A' stroke-width='5' stroke-linecap='round'/><path d='M30 30 A38 38 0 0 1 70 30' fill='none' stroke='%23D4AF37' stroke-width='5' stroke-linecap='round'/><path d='M70 30 A38 38 0 0 1 88 64' fill='none' stroke='%23C92434' stroke-width='5' stroke-linecap='round'/><line x1='50' y1='64' x2='72' y2='32' stroke='%23F0D77E' stroke-width='2.2' stroke-linecap='round'/><circle cx='50' cy='64' r='4' fill='%238B6914' stroke='%23F0D77E' stroke-width='1.2'/><text x='50' y='76' font-family='monospace' font-weight='700' font-size='12' fill='%23F0D77E' text-anchor='middle'>9.42×</text></svg>"),
    var(--tile-gradient);
}

/* RPS — three minimalist hand silhouettes: fist, paper, scissors. */
.art-rps {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'><g fill='%23D4AF37' stroke='%238B6914' stroke-width='1.6'><rect x='10' y='28' width='28' height='28' rx='10'/><line x1='14' y1='34' x2='34' y2='34' stroke-width='1.2'/><line x1='14' y1='42' x2='34' y2='42' stroke-width='1.2'/><line x1='14' y1='50' x2='34' y2='50' stroke-width='1.2'/></g><g fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.6'><rect x='48' y='24' width='28' height='34' rx='3'/><line x1='54' y1='24' x2='54' y2='40' stroke-width='1.2'/><line x1='62' y1='22' x2='62' y2='40' stroke-width='1.2'/><line x1='70' y1='24' x2='70' y2='40' stroke-width='1.2'/></g><g stroke='%23C92434' stroke-width='3.5' stroke-linecap='round' fill='none'><line x1='88' y1='58' x2='100' y2='38'/><line x1='112' y1='58' x2='100' y2='38'/></g><circle cx='100' cy='38' r='3' fill='%238B6914'/></svg>"),
    var(--tile-gradient);
}

/* PUMP — single inflated balloon, thin tether, multiplier integrated. */
.art-pump {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 100'><ellipse cx='40' cy='40' rx='26' ry='30' fill='%23C92434' stroke='%238B6914' stroke-width='1.6'/><ellipse cx='32' cy='30' rx='5' ry='8' fill='%23F5E6C8' opacity='0.35'/><path d='M40 70 L36 76 L44 76 Z' fill='%237B1525' stroke='%238B6914' stroke-width='1'/><line x1='40' y1='76' x2='40' y2='94' stroke='%23F0D77E' stroke-width='1.2' stroke-dasharray='2 3'/><text x='40' y='46' font-family='monospace' font-weight='700' font-size='14' fill='%23F5E6C8' text-anchor='middle'>2.4×</text></svg>"),
    var(--tile-gradient);
}

/* STAIRS — diagonal staircase of four gold steps with a coin atop. */
.art-stairs {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g stroke='%238B6914' stroke-width='1.6' stroke-linejoin='round'><rect x='12' y='72' width='22' height='18' fill='%23D4AF37'/><rect x='30' y='56' width='22' height='34' fill='%23D4AF37'/><rect x='48' y='40' width='22' height='50' fill='%23D4AF37'/><rect x='66' y='24' width='22' height='66' fill='%23F0D77E'/></g><circle cx='77' cy='16' r='7' fill='%23F0D77E' stroke='%238B6914' stroke-width='1.6'/><text x='77' y='20' font-family='Cinzel,serif' font-weight='900' font-size='10' fill='%231A050A' text-anchor='middle'>X</text></svg>"),
    var(--tile-gradient);
}

/* SIC BO — three identical cream dice in a tight row. */
.art-sicbo {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'><g><g transform='translate(22 40) rotate(-6)'><rect x='-15' y='-15' width='30' height='30' rx='4' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.6'/><circle cx='0' cy='0' r='2.4' fill='%23C92434'/></g><g transform='translate(60 40)'><rect x='-16' y='-16' width='32' height='32' rx='4' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.6'/><circle cx='-8' cy='-8' r='2.2' fill='%231A050A'/><circle cx='8' cy='-8' r='2.2' fill='%231A050A'/><circle cx='0' cy='0' r='2.2' fill='%231A050A'/><circle cx='-8' cy='8' r='2.2' fill='%231A050A'/><circle cx='8' cy='8' r='2.2' fill='%231A050A'/></g><g transform='translate(98 40) rotate(8)'><rect x='-15' y='-15' width='30' height='30' rx='4' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.6'/><circle cx='-8' cy='-8' r='2.2' fill='%231A050A'/><circle cx='8' cy='-8' r='2.2' fill='%231A050A'/><circle cx='-8' cy='0' r='2.2' fill='%231A050A'/><circle cx='8' cy='0' r='2.2' fill='%231A050A'/><circle cx='-8' cy='8' r='2.2' fill='%231A050A'/><circle cx='8' cy='8' r='2.2' fill='%231A050A'/></g></g></svg>"),
    var(--tile-gradient);
}

/* AVIATOR — rising trail + small plane silhouette, multiplier disc. */
.art-aviator {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'><path d='M8 72 Q40 56 70 32 T112 6' stroke='%23D4AF37' stroke-width='2' fill='none' stroke-linecap='round'/><path d='M8 72 Q40 56 70 32 T112 6' stroke='%23F0D77E' stroke-width='0.8' fill='none' stroke-linecap='round' stroke-dasharray='2 4' opacity='0.6'/><g transform='translate(106 12) rotate(-28)'><path d='M-14 0 L10 0 L14 -2 L14 2 L10 0 Z' fill='%23F0D77E' stroke='%238B6914' stroke-width='0.7'/><path d='M-10 -1 L-4 -9 L-2 -1 Z' fill='%23F0D77E' stroke='%238B6914' stroke-width='0.7'/><path d='M-10 1 L-4 9 L-2 1 Z' fill='%23F0D77E' stroke='%238B6914' stroke-width='0.7'/></g><rect x='26' y='40' width='40' height='16' rx='3' fill='%231A050A' stroke='%23D4AF37' stroke-width='1.4'/><text x='46' y='52' font-family='monospace' font-weight='700' font-size='11' fill='%23F0D77E' text-anchor='middle'>3.80×</text></svg>"),
    var(--tile-gradient);
}

/* KENO — three lottery balls in a tight cluster with numbers. */
.art-keno {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><g><circle cx='30' cy='32' r='18' fill='%23F0D77E' stroke='%238B6914' stroke-width='1.6'/><text x='30' y='38' font-family='Cinzel,serif' font-weight='900' font-size='14' fill='%231A050A' text-anchor='middle'>7</text></g><g><circle cx='66' cy='28' r='18' fill='%23C92434' stroke='%238B6914' stroke-width='1.6'/><text x='66' y='34' font-family='Cinzel,serif' font-weight='900' font-size='14' fill='%23F5E6C8' text-anchor='middle'>23</text></g><g><circle cx='50' cy='60' r='16' fill='%23F0D77E' stroke='%238B6914' stroke-width='1.6'/><text x='50' y='66' font-family='Cinzel,serif' font-weight='900' font-size='13' fill='%231A050A' text-anchor='middle'>40</text></g></svg>"),
    var(--tile-gradient);
}

/* BACCARAT — two fanned cards + gold "8" pip in the upper corner. */
.art-baccarat {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 80'><g transform='translate(36 44) rotate(-8)'><rect x='-15' y='-22' width='30' height='44' rx='3' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.4'/><text x='-10' y='-10' font-family='Cinzel,serif' font-weight='700' font-size='10' fill='%231A050A'>5</text><text x='-10' y='0' font-family='serif' font-size='9' fill='%231A050A'>♠</text><text x='0' y='12' font-family='serif' font-size='14' fill='%231A050A' text-anchor='middle'>♠</text></g><g transform='translate(66 44) rotate(8)'><rect x='-15' y='-22' width='30' height='44' rx='3' fill='%23F5E6C8' stroke='%238B6914' stroke-width='1.4'/><text x='-10' y='-10' font-family='Cinzel,serif' font-weight='700' font-size='10' fill='%23C92434'>3</text><text x='-10' y='0' font-family='serif' font-size='9' fill='%23C92434'>♥</text><text x='0' y='12' font-family='serif' font-size='14' fill='%23C92434' text-anchor='middle'>♥</text></g><circle cx='84' cy='14' r='10' fill='%23D4AF37' stroke='%238B6914' stroke-width='1.4'/><text x='84' y='18' font-family='Cinzel,serif' font-weight='900' font-size='12' fill='%231A050A' text-anchor='middle'>8</text></svg>"),
    var(--tile-gradient);
}