npm - synthos - Versions diffs - 0.10.0 → 0.11.0 - Mend

synthos 0.10.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (312) hide show

package/README.md +5 -5
package/default-pages/elevenlabs_effects_studio/chat-history.json +1 -0
package/default-pages/elevenlabs_effects_studio/page.html +1345 -1363
package/default-pages/elevenlabs_effects_studio/page.json +13 -11
package/default-pages/elevenlabs_voice_studio/chat-history.json +1 -0
package/default-pages/elevenlabs_voice_studio/page.html +782 -801
package/default-pages/elevenlabs_voice_studio/page.json +13 -11
package/default-pages/json_tools/chat-history.json +1 -0
package/default-pages/json_tools/page.html +70 -90
package/default-pages/json_tools/page.json +12 -10
package/default-pages/my_notes/chat-history.json +1 -0
package/default-pages/my_notes/page.html +115 -131
package/default-pages/my_notes/page.json +14 -12
package/default-pages/neon_asteroids/chat-history.json +1 -0
package/default-pages/neon_asteroids/page.html +1777 -1803
package/default-pages/neon_asteroids/page.json +14 -12
package/default-pages/oregon_trail/chat-history.json +1 -0
package/default-pages/oregon_trail/page.html +290 -307
package/default-pages/oregon_trail/page.json +14 -12
package/default-pages/solar_explorer/chat-history.json +1 -0
package/default-pages/solar_explorer/page.html +1929 -1951
package/default-pages/solar_explorer/page.json +14 -12
package/default-pages/solar_tutorial/chat-history.json +1 -0
package/default-pages/solar_tutorial/page.html +464 -478
package/default-pages/solar_tutorial/page.json +12 -10
package/default-pages/us_map/chat-history.json +1 -0
package/default-pages/us_map/page.html +170 -193
package/default-pages/us_map/page.json +14 -12
package/default-pages/us_map/page.light.png +0 -0
package/default-pages/us_map_1850/chat-history.json +1 -0
package/default-pages/us_map_1850/page.html +302 -326
package/default-pages/us_map_1850/page.json +14 -12
package/default-pages/western_cities_1850/chat-history.json +1 -0
package/default-pages/western_cities_1850/page.html +503 -527
package/default-pages/western_cities_1850/page.json +14 -12
package/default-themes/aurora-dawn.v3.css +15 -14
package/default-themes/aurora-dusk.v3.css +26 -26
package/default-themes/cosmos-dawn.v3.css +15 -14
package/default-themes/cosmos-dusk.v3.css +26 -26
package/default-themes/elemental-dawn.v3.css +200 -0
package/default-themes/nebula-dawn.v3.css +15 -14
package/default-themes/nebula-dusk.v3.css +24 -24
package/default-themes/solar-flare-dawn.v3.css +15 -14
package/default-themes/solar-flare-dusk.v3.css +26 -26
package/dist/builders/anthropic.d.ts +26 -2
package/dist/builders/anthropic.d.ts.map +1 -1
package/dist/builders/anthropic.js +132 -31
package/dist/builders/anthropic.js.map +1 -1
package/dist/builders/claudecode.d.ts +13 -0
package/dist/builders/claudecode.d.ts.map +1 -0
package/dist/builders/claudecode.js +253 -0
package/dist/builders/claudecode.js.map +1 -0
package/dist/builders/index.d.ts +2 -1
package/dist/builders/index.d.ts.map +1 -1
package/dist/builders/index.js +8 -1
package/dist/builders/index.js.map +1 -1
package/dist/builders/openai.js +2 -1
package/dist/builders/openai.js.map +1 -1
package/dist/builders/types.d.ts +31 -7
package/dist/builders/types.d.ts.map +1 -1
package/dist/builders/types.js +60 -28
package/dist/builders/types.js.map +1 -1
package/dist/connectors/types.d.ts +8 -0
package/dist/connectors/types.d.ts.map +1 -1
package/dist/init.d.ts.map +1 -1
package/dist/init.js +13 -6
package/dist/init.js.map +1 -1
package/dist/migrations.d.ts.map +1 -1
package/dist/migrations.js +161 -14
package/dist/migrations.js.map +1 -1
package/dist/models/anthropic.d.ts +1 -0
package/dist/models/anthropic.d.ts.map +1 -1
package/dist/models/anthropic.js +129 -29
package/dist/models/anthropic.js.map +1 -1
package/dist/models/chainOfThought.d.ts.map +1 -1
package/dist/models/chainOfThought.js +32 -19
package/dist/models/chainOfThought.js.map +1 -1
package/dist/models/index.d.ts +2 -2
package/dist/models/index.d.ts.map +1 -1
package/dist/models/index.js +2 -1
package/dist/models/index.js.map +1 -1
package/dist/models/providers.d.ts +1 -0
package/dist/models/providers.d.ts.map +1 -1
package/dist/models/providers.js +12 -4
package/dist/models/providers.js.map +1 -1
package/dist/models/types.d.ts +15 -1
package/dist/models/types.d.ts.map +1 -1
package/dist/models/types.js.map +1 -1
package/dist/pages.d.ts +57 -8
package/dist/pages.d.ts.map +1 -1
package/dist/pages.js +258 -45
package/dist/pages.js.map +1 -1
package/dist/service/createCompletePrompt.d.ts.map +1 -1
package/dist/service/createCompletePrompt.js +5 -0
package/dist/service/createCompletePrompt.js.map +1 -1
package/dist/service/mediaCache.d.ts +36 -0
package/dist/service/mediaCache.d.ts.map +1 -0
package/dist/service/mediaCache.js +182 -0
package/dist/service/mediaCache.js.map +1 -0
package/dist/service/pageValidator.d.ts +25 -0
package/dist/service/pageValidator.d.ts.map +1 -0
package/dist/service/pageValidator.js +315 -0
package/dist/service/pageValidator.js.map +1 -0
package/dist/service/server.d.ts.map +1 -1
package/dist/service/server.js +4 -0
package/dist/service/server.js.map +1 -1
package/dist/service/sharedTableSchema.d.ts +73 -0
package/dist/service/sharedTableSchema.d.ts.map +1 -0
package/dist/service/sharedTableSchema.js +206 -0
package/dist/service/sharedTableSchema.js.map +1 -0
package/dist/service/transformPage.d.ts +49 -11
package/dist/service/transformPage.d.ts.map +1 -1
package/dist/service/transformPage.js +354 -241
package/dist/service/transformPage.js.map +1 -1
package/dist/service/useApiRoutes.d.ts.map +1 -1
package/dist/service/useApiRoutes.js +288 -34
package/dist/service/useApiRoutes.js.map +1 -1
package/dist/service/useConnectorRoutes.d.ts.map +1 -1
package/dist/service/useConnectorRoutes.js +170 -32
package/dist/service/useConnectorRoutes.js.map +1 -1
package/dist/service/useDataRoutes.d.ts.map +1 -1
package/dist/service/useDataRoutes.js +59 -2
package/dist/service/useDataRoutes.js.map +1 -1
package/dist/service/useExtractRoutes.d.ts +4 -0
package/dist/service/useExtractRoutes.d.ts.map +1 -0
package/dist/service/useExtractRoutes.js +304 -0
package/dist/service/useExtractRoutes.js.map +1 -0
package/dist/service/usePageRoutes.d.ts +17 -0
package/dist/service/usePageRoutes.d.ts.map +1 -1
package/dist/service/usePageRoutes.js +1385 -483
package/dist/service/usePageRoutes.js.map +1 -1
package/dist/service/useSharedDataRoutes.d.ts.map +1 -1
package/dist/service/useSharedDataRoutes.js +54 -2
package/dist/service/useSharedDataRoutes.js.map +1 -1
package/dist/settings.d.ts +27 -0
package/dist/settings.d.ts.map +1 -1
package/dist/settings.js +40 -1
package/dist/settings.js.map +1 -1
package/dist/themes.d.ts +0 -5
package/dist/themes.d.ts.map +1 -1
package/dist/themes.js +3 -95
package/dist/themes.js.map +1 -1
package/migration-rules/v2-to-v3.md +277 -119
package/package.json +5 -1
package/{default-pages/application → required-pages/_shell}/page.html +56 -42
package/required-pages/_shell/page.json +14 -0
package/required-pages/_starters/page.html +534 -0
package/required-pages/_starters/page.json +12 -0
package/required-pages/builder/page.html +353 -43
package/required-pages/builder/page.json +12 -10
package/required-pages/pages/page.html +697 -924
package/required-pages/pages/page.json +12 -10
package/required-pages/settings/page.html +1879 -1753
package/required-pages/settings/page.json +12 -10
package/required-pages/synthos_apis/page.html +834 -845
package/required-pages/synthos_apis/page.json +12 -10
package/required-pages/synthos_scripts/page.html +74 -88
package/required-pages/synthos_scripts/page.json +12 -10
package/scripts/append-instructions.py +90 -0
package/scripts/audit-instructions.py +76 -0
package/scripts/cleanup-shell-markup.mjs +112 -0
package/service-connectors/buffer/connector.json +46 -0
package/service-connectors/canva/connector.json +67 -0
package/service-connectors/elevenlabs/connector.json +1 -1
package/src/builders/anthropic.ts +155 -30
package/src/builders/claudecode.ts +310 -0
package/src/builders/index.ts +7 -1
package/src/builders/openai.ts +2 -1
package/src/builders/types.ts +93 -32
package/src/connectors/types.ts +8 -0
package/src/init.ts +13 -7
package/src/migrations.ts +187 -16
package/src/models/anthropic.ts +140 -30
package/src/models/chainOfThought.ts +33 -18
package/src/models/index.ts +2 -2
package/src/models/providers.ts +12 -3
package/src/models/types.ts +21 -1
package/src/pages.ts +271 -35
package/src/service/createCompletePrompt.ts +6 -0
package/src/service/mediaCache.ts +206 -0
package/src/service/pageValidator.ts +337 -0
package/src/service/server.ts +4 -0
package/src/service/sharedTableSchema.ts +236 -0
package/src/service/transformPage.ts +370 -260
package/src/service/useApiRoutes.ts +282 -32
package/src/service/useConnectorRoutes.ts +189 -34
package/src/service/useDataRoutes.ts +198 -116
package/src/service/useExtractRoutes.ts +331 -0
package/src/service/usePageRoutes.ts +1411 -394
package/src/service/useSharedDataRoutes.ts +184 -109
package/src/settings.ts +65 -0
package/src/themes.ts +78 -180
package/starters/blank_starter/chat-history.json +1 -0
package/starters/blank_starter/page.dark.png +0 -0
package/starters/blank_starter/page.html +47 -0
package/starters/blank_starter/page.json +13 -0
package/starters/blank_starter/page.light.png +0 -0
package/starters/calculator_starter/chat-history.json +1 -0
package/starters/calculator_starter/page.dark.png +0 -0
package/starters/calculator_starter/page.html +232 -0
package/starters/calculator_starter/page.json +13 -0
package/starters/calculator_starter/page.light.png +0 -0
package/starters/calendar_starter/chat-history.json +1 -0
package/starters/calendar_starter/page.dark.png +0 -0
package/starters/calendar_starter/page.html +495 -0
package/starters/calendar_starter/page.json +13 -0
package/starters/calendar_starter/page.light.png +0 -0
package/starters/chat_starter/chat-history.json +1 -0
package/starters/chat_starter/page.dark.png +0 -0
package/starters/chat_starter/page.html +351 -0
package/starters/chat_starter/page.json +13 -0
package/starters/chat_starter/page.light.png +0 -0
package/starters/checklist_starter/chat-history.json +1 -0
package/starters/checklist_starter/page.dark.png +0 -0
package/starters/checklist_starter/page.html +437 -0
package/starters/checklist_starter/page.json +13 -0
package/starters/checklist_starter/page.light.png +0 -0
package/starters/dashboard_starter/chat-history.json +1 -0
package/starters/dashboard_starter/page.dark.png +0 -0
package/starters/dashboard_starter/page.html +195 -0
package/starters/dashboard_starter/page.json +13 -0
package/starters/dashboard_starter/page.light.png +0 -0
package/starters/form_starter/chat-history.json +1 -0
package/starters/form_starter/page.dark.png +0 -0
package/starters/form_starter/page.html +313 -0
package/starters/form_starter/page.json +13 -0
package/starters/form_starter/page.light.png +0 -0
package/starters/gallery_starter/chat-history.json +1 -0
package/starters/gallery_starter/page.dark.png +0 -0
package/starters/gallery_starter/page.html +418 -0
package/starters/gallery_starter/page.json +13 -0
package/starters/gallery_starter/page.light.png +0 -0
package/starters/generator_starter/chat-history.json +1 -0
package/starters/generator_starter/page.dark.png +0 -0
package/starters/generator_starter/page.html +261 -0
package/starters/generator_starter/page.json +13 -0
package/starters/generator_starter/page.light.png +0 -0
package/starters/index.html +538 -0
package/starters/kanban_starter/chat-history.json +1 -0
package/starters/kanban_starter/page.dark.png +0 -0
package/starters/kanban_starter/page.html +432 -0
package/starters/kanban_starter/page.json +13 -0
package/starters/kanban_starter/page.light.png +0 -0
package/starters/presentation_builder/chat-history.json +1 -0
package/starters/presentation_builder/page.dark.png +0 -0
package/starters/presentation_builder/page.html +970 -0
package/starters/presentation_builder/page.json +15 -0
package/starters/presentation_builder/page.light.png +0 -0
package/starters/presentation_builder/presentation_voice/voice_config.json +9 -0
package/starters/pulse_starter/chat-history.json +1 -0
package/starters/pulse_starter/page.dark.png +0 -0
package/starters/pulse_starter/page.html +698 -0
package/starters/pulse_starter/page.json +13 -0
package/starters/pulse_starter/page.light.png +0 -0
package/starters/quiz_starter/chat-history.json +1 -0
package/starters/quiz_starter/page.dark.png +0 -0
package/starters/quiz_starter/page.html +292 -0
package/starters/quiz_starter/page.json +13 -0
package/starters/quiz_starter/page.light.png +0 -0
package/starters/reference_starter/chat-history.json +1 -0
package/starters/reference_starter/page.dark.png +0 -0
package/starters/reference_starter/page.html +250 -0
package/starters/reference_starter/page.json +13 -0
package/starters/reference_starter/page.light.png +0 -0
package/starters/retro_game_starter/chat-history.json +1 -0
package/starters/retro_game_starter/page.dark.png +0 -0
package/{default-pages → starters}/retro_game_starter/page.html +1281 -1308
package/starters/retro_game_starter/page.json +15 -0
package/starters/retro_game_starter/page.light.png +0 -0
package/starters/roster_starter/chat-history.json +1 -0
package/starters/roster_starter/page.dark.png +0 -0
package/starters/roster_starter/page.html +600 -0
package/starters/roster_starter/page.json +13 -0
package/starters/roster_starter/page.light.png +0 -0
package/starters/server.js +182 -0
package/starters/start.cmd +1 -0
package/starters/timeline_starter/chat-history.json +1 -0
package/starters/timeline_starter/page.dark.png +0 -0
package/starters/timeline_starter/page.html +446 -0
package/starters/timeline_starter/page.json +13 -0
package/starters/timeline_starter/page.light.png +0 -0
package/starters/tutorial_starter/chat-history.json +1 -0
package/starters/tutorial_starter/page.dark.png +0 -0
package/starters/tutorial_starter/page.html +283 -0
package/starters/tutorial_starter/page.json +13 -0
package/starters/tutorial_starter/page.light.png +0 -0
package/static-files/agent.v3.js +122 -0
package/static-files/connector.v3.js +48 -0
package/static-files/extract.v3.js +188 -0
package/static-files/helpers.v3.js +50 -6
package/static-files/page-bridge.js +114 -0
package/static-files/page.v3.js +1292 -1290
package/static-files/script.v3.js +32 -0
package/static-files/server.v3.js +89 -0
package/static-files/shell-bridge.v3.js +174 -0
package/static-files/shell-modals.v3.js +521 -0
package/static-files/{shell.css → shell.v3.css} +271 -22
package/static-files/shell.v3.js +1865 -0
package/static-files/storage.v3.js +176 -0
package/tests/anthropic.spec.ts +42 -7
package/tests/builders.spec.ts +72 -4
package/tests/pageValidator.spec.ts +548 -0
package/tests/profiles.spec.ts +122 -0
package/tests/providers.spec.ts +1 -1
package/tests/sharedTableSchema.spec.ts +242 -0
package/tests/transformPage.spec.ts +62 -81
package/default-pages/application/page.json +0 -10
package/default-pages/retro_game_starter/page.json +0 -12
package/default-pages/sidebar_page/page.html +0 -51
package/default-pages/sidebar_page/page.json +0 -10
package/default-pages/two-panel_page/page.html +0 -68
package/default-pages/two-panel_page/page.json +0 -10

package/default-pages/neon_asteroids/page.html CHANGED Viewed

