// apps2.jsx — Primeways customer app (Part 4) · iOS screens for homeowners/clients
(function () {
  const R = React, h = R.createElement;
  const { C, SURFACES } = window.PWKit;
  const { Media, Btn, Tag, Ico, Logo, Mark, AppHead, TabBar, AppScreen } = window;
  const { Stars, BeforeAfter } = window.SITE._shared;

  const TABS = [['home', 'Home'], ['spark', 'Visualiser'], ['clipboard', 'My Project'], ['msg', 'Messages'], ['dots', 'More']];
  const Dev = (active, head, body, bg) => h(IOSDevice, { width: 402, height: 874 }, h(AppScreen, { head, bg, tabbar: h(TabBar, { active, tabs: TABS }) }, h('div', { style: { padding: 16, display: 'flex', flexDirection: 'column', gap: 14, height: '100%', overflow: 'hidden' } }, body)));
  const Card = ({ title, action, children, pad = 14, style }) => h('div', { style: { background: '#fff', borderRadius: 16, border: `1px solid ${C.border}`, boxShadow: C.shadowSm, overflow: 'hidden', ...style } }, title && h('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '12px 14px 0' } }, h('span', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 13, textTransform: 'uppercase', color: C.ink900 } }, title), action), h('div', { style: { padding: pad } }, children));

  /* 1 · WELCOME */
  function Welcome() {
    const cta = [['spark', 'Plan Your Driveway', 'Upload a photo & preview surfaces', true], ['clipboard', 'Track My Project', 'See progress & next steps'], ['file', 'Request a Quote', 'Get a free, no-obligation price'], ['phone', 'Contact Primeways', 'Call, message or find us']];
    return h(IOSDevice, { width: 402, height: 874 }, h('div', { style: { height: '100%', display: 'flex', flexDirection: 'column', background: C.ink900 } },
      h('div', { style: { position: 'relative', height: 326, flexShrink: 0, ...SURFACES.tarmac.css } }, h('div', { style: { position: 'absolute', inset: 0, background: 'var(--overlay-brand)' } }),
        h('div', { style: { position: 'absolute', inset: 0, padding: '64px 22px 34px', display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
          h(Logo, { white: true, height: 30 }),
          h('div', null, h('div', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 12, letterSpacing: '0.12em', textTransform: 'uppercase', color: C.accent, marginBottom: 8 } }, 'Your driveway, your way'),
            h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontStyle: 'italic', fontSize: 32, lineHeight: 0.98, textTransform: 'uppercase', color: '#fff' } }, 'Design It. Track It. Love It.')))),
      h('div', { style: { flex: 1, background: '#fff', borderRadius: '24px 24px 0 0', marginTop: -22, padding: '30px 16px 24px', display: 'flex', flexDirection: 'column', gap: 12 } },
        cta.map((c, i) => h('div', { key: i, style: { display: 'flex', alignItems: 'center', gap: 14, background: c[3] ? C.blue600 : '#fff', backgroundImage: c[3] ? 'var(--overlay-brand)' : undefined, border: c[3] ? 'none' : `1px solid ${C.border}`, borderRadius: 16, padding: 16, boxShadow: c[3] ? '0 8px 22px rgba(31,42,80,0.28)' : C.shadowSm } },
          h('div', { style: { width: 46, height: 46, borderRadius: 12, background: c[3] ? 'rgba(255,255,255,0.18)' : C.blue50, display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 } }, h(Ico, { name: c[0], size: 23, color: c[3] ? '#fff' : C.blue })),
          h('div', { style: { flex: 1 } }, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 16, textTransform: 'uppercase', color: c[3] ? '#fff' : C.ink900 } }, c[1]), h('div', { style: { fontFamily: C.fontB, fontSize: 12.5, color: c[3] ? 'rgba(255,255,255,0.8)' : C.ink500 } }, c[2])),
          h(Ico, { name: 'chevR', size: 20, color: c[3] ? '#fff' : C.ink300 }))))));
  }

  /* 2 · VISUALISER (mobile) */
  function Visualiser() {
    return Dev('Visualiser', h(AppHead, { sub: 'Step 2 of 4', title: 'Design Your Drive', right: h(Ico, { name: 'refresh', size: 20, color: C.blue }) }),
      h(R.Fragment, null,
        h(Card, { pad: 12 }, h(BeforeAfter, { height: 180, pos: 48, after: 'resin', radius: 10 }), h('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 7, marginTop: 10, fontFamily: C.fontB, fontSize: 12, color: C.ink500 } }, h(Ico, { name: 'move', size: 14, color: C.blue }), 'Drag to compare')),
        h('div', null, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 12, textTransform: 'uppercase', color: C.ink600, marginBottom: 9 } }, 'Surface'),
          h('div', { style: { display: 'flex', gap: 9, overflow: 'hidden' } }, ['tarmac', 'block', 'resin', 'gravel', 'patio'].map((k) => h('div', { key: k, style: { textAlign: 'center' } }, h('div', { style: { width: 60, height: 48, borderRadius: 10, ...SURFACES[k].css, border: `3px solid ${k === 'resin' ? C.blue : 'transparent'}` } }), h('div', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 9.5, textTransform: 'uppercase', marginTop: 4, color: k === 'resin' ? C.blue : C.ink500 } }, SURFACES[k].label.split(' ')[0]))))),
        h('div', null, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 12, textTransform: 'uppercase', color: C.ink600, marginBottom: 9 } }, 'Finish'),
          h('div', { style: { display: 'flex', gap: 8, flexWrap: 'wrap' } }, ['Golden Quartz', 'Autumn Brown', 'Silver Grey'].map((f, i) => h('span', { key: f, style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 11.5, padding: '8px 13px', borderRadius: 99, color: i === 2 ? '#fff' : C.ink700, background: i === 2 ? C.blue : '#fff', border: `1.5px solid ${i === 2 ? C.blue : C.border}` } }, f)))),
        h('div', { style: { marginTop: 'auto', display: 'flex', gap: 10 } }, h(Btn, { variant: 'outline', icon: 'download' }, 'Save'), h(Btn, { variant: 'accent', iconR: 'arrow', style: { flex: 1, justifyContent: 'center' } }, 'Submit for Quote'))));
  }

  /* 3 · PLANNER QUIZ */
  function Quiz() {
    const opts = [['Smooth & modern', true], ['Patterned & traditional', false], ['Natural & rustic', false]];
    return Dev('Visualiser', h(AppHead, { sub: 'Question 1 of 6', title: 'Driveway Planner' }),
      h(R.Fragment, null,
        h('div', { style: { display: 'flex', gap: 5 } }, Array.from({ length: 6 }).map((_, i) => h('div', { key: i, style: { flex: 1, height: 5, borderRadius: 99, background: i < 1 ? C.blue : C.ink150 } }))),
        h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 22, lineHeight: 1.1, textTransform: 'uppercase', color: C.ink900, marginTop: 6 } }, 'What type of finish do you prefer?'),
        h('div', { style: { display: 'flex', flexDirection: 'column', gap: 11, marginTop: 4 } }, opts.map((o, i) => h('div', { key: i, style: { display: 'flex', alignItems: 'center', gap: 12, background: o[1] ? C.blue50 : '#fff', border: `2px solid ${o[1] ? C.blue : C.border}`, borderRadius: 14, padding: '16px 16px' } },
          h('div', { style: { width: 50, height: 40, borderRadius: 8, ...SURFACES[['resin', 'block', 'gravel'][i]].css, flexShrink: 0 } }),
          h('span', { style: { flex: 1, fontFamily: C.fontH, fontWeight: 700, fontSize: 15, color: C.ink900 } }, o[0]),
          h('span', { style: { width: 24, height: 24, borderRadius: 99, border: `2px solid ${o[1] ? C.blue : C.ink300}`, background: o[1] ? C.blue : '#fff', display: 'flex', alignItems: 'center', justifyContent: 'center' } }, o[1] && h(Ico, { name: 'check', size: 14, color: '#fff' }))))),
        h(Btn, { variant: 'primary', size: 'lg', iconR: 'arrow', style: { width: '100%', justifyContent: 'center', marginTop: 'auto' } }, 'Next Question')));
  }

  /* 4 · REQUEST QUOTE */
  function RequestQuote() {
    const F = (label, val) => h('div', null, h('div', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 10.5, textTransform: 'uppercase', color: C.ink500, marginBottom: 5 } }, label), h('div', { style: { fontFamily: C.fontB, fontSize: 13.5, color: val ? C.ink800 : C.ink400, background: '#fff', border: `1px solid ${val ? C.blue : C.ink300}`, borderRadius: 8, padding: '11px 13px' } }, val || 'Tap to enter'));
    return Dev('My Project', h(AppHead, { sub: 'Free · no obligation', title: 'Request a Quote' }),
      h(R.Fragment, null,
        h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 10 } }, F('Name', 'Karen Doyle'), F('Phone', '07911 552080'), h('div', { style: { gridColumn: '1 / -1' } }, F('Email', 'k.doyle@email.com')), F('Service', 'Resin bound'), F('Timeline', '1 month')),
        h(Card, { title: 'Photos', pad: 12 }, h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(4,1fr)', gap: 7 } }, ['old', 'old', 'old', null].map((k, i) => k ? h(Media, { key: i, surface: k, h: 56, radius: 8 }) : h('div', { key: i, style: { height: 56, borderRadius: 8, border: `2px dashed ${C.ink300}`, display: 'flex', alignItems: 'center', justifyContent: 'center' } }, h(Ico, { name: 'plus', size: 18, color: C.ink400 }))))),
        h('label', { style: { display: 'flex', alignItems: 'center', gap: 10, fontFamily: C.fontB, fontSize: 12.5, color: C.ink600 } }, h('span', { style: { width: 20, height: 20, borderRadius: 5, background: C.blue, display: 'flex', alignItems: 'center', justifyContent: 'center' } }, h(Ico, { name: 'check', size: 13, color: '#fff' })), 'I agree to be contacted about my quote'),
        h(Btn, { variant: 'accent', size: 'lg', iconR: 'send', style: { width: '100%', justifyContent: 'center', marginTop: 'auto' } }, 'Send to Primeways')));
  }

  /* 5 · MY PROJECT DASHBOARD */
  function MyProject() {
    return Dev('My Project', h(AppHead, { accent: true, sub: 'Resin driveway · 70m²', title: 'My Project', big: true, right: h(Ico, { name: 'phone', size: 22, color: '#fff' }) }),
      h(R.Fragment, null,
        h(Card, { pad: 0 }, h(BeforeAfter, { height: 130, pos: 50, after: 'resin', radius: 0 }), h('div', { style: { padding: 14 } }, h('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 6 } }, h('span', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 12, textTransform: 'uppercase', color: C.ink500 } }, 'Current stage'), h(Tag, { tone: 'brand' }, '5 of 9')), h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 19, textTransform: 'uppercase', color: C.ink900 } }, 'Deposit Received'), h('div', { style: { fontFamily: C.fontB, fontSize: 13, color: C.ink600, marginTop: 3 } }, 'Next: we\'ll confirm your start date'))),
        h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 10 } },
          h(Card, { pad: 13 }, h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } }, h(Ico, { name: 'calendar', size: 17, color: C.blue }), h('span', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 10.5, textTransform: 'uppercase', color: C.ink500 } }, 'Start date')), h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 17, color: C.ink900, marginTop: 5 } }, 'Mon 17 Jun')),
          h(Card, { pad: 13 }, h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } }, h(Ico, { name: 'pound', size: 17, color: C.success }), h('span', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 10.5, textTransform: 'uppercase', color: C.ink500 } }, 'Deposit')), h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 17, color: C.ink900, marginTop: 5 } }, 'Paid £1,631'))),
        h(Card, { title: 'Quick links', pad: 12 }, h('div', { style: { display: 'flex', flexDirection: 'column', gap: 2 } }, [['file', 'View quote & documents'], ['msg', 'Message the team'], ['image', 'Project photos']].map((l, i) => h('div', { key: i, style: { display: 'flex', alignItems: 'center', gap: 12, padding: '11px 4px', borderBottom: i < 2 ? `1px solid ${C.border}` : 'none' } }, h(Ico, { name: l[0], size: 18, color: C.blue }), h('span', { style: { flex: 1, fontFamily: C.fontH, fontWeight: 700, fontSize: 14, color: C.ink900 } }, l[1]), h(Ico, { name: 'chevR', size: 17, color: C.ink300 }))))),
        h(Btn, { variant: 'primary', size: 'lg', icon: 'phone', style: { width: '100%', justifyContent: 'center' } }, 'Contact Primeways')));
  }

  /* 6 · PROJECT TIMELINE */
  function Timeline() {
    const steps = [['Enquiry received', 'done', '2 Jun'], ['Site visit completed', 'done', '5 Jun'], ['Quote sent', 'done', '6 Jun'], ['Quote accepted', 'done', '8 Jun'], ['Deposit received', 'current', '9 Jun'], ['Work scheduled', 'todo', 'Mon 17 Jun'], ['Work in progress', 'todo', ''], ['Completed', 'todo', ''], ['Aftercare active', 'todo', '']];
    return Dev('My Project', h(AppHead, { sub: 'Resin driveway', title: 'Project Timeline' }),
      h('div', { style: { display: 'flex', flexDirection: 'column', overflow: 'hidden' } }, steps.map((s, i) => h('div', { key: i, style: { display: 'flex', gap: 14, paddingBottom: 14, position: 'relative' } },
        i < steps.length - 1 && h('div', { style: { position: 'absolute', left: 15, top: 30, bottom: 0, width: 2, background: s[1] === 'done' ? C.success : C.border } }),
        h('div', { style: { width: 32, height: 32, borderRadius: 99, background: s[1] === 'done' ? C.success : s[1] === 'current' ? C.blue : '#fff', border: s[1] === 'todo' ? `2px solid ${C.ink300}` : 'none', display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0, zIndex: 1 } }, s[1] === 'done' ? h(Ico, { name: 'check', size: 16, color: '#fff' }) : s[1] === 'current' ? h('div', { style: { width: 10, height: 10, borderRadius: 99, background: '#fff' } }) : null),
        h('div', { style: { flex: 1, paddingTop: 4 } }, h('div', { style: { display: 'flex', justifyContent: 'space-between' } }, h('span', { style: { fontFamily: C.fontH, fontWeight: s[1] === 'todo' ? 600 : 800, fontSize: 14.5, color: s[1] === 'todo' ? C.ink400 : C.ink900 } }, s[0]), s[2] && h('span', { style: { fontFamily: C.fontB, fontSize: 12, color: s[1] === 'current' ? C.blue : C.ink400 } }, s[2])), s[1] === 'current' && h('div', { style: { marginTop: 4 } }, h(Tag, { tone: 'brand' }, 'You are here')))))));
  }

  /* 7 · DOCUMENTS */
  function Documents() {
    const docs = [['file', 'Quote QUO-2026-118', 'PDF · £5,436', C.blue], ['pound', 'Deposit receipt', 'Xero ref INV-0412', C.success], ['shield', 'Terms & conditions', 'PDF', C.ink600], ['clipboard', 'Aftercare guide', 'Resin care', C.accent600], ['award', '12-month guarantee', 'Issued on completion', C.blue]];
    return Dev('My Project', h(AppHead, { sub: 'Everything in one place', title: 'Documents' }),
      h(R.Fragment, null,
        h(Card, { title: 'Project photos', pad: 12 }, h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(4,1fr)', gap: 7 } }, ['old', 'old', 'resin', 'resin'].map((k, i) => h(Media, { key: i, surface: k, h: 56, radius: 8, label: i < 2 ? 'Before' : 'Concept' })))),
        h('div', { style: { display: 'flex', flexDirection: 'column', gap: 9, overflow: 'hidden' } }, docs.map((d, i) => h('div', { key: i, style: { display: 'flex', alignItems: 'center', gap: 13, background: '#fff', border: `1px solid ${C.border}`, borderRadius: 14, padding: 13 } }, h('div', { style: { width: 40, height: 40, borderRadius: 10, background: C.ink50, display: 'flex', alignItems: 'center', justifyContent: 'center' } }, h(Ico, { name: d[0], size: 19, color: d[3] })), h('div', { style: { flex: 1 } }, h('div', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 14, color: C.ink900 } }, d[1]), h('div', { style: { fontFamily: C.fontB, fontSize: 11.5, color: C.ink500 } }, d[2])), h(Ico, { name: 'download', size: 18, color: C.ink400 }))))));
  }

  /* 8 · MESSAGES */
  function Messages() {
    const msgs = [['in', 'Hi Karen — your deposit\'s received, thank you! We\'ll confirm your start date shortly.', '9:02'], ['out', 'Brilliant, thanks! Roughly when?', '9:10'], ['in', 'Looking at Mon 17 June, 3 days. I\'ll send a prep checklist nearer the time. ☀️', '9:14'], ['note', 'Reminder: heavy rain forecast — we\'ll text if dates shift']];
    return Dev('Messages', h(AppHead, { left: h(Mark, { size: 36 }), sub: 'Primeways team', title: 'Messages', right: h(Ico, { name: 'phone', size: 21, color: C.blue }) }),
      h('div', { style: { display: 'flex', flexDirection: 'column', gap: 10, flex: 1, overflow: 'hidden' } },
        msgs.map((m, i) => m[0] === 'note' ? h('div', { key: i, style: { alignSelf: 'center', display: 'flex', alignItems: 'center', gap: 7, background: C.warning100, borderRadius: 99, padding: '7px 13px' } }, h(Ico, { name: 'rain', size: 13, color: C.warning }), h('span', { style: { fontFamily: C.fontB, fontSize: 11.5, color: C.ink700 } }, m[1])) :
          h('div', { key: i, style: { alignSelf: m[0] === 'out' ? 'flex-end' : 'flex-start', maxWidth: '80%' } }, h('div', { style: { background: m[0] === 'out' ? C.blue : '#fff', color: m[0] === 'out' ? '#fff' : C.ink800, border: m[0] === 'out' ? 'none' : `1px solid ${C.border}`, borderRadius: m[0] === 'out' ? '16px 16px 4px 16px' : '16px 16px 16px 4px', padding: '11px 14px', fontFamily: C.fontB, fontSize: 13.5, lineHeight: 1.45 } }, m[1]), h('div', { style: { fontFamily: C.fontB, fontSize: 10, color: C.ink400, textAlign: m[0] === 'out' ? 'right' : 'left', marginTop: 3 } }, m[2]))),
        h('div', { style: { marginTop: 'auto', display: 'flex', alignItems: 'center', gap: 10, background: '#fff', border: `1px solid ${C.border}`, borderRadius: 99, padding: '8px 8px 8px 16px' } }, h('span', { style: { flex: 1, fontFamily: C.fontB, fontSize: 13.5, color: C.ink400 } }, 'Ask a question…'), h('div', { style: { width: 36, height: 36, borderRadius: 99, background: C.blue, display: 'flex', alignItems: 'center', justifyContent: 'center' } }, h(Ico, { name: 'send', size: 17, color: '#fff' })))));
  }

  /* 9 · AFTERCARE HUB */
  function Aftercare() {
    const tips = [['clock', 'When can I park on it?', 'Keep vehicles off for 3 days while it cures'], ['sun', 'Cleaning', 'Rinse with a hose; mild detergent for marks'], ['shield', 'What to avoid', 'No turning wheels on the spot, no harsh chemicals'], ['refresh', 'Seasonal care', 'Clear leaves in autumn to prevent staining'], ['phone', 'When to contact us', 'Any settling, edges or drainage concerns']];
    return Dev('More', h(AppHead, { accent: true, sub: 'Your resin driveway', title: 'Aftercare Hub', big: true }),
      h(R.Fragment, null,
        h(Card, { style: { background: C.success100, border: 'none' }, pad: 14 }, h('div', { style: { display: 'flex', alignItems: 'center', gap: 12 } }, h(Ico, { name: 'award', size: 26, color: C.success }), h('div', null, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 14, color: C.ink900 } }, '12-month guarantee active'), h('div', { style: { fontFamily: C.fontB, fontSize: 12, color: C.ink600 } }, 'Covered until June 2027')))),
        h('div', { style: { display: 'flex', flexDirection: 'column', gap: 9, overflow: 'hidden' } }, tips.map((t, i) => h('div', { key: i, style: { display: 'flex', alignItems: 'center', gap: 13, background: '#fff', border: `1px solid ${C.border}`, borderRadius: 14, padding: 13 } }, h('div', { style: { width: 38, height: 38, borderRadius: 10, background: C.blue50, display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 } }, h(Ico, { name: t[0], size: 18, color: C.blue })), h('div', { style: { flex: 1 } }, h('div', { style: { fontFamily: C.fontH, fontWeight: 700, fontSize: 13.5, color: C.ink900 } }, t[1]), h('div', { style: { fontFamily: C.fontB, fontSize: 11.5, color: C.ink500, lineHeight: 1.35 } }, t[2])), h(Ico, { name: 'chevR', size: 16, color: C.ink300 }))))));
  }

  /* 10 · REVIEW & REFERRAL */
  function ReviewReferral() {
    return Dev('More', h(AppHead, { sub: 'Your driveway\'s finished!', title: 'Review & Refer' }),
      h(R.Fragment, null,
        h(Card, { pad: 0 }, h(Media, { surface: 'resin', h: 130, brand: true, overlay: 'bottom', caption: 'Looking great, Karen!' }), h('div', { style: { padding: 16, textAlign: 'center', display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 10 } }, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 17, textTransform: 'uppercase', color: C.ink900 } }, 'How did we do?'), h(Stars, { n: 5, size: 30 }), h('div', { style: { display: 'flex', gap: 9, width: '100%' } }, h(Btn, { variant: 'primary', icon: 'google', style: { flex: 1, justifyContent: 'center' } }, 'Google'), h(Btn, { variant: 'outline', icon: 'fb', style: { flex: 1, justifyContent: 'center' } }, 'Facebook')))),
        h(Card, { style: { background: C.blue600, border: 'none', backgroundImage: 'var(--overlay-brand)' }, pad: 16 }, h('div', { style: { display: 'flex', alignItems: 'center', gap: 13 } }, h('div', { style: { width: 46, height: 46, borderRadius: 12, background: 'rgba(255,255,255,0.18)', display: 'flex', alignItems: 'center', justifyContent: 'center' } }, h(Ico, { name: 'gift', size: 23, color: '#fff' })), h('div', { style: { flex: 1 } }, h('div', { style: { fontFamily: C.fontH, fontWeight: 800, fontSize: 15, textTransform: 'uppercase', color: '#fff' } }, 'Refer a friend'), h('div', { style: { fontFamily: C.fontB, fontSize: 12, color: 'rgba(255,255,255,0.8)' } }, 'They get a great drive, you get a thank-you')))),
        h('div', { style: { display: 'flex', gap: 10 } }, h(Btn, { variant: 'outline', icon: 'share', style: { flex: 1, minWidth: 0, padding: '13px 12px', justifyContent: 'center' } }, 'Share'), h(Btn, { variant: 'accent', icon: 'plus', style: { flex: 1, minWidth: 0, padding: '13px 12px', justifyContent: 'center' } }, 'Future Work'))));
  }

  window.APPS = Object.assign(window.APPS || {}, { cust: { Welcome, Visualiser, Quiz, RequestQuote, MyProject, Timeline, Documents, Messages, Aftercare, ReviewReferral } });
})();