diff --git a/src/web/app.js b/src/web/app.js
index 280da80..a502db9 100644
--- a/src/web/app.js
+++ b/src/web/app.js
@@ -777,9 +777,11 @@ function WireframesTab({ items, selId, setSelId, current }) {
 								<h2>${selected.meta.title}</h2>
 								<div class="detail-id">${selected.meta.id} · ${selected.meta.entry} · updated ${fmtDate(selected.meta.updated)}</div>
 							</div>
-							<a class="frame-link" href=${selected.url} target="_blank" rel="noreferrer">Open</a>
+							<div class="wireframe-actions">
+								<a class="frame-link" href=${selected.url} target="_blank" rel="noreferrer">Open</a>
+								<${ShareButton} key=${selected.meta.id} kind="design" id=${selected.meta.id} current=${current} shared=${selected.shared} />
+							</div>
 						</div>
-						<div class="detail-actions"><${ShareButton} key=${selected.meta.id} kind="design" id=${selected.meta.id} current=${current} shared=${selected.shared} /></div>
 						<div class="wireframe-frame">
 							<iframe title=${selected.meta.title} src=${selected.url} loading="lazy" />
 						</div>
diff --git a/src/web/styles.css b/src/web/styles.css
index 397f114..e6fd447 100644
--- a/src/web/styles.css
+++ b/src/web/styles.css
@@ -1368,9 +1368,21 @@ select.control:focus {
 	display: flex;
 	align-items: flex-start;
 	justify-content: space-between;
-	gap: 16px;
+	flex-wrap: wrap;
+	gap: 12px 16px;
 	margin-bottom: 14px;
 }
+.wireframe-actions {
+	display: flex;
+	align-items: flex-start;
+	justify-content: flex-start;
+	flex-wrap: wrap;
+	gap: 8px;
+}
+.wireframe-actions .share-box.done,
+.wireframe-actions .share-box.error {
+	margin: 0;
+}
 .frame-link {
 	display: inline-flex;
 	align-items: center;