\n {currentWordIndex}/{totalWords}\n

\n \n {lastTimeBonus !== null && lastTimeBonus !== 0\n ? (lastTimeBonus > 0 ? `+${lastTimeBonus}s` : `${lastTimeBonus}s`)\n : \"+0s\"}\n \n {formatTime(elapsedTime)}\n

\n );\n}",[207,110,217],"efed3f56-55ef-11f0-8ded-f69ea79377d9","NextWord.tsx","cbd7888c-55c3-11f0-bad6-f69ea79377d9",64,["D",1751314945920],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\nexport function NextWord({ word }: { word: string }) {\n return (\n

\n Next Word: {word}\n

\n );\n}",[207,110,224],"14e1a67e-5606-11f0-add7-f69ea79377d9","Menu.tsx","08ae2092-54e6-11f0-9ba8-f69ea79377d9",71,["D",1751324456852],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface MenuProps {\n onStartGame: (setNumber: number) => void;\n}\n\nexport function Menu({ onStartGame }: MenuProps) {\n return (\n

\n Is It Two Words?\n

a word game by Alex Wein

\n\n

\n If you see a word: swipe left to right.\n
\n If you see a word backwards: swipe right to left.\n
\n If it's a word and a backwards word: swipe back and forth.\n
\n There's a time bonus if you correctly swipe both ways. And a penalty if you swipe something that isn't a\n word.\n

\n\n

\n onStartGame(1)}\n >\n Play Set 1\n \n onStartGame(2)}\n >\n Play Set 2\n \n onStartGame(3)}\n >\n Play Set 3\n \n

\n );\n}",[207,110,231],"f9c57812-5604-11f0-b52a-f69ea79377d9","LastWord.tsx","cbd77db0-55c3-11f0-bad6-f69ea79377d9",["D",1751323981861],5,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface LastWordProps {\n word: any;\n path: string;\n lastTimeBonus: number | null;\n}\n\nexport function LastWord({ word, path, lastTimeBonus }: LastWordProps) {\n const validateLeft = (word, path) => {\n if (path.includes(\"LR\") && word.ltr === true) return \" ✅\";\n if (path.includes(\"LR\") && word.ltr === false) return \" ❌\";\n };\n\n const validateRight = (word, path) => {\n if (path.includes(\"RL\") && word.rtl === true) return \" ✅\";\n if (path.includes(\"RL\") && word.rtl === false) return \" ❌\";\n };\n\n return (\n

\n Last Word:\n \n {word?.text}\n {word ? validateLeft(word, path) : \"\"}\n \n \n {word ? word.text.split(\"\").reverse().join(\"\") : \"\"}\n {word ? validateRight(word, path) : \"\"}\n \n {lastTimeBonus !== null && lastTimeBonus !== 0 && (\n \n {lastTimeBonus > 0 ? `+${lastTimeBonus}s` : `${lastTimeBonus}s`}\n \n )}\n {lastTimeBonus === 0 && }\n

\n );\n}",[207,110,238],"0f9f1890-5377-11f0-b09d-f69ea79377d9","History.tsx","0f9f1958-5377-11f0-b09d-f69ea79377d9",25,["D",1751043127672],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface HistoryEntry {\n word: string;\n path: string;\n}\n\ninterface HistoryProps {\n history: HistoryEntry[];\n}\n\nexport function History({ history }: HistoryProps) {\n if (history.length === 0) {\n return null;\n }\n\n return (\n

History

\n \n \n \n \n \n \n \n \n {history.map((entry, index) => (\n \n \n \n \n ))}\n \n

Word	Path
{entry.word}	{entry.path}

\n );\n}",[207,110,245],"f9c55738-5604-11f0-b52a-f69ea79377d9","GameOver.tsx","f9c557e2-5604-11f0-b52a-f69ea79377d9",["D",1751323981861],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface MenuProps {\n onStartGame: (setNumber: number) => void;\n onBackToMenu: () => void;\n gameStartTime: number;\n gameEndTime: number;\n timeAdjustment: number;\n history: any[];\n selectedSet: number;\n}\n\nexport function GameOver(\n { onStartGame, onBackToMenu, gameStartTime, gameEndTime, timeAdjustment, history, selectedSet }: MenuProps,\n) {\n const elapsed = Math.floor((gameEndTime - gameStartTime) / 1000) + timeAdjustment;\n\n const shareText = `I finished Is It Two Words? Set ${selectedSet} in ${elapsed} seconds. https://twowords.val.run/`;\n return (\n

\n Is It Two Words?\n

a word game by Alex Wein

