Ark icon: Second's logo instead of the crossed-swords placeholder

The ⚔ was a U+2694 emoji stand-in. Swap in Second's actual mark
(second.tech logo: a triangle with an evenodd inner cutout) as two
format.js helpers — ARK_ICON (dark rounded-square app badge + white
mark, for card/section headers) and ARK_MARK (bare currentColor glyph,
for the history-row circle). Wired into the Ark settings card, the
boarding/withdrawal/exit history rows + detail section, and the
How-it-works Ark section; the gift source toggle drops the emoji for
plain 'Ark'. Verified the badge renders (18px, #00090C square, white
evenodd mark).

Co-Authored-By: Claude Fable 5 <[email protected]>

4 files changed, 19 insertions, 8 deletions

diff --git a/src/app.js b/src/app.js
index fa0fe90..d4cf928 100644
--- a/src/app.js
+++ b/src/app.js
@@ -18,6 +18,7 @@ import {
   shortTxid,
   timeAgo,
   SATS,
+  ARK_ICON,
 } from './format.js';
 
 const wallet = new Wallet();
@@ -510,7 +511,7 @@ function howItWorksScreen() {
       h('h3', {}, '⚡ ' + t('hiwLnTitle')),
       para('hiwLn1')),
     h('div', { class: 'card col', style: 'gap:14px' },
-      h('h3', {}, '⚔ ' + t('hiwArkTitle')),
+      h('h3', { class: 'row gap6', style: 'align-items:center' }, h('span', { html: ARK_ICON(18) }), t('hiwArkTitle')),
       para('hiwArk1'),
       para('hiwArk2'),
       para('hiwArk3')),
diff --git a/src/features/ark.js b/src/features/ark.js
index 961b1a0..db7debb 100644
--- a/src/features/ark.js
+++ b/src/features/ark.js
@@ -14,7 +14,7 @@ import { utxoId } from '../wallet.js';
 import { getNetwork, setNetwork, arkPresets, getArkProviderId, setArkProviderId, getArkCustom, setArkCustom, getArkConfig } from '../api.js';
 import { t } from '../i18n.js';
 import { qrSvg } from '../qr.js';
-import { shortAddr, shortTxid, timeAgo } from '../format.js';
+import { shortAddr, shortTxid, timeAgo, ARK_ICON, ARK_MARK } from '../format.js';
 
 // t?ark1… bech32m — an Ark address for this or another ASP.
 export function isArkAddress(a) { return /^t?ark1[a-z0-9]{20,}$/i.test((a || '').trim()); }
@@ -326,7 +326,7 @@ export function arkFeature(ctx) {
       render();
     };
     const head = [
-      h('h3', {}, '⚔ Ark'),
+      h('h3', { class: 'row gap6', style: 'align-items:center' }, h('span', { html: ARK_ICON(18) }), 'Ark'),
       h('p', { class: 'small muted', style: 'margin:0' }, t('arkDesc')),
       h('select', { onChange: (e) => applyProvider(e.target.value) },
         presets.map((p) => h('option', { value: p.id, selected: p.id === id }, p.label))),
@@ -1051,12 +1051,12 @@ export function arkFeature(ctx) {
       if (!ark || !ark.state) return null;
       if (tx.net < 0) {
         const a = ark.state.actions.find((x) => x.type === 'board' && x.fundingTxid === tx.txid);
-        return a ? { icon: '⚔', label: h('span', {}, t('arkBoardHistory')) } : null;
+        return a ? { icon: h('span', { html: ARK_MARK(16) }), label: h('span', {}, t('arkBoardHistory')) } : null;
       }
       const o = ark.state.actions.find((x) => x.type === 'offboard' && x.txid === tx.txid);
-      if (o) return { icon: '⚔', label: h('span', {}, t('arkOffboardHistory')) };
+      if (o) return { icon: h('span', { html: ARK_MARK(16) }), label: h('span', {}, t('arkOffboardHistory')) };
       const e = ark.state.actions.find((x) => x.type === 'exit' && x.claimTxid === tx.txid);
-      return e ? { icon: '⚔', label: h('span', {}, t('arkExitHistory')) } : null;
+      return e ? { icon: h('span', { html: ARK_MARK(16) }), label: h('span', {}, t('arkExitHistory')) } : null;
     },
     txDetailSection(tx) {
       if (!ark || !ark.state) return null;
@@ -1064,7 +1064,7 @@ export function arkFeature(ctx) {
       if (!a) return null;
       const done = a.step === 'done';
       return h('div', { class: 'summary col', style: 'gap:0' },
-        h('div', { style: 'font-weight:600;margin:12px 0 2px' }, '⚔ ' + t('arkBoardHistory')),
+        h('div', { class: 'row gap6', style: 'font-weight:600;margin:12px 0 2px;align-items:center' }, h('span', { html: ARK_ICON(16) }), t('arkBoardHistory')),
         h('div', { class: 'line' },
           h('span', { class: 'k' }, t('arkBalance')),
           h('span', { class: 'v' }, '+' + fmtAmount(a.amountSat - a.feeSat) + ' ' + unitLabel())),
diff --git a/src/format.js b/src/format.js
index 6191033..56f2b82 100644
--- a/src/format.js
+++ b/src/format.js
@@ -3,6 +3,16 @@
 
 export const SATS = 100_000_000;
 
+// The Ark mark — Second's logo (second.tech): a triangle with an inner cutout
+// (evenodd). ARK_MARK is the bare glyph in currentColor (sits inline like an
+// emoji, themes automatically); ARK_ICON is the app-badge treatment (dark
+// rounded square + white mark) for card headers.
+const ARK_PATH = 'M218.4 50.9c-8.4-14.5-29.4-14.5-37.7 0L20.9 327.6c-8.4 14.5 2.1 32.7 18.9 32.7h319.5c16.8 0 27.3-18.2 18.9-32.7L218.4 50.9ZM73.9 305.5c-5.1 9.1 3.7 19.7 13.5 16.4l134.8-45.3c6.8-2.3 9.8-10.2 6.2-16.5l-55.3-95.8c-4.4-7.6-15.4-7.6-19.7.1L73.9 305.5Z';
+export const ARK_MARK = (px = 16) =>
+  `<svg width="${px}" height="${px}" viewBox="0 0 400 400" style="display:inline-block;vertical-align:-2px"><path fill="currentColor" fill-rule="evenodd" d="${ARK_PATH}"/></svg>`;
+export const ARK_ICON = (px = 16) =>
+  `<svg width="${px}" height="${px}" viewBox="0 0 400 400" style="display:inline-block;vertical-align:-3px"><rect width="400" height="400" rx="92" fill="#00090C"/><path fill="#fff" fill-rule="evenodd" transform="translate(37 34) scale(0.82)" d="${ARK_PATH}"/></svg>`;
+
 export function btc(sats) {
   return (Number(sats) / SATS).toFixed(8);
 }
diff --git a/src/i18n.js b/src/i18n.js
index cfaf187..ea89e91 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -390,7 +390,7 @@ const STR = {
     arkRefreshBtn: 'Refresh / consolidate {n} coin(s)',
     arkOffboardBtn: 'Move {n} back on-chain',
     giftSourceChain: 'On-chain',
-    giftSourceArk: '⚔ Ark',
+    giftSourceArk: 'Ark',
     giftArkNote: 'Sent from your Ark balance — the link claims instantly, off-chain, with no fee.',
     giftArkOutstanding: '{n} unclaimed Ark gift(s)',
     giftArkRevoked: 'Gift swept back to your Ark balance.',