.block-piece-grid{

  display:grid;

  gap:4px;
}

.block-mini{

  width:30px;
  height:30px;

  border-radius:5px;
}

.skin-barrel{

  background:#8b5a2b;
}

.skin-crate{

  background:#b57f3a;
}

.skin-anchor{

  background:#7d8ea3;
}

.skin-wheel{

  background:#c77c2f;
}

.skin-map{

  background:#d8c58a;
}

.skin-coin{

  background:#f3c63a;
}

.block-actions button:active{

  transform:
    translateY(2px)
    scale(.98);
}

.block-cell.place-bounce{

  animation:
    blockPlaceBounce 220ms ease-out;
}

@keyframes blockPlaceBounce{

  0%{
    transform:scale(.72);
  }

  45%{
    transform:scale(1.14);
  }

  70%{
    transform:scale(.94);
  }

  100%{
    transform:scale(.98);
  }
}

.block-board.board-shake{

  animation:
    blockBoardShake 140ms ease-out;
}

@keyframes blockBoardShake{

  0%{
    transform:translateX(0);
  }

  25%{
    transform:translateX(-3px);
  }

  50%{
    transform:translateX(3px);
  }

  75%{
    transform:translateX(-2px);
  }

  100%{
    transform:translateX(0);
  }
}

.block-combo-text{

  position:fixed;

  left:50%;
  top:44%;

  transform:
    translate(-50%,-50%)
    scale(.72);

  z-index:50;

  pointer-events:none;

  font-size:42px;
  font-weight:1000;

  color:#fff2a8;

  text-shadow:
    0 3px 0 #5d2608,
    0 0 16px rgba(255,215,90,.95),
    0 0 28px rgba(255,140,40,.75);

  animation:
    blockComboTextPop 680ms ease-out forwards;
}

@keyframes blockComboTextPop{

  0%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(.55);
  }

  22%{
    opacity:1;
    transform:
      translate(-50%,-64%)
      scale(1.12);
  }

  68%{
    opacity:1;
    transform:
      translate(-50%,-76%)
      scale(1);
  }

  100%{
    opacity:0;
    transform:
      translate(-50%,-96%)
      scale(.86);
  }
}

.block-win-coin{

    position:fixed;

    width:50px;
    height:50px;

  pointer-events:none;

    z-index:90;
    will-change:transform, opacity;
    contain:layout paint;

    animation:
    blockWinCoinFly 860ms cubic-bezier(.16,.78,.22,1) forwards;
}

.block-win-coin img{

  width:100%;
  height:100%;

  object-fit:contain;

  filter:
    drop-shadow(
      0 4px 7px rgba(55,24,6,.38)
    );
}

@keyframes blockWinCoinFly{

  0%{
      opacity:0;
      transform:
        translate3d(0,0,0)
        scale(.35)
        rotate(0deg);
    }
  
    18%{
      opacity:1;
      transform:
        translate(
          calc(var(--dx) * .25),
          calc(var(--dy) * .25)
        )
        scale(1.55)
        rotate(90deg);
    }

    58%{
      opacity:1;
      transform:
        translate(
          calc(var(--dx) * .72),
          calc(var(--dy) * .72)
        )
        scale(1.05)
        rotate(320deg);
    }
  
    100%{
      opacity:0;
    transform:
      translate(
        var(--dx),
        var(--dy)
      )
      scale(.5)
      rotate(540deg);
  }
}

.block-goal-row{

  display:block;

  line-height:1.05;
}

.block-goal-card strong{

  margin-top:2px;
}

.block-piece:nth-child(2){

  animation-delay:
    .45s;
}

.block-piece:nth-child(3){

  animation-delay:
    .9s;
}

@keyframes blockPieceFloat{

  0%{
    transform:
      translateY(0px);
  }

  50%{
    transform:
      translateY(-4px);
  }

  100%{
    transform:
      translateY(0px);
  }
}

.block-cell.near-complete{

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(255,230,120,.34),
      rgba(255,190,70,.16) 52%,
      rgba(255,255,255,.06) 100%
    );

  box-shadow:
    inset 0 0 10px rgba(255,220,120,.38),
    0 0 10px rgba(255,190,70,.32);

  animation:
    blockNearCompletePulse 1100ms ease-in-out infinite;
}

@keyframes blockNearCompletePulse{

  0%{
    filter:brightness(1);
  }

  50%{
    filter:brightness(1.28);
  }

  100%{
    filter:brightness(1);
  }
}

.block-spark{
  position:absolute;
  width:8px;
  height:8px;
  border-radius:50%;
  pointer-events:none;
  z-index:60;
  background:radial-gradient(
      circle,
      #fff7b0,
      #ffd45e 60%,
      #ff9c2a
    );
  box-shadow:0 0 10px rgba(255,220,90,.95),
    0 0 18px rgba(255,170,40,.65);
  animation:blockSparkFly 500ms ease-out forwards;
}

@keyframes blockSparkFly{

  from{

    opacity:1;

    transform:
      translate(0,0)
      scale(1);
  }

  to{

    opacity:0;

    transform:
      translate(
        var(--dx),
        var(--dy)
      )
      scale(.2);
  }
}

.block-particles{
  position:absolute;
  inset:0;
  pointer-events:none;
  overflow:visible;
  z-index:20;
}

.block-goal-scroll span{

  color:#120702;

  text-shadow:
    1px 0 #ffca58,
   -1px 0 #ffca58,
    0 1px #ffca58,
    0 -1px #ffca58,
    0 0 8px rgba(255,198,70,.72);
}

.block-goal-scroll .block-digit-separator{

  color:#fff6b0;

  text-shadow:
    0 0 6px rgba(255,255,255,.75),
    0 0 10px rgba(255,170,50,.70);
}

@keyframes blockSelectedPulse{

  0%{
    filter:
      brightness(1);
  }

  50%{
    filter:
      brightness(1.28);
  }

  100%{
    filter:
      brightness(1);
  }
}

.goal-pulse{

  animation:
    blockGoalPulse 420ms ease-out;
}

@keyframes blockGoalPulse{

  0%{
    transform:scale(1);
    filter:brightness(1);
  }

  35%{
    transform:scale(1.12);
    filter:brightness(1.55);
  }

  100%{
    transform:scale(1);
    filter:brightness(1);
  }
}

.block-digit-img{
  width:20px;
  height:28px;
  object-fit:contain;
  vertical-align:middle;
  filter:drop-shadow(0 2px 0 rgba(35,10,0,.95))
    drop-shadow(1px 0 0 rgba(35,10,0,.78))
    drop-shadow(-1px 0 0 rgba(35,10,0,.78))
    drop-shadow(0 0 5px rgba(255,236,120,.58))
    drop-shadow(0 0 10px rgba(255,112,45,.28));
}

.block-digit-separator{
  display:inline-block;
  margin:0 2px;
  font-size:18px;
  font-weight:900;
  color:#fff2a5;
  text-shadow:0 2px 0 rgba(42,14,0,.92),
    0 0 6px rgba(255,220,90,.75);
}