\n\n

\n Nice Job! You completed Set {selectedSet} in {elapsed} seconds!\n

\n {\n navigator.clipboard.writeText(shareText);\n }}\n >\n Copy results to clipboard!\n \n\n

\n onStartGame(1)}\n >\n Play Set 1\n \n onStartGame(2)}\n >\n Play Set 2\n \n onStartGame(3)}\n >\n Play Set 3\n \n

\n );\n}",[207,110,252],"efed3844-55ef-11f0-8ded-f69ea79377d9","CurrentWord.tsx","f773731a-5376-11f0-bebf-f69ea79377d9",["D",1751314945920],24,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useRef, useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface CurrentWordProps {\n word: string;\n path: string[];\n onPathUpdate: (path: string[]) => void;\n onWordComplete: () => void;\n}\n\nexport function CurrentWord({ word, path, onPathUpdate, onWordComplete }: CurrentWordProps) {\n const containerRef = useRef(null);\n const isDragging = useRef(false);\n const lastHitbox = useRef(null);\n const [activeHitbox, setActiveHitbox] = useState(null);\n\n const getHitboxFromPoint = (x, y) => {\n const container = containerRef.current;\n if (!container) return null;\n\n const rect = container.getBoundingClientRect();\n const relativeX = x - rect.left;\n const relativeY = y - rect.top;\n\n // Check if point is within container bounds\n if (relativeX < 0 || relativeX > rect.width || relativeY < 0 || relativeY > rect.height) {\n return null;\n }\n\n // Determine which hitbox based on x position (left or right half)\n return relativeX < rect.width / 2 ? \"L\" : \"R\";\n };\n\n const handlePointerDown = (e) => {\n isDragging.current = true;\n const hitbox = getHitboxFromPoint(e.clientX, e.clientY);\n\n if (hitbox) {\n onPathUpdate([...path, hitbox]);\n lastHitbox.current = hitbox;\n setActiveHitbox(hitbox);\n }\n\n // Capture pointer to continue receiving events even if pointer moves outside element\n e.currentTarget.setPointerCapture(e.pointerId);\n };\n\n const handlePointerMove = (e) => {\n if (!isDragging.current) return;\n\n const currentHitbox = getHitboxFromPoint(e.clientX, e.clientY);\n\n // Update active hitbox based on current position\n setActiveHitbox(currentHitbox);\n\n // Only add to path if we're still inside the container and moved to a different hitbox\n if (currentHitbox && currentHitbox !== lastHitbox.current) {\n onPathUpdate([...path, currentHitbox]);\n lastHitbox.current = currentHitbox;\n }\n };\n\n const handlePointerUp = (e) => {\n isDragging.current = false;\n lastHitbox.current = null;\n setActiveHitbox(null);\n e.currentTarget.releasePointerCapture(e.pointerId);\n\n // When dragging ends, trigger word completion if there's a path\n if (path.length > 0) {\n onWordComplete();\n }\n };\n\n return (\n \n

{word}

