PageSourceSearch

https://voidtalker.com/games/

html voidtalker.com collected 2026-10-04 07:54:39 UTC 28,306 bytes, 738 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en" class="dark-mode">
3<head>
4
5    <title>Games</title>
6    <meta charset="utf-8" />
7    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
8    <meta name="HandheldFriendly" content="True" />
9    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
10    
11    <link rel="preload" as="style" href="/assets/built/screen.css?v=97c80cc018" />
12    <link rel="preload" as="script" href="/assets/built/casper.js?v=97c80cc018" />
13
14    <link rel="stylesheet" type="text/css" href="/assets/built/screen.css?v=97c80cc018" />
15
16    <meta name="description" content="A showcase of some single page html vibe coded games. Whimsy at best">
17    <link rel="canonical" href="https://voidtalker.com/games/">
18    <meta name="referrer" content="no-referrer-when-downgrade">
19    
20    <meta property="og:site_name" content="Voidtalker">
21    <meta property="og:type" content="website">
22    <meta property="og:title" content="Games">
23    <meta property="og:description" content="A showcase of some single page html vibe coded games. Whimsy at best">
24    <meta property="og:url" content="https://voidtalker.com/games/">
25    <meta property="og:image" content="https://voidtalker.com/content/images/2025/05/void1.png">
26    <meta property="article:published_time" content="2026-03-27T21:28:16.000Z">
27    <meta property="article:modified_time" content="2026-03-29T00:27:06.000Z">
28    <meta property="article:tag" content="personal">
29    
30    <meta name="twitter:card" content="summary_large_image">
31    <meta name="twitter:title" content="Games">
32    <meta name="twitter:description" content="A showcase of some single page html vibe coded games. Whimsy at best">
33    <meta name="twitter:url" content="https://voidtalker.com/games/">
34    <meta name="twitter:image" content="https://voidtalker.com/content/images/2025/05/void1.png">
35    <meta name="twitter:label1" content="Written by">
36    <meta name="twitter:data1" content="Chris Baldwin">
37    <meta name="twitter:label2" content="Filed under">
38    <meta name="twitter:data2" content="personal">
39    <meta name="twitter:site" content="@voidtalker">
40    <meta name="twitter:creator" content="@chrisbaldwiz">
41    <meta property="og:image:width" content="1024">
42    <meta property="og:image:height" content="1024">
43    
44    
44<script type="application/ld+json">
45{
46    "@context": "https://schema.org",
47    "@type": "Article",
48    "publisher": {
49        "@type": "Organization",
50        "name": "Voidtalker",
51        "url": "https://voidtalker.com/",
52        "logo": {
53            "@type": "ImageObject",
54            "url": "https://voidtalker.com/favicon.ico",
55            "width": 48,
56            "height": 48
57        }
58    },
59    "author": {
60        "@type": "Person",
61        "name": "Chris Baldwin",
62        "image": {
63            "@type": "ImageObject",
64            "url": "https://www.gravatar.com/avatar/cbdb935fa6c997a74f173aa46d4e3926?s=250&r=x&d=mp",
65            "width": 250,
66            "height": 250
67        },
68        "url": "https://voidtalker.com/author/chris/",
69        "sameAs": [
70            "https://voidtalker.com/about/",
71            "https://x.com/chrisbaldwiz",
72            "https://www.youtube.com/@chrisdbaldwin",
73            "https://www.linkedin.com/in/chrisdbaldwin"
74        ]
75    },
76    "headline": "Games",
77    "url": "https://voidtalker.com/games/",
78    "datePublished": "2026-03-27T21:28:16.000Z",
79    "dateModified": "2026-03-29T00:27:06.000Z",
80    "keywords": "personal",
81    "description": "A showcase of some single page html vibe coded games. Whimsy at best",
82    "mainEntityOfPage": "https://voidtalker.com/games/"
83}
84    </script>
84
85
86    <meta name="generator" content="Ghost 6.42">
87    <link rel="alternate" type="application/rss+xml" title="Voidtalker" href="https://voidtalker.com/rss/">
88    
89    
89<script defer src="https://cdn.jsdelivr.net/ghost/sodo-search@~1.8/umd/sodo-search.min.js" data-key="6e97cdeb9c8a602d88ead0f7ce" data-styles="https://cdn.jsdelivr.net/ghost/sodo-search@~1.8/umd/main.css" data-sodo-search="https://voidtalker.com/" data-locale="en" crossorigin="anonymous"></script>
89
90    
91    <link href="https://voidtalker.com/webmentions/receive/" rel="webmention">
92    
92<script defer src="/public/cards.min.js?v=97c80cc018"></script>
92<style>:root {--ghost-accent-color: #c9a555;}</style>
93    <link rel="stylesheet" type="text/css" href="/public/cards.min.css?v=97c80cc018">
94        <!-- Self-hosted fonts: preload above-the-fold + local @font-face.
95         No third-party hop (fonts.gstatic.com), so the real fonts are
96         ready by first paint -> no fallback flicker. -->
97<link rel="preload" href="/fonts/instrumentserif-italic-latin.woff2" as="font" type="font/woff2" crossorigin>
98<link rel="preload" href="/fonts/librecaslon-normal-latin.woff2" as="font" type="font/woff2" crossorigin>
99<link rel="preload" href="/fonts/fraunces-normal-latin.woff2" as="font" type="font/woff2" crossorigin>
100<link rel="preload" href="/fonts/jetbrainsmono-normal-latin.woff2" as="font" type="font/woff2" crossorigin>
101<style>
102@font-face {
103  font-family: 'Fraunces';
104  font-style: normal;
105  font-weight: 300 500;
106  font-display: swap;
107  src: url('/fonts/fraunces-normal-latin.woff2') format('woff2');
108  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
109}
110@font-face {
111  font-family: 'Fraunces';
112  font-style: normal;
113  font-weight: 300 500;
114  font-display: swap;
115  src: url('/fonts/fraunces-normal-latinext.woff2') format('woff2');
116  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
117}
118@font-face {
119  font-family: 'Fraunces';
120  font-style: italic;
121  font-weight: 300 400;
122  font-display: swap;
123  src: url('/fonts/fraunces-italic-latin.woff2') format('woff2');
124  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
125}
126@font-face {
127  font-family: 'Fraunces';
128  font-style: italic;
129  font-weight: 300 400;
130  font-display: swap;
131  src: url('/fonts/fraunces-italic-latinext.woff2') format('woff2');
132  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
133}
134@font-face {
135  font-family: 'Instrument Serif';
136  font-style: italic;
137  font-weight: 400;
138  font-display: swap;
139  src: url('/fonts/instrumentserif-italic-latin.woff2') format('woff2');
140  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
141}
142@font-face {
143  font-family: 'Instrument Serif';
144  font-style: italic;
145  font-weight: 400;
146  font-display: swap;
147  src: url('/fonts/instrumentserif-italic-latinext.woff2') format('woff2');
148  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
149}
150@font-face {
151  font-family: 'Libre Caslon Display';
152  font-style: normal;
153  font-weight: 400;
154  font-display: swap;
155  src: url('/fonts/librecaslon-normal-latin.woff2') format('woff2');
156  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
157}
158@font-face {
159  font-family: 'Libre Caslon Display';
160  font-style: normal;
161  font-weight: 400;
162  font-display: swap;
163  src: url('/fonts/librecaslon-normal-latinext.woff2') format('woff2');
164  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
165}
166@font-face {
167  font-family: 'JetBrains Mono';
168  font-style: normal;
169  font-weight: 300 400;
170  font-display: swap;
171  src: url('/fonts/jetbrainsmono-normal-latin.woff2') format('woff2');
172  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
173}
174@font-face {
175  font-family: 'JetBrains Mono';
176  font-style: normal;
177  font-weight: 300 400;
178  font-display: swap;
179  src: url('/fonts/jetbrainsmono-normal-latinext.woff2') format('woff2');
180  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1D
180BF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
181}
182</style>
183
184<style>
185/* ═══ DESIGN TOKENS ═══ */
186:root {
187  --bg: #0c0c10;
188  --bg-warm: #100f13;
189  --bg-surface: #16151b;
190  --bg-surface-hover: #1c1b22;
191  --border-subtle: rgba(200, 185, 155, 0.06);
192  --border-hover: rgba(200, 185, 155, 0.14);
193
194  --text: #cdc8b8;
195  --text-secondary: #938e80;
196  --text-tertiary: #5e5a50;
197
198  --warm: #c9a555;
199  --warm-soft: #a8904d;
200  --warm-glow: rgba(201, 165, 85, 0.08);
201  --teal: #6aad9e;
202  --teal-soft: rgba(106, 173, 158, 0.12);
203  --slate: #8b8aad;
204  --slate-soft: rgba(139, 138, 173, 0.10);
205  --ember: #c47a5a;
206
207  --font-display: 'Libre Caslon Display', Georgia, serif;
208  --font-accent: 'Instrument Serif', Georgia, serif;
209  --font-body: 'Fraunces', Georgia, serif;
210  --font-mono: 'JetBrains Mono', 'Courier New', monospace;
211
212  --text-sm: clamp(1.28rem, 1.2rem + 0.2vw, 1.4rem);
213  --text-base: clamp(1.52rem, 1.44rem + 0.25vw, 1.7rem);
214  --text-lg: clamp(1.84rem, 1.6rem + 0.5vw, 2.16rem);
215  --text-xl: clamp(2.24rem, 1.76rem + 1.2vw, 3.2rem);
216  --text-2xl: clamp(2.88rem, 2.08rem + 2vw, 4.48rem);
217
218  --space-xs: clamp(0.4rem, 0.32rem + 0.2vw, 0.64rem);
219  --space-sm: clamp(0.8rem, 0.64rem + 0.4vw, 1.2rem);
220  --space-md: clamp(1.6rem, 1.36rem + 0.7vw, 2.24rem);
221  --space-lg: clamp(2.8rem, 2.08rem + 2vw, 4.4rem);
222  --space-xl: clamp(4.8rem, 3.2rem + 4vw, 8rem);
223
224  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
225  --ease-smooth: cubic-bezier(0.25, 1, 0.5, 1);
226
227  --ghost-accent-color: #c9a555 !important;
228}
229
230
231/* ═══ BASE ═══ */
232html { scrollbar-width: thin; scrollbar-color: var(--warm-soft) var(--bg); }
233
234body {
235  background: var(--bg) !important;
236  color: var(--text) !important;
237  font-family: var(--font-body) !important;
238  font-size: var(--text-base) !important;
239  line-height: 1.72;
240  font-weight: 300;
241  font-optical-sizing: auto;
242  -webkit-font-smoothing: antialiased;
243}
244
245body::before {
246  content: '';
247  position: fixed;
248  inset: 0;
249  background:
250    radial-gradient(ellipse at 15% 50%, rgba(201, 165, 85, 0.025) 0%, transparent 55%),
251    radial-gradient(ellipse at 85% 25%, rgba(106, 173, 158, 0.018) 0%, transparent 50%),
252    radial-gradient(ellipse at 50% 90%, rgba(196, 122, 90, 0.015) 0%, transparent 45%);
253  pointer-events: none;
254  z-index: 0;
255}
256
257body::after {
258  content: '';
259  position: fixed;
260  inset: 0;
261  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.018'/%3E%3C/svg%3E");
262  pointer-events: none;
263  z-index: 9999;
264}
265
266.viewport { position: relative; z-index: 1; }
267
268::selection { background: rgba(201, 165, 85, 0.25); color: var(--text); }
269
270
271/* ═══ HEADER / NAV ═══ */
272.gh-head {
273  background: transparent !important;
274  border-bottom: 1px solid var(--border-subtle) !important;
275}
276.gh-head-inner { background: transparent !important; }
277
278.gh-head-logo, .gh-head-logo.no-image {
279  font-family: var(--font-display) !important;
280  color: var(--text) !important;
281  font-size: var(--text-lg) !important;
282  font-weight: 400 !important;
283}
284
285.gh-head-menu .nav a {
286  font-family: var(--font-mono) !important;
287  font-size: 14px !important;
288  letter-spacing: 1.5px !important;
289  text-transform: uppercase !important;
290  color: var(--text-secondary) !important;
291  transition: color 0.3s var(--ease-out);
292}
293.gh-head-menu .nav a:hover,
294.gh-head-menu .nav .nav-current a { color: var(--warm) !important; }
295
296.gh-head .gh-icon-btn, .gh-burger { color: var(--text-secondary) !important; }
297.gh-head .gh-icon-btn:hover, .gh-burger:hover { color: var(--warm) !important; }
298
299.gh-dropdown {
300  background: var(--bg-surface) !important;
301  border: 1px solid var(--border-subtle) !important;
302  border-radius: 5px !important;
303}
304.gh-dropdown a { color: var(--text-secondary) !important; }
305.gh-dropdown a:hover { color: var(--warm) !important; background: var(--bg-surface-hover) !important; }
306
307.gh-head-open .gh-head-inner { background: var(--bg) !important; }
308
309
310/* ═══ SITE HEADER ═══ */
311.site-header-content { background: var(--bg) !important; }
312.site-header-cover {
313  opacity: 0.25 !important;
314  filter: saturate(0.4) brightness(0.6);
315  mix-blend-mode: luminosity;
316}
317.site-description {
318  font-family: var(--font-accent) !important;
319  font-style: italic;
320  color: var(--warm) !important;
321  font-size: var(--text-2xl) !important;
322  font-weight: 400 !important;
323}
324
325
326/* ═══ POST CARDS ═══ */
327.post-card {
328  background: var(--bg-surface) !important;
329  border: 1px solid var(--border-subtle) !important;
330  border-radius: 5px !important;
331  overflow: hidden;
332  transition: border-color 0.4s, transform 0.35s var(--ease-smooth) !important;
333}
334.post-card:hover {
335  border-color: var(--border-hover) !important;
336  transform: translateY(-2px) !important;
337}
338
339.post-card-image {
340  transition: transform 0.5s var(--ease-smooth), filter 0.5s;
341  filter: saturate(0.85) brightness(0.9);
342}
343.post-card:hover .post-card-image {
344  transform: scale(1.03);
345  filter: saturate(1) brightness(1);
346}
347
348.post-card-title {
349  font-family: var(--font-display) !important;
350  font-weight: 400 !important;
351  color: var(--text) !important;
352  line-height: 1.25 !important;
353}
354
355.post-card-excerpt {
356  font-family: var(--font-body) !important;
357  color: var(--text-secondary) !important;
358  font-weight: 300 !important;
359  font-size: var(--text-base) !important;
360  line-height: 1.72 !important;
361}
362
363.post-card-primary-tag {
364  font-family: var(--font-mono) !important;
365  font-size: 12px !important;
366  letter-spacing: 2px !important;
367  text-transform: uppercase !important;
368  color: var(--teal) !important;
369}
370
371.post-card-meta {
372  color: var(--text-tertiary) !important;
373  font-family: var(--font-mono) !important;
374  font-size: 13px !important;
375  padding: 0 var(--space-md) var(--space-md) !important;
376}
377.post-card-large .post-card-meta {
378  padding: 0 var(--space-lg) var(--space-lg) !important;
379}
380.post-card-meta-date,
381.post-card-meta-length {
382  color: var(--text-tertiary) !important;
383  font-family: var(--font-mono) !important;
384  font-size: 13px !important;
385}
386
387.post-card-large { border-color: var(--border-hover) !important; }
388
389/* Post card content padding (fix for text flush against card edges) */
390.post-card-content-link {
391  padding: 0 var(--space-md) var(--space-sm) !important;
392}
393.post-card-large .post-card-content-link {
394  padding: var(--space-md) var(--space-lg) var(--space-sm) !important;
395}
396
397
398/* ═══ LINKS ═══ */
399a { color: var(--warm) !important; text-decoration: none !important; }
400.post-card-content-link, .post-card-content-link:hover { color: inherit !important; opacity: 1 !important; }
401.post-card-title, .post-card-title a { color: var(--text) !important; }
402.gh-head-logo, .gh-head-logo:hover { color: var(--text) !important; opacity: 1 !important; }
403
404
405/* ═══ ARTICLE PAGES ═══ */
406.gh-article-title, .article-title {
407  font-family: var(--font-display) !important;
408  font-weight: 400 !important;
409  color: var(--text) !important;
410  line-height: 1.18 !important;
411}
412
413.gh-content, .article-body {
414  font-family: var(--font-body) !important;
415  color: var(--text) !important;
416  font-weight: 300 !important;
417  line-height: 1.72 !important;
418}
419
420.gh-content h1, .gh-content h2, .gh-content h3, .gh-content h4 {
421  font-family: var(--font-display) !important;
422  font-weight: 400 !important;
423  color: var(--text) !important;
424}
425.gh-content h2 { font-size: var(--text-2xl) !important; }
426.gh-content h3 { font-size: var(--text-xl) !important; }
427.gh-content p { color: var(--text) !important; }
428
429.gh-content a {
430  color: var(--warm) !important;
431  background-image: linear-gradient(var(--warm-soft), var(--warm-soft));
432  background-size: 0% 1px;
433  background-position: left bottom;
434  background-repeat: no-repeat;
435  transition: background-size 0.35s var(--ease-out);
436}
437.gh-content a:hover { background-size: 100% 1px; opacity: 1 !important; }
438
439.gh-content code {
440  font-family: var(--font-mono) !important;
441  background: var(--bg-surface) !important;
442  color: var(--teal) !important;
443  padding: 2px 6px;
444  border-radius: 3px;
445  border: 1px solid var(--border-subtle);
446}
447.gh-content pre {
448  background: var(--bg-surface) !important;
449  border: 1px solid var(--border-subtle) !important;
450  border-radius: 5px !important;
451}
452.gh-content pre code { background: transparent !important; border: none !important; color: var(--text) !important; }
453
454.gh-content blockquote {
455  border-left: 2px solid var(--warm-soft) !important;
456  padding-left: 1.2em !important;
457  color: var(--text-secondary) !important;
458  font-family: var(--font-accent) !important;
459  font-style: italic;
460}
461.gh-content > blockquote:not([class])::before {
462  background: transparent !important;
463}
464
465.gh-content hr {
466  border: none !important;
467  height: 1px !important;
468  background: linear-gradient(to right, transparent, var(--border-hover), transparent) !important;
469}
470
471.gh-content figcaption {
472  font-family: var(--font-mono) !important;
473  font-size: 11px !important;
474  color: var(--text-tertiary) !important;
475}
476
477.gh-article-meta, .article-byline {
478  font-family: var(--font-mono) !important;
479  font-size: 11px !important;
480  color: var(--text-tertiary) !important;
481}
482
483.gh-article-tag, .article-tag a {
484  font-family: var(--font-mono) !important;
485  font-size: 10px !important;
486  letter-spacing: 3px !important;
487  text-transform: uppercase !important;
488  color: var(--teal) !important;
489}
490
491
492/* ═══ GHOST CARDS ═══ */
493.kg-callout-card {
494  background: var(--bg-surface) !important;
495  border: 1px solid var(--border-subtle) !important;
496  border-radius: 5px !important;
497  color: var(--text) !important;
498}
499.kg-bookmark-card {
500  border: 1px solid var(--border-subtle) !important;
501  border-radius: 5px !important;
502  background: var(--bg-surface) !important;
503}
504.kg-bookmark-card:hover { border-color: var(--border-hover) !important; }
505.kg-bookmark-title { font-family: var(--font-display) !important; color: var(--text) !important; }
506.kg-bookmark-description { color: var(--text-secondary) !important; }
507.kg-bookmark-metadata { color: var(--text-tertiary) !important; font-family: var(--font-mono) !important; }
508
509
510/* ═══ PAGINATION ═══ */
511.pagination { font-family: var(--font-mono) !important; color: var(--text-tertiary) !important; }
512.pagination .page-number { font-size: 11px !important; color: var(--text-tertiary) !important; }
513.pagination a {
514  color: var(--warm) !important;
515  border: 1px solid rgba(201, 165, 85, 0.25) !important;
516  border-radius: 3px !important;
517  font-family: var(--font-mono) !important;
518  font-size: 11px !important;
519}
520.pagination a:hover { background: var(--warm) !important; color: var(--bg) !important; opacity: 1 !important; }
521
522
523/* ═══ FOOTER ═══ */
524.site-footer {
525  background: transparent !important;
526  border-top: 1px solid var(--border-subtle) !important;
527  color: var(--text-tertiary) !important;
528  font-family: var(--font-mono) !important;
529  font-size: 11px !important;
530}
531.site-footer a { color: var(--text-tertiary) !important; }
532.site-footer a:hover { color: var(--warm) !important; }
533.gh-powered-by { opacity: 0.4; }
534.copyright a { color: var(--text-secondary) !important; }
535
536
537/* ═══ SUBSCRIBE / CTA ═══ */
538.gh-subscribe-input {
539  background: var(--bg) !important;
540  border: 1px solid var(--border-subtle) !important;
541  color: var(--text) !important;
542  font-family: var(--font-mono) !important;
543}
544.gh-subscribe-input:focus { border-color: var(--warm-soft) !important; }
545.gh-subscribe-btn, button[type="submit"] {
546  background: var(--warm) !important;
547  color: var(--bg) !important;
548  font-family: var(--font-mono) !important;
549  font-size: 11px !important;
550  letter-spacing: 1px !important;
551  text-transform: uppercase !important;
552  border-radius: 3px !important;
553}
554
555
556/* ═══ FOCUS ═══ */
557a:focus-visible, button:focus-visible {
558  outline: 2px solid var(--warm) !important;
559  outline-offset: 3px;
560}
561
562/* ═══ PRINT ═══ */
563@media print {
564  body::before, body::after { display: none !important; }
565  body { background: #fff !important; color: #111 !important; }
566}
567</style>
568
569
570<!-- Google tag (gtag.js) -->
vendor: 64 bytes, lines 570-571
570
571<script async src="https://www.googletagmanager.com/gtag/js?id=
571G-T6XWK2EPS3
vendor: 12 bytes, line 571
571"></script>
572<script>
573  
vendor: 134 bytes, lines 573-577
573window.dataLayer = window.dataLayer || [];
574  function gtag(){dataLayer.push(arguments);}
575  gtag('js', new Date());
576
577  gtag('config', '
577G-T6XWK2EPS3
vendor: 4 bytes, line 577
577');
578</script>
578
579    <link rel="preconnect" href="https://fonts.bunny.net"><link rel="stylesheet" href="https://fonts.bunny.net/css?family=inter:400,500,600|manrope:300,500,700"><style>:root {--gh-font-heading: Inter;--gh-font-body: Manrope;}</style>
580
581</head>
582<body class="page-template page-games tag-personal gh-font-heading-inter gh-font-body-manrope is-head-middle-logo has-cover">
583<div class="viewport">
584
585    <header id="gh-head" class="gh-head outer">
586        <div class="gh-head-inner inner">
587            <div class="gh-head-brand">
588                <a class="gh-head-logo no-image" href="https://voidtalker.com">
589                        Voidtalker
590                </a>
591                <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" width="20" height="20"><path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg></button>
592                <button class="gh-burger" aria-label="Main Menu"></button>
593            </div>
594
595            <nav class="gh-head-menu">
596                <ul class="nav">
597    <li class="nav-home"><a href="https://voidtalker.com/">Home</a></li>
598    <li class="nav-about"><a href="https://voidtalker.com/about/">About</a></li>
599    <li class="nav-musings"><a href="https://voidtalker.com/musings/">Musings</a></li>
600    <li class="nav-games nav-current"><a href="https://voidtalker.com/games/">Games</a></li>
601    <li class="nav-oracle"><a href="https://voidtalker.com/oracle/">Oracle</a></li>
602    <li class="nav-urien-lab"><a href="https://github.com/chrisDBaldwin/blueabs-urien-lab">Urien Lab</a></li>
603    <li class="nav-fc-rank"><a href="https://fightcade.voidtalker.com/">FC Rank</a></li>
604    <li class="nav-truthbyte"><a href="https://truthbyte.voidtalker.com">TruthByte</a></li>
605</ul>
606
607            </nav>
608
609            <div class="gh-head-actions">
610                        <button class="gh-search gh-icon-btn" aria-label="Search this site" data-ghost-search><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" width="20" height="20"><path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg></button>
611            </div>
612        </div>
613    </header>
614
615    <div class="site-content">
616        
617
618<style>
619  .games-mount { min-height: 80vh; }
620  /* Hide the Ghost page title/header since index.html has its own */
621  .article-title, .gh-article-header { display: none; }
622</style>
623
624<main class="games-mount"></main>
625
626<script>
627(function() {
628  var mount = document.querySelector('.games-mount');
629  fetch('/games/index.html')
630    .then(function(r) { return r.text(); })
631    .then(function(html) {
632      var doc = new DOMParser().parseFromString(html, 'text/html');
633      doc.querySelectorAll('style').forEach(function(s) {
634        document.head.appendChild(s.cloneNode(true));
635      });
636      doc.querySelectorAll('link[href*="fonts"]').forEach(function(l) {
637        if (!document.querySelector('link[href="' + l.getAttribute('href') + '"]')) {
638          document.head.appendChild(l.cloneNode(true));
639        }
640      });
641      var page = doc.querySelector('.page');
642      if (page) {
643        // Remove the static nav bar since Ghost provides its own
644        var nav = page.querySelector('.site-nav');
645        if (nav) nav.remove();
646        mount.appendChild(page);
647        // Rewrite relative links to /games/ prefix
648        page.querySelectorAll('a[href]').forEach(function(a) {
649          var href = a.getAttribute('href');
650          if (href && !href.startsWith('/') && !href.startsWith('http') && href.endsWith('.html')) {
651            a.setAttribute('href', '/games/' + href);
652          }
653        });
654      }
655    })
656    .catch(function() {
657      mount.innerHTML = '<p style="text-align:center;padding:4rem;color:#999;">Unable to load games.</p>';
658    });
659})();
660</script>
660
661
662    </div>
663
664    <footer class="site-footer outer">
665        <div class="inner">
666            <section class="copyright"><a href="https://voidtalker.com">Voidtalker</a> &copy; 2026</section>
667            <nav class="site-footer-nav">
668                
669            </nav>
670            <div class="gh-powered-by"><a href="https://ghost.org/" target="_blank" rel="noopener">Powered by Ghost</a></div>
671        </div>
672    </footer>
673
674</div>
675
676    <div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
677    <div class="pswp__bg"></div>
678
679    <div class="pswp__scroll-wrap">
680        <div class="pswp__container">
681            <div class="pswp__item"></div>
682            <div class="pswp__item"></div>
683            <div class="pswp__item"></div>
684        </div>
685
686        <div class="pswp__ui pswp__ui--hidden">
687            <div class="pswp__top-bar">
688                <div class="pswp__counter"></div>
689
690                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
691                <button class="pswp__button pswp__button--share" title="Share"></button>
692                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
693                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
694
695                <div class="pswp__preloader">
696                    <div class="pswp__preloader__icn">
697                        <div class="pswp__preloader__cut">
698                            <div class="pswp__preloader__donut"></div>
699                        </div>
700                    </div>
701                </div>
702            </div>
703
704            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
705                <div class="pswp__share-tooltip"></div>
706            </div>
707
708            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
709            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
710
711            <div class="pswp__caption">
712                <div class="pswp__caption__center"></div>
713            </div>
714        </div>
715    </div>
716</div>
717<script
718    src="https://code.jquery.com/jquery-3.5.1.min.js"
719    integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
720    crossorigin="anonymous">
721</script>
vendor: 1 bytes, line 721
721
722<script src="/assets/built/casper.js?v=97c80cc018"></script>
vendor: 1 bytes, line 722
722
723<script>
724$(document).ready(function () {
725    // Mobile Menu Trigger
726    $('.gh-burger').click(function () {
727        $('body').toggleClass('gh-head-open');
728    });
729    // FitVids - Makes video embeds responsive
730    $(".gh-content").fitVids();
731});
732</script>
732
733
734
735
736<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"f6a6c2ac816a4fea961a6f6fc09ac504","r":1,"spa":2}' crossorigin="anonymous"></script>
736
737</body>
738</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.