.block-goal-scroll .block-digit-img{
  filter:drop-shadow(0 2px 0 rgba(35,10,0,.95))
    drop-shadow(1px 0 0 rgba(35,10,0,.72))
    drop-shadow(-1px 0 0 rgba(35,10,0,.72))
    drop-shadow(0 0 5px rgba(255,236,120,.72))
    drop-shadow(0 0 10px rgba(255,112,45,.34));
}

@media (max-height:760px){
.block-board{
    width:min(94vw,456px);
    --block-board-pad:5px;
    gap:2px;
    padding:5px;
  }
}

.block-hud-card,
.block-goal-scroll{
  min-height:45px;
  padding:1px 5px 0;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none;
  border-radius:0;
  position:relative;
  overflow:hidden;
}

.block-hud-card + .block-hud-card::before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  bottom:9px;
  width:1px;
  background:linear-gradient(
    180deg,
    transparent,
    rgba(255,219,126,.42),
    transparent
  );
}

.block-hud-card span,
.block-goal-scroll span{
  color:#ffe9a3 !important;
  font-size:8px;
  line-height:1;
  margin-bottom:0;
  letter-spacing:.35px;
  text-shadow:
    0 1px 1px rgba(55,22,6,.58) !important;
}

.block-hud-card strong{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  margin-top:0;
  min-height:25px;
  filter:drop-shadow(0 1px 1px rgba(48,18,4,.34));
  color:#ffe9a3 !important;
  text-shadow:0 1px 1px rgba(48,18,4,.34) !important;
}

.block-hud .block-goal-row{
  color:#ffe9a3 !important;
}

.block-goal-card{
  min-width:124px;
}

.block-hud .block-digit-img,
.block-goal-scroll .block-digit-img{
  max-height:23px;
  filter:
    drop-shadow(0 1px 1px rgba(48,18,4,.34)) !important;
}

.block-hud .block-digit-separator,
.block-goal-scroll .block-digit-separator{
  color:#ffe9a3;
  text-shadow:
    0 1px 1px rgba(48,18,4,.34) !important;
}

.block-cell{
  appearance:none;
  border:0;
  padding:0;
  border-radius:7px;
  background:
    linear-gradient(
      180deg,
      rgba(190,239,250,.42) 0%,
      rgba(79,174,210,.32) 55%,
      rgba(20,100,146,.27) 100%
    );
  box-shadow:
    inset 0 2px 0 rgba(236,252,255,.38),
    inset 0 -2px 0 rgba(4,67,106,.18),
    0 2px 5px rgba(0,39,76,.16),
    0 0 0 1px rgba(196,241,252,.18);
  backdrop-filter:blur(1.4px) saturate(1.08);
  cursor:pointer;
  display:grid;
  place-items:center;
  overflow:hidden;
  transform:none;
  animation:none;
}

.block-cell.filled{
  background:transparent !important;
  box-shadow:none !important;
  transform:none;
}

.block-screen.dragging .block-pieces,
.block-screen.dragging .block-piece,
.block-screen.dragging .block-piece.selected{
  animation:none;
}

.block-piece.selected{
  transform:translateY(-6px)
    scale(1.06);
  border:2px solid #ffd978;
  box-shadow:0 0 10px rgba(255,218,116,.45),
    inset 0 1px 0 rgba(255,244,196,.16),
    inset 0 -2px 0 rgba(55,24,8,.26),
    0 6px 13px rgba(36,16,6,.24);
  animation:blockSelectedPulse 900ms ease-in-out infinite;
  border-color:#ffe08a;
}

.block-piece .block-mini{
  overflow:visible;
  background:transparent !important;
}

.block-piece .block-mini-img{
  width:100%;
  height:100%;
  margin:0;
  transform:none;
  filter:
    drop-shadow(0 1px 1px rgba(42,18,5,.28));
}

.block-mini-panel{
  min-height:36px;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:1fr;
  justify-items:center;
  align-items:center;
  padding:2px 5px;
  border:1px solid rgba(255,219,128,.42);
  border-radius:11px;
  background:
    radial-gradient(
      circle at 50% 12%,
      rgba(255,235,154,.18),
      rgba(143,87,39,.22) 52%,
      rgba(60,35,20,.18) 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,244,190,.16),
    inset 0 -2px 0 rgba(58,28,11,.18),
    0 3px 8px rgba(42,22,10,.16),
    0 0 10px rgba(255,194,70,.08);
  backdrop-filter:blur(2px);
}

button.block-mini-panel{
  appearance:none;
  font:inherit;
  color:inherit;
  cursor:pointer;
}

.block-mini-label{
  display:none;
  align-self:end;
  color:#2b1104;
  font-size:8px;
  font-weight:1000;
  line-height:1;
  text-shadow:
    1px 0 #ffd463,
   -1px 0 #ffd463,
    0 1px #ffd463,
    0 -1px #ffd463,
    0 0 7px rgba(255,224,122,.68);
}

.block-mini-value{
  align-self:center;
  display:flex;
  gap:0;
  min-height:16px;
}

.block-mini-value .block-digit-img{
  width:15px;
  height:21px;
}

.block-mini-value .block-digit-separator{
  font-size:14px;
  margin:0 1px;
}

.block-stars-panel{
  grid-template-columns:25px minmax(25px,max-content) 24px minmax(34px,max-content);
  column-gap:1px;
  justify-content:center;
  align-items:center;
  padding-inline:3px;
}

.block-stars-panel .block-mini-icon{
  grid-column:1;
  justify-self:end;
}

.block-stars-panel .block-stars-value{
  grid-column:2;
  justify-self:start;
  margin-left:-2px;
}

.block-coin-icon{
  grid-column:3;
  justify-self:end;
}

.block-stars-panel .block-coins-value{
  grid-column:4;
  justify-self:start;
  margin-left:-2px;
}

.block-mini-icon{
  grid-row:auto;
  width:26px;
  height:26px;
  object-fit:contain;
  filter:
    drop-shadow(0 2px 2px rgba(38,15,4,.58))
    drop-shadow(0 0 8px rgba(255,224,95,.56));
}

.block-board-prize-panel{
  position:relative;
  min-height:42px;
  padding:1px 3px;
  overflow:hidden;
}

.block-board-prize-icon{
  width:34px;
  height:34px;
  object-fit:contain;
  opacity:.86;
  filter:
    drop-shadow(0 2px 2px rgba(38,15,4,.42))
    drop-shadow(0 0 8px rgba(255,224,95,.28));
}

.block-board-prize-count{
  position:absolute;
  right:3px;
  bottom:2px;
  min-width:22px;
  padding:1px 3px;
  border-radius:7px;
  color:#ffeaa6;
  font-size:10px;
  font-weight:900;
  line-height:1;
  text-align:center;
  background:rgba(53,25,8,.78);
  border:1px solid rgba(255,219,128,.36);
  text-shadow:0 1px 1px rgba(35,12,3,.76);
}

.block-board-prize-panel.is-catching-prize{
  animation:blockPrizeCatch 280ms ease-out;
}

