diff --git a/apps/api/app/resources.ts b/apps/api/app/resources.ts
index ae89c17..624e0e7 100644
--- a/apps/api/app/resources.ts
+++ b/apps/api/app/resources.ts
@@ -33,20 +33,35 @@ router.get("/game/:game_name/:game_version/iframe", async (ctx) => {
gameInfo?.viewer?.alternate?.url && ctx.query.alternate === "1" ? gameInfo?.viewer.alternate : gameInfo.viewer;
const viewerUrl = ctx.query.customViewerUrl || viewer.url;
- ctx.body = `
-
-
-
- ${viewer.dependencies.scripts.map((dep) => `<${"script"} src='${dep}'>`).join("\n")}
- <${"script"} src='${viewerUrl}' type='text/javascript'>
- ${viewer.dependencies.stylesheets
- .map((dep) => ``)
- .join("\n")}
+ const stylesheets = viewer.dependencies.stylesheets
+ .map((dep) => ``)
+ .join("\n");
+ const scripts = viewer.dependencies.scripts.map((dep) => `<${"script"} src='${dep}'>`).join("\n");
+ const viewerScript = `<${"script"} src='${viewerUrl}' type='text/javascript'>`;
+
+ const template = viewer.topLevelVariable === "clash" ? `
+
+
+ ${stylesheets}
-
-
-
-
+
+
+ ${scripts}
+ ${viewerScript}
+ ` : `
+
+
+ ${scripts}
+ ${viewerScript}
+ ${stylesheets}
+
+
+
+
+ `;
+
+ ctx.body = `
+ ${template}
<${"script"} type='text/javascript'>
const gameObj = window.${viewer.topLevelVariable}.launch('#app');
window.addEventListener('message', event => {
diff --git a/apps/web/src/components/Game/StartedGame.svelte b/apps/web/src/components/Game/StartedGame.svelte
index 6cfd7e7..2374982 100644
--- a/apps/web/src/components/Game/StartedGame.svelte
+++ b/apps/web/src/components/Game/StartedGame.svelte
@@ -217,11 +217,11 @@ ${$game.players.map((pl) => `- ${pl.name} (${pl.score} pts)`).join("\n")}`;
{#key gameId}