[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_207":208,"_209":210},"routes/_app.x.$handle.$name",{"_95":94,"_31":44,"_103":85,"_26":104,"_13":14,"_105":-5,"_11":106,"_107":108,"_109":110,"_111":112,"_113":114,"_20":-5,"_115":-5,"_116":-5,"_117":24,"_118":119,"_120":24,"_121":-5,"_122":-5,"_123":124},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_31":44,"_37":45,"_46":-5,"_47":24,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":55,"_56":57,"_58":57,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":24},"version",5,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":14,"_40":41,"_23":24},"previous","deleted",false,"deletedHere","path","frontend/game.js","latestPath","fileId","af4bbf8c-48bf-11f0-b8ad-76b3cceeab13","name","game.js","fileType","script","content","// Indonesian Spider Solitaire Game Logic\n\nclass SpiderSolitaire {\n constructor() {\n this.suits = ['♠']; // Single suit for easier gameplay\n this.ranks = ['A', '2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K'];\n this.deck = [];\n this.tableau = Array(10).fill().map(() => []);\n this.stock = [];\n this.foundation = [];\n this.score = 500;\n this.moves = 0;\n this.startTime = Date.now();\n this.gameWon = false;\n this.selectedCards = [];\n this.moveHistory = [];\n \n this.initializeGame();\n this.setupEventListeners();\n this.startTimer();\n }\n\n // Create a deck of 104 cards (2 standard decks)\n createDeck() {\n this.deck = [];\n for (let deckNum = 0; deckNum < 2; deckNum++) {\n for (let suit of this.suits) {\n for (let rank of this.ranks) {\n this.deck.push({\n suit,\n rank,\n color: suit === '♠' || suit === '♣' ? 'black' : 'red',\n faceUp: false,\n id: `${suit}${rank}${deckNum}`\n });\n }\n }\n }\n }\n\n // Shuffle the deck\n shuffleDeck() {\n for (let i = this.deck.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [this.deck[i], this.deck[j]] = [this.deck[j], this.deck[i]];\n }\n }\n\n // Initialize the game\n initializeGame() {\n this.createDeck();\n this.shuffleDeck();\n this.dealInitialCards();\n this.render();\n }\n\n // Deal initial cards to tableau\n dealInitialCards() {\n let cardIndex = 0;\n \n // Deal cards to columns\n for (let col = 0; col < 10; col++) {\n const numCards = col < 4 ? 6 : 5;\n for (let row = 0; row < numCards; row++) {\n const card = this.deck[cardIndex++];\n card.faceUp = row === numCards - 1; // Only top card face up\n this.tableau[col].push(card);\n }\n }\n \n // Remaining cards go to stock\n this.stock = this.deck.slice(cardIndex);\n }\n\n // Get rank value for comparison\n getRankValue(rank) {\n const values = { 'A': 1, '2': 2, '3': 3, '4': 4, '5': 5, '6': 6, '7': 7, '8': 8, '9': 9, '10': 10, 'J': 11, 'Q': 12, 'K': 13 };\n return values[rank];\n }\n\n // Check if a move is valid\n isValidMove(fromCards, toColumn) {\n if (fromCards.length === 0) return false;\n \n const topCard = fromCards[0];\n const targetColumn = this.tableau[toColumn];\n \n // Can always move to empty column\n if (targetColumn.length === 0) return true;\n \n const targetCard = targetColumn[targetColumn.length - 1];\n \n // Must be descending order\n return this.getRankValue(targetCard.rank) === this.getRankValue(topCard.rank) + 1;\n }\n\n // Check if cards form a valid sequence\n isValidSequence(cards) {\n if (cards.length === 0) return false;\n \n for (let i = 0; i < cards.length - 1; i++) {\n const current = cards[i];\n const next = cards[i + 1];\n \n // Must be same suit and descending\n if (current.suit !== next.suit || \n this.getRankValue(current.rank) !== this.getRankValue(next.rank) + 1) {\n return false;\n }\n }\n return true;\n }\n\n // Get moveable cards from a column\n getMoveableCards(column, cardIndex) {\n const columnCards = this.tableau[column];\n const cards = columnCards.slice(cardIndex);\n \n // Check if sequence is valid\n if (this.isValidSequence(cards)) {\n return cards;\n }\n \n // Return only the clicked card if sequence is invalid\n return [columnCards[cardIndex]];\n }\n\n // Move cards between columns\n moveCards(fromColumn, cardIndex, toColumn) {\n const cards = this.getMoveableCards(fromColumn, cardIndex);\n \n if (!this.isValidMove(cards, toColumn)) {\n return false;\n }\n \n // Save move for undo\n this.moveHistory.push({\n type: 'move',\n fromColumn,\n toColumn,\n cards: [...cards],\n fromIndex: cardIndex\n });\n \n // Remove cards from source\n this.tableau[fromColumn].splice(cardIndex);\n \n // Add cards to destination\n this.tableau[toColumn].push(...cards);\n \n // Flip top card if needed\n this.flipTopCards();\n \n // Check for complete sequences\n this.checkCompleteSequences();\n \n this.moves++;\n this.score = Math.max(0, this.score - 1);\n this.updateUI();\n \n return true;\n }\n\n // Flip top cards that should be face up\n flipTopCards() {\n for (let col = 0; col < 10; col++) {\n const column = this.tableau[col];\n if (column.length > 0) {\n const topCard = column[column.length - 1];\n if (!topCard.faceUp) {\n topCard.faceUp = true;\n }\n }\n }\n }\n\n // Check for complete sequences (K to A)\n checkCompleteSequences() {\n for (let col = 0; col < 10; col++) {\n const column = this.tableau[col];\n if (column.length >= 13) {\n // Check last 13 cards\n const last13 = column.slice(-13);\n if (this.isCompleteSequence(last13)) {\n // Remove complete sequence\n this.foundation.push(last13);\n this.tableau[col].splice(-13);\n this.score += 100;\n \n // Flip new top card\n this.flipTopCards();\n \n // Check win condition\n if (this.foundation.length === 8) {\n this.gameWon = true;\n this.showGameOver();\n }\n }\n }\n }\n }\n\n // Check if 13 cards form a complete sequence K-A\n isCompleteSequence(cards) {\n if (cards.length !== 13) return false;\n \n const expectedRanks = ['K', 'Q', 'J', '10', '9', '8', '7', '6', '5', '4', '3', '2', 'A'];\n \n for (let i = 0; i < 13; i++) {\n if (cards[i].rank !== expectedRanks[i] || !cards[i].faceUp) {\n return false;\n }\n }\n \n // All cards must be same suit\n const suit = cards[0].suit;\n return cards.every(card => card.suit === suit);\n }\n\n // Deal new cards from stock\n dealFromStock() {\n if (this.stock.length === 0) return false;\n \n // Must have at least one card in each column\n for (let col = 0; col < 10; col++) {\n if (this.tableau[col].length === 0) {\n alert('Semua kolom harus memiliki kartu sebelum membagikan kartu baru!');\n return false;\n }\n }\n \n // Save move for undo\n const dealtCards = [];\n \n // Deal one card to each column\n for (let col = 0; col < 10; col++) {\n if (this.stock.length > 0) {\n const card = this.stock.pop();\n card.faceUp = true;\n this.tableau[col].push(card);\n dealtCards.push({ column: col, card });\n }\n }\n \n this.moveHistory.push({\n type: 'deal',\n cards: dealtCards\n });\n \n this.moves++;\n this.score = Math.max(0, this.score - 1);\n this.updateUI();\n this.render();\n \n return true;\n }\n\n // Undo last move\n undo() {\n if (this.moveHistory.length === 0) return false;\n \n const lastMove = this.moveHistory.pop();\n \n if (lastMove.type === 'move') {\n // Move cards back\n const cards = this.tableau[lastMove.toColumn].splice(-lastMove.cards.length);\n this.tableau[lastMove.fromColumn].splice(lastMove.fromIndex, 0, ...cards);\n } else if (lastMove.type === 'deal') {\n // Return cards to stock\n for (const { column, card } of lastMove.cards.reverse()) {\n this.tableau[column].pop();\n this.stock.push(card);\n card.faceUp = false;\n }\n }\n \n this.moves = Math.max(0, this.moves - 1);\n this.score = Math.min(500, this.score + 1);\n this.updateUI();\n this.render();\n \n return true;\n }\n\n // Setup event listeners\n setupEventListeners() {\n // New game button\n document.getElementById('new-game').addEventListener('click', () => {\n this.newGame();\n });\n \n // Undo button\n document.getElementById('undo').addEventListener('click', () => {\n this.undo();\n });\n \n // Hint button\n document.getElementById('hint').addEventListener('click', () => {\n this.showHint();\n });\n \n // Stock pile\n document.getElementById('stock-pile').addEventListener('click', () => {\n this.dealFromStock();\n });\n \n // Play again button\n document.getElementById('play-again').addEventListener('click', () => {\n this.hideGameOver();\n this.newGame();\n });\n \n // Card click handlers will be added in render()\n }\n\n // Start new game\n newGame() {\n this.tableau = Array(10).fill().map(() => []);\n this.stock = [];\n this.foundation = [];\n this.score = 500;\n this.moves = 0;\n this.startTime = Date.now();\n this.gameWon = false;\n this.selectedCards = [];\n this.moveHistory = [];\n \n this.initializeGame();\n }\n\n // Show hint\n showHint() {\n // Simple hint: highlight possible moves\n let hintFound = false;\n \n for (let fromCol = 0; fromCol < 10; fromCol++) {\n const column = this.tableau[fromCol];\n if (column.length === 0) continue;\n \n for (let cardIndex = 0; cardIndex < column.length; cardIndex++) {\n const card = column[cardIndex];\n if (!card.faceUp) continue;\n \n const moveableCards = this.getMoveableCards(fromCol, cardIndex);\n \n for (let toCol = 0; toCol < 10; toCol++) {\n if (fromCol === toCol) continue;\n \n if (this.isValidMove(moveableCards, toCol)) {\n // Highlight the move\n const cardElement = document.querySelector(`[data-card-id=\"${card.id}\"]`);\n const columnElement = document.getElementById(`column-${toCol}`);\n \n if (cardElement && columnElement) {\n cardElement.classList.add('selected');\n columnElement.classList.add('drop-target');\n \n setTimeout(() => {\n cardElement.classList.remove('selected');\n columnElement.classList.remove('drop-target');\n }, 2000);\n \n hintFound = true;\n break;\n }\n }\n }\n if (hintFound) break;\n }\n if (hintFound) break;\n }\n \n if (!hintFound) {\n alert('Tidak ada langkah yang tersedia. Coba bagikan kartu baru dari tumpukan!');\n }\n }\n\n // Update UI elements\n updateUI() {\n document.getElementById('score').textContent = this.score;\n document.getElementById('moves').textContent = this.moves;\n document.getElementById('stock-count').textContent = this.stock.length;\n document.getElementById('undo').disabled = this.moveHistory.length === 0;\n }\n\n // Start timer\n startTimer() {\n setInterval(() => {\n if (!this.gameWon) {\n const elapsed = Math.floor((Date.now() - this.startTime) / 1000);\n const minutes = Math.floor(elapsed / 60);\n const seconds = elapsed % 60;\n document.getElementById('timer').textContent = \n `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n }\n }, 1000);\n }\n\n // Show game over modal\n showGameOver() {\n const elapsed = Math.floor((Date.now() - this.startTime) / 1000);\n const minutes = Math.floor(elapsed / 60);\n const seconds = elapsed % 60;\n const timeString = `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n \n document.getElementById('final-score').textContent = this.score;\n document.getElementById('final-moves').textContent = this.moves;\n document.getElementById('final-time').textContent = timeString;\n document.getElementById('game-over-modal').classList.remove('hidden');\n }\n\n // Hide game over modal\n hideGameOver() {\n document.getElementById('game-over-modal').classList.add('hidden');\n }\n\n // Render the game board\n render() {\n this.renderTableau();\n this.renderFoundation();\n this.updateUI();\n }\n\n // Render tableau columns\n renderTableau() {\n for (let col = 0; col < 10; col++) {\n const columnElement = document.getElementById(`column-${col}`);\n columnElement.innerHTML = '';\n \n const cards = this.tableau[col];\n cards.forEach((card, index) => {\n const cardElement = this.createCardElement(card, col, index);\n cardElement.style.top = `${index * 20}px`;\n columnElement.appendChild(cardElement);\n });\n }\n }\n\n // Render foundation area\n renderFoundation() {\n const foundationArea = document.getElementById('foundation-area');\n foundationArea.innerHTML = '';\n \n this.foundation.forEach((sequence, index) => {\n const pileElement = document.createElement('div');\n pileElement.className = 'foundation-pile';\n \n const topCard = sequence[0]; // King is on top\n const cardElement = this.createCardElement(topCard, -1, -1);\n cardElement.classList.add('sequence-complete');\n \n pileElement.appendChild(cardElement);\n foundationArea.appendChild(pileElement);\n });\n \n // Show placeholder if no sequences completed\n if (this.foundation.length === 0) {\n foundationArea.innerHTML = '