.block-board-prize-flight{
  position:fixed;
  z-index:260;
  width:40px;
  height:40px;
  margin:-20px 0 0 -20px;
  object-fit:contain;
  pointer-events:none;
  filter:
    drop-shadow(0 5px 7px rgba(32,13,4,.54))
    drop-shadow(0 0 14px rgba(255,221,100,.78))
    drop-shadow(0 0 22px rgba(255,126,40,.36));
  animation:blockPrizeToHud 1450ms cubic-bezier(.16,.84,.22,1) forwards;
}

@keyframes blockPrizeToHud{
  0%{
    opacity:0;
    transform:
      translate(0,0)
      scale(.55)
      rotate(-16deg);
  }

  16%{
    opacity:1;
    transform:
      translate(0,-16px)
      scale(var(--big-scale,3))
      rotate(4deg);
  }

  42%{
    opacity:1;
    transform:
      translate(0,-18px)
      scale(calc(var(--big-scale,3) * .92))
      rotate(-5deg);
  }

  68%{
    opacity:1;
    transform:
      translate(
        calc(var(--dx) * .58),
        calc(var(--dy) * .45 - 34px)
      )
      scale(1.12)
      rotate(10deg);
  }

  100%{
    opacity:0;
    transform:
      translate(var(--dx),var(--dy))
      scale(.42)
      rotate(24deg);
  }
}

@keyframes blockPrizeCatch{
  0%,100%{
    transform:scale(1);
  }
  45%{
    transform:scale(1.12);
  }
}

.block-board-prize-overlay{
  position:fixed;
  inset:0;
  z-index:220;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(18,9,4,.72);
  backdrop-filter:blur(3px);
}

.block-board-prize-box{
  position:relative;
  width:min(92vw,390px);
  max-height:82dvh;
  display:grid;
  grid-template-rows:auto 1fr;
  gap:10px;
  padding:14px;
  border:1px solid rgba(255,219,128,.70);
  border-radius:16px;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(255,222,134,.20),
      rgba(98,55,25,.96) 42%,
      rgba(33,19,12,.98) 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,245,190,.18),
    0 16px 34px rgba(20,8,3,.48),
    0 0 22px rgba(255,191,72,.18);
}

.block-board-prize-close{
  position:absolute;
  top:8px;
  right:8px;
  width:30px;
  height:30px;
  border:1px solid rgba(255,219,128,.56);
  border-radius:8px;
  color:#ffeaa6;
  font-weight:900;
  background:rgba(64,27,10,.84);
  cursor:pointer;
}

.block-board-prize-head{
  display:grid;
  grid-template-columns:44px 1fr auto;
  align-items:center;
  gap:8px;
  padding-right:34px;
  color:#ffeaa6;
  font-weight:900;
  text-shadow:0 2px 2px rgba(45,16,5,.72);
}

.block-board-prize-head img{
  width:42px;
  height:42px;
  object-fit:contain;
}

.block-board-prize-head span{
  font-size:18px;
}

.block-board-prize-grid{
  overflow:auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding:2px;
}

.block-board-prize-item{
  min-height:70px;
  display:grid;
  place-items:center;
  position:relative;
  border:1px solid rgba(255,219,128,.34);
  border-radius:10px;
  background:rgba(54,29,14,.58);
}

.block-board-prize-item img{
  width:48px;
  height:48px;
  object-fit:contain;
  filter:drop-shadow(0 3px 4px rgba(27,10,3,.44));
}

.block-board-prize-item.locked img{
  opacity:.26;
  filter:grayscale(1) brightness(.72);
}

.block-board-prize-item strong{
  position:absolute;
  right:4px;
  bottom:4px;
  min-width:25px;
  padding:1px 4px;
  border-radius:7px;
  color:#ffeaa6;
  font-size:11px;
  background:rgba(40,16,5,.82);
  border:1px solid rgba(255,219,128,.34);
}

.block-avatar-panel{
  grid-template-columns:1fr;
  min-height:42px;
  padding:1px 3px;
}

.block-avatar-img{
  grid-column:auto;
  grid-row:auto;
  width:42px;
  height:42px;
  object-fit:cover;
  border-radius:50%;
  border:1px solid rgba(255,225,132,.62);
  background:rgba(92,50,20,.32);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 3px 7px rgba(37,16,5,.30),
    0 0 12px rgba(255,202,80,.18);
}

.block-restart-panel{
  grid-template-columns:1fr;
  cursor:pointer;
  min-height:42px;
  padding:1px 3px;
}

.block-restart-panel:active{
  transform:translateY(2px) scale(.98);
}

.block-restart-icon{
  grid-row:auto;
  width:43px;
  height:43px;
  object-fit:contain;
  filter:
    drop-shadow(0 2px 2px rgba(38,15,4,.58))
    drop-shadow(0 0 8px rgba(255,224,95,.56));
}

.block-cell-img{
  width:112%;
  height:112%;
  margin:-6%;
  transform:
    translateY(-1px);
}

.block-mini-img{
  width:108%;
  height:108%;
  display:block;
  object-fit:contain;
  pointer-events:none;
  filter:drop-shadow(
      0 3px 5px rgba(0,0,0,.35)
    );
  margin:-4%;
}

.block-cell.preview-valid{
  background:
    linear-gradient(
      180deg,
      #b9854d 0%,
      #996235 55%,
      #70421f 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,232,164,.18),
    inset 0 -2px 0 rgba(63,29,11,.22),
    0 0 0 1px rgba(255,222,124,.26);
}

.block-cell.preview-invalid{
  background:
    linear-gradient(
      180deg,
      #9b4b36 0%,
      #753121 58%,
      #4b1d14 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,188,152,.16),
    inset 0 -2px 0 rgba(58,16,8,.28),
    0 0 0 1px rgba(255,88,62,.30);
}

.block-cell .block-preview-img{
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  transform:none !important;
  opacity:.92;
  filter:
    drop-shadow(0 1px 1px rgba(44,18,5,.24)) !important;
}

.block-cell.filled .block-cell-img{
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  transform:none !important;
  opacity:1;
  filter:none !important;
}

.block-cell.iced{
  position:relative;
}

.block-ice-layer{
  position:absolute;
  inset:-4%;
  z-index:3;
  width:108%;
  height:108%;
  object-fit:cover;
  pointer-events:none;
  opacity:.72;
  mix-blend-mode:screen;
  filter:
    saturate(1.35)
    brightness(1.12)
    drop-shadow(0 0 5px rgba(166,236,255,.40));
}

.block-ice-layer.ice-life-1{
  opacity:.86;
  filter:
    saturate(1.55)
    contrast(1.18)
    brightness(1.18)
    drop-shadow(0 0 7px rgba(232,252,255,.62));
  clip-path:polygon(
    0 0,
    100% 0,
    100% 100%,
    58% 100%,
    50% 62%,
    40% 100%,
    0 100%
  );
}

.block-cell.clearing .block-ice-layer{
  animation:blockIceHit 360ms ease-out both;
}

@keyframes blockIceHit{
  0%{
    transform:scale(1);
    filter:
      saturate(1.25)
      brightness(1.08)
      drop-shadow(0 0 4px rgba(166,236,255,.34));
  }

  45%{
    transform:scale(1.08) rotate(-2deg);
    filter:
      saturate(1.85)
      brightness(1.45)
      drop-shadow(0 0 12px rgba(232,252,255,.86));
  }

  100%{
    transform:scale(1);
  }
}

.block-bomb-layer{
  position:absolute;
  inset:var(--block-board-pad);
  z-index:7;
  display:grid;
  grid-template-columns:repeat(10,1fr);
  grid-template-rows:repeat(10,1fr);
  gap:var(--block-board-gap);
  pointer-events:none;
}

.block-bomb-overlay{
  position:relative;
  z-index:1;
  pointer-events:none;
  display:grid;
  place-items:center;
  align-self:stretch;
  justify-self:stretch;
  border-radius:16px;
  overflow:visible;
  animation:blockBombEnter 180ms ease-out both;
}

.block-bomb-overlay::before{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:18px;
  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(220,250,255,.28),
      rgba(42,158,255,.20) 35%,
      rgba(0,72,180,.08) 58%,
      transparent 74%
    );
  filter:none;
  animation:none;
}

.block-bomb-overlay.size-4::before{
  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(255,242,178,.30),
      rgba(255,61,38,.23) 36%,
      rgba(160,0,0,.09) 60%,
      transparent 76%
    );
}

