[object Object]

← back to Prestige Tip Cards

Prestige employee tip-QR cards: data-driven generator, 6 cards + print PDF

363181c2b0c8c928f7d95d231f626189d9bc5ffe · 2026-07-12 08:44:16 -0700 · Steve Abrams

Files touched

Diff

commit 363181c2b0c8c928f7d95d231f626189d9bc5ffe
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Sun Jul 12 08:44:16 2026 -0700

    Prestige employee tip-QR cards: data-driven generator, 6 cards + print PDF
---
 .gitignore             |   3 ++
 cards/andre.png        | Bin 0 -> 1821942 bytes
 cards/diego.png        | Bin 0 -> 1857474 bytes
 cards/kevin.png        | Bin 0 -> 1841676 bytes
 cards/luis.png         | Bin 0 -> 1861193 bytes
 cards/marco.png        | Bin 0 -> 1848876 bytes
 cards/sam.png          | Bin 0 -> 1825139 bytes
 employees.json         |  16 ++++++++++
 gen.mjs                |  80 +++++++++++++++++++++++++++++++++++++++++++++++++
 html/andre.html        |  39 ++++++++++++++++++++++++
 html/diego.html        |  39 ++++++++++++++++++++++++
 html/kevin.html        |  39 ++++++++++++++++++++++++
 html/luis.html         |  39 ++++++++++++++++++++++++
 html/marco.html        |  39 ++++++++++++++++++++++++
 html/sam.html          |  39 ++++++++++++++++++++++++
 prestige-tip-cards.pdf | Bin 0 -> 8875745 bytes
 print-sheet.html       |   7 +++++
 qr/andre.png           | Bin 0 -> 873 bytes
 qr/diego.png           | Bin 0 -> 876 bytes
 qr/kevin.png           | Bin 0 -> 881 bytes
 qr/luis.png            | Bin 0 -> 865 bytes
 qr/marco.png           | Bin 0 -> 884 bytes
 qr/sam.png             | Bin 0 -> 876 bytes
 23 files changed, 340 insertions(+)

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3c45938
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+node_modules/
+*.log
+.DS_Store
diff --git a/cards/andre.png b/cards/andre.png
new file mode 100644
index 0000000..3c760b3
Binary files /dev/null and b/cards/andre.png differ
diff --git a/cards/diego.png b/cards/diego.png
new file mode 100644
index 0000000..97135b8
Binary files /dev/null and b/cards/diego.png differ
diff --git a/cards/kevin.png b/cards/kevin.png
new file mode 100644
index 0000000..4c90965
Binary files /dev/null and b/cards/kevin.png differ
diff --git a/cards/luis.png b/cards/luis.png
new file mode 100644
index 0000000..fd0f9fd
Binary files /dev/null and b/cards/luis.png differ
diff --git a/cards/marco.png b/cards/marco.png
new file mode 100644
index 0000000..ddfc442
Binary files /dev/null and b/cards/marco.png differ
diff --git a/cards/sam.png b/cards/sam.png
new file mode 100644
index 0000000..09d5349
Binary files /dev/null and b/cards/sam.png differ
diff --git a/employees.json b/employees.json
new file mode 100644
index 0000000..fffca12
--- /dev/null
+++ b/employees.json
@@ -0,0 +1,16 @@
+{
+  "_note": "Replace tip_url with each employee's REAL tip destination (Venmo/CashApp/Stripe link, or a prestigecarwash.com/tip/<id> redirect you control). QR codes are regenerated from tip_url every build — they are live/scannable.",
+  "brand": {
+    "name": "Prestige Car Wash",
+    "region": "San Fernando Valley, CA",
+    "tagline": "First come, first served · 6 lines · no appointment"
+  },
+  "employees": [
+    { "id": "marco",  "name": "Marco R.",  "role": "Line Lead",              "tip_url": "https://prestigecarwash.com/tip/marco",  "accent": "#38bdf8" },
+    { "id": "diego",  "name": "Diego S.",  "role": "Hand-Wash Specialist",   "tip_url": "https://prestigecarwash.com/tip/diego",  "accent": "#34d399" },
+    { "id": "andre",  "name": "Andre T.",  "role": "Lead Detailer",          "tip_url": "https://prestigecarwash.com/tip/andre",  "accent": "#f5b301" },
+    { "id": "luis",   "name": "Luis M.",   "role": "Wash Technician",         "tip_url": "https://prestigecarwash.com/tip/luis",   "accent": "#a78bfa" },
+    { "id": "kevin",  "name": "Kevin P.",  "role": "Ceramic Coating Tech",    "tip_url": "https://prestigecarwash.com/tip/kevin",  "accent": "#fb7185" },
+    { "id": "sam",    "name": "Sam W.",    "role": "Interior Detailer",       "tip_url": "https://prestigecarwash.com/tip/sam",    "accent": "#22d3ee" }
+  ]
+}
diff --git a/gen.mjs b/gen.mjs
new file mode 100644
index 0000000..9296a04
--- /dev/null
+++ b/gen.mjs
@@ -0,0 +1,80 @@
+// Generates printable, scannable "Scan to tip me" cards — one per employee.
+// QR codes come from `qrencode` (offline, $0). Cards render via headless Chrome.
+import fs from 'node:fs';
+import path from 'node:path';
+import { execFileSync } from 'node:child_process';
+import { fileURLToPath } from 'node:url';
+
+const DIR = path.dirname(fileURLToPath(import.meta.url));
+const CHROME = '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome';
+const cfg = JSON.parse(fs.readFileSync(path.join(DIR, 'employees.json'), 'utf8'));
+
+const cardHtml = (e) => `<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, ${e.accent}22 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,${e.accent},#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid ${e.accent};
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:${e.accent}}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:${e.accent};text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> ${cfg.brand.name}</div>
+  <div class="region">${cfg.brand.region}</div>
+  <div class="who">
+    <div class="avatar">${e.name[0]}</div>
+    <div class="name">${e.name}</div>
+    <div class="role">${e.role}</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/${e.id}.png"></div>
+  <div class="handle">${e.tip_url.replace(/^https?:\/\//, '')}</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">${cfg.brand.tagline}</div>
+</body></html>`;
+
+// 1) QR codes (offline, scannable) — high error-correction, margin quiet-zone.
+for (const e of cfg.employees) {
+  execFileSync('qrencode', ['-o', path.join(DIR, 'qr', `${e.id}.png`), '-s', '14', '-m', '2', '-l', 'H', e.tip_url]);
+}
+console.log(`QR codes: ${cfg.employees.length}`);
+
+// 2) Card PNGs (one per employee) + a print PDF each.
+for (const e of cfg.employees) {
+  const htmlPath = path.join(DIR, 'html', `${e.id}.html`);
+  fs.writeFileSync(htmlPath, cardHtml(e));
+  execFileSync(CHROME, ['--headless=new', '--disable-gpu', '--force-device-scale-factor=2',
+    '--window-size=1000,1400', `--screenshot=${path.join(DIR, 'cards', e.id + '.png')}`,
+    'file://' + htmlPath], { stdio: 'ignore' });
+  console.log(`  card: ${e.id}`);
+}
+
+// 3) Combined print sheet (all cards, 2 per row) → single PDF.
+const sheet = `<!doctype html><meta charset=utf-8><style>
+  @page{size:letter;margin:0.4in}
+  body{margin:0;display:flex;flex-wrap:wrap;gap:0.3in;justify-content:center;
+    font-family:system-ui;background:#fff}
+  .c{width:3.2in;height:4.48in;page-break-inside:avoid}
+  .c img{width:100%;height:100%;object-fit:contain}
+</style><body>${cfg.employees.map((e) => `<div class="c"><img src="cards/${e.id}.png"></div>`).join('')}</body>`;
+const sheetPath = path.join(DIR, 'print-sheet.html');
+fs.writeFileSync(sheetPath, sheet);
+execFileSync(CHROME, ['--headless=new', '--disable-gpu', '--no-pdf-header-footer',
+  `--print-to-pdf=${path.join(DIR, 'prestige-tip-cards.pdf')}`, 'file://' + sheetPath], { stdio: 'ignore' });
+console.log('PDF: prestige-tip-cards.pdf');
diff --git a/html/andre.html b/html/andre.html
new file mode 100644
index 0000000..8624800
--- /dev/null
+++ b/html/andre.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #f5b30122 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#f5b301,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #f5b301;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#f5b301}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#f5b301;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">A</div>
+    <div class="name">Andre T.</div>
+    <div class="role">Lead Detailer</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/andre.png"></div>
+  <div class="handle">prestigecarwash.com/tip/andre</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/html/diego.html b/html/diego.html
new file mode 100644
index 0000000..29cdbda
--- /dev/null
+++ b/html/diego.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #34d39922 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#34d399,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #34d399;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#34d399}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#34d399;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">D</div>
+    <div class="name">Diego S.</div>
+    <div class="role">Hand-Wash Specialist</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/diego.png"></div>
+  <div class="handle">prestigecarwash.com/tip/diego</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/html/kevin.html b/html/kevin.html
new file mode 100644
index 0000000..51e4dce
--- /dev/null
+++ b/html/kevin.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #fb718522 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#fb7185,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #fb7185;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#fb7185}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#fb7185;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">K</div>
+    <div class="name">Kevin P.</div>
+    <div class="role">Ceramic Coating Tech</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/kevin.png"></div>
+  <div class="handle">prestigecarwash.com/tip/kevin</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/html/luis.html b/html/luis.html
new file mode 100644
index 0000000..5b969c5
--- /dev/null
+++ b/html/luis.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #a78bfa22 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#a78bfa,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #a78bfa;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#a78bfa}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#a78bfa;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">L</div>
+    <div class="name">Luis M.</div>
+    <div class="role">Wash Technician</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/luis.png"></div>
+  <div class="handle">prestigecarwash.com/tip/luis</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/html/marco.html b/html/marco.html
new file mode 100644
index 0000000..6aff8f5
--- /dev/null
+++ b/html/marco.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #38bdf822 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#38bdf8,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #38bdf8;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#38bdf8}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#38bdf8;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">M</div>
+    <div class="name">Marco R.</div>
+    <div class="role">Line Lead</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/marco.png"></div>
+  <div class="handle">prestigecarwash.com/tip/marco</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/html/sam.html b/html/sam.html
new file mode 100644
index 0000000..886a707
--- /dev/null
+++ b/html/sam.html
@@ -0,0 +1,39 @@
+<!doctype html><html><head><meta charset="utf-8"><style>
+  *{margin:0;box-sizing:border-box}
+  html,body{width:1000px;height:1400px}
+  body{font-family:Inter,"SF Pro Display",system-ui,-apple-system,sans-serif;
+    background:linear-gradient(165deg,#0b1728 0%,#0a1220 55%,#060c16 100%);color:#eaf2ff;
+    display:flex;flex-direction:column;align-items:center;padding:70px 64px;position:relative;overflow:hidden}
+  .glow{position:absolute;width:900px;height:900px;border-radius:50%;
+    background:radial-gradient(circle, #22d3ee22 0%, transparent 60%);top:-260px;right:-260px}
+  .brand{display:flex;align-items:center;gap:16px;font-weight:800;font-size:40px;letter-spacing:.5px}
+  .logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,#22d3ee,#2563eb);
+    display:flex;align-items:center;justify-content:center;font-size:34px}
+  .region{margin-top:8px;color:#8ea6c4;font-size:24px;letter-spacing:3px;text-transform:uppercase;font-weight:700}
+  .who{margin-top:54px;text-align:center}
+  .avatar{width:150px;height:150px;border-radius:50%;margin:0 auto 22px;
+    background:linear-gradient(135deg,#1c2c46,#0f1a2b);border:3px solid #22d3ee;
+    display:flex;align-items:center;justify-content:center;font-size:64px;font-weight:800;color:#22d3ee}
+  .name{font-size:66px;font-weight:900;line-height:1}
+  .role{margin-top:12px;font-size:32px;color:#b8c9e0;font-weight:600}
+  .scan{margin-top:40px;font-size:38px;font-weight:800;letter-spacing:2px;color:#22d3ee;text-transform:uppercase}
+  .qrbox{margin-top:26px;background:#fff;border-radius:28px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
+  .qrbox img{display:block;width:420px;height:420px;image-rendering:pixelated}
+  .handle{margin-top:26px;font-size:30px;color:#dbe7f6;font-weight:700}
+  .thanks{margin-top:10px;font-size:26px;color:#9fb3cd}
+  .foot{position:absolute;bottom:56px;left:0;right:0;text-align:center;color:#6f88a8;font-size:24px;font-weight:600;letter-spacing:1px}
+</style></head><body>
+  <div class="glow"></div>
+  <div class="brand"><span class="logo">🚗</span> Prestige Car Wash</div>
+  <div class="region">San Fernando Valley, CA</div>
+  <div class="who">
+    <div class="avatar">S</div>
+    <div class="name">Sam W.</div>
+    <div class="role">Interior Detailer</div>
+  </div>
+  <div class="scan">Scan to tip me</div>
+  <div class="qrbox"><img src="../qr/sam.png"></div>
+  <div class="handle">prestigecarwash.com/tip/sam</div>
+  <div class="thanks">Every tip goes straight to me — thank you! 🙏</div>
+  <div class="foot">First come, first served · 6 lines · no appointment</div>
+</body></html>
\ No newline at end of file
diff --git a/prestige-tip-cards.pdf b/prestige-tip-cards.pdf
new file mode 100644
index 0000000..d0287eb
Binary files /dev/null and b/prestige-tip-cards.pdf differ
diff --git a/print-sheet.html b/print-sheet.html
new file mode 100644
index 0000000..0baa8d4
--- /dev/null
+++ b/print-sheet.html
@@ -0,0 +1,7 @@
+<!doctype html><meta charset=utf-8><style>
+  @page{size:letter;margin:0.4in}
+  body{margin:0;display:flex;flex-wrap:wrap;gap:0.3in;justify-content:center;
+    font-family:system-ui;background:#fff}
+  .c{width:3.2in;height:4.48in;page-break-inside:avoid}
+  .c img{width:100%;height:100%;object-fit:contain}
+</style><body><div class="c"><img src="cards/marco.png"></div><div class="c"><img src="cards/diego.png"></div><div class="c"><img src="cards/andre.png"></div><div class="c"><img src="cards/luis.png"></div><div class="c"><img src="cards/kevin.png"></div><div class="c"><img src="cards/sam.png"></div></body>
\ No newline at end of file
diff --git a/qr/andre.png b/qr/andre.png
new file mode 100644
index 0000000..f854f78
Binary files /dev/null and b/qr/andre.png differ
diff --git a/qr/diego.png b/qr/diego.png
new file mode 100644
index 0000000..c35eadf
Binary files /dev/null and b/qr/diego.png differ
diff --git a/qr/kevin.png b/qr/kevin.png
new file mode 100644
index 0000000..b23742b
Binary files /dev/null and b/qr/kevin.png differ
diff --git a/qr/luis.png b/qr/luis.png
new file mode 100644
index 0000000..62d2151
Binary files /dev/null and b/qr/luis.png differ
diff --git a/qr/marco.png b/qr/marco.png
new file mode 100644
index 0000000..cfbf345
Binary files /dev/null and b/qr/marco.png differ
diff --git a/qr/sam.png b/qr/sam.png
new file mode 100644
index 0000000..73f22ab
Binary files /dev/null and b/qr/sam.png differ

(oldest)  ·  back to Prestige Tip Cards  ·  chore: gitignore .env*/generated artifacts (session close) 5f379bb →