Small UI cleanup, auto-refresh, and per-kind artifact routes

- Remove redundant "manage scripts" button and pipeline sidebar from Fleet page
- Bump log tail default 200 -> 1000 lines
- Auto-refresh (5s) on deployments list/detail, betas list, server detail, and artifact detail
- Drift ignores dedicated.cfg (Plutonium MP config; regenerates if deleted)
- Extract ArtifactDetail component; mount under /scripts/[id], /configs/[id], /plugins/[id] so configs and plugins no longer land on /scripts URLs

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

src/lib/server/fleet/drift.ts

@@ -26,6 +26,11 @@ import { allServers, getServer, listServers } from './servers.js';
 // Baseline shares the config destination — one physical dir, two logical kinds.
 const DRIFT_DESTS: ReadonlyArray<ArtifactKind> = ['script', 'config', 'plugin'];
 
+// Filenames we never treat as drift. dedicated.cfg is placed by Plutonium for
+// multiplayer and regenerates if deleted; we manage dedicated_sp.cfg (zombies)
+// via config-compose instead.
+const DRIFT_IGNORE_FILENAMES = new Set(['dedicated.cfg']);
+
 // Two flavors of drift:
 //   'untracked' — file on disk that inventory doesn't know about (delete it)
 //   'missing'   — artifact promoted for this server's scope, but file is gone