.block-bomb-overlay::after{
  content:"";
  position:absolute;
  inset:5%;
  border-radius:18px;
  border:2px solid rgba(109,220,255,.34);
  box-shadow:
    inset 0 0 18px rgba(73,198,255,.18),
    0 0 18px rgba(59,187,255,.25);
  animation:none;
}

.block-bomb-overlay.size-4::after{
  border-color:rgba(255,86,60,.40);
  box-shadow:
    inset 0 0 20px rgba(255,76,45,.20),
    0 0 20px rgba(255,69,45,.30);
}

.block-bomb-img{
  position:relative;
  z-index:1;
  width:72%;
  height:72%;
  opacity:.82;
  object-fit:contain;
  filter:
    drop-shadow(0 5px 8px rgba(18,8,4,.42))
    saturate(1.35)
    brightness(1.08);
}

.block-bomb-overlay.size-4 .block-bomb-img{
  filter:
    drop-shadow(0 5px 8px rgba(18,8,4,.42))
    saturate(1.35)
    brightness(1.08);
}

.block-bomb-count{
  position:absolute;
  z-index:2;
  width:38%;
  height:38%;
  object-fit:contain;
  filter:
    drop-shadow(0 2px 0 rgba(45,12,0,.82));
  animation:blockBombCountPop 620ms ease-in-out both;
}

.block-bomb-overlay.exploding{
  animation:blockBombExplode 360ms ease-out both;
}

.block-bomb-burst{
  position:absolute;
  width:150px;
  height:150px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  display:grid;
  place-items:center;
  z-index:25;
  animation:blockBombBurst 820ms cubic-bezier(.11,.76,.18,1) forwards;
}

.block-bomb-burst.size-3{
  width:150px;
  height:150px;
}

.block-bomb-burst.size-4{
  width:202px;
  height:202px;
}

.block-blast-flash{
  position:absolute;
  width:168px;
  height:168px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
  z-index:24;
  mix-blend-mode:screen;
  animation:blockBlastFlash 680ms ease-out forwards;
}

.block-blast-flash.size-3{
  background:
    radial-gradient(
      circle,
      rgba(255,255,255,1) 0%,
      rgba(126,238,255,.92) 18%,
      rgba(35,145,255,.68) 42%,
      rgba(12,74,205,.28) 66%,
      transparent 82%
    );
  box-shadow:
    0 0 26px rgba(95,224,255,.84),
    0 0 54px rgba(33,126,255,.42);
}

.block-blast-flash.size-4{
  width:196px;
  height:196px;
  background:
    radial-gradient(
      circle,
      rgba(255,255,255,1) 0%,
      rgba(255,147,110,.94) 18%,
      rgba(255,32,62,.72) 43%,
      rgba(165,0,34,.32) 66%,
      transparent 82%
    );
  box-shadow:
    0 0 28px rgba(255,106,78,.88),
    0 0 58px rgba(255,28,58,.46);
}

.block-bomb-burst img{
  width:152%;
  height:152%;
  object-fit:contain;
  filter:
    saturate(1.35)
    brightness(1.18)
    contrast(1.08)
    drop-shadow(0 0 18px rgba(255,184,58,.92));
}

.block-bomb-burst.size-4 img{
  filter:
    saturate(1.5)
    brightness(1.22)
    contrast(1.1)
    drop-shadow(0 0 22px rgba(255,72,38,.94));
}

.block-bomb-spark{
  background:
    radial-gradient(circle,#fff8a8 0%,#47c6ff 38%,#006fd6 100%);
  box-shadow:
    0 0 10px rgba(70,198,255,.78);
}

.block-cell.bomb-armed{
  position:relative;
  background:
    radial-gradient(
      circle at 50% 26%,
      rgba(255,255,210,.86) 0%,
      rgba(255,225,92,.78) 34%,
      rgba(218,142,28,.72) 68%,
      rgba(121,65,18,.70) 100%
    ) !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,230,.58),
    inset 0 -5px 9px rgba(112,55,8,.38),
    0 0 0 1px rgba(255,246,170,.50),
    0 0 10px rgba(255,218,73,.74),
    0 0 20px rgba(255,162,34,.34) !important;
  animation:none;
}

.block-cell.bomb-armed .block-cell-img{
  filter:
    brightness(1.12)
    saturate(1.22);
}

.block-cell.clearing{
  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(255,242,156,.58),
      rgba(255,185,58,.24) 52%,
      rgba(120,58,18,.16) 100%
    ) !important;
  box-shadow:
    inset 0 0 16px rgba(255,220,100,.40),
    0 0 14px rgba(255,190,70,.30) !important;
}

.block-cell.clearing .block-cell-img{
  opacity:.18;
  transform:scale(.92);
  transition:
    opacity 180ms ease-out,
    transform 180ms ease-out;
}

.block-bomb-paper{
  position:absolute;
  width:7px;
  height:10px;
  border-radius:2px;
  pointer-events:none;
  background:var(--c);
  box-shadow:
    0 0 5px rgba(255,230,140,.36);
  transform:translate(-50%,-50%);
  animation:blockBombPaper 900ms ease-out forwards;
}

.block-blast-confetti{
  position:absolute;
  width:7px;
  height:11px;
  border-radius:2px;
  pointer-events:none;
  background:var(--c);
  box-shadow:0 0 5px rgba(255,235,150,.35);
  transform:translate(-50%,-50%);
  animation:blockBlastConfetti 980ms cubic-bezier(.14,.78,.22,1) forwards;
}

.block-blast-shockwave{
  position:absolute;
  width:64px;
  height:64px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
  opacity:0;
  animation:blockBlastShockwave 620ms ease-out forwards;
}

