:root { --bg: #090d16; --surface: #101725; --surface-soft: #121b2b; --surface-deep: #080c14; --text: #f2f7ff; --muted: #8c9ab1; --blue: #4d8dff; --blue-bright: #72a8ff; --blue-soft: rgba(77, 141, 255, 0.18); --green: #52e2a2; --amber: #ffcb6b; --danger: #ff7790; --line: rgba(139, 176, 238, 0.12); --shadow-raised: -12px -12px 30px rgba(53, 86, 145, 0.13), 16px 18px 38px rgba(0, 0, 0, 0.52); --shadow-small: -7px -7px 18px rgba(57, 94, 157, 0.13), 9px 10px 22px rgba(0, 0, 0, 0.46); --shadow-inset: inset 5px 5px 12px rgba(0, 0, 0, 0.5), inset -5px -5px 12px rgba(58, 96, 164, 0.11); --radius-xl: 30px; --radius-lg: 22px; --radius-md: 16px; } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { min-height: 100vh; margin: 0; overflow-x: hidden; color: var(--text); background: radial-gradient(circle at 8% 8%, rgba(50, 104, 210, 0.13), transparent 27rem), radial-gradient(circle at 92% 36%, rgba(35, 88, 189, 0.09), transparent 30rem), var(--bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.5; } body::before { position: fixed; inset: 0; z-index: -1; pointer-events: none; content: ""; opacity: 0.22; background-image: linear-gradient(rgba(91, 142, 226, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(91, 142, 226, 0.035) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom, black, transparent 80%); } a { color: inherit; } button, a { -webkit-tap-highlight-color: transparent; } .shell { width: min(1180px, calc(100% - 36px)); margin: 0 auto; } .site-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px 0 18px; } .brand { display: inline-flex; align-items: center; gap: 13px; color: var(--text); text-decoration: none; } .brand-mark { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(124, 169, 248, 0.15); border-radius: 16px; background: linear-gradient(145deg, #121b2c, #0c111d); box-shadow: var(--shadow-small); } .brand-mark svg { width: 26px; color: var(--blue-bright); filter: drop-shadow(0 0 10px rgba(77, 141, 255, 0.55)); } .brand-copy strong, .brand-copy span { display: block; } .brand-copy strong { letter-spacing: 0.16em; font-size: 0.98rem; } .brand-copy span { margin-top: 2px; color: var(--muted); font-size: 0.74rem; letter-spacing: 0.04em; } .server-pill { display: inline-flex; align-items: center; gap: 10px; min-width: 154px; padding: 11px 15px; border: 1px solid rgba(126, 166, 233, 0.12); border-radius: 999px; color: var(--muted); background: var(--surface); box-shadow: var(--shadow-inset); font-size: 0.82rem; font-weight: 700; } .status-dot { position: relative; width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--amber); box-shadow: 0 0 14px currentColor; color: var(--amber); } .status-dot::after { position: absolute; inset: -5px; content: ""; border: 1px solid currentColor; border-radius: 50%; opacity: 0.25; animation: pulse 1.8s ease-out infinite; } .server-pill.online .status-dot { color: var(--green); background: var(--green); } .server-pill.offline .status-dot { color: var(--danger); background: var(--danger); } @keyframes pulse { 0% { transform: scale(0.72); opacity: 0.5; } 70%, 100% { transform: scale(1.35); opacity: 0; } } .hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); gap: 58px; align-items: center; min-height: 600px; padding: 74px 64px; margin-top: 22px; overflow: hidden; border: 1px solid rgba(125, 165, 233, 0.11); border-radius: var(--radius-xl); background: linear-gradient(145deg, rgba(18, 27, 44, 0.97), rgba(9, 14, 24, 0.98)); box-shadow: var(--shadow-raised); } .hero::before { position: absolute; top: -180px; right: -130px; width: 500px; height: 500px; content: ""; border: 1px solid rgba(91, 147, 247, 0.16); border-radius: 50%; box-shadow: inset 0 0 100px rgba(48, 107, 223, 0.08), 0 0 100px rgba(48, 107, 223, 0.06); } .eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 22px; color: var(--blue-bright); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; } .eyebrow::before { width: 32px; height: 2px; content: ""; border-radius: 999px; background: var(--blue); box-shadow: 0 0 12px var(--blue); } h1 { max-width: 720px; margin: 0; font-size: clamp(3.2rem, 7vw, 6.8rem); font-weight: 780; letter-spacing: -0.065em; line-height: 0.9; } h1 span { display: block; margin-top: 18px; color: transparent; background: linear-gradient(110deg, #f7fbff 2%, #83b2ff 52%, #4d8dff 100%); background-clip: text; -webkit-background-clip: text; text-shadow: 0 0 42px rgba(77, 141, 255, 0.12); } .hero-copy { max-width: 620px; margin: 28px 0 0; color: var(--muted); font-size: clamp(1rem, 1.8vw, 1.17rem); } .hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; } .button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 10px; padding: 0 22px; border: 1px solid rgba(124, 168, 242, 0.14); border-radius: 16px; cursor: pointer; color: var(--text); background: linear-gradient(145deg, #141e30, #0d1421); box-shadow: var(--shadow-small); font: inherit; font-size: 0.9rem; font-weight: 750; text-decoration: none; transition: transform 160ms ease, box-shadow 160ms ease, color 160ms ease; } .button:hover:not([aria-disabled="true"]) { transform: translateY(-2px); box-shadow: -8px -8px 20px rgba(65, 108, 181, 0.17), 12px 14px 26px rgba(0, 0, 0, 0.55), 0 0 22px rgba(77, 141, 255, 0.12); } .button:active:not([aria-disabled="true"]) { transform: translateY(1px); box-shadow: var(--shadow-inset); } .button.primary { border-color: rgba(108, 164, 255, 0.32); color: #ffffff; background: linear-gradient(145deg, #3879e9, #2253ae); box-shadow: -8px -8px 20px rgba(74, 128, 219, 0.17), 10px 12px 24px rgba(0, 0, 0, 0.56), 0 0 24px rgba(77, 141, 255, 0.2); } .button[aria-disabled="true"] { cursor: not-allowed; opacity: 0.48; } .button svg { width: 18px; height: 18px; } .release-note { min-height: 22px; margin: 17px 0 0; color: #75849b; font-size: 0.8rem; } .terminal-card { position: relative; z-index: 1; padding: 28px; border: 1px solid rgba(123, 165, 236, 0.12); border-radius: 26px; background: linear-gradient(145deg, #111a2a, #0a101b); box-shadow: var(--shadow-raised); } .terminal-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 23px; } .terminal-dots { display: flex; gap: 7px; } .terminal-dots span { width: 9px; height: 9px; border-radius: 50%; background: #26344b; box-shadow: var(--shadow-inset); } .terminal-label { color: #667690; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; } .command { position: relative; min-height: 102px; padding: 20px 48px 20px 20px; overflow-wrap: anywhere; border: 1px solid rgba(101, 145, 218, 0.08); border-radius: 17px; color: #c9d8ef; background: #080d16; box-shadow: var(--shadow-inset); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.83rem; line-height: 1.75; } .command .prompt { color: var(--blue-bright); } .copy-button { position: absolute; top: 12px; right: 12px; display: grid; width: 34px; height: 34px; place-items: center; border: 0; border-radius: 11px; cursor: pointer; color: #8295b1; background: #101827; box-shadow: var(--shadow-small); } .copy-button:hover { color: var(--blue-bright); } .copy-button svg { width: 15px; } .trust-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 20px; } .trust-item { display: flex; align-items: center; gap: 10px; color: #8191aa; font-size: 0.77rem; } .trust-item svg { width: 16px; color: var(--blue-bright); } .section { padding: 100px 0 20px; } .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 34px; } .section-heading h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.5rem); letter-spacing: -0.045em; line-height: 1; } .section-heading p { max-width: 470px; margin: 0; color: var(--muted); font-size: 0.94rem; } .release-panel { padding: 24px; border: 1px solid rgba(123, 165, 236, 0.1); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow-raised); } .release-meta { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 6px 6px 24px; border-bottom: 1px solid var(--line); } .version-lockup strong, .version-lockup span { display: block; } .version-lockup strong { font-size: 1.22rem; } .version-lockup span { margin-top: 4px; color: var(--muted); font-size: 0.78rem; } .manifest-state { padding: 8px 12px; border: 1px solid rgba(255, 203, 107, 0.17); border-radius: 999px; color: var(--amber); background: rgba(255, 203, 107, 0.06); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; } .manifest-state.ready { border-color: rgba(82, 226, 162, 0.18); color: var(--green); background: rgba(82, 226, 162, 0.06); } .downloads { display: grid; gap: 14px; padding-top: 22px; } .download-row { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(200px, 1.25fr) auto; gap: 18px; align-items: center; padding: 18px; border: 1px solid rgba(123, 165, 236, 0.08); border-radius: 20px; background: var(--surface-soft); box-shadow: var(--shadow-small); } .platform-name { display: flex; align-items: center; gap: 13px; font-weight: 750; } .platform-icon { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 14px; color: var(--blue-bright); background: #0c1320; box-shadow: var(--shadow-inset); font-family: ui-monospace, monospace; font-size: 0.74rem; font-weight: 800; text-transform: uppercase; } .asset-meta { min-width: 0; } .asset-meta strong, .asset-meta span { display: block; } .asset-meta strong { overflow: hidden; color: #b9c8de; font-family: ui-monospace, monospace; font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; } .asset-meta span { margin-top: 5px; overflow: hidden; color: #677791; font-family: ui-monospace, monospace; font-size: 0.68rem; text-overflow: ellipsis; white-space: nowrap; } .download-link { min-height: 42px; padding: 0 17px; border-radius: 13px; font-size: 0.78rem; } .empty-release { display: grid; min-height: 220px; place-items: center; padding: 40px; text-align: center; } .empty-release strong { display: block; font-size: 1.05rem; } .empty-release p { max-width: 500px; margin: 8px auto 0; color: var(--muted); font-size: 0.86rem; } .feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; } .feature-card { min-height: 235px; padding: 29px; border: 1px solid rgba(123, 165, 236, 0.09); border-radius: var(--radius-lg); background: linear-gradient(145deg, #111a2a, #0b111d); box-shadow: var(--shadow-small); } .feature-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: var(--blue-bright); background: #0b111c; box-shadow: var(--shadow-inset); } .feature-icon svg { width: 22px; } .feature-card h3 { margin: 24px 0 10px; font-size: 1.02rem; } .feature-card p { margin: 0; color: var(--muted); font-size: 0.84rem; } footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 78px 0 34px; color: #66738a; font-size: 0.75rem; } footer a { color: #8697b2; text-decoration: none; } footer a:hover { color: var(--blue-bright); } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } @media (max-width: 920px) { .hero { grid-template-columns: 1fr; padding: 60px 44px; } .terminal-card { max-width: 620px; } .feature-grid { grid-template-columns: 1fr; } } @media (max-width: 680px) { .shell { width: min(100% - 24px, 1180px); } .site-header { padding-top: 18px; } .brand-copy span { display: none; } .server-pill { min-width: 0; padding: 10px 13px; } .hero { min-height: 0; padding: 48px 24px 28px; border-radius: 24px; } h1 { font-size: clamp(3.3rem, 18vw, 5rem); } .hero-actions { display: grid; grid-template-columns: 1fr; } .button { width: 100%; } .terminal-card { padding: 20px; border-radius: 21px; } .trust-list { grid-template-columns: 1fr; } .section { padding-top: 72px; } .section-heading { display: block; } .section-heading p { margin-top: 15px; } .release-panel { padding: 16px; border-radius: 24px; } .release-meta { align-items: flex-start; flex-direction: column; } .download-row { grid-template-columns: 1fr; } footer { align-items: flex-start; flex-direction: column; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } class="site-header shell"> DHD Dial Home Device
Checking server

Project intelligence, synchronized

Dial home.Ship aligned.

DHD keeps project-specific skills, agents, workflows, and instruction files connected to one versioned source of truth—without hiding the Git history underneath.

Checking latest release

Reading the signed release channel…

Latest CLI release

Choose your platform. Every published executable is described by the offline-signed release manifest with its

exact size and SHA-256 digest.

Release channel pending No signed manifest is currently published.
Awaiting release
Preparing the first trusted build

The server is online, but downloads stay unavailable until a complete release matrix is signed offline and published.

Built for controlled evolution

DHD makes synchronization explicit, inspectable, and recoverable instead of silently replacing local project guidance.

Project-scoped bank>

Keep skills, agents

, workflows, and root instructions grouped by project while retaining ordinary Git history.

Safe synchronization

<p>Inspect status before pull, preserve local changes, and resolve divergence deliberately rather than overwriting work.

Verified updates

CLI self-updates verify the Ed25519 manifest, checksum, platform, distribution, and embedded binary identity.

(() => { "use strict"; const manifestURL = "/updates/latest.json"; const cloneCommand = "git clone https://dhd.bytelabs.work/git/dhd.git"; const platformLabels = { "linux/amd64": "Linux x86-64", "linux/arm64": "Linux ARM64", "darwin/amd64": "macOS Intel", "darwin/arm64": "macOS Apple Silicon", "windows/amd64": "Windows x86-64" }; const serverPill = document.getElementById("server-pill"); const serverStatus = document.getElementById("server-status"); const primaryDownload = document.getElementById("primary-download"); const primaryDownloadLabel = document.getElementById("primary-download-label"); const releaseNote = document.getElementById("release-note"); const releaseVersion = document.getElementById("release-version"); const releaseBuild = document.getElementById("release-build"); const manifestState = document.getElementById("manifest-state"); const downloadList = document.getElementById("download-list"); function formatBytes(bytes) { if (!Number.isFinite(bytes) || bytes < 0) return "Unknown size"; const units = ["B", "KB", "MB", "GB"]; let value = bytes; let unit = 0; while (value >= 1024 && unit < units.length - 1) { value /= 1024; unit += 1; } return `${value.toFixed(unit === 0 ? 0 : 1)} ${units[unit]}`; } function formatDate(value) { const date = new Date(value); if (Number.isNaN(date.getTime())) return value || "Unknown build date"; return new Intl.DateTimeFormat(undefined, { dateStyle: "medium", timeStyle: "short" }).format(date); } function platformKey(asset) { return `${asset.os}/${asset.arch}`; } function platformIcon(asset) { if (asset.os === "darwin") return "mac"; if (asset.os === "windows") return "win"; return asset.arch === "arm64" ? "arm" : "lnx"; } async function detectPlatform() { let os = ""; let arch = ""; const ua = navigator.userAgent.toLowerCase(); const platform = (navigator.userAgentData && navigator.userAgentData.platform ? navigator.userAgentData.platform : navigator.platform || "").toLowerCase(); if (platform.includes("win") || ua.includes("windows")) os = "windows"; else if (platform.includes("mac") || ua.includes("mac os")) os = "darwin"; else if (platform.includes("linux") || ua.includes("linux")) os = "linux"; if (navigator.userAgentData && navigator.userAgentData.getHighEntropyValues) { try { const hints = await navigator.userAgentData.getHighEntropyValues(["architecture", "bitness"]); if (hints.architecture === "arm") arch = "arm64"; if (hints.architecture === "x86" && hints.bitness === "64") arch = "amd64"; } catch (_) { // Fall back to conservative user-agent detection. } } if (!arch) { arch = /arm64|aarch64/.test(ua) ? "arm64" : "amd64"; } return os && arch ? `${os}/${arch}` : ""; } function validAsset(asset) { return asset && typeof asset.os === "string" && typeof asset.arch === "string" && typeof asset.name === "string" && typeof asset.url === "string" && typeof asset.sha256 === "string" && Number.isFinite(asset.size); } function assetURL(asset) { return new URL(asset.url, new URL(manifestURL, window.location.href)).href; } function createDownloadRow(asset, detectedPlatform) { const row = document.createElement("div"); row.className = "download-row"; const platform = document.createElement("div"); platform.className = "platform-name"; const icon = document.createElement("span"); icon.className = "platform-icon"; icon.textContent = platformIcon(asset); const label = document.createElement("span"); const key = platformKey(asset); label.textContent = platformLabels[key] || key; platform.append(icon, label); const meta = document.createElement("div"); meta.className = "asset-meta"; const name = document.createElement("strong"); name.textContent = `${asset.name} · ${formatBytes(asset.size)}`; const checksum = document.createElement("span"); checksum.textContent = `SHA-256 ${asset.sha256}`; checksum.title = asset.sha256; meta.append(name, checksum); const link = document.createElement("a"); link.className = "button download-link"; link.href = assetURL(asset); link.download = asset.name; link.textContent = key === detectedPlatform ? "Download for this device" : "Download"; row.append(platform, meta, link); return row; } function showPendingRelease(message) { primaryDownload.href = "#downloads"; primaryDownload.setAttribute("aria-disabled", "true"); primaryDownloadLabel.textContent = "Release not published"; releaseNote.textContent = message; releaseVersion.textContent = "Release channel pending"; releaseBuild.textContent = "No signed manifest is currently published."; manifestState.textContent = "Awaiting release"; manifestState.classList.remove("ready"); } async function loadRelease() { try { const response = await fetch(manifestURL, { cache: "no-store", headers: { "Accept": "application/json" } }); if (!response.ok) { showPendingRelease(response.status === 404 ? "The first offline-signed release is being prepared." : "The release channel is temporarily unavailable."); return; } const manifest = await response.json(); const assets = Array.isArray(manifest.assets) ? manifest.assets.filter(validAsset) : []; if (typeof manifest.version !== "string" || assets.length === 0) { throw new Error("Manifest has no downloadable assets"); } const detectedPlatform = await detectPlatform(); const preferred = assets.find((asset) => platformKey(asset) === detectedPlatform); downloadList.replaceChildren(...assets.map((asset) => createDownloadRow(asset, detectedPlatform))); releaseVersion.textContent = `DHD ${manifest.version}`; releaseBuild.textContent = `${manifest.distribution || "release"} · built ${formatDate(manifest.build_date)}`; manifestState.textContent = "Signed manifest online"; manifestState.classList.add("ready"); releaseNote.textContent = preferred ? `${platformLabels[detectedPlatform] || detectedPlatform} detected automatically.` : "Choose a supported platform below."; if (preferred) { primaryDownload.href = assetURL(preferred); primaryDownload.download = preferred.name; primaryDownload.removeAttribute("aria-disabled"); primaryDownloadLabel.textContent = `Download DHD ${manifest.version}`; } else { primaryDownload.href = "#downloads"; primaryDownload.removeAttribute("aria-disabled"); primaryDownloadLabel.textContent = `View DHD ${manifest.version} downloads`; } } catch (_) { showPendingRelease("Release metadata could not be read safely. Try again later."); } } async function checkHealth() { const started = performance.now(); try { const response = await fetch("/healthz", { cache: "no-store" }); const body = await response.text(); if (!response.ok || body.trim() !== "ok") throw new Error("Unexpected health response"); const latency = Math.max(1, Math.round(performance.now() - started)); serverPill.classList.remove("offline"); serverPill.classList.add("online"); serverStatus.textContent = `Server online · ${latency} ms`; } catch (_) { serverPill.classList.remove("online"); serverPill.classList.add("offline"); serverStatus.textContent = "Server unavailable"; } } async function copyText(text, label) { try { await navigator.clipboard.writeText(text); const previous = label.textContent; label.textContent = "Copied"; window.setTimeout(() => { label.textContent = previous; }, 1500); } catch (_) { window.prompt("Copy this command:", text); } } document.getElementById("copy-clone").addEventListener("click", () => copyText(cloneCommand, document.getElementById("copy-clone-label"))); document.getElementById("copy-command").addEventListener("click", () => copyText(cloneCommand, document.getElementById("copy-clone-label"))); primaryDownload.addEventListener("click", (event) => { if (primaryDownload.getAttribute("aria-disabled") === "true") event.preventDefault(); }); checkHealth(); loadRelease(); window.setInterval(checkHealth, 30000); })();