/* Dragon Pearl Link: wins, Pearl Respin board, banners, info sheet, guide. */
/* winning symbols pop, glow and catch a light sweep; the rest dim */
.dpl-win{z-index:2;animation:dpl-pop .45s cubic-bezier(.2,1.6,.4,1),dpl-pulse .75s .45s ease-in-out infinite alternate}
.dpl-win img{filter:brightness(1.12) saturate(1.1)}
.dpl-win.dpl-sym--hi::before{box-shadow:0 0 0 2px #fff3b0,0 0 0 3.5px #8a5200,0 0 18px 5px #ffc93a}
.dpl-win:not(.dpl-sym--hi) img{box-shadow:0 0 0 2px #fff3b0,0 0 16px 4px #ffc93a}
.dpl-win .dpl-low{filter:drop-shadow(0 0 7px #ffd84a) drop-shadow(0 2px 0 #000)}
.dpl-win::after{content:"";position:absolute;inset:5%;border-radius:12px;pointer-events:none;z-index:1;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 62%) -150% 0/250% 100% no-repeat;
  animation:dpl-sweep 1.3s ease-in-out infinite}
@keyframes dpl-sweep{to{background-position:150% 0}}
@keyframes dpl-pop{0%{transform:scale(1)}50%{transform:scale(1.2)}100%{transform:scale(1.04)}}
@keyframes dpl-pulse{from{transform:scale(1.04)}to{transform:scale(1.1)}}
.dpl-sym--DR.dpl-win img{animation:dpl-roar .6s ease-in-out infinite alternate}
@keyframes dpl-roar{to{filter:brightness(1.3) saturate(1.2) drop-shadow(0 0 6px #ffcf4a)}}
.dpl-dim{opacity:.34;filter:saturate(.45) brightness(.8)}
.dpl-glow img{animation:dpl-pearlglow .9s ease-in-out infinite alternate}
@keyframes dpl-pearlglow{from{box-shadow:0 0 8px 2px rgba(150,240,255,.6)}to{box-shadow:0 0 20px 7px rgba(190,250,255,.95)}}
.dpl-glow-sc::before{box-shadow:0 0 0 2px #ffd86b,0 0 16px 5px #ff7a1a!important}
.dpl-landfx{animation:dpl-landpop .4s cubic-bezier(.2,1.8,.4,1)}
@keyframes dpl-landpop{0%{transform:scale(.8)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
/* line paths: a soft wide glow under a bright core that flows along the line */
#dpl-lines .dpl-lglow{fill:none;stroke-width:12;opacity:.3;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round;
  animation:dpl-lpulse .7s ease-in-out infinite alternate}
@keyframes dpl-lpulse{to{opacity:.6}}
#dpl-lines .dpl-lcore{fill:none;stroke-width:4;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round;
  filter:drop-shadow(0 0 3px rgba(0,0,0,.9))}
.dpl-badge{position:absolute;right:2%;bottom:4%;z-index:3;padding:2px 6px;border-radius:6px;
  font:800 clamp(.62rem,2.9vw,.9rem)/1.1 'JetBrains Mono',monospace;color:#3b1600;
  background:linear-gradient(180deg,#fff6c8,#ffcc33 60%,#d18a00);box-shadow:0 0 0 1px #6b3a00,0 2px 6px rgba(0,0,0,.6);animation:dpl-pop .35s ease-out}

/* free games look */
.dpl-stage--free{box-shadow:inset 0 0 0 2px #7ad9ff,inset 0 0 26px rgba(0,60,120,.8)}
.dpl-stage--free .dpl-reel{background:linear-gradient(90deg,rgba(0,10,40,.6),rgba(0,40,90,.3) 50%,rgba(0,10,40,.6))}

/* Pearl Respin board */
.dpl-stage--respin{background:radial-gradient(ellipse at 50% 40%,#7a0d0a 0%,#3d0202 60%,#160000 100%);
  box-shadow:inset 0 0 0 2px #ffcf55,inset 0 0 30px rgba(255,170,0,.35)}
.dpl-stage--respin .dpl-board{visibility:hidden}
.dpl-rgrid{position:absolute;inset:var(--pad);display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,1fr);
  grid-auto-flow:column;gap:3px;z-index:4}
.dpl-rgrid[hidden]{display:none}
.dpl-rcell{position:relative;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 40%,#5a0a08,#240101 75%);box-shadow:inset 0 0 0 1px rgba(255,200,90,.45),inset 0 0 12px #000}
.dpl-rcell .dpl-sym{width:100%;height:100%;aspect-ratio:auto}
.dpl-rcell--lock{background:radial-gradient(circle at 50% 45%,#2a5d72,#071822 75%);box-shadow:inset 0 0 0 2px #ffd86b,0 0 8px rgba(255,210,90,.6)}
.dpl-rcell--lock img{animation:dpl-pearlglow 1.1s ease-in-out infinite alternate}
.dpl-rcell--spin::before{content:"";position:absolute;inset:-100% 0;
  background:repeating-linear-gradient(180deg,transparent 0 22%,rgba(255,215,120,.22) 26%,rgba(190,240,255,.35) 30%,transparent 34% 50%);
  animation:dpl-cellspin .16s linear infinite;filter:blur(1.5px)}
@keyframes dpl-cellspin{to{transform:translateY(50%)}}
.dpl-rcell--land{animation:dpl-land .7s ease-out}
@keyframes dpl-land{0%{transform:scale(1.35);box-shadow:0 0 30px 12px #fff}60%{transform:scale(.96)}100%{transform:scale(1)}}
.dpl-rcell--collect{z-index:2;animation:dpl-collect .22s ease-out;box-shadow:inset 0 0 0 3px #fff,0 0 22px 8px #ffd23f}
@keyframes dpl-collect{50%{transform:scale(1.12)}}
.dpl-rcell--done{filter:brightness(.55) saturate(.7)}
.dpl-rhud{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:6;display:flex;align-items:center;gap:6px;
  padding:5px 10px;border-radius:999px;background:rgba(20,0,0,.82);border:2px solid #ffcf55;box-shadow:0 0 14px rgba(255,190,60,.6);
  font:800 .66rem/1 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;color:#ffe7a0;white-space:nowrap;pointer-events:none}
.dpl-rhud[hidden]{display:none}
.dpl-rhud b{font:700 1rem/1 'JetBrains Mono',monospace;color:#fff;text-shadow:0 0 6px #ffb300}
.dpl-dots{display:flex;gap:4px}
.dpl-dots i{width:11px;height:11px;border-radius:50%;background:#3a1a1a;box-shadow:inset 0 0 0 1px #6b3a2a}
.dpl-dots i.on{background:radial-gradient(circle at 35% 35%,#fff,#ffd23f 45%,#d97a00);box-shadow:0 0 6px #ffcc33}
.dpl-rfill,.dpl-rtot{color:#bfe9ff}.dpl-rtot b{font-size:.8rem}
.dpl-stage--respin{padding-bottom:40px}
.dpl-stage--respin .dpl-rgrid{bottom:40px}
.dpl-stage--respin .dpl-rhud{top:auto;bottom:6px;transform:translate(-50%,0)}
.dpl-flash{animation:dpl-hudflash .5s ease-out 2}
@keyframes dpl-hudflash{0%{background:#fff3b0;color:#3b1600;box-shadow:0 0 30px 10px #ffd23f}100%{background:rgba(20,0,0,.82)}}

/* banners */
.dpl-banner{position:absolute;inset:0;z-index:7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:radial-gradient(ellipse at center,rgba(40,0,0,.42),rgba(0,0,0,.66));pointer-events:none;text-align:center;padding:10px}
.dpl-banner[hidden]{display:none}
.dpl-banner-t{font:900 2.2rem/1 Georgia,'Times New Roman',serif;letter-spacing:.04em;
  background:linear-gradient(180deg,#fffbe6,#ffd24a 45%,#c27a00 60%,#fff0a8);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 #4a0f00) drop-shadow(0 0 14px rgba(255,170,30,.8));animation:dpl-zoom .5s cubic-bezier(.2,1.6,.4,1)}
.dpl-banner-s{font:800 1.25rem/1.1 'JetBrains Mono',monospace;color:#fff;text-shadow:0 0 10px #ffb300,0 2px 0 #000}
@keyframes dpl-zoom{from{transform:scale(.2);opacity:0}}
.dpl-banner--t2 .dpl-banner-t{font-size:2.5rem}.dpl-banner--t3 .dpl-banner-t{font-size:2.8rem;animation:dpl-zoom .5s cubic-bezier(.2,1.6,.4,1),dpl-wobble 1.2s .5s ease-in-out infinite}
@keyframes dpl-wobble{50%{transform:scale(1.08) rotate(-2deg)}}
.dpl-banner--feature .dpl-banner-t{font-size:1.9rem}
.dpl-banner--feature .dpl-banner-s{font:700 .9rem/1.3 'Plus Jakarta Sans',sans-serif}
.dpl-banner--jp .dpl-banner-t{font-size:2.9rem}
.dpl-banner--mini .dpl-banner-t{background-image:linear-gradient(180deg,#e9fff0,#5fe08a 50%,#137a3a)}
.dpl-banner--minor .dpl-banner-t{background-image:linear-gradient(180deg,#eaf6ff,#55b8ff 50%,#0f4f8a)}
.dpl-banner--major .dpl-banner-t{background-image:linear-gradient(180deg,#fbeaff,#d48bff 50%,#6a1a8f)}
.dpl-banner--grand .dpl-banner-t{font-size:3.3rem;background-image:linear-gradient(180deg,#fff,#ff6b6b 40%,#b30000 60%,#ffd0d0)}
.dpl--grand{animation:dpl-grand .3s steps(2) infinite}
@keyframes dpl-grand{50%{box-shadow:0 0 0 2px #fff,0 0 0 5px #ff2a2a,0 0 0 7px #ffe66b,0 0 40px 14px #ffcc00}}

/* info sheet */
.dpl-info{max-width:min(94vw,460px);max-height:86vh;margin:auto;border:0;border-radius:16px;padding:1rem 1rem 1.2rem;
  background:#1d0303;color:#fbe9c6;box-shadow:0 0 0 3px #c9963a,0 20px 50px rgba(0,0,0,.6)}
.dpl-info::backdrop{background:rgba(10,0,0,.7)}
.dpl-info h2{font:900 1.3rem/1.2 Georgia,serif;color:#ffd667;margin-bottom:.4rem}
.dpl-info p{font-size:.82rem;line-height:1.45;margin:.5rem 0}
#dpl-info p,#dpl-info strong,#dpl-info td,#dpl-info th{color:#fbe9c6}
#dpl-info thead th{color:#d8b25a}
.dpl-pay{width:100%;border-collapse:collapse;font-size:.85rem}
.dpl-pay th,.dpl-pay td{padding:3px 4px;border-bottom:1px solid #4a1c10;text-align:right;font-family:'JetBrains Mono',monospace}
.dpl-pay th[scope=row]{text-align:left;display:flex;align-items:center;gap:8px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700}
.dpl-pay img{border-radius:6px}
.dpl-pay thead th{color:#d8b25a;font-size:.7rem}
.dpl-info .btn{width:100%;margin-top:.5rem}

/* guide */
.dpl-guide{max-width:640px;margin:1.5rem auto 0;padding:0 1rem;line-height:1.6;font-size:.95rem}
.dpl-guide h2{font-size:1.15rem;margin:1.2rem 0 .4rem}
.dpl-guide ul{padding-left:1.2rem}.dpl-guide li{margin:.35rem 0}
.dpl-guide a{color:#7F1D1D;font-weight:700}

@media (prefers-reduced-motion:reduce){
  .dpl-win,.dpl-win::after,.dpl-win img,.dpl-landfx,.dpl-badge,#dpl-lines .dpl-lglow,.dpl-glow img,.dpl-rcell--lock img,.dpl-reel--tease,.dpl--grand,.dpl-jpbox--hit,.dpl-banner-t,.dpl-rcell--land,.dpl-rcell--collect,.dpl-flash{animation:none!important}
  .dpl-rcell--spin::before{animation:none;filter:none}
}