html[data-skin="neon-mosaic"] .tile {
  overflow: hidden;
  border: 1px solid #b8e9ff;
  background: #11172d;
  box-shadow: 4px 5px 0 #333a50, 5px 8px 9px rgba(0, 0, 0, .55), 0 0 7px rgba(70, 224, 255, .22);
}

html[data-skin="neon-mosaic"] .tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
}

html[data-skin="neon-mosaic"] .tile.blocked {
  filter: saturate(.58) brightness(.62);
}

html[data-skin="neon-mosaic"] .tile.free {
  filter: saturate(1.08) brightness(1.04);
}

html[data-skin="neon-mosaic"] .tile.selected {
  outline-color: #fff36a;
  filter: saturate(1.2) brightness(1.2) drop-shadow(0 0 7px #fff36a);
}

html[data-skin="neon-signal"] .tile,
html[data-skin="neon-candy"] .tile {
  overflow: hidden;
  border: 1px solid #d8f5ff;
  background: #090d1b;
  box-shadow: 4px 5px 0 #30384f, 5px 8px 9px rgba(0, 0, 0, .52);
}

html[data-skin="neon-candy"] .tile {
  background: #f7f3ff;
  box-shadow: 4px 5px 0 #aaa6c2, 5px 8px 9px rgba(0, 0, 0, .35);
}

html[data-skin="neon-signal"] .tile img,
html[data-skin="neon-candy"] .tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
}

html[data-skin="neon-signal"] .tile.blocked,
html[data-skin="neon-candy"] .tile.blocked {
  filter: saturate(.72) brightness(.72);
}

html[data-skin="neon-signal"] .tile.free,
html[data-skin="neon-candy"] .tile.free {
  filter: saturate(1.12) brightness(1.07);
}

html[data-skin="neon-signal"] .tile.selected,
html[data-skin="neon-candy"] .tile.selected {
  outline-color: #fff45c;
  filter: saturate(1.2) brightness(1.18) drop-shadow(0 0 8px #fff45c);
}