@@ -61,6 +66,7 @@ async function walkFiles(root: string): Promise<string[]> {
             return;
         }
         for (const e of entries) {
+            if (DRIFT_IGNORE_FILENAMES.has(e.name)) continue;
             const abs = join(dir, e.name);
             if (e.isDirectory()) await recur(abs);
             else if (e.isFile()) out.push(toPosix(relative(root, abs)));

src/lib/ui/components/ArtifactDetail.svelte

@@ -0,0 +1,550 @@
+<script lang="ts">
+    import { onMount, onDestroy } from 'svelte';
+    import { goto } from '$app/navigation';
+
+    type Family = 'script' | 'config' | 'plugin';
+
+    interface Props {
+        id: number;
+        family: Family;
+    }
+    let { id, family }: Props = $props();
+
+    const basePath = $derived(`/${family}s`);
+    const backLabel = $derived(`← all ${family}s`);
+
+    interface Artifact {
+        id: number;
+        name: string;
+        target_rel_path: string;
+        scope_type: 'game' | 'map' | null;
+        scope_value: string | null;
+        current_version_id: number | null;
+        kind: 'script' | 'config' | 'plugin' | 'baseline';
+        created_at: string;
+    }
+    interface Version {
+        id: number;
+        version: number;
+        sha256: string;
+        size: number;
+        notes: string | null;
+        state: 'untested' | 'tested' | 'test-failed';
+        uploaded_at: string;
+    }
+    interface ServerRow { name: string; game: string | null; map: string | null }
+    interface ScopeOptions { games: string[]; mapsByGame: Record<string, string[]> }
+
+    let artifact = $state<Artifact | null>(null);
+    let versions = $state<Version[]>([]);
+    let matchedServers = $state<string[]>([]);
+    let runningBetaId = $state<number | null>(null);
+    let loading = $state(true);
+    let flash = $state<string | null>(null);
+
+    // Modal-form state (only used while the corresponding dialog is open).
+    let scopeType = $state<'none' | 'game' | 'map'>('none');
+    let scopeGame = $state('');
+    let scopeMap = $state('');
+    let updatingScope = $state(false);
+    let scopeOptions = $state<ScopeOptions>({ games: [], mapsByGame: {} });
+
+    let versionFile = $state<File | null>(null);
+    let versionNotes = $state('');
+    let uploadingVersion = $state(false);
+
+    let scopeDialog = $state<HTMLDialogElement | null>(null);
+    let uploadDialog = $state<HTMLDialogElement | null>(null);
+    // Kept around so we can reseed scopeGame after servers load (map→game backfill).
+    let fleetServers: ServerRow[] = [];
+
+    // Polling handle for auto-refresh of server-owned state (artifact, versions,
+    // matched servers, runningBetaId). Form state is never reseeded from polling.
+    let poll: ReturnType<typeof setInterval> | null = null;
+
+    const editedScopeValue = $derived.by(() => {
+        if (scopeType === 'game') return scopeGame;
+        if (scopeType === 'map') return scopeMap;
+        return '';
+    });
+
+    const currentVersion = $derived(
+        artifact?.current_version_id
+            ? versions.find((v) => v.id === artifact!.current_version_id) ?? null
+            : null
+    );
+    const latestVersion = $derived(versions[0] ?? null);
+    const showLatestSeparately = $derived(
+        latestVersion !== null && currentVersion !== null && latestVersion.id !== currentVersion.id
+    );
+
+    function scopeLabel(s: Artifact): string {
+        if (!s.scope_type) return 'unscoped';
+        return `${s.scope_type}=${s.scope_value ?? '?'}`;
+    }
+    function stateClass(state: Version['state']): string {
+        return `tag state-${state}`;
+    }
+
+    async function load({ seedForm = true }: { seedForm?: boolean } = {}): Promise<void> {
+        const [detailRes, serversRes, scopeRes] = await Promise.all([
+            fetch(`/api/scripts/${id}`),
+            fetch('/api/servers'),
+            fetch('/api/scope-options')
+        ]);
+        if (!detailRes.ok) { loading = false; return; }
+        const body = (await detailRes.json()) as {
+            script: Artifact;
+            versions: Version[];
+            matchedServers: string[];
+            runningBetaId: number | null;
+        };
+        artifact = body.script;
+        versions = body.versions;
+        matchedServers = body.matchedServers;
+        runningBetaId = body.runningBetaId;
+
+        if (serversRes.ok) {
+            const s = (await serversRes.json()) as { servers: ServerRow[] };
+            fleetServers = s.servers;
+        }
+        if (scopeRes.ok) {
+            scopeOptions = (await scopeRes.json()) as ScopeOptions;
+        }
+        if (seedForm) seedScopeForm();
+        loading = false;
+    }
+
+    function seedScopeForm(): void {
+        if (!artifact) return;
+        scopeType = artifact.scope_type ?? 'none';
+        if (scopeType === 'game') {
+            scopeGame = artifact.scope_value ?? '';
+            scopeMap = '';
+        } else if (scopeType === 'map') {
+            scopeMap = artifact.scope_value ?? '';
+            const owner = fleetServers.find((sv) => sv.map === scopeMap);
+            scopeGame = owner?.game ?? '';
+        } else {
+            scopeGame = '';
+            scopeMap = '';
+        }
+    }
+
+    onMount(() => {
+        load();
+        poll = setInterval(() => load({ seedForm: false }), 5000);
+    });
+    onDestroy(() => {
+        if (poll) clearInterval(poll);
+    });
+
+    function openScopeModal(): void {
+        if (runningBetaId !== null) return;
+        seedScopeForm();
+        flash = null;
+        scopeDialog?.showModal();
+    }
+    function cancelScopeModal(): void {
+        seedScopeForm();
+        scopeDialog?.close();
+    }
+    function openUploadModal(): void {
+        if (runningBetaId !== null) return;
+        versionFile = null;
+        versionNotes = '';
+        flash = null;
+        uploadDialog?.showModal();
+    }
+    function cancelUploadModal(): void {
+        versionFile = null;
+        versionNotes = '';
+        uploadDialog?.close();
+    }
+    function onDialogClick(dialog: HTMLDialogElement | null, e: MouseEvent): void {
+        if (!dialog) return;
+        if (e.target === dialog) dialog.close();
+    }
+
+    function pickVersionFile(e: Event): void {
+        const t = e.target as HTMLInputElement;
+        versionFile = t.files?.[0] ?? null;
+    }
+
+    async function uploadVersion(e: Event): Promise<void> {
+        e.preventDefault();
+        if (!versionFile || uploadingVersion) return;
+        uploadingVersion = true;
+        flash = null;
+        const form = new FormData();
+        form.append('content', versionFile);
+        if (versionNotes.trim()) form.append('notes', versionNotes.trim());
+        try {
+            const res = await fetch(`/api/scripts/${id}/versions`, { method: 'POST', body: form });
+            const body = (await res.json()) as { ok: boolean; error?: string; betaRequired?: boolean };
+            if (!res.ok || !body.ok) {
+                flash = body.error ?? `HTTP ${res.status}`;
+                return;
+            }
+            versionFile = null;
+            versionNotes = '';
+            uploadDialog?.close();
+            await load();
+        } finally {
+            uploadingVersion = false;
+        }
+    }
+
+    async function saveScope(e: Event): Promise<void> {
+        e.preventDefault();
+        if (updatingScope) return;
+        if (scopeType !== 'none' && !editedScopeValue) {
+            flash = `pick a ${scopeType}`;
+            return;
+        }
+        updatingScope = true;
+        flash = null;
+        try {
+            const res = await fetch(`/api/scripts/${id}/scope`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    scopeType: scopeType === 'none' ? null : scopeType,
+                    scopeValue: scopeType === 'none' ? null : editedScopeValue
+                })
+            });
+            const body = (await res.json()) as { ok: boolean; error?: string; kind?: string };
+            if (!res.ok || !body.ok) {
+                flash = body.error ?? `HTTP ${res.status}`;
+                return;
+            }
+            scopeDialog?.close();
+            await load();
+        } finally {
+            updatingScope = false;
+        }
+    }
+
+    async function deleteArtifact(): Promise<void> {
+        if (!confirm(`Delete this ${family}?`)) return;
+        const res = await fetch(`/api/scripts/${id}`, { method: 'DELETE' });
+        const body = (await res.json()) as { ok: boolean; error?: string };
+        if (!body.ok) { flash = body.error ?? 'delete failed'; return; }
+        goto(basePath);
+    }
+</script>
+
+{#if loading}
+    <p class="empty">loading…</p>
+{:else if !artifact}
+    <p class="empty">{family} not found</p>
+{:else}
+    <a class="back" href={basePath}>{backLabel}</a>
+    <h1>{artifact.name}</h1>
+    <div class="sub mono">{artifact.target_rel_path}</div>
+
+    {#if runningBetaId}
+        <section class="panel banner">
+            <p>
+                Beta <a href="/betas/{runningBetaId}"><strong>#{runningBetaId}</strong></a> is currently running for this {family}.
+                Rollback or promote it before making changes.
+            </p>
+        </section>
+    {/if}
+
+    <section class="panel">
+        <h2>Details</h2>
+        <div class="stats">
+            <div class="stat">
+                <div class="k">target file</div>
+                <div class="v mono">{artifact.target_rel_path}</div>
+            </div>
+            <div class="stat">
+                <div class="k">scope</div>
+                <div class="v mono">{scopeLabel(artifact)}</div>
+            </div>
+            <div class="stat">
+                <div class="k">applies to</div>
+                <div class="v mono">
+                    {#if !artifact.scope_type}
+                        <span class="dim">unscoped — deploy from a beta</span>
+                    {:else if matchedServers.length === 0}
+                        <span class="warn">no matching servers</span>
+                    {:else}
+                        {matchedServers.join(', ')}
+                    {/if}
+                </div>
+            </div>
+            <div class="stat">
+                <div class="k">current version</div>
+                <div class="v mono">
+                    {#if currentVersion}
+                        v{currentVersion.version} · {currentVersion.sha256.slice(0, 8)} <span class="tag cur">promoted</span>
+                    {:else}
+                        <span class="dim">— never promoted (open a beta from <a href="/betas">/betas</a>)</span>
+                    {/if}
+                </div>
+            </div>
+            {#if showLatestSeparately && latestVersion}
+                <div class="stat">
+                    <div class="k">latest version</div>
+                    <div class="v mono">
+                        v{latestVersion.version} · {latestVersion.sha256.slice(0, 8)}
+                        <span class={stateClass(latestVersion.state)}>{latestVersion.state}</span>
+                    </div>
+                </div>
+            {/if}
+        </div>
+        <div class="actions">
+            <button
+                class="secondary"
+                onclick={openScopeModal}
+                disabled={runningBetaId !== null}
+                title={runningBetaId !== null ? 'a beta is currently running' : ''}
+            >
+                edit scope
+            </button>
+            <button
+                class="secondary"
+                onclick={openUploadModal}
+                disabled={runningBetaId !== null}
+                title={runningBetaId !== null ? 'a beta is currently running' : ''}
+            >
+                upload new version
+            </button>
+        </div>
+    </section>
+
+    <section class="panel">
+        <h2>Version history</h2>
+        {#if versions.length === 0}
+            <p class="empty">none</p>
+        {:else}
+            <div class="versions">
+                {#each versions as v (v.id)}
+                    <div class="version {artifact.current_version_id === v.id ? 'current' : ''}">
+                        <span class="v-num mono">v{v.version}</span>
+                        <span class="v-sha mono">{v.sha256.slice(0, 12)}</span>
+                        <span class="v-size mono">{v.size}B</span>
+                        <span class="v-notes">{v.notes ?? ''}</span>
+                        <span class="v-when mono">{v.uploaded_at}</span>
+                        {#if artifact.current_version_id === v.id}
+                            <span class="tag cur">promoted</span>
+                        {:else if v.state === 'tested'}
+                            <span class="tag state-tested">tested</span>
+                        {:else if v.state === 'test-failed'}
+                            <span class="tag state-test-failed">test-failed</span>
+                        {:else}
+                            <span class="tag state-untested">untested</span>
+                        {/if}
+                    </div>
+                {/each}
+            </div>
+        {/if}
+    </section>
+
+    <section class="panel">
+        <h2>Danger</h2>
+        <button class="danger" onclick={deleteArtifact}>delete {family}</button>
+    </section>
+
+    {#if flash}<p class="flash">{flash}</p>{/if}
+
+    <dialog bind:this={scopeDialog} onclick={(e) => onDialogClick(scopeDialog, e)}>
+        <form class="dlg" onsubmit={saveScope}>
+            <h3>Edit scope</h3>
+            <div class="scope-form">
+                <select bind:value={scopeType} disabled={updatingScope}>
+                    <option value="none">unscoped</option>
+                    <option value="game">game</option>
+                    <option value="map">map</option>
+                </select>
+                {#if scopeType === 'game'}
+                    <select bind:value={scopeGame} disabled={updatingScope}>
+                        <option value="">— pick a game —</option>
+                        {#each scopeOptions.games as g (g)}
+                            <option value={g}>{g}</option>
+                        {/each}
+                    </select>
+                {:else if scopeType === 'map'}
+                    <select bind:value={scopeGame} disabled={updatingScope}>
+                        <option value="">— pick a game —</option>
+                        {#each scopeOptions.games as g (g)}
+                            <option value={g}>{g}</option>
+                        {/each}
+                    </select>
+                    <select bind:value={scopeMap} disabled={updatingScope || !scopeGame}>
+                        <option value="">— pick a map —</option>
+                        {#each (scopeOptions.mapsByGame[scopeGame] ?? []) as m (m)}
+                            <option value={m}>{m}</option>
+                        {/each}
+                    </select>
+                {/if}
+            </div>
+            <div class="dlg-actions">
+                <button type="button" class="secondary" onclick={cancelScopeModal} disabled={updatingScope}>cancel</button>
+                <button type="submit" class="primary" disabled={updatingScope}>
+                    {updatingScope ? 'saving…' : 'save scope'}
+                </button>
+            </div>
+            {#if flash}<p class="flash">{flash}</p>{/if}
+        </form>
+    </dialog>
+
+    <dialog bind:this={uploadDialog} onclick={(e) => onDialogClick(uploadDialog, e)}>
+        <form class="dlg" onsubmit={uploadVersion}>
+            <h3>Upload new version</h3>
+            <div class="version-form">
+                <input type="file" onchange={pickVersionFile} disabled={uploadingVersion} />
+                <input type="text" bind:value={versionNotes} placeholder="notes (optional)" disabled={uploadingVersion} />
+            </div>
+            <div class="dlg-actions">
+                <button type="button" class="secondary" onclick={cancelUploadModal} disabled={uploadingVersion}>cancel</button>
+                <button type="submit" class="primary" disabled={uploadingVersion || !versionFile}>
+                    {uploadingVersion ? 'uploading…' : 'upload version'}
+                </button>
+            </div>
+            {#if flash}<p class="flash">{flash}</p>{/if}
+        </form>
+    </dialog>
+{/if}
+
+<style>
+    .back { color: var(--ink-500); font-family: var(--font-mono); font-size: var(--text-mono-sm); text-decoration: none; }
+    .back:hover { color: var(--ink-100); }
+    h1 { color: var(--cream); font-family: var(--font-display); font-size: var(--text-2xl); letter-spacing: 1.5px; margin: 12px 0 4px; }
+    .sub { color: var(--ink-500); font-size: var(--text-mono); margin-bottom: 24px; }
+    .empty { color: var(--ink-500); font-family: var(--font-mono); font-size: var(--text-mono); margin: 0; }
+
+    .panel { background: var(--bg-nav); border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--pad-panel); margin-bottom: 20px; }
+    .banner { background: rgba(255, 176, 32, 0.08); border-color: rgba(255, 176, 32, 0.3); }
+    .banner p { margin: 0; color: var(--cream-dim); font-family: var(--font-body); font-size: var(--text-sm); }
+    .banner a { color: var(--amber-500); }
+    h2 { margin: 0 0 14px; font-family: var(--font-body); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ink-300); }
+
+    .stats {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+        gap: 12px;
+    }
+    .stat {
+        background: var(--bg-card);
+        border: 1px solid var(--border);
+        border-radius: var(--r-sm);
+        padding: 12px 14px;
+    }
+    .stat .k {
+        color: var(--ink-500);
+        font-size: var(--text-xs);
+        text-transform: uppercase;
+        letter-spacing: 1px;
+    }
+    .stat .v {
+        color: var(--ink-100);
+        margin-top: 6px;
+        font-size: var(--text-base);
+        word-break: break-word;
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 8px;
+    }
+    .dim { color: var(--ink-500); }
+    .warn { color: var(--amber-500); }
+
+    .actions { display: flex; gap: 10px; margin-top: 18px; }
+    button.secondary {
+        background: var(--bg-card);
+        color: var(--ink-100);
+        border: 1px solid var(--border);
+        border-radius: var(--r-sm);
+        padding: 10px 16px;
+        font-family: var(--font-body);
+        font-size: var(--text-sm);
+        cursor: pointer;
+    }
+    button.secondary:hover:not(:disabled) { border-color: var(--accent); box-shadow: var(--accent-glow); }
+    button.secondary:disabled { opacity: 0.4; cursor: default; }
+
+    .scope-form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
+    .scope-form select, .version-form input {
+        background: var(--bg-page);
+        color: var(--ink-100);
+        border: 1px solid var(--border);
+        border-radius: var(--r-sm);
+        padding: 10px 12px;
+        font-family: var(--font-mono);
+        font-size: var(--text-mono);
+    }
+
+    .version-form { display: flex; gap: 10px; align-items: center; }
+    .version-form input[type=text] { flex: 1; }
+
+    .versions { display: flex; flex-direction: column; gap: 6px; }
+    .version {
+        display: grid;
+        grid-template-columns: 80px 130px 90px 1fr 200px auto;
+        gap: 14px;
+        padding: 10px 14px;
+        background: var(--bg-card);
+        border: 1px solid var(--border);
+        border-radius: var(--r-sm);
+        align-items: center;
+        font-size: var(--text-mono);
+    }
+    .version.current { border-color: var(--spark-500); box-shadow: 0 0 0 1px var(--spark-500); }
+    .v-num { color: var(--cream); font-weight: 600; }
+    .v-sha, .v-size, .v-when { color: var(--ink-500); }
+    .v-notes { color: var(--ink-300); font-family: var(--font-body); font-size: var(--text-sm); }
+    .tag { padding: 2px 8px; border-radius: var(--r-sm); font-family: var(--font-mono); font-size: var(--text-xs); border: 1px solid transparent; }
+    .tag.cur { background: rgba(124, 212, 255, 0.15); border-color: rgba(124, 212, 255, 0.4); color: var(--spark-500); }
+    .tag.state-untested { background: var(--bg-nav); border-color: var(--border); color: var(--ink-300); }
+    .tag.state-tested { background: rgba(124, 212, 255, 0.10); border-color: rgba(124, 212, 255, 0.3); color: var(--spark-500); }
+    .tag.state-test-failed { background: rgba(255, 92, 92, 0.10); border-color: rgba(255, 92, 92, 0.4); color: var(--danger-500); }
+
+    .danger {
+        background: var(--bg-nav);
+        border: 1px solid rgba(255, 48, 80, 0.4);
+        color: var(--danger-500);
+        border-radius: var(--r-sm);
+        padding: 10px 16px;
+        font-family: var(--font-body);
+        cursor: pointer;
+    }
+
+    .flash { color: var(--danger-500); font-family: var(--font-mono); font-size: var(--text-mono); margin-top: 12px; }
+    .mono { font-family: var(--font-mono); }
+
+    dialog {
+        background: var(--bg-nav);
+        color: var(--ink-100);
+        border: 1px solid var(--border);
+        border-radius: var(--r-md);
+        padding: 0;
+        max-width: 560px;
+        width: calc(100vw - 40px);
+    }
+    dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
+    .dlg { display: flex; flex-direction: column; gap: 14px; padding: var(--pad-panel); }
+    .dlg h3 {
+        margin: 0;
+        font-family: var(--font-body);
+        font-size: var(--text-xs);
+        font-weight: 700;
+        text-transform: uppercase;
+        letter-spacing: 1.5px;
+        color: var(--ink-300);
+    }
+    .dlg-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 6px; }
+    button.primary {
+        background: linear-gradient(180deg, var(--blue-500), var(--blue-600));
+        border: 1px solid var(--blue-400);
+        color: var(--cream);
+        border-radius: var(--r-sm);
+        padding: 10px 16px;
+        font-family: var(--font-body);
+        font-weight: 600;
+        cursor: pointer;
+    }
+    button.primary:disabled { opacity: 0.4; cursor: default; }
+</style>

src/lib/ui/components/LogPanel.svelte

@@ -12,7 +12,7 @@
         lines?: number;
         pollMs?: number;
     }
-    let { server, tabs, lines = 200, pollMs = 5000 }: Props = $props();
+    let { server, tabs, lines = 1000, pollMs = 5000 }: Props = $props();
 
     interface LogResponse {
         ok: boolean;

src/routes/+page.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
     import { onMount } from 'svelte';
     import ServerCard from '$ui/components/ServerCard.svelte';
-    import PipelineTimeline from '$ui/components/PipelineTimeline.svelte';
     import { statusByServer } from '$ui/stores/servers.js';
     import type { RosterPlayer, Health } from '$ui/stores/servers.js';
 
@@ -57,14 +56,12 @@
     }
 </script>
 
-<div class="grid">
+<section class="left">
-    <section class="left">
     <header class="hdr">
         <div class="title-block">
             <h1>Fleet</h1>
             <span class="count">{servers.length} server{servers.length === 1 ? '' : 's'}</span>
         </div>
-            <a class="scripts-link" href="/scripts">manage scripts →</a>
     </header>
     {#if servers.length === 0}
         <p class="empty">no servers registered yet — check SERVERS_ROOT</p>
@@ -86,22 +83,9 @@
             {/each}
         </div>
     {/if}
-    </section>
+</section>
-
-    <aside class="right">
-        <PipelineTimeline />
-    </aside>
-</div>
 
 <style>
-    .grid {
-        display: grid;
-        grid-template-columns: 1fr 400px;
-        gap: var(--gap-section);
-    }
-    @media (max-width: 900px) {
-        .grid { grid-template-columns: 1fr; }
-    }
     .hdr {
         display: flex;
         justify-content: space-between;
@@ -125,17 +109,6 @@
         color: var(--ink-500);
         letter-spacing: 0.5px;
     }
-    .scripts-link {
-        color: var(--spark-400);
-        text-decoration: none;
-        font-family: var(--font-body);
-        font-size: var(--text-sm);
-        padding: 8px 14px;
-        border: 1px solid var(--border);
-        border-radius: var(--r-sm);
-        transition: border-color 0.15s, box-shadow 0.15s;
-    }
-    .scripts-link:hover { border-color: var(--accent); box-shadow: var(--accent-glow); }
     .cards {
         display: grid;
         gap: var(--gap-cards);

src/routes/api/servers/[name]/logs/[file]/+server.ts

@@ -36,7 +36,7 @@ export const GET: RequestHandler = async ({ params, url }) => {
     if (!path) return json({ ok: false, reason: 'path traversal rejected' }, { status: 400 });
 
     const linesParam = url.searchParams.get('lines');
-    const wanted = linesParam ? Number.parseInt(linesParam, 10) : 200;
+    const wanted = linesParam ? Number.parseInt(linesParam, 10) : 1000;
 
     const tail = await tailLog(path, wanted).catch((err) => {
         return { error: (err as Error).message };

src/routes/betas/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { onMount } from 'svelte';
+    import { onMount, onDestroy } from 'svelte';
     import { goto } from '$app/navigation';
 
     type ArtifactKind = 'script' | 'config' | 'plugin' | 'baseline';
@@ -93,7 +93,21 @@
         }
         loading = false;
     }
-    onMount(load);
+    async function refreshBetas(): Promise<void> {
+        const res = await fetch('/api/betas');
+        if (!res.ok) return;
+        const body = (await res.json()) as { betas: BetaListRow[] };
+        betas = body.betas;
+    }
+
+    let poll: ReturnType<typeof setInterval> | null = null;
+    onMount(() => {
+        load();
+        poll = setInterval(refreshBetas, 5000);
+    });
+    onDestroy(() => {
+        if (poll) clearInterval(poll);
+    });
 
     // Scripts eligible for a new beta: has an unpromoted version and isn't in
     // a running beta already.

src/routes/configs/+page.svelte

@@ -272,7 +272,7 @@
     {:else}
         <div class="artifacts">
             {#each baselines as a (a.id)}
-                <a class="artifact-row" href="/scripts/{a.id}">
+                <a class="artifact-row" href="/configs/{a.id}">
                     <div class="row-top">
                         <span class="artifact-name">{a.name}</span>
                         <span class="scope tag scope-{a.scope_type ?? 'none'}">{scopeLabel(a)}</span>
@@ -304,7 +304,7 @@
     {:else}
         <div class="artifacts">
             {#each overlays as a (a.id)}
-                <a class="artifact-row" href="/scripts/{a.id}">
+                <a class="artifact-row" href="/configs/{a.id}">
                     <div class="row-top">
                         <span class="artifact-name">{a.name}</span>
                         <span class="scope tag scope-{a.scope_type ?? 'none'}">{scopeLabel(a)}</span>

src/routes/configs/[id]/+page.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+    import { page } from '$app/stores';
+    import ArtifactDetail from '$ui/components/ArtifactDetail.svelte';
+
+    let id = $derived(Number.parseInt($page.params.id ?? '0', 10));
+</script>
+
+{#key id}
+    <ArtifactDetail {id} family="config" />
+{/key}

src/routes/deployments/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { onMount } from 'svelte';
+    import { onMount, onDestroy } from 'svelte';
 
     interface ServerRow {
         server: string;
@@ -113,9 +113,14 @@
         }
     }
 
+    let poll: ReturnType<typeof setInterval> | null = null;
     onMount(async () => {
         await Promise.all([loadDeployments(), scanDrift()]);
         loading = false;
+        poll = setInterval(loadDeployments, 5000);
+    });
+    onDestroy(() => {
+        if (poll) clearInterval(poll);
     });
 
     function isActive(d: Deployment): boolean {

src/routes/deployments/[id]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { onMount } from 'svelte';
+    import { onMount, onDestroy } from 'svelte';
     import { page } from '$app/stores';
     import DiffViewer from '$ui/components/DiffViewer.svelte';
 
@@ -39,10 +39,19 @@
     let detail = $state<Detail | null>(null);
     let openFile = $state<{ id: number; before: string | null; after: string | null; verb: string; relPath: string } | null>(null);
 
-    onMount(async () => {
+    async function loadDetail(): Promise<void> {
         const id = $page.params.id;
         const res = await fetch(`/api/deployments/${id}`);
         detail = (await res.json()) as Detail;
+    }
+
+    let poll: ReturnType<typeof setInterval> | null = null;
+    onMount(() => {
+        loadDetail();
+        poll = setInterval(loadDetail, 5000);
+    });
+    onDestroy(() => {
+        if (poll) clearInterval(poll);
     });
 
     async function loadDiff(f: FileRow) {

src/routes/plugins/+page.svelte

@@ -191,7 +191,7 @@
     {:else}
         <div class="artifacts">
             {#each plugins as a (a.id)}
-                <a class="artifact-row" href="/scripts/{a.id}">
+                <a class="artifact-row" href="/plugins/{a.id}">
                     <div class="row-top">
                         <span class="artifact-name">{a.name}</span>
                         <span class="scope tag scope-{a.scope_type ?? 'none'}">{scopeLabel(a)}</span>

src/routes/plugins/[id]/+page.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+    import { page } from '$app/stores';
+    import ArtifactDetail from '$ui/components/ArtifactDetail.svelte';
+
+    let id = $derived(Number.parseInt($page.params.id ?? '0', 10));
+</script>
+
+{#key id}
+    <ArtifactDetail {id} family="plugin" />
+{/key}

src/routes/scripts/+page.svelte

@@ -8,6 +8,7 @@
         scope_type: 'game' | 'map' | null;
         scope_value: string | null;
         current_version_id: number | null;
+        kind: 'script' | 'config' | 'plugin' | 'baseline';
         latestVersion: {
             id: number;
             version: number;
@@ -145,6 +146,15 @@
         return `${s.scope_type}=${s.scope_value ?? '?'}`;
     }
 
+    // Configs/baselines and plugins have their own detail routes; scripts fall
+    // through to /scripts/{id}. The "all scripts" list is still an everything
+    // view, but each row deep-links to the right family.
+    function detailHref(s: ScriptRow): string {
+        if (s.kind === 'config' || s.kind === 'baseline') return `/configs/${s.id}`;
+        if (s.kind === 'plugin') return `/plugins/${s.id}`;
+        return `/scripts/${s.id}`;
+    }
+
     // What state tag to show on a script row. Distinguishes "never promoted"
     // (whole script is untested) from "promoted but has a newer untested
     // version" (existing production is fine, but there's unreleased work).
@@ -238,7 +248,7 @@
     {:else}
         <div class="scripts">
             {#each scripts as s (s.id)}
-                <a class="script-row" href="/scripts/{s.id}">
+                <a class="script-row" href={detailHref(s)}>
                     <div class="row-top">
                         <span class="script-name">{s.name}</span>
                         <span class="scope tag scope-{s.scope_type ?? 'none'}">{scopeLabel(s)}</span>

src/routes/scripts/[id]/+page.svelte

@@ -1,541 +1,10 @@
 <script lang="ts">
-    import { onMount } from 'svelte';
     import { page } from '$app/stores';
-    import { goto } from '$app/navigation';
+    import ArtifactDetail from '$ui/components/ArtifactDetail.svelte';
-
-    interface Script {
-        id: number;
-        name: string;
-        target_rel_path: string;
-        scope_type: 'game' | 'map' | null;
-        scope_value: string | null;
-        current_version_id: number | null;
-        created_at: string;
-    }
-    interface Version {
-        id: number;
-        version: number;
-        sha256: string;
-        size: number;
-        notes: string | null;
-        state: 'untested' | 'tested' | 'test-failed';
-        uploaded_at: string;
-    }
-    interface ServerRow { name: string; game: string | null; map: string | null }
-    interface ScopeOptions { games: string[]; mapsByGame: Record<string, string[]> }
-
-    let script = $state<Script | null>(null);
-    let versions = $state<Version[]>([]);
-    let matchedServers = $state<string[]>([]);
-    let runningBetaId = $state<number | null>(null);
-    let loading = $state(true);
-    let flash = $state<string | null>(null);
-
-    // Modal-form state (only used while the corresponding dialog is open).
-    let scopeType = $state<'none' | 'game' | 'map'>('none');
-    let scopeGame = $state('');
-    let scopeMap = $state('');
-    let updatingScope = $state(false);
-    let scopeOptions = $state<ScopeOptions>({ games: [], mapsByGame: {} });
-
-    let versionFile = $state<File | null>(null);
-    let versionNotes = $state('');
-    let uploadingVersion = $state(false);
-
-    // Dialog refs so we can call .showModal()/.close() imperatively.
-    let scopeDialog = $state<HTMLDialogElement | null>(null);
-    let uploadDialog = $state<HTMLDialogElement | null>(null);
-    // Kept around so we can reseed scopeGame after servers load (map→game backfill).
-    let fleetServers: ServerRow[] = [];
-
-    const editedScopeValue = $derived.by(() => {
-        if (scopeType === 'game') return scopeGame;
-        if (scopeType === 'map') return scopeMap;
-        return '';
-    });
 
     let id = $derived(Number.parseInt($page.params.id ?? '0', 10));
-
-    // Info-panel derivations.
-    const currentVersion = $derived(
-        script?.current_version_id
-            ? versions.find((v) => v.id === script!.current_version_id) ?? null
-            : null
-    );
-    const latestVersion = $derived(versions[0] ?? null);
-    const showLatestSeparately = $derived(
-        latestVersion !== null && currentVersion !== null && latestVersion.id !== currentVersion.id
-    );
-    function scopeLabel(s: Script): string {
-        if (!s.scope_type) return 'unscoped';
-        return `${s.scope_type}=${s.scope_value ?? '?'}`;
-    }
-    function stateClass(state: Version['state']): string {
-        return `tag state-${state}`;
-    }
-
-    async function load(): Promise<void> {
-        const [detailRes, serversRes, scopeRes] = await Promise.all([
-            fetch(`/api/scripts/${id}`),
-            fetch('/api/servers'),
-            fetch('/api/scope-options')
-        ]);
-        if (!detailRes.ok) { loading = false; return; }
-        const body = (await detailRes.json()) as {
-            script: Script;
-            versions: Version[];
-            matchedServers: string[];
-            runningBetaId: number | null;
-        };
-        script = body.script;
-        versions = body.versions;
-        matchedServers = body.matchedServers;
-        runningBetaId = body.runningBetaId;
-        seedScopeForm();
-
-        if (serversRes.ok) {
-            const s = (await serversRes.json()) as { servers: ServerRow[] };
-            fleetServers = s.servers;
-            if (scopeType === 'map' && scopeMap) {
-                const owner = fleetServers.find((sv) => sv.map === scopeMap);
-                if (owner?.game) scopeGame = owner.game;
-            }
-        }
-        if (scopeRes.ok) {
-            scopeOptions = (await scopeRes.json()) as ScopeOptions;
-        }
-        loading = false;
-    }
-    // Reset the scope modal fields to whatever the script currently has. Called
-    // on load and on cancel so the modal never carries stale edits into a
-    // second open.
-    function seedScopeForm(): void {
-        if (!script) return;
-        scopeType = script.scope_type ?? 'none';
-        if (scopeType === 'game') {
-            scopeGame = script.scope_value ?? '';
-            scopeMap = '';
-        } else if (scopeType === 'map') {
-            scopeMap = script.scope_value ?? '';
-            // Backfill game from the fleet if we already have it.
-            const owner = fleetServers.find((sv) => sv.map === scopeMap);
-            scopeGame = owner?.game ?? '';
-        } else {
-            scopeGame = '';
-            scopeMap = '';
-        }
-    }
-    onMount(load);
-
-    function openScopeModal(): void {
-        if (runningBetaId !== null) return;
-        seedScopeForm();
-        flash = null;
-        scopeDialog?.showModal();
-    }
-    function cancelScopeModal(): void {
-        seedScopeForm();
-        scopeDialog?.close();
-    }
-    function openUploadModal(): void {
-        if (runningBetaId !== null) return;
-        versionFile = null;
-        versionNotes = '';
-        flash = null;
-        uploadDialog?.showModal();
-    }
-    function cancelUploadModal(): void {
-        versionFile = null;
-        versionNotes = '';
-        uploadDialog?.close();
-    }
-    // Standard <dialog> idiom: click on the ::backdrop bubbles up as a click on
-    // the dialog element itself (target === the dialog), while clicks inside
-    // the content bubble up with target inside the dialog.
-    function onDialogClick(dialog: HTMLDialogElement | null, e: MouseEvent): void {
-        if (!dialog) return;
-        if (e.target === dialog) dialog.close();
-    }
-
-    function pickVersionFile(e: Event): void {
-        const t = e.target as HTMLInputElement;
-        versionFile = t.files?.[0] ?? null;
-    }
-
-    async function uploadVersion(e: Event): Promise<void> {
-        e.preventDefault();
-        if (!versionFile || uploadingVersion) return;
-        uploadingVersion = true;
-        flash = null;
-        const form = new FormData();
-        form.append('content', versionFile);
-        if (versionNotes.trim()) form.append('notes', versionNotes.trim());
-        try {
-            const res = await fetch(`/api/scripts/${id}/versions`, { method: 'POST', body: form });
-            const body = (await res.json()) as { ok: boolean; error?: string; betaRequired?: boolean };
-            if (!res.ok || !body.ok) {
-                flash = body.error ?? `HTTP ${res.status}`;
-                return;
-            }
-            versionFile = null;
-            versionNotes = '';
-            uploadDialog?.close();
-            await load();
-        } finally {
-            uploadingVersion = false;
-        }
-    }
-
-    async function saveScope(e: Event): Promise<void> {
-        e.preventDefault();
-        if (updatingScope) return;
-        if (scopeType !== 'none' && !editedScopeValue) {
-            flash = `pick a ${scopeType}`;
-            return;
-        }
-        updatingScope = true;
-        flash = null;
-        try {
-            const res = await fetch(`/api/scripts/${id}/scope`, {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({
-                    scopeType: scopeType === 'none' ? null : scopeType,
-                    scopeValue: scopeType === 'none' ? null : editedScopeValue
-                })
-            });
-            const body = (await res.json()) as { ok: boolean; error?: string; kind?: string };
-            if (!res.ok || !body.ok) {
-                flash = body.error ?? `HTTP ${res.status}`;
-                return;
-            }
-            scopeDialog?.close();
-            await load();
-        } finally {
-            updatingScope = false;
-        }
-    }
-
-    async function deleteScript(): Promise<void> {
-        if (!confirm('Delete this script?')) return;
-        const res = await fetch(`/api/scripts/${id}`, { method: 'DELETE' });
-        const body = (await res.json()) as { ok: boolean; error?: string };
-        if (!body.ok) { flash = body.error ?? 'delete failed'; return; }
-        goto('/scripts');
-    }
 </script>
 
-{#if loading}
+{#key id}
-    <p class="empty">loading…</p>
+    <ArtifactDetail {id} family="script" />
-{:else if !script}
+{/key}
-    <p class="empty">script not found</p>
-{:else}
-    <a class="back" href="/scripts">← all scripts</a>
-    <h1>{script.name}</h1>
-    <div class="sub mono">{script.target_rel_path}</div>
-
-    {#if runningBetaId}
-        <section class="panel banner">
-            <p>
-                Beta <a href="/betas/{runningBetaId}"><strong>#{runningBetaId}</strong></a> is currently running for this script.
-                Rollback or promote it before making changes.
-            </p>
-        </section>
-    {/if}
-
-    <section class="panel">
-        <h2>Details</h2>
-        <div class="stats">
-            <div class="stat">
-                <div class="k">target file</div>
-                <div class="v mono">{script.target_rel_path}</div>
-            </div>
-            <div class="stat">
-                <div class="k">scope</div>
-                <div class="v mono">{scopeLabel(script)}</div>
-            </div>
-            <div class="stat">
-                <div class="k">applies to</div>
-                <div class="v mono">
-                    {#if !script.scope_type}
-                        <span class="dim">unscoped — deploy from a beta</span>
-                    {:else if matchedServers.length === 0}
-                        <span class="warn">no matching servers</span>
-                    {:else}
-                        {matchedServers.join(', ')}
-                    {/if}
-                </div>
-            </div>
-            <div class="stat">
-                <div class="k">current version</div>
-                <div class="v mono">
-                    {#if currentVersion}
-                        v{currentVersion.version} · {currentVersion.sha256.slice(0, 8)} <span class="tag cur">promoted</span>
-                    {:else}
-                        <span class="dim">— never promoted (open a beta from <a href="/betas">/betas</a>)</span>
-                    {/if}
-                </div>
-            </div>
-            {#if showLatestSeparately && latestVersion}
-                <div class="stat">
-                    <div class="k">latest version</div>
-                    <div class="v mono">
-                        v{latestVersion.version} · {latestVersion.sha256.slice(0, 8)}
-                        <span class={stateClass(latestVersion.state)}>{latestVersion.state}</span>
-                    </div>
-                </div>
-            {/if}
-        </div>
-        <div class="actions">
-            <button
-                class="secondary"
-                onclick={openScopeModal}
-                disabled={runningBetaId !== null}
-                title={runningBetaId !== null ? 'a beta is currently running' : ''}
-            >
-                edit scope
-            </button>
-            <button
-                class="secondary"
-                onclick={openUploadModal}
-                disabled={runningBetaId !== null}
-                title={runningBetaId !== null ? 'a beta is currently running' : ''}
-            >
-                upload new version
-            </button>
-        </div>
-    </section>
-
-    <section class="panel">
-        <h2>Version history</h2>
-        {#if versions.length === 0}
-            <p class="empty">none</p>
-        {:else}
-            <div class="versions">
-                {#each versions as v (v.id)}
-                    <div class="version {script.current_version_id === v.id ? 'current' : ''}">
-                        <span class="v-num mono">v{v.version}</span>
-                        <span class="v-sha mono">{v.sha256.slice(0, 12)}</span>
-                        <span class="v-size mono">{v.size}B</span>
-                        <span class="v-notes">{v.notes ?? ''}</span>
-                        <span class="v-when mono">{v.uploaded_at}</span>
-                        {#if script.current_version_id === v.id}
-                            <span class="tag cur">promoted</span>
-                        {:else if v.state === 'tested'}
-                            <span class="tag state-tested">tested</span>
-                        {:else if v.state === 'test-failed'}
-                            <span class="tag state-test-failed">test-failed</span>
-                        {:else}
-                            <span class="tag state-untested">untested</span>
-                        {/if}
-                    </div>
-                {/each}
-            </div>
-        {/if}
-    </section>
-
-    <section class="panel">
-        <h2>Danger</h2>
-        <button class="danger" onclick={deleteScript}>delete script</button>
-    </section>
-
-    {#if flash}<p class="flash">{flash}</p>{/if}
-
-    <dialog bind:this={scopeDialog} onclick={(e) => onDialogClick(scopeDialog, e)}>
-        <form class="dlg" onsubmit={saveScope}>
-            <h3>Edit scope</h3>
-            <div class="scope-form">
-                <select bind:value={scopeType} disabled={updatingScope}>
-                    <option value="none">unscoped</option>
-                    <option value="game">game</option>
-                    <option value="map">map</option>
-                </select>
-                {#if scopeType === 'game'}
-                    <select bind:value={scopeGame} disabled={updatingScope}>
-                        <option value="">— pick a game —</option>
-                        {#each scopeOptions.games as g (g)}
-                            <option value={g}>{g}</option>
-                        {/each}
-                    </select>
-                {:else if scopeType === 'map'}
-                    <select bind:value={scopeGame} disabled={updatingScope}>
-                        <option value="">— pick a game —</option>
-                        {#each scopeOptions.games as g (g)}
-                            <option value={g}>{g}</option>
-                        {/each}
-                    </select>
-                    <select bind:value={scopeMap} disabled={updatingScope || !scopeGame}>
-                        <option value="">— pick a map —</option>
-                        {#each (scopeOptions.mapsByGame[scopeGame] ?? []) as m (m)}
-                            <option value={m}>{m}</option>
-                        {/each}
-                    </select>
-                {/if}
-            </div>
-            <div class="dlg-actions">
-                <button type="button" class="secondary" onclick={cancelScopeModal} disabled={updatingScope}>cancel</button>
-                <button type="submit" class="primary" disabled={updatingScope}>
-                    {updatingScope ? 'saving…' : 'save scope'}
-                </button>
-            </div>
-            {#if flash}<p class="flash">{flash}</p>{/if}
-        </form>
-    </dialog>
-
-    <dialog bind:this={uploadDialog} onclick={(e) => onDialogClick(uploadDialog, e)}>
-        <form class="dlg" onsubmit={uploadVersion}>
-            <h3>Upload new version</h3>
-            <div class="version-form">
-                <input type="file" onchange={pickVersionFile} disabled={uploadingVersion} />
-                <input type="text" bind:value={versionNotes} placeholder="notes (optional)" disabled={uploadingVersion} />
-            </div>
-            <div class="dlg-actions">
-                <button type="button" class="secondary" onclick={cancelUploadModal} disabled={uploadingVersion}>cancel</button>
-                <button type="submit" class="primary" disabled={uploadingVersion || !versionFile}>
-                    {uploadingVersion ? 'uploading…' : 'upload version'}
-                </button>
-            </div>
-            {#if flash}<p class="flash">{flash}</p>{/if}
-        </form>
-    </dialog>
-{/if}
-
-<style>
-    .back { color: var(--ink-500); font-family: var(--font-mono); font-size: var(--text-mono-sm); text-decoration: none; }
-    .back:hover { color: var(--ink-100); }
-    h1 { color: var(--cream); font-family: var(--font-display); font-size: var(--text-2xl); letter-spacing: 1.5px; margin: 12px 0 4px; }
-    .sub { color: var(--ink-500); font-size: var(--text-mono); margin-bottom: 24px; }
-    .empty { color: var(--ink-500); font-family: var(--font-mono); font-size: var(--text-mono); margin: 0; }
-
-    .panel { background: var(--bg-nav); border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--pad-panel); margin-bottom: 20px; }
-    .banner { background: rgba(255, 176, 32, 0.08); border-color: rgba(255, 176, 32, 0.3); }
-    .banner p { margin: 0; color: var(--cream-dim); font-family: var(--font-body); font-size: var(--text-sm); }
-    .banner a { color: var(--amber-500); }
-    h2 { margin: 0 0 14px; font-family: var(--font-body); font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ink-300); }
-
-    .stats {
-        display: grid;
-        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
-        gap: 12px;
-    }
-    .stat {
-        background: var(--bg-card);
-        border: 1px solid var(--border);
-        border-radius: var(--r-sm);
-        padding: 12px 14px;
-    }
-    .stat .k {
-        color: var(--ink-500);
-        font-size: var(--text-xs);
-        text-transform: uppercase;
-        letter-spacing: 1px;
-    }
-    .stat .v {
-        color: var(--ink-100);
-        margin-top: 6px;
-        font-size: var(--text-base);
-        word-break: break-word;
-        display: flex;
-        flex-wrap: wrap;
-        align-items: center;
-        gap: 8px;
-    }
-    .dim { color: var(--ink-500); }
-    .warn { color: var(--amber-500); }
-
-    .actions { display: flex; gap: 10px; margin-top: 18px; }
-    button.secondary {
-        background: var(--bg-card);
-        color: var(--ink-100);
-        border: 1px solid var(--border);
-        border-radius: var(--r-sm);
-        padding: 10px 16px;
-        font-family: var(--font-body);
-        font-size: var(--text-sm);
-        cursor: pointer;
-    }
-    button.secondary:hover:not(:disabled) { border-color: var(--accent); box-shadow: var(--accent-glow); }
-    button.secondary:disabled { opacity: 0.4; cursor: default; }
-
-    .scope-form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
-    .scope-form select, .version-form input {
-        background: var(--bg-page);
-        color: var(--ink-100);
-        border: 1px solid var(--border);
-        border-radius: var(--r-sm);
-        padding: 10px 12px;
-        font-family: var(--font-mono);
-        font-size: var(--text-mono);
-    }
-
-    .version-form { display: flex; gap: 10px; align-items: center; }
-    .version-form input[type=text] { flex: 1; }
-
-    .versions { display: flex; flex-direction: column; gap: 6px; }
-    .version {
-        display: grid;
-        grid-template-columns: 80px 130px 90px 1fr 200px auto;
-        gap: 14px;
-        padding: 10px 14px;
-        background: var(--bg-card);
-        border: 1px solid var(--border);
-        border-radius: var(--r-sm);
-        align-items: center;
-        font-size: var(--text-mono);
-    }
-    .version.current { border-color: var(--spark-500); box-shadow: 0 0 0 1px var(--spark-500); }
-    .v-num { color: var(--cream); font-weight: 600; }
-    .v-sha, .v-size, .v-when { color: var(--ink-500); }
-    .v-notes { color: var(--ink-300); font-family: var(--font-body); font-size: var(--text-sm); }
-    .tag { padding: 2px 8px; border-radius: var(--r-sm); font-family: var(--font-mono); font-size: var(--text-xs); border: 1px solid transparent; }
-    .tag.cur { background: rgba(124, 212, 255, 0.15); border-color: rgba(124, 212, 255, 0.4); color: var(--spark-500); }
-    .tag.state-untested { background: var(--bg-nav); border-color: var(--border); color: var(--ink-300); }
-    .tag.state-tested { background: rgba(124, 212, 255, 0.10); border-color: rgba(124, 212, 255, 0.3); color: var(--spark-500); }
-    .tag.state-test-failed { background: rgba(255, 92, 92, 0.10); border-color: rgba(255, 92, 92, 0.4); color: var(--danger-500); }
-
-    .danger {
-        background: var(--bg-nav);
-        border: 1px solid rgba(255, 48, 80, 0.4);
-        color: var(--danger-500);
-        border-radius: var(--r-sm);
-        padding: 10px 16px;
-        font-family: var(--font-body);
-        cursor: pointer;
-    }
-
-    .flash { color: var(--danger-500); font-family: var(--font-mono); font-size: var(--text-mono); margin-top: 12px; }
-    .mono { font-family: var(--font-mono); }
-
-    dialog {
-        background: var(--bg-nav);
-        color: var(--ink-100);
-        border: 1px solid var(--border);
-        border-radius: var(--r-md);
-        padding: 0;
-        max-width: 560px;
-        width: calc(100vw - 40px);
-    }
-    dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
-    .dlg { display: flex; flex-direction: column; gap: 14px; padding: var(--pad-panel); }
-    .dlg h3 {
-        margin: 0;
-        font-family: var(--font-body);
-        font-size: var(--text-xs);
-        font-weight: 700;
-        text-transform: uppercase;
-        letter-spacing: 1.5px;
-        color: var(--ink-300);
-    }
-    .dlg-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 6px; }
-    button.primary {
-        background: linear-gradient(180deg, var(--blue-500), var(--blue-600));
-        border: 1px solid var(--blue-400);
-        color: var(--cream);
-        border-radius: var(--r-sm);
-        padding: 10px 16px;
-        font-family: var(--font-body);
-        font-weight: 600;
-        cursor: pointer;
-    }
-    button.primary:disabled { opacity: 0.4; cursor: default; }
-</style>

src/routes/servers/[name]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { onMount } from 'svelte';
+    import { onMount, onDestroy } from 'svelte';
     import { page } from '$app/stores';
     import { statusByServer } from '$ui/stores/servers.js';
     import type { RosterPlayer, Health, RconEndpoint, RconFailure } from '$ui/stores/servers.js';
@@ -112,7 +112,7 @@
     let rconProbe = $state<RconProbeResult | null>(null);
     let probingRcon = $state(false);
 
-    onMount(async () => {
+    async function loadServer(): Promise<void> {
         const [srvRes, depRes, invRes] = await Promise.all([
             fetch('/api/servers'),
             fetch('/api/deployments'),
@@ -127,6 +127,15 @@
             const invBody = (await invRes.json()) as { scripts: InventoryEntry[] };
             inventory = invBody.scripts;
         }
+    }
+
+    let poll: ReturnType<typeof setInterval> | null = null;
+    onMount(() => {
+        loadServer();
+        poll = setInterval(loadServer, 5000);
+    });
+    onDestroy(() => {
+        if (poll) clearInterval(poll);
     });
 
     let live = $derived($statusByServer.get(name));