\n \n );\n}",[207,110,258],"f9c56bf6-5604-11f0-b52a-f69ea79377d9",["D",1751323981861],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { CurrentWord } from \"/frontend/components/CurrentWord.tsx\";\nimport { GameOver } from \"/frontend/components/GameOver.tsx\";\nimport { LastWord } from \"/frontend/components/LastWord.tsx\";\nimport { Menu } from \"/frontend/components/Menu.tsx\";\nimport { NextWord } from \"/frontend/components/NextWord.tsx\";\nimport { ScoreBoard } from \"/frontend/components/ScoreBoard.tsx\";\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function App() {\n type View = \"newGame\" | \"gameplay\" | \"gameOver\";\n\n const [gameStarted, setGameStarted] = useState(false);\n const [wordlist, setWordlist] = useState([]);\n const [fullWordlist, setFullWordlist] = useState([]); // Store the complete wordlist\n const [selectedSet, setSelectedSet] = useState(null);\n const [loading, setLoading] = useState(true);\n const [path, setPath] = useState([]);\n const [currentWordIndex, setCurrentWordIndex] = useState(0);\n const [history, setHistory] = useState([]);\n const [timer, setTimer] = useState(0);\n const [lastWord, setLastWord] = useState({ word: \"\", path: \"\", timeBonus: null });\n const [gameStartTime, setGameStartTime] = useState(null);\n const [gameEndTime, setGameEndTime] = useState(null);\n const [timeAdjustment, setTimeAdjustment] = useState(0); // Track bonus/penalty seconds\n const [lastTimeBonus, setLastTimeBonus] = useState(null); // Track last bonus for display (temporary for scoreboard)\n const [currentView, setCurrentView] = useState(\"newGame\");\n\n // Fetch wordlist from backend\n useEffect(() => {\n const fetchWordlist = async () => {\n try {\n const response = await fetch(\"/api/wordlist\");\n const data = await response.json();\n setFullWordlist(data);\n } catch (error) {\n console.error(\"Failed to fetch wordlist:\", error);\n // Fallback to simple word objects if fetch fails\n setFullWordlist([\n { text: \"elpmaxe\", ltr: false, rtl: true, palindrome: false },\n { text: \"string\", ltr: true, rtl: false, palindrome: false },\n { text: \"radar\", ltr: true, rtl: true, palindrome: true },\n { text: \"dessert\", ltr: true, rtl: true, palindrome: false },\n ]);\n } finally {\n setLoading(false);\n }\n };\n\n fetchWordlist();\n }, []);\n\n const getWordSet = (setNumber: number) => {\n if (setNumber === 1) {\n return fullWordlist.slice(0, 25); // First 25 words\n } else if (setNumber === 2) {\n return fullWordlist.slice(25, 50); // Next 25 words (indices 25-49)\n } else {\n return fullWordlist.slice(50); // Remaining words (from index 50 onwards)\n }\n };\n\n const handleStartGame = (setNumber: number) => {\n const selectedWordSet = getWordSet(setNumber);\n setWordlist(selectedWordSet);\n setSelectedSet(setNumber);\n setCurrentWordIndex(0); // Reset to first word of the set\n setHistory([]); // Clear history\n setTimeAdjustment(0); // Reset time adjustment\n setLastWord({ word: \"\", path: \"\", timeBonus: null }); // Reset last word\n setCurrentView(\"gameplay\");\n setGameStartTime(Date.now());\n };\n\n const handleBackToMenu = () => {\n setCurrentView(\"newGame\");\n setSelectedSet(null);\n setWordlist([]);\n setCurrentWordIndex(0);\n setHistory([]);\n setTimeAdjustment(0);\n setLastWord({ word: \"\", path: \"\", timeBonus: null });\n setGameStartTime(null);\n setGameEndTime(null);\n };\n\n const handlePathUpdate = (newPath) => {\n setPath(newPath);\n };\n\n const validateWord = (word, path) => {\n // only consider the first 3 hits of the path\n switch (path.slice(0, 3)) {\n case \"LR\":\n if (word.ltr === true) return { valid: true, bonus: 0 };\n return { valid: false, bonus: 4 };\n case \"RL\":\n if (word.rtl === true) return { valid: true, bonus: 0 };\n return { valid: false, bonus: 4 };\n case \"RLR\":\n if (word.ltr === true && word.rtl === true) return { valid: true, bonus: -2 }; // +2 seconds\n return { valid: false, bonus: 4 };\n case \"LRL\":\n if (word.ltr === true && word.rtl === true) return { valid: true, bonus: -2 }; // +2 seconds\n return { valid: false, bonus: 4 };\n default:\n return { valid: false, bonus: 4 }; // -4 seconds\n }\n };\n\n const handleWordComplete = () => {\n if (path.length === 1) {\n setPath([]);\n return;\n }\n // When word is completed, log current word and path to history, then move to next word\n const currentWord = wordlist[currentWordIndex];\n const pathString = path.join(\"\");\n const validation = validateWord(currentWord, pathString);\n\n // Apply time adjustment\n setTimeAdjustment(prev => prev + validation.bonus);\n\n // Only set lastTimeBonus if it's not zero\n if (validation.bonus !== 0) {\n setLastTimeBonus(validation.bonus);\n // Clear the bonus display after 2 seconds\n setTimeout(() => setLastTimeBonus(null), 2000);\n }\n\n setHistory(prev => [...prev, { word: currentWord.text, path: pathString, validation: validation }]);\n setLastWord({ word: currentWord, path: pathString, timeBonus: validation.bonus });\n setPath([]); // Reset path\n\n if (currentWordIndex === wordlist.length - 1) {\n setCurrentView(\"gameOver\");\n setGameEndTime(Date.now());\n }\n setCurrentWordIndex(prev => (prev + 1)); // Move to next word, wrap around\n };\n\n // Show menu if game hasn't started\n if (currentView === \"newGame\") {\n return ;\n }\n\n if (currentView === \"gameOver\") {\n return (\n \n );\n }\n\n // Show loading state while fetching wordlist\n if (loading) {\n return (\n

Loading words...