.block-ice-burst-ring{
  position:absolute;
  width:30px;
  height:30px;
  border-radius:50%;
  border:2px solid rgba(220,250,255,.86);
  pointer-events:none;
  transform:translate(-50%,-50%);
  box-shadow:
    0 0 10px rgba(130,225,255,.58),
    inset 0 0 8px rgba(255,255,255,.40);
  animation:blockIceBurstRing 520ms ease-out forwards;
}

.block-ice-shard{
  position:absolute;
  width:8px;
  height:11px;
  pointer-events:none;
  border-radius:2px 7px 2px 5px;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.96),
      rgba(116,218,255,.88) 58%,
      rgba(30,132,210,.62)
    );
  box-shadow:
    0 0 7px rgba(176,240,255,.60);
  transform:translate(-50%,-50%);
  animation:blockIceShardFly 760ms ease-out forwards;
}

.block-ice-paper{
  position:absolute;
  width:7px;
  height:12px;
  border-radius:2px;
  pointer-events:none;
  background:var(--c);
  transform:translate(-50%,-50%);
  box-shadow:0 0 6px rgba(190,245,255,.50);
  animation:blockIcePaperFly 900ms ease-out forwards;
}

.block-prize-halo{
  position:absolute;
  width:42px;
  height:42px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(
      circle,
      rgba(255,249,180,.85) 0%,
      rgba(255,205,68,.40) 42%,
      transparent 72%
    );
  box-shadow:
    0 0 16px rgba(255,222,88,.70);
  animation:blockPrizeHalo 620ms ease-out forwards;
}

.block-prize-sparkle{
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(
      circle,
      #fffbe2,
      #ffd65d 62%,
      #ff8f2a
    );
  box-shadow:
    0 0 8px rgba(255,225,92,.74);
  transform:translate(-50%,-50%);
  animation:blockPrizeSparkle 760ms ease-out forwards;
}

@keyframes blockBombCellGlow{
  0%,100%{
    filter:brightness(1);
  }
  50%{
    filter:brightness(1.24);
  }
}

@keyframes blockBombPaper{
  0%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(.6)
      rotate(0deg);
  }
  68%{
    opacity:1;
  }
  100%{
    opacity:0;
    transform:
      translate(
        calc(-50% + var(--dx)),
        calc(-50% + var(--dy) + 118px)
      )
      scale(1)
      rotate(var(--rot));
  }
}

@keyframes blockBlastConfetti{
  0%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(.65)
      rotate(0deg);
  }
  72%{
    opacity:1;
  }
  100%{
    opacity:0;
    transform:
      translate(
        calc(-50% + var(--dx)),
        calc(-50% + var(--dy) + 150px)
      )
      scale(1.05)
      rotate(var(--rot));
  }
}

@keyframes blockBlastShockwave{
  0%{
    opacity:.98;
    transform:
      translate(-50%,-50%)
      scale(.35);
  }

  52%{
    opacity:.82;
  }

  100%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(3.1);
  }
}

@keyframes blockBlastFlash{
  0%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(.28);
  }

  16%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(1.25);
  }

  58%{
    opacity:.46;
    transform:
      translate(-50%,-50%)
      scale(1.55);
  }

  100%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(2.05);
  }
}

@keyframes blockIceBurstRing{
  0%{
    opacity:.95;
    transform:
      translate(-50%,-50%)
      scale(.42);
  }
  100%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(1.8);
  }
}

@keyframes blockIceShardFly{
  0%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(.65)
      rotate(0deg);
  }
  100%{
    opacity:0;
    transform:
      translate(
        calc(-50% + var(--dx)),
        calc(-50% + var(--dy) + 36px)
      )
      scale(.45)
      rotate(var(--rot));
  }
}

@keyframes blockIcePaperFly{
  0%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(.7)
      rotate(0deg);
  }
  68%{
    opacity:1;
  }
  100%{
    opacity:0;
    transform:
      translate(
        calc(-50% + var(--dx)),
        calc(-50% + var(--dy) + 48px)
      )
      scale(.9)
      rotate(var(--rot));
  }
}

@keyframes blockPrizeHalo{
  0%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(.45);
  }
  32%{
    opacity:1;
  }
  100%{
    opacity:0;
    transform:
      translate(-50%,-50%)
      scale(1.9);
  }
}

@keyframes blockPrizeSparkle{
  0%{
    opacity:1;
    transform:
      translate(-50%,-50%)
      scale(.4);
  }
  100%{
    opacity:0;
    transform:
      translate(
        calc(-50% + var(--dx)),
        calc(-50% + var(--dy) + 20px)
      )
      scale(.15);
  }
}

@keyframes blockBombEnter{
  from{
    transform:scale(.72);
    opacity:0;
  }
  to{
    transform:scale(1);
    opacity:1;
  }
}

@keyframes blockBombPulse{
  0%,100%{
    transform:scale(1);
  }
  50%{
    transform:scale(1.045);
  }
}

@keyframes blockBombAura{
  0%,100%{
    opacity:.72;
    transform:scale(.98);
  }
  50%{
    opacity:1;
    transform:scale(1.08);
  }
}

@keyframes blockBombRing{
  0%,100%{
    opacity:.50;
    transform:scale(.98);
  }
  50%{
    opacity:.95;
    transform:scale(1.04);
  }
}

@keyframes blockBombCountPop{
  0%{
    transform:scale(.55) rotate(-8deg);
    opacity:0;
  }
  35%,100%{
    transform:scale(1) rotate(0deg);
    opacity:1;
  }
}

@keyframes blockBombExplode{
  0%{
    transform:scale(1);
    opacity:1;
  }
  70%{
    transform:scale(1.28);
    opacity:.85;
  }
  100%{
    transform:scale(1.48);
    opacity:0;
  }
}

@keyframes blockBombBurst{
  0%{
    transform:translate(-50%,-50%) scale(.18);
    opacity:1;
  }

  24%{
    transform:translate(-50%,-50%) scale(1.15);
    opacity:.86;
  }

  100%{
    transform:translate(-50%,-50%) scale(3.2);
    opacity:0;
  }
}

.block-stars-panel.is-catching-star{
  animation:blockStarsCatch 260ms ease-out;
}

.block-star-flight{
  position:fixed;
  z-index:95;
  width:24px;
  height:24px;
  margin:-12px 0 0 -12px;
  object-fit:contain;
  pointer-events:none;
  filter:
    drop-shadow(0 3px 3px rgba(38,15,4,.52))
    drop-shadow(0 0 10px rgba(255,226,92,.86))
    drop-shadow(0 0 18px rgba(255,152,42,.42));
  animation:blockStarToCounter 900ms cubic-bezier(.16,.84,.22,1) forwards;
}

.block-coin-flight{
  position:fixed;
  z-index:95;
  width:30px;
  height:30px;
  margin:-15px 0 0 -15px;
  object-fit:contain;
  pointer-events:none;
  filter:
    drop-shadow(0 3px 3px rgba(38,15,4,.52))
    drop-shadow(0 0 10px rgba(255,226,92,.86))
    drop-shadow(0 0 18px rgba(255,152,42,.42));
  animation:blockCoinToCounter 920ms cubic-bezier(.16,.84,.22,1) forwards;
}

