// game-art.jsx — Procedural SVG game artwork engine for VantageBet.
// Each game carries a `theme` + `palette` [deep, mid, bright] + `glow`/`accent`.
// GameArt renders a distinctive, layered illustrated thumbnail that fills its box.
// viewBox is 4:5 (240×300); composition is vertically centred so square / landscape
// crops still read. No real brand imagery — all art is original geometry.
const _star = (x, y, r, fill, o = 1) => (
);
const _dot = (x, y, r, fill, o = 1) => ;
function themeMotif(theme, P, G, A, uid) {
const [c0, c1, c2] = P;
switch (theme) {
case 'egyptian': return (
{/* dunes */}
{/* pyramids */}
{/* Eye of Horus mark */}
{_star(52, 70, 4, G, 0.9)}{_star(196, 92, 3, G, 0.8)}{_star(180, 54, 2.5, '#fff', 0.7)}{_star(70, 150, 2.5, G, 0.6)}
);
case 'candy': return (
{/* lollipop swirl */}
{/* gumdrops / candies */}
{[[44,88,15,A],[196,96,13,G],[54,200,17,G],[190,206,14,A],[112,236,12,c2]].map(([x,y,r,f],i)=>(
))}
{/* hearts */}
{_dot(78,52,3,'#fff',0.8)}{_dot(168,150,3,'#fff',0.7)}{_dot(60,150,2.5,'#fff',0.6)}
);
case 'western': return (
{/* horizon mesas */}
{/* cactus */}
{/* sheriff star */}
{_star(0,0,17,A,1)}
{_star(40,60,3,'#fff',0.8)}{_star(198,70,2.5,'#fff',0.7)}
);
case 'mythology': return (
{/* clouds */}
{/* lightning bolt */}
{/* columns */}
{[26,58,182,214].map((x,i)=>())}
{_star(50,60,3.5,G,0.9)}{_star(196,120,3,G,0.8)}{_star(212,58,2.5,'#fff',0.7)}
);
case 'ocean': return (
{/* light shafts */}
{/* fish */}
{/* bubbles */}
{[[70,70,7],[86,52,4],[186,96,6],[176,66,3.5],[54,168,5]].map(([x,y,r],i)=>())}
{/* seabed */}
{_star(150,74,3,A,0.9)}
);
case 'cards': return (
{/* two cards */}
A
K
{/* chips */}
{[[54,224,'#fff'],[74,232,A],[94,224,c2]].map(([x,y,f],i)=>())}
{_star(190,90,4,G,0.9)}{_star(206,140,3,G,0.7)}
);
case 'fortune': return (
{/* radiant burst */}
{[0,45,90,135,180,225,270,315].map(a=>())}
{/* diamond */}
{/* coin pile */}
{[[80,232,20],[120,240,22],[160,232,20],[100,214,18],[140,214,18]].map(([x,y,r],i)=>($))}
{_star(58,80,4,G)}{_star(190,88,3.5,G,0.8)}{_star(200,150,3,'#fff',0.7)}
);
case 'cyber': return (
{/* neon sun */}
{[92,104,116,128].map(y=>())}
{/* perspective grid */}
{[0,40,80,120,160,200,240].map(x=>())}
{[[188,0.9],[212,0.7],[244,0.5],[286,0.35]].map(([y,o],i)=>())}
{/* floating gems */}
{[[54,70,A],[190,64,G],[196,150,A]].map(([x,y,f],i)=>())}
{_star(70,150,3,'#fff',0.8)}
);
case 'wheel': return (
{/* wheel */}
{Array.from({length:12}).map((_,i)=>{const a0=i*30*Math.PI/180,a1=(i+1)*30*Math.PI/180;const f=i%2?c0:c2;return ;})}
{/* pointer */}
{_star(46,80,4,G,0.9)}{_star(198,84,3.5,G,0.8)}
);
case 'dragon': return (
{/* lantern */}
{/* dragon S-curve */}
{/* coins */}
{[[62,206,15],[92,220,16],[58,240,13]].map(([x,y,r],i)=>())}
{_star(50,70,4,G)}{_star(120,60,3,'#fff',0.7)}
);
case 'jungle': return (
{/* light shafts */}
{/* temple gem */}
{/* monstera leaves */}
{_star(180,72,4,G,0.9)}{_dot(70,110,3,'#fff',0.7)}
);
default: return ;
}
}
function GameArt({ game, style }) {
const P = game.palette || ['#1A1D2E', '#22263A', '#5B8AF5'];
const G = game.glow || P[2];
const A = game.accent || P[2];
const uid = 'g' + game.id;
return (
);
}
// shared sheen gradient (defined once, referenced by all instances)
function GameArtDefs() {
return (
);
}
Object.assign(window, { GameArt, GameArtDefs });