Urutan lengkap akan muncul di sini

';\n }\n }\n\n // Create card element\n createCardElement(card, column, index) {\n const cardElement = document.createElement('div');\n cardElement.className = 'card';\n cardElement.dataset.cardId = card.id;\n cardElement.dataset.column = column;\n cardElement.dataset.index = index;\n \n if (card.faceUp) {\n cardElement.classList.add('card-face', card.color);\n cardElement.innerHTML = `\n

${card.rank}

${card.suit}

${card.rank}

${card.suit}

\n `;\n } else {\n cardElement.classList.add('card-back');\n cardElement.innerHTML = `\n

🇮🇩

\n `;\n }\n \n // Add click handler for tableau cards\n if (column >= 0 && card.faceUp) {\n cardElement.addEventListener('click', (e) => {\n e.stopPropagation();\n this.handleCardClick(column, index);\n });\n }\n \n return cardElement;\n }\n\n // Handle card clicks\n handleCardClick(column, cardIndex) {\n if (this.selectedCards.length === 0) {\n // Select cards\n this.selectedCards = this.getMoveableCards(column, cardIndex);\n this.selectedCards.forEach(card => {\n const element = document.querySelector(`[data-card-id=\"${card.id}\"]`);\n if (element) element.classList.add('selected');\n });\n } else {\n // Try to move selected cards\n const fromColumn = parseInt(document.querySelector('.card.selected').dataset.column);\n const fromIndex = parseInt(document.querySelector('.card.selected').dataset.index);\n \n if (this.moveCards(fromColumn, fromIndex, column)) {\n // Move successful\n this.clearSelection();\n this.render();\n } else {\n // Invalid move, clear selection and select new cards\n this.clearSelection();\n this.selectedCards = this.getMoveableCards(column, cardIndex);\n this.selectedCards.forEach(card => {\n const element = document.querySelector(`[data-card-id=\"${card.id}\"]`);\n if (element) element.classList.add('selected');\n });\n }\n }\n }\n\n // Clear card selection\n clearSelection() {\n document.querySelectorAll('.card.selected').forEach(card => {\n card.classList.remove('selected');\n });\n this.selectedCards = [];\n }\n}\n\n// Initialize game when page loads\ndocument.addEventListener('DOMContentLoaded', () => {\n new SpiderSolitaire();\n});","createdAt",["D",1749864856525],"branchVersion","branchId","c72ab906-48be-11f0-9001-76b3cceeab13","id","c72a3c1a-48be-11f0-9001-76b3cceeab13","spider-sol",["D",1749864467088],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","12dc2dbc-b67f-44e1-a015-e97495f6121a","pinnedFileId","51e87204-48bf-11f0-8b40-76b3cceeab13","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","eda87447-ba5f-475f-884b-57629968d6c5","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_95":94,"_102":98},"org",{"_95":94,"_96":-5,"_97":98,"_18":53,"_99":100,"_101":24},"branch",{"_13":84,"_31":85,"_42":41,"_86":43,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":44,"_93":94},"isOwned",16,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","feb","handle","displayName","avatar","https://secure.gravatar.com/avatar/76d4e67d2ae663b1e5b5ca20ed36eb17&d=identicon","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_42":43,"_31":44,"_37":203,"_46":-5,"_47":24,"_48":49,"_50":49,"_51":-5,"_52":-5,"_18":53,"_54":55,"_56":57,"_58":57,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":204,"_79":205,"_81":206,"_83":24},"tree",[161,163,167],"files",[161,162,163,164,165,166,167],"counts",{"_151":61,"_152":132,"_153":61,"_154":155,"_156":157},"contents",[125,126,127],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_42":145,"_31":146,"_29":147,"_131":-5,"_40":41,"_39":148,"_133":57,"_37":149,"_13":61,"_33":143,"_35":-5,"_23":24,"_136":-5,"_26":150},{"_42":138,"_31":139,"_29":140,"_131":-5,"_40":41,"_39":141,"_133":57,"_37":142,"_13":61,"_33":143,"_35":-5,"_23":24,"_136":-5,"_26":144},{"_42":128,"_31":129,"_29":130,"_131":-5,"_40":41,"_39":132,"_133":24,"_37":134,"_13":61,"_33":20,"_35":135,"_23":24,"_136":-5,"_26":137},"4bd437cc-48bf-11f0-87d2-76b3cceeab13","README.md","4bd43876-48bf-11f0-87d2-76b3cceeab13","parentId",1,"latest",["D",1749864689658],"# Indonesian Spider Solitaire\n\nA beautiful Spider Solitaire card game with Indonesian cultural themes and imagery.\n\n## Features\n\n- Classic Spider Solitaire gameplay (1-suit difficulty)\n- Indonesian-themed card designs and backgrounds\n- Traditional Indonesian colors and patterns\n- Responsive design for desktop and mobile\n- Score tracking and move counter\n- Undo functionality\n- Auto-complete when possible\n\n## Game Rules\n\nSpider Solitaire is played with a standard deck of cards arranged in 10 columns:\n- 6 cards in the first 4 columns (top 5 face down, 1 face up)\n- 5 cards in the last 6 columns (top 4 face down, 1 face up)\n- Remaining cards form the stock pile\n\n**Objective:** Build complete sequences from King to Ace in the same suit.\n\n**Gameplay:**\n- Move cards between columns in descending order\n- Only face-up cards can be moved\n- Complete sequences (K-Q-J-10-9-8-7-6-5-4-3-2-A) are automatically removed\n- Click the stock pile to deal new cards when no moves are available\n- Game is won when all cards are removed from the tableau\n\n## Project Structure\n\n```\n├── backend/\n│ └── index.ts # Hono server for serving static files\n├── frontend/\n│ ├── index.html # Main game interface\n│ ├── game.js # Game logic and mechanics\n│ └── style.css # Indonesian-themed styling\n└── README.md\n```\n\n## Indonesian Theme Elements\n\n- **Colors:** Traditional Indonesian colors (red, white, gold, brown)\n- **Patterns:** Batik-inspired card backs and decorative elements\n- **Typography:** Clean, readable fonts with Indonesian flair\n- **Background:** Subtle Indonesian cultural motifs","label",[129],"643e4672-48bf-11f0-aa3b-76b3cceeab13","frontend","06c7fe14-6830-45ac-b831-6fba656a8af3",3,["D",1749864730616],"directory",[139],"51e87b96-48bf-11f0-8b40-76b3cceeab13","backend","d13c113e-bd90-460e-af67-8ada38dd3632",2,["D",1749864699855],[146],"pulls","branches","forks","envVars",{"_158":61,"_160":61},"connections",{"_158":61,"_159":61},"count","unfilledCount","emptyCount",{"_42":145,"_31":146,"_29":147,"_131":-5,"_40":41,"_39":148,"_133":57,"_37":200,"_13":61,"_33":143,"_35":-5,"_23":24,"_136":-5,"_169":201,"_26":202},{"_42":194,"_31":195,"_29":55,"_131":147,"_40":41,"_39":148,"_133":24,"_37":196,"_13":61,"_33":34,"_35":197,"_23":24,"_136":-5,"_169":198,"_26":199},{"_42":138,"_31":139,"_29":140,"_131":-5,"_40":41,"_39":141,"_133":57,"_37":191,"_13":61,"_33":143,"_35":-5,"_23":24,"_136":-5,"_169":192,"_26":193},{"_42":187,"_31":32,"_29":30,"_131":140,"_40":41,"_39":14,"_133":24,"_37":188,"_13":61,"_33":34,"_35":36,"_23":24,"_136":-5,"_169":189,"_26":190},{"_42":180,"_31":181,"_29":182,"_131":140,"_40":41,"_39":141,"_133":24,"_37":183,"_13":61,"_33":20,"_35":184,"_23":24,"_136":-5,"_169":185,"_26":186},{"_42":172,"_31":173,"_29":174,"_131":140,"_40":41,"_39":175,"_133":24,"_37":176,"_13":61,"_33":20,"_35":177,"_23":24,"_136":-5,"_169":178,"_26":179},{"_42":128,"_31":129,"_29":130,"_131":-5,"_40":41,"_39":132,"_133":24,"_37":168,"_13":61,"_33":20,"_35":135,"_23":24,"_136":-5,"_169":170,"_26":171},["D",1749864689658],"children",[],[129],"7cc70210-48bf-11f0-abc5-76b3cceeab13","style.css","7cc702b0-48bf-11f0-abc5-76b3cceeab13",4,["D",1749864771779],"/* Indonesian Spider Solitaire Styles */\n\n:root {\n --indonesian-red: #ff0000;\n --indonesian-white: #ffffff;\n --indonesian-gold: #ffd700;\n --batik-brown: #8b4513;\n --card-width: 80px;\n --card-height: 112px;\n --card-spacing: 20px;\n}\n\n* {\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n margin: 0;\n padding: 0;\n user-select: none;\n}\n\n/* Game Board Layout */\n.game-board {\n max-width: 1200px;\n margin: 0 auto;\n}\n\n.stock-area {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.stock-pile {\n position: relative;\n transition: transform 0.2s ease;\n}\n\n.stock-pile:hover {\n transform: scale(1.05);\n}\n\n.stock-count {\n position: absolute;\n top: -10px;\n right: -10px;\n background: var(--indonesian-red);\n color: white;\n border-radius: 50%;\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 12px;\n font-weight: bold;\n border: 2px solid white;\n}\n\n/* Tableau Layout */\n.tableau {\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n gap: 8px;\n margin-bottom: 20px;\n}\n\n.column {\n min-height: 200px;\n position: relative;\n border: 2px dashed rgba(139, 69, 19, 0.3);\n border-radius: 8px;\n padding: 4px;\n transition: background-color 0.2s ease;\n}\n\n.column.drop-target {\n background-color: rgba(255, 215, 0, 0.2);\n border-color: var(--indonesian-gold);\n}\n\n.column.invalid-drop {\n background-color: rgba(255, 0, 0, 0.1);\n border-color: var(--indonesian-red);\n}\n\n/* Card Styles */\n.card {\n width: var(--card-width);\n height: var(--card-height);\n border-radius: 8px;\n position: absolute;\n cursor: pointer;\n transition: all 0.2s ease;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n border: 1px solid #ccc;\n}\n\n.card:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);\n}\n\n.card.dragging {\n transform: rotate(5deg) scale(1.05);\n z-index: 1000;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);\n}\n\n.card.selected {\n border: 2px solid var(--indonesian-gold);\n box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);\n}\n\n/* Card Back Design */\n.card-back {\n background: linear-gradient(135deg, var(--indonesian-red) 0%, #cc0000 100%);\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n overflow: hidden;\n}\n\n.batik-pattern {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-image: \n radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.1) 2px, transparent 2px),\n radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.1) 2px, transparent 2px),\n radial-gradient(circle at 40% 60%, rgba(255, 255, 255, 0.05) 1px, transparent 1px);\n background-size: 20px 20px, 25px 25px, 15px 15px;\n}\n\n.card-center {\n font-size: 24px;\n z-index: 1;\n position: relative;\n}\n\n/* Card Face Design */\n.card-face {\n background: white;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 6px;\n position: relative;\n}\n\n.card-face.red {\n color: var(--indonesian-red);\n}\n\n.card-face.black {\n color: #333;\n}\n\n.card-rank {\n font-size: 14px;\n font-weight: bold;\n line-height: 1;\n}\n\n.card-suit {\n font-size: 12px;\n line-height: 1;\n}\n\n.card-center-suit {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n font-size: 32px;\n opacity: 0.8;\n}\n\n.card-bottom {\n transform: rotate(180deg);\n align-self: flex-end;\n}\n\n/* Foundation Area */\n.foundation {\n text-align: center;\n}\n\n#foundation-area {\n min-height: var(--card-height);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-wrap: wrap;\n gap: 10px;\n}\n\n.foundation-pile {\n position: relative;\n}\n\n.foundation-pile .card {\n position: relative;\n}\n\n/* Modal Styles */\n.modal {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.7);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 2000;\n}\n\n.modal.hidden {\n display: none;\n}\n\n.modal-content {\n background: white;\n padding: 30px;\n border-radius: 12px;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);\n max-width: 400px;\n width: 90%;\n}\n\n.stats {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.stat-item {\n display: flex;\n justify-content: space-between;\n padding: 8px 12px;\n background: #f5f5f5;\n border-radius: 6px;\n}\n\n.stat-item .label {\n font-weight: 500;\n color: #666;\n}\n\n.stat-item .value {\n font-weight: bold;\n color: var(--indonesian-red);\n}\n\n/* Animations */\n@keyframes cardFlip {\n 0% { transform: rotateY(0deg); }\n 50% { transform: rotateY(90deg); }\n 100% { transform: rotateY(0deg); }\n}\n\n.card.flipping {\n animation: cardFlip 0.6s ease-in-out;\n}\n\n@keyframes sequenceComplete {\n 0% { transform: scale(1); }\n 50% { transform: scale(1.1); }\n 100% { transform: scale(1); }\n}\n\n.sequence-complete {\n animation: sequenceComplete 0.8s ease-in-out;\n}\n\n/* Responsive Design */\n@media (max-width: 1024px) {\n :root {\n --card-width: 70px;\n --card-height: 98px;\n }\n \n .tableau {\n gap: 6px;\n }\n \n .card-center-suit {\n font-size: 28px;\n }\n}\n\n@media (max-width: 768px) {\n :root {\n --card-width: 60px;\n --card-height: 84px;\n }\n \n .tableau {\n gap: 4px;\n }\n \n .card-center-suit {\n font-size: 24px;\n }\n \n .card-rank {\n font-size: 12px;\n }\n \n .card-suit {\n font-size: 10px;\n }\n \n header .container {\n padding: 12px 16px;\n }\n \n header h1 {\n font-size: 18px;\n }\n \n header .flex {\n flex-direction: column;\n gap: 12px;\n align-items: flex-start;\n }\n}\n\n@media (max-width: 480px) {\n :root {\n --card-width: 50px;\n --card-height: 70px;\n }\n \n .tableau {\n gap: 2px;\n }\n \n .card-center-suit {\n font-size: 20px;\n }\n \n .container {\n padding-left: 8px;\n padding-right: 8px;\n }\n}",[],[139,173],"643e2a02-48bf-11f0-aa3b-76b3cceeab13","index.html","643e2ae8-48bf-11f0-aa3b-76b3cceeab13",["D",1749864730616],"\n\n\n \n \n Indonesian Spider Solitaire\n \n \n \n\n\n \n