@keyframes blockStarToCounter{
  0%{
    opacity:0;
    transform:
      translate(0,0)
      scale(.45)
      rotate(-20deg);
  }

  18%{
    opacity:1;
    transform:
      translate(var(--mx), var(--my))
      scale(1.55)
      rotate(80deg);
  }

  72%{
    opacity:1;
    transform:
      translate(
        calc(var(--dx) * .82),
        calc(var(--dy) * .82 - 18px)
      )
      scale(1.1)
      rotate(260deg);
  }

  100%{
    opacity:0;
    transform:
      translate(var(--dx), var(--dy))
      scale(.45)
      rotate(420deg);
  }
}

@keyframes blockCoinToCounter{
  0%{
    opacity:0;
    transform:
      translate(0,0)
      scale(.5)
      rotate(-30deg);
  }

  18%{
    opacity:1;
    transform:
      translate(var(--mx), var(--my))
      scale(1.5)
      rotate(100deg);
  }

  72%{
    opacity:1;
    transform:
      translate(
        calc(var(--dx) * .82),
        calc(var(--dy) * .82 - 14px)
      )
      scale(1.08)
      rotate(300deg);
  }

  100%{
    opacity:0;
    transform:
      translate(var(--dx), var(--dy))
      scale(.48)
      rotate(480deg);
  }
}

@keyframes blockStarsCatch{
  0%{
    transform:scale(1);
    filter:brightness(1);
  }

  45%{
    transform:scale(1.08);
    filter:brightness(1.35);
  }

  100%{
    transform:scale(1);
    filter:brightness(1);
  }
}

.block-lose-overlay{
  position:fixed;
  inset:0;
  z-index:120;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  box-sizing:border-box;
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(95,56,24,.42),
      rgba(12,7,4,.78) 70%
    );
  backdrop-filter:blur(2px);
}

.block-lose-overlay.hidden{
  display:none;
}

.block-lose-box{
  position:relative;
  width:min(86vw,360px);
  min-height:230px;
  padding:28px 24px 24px;
  box-sizing:border-box;
  border-radius:24px;
  overflow:hidden;
  text-align:center;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(199,143,73,.98),
      rgba(112,67,27,.98) 50%,
      rgba(36,19,8,.98)
    );
  border:2px solid rgba(255,216,118,.70);
  box-shadow:
    0 24px 54px rgba(0,0,0,.58),
    0 0 24px rgba(255,180,58,.16),
    inset 0 2px 0 rgba(255,246,197,.24),
    inset 0 -22px 34px rgba(35,14,4,.34);
  animation:
    blockLoseBoxIn 320ms ease-out both,
    blockLoseShake 420ms ease-out 120ms 1;
}

.block-lose-box::before{
  content:"";
  position:absolute;
  left:20px;
  right:20px;
  top:12px;
  height:3px;
  border-radius:999px;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,236,158,.78),
      transparent
    );
}

.block-lose-glow{
  position:absolute;
  inset:-34px;
  background:
    radial-gradient(
      circle at 50% 18%,
      rgba(255,216,106,.26),
      transparent 48%
    );
  pointer-events:none;
}

.block-lose-mark{
  position:relative;
  z-index:1;
  width:58px;
  height:58px;
  margin:2px auto 10px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#4b1d06;
  font-size:38px;
  font-weight:900;
  line-height:1;
  background:
    linear-gradient(
      180deg,
      #fff17c,
      #ffba23 56%,
      #b96b09
    );
  border:2px solid rgba(255,247,174,.82);
  box-shadow:
    0 9px 16px rgba(35,14,4,.36),
    0 0 18px rgba(255,205,69,.28),
    inset 0 2px 0 rgba(255,255,255,.44),
    inset 0 -5px 0 rgba(101,48,4,.28);
  text-shadow:
    0 1px 0 rgba(255,244,165,.72);
}

.block-lose-box h2{
  position:relative;
  z-index:1;
  margin:0 0 9px;
  color:#ffd7b7;
  font-size:28px;
  font-weight:900;
  letter-spacing:0;
  text-shadow:
    0 3px 0 rgba(68,22,7,.92),
    0 0 14px rgba(255,96,46,.25);
}

.block-lose-box p{
  position:relative;
  z-index:1;
  max-width:260px;
  margin:0 auto 18px;
  color:#ffe8b5;
  font-size:15px;
  font-weight:800;
  line-height:1.18;
  text-shadow:0 2px 4px rgba(0,0,0,.54);
}

#block-lose-retry-btn{
  position:relative;
  z-index:1;
  min-width:172px;
  min-height:52px;
  padding:0 26px;
  border-radius:999px;
  border:1px solid rgba(255,246,151,.78);
  cursor:pointer;
  color:#3b1d03;
  font-size:18px;
  font-weight:900;
  background:
    linear-gradient(
      180deg,
      #fff079,
      #ffc719 48%,
      #c47a0a
    );
  box-shadow:
    0 9px 18px rgba(0,0,0,.34),
    0 0 18px rgba(255,209,55,.24),
    inset 0 2px 0 rgba(255,255,255,.45),
    inset 0 -5px 0 rgba(129,68,4,.22);
  text-shadow:0 1px 0 rgba(255,246,170,.65);
}

#block-lose-retry-btn:active{
  transform:translateY(2px);
  filter:brightness(.96);
}