\n );\n }\n\n // Don't render if wordlist is empty\n if (wordlist.length === 0) {\n return (\n

No words available

\n );\n }\n\n if (currentView === \"gameplay\") {\n return (\n

\n Is It Two Words?\n

a word game by Alex Wein

\n \n \n \n\n {/*

Current Path: {path.join(\"\")}

*/}\n\n \n

\n );\n }\n}",[207,110,72],"pulls","branches","forks","envVars",{"_275":127,"_277":127},"connections",{"_275":127,"_276":127},"count","unfilledCount","emptyCount",{"_37":386,"_13":376,"_70":371,"_47":-5,"_39":40,"_201":44,"_202":24,"_41":387,"_43":127,"_73":111,"_204":-5,"_75":30,"_205":-5,"_303":388,"_17":389},{"_37":377,"_13":378,"_70":122,"_47":371,"_39":40,"_201":379,"_202":24,"_41":380,"_43":89,"_73":381,"_204":382,"_75":30,"_205":383,"_303":384,"_17":385},{"_37":368,"_13":369,"_70":370,"_47":371,"_39":40,"_201":219,"_202":24,"_41":372,"_43":104,"_73":74,"_204":373,"_75":30,"_205":-5,"_303":374,"_17":375},{"_37":364,"_13":207,"_70":200,"_47":-5,"_39":40,"_201":44,"_202":24,"_41":365,"_43":127,"_73":111,"_204":-5,"_75":30,"_205":-5,"_303":366,"_17":367},{"_37":199,"_13":110,"_70":109,"_47":200,"_39":40,"_201":44,"_202":24,"_41":361,"_43":127,"_73":111,"_204":-5,"_75":30,"_205":-5,"_303":362,"_17":363},{"_37":264,"_13":72,"_70":71,"_47":109,"_39":40,"_201":219,"_202":24,"_41":358,"_43":247,"_73":74,"_204":266,"_75":30,"_205":-5,"_303":359,"_17":360},{"_37":257,"_13":258,"_70":259,"_47":109,"_39":40,"_201":226,"_202":24,"_41":355,"_43":261,"_73":74,"_204":262,"_75":30,"_205":-5,"_303":356,"_17":357},{"_37":251,"_13":252,"_70":253,"_47":109,"_39":40,"_201":219,"_202":24,"_41":352,"_43":127,"_73":74,"_204":255,"_75":30,"_205":-5,"_303":353,"_17":354},{"_37":244,"_13":245,"_70":246,"_47":109,"_39":40,"_201":247,"_202":24,"_41":349,"_43":127,"_73":74,"_204":249,"_75":30,"_205":-5,"_303":350,"_17":351},{"_37":237,"_13":238,"_70":239,"_47":109,"_39":40,"_201":219,"_202":24,"_41":346,"_43":241,"_73":74,"_204":242,"_75":30,"_205":-5,"_303":347,"_17":348},{"_37":230,"_13":231,"_70":232,"_47":109,"_39":40,"_201":233,"_202":24,"_41":343,"_43":89,"_73":74,"_204":235,"_75":30,"_205":-5,"_303":344,"_17":345},{"_37":223,"_13":224,"_70":225,"_47":109,"_39":40,"_201":226,"_202":24,"_41":340,"_43":44,"_73":74,"_204":228,"_75":30,"_205":-5,"_303":341,"_17":342},{"_37":216,"_13":217,"_70":218,"_47":109,"_39":40,"_201":219,"_202":24,"_41":337,"_43":26,"_73":74,"_204":221,"_75":30,"_205":-5,"_303":338,"_17":339},{"_37":330,"_13":331,"_70":332,"_47":200,"_39":40,"_201":147,"_202":24,"_41":333,"_43":89,"_73":21,"_204":334,"_75":30,"_205":-5,"_303":335,"_17":336},{"_37":322,"_13":323,"_70":324,"_47":200,"_39":40,"_201":325,"_202":24,"_41":326,"_43":26,"_73":21,"_204":327,"_75":30,"_205":-5,"_303":328,"_17":329},{"_37":315,"_13":316,"_70":317,"_47":200,"_39":40,"_201":44,"_202":24,"_41":318,"_43":127,"_73":74,"_204":319,"_75":30,"_205":-5,"_303":320,"_17":321},{"_37":306,"_13":307,"_70":308,"_47":200,"_39":40,"_201":309,"_202":24,"_41":310,"_43":311,"_73":21,"_204":312,"_75":30,"_205":-5,"_303":313,"_17":314},{"_37":296,"_13":297,"_70":298,"_47":-5,"_39":40,"_201":299,"_202":24,"_41":300,"_43":301,"_73":21,"_204":302,"_75":30,"_205":-5,"_303":304,"_17":305},"9819bc16-5679-11f0-836e-f69ea79377d9","README.md","29ee1cf0-abef-4cb8-9e22-49d1fbb5cdbf",74,["D",1751374069120],20,"## Is It *Two* Words\n\nHere's another little word game.\nIdentify whether the letters in the middle box spell a word going forwards, backwards or both.\n\n### How to Play\n\n1. Choose a word set from the main menu\n2. For each word displayed:\n - If it's a word reading left-to-right: **swipe left to right**\n - If it's a word reading right-to-left: **swipe right to left** \n - If it's both: **swipe back and forth**\n3. There's a time bonus if you correctly swipe both ways. And a penalty if you swipe something that isn't a word.\n\n### todos:\n\n- think through colors\n- capitalize words?\n- pick an okay font\n- display a little more info in LastWord ✅\n- split wordlist into chunks? ✅\n- add game over state ✅\n - count number of incorrect guesses\n - count number of bonuses\n - share link ✅\n - record plays in db\n- should I name it \"Stressed Desserts\"?\n - is it two words?\n - stressed desserts\n - this might have too much search volume already\n - emagdrow","children",[],[297],"377772fe-5606-11f0-9da1-f69ea79377d9","style.css","731e6046-02d8-42cd-bc36-7d32279fa2cf",72,["D",1751324514874],13,"* {\n box-sizing: border-box;\n}\n\nbody {\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n \"Segoe UI\",\n Roboto,\n Oxygen,\n Ubuntu,\n Cantarell,\n sans-serif;\n color: #333;\n margin: 0;\n padding: 0;\n min-height: 100vh;\n background-color: #f8f8f5;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n /* Safe area padding for devices with notches */\n padding-left: env(safe-area-inset-left);\n padding-right: env(safe-area-inset-right);\n align-items: center;\n justify-content: center;\n}\n\n#root {\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n}\n\nbutton {\n background-color: #4a90e2;\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 8px;\n cursor: pointer;\n font-size: 16px;\n font-weight: 500;\n transition: all 0.2s ease;\n -webkit-tap-highlight-color: transparent;\n touch-action: manipulation;\n}\n\nbutton:hover {\n background-color: #357ae8;\n transform: translateY(-1px);\n}\n\nbutton:active {\n transform: translateY(0);\n}\n\n.container {\n position: relative;\n width: 100%;\n max-width: min(98vw, 500px);\n height: 180px;\n margin: 20px auto;\n background-color: #f8f8f5;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n user-select: none;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n\n@media (min-width: 480px) {\n .container {\n height: 200px;\n }\n}\n\n@media (min-width: 768px) {\n .container {\n max-width: 600px;\n margin: 20px auto;\n height: 220px;\n }\n}\n\n/* Prevent text selection during drag */\n* {\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n\n.center-text {\n position: relative;\n z-index: 2;\n color: #333;\n background-color: #f8f8f5;\n padding: 0.5em 1em;\n font-size: clamp(1.2rem, 4vw, 1.8rem);\n text-align: center;\n font-weight: 500;\n border-radius: 8px;\n width: 75%;\n height: 75%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.hitbox {\n position: absolute;\n top: 0;\n height: 100%;\n width: 50%;\n z-index: 3;\n touch-action: none;\n cursor: pointer;\n}\n\n/* Improve touch targets for mobile */\n@media (max-width: 767px) {\n .hitbox {\n min-height: 44px; /* iOS recommended minimum touch target */\n }\n}\n\n.hitbox.left {\n left: 0;\n}\n\n.hitbox.right {\n right: 0;\n}\n\n.back {\n position: absolute;\n top: 0;\n height: 100%;\n width: 50%;\n z-index: 1;\n}\n\n.back.left {\n left: 0;\n background-color: #add8e6; /* light blue */\n transition: background-color 0.2s ease;\n}\n\n.back.left.active {\n background-color: #87ceeb; /* darker blue when active */\n}\n\n.back.right {\n right: 0;\n background-color: #e6ccff; /* light purple */\n transition: background-color 0.2s ease;\n}\n\n.back.right.active {\n background-color: #d8b3ff; /* darker purple when active */\n}\n\n.game-header {\n width: 100%;\n background: linear-gradient(135deg, #333 0%, #444 100%);\n color: white;\n text-align: center;\n padding: 16px 20px;\n margin: 0;\n flex-shrink: 0;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n /* Safe area padding for devices with notches */\n padding-top: max(16px, env(safe-area-inset-top));\n}\n\n.game-header h1 {\n margin: 0 0 4px 0;\n font-size: clamp(20px, 5vw, 28px);\n font-weight: 600;\n letter-spacing: -0.5px;\n}\n\n.game-header div {\n font-size: clamp(12px, 3vw, 14px);\n opacity: 0.9;\n font-weight: 400;\n}\n\n.game-header .nav-link {\n color: #ffd700;\n text-decoration: none;\n margin: 0 10px;\n}\n\n.game-header .nav-link:hover {\n text-decoration: underline;\n}\n\n.menu-container {\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n background: linear-gradient(135deg, #f8f8f5 0%, #e8e8e5 100%);\n}\n\n.menu-content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding: 40px 20px;\n text-align: center;\n max-width: 500px;\n margin: 0 auto;\n width: 100%;\n}\n\n.game-description {\n font-size: clamp(16px, 4vw, 20px);\n line-height: 1.6;\n margin-bottom: 40px;\n color: #555;\n font-weight: 400;\n max-width: 400px;\n text-align: left;\n}\n\n.start-game-button {\n font-size: clamp(18px, 4vw, 22px);\n padding: 18px 36px;\n background: linear-gradient(135deg, #4a90e2 0%, #357ae8 100%);\n color: white;\n border: none;\n border-radius: 12px;\n cursor: pointer;\n font-weight: 600;\n letter-spacing: 0.5px;\n transition: all 0.3s ease;\n box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);\n -webkit-tap-highlight-color: transparent;\n touch-action: manipulation;\n min-width: 200px;\n}\n\n.button-group {\n display: flex;\n flex-direction: column;\n gap: 16px;\n align-items: center;\n}\n\n@media (min-width: 480px) {\n .button-group {\n flex-direction: row;\n justify-content: center;\n flex-wrap: wrap;\n }\n\n .start-game-button {\n min-width: 160px;\n }\n}\n\n.start-game-button:hover {\n background: linear-gradient(135deg, #357ae8 0%, #2968d4 100%);\n transform: translateY(-2px);\n box-shadow: 0 6px 16px rgba(74, 144, 226, 0.4);\n}\n\n.start-game-button:active {\n transform: translateY(0);\n box-shadow: 0 2px 8px rgba(74, 144, 226, 0.3);\n}\n\n.game-container {\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n background: linear-gradient(135deg, #f8f8f5 0%, #e8e8e5 100%);\n}\n\n.game-content {\n flex: 1;\n padding: 16px;\n display: flex;\n flex-direction: column;\n gap: 16px;\n width: 100vw;\n max-width: 650px;\n margin: 0 auto;\n align-items: center;\n}\n\n@media (min-width: 480px) {\n .game-content {\n padding: 20px;\n gap: 20px;\n }\n}\n\n@media (min-width: 768px) {\n .game-content {\n padding: 30px 20px;\n gap: 24px;\n }\n}\n\n/* Loading and error states */\n.loading-container,\n.error-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 100vh;\n padding: 20px;\n text-align: center;\n background: linear-gradient(135deg, #f8f8f5 0%, #e8e8e5 100%);\n}\n\n.loading-container div,\n.error-container div {\n font-size: clamp(16px, 4vw, 20px);\n color: #555;\n font-weight: 500;\n}\n\n/* LastWord component styles */\n.last-word-container {\n width: 100%;\n max-width: min(98vw, 500px);\n padding: 16px;\n border: 1px solid #ddd;\n border-radius: 12px;\n background-color: #fff;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);\n margin: 0 auto;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n}\n\n/* Time bonus display in LastWord component (no fade animation) */\n.last-word-time-bonus {\n font-size: clamp(14px, 3.5vw, 16px);\n font-weight: 700;\n padding: 4px 8px;\n border-radius: 6px;\n flex-shrink: 0;\n}\n\n.last-word-time-bonus.positive {\n background-color: #d4edda;\n color: #155724;\n border: 1px solid #c3e6cb;\n}\n\n.last-word-time-bonus.negative {\n background-color: #f8d7da;\n color: #721c24;\n border: 1px solid #f5c6cb;\n}\n\n/* Text color utilities for LastWord component */\n.text-green {\n color: #28a745;\n font-weight: 600;\n}\n\n.text-gray {\n color: #6c757d;\n}\n\n.last-word-container h3 {\n margin: 0 0 12px 0;\n font-size: clamp(16px, 4vw, 18px);\n font-weight: 600;\n color: #333;\n}\n\n.last-word-content {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n@media (min-width: 480px) {\n .last-word-content {\n flex-direction: row;\n gap: 20px;\n align-items: center;\n }\n}\n\n.last-word-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n@media (min-width: 480px) {\n .last-word-item {\n flex-direction: row;\n gap: 8px;\n align-items: center;\n }\n}\n\n.last-word-label {\n font-weight: 600;\n color: #555;\n font-size: clamp(14px, 3.5vw, 16px);\n}\n\n.last-word-value {\n font-size: clamp(14px, 3.5vw, 16px);\n color: #333;\n}\n\n.last-word-path {\n font-family:\n \"SF Mono\",\n Monaco,\n \"Cascadia Code\",\n \"Roboto Mono\",\n Consolas,\n \"Courier New\",\n monospace;\n font-size: clamp(14px, 3.5vw, 16px);\n background-color: #f0f0f0;\n padding: 4px 8px;\n border-radius: 6px;\n border: 1px solid #e0e0e0;\n}\n\n.last-word-validation {\n font-weight: 600;\n margin-left: 8px;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: clamp(12px, 3vw, 14px);\n}\n\n.last-word-validation.correct {\n background-color: #d4edda;\n color: #155724;\n}\n\n.last-word-validation.incorrect {\n background-color: #f8d7da;\n color: #721c24;\n}\n\n/* NextWord component styles */\n.next-word-container {\n width: 100%;\n max-width: min(98vw, 500px);\n text-align: center;\n padding: 16px;\n background-color: #fff;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);\n border: 1px solid #ddd;\n margin: 0 auto;\n}\n\n.next-word-label {\n font-size: clamp(14px, 3.5vw, 16px);\n color: #666;\n margin-bottom: 8px;\n font-weight: 500;\n}\n\n.next-word-text {\n font-size: clamp(16px, 4vw, 20px);\n color: #333;\n font-weight: 600;\n}\n\n/* ScoreBoard component styles */\n.scoreboard-container {\n width: 100%;\n max-width: min(98vw, 500px);\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n background-color: #fff;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);\n border: 1px solid #ddd;\n margin: 0 auto;\n}\n\n.scoreboard-left {\n display: flex;\n align-items: center;\n flex: 1;\n}\n\n.scoreboard-center {\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1;\n}\n\n.scoreboard-right {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n flex: 1;\n}\n\n.word-progress {\n font-size: clamp(16px, 4vw, 18px);\n font-weight: 600;\n color: #333;\n}\n\n.timer {\n font-size: clamp(16px, 4vw, 18px);\n font-weight: 600;\n color: #4a90e2;\n font-family:\n \"SF Mono\",\n Monaco,\n \"Cascadia Code\",\n \"Roboto Mono\",\n Consolas,\n \"Courier New\",\n monospace;\n}\n\n/* Time bonus/penalty display in scoreboard */\n.time-bonus-display {\n font-size: clamp(14px, 3.5vw, 16px);\n font-weight: 700;\n padding: 4px 8px;\n border-radius: 6px;\n animation: bonusFlash 2s ease-out forwards;\n}\n\n.time-bonus-display.positive {\n background-color: #d4edda;\n color: #155724;\n border: 1px solid #c3e6cb;\n}\n\n.time-bonus-display.negative {\n background-color: #f8d7da;\n color: #721c24;\n border: 1px solid #f5c6cb;\n}\n\n.time-bonus-display.hidden {\n opacity: 0;\n background-color: transparent;\n color: transparent;\n border: 1px solid transparent;\n animation: none;\n}\n\n@keyframes bonusFlash {\n 0% {\n opacity: 0;\n transform: scale(0.8);\n }\n 20% {\n opacity: 1;\n transform: scale(1.05);\n }\n 40% {\n transform: scale(1);\n }\n 100% {\n opacity: 0;\n transform: scale(0.95);\n }\n}\n\n/* Copy button styles */\n.copy-button {\n font-size: clamp(14px, 3.5vw, 16px);\n padding: 12px 24px;\n background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 500;\n transition: all 0.3s ease;\n box-shadow: 0 2px 8px rgba(108, 117, 125, 0.3);\n -webkit-tap-highlight-color: transparent;\n touch-action: manipulation;\n margin-bottom: 20px;\n}\n\n.copy-button:hover {\n background: linear-gradient(135deg, #5a6268 0%, #495057 100%);\n transform: translateY(-1px);\n box-shadow: 0 4px 12px rgba(108, 117, 125, 0.4);\n}\n\n.copy-button:active {\n transform: translateY(0);\n box-shadow: 0 2px 6px rgba(108, 117, 125, 0.3);\n}",[],[207,307],"80530f7c-5130-11f0-b402-f69ea79377d9","index.tsx","69904acc-e989-49ee-8628-4bff2b45ddb0",["D",1750792920080],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[207,316],"b281807c-5677-11f0-b900-f69ea79377d9","index.html","895eb8ac-7e2c-4406-a11e-437689cf4352",73,["D",1751373254428],"\n\n \n \n \n Is It <em>Two</em> Words?\n \n \n \n \n