🕷️ Spider Solitaire Indonesia

\n 🇮🇩 Permainan Kartu Tradisional\n

\n Skor:\n 500\n

\n Langkah:\n 0\n

\n Waktu:\n 00:00\n

\n\n \n

\n \n \n \n

\n Susun kartu dari Raja ke As dalam urutan yang sama\n

\n\n \n

\n \n

🇮🇩

\n\n \n

Urutan Lengkap

\n \n

\n\n \n \n\n \n\n",[],[139,181],"af4bbeec-48bf-11f0-b8ad-76b3cceeab13",["D",1749864856525],[],[139,32],["D",1749864730616],[164,165,166],[139],"51e87132-48bf-11f0-8b40-76b3cceeab13","index.ts",["D",1749864699855],"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Serve frontend files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve the main game page\napp.get(\"/\", async c => {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// Health check endpoint\napp.get(\"/health\", c => {\n return c.json({ status: \"ok\", game: \"Indonesian Spider Solitaire\" });\n});\n\nexport default app.fetch;",[],[146,195],["D",1749864699855],[162],[146],["D",1749864467088],{"_95":94,"_102":98},{"_95":94,"_96":-5,"_97":98,"_18":53,"_99":100,"_101":24},{"_13":84,"_31":85,"_42":41,"_86":43,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":44,"_93":94},"ctx",{"_77":-5,"_122":240,"_241":242,"_243":244,"_245":24,"_246":24,"_247":24,"_248":57,"_249":-5,"_250":-7,"_251":-7,"_252":61,"_253":24,"_254":24,"_255":-5,"_256":24,"_257":24,"_258":24,"_259":-5},"ENV",{"_211":212,"_213":214,"_215":85,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Urutan Lengkap

Selamat!

Diff · v5