@novacraft-engineering/mailbox 0.1.0

package/lib/emails/index.ts

@@ -0,0 +1,281 @@
+import { BRAND } from '../brand'
+/**
+ * Tiny email-template runtime.
+ *
+ * Each template lives as a real `.html` file under `./templates/` with
+ * Mustache-style `{{placeholder}}` variables. Files are read once at module
+ * load (server-only) and cached.
+ *
+ * Why this shape:
+ *  - Designers / non-engineers can edit raw HTML without touching TS.
+ *  - Inboxes only support inline CSS, so the templates keep their styles inline.
+ *  - No mustache/handlebars dependency — just a `replaceAll` loop. If you
+ *    ever outgrow it, drop in `mustache` or migrate to react-email.
+ */
+
+import { readFileSync } from 'node:fs'
+import path from 'node:path'
+
+export type EmailMode = 'project' | 'academy'
+export type EmailField = { label: string; value: string }
+
+const BRAND_URL = BRAND.websiteUrl
+const BRAND_HOST = BRAND.website
+
+// ── Template loading ───────────────────────────────────────────────────────
+const TEMPLATE_DIR = path.join(process.cwd(), 'lib/emails/templates')
+
+function loadTemplate(name: string): string {
+  return readFileSync(path.join(TEMPLATE_DIR, name), 'utf8')
+}
+
+// Read once at module init — cheap and avoids per-request disk hits.
+const TPL_NOTIFICATION = loadTemplate('notification.html')
+const TPL_AUTO_REPLY = loadTemplate('auto-reply.html')
+const TPL_FIELD_ROW = loadTemplate('field-row.html')
+const TPL_ACADEMY_FOLLOWUP = loadTemplate('academy-followup.html')
+const TPL_CONTACT_FOLLOWUP = loadTemplate('contact-followup.html')
+
+// ── Rendering primitives ───────────────────────────────────────────────────
+/** Escape user-provided values before interpolating into HTML. */
+export function escapeHtml(s: string): string {
+  return s
+    .replace(/&/g, '&')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+/**
+ * Replace every `{{key}}` in `tpl` with `vars[key]`.
+ * Values are inserted as-is — callers must escape any user-provided strings.
+ * (We intentionally don't auto-escape: row HTML is pre-rendered and needs to
+ * pass through untouched.)
+ */
+function render(tpl: string, vars: Record<string, string>): string {
+  return Object.entries(vars).reduce(
+    (acc, [k, v]) => acc.replaceAll(`{{${k}}}`, v),
+    tpl,
+  )
+}
+
+/** Render the field table by repeating the row template once per field. */
+function renderRows(
+  fields: EmailField[],
+  variant: 'notification' | 'reply',
+): string {
+  const labelBg = variant === 'notification' ? '#110A1F' : '#0A0613'
+  const valueBg = variant === 'notification' ? '#0A0613' : '#110A1F'
+  const labelWidth = variant === 'notification' ? '160' : '140'
+
+  return fields
+    .map((f) =>
+      render(TPL_FIELD_ROW, {
+        labelBg,
+        valueBg,
+        labelWidth,
+        label: escapeHtml(f.label || 'Field'),
+        value: escapeHtml(f.value || '—'),
+      }),
+    )
+    .join('')
+}
+
+// ── Public API ─────────────────────────────────────────────────────────────
+export function renderNotificationEmail(
+  mode: EmailMode,
+  fields: EmailField[],
+): string {
+  return render(TPL_NOTIFICATION, {
+    title:
+      mode === 'academy' ? 'New Academy Registration' : 'New Project Inquiry',
+    host: BRAND_HOST,
+    date: new Date().toUTCString(),
+    rows: renderRows(fields, 'notification'),
+  })
+}
+
+export function notificationSubject(mode: EmailMode, email: string): string {
+  return mode === 'academy'
+    ? `Academy registration — ${email}`
+    : `Project inquiry — ${email}`
+}
+
+export function renderAutoReplyEmail(
+  mode: EmailMode,
+  fields: EmailField[],
+): string {
+  const isAcademy = mode === 'academy'
+  return render(TPL_AUTO_REPLY, {
+    headline: isAcademy ? 'Your spot is reserved.' : 'We got your brief.',
+    kicker: isAcademy ? 'Academy' : 'Studio',
+    lead: isAcademy
+      ? `Thanks for registering for ${BRAND.name} Academy. A human on our team will reach out within 24 hours with cohort details and payment info.`
+      : "Thanks for reaching out. A human on our team will read this and reply within 8 business hours (Mon–Fri). The average response time is 1 hour. If we need anything else to scope your project, we'll ask.",
+    rows: renderRows(fields, 'reply'),
+    brandUrl: BRAND_URL,
+    brandHost: BRAND_HOST,
+  })
+}
+
+export function autoReplySubject(mode: EmailMode): string {
+  return mode === 'academy'
+    ? `Your ${BRAND.name} Academy registration — we've got it`
+    : `We got your project brief — ${BRAND.name}`
+}
+
+// ── Academy follow-up (sent manually via dev backdoor) ──────────────────────
+export type AcademyFollowupVars = {
+  firstName: string
+  courses: string
+  cohortDate: string
+  headline?: string
+  introText?: string
+  cohortBoxTitle?: string
+  cohortDateQuestion?: string
+  connectLead?: string
+  connectBullet1?: string
+  connectBullet2?: string
+  connectBullet3?: string
+  quickStartTitle?: string
+  quickStartText?: string
+  quickStartBullet1?: string
+  quickStartBullet2?: string
+  closingText?: string
+  signatureName?: string
+  signatureRole?: string
+  logoUrl?: string
+}
+
+export function renderAcademyFollowupEmail(vars: AcademyFollowupVars): string {
+  return render(TPL_ACADEMY_FOLLOWUP, {
+    logoUrl: vars.logoUrl ?? BRAND.logoUrl,
+    headline: escapeHtml(vars.headline ?? 'Your cohort details are here.'),
+    firstName: escapeHtml(vars.firstName),
+    introText: escapeHtml(
+      vars.introText ??
+        `Thanks again for registering for ${BRAND.name} Academy. You're confirmed for ${vars.courses}.`,
+    ),
+    courses: escapeHtml(vars.courses),
+    cohortDate: escapeHtml(vars.cohortDate),
+    cohortBoxTitle: escapeHtml(vars.cohortBoxTitle ?? 'Next Cohort'),
+    cohortDateQuestion: escapeHtml(
+      vars.cohortDateQuestion ??
+        'Does this date work for you, or would you prefer a later cohort? Just reply and let us know.',
+    ),
+    connectLead: escapeHtml(
+      vars.connectLead ??
+        "If you can send your phone number also via email, we'd love to connect on WhatsApp or a quick call so we can:",
+    ),
+    connectBullet1: escapeHtml(vars.connectBullet1 ?? 'Walk you through the curriculum'),
+    connectBullet2: escapeHtml(vars.connectBullet2 ?? 'Confirm payment details'),
+    connectBullet3: escapeHtml(
+      vars.connectBullet3 ?? "Make sure we're both on the same page before day one",
+    ),
+    quickStartTitle: escapeHtml(vars.quickStartTitle ?? 'Quick Start (Email Only)'),
+    quickStartText: escapeHtml(
+      vars.quickStartText ??
+        'If you already know you want in and would rather handle everything over email, just reply here with:',
+    ),
+    quickStartBullet1: escapeHtml(
+      vars.quickStartBullet1 ??
+        `Confirmation that you're good for ${vars.cohortDate}, or reply with your preferred month and we will send you payment details to get started.`,
+    ),
+    closingText: escapeHtml(vars.closingText ?? "We'd love to hear from you."),
+    signatureName: escapeHtml(vars.signatureName ?? 'Joseph'),
+    signatureRole: escapeHtml(vars.signatureRole ?? `${BRAND.name} Academy`),
+    brandUrl: BRAND_URL,
+    brandHost: BRAND_HOST,
+  })
+}
+
+export function academyFollowupSubject(courses: string): string {
+  return `${BRAND.name} Academy — your cohort details · ${courses}`
+}
+
+// ── Contact follow-up (sent manually via dev backdoor) ─────────────────────
+export type ContactFollowupVars = {
+  firstName: string
+  projectType: string
+  headline?: string
+  introText?: string
+  scopeLead?: string
+  detailsLead?: string
+  detailBullet1?: string
+  detailBullet2?: string
+  detailBullet3?: string
+  includeAcademy?: string
+  academyHeadline?: string
+  academyText?: string
+  academyBullet1?: string
+  academyBullet2?: string
+  academyCta?: string
+  closingText?: string
+  signatureName?: string
+  signatureRole?: string
+  logoUrl?: string
+}
+
+function renderAcademySection(vars: ContactFollowupVars): string {
+  if (vars.includeAcademy !== 'true') return ''
+  return `
+      <div style="background:#110A1F;border:1px solid #2C1F4A;border-radius:12px;padding:20px 24px;margin:0 0 24px">
+        <div style="font:600 11px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px">
+          ${escapeHtml(vars.academyHeadline ?? `${BRAND.name} Academy`)}
+        </div>
+        <p style="font:400 14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 12px">
+          ${escapeHtml(vars.academyText ?? 'Interested in levelling up your skills while we scope your project? You can register for an upcoming cohort.')}
+        </p>
+        <ul style="font:400 14px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 12px;padding-left:20px">
+          <li>${escapeHtml(vars.academyBullet1 ?? 'Graphic Design — UI/UX, brand systems, motion')}</li>
+          <li>${escapeHtml(vars.academyBullet2 ?? 'Programming — full-stack web & mobile development')}</li>
+        </ul>
+        <p style="font:400 14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0">
+          ${escapeHtml(vars.academyCta ?? 'Just reply to this email with the course you want and we will send you the next cohort dates and payment details.')}
+        </p>
+      </div>`
+}
+
+export function renderContactFollowupEmail(vars: ContactFollowupVars): string {
+  return render(TPL_CONTACT_FOLLOWUP, {
+    logoUrl: vars.logoUrl ?? BRAND.logoUrl,
+    headline: escapeHtml(vars.headline ?? 'A few quick questions about your project.'),
+    firstName: escapeHtml(vars.firstName),
+    introText: escapeHtml(
+      vars.introText ??
+        "Thanks for reaching out. We're excited about what you're building and want to make sure we scope this properly from day one. To move fast, could you clarify a few things?",
+    ),
+    projectType: escapeHtml(vars.projectType),
+    scopeLead: escapeHtml(
+      vars.scopeLead ??
+        "We want to understand your product, your users, and your timeline so we can propose the right team and approach.",
+    ),
+    detailsLead: escapeHtml(
+      vars.detailsLead ??
+        "Here is what would help us most right now:",
+    ),
+    detailBullet1: escapeHtml(
+      vars.detailBullet1 ?? 'What problem are you solving, and who is the primary user?',
+    ),
+    detailBullet2: escapeHtml(
+      vars.detailBullet2 ?? 'Do you have existing designs, wireframes, or a product brief we can review?',
+    ),
+    detailBullet3: escapeHtml(
+      vars.detailBullet3 ?? 'What does success look like in 90 days? Launch, revenue, user count?',
+    ),
+    academySection: renderAcademySection(vars),
+    closingText: escapeHtml(
+      vars.closingText ??
+        "Reply here with as much or as little as you have — we will take it from there.",
+    ),
+    signatureName: escapeHtml(vars.signatureName ?? `The ${BRAND.name} team`),
+    signatureRole: escapeHtml(vars.signatureRole ?? 'Engineering Studio'),
+    brandUrl: BRAND_URL,
+    brandHost: BRAND_HOST,
+  })
+}
+
+export function contactFollowupSubject(projectType: string): string {
+  return `Re: your project — ${projectType} · ${BRAND.name}`
+}

package/lib/emails/templates/academy-followup.html

@@ -0,0 +1,68 @@
+<!doctype html>
+<html>
+  <body style="margin:0;background:#050309;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif">
+    <div style="max-width:600px;margin:0 auto;padding:36px 24px">
+      <img src="{{logoUrl}}" alt="Podzyme" width="42" height="48" style="display:block;margin-bottom:18px" />
+      <div style="font:700 24px/1.2 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 8px">
+        {{headline}}
+      </div>
+      <div style="font:500 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 22px">
+        Podzyme · Academy
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        Hi {{firstName}},
+      </p>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        {{introText}}
+      </p>
+
+      <div style="background:#110A1F;border:1px solid #2C1F4A;border-radius:12px;padding:20px 24px;margin:0 0 24px">
+        <div style="font:600 11px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px">
+          {{cohortBoxTitle}}
+        </div>
+        <div style="font:700 20px/1.3 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 8px">
+          {{cohortDate}}
+        </div>
+        <p style="font:400 14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0">
+          {{cohortDateQuestion}}
+        </p>
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 16px">
+        {{connectLead}}
+      </p>
+      <ul style="font:400 14px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px;padding-left:20px">
+        <li>{{connectBullet1}}</li>
+        <li>{{connectBullet2}}</li>
+        <li>{{connectBullet3}}</li>
+      </ul>
+
+      <div style="background:#110A1F;border:1px solid #2C1F4A;border-radius:12px;padding:20px 24px;margin:0 0 24px">
+        <div style="font:600 11px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px">
+          {{quickStartTitle}}
+        </div>
+        <p style="font:400 14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 12px">
+          {{quickStartText}}
+        </p>
+        <ul style="font:400 14px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0;padding-left:20px">
+          <li>{{quickStartBullet1}}</li>
+        </ul>
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        {{closingText}}
+      </p>
+
+      <p style="font:400 13px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#8E84A8;margin:24px 0 0">
+        — {{signatureName}}<br>
+        {{signatureRole}}
+      </p>
+      <p style="font:400 12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#5A5170;margin:18px 0 0">
+        <a href="{{brandUrl}}" style="color:#A578FF;text-decoration:none">{{brandHost}}</a>
+      </p>
+
+    </div>
+  </body>
+</html>

package/lib/emails/templates/auto-reply.html

@@ -0,0 +1,33 @@
+<!doctype html>
+<html>
+  <body style="margin:0;background:#050309;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif">
+    <div style="max-width:600px;margin:0 auto;padding:36px 24px">
+      <div style="display:inline-block;width:42px;height:48px;background:linear-gradient(135deg,#6B25E0,#EE3F88);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);margin-bottom:18px"></div>
+      <div style="font:700 24px/1.2 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 8px">
+        {{headline}}
+      </div>
+      <div style="font:500 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 22px">
+        Podzyme · {{kicker}}
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        {{lead}}
+      </p>
+
+      <div style="font:600 11px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px">
+        Your submission
+      </div>
+      <table style="width:100%;border-collapse:collapse;border:1px solid #2C1F4A;border-radius:10px;overflow:hidden">
+        {{rows}}
+      </table>
+
+      <p style="font:400 13px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#8E84A8;margin:24px 0 0">
+        Need to update something? Just reply to this email — we'll see it.
+      </p>
+      <p style="font:400 12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#5A5170;margin:18px 0 0">
+        — The Podzyme team · <a href="{{brandUrl}}" style="color:#A578FF;text-decoration:none">{{brandHost}}</a>
+      </p>
+
+    </div>
+  </body>
+</html>

package/lib/emails/templates/contact-followup.html

@@ -0,0 +1,58 @@
+<!doctype html>
+<html>
+  <body style="margin:0;background:#050309;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif">
+    <div style="max-width:600px;margin:0 auto;padding:36px 24px">
+      <img src="{{logoUrl}}" alt="Podzyme" width="42" height="48" style="display:block;margin-bottom:18px" />
+      <div style="font:700 24px/1.2 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 8px">
+        {{headline}}
+      </div>
+      <div style="font:500 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 22px">
+        Podzyme · Studio
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        Hi {{firstName}},
+      </p>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        {{introText}}
+      </p>
+
+      <div style="background:#110A1F;border:1px solid #2C1F4A;border-radius:12px;padding:20px 24px;margin:0 0 24px">
+        <div style="font:600 11px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px">
+          What we're thinking
+        </div>
+        <div style="font:700 20px/1.3 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 8px">
+          {{projectType}}
+        </div>
+        <p style="font:400 14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0">
+          {{scopeLead}}
+        </p>
+      </div>
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 16px">
+        {{detailsLead}}
+      </p>
+      <ul style="font:400 14px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px;padding-left:20px">
+        <li>{{detailBullet1}}</li>
+        <li>{{detailBullet2}}</li>
+        <li>{{detailBullet3}}</li>
+      </ul>
+
+      {{academySection}}
+
+      <p style="font:400 15px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#C8BFD9;margin:0 0 24px">
+        {{closingText}}
+      </p>
+
+      <p style="font:400 13px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#8E84A8;margin:24px 0 0">
+        — {{signatureName}}<br>
+        {{signatureRole}}
+      </p>
+      <p style="font:400 12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#5A5170;margin:18px 0 0">
+        <a href="{{brandUrl}}" style="color:#A578FF;text-decoration:none">{{brandHost}}</a>
+      </p>
+
+    </div>
+  </body>
+</html>

package/lib/emails/templates/field-row.html

@@ -0,0 +1,4 @@
+<tr>
+  <td style="padding:10px 14px;background:{{labelBg}};color:#8E84A8;font:600 12px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid #2C1F4A;vertical-align:top;width:{{labelWidth}}px">{{label}}</td>
+  <td style="padding:10px 14px;background:{{valueBg}};color:#F5F2FA;font:400 14px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;border-bottom:1px solid #2C1F4A;white-space:pre-wrap">{{value}}</td>
+</tr>

package/lib/emails/templates/notification.html

@@ -0,0 +1,23 @@
+<!doctype html>
+<html>
+  <body style="margin:0;background:#050309;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif">
+    <div style="max-width:600px;margin:0 auto;padding:32px 24px">
+
+      <div style="font:700 22px/1.2 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#F5F2FA;margin:0 0 6px">
+        {{title}}
+      </div>
+      <div style="font:500 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#A578FF;letter-spacing:.18em;text-transform:uppercase;margin:0 0 28px">
+        Podzyme · Inbox
+      </div>
+
+      <table style="width:100%;border-collapse:collapse;border:1px solid #2C1F4A;border-radius:10px;overflow:hidden">
+        {{rows}}
+      </table>
+
+      <p style="font:400 12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#5A5170;margin:24px 0 0">
+        Sent from {{host}} · {{date}}
+      </p>
+
+    </div>
+  </body>
+</html>

package/lib/fonts.ts

@@ -0,0 +1,23 @@
+export type CustomFont = { name: string; url: string }
+
+export const BUILTIN_FONTS = ['Arial', 'Georgia', 'Times New Roman', 'Verdana', 'Tahoma', 'Trebuchet MS', 'Calibri', 'Courier New']
+
+const FORMATS: Record<string, string> = { woff2: 'woff2', woff: 'woff', ttf: 'truetype', otf: 'opentype' }
+
+export function fontFaceCss(fonts: CustomFont[], origin = ''): string {
+  return fonts
+    .filter(font => font.url)
+    .map(font => {
+      const extension = font.url.split('.').pop()?.toLowerCase() ?? ''
+      const format = FORMATS[extension] ? ` format('${FORMATS[extension]}')` : ''
+      return `@font-face{font-family:'${font.name.replace(/'/g, '')}';src:url('${origin}${font.url}')${format};font-display:swap;}`
+    })
+    .join('')
+}
+
+export const FONT_SIZES = ['10px', '11px', '12px', '13px', '14px', '15px', '16px', '18px', '20px', '24px', '28px', '32px']
+
+export type BaseFont = { family: string; size: string }
+export const EMPTY_FONT: BaseFont = { family: '', size: '' }
+
+export const fontStack = (family: string) => (family ? `'${family.replace(/'/g, '')}',Arial,Helvetica,sans-serif` : 'Arial,Helvetica,sans-serif')

package/lib/link-safety.ts

@@ -0,0 +1,81 @@
+export type LinkVerdict = 'safe' | 'suspicious' | 'dangerous' | 'unknown'
+
+export type LinkFinding = {
+  url: string
+  verdict: LinkVerdict
+  reasons: string[]
+}
+
+const URL_RE = /\b(?:https?:\/\/|www\.)[^\s<>"'()]+[^\s<>"'().,;:!?]/gi
+
+// Free hosts and shorteners that hide the real destination.
+const SHORTENERS = new Set([
+  'bit.ly', 'tinyurl.com', 't.co', 'goo.gl', 'ow.ly', 'is.gd', 'buff.ly', 'rebrand.ly',
+  'cutt.ly', 'shorturl.at', 'rb.gy', 'tiny.cc', 'lnkd.in', 'bit.do', 't.ly',
+])
+
+// TLDs disproportionately used for throwaway phishing domains.
+const RISKY_TLDS = new Set(['zip', 'mov', 'tk', 'ml', 'ga', 'cf', 'gq', 'top', 'xyz', 'click', 'link', 'work', 'country', 'kim'])
+
+export function extractUrls(text: string): string[] {
+  const found = text.match(URL_RE) ?? []
+  return Array.from(new Set(found.map(entry => (entry.startsWith('www.') ? `https://${entry}` : entry))))
+}
+
+export function normalizeUrl(raw: string): string {
+  return raw.startsWith('www.') ? `https://${raw}` : raw
+}
+
+/** Offline checks — catch the common email-phishing shapes with no network call. */
+export function inspectUrl(raw: string, anchorText?: string): LinkFinding {
+  const url = normalizeUrl(raw.trim())
+  const reasons: string[] = []
+  let parsed: URL
+  try {
+    parsed = new URL(url)
+  } catch {
+    return { url, verdict: 'unknown', reasons: ['Malformed URL'] }
+  }
+
+  const host = parsed.hostname.toLowerCase()
+
+  if (parsed.protocol === 'http:') reasons.push('Unencrypted connection (http)')
+  if (parsed.username || parsed.password) reasons.push('Credentials embedded in the URL')
+  if (/^\d{1,3}(\.\d{1,3}){3}$/.test(host)) reasons.push('Raw IP address instead of a domain')
+  if (host.startsWith('xn--') || host.includes('.xn--')) reasons.push('Punycode domain — may impersonate another brand')
+  if (SHORTENERS.has(host)) reasons.push('Shortened link — real destination is hidden')
+
+  const tld = host.split('.').pop() ?? ''
+  if (RISKY_TLDS.has(tld)) reasons.push(`High-risk domain ending (.${tld})`)
+  if (host.split('.').length > 4) reasons.push('Unusually deep subdomain chain')
+  if (parsed.href.length > 300) reasons.push('Excessively long URL')
+
+  // The strongest email-phishing signal: the visible text claims one destination,
+  // the href points somewhere else.
+  if (anchorText) {
+    const claimed = anchorText.match(/\b(?:https?:\/\/)?((?:[\w-]+\.)+[a-z]{2,})\b/i)?.[1]?.toLowerCase()
+    if (claimed) {
+      const claimedRoot = claimed.split('.').slice(-2).join('.')
+      const actualRoot = host.split('.').slice(-2).join('.')
+      if (claimedRoot !== actualRoot) {
+        reasons.push(`Link text says "${claimedRoot}" but points to ${actualRoot}`)
+      }
+    }
+  }
+
+  const severe = reasons.some(
+    reason =>
+      reason.startsWith('Link text says') ||
+      reason.startsWith('Credentials') ||
+      reason.startsWith('Raw IP') ||
+      reason.startsWith('Punycode'),
+  )
+  if (severe) return { url, verdict: 'dangerous', reasons }
+  if (reasons.length) return { url, verdict: 'suspicious', reasons }
+  return { url, verdict: 'safe', reasons }
+}
+
+export function mergeVerdict(local: LinkVerdict, remote: LinkVerdict): LinkVerdict {
+  const rank: Record<LinkVerdict, number> = { safe: 0, unknown: 1, suspicious: 2, dangerous: 3 }
+  return rank[remote] >= rank[local] ? remote : local
+}