@keyframes blockLoseBoxIn{
  from{
    opacity:0;
    transform:translateY(18px) scale(.92);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes blockLoseShake{
  0%,100%{ transform:translateX(0); }
  20%{ transform:translateX(-7px); }
  40%{ transform:translateX(6px); }
  60%{ transform:translateX(-4px); }
  80%{ transform:translateX(3px); }
}

.block-screen{
  width:100%;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:10px 8px 12px;
  background:
    radial-gradient(
      circle at 50% 10%,
      rgba(255,213,128,.34),
      rgba(155,101,49,.46) 38%,
      rgba(58,34,19,.92) 76%,
      rgba(25,17,12,1) 100%
    );
  background-size:cover, cover, cover;
  background-position:center, center, center;
  background-repeat:no-repeat;
  box-sizing:border-box;
  overflow:hidden;
}

.block-line-lightning-layer{
  position:absolute;
  inset:0;
  z-index:28;
  overflow:visible;
  pointer-events:none;
}

.block-line-lightning{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:visible;
  opacity:1;
  mix-blend-mode:screen;
  filter:
    brightness(2.2)
    saturate(2.15)
    contrast(1.08)
    drop-shadow(0 0 14px #c8fbff)
    drop-shadow(0 0 28px #54d9ff)
    drop-shadow(0 0 44px #118cff);
  animation:blockLineFire 680ms cubic-bezier(.13,.82,.24,1) both;
}

.block-line-lightning.is-row{
  left:0;
}

.block-line-lightning.is-col{
  top:0;
}

.block-line-lightning img{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  position:relative;
  z-index:2;
}

.block-line-lightning.is-row img{
  height:100%;
}

.block-line-lightning.is-col img{
  width:100%;
}

.block-line-lightning.is-active{
  opacity:1;
  z-index:2;
}

.block-line-lightning::before{
  content:"";
  position:absolute;
  inset:38% -8%;
  border-radius:999px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(78,217,255,.68),
    rgba(255,255,255,.98),
    rgba(65,176,255,.76),
    transparent
  );
  box-shadow:
    0 0 14px rgba(205,251,255,.98),
    0 0 28px rgba(122,230,255,.92),
    0 0 48px rgba(29,137,255,.76),
    0 0 22px rgba(29,137,255,.82),
    0 0 38px rgba(29,137,255,.48);
  z-index:1;
}

.block-line-lightning.is-col::before{
  inset:-8% 38%;
  background:linear-gradient(
    180deg,
    transparent,
    rgba(78,217,255,.68),
    rgba(255,255,255,.98),
    rgba(65,176,255,.76),
    transparent
  );
}

@keyframes blockLineCharge{
  from{ opacity:.18; transform:scale(.94); }
  to{ opacity:.5; transform:scale(1.015); }
}

@keyframes blockLineFire{
  0%{ opacity:.3; transform:scale(.88); }
  32%{ opacity:1; transform:scale(1.045); }
  68%{ opacity:1; transform:scale(1); }
  100%{ opacity:.08; transform:scale(1.08); }
}

.block-hud{
  width:min(94vw,480px);
  max-width:480px;
  display:grid;
  grid-template-columns:.72fr .72fr 2fr;
  gap:0;
  margin-bottom:4px;
  padding:4px 7px;
  border:1px solid rgba(255,216,124,.38);
  border-radius:14px;
  background:linear-gradient(
      180deg,
      rgba(87,55,31,.70),
      rgba(43,25,15,.56)
    );
  box-shadow:inset 0 1px 0 rgba(255,240,178,.14),
    inset 0 -1px 0 rgba(45,18,6,.22),
    0 5px 12px rgba(29,13,5,.18);
  backdrop-filter:blur(2px);
}

.block-board-wrapper{
  position:relative;
  z-index:1;
  width:min(94vw,480px);
  display:flex;
  justify-content:center;
}

.block-board{
  width:min(94vw,480px);
  aspect-ratio:1/1;
  display:grid;
  grid-template-columns:repeat(10,1fr);
  grid-template-rows:repeat(10,1fr);
  gap:2px;
  padding:6px;
  border-radius:18px;
  background:radial-gradient(
      circle at 50% 8%,
      rgba(192,241,251,.62),
      rgba(50,153,194,.58) 44%,
      rgba(5,61,105,.68) 100%
    );
  border:2px solid rgba(181,237,250,.82);
  box-shadow:inset 0 2px 0 rgba(236,252,255,.42),
    inset 0 -5px 0 rgba(2,45,82,.32),
    0 0 0 2px rgba(3,72,113,.28),
    0 14px 30px rgba(0,26,58,.36),
    0 0 26px rgba(71,193,230,.28);
  --block-board-gap:2px;
  --block-board-pad:6px;
  position:relative;
  border-color:rgba(170,235,250,.90);
  max-width:480px;
  backdrop-filter:blur(3px) saturate(1.12);
}

.block-mini-hud{
  width:min(94vw,480px);
  display:grid;
  grid-template-columns:1.22fr .50fr .42fr .42fr;
  gap:6px;
  margin-top:4px;
}

.block-pieces{
  width:min(94vw,480px);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  margin-top:6px;
  filter:none;
}

.block-piece{
  min-height:72px;
  border-radius:16px;
  background:linear-gradient(
      180deg,
      rgba(18,73,91,.16),
      rgba(4,28,45,.08)
    );
  border:2px solid rgba(255,223,116,.48);
  box-shadow:inset 0 1px 0 rgba(255,250,204,.22),
    inset 0 -2px 0 rgba(3,25,40,.16),
    0 4px 12px rgba(0,18,34,.18),
    0 0 10px rgba(255,210,77,.08);
  backdrop-filter:blur(1.5px);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  border-color:rgba(255,211,112,.54);
  overflow:hidden;
  animation:blockPieceFloat 2.8s ease-in-out infinite;
}

.block-actions{
  width:min(94vw,480px);
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  margin-top:10px;
}

.block-actions button{
  height:48px;
  border:2px solid rgba(255,218,118,.72);
  border-radius:14px;
  font-weight:900;
  cursor:pointer;
  font-size:15px;
  color:#fff4b0;
  text-shadow:0 2px 0 rgba(0,16,35,.96),
    0 0 9px rgba(255,225,112,.46);
  background:radial-gradient(
      circle at 50% 0%,
      rgba(119,222,255,.30),
      rgba(119,222,255,0) 42%
    ),
    linear-gradient(
      180deg,
      #245f7d 0%,
      #123d5d 48%,
      #071d35 100%
    );
  box-shadow:inset 0 2px 0 rgba(207,246,255,.30),
    inset 0 -4px 0 rgba(0,8,22,.38),
    inset 0 0 0 1px rgba(255,235,151,.14),
    0 7px 14px rgba(0,11,29,.38),
    0 0 14px rgba(46,182,255,.20);
  transition:transform 140ms ease, filter 140ms ease, box-shadow 140ms ease;
}

.block-actions button:active{
  transform:translateY(2px) scale(.985);
  filter:brightness(1.16);
  box-shadow:inset 0 1px 0 rgba(207,246,255,.26),
    inset 0 -2px 0 rgba(0,8,22,.38),
    0 4px 9px rgba(0,11,29,.34),
    0 0 18px rgba(58,198,255,.28);
}

@media (max-height:760px){
.block-screen{
    padding-top:8px;
  }

.block-hud{
    margin-bottom:3px;
  }

.block-board{
    width:min(94vw,456px);
  }

.block-board-wrapper,
  .block-mini-hud,
  .block-pieces,
  .block-actions{
    width:min(94vw,456px);
  }

.block-piece{
    min-height:68px;
  }

.block-actions{
    margin-top:8px;
  }

.block-actions button{
    height:46px;
  }
}

.block-screen .block-board .block-cell.preview-valid{
  background:#2d8f45 !important;
  outline:3px solid #52ff78 !important;
  outline-offset:-4px !important;
  box-shadow:
    inset 0 0 14px rgba(82,255,120,.75),
    0 0 12px rgba(82,255,120,.75) !important;
}

.block-screen .block-board .block-cell.preview-invalid{
  background:#9b1f1f !important;
  outline:3px solid #ff3838 !important;
  outline-offset:-4px !important;
  box-shadow:
    inset 0 0 14px rgba(255,56,56,.75),
    0 0 12px rgba(255,56,56,.75) !important;
}

.block-screen .block-board .block-cell.preview-valid .block-preview-img{
  opacity:.95 !important;
  filter:
    drop-shadow(0 0 8px rgba(82,255,120,.95)) !important;
}

.block-screen .block-board .block-cell.preview-invalid .block-preview-img{
  opacity:.82 !important;
  filter:
    drop-shadow(0 0 8px rgba(255,56,56,.95)) !important;
}

.block-cell.filled .block-cell-img,
.block-piece .block-mini-img{
  filter:
    saturate(1.18)
    brightness(1.04)
    drop-shadow(0 0 4px rgba(181,88,255,.42))
    drop-shadow(0 2px 2px rgba(28,8,45,.34)) !important;
}

.block-piece.selected .block-mini-img{
  filter:
    saturate(1.35)
    brightness(1.14)
    drop-shadow(0 0 8px rgba(205,116,255,.78))
    drop-shadow(0 0 16px rgba(125,47,255,.42))
    drop-shadow(0 2px 2px rgba(28,8,45,.36)) !important;
}

.block-cell.bomb-armed-3{
  background:
    radial-gradient(
      circle at 50% 28%,
      rgba(236,253,255,.92) 0%,
      rgba(74,207,255,.72) 34%,
      rgba(20,119,255,.44) 68%,
      rgba(20,38,110,.32) 100%
    ) !important;
  box-shadow:
    inset 0 2px 0 rgba(238,253,255,.72),
    inset 0 -5px 10px rgba(4,42,110,.38),
    0 0 0 1px rgba(132,233,255,.70),
    0 0 14px rgba(72,210,255,.90),
    0 0 30px rgba(36,122,255,.46) !important;
}

.block-cell.bomb-armed-3 .block-cell-img{
  filter:
    brightness(1.12)
    saturate(1.22) !important;
}

.block-cell.bomb-armed-4{
  background:
    radial-gradient(
      circle at 50% 28%,
      rgba(255,239,228,.94) 0%,
      rgba(255,82,71,.75) 34%,
      rgba(220,24,48,.46) 68%,
      rgba(92,8,20,.34) 100%
    ) !important;
  box-shadow:
    inset 0 2px 0 rgba(255,240,226,.72),
    inset 0 -5px 10px rgba(92,8,20,.38),
    0 0 0 1px rgba(255,126,96,.72),
    0 0 16px rgba(255,68,62,.94),
    0 0 34px rgba(255,24,56,.54) !important;
}

.block-cell.bomb-armed-4 .block-cell-img{
  filter:
    brightness(1.12)
    saturate(1.22) !important;
}

.block-bomb-spark.size-3{
  background:
    radial-gradient(circle,#f3fdff 0%,#4bd5ff 38%,#087bff 100%);
  box-shadow:
    0 0 12px rgba(75,213,255,.90),
    0 0 22px rgba(22,126,255,.48);
}

.block-blast-shockwave.size-3{
  border:3px solid rgba(130,238,255,.92);
  box-shadow:
    0 0 28px rgba(72,211,255,.88),
    inset 0 0 28px rgba(32,126,255,.58);
  background:
    radial-gradient(
      circle,
      rgba(222,251,255,.34),
      rgba(54,194,255,.16) 48%,
      transparent 72%
    );
}

.block-bomb-spark.size-4{
  background:
    radial-gradient(circle,#fff3e8 0%,#ff634d 40%,#e5002d 100%);
  box-shadow:
    0 0 12px rgba(255,91,68,.92),
    0 0 24px rgba(255,16,50,.56);
}

.block-blast-shockwave.size-4{
  border:3px solid rgba(255,121,91,.94);
  box-shadow:
    0 0 30px rgba(255,81,62,.92),
    inset 0 0 30px rgba(255,20,55,.64);
  background:
    radial-gradient(
      circle,
      rgba(255,237,222,.36),
      rgba(255,75,54,.18) 48%,
      transparent 72%
    );
}

.block-bomb-paper.size-3,
.block-blast-confetti.size-3{
  box-shadow:
    0 0 7px rgba(82,217,255,.72),
    0 0 16px rgba(24,128,255,.34);
}

.block-bomb-paper.size-4,
.block-blast-confetti.size-4{
  box-shadow:
    0 0 7px rgba(255,73,64,.78),
    0 0 18px rgba(255,20,50,.38);
}
.block-board,
.block-hud,
.block-board-wrapper,
.block-mini-hud,
.block-pieces,
.block-actions{
  box-sizing:border-box;
}
.block-board-wrapper,
.block-board{
  overflow:visible;
}

.block-screen.perf-lite,
.block-screen.perf-lite *{
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

.block-screen.perf-lite,
.block-screen.perf-lite .block-board,
.block-screen.perf-lite .block-piece,
.block-screen.perf-lite .block-cell{
  touch-action:none;
}

.block-screen.perf-lite .block-board{
  box-shadow:
    inset 0 1px 0 rgba(236,252,255,.32),
    inset 0 -3px 0 rgba(2,45,82,.24),
    0 6px 14px rgba(0,26,58,.24) !important;
}

.block-screen.perf-lite .block-cell{
  box-shadow:
    inset 0 1px 0 rgba(236,252,255,.26),
    inset 0 -1px 0 rgba(4,67,106,.14),
    0 1px 3px rgba(0,39,76,.12) !important;
  transition:none !important;
}

.block-screen.perf-lite .block-hud,
.block-screen.perf-lite .block-piece,
.block-screen.perf-lite .block-actions button,
.block-screen.perf-lite .block-board-prize-panel{
  box-shadow:
    inset 0 1px 0 rgba(255,240,178,.12),
    0 3px 8px rgba(0,18,34,.18) !important;
}

.block-screen.perf-lite .block-piece{
  animation:none !important;
}

.block-screen.perf-lite .block-cell.filled .block-cell-img,
.block-screen.perf-lite .block-piece .block-mini-img,
.block-screen.perf-lite .block-piece.selected .block-mini-img,
.block-screen.perf-lite .block-preview-img{
  filter:saturate(1.08) brightness(1.02) !important;
}

.block-screen.perf-lite .block-cell.bomb-armed-3,
.block-screen.perf-lite .block-cell.bomb-armed-4{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.36),
    0 0 9px rgba(98,213,255,.36) !important;
}

.block-screen.perf-lite.dragging .block-cell,
.block-screen.perf-lite.dragging .block-piece,
.block-screen.perf-lite.dragging .block-mini-img,
.block-screen.perf-lite.dragging .block-cell-img{
  transition:none !important;
  animation:none !important;
}

.block-screen.perf-lite.dragging .block-cell.preview-valid,
.block-screen.perf-lite.dragging .block-cell.preview-invalid{
  box-shadow:none !important;
  outline-width:2px !important;
}

.block-screen.perf-lite .block-blast-shockwave,
.block-screen.perf-lite .block-bomb-spark,
.block-screen.perf-lite .block-bomb-paper,
.block-screen.perf-lite .block-blast-confetti,
.block-screen.perf-lite .block-ice-burst-ring,
.block-screen.perf-lite .block-ice-shard,
.block-screen.perf-lite .block-ice-paper,
.block-screen.perf-lite .block-prize-sparkle{
  box-shadow:none !important;
}

@media (max-width:820px), (pointer:coarse){
  .block-piece{
    animation:none !important;
  }

  .block-board,
  .block-hud,
  .block-piece,
  .block-actions button{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }
}