\n \n \n \n",[],[207,323],"bf7962fa-5743-11f0-bd32-f69ea79377d9","favicon.svg","266ef955-f81b-4a2b-b528-117a49775db9",["D",1751460893520],"\n",[],[207,331],["D",1751323981861],[],[207,110,217],["D",1751314945920],[],[207,110,224],["D",1751324456852],[],[207,110,231],["D",1751323981861],[],[207,110,238],["D",1751043127672],[],[207,110,245],["D",1751323981861],[],[207,110,252],["D",1751314945920],[],[207,110,258],["D",1751323981861],[],[207,110,72],["D",1750792920080],[283,284,285,286,287,288,289,290],[207,110],"805313b4-5130-11f0-b402-f69ea79377d9",["D",1750792920080],[282,291,292,293,294],[207],"f9c565c0-5604-11f0-b52a-f69ea79377d9","wordlist.tsx","91626a82-54e7-11f0-87de-f69ea79377d9","a573a2a2-3bfd-4c81-b9ce-1b41cc01ce78",["D",1751323981861],"export default [\n { \"text\": \"example\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"elpmaxe\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"wow\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"tuba\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"pool\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"stun\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"tned\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"omega\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"raps\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"peek\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"level\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"deer\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"beet\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"step\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"strap\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"hated\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"elbat\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"synonym\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"devil\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"sees\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"rewol\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"serif\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"drawer\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"naeb\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"standard\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"refer\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"stressed\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"rumel\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"reviver\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"part\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"layout\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"deeps\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"tropria\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"boost\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"tide\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"noitareti\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"karet\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"kayak\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"lewov\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"denim\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"redder\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"trapdoor\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"hood\", \"ltr\": false, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"stew\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"star\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"netae\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"ylrae\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"rebut\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"buts\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"krow\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"laets\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"redden\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"ticker\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"typo\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"flesym\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"deke\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"radar\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"deified\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"tram\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"pacer\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"rotator\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"warp\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"repair\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"yaltuo\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"straw\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"steels\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"decal\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"sloops\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"repus\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"decaf\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"civic\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"alibi\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"track\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"layer\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"suruaseht\", \"ltr\": false, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"cafes\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"gator\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"spoons\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"snips\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"community\", \"ltr\": true, \"rtl\": false, \"palindrome\": false },\n { \"text\": \"deed\", \"ltr\": true, \"rtl\": true, \"palindrome\": true },\n { \"text\": \"reknits\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n { \"text\": \"regal\", \"ltr\": true, \"rtl\": true, \"palindrome\": false },\n];",[],[376,369],"backend","5fcde5c4-55b3-11f0-8b4e-f69ea79377d9","index.ts",54,["D",1751288934313],"http","import { serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport wordlist from \"./wordlist.tsx\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", async c => {\n return serveFile(\"/frontend/index.html\", import.meta.url);\n});\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Add your API routes here\napp.get(\"/api/wordlist\", c => c.json(wordlist));\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => {\n throw err;\n});\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;","twowords",[],[376,378],"80530662-5130-11f0-b402-f69ea79377d9",["D",1750792920080],[279,280],[376],["D",1750792920080],{"_11":12,"_164":78},{"_11":12,"_159":160,"_77":78,"_31":76,"_161":162,"_163":30},{"_43":147,"_13":16,"_37":40,"_148":113,"_149":67,"_150":151,"_152":117,"_153":154,"_155":156,"_157":14,"_158":12},"ctx",{"_56":-5,"_185":427,"_428":429,"_430":431,"_432":30,"_433":30,"_434":30,"_435":24,"_436":-5,"_437":-7,"_438":-7,"_439":127,"_440":30,"_441":30,"_442":-5,"_443":30,"_444":30,"_445":30,"_446":-5},"ENV",{"_398":399,"_400":401,"_402":16,"_403":404,"_405":406,"_407":408,"_409":410,"_411":412,"_413":414,"_415":416,"_417":418,"_419":420,"_421":422,"_423":424,"_425":426},"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"]

History · components