===================================================================
--- original.js
+++ change.js
@@ -1,6 +1,614 @@
-/****
+/**** 
+* Plugins
+****/ 
+var tween = LK.import("@upit/tween.v1");
+
+/**** 
+* Classes
+****/ 
+// --- HexTile: A single hexagon on the board ---
+var HexTile = Container.expand(function () {
+	var self = Container.call(this);
+	// Color: 'pink', 'blue', 'yellow', 'green', 'purple', 'orange'
+	self.color = 'pink';
+	self.gridQ = 0; // axial q
+	self.gridR = 0; // axial r
+	self.occupied = false;
+	self.face = null;
+	// Attach hex asset
+	self.setColor = function (color) {
+		self.color = color;
+		if (self.hex) self.removeChild(self.hex);
+		self.hex = self.attachAsset('hex_' + color, {
+			anchorX: 0.5,
+			anchorY: 0.5
+		});
+		// Add face
+		if (self.face) self.removeChild(self.face);
+		self.face = self.attachAsset('face', {
+			anchorX: 0.5,
+			anchorY: 0.5,
+			x: 0,
+			y: 0,
+			scaleX: 0.7,
+			scaleY: 0.7
+		});
+	};
+	self.setEmpty = function () {
+		self.occupied = false;
+		if (self.hex) self.hex.visible = false;
+		if (self.face) self.face.visible = false;
+	};
+	self.setFilled = function (color) {
+		self.occupied = true;
+		self.setColor(color);
+		self.hex.visible = true;
+		self.face.visible = true;
+	};
+	// Pop animation
+	self.pop = function () {
+		if (!self.occupied) return;
+		var popFx = self.attachAsset('pop', {
+			anchorX: 0.5,
+			anchorY: 0.5,
+			alpha: 0.5,
+			scaleX: 1,
+			scaleY: 1
+		});
+		tween(popFx, {
+			scaleX: 1.7,
+			scaleY: 1.7,
+			alpha: 0
+		}, {
+			duration: 350,
+			easing: tween.easeOut,
+			onFinish: function onFinish() {
+				self.removeChild(popFx);
+			}
+		});
+		LK.getSound('pop1').play();
+		self.setEmpty();
+	};
+	return self;
+});
+// --- Piece: A draggable group of 1-5 hexes in a shape ---
+var Piece = Container.expand(function () {
+	var self = Container.call(this);
+	// Shape: array of {q, r, color}
+	self.shape = [];
+	self.hexes = [];
+	self.dragging = false;
+	self.valid = true; // is current placement valid
+	// Generate a piece from a shape definition
+	self.setShape = function (shape) {
+		self.shape = shape;
+		// Remove old hexes
+		for (var i = 0; i < self.hexes.length; ++i) self.removeChild(self.hexes[i]);
+		self.hexes = [];
+		// Add new hexes
+		for (var i = 0; i < shape.length; ++i) {
+			var hex = self.attachAsset('hex_' + shape[i].color, {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				x: 0,
+				y: 0
+			});
+			// Add face
+			var face = self.attachAsset('face', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				x: 0,
+				y: 0,
+				scaleX: 0.7,
+				scaleY: 0.7
+			});
+			hex.addChild(face);
+			self.hexes.push(hex);
+		}
+		// Position hexes
+		for (var i = 0; i < shape.length; ++i) {
+			var pos = axialToPixel(shape[i].q, shape[i].r, pieceHexSize);
+			self.hexes[i].x = pos.x;
+			self.hexes[i].y = pos.y;
+		}
+	};
+	// Highlight for valid/invalid placement
+	self.setValid = function (valid) {
+		self.valid = valid;
+		for (var i = 0; i < self.hexes.length; ++i) {
+			self.hexes[i].alpha = valid ? 1 : 0.4;
+		}
+	};
+	return self;
+});
+
+/**** 
 * Initialize Game
-****/
+****/ 
+/**** 
+* Helper Functions
+****/ 
+// Hex math
 var game = new LK.Game({
-	backgroundColor: 0x000000
-});
\ No newline at end of file
+	backgroundColor: 0xbfdfff // Dreamy blue sky
+});
+
+/**** 
+* Game Code
+****/ 
+// Hex math
+/**** 
+* Helper Functions
+****/ 
+// Sound effects
+// Pop effect
+// Faces (as colored ellipses for now, can be replaced with images later)
+// Cloud background (large, white, semi-transparent ellipses)
+// Hex tile shapes (pastel colors)
+// --- Add dreamy cloud background ---
+var sqrt3 = Math.sqrt(3);
+function axialToPixel(q, r, size) {
+	// Flat-topped hex
+	var x = size * (3 / 2 * q);
+	var y = size * (sqrt3 * (r + q / 2));
+	return {
+		x: x,
+		y: y
+	};
+}
+function pixelToAxial(x, y, size) {
+	var q = 2 / 3 * x / size;
+	var r = (-1 / 3 * x + sqrt3 / 3 * y) / size;
+	return hexRound(q, r);
+}
+function hexRound(q, r) {
+	var x = q;
+	var z = r;
+	var y = -x - z;
+	var rx = Math.round(x);
+	var ry = Math.round(y);
+	var rz = Math.round(z);
+	var x_diff = Math.abs(rx - x);
+	var y_diff = Math.abs(ry - y);
+	var z_diff = Math.abs(rz - z);
+	if (x_diff > y_diff && x_diff > z_diff) rx = -ry - rz;else if (y_diff > z_diff) ry = -rx - rz;else rz = -rx - ry;
+	return {
+		q: rx,
+		r: rz
+	};
+}
+// Generate random color
+function randomColor() {
+	var arr = ['pink', 'blue', 'yellow', 'green', 'purple', 'orange'];
+	return arr[Math.floor(Math.random() * arr.length)];
+}
+// Piece shape library (axial coordinates, always includes 0,0)
+var pieceShapes = [
+// Single
+[{
+	q: 0,
+	r: 0
+}],
+// Line 2
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}],
+// Line 3
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 2,
+	r: 0
+}],
+// L shape
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 1,
+	r: 1
+}],
+// Triangle
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 0,
+	r: 1
+}],
+// Zigzag
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 1,
+	r: 1
+}, {
+	q: 2,
+	r: 1
+}],
+// Big line
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 2,
+	r: 0
+}, {
+	q: 3,
+	r: 0
+}, {
+	q: 4,
+	r: 0
+}],
+// Big triangle
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 0,
+	r: 1
+}, {
+	q: 1,
+	r: 1
+}, {
+	q: 0,
+	r: 2
+}],
+// T shape
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: 2,
+	r: 0
+}, {
+	q: 1,
+	r: 1
+}],
+// Plus
+[{
+	q: 0,
+	r: 0
+}, {
+	q: 1,
+	r: 0
+}, {
+	q: -1,
+	r: 0
+}, {
+	q: 0,
+	r: 1
+}, {
+	q: 0,
+	r: -1
+}]];
+// Generate a random piece shape with random colors
+function randomPieceShape() {
+	var base = pieceShapes[Math.floor(Math.random() * pieceShapes.length)];
+	var color = randomColor();
+	var arr = [];
+	for (var i = 0; i < base.length; ++i) {
+		arr.push({
+			q: base[i].q,
+			r: base[i].r,
+			color: color
+		});
+	}
+	return arr;
+}
+/**** 
+* Game Board Setup
+****/ 
+// Board size
+var boardRadius = 5; // 5 rings from center (total diameter 11)
+var boardHexSize = 60; // px, for board tiles
+var pieceHexSize = 60; // px, for piece tiles
+// Board center in pixels
+var boardCenterX = 2048 / 2;
+var boardCenterY = 1200;
+// Board data: array of {q, r, tile}
+var boardTiles = [];
+// Build board: all hexes with |q|+|r|+|s| <= boardRadius*2
+for (var q = -boardRadius; q <= boardRadius; ++q) {
+	for (var r = -boardRadius; r <= boardRadius; ++r) {
+		var s = -q - r;
+		if (Math.abs(q) <= boardRadius && Math.abs(r) <= boardRadius && Math.abs(s) <= boardRadius) {
+			// Create tile
+			var tile = new HexTile();
+			tile.gridQ = q;
+			tile.gridR = r;
+			tile.setEmpty();
+			var pos = axialToPixel(q, r, boardHexSize);
+			tile.x = boardCenterX + pos.x;
+			tile.y = boardCenterY + pos.y;
+			boardTiles.push({
+				q: q,
+				r: r,
+				tile: tile
+			});
+		}
+	}
+}
+// Helper: find tile at q,r
+function getTile(q, r) {
+	for (var i = 0; i < boardTiles.length; ++i) {
+		if (boardTiles[i].q === q && boardTiles[i].r === r) return boardTiles[i].tile;
+	}
+	return null;
+}
+var cloud1 = LK.getAsset('cloud1', {
+	anchorX: 0.5,
+	anchorY: 0.5,
+	x: 2048 / 2 - 300,
+	y: 400,
+	alpha: 0.18
+});
+var cloud2 = LK.getAsset('cloud2', {
+	anchorX: 0.5,
+	anchorY: 0.5,
+	x: 2048 / 2 + 250,
+	y: 600,
+	alpha: 0.13
+});
+var cloud3 = LK.getAsset('cloud3', {
+	anchorX: 0.5,
+	anchorY: 0.5,
+	x: 2048 / 2 - 200,
+	y: 900,
+	alpha: 0.10
+});
+game.addChild(cloud1);
+game.addChild(cloud2);
+game.addChild(cloud3);
+// --- Add board tiles to game ---
+for (var i = 0; i < boardTiles.length; ++i) {
+	game.addChild(boardTiles[i].tile);
+}
+// --- Score display ---
+var score = 0;
+var scoreTxt = new Text2('0', {
+	size: 120,
+	fill: "#fff"
+});
+scoreTxt.anchor.set(0.5, 0);
+LK.gui.top.addChild(scoreTxt);
+// --- Piece tray (bottom center) ---
+var trayY = 2732 - 350;
+var trayX = 2048 / 2;
+var traySpacing = 320;
+var trayPieces = [null, null, null]; // 3 pieces at a time
+// --- Generate new pieces in tray ---
+function refillTray() {
+	for (var i = 0; i < 3; ++i) {
+		if (trayPieces[i]) {
+			trayPieces[i].destroy();
+			trayPieces[i] = null;
+		}
+		var piece = new Piece();
+		piece.setShape(randomPieceShape());
+		piece.x = trayX + (i - 1) * traySpacing;
+		piece.y = trayY;
+		trayPieces[i] = piece;
+		game.addChild(piece);
+	}
+}
+refillTray();
+// --- Drag and drop logic ---
+var draggingPiece = null;
+var dragOffsetX = 0;
+var dragOffsetY = 0;
+var dragStartX = 0;
+var dragStartY = 0;
+// Helper: get board position under a pixel
+function getBoardPosUnder(x, y) {
+	// Convert to board-local
+	var px = x - boardCenterX;
+	var py = y - boardCenterY;
+	var axial = pixelToAxial(px, py, boardHexSize);
+	return axial;
+}
+// Helper: can place piece at board q,r
+function canPlacePiece(piece, q, r) {
+	for (var i = 0; i < piece.shape.length; ++i) {
+		var dq = piece.shape[i].q;
+		var dr = piece.shape[i].r;
+		var tile = getTile(q + dq, r + dr);
+		if (!tile || tile.occupied) return false;
+	}
+	return true;
+}
+// Helper: place piece at board q,r
+function placePiece(piece, q, r) {
+	for (var i = 0; i < piece.shape.length; ++i) {
+		var dq = piece.shape[i].q;
+		var dr = piece.shape[i].r;
+		var color = piece.shape[i].color;
+		var tile = getTile(q + dq, r + dr);
+		if (tile) tile.setFilled(color);
+	}
+}
+// Helper: remove piece from tray
+function removePieceFromTray(piece) {
+	for (var i = 0; i < 3; ++i) {
+		if (trayPieces[i] === piece) {
+			trayPieces[i].destroy();
+			trayPieces[i] = null;
+		}
+	}
+}
+// --- Game move events ---
+game.down = function (x, y, obj) {
+	// Check if a piece in tray is touched
+	for (var i = 0; i < 3; ++i) {
+		var piece = trayPieces[i];
+		if (!piece) continue;
+		var local = piece.toLocal(game.toGlobal({
+			x: x,
+			y: y
+		}));
+		// Check if touch is within piece bounds
+		for (var j = 0; j < piece.hexes.length; ++j) {
+			var hx = piece.hexes[j].x;
+			var hy = piece.hexes[j].y;
+			var dx = local.x - hx;
+			var dy = local.y - hy;
+			if (dx * dx + dy * dy < pieceHexSize * pieceHexSize * 0.4) {
+				draggingPiece = piece;
+				dragStartX = piece.x;
+				dragStartY = piece.y;
+				dragOffsetX = x - piece.x;
+				dragOffsetY = y - piece.y;
+				piece.dragging = true;
+				piece.setValid(true);
+				// Bring to front
+				game.addChild(piece);
+				return;
+			}
+		}
+	}
+};
+game.move = function (x, y, obj) {
+	if (!draggingPiece) return;
+	// Move piece
+	draggingPiece.x = x - dragOffsetX;
+	draggingPiece.y = y - dragOffsetY;
+	// Snap to board if close
+	var pos = getBoardPosUnder(draggingPiece.x, draggingPiece.y);
+	var canPlace = canPlacePiece(draggingPiece, pos.q, pos.r);
+	draggingPiece.setValid(canPlace);
+};
+game.up = function (x, y, obj) {
+	if (!draggingPiece) return;
+	// Try to place
+	var pos = getBoardPosUnder(draggingPiece.x, draggingPiece.y);
+	if (canPlacePiece(draggingPiece, pos.q, pos.r)) {
+		// Place
+		placePiece(draggingPiece, pos.q, pos.r);
+		removePieceFromTray(draggingPiece);
+		draggingPiece.destroy();
+		draggingPiece = null;
+		// Check for matches and refill tray if all used
+		checkAndPopMatches();
+		if (trayPieces.every(function (p) {
+			return !p;
+		})) {
+			refillTray();
+		}
+		// Check for game over
+		if (!canAnyPieceBePlaced()) {
+			LK.showGameOver();
+		}
+	} else {
+		// Return to tray
+		tween(draggingPiece, {
+			x: dragStartX,
+			y: dragStartY
+		}, {
+			duration: 200,
+			easing: tween.easeOut
+		});
+		draggingPiece.setValid(true);
+		draggingPiece.dragging = false;
+		draggingPiece = null;
+	}
+};
+// --- Matching and popping logic ---
+// Find all groups of 3+ connected same-color tiles, pop them, and chain
+function checkAndPopMatches() {
+	var popped = false;
+	var visited = {};
+	var combos = 0;
+	for (var i = 0; i < boardTiles.length; ++i) {
+		var tile = boardTiles[i].tile;
+		if (!tile.occupied) continue;
+		var key = tile.gridQ + ',' + tile.gridR;
+		if (visited[key]) continue;
+		// BFS for connected same-color
+		var group = [];
+		var queue = [{
+			q: tile.gridQ,
+			r: tile.gridR
+		}];
+		while (queue.length) {
+			var cur = queue.pop();
+			var ckey = cur.q + ',' + cur.r;
+			if (visited[ckey]) continue;
+			var ctile = getTile(cur.q, cur.r);
+			if (!ctile || !ctile.occupied || ctile.color !== tile.color) continue;
+			visited[ckey] = true;
+			group.push(ctile);
+			// 6 neighbors
+			var dirs = [[1, 0], [0, 1], [-1, 1], [-1, 0], [0, -1], [1, -1]];
+			for (var d = 0; d < 6; ++d) {
+				var nq = cur.q + dirs[d][0];
+				var nr = cur.r + dirs[d][1];
+				queue.push({
+					q: nq,
+					r: nr
+				});
+			}
+		}
+		if (group.length >= 3) {
+			// Pop group
+			for (var j = 0; j < group.length; ++j) {
+				group[j].pop();
+			}
+			score += group.length;
+			popped = true;
+			combos++;
+		}
+	}
+	if (popped) {
+		scoreTxt.setText(score);
+		if (combos > 1) {
+			LK.getSound('combo').play();
+		}
+		// Chain: after pop, check again after short delay
+		LK.setTimeout(checkAndPopMatches, 400);
+	}
+}
+// --- Can any piece be placed? ---
+function canAnyPieceBePlaced() {
+	for (var i = 0; i < 3; ++i) {
+		var piece = trayPieces[i];
+		if (!piece) continue;
+		// Try all board positions
+		for (var j = 0; j < boardTiles.length; ++j) {
+			var q = boardTiles[j].q;
+			var r = boardTiles[j].r;
+			if (canPlacePiece(piece, q, r)) return true;
+		}
+	}
+	return false;
+}
+// --- Game update (not used for now) ---
+game.update = function () {
+	// No per-frame logic needed
+};
\ No newline at end of file