.minoes-table {
  filter:
    drop-shadow(-1px -1px 0 white)
    drop-shadow( 1px  1px 0 white);
}

.minoes-table tr {
  z-index: calc(100 - var(--row));
  position: sticky;
}

tr.matrix td:not(.mino) {
  border-left: none;
  border-bottom: none;
  border-right: 1px solid #30303003;
  border-top: 1px solid #30303003;
}

.mino {
  --color: hsl(var(--hue), var(--saturation), 40%);
  --light: hsl(var(--hue), calc(0.66 * var(--saturation)), 84%);
  --top: hsl(var(--hue), calc(0.6 * var(--saturation)), 68%);
  background-color: var(--color);
  background-image:
    radial-gradient(
      ellipse 22% 8% at 25% 22%,
      #ffffff66,
      #ffffff33 40%,
      transparent 70%
    ),
    radial-gradient(
      ellipse 140% 85% at 50% -15%,
      var(--light) 0%,
      #ffffff77 40%,
      #00000005 55%
    ),
    radial-gradient(
      ellipse 120% 220% at 50% 140%,
      var(--light) 0%,
      var(--color) 55%,
      #00000066 95%
    );
  border: 4px ridge var(--color);
  border-top-color: var(--light);
  border-radius: 3px;
  box-shadow:
    inset 2px 0 4px rgba(0,0,0,.06),
    inset -2px 0 4px rgba(0,0,0,.12),
    0 -4px 0 var(--top);
  filter: saturate(1.1) contrast(1.05);
}

.I {
  --hue: 193;
  --saturation: 100%;
}

.J {
  --hue: 215;
  --saturation: 100%;
}

.L {
  --hue: 25;
  --saturation: 100%;
}

.O {
  --hue: 42;
  --saturation: 100%;
}

.S {
  --hue: 95;
  --saturation: 100%;
}

.T {
  --hue: 300;
  --saturation: 56%;
}

.Z {
  --hue: 357;
  --saturation: 84%;
}

.ghost {
  border: 3px solid #fff1;
  padding: 2px;
  background-color: #fff1;
  background-clip: content-box;
  background-image: none;
  box-shadow: none;
}

@keyframes trail-animation {
    from {
        background-color: #ceffff10;
    }
    to {
        background-color: transparent;
    }
}

@keyframes cleared-line-animation {
    from {
        background-color: #fff6;
        filter: saturate(50%) brightness(300%);
        box-shadow: 0 0 0 #adb5bd66, 0 0 0 #adb5bd66;
    }
    60% {
        box-shadow: -60px 0 2px #adb5bd33, 60px 0 2px #adb5bd33;
    }
    to {
        background-color: transparent;
        box-shadow: -100px 0 5px transparent, 100px 0 5px transparent;
    }
}