/* ===== Symbol backplates: every machine has its own 8 themed shapes =====
   The shape order matches symbol value: 4 low (faint), 2 mid (machine color), 1 high (gold), 1 top (effect).
   --pc is the plate color for the tier; --pl / --pd are lighter / darker versions of it. */
.plate { position: absolute; inset: 10%; z-index: 0; pointer-events: none;
  --pl: color-mix(in srgb, var(--pc) 45%, #fff); --pd: color-mix(in srgb, var(--pc) 40%, #000);
  --fill: radial-gradient(circle at 35% 30%, var(--pl), var(--pc) 50%, var(--pd)); }
.t-low .plate  { --pc: color-mix(in srgb, var(--c1) 75%, #888); opacity: .6; }
.t-mid .plate  { --pc: var(--c2); }
.t-high .plate { --pc: var(--gold); }
.t-top .plate  { --pc: #fff; }
.plate::before, .plate::after { content: none; position: absolute; }
.strip.rolling .plate, .strip.rolling .plate::before, .strip.rolling .plate::after { animation: none !important; }

/* shared plate motions (all start at a random point via --d) */
@keyframes pSpin  { to { transform: rotate(360deg); } }
@keyframes pSpinR { to { transform: rotate(-360deg); } }
@keyframes pBob   { 50% { transform: translateY(-7%); } }
@keyframes pPulse { 50% { transform: scale(1.1); } }
@keyframes pSway  { from { transform: rotate(-10deg); } to { transform: rotate(10deg); } }
@keyframes pTilt  { from { transform: rotate(-5deg); } to { transform: rotate(5deg); } }
@keyframes pFlap  { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.7) translateY(-5%); } }
@keyframes pSquish { 0%, 70%, 100% { transform: scale(1); } 78% { transform: scale(1.15, .82); } 86% { transform: scale(.9, 1.1); } }
@keyframes pFlicker { 0%, 90%, 94%, 100% { opacity: 1; } 92% { opacity: .25; } 96% { opacity: .5; } }
@keyframes pMorph { 0%, 100% { border-radius: 42% 58% 63% 37% / 45% 41% 59% 55%; } 33% { border-radius: 60% 40% 35% 65% / 58% 62% 38% 42%; }
  66% { border-radius: 38% 62% 52% 48% / 62% 38% 62% 38%; } }
@keyframes pLook  { 0%, 30%, 100% { transform: translate(0, 0); } 40%, 55% { transform: translate(22%, -6%); } 65%, 85% { transform: translate(-22%, 8%); } }
@keyframes pBubble { from { transform: translateY(20%); opacity: 0; } 30% { opacity: 1; } to { transform: translateY(-60%); opacity: 0; } }
@keyframes pAurora { to { background-position: -200% 0; } }
.fx-rays { inset: -28%; -webkit-mask: radial-gradient(circle, #000 14%, transparent 62%); mask: radial-gradient(circle, #000 14%, transparent 62%); }

/* ---------- Neon Fruits: glowing neon tubes ---------- */
.s-ncircle, .s-nsquare, .s-ndiamond, .s-ndouble { border: .08em solid var(--pl); box-shadow: 0 0 .18em var(--pc), inset 0 0 .18em var(--pc);
  animation: pFlicker 5s linear var(--d) infinite; }
.s-ncircle { border-radius: 50%; }
.s-nsquare { inset: 14%; border-radius: 24%; }
.s-ndiamond { inset: 21%; border-radius: 14%; rotate: 45deg; }
.s-ndouble { border-radius: 50%; border: .16em double var(--pl); }
.s-nmarquee { inset: 8%; border-radius: 22%; border: .1em dotted var(--pl); background: color-mix(in srgb, var(--pc) 25%, transparent);
  box-shadow: 0 0 .2em var(--pc); animation: pFlicker 2.5s linear var(--d) infinite; }
.s-nrays { inset: -6%; border-radius: 50%; background: repeating-conic-gradient(var(--pc) 0 8deg, transparent 8deg 24deg);
  -webkit-mask: radial-gradient(circle, #000 28%, transparent 68%); mask: radial-gradient(circle, #000 28%, transparent 68%); animation: pSpin 12s linear var(--d) infinite; }
.s-nstar { inset: 3%; clip-path: polygon(50% 0%,62% 33%,98% 35%,70% 56%,79% 90%,50% 71%,21% 90%,30% 56%,2% 35%,38% 33%);
  background: var(--fill); animation: pSpin 14s linear var(--d) infinite; }
.s-ndisco { opacity: .6; background: repeating-conic-gradient(#f0f 0 12deg, #0ff 12deg 24deg, #ff0 24deg 36deg, transparent 36deg 50deg);
  animation: pSpin 7s linear var(--d) infinite; }

/* ---------- Cosmic Cash: orbits, planets, radar, galaxies ---------- */
.s-corbit { inset: 22% 0; border-radius: 50%; border: .07em solid var(--pl); box-shadow: 0 0 .12em var(--pc); animation: pSpin 6s linear var(--d) infinite; }
.s-cplanet { inset: 16%; border-radius: 50%; animation: pBob 3.5s ease-in-out var(--d) infinite;
  background: linear-gradient(160deg, transparent 40%, rgba(255,255,255,.35) 43% 52%, transparent 55%), var(--fill); }
.s-csparkle { inset: 2%; clip-path: polygon(50% 0%,59% 41%,100% 50%,59% 59%,50% 100%,41% 59%,0% 50%,41% 41%);
  background: var(--fill); animation: pSpin 9s linear var(--d) infinite; }
.s-cradar { inset: 6%; border-radius: 50%; border: .05em solid var(--pl); animation: pSpin 3s linear var(--d) infinite;
  background: conic-gradient(color-mix(in srgb, var(--pc) 85%, transparent), transparent 28%),
    radial-gradient(circle, transparent 30%, var(--pl) 31% 33%, transparent 34% 60%, var(--pl) 61% 63%, transparent 64%); }
.s-ccrater { inset: 9%; border-radius: 50%; animation: pSpin 20s linear var(--d) infinite;
  background: radial-gradient(circle at 30% 35%, var(--pd) 0 10%, transparent 11%), radial-gradient(circle at 66% 62%, var(--pd) 0 13%, transparent 14%),
    radial-gradient(circle at 62% 24%, var(--pd) 0 6%, transparent 7%), radial-gradient(circle at 28% 72%, var(--pd) 0 6%, transparent 7%), var(--fill); }
.s-cgalaxy { inset: 0; border-radius: 50%; animation: pSpin 4s linear var(--d) infinite;
  background: conic-gradient(var(--pl), transparent 22%, var(--pc) 50%, transparent 72%, var(--pl));
  -webkit-mask: radial-gradient(circle, #000 18%, transparent 70%); mask: radial-gradient(circle, #000 18%, transparent 70%); }
.s-cufo { inset: 42% 4% 18%; border-radius: 50%; background: var(--fill); animation: pBob 2.6s ease-in-out var(--d) infinite; }
.s-cufo::before { content: ''; left: 28%; right: 28%; bottom: 60%; height: 110%; border-radius: 50% 50% 10% 10%; background: rgba(190,255,255,.45); }
.s-cnova { background: repeating-conic-gradient(rgba(255,255,255,.85) 0 4deg, transparent 4deg 20deg); animation: pSpinR 14s linear var(--d) infinite; }

/* ---------- Dragon Gold: coins, lanterns, seals, fans, clouds, jade ---------- */
.s-dcoin { inset: 9%; border-radius: 50%; border: .05em solid var(--pl);
  background: linear-gradient(var(--pd), var(--pd)) center / 26% 26% no-repeat, var(--fill); }
.s-dlantern { inset: 6% 18%; border-radius: 40%; transform-origin: 50% 0; animation: pSway 2.8s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(var(--pl), var(--pl)) top / 100% 10% no-repeat, linear-gradient(var(--pl), var(--pl)) bottom / 100% 10% no-repeat,
    repeating-linear-gradient(90deg, transparent 0 17%, rgba(0,0,0,.25) 17% 20%), var(--fill); }
.s-dbagua { inset: 6%; clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%); animation: pSpin 16s linear var(--d) infinite;
  background: repeating-conic-gradient(from 22.5deg, var(--pc) 0 40deg, var(--pd) 40deg 45deg); }
.s-dseal { inset: 14%; border-radius: 8%; rotate: -8deg; background: var(--fill); box-shadow: inset 0 0 0 .05em var(--pl), inset 0 0 0 .1em var(--pd);
  animation: pTilt 2.4s ease-in-out var(--d) infinite alternate; }
.s-dfan { inset: 6% 2% 26%; border-radius: 100% 100% 0 0 / 100% 100% 0 0; transform-origin: 50% 100%; animation: pSway 2.2s ease-in-out var(--d) infinite alternate;
  background: repeating-conic-gradient(from -90deg at 50% 100%, var(--pc) 0 9deg, var(--pl) 9deg 18deg); }
.s-dcloud { inset: 20% 2%; animation: pBob 3s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 24% 62%, var(--pc) 0 21%, transparent 22%), radial-gradient(circle at 50% 38%, var(--pl) 0 28%, transparent 29%),
    radial-gradient(circle at 76% 62%, var(--pc) 0 21%, transparent 22%), linear-gradient(var(--pc), var(--pc)) 50% 86% / 66% 28% no-repeat; }
.s-djade { inset: 4%; border-radius: 50%; animation: pSpin 18s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pc) 0 15deg, var(--pl) 15deg 30deg);
  -webkit-mask: radial-gradient(circle, transparent 24%, #000 26% 68%, transparent 70%); mask: radial-gradient(circle, transparent 24%, #000 26% 68%, transparent 70%); }
.s-dflame { background: repeating-conic-gradient(rgba(255,170,0,.9) 0 6deg, transparent 6deg 18deg); animation: pSpin 9s linear var(--d) infinite; }

/* ---------- Ocean Riches: bubbles, shells, portholes, life rings, pearls ---------- */
.s-obubble { inset: 8%; border-radius: 50%; animation: pBob 3s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 30% 28%, rgba(255,255,255,.85) 0 8%, transparent 9%), radial-gradient(circle, transparent 56%, var(--pl) 76%); }
.s-oshell { inset: 12% 6% 12%; border-radius: 50% 50% 14% 14% / 72% 72% 14% 14%;
  background: repeating-conic-gradient(from -70deg at 50% 100%, var(--pc) 0 11deg, var(--pd) 11deg 14deg); }
.s-oporthole { inset: 9%; border-radius: 50%; border: .12em solid var(--pl); box-shadow: inset 0 0 0 .03em var(--pd), 0 0 0 .03em var(--pd);
  background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.3), transparent 55%); }
.s-oporthole::before { content: ''; inset: -.1em; border-radius: 50%; border: .06em dotted var(--pd); }
@keyframes oDrop { 0%, 100% { transform: rotate(-45deg) translate(0, 0); } 50% { transform: rotate(-45deg) translate(5%, -5%); } }
.s-odrop { inset: 16% 18% 8%; border-radius: 50% 0 50% 50%; background: var(--fill); animation: oDrop 3s ease-in-out var(--d) infinite; }
.s-oring { inset: 4%; border-radius: 50%; animation: pSpin 7s linear var(--d) infinite;
  background: conic-gradient(#ef4444 0 25%, #fff 0 50%, #ef4444 0 75%, #fff 0);
  -webkit-mask: radial-gradient(circle, transparent 44%, #000 46% 68%, transparent 70%); mask: radial-gradient(circle, transparent 44%, #000 46% 68%, transparent 70%); }
.s-owave { inset: 8%; border-radius: 50%; border: .05em solid var(--pl); animation: pBob 2.4s ease-in-out var(--d) infinite;
  background: repeating-radial-gradient(circle at 50% 130%, var(--pc) 0 9%, var(--pl) 9% 12%); }
.s-opearl { inset: 16%; border-radius: 50%; box-shadow: 0 0 .25em var(--pc); animation: pPulse 2.6s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 35% 30%, #fff, #f8ecd8 35%, var(--pc) 78%, var(--pd)); }
.s-ocaustic { opacity: .7; background: repeating-radial-gradient(circle, rgba(255,255,255,.45) 0 4%, transparent 4% 11%); animation: pPulse 3s ease-in-out var(--d) infinite; }

/* ---------- Candy Blast: peppermints, donuts, gumdrops, wrappers, lollipops ---------- */
.s-kmint { inset: 8%; border-radius: 50%; border: .05em solid #fff; background: repeating-conic-gradient(#ef4444 0 30deg, #fff 30deg 60deg);
  animation: pSpin 5s linear var(--d) infinite; }
.s-kdonut { inset: 6%; border-radius: 50%; animation: pSpin 10s linear var(--d) infinite;
  background: radial-gradient(circle at 30% 40%, #fff 0 4%, transparent 5%), radial-gradient(circle at 66% 28%, #ffe066 0 4%, transparent 5%),
    radial-gradient(circle at 72% 68%, #7dd3fc 0 4%, transparent 5%), radial-gradient(circle at 34% 74%, #a3e635 0 4%, transparent 5%), var(--fill);
  -webkit-mask: radial-gradient(circle, transparent 19%, #000 21%); mask: radial-gradient(circle, transparent 19%, #000 21%); }
.s-kgum { inset: 18% 12% 8%; border-radius: 50% 50% 18% 18% / 70% 70% 18% 18%; background: var(--fill); box-shadow: inset 0 -.08em 0 var(--pd);
  transform-origin: 50% 100%; animation: pSquish 2.4s ease-in-out var(--d) infinite; }
.s-kwrap { inset: 28% 25%; border-radius: 50%; background: var(--fill); animation: pTilt 1.6s ease-in-out var(--d) infinite alternate; }
.s-kwrap::before, .s-kwrap::after { content: ''; top: -12%; bottom: -12%; width: 60%; background: var(--pl); }
.s-kwrap::before { right: 92%; clip-path: polygon(0 0, 100% 40%, 100% 60%, 0 100%); }
.s-kwrap::after  { left: 92%;  clip-path: polygon(100% 0, 0 40%, 0 60%, 100% 100%); }
.s-klolly { inset: 4%; border-radius: 50%; border: .06em solid #fff; background: repeating-conic-gradient(var(--pc) 0 20deg, #fff 20deg 40deg);
  animation: pSpinR 3s linear var(--d) infinite; }
.s-kcookie { inset: 8%; border-radius: 50%; animation: pTilt 2s ease-in-out var(--d) infinite alternate;
  background: radial-gradient(circle at 30% 30%, #3b1d0a 0 7%, transparent 8%), radial-gradient(circle at 68% 36%, #3b1d0a 0 6%, transparent 7%),
    radial-gradient(circle at 44% 70%, #3b1d0a 0 7%, transparent 8%), radial-gradient(circle at 74% 72%, #3b1d0a 0 5%, transparent 6%), var(--fill); }
.s-kjelly { inset: 8%; background: var(--fill); animation: pMorph 2.6s ease-in-out var(--d) infinite; }
.s-krainbow { inset: -6% -14% 30%; opacity: .75; border-radius: 50% 50% 0 0 / 100% 100% 0 0; animation: pPulse 3s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 50% 100%, transparent 36%, #a855f7 36% 43%, #3b82f6 43% 50%, #22c55e 50% 57%, #facc15 57% 64%, #f97316 64% 71%, #ef4444 71% 78%, transparent 78%); }

/* ---------- Jungle Jackpot: leaves, stones, bamboo, shields, totems, tiki ---------- */
.s-jleaf { inset: 8%; border-radius: 0 100% 0 100%; transform-origin: 0 100%; animation: pSway 3s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(135deg, transparent 48%, var(--pd) 49% 51%, transparent 52%), var(--fill); }
.s-jstone { inset: 6%; clip-path: polygon(12% 18%,40% 4%,78% 10%,96% 40%,88% 82%,56% 96%,18% 88%,4% 52%);
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.3), transparent 55%), color-mix(in srgb, var(--pc) 35%, #6b7280); }
.s-jbamboo { inset: 8%; border-radius: 8%; border: .1em solid #84cc16; box-shadow: inset 0 0 0 .03em #3f6212, 0 0 0 .03em #3f6212;
  background: linear-gradient(#3f6212, #3f6212) 0 50% / 100% .04em no-repeat, color-mix(in srgb, var(--pc) 25%, transparent); }
.s-jshield { inset: 4% 20%; border-radius: 50%; border: .05em solid var(--pd); animation: pTilt 2.2s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(90deg, transparent 45%, var(--pd) 45% 55%, transparent 55%), repeating-linear-gradient(0deg, var(--pc) 0 16%, var(--pl) 16% 22%); }
.s-jvine { inset: 6%; border-radius: 50%; border: .15em dotted #22c55e; box-shadow: 0 0 0 .04em #166534, inset 0 0 0 .04em #166534;
  animation: pSpin 14s linear var(--d) infinite; }
.s-jtotem { inset: 3% 22%; border-radius: 30% 30% 8% 8%;
  background: linear-gradient(var(--pd), var(--pd)) 50% 30% / 64% 7% no-repeat, linear-gradient(var(--pd), var(--pd)) 50% 68% / 64% 7% no-repeat, var(--fill); }
.s-jtiki { inset: 4% 14%; border-radius: 45% 45% 40% 40% / 50% 50% 35% 35%; background: var(--fill); box-shadow: inset 0 0 0 .05em var(--pd);
  animation: pPulse 2.4s ease-in-out var(--d) infinite; }
.s-jsun { background: repeating-conic-gradient(rgba(74,222,128,.9) 0 10deg, transparent 10deg 30deg); animation: pSpin 16s linear var(--d) infinite; }

/* ---------- Pharaoh Fever: pyramids, cartouches, scarabs, tablets, wings, the eye ---------- */
.s-ppyramid { inset: 8% 3% 12%; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: linear-gradient(90deg, var(--pl) 50%, var(--pd) 50%); }
.s-pcartouche { inset: 4% 22%; border-radius: 999px; border: .07em solid var(--pl); box-shadow: 0 .07em 0 var(--pd);
  background: color-mix(in srgb, var(--pc) 28%, transparent); }
.s-pscarab { inset: 14% 18%; border-radius: 50% 50% 46% 46% / 60% 60% 40% 40%; animation: pTilt 2s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(90deg, transparent 47%, var(--pd) 47% 53%, transparent 53%), var(--fill); }
.s-ptablet { inset: 8% 12%; border-radius: 6%; background: repeating-linear-gradient(0deg, transparent 0 21%, rgba(0,0,0,.28) 21% 25%), color-mix(in srgb, var(--pc) 40%, #c2a36b); }
.s-pwings { inset: 22% 0; clip-path: polygon(0 20%,35% 40%,50% 0,65% 40%,100% 20%,80% 70%,50% 100%,20% 70%); background: var(--fill);
  animation: pFlap 2s ease-in-out var(--d) infinite; }
.s-pobelisk { inset: 2% 32%; clip-path: polygon(50% 0, 100% 16%, 100% 100%, 0 100%, 0 16%); background: linear-gradient(90deg, var(--pl) 50%, var(--pc) 50%); }
.s-peye { inset: 24% 0; clip-path: polygon(0 50%,15% 28%,35% 12%,50% 9%,65% 12%,85% 28%,100% 50%,85% 72%,65% 88%,50% 91%,35% 88%,15% 72%);
  background: radial-gradient(circle, var(--pd) 0 20%, var(--pc) 21% 34%, var(--pl) 35%); animation: pPulse 2.6s ease-in-out var(--d) infinite; }
.s-psun { background: repeating-conic-gradient(rgba(255,215,0,.85) 0 5deg, transparent 5deg 15deg); animation: pSpin 20s linear var(--d) infinite; }

/* ---------- Monster Mania: tombstones, webs, slime, bats, cauldron, eyeball ---------- */
.s-mtomb { inset: 6% 16% 4%; border-radius: 50% 50% 6% 6% / 40% 40% 6% 6%; animation: pTilt 2.6s ease-in-out var(--d) infinite alternate; transform-origin: 50% 100%;
  background: linear-gradient(var(--pd), var(--pd)) 50% 30% / 44% 6% no-repeat, linear-gradient(var(--pd), var(--pd)) 50% 24% / 7% 32% no-repeat,
    color-mix(in srgb, var(--pc) 35%, #6b7280); }
.s-mweb { inset: 0; border-radius: 50%; animation: pSway 4s ease-in-out var(--d) infinite alternate;
  background: repeating-conic-gradient(var(--pl) 0 2deg, transparent 2deg 45deg), repeating-radial-gradient(circle, transparent 0 13%, var(--pl) 13% 15%);
  -webkit-mask: radial-gradient(circle, #000 60%, transparent 70%); mask: radial-gradient(circle, #000 60%, transparent 70%); }
.s-mslime { inset: 8%; background: var(--fill); animation: pMorph 2.4s ease-in-out var(--d) infinite; }
.s-mbat { inset: 24% 0; clip-path: polygon(0 10%,12% 30%,24% 18%,32% 34%,44% 20%,50% 0,56% 20%,68% 34%,76% 18%,88% 30%,100% 10%,92% 60%,76% 50%,64% 72%,50% 100%,36% 72%,24% 50%,8% 60%);
  background: var(--fill); animation: pFlap 1.4s ease-in-out var(--d) infinite; }
.s-mpot { inset: 34% 10% 6%; border-radius: 10% 10% 50% 50% / 10% 10% 70% 70%; background: #1f2937; box-shadow: inset 0 .08em 0 var(--pc); }
.s-mpot::before { content: ''; left: 10%; right: 10%; bottom: 90%; height: 70%; animation: pBubble 1.6s ease-in var(--d) infinite;
  background: radial-gradient(circle at 30% 70%, var(--pc) 0 12%, transparent 13%), radial-gradient(circle at 62% 40%, var(--pl) 0 10%, transparent 11%),
    radial-gradient(circle at 82% 78%, var(--pc) 0 8%, transparent 9%); }
.s-meye { inset: 12%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #e5e7eb 60%, #fca5a5 92%); }
.s-meye::after { content: ''; inset: 30%; border-radius: 50%; background: radial-gradient(circle, #000 0 30%, var(--pc) 32% 70%, var(--pd) 72%);
  animation: pLook 4s ease-in-out var(--d) infinite; }
.s-mmoon { inset: 6%; border-radius: 50%; background: var(--fill); filter: drop-shadow(0 0 .12em var(--pc)); animation: pTilt 2.4s ease-in-out var(--d) infinite alternate;
  -webkit-mask: radial-gradient(circle at 72% 32%, transparent 40%, #000 42%); mask: radial-gradient(circle at 72% 32%, transparent 40%, #000 42%); }
.s-mvortex { inset: -10%; border-radius: 50%; opacity: .8; background: repeating-conic-gradient(#a21caf 0 15deg, #4c1d95 15deg 30deg);
  -webkit-mask: radial-gradient(circle, #000 20%, transparent 66%); mask: radial-gradient(circle, #000 20%, transparent 66%); animation: pSpin 2.5s linear var(--d) infinite; }

/* ---------- Wild West Gold: sheriff badges, wanted posters, horseshoes, barrels, wagon wheels ---------- */
.s-wbadge { inset: 4%; clip-path: polygon(50% 0%,65% 24%,93% 25%,80% 50%,93% 75%,65% 76%,50% 100%,35% 76%,7% 75%,20% 50%,7% 25%,35% 24%);
  background: var(--fill); animation: pTilt 2.4s ease-in-out var(--d) infinite alternate; }
.s-wwanted { inset: 6% 14%; rotate: -4deg; box-shadow: inset 0 0 .15em rgba(120,60,0,.6); animation: pTilt 3s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(rgba(60,30,0,.5), rgba(60,30,0,.5)) 50% 12% / 72% 8% no-repeat, color-mix(in srgb, #e8d3a6 75%, var(--pc)); }
.s-wshoe { inset: 8% 16% 16%; border: .13em solid var(--pl); border-bottom-color: transparent; border-radius: 50% 50% 12% 12% / 62% 62% 12% 12%;
  box-shadow: 0 0 0 .02em var(--pd); transform-origin: 50% 0; animation: pSway 2.6s ease-in-out var(--d) infinite alternate; }
.s-wbarrel { inset: 6% 18%; border-radius: 40% / 12%;
  background: linear-gradient(var(--pd), var(--pd)) 0 25% / 100% 7% no-repeat, linear-gradient(var(--pd), var(--pd)) 0 75% / 100% 7% no-repeat,
    repeating-linear-gradient(90deg, var(--pc) 0 18%, var(--pd) 18% 21%); }
.s-wwheel { inset: 4%; border-radius: 50%; border: .08em solid var(--pd); animation: pSpin 5s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pc) 0 5deg, transparent 5deg 45deg), radial-gradient(circle, var(--pd) 0 14%, transparent 15%); }
.s-wplank { inset: 26% 0; border-radius: 4%; clip-path: polygon(0 0, 86% 0, 100% 50%, 86% 100%, 0 100%); transform-origin: 0 50%;
  background: repeating-linear-gradient(0deg, transparent 0 30%, rgba(0,0,0,.22) 30% 34%), var(--pc); animation: pTilt 2s ease-in-out var(--d) infinite alternate; }
.s-wbuckle { inset: 18% 4%; border-radius: 50%; background: var(--fill); box-shadow: inset 0 0 0 .06em var(--pl), inset 0 0 0 .11em var(--pd);
  animation: pPulse 2.6s ease-in-out var(--d) infinite; }
.s-wdust { background: repeating-conic-gradient(rgba(251,146,60,.85) 0 7deg, transparent 7deg 22deg); animation: pSpin 18s linear var(--d) infinite; }

/* ---------- Frozen Fortune: snowflakes, crystals, igloos, icicles, ice shards, gems ---------- */
.s-fflake { inset: 0; border-radius: 50%; animation: pSpin 12s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pl) 0 3deg, transparent 3deg 60deg);
  -webkit-mask: radial-gradient(circle, #000 56%, transparent 66%); mask: radial-gradient(circle, #000 56%, transparent 66%); }
.s-fcrystal { inset: 2% 18%; clip-path: polygon(50% 0, 82% 20%, 82% 80%, 50% 100%, 18% 80%, 18% 20%); background: linear-gradient(90deg, var(--pl) 50%, var(--pc) 50%);
  animation: pBob 3s ease-in-out var(--d) infinite; }
.s-figloo { inset: 24% 4% 10%; border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: repeating-linear-gradient(0deg, transparent 0 22%, var(--pd) 22% 26%), color-mix(in srgb, var(--pc) 40%, #e0f2fe); }
.s-ficicle { inset: 2% 26%; clip-path: polygon(0 0, 100% 0, 50% 100%); background: linear-gradient(90deg, var(--pl), var(--pc)); animation: pBob 2.6s ease-in-out var(--d) infinite; }
.s-ffrost { inset: 10%; border-radius: 50%; box-shadow: 0 0 .25em #fff; animation: pPulse 2.4s ease-in-out var(--d) infinite;
  background: linear-gradient(60deg, transparent 48%, rgba(255,255,255,.7) 49% 51%, transparent 52%), linear-gradient(-30deg, transparent 48%, rgba(255,255,255,.7) 49% 51%, transparent 52%),
    radial-gradient(circle at 35% 30%, #fff, var(--pc) 60%); }
.s-fshard { inset: 4%; clip-path: polygon(10% 30%,45% 0,70% 18%,100% 10%,85% 55%,96% 90%,50% 80%,15% 100%,24% 60%,0 52%);
  background: linear-gradient(135deg, var(--pl), var(--pc) 50%, var(--pd)); animation: pTilt 2.2s ease-in-out var(--d) infinite alternate; }
.s-fgem { inset: 8% 4%; clip-path: polygon(20% 8%, 80% 8%, 100% 36%, 50% 100%, 0 36%); animation: pPulse 2.4s ease-in-out var(--d) infinite;
  background: conic-gradient(from 180deg at 50% 36%, var(--pl), var(--pc), var(--pd), var(--pl), var(--pc), var(--pd), var(--pl)); }
.s-faurora { inset: -10%; opacity: .8; background-size: 300% 100%; animation: pAurora 5s linear var(--d) infinite;
  background-image: linear-gradient(110deg, transparent 10%, rgba(52,211,153,.75) 25%, transparent 40%, rgba(167,139,250,.75) 55%, transparent 70%, rgba(52,211,153,.75) 85%, transparent 100%); }

/* ---------- Billionaire Club: banknotes, gold bars, chips, cards, vaults, gems, crests ---------- */
.s-bnote { inset: 24% 2%; border-radius: 4%; box-shadow: inset 0 0 0 .04em #bbf7d0; rotate: -6deg; animation: pTilt 2.4s ease-in-out var(--d) infinite alternate;
  background: radial-gradient(ellipse at center, transparent 0 16%, #14532d 17% 20%, transparent 21%), #22c55e; }
.s-bbar { inset: 30% 6% 22%; clip-path: polygon(15% 0, 85% 0, 100% 100%, 0 100%); background: linear-gradient(180deg, #fff3c4, #eab308 50%, #a16207); }
.s-bchip { inset: 6%; border-radius: 50%; border: .1em dashed #fff; animation: pSpin 8s linear var(--d) infinite;
  background: radial-gradient(circle, var(--pc) 0 50%, #fff 51% 54%, var(--pc) 55%); }
.s-bcard { inset: 8% 20%; border-radius: 10%; rotate: 8deg; background: #fff; box-shadow: inset 0 0 0 .04em var(--pc), inset 0 0 0 .08em #fff, inset 0 0 0 .1em var(--pc);
  animation: pTilt 2.6s ease-in-out var(--d) infinite alternate; }
.s-bvault { inset: 4%; border-radius: 50%; border: .07em solid var(--pl); animation: pSpin 6s ease-in-out var(--d) infinite;
  background: repeating-conic-gradient(var(--pd) 0 6deg, transparent 6deg 60deg), radial-gradient(circle, var(--pl) 0 18%, var(--pc) 19% 64%, var(--pd) 66%); }
.s-bgem { inset: 8%; clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%); animation: pPulse 2.2s ease-in-out var(--d) infinite;
  background: conic-gradient(var(--pl), var(--pc), var(--pd), var(--pc), var(--pl), var(--pd), var(--pl)); }
.s-bcrest { inset: 4% 12%; clip-path: polygon(0 0, 100% 0, 100% 56%, 50% 100%, 0 56%); animation: pPulse 2.8s ease-in-out var(--d) infinite;
  background: linear-gradient(160deg, transparent 40%, rgba(255,255,255,.35) 45% 50%, transparent 55%), var(--fill); }
.s-bspot { inset: -20%; opacity: .7; transform-origin: 50% 100%; animation: pSway 2.4s ease-in-out var(--d) infinite alternate;
  background: conic-gradient(from -40deg at 50% 100%, transparent 0 8deg, rgba(255,255,255,.75) 13deg, transparent 18deg 62deg, rgba(255,255,255,.75) 67deg, transparent 72deg); }

/* ---------- Volcano Vault: rocks, embers, lava cracks, fossils, flares, geysers ---------- */
.s-vrock { inset: 6%; clip-path: polygon(20% 8%,55% 0,85% 14%,100% 48%,86% 88%,48% 100%,12% 86%,0 46%);
  background: linear-gradient(140deg, transparent 46%, #ff5a1f 47% 50%, transparent 51%), color-mix(in srgb, var(--pc) 30%, #3f3f46); animation: pTilt 2.4s ease-in-out var(--d) infinite alternate; }
.s-vember { inset: 12%; border-radius: 50%; background: radial-gradient(circle, #fff3a8 0 12%, #ff9a00 30%, #ff3d00 55%, transparent 72%);
  animation: pPulse 1.6s ease-in-out var(--d) infinite; }
.s-vcrack { inset: 8%; border-radius: 50%; background: linear-gradient(35deg, transparent 47%, #ff7a1a 48% 52%, transparent 53%), linear-gradient(-55deg, transparent 47%, #ff7a1a 48% 51%, transparent 52%),
  linear-gradient(100deg, transparent 47%, #ffb300 48% 50%, transparent 51%), #2a0d06; box-shadow: inset 0 0 .15em #ff4500; }
.s-vfossil { inset: 8%; border-radius: 50%; animation: pSpin 9s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pc) 0 10deg, var(--pd) 10deg 14deg), radial-gradient(circle, var(--pl) 0 30%, transparent 31%);
  -webkit-mask: radial-gradient(circle, #000 66%, transparent 68%); mask: radial-gradient(circle, #000 66%, transparent 68%); }
.s-vflare { inset: 0; clip-path: polygon(50% 0%,58% 28%,82% 10%,70% 38%,100% 40%,72% 56%,92% 82%,62% 70%,50% 100%,40% 70%,10% 84%,30% 56%,0 42%,30% 38%,18% 10%,42% 28%);
  background: radial-gradient(circle, var(--pl), var(--pc) 55%, var(--pd)); animation: pSpinR 7s linear var(--d) infinite; }
.s-vgeyser { inset: 4% 20%; border-radius: 50% 50% 40% 40% / 70% 70% 30% 30%; background: linear-gradient(0deg, var(--pd), var(--pc) 55%, var(--pl));
  transform-origin: 50% 100%; animation: pSquish 1.8s ease-in-out var(--d) infinite; }
.s-vgem { inset: 4% 10%; clip-path: polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%); animation: pPulse 2.2s ease-in-out var(--d) infinite;
  background: conic-gradient(from 30deg, var(--pl), var(--pc), var(--pd), var(--pl), var(--pc), var(--pd), var(--pl)); }
.s-verupt { background: repeating-conic-gradient(rgba(255,69,0,.9) 0 6deg, rgba(255,179,0,.7) 6deg 10deg, transparent 10deg 22deg); animation: pSpin 6s linear var(--d) infinite; }

/* ---------- Pirate's Plunder: ship's wheels, maps, compasses, flags, chests, sails, doubloons ---------- */
.s-rhelm { inset: 2%; border-radius: 50%; animation: pSway 3s ease-in-out var(--d) infinite alternate;
  background: radial-gradient(circle, var(--pd) 0 14%, transparent 15% 52%, var(--pc) 53% 62%, transparent 63%), repeating-conic-gradient(var(--pc) 0 6deg, transparent 6deg 45deg); }
.s-rhelm::before { content: ''; inset: -2%; border-radius: 50%; border: .1em dotted var(--pc); }
.s-rmap { inset: 10% 8%; border-radius: 6%; rotate: 5deg; animation: pTilt 2.6s ease-in-out var(--d) infinite alternate;
  background: linear-gradient(45deg, transparent 44%, #b91c1c 45% 55%, transparent 56%) 70% 35% / 26% 26% no-repeat,
    linear-gradient(-45deg, transparent 44%, #b91c1c 45% 55%, transparent 56%) 70% 35% / 26% 26% no-repeat,
    repeating-linear-gradient(90deg, transparent 0 30%, rgba(90,50,0,.25) 30% 32%), color-mix(in srgb, #e8cf9a 80%, var(--pc)); }
.s-rcompass { inset: 8%; border-radius: 50%; border: .06em solid var(--pl); background: radial-gradient(circle, color-mix(in srgb, var(--pc) 30%, transparent), transparent 70%); }
.s-rcompass::before { content: ''; inset: 4%; background: var(--pl); clip-path: polygon(50% 0%,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0% 50%,42% 42%);
  animation: pSway 2s ease-in-out var(--d) infinite alternate; }
@keyframes rWave { 0%, 100% { transform: skewY(0) scaleX(1); } 50% { transform: skewY(-6deg) scaleX(.94); } }
.s-rflag { inset: 18% 8%; background: linear-gradient(var(--pd), var(--pd)) 0 0 / 8% 100% no-repeat, var(--pc); clip-path: polygon(0 0, 100% 6%, 92% 50%, 100% 94%, 0 100%);
  transform-origin: 0 50%; animation: rWave 1.4s ease-in-out var(--d) infinite; }
.s-rchest { inset: 22% 8% 10%; border-radius: 50% 50% 6% 6% / 40% 40% 6% 6%; animation: pSquish 2.6s ease-in-out var(--d) infinite; transform-origin: 50% 100%;
  background: linear-gradient(var(--pl), var(--pl)) 0 42% / 100% 9% no-repeat, linear-gradient(var(--pl), var(--pl)) 50% 0 / 12% 100% no-repeat, linear-gradient(180deg, #7c4a1e, #4a2a0c); }
.s-rsail { inset: 4% 14%; clip-path: polygon(10% 0, 100% 100%, 0 100%); border-radius: 0 60% 0 0;
  background: linear-gradient(90deg, var(--pl), var(--pc)); transform-origin: 0 100%; animation: pTilt 2.4s ease-in-out var(--d) infinite alternate; }
.s-rdoubloon { inset: 8%; border-radius: 50%; background: radial-gradient(circle, transparent 54%, var(--pd) 56% 58%, transparent 60%), var(--fill);
  box-shadow: inset 0 0 0 .05em var(--pl), 0 0 .15em var(--pc); animation: mvFlip 6s ease-in-out var(--d) infinite; }
.s-rsunset { background: repeating-conic-gradient(rgba(255,170,90,.85) 0 8deg, transparent 8deg 24deg); animation: pSpin 16s linear var(--d) infinite; }

/* ---------- Robo Riches: chips, gears, grids, screens, reactors, bolts, reticles ---------- */
.s-xchip { inset: 18%; border-radius: 10%; background: linear-gradient(135deg, #1f2937, #0b1120); box-shadow: 0 0 0 .05em var(--pl), 0 0 .2em var(--pc); }
.s-xchip::before { content: ''; inset: -22%; border: .09em dashed var(--pl); border-radius: 6%; }
.s-xgear { inset: 2%; border-radius: 50%; animation: pSpin 6s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pc) 0 15deg, transparent 15deg 30deg), radial-gradient(circle, var(--pc) 0 60%, transparent 61%);
  -webkit-mask: radial-gradient(circle, transparent 24%, #000 26% 74%, transparent 76%); mask: radial-gradient(circle, transparent 24%, #000 26% 74%, transparent 76%); }
.s-xgrid { inset: 6%; border-radius: 12%; border: .04em solid var(--pl); animation: pFlicker 3s linear var(--d) infinite;
  background: repeating-linear-gradient(0deg, transparent 0 18%, var(--pc) 18% 21%), repeating-linear-gradient(90deg, transparent 0 18%, var(--pc) 18% 21%); }
@keyframes xScan { to { background-position: 0 100%; } }
.s-xscreen { inset: 12% 6%; border-radius: 12%; border: .05em solid var(--pl); background-size: 100% 300%; animation: xScan 2s linear var(--d) infinite;
  background-image: linear-gradient(180deg, transparent 0 45%, color-mix(in srgb, var(--pl) 70%, transparent) 50%, transparent 55%), repeating-linear-gradient(0deg, color-mix(in srgb, var(--pc) 35%, transparent) 0 2px, transparent 2px 5px); }
.s-xreactor { inset: 4%; border-radius: 50%; animation: pPulse 1.4s ease-in-out var(--d) infinite;
  background: radial-gradient(circle, #fff 0 10%, var(--pl) 14%, transparent 22% 34%, var(--pc) 36% 42%, transparent 44% 56%, var(--pc) 58% 64%, transparent 66%); }
.s-xbolt { inset: 2% 18%; clip-path: polygon(60% 0, 10% 56%, 45% 56%, 30% 100%, 90% 40%, 55% 40%); background: linear-gradient(180deg, var(--pl), var(--pc));
  animation: pFlicker 1.8s linear var(--d) infinite; }
.s-xreticle { inset: 4%; border-radius: 50%; border: .06em solid var(--pc); animation: pSpin 4s linear var(--d) infinite;
  background: linear-gradient(var(--pc), var(--pc)) center / 100% .06em no-repeat, linear-gradient(var(--pc), var(--pc)) center / .06em 100% no-repeat,
    radial-gradient(circle, transparent 36%, var(--pl) 38% 41%, transparent 43%); }
.s-xlaser { background: repeating-conic-gradient(rgba(0,229,255,.85) 0 3deg, transparent 3deg 30deg, rgba(255,43,214,.75) 30deg 33deg, transparent 33deg 60deg);
  animation: pSpinR 5s linear var(--d) infinite; }

/* ---------- Olympus Thunder: columns, laurels, vases, clouds, temples, shields ---------- */
.s-zcolumn { inset: 4% 26%; background: linear-gradient(var(--pl), var(--pl)) top / 140% 12% no-repeat, linear-gradient(var(--pl), var(--pl)) bottom / 140% 12% no-repeat,
  repeating-linear-gradient(90deg, var(--pc) 0 18%, var(--pd) 18% 24%); overflow: visible; }
.s-zlaurel { inset: 4%; border-radius: 50%; border: .14em dotted #4ade80; border-top-color: transparent; box-shadow: inset 0 0 0 .03em #166534;
  transform-origin: 50% 100%; animation: pTilt 2.6s ease-in-out var(--d) infinite alternate; }
.s-zvase { inset: 6% 22%; border-radius: 30% 30% 46% 46% / 18% 18% 60% 60%;
  background: linear-gradient(#111, #111) 50% 55% / 100% 10% no-repeat, linear-gradient(#111, #111) 50% 30% / 100% 4% no-repeat, color-mix(in srgb, #d97706 70%, var(--pc)); }
.s-zcloud { inset: 26% 0 18%; animation: pBob 3.2s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 25% 65%, #f1f5f9 0 24%, transparent 25%), radial-gradient(circle at 50% 40%, #fff 0 32%, transparent 33%), radial-gradient(circle at 76% 62%, #e2e8f0 0 24%, transparent 25%); }
.s-ztemple { inset: 6% 4%; clip-path: polygon(50% 0, 100% 30%, 100% 100%, 0 100%, 0 30%); background: linear-gradient(var(--pl), var(--pl)) top / 100% 30% no-repeat,
  repeating-linear-gradient(90deg, var(--pc) 0 14%, transparent 14% 22%), linear-gradient(var(--pd), var(--pd)) bottom / 100% 10% no-repeat; }
.s-zshield { inset: 6%; border-radius: 50%; animation: mvFlip 6s ease-in-out var(--d) infinite;
  background: radial-gradient(circle, var(--pd) 0 16%, transparent 17%), radial-gradient(circle, transparent 60%, var(--pl) 62% 74%, transparent 76%), var(--fill); }
.s-zsun { inset: 2%; border-radius: 50%; animation: pSpin 14s linear var(--d) infinite;
  background: radial-gradient(circle, var(--pl) 0 34%, var(--pc) 36% 40%, transparent 42%), repeating-conic-gradient(var(--pc) 0 8deg, transparent 8deg 22deg);
  -webkit-mask: radial-gradient(circle, #000 66%, transparent 70%); mask: radial-gradient(circle, #000 66%, transparent 70%); }
@keyframes zFlash { 0%, 80%, 100% { opacity: .3; } 84% { opacity: 1; } 88% { opacity: .2; } 92% { opacity: .9; } }
.s-zstorm { background: repeating-conic-gradient(rgba(255,255,255,.95) 0 2deg, transparent 2deg 26deg); animation: zFlash 2.4s linear var(--d) infinite; }

/* ---------- Infinity Vault: prisms, orbs, rainbow rings, loops, kaleidoscopes, halos ---------- */
.s-iprism { inset: 6%; clip-path: polygon(50% 4%, 96% 90%, 4% 90%); animation: pSpin 10s linear var(--d) infinite;
  background: conic-gradient(from 0deg, #f472b6, #facc15, #4ade80, #22d3ee, #a78bfa, #f472b6); }
.s-iorb { inset: 10%; border-radius: 50%; animation: pBob 3s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.9) 0 8%, transparent 10%), conic-gradient(from 0deg, var(--pc), var(--pl), var(--pd), var(--pc));
  box-shadow: 0 0 .2em var(--pc); }
.s-iring { inset: 4%; border-radius: 50%; animation: pSpin 4s linear var(--d) infinite;
  background: conic-gradient(#f472b6, #facc15, #4ade80, #22d3ee, #a78bfa, #f472b6);
  -webkit-mask: radial-gradient(circle, transparent 52%, #000 54% 68%, transparent 70%); mask: radial-gradient(circle, transparent 52%, #000 54% 68%, transparent 70%); }
.s-iloop { inset: 26% 2%; animation: pPulse 3s ease-in-out var(--d) infinite;
  background: radial-gradient(circle at 28% 50%, transparent 0 22%, var(--pl) 24% 34%, transparent 36%), radial-gradient(circle at 72% 50%, transparent 0 22%, var(--pl) 24% 34%, transparent 36%); }
.s-ikaleido { inset: 2%; border-radius: 50%; animation: pSpin 6s linear var(--d) infinite;
  background: repeating-conic-gradient(var(--pc) 0 15deg, var(--pl) 15deg 30deg, #f472b6 30deg 45deg, #facc15 45deg 60deg);
  -webkit-mask: radial-gradient(circle, #000 60%, transparent 70%); mask: radial-gradient(circle, #000 60%, transparent 70%); }
.s-igem { inset: 8% 4%; clip-path: polygon(20% 8%, 80% 8%, 100% 36%, 50% 100%, 0 36%); animation: mvFlip 6s ease-in-out var(--d) infinite;
  background: conic-gradient(from 180deg at 50% 36%, #f472b6, #facc15, #4ade80, #22d3ee, #a78bfa, #f472b6); }
.s-ihalo { inset: 4%; border-radius: 50%; animation: pPulse 2.4s ease-in-out var(--d) infinite;
  background: radial-gradient(circle, transparent 46%, var(--pl) 48% 52%, transparent 54% 62%, var(--pc) 64% 70%, transparent 72%); filter: drop-shadow(0 0 .12em var(--pc)); }
.s-irainbow { background: repeating-conic-gradient(#f472b6aa 0 6deg, #facc15aa 6deg 12deg, #4ade80aa 12deg 18deg, #22d3eeaa 18deg 24deg, #a78bfaaa 24deg 30deg, transparent 30deg 40deg);
  animation: pSpin 4s linear var(--d) infinite; }

/* ---------- extra symbol idle moves ---------- */
.mv-float { animation-name: mvFloat; animation-timing-function: ease-in-out; animation-duration: 3.4s; }
.mv-pulse { animation-name: mvPulse; animation-timing-function: ease-in-out; }
.mv-spin  { animation-name: mvSpin;  animation-timing-function: ease-in-out; }
@keyframes mvFloat { 0%, 100% { transform: translateY(4%) rotate(-3deg); } 50% { transform: translateY(-6%) rotate(3deg); } }
@keyframes mvPulse { 0%, 70%, 100% { transform: scale(1); } 78% { transform: scale(1.22); } 86% { transform: scale(.95); } 92% { transform: scale(1.06); } }
@keyframes mvSpin  { 0%, 72% { transform: rotate(0); } 92%, 100% { transform: rotate(360deg); } }