@@ -1,1803 +1,1777 @@
-<!DOCTYPE html><html lang="en"><head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>SynthOS</title>
-    <script id="theme-info" src="/api/theme-info.js" data-locked="true"></script>
-    <link id="theme-css" rel="stylesheet" href="/api/theme.css" data-locked="true">
-    <style>
-#game-wrapper{width:100%;height:100%;display:flex;align-items:flex-start;justify-content:center;background:#000;overflow:hidden}
-#game-container{position:relative;border:1px solid rgba(0,255,255,.25);box-shadow:0 0 24px rgba(0,255,255,.1),inset 0 0 24px rgba(0,255,255,.05);overflow:hidden;flex-shrink:0}
-#gameCanvas{display:block;width:100%;height:100%}
-.game-ui{position:absolute;top:20px;left:20px;right:20px;display:flex;justify-content:space-between;pointer-events:none;z-index:10}
-.level-display,.lives-display,.score-display{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff;letter-spacing:2px}
-.mute-btn{pointer-events:auto;background:none;border:1px solid rgba(0,255,255,.4);border-radius:4px;color:#0ff;cursor:pointer;padding:2px 6px;font-size:16px;line-height:1;opacity:.7;transition:opacity .2s}.mute-btn:hover{opacity:1}
-.player-indicator{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;text-shadow:0 0 10px currentColor,0 0 20px currentColor;letter-spacing:2px;margin-right:8px}
-.game-over-screen,.start-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:20}
-.game-over-screen h1,.start-screen h1{font-family:Orbitron,'Segoe UI',sans-serif;font-size:48px;line-height:1.2;color:#f0f;text-shadow:0 0 20px #f0f,0 0 40px #f0f,0 0 60px #f0f;margin-bottom:20px;letter-spacing:5px}
-.game-over-screen p,.start-screen p{font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff;margin-bottom:30px}
-.restart-btn,.start-btn,.mode-btn{padding:15px 40px;font-size:18px;font-family:Orbitron,'Segoe UI',sans-serif;background:0 0;border:2px solid #0ff;color:#0ff;cursor:pointer;text-transform:uppercase;letter-spacing:3px;transition:.3s;box-shadow:0 0 20px rgba(0,255,255,.3),inset 0 0 20px rgba(0,255,255,.1)}
-.restart-btn:hover,.start-btn:hover,.mode-btn:hover{background:rgba(0,255,255,.2);box-shadow:0 0 30px rgba(0,255,255,.5),inset 0 0 30px rgba(0,255,255,.2);transform:scale(1.05)}
-.controls-info{position:absolute;bottom:16px;right:20px;font-size:13px;color:rgba(0,255,255,.5);text-align:right;letter-spacing:1px;display:flex;align-items:center;gap:16px;font-family:'Segoe UI',sans-serif}
-.controls-info .action-item{display:inline-flex;align-items:center;gap:4px}
-/* Mode selection */
-.mode-select{display:flex;flex-direction:column;gap:12px;align-items:center;margin-bottom:20px}
-.mode-btn{padding:12px 36px;font-size:16px;min-width:240px}
-.mode-btn.selected{background:rgba(0,255,255,.25);border-color:#fff;color:#fff;box-shadow:0 0 30px rgba(0,255,255,.6),inset 0 0 20px rgba(0,255,255,.3)}
-/* Player count selector */
-.player-count-select{display:none;flex-direction:column;align-items:center;gap:12px;margin-top:16px}
-.player-count-select.visible{display:flex}
-.player-count-row{display:flex;align-items:center;gap:16px}
-.player-count-arrow{font-size:28px;color:#0ff;cursor:pointer;user-select:none;text-shadow:0 0 10px #0ff;padding:4px 12px;transition:.2s}
-.player-count-arrow:hover{color:#fff;text-shadow:0 0 15px #fff}
-.player-count-num{font-family:Orbitron,'Segoe UI',sans-serif;font-size:36px;color:#f0f;text-shadow:0 0 15px #f0f,0 0 30px #f0f;min-width:50px;text-align:center}
-.player-count-label{font-size:14px;color:rgba(0,255,255,.6);letter-spacing:2px}
-.player-count-confirm{margin-top:8px}
-/* Sub-mode selection */
-.submode-select{display:none;flex-direction:column;align-items:center;gap:12px;margin-top:16px}
-.submode-select.visible{display:flex}
-.submode-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:14px;color:rgba(0,255,255,.7);letter-spacing:2px;margin-bottom:4px}
-.submode-btn{padding:10px 30px;font-size:14px;min-width:220px;font-family:Orbitron,'Segoe UI',sans-serif;background:0 0;border:2px solid #0ff;color:#0ff;cursor:pointer;text-transform:uppercase;letter-spacing:2px;transition:.3s;box-shadow:0 0 15px rgba(0,255,255,.2),inset 0 0 15px rgba(0,255,255,.08)}
-.submode-btn:hover{background:rgba(0,255,255,.2);box-shadow:0 0 25px rgba(0,255,255,.5);transform:scale(1.03)}
-.submode-desc{font-size:11px;color:rgba(0,255,255,.45);font-family:'Segoe UI',sans-serif;max-width:280px;text-align:center;margin-top:-4px}
-/* Side panels */
-.side-panel{width:200px;flex-shrink:0;padding:20px 16px;display:flex;flex-direction:column;font-family:Orbitron,'Segoe UI',sans-serif;box-sizing:border-box;overflow:hidden}
-.side-panel.hidden{display:none}
-.side-panel h2{font-size:16px;letter-spacing:3px;margin:0 0 16px 0;text-align:center;font-weight:700}
-#side-leaderboard{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px rgba(255,0,255,.4)}
-#side-leaderboard h2{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px #f0f}
-#side-controls{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px rgba(0,255,255,.4)}
-#side-controls h2{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff}
-.leaderboard-table{width:100%;border-collapse:collapse;font-family:'Courier New',monospace;font-size:13px}
-.leaderboard-table td{padding:4px 0;white-space:nowrap}
-.leaderboard-table .rank{width:24px;color:rgba(255,0,255,.6);text-align:right;padding-right:6px}
-.leaderboard-table .initials{color:#f0f;letter-spacing:2px}
-.leaderboard-table .hs-score{text-align:right;color:rgba(255,0,255,.7);position:relative;cursor:default}
-.leaderboard-table .hs-score.overflow{animation:scoreFlash 0.8s ease-in-out infinite}
-.leaderboard-table .hs-score[title]:hover::after{content:attr(title);position:absolute;right:0;top:-22px;background:#1a0028;color:#f0f;font-size:11px;padding:2px 6px;border:1px solid rgba(255,0,255,.4);border-radius:3px;white-space:nowrap;z-index:5;pointer-events:none}
-@keyframes scoreFlash{0%,100%{opacity:1}50%{opacity:.4}}
-.score-display .score-overflow{animation:hudScoreFlash 0.8s ease-in-out infinite}
-@keyframes hudScoreFlash{0%,100%{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff}50%{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px #f0f}}
-.controls-list{list-style:none;padding:0;margin:0;font-size:12px}
-.controls-list li{padding:6px 0;display:flex;gap:8px;align-items:center;color:#0ff}
-.controls-list .key-icon{display:inline-block;min-width:50px;padding:2px 6px;border:1px solid rgba(0,255,255,.4);border-radius:3px;text-align:center;font-size:11px;color:#0ff;background:rgba(0,255,255,.05);flex-shrink:0}
-.controls-list .key-desc{color:rgba(0,255,255,.7);font-family:'Segoe UI',sans-serif}
-.bt-section{margin-top:auto;padding-top:16px;border-top:1px solid rgba(0,255,255,.15)}
-.bt-section h3{font-size:11px;letter-spacing:2px;color:rgba(0,255,255,.5);margin:0 0 8px 0;text-align:center;font-weight:400}
-.bt-section p{font-size:11px;color:rgba(0,255,255,.4);font-family:'Segoe UI',sans-serif;margin:0 0 4px 0;line-height:1.4}
-.side-panel{overflow-y:auto}
-#side-leaderboard{padding-top:20px}
-#side-controls{padding-top:20px}
-/* Gamepad status indicator */
-#gamepadStatus{text-align:center;padding:8px 0;margin-bottom:12px;font-size:11px;letter-spacing:2px;border:1px solid rgba(0,255,255,.15);border-radius:4px;transition:all .3s;color:rgba(0,255,255,.3);text-shadow:none}
-#gamepadStatus.connected{color:#0f0;text-shadow:0 0 8px #0f0,0 0 16px rgba(0,255,0,.4);border-color:rgba(0,255,0,.3);background:rgba(0,255,0,.05);animation:gpPulse 2s ease-in-out infinite}
-@keyframes gpPulse{0%,100%{box-shadow:0 0 4px rgba(0,255,0,.1)}50%{box-shadow:0 0 12px rgba(0,255,0,.25)}}
-/* Pause overlay */
-#pauseOverlay{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;z-index:25;background:rgba(0,0,0,.5);flex-direction:column;gap:8px}
-#pauseOverlay.visible{display:flex}
-#pauseOverlay .pause-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:48px;color:#0ff;text-shadow:0 0 20px #0ff,0 0 40px #0ff,0 0 60px #0ff;letter-spacing:8px}
-#pauseOverlay .pause-hint{font-family:'Segoe UI',sans-serif;font-size:14px;color:rgba(0,255,255,.5);letter-spacing:1px}
-/* High score entry */
-#highScoreEntry{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:30;display:none}
-#highScoreEntry h2{font-family:Orbitron,'Segoe UI',sans-serif;font-size:24px;color:#f0f;text-shadow:0 0 15px #f0f,0 0 30px #f0f;margin-bottom:10px;letter-spacing:3px}
-#highScoreEntry .hs-final-score{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff;margin-bottom:20px}
-.initial-slots{display:flex;justify-content:center;gap:12px;margin-bottom:20px}
-.initial-slot{width:40px;height:50px;border:2px solid #f0f;display:flex;align-items:center;justify-content:center;font-family:Orbitron,'Segoe UI',sans-serif;font-size:28px;color:#f0f;text-shadow:0 0 10px #f0f;box-shadow:0 0 10px rgba(255,0,255,.3)}
-.initial-slot.active{border-color:#0ff;color:#0ff;text-shadow:0 0 10px #0ff;box-shadow:0 0 15px rgba(0,255,255,.5)}
-.hs-instructions{font-size:12px;color:rgba(0,255,255,.6);font-family:'Segoe UI',sans-serif;margin-bottom:16px}
-/* Keyboard key hint (for bottom bar) */
-.kb-key{display:inline-block;padding:1px 6px;border:1px solid rgba(0,255,255,.35);border-radius:3px;font-size:11px;color:rgba(0,255,255,.7);background:rgba(0,255,255,.05);vertical-align:middle;margin:0 2px;font-family:'Segoe UI',sans-serif}
-/* Focused menu item */
-.mode-btn.focused,.submode-btn.focused{background:rgba(0,255,255,.2);border-color:#fff;color:#fff;box-shadow:0 0 25px rgba(0,255,255,.5),inset 0 0 20px rgba(0,255,255,.2)}
-/* Turn ready overlay */
-#turnReadyOverlay{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:26;background:rgba(0,0,0,.7)}
-#turnReadyOverlay.visible{display:flex}
-#turnReadyOverlay .turn-player{font-family:Orbitron,'Segoe UI',sans-serif;font-size:42px;text-shadow:0 0 20px currentColor,0 0 40px currentColor;letter-spacing:6px}
-#turnReadyOverlay .turn-subtitle{font-family:Orbitron,'Segoe UI',sans-serif;font-size:22px;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.6);letter-spacing:4px;margin-bottom:8px}
-#turnReadyOverlay .turn-prompt{font-family:'Segoe UI',sans-serif;font-size:16px;color:rgba(0,255,255,.6);letter-spacing:1px}
-/* Final scoreboard overlay */
-#finalScoreboard{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:16px;z-index:27;background:rgba(0,0,0,.8)}
-#finalScoreboard.visible{display:flex}
-#finalScoreboard .sb-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:32px;color:#f0f;text-shadow:0 0 20px #f0f,0 0 40px #f0f;letter-spacing:5px;margin-bottom:8px}
-#finalScoreboard .sb-subtitle{font-family:Orbitron,'Segoe UI',sans-serif;font-size:14px;color:rgba(255,255,255,.5);letter-spacing:3px;margin-bottom:12px}
-.sb-table{border-collapse:collapse;font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px}
-.sb-table td{padding:8px 16px}
-.sb-table .sb-rank{color:rgba(255,255,255,.5);text-align:right;font-size:14px}
-.sb-table .sb-player{letter-spacing:3px}
-.sb-table .sb-initials{font-size:14px;color:rgba(255,255,255,.5);letter-spacing:2px}
-.sb-table .sb-score{text-align:right;color:#fff;letter-spacing:2px}
-.sb-play-again{margin-top:16px}
-    </style>
-    <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&amp;display=swap" rel="stylesheet">
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
-</head>
-<body>
-    <div class="shell-toolbar" data-locked="true">
-        <button class="shell-toolbar-btn" id="builderToggle" aria-label="Page Builder" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M7 18.5H6.2c-1.77 0-3.2-1.43-3.2-3.2V7.7C3 5.93 4.43 4.5 6.2 4.5h11.6c1.77 0 3.2 1.43 3.2 3.2v7.6c0 1.77-1.43 3.2-3.2 3.2H12l-4.2 3.2c-.5.38-1.2.02-1.2-.6V18.5Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></path><circle cx="8.5" cy="11.5" r="1" fill="currentColor"></circle><circle cx="12" cy="11.5" r="1" fill="currentColor"></circle><circle cx="15.5" cy="11.5" r="1" fill="currentColor"></circle></svg></button>
-        <button class="shell-toolbar-btn" id="pagesBtn" aria-label="View All Pages" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none"><rect x="3" y="3" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></rect><path d="M6 7.5h5M6 10h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><rect x="18" y="3" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></rect><path d="M21 7.5h5M21 10h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><rect x="3" y="18" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></rect><path d="M6 22.5h5M6 25h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><rect x="18" y="18" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></rect><path d="M21 22.5h5M21 25h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></button>
-        <button class="shell-toolbar-btn" id="saveBtn" aria-label="Save Page" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></path><path d="M17 21v-8H7v8" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></path><path d="M7 3v5h8" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"></path></svg></button>
-        <div class="shell-toolbar-spacer" data-locked="true"></div>
-        <button class="shell-toolbar-btn" id="settingsBtn" aria-label="Settings" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" stroke="currentColor" stroke-width="1.8"></path><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
-    </div>
-    <div class="chat-panel" data-locked="true">
-        <div class="chat-header" data-locked="true"><span>Page Builder</span><button class="chat-header-close" id="builderClose" aria-label="Close builder" data-locked="true">×</button></div>
-        <div class="chat-messages" id="chatMessages" data-locked="true">
-            <div class="chat-message">
-                <p><strong>SynthOS:</strong> <b>NEON ASTEROIDS</b> &mdash; Destroy asteroids, dodge saucers, collect power-ups. Controls: <b>WASD/Arrows</b> to move, <b>Space</b> to fire, <b>H</b> for hyperspace, <b>P</b> to pause. Gamepad supported. Up to 4 players in Pass &amp; Play mode.</p>
-                <p>Want to build your own retro game? Start from the <a href="/retro_game_starter">Retro Game Starter</a> — it gives you a ready-made canvas, game loop, and input handling so you can jump straight into designing your game.</p>
-            </div>
-        </div>
-        <form action="/" method="POST" id="chatForm" data-locked="true">
-            <textarea class="chat-input" id="chatInput" name="message" rows="2" placeholder="Type a message..." data-locked="true"></textarea>
-        </form>
-    </div>
-    <div class="viewer-panel full-viewer" id="viewerPanel" style="background:#000;">
-        <div id="game-wrapper">
-            <div id="side-leaderboard" class="side-panel hidden">
-                <h2>HIGH SCORES</h2>
-                <table class="leaderboard-table">
-                    <tbody id="leaderboardBody"></tbody>
-                </table>
-            </div>
-            <div id="game-container">
-                <canvas id="gameCanvas"></canvas>
-                <div class="game-ui">
-                    <div class="score-display"><span id="playerIndicator" class="player-indicator" style="display:none"></span>SCORE: <span id="score">00000</span></div>
-                    <div class="level-display">LEVEL: <span id="level">1</span></div>
-                    <div class="lives-display">LIVES: <span id="lives">3</span></div>
-                    <button class="mute-btn" id="muteBtn" title="Toggle sound">&#128266;</button>
-                </div>
-                <div id="pauseOverlay"><span class="pause-title">PAUSED</span><span class="pause-hint" id="pauseHint"></span></div>
-                <div id="turnReadyOverlay">
-                    <div class="turn-player" id="turnPlayerName">PLAYER 1</div>
-                    <div class="turn-subtitle">YOUR TURN</div>
-                    <div class="turn-prompt" id="turnPrompt">Press SPACE to start</div>
-                </div>
-                <div id="finalScoreboard">
-                    <div class="sb-title">GAME OVER</div>
-                    <div class="sb-subtitle" id="sbSubtitle">FINAL STANDINGS</div>
-                    <table class="sb-table"><tbody id="sbBody"></tbody></table>
-                    <button class="restart-btn sb-play-again" id="sbPlayAgain">PLAY AGAIN</button>
-                </div>
-                <div class="start-screen" id="startScreen">
-                    <h1>NEON<br>ASTEROIDS</h1>
-                    <p>Navigate the cosmic void. Destroy all asteroids. Beware the saucers!</p>
-                    <div class="mode-select" id="modeSelect">
-                        <button class="mode-btn" id="btn1P">START MISSION</button>
-                        <button class="mode-btn" id="btnPassPlay">PASS &amp; PLAY</button>
-                    </div>
-                    <div class="submode-select" id="submodeSelect">
-                        <div class="submode-title">CHOOSE MODE</div>
-                        <button class="submode-btn" id="btnSoloTurns">SOLO TURNS</button>
-                        <div class="submode-desc">Each player gets a fresh game. Highest total score wins.</div>
-                        <button class="submode-btn" id="btnHotSeat">HOT SEAT</button>
-                        <div class="submode-desc">Shared asteroid field. Rotate on each death. Last one standing!</div>
-                    </div>
-                    <div class="player-count-select" id="playerCountSelect">
-                        <div class="player-count-label">PLAYERS</div>
-                        <div class="player-count-row">
-                            <span class="player-count-arrow" id="pcLeft">←</span>
-                            <span class="player-count-num" id="pcNum">2</span>
-                            <span class="player-count-arrow" id="pcRight">→</span>
-                        </div>
-                        <button class="mode-btn player-count-confirm" id="pcConfirm">START</button>
-                    </div>
-                </div>
-                <div class="game-over-screen" id="gameOverScreen" style="display: none;">
-                    <h1>GAME OVER</h1>
-                    <p>Final Score: <span id="finalScore">0</span></p>
-                    <button class="restart-btn" id="restartBtn">TRY AGAIN</button>
-                </div>
-                <div id="highScoreEntry">
-                    <h2>NEW HIGH SCORE!</h2>
-                    <div class="hs-final-score">SCORE: <span id="hsScore">0</span></div>
-                    <div class="initial-slots">
-                        <div class="initial-slot active" id="slot0">A</div>
-                        <div class="initial-slot" id="slot1">A</div>
-                        <div class="initial-slot" id="slot2">A</div>
-                    </div>
-                    <div class="hs-instructions" id="hsInstructions">LEFT/RIGHT select slot • UP/DOWN change letter • ENTER confirm</div>
-                </div>
-                <div class="controls-info" id="controlsInfo">WASD / ARROWS to move • SPACE to fire • H hyperspace • P pause</div>
-            </div>
-            <div id="side-controls" class="side-panel hidden">
-                <div id="gamepadStatus">NO GAMEPAD</div>
-                <h2>CONTROLS</h2>
-                <ul class="controls-list" id="controlsList">
-                    <li><span class="key-icon">W/↑</span><span class="key-desc">Thrust</span></li>
-                    <li><span class="key-icon">A/←</span><span class="key-desc">Rotate Left</span></li>
-                    <li><span class="key-icon">D/→</span><span class="key-desc">Rotate Right</span></li>
-                    <li><span class="key-icon">SPACE</span><span class="key-desc">Fire</span></li>
-                    <li><span class="key-icon">H</span><span class="key-desc">Hyperspace</span></li>
-                    <li><span class="key-icon">P</span><span class="key-desc">Pause</span></li>
-                </ul>
-                <h2 style="margin-top:24px">POWER-UPS</h2>
-                <ul class="controls-list">
-                    <li><span class="key-icon" style="color:#0ff;border-color:rgba(0,255,255,.4)">S</span><span class="key-desc">Shield</span></li>
-                    <li><span class="key-icon" style="color:#f00;border-color:rgba(255,0,0,.4)">R</span><span class="key-desc">Rapid Fire</span></li>
-                    <li><span class="key-icon" style="color:#ff0;border-color:rgba(255,255,0,.4)">M</span><span class="key-desc">Multi-Shot</span></li>
-                    <li><span class="key-icon" style="color:#0f0;border-color:rgba(0,255,0,.4)">+</span><span class="key-desc">Extra Life</span></li>
-                </ul>
-                <div class="bt-section" id="btSection"></div>
-            </div>
-        </div>
-        <div id="loadingOverlay" class="loading-overlay">
-            <div class="spinner"></div>
-        </div>
-    </div>
-    <div id="instructions" style="display: none;" data-locked="true"></div>
-    <div id="thoughts" style="display: none;" data-locked="true"></div>
-    <script src="/static/retro-game.js"></script>
-    <script id="asteroids-game">
-RetroGame.injectCSS();
-// --- Sound Effects ---
-var sfx = RetroGame.createSoundEffects();
-var sfxReady = false;
-sfx.load().then(function() {
-    console.log('✓ Sound effects loaded successfully');
-    sfxReady = true;
-}).catch(function(e) {
-    console.error('✗ Sound effects failed to load:', e);
-    console.error('Make sure effects.json exists in page file storage');
-    console.error('Upload it via: synthos.files.upload("effects.json", blob)');
-});
-// Mute toggle
-var sfxMuted = false;
-document.getElementById("muteBtn").addEventListener("click", function() {
-    sfxMuted = !sfxMuted;
-    sfx.volume = sfxMuted ? 0 : 1;
-    this.innerHTML = sfxMuted ? "\u{1F507}" : "\u{1F50A}";
-});
-var ambientPlaying = false;
-var ambientTimeout = null;
-var AMBIENT_TRACKS = ['Ambient_Space', 'Ambient_Space2', 'Ambient_Space3'];
-var currentAmbientIndex = -1;
-function startAmbient() {
-    if (ambientPlaying) return;
-    ambientPlaying = true;
-    playNextAmbient();
-}
-function playNextAmbient() {
-    if (!ambientPlaying || !sfxReady) return;
-    // Pick a random track different from the last one
-    let idx;
-    do { idx = Math.floor(Math.random() * AMBIENT_TRACKS.length); } while (idx === currentAmbientIndex && AMBIENT_TRACKS.length > 1);
-    currentAmbientIndex = idx;
-    sfx.play(AMBIENT_TRACKS[idx]);
-}
-function stopAmbient() {
-    ambientPlaying = false;
-    if (ambientTimeout) { clearTimeout(ambientTimeout); ambientTimeout = null; }
-    if (sfxReady) AMBIENT_TRACKS.forEach(function(t) { sfx.stop(t); });
-    currentAmbientIndex = -1;
-}
-var canvas = document.getElementById("gameCanvas");
-var ctx = canvas.getContext("2d");
-var viewerPanel = document.getElementById("viewerPanel");
-var gameContainer = document.getElementById("game-container");
-var sideLeaderboard = document.getElementById("side-leaderboard");
-var sideControls = document.getElementById("side-controls");
-var pauseOverlay = document.getElementById("pauseOverlay");
-var ASPECT = 4 / 3;
-var MAX_SCORE = 99999;
-// Player colors: P1=cyan, P2=magenta, P3=yellow, P4=green
-var PLAYER_COLORS = ["#00ffff", "#ff00ff", "#ffff00", "#00ff00", "#ff6600", "#ff3388", "#33ccff", "#ccff33"];
-var resizeTimer = 0;
-function resizeCanvas() {
-    const vw = viewerPanel.clientWidth;
-    const vh = viewerPanel.clientHeight;
-    if (vw < 1 || vh < 1) return;
-    const panelRatio = vw / vh;
-    let w, h;
-    if (panelRatio > ASPECT) {
-        h = vh;
-        w = Math.floor(h * ASPECT);
-    } else {
-        w = vw;
-        h = Math.floor(w / ASPECT);
-    }
-    gameContainer.style.width = w + "px";
-    gameContainer.style.height = h + "px";
-    canvas.width = w;
-    canvas.height = h;
-    const extraSpace = vw - w;
-    if (extraSpace > 400) {
-        sideLeaderboard.classList.remove("hidden");
-        sideControls.classList.remove("hidden");
-    } else {
-        sideLeaderboard.classList.add("hidden");
-        sideControls.classList.add("hidden");
-    }
-}
-function debouncedResize() {
-    clearTimeout(resizeTimer);
-    resizeCanvas();
-    resizeTimer = setTimeout(resizeCanvas, 300);
-}
-resizeCanvas();
-window.addEventListener("resize", resizeCanvas);
-new MutationObserver(debouncedResize).observe(document.body, { attributes: true, attributeFilter: ["class"] });
-// --- Gamepad input (library) ---
-var gamepad = RetroGame.createGamepad({ deadzone: 0.3 });
-var B = RetroGame.BUTTON;
-var gamepadUI = RetroGame.createGamepadUI(gamepad, { statusElement: document.getElementById("gamepadStatus") });
-// Game-specific gamepad action mappings
-function gpFire()    { return gamepad.isDown(B.A) || gamepad.isDown(B.X) || gamepad.isDown(B.RB) || gamepad.isDown(B.RT); }
-function gpHyper()   { return gamepad.wasPressed(B.B) || gamepad.wasPressed(B.LB); }
-function gpPause()   { return gamepad.wasPressed(B.START); }
-function gpConfirm() { return gamepad.wasPressed(B.A); }
-function gpBack()    { return gamepad.wasPressed(B.B); }
-// Edge-triggered directional helpers (stick + dpad)
-// Track previous directional state for stick-based edge detection
-var _prevDir = { up: false, down: false, left: false, right: false };
-function gpUp()    { var r = gamepad.up && !_prevDir.up; return r; }
-function gpDown()  { var r = gamepad.down && !_prevDir.down; return r; }
-function gpLeft()  { var r = gamepad.left && !_prevDir.left; return r; }
-function gpRight() { var r = gamepad.right && !_prevDir.right; return r; }
-function saveDirState() { _prevDir.up = gamepad.up; _prevDir.down = gamepad.down; _prevDir.left = gamepad.left; _prevDir.right = gamepad.right; }
-// Delegate to library UI
-function gpBtn(name) { return gamepadUI.buttonGlyph(name); }
-function gpBtnName(name) { return gamepadUI.buttonName(name); }
-function gpStartName() { return gamepadUI.startName(); }
-// Returns styled HTML for a non-face button label (game-specific, not in library)
-function gpLabel(text) {
-    return '<span class="gp-label">' + text + '</span>';
-}
-// --- Gamepad-aware text helper ---
-function btnText(kbLabel, gpLabelText) {
-    return gamepad.connected ? gpLabelText : kbLabel;
-}
-// Keyboard key styled span
-function kbKey(text) {
-    return '<span class="kb-key">' + text + '</span>';
-}
-// Build an action item for the bottom bar
-function actionItem(hint, label) {
-    return '<span class="action-item">' + hint + ' ' + label + '</span>';
-}
-// --- Unified bottom bar: menu nav OR game controls ---
-function updateBottomBar() {
-    var bar = document.getElementById("controlsInfo");
-    var startVisible = document.getElementById("startScreen").style.display !== "none";
-    var gameOverVisible = document.getElementById("gameOverScreen").style.display === "block";
-    var scoreboardVisible = document.getElementById("finalScoreboard").classList.contains("visible");
-    // Menu screens — show navigation hints
-    if (startVisible) {
-        if (gamepad.connected) {
-            if (startScreenPhase === "mode") {
-                bar.innerHTML =
-                    actionItem(gpLabel("\u2191\u2193"), "Navigate") +
-                    actionItem(gpBtn("a"), "Select");
-            } else if (startScreenPhase === "submode") {
-                bar.innerHTML =
-                    actionItem(gpLabel("\u2191\u2193"), "Navigate") +
-                    actionItem(gpBtn("a"), "Select") +
-                    actionItem(gpBtn("b"), "Back");
-            } else if (startScreenPhase === "count") {
-                bar.innerHTML =
-                    actionItem(gpLabel("\u2190\u2192"), "Players") +
-                    actionItem(gpBtn("a"), "Start") +
-                    actionItem(gpBtn("b"), "Back");
-            }
-        } else {
-            if (startScreenPhase === "mode") {
-                bar.innerHTML =
-                    actionItem(kbKey("\u2191\u2193"), "Navigate") +
-                    actionItem(kbKey("ENTER"), "Select");
-            } else if (startScreenPhase === "submode") {
-                bar.innerHTML =
-                    actionItem(kbKey("\u2191\u2193"), "Navigate") +
-                    actionItem(kbKey("ENTER"), "Select") +
-                    actionItem(kbKey("ESC"), "Back");
-            } else if (startScreenPhase === "count") {
-                bar.innerHTML =
-                    actionItem(kbKey("\u2190\u2192"), "Players") +
-                    actionItem(kbKey("ENTER"), "Start") +
-                    actionItem(kbKey("ESC"), "Back");
-            }
-        }
-        return;
-    }
-    // High score entry
-    if (hsEntryActive) {
-        if (gamepad.connected) {
-            bar.innerHTML =
-                actionItem(gpLabel("\u2191\u2193"), "Letter") +
-                actionItem(gpBtn("a"), "Next") +
-                actionItem(gpBtn("b"), "Back");
-        } else {
-            bar.innerHTML =
-                actionItem(kbKey("\u2191\u2193"), "Letter") +
-                actionItem(kbKey("\u2190\u2192"), "Slot") +
-                actionItem(kbKey("ENTER"), "Confirm");
-        }
-        return;
-    }
-    // Game over / scoreboard
-    if (gameOverVisible || scoreboardVisible) {
-        if (gamepad.connected) {
-            bar.innerHTML = actionItem(gpBtn("a"), "Continue");
-        } else {
-            bar.innerHTML = actionItem(kbKey("ENTER"), "Continue");
-        }
-        return;
-    }
-    // In-game controls
-    if (gamepad.connected) {
-        bar.innerHTML =
-            actionItem(gpLabel("L-Stick"), "Move") +
-            actionItem(gpBtn("a"), "Fire") +
-            actionItem(gpBtn("b"), "Hyperspace") +
-            actionItem(gpLabel(gpStartName()), "Pause");
-    } else {
-        bar.innerHTML =
-            actionItem(kbKey("WASD"), "Move") +
-            actionItem(kbKey("SPACE"), "Fire") +
-            actionItem(kbKey("H"), "Hyperspace") +
-            actionItem(kbKey("P"), "Pause");
-    }
-}
-function updateAllPrompts() {
-    // Start screen buttons
-    document.getElementById("btn1P").textContent = gamepad.connected ? "1 PLAYER" : "START MISSION";
-    document.getElementById("btnPassPlay").textContent = "PASS & PLAY";
-    document.getElementById("btnSoloTurns").textContent = "SOLO TURNS";
-    document.getElementById("btnHotSeat").textContent = "HOT SEAT";
-    // Focus highlight
-    updateMenuFocus();
-    // Restart button
-    var restartBtn = document.getElementById("restartBtn");
-    if (gamepad.connected) {
-        restartBtn.innerHTML = gpBtn("a") + ' RETRY';
-    } else {
-        restartBtn.textContent = "TRY AGAIN";
-    }
-    // HS instructions
-    document.getElementById("hsInstructions").innerHTML = btnText(
-        "LEFT/RIGHT select slot &bull; UP/DOWN change letter &bull; ENTER confirm",
-        gpLabel("\u2191\u2193") + " change letter &bull; " + gpBtn("a") + " next &bull; " + gpBtn("b") + " back"
-    );
-    // Pause hint
-    document.getElementById("pauseHint").innerHTML = btnText(
-        "P to resume",
-        gpLabel(gpStartName()) + " to resume"
-    );
-    // Turn ready prompt
-    document.getElementById("turnPrompt").innerHTML = btnText(
-        "Press SPACE to start",
-        "Press " + gpBtn("a") + " to start"
-    );
-    // Player count confirm
-    var pcConfirm = document.getElementById("pcConfirm");
-    if (gamepad.connected) {
-        pcConfirm.innerHTML = gpBtn("a") + ' START';
-    } else {
-        pcConfirm.textContent = "START";
-    }
-    // Scoreboard play again
-    var sbBtn = document.getElementById("sbPlayAgain");
-    if (gamepad.connected) {
-        sbBtn.innerHTML = gpBtn("a") + ' PLAY AGAIN';
-    } else {
-        sbBtn.textContent = "PLAY AGAIN";
-    }
-    // Bottom bar
-    updateBottomBar();
-}
-// --- High Score System (synthos.data, top 20) ---
-var MAX_LEADERBOARD = 20;
-var _highScores = [{ initials: "ACE", score: 10000 }];
-// Load scores from app table storage on startup
-(async function() {
-    try {
-        var row = await synthos.data.get('high_scores', 'scores');
-        if (row && Array.isArray(row.entries) && row.entries.length > 0) {
-            _highScores = row.entries;
-        }
-    } catch(e) {}
-    renderLeaderboard();
-})();
-function loadHighScores() {
-    return _highScores;
-}
-function saveHighScores(scores) {
-    _highScores = scores;
-    synthos.data.save('high_scores', { id: 'scores', entries: scores }).catch(function() {});
-}
-function qualifiesForHighScore(s) {
-    var scores = loadHighScores();
-    return scores.length < MAX_LEADERBOARD || s > scores[scores.length - 1].score;
-}
-function insertHighScore(initials, s) {
-    var scores = loadHighScores().slice();
-    scores.push({ initials: initials, score: s });
-    scores.sort(function(a, b) { return b.score - a.score; });
-    if (scores.length > MAX_LEADERBOARD) scores.length = MAX_LEADERBOARD;
-    saveHighScores(scores);
-    renderLeaderboard();
-}
-function formatLeaderboardScore(s) {
-    if (s > MAX_SCORE) {
-        return { text: "99,999+", overflow: true };
-    }
-    return { text: s.toLocaleString(), overflow: false };
-}
-function renderLeaderboard() {
-    var scores = loadHighScores();
-    var tbody = document.getElementById("leaderboardBody");
-    tbody.innerHTML = "";
-    scores.forEach(function(entry, i) {
-        var tr = document.createElement("tr");
-        var fmt = formatLeaderboardScore(entry.score);
-        var overflowClass = fmt.overflow ? " overflow" : "";
-        var titleAttr = fmt.overflow ? ' title="' + entry.score.toLocaleString() + '"' : "";
-        tr.innerHTML =
-            '<td class="rank">' + (i + 1) + '.</td>' +
-            '<td class="initials">' + entry.initials + '</td>' +
-            '<td class="hs-score' + overflowClass + '"' + titleAttr + '>' + fmt.text + '</td>';
-        tbody.appendChild(tr);
-    });
-}
-renderLeaderboard();
-// --- BT Controller Instructions (platform-aware) ---
-(function() {
-    const el = document.getElementById("btSection");
-    const isMac = /Mac|iPhone|iPad/.test(navigator.platform) || /Macintosh/.test(navigator.userAgent);
-    if (isMac) {
-        el.innerHTML =
-            '<h3>GAMEPAD</h3>' +
-            '<p>1. Put controller in pairing mode</p>' +
-            '<p>2. Open <b>System Settings &gt; Bluetooth</b></p>' +
-            '<p>3. Find controller in list, click <b>Connect</b></p>' +
-            '<p>4. Reload page once paired</p>';
-    } else {
-        el.innerHTML =
-            '<h3>GAMEPAD</h3>' +
-            '<p>1. Put controller in pairing mode</p>' +
-            '<p>2. Open <b>Settings &gt; Bluetooth &amp; devices</b></p>' +
-            '<p>3. Click <b>Add device &gt; Bluetooth</b></p>' +
-            '<p>4. Select controller, then reload page</p>';
-    }
-})();
-// --- Gamepad Detection & Controls Swap ---
-var KEYBOARD_CONTROLS = '<li><span class="key-icon">W/\u2191</span><span class="key-desc">Thrust</span></li>' +
-    '<li><span class="key-icon">A/\u2190</span><span class="key-desc">Rotate Left</span></li>' +
-    '<li><span class="key-icon">D/\u2192</span><span class="key-desc">Rotate Right</span></li>' +
-    '<li><span class="key-icon">SPACE</span><span class="key-desc">Fire</span></li>' +
-    '<li><span class="key-icon">H</span><span class="key-desc">Hyperspace</span></li>' +
-    '<li><span class="key-icon">P</span><span class="key-desc">Pause</span></li>';
-function buildGamepadControls() {
-    return '<li><span class="key-icon">L-Stick</span><span class="key-desc">Thrust / Rotate</span></li>' +
-        '<li><span class="key-icon">D-Pad</span><span class="key-desc">Thrust / Rotate</span></li>' +
-        '<li><span class="key-icon">' + gpBtnName("a") + ' / RB</span><span class="key-desc">Fire</span></li>' +
-        '<li><span class="key-icon">' + gpBtnName("b") + ' / LB</span><span class="key-desc">Hyperspace</span></li>' +
-        '<li><span class="key-icon">' + gpStartName() + '</span><span class="key-desc">Pause</span></li>';
-}
-function refreshGamepadUI() {
-    gamepadUI.update();
-    var listEl = document.getElementById("controlsList");
-    var btEl = document.getElementById("btSection");
-    if (gamepad.connected) {
-        listEl.innerHTML = buildGamepadControls();
-        btEl.style.display = "none";
-    } else {
-        listEl.innerHTML = KEYBOARD_CONTROLS;
-        btEl.style.display = "";
-    }
-    updateAllPrompts();
-}
-gamepad.onConnect = function() { refreshGamepadUI(); };
-gamepad.onDisconnect = function() { refreshGamepadUI(); };
-// --- Game Mode State ---
-var gameMode = "single"; // "single", "solo_turns", "hot_seat"
-var playerCount = 2;
-var currentPlayer = 0;
-var players = []; // {score, lives, level, alive, initials}
-var turnReady = false;
-var startScreenPhase = "mode"; // "mode", "submode", "count"
-// --- Game State ---
-var gameRunning = false, gamePaused = false, score = 0, lives = 3, level = 1;
-var shake = RetroGame.createShake();
-var hyperspaceCooldown = 0;
-var hyperspaceInvincible = 0;
-var ship = {
-    x: 0, y: 0, vx: 0, vy: 0, angle: -Math.PI / 2,
-    radius: 15, thrust: 0, rotationSpeed: 0,
-    invincible: 0, shield: 0, rapidFire: 0, multiShot: 0
-};
-var bullets = [], asteroids = [], powerUps = [], stars = [];
-var saucers = [], saucerBullets = [], saucerSpawnTimer = 0;
-var keyboard = RetroGame.createKeyboard();
-var particles = RetroGame.createParticles({ maxParticles: 500 });
-// --- High Score Entry State ---
-var hsEntryActive = false;
-var hsSlots = [0, 0, 0];
-var hsActiveSlot = 0;
-var hsFinalScore = 0;
-var hsEntryPlayerIndex = -1; // track which player is entering HS in multiplayer
-function getActivePlayerColor() {
-    if (gameMode === "single") return PLAYER_COLORS[0];
-    return PLAYER_COLORS[currentPlayer] || PLAYER_COLORS[0];
-}
-function initStars() {
-    stars = [];
-    for (let i = 0; i < 150; i++)
-        stars.push({
-            x: Math.random() * canvas.width,
-            y: Math.random() * canvas.height,
-            size: 2 * Math.random() + 0.5,
-            speed: 0.5 * Math.random() + 0.1,
-            brightness: Math.random()
-        });
-}
-function initGame() {
-    ship.x = canvas.width / 2;
-    ship.y = canvas.height / 2;
-    ship.vx = 0; ship.vy = 0;
-    ship.angle = -Math.PI / 2;
-    ship.invincible = 180;
-    ship.shield = 0; ship.rapidFire = 0; ship.multiShot = 0;
-    bullets = []; asteroids = []; powerUps = [];
-    particles.clear();
-    saucers = []; saucerBullets = []; saucerSpawnTimer = 0;
-    hyperspaceCooldown = 0; hyperspaceInvincible = 0;
-    score = 0; lives = 3; level = 1;
-    initStars();
-    spawnAsteroids(4);
-    updateUI();
-}
-// Init game for hot seat (preserves asteroids/level across player swaps)
-function initHotSeatRespawn() {
-    ship.x = canvas.width / 2;
-    ship.y = canvas.height / 2;
-    ship.vx = 0; ship.vy = 0;
-    ship.angle = -Math.PI / 2;
-    ship.invincible = 180;
-    ship.shield = 0; ship.rapidFire = 0; ship.multiShot = 0;
-    bullets = [];
-    saucerBullets = [];
-    hyperspaceCooldown = 0; hyperspaceInvincible = 0;
-    shootCooldown = 0;
-}
-function initMultiplayerPlayers() {
-    players = [];
-    for (let i = 0; i < playerCount; i++) {
-        players.push({ score: 0, lives: 3, level: 1, alive: true, initials: "" });
-    }
-    currentPlayer = 0;
-}
-function formatScore(s) {
-    return String(s).padStart(5, "0");
-}
-function addScore(points) {
-    score += points;
-}
-function getLevelSpeedMultiplier() {
-    return 1 + 0.15 * (level - 1);
-}
-function spawnAsteroids(count) {
-    for (let i = 0; i < count; i++) {
-        let x, y;
-        do {
-            x = Math.random() * canvas.width;
-            y = Math.random() * canvas.height;
-        } while (distance(x, y, ship.x, ship.y) < 150);
-        asteroids.push(createAsteroid(x, y, 3));
-    }
-}
-function createAsteroid(x, y, size) {
-    const speed = (0.5 * (4 - size) + 1.5 * Math.random()) * getLevelSpeedMultiplier();
-    const angle = Math.random() * Math.PI * 2;
-    const radii = [];
-    const points = 8 + Math.floor(5 * Math.random());
-    const baseRadius = 15 * size + 10;
-    for (let i = 0; i < points; i++)
-        radii.push(baseRadius * (0.7 + 0.6 * Math.random()));
-    return {
-        x, y,
-        vx: Math.cos(angle) * speed, vy: Math.sin(angle) * speed,
-        size, radii, points, rotation: 0,
-        rotationSpeed: 0.03 * (Math.random() - 0.5),
-        color: size === 3 ? "#ff00ff" : size === 2 ? "#ffff00" : "#00ffff"
-    };
-}
-function createSaucer() {
-    const isSmall = Math.random() > 0.5;
-    const fromLeft = Math.random() > 0.5;
-    const y = Math.random() * (canvas.height - 100) + 50;
-    return {
-        x: fromLeft ? -30 : canvas.width + 30, y,
-        vx: (fromLeft ? 1 : -1) * (isSmall ? 3 : 2) * getLevelSpeedMultiplier(),
-        vy: 0, isSmall,
-        radius: isSmall ? 15 : 25,
-        shootTimer: 60 + 60 * Math.random(),
-        directionChangeTimer: 60 + 120 * Math.random(),
-        points: isSmall ? 1000 : 500
-    };
-}
-function distance(x1, y1, x2, y2) {
-    return RetroGame.distance({x: x1, y: y1}, {x: x2, y: y2});
-}
-function wrap(obj) {
-    RetroGame.wrap(obj, canvas.width, canvas.height, 50);
-}
-function createExplosion(x, y, color, count) {
-    particles.emit(x, y, count || 20, {
-        color: color, speed: 5, size: 3,
-        lifetime: 1.2, decay: 0.02, spread: Math.PI * 2
-    });
-    shake.trigger(10);
-}
-// --- Hyperspace ---
-function hyperspace() {
-    if (hyperspaceCooldown > 0) return;
-    if (sfxReady) sfx.play('Hyperspace_Jump');
-    createExplosion(ship.x, ship.y, "#ffffff", 12);
-    ship.x = Math.random() * (canvas.width - 100) + 50;
-    ship.y = Math.random() * (canvas.height - 100) + 50;
-    ship.vx = 0; ship.vy = 0;
-    createExplosion(ship.x, ship.y, "#00ffff", 12);
-    hyperspaceCooldown = 180;
-    hyperspaceInvincible = 60;
-}
-var shootCooldown = 0;
-function shoot() {
-    if (shootCooldown > 0) return;
-    const cooldown = ship.rapidFire > 0 ? 5 : 15;
-    shootCooldown = cooldown;
-    if (sfxReady) sfx.play('Laser_Fire');
-    const offsets = ship.multiShot > 0 ? [-0.2, 0, 0.2] : [0];
-    offsets.forEach(function(offset) {
-        const angle = ship.angle + offset;
-        bullets.push({
-            x: ship.x + 20 * Math.cos(angle),
-            y: ship.y + 20 * Math.sin(angle),
-            vx: 10 * Math.cos(angle) + 0.5 * ship.vx,
-            vy: 10 * Math.sin(angle) + 0.5 * ship.vy,
-            life: 60
-        });
-    });
-}
-function saucerShoot(saucer) {
-    let angle = Math.atan2(ship.y - saucer.y, ship.x - saucer.x);
-    angle += (saucer.isSmall ? 0.2 : 0.5) * (Math.random() - 0.5);
-    saucerBullets.push({
-        x: saucer.x, y: saucer.y,
-        vx: 6 * Math.cos(angle), vy: 6 * Math.sin(angle),
-        life: 90
-    });
-}
-function spawnPowerUp(x, y) {
-    if (Math.random() > 0.15) return;
-    let type;
-    const rand = Math.random();
-    type = rand < 0.05 ? "life" : rand < 0.38 ? "shield" : rand < 0.71 ? "rapid" : "multi";
-    powerUps.push({ x, y, type, life: 600, pulse: 0 });
-}
-function updateUI() {
-    const scoreEl = document.getElementById("score");
-    if (score > MAX_SCORE) {
-        scoreEl.textContent = "99,999+";
-        scoreEl.className = "score-overflow";
-        scoreEl.title = score.toLocaleString();
-    } else {
-        scoreEl.textContent = formatScore(score);
-        scoreEl.className = "";
-        scoreEl.title = "";
-    }
-    document.getElementById("level").textContent = level;
-    document.getElementById("lives").textContent = lives;
-    // Player indicator for multiplayer
-    const piEl = document.getElementById("playerIndicator");
-    if (gameMode !== "single") {
-        piEl.style.display = "inline";
-        piEl.textContent = "P" + (currentPlayer + 1) + " ";
-        piEl.style.color = getActivePlayerColor();
-    } else {
-        piEl.style.display = "none";
-    }
-}
-function isShipInvincible() {
-    return ship.invincible > 0 || ship.shield > 0 || hyperspaceInvincible > 0;
-}
-// Gamepad polling is now handled by gamepad.poll() in the game loop
-// Game-specific action functions (gpFire, gpHyper, etc.) are defined above
-// --- Multiplayer Turn Management ---
-var TURN_COOLDOWN_MS = 3000; // 3 second cooldown between players
-var turnReadyAt = 0;
-function showTurnReady() {
-    turnReady = true;
-    turnReadyAt = Date.now();
-    const overlay = document.getElementById("turnReadyOverlay");
-    const nameEl = document.getElementById("turnPlayerName");
-    const color = getActivePlayerColor();
-    nameEl.textContent = "PLAYER " + (currentPlayer + 1);
-    nameEl.style.color = color;
-    updateAllPrompts();
-    overlay.classList.add("visible");
-}
-function getTurnCooldownRemaining() {
-    return Math.max(0, TURN_COOLDOWN_MS - (Date.now() - turnReadyAt));
-}
-function updateTurnPrompt() {
-    var remaining = getTurnCooldownRemaining();
-    var promptEl = document.getElementById("turnPrompt");
-    if (remaining > 0) {
-        var secs = Math.ceil(remaining / 1000);
-        promptEl.textContent = "Get ready... " + secs;
-    } else {
-        promptEl.innerHTML = btnText(
-            "Press SPACE to start",
-            "Press " + gpBtn("a") + " to start"
-        );
-    }
-}
-function hideTurnReady() {
-    turnReady = false;
-    document.getElementById("turnReadyOverlay").classList.remove("visible");
-}
-function startPlayerTurn() {
-    hideTurnReady();
-    if (gameMode === "solo_turns") {
-        // Fresh game for each player
-        initGame();
-        score = 0;
-        lives = 3;
-        level = 1;
-    } else if (gameMode === "hot_seat") {
-        // Load this player's state into shared field
-        const p = players[currentPlayer];
-        score = p.score;
-        lives = p.lives;
-        initHotSeatRespawn();
-    }
-    gameRunning = true;
-    startAmbient();
-    updateUI();
-    updateBottomBar();
-}
-function saveCurrentPlayerState() {
-    if (gameMode === "single") return;
-    players[currentPlayer].score = score;
-    players[currentPlayer].lives = lives;
-    if (gameMode === "solo_turns") {
-        players[currentPlayer].level = level;
-    }
-}
-function advanceToNextPlayer() {
-    saveCurrentPlayerState();
-    // Find next alive player
-    let next = -1;
-    for (let i = 1; i <= playerCount; i++) {
-        const idx = (currentPlayer + i) % playerCount;
-        if (players[idx].alive) { next = idx; break; }
-    }
-    if (next === -1) {
-        // All players eliminated
-        showFinalScoreboard();
-        return;
-    }
-    currentPlayer = next;
-    gameRunning = false;
-    showTurnReady();
-}
-function handlePlayerDeath() {
-    if (gameMode === "single") {
-        gameOver();
-        return;
-    }
-    sfx.stop('Ship_Thrust');
-    if (gameMode === "solo_turns") {
-        // Player lost all lives — they're done
-        lives--;
-        updateUI();
-        if (lives <= 0) {
-            saveCurrentPlayerState();
-            players[currentPlayer].alive = false;
-            gameRunning = false;
-            // Check HS for this player
-            if (qualifiesForHighScore(score)) {
-                hsEntryPlayerIndex = currentPlayer;
-                showHighScoreEntry();
-            } else {
-                advanceToNextPlayer();
-            }
-        } else {
-            // Respawn
-            ship.x = canvas.width / 2; ship.y = canvas.height / 2;
-            ship.vx = 0; ship.vy = 0; ship.invincible = 180;
-        }
-    } else if (gameMode === "hot_seat") {
-        // Lost one life — rotate to next player
-        lives--;
-        updateUI();
-        saveCurrentPlayerState();
-        if (lives <= 0) {
-            players[currentPlayer].alive = false;
-            // Check HS for this player
-            if (qualifiesForHighScore(score)) {
-                hsEntryPlayerIndex = currentPlayer;
-                gameRunning = false;
-                showHighScoreEntry();
-                return;
-            }
-        }
-        gameRunning = false;
-        advanceToNextPlayer();
-    }
-}
-function showFinalScoreboard() {
-    gameRunning = false;
-    stopAmbient();
-    sfx.stop('Ship_Thrust');
-    // Sort players by score descending
-    const ranked = players.map(function(p, i) { return { index: i, score: p.score, initials: p.initials }; });
-    ranked.sort(function(a, b) { return b.score - a.score; });
-    const modeLabel = gameMode === "solo_turns" ? "SOLO TURNS" : "HOT SEAT";
-    document.getElementById("sbSubtitle").textContent = modeLabel + " \u2014 FINAL STANDINGS";
-    const tbody = document.getElementById("sbBody");
-    tbody.innerHTML = "";
-    ranked.forEach(function(r, rank) {
-        const tr = document.createElement("tr");
-        const color = PLAYER_COLORS[r.index];
-        const initStr = r.initials || "";
-        tr.innerHTML =
-            '<td class="sb-rank">' + (rank + 1) + '.</td>' +
-            '<td class="sb-player" style="color:' + color + ';text-shadow:0 0 10px ' + color + '">P' + (r.index + 1) + '</td>' +
-            '<td class="sb-initials">' + initStr + '</td>' +
-            '<td class="sb-score">' + r.score.toLocaleString() + '</td>';
-        tbody.appendChild(tr);
-    });
-    document.getElementById("finalScoreboard").classList.add("visible");
-    updateBottomBar();
-}
-function hideFinalScoreboard() {
-    document.getElementById("finalScoreboard").classList.remove("visible");
-}
-// --- Start Screen UI Logic ---
-var menuCursor = 0; // index of focused item in current phase
-// Items per phase: mode=[1P, PassPlay], submode=[Solo, HotSeat], count=N/A (uses arrows)
-function getMenuItems() {
-    if (startScreenPhase === "mode") return [document.getElementById("btn1P"), document.getElementById("btnPassPlay")];
-    if (startScreenPhase === "submode") return [document.getElementById("btnSoloTurns"), document.getElementById("btnHotSeat")];
-    return [];
-}
-function updateMenuFocus() {
-    // Clear all focused classes
-    var all = document.querySelectorAll(".mode-btn.focused, .submode-btn.focused");
-    for (var i = 0; i < all.length; i++) all[i].classList.remove("focused");
-    // Apply to current
-    var items = getMenuItems();
-    if (items.length > 0 && menuCursor >= 0 && menuCursor < items.length) {
-        items[menuCursor].classList.add("focused");
-    }
-}
-function showStartPhase(phase) {
-    startScreenPhase = phase;
-    menuCursor = 0;
-    var modeSelect = document.getElementById("modeSelect");
-    var submodeSelect = document.getElementById("submodeSelect");
-    var pcSelect = document.getElementById("playerCountSelect");
-    modeSelect.style.display = phase === "mode" ? "flex" : "none";
-    submodeSelect.style.display = phase === "submode" ? "flex" : "none";
-    pcSelect.style.display = "none";
-    pcSelect.classList.remove("visible");
-    if (phase === "count") {
-        pcSelect.style.display = "flex";
-        pcSelect.classList.add("visible");
-    }
-    updateMenuFocus();
-    updateBottomBar();
-}
-function resetStartScreen() {
-    var startScreen = document.getElementById("startScreen");
-    startScreen.style.display = "";
-    showStartPhase("mode");
-    playerCount = 2;
-    document.getElementById("pcNum").textContent = "2";
-    document.getElementById("gameOverScreen").style.display = "none";
-    hideFinalScoreboard();
-    hideTurnReady();
-    stopAmbient();
-    sfx.stop('Ship_Thrust');
-}
-function menuConfirm() {
-    if (startScreenPhase === "mode") {
-        if (menuCursor === 0) startSinglePlayer();
-        else if (menuCursor === 1) showStartPhase("submode");
-    } else if (startScreenPhase === "submode") {
-        if (menuCursor === 0) selectSubmode("solo_turns");
-        else if (menuCursor === 1) selectSubmode("hot_seat");
-    } else if (startScreenPhase === "count") {
-        confirmPlayerCount();
-    }
-}
-function menuBack() {
-    if (startScreenPhase === "submode") {
-        showStartPhase("mode");
-        menuCursor = 1; // return focus to "Pass & Play"
-        updateMenuFocus();
-    } else if (startScreenPhase === "count") {
-        showStartPhase("submode");
-    }
-}
-function menuMove(delta) {
-    var items = getMenuItems();
-    if (items.length === 0) return;
-    var prev = menuCursor;
-    menuCursor = Math.max(0, Math.min(items.length - 1, menuCursor + delta));
-    if (menuCursor !== prev && sfxReady) sfx.play('Menu_Navigate');
-    updateMenuFocus();
-}
-function startSinglePlayer() {
-    document.getElementById("startScreen").style.display = "none";
-    gameMode = "single";
-    initGame();
-    gameRunning = true;
-    startAmbient();
-    updateBottomBar();
-}
-function selectSubmode(mode) {
-    gameMode = mode;
-    showStartPhase("count");
-}
-function adjustPlayerCount(delta) {
-    playerCount = Math.max(2, Math.min(8, playerCount + delta));
-    document.getElementById("pcNum").textContent = playerCount;
-}
-function confirmPlayerCount() {
-    document.getElementById("startScreen").style.display = "none";
-    initMultiplayerPlayers();
-    currentPlayer = 0;
-    if (gameMode === "hot_seat") {
-        initGame();
-        gameRunning = false;
-    }
-    showTurnReady();
-}
-// Start screen button events
-document.getElementById("btn1P").addEventListener("click", startSinglePlayer);
-document.getElementById("btnPassPlay").addEventListener("click", function() { showStartPhase("submode"); });
-document.getElementById("btnSoloTurns").addEventListener("click", function() { selectSubmode("solo_turns"); });
-document.getElementById("btnHotSeat").addEventListener("click", function() { selectSubmode("hot_seat"); });
-// Mouse hover syncs focus cursor
-document.getElementById("btn1P").addEventListener("mouseenter", function() { if (menuCursor !== 0 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 0; updateMenuFocus(); });
-document.getElementById("btnPassPlay").addEventListener("mouseenter", function() { if (menuCursor !== 1 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 1; updateMenuFocus(); });
-document.getElementById("btnSoloTurns").addEventListener("mouseenter", function() { if (menuCursor !== 0 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 0; updateMenuFocus(); });
-document.getElementById("btnHotSeat").addEventListener("mouseenter", function() { if (menuCursor !== 1 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 1; updateMenuFocus(); });
-document.getElementById("pcLeft").addEventListener("click", function() { adjustPlayerCount(-1); });
-document.getElementById("pcRight").addEventListener("click", function() { adjustPlayerCount(1); });
-document.getElementById("pcConfirm").addEventListener("click", confirmPlayerCount);
-document.getElementById("sbPlayAgain").addEventListener("click", function() { resetStartScreen(); });
-function update() {
-    // keyboard.poll() and gamepad.poll() are called in gameLoop() before this
-    // Gamepad pause toggle (edge-triggered, works even when paused)
-    if (gpPause() && gameRunning) {
-        gamePaused = !gamePaused;
-        if (gamePaused) pauseOverlay.classList.add("visible");
-        else pauseOverlay.classList.remove("visible");
-    }
-    if (!gameRunning || gamePaused) return;
-    // Gamepad hyperspace (edge-triggered)
-    if (gpHyper()) hyperspace();
-    // Ship controls (keyboard OR gamepad)
-    if (keyboard.isDown("ArrowLeft") || keyboard.isDown("KeyA") || gamepad.left) ship.angle -= 0.08;
-    if (keyboard.isDown("ArrowRight") || keyboard.isDown("KeyD") || gamepad.right) ship.angle += 0.08;
-    if (keyboard.isDown("ArrowUp") || keyboard.isDown("KeyW") || gamepad.up) {
-        ship.vx += 0.15 * Math.cos(ship.angle);
-        ship.vy += 0.15 * Math.sin(ship.angle);
-        ship.thrust = 1;
-        if (sfxReady) sfx.play('Ship_Thrust');
-    } else {
-        if (ship.thrust > 0.1 && sfxReady) sfx.stop('Ship_Thrust');
-        ship.thrust *= 0.95;
-    }
-    if (keyboard.isDown("Space") || gpFire()) shoot();
-    ship.vx *= 0.99;
-    ship.vy *= 0.99;
-    const speed = Math.sqrt(ship.vx ** 2 + ship.vy ** 2);
-    if (speed > 8) {
-        ship.vx = ship.vx / speed * 8;
-        ship.vy = ship.vy / speed * 8;
-    }
-    ship.x += ship.vx;
-    ship.y += ship.vy;
-    wrap(ship);
-    if (ship.invincible > 0) ship.invincible--;
-    if (ship.shield > 0) ship.shield--;
-    if (ship.rapidFire > 0) ship.rapidFire--;
-    if (ship.multiShot > 0) ship.multiShot--;
-    if (shootCooldown > 0) shootCooldown--;
-    if (hyperspaceCooldown > 0) hyperspaceCooldown--;
-    if (hyperspaceInvincible > 0) hyperspaceInvincible--;
-    // Saucer spawning
-    if (level >= 2) {
-        saucerSpawnTimer++;
-        const spawnInterval = Math.max(300, 600 - 30 * level);
-        if (saucerSpawnTimer >= spawnInterval && saucers.length < 2) {
-            saucers.push(createSaucer());
-            if (sfxReady) sfx.play('Saucer_Alert');
-            saucerSpawnTimer = 0;
-        }
-    }
-    // Update saucers
-    saucers = saucers.filter(function(s) {
-        s.x += s.vx; s.y += s.vy;
-        s.directionChangeTimer--;
-        if (s.directionChangeTimer <= 0) {
-            s.vy = 2 * (Math.random() - 0.5);
-            s.directionChangeTimer = 60 + 120 * Math.random();
-        }
-        if (s.y < 50) s.vy = Math.abs(s.vy);
-        if (s.y > canvas.height - 50) s.vy = -Math.abs(s.vy);
-        s.shootTimer--;
-        if (s.shootTimer <= 0) {
-            saucerShoot(s);
-            s.shootTimer = s.isSmall ? 40 + 40 * Math.random() : 60 + 60 * Math.random();
-        }
-        return s.x > -50 && s.x < canvas.width + 50;
-    });
-    // Update saucer bullets
-    saucerBullets = saucerBullets.filter(function(b) {
-        b.x += b.vx; b.y += b.vy; b.life--;
-        return b.life > 0 && b.x > -10 && b.x < canvas.width + 10 && b.y > -10 && b.y < canvas.height + 10;
-    });
-    // Update bullets
-    bullets = bullets.filter(function(b) {
-        b.x += b.vx; b.y += b.vy; b.life--;
-        wrap(b);
-        return b.life > 0;
-    });
-    // Update asteroids
-    asteroids.forEach(function(a) {
-        a.x += a.vx; a.y += a.vy;
-        a.rotation += a.rotationSpeed;
-        wrap(a);
-    });
-    // Update particles
-    particles.update(1/60);
-    // Update power-ups
-    powerUps = powerUps.filter(function(p) {
-        p.life--; p.pulse += 0.1;
-        return p.life > 0;
-    });
-    // Update stars
-    stars.forEach(function(s) {
-        s.y += s.speed;
-        if (s.y > canvas.height) { s.y = 0; s.x = Math.random() * canvas.width; }
-        s.brightness = 0.3 + 0.3 * Math.sin(0.003 * Date.now() + s.x);
-    });
-    // Bullet-asteroid collisions
-    bullets.forEach(function(b, bi) {
-        asteroids.forEach(function(a, ai) {
-            const avgRadius = a.radii.reduce(function(sum, r) { return sum + r; }, 0) / a.radii.length;
-            if (distance(b.x, b.y, a.x, a.y) < avgRadius) {
-                bullets.splice(bi, 1);
-                if (sfxReady) sfx.play('Asteroid_Explosion');
-                createExplosion(a.x, a.y, a.color, 15);
-                if (a.size > 1) {
-                    for (let i = 0; i < 2; i++) asteroids.push(createAsteroid(a.x, a.y, a.size - 1));
-                }
-                spawnPowerUp(a.x, a.y);
-                asteroids.splice(ai, 1);
-                addScore(100 * (4 - a.size));
-                updateUI();
-            }
-        });
-    });
-    // Bullet-saucer collisions
-    bullets.forEach(function(b, bi) {
-        saucers.forEach(function(s, si) {
-            if (distance(b.x, b.y, s.x, s.y) < s.radius) {
-                bullets.splice(bi, 1);
-                createExplosion(s.x, s.y, "#ff6600", 25);
-                addScore(s.points);
-                saucers.splice(si, 1);
-                updateUI();
-            }
-        });
-    });
-    // Ship-asteroid collisions
-    if (!isShipInvincible()) {
-        asteroids.forEach(function(a, ai) {
-            const avgRadius = a.radii.reduce(function(sum, r) { return sum + r; }, 0) / a.radii.length;
-            if (distance(ship.x, ship.y, a.x, a.y) < avgRadius + ship.radius) {
-                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
-                if (gameMode !== "single") {
-                    handlePlayerDeath();
-                } else {
-                    lives--;
-                    updateUI();
-                    if (lives <= 0) { gameOver(); return; }
-                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
-                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
-                }
-            }
-        });
-    }
-    // Ship-saucer collisions
-    if (!isShipInvincible()) {
-        saucers.forEach(function(s, si) {
-            if (distance(ship.x, ship.y, s.x, s.y) < s.radius + ship.radius) {
-                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
-                createExplosion(s.x, s.y, "#ff6600", 25);
-                saucers.splice(si, 1);
-                if (gameMode !== "single") {
-                    handlePlayerDeath();
-                } else {
-                    lives--;
-                    updateUI();
-                    if (lives <= 0) { gameOver(); return; }
-                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
-                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
-                }
-            }
-        });
-    }
-    // Ship-saucerBullet collisions
-    if (!isShipInvincible()) {
-        saucerBullets.forEach(function(b, bi) {
-            if (distance(ship.x, ship.y, b.x, b.y) < ship.radius + 5) {
-                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
-                saucerBullets.splice(bi, 1);
-                if (gameMode !== "single") {
-                    handlePlayerDeath();
-                } else {
-                    lives--;
-                    updateUI();
-                    if (lives <= 0) { gameOver(); return; }
-                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
-                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
-                }
-            }
-        });
-    }
-    // Power-up pickups
-    powerUps.forEach(function(p, pi) {
-        if (distance(ship.x, ship.y, p.x, p.y) < 30) {
-            powerUps.splice(pi, 1);
-            if (sfxReady) sfx.play('Power_Up_Collect');
-            createExplosion(p.x, p.y, "#00ff00", 10);
-            switch (p.type) {
-                case "shield": ship.shield = 600; break;
-                case "rapid": ship.rapidFire = 600; break;
-                case "multi": ship.multiShot = 600; break;
-                case "life": lives = Math.min(lives + 1, 5); updateUI(); break;
-            }
-        }
-    });
-    // Next level
-    if (asteroids.length === 0) {
-        level++;
-        updateUI();
-        spawnAsteroids(3 + level);
-        saucerSpawnTimer = 0;
-    }
-    shake.update(1/60);
-}
-function draw() {
-    ctx.save();
-    if (shake.isActive) ctx.translate(shake.offsetX, shake.offsetY);
-    ctx.fillStyle = "#000";
-    ctx.fillRect(0, 0, canvas.width, canvas.height);
-    // Stars
-    stars.forEach(function(s) {
-        ctx.fillStyle = "rgba(255, 255, 255, " + s.brightness + ")";
-        ctx.beginPath();
-        ctx.arc(s.x, s.y, s.size, 0, 2 * Math.PI);
-        ctx.fill();
-    });
-    // Particles
-    particles.draw(ctx);
-    // Power-ups
-    powerUps.forEach(function(p) {
-        const pulse = 5 * Math.sin(p.pulse);
-        ctx.strokeStyle = p.type === "shield" ? "#00ffff" : p.type === "rapid" ? "#ff0000" : p.type === "multi" ? "#ffff00" : "#00ff00";
-        ctx.lineWidth = 2;
-        ctx.shadowColor = ctx.strokeStyle;
-        ctx.shadowBlur = 15;
-        ctx.beginPath();
-        ctx.arc(p.x, p.y, 15 + pulse, 0, 2 * Math.PI);
-        ctx.stroke();
-        ctx.fillStyle = ctx.strokeStyle;
-        ctx.font = "12px Arial";
-        ctx.textAlign = "center";
-        ctx.textBaseline = "middle";
-        const icon = p.type === "shield" ? "S" : p.type === "rapid" ? "R" : p.type === "multi" ? "M" : "+";
-        ctx.fillText(icon, p.x, p.y);
-        ctx.shadowBlur = 0;
-    });
-    // Asteroids
-    asteroids.forEach(function(a) {
-        ctx.save();
-        ctx.translate(a.x, a.y);
-        ctx.rotate(a.rotation);
-        ctx.strokeStyle = a.color;
-        ctx.lineWidth = 2;
-        ctx.shadowColor = a.color;
-        ctx.shadowBlur = 20;
-        ctx.beginPath();
-        for (let i = 0; i < a.points; i++) {
-            const angle = i / a.points * Math.PI * 2;
-            const r = a.radii[i];
-            const x = Math.cos(angle) * r;
-            const y = Math.sin(angle) * r;
-            if (i === 0) ctx.moveTo(x, y); else ctx.lineTo(x, y);
-        }
-        ctx.closePath();
-        ctx.stroke();
-        ctx.restore();
-    });
-    // Saucers
-    saucers.forEach(function(s) {
-        ctx.save();
-        ctx.translate(s.x, s.y);
-        ctx.strokeStyle = "#ff6600";
-        ctx.lineWidth = 2;
-        ctx.shadowColor = "#ff6600";
-        ctx.shadowBlur = 20;
-        const r = s.radius;
-        ctx.beginPath(); ctx.ellipse(0, -0.2 * r, 0.4 * r, 0.3 * r, 0, Math.PI, 0); ctx.stroke();
-        ctx.beginPath(); ctx.ellipse(0, 0, r, 0.35 * r, 0, 0, 2 * Math.PI); ctx.stroke();
-        ctx.beginPath(); ctx.ellipse(0, 0.15 * r, 0.5 * r, 0.2 * r, 0, 0, Math.PI); ctx.stroke();
-        ctx.fillStyle = "#ff6600";
-        for (let i = 0; i < 3; i++) {
-            const lx = (i - 1) * r * 0.5;
-            ctx.beginPath(); ctx.arc(lx, 0, 3, 0, 2 * Math.PI); ctx.fill();
-        }
-        ctx.restore();
-    });
-    // Saucer bullets
-    saucerBullets.forEach(function(b) {
-        ctx.fillStyle = "#ff6600";
-        ctx.shadowColor = "#ff6600";
-        ctx.shadowBlur = 15;
-        ctx.beginPath();
-        ctx.arc(b.x, b.y, 4, 0, 2 * Math.PI);
-        ctx.fill();
-    });
-    // Player bullets — use active player color
-    const bulletColor = getActivePlayerColor();
-    bullets.forEach(function(b) {
-        ctx.fillStyle = bulletColor;
-        ctx.shadowColor = bulletColor;
-        ctx.shadowBlur = 15;
-        ctx.beginPath();
-        ctx.arc(b.x, b.y, 3, 0, 2 * Math.PI);
-        ctx.fill();
-        ctx.strokeStyle = bulletColor.replace(")", ", 0.5)").replace("rgb", "rgba").replace("#", "");
-        // Use hex alpha approach for trail
-        ctx.globalAlpha = 0.5;
-        ctx.strokeStyle = bulletColor;
-        ctx.lineWidth = 2;
-        ctx.beginPath();
-        ctx.moveTo(b.x, b.y);
-        ctx.lineTo(b.x - 2 * b.vx, b.y - 2 * b.vy);
-        ctx.stroke();
-        ctx.globalAlpha = 1;
-    });
-    // Ship — use active player color
-    const shipColor = getActivePlayerColor();
-    if (gameRunning && (ship.invincible <= 0 || Math.floor(ship.invincible / 5) % 2 === 0)) {
-        ctx.save();
-        ctx.translate(ship.x, ship.y);
-        ctx.rotate(ship.angle);
-        if (ship.shield > 0) {
-            ctx.strokeStyle = shipColor.replace("ff", "80"); // semi-transparent
-            ctx.globalAlpha = 0.5;
-            ctx.strokeStyle = shipColor;
-            ctx.lineWidth = 2;
-            ctx.shadowColor = shipColor;
-            ctx.shadowBlur = 20;
-            ctx.beginPath();
-            ctx.arc(0, 0, 25, 0, 2 * Math.PI);
-            ctx.stroke();
-            ctx.globalAlpha = 1;
-        }
-        if (hyperspaceInvincible > 0) {
-            ctx.strokeStyle = "rgba(255, 255, 255, " + (0.3 + 0.2 * Math.sin(hyperspaceInvincible * 0.3)) + ")";
-            ctx.lineWidth = 1;
-            ctx.shadowColor = "#ffffff";
-            ctx.shadowBlur = 25;
-            ctx.beginPath();
-            ctx.arc(0, 0, 22, 0, 2 * Math.PI);
-            ctx.stroke();
-        }
-        ctx.strokeStyle = shipColor;
-        ctx.lineWidth = 2;
-        ctx.shadowColor = shipColor;
-        ctx.shadowBlur = 15;
-        ctx.beginPath();
-        ctx.moveTo(20, 0);
-        ctx.lineTo(-15, -12);
-        ctx.lineTo(-8, 0);
-        ctx.lineTo(-15, 12);
-        ctx.closePath();
-        ctx.stroke();
-        if (ship.thrust > 0.1) {
-            ctx.strokeStyle = "#ff6600";
-            ctx.shadowColor = "#ff6600";
-            ctx.beginPath();
-            ctx.moveTo(-8, -5);
-            ctx.lineTo(-20 - 10 * Math.random() * ship.thrust, 0);
-            ctx.lineTo(-8, 5);
-            ctx.stroke();
-        }
-        ctx.restore();
-    }
-    ctx.shadowBlur = 0;
-    ctx.restore();
-}
-// --- Game Over & High Score Entry ---
-function gameOver() {
-    gameRunning = false;
-    stopAmbient();
-    sfx.stop('Ship_Thrust');
-    if (qualifiesForHighScore(score)) {
-        hsEntryPlayerIndex = -1;
-        showHighScoreEntry();
-    } else {
-        showGameOverScreen();
-    }
-}
-function showGameOverScreen() {
-    document.getElementById("finalScore").textContent = score.toLocaleString();
-    document.getElementById("gameOverScreen").style.display = "block";
-    updateAllPrompts();
-}
-function showHighScoreEntry() {
-    hsFinalScore = score;
-    hsSlots = [0, 0, 0];
-    hsActiveSlot = 0;
-    hsEntryActive = true;
-    document.getElementById("hsScore").textContent = score.toLocaleString();
-    updateSlotDisplay();
-    document.getElementById("highScoreEntry").style.display = "block";
-    updateAllPrompts();
-}
-function updateSlotDisplay() {
-    for (let i = 0; i < 3; i++) {
-        const el = document.getElementById("slot" + i);
-        el.textContent = String.fromCharCode(65 + hsSlots[i]);
-        el.className = "initial-slot" + (i === hsActiveSlot ? " active" : "");
-    }
-}
-function confirmHighScore() {
-    const initials = String.fromCharCode(65 + hsSlots[0]) +
-                     String.fromCharCode(65 + hsSlots[1]) +
-                     String.fromCharCode(65 + hsSlots[2]);
-    insertHighScore(initials, hsFinalScore);
-    hsEntryActive = false;
-    document.getElementById("highScoreEntry").style.display = "none";
-    // In multiplayer, store initials and advance
-    if (hsEntryPlayerIndex >= 0 && gameMode !== "single") {
-        players[hsEntryPlayerIndex].initials = initials;
-        advanceToNextPlayer();
-    } else {
-        showGameOverScreen();
-    }
-}
-var _turnStartPressed = false;
-function gameLoop() {
-    keyboard.poll();
-    gamepad.poll();
-    // --- Turn ready overlay: cooldown then wait for player input ---
-    if (turnReady) {
-        updateTurnPrompt();
-        if (getTurnCooldownRemaining() <= 0) {
-            if (gpConfirm() || _turnStartPressed) {
-                _turnStartPressed = false;
-                startPlayerTurn();
-            }
-        }
-        // Still draw background
-        draw();
-        saveDirState();
-        requestAnimationFrame(gameLoop);
-        return;
-    }
-    // Gamepad menu/HS entry controls (when game not running)
-    if (hsEntryActive) {
-        if (gpUp()) { hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 1) % 26; updateSlotDisplay(); }
-        if (gpDown()) { hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 25) % 26; updateSlotDisplay(); }
-        if (gpLeft()) { hsActiveSlot = Math.max(0, hsActiveSlot - 1); updateSlotDisplay(); }
-        if (gpRight()) { hsActiveSlot = Math.min(2, hsActiveSlot + 1); updateSlotDisplay(); }
-        // A = accept letter & advance, confirm on last slot
-        if (gpConfirm()) {
-            if (hsActiveSlot < 2) { hsActiveSlot++; updateSlotDisplay(); }
-            else confirmHighScore();
-        }
-        // B = go back one slot
-        if (gpBack()) {
-            if (hsActiveSlot > 0) { hsActiveSlot--; updateSlotDisplay(); }
-        }
-    } else if (!gameRunning) {
-        // Start screen navigation with gamepad (d-pad + A/B)
-        if (document.getElementById("startScreen").style.display !== "none") {
-            if (startScreenPhase === "mode" || startScreenPhase === "submode") {
-                if (gpUp()) menuMove(-1);
-                if (gpDown()) menuMove(1);
-                if (gpConfirm()) menuConfirm();
-                if (gpBack()) menuBack(); // B = back
-            } else if (startScreenPhase === "count") {
-                if (gpLeft()) adjustPlayerCount(-1);
-                if (gpRight()) adjustPlayerCount(1);
-                if (gpConfirm()) confirmPlayerCount();
-                if (gpBack()) menuBack(); // B = back
-            }
-        }
-        // Game over screen — restart
-        const gameOverScreen = document.getElementById("gameOverScreen");
-        if (gameOverScreen.style.display === "block") {
-            if (gpConfirm() || gpPause()) {
-                gameOverScreen.style.display = "none";
-                resetStartScreen();
-            }
-        }
-        // Final scoreboard — play again
-        if (document.getElementById("finalScoreboard").classList.contains("visible")) {
-            if (gpConfirm() || gpPause()) {
-                resetStartScreen();
-            }
-        }
-    }
-    update();
-    draw();
-    saveDirState();
-    requestAnimationFrame(gameLoop);
-}
-// --- Input Handling (one-shot keyboard actions) ---
-// Continuous key state is handled by keyboard.isDown() via RetroGame.createKeyboard()
-document.addEventListener("keydown", function(e) {
-    // Turn ready: SPACE to start
-    if (turnReady) {
-        if (e.code === "Space") {
-            _turnStartPressed = true;
-            e.preventDefault();
-        }
-        return;
-    }
-    if (hsEntryActive) {
-        if (e.code === "ArrowLeft") {
-            hsActiveSlot = Math.max(0, hsActiveSlot - 1);
-            updateSlotDisplay();
-        } else if (e.code === "ArrowRight") {
-            hsActiveSlot = Math.min(2, hsActiveSlot + 1);
-            updateSlotDisplay();
-        } else if (e.code === "ArrowUp") {
-            hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 1) % 26;
-            updateSlotDisplay();
-        } else if (e.code === "ArrowDown") {
-            hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 25) % 26;
-            updateSlotDisplay();
-        } else if (e.code === "Enter") {
-            confirmHighScore();
-        }
-        e.preventDefault();
-        return;
-    }
-    // Start screen keyboard navigation
-    if (!gameRunning && document.getElementById("startScreen").style.display !== "none") {
-        if (startScreenPhase === "mode" || startScreenPhase === "submode") {
-            if (e.code === "ArrowUp") { menuMove(-1); e.preventDefault(); }
-            if (e.code === "ArrowDown") { menuMove(1); e.preventDefault(); }
-            if (e.code === "Space" || e.code === "Enter") { menuConfirm(); e.preventDefault(); }
-            if (e.code === "Escape" || e.code === "Backspace") { menuBack(); e.preventDefault(); }
-        } else if (startScreenPhase === "count") {
-            if (e.code === "ArrowLeft") { adjustPlayerCount(-1); e.preventDefault(); }
-            if (e.code === "ArrowRight") { adjustPlayerCount(1); e.preventDefault(); }
-            if (e.code === "Space" || e.code === "Enter") { confirmPlayerCount(); e.preventDefault(); }
-            if (e.code === "Escape" || e.code === "Backspace") { menuBack(); e.preventDefault(); }
-        }
-        return;
-    }
-    if (e.code === "KeyP" && gameRunning) {
-        gamePaused = !gamePaused;
-        if (gamePaused) {
-            pauseOverlay.classList.add("visible");
-        } else {
-            pauseOverlay.classList.remove("visible");
-        }
-    }
-    if (e.code === "KeyH" && gameRunning && !gamePaused) {
-        hyperspace();
-    }
-    // Game over: space or enter to go back to start
-    const gameOverScreen = document.getElementById("gameOverScreen");
-    if (!gameRunning && gameOverScreen.style.display === "block" && (e.code === "Space" || e.code === "Enter")) {
-        gameOverScreen.style.display = "none";
-        resetStartScreen();
-        e.preventDefault();
-        return;
-    }
-    // Final scoreboard: space or enter to go back to start
-    if (!gameRunning && document.getElementById("finalScoreboard").classList.contains("visible") && (e.code === "Space" || e.code === "Enter")) {
-        resetStartScreen();
-        e.preventDefault();
-        return;
-    }
-    if (["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(e.code)) {
-        e.preventDefault();
-    }
-});
-document.getElementById("restartBtn").addEventListener("click", function() {
-    document.getElementById("gameOverScreen").style.display = "none";
-    resetStartScreen();
-});
-// Initialize
-updateAllPrompts();
-initStars();
-gameLoop();
-    </script>
-<script id="page-helpers" src="/api/page-helpers.js?v=3" data-locked="true"></script><script id="page-script" src="/api/page-script.js?v=3" data-locked="true"></script></body></html>
+<!DOCTYPE html><html lang="en"><head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>SynthOS</title>
+    <script id="theme-info" src="/api/theme-info.js" data-locked="true"></script>
+    <link id="theme-css" rel="stylesheet" href="/api/theme.css" data-locked="true">
+    <style>
+#game-wrapper{width:100%;height:100%;display:flex;align-items:flex-start;justify-content:center;background:#000;overflow:hidden}
+#game-container{position:relative;border:1px solid rgba(0,255,255,.25);box-shadow:0 0 24px rgba(0,255,255,.1),inset 0 0 24px rgba(0,255,255,.05);overflow:hidden;flex-shrink:0}
+#gameCanvas{display:block;width:100%;height:100%}
+.game-ui{position:absolute;top:20px;left:20px;right:20px;display:flex;justify-content:space-between;pointer-events:none;z-index:10}
+.level-display,.lives-display,.score-display{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff;letter-spacing:2px}
+.mute-btn{pointer-events:auto;background:none;border:1px solid rgba(0,255,255,.4);border-radius:4px;color:#0ff;cursor:pointer;padding:2px 6px;font-size:16px;line-height:1;opacity:.7;transition:opacity .2s}.mute-btn:hover{opacity:1}
+.player-indicator{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;text-shadow:0 0 10px currentColor,0 0 20px currentColor;letter-spacing:2px;margin-right:8px}
+.game-over-screen,.start-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:20}
+.game-over-screen h1,.start-screen h1{font-family:Orbitron,'Segoe UI',sans-serif;font-size:48px;line-height:1.2;color:#f0f;text-shadow:0 0 20px #f0f,0 0 40px #f0f,0 0 60px #f0f;margin-bottom:20px;letter-spacing:5px}
+.game-over-screen p,.start-screen p{font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff;margin-bottom:30px}
+.restart-btn,.start-btn,.mode-btn{padding:15px 40px;font-size:18px;font-family:Orbitron,'Segoe UI',sans-serif;background:0 0;border:2px solid #0ff;color:#0ff;cursor:pointer;text-transform:uppercase;letter-spacing:3px;transition:.3s;box-shadow:0 0 20px rgba(0,255,255,.3),inset 0 0 20px rgba(0,255,255,.1)}
+.restart-btn:hover,.start-btn:hover,.mode-btn:hover{background:rgba(0,255,255,.2);box-shadow:0 0 30px rgba(0,255,255,.5),inset 0 0 30px rgba(0,255,255,.2);transform:scale(1.05)}
+.controls-info{position:absolute;bottom:16px;right:20px;font-size:13px;color:rgba(0,255,255,.5);text-align:right;letter-spacing:1px;display:flex;align-items:center;gap:16px;font-family:'Segoe UI',sans-serif}
+.controls-info .action-item{display:inline-flex;align-items:center;gap:4px}
+/* Mode selection */
+.mode-select{display:flex;flex-direction:column;gap:12px;align-items:center;margin-bottom:20px}
+.mode-btn{padding:12px 36px;font-size:16px;min-width:240px}
+.mode-btn.selected{background:rgba(0,255,255,.25);border-color:#fff;color:#fff;box-shadow:0 0 30px rgba(0,255,255,.6),inset 0 0 20px rgba(0,255,255,.3)}
+/* Player count selector */
+.player-count-select{display:none;flex-direction:column;align-items:center;gap:12px;margin-top:16px}
+.player-count-select.visible{display:flex}
+.player-count-row{display:flex;align-items:center;gap:16px}
+.player-count-arrow{font-size:28px;color:#0ff;cursor:pointer;user-select:none;text-shadow:0 0 10px #0ff;padding:4px 12px;transition:.2s}
+.player-count-arrow:hover{color:#fff;text-shadow:0 0 15px #fff}
+.player-count-num{font-family:Orbitron,'Segoe UI',sans-serif;font-size:36px;color:#f0f;text-shadow:0 0 15px #f0f,0 0 30px #f0f;min-width:50px;text-align:center}
+.player-count-label{font-size:14px;color:rgba(0,255,255,.6);letter-spacing:2px}
+.player-count-confirm{margin-top:8px}
+/* Sub-mode selection */
+.submode-select{display:none;flex-direction:column;align-items:center;gap:12px;margin-top:16px}
+.submode-select.visible{display:flex}
+.submode-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:14px;color:rgba(0,255,255,.7);letter-spacing:2px;margin-bottom:4px}
+.submode-btn{padding:10px 30px;font-size:14px;min-width:220px;font-family:Orbitron,'Segoe UI',sans-serif;background:0 0;border:2px solid #0ff;color:#0ff;cursor:pointer;text-transform:uppercase;letter-spacing:2px;transition:.3s;box-shadow:0 0 15px rgba(0,255,255,.2),inset 0 0 15px rgba(0,255,255,.08)}
+.submode-btn:hover{background:rgba(0,255,255,.2);box-shadow:0 0 25px rgba(0,255,255,.5);transform:scale(1.03)}
+.submode-desc{font-size:11px;color:rgba(0,255,255,.45);font-family:'Segoe UI',sans-serif;max-width:280px;text-align:center;margin-top:-4px}
+/* Side panels */
+.side-panel{width:200px;flex-shrink:0;padding:20px 16px;display:flex;flex-direction:column;font-family:Orbitron,'Segoe UI',sans-serif;box-sizing:border-box;overflow:hidden}
+.side-panel.hidden{display:none}
+.side-panel h2{font-size:16px;letter-spacing:3px;margin:0 0 16px 0;text-align:center;font-weight:700}
+#side-leaderboard{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px rgba(255,0,255,.4)}
+#side-leaderboard h2{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px #f0f}
+#side-controls{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px rgba(0,255,255,.4)}
+#side-controls h2{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff}
+.leaderboard-table{width:100%;border-collapse:collapse;font-family:'Courier New',monospace;font-size:13px}
+.leaderboard-table td{padding:4px 0;white-space:nowrap}
+.leaderboard-table .rank{width:24px;color:rgba(255,0,255,.6);text-align:right;padding-right:6px}
+.leaderboard-table .initials{color:#f0f;letter-spacing:2px}
+.leaderboard-table .hs-score{text-align:right;color:rgba(255,0,255,.7);position:relative;cursor:default}
+.leaderboard-table .hs-score.overflow{animation:scoreFlash 0.8s ease-in-out infinite}
+.leaderboard-table .hs-score[title]:hover::after{content:attr(title);position:absolute;right:0;top:-22px;background:#1a0028;color:#f0f;font-size:11px;padding:2px 6px;border:1px solid rgba(255,0,255,.4);border-radius:3px;white-space:nowrap;z-index:5;pointer-events:none}
+@keyframes scoreFlash{0%,100%{opacity:1}50%{opacity:.4}}
+.score-display .score-overflow{animation:hudScoreFlash 0.8s ease-in-out infinite}
+@keyframes hudScoreFlash{0%,100%{color:#0ff;text-shadow:0 0 10px #0ff,0 0 20px #0ff}50%{color:#f0f;text-shadow:0 0 10px #f0f,0 0 20px #f0f}}
+.controls-list{list-style:none;padding:0;margin:0;font-size:12px}
+.controls-list li{padding:6px 0;display:flex;gap:8px;align-items:center;color:#0ff}
+.controls-list .key-icon{display:inline-block;min-width:50px;padding:2px 6px;border:1px solid rgba(0,255,255,.4);border-radius:3px;text-align:center;font-size:11px;color:#0ff;background:rgba(0,255,255,.05);flex-shrink:0}
+.controls-list .key-desc{color:rgba(0,255,255,.7);font-family:'Segoe UI',sans-serif}
+.bt-section{margin-top:auto;padding-top:16px;border-top:1px solid rgba(0,255,255,.15)}
+.bt-section h3{font-size:11px;letter-spacing:2px;color:rgba(0,255,255,.5);margin:0 0 8px 0;text-align:center;font-weight:400}
+.bt-section p{font-size:11px;color:rgba(0,255,255,.4);font-family:'Segoe UI',sans-serif;margin:0 0 4px 0;line-height:1.4}
+.side-panel{overflow-y:auto}
+#side-leaderboard{padding-top:20px}
+#side-controls{padding-top:20px}
+/* Gamepad status indicator */
+#gamepadStatus{text-align:center;padding:8px 0;margin-bottom:12px;font-size:11px;letter-spacing:2px;border:1px solid rgba(0,255,255,.15);border-radius:4px;transition:all .3s;color:rgba(0,255,255,.3);text-shadow:none}
+#gamepadStatus.connected{color:#0f0;text-shadow:0 0 8px #0f0,0 0 16px rgba(0,255,0,.4);border-color:rgba(0,255,0,.3);background:rgba(0,255,0,.05);animation:gpPulse 2s ease-in-out infinite}
+@keyframes gpPulse{0%,100%{box-shadow:0 0 4px rgba(0,255,0,.1)}50%{box-shadow:0 0 12px rgba(0,255,0,.25)}}
+/* Pause overlay */
+#pauseOverlay{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;z-index:25;background:rgba(0,0,0,.5);flex-direction:column;gap:8px}
+#pauseOverlay.visible{display:flex}
+#pauseOverlay .pause-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:48px;color:#0ff;text-shadow:0 0 20px #0ff,0 0 40px #0ff,0 0 60px #0ff;letter-spacing:8px}
+#pauseOverlay .pause-hint{font-family:'Segoe UI',sans-serif;font-size:14px;color:rgba(0,255,255,.5);letter-spacing:1px}
+/* High score entry */
+#highScoreEntry{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:30;display:none}
+#highScoreEntry h2{font-family:Orbitron,'Segoe UI',sans-serif;font-size:24px;color:#f0f;text-shadow:0 0 15px #f0f,0 0 30px #f0f;margin-bottom:10px;letter-spacing:3px}
+#highScoreEntry .hs-final-score{font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px;color:#0ff;text-shadow:0 0 10px #0ff;margin-bottom:20px}
+.initial-slots{display:flex;justify-content:center;gap:12px;margin-bottom:20px}
+.initial-slot{width:40px;height:50px;border:2px solid #f0f;display:flex;align-items:center;justify-content:center;font-family:Orbitron,'Segoe UI',sans-serif;font-size:28px;color:#f0f;text-shadow:0 0 10px #f0f;box-shadow:0 0 10px rgba(255,0,255,.3)}
+.initial-slot.active{border-color:#0ff;color:#0ff;text-shadow:0 0 10px #0ff;box-shadow:0 0 15px rgba(0,255,255,.5)}
+.hs-instructions{font-size:12px;color:rgba(0,255,255,.6);font-family:'Segoe UI',sans-serif;margin-bottom:16px}
+/* Keyboard key hint (for bottom bar) */
+.kb-key{display:inline-block;padding:1px 6px;border:1px solid rgba(0,255,255,.35);border-radius:3px;font-size:11px;color:rgba(0,255,255,.7);background:rgba(0,255,255,.05);vertical-align:middle;margin:0 2px;font-family:'Segoe UI',sans-serif}
+/* Focused menu item */
+.mode-btn.focused,.submode-btn.focused{background:rgba(0,255,255,.2);border-color:#fff;color:#fff;box-shadow:0 0 25px rgba(0,255,255,.5),inset 0 0 20px rgba(0,255,255,.2)}
+/* Turn ready overlay */
+#turnReadyOverlay{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:26;background:rgba(0,0,0,.7)}
+#turnReadyOverlay.visible{display:flex}
+#turnReadyOverlay .turn-player{font-family:Orbitron,'Segoe UI',sans-serif;font-size:42px;text-shadow:0 0 20px currentColor,0 0 40px currentColor;letter-spacing:6px}
+#turnReadyOverlay .turn-subtitle{font-family:Orbitron,'Segoe UI',sans-serif;font-size:22px;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.6);letter-spacing:4px;margin-bottom:8px}
+#turnReadyOverlay .turn-prompt{font-family:'Segoe UI',sans-serif;font-size:16px;color:rgba(0,255,255,.6);letter-spacing:1px}
+/* Final scoreboard overlay */
+#finalScoreboard{position:absolute;top:0;left:0;right:0;bottom:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:16px;z-index:27;background:rgba(0,0,0,.8)}
+#finalScoreboard.visible{display:flex}
+#finalScoreboard .sb-title{font-family:Orbitron,'Segoe UI',sans-serif;font-size:32px;color:#f0f;text-shadow:0 0 20px #f0f,0 0 40px #f0f;letter-spacing:5px;margin-bottom:8px}
+#finalScoreboard .sb-subtitle{font-family:Orbitron,'Segoe UI',sans-serif;font-size:14px;color:rgba(255,255,255,.5);letter-spacing:3px;margin-bottom:12px}
+.sb-table{border-collapse:collapse;font-family:Orbitron,'Segoe UI',sans-serif;font-size:18px}
+.sb-table td{padding:8px 16px}
+.sb-table .sb-rank{color:rgba(255,255,255,.5);text-align:right;font-size:14px}
+.sb-table .sb-player{letter-spacing:3px}
+.sb-table .sb-initials{font-size:14px;color:rgba(255,255,255,.5);letter-spacing:2px}
+.sb-table .sb-score{text-align:right;color:#fff;letter-spacing:2px}
+.sb-play-again{margin-top:16px}
+    </style>
+    <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&amp;display=swap" rel="stylesheet">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+</head>
+<body>
+    <div class="viewer-panel full-viewer" id="viewerPanel" style="background:#000;">
+        <div id="game-wrapper">
+            <div id="side-leaderboard" class="side-panel hidden">
+                <h2>HIGH SCORES</h2>
+                <table class="leaderboard-table">
+                    <tbody id="leaderboardBody"></tbody>
+                </table>
+            </div>
+            <div id="game-container">
+                <canvas id="gameCanvas"></canvas>
+                <div class="game-ui">
+                    <div class="score-display"><span id="playerIndicator" class="player-indicator" style="display:none"></span>SCORE: <span id="score">00000</span></div>
+                    <div class="level-display">LEVEL: <span id="level">1</span></div>
+                    <div class="lives-display">LIVES: <span id="lives">3</span></div>
+                    <button class="mute-btn" id="muteBtn" title="Toggle sound">🔊</button>
+                </div>
+                <div id="pauseOverlay"><span class="pause-title">PAUSED</span><span class="pause-hint" id="pauseHint"></span></div>
+                <div id="turnReadyOverlay">
+                    <div class="turn-player" id="turnPlayerName">PLAYER 1</div>
+                    <div class="turn-subtitle">YOUR TURN</div>
+                    <div class="turn-prompt" id="turnPrompt">Press SPACE to start</div>
+                </div>
+                <div id="finalScoreboard">
+                    <div class="sb-title">GAME OVER</div>
+                    <div class="sb-subtitle" id="sbSubtitle">FINAL STANDINGS</div>
+                    <table class="sb-table"><tbody id="sbBody"></tbody></table>
+                    <button class="restart-btn sb-play-again" id="sbPlayAgain">PLAY AGAIN</button>
+                </div>
+                <div class="start-screen" id="startScreen">
+                    <h1>NEON<br>ASTEROIDS</h1>
+                    <p>Navigate the cosmic void. Destroy all asteroids. Beware the saucers!</p>
+                    <div class="mode-select" id="modeSelect">
+                        <button class="mode-btn" id="btn1P">START MISSION</button>
+                        <button class="mode-btn" id="btnPassPlay">PASS &amp; PLAY</button>
+                    </div>
+                    <div class="submode-select" id="submodeSelect">
+                        <div class="submode-title">CHOOSE MODE</div>
+                        <button class="submode-btn" id="btnSoloTurns">SOLO TURNS</button>
+                        <div class="submode-desc">Each player gets a fresh game. Highest total score wins.</div>
+                        <button class="submode-btn" id="btnHotSeat">HOT SEAT</button>
+                        <div class="submode-desc">Shared asteroid field. Rotate on each death. Last one standing!</div>
+                    </div>
+                    <div class="player-count-select" id="playerCountSelect">
+                        <div class="player-count-label">PLAYERS</div>
+                        <div class="player-count-row">
+                            <span class="player-count-arrow" id="pcLeft">←</span>
+                            <span class="player-count-num" id="pcNum">2</span>
+                            <span class="player-count-arrow" id="pcRight">→</span>
+                        </div>
+                        <button class="mode-btn player-count-confirm" id="pcConfirm">START</button>
+                    </div>
+                </div>
+                <div class="game-over-screen" id="gameOverScreen" style="display: none;">
+                    <h1>GAME OVER</h1>
+                    <p>Final Score: <span id="finalScore">0</span></p>
+                    <button class="restart-btn" id="restartBtn">TRY AGAIN</button>
+                </div>
+                <div id="highScoreEntry">
+                    <h2>NEW HIGH SCORE!</h2>
+                    <div class="hs-final-score">SCORE: <span id="hsScore">0</span></div>
+                    <div class="initial-slots">
+                        <div class="initial-slot active" id="slot0">A</div>
+                        <div class="initial-slot" id="slot1">A</div>
+                        <div class="initial-slot" id="slot2">A</div>
+                    </div>
+                    <div class="hs-instructions" id="hsInstructions">LEFT/RIGHT select slot • UP/DOWN change letter • ENTER confirm</div>
+                </div>
+                <div class="controls-info" id="controlsInfo">WASD / ARROWS to move • SPACE to fire • H hyperspace • P pause</div>
+            </div>
+            <div id="side-controls" class="side-panel hidden">
+                <div id="gamepadStatus">NO GAMEPAD</div>
+                <h2>CONTROLS</h2>
+                <ul class="controls-list" id="controlsList">
+                    <li><span class="key-icon">W/↑</span><span class="key-desc">Thrust</span></li>
+                    <li><span class="key-icon">A/←</span><span class="key-desc">Rotate Left</span></li>
+                    <li><span class="key-icon">D/→</span><span class="key-desc">Rotate Right</span></li>
+                    <li><span class="key-icon">SPACE</span><span class="key-desc">Fire</span></li>
+                    <li><span class="key-icon">H</span><span class="key-desc">Hyperspace</span></li>
+                    <li><span class="key-icon">P</span><span class="key-desc">Pause</span></li>
+                </ul>
+                <h2 style="margin-top:24px">POWER-UPS</h2>
+                <ul class="controls-list">
+                    <li><span class="key-icon" style="color:#0ff;border-color:rgba(0,255,255,.4)">S</span><span class="key-desc">Shield</span></li>
+                    <li><span class="key-icon" style="color:#f00;border-color:rgba(255,0,0,.4)">R</span><span class="key-desc">Rapid Fire</span></li>
+                    <li><span class="key-icon" style="color:#ff0;border-color:rgba(255,255,0,.4)">M</span><span class="key-desc">Multi-Shot</span></li>
+                    <li><span class="key-icon" style="color:#0f0;border-color:rgba(0,255,0,.4)">+</span><span class="key-desc">Extra Life</span></li>
+                </ul>
+                <div class="bt-section" id="btSection"></div>
+            </div>
+        </div>
+    </div>
+    <div id="instructions" style="display: none;" data-locked="true"></div>
+    <div id="thoughts" style="display: none;" data-locked="true"></div>
+    <script src="/static/retro-game.js"></script>
+    <script id="asteroids-game">
+RetroGame.injectCSS();
+// --- Sound Effects ---
+var sfx = RetroGame.createSoundEffects();
+var sfxReady = false;
+sfx.load().then(function() {
+    console.log('✓ Sound effects loaded successfully');
+    sfxReady = true;
+}).catch(function(e) {
+    console.error('✗ Sound effects failed to load:', e);
+    console.error('Make sure effects.json exists in page file storage');
+    console.error('Upload it via: synthos.files.upload("effects.json", blob)');
+});
+// Mute toggle
+var sfxMuted = false;
+document.getElementById("muteBtn").addEventListener("click", function() {
+    sfxMuted = !sfxMuted;
+    sfx.volume = sfxMuted ? 0 : 1;
+    this.innerHTML = sfxMuted ? "\u{1F507}" : "\u{1F50A}";
+});
+var ambientPlaying = false;
+var ambientTimeout = null;
+var AMBIENT_TRACKS = ['Ambient_Space', 'Ambient_Space2', 'Ambient_Space3'];
+var currentAmbientIndex = -1;
+function startAmbient() {
+    if (ambientPlaying) return;
+    ambientPlaying = true;
+    playNextAmbient();
+}
+function playNextAmbient() {
+    if (!ambientPlaying || !sfxReady) return;
+    // Pick a random track different from the last one
+    let idx;
+    do { idx = Math.floor(Math.random() * AMBIENT_TRACKS.length); } while (idx === currentAmbientIndex && AMBIENT_TRACKS.length > 1);
+    currentAmbientIndex = idx;
+    sfx.play(AMBIENT_TRACKS[idx]);
+}
+function stopAmbient() {
+    ambientPlaying = false;
+    if (ambientTimeout) { clearTimeout(ambientTimeout); ambientTimeout = null; }
+    if (sfxReady) AMBIENT_TRACKS.forEach(function(t) { sfx.stop(t); });
+    currentAmbientIndex = -1;
+}
+var canvas = document.getElementById("gameCanvas");
+var ctx = canvas.getContext("2d");
+var viewerPanel = document.getElementById("viewerPanel");
+var gameContainer = document.getElementById("game-container");
+var sideLeaderboard = document.getElementById("side-leaderboard");
+var sideControls = document.getElementById("side-controls");
+var pauseOverlay = document.getElementById("pauseOverlay");
+var ASPECT = 4 / 3;
+var MAX_SCORE = 99999;
+// Player colors: P1=cyan, P2=magenta, P3=yellow, P4=green
+var PLAYER_COLORS = ["#00ffff", "#ff00ff", "#ffff00", "#00ff00", "#ff6600", "#ff3388", "#33ccff", "#ccff33"];
+var resizeTimer = 0;
+function resizeCanvas() {
+    const vw = viewerPanel.clientWidth;
+    const vh = viewerPanel.clientHeight;
+    if (vw < 1 || vh < 1) return;
+    const panelRatio = vw / vh;
+    let w, h;
+    if (panelRatio > ASPECT) {
+        h = vh;
+        w = Math.floor(h * ASPECT);
+    } else {
+        w = vw;
+        h = Math.floor(w / ASPECT);
+    }
+    gameContainer.style.width = w + "px";
+    gameContainer.style.height = h + "px";
+    canvas.width = w;
+    canvas.height = h;
+    const extraSpace = vw - w;
+    if (extraSpace > 400) {
+        sideLeaderboard.classList.remove("hidden");
+        sideControls.classList.remove("hidden");
+    } else {
+        sideLeaderboard.classList.add("hidden");
+        sideControls.classList.add("hidden");
+    }
+}
+function debouncedResize() {
+    clearTimeout(resizeTimer);
+    resizeCanvas();
+    resizeTimer = setTimeout(resizeCanvas, 300);
+}
+resizeCanvas();
+window.addEventListener("resize", resizeCanvas);
+new MutationObserver(debouncedResize).observe(document.body, { attributes: true, attributeFilter: ["class"] });
+// --- Gamepad input (library) ---
+var gamepad = RetroGame.createGamepad({ deadzone: 0.3 });
+var B = RetroGame.BUTTON;
+var gamepadUI = RetroGame.createGamepadUI(gamepad, { statusElement: document.getElementById("gamepadStatus") });
+// Game-specific gamepad action mappings
+function gpFire()    { return gamepad.isDown(B.A) || gamepad.isDown(B.X) || gamepad.isDown(B.RB) || gamepad.isDown(B.RT); }
+function gpHyper()   { return gamepad.wasPressed(B.B) || gamepad.wasPressed(B.LB); }
+function gpPause()   { return gamepad.wasPressed(B.START); }
+function gpConfirm() { return gamepad.wasPressed(B.A); }
+function gpBack()    { return gamepad.wasPressed(B.B); }
+// Edge-triggered directional helpers (stick + dpad)
+// Track previous directional state for stick-based edge detection
+var _prevDir = { up: false, down: false, left: false, right: false };
+function gpUp()    { var r = gamepad.up && !_prevDir.up; return r; }
+function gpDown()  { var r = gamepad.down && !_prevDir.down; return r; }
+function gpLeft()  { var r = gamepad.left && !_prevDir.left; return r; }
+function gpRight() { var r = gamepad.right && !_prevDir.right; return r; }
+function saveDirState() { _prevDir.up = gamepad.up; _prevDir.down = gamepad.down; _prevDir.left = gamepad.left; _prevDir.right = gamepad.right; }
+// Delegate to library UI
+function gpBtn(name) { return gamepadUI.buttonGlyph(name); }
+function gpBtnName(name) { return gamepadUI.buttonName(name); }
+function gpStartName() { return gamepadUI.startName(); }
+// Returns styled HTML for a non-face button label (game-specific, not in library)
+function gpLabel(text) {
+    return '<span class="gp-label">' + text + '</span>';
+}
+// --- Gamepad-aware text helper ---
+function btnText(kbLabel, gpLabelText) {
+    return gamepad.connected ? gpLabelText : kbLabel;
+}
+// Keyboard key styled span
+function kbKey(text) {
+    return '<span class="kb-key">' + text + '</span>';
+}
+// Build an action item for the bottom bar
+function actionItem(hint, label) {
+    return '<span class="action-item">' + hint + ' ' + label + '</span>';
+}
+// --- Unified bottom bar: menu nav OR game controls ---
+function updateBottomBar() {
+    var bar = document.getElementById("controlsInfo");
+    var startVisible = document.getElementById("startScreen").style.display !== "none";
+    var gameOverVisible = document.getElementById("gameOverScreen").style.display === "block";
+    var scoreboardVisible = document.getElementById("finalScoreboard").classList.contains("visible");
+    // Menu screens — show navigation hints
+    if (startVisible) {
+        if (gamepad.connected) {
+            if (startScreenPhase === "mode") {
+                bar.innerHTML =
+                    actionItem(gpLabel("\u2191\u2193"), "Navigate") +
+                    actionItem(gpBtn("a"), "Select");
+            } else if (startScreenPhase === "submode") {
+                bar.innerHTML =
+                    actionItem(gpLabel("\u2191\u2193"), "Navigate") +
+                    actionItem(gpBtn("a"), "Select") +
+                    actionItem(gpBtn("b"), "Back");
+            } else if (startScreenPhase === "count") {
+                bar.innerHTML =
+                    actionItem(gpLabel("\u2190\u2192"), "Players") +
+                    actionItem(gpBtn("a"), "Start") +
+                    actionItem(gpBtn("b"), "Back");
+            }
+        } else {
+            if (startScreenPhase === "mode") {
+                bar.innerHTML =
+                    actionItem(kbKey("\u2191\u2193"), "Navigate") +
+                    actionItem(kbKey("ENTER"), "Select");
+            } else if (startScreenPhase === "submode") {
+                bar.innerHTML =
+                    actionItem(kbKey("\u2191\u2193"), "Navigate") +
+                    actionItem(kbKey("ENTER"), "Select") +
+                    actionItem(kbKey("ESC"), "Back");
+            } else if (startScreenPhase === "count") {
+                bar.innerHTML =
+                    actionItem(kbKey("\u2190\u2192"), "Players") +
+                    actionItem(kbKey("ENTER"), "Start") +
+                    actionItem(kbKey("ESC"), "Back");
+            }
+        }
+        return;
+    }
+    // High score entry
+    if (hsEntryActive) {
+        if (gamepad.connected) {
+            bar.innerHTML =
+                actionItem(gpLabel("\u2191\u2193"), "Letter") +
+                actionItem(gpBtn("a"), "Next") +
+                actionItem(gpBtn("b"), "Back");
+        } else {
+            bar.innerHTML =
+                actionItem(kbKey("\u2191\u2193"), "Letter") +
+                actionItem(kbKey("\u2190\u2192"), "Slot") +
+                actionItem(kbKey("ENTER"), "Confirm");
+        }
+        return;
+    }
+    // Game over / scoreboard
+    if (gameOverVisible || scoreboardVisible) {
+        if (gamepad.connected) {
+            bar.innerHTML = actionItem(gpBtn("a"), "Continue");
+        } else {
+            bar.innerHTML = actionItem(kbKey("ENTER"), "Continue");
+        }
+        return;
+    }
+    // In-game controls
+    if (gamepad.connected) {
+        bar.innerHTML =
+            actionItem(gpLabel("L-Stick"), "Move") +
+            actionItem(gpBtn("a"), "Fire") +
+            actionItem(gpBtn("b"), "Hyperspace") +
+            actionItem(gpLabel(gpStartName()), "Pause");
+    } else {
+        bar.innerHTML =
+            actionItem(kbKey("WASD"), "Move") +
+            actionItem(kbKey("SPACE"), "Fire") +
+            actionItem(kbKey("H"), "Hyperspace") +
+            actionItem(kbKey("P"), "Pause");
+    }
+}
+function updateAllPrompts() {
+    // Start screen buttons
+    document.getElementById("btn1P").textContent = gamepad.connected ? "1 PLAYER" : "START MISSION";
+    document.getElementById("btnPassPlay").textContent = "PASS & PLAY";
+    document.getElementById("btnSoloTurns").textContent = "SOLO TURNS";
+    document.getElementById("btnHotSeat").textContent = "HOT SEAT";
+    // Focus highlight
+    updateMenuFocus();
+    // Restart button
+    var restartBtn = document.getElementById("restartBtn");
+    if (gamepad.connected) {
+        restartBtn.innerHTML = gpBtn("a") + ' RETRY';
+    } else {
+        restartBtn.textContent = "TRY AGAIN";
+    }
+    // HS instructions
+    document.getElementById("hsInstructions").innerHTML = btnText(
+        "LEFT/RIGHT select slot &bull; UP/DOWN change letter &bull; ENTER confirm",
+        gpLabel("\u2191\u2193") + " change letter &bull; " + gpBtn("a") + " next &bull; " + gpBtn("b") + " back"
+    );
+    // Pause hint
+    document.getElementById("pauseHint").innerHTML = btnText(
+        "P to resume",
+        gpLabel(gpStartName()) + " to resume"
+    );
+    // Turn ready prompt
+    document.getElementById("turnPrompt").innerHTML = btnText(
+        "Press SPACE to start",
+        "Press " + gpBtn("a") + " to start"
+    );
+    // Player count confirm
+    var pcConfirm = document.getElementById("pcConfirm");
+    if (gamepad.connected) {
+        pcConfirm.innerHTML = gpBtn("a") + ' START';
+    } else {
+        pcConfirm.textContent = "START";
+    }
+    // Scoreboard play again
+    var sbBtn = document.getElementById("sbPlayAgain");
+    if (gamepad.connected) {
+        sbBtn.innerHTML = gpBtn("a") + ' PLAY AGAIN';
+    } else {
+        sbBtn.textContent = "PLAY AGAIN";
+    }
+    // Bottom bar
+    updateBottomBar();
+}
+// --- High Score System (synthos.data, top 20) ---
+var MAX_LEADERBOARD = 20;
+var _highScores = [{ initials: "ACE", score: 10000 }];
+// Load scores from app table storage on startup
+(async function() {
+    try {
+        var row = await synthos.data.get('high_scores', 'scores');
+        if (row && Array.isArray(row.entries) && row.entries.length > 0) {
+            _highScores = row.entries;
+        }
+    } catch(e) {}
+    renderLeaderboard();
+})();
+function loadHighScores() {
+    return _highScores;
+}
+function saveHighScores(scores) {
+    _highScores = scores;
+    synthos.data.save('high_scores', { id: 'scores', entries: scores }).catch(function() {});
+}
+function qualifiesForHighScore(s) {
+    var scores = loadHighScores();
+    return scores.length < MAX_LEADERBOARD || s > scores[scores.length - 1].score;
+}
+function insertHighScore(initials, s) {
+    var scores = loadHighScores().slice();
+    scores.push({ initials: initials, score: s });
+    scores.sort(function(a, b) { return b.score - a.score; });
+    if (scores.length > MAX_LEADERBOARD) scores.length = MAX_LEADERBOARD;
+    saveHighScores(scores);
+    renderLeaderboard();
+}
+function formatLeaderboardScore(s) {
+    if (s > MAX_SCORE) {
+        return { text: "99,999+", overflow: true };
+    }
+    return { text: s.toLocaleString(), overflow: false };
+}
+function renderLeaderboard() {
+    var scores = loadHighScores();
+    var tbody = document.getElementById("leaderboardBody");
+    tbody.innerHTML = "";
+    scores.forEach(function(entry, i) {
+        var tr = document.createElement("tr");
+        var fmt = formatLeaderboardScore(entry.score);
+        var overflowClass = fmt.overflow ? " overflow" : "";
+        var titleAttr = fmt.overflow ? ' title="' + entry.score.toLocaleString() + '"' : "";
+        tr.innerHTML =
+            '<td class="rank">' + (i + 1) + '.</td>' +
+            '<td class="initials">' + entry.initials + '</td>' +
+            '<td class="hs-score' + overflowClass + '"' + titleAttr + '>' + fmt.text + '</td>';
+        tbody.appendChild(tr);
+    });
+}
+renderLeaderboard();
+// --- BT Controller Instructions (platform-aware) ---
+(function() {
+    const el = document.getElementById("btSection");
+    const isMac = /Mac|iPhone|iPad/.test(navigator.platform) || /Macintosh/.test(navigator.userAgent);
+    if (isMac) {
+        el.innerHTML =
+            '<h3>GAMEPAD</h3>' +
+            '<p>1. Put controller in pairing mode</p>' +
+            '<p>2. Open <b>System Settings &gt; Bluetooth</b></p>' +
+            '<p>3. Find controller in list, click <b>Connect</b></p>' +
+            '<p>4. Reload page once paired</p>';
+    } else {
+        el.innerHTML =
+            '<h3>GAMEPAD</h3>' +
+            '<p>1. Put controller in pairing mode</p>' +
+            '<p>2. Open <b>Settings &gt; Bluetooth &amp; devices</b></p>' +
+            '<p>3. Click <b>Add device &gt; Bluetooth</b></p>' +
+            '<p>4. Select controller, then reload page</p>';
+    }
+})();
+// --- Gamepad Detection & Controls Swap ---
+var KEYBOARD_CONTROLS = '<li><span class="key-icon">W/\u2191</span><span class="key-desc">Thrust</span></li>' +
+    '<li><span class="key-icon">A/\u2190</span><span class="key-desc">Rotate Left</span></li>' +
+    '<li><span class="key-icon">D/\u2192</span><span class="key-desc">Rotate Right</span></li>' +
+    '<li><span class="key-icon">SPACE</span><span class="key-desc">Fire</span></li>' +
+    '<li><span class="key-icon">H</span><span class="key-desc">Hyperspace</span></li>' +
+    '<li><span class="key-icon">P</span><span class="key-desc">Pause</span></li>';
+function buildGamepadControls() {
+    return '<li><span class="key-icon">L-Stick</span><span class="key-desc">Thrust / Rotate</span></li>' +
+        '<li><span class="key-icon">D-Pad</span><span class="key-desc">Thrust / Rotate</span></li>' +
+        '<li><span class="key-icon">' + gpBtnName("a") + ' / RB</span><span class="key-desc">Fire</span></li>' +
+        '<li><span class="key-icon">' + gpBtnName("b") + ' / LB</span><span class="key-desc">Hyperspace</span></li>' +
+        '<li><span class="key-icon">' + gpStartName() + '</span><span class="key-desc">Pause</span></li>';
+}
+function refreshGamepadUI() {
+    gamepadUI.update();
+    var listEl = document.getElementById("controlsList");
+    var btEl = document.getElementById("btSection");
+    if (gamepad.connected) {
+        listEl.innerHTML = buildGamepadControls();
+        btEl.style.display = "none";
+    } else {
+        listEl.innerHTML = KEYBOARD_CONTROLS;
+        btEl.style.display = "";
+    }
+    updateAllPrompts();
+}
+gamepad.onConnect = function() { refreshGamepadUI(); };
+gamepad.onDisconnect = function() { refreshGamepadUI(); };
+// --- Game Mode State ---
+var gameMode = "single"; // "single", "solo_turns", "hot_seat"
+var playerCount = 2;
+var currentPlayer = 0;
+var players = []; // {score, lives, level, alive, initials}
+var turnReady = false;
+var startScreenPhase = "mode"; // "mode", "submode", "count"
+// --- Game State ---
+var gameRunning = false, gamePaused = false, score = 0, lives = 3, level = 1;
+var shake = RetroGame.createShake();
+var hyperspaceCooldown = 0;
+var hyperspaceInvincible = 0;
+var ship = {
+    x: 0, y: 0, vx: 0, vy: 0, angle: -Math.PI / 2,
+    radius: 15, thrust: 0, rotationSpeed: 0,
+    invincible: 0, shield: 0, rapidFire: 0, multiShot: 0
+};
+var bullets = [], asteroids = [], powerUps = [], stars = [];
+var saucers = [], saucerBullets = [], saucerSpawnTimer = 0;
+var keyboard = RetroGame.createKeyboard();
+var particles = RetroGame.createParticles({ maxParticles: 500 });
+// --- High Score Entry State ---
+var hsEntryActive = false;
+var hsSlots = [0, 0, 0];
+var hsActiveSlot = 0;
+var hsFinalScore = 0;
+var hsEntryPlayerIndex = -1; // track which player is entering HS in multiplayer
+function getActivePlayerColor() {
+    if (gameMode === "single") return PLAYER_COLORS[0];
+    return PLAYER_COLORS[currentPlayer] || PLAYER_COLORS[0];
+}
+function initStars() {
+    stars = [];
+    for (let i = 0; i < 150; i++)
+        stars.push({
+            x: Math.random() * canvas.width,
+            y: Math.random() * canvas.height,
+            size: 2 * Math.random() + 0.5,
+            speed: 0.5 * Math.random() + 0.1,
+            brightness: Math.random()
+        });
+}
+function initGame() {
+    ship.x = canvas.width / 2;
+    ship.y = canvas.height / 2;
+    ship.vx = 0; ship.vy = 0;
+    ship.angle = -Math.PI / 2;
+    ship.invincible = 180;
+    ship.shield = 0; ship.rapidFire = 0; ship.multiShot = 0;
+    bullets = []; asteroids = []; powerUps = [];
+    particles.clear();
+    saucers = []; saucerBullets = []; saucerSpawnTimer = 0;
+    hyperspaceCooldown = 0; hyperspaceInvincible = 0;
+    score = 0; lives = 3; level = 1;
+    initStars();
+    spawnAsteroids(4);
+    updateUI();
+}
+// Init game for hot seat (preserves asteroids/level across player swaps)
+function initHotSeatRespawn() {
+    ship.x = canvas.width / 2;
+    ship.y = canvas.height / 2;
+    ship.vx = 0; ship.vy = 0;
+    ship.angle = -Math.PI / 2;
+    ship.invincible = 180;
+    ship.shield = 0; ship.rapidFire = 0; ship.multiShot = 0;
+    bullets = [];
+    saucerBullets = [];
+    hyperspaceCooldown = 0; hyperspaceInvincible = 0;
+    shootCooldown = 0;
+}
+function initMultiplayerPlayers() {
+    players = [];
+    for (let i = 0; i < playerCount; i++) {
+        players.push({ score: 0, lives: 3, level: 1, alive: true, initials: "" });
+    }
+    currentPlayer = 0;
+}
+function formatScore(s) {
+    return String(s).padStart(5, "0");
+}
+function addScore(points) {
+    score += points;
+}
+function getLevelSpeedMultiplier() {
+    return 1 + 0.15 * (level - 1);
+}
+function spawnAsteroids(count) {
+    for (let i = 0; i < count; i++) {
+        let x, y;
+        do {
+            x = Math.random() * canvas.width;
+            y = Math.random() * canvas.height;
+        } while (distance(x, y, ship.x, ship.y) < 150);
+        asteroids.push(createAsteroid(x, y, 3));
+    }
+}
+function createAsteroid(x, y, size) {
+    const speed = (0.5 * (4 - size) + 1.5 * Math.random()) * getLevelSpeedMultiplier();
+    const angle = Math.random() * Math.PI * 2;
+    const radii = [];
+    const points = 8 + Math.floor(5 * Math.random());
+    const baseRadius = 15 * size + 10;
+    for (let i = 0; i < points; i++)
+        radii.push(baseRadius * (0.7 + 0.6 * Math.random()));
+    return {
+        x, y,
+        vx: Math.cos(angle) * speed, vy: Math.sin(angle) * speed,
+        size, radii, points, rotation: 0,
+        rotationSpeed: 0.03 * (Math.random() - 0.5),
+        color: size === 3 ? "#ff00ff" : size === 2 ? "#ffff00" : "#00ffff"
+    };
+}
+function createSaucer() {
+    const isSmall = Math.random() > 0.5;
+    const fromLeft = Math.random() > 0.5;
+    const y = Math.random() * (canvas.height - 100) + 50;
+    return {
+        x: fromLeft ? -30 : canvas.width + 30, y,
+        vx: (fromLeft ? 1 : -1) * (isSmall ? 3 : 2) * getLevelSpeedMultiplier(),
+        vy: 0, isSmall,
+        radius: isSmall ? 15 : 25,
+        shootTimer: 60 + 60 * Math.random(),
+        directionChangeTimer: 60 + 120 * Math.random(),
+        points: isSmall ? 1000 : 500
+    };
+}
+function distance(x1, y1, x2, y2) {
+    return RetroGame.distance({x: x1, y: y1}, {x: x2, y: y2});
+}
+function wrap(obj) {
+    RetroGame.wrap(obj, canvas.width, canvas.height, 50);
+}
+function createExplosion(x, y, color, count) {
+    particles.emit(x, y, count || 20, {
+        color: color, speed: 5, size: 3,
+        lifetime: 1.2, decay: 0.02, spread: Math.PI * 2
+    });
+    shake.trigger(10);
+}
+// --- Hyperspace ---
+function hyperspace() {
+    if (hyperspaceCooldown > 0) return;
+    if (sfxReady) sfx.play('Hyperspace_Jump');
+    createExplosion(ship.x, ship.y, "#ffffff", 12);
+    ship.x = Math.random() * (canvas.width - 100) + 50;
+    ship.y = Math.random() * (canvas.height - 100) + 50;
+    ship.vx = 0; ship.vy = 0;
+    createExplosion(ship.x, ship.y, "#00ffff", 12);
+    hyperspaceCooldown = 180;
+    hyperspaceInvincible = 60;
+}
+var shootCooldown = 0;
+function shoot() {
+    if (shootCooldown > 0) return;
+    const cooldown = ship.rapidFire > 0 ? 5 : 15;
+    shootCooldown = cooldown;
+    if (sfxReady) sfx.play('Laser_Fire');
+    const offsets = ship.multiShot > 0 ? [-0.2, 0, 0.2] : [0];
+    offsets.forEach(function(offset) {
+        const angle = ship.angle + offset;
+        bullets.push({
+            x: ship.x + 20 * Math.cos(angle),
+            y: ship.y + 20 * Math.sin(angle),
+            vx: 10 * Math.cos(angle) + 0.5 * ship.vx,
+            vy: 10 * Math.sin(angle) + 0.5 * ship.vy,
+            life: 60
+        });
+    });
+}
+function saucerShoot(saucer) {
+    let angle = Math.atan2(ship.y - saucer.y, ship.x - saucer.x);
+    angle += (saucer.isSmall ? 0.2 : 0.5) * (Math.random() - 0.5);
+    saucerBullets.push({
+        x: saucer.x, y: saucer.y,
+        vx: 6 * Math.cos(angle), vy: 6 * Math.sin(angle),
+        life: 90
+    });
+}
+function spawnPowerUp(x, y) {
+    if (Math.random() > 0.15) return;
+    let type;
+    const rand = Math.random();
+    type = rand < 0.05 ? "life" : rand < 0.38 ? "shield" : rand < 0.71 ? "rapid" : "multi";
+    powerUps.push({ x, y, type, life: 600, pulse: 0 });
+}
+function updateUI() {
+    const scoreEl = document.getElementById("score");
+    if (score > MAX_SCORE) {
+        scoreEl.textContent = "99,999+";
+        scoreEl.className = "score-overflow";
+        scoreEl.title = score.toLocaleString();
+    } else {
+        scoreEl.textContent = formatScore(score);
+        scoreEl.className = "";
+        scoreEl.title = "";
+    }
+    document.getElementById("level").textContent = level;
+    document.getElementById("lives").textContent = lives;
+    // Player indicator for multiplayer
+    const piEl = document.getElementById("playerIndicator");
+    if (gameMode !== "single") {
+        piEl.style.display = "inline";
+        piEl.textContent = "P" + (currentPlayer + 1) + " ";
+        piEl.style.color = getActivePlayerColor();
+    } else {
+        piEl.style.display = "none";
+    }
+}
+function isShipInvincible() {
+    return ship.invincible > 0 || ship.shield > 0 || hyperspaceInvincible > 0;
+}
+// Gamepad polling is now handled by gamepad.poll() in the game loop
+// Game-specific action functions (gpFire, gpHyper, etc.) are defined above
+// --- Multiplayer Turn Management ---
+var TURN_COOLDOWN_MS = 3000; // 3 second cooldown between players
+var turnReadyAt = 0;
+function showTurnReady() {
+    turnReady = true;
+    turnReadyAt = Date.now();
+    const overlay = document.getElementById("turnReadyOverlay");
+    const nameEl = document.getElementById("turnPlayerName");
+    const color = getActivePlayerColor();
+    nameEl.textContent = "PLAYER " + (currentPlayer + 1);
+    nameEl.style.color = color;
+    updateAllPrompts();
+    overlay.classList.add("visible");
+}
+function getTurnCooldownRemaining() {
+    return Math.max(0, TURN_COOLDOWN_MS - (Date.now() - turnReadyAt));
+}
+function updateTurnPrompt() {
+    var remaining = getTurnCooldownRemaining();
+    var promptEl = document.getElementById("turnPrompt");
+    if (remaining > 0) {
+        var secs = Math.ceil(remaining / 1000);
+        promptEl.textContent = "Get ready... " + secs;
+    } else {
+        promptEl.innerHTML = btnText(
+            "Press SPACE to start",
+            "Press " + gpBtn("a") + " to start"
+        );
+    }
+}
+function hideTurnReady() {
+    turnReady = false;
+    document.getElementById("turnReadyOverlay").classList.remove("visible");
+}
+function startPlayerTurn() {
+    hideTurnReady();
+    if (gameMode === "solo_turns") {
+        // Fresh game for each player
+        initGame();
+        score = 0;
+        lives = 3;
+        level = 1;
+    } else if (gameMode === "hot_seat") {
+        // Load this player's state into shared field
+        const p = players[currentPlayer];
+        score = p.score;
+        lives = p.lives;
+        initHotSeatRespawn();
+    }
+    gameRunning = true;
+    startAmbient();
+    updateUI();
+    updateBottomBar();
+}
+function saveCurrentPlayerState() {
+    if (gameMode === "single") return;
+    players[currentPlayer].score = score;
+    players[currentPlayer].lives = lives;
+    if (gameMode === "solo_turns") {
+        players[currentPlayer].level = level;
+    }
+}
+function advanceToNextPlayer() {
+    saveCurrentPlayerState();
+    // Find next alive player
+    let next = -1;
+    for (let i = 1; i <= playerCount; i++) {
+        const idx = (currentPlayer + i) % playerCount;
+        if (players[idx].alive) { next = idx; break; }
+    }
+    if (next === -1) {
+        // All players eliminated
+        showFinalScoreboard();
+        return;
+    }
+    currentPlayer = next;
+    gameRunning = false;
+    showTurnReady();
+}
+function handlePlayerDeath() {
+    if (gameMode === "single") {
+        gameOver();
+        return;
+    }
+    sfx.stop('Ship_Thrust');
+    if (gameMode === "solo_turns") {
+        // Player lost all lives — they're done
+        lives--;
+        updateUI();
+        if (lives <= 0) {
+            saveCurrentPlayerState();
+            players[currentPlayer].alive = false;
+            gameRunning = false;
+            // Check HS for this player
+            if (qualifiesForHighScore(score)) {
+                hsEntryPlayerIndex = currentPlayer;
+                showHighScoreEntry();
+            } else {
+                advanceToNextPlayer();
+            }
+        } else {
+            // Respawn
+            ship.x = canvas.width / 2; ship.y = canvas.height / 2;
+            ship.vx = 0; ship.vy = 0; ship.invincible = 180;
+        }
+    } else if (gameMode === "hot_seat") {
+        // Lost one life — rotate to next player
+        lives--;
+        updateUI();
+        saveCurrentPlayerState();
+        if (lives <= 0) {
+            players[currentPlayer].alive = false;
+            // Check HS for this player
+            if (qualifiesForHighScore(score)) {
+                hsEntryPlayerIndex = currentPlayer;
+                gameRunning = false;
+                showHighScoreEntry();
+                return;
+            }
+        }
+        gameRunning = false;
+        advanceToNextPlayer();
+    }
+}
+function showFinalScoreboard() {
+    gameRunning = false;
+    stopAmbient();
+    sfx.stop('Ship_Thrust');
+    // Sort players by score descending
+    const ranked = players.map(function(p, i) { return { index: i, score: p.score, initials: p.initials }; });
+    ranked.sort(function(a, b) { return b.score - a.score; });
+    const modeLabel = gameMode === "solo_turns" ? "SOLO TURNS" : "HOT SEAT";
+    document.getElementById("sbSubtitle").textContent = modeLabel + " \u2014 FINAL STANDINGS";
+    const tbody = document.getElementById("sbBody");
+    tbody.innerHTML = "";
+    ranked.forEach(function(r, rank) {
+        const tr = document.createElement("tr");
+        const color = PLAYER_COLORS[r.index];
+        const initStr = r.initials || "";
+        tr.innerHTML =
+            '<td class="sb-rank">' + (rank + 1) + '.</td>' +
+            '<td class="sb-player" style="color:' + color + ';text-shadow:0 0 10px ' + color + '">P' + (r.index + 1) + '</td>' +
+            '<td class="sb-initials">' + initStr + '</td>' +
+            '<td class="sb-score">' + r.score.toLocaleString() + '</td>';
+        tbody.appendChild(tr);
+    });
+    document.getElementById("finalScoreboard").classList.add("visible");
+    updateBottomBar();
+}
+function hideFinalScoreboard() {
+    document.getElementById("finalScoreboard").classList.remove("visible");
+}
+// --- Start Screen UI Logic ---
+var menuCursor = 0; // index of focused item in current phase
+// Items per phase: mode=[1P, PassPlay], submode=[Solo, HotSeat], count=N/A (uses arrows)
+function getMenuItems() {
+    if (startScreenPhase === "mode") return [document.getElementById("btn1P"), document.getElementById("btnPassPlay")];
+    if (startScreenPhase === "submode") return [document.getElementById("btnSoloTurns"), document.getElementById("btnHotSeat")];
+    return [];
+}
+function updateMenuFocus() {
+    // Clear all focused classes
+    var all = document.querySelectorAll(".mode-btn.focused, .submode-btn.focused");
+    for (var i = 0; i < all.length; i++) all[i].classList.remove("focused");
+    // Apply to current
+    var items = getMenuItems();
+    if (items.length > 0 && menuCursor >= 0 && menuCursor < items.length) {
+        items[menuCursor].classList.add("focused");
+    }
+}
+function showStartPhase(phase) {
+    startScreenPhase = phase;
+    menuCursor = 0;
+    var modeSelect = document.getElementById("modeSelect");
+    var submodeSelect = document.getElementById("submodeSelect");
+    var pcSelect = document.getElementById("playerCountSelect");
+    modeSelect.style.display = phase === "mode" ? "flex" : "none";
+    submodeSelect.style.display = phase === "submode" ? "flex" : "none";
+    pcSelect.style.display = "none";
+    pcSelect.classList.remove("visible");
+    if (phase === "count") {
+        pcSelect.style.display = "flex";
+        pcSelect.classList.add("visible");
+    }
+    updateMenuFocus();
+    updateBottomBar();
+}
+function resetStartScreen() {
+    var startScreen = document.getElementById("startScreen");
+    startScreen.style.display = "";
+    showStartPhase("mode");
+    playerCount = 2;
+    document.getElementById("pcNum").textContent = "2";
+    document.getElementById("gameOverScreen").style.display = "none";
+    hideFinalScoreboard();
+    hideTurnReady();
+    stopAmbient();
+    sfx.stop('Ship_Thrust');
+}
+function menuConfirm() {
+    if (startScreenPhase === "mode") {
+        if (menuCursor === 0) startSinglePlayer();
+        else if (menuCursor === 1) showStartPhase("submode");
+    } else if (startScreenPhase === "submode") {
+        if (menuCursor === 0) selectSubmode("solo_turns");
+        else if (menuCursor === 1) selectSubmode("hot_seat");
+    } else if (startScreenPhase === "count") {
+        confirmPlayerCount();
+    }
+}
+function menuBack() {
+    if (startScreenPhase === "submode") {
+        showStartPhase("mode");
+        menuCursor = 1; // return focus to "Pass & Play"
+        updateMenuFocus();
+    } else if (startScreenPhase === "count") {
+        showStartPhase("submode");
+    }
+}
+function menuMove(delta) {
+    var items = getMenuItems();
+    if (items.length === 0) return;
+    var prev = menuCursor;
+    menuCursor = Math.max(0, Math.min(items.length - 1, menuCursor + delta));
+    if (menuCursor !== prev && sfxReady) sfx.play('Menu_Navigate');
+    updateMenuFocus();
+}
+function startSinglePlayer() {
+    document.getElementById("startScreen").style.display = "none";
+    gameMode = "single";
+    initGame();
+    gameRunning = true;
+    startAmbient();
+    updateBottomBar();
+}
+function selectSubmode(mode) {
+    gameMode = mode;
+    showStartPhase("count");
+}
+function adjustPlayerCount(delta) {
+    playerCount = Math.max(2, Math.min(8, playerCount + delta));
+    document.getElementById("pcNum").textContent = playerCount;
+}
+function confirmPlayerCount() {
+    document.getElementById("startScreen").style.display = "none";
+    initMultiplayerPlayers();
+    currentPlayer = 0;
+    if (gameMode === "hot_seat") {
+        initGame();
+        gameRunning = false;
+    }
+    showTurnReady();
+}
+// Start screen button events
+document.getElementById("btn1P").addEventListener("click", startSinglePlayer);
+document.getElementById("btnPassPlay").addEventListener("click", function() { showStartPhase("submode"); });
+document.getElementById("btnSoloTurns").addEventListener("click", function() { selectSubmode("solo_turns"); });
+document.getElementById("btnHotSeat").addEventListener("click", function() { selectSubmode("hot_seat"); });
+// Mouse hover syncs focus cursor
+document.getElementById("btn1P").addEventListener("mouseenter", function() { if (menuCursor !== 0 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 0; updateMenuFocus(); });
+document.getElementById("btnPassPlay").addEventListener("mouseenter", function() { if (menuCursor !== 1 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 1; updateMenuFocus(); });
+document.getElementById("btnSoloTurns").addEventListener("mouseenter", function() { if (menuCursor !== 0 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 0; updateMenuFocus(); });
+document.getElementById("btnHotSeat").addEventListener("mouseenter", function() { if (menuCursor !== 1 && sfxReady) sfx.play('Menu_Navigate'); menuCursor = 1; updateMenuFocus(); });
+document.getElementById("pcLeft").addEventListener("click", function() { adjustPlayerCount(-1); });
+document.getElementById("pcRight").addEventListener("click", function() { adjustPlayerCount(1); });
+document.getElementById("pcConfirm").addEventListener("click", confirmPlayerCount);
+document.getElementById("sbPlayAgain").addEventListener("click", function() { resetStartScreen(); });
+function update() {
+    // keyboard.poll() and gamepad.poll() are called in gameLoop() before this
+    // Gamepad pause toggle (edge-triggered, works even when paused)
+    if (gpPause() && gameRunning) {
+        gamePaused = !gamePaused;
+        if (gamePaused) pauseOverlay.classList.add("visible");
+        else pauseOverlay.classList.remove("visible");
+    }
+    if (!gameRunning || gamePaused) return;
+    // Gamepad hyperspace (edge-triggered)
+    if (gpHyper()) hyperspace();
+    // Ship controls (keyboard OR gamepad)
+    if (keyboard.isDown("ArrowLeft") || keyboard.isDown("KeyA") || gamepad.left) ship.angle -= 0.08;
+    if (keyboard.isDown("ArrowRight") || keyboard.isDown("KeyD") || gamepad.right) ship.angle += 0.08;
+    if (keyboard.isDown("ArrowUp") || keyboard.isDown("KeyW") || gamepad.up) {
+        ship.vx += 0.15 * Math.cos(ship.angle);
+        ship.vy += 0.15 * Math.sin(ship.angle);
+        ship.thrust = 1;
+        if (sfxReady) sfx.play('Ship_Thrust');
+    } else {
+        if (ship.thrust > 0.1 && sfxReady) sfx.stop('Ship_Thrust');
+        ship.thrust *= 0.95;
+    }
+    if (keyboard.isDown("Space") || gpFire()) shoot();
+    ship.vx *= 0.99;
+    ship.vy *= 0.99;
+    const speed = Math.sqrt(ship.vx ** 2 + ship.vy ** 2);
+    if (speed > 8) {
+        ship.vx = ship.vx / speed * 8;
+        ship.vy = ship.vy / speed * 8;
+    }
+    ship.x += ship.vx;
+    ship.y += ship.vy;
+    wrap(ship);
+    if (ship.invincible > 0) ship.invincible--;
+    if (ship.shield > 0) ship.shield--;
+    if (ship.rapidFire > 0) ship.rapidFire--;
+    if (ship.multiShot > 0) ship.multiShot--;
+    if (shootCooldown > 0) shootCooldown--;
+    if (hyperspaceCooldown > 0) hyperspaceCooldown--;
+    if (hyperspaceInvincible > 0) hyperspaceInvincible--;
+    // Saucer spawning
+    if (level >= 2) {
+        saucerSpawnTimer++;
+        const spawnInterval = Math.max(300, 600 - 30 * level);
+        if (saucerSpawnTimer >= spawnInterval && saucers.length < 2) {
+            saucers.push(createSaucer());
+            if (sfxReady) sfx.play('Saucer_Alert');
+            saucerSpawnTimer = 0;
+        }
+    }
+    // Update saucers
+    saucers = saucers.filter(function(s) {
+        s.x += s.vx; s.y += s.vy;
+        s.directionChangeTimer--;
+        if (s.directionChangeTimer <= 0) {
+            s.vy = 2 * (Math.random() - 0.5);
+            s.directionChangeTimer = 60 + 120 * Math.random();
+        }
+        if (s.y < 50) s.vy = Math.abs(s.vy);
+        if (s.y > canvas.height - 50) s.vy = -Math.abs(s.vy);
+        s.shootTimer--;
+        if (s.shootTimer <= 0) {
+            saucerShoot(s);
+            s.shootTimer = s.isSmall ? 40 + 40 * Math.random() : 60 + 60 * Math.random();
+        }
+        return s.x > -50 && s.x < canvas.width + 50;
+    });
+    // Update saucer bullets
+    saucerBullets = saucerBullets.filter(function(b) {
+        b.x += b.vx; b.y += b.vy; b.life--;
+        return b.life > 0 && b.x > -10 && b.x < canvas.width + 10 && b.y > -10 && b.y < canvas.height + 10;
+    });
+    // Update bullets
+    bullets = bullets.filter(function(b) {
+        b.x += b.vx; b.y += b.vy; b.life--;
+        wrap(b);
+        return b.life > 0;
+    });
+    // Update asteroids
+    asteroids.forEach(function(a) {
+        a.x += a.vx; a.y += a.vy;
+        a.rotation += a.rotationSpeed;
+        wrap(a);
+    });
+    // Update particles
+    particles.update(1/60);
+    // Update power-ups
+    powerUps = powerUps.filter(function(p) {
+        p.life--; p.pulse += 0.1;
+        return p.life > 0;
+    });
+    // Update stars
+    stars.forEach(function(s) {
+        s.y += s.speed;
+        if (s.y > canvas.height) { s.y = 0; s.x = Math.random() * canvas.width; }
+        s.brightness = 0.3 + 0.3 * Math.sin(0.003 * Date.now() + s.x);
+    });
+    // Bullet-asteroid collisions
+    bullets.forEach(function(b, bi) {
+        asteroids.forEach(function(a, ai) {
+            const avgRadius = a.radii.reduce(function(sum, r) { return sum + r; }, 0) / a.radii.length;
+            if (distance(b.x, b.y, a.x, a.y) < avgRadius) {
+                bullets.splice(bi, 1);
+                if (sfxReady) sfx.play('Asteroid_Explosion');
+                createExplosion(a.x, a.y, a.color, 15);
+                if (a.size > 1) {
+                    for (let i = 0; i < 2; i++) asteroids.push(createAsteroid(a.x, a.y, a.size - 1));
+                }
+                spawnPowerUp(a.x, a.y);
+                asteroids.splice(ai, 1);
+                addScore(100 * (4 - a.size));
+                updateUI();
+            }
+        });
+    });
+    // Bullet-saucer collisions
+    bullets.forEach(function(b, bi) {
+        saucers.forEach(function(s, si) {
+            if (distance(b.x, b.y, s.x, s.y) < s.radius) {
+                bullets.splice(bi, 1);
+                createExplosion(s.x, s.y, "#ff6600", 25);
+                addScore(s.points);
+                saucers.splice(si, 1);
+                updateUI();
+            }
+        });
+    });
+    // Ship-asteroid collisions
+    if (!isShipInvincible()) {
+        asteroids.forEach(function(a, ai) {
+            const avgRadius = a.radii.reduce(function(sum, r) { return sum + r; }, 0) / a.radii.length;
+            if (distance(ship.x, ship.y, a.x, a.y) < avgRadius + ship.radius) {
+                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
+                if (gameMode !== "single") {
+                    handlePlayerDeath();
+                } else {
+                    lives--;
+                    updateUI();
+                    if (lives <= 0) { gameOver(); return; }
+                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
+                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
+                }
+            }
+        });
+    }
+    // Ship-saucer collisions
+    if (!isShipInvincible()) {
+        saucers.forEach(function(s, si) {
+            if (distance(ship.x, ship.y, s.x, s.y) < s.radius + ship.radius) {
+                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
+                createExplosion(s.x, s.y, "#ff6600", 25);
+                saucers.splice(si, 1);
+                if (gameMode !== "single") {
+                    handlePlayerDeath();
+                } else {
+                    lives--;
+                    updateUI();
+                    if (lives <= 0) { gameOver(); return; }
+                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
+                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
+                }
+            }
+        });
+    }
+    // Ship-saucerBullet collisions
+    if (!isShipInvincible()) {
+        saucerBullets.forEach(function(b, bi) {
+            if (distance(ship.x, ship.y, b.x, b.y) < ship.radius + 5) {
+                createExplosion(ship.x, ship.y, getActivePlayerColor(), 30);
+                saucerBullets.splice(bi, 1);
+                if (gameMode !== "single") {
+                    handlePlayerDeath();
+                } else {
+                    lives--;
+                    updateUI();
+                    if (lives <= 0) { gameOver(); return; }
+                    ship.x = canvas.width / 2; ship.y = canvas.height / 2;
+                    ship.vx = 0; ship.vy = 0; ship.invincible = 180;
+                }
+            }
+        });
+    }
+    // Power-up pickups
+    powerUps.forEach(function(p, pi) {
+        if (distance(ship.x, ship.y, p.x, p.y) < 30) {
+            powerUps.splice(pi, 1);
+            if (sfxReady) sfx.play('Power_Up_Collect');
+            createExplosion(p.x, p.y, "#00ff00", 10);
+            switch (p.type) {
+                case "shield": ship.shield = 600; break;
+                case "rapid": ship.rapidFire = 600; break;
+                case "multi": ship.multiShot = 600; break;
+                case "life": lives = Math.min(lives + 1, 5); updateUI(); break;
+            }
+        }
+    });
+    // Next level
+    if (asteroids.length === 0) {
+        level++;
+        updateUI();
+        spawnAsteroids(3 + level);
+        saucerSpawnTimer = 0;
+    }
+    shake.update(1/60);
+}
+function draw() {
+    ctx.save();
+    if (shake.isActive) ctx.translate(shake.offsetX, shake.offsetY);
+    ctx.fillStyle = "#000";
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+    // Stars
+    stars.forEach(function(s) {
+        ctx.fillStyle = "rgba(255, 255, 255, " + s.brightness + ")";
+        ctx.beginPath();
+        ctx.arc(s.x, s.y, s.size, 0, 2 * Math.PI);
+        ctx.fill();
+    });
+    // Particles
+    particles.draw(ctx);
+    // Power-ups
+    powerUps.forEach(function(p) {
+        const pulse = 5 * Math.sin(p.pulse);
+        ctx.strokeStyle = p.type === "shield" ? "#00ffff" : p.type === "rapid" ? "#ff0000" : p.type === "multi" ? "#ffff00" : "#00ff00";
+        ctx.lineWidth = 2;
+        ctx.shadowColor = ctx.strokeStyle;
+        ctx.shadowBlur = 15;
+        ctx.beginPath();
+        ctx.arc(p.x, p.y, 15 + pulse, 0, 2 * Math.PI);
+        ctx.stroke();
+        ctx.fillStyle = ctx.strokeStyle;
+        ctx.font = "12px Arial";
+        ctx.textAlign = "center";
+        ctx.textBaseline = "middle";
+        const icon = p.type === "shield" ? "S" : p.type === "rapid" ? "R" : p.type === "multi" ? "M" : "+";
+        ctx.fillText(icon, p.x, p.y);
+        ctx.shadowBlur = 0;
+    });
+    // Asteroids
+    asteroids.forEach(function(a) {
+        ctx.save();
+        ctx.translate(a.x, a.y);
+        ctx.rotate(a.rotation);
+        ctx.strokeStyle = a.color;
+        ctx.lineWidth = 2;
+        ctx.shadowColor = a.color;
+        ctx.shadowBlur = 20;
+        ctx.beginPath();
+        for (let i = 0; i < a.points; i++) {
+            const angle = i / a.points * Math.PI * 2;
+            const r = a.radii[i];
+            const x = Math.cos(angle) * r;
+            const y = Math.sin(angle) * r;
+            if (i === 0) ctx.moveTo(x, y); else ctx.lineTo(x, y);
+        }
+        ctx.closePath();
+        ctx.stroke();
+        ctx.restore();
+    });
+    // Saucers
+    saucers.forEach(function(s) {
+        ctx.save();
+        ctx.translate(s.x, s.y);
+        ctx.strokeStyle = "#ff6600";
+        ctx.lineWidth = 2;
+        ctx.shadowColor = "#ff6600";
+        ctx.shadowBlur = 20;
+        const r = s.radius;
+        ctx.beginPath(); ctx.ellipse(0, -0.2 * r, 0.4 * r, 0.3 * r, 0, Math.PI, 0); ctx.stroke();
+        ctx.beginPath(); ctx.ellipse(0, 0, r, 0.35 * r, 0, 0, 2 * Math.PI); ctx.stroke();
+        ctx.beginPath(); ctx.ellipse(0, 0.15 * r, 0.5 * r, 0.2 * r, 0, 0, Math.PI); ctx.stroke();
+        ctx.fillStyle = "#ff6600";
+        for (let i = 0; i < 3; i++) {
+            const lx = (i - 1) * r * 0.5;
+            ctx.beginPath(); ctx.arc(lx, 0, 3, 0, 2 * Math.PI); ctx.fill();
+        }
+        ctx.restore();
+    });
+    // Saucer bullets
+    saucerBullets.forEach(function(b) {
+        ctx.fillStyle = "#ff6600";
+        ctx.shadowColor = "#ff6600";
+        ctx.shadowBlur = 15;
+        ctx.beginPath();
+        ctx.arc(b.x, b.y, 4, 0, 2 * Math.PI);
+        ctx.fill();
+    });
+    // Player bullets — use active player color
+    const bulletColor = getActivePlayerColor();
+    bullets.forEach(function(b) {
+        ctx.fillStyle = bulletColor;
+        ctx.shadowColor = bulletColor;
+        ctx.shadowBlur = 15;
+        ctx.beginPath();
+        ctx.arc(b.x, b.y, 3, 0, 2 * Math.PI);
+        ctx.fill();
+        ctx.strokeStyle = bulletColor.replace(")", ", 0.5)").replace("rgb", "rgba").replace("#", "");
+        // Use hex alpha approach for trail
+        ctx.globalAlpha = 0.5;
+        ctx.strokeStyle = bulletColor;
+        ctx.lineWidth = 2;
+        ctx.beginPath();
+        ctx.moveTo(b.x, b.y);
+        ctx.lineTo(b.x - 2 * b.vx, b.y - 2 * b.vy);
+        ctx.stroke();
+        ctx.globalAlpha = 1;
+    });
+    // Ship — use active player color
+    const shipColor = getActivePlayerColor();
+    if (gameRunning && (ship.invincible <= 0 || Math.floor(ship.invincible / 5) % 2 === 0)) {
+        ctx.save();
+        ctx.translate(ship.x, ship.y);
+        ctx.rotate(ship.angle);
+        if (ship.shield > 0) {
+            ctx.strokeStyle = shipColor.replace("ff", "80"); // semi-transparent
+            ctx.globalAlpha = 0.5;
+            ctx.strokeStyle = shipColor;
+            ctx.lineWidth = 2;
+            ctx.shadowColor = shipColor;
+            ctx.shadowBlur = 20;
+            ctx.beginPath();
+            ctx.arc(0, 0, 25, 0, 2 * Math.PI);
+            ctx.stroke();
+            ctx.globalAlpha = 1;
+        }
+        if (hyperspaceInvincible > 0) {
+            ctx.strokeStyle = "rgba(255, 255, 255, " + (0.3 + 0.2 * Math.sin(hyperspaceInvincible * 0.3)) + ")";
+            ctx.lineWidth = 1;
+            ctx.shadowColor = "#ffffff";
+            ctx.shadowBlur = 25;
+            ctx.beginPath();
+            ctx.arc(0, 0, 22, 0, 2 * Math.PI);
+            ctx.stroke();
+        }
+        ctx.strokeStyle = shipColor;
+        ctx.lineWidth = 2;
+        ctx.shadowColor = shipColor;
+        ctx.shadowBlur = 15;
+        ctx.beginPath();
+        ctx.moveTo(20, 0);
+        ctx.lineTo(-15, -12);
+        ctx.lineTo(-8, 0);
+        ctx.lineTo(-15, 12);
+        ctx.closePath();
+        ctx.stroke();
+        if (ship.thrust > 0.1) {
+            ctx.strokeStyle = "#ff6600";
+            ctx.shadowColor = "#ff6600";
+            ctx.beginPath();
+            ctx.moveTo(-8, -5);
+            ctx.lineTo(-20 - 10 * Math.random() * ship.thrust, 0);
+            ctx.lineTo(-8, 5);
+            ctx.stroke();
+        }
+        ctx.restore();
+    }
+    ctx.shadowBlur = 0;
+    ctx.restore();
+}
+// --- Game Over & High Score Entry ---
+function gameOver() {
+    gameRunning = false;
+    stopAmbient();
+    sfx.stop('Ship_Thrust');
+    if (qualifiesForHighScore(score)) {
+        hsEntryPlayerIndex = -1;
+        showHighScoreEntry();
+    } else {
+        showGameOverScreen();
+    }
+}
+function showGameOverScreen() {
+    document.getElementById("finalScore").textContent = score.toLocaleString();
+    document.getElementById("gameOverScreen").style.display = "block";
+    updateAllPrompts();
+}
+function showHighScoreEntry() {
+    hsFinalScore = score;
+    hsSlots = [0, 0, 0];
+    hsActiveSlot = 0;
+    hsEntryActive = true;
+    document.getElementById("hsScore").textContent = score.toLocaleString();
+    updateSlotDisplay();
+    document.getElementById("highScoreEntry").style.display = "block";
+    updateAllPrompts();
+}
+function updateSlotDisplay() {
+    for (let i = 0; i < 3; i++) {
+        const el = document.getElementById("slot" + i);
+        el.textContent = String.fromCharCode(65 + hsSlots[i]);
+        el.className = "initial-slot" + (i === hsActiveSlot ? " active" : "");
+    }
+}
+function confirmHighScore() {
+    const initials = String.fromCharCode(65 + hsSlots[0]) +
+                     String.fromCharCode(65 + hsSlots[1]) +
+                     String.fromCharCode(65 + hsSlots[2]);
+    insertHighScore(initials, hsFinalScore);
+    hsEntryActive = false;
+    document.getElementById("highScoreEntry").style.display = "none";
+    // In multiplayer, store initials and advance
+    if (hsEntryPlayerIndex >= 0 && gameMode !== "single") {
+        players[hsEntryPlayerIndex].initials = initials;
+        advanceToNextPlayer();
+    } else {
+        showGameOverScreen();
+    }
+}
+var _turnStartPressed = false;
+function gameLoop() {
+    keyboard.poll();
+    gamepad.poll();
+    // --- Turn ready overlay: cooldown then wait for player input ---
+    if (turnReady) {
+        updateTurnPrompt();
+        if (getTurnCooldownRemaining() <= 0) {
+            if (gpConfirm() || _turnStartPressed) {
+                _turnStartPressed = false;
+                startPlayerTurn();
+            }
+        }
+        // Still draw background
+        draw();
+        saveDirState();
+        requestAnimationFrame(gameLoop);
+        return;
+    }
+    // Gamepad menu/HS entry controls (when game not running)
+    if (hsEntryActive) {
+        if (gpUp()) { hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 1) % 26; updateSlotDisplay(); }
+        if (gpDown()) { hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 25) % 26; updateSlotDisplay(); }
+        if (gpLeft()) { hsActiveSlot = Math.max(0, hsActiveSlot - 1); updateSlotDisplay(); }
+        if (gpRight()) { hsActiveSlot = Math.min(2, hsActiveSlot + 1); updateSlotDisplay(); }
+        // A = accept letter & advance, confirm on last slot
+        if (gpConfirm()) {
+            if (hsActiveSlot < 2) { hsActiveSlot++; updateSlotDisplay(); }
+            else confirmHighScore();
+        }
+        // B = go back one slot
+        if (gpBack()) {
+            if (hsActiveSlot > 0) { hsActiveSlot--; updateSlotDisplay(); }
+        }
+    } else if (!gameRunning) {
+        // Start screen navigation with gamepad (d-pad + A/B)
+        if (document.getElementById("startScreen").style.display !== "none") {
+            if (startScreenPhase === "mode" || startScreenPhase === "submode") {
+                if (gpUp()) menuMove(-1);
+                if (gpDown()) menuMove(1);
+                if (gpConfirm()) menuConfirm();
+                if (gpBack()) menuBack(); // B = back
+            } else if (startScreenPhase === "count") {
+                if (gpLeft()) adjustPlayerCount(-1);
+                if (gpRight()) adjustPlayerCount(1);
+                if (gpConfirm()) confirmPlayerCount();
+                if (gpBack()) menuBack(); // B = back
+            }
+        }
+        // Game over screen — restart
+        const gameOverScreen = document.getElementById("gameOverScreen");
+        if (gameOverScreen.style.display === "block") {
+            if (gpConfirm() || gpPause()) {
+                gameOverScreen.style.display = "none";
+                resetStartScreen();
+            }
+        }
+        // Final scoreboard — play again
+        if (document.getElementById("finalScoreboard").classList.contains("visible")) {
+            if (gpConfirm() || gpPause()) {
+                resetStartScreen();
+            }
+        }
+    }
+    update();
+    draw();
+    saveDirState();
+    requestAnimationFrame(gameLoop);
+}
+// --- Input Handling (one-shot keyboard actions) ---
+// Continuous key state is handled by keyboard.isDown() via RetroGame.createKeyboard()
+document.addEventListener("keydown", function(e) {
+    // Turn ready: SPACE to start
+    if (turnReady) {
+        if (e.code === "Space") {
+            _turnStartPressed = true;
+            e.preventDefault();
+        }
+        return;
+    }
+    if (hsEntryActive) {
+        if (e.code === "ArrowLeft") {
+            hsActiveSlot = Math.max(0, hsActiveSlot - 1);
+            updateSlotDisplay();
+        } else if (e.code === "ArrowRight") {
+            hsActiveSlot = Math.min(2, hsActiveSlot + 1);
+            updateSlotDisplay();
+        } else if (e.code === "ArrowUp") {
+            hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 1) % 26;
+            updateSlotDisplay();
+        } else if (e.code === "ArrowDown") {
+            hsSlots[hsActiveSlot] = (hsSlots[hsActiveSlot] + 25) % 26;
+            updateSlotDisplay();
+        } else if (e.code === "Enter") {
+            confirmHighScore();
+        }
+        e.preventDefault();
+        return;
+    }
+    // Start screen keyboard navigation
+    if (!gameRunning && document.getElementById("startScreen").style.display !== "none") {
+        if (startScreenPhase === "mode" || startScreenPhase === "submode") {
+            if (e.code === "ArrowUp") { menuMove(-1); e.preventDefault(); }
+            if (e.code === "ArrowDown") { menuMove(1); e.preventDefault(); }
+            if (e.code === "Space" || e.code === "Enter") { menuConfirm(); e.preventDefault(); }
+            if (e.code === "Escape" || e.code === "Backspace") { menuBack(); e.preventDefault(); }
+        } else if (startScreenPhase === "count") {
+            if (e.code === "ArrowLeft") { adjustPlayerCount(-1); e.preventDefault(); }
+            if (e.code === "ArrowRight") { adjustPlayerCount(1); e.preventDefault(); }
+            if (e.code === "Space" || e.code === "Enter") { confirmPlayerCount(); e.preventDefault(); }
+            if (e.code === "Escape" || e.code === "Backspace") { menuBack(); e.preventDefault(); }
+        }
+        return;
+    }
+    if (e.code === "KeyP" && gameRunning) {
+        gamePaused = !gamePaused;
+        if (gamePaused) {
+            pauseOverlay.classList.add("visible");
+        } else {
+            pauseOverlay.classList.remove("visible");
+        }
+    }
+    if (e.code === "KeyH" && gameRunning && !gamePaused) {
+        hyperspace();
+    }
+    // Game over: space or enter to go back to start
+    const gameOverScreen = document.getElementById("gameOverScreen");
+    if (!gameRunning && gameOverScreen.style.display === "block" && (e.code === "Space" || e.code === "Enter")) {
+        gameOverScreen.style.display = "none";
+        resetStartScreen();
+        e.preventDefault();
+        return;
+    }
+    // Final scoreboard: space or enter to go back to start
+    if (!gameRunning && document.getElementById("finalScoreboard").classList.contains("visible") && (e.code === "Space" || e.code === "Enter")) {
+        resetStartScreen();
+        e.preventDefault();
+        return;
+    }
+    if (["Space", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(e.code)) {
+        e.preventDefault();
+    }
+});
+document.getElementById("restartBtn").addEventListener("click", function() {
+    document.getElementById("gameOverScreen").style.display = "none";
+    resetStartScreen();
+});
+// Initialize
+updateAllPrompts();
+initStars();
+gameLoop();
+    </script>
